Driving License in Singpass app

Driving License in Singpass App

The digital driving license in the Singpass app is an officially-recognized certification of one's qualification to drive in Singapore. This card was launched to all 3.5+ million users.
Roles and responsibilities
Design Lead — Prototyping, visual design, systems design, developer handoff. Collaborated with UXR for usability testing.
Collaborators
  • 1 UX Researcher
  • 2 Product Managers
  • 6 Engineers (4 frontend, 2 backend)
  • 2 Traffic Police Officers
Timeline
3 Months. Design was completed in November 2020. Feature was launched in March 2022 after resolving legal intricacies.

About product

Singpass is Singapore’s national digital identity system created by the government of Singapore. It is part of the Smart Nation initiative that aims to leverage technology and innovation to improve the quality of lives for those living in Singapore. Singpass has two key features:

  1. Single sign on — Use the app as a passkey to log into government services or government-approved services. No need to remember passwords.
  2. Digital identity cards — Use digital identity cards as an official alternative to physical cards.

About project

In Singapore, the driving license ranks as third most recognized government-issued card behind the passport and the National Registration Identity Card (NRIC). The Singapore Police Force (SPF) was going to stop issuing these physical driving license. The Singpass app team saw this as an opportunity to collaborate with them to create a digital version of this card, which will in turn help the app gain trust (and more usage) from the Singapore public.

What did I do?

Impact

The driving license was officially launched on the Singpass app in March 2022 to its 3.5 million users. This digital driving license is reconized an official form of document that proves one’s qualifications to drive in Singapore, and shows up on the app’s homepage if the user has it.

Furthermore, I created a framework that sped up the alignment process of adding new cards from 18 weeks to 2 weeks. Using this framework, the vocational driving license was launched in March 2023.

Highlights

Three views for enhanced privacy and security

There are three views — (1) small card view on the homepage that shows the user’s unique identifier partially masked, (2) two password-protected views accessible with a PIN or facial recognition. In the password-protected views, users can tap on “show details” to view even more information.

Gif showing three different views of the driving license, with two of them unlocked by Face ID
three different views of the driving license, two of which are password-protected

Information is updated dynamically

Leveraging the affordances of a digital medium, information can now be dynamically populated in real time — license status, demerit points, etc. This also serves as a nudge towards the bigger goal of being digital-first.

Gif that cycles through six different statuses, each showing a different demerit point value.
Six different status showing different demerit points

No repeated information between cards

Again, leveraging the affordances of a digital medium, repeated information is intentionally minimized across different cards.

Image showing two screens, driving license and NRIC, with no repeated information between them.
Example of driving license on the left and NRIC on the right, with no repeated information between them.

Research phase

Desk research

Another designer and I did secondary research and mapped out the ecosystem of possible touch points of authorities, various entities, and people using driving license.

Image showing a mindmap of trust
Mindmap of trust and its possible respective touchpoints.

Interviews

The research team and I used sacrificial concepts as the basis of research. These concepts were used to understand understand how they use driving licenses and how moving driving license into a digital medium might positively or negatively affect their work flows.

Gif showing multiple cards getting selected before they are opened on a single page

Semi-structured user interviews with businesses

Business like car rental companies, or ride-sharing companies require their customers or employees to verify their qualifications to drive. In Singapore, a separate license is required to work for ride-sharing companies.

Gif showing multiple cards getting selected before they are opened on a single page

Role-playing interviews with Traffic Police officers

It was important to understand how the driving license was used when traffic police officers pull drivers over by the side of the road.

Gif showing multiple cards getting selected before they are opened on a single page

Interviews with prototypes with ride share drivers

Many ride share drivers are not tech-savvy, and it was important for us to understand how they would respond and/or approach using a digital card, a medium that they are not always familiar with.


Design phase

Visual design

Explorations ranged from replicating the original, physical card to using abstract background patterns. The final design uses a dark background to create a perception of legitimacy and for better accessibility for readability.

Image showing range of visual design explorations for driving license
Left = image of the physical driving license. Middle = 6 cards are a few explorations and iterations. Right = final design

Refinement

I explored the animation details of how information will be shown or hidden when users tap on “show/hide details”.

Gif shows two animations of how information is shown when the 'show/hide details` button is tapped — sliding and flipping.
Top = sliding animation. Bottom = flip animation.

Close collaboration with engineering and product

Engineering and product were part of conversations from the start of the project. This collaborative process helped to reduce crunch time towards the end of the project.

I created detailed specs and documentation, and had a rolling issues log that allowed me to work seamlessly yet asynchronously with the engineering team.

Here are some artifacts:

Image showing documentation of initial handoff
Documentation of initial handoff.
Image showing documentation showing card in isometric perspective to show how layers are arranged.
Documentation showing card in isometric perspective to show how layers are arranged.
Image shows updated documentation using an unofficial card
Updated documentation using an unofficial card. Specs were used to clarify alignment from the first set of specs.
Image showing rolling issue log
Rolling issue log with engineers.