Get Your Real ID Today!

Oregon DMV Website Redesign



UX Design, UI Design
Sept. 2021- Oct, 2021
Figma, Miro, Adobe AI,
Adobe PS





Individual Work
Mobile Website
UX research, Wireframing, Prototyping, Illustration Design

Design Background

Federal identification requirements for domestic air travel will change on May 3, 2023. That is when the Transportation Security Administration will no longer accept a standard Oregon driver's license or ID card to pass through airport security checkpoints. Due to the new regulation, the amount of Real ID applications is increasing. The current problem for Oregon DMV is a great number of applicants make errors when making an appointment for a Real ID, which decreases their business efficiency.

Current DMV Website


My design goal is to improve the mobile experience of making an appointment for the Real ID which allow users to make appointment efficiently and correctly on the DMV website.

The business goal of this design is to let users make an appointment for a Real ID correctly and easily so that the number of phone service requests will be reduced and applicants won't run to the office for nothing.

The user goal
of this design is to understand the process of application and to make an in-person appointment efficiently.

Jump to the solution
Identify Problem

Why making an appointment online is inefficient?


According to the heuristic test, most of the users could accomplish the task independently but spent more time than they expected. Few users made errors by making an appointment for an ID Card rather than a Real ID following the old guide of the ID Card.

User Journey Map

According to the user journey map, the user encountered two low mood points, and both happened while they filling in the forms. The main problems that caused these low mood points are tedious forms and poor legibility in guidance.

Comparative Analysis

After the Heuristic Test, I did a comparative analysis to find out how questions in the online appointment process influenced users' feelings.  The comparison shows that the current process has too many questions and pages to go through. The fewer pages of questions, a simpler searching filter, and an intuitive layout can leave a better experience for users.

‍1. The current user flow is discursive. The original user flow for the ID Card intervenes with the new user flow for a Real ID.

2. The application process and forms are tediou with too many words and steps.‍

3. The legibility of guidance and confirmation pages is awful which is caused by the bad interface design.

User Research

Who are users?

Research Summary

Users get lost at the DMV website due to its discursive user flow, tedious application process, and poor Legibility

Pain Point 1

The discursive user flow with overlapping links is confusing for users to find a simple flow. This makes users commit errors while navigating.

Pain Point 2

The tedious application process and long selection list makes users feel overwhelmed and impatient

Pain Point 3

The lack of hierarchy in copywriting and illustration design cause poor readability in guide and confirmation pages, which makes users fail to capture essential information and not sure if they complete the right form


How can we improve the user experience?

Affinity Diagram

The affinity diagram shows the main problem and pain points of the current website as well as design strategies that would solve the problem.

Usability Test

After finishing the high-fidelity mockup, I conducted a usability test. Participants think the website got improved from the perspective of learnability, efficiency, and satisfaction. However, they still had a bad experience on selecting office and time.

1. Selecting time first is unnecessary because usually, users' available time is a period rather than a specific time. Compared with the office, time is more flexible and has more choices.

2. Participants didn't know the offices' list is ranked by distance when they searched a place.

3. Participants didn't notice the earliest available date in the selection.

4. the searching bar is not clear visually.

Original Design

After the usability test, I improved the experience of selecting office and time by following design decision

1. Using a single user flow that selects the office first.

2. Adding distance and earliest available date tags in each office's selection panel.

3. Creating an apparent searching bar.

Updated Design

Design Decision

Look what I did for Oregon DMV!

Less Sections On Homepage

I simplified the homepage's sections and eliminated secondary selection in order to avoid having confusion on those overlapped selections.

Besides, I designed a set of illustrations to improve the visual aesthetics and indicate the content of each section.

Guiding Before Actions

I modified the old tedious instruction page before making an appointment to a preparation page, which only has concise step-by-step guidance and essential explanation. Users can not only have the whole picture of getting a Real ID, but also get start directly from the link in the guidance.

Folding Further Explanation

By folding supplementary explanations, users can focus on the questions and selections. For those who are confused about the question, they can unfold the explanation by taping "learn more". A pop-up window with further instructions will show up.

Scheduling Efficiently

I added a map in the offices selection to help users know the exact offices' location better.

After searching a place, the offices' list will be ranked by distance from that place and indicated by small tags on the selection panel.

I also added small tags of the earliest available dates to help users know which office has the earliest appointment before getting to the next page.

Lead to Next Step

After finishing each step, I add several outlets to the next step or homepage so that users can have a clue what to do next to complete the application.

Easy Tracking

The email makes users easier to track their appointment. Besides, users can add the appointment to their calendar which reminds them of the appointment time and locations.

Next Step

Never stop improving!

1. Testing the new website with more real applicants.
2. Applying those designs to other devices
3. Finishing the design of the whole website and user experiences of other business

Back to Homepage