Challenge 2: Wireframing
My second challenge for Ironack’s pre course work was to reverse engineer a popular app and create both wireframes and a user flow chart. I chose the Asos app, as I find it both user friendly and a good example of a streamlined shopping tool.
I chose to show the flow of buying a dress on the app, by starting on the home page and the process of getting to the checkout page. I uploaded photos of the actual app and created my wireframes from there. I simplified the design and left out decorative details, unnecessary text, logos, color and images. Hopefully what follows is a clear, concise frame of the app:
Lastly I created a user flow chart, selecting the starting place “Search” with arrows indicating the next sequential steps the user must take in order to complete their purchase and end on the “Checkout” page.
I found this project to be both challenging and yet rewarding. As I am new to design tools such as Figma it took quite some time to create my wireframes- which are meant to be done quickly! However I feel I learned some valuable lessons about Figma, creating wireframes and the interaction design and user flow that will be paramount to me moving forward with my design career.
