US visa application re-design

US visa application

Re-design

Case study

TIMELINE

Sep 2022 - Apr 2023

ROLE

UX/UI Designer

INTRODUCTION

As a student studying abroad in the United States, I empathize with non-immigrants who are having problems obtaining a US visa.

The visa application process is extremely difficult, with poor UX/UI and confusing instructions. Especially for first-timers.

MY ROLE

UX/UI designer
UX researcher
Graphic designer

TOOLS USED

PROBLEM

The visa application process is incredibly complex that may result in an unjust visa rejection.

Most overseas students and visitors must pay travel agencies $350 to complete a visa application with a low refusal rate, which is expensive and unnecessary.

GOAL

Simplify the U.S visa application process.

Reduce visa rejection by unwanted mistake.

Save $350 for visitors.

Profit US economy from international students. ($28.4 billion during the 2020-21 academic school year) source

Survey demographic

RESEARCH

I conducted 19 user surveys for quantitative data.

4 interviews for qualitative data.

3 Competitor analysis (Canada, UK, France) visa application

Let's go

More projects?

PAIN POINTS

DS-160 ( step 1) is stressful, difficult and poorly documented.

DS-160 Time out issue after 20 mins.
Hard retrieve the unfinished DS-160 form.
6 users hired agency.
No link to payment website (step 2)
The language used can be more pleasant and less severe.

OPPORTUNITIES

Various research steps until the DS-160 form can be found.

Re-submit everything from scratch after left it untouched for 20 mins.

Easier process of DS-160 form retrieval.

Difficulty understand what next steps are.

Clarify instructions to next steps.

User friendly language.

CERTAIN US VISAS THAT REQUIRE DS-160 (1st step)

Source

There are 5 main categories from the survey:

Difficult & stressful (7/19)
No clarification (11/19)
Hired an agency (6/19)
Mental health (1/19)
Trouble to set up appointment (2/19)

AFFINITY MAPPING

Through user survey, I discovered that there was no direct link or instruction from

Step 1 to Step 2

INTERVIEW INSIGHTS

Cognitive overload.

Texts are too small.
Users have to go to local post office to make a payment.

Time out issue after 20 mins.

Hard to retrieve the unfinished DS-160 form.

Once submitted the application, one of the users was stuck.

COMPETITOR ANALYSIS

Canada visa application

UK visa application

France visa application

To retrieve application form, users must note their ID number which was poorly highlight.

As a result, one of the users I interviewed with was required to resubmit the form from scratch.

Visual hierarchy: Overwhelmed

UI: Not friendly

Duration: 90 mins

Payment: Local post office/online

Retrieval: ID number method

USA visa application form

Navigation: Vertical menu

The disadvantage is that it takes up one-third of the width of the webpage.

UK visa application form

Horizontal navigation, Canada's, is more efficient since it saves space and informs users in the following stages.

Navigation: Horizontal

Visual hierarchy: Strong

UI: Not Friendly

Duration: 30 mins

Payment: Online

Retrieval: Phone

Canada visa application form

Intuitive detailed instruction page before application.

Great use of icons and visual heirachy.

Navigation: Horizontal

Visual hierarchy: Strong

UI: Not Friendly

Duration: 30 mins

Payment: Online

Retrieval: Email

In the last step, the future actions page informs visitors of what is left to accomplish.

Includes a clear CTA to the next webpage, which the US application form does not offer.

France visa application form

Navigation: Horizontal

Visual hierarchy: Normal

UI: Basic

Duration: 30 mins

Payment: Online

Retrieval: Online

LEARNINGS

Most users have issues with the application (step 1)

Reduce texts for better visual hierarchy.

Only use colors when needed.

Horizontal menu for less space.

Online payment.

INSTRUCTION PAGE

I restructured a large and complex website into 4 step-by-step user on boarding with digestible information and intuitive icons, including a button that leads to the application.

DEVELOPMENT

FORM RETRIEVAL NOTIFICATION

This site informs visitors that they must save their ID number and security response in order to retrieve an unfinished application.

Unfortunately, the form performed a poor job of notifying them because the content is a page lengthy and most people would quickly skim through it.

As a result, a user I interviewed must resubmit the form from scratch.

THE APPLICATION

Based on competitors analysis, I chose a horizontal navigation bar over a vertical design to save space. I also eliminated unnecessary text and colors to avoid cognitive stress and increase visual hierarchy.

Furthermore, with my new design, users may reduce unwanted mistakes and rejection by being aided further through online chat support & auto save feature.

CONFIRMATION PAGE

After 3 version of iteration, most users felt stopped at this page since there was no direct link or instruction from the application form to payment & schedule website.

I provided a button that directs users to Step 2 (payment & schedule website).

RESULT & IMPACT

SAVE TIME FOR USER

Transforming the pre-application page into clear, digestible instructions with button that directs users to the following stage. Without having to go back or get lost, users can easily follow a single flow until they reach the final step (interview).

REDUCE UNJUST MISTAKES

Now, users may easily retrieve incomplete applications. They may also use the live support chat box and the auto save function to decrease worry and confusion throughout this application.

Thank you for your time :)

DELIVERY (SOLUTION)

I focused on re-design 4 key pages where users were having difficulty or felt stuck.

INSTRUCTION PAGE

I reconstructed the existing complex instruction into 4 easy steps with direct link to the application.

FORM RETRIEVAL NOTIFICATION

I reduced texts to emphasizes the 2 tasks users must do in order to retrieve unfinished application.

THE APPLICATION

Reducing extraneous text and colors and using a horizontal nav bar to save space.

Users may reduce unwanted mistakes and rejection by being aided further through online chat support & auto save feature.

CONFIRMATION PAGE

This page is where users I interviewed felt stopped since there is no link to the next step.

I provided a button that leads to the 2nd step (payment & schedule)

CREATIVE PROCESS

DEFINE

Based on the research below, step 1 is the most challenging for users with a significant likelihood of visa refusal.

There fore, I focused on re-design 4 key pages where users were having difficulty or felt stuck

Similar to the application. The visa instruction page has a lot of information with no visual hierarchy and unclear links that fail to take users to the next step.

They should have included an obvious description of processes that lead to the application.

I discovered that the visa application procedure is divided into 3 parts.

DISCOVERY

PROTOTYPE