Wireframing the App Store
Learning by Doing
‘Reverse engineer’ an app’s Interaction Design and User Flow. Then using Sketch create a wireframe version of the user flow.
Project Goals:
- Choose an application to practice with.
- Choose a user flow to perform a task.
- Conduct a task analysis for your chosen task.
- Create lo-fi wireframes.
- Create mid-fi wireframes using Sketch and a wire-framing kit.
- Use Invision to create an interaction design.
The intended goal of the App Store is to “find the apps you love, and the ones you’re about to.” — Apple
The reasons why I chose this task to ‘reverse engineer’ is to:
- Better understand how Apple improves the user experience.
- See how Apple aligns its user experience with business goals.
For this exercise, I chose Cash App from the App Store. The user’s goal is to find the app as quickly as possible. The success of this task depends on the user’s ability to use the App Store’s ‘tabs’ feature to filter search queries.
A well-performing “search” algorithm within the App Store will quickly connect users to the chosen apps they are searching for while enhancing the users experience.
Task Analysis:
Find a specific app (“Cash App”) to download.
Open App Store on your iPhone
- Tap the “search” tab
2. Tap search bar (to access keyboard)
3. Type in “Cash App”
4. Choose the search button or pick from the selection
5. Tap on the “get” button
Keep it Simple
Lo-fi wireframes help designers iterate fast and share ideas easily. Simplifying the design helps to communicate design ideas efficiently without having to focus on pixels and picture-perfect visuals.
Using a wire-framing kit I was able to focus on the interaction design and user- flow of the application.
Prototype Using Invision
At this stage of the design process, a good wireframe should be clear for anyone to understand, and avoids influencing or sidetracking the conversation from the important design decisions.
Feel free to take a look at my InVison prototype.
Thanks for reading. Let me know if you enjoyed this article by clicking the applause button or add to the conversation and leave a comment. We can also connect on LinkedIn.
