Revamp Login
The existing login system was outdated, relying solely on basic username-password and OTP authentication, which led to significant security vulnerabilities and increased maintenance costs. I designed a new login flow, incorporating alternative authentication methods to enhance usability and security.
define
Problem Framing
Currently, Zalo offers two login methods: password login and OTP login sent to the user's phone number. Zalo users are not required to set a password when creating an account, leading to OTP login being more popular (~65% A1).
Additionally, whenever users have their phones stolen or lose ownership of their phone numbers without setting passwords, they cannot proactively protect their accounts and have to contact customer support to lock them down, creating delays and increasing the risk of losing accounts.
We conducted some quick user interviews to understand why users don't set passwords and gathered the following insights:
Zalo's password setting rules are too complicated. No matter how I try to set it, it doesn't work, so I just skip it altogether.
I find logging in with OTP much more convenient and faster.
This situation raises two issues:
User-side: Increased risk of account loss if the user loses access to their phone number.
Business-side: Incurring OTP costs.
Scoping
After analyzing the issues, to address the security and cost concerns without sacrificing user convenience, we decided to add alternative authentication methods besides the two existing ones include:
Receiving OTP via mail
Authentication using another device
Passkey
Phasing
Revamp the UI and add authentication using another device.
Add a mechanism to set up email and receive OTP via email.
Add authentication using passkey.
This case study will focus on phase 1.
Ideation
Competitor Analysis
This authentication method is already quite popular and widely adopted, so it wasn't particularly challenging for me to conceptualize and design this solution.
I conducted quick research on how trusted device authentication operates across various applications. The most common implementations include those by Google, Facebook, Apple and Zalo’s direct competitor, Telegram.
User Flow
I started by gathering and reviewing all the old wireflows to clarify the current authentication process, highlight key technical considerations, and understand the rationale behind the design of the previous solution.
Although the login flow is a very familiar and seemingly simple flow, it has quite a few edge cases due to using the 2FA mechanism, and the choice of authentication method depends on two factors:
The trustworthiness of the device
The trustworthiness of the network the user is using
After clarifying all the mechanisms of the current flow, I created a user flow to get a comprehensive view after adding the familiar device authentication method as shown below
We also added an emergency account lock mechanism to help protect users when they lose their passwords, so I also drew another user flow illustrating the scenario where a user loses their password and their account is taken over by a stranger as shown below
final solution
We discussed whether to send OTPs via messages like Telegram or display them in a full-screen format like Google. Then we decided on the full-screen approach to better alert users in case of account compromise, as users might often skip messages from official accounts, mistaking them for advertisements.
