01. Introduction
Oddschecker offer a betting comparison service that allow the user to compare the odds from different bookmakers on the same match and place the bet on the best one.
The user to be able to place the bet on the platform need to have an account with at least one bookmaker.
Every day the user returns on the app to check the odds, and have to login again on the bookmaker’s account because the token is expired.
This issue result very annoying for user with multiple accounts linked to the app. That’s why we introduced the Oddschecker Password Manager, to safety store the user’s details and made an easy and fast login to the app using the Face ID, Touch ID or a Pin Code.
02. Competitive Analysis
The competitive analysis was ran on different kind of app that have a level of protection before allow the user to access it, like Monzo, Revolut, Starling, GiffGaff and Curve.
To better understand the correct flow I went to check the iOS Human Interface Guidelines to be sure to not forget any important step.
03. UX Flow
We identify four different flow for this new feature:
- Saving Flow,
- Login Flow,
- Login with one error Flow,
- Login with more than one error Flow,
Saving Flow
Login Flow
Login Flow with one error
Login Flow with more than one error
04. Iterations
The iterations was on two of the four flow: The Login and the Login with one error.
Login Flow Iteration 1
The first design for the Login Flow was very fast and easy, too much fast, we didn’t show nothing to the user and he get confused.
Login Flow Iteration 2
Based on the first user test of the Login Flow, I added a notification toast that appear from the bottom and inform the user on what bookmakers he logged in.
Login Flow with one error Iteration 1
The login flow with one error present one toast card that describe the issue, but then we found that some users was a little confused and had to red again the descriptive text before enter the login details again.
Login Flow with one error Iteration 2
Based on the result of the Login Flow with one error test, we decide to make it more clear and bold what bookmaker had the issue placing the logo of the bookmaker on top of the card.
