Role
UX Research
UX Designer
Tool
Pen & Paper
FigJam
Canva
Figma
Duration
06.2024 to 08.2024
- Streamlined Ordering and Customization Experience -
Users often faced challenges with coffee ordering apps, struggling with complicated menus, confusing customization options, and difficulty in reordering their favorite drinks. They found it frustrating to navigate through cluttered interfaces and were unsure if their customizations were properly selected. The process of interacting with staff for every detail added to their inconvenience.
The Hookah Café app was developed to address these issues directly. By simplifying menu navigation and providing clear, user-friendly customization options, the app allows users to easily browse, select, and personalize their coffee orders. With features like streamlined reordering process, users can now confidently customize their drinks and manage their orders with ease, eliminating previous frustrations and enhancing their overall coffee experience.
01
Easy Navigation and Intuitive Design.
03
Easily Personalize and Save Your Drink Preferences
02
Effortlessly Transition from Home Screen to Drink Customization
- Research -
With many café ordering apps already available, I wanted to create something truly different—an app that genuinely puts the user at the center. Instead of jumping directly to the ideate phase, I prioritized understanding the real pain points users face when they want to order. This approach ensured that the app would effectively address user needs and provide a superior, user-centered experience.
Interview
I began by understanding the challenges users face, so I conducted interviews with five individuals who regularly order coffee and visit cafes. To gain a comprehensive understanding, I selected participants of different ages, ensuring diverse perspectives. I consciously avoided biases and crafted open-ended questions, allowing participants to freely share their pain points and experiences with similar apps. This approach enabled me to gather genuine insights and identify the core issues that needed addressing.
Creating Persona
Based on the interviews, I created two personas that reflect key user needs and behaviors. I identified that customizing drinks, reordering customized drinks, and tracking orders were central tasks for users. Additionally, I observed the necessity for easy and quick steps throughout the ordering journey.
Problem Statement
I crafted a problem statement to clearly define the key issues users faced, focusing on the challenges of customizing drinks, reordering, and tracking orders, and aiming to streamline the ordering process
User Flow
I designed the user flow to guide users through the entire process of ordering a customized drink: from selecting their drink and customizing the options to reviewing their choices and completing the order, ensuring a smooth and efficient experience.
User Journey Map
For the user journey map, I documented the entire experience of ordering a coffee, capturing each step from the initial app interaction to receiving the customized drink. This included the user’s actions, emotions, and pain points at each stage, helping me identify opportunities for improvement and ensure a seamless and satisfying ordering process.
- Design -
Sketching with pen & paper
Entering the design phase, I took into account all the insights I had gathered, including user personas, their pain points, and the new user flows. I began by roughly sketching out concepts to start visualizing the design.
Low-Fidelity Design
In this phase, I created low-fidelity wireframes to outline the basic structure and layout of the app. These initial sketches helped visualize the design, focusing on key elements and user flows without getting bogged down in details. This step was crucial for iterating on ideas and ensuring the app’s functionality aligned with user needs.
High-Fidelity Design
After finalizing the low-fidelity wireframes, I progressed to creating high-fidelity Design. These detailed designs incorporated visual elements, branding, and refined user interface components, bringing the app closer to its final look and feel.
From the home page, I thought it would be easier if users could directly customize their drinks, so I added a button.
Here, the user can choose from two tabs: Hot or Cold Drinks.
Real-time order tracking will be available so users will know how long they will have to wait.
I tried to make it as easy as possible to customize drinks so the user won’t be frustrated.
- Prototype -
Dive into the Hookah Café app prototype and see the seamless user experience in action! Click on the Image Below to explore my interactive design on Figma and discover how effortlessly you can customize and order your favorite drinks.
- Evaluation & Iteration -
After I finished the prototype I made a usability study, Participants were selected to include three current clients of the Hookah café and one individual who is a regular visitor to various cafés, ensuring a mix of familiarity with the specific café and general experience with café environments.
The participants consist of two males and two females, age from 20 to 55
I offered for them a free meal with drink.
I assigned them specific tasks to complete and then asked some open-ended questions to gather their feedback. I also aimed to remain unbiased and open throughout the process.
Some of the questions I asked after they finished the tasks included:
• How easy was it to navigate the app and find the menu items?
• How would you rate the overall ease of placing an order using the app?
• What did you like least about the app?
• Do you have any suggestions for improving the app?
So Based on the usability study I made some Iterations
there was no option to delete individual products; users could only delete all items at once. To address this, I added an interaction allowing users to drag an item to the right to delete specific items they don’t want.
- Visual Design -
In designing the visual elements of the Hookah Café app, I aimed to capture the warm and inviting atmosphere of the café itself. I selected the SF Pro font for its clean, modern look, ensuring readability and a smooth user experience. The color palette, featuring rich browns and soothing beiges, was inspired by the café’s interior and the creamy hues of milk, creating a cozy and familiar feel that resonates with coffee lovers. This thoughtful combination of typography and color not only enhances the app’s aesthetics but also reflects the essence of the café, making users feel right at home.
- Future Steps -
As I look ahead, my goal is to continuously enhance the Hookah Café app based on user feedback and evolving technology trends.
Personalized Recommendations
Implementing AI-driven recommendations to suggest drinks based on user preferences and past orders.
Loyalty Program
Introducing a rewards system to encourage repeat orders and build customer loyalty.
Enhanced Customization
Expanding customization options to include seasonal and limited-time flavors.
Social Integration
Adding features that allow users to share their favorite drinks and orders with friends on social media.
- Reflection -
I am proud of the journey from understanding user pain points to creating a user-friendly and visually appealing app. Through rigorous research, thoughtful design, and iterative testing, I was able to develop a solution that truly meets the needs of Hookah Café’s diverse clientele. I took special care to ensure accessibility, considering aspects such as color contrast to make the app usable for everyone. This project reinforced the importance of user-centered design and the power of empathy in creating digital experiences that resonate with users. I am excited to see how the Hookah Café app evolves and continues to delight its users in the future.
