OVERVIEW
SUMMARY
A mobile app based on John Hopkin’s COVID-19 tracker dashboard. While the desktop view is useful, it isn't built responsively and as a result, info is lost on the mobile view.

The purpose of this redesign is to create a universal, standardize design that would work within the current sets of data that were being displayed.

TYPE
Personal solo project
‍
TIME
‍3 months
‍
TOOLS
Figma, Photoshop, Illustrator
‍
TEAM
Michael Tewasart (UI Designer)‍
user research
SUMMARY
As of mid-June, 2020, the user-friendly dashboard has attracted millions of page views. Health officials, scientists and journalists use this to track the growing cases everyday. Compiling all of that information into a single app would mean it the design would have to be intuitive, easy to understand, and appeal to the most common denominator with a workflow as minimum as possible.

MOBILE PAIN POINTS
The mobile view lacked several features that were in the desktop version, such as viewing cities and various info data points. Multiple tabs at the bottom that were used to sort between each data point had to be streamlined and condensed into something more manageable. How each country/region tracks and organizes its cases also has to be factored in when creating a universal design system. Also, not every US state has a complete set of data points.
competitive & comparAtive analysis
At the time of designing this, various other websites/organizations/media outlets such as Bing, CDC, New York Times, and Google offer their own mobile version of a COVID-19 tracker.

MAIN FEATURE PRIORITIZATION
Based on analyzing the features of other COVID-19 trackers with a mobile viewport, the key features that I prioritized would be:
- search any country / province / county / city at any point of the workflow
- map view that would display the same amount of info as a list view
- filter/display different types of data (cases, deaths, recovered, active, tested, and hospitalized)
- switch between list and globe view instantly

Low fidelity wireframes & wireflow

As this was a mobile view of the dashboard compressed into an app, a workflow was created so that interaction from screen to screen could be tracked easier. A universal, standardize card was created to contain all relevant necessary information that the user wishes to display and filter by.

As this app was primarily focused on displaying information in the most efficient and intuitive way possible, the the main focus was providing an easy, intuitive navigation system in which the user can choose how to obtain data.

visual elements & color scheme

BRANDING
The color selection is similar to that of the desktop view, as I wanted to maintain visual consistency across all viewing device platforms.

FINAL DESIGN & THOUGHTS

TAKE AWAY:
The goal of this design was to create a user-friendly, mobile interface with a universal, standardize design that would work WITHIN the current sets of data points.

I learned that consistency is important in creating a standardize design system and without it, the entire workflow can fall apart and frustrate the user. Some countries collect and display data differently (USA has multiple states/provinces, while others just summarize their entire country).
VIEW PROTOTYPE