Nhu Nguyen

Product Designer

available for work

Nhu Nguyen

Product Designer

Nhu Nguyen

Product Designer

Nhu Nguyen

Product Designer

eKYC Refactor

Company

Zalo

Company

Zalo

Company

Zalo

Year

2023

Year

2023

Year

2023

Timeline

6 weeks

Timeline

6 weeks

Timeline

6 weeks

Contribution

Research, Enterprise UI/UX, Illustration

Contribution

Research, Enterprise UI/UX, Illustration

Contribution

Research, Enterprise UI/UX, Illustration

New users and users who want to conduct business on Zalo are facing difficulties completing the electronic Know Your Customer (eKYC) process. This prevents users from accessing other features within the app, negatively impacting Zalo's overall conversion rate and ability to attract new users, especially in light of Decree 13 requiring new users to complete eKYC.

Drop-off rate at step 1 decreased by 26%
Drop-off rate at step 1 decreased by 26%
Drop-off rate at step 1 decreased by 26%
Completion Rate increased by 16%
Completion Rate increased by 16%
Completion Rate increased by 16%
Time on task decreased by 40%
Time on task decreased by 40%
Time on task decreased by 40%
Research

Data Analysis

The current flow consists of the following 3 steps:

  • Capture front side of the document

  • Capture back side of the document

  • Capture a portrait photo

I started with analyzed collected data to identify the key areas for improvement. The user funnel shows a very high drop-off rate at step 1 and step 2, at 88.2% and 46.6% respectively. In addition, we also observed a very high percentage (nearly 50%) of users uploading portrait photos in the document verification step.

User Interviews

I conducted 6 user interviews to gain a deeper understanding of the user difficulties and needs, things that I couldn't translate from data alone. From the interviews, we gathered the following insights:

I don't know how to take a photo of my documents that the app will accept.

The app's instructions are unclear. I had to try multiple times before succeeding.

I find this process a bit time-consuming. I wish it were faster.

Competitor Analysis

I conducted a competitor analysis of eKYC flows primarily within banking and financial apps. However, it's important to note the business context differs: banks mandate eKYC for usage, while Zalo's implementation is optional. Two key takeaways emerged:

  • AI-Powered Automation: Banking apps streamline eKYC through AI, significantly reducing invalid submissions and accelerating the process.

  • Clarity and Transparency: These apps excel in providing clear instructions and setting user expectations for each step, minimizing confusion.

insights

After conducting all the above research, I identified the pain points for this entire flow.

Pain Points

  • Unclear guidance: Users not being prepared for the necessary steps resulting in a high drop-off rate after step 1. Even if users do continue, their satisfaction level will decrease.

  • Lack of errors prevention: The app's instructions on how to capture photos of documents and faces are not clear enough, causing errors and frustration for users.

  • Lengthy process: Some users find the eKYC process too long and complicated, leading to disengagement and potential abandonment.

Opportunities

Process automation by Apply AI technology to enable automatic capture, helping to reduce manual user actions and task completion time.

ideation

User Flows

The proposed solution will heavily depend on the technology available. I discussed with developers about the technology they use for authentication. This flow not only serves the user but also needs to ensure accuracy and minimize fraud.

After discussion, we decided to keep the flow with 3 steps as it is currently, but we will merge the front and back photo capture into one document photo capture step.


Ideation

I have reviewed the entire current flow and identified areas for improvement to align with insights obtained from the above research.


We chose to communicate clearly with the user from the beginning about the steps they need to take throughout the entire flow to manage their expectation.


Although our current technology is capable of scanning any type of document, I designed selection so that the users are more aware of what they need to prepare, as well as providing specific instructions for each type of document.

In addition, we no longer allow uploading existing photos from the library to prevent fraud, although this may compromise user convenience.


The old flow used the OS's camera, causing a lot of difficulties for users as they didn't know how to capture the documents to meet the requirements.

In the new flow, I designed a frame to help users align the angle correctly. Thanks to technological improvements, we also provide real-time guidance and allow the system to automatically capture when the documents & face is placed at the correct angle.


I also added clear instructions and illustrations throughout the flow, and updated the progress to motivate users to complete.

Solution Testing

After having a near-complete design, I developed a prototype to conduct usability testing and heuristics evaluation to get feedback and make necessary adjustments.
You can try using it here, noting that I cannot accurately simulate the camera experience using Figma.

final solution

I prepared detailed design specifications, for development handoff. Collaborated closely with the development team to ensure a smooth transition and accurate implementation of the design.

Onboarding

The onboarding screen outlines the steps required, allowing users to prepare in advance and estimate the time needed for verification.

Onboarding

The onboarding screen outlines the steps required, allowing users to prepare in advance and estimate the time needed for verification.

Onboarding

The onboarding screen outlines the steps required, allowing users to prepare in advance and estimate the time needed for verification.

Document Preparation

The document selection screen for verification includes specific illustrations for each type (e.g., National ID requires photos of both sides, while a passport only requires the first page).

Document Preparation

The document selection screen for verification includes specific illustrations for each type (e.g., National ID requires photos of both sides, while a passport only requires the first page).

Document Preparation

The document selection screen for verification includes specific illustrations for each type (e.g., National ID requires photos of both sides, while a passport only requires the first page).

Instructions

The bottom sheet notification about valid photo requirements is displayed the first time the capture step is accessed and can be revisited by tapping the info icon in the header.

Instructions

The bottom sheet notification about valid photo requirements is displayed the first time the capture step is accessed and can be revisited by tapping the info icon in the header.

Instructions

The bottom sheet notification about valid photo requirements is displayed the first time the capture step is accessed and can be revisited by tapping the info icon in the header.

Document Camera

The capture screen features a predefined frame customized for each document type, with auto-capture enabled when the document is correctly positioned. However, a manual capture button is also provided for users to operate in case of technical issues.

Document Camera

The capture screen features a predefined frame customized for each document type, with auto-capture enabled when the document is correctly positioned. However, a manual capture button is also provided for users to operate in case of technical issues.

Document Camera

The capture screen features a predefined frame customized for each document type, with auto-capture enabled when the document is correctly positioned. However, a manual capture button is also provided for users to operate in case of technical issues.

Document Result

The notification and preview screen displays the captured document, preventing mismatched document errors. Additionally, it reminds users of the next step to motivate them to complete the verification process.

Document Result

The notification and preview screen displays the captured document, preventing mismatched document errors. Additionally, it reminds users of the next step to motivate them to complete the verification process.

Document Result

The notification and preview screen displays the captured document, preventing mismatched document errors. Additionally, it reminds users of the next step to motivate them to complete the verification process.

Portrait Preparation

The instruction screen guides users on capturing a valid facial photo.

Portrait Preparation

The instruction screen guides users on capturing a valid facial photo.

Portrait Preparation

The instruction screen guides users on capturing a valid facial photo.

Portrait Camera

The facial capture screen features an oval-shaped frame, better suited to the natural shape of the human face compared to a circular frame.

Portrait Camera

The facial capture screen features an oval-shaped frame, better suited to the natural shape of the human face compared to a circular frame.

Portrait Camera

The facial capture screen features an oval-shaped frame, better suited to the natural shape of the human face compared to a circular frame.

Result

The result notification screen features a subtle 'Change Document' button, as changing documents is discouraged to ensure security and prevent fraud.

Result

The result notification screen features a subtle 'Change Document' button, as changing documents is discouraged to ensure security and prevent fraud.

Result

The result notification screen features a subtle 'Change Document' button, as changing documents is discouraged to ensure security and prevent fraud.