top of page

COVDAT: COVID-19 Database App

August 2022 

In an approach to studying app designs, I have decided to create my own app and design the user experience and interface. With UI design, I have also created icons and illustrations myself to have hands-on experience in Adobe Illustrator. This app will function to give people COVID-19 information, personal vaccination records, vaccination centers, testing centers, statistics, etc.


In an approach to studying app design. Also,

to further study iconography and illustrations



  • Adobe XD

  • Adobe Illustrator



Background / Purpose / Goal

When I went to the U.S. I was trying to enter a concert and everyone was required to prove their vaccination. What I realized was everyone holding a paper card. It seemed to me very inefficient for people to go around and hold onto a small piece of paper that anyone could easily lose. 

Design a user-friendly app that people could use to upload COVID-19-related information. 

  • To determine the users’ needs when visiting this app.

  • Make sure the essential information is placed where users’ could immediately notice.

  • Build a structure for organizing the information on the website.

  • Research information people would be interested in when using the app and try to integrate different COVID-19-related apps or information sites into one.

Problem Identification

During my time in the U.S., I realized people were carrying their paper vaccination cards around to enter certain facilities.  While carrying this piece of paper, people could easily lose it. Also, COVID-19-related information is nowhere integrated into any app. Thus, people have to individually search info on available vaccine records, their COVID-19-related info(vaccination), COVID cases, and FAQ about COVID.


Design an app where people could access vaccination records/authentication, general information about COVID, testing centers, vaccination centers, and COVID statistics.

User Research - Personas


Concert viewer 

I want to prove I am vaccinated without losing my vaccination card so that I could enter the concert hall and not lose my vaccination card to use for different purposes in the future


Information Architecture


Site Map

COVDAT (1).png


Style Guide

I have focused on the most common fonts: Helvetica and PT Sans. Also, the colors are focused on green with having different shades for gradation. The logo shows the long history of the incline, thus is crucial to include. 


















Icons & illustrations were all made by myself through Adobe Illustrator. Through this project, I wanted to focused on exploring iconography and illustrations and a deeper dive into getting hands-on experience with the Illustrator tool.


Final Product

Launch Page

Signup/Login Page

Vaccination - Personal Verification Page

Vaccination Page (After Verification)

Personal Vaccination Page.png
Personal Vaccination Page – Detail.png
Personal Vaccination Page – sidebar1.png
Personal Vaccination Page – sidebar 2.png
Update Info Page - Vaccination Update.png
Update Info Page - Positive History-1.png
Update Info Page - Positive History – 2.png
Update Info Page - Positive History – 3.png
Global Certification-1.png
Global Certification-2.png

Vaccination Center Page

Vaccination Locations - Map View.png
Vaccination Locations – List View.png
Vaccination Locations – List View – Filter-Sort.png

Testing Center Page

Testing Locations - Map View.png
Testing Locations – List View.png
Testing Locations – List View – Filter-Sort.png
Vaccination Locations – detail page1 – 1.png
Vaccination Locations – List View – Filter-Sort – 3.png
Vaccination Locations – detail page-hours.png
Vaccination Locations – detail page-hours – 1.png

COVID-19 Information Page

About COVID.png
About COVID – preventions.png
About COVID – scroll down.png
About COVID – TOV.png
About COVID – symptoms.png
About COVID – Testing Methods.png
About COVID – treatments.png
About COVID – variants.png

COVID-19 Statistics Page

Statistics- world-month view.png
Statistics- world-day view.png
Statistics- world-year view.png
Statistics- country choice view.png
Statistics- country-month view.png
Statistics- country-day view.png
Statistics- country-year view.png

More Interaction Updates To Come Soon!

bottom of page