Tokyo Built a Stupidly Good Coronavirus Website, and It's Open Source

A few days ago I went through a familiar cycle of “damn, I wish I could do something useful”, to “oh hey, I’m a programmer, maybe that’s useful”, and finally “well all my ideas have already been built by people smarter than me, I’ll go back to watching Bob’s Burgers.”

At the same time, I found the source code for the Tokyo Metropolitan Government’s Covid-19 Task Force website. And as it happens, coders working for the city bureaucrats went out of their way to open-source their work! It’s available under the well known MIT Licence, which effectively means you can do anything you want with their code. Due to that, the site has been forked (copied), to run the corona virus info websites for at least 15 other major Japanese cities. Each city’s fork is connected to their local coronavirus statistics and announcement pages to give relevant information. including Osaka, Nara, Hokkaido, Hiroshima, and Kyoto.

I cannot stress enough how impressive this is for a codebase that’s been in existence for a mere 20 days. Already, 181 coders have contributed tens of thousands of lines of code. The documentation, which tells other programmers how to use it, is in 9 languages! It’s built using popular tools, like Vue.js and Nuxt, which make it easy for coders to jump into the code. I can’t even speak a word of Japanese, but I can tell this is an extremely well run project. I’ve worked for companies for years with nothing close to this level of organization, to see that in a half government-run half community-driven project is impressive.

The attention to detail on the codebase would be entirely wasted if the website itself didn’t hold up to the same level of scrutiny. But it does. The site tracks the number of confirmed cases in the city, as well as the total number tested each day. It even gives incredibly granular (anonymous) information on those confirmed to be infected, including their demographics and whether or not they are still hospitalized. Finally, it attempts to measure how the city is reacting by counting the daily phone calls to the coronavirus call centers, looking at the number of people riding public transit. On each of these charts is a little “Get Open Data” link directly to the underlying data source. I would love to see this level of statistics and transparency in my local community!

On top of the data itself, the presentation is clear and intuitive. Switching between the “By Day” and “Total” displays on any chart causes the bars on the graph to interpolate to the new correct size in an extremely pleasing fashion. This is going the extra mile visually. Animations like this are one of those things designers at a tech company would include in a site mock-up and a programmer would hastily relegate to the “out-of-scope” parts of the project, never to be spoken of again.

If you’ve ever been to Japan you probably know they have ridiculously good graphic design everywhere, and this site is no exception. Take, for example, the page dedicated to a flow chart with instructions on if, when, and how to consult a medical professional. It’s honestly one of the most informative and easiest to read flow charts I’ve even seen.

It’s even somehow CUTE while it tells how to handle your anxiety!

All in all, the project strikes that balance between bare utilitarian function and fine craftsmanship that is hard to find in any built product. Maybe only nerds like me could find a website comforting, but it looks to me like a warm fluffy pillow of protective goodness because it communicates that at least one person in a position of authority in Tokyo both deeply understands the gravity of the situation and truly has their shit together. We have websites here in New York that give us some basic info, but the Tokyo site is a work of art in comparison. It's slightly depressing to know we'll never match what Tokyo built in 3 weeks, but there are some cool projects in the works.

After all this research I’m going back to the perfect form of escapism: watching cartoon Bob Belcher try to cook a turkey in the alley while hijinks ensue.