Kevin Li

For the 2020 US general elections, ABC News needed a variety of interactive features to show results in real-time for the Presidential, Senate, House, and gubernatorial races. I was a lead frontend developer in this effort and was involved in developing a variety of web functionality, including animated tables and integration with proprietary data systems.

Of particular note was a number of custom interactive maps that were built on D3. These maps featured zoom and pan (slippy map) functionality with dynamic state and county-level data and live result updates. In addition, I developed a variant supporting user-generated content, which could even render server-side to generate customized Open Graph thumbnails for sharing on social media.

BocceSim was a custom-developed bocce tournament simulation. It was presented as an eight-team, three-round single elimination tournament that was streamed over the course of three weeks on Twitch as a linear experience. Simulated athletes were procedurally generated prior to the tournament and assigned teams via an automated snake draft.

Viewers could create their own bracket predictions using published athlete statistics on an accompanying web site. Each athlete's actions within the game were statistically driven based on these values.

The simulation was largely automated, including broadcast presentation elements. At the conclusion of each game, an automated play-by-play recap was published on the accompanying web site.

USAspending.gov is the US government's official public web site for viewing federal spending data. It features a variety of data visualizations and complex search/filtering functionality.

The DATA Act Broker is an internal web tool that government agencies use to upload, validate, and review financial data to USAspending.gov.

I was the lead frontend developer on both sites, which were developed as part of the government's implementation of the DATA Act.

Casterbridge is a political simulation game inspired by The Economist's Democracy Index methodology. You are the mayor of a small town, with the power to accept or veto local ordinances. The game procedurally generates an electorate with varying attitudes toward authoritarianism. Your goal is to remain in office as long as possible by determining and appealing to the electorate's preferences (by polling citizens), balancing the town budget, and resisting an oppressive federal government - all while improving the town's Democracy Index value.

This game was developed in a two-week period as part of a game jam. It was exhibited at Altcade in Portland, OR in June 2017.

Potato is a web app for collaborative real-time diagramming. Users are connected to each other over a peer-to-peer WebRTC mesh network, eliminating the need for a centralized content server (though a server exists for fallback TURN NAT traversal). Firebase and its WebSocket SDK are used to handle WebRTC signaling.

Virtual Tennis is an Alexa game for the Amazon Echo. It was developed as a thought experiment to explore what it would be like to adapt a visual game (Pong) to an entirely inappropriate platform. The game uses data models to simulate Pong-style physics in a constrained 192-pixel by 160-pixel environment (the Atari 2600's resolution) and presents it as a turn-based interactive audio experience, complete with sound effects.

This game is available to the public on the Alexa Skills store in the US.

Runaway Train Simulator is a Google Cardboard virtual reality game set onboard a train shortly after its brakes have failed. You must help the train engineer fix the brakes by providing him with the requested tools and keeping the brake pressure in check. This game extends Google Cardboard's stationary VR format by utilizing the smartphone's accelerometer sensor to detect when the player is performing a "walking in place" action and translating that into forward movement within the virtual environment.

SantiaGO is location-based mobile web game for iOS and Android. The game is a parody of Pokémon Go and also satirizes the rapidly decreasing value of the word "innovation." Players walk around to physical locations collecting buzzwords that can be combined into "skills" of various values. Players with enough skills can battle other players to move up the ranks.

The game is presented as a mobile web app - featuring custom 3D WebGL maps and a React-based UI layer - to avoid the battery drain incurred by Pokémon Go. 3D maps are parsed and drawn using OpenStreetMap data on the fly using a Unity library that I ported to ES6 JavaScript.

State of the Union Bingo was a web game developed for CNN's 2015 State of the Union coverage. The game randomly generates a bingo card of possible topics that could be covered in the speech. Viewers could play along during the State of the Union for a chance to win a personalized video message from Wolf Blitzer.

I developed the initial prototype of the game, which was handed off to CNN's in-house Digital Interactive team for visual design and final development.

Smart Helment was prototype of a sensorized, Bluetooth-enabled ice hockey helmet. Head impacts were monitored by a HealthKit-enabled iOS app. Real-time impact status was visible to individual players using a custom Pebble smartwatch app. A web dashboard provided coaching staff with team-wide data.