As a part of this design challenge, I have made a checkout form for an airplane company named “enRoute”.
Scenario: Anne Matthew is trying to book her flight tickets for 25th Dec, 2023 from Canada to Amsterdam. She wants to find a cheap flight as wants to save money and celebrate Christmas and new year with her friends and family.
I started with putting out the steps users might take to book their flight.
The aim behind jotting down user steps was to understand how users are likely to interact with the application and it also helps me to make sure that I don’t miss out on any important pages or features if needed.
The next step was to create low-fidelity designs for the application, to do so, I started with paper prototyping. Paper prototyping helped me to put out different designs I want for my application.
Another thing I did was to carry out research and see the checkout flow of different airline companies like; KLM, Air Canada, and Qatar Airlines. This helped me to understand how the checkout page flow is and what are some of the important things to be included.
Next up, I made the list of the things which are needed to make the checkout flow seamless.
- Name on the card
- Card number
- CVV and explaining users what is it
- Expiry date
- Given people choices of how they would prefer to pay
The overall aim with this design was to make the checkout seamless and easy to understand. I kept the status bar above the checkout payment option to provide users with the feedback regarding which step they are at. It helps to stay connected with the user and validate for them that they are on the right track.
I also added the small information icon along with their dialog boxes to provide user with more information about the specifics in case they are not aware of it.
Check the prototype here:
Read the full article here
