Thomas Sweet: Bringing the Mobile App to Life
Case Study: Part 2
This case study is a personal redesign for Thomas Sweet and was completed over the course of two weeks. This is the second part of a two-part case study — click here for Part 1. All information in this case study is my own and does not necessarily reflect the views of Thomas Sweet.
Part 1 Recap: Research Findings
In the first part of my case study, I focused on conducting research in order to grasp the main pain points for Thomas Sweet and ice cream shops as a whole. I used surveys and interviews to gather this data and synthesized it down to a persona and problem statement and then conducted an ideation session to create a set of features for the MVP. After building a low-fidelity prototype and conducting usability testing, I knew what needed to be improved to bring this prototype to the next level.
My three MVP features include an organized menu with clear subcategories for those browsing by dietary restrictions, an ice cream flavor selection quiz, and ordering for in-store pickup. In this iteration, I also added an onboarding process for faster checkout since I had time additional time left to incorporate another feature.
Mood Board & Style Guide
Based on my research findings in Part 1, I knew that users heavily valued the holistic experience of getting dessert and the ambiance of the shop. Keeping this in mind, I created a mood board based on getting ice cream on a summer day. I drew inspiration from imagery of summer sunsets and captured those warm, pastel colors in my style guide as well to evoke feelings of comfort and warmth.
Storyboard
Based on the persona’s frustrations and goals, I created a simple storyboard to depict how the mobile app would eliminate her painpoints and create a solution to improve her experience. We start with Megan getting to the ice cream shop only to notice a long line that extends out the door. After a moment of frustration, she opens the new mobile app to realize she can now not only see the menu before she enters the shop, but she can also browse by category, take a quiz to help pick a flavor, and even order ahead for in-store pickup in the future.
Mid-Fidelity Wireframes
Based on the usability testing I conducted on my low-fidelity Marvel paper prototype, I found that having a home button and a hamburger menu on most screens would make navigation between screens easier for the user.
I then built and tested my mid-fidelity wireframes and got more valuable feedback to incorporate into my high-fidelity prototype. One user got confused based on the naming convention of the flavor selection quiz and two others were not easily able to navigate to the Sign In screen, so I knew I had to adjust the microcopy for these buttons to be more clear.
High-Fidelity Wireframes
After incorporating the updates from testing, I designed the UI elements using my style guide and created the high-fidelity prototype. I kept it minimalistic and incorporated playful geometric patterns using my color palette to make the UI vibrant and inviting.
