Ironhack’s Prework:[Wireframing]_Challenge2
For this challenge, I have chosen a bank application to work on. It is ABN AMRO’s app that I frequently use. This app has made my banking simpler and way quicker. I really like the User Interface of this app as it is very intuitive and goes well with the saying “No design is the best design”. Yet it follows the theme of the ABN AMRO brand. I have not been a tech-friendly person but to my surprise, I never have to take guidance using this app.
In this challenge, I am asked to wireframe the user flow of a feature of the chosen app. I have worked on the Money Transfer feature. Other than looking up my account balance, I use this feature the most.
For wireframing, I have used UI elements including buttons, dropdowns, text input fields, and a keyboard. The user flow of this feature is quite simple. As the user logins through the app on the first screen, the interface displays a button titled “Transfer” for money transfer on the accounts page; second screen. By tapping over the Transfer button, the user navigates to the third screen where he enters information regarding the amount to be transferred and the beneficiary's details. On selecting the ‘Continue’ button he is taken to the fourth screen where transaction details are displayed just for an overview. On further selecting the ‘Continue’ button, the user is asked to verify his identification code for security reasons. On entering the code successfully he gets a Pop-Up message telling about the successful transaction. So he gets the assurance.
These are black and white wireframes for the user flow of the Money Transfer feature of the app. I have designed and prototyped it using Figma.
By this reverse engineering drill, I could deeply analyze the effort and process behind a simple-seeming feature.