Covid Passport
Navigate Travel Restrictions with Confidence
(Kayak Portal Re-Design)
Role: Product Design | UX Design
Spring 2022
Time: 4 Months
Project Type: Front-End Development, Web Scraper, UX Design
Global Passport provides you accurate, real-time information on international travel restrictions due to Covid-19. This product helps you navigate the myriad of quarantine rules, vaccine shots, and travel protocols, through a tailored user experience and an intuitive interface. Users can easily integrate travel requirements into their personal calendars and also search potential destinations. The data is scraped from a publicly available Kayak database.
Technology
React (Front-End)
NodeJS (Server)
Cheerio (Web Scraper)
React Native
Material UI
Sources & Citation
Coming Soon
Define the Problem
Information on Covid-19 travel restrictions are difficult to find, rapidly changing, and often inaccessible.
Application should be user friendly, unifying the basic data points across different countries and jurisdictions.
This application represents my attempt to broaden my product experience beyond architecture and real estate issues.
This product exercise will integrate the latest front-end web technologies, such as React Hooks and Material UI.
Travel Today, Post-2020
International travel has rebounded closer to pre-pandemic levels.
U.S. airlines carried 674 million passengers in 2021, 82.5% more than in 2020 (369 million, unadjusted), according to Bureau of Transportation Statistics.
However, restrictions remain, as variants create periodic outbreaks in hotspots.
As of April 2022, 162 countries are open with travel restrictions, and 35 countries are closed (Kayak.com).
Travel guidance remains a patchwork of ever-changing trans-national regulations.
Inconsistent resources are provided by the World Health Organization, Center for Disease Control, and national governments and airlines.
IATA September 2021 Customer Survey (4,700 Respondents, 11 Markets)
“People are willing to be tested to travel. But they don’t like the cost or the inconvenience.”
Willie Walsh, IATA Director General
Current Resources & Criteria
Existing digital tools provided by governments and businesses provide a thorough, albeit fragmented and overlapping, way for consumers and travelers to research and review travel restrictions. Global, regional, and local travel advisory are split among different sites. Information is not yet distilled or tailored for individual use cases.
Center for Disease Control (CDC)
Government Data Provider, for Americans
The CDC, based in Atlanta, provides Americans with travel recommendations for each destination country. Countries are categorized by risk levels, and a global page links to individual country pages with entry and exit requirements.
Re-open EU (European Union)
Government Data Provider, for EU bloc
The European Union has created an interacted web portal, where EU citizens and tourists can research ongoing travel restrictions and case rates among different EU bloc countries. Canada also offers a similar service (ArriveCAN) for visitors
Kayak, Delta Airlines
Business Industry Provider, for air travelers
Both Kayak and Delta Airlines provides web portals that show travel restrictions information, updated in real time. Both Americans and foreigners can (1) look up travel advisory information between countries, as well as (2) research potential destinations.
Changing Traveler Journey
A regime of vaccinations, testing, and quarantine has added new pressures to travel logistics, increasing travel times and uncertainty. For a typical travel regime, featuring 2-week vaccination, 3-day pre-testing for flights, and potential quarantine upon landing, a 14-day trip abroad can easily require 40-days of planning in-total.
Covid travel restrictions is a time management problem.
The biggest problem facing travelers is managing the time required to fulfill restriction requirements — building in a quarantine period, completing rapid tests at the local pharmacy, and planning travel contingencies. A digital product cannot pay for the costs of tests and masks, but it can help travelers anticipate logistics and prepare for the overall journey. Besides indicating country-level information or general rules, what if the product can seamlessly integrate restrictions into a user’s timeline?
User Challenge
Product Goals
1. At a baseline, communicate travel restrictions clearly and effectively.
Offer real-time data about travel restrictions to both prospective and prepared travelers.
2. Provide personal travel protocol information, tailored to each trip.
Target travel advice towards each user’s specific circumstances and needs.
3. Build a helpful, on-the-go digital companion during the entire journey.
Integrate the product with helpful reminders and calendar notifications, particularly for emergencies and last-minute changes.
Understanding User Personas
Who are the customers that will be using this new product? Conducting research with my own friends and families, three user types come to mind, from an American standpoint: the leisure traveler, the business road warrior, and the international student.
Sketching & Wireframing
The user personas exercise enabled me to start mapping out the product journey and ideating product features. There are two potential starting points for the customer flow:
Flow A, The Planner: “I have booked my flights already. I just need to know what the restrictions are for my destination country"
Flow B, The Spontaneous Browser: “I don’t know where I am going. I am planning a vacation and want to understand restrictions between potential destinations.”
From these two starting points, the customer can then navigate into specific features of the tool. I started to consider three primary app functions:
A basic, country-to-country search on travel restrictions
A comparison tool between different destinations
A calendar integration feature that calculates user dates and timelines
Whiteboarding the Customer Journey - Where the product can help improve the process
Mapping the Application Screens - How user actions lead to different features and results
UI Options - Indicating timeline information via list or calendar view
Initial Draft - Here is a very first draft of wireframes for the mobile app, going through user inputs to deliver a travel restrictions itinerary.
High-Fidelity Prototype
After some initial studies with low-fidelity wireframes, I moved on to creating more high-fidelity screens of the project. The user interface is inspired by very common travel websites like Expedia and Google Flights, which most customers are already comfortable with and know how to navigate. The different query features are grouped by tabs on the landing page, and the different functions are inter-connected to create a more seamless travel planning experience. The results page separate different travel data into drop-down bars that show only the most important data at the top, while more detailed and specific information can be found in the expanded sections.
(Interactive Demo Coming Soon)
Production Progress & Development Update
In Spring and Summer 2022, development has begun on a demo product. As a testing demo, the back-end of the product scrapes an existing Kayak back-end (Link). The full technology stack is listed below:
Front-End: React (React ES7 Hooks)
Back-End: NodeJS, Express
Web Scraper: CheerioJS
Development Screenshots Below (Initial Study, April 2022):
