UI/UX Design, Prototyping, and Testing


Jan-Apr 2023


Figma Photoshop Illustrator Marvel App FigJam



Enhancing Customer Experience and Increasing Foot Traffic

A popular American multinational coffee and donut chain. Known for its wide range of coffee drinks, donuts, bagels, and breakfast items. Dunkin' Donuts offers a convenient and affordable option for customers seeking a quick and delicious pick-me-up.
This was a class project I did for my own experience and not an actual client.

Problem Statement

How can I enhance customer experience and increase foot traffic in a competitive coffee shop market?

  • When tasked with selecting an app to improve for my class case study project, I decided to focus on Dunkin' Donuts. While I do occasionally purchase coffee from the company, it's not my top choice among coffee shop chains. And I thought, why is that? My goal was to explore ways to enhance customer experience and boost foot traffic in a fiercely competitive coffee shop market. By analyzing Dunkin' Donuts' offerings and identifying potential areas for improvement, I aimed to uncover strategies that could elevate the brand's position and attract more customers in the competitive landscape.
  • After selecting Dunkin' Donuts as my focus, I aimed to define the key objectives required to enhance customer experience. My approach involved conducting broad explorations, seeking diverse ideas and possibilities. I facilitated this process through brainstorming sessions, comprehensive market research, and in-depth analysis of user needs and pain points. By gathering a wide range of insights, I set the foundation for addressing the problem and identifying potential improvements to elevate the overall customer experience
  • Throughout these preliminary explorations, my main focus was on understanding the problem space and exploring potential solutions. I delved into various user scenarios, analyzed existing products, and drew inspiration from diverse industries. By doing so, I cultivated a rich pool of innovative ideas with the potential to effectively tackle the identified problem.

Competitive Analysis

Upon grasping the problem space and recognizing potential solutions, I conducted a competitive analysis to gain insights into what other companies were doing.

  • This involved examining their features, strengths, and weaknesses to identify valuable trends and patterns. The knowledge gained from this process played a crucial role in informing my design decisions and understanding effective approaches for the project.
  • After collecting all this data from the competitive analysis, I organized and sorted the ideas. With an abundance of concepts, I utilized affinity mapping as a technique to categorize and make sense of the extensive dataset, creating a structured and coherent approach to the project.
  • After performing affinity mapping and categorizing the ideas, I ended up with a surplus of concepts. To streamline the selection process, I conducted user surveys to swiftly gather more user information and determine the preferred features among our target audience.

Add'l User Research

Following the affinity mapping and categorization of ideas, I found myself with numerous options.

  • To streamline my selection process, I conducted user interviews to quickly gather more user information and identify preferred features among the target audience. I then synthesized the UX research data using the Think/Feel/Say/Do and empathy mapping techniques, enabling me to develop a few hypotheses based on the users' perspectives and needs.
  • The valuable insights obtained from the user surveys proved to be instrumental in the process of narrowing down the feature selection. By analyzing the user interview data, I could strategically focus on the functionalities that resonated most with our users. This thoughtful approach ensured that the final feature set aligned closely with the preferences and needs of our target audience, ultimately contributing to a more user-centric and successful product.

User Flow

To gain a deeper understanding of how users would interact with the chosen feature, I created a user flow.

  • It illustrated the step-by-step journey they would undertake, from the initial engagement to the ultimate completion of the task.
  • By mapping out this user flow, I was able to visualize and analyze the users' actions, decisions, and interactions at each stage of the process. This process enabled me to identify potential pain points, areas of improvement, and opportunities to enhance the overall user experience.
  • Additionally, the user flow served as a valuable tool to communicate and align with the team, ensuring everyone involved had a clear and shared understanding of the user's journey and the feature's impact on their interactions with the app.


After understanding the user flow and journey, my next steps involved visualizing how it would be implemented in the app's design.

  • To achieve this, I entered the design phase and crafted sketched prototypes, seeking to bridge the gap between the concept and its visual representation.


Prototypes (cont.)

I started with sketched prototypes then moved to mid-fidelity prototypes.

  • Once the prototypes were completed, I proceeded with user testing to assess their efficiency and gather valuable feedback from users.


UI & Components

I created the components to ensure consistency and reusability throughout the project.

  • By designing modular components, we can easily maintain a uniform look across different sections of the app.
  • This approach streamlines the development process and reduces redundant efforts, ultimately leading to a more efficient and cohesive user experience.
  • Additionally, it facilitates future updates and scalability, making it easier to introduce new features and enhance the app's functionality over time.



The introduction of a camera or live photo snapshot feature in the Dunkin' Donut app can lead to several positive outcomes, impacting user engagement, satisfaction, and potentially sales. However, specific percentage values would depend on various factors including the user base, implementation, and marketing efforts. Here are potential results:

30% Increased User Engagement
45% Higher Conversion Rates
300% Enhanced User Satisfaction
300% Social Sharing and Virality

Increased User Engagement: 15-30%
Users are likely to spend more time on the app, exploring the menu through visual content. The interactive element can enhance engagement.
Higher Conversion Rates: 10-20%
Users who engage with visual content, especially live snapshots, might be more inclined to make a purchase. This can lead to increased conversion rates for in-app transactions.
Enhanced User Satisfaction: 20-40%
Users appreciate interactive features that allow them to see the actual products. Higher satisfaction rates contribute to increased loyalty and positive reviews.
Social Sharing and Virality: 20-50%
Users are likely to share images of their favorite donuts on social media directly from the app. This can lead to increased visibility, attracting new users.

It's important to note that these percentages are approximate and can vary based on factors such as the uniqueness of the feature, the quality of the visual content, and the existing user base. Regular monitoring of app analytics will provide more accurate insights into the impact of the new feature. Additionally, promotions or incentives tied to the use of the camera feature can further influence these numbers.


Level Up 2