everMenu
A mobile solution for enhancing menu management using QR-coded digital menus, empowering businesses to effortlessly create, update, and distribute their menus.
DELIVERABLES
Prototype
ROLE
Sole Designer
TOOLS
Figma
Marvel POP
Miro
Adobe Creative Cloud
Google Forms
DURATION
5 Months
TL;DR
everMenu, developed over 5 months, simplifies menu management for service industry professionals. The user-friendly platform, guided by a sole designer using Design-Thinking, addresses challenges from unclear interfaces. Thorough research, empathy mapping, and usability testing led to refined high-fidelity Figma prototypes, emphasizing a human-centered approach, iterative design, and clear navigation. Successes include user-centric focus and iterative design, with key learnings emphasizing the importance of thorough research and balancing customizability with efficiency.
BACKGROUND
Overview
During the pandemic, I noticed a common challenge among service industry professionals: the transition from physical menus to online platforms using QR codes. While I could easily adapt, many colleagues struggled due to limited tech knowledge. This inspired me to develop everMenu, an online menu creation tool. It not only allows professionals to create digital menus but also generates QR codes for easy sharing or printing.
Challenge
The primary challenge was enabling service industry professionals to effortlessly generate user-friendly digital menus and corresponding QR codes, all while circumventing common issues like steep learning curves and unclear, unintuitive interfaces.
Role
In my capacity as a service industry professional specializing in UI/UX, I undertook sole responsibility in the development of this application that is specifically designed to cater to the unique needs and demands of service industry professionals. With a deep understanding of the industry and its intricacies, I ensured that the application would meet their specific challenges and empowers them to excel in their respective roles.
Project Process
I adopted a Design-Thinking methodology to carry out this project, which involves a non-linear iterative process consisting of five steps that foster collaboration between users and designers. This solution-oriented approach is highly effective in resolving issues.
EMPATHIZE
User Surveys
To initiate the research, I opted to engage directly with the target users. I conducted surveys within the service industry and carefully selected five participants out of thirteen for in-depth interviews. The objective was to identify individuals who could offer valuable insights into needs, preferences, and challenges. Through strategic questioning, I pinpointed candidates possessing relevant service industry experience, menu creation expertise, and familiarity with QR coded menus.
Olga Barovyk
User Interviews
The user interviews involved participants from the service industry sharing insights on QR code and traditional physical menus. Key points encompassed the efficiency and health benefits of QR codes, design and interaction preferences for physical menus, user-friendliness of QR code menus, mixed customer sentiment, and the value of QR code efficiency after adjustment.
Common themes emerged: efficient QR code ordering, customer preference for physical menus, and the significance of visual aesthetics in QR code layouts.
Challenges included: inadequate QR code layouts, small text, and confusion when referencing QR code menus.
DEFINE
Affinity Map
After conducting interviews, I needed to analyze and synthesize a lot of data. I used sticky notes to organize participants’ thoughts logically, revealing recurring themes like common issues, customer needs, and desired features. This process guided feature integration and workflow optimization, enhancing the user experience for creating and sharing QR coded menus.
Empathy Map
After reorganizing the data, I utilized an empathy map to enhance my understanding of the users’ personalities, behaviors, concerns, and needs. This process enabled me to generate ideas that would effectively cater to the user’s needs once I had gained a deeper understanding of their perspective.
Defining the Problem
After constructing empathy maps, I identified key user tasks and primary challenges. Using this insight, I set up a JTBD (Jobs To Be Done) & HMW (How Might We) framework. This approach guided my focus on understanding the core problem of designing a solution for seamless menu creation and QR code generation.
JTBD
Job Performer:
Service Industry Professional
Main Jobs:
Create Online Menus, Generate Menu’s QR Codes
Related Jobs:
User customizable templates.
Integrate online payment methods.
Integrate inventory management in application.
Emotional Jobs:
Not feel frustrated by unintuitive methods.
Social Jobs:
Create a user experience customers will enjoy using.
Circumstances:
When the user has little experience or no direction in creating menus and generating QR codes.
HMW Statements
1. How might we help with the creation of QR menus for the novice?
2. How might we integrate online payment ordering in QR menus?
3. How might we integrate inventory management into QR menus?
4. How might we help users apply branding/customization with QR menus?
5. How might we improve the customer’s experience with QR menus?
IDEATE
User Stories & Map
Once the problem was defined, I now needed to start defining the required design and development steps, emphasizing integration. Utilizing a user story and mapping, I visualized the unified flow and connections within the virtual platform. This approach offered insight into data flow and its interconnections, leading to a holistic understanding of tasks such as login, menu creation, editing, and publishing.
Sitemap
I synthesized the data flow and tasks into a coherent sitemap. This provided a clear roadmap for developing the required screens for the users’ tasks. Crafting the sitemap empowered me to strategically arrange and identify the essential screens, ensuring that the platform efficiently fulfills its required tasks.
User Flow
Once I grasped the overall map of the virtual platform, my next step was to formulate user flows for essential tasks using red routes. Employing user flows, I crafted four pivotal red routes that played a crucial role in the platform’s functionality: New Menu Creation, Existing Menu, Login, and Publish Menu. Linking these flows together enabled the creation of a coherent and rational task progression for users to follow while maximizing efficiency while navigating through the sitemap.
Sketches to Wireframe
With a well-defined virtual workflow, I initiated the creation of low-fidelity sketches for the necessary platform pages. This method enabled rapid screen design, offering artistic flexibility and creativity.
After finalizing the initial sketches, it became imperative to transition from abstract concepts to a polished and organized framework. The wireframes became a vital element to facilitate visual feedback throughout the development phase, enabling me to streamline the user task flow by organizing the screens into coherent user journeys.
PROTOTYPE
Final Design
In the penultimate stage, I utilized the gathered information to create screens based on wireframes, setting up red routes for essential tasks like logging in, generating a new menu, and printing a menu. The aim of this interactive prototype was to evaluate usability through user testing before design finalization. Testing a functional prototype was essential for gathering valuable feedback and taking usability test notes, allowing for iterative platform enhancements.
TEST
Usability Testing
We conducted controlled user testing using high-fidelity Figma prototypes to assess platform usability and design. Five users from the survey pool performed tasks with the prototype. Design and interface adjustments were made based on initial testing results.
Objective:
- Evaluate current prototype’s functionality and user task completion.
- Assess task efficiency and usability.
- Identify prototype usability issues.
- Confirm essential functions are present.
Testing Questions/Tasks:
- Evaluate prototype usability.
- Assess if essential functions serve the purpose.
- Suggest enhancements for functionality and usability.
- Tasks include defining templates, creating menus, adding businesses, and more.
Testing Methods:
- Five in-person moderated usability tests.
Participant Profile:
- Ages 18+
- Service Industry experience.
- Regular mobile app users.
Usability Test Reports
We conducted in person, controlled user testing using high-fidelity Figma prototypes to assess platform usability and design. Five users from the survey pool performed tasks with the prototype. Design and interface adjustments were made based on initial testing results.
Usability Test Round 1:
Issue #1: Vague understanding of icons initially.
Result:
3/5 users correctly understood icon meanings.
2/5 users guessed 2 or fewer icons.
All users understood after completing tasks.
Issue #2: Difficulty finding print menu function.
Result:
1/5 users navigated to “Publish” icon for print.
2/5 guessed “Publish.”
2/5 saved menu, reaching “My Menu” page.
Issue #3: Lack of back/return on some pages.
Result:
1/5 users couldn’t return, highlighting a significant issue.
Importance of addressing this concern.
Issue #4: The importance of the “My Business” page.
Summary:
2/5 users accidentally accessed “My Businesses” instead of “My Menus.”
1 user questioned the importance of the “My Businesses” page since it caused some confusion from accessing the menus.
Usability Test Round 2:
Issue #1: Vague understanding of icons initially.
Result:
All 5/5 users correctly understood icons.
Solution:
Introduction page improved icon understanding.
Issue #2: Difficulty finding print menu function.
Result:
4/5 users navigated to “Publish” for print.
1/5 navigated using hamburger menu after exploring.
Solution: Adding print to hamburger menu enhanced clarity.
Issue #3: Lack of back/return on some pages.
Result: 1/1 users used back button to correct mistakes.
Solution: Back button addition corrected accidental clicks.
Issue #4: Importance of “My Business” page.
Result: 0/5 users questioned “My Business” page.
Solution: Introduction screens clarified its purpose.
REFLECTIONS
POST-MORTEM
The everMenu case study demonstrates the effectiveness of a user-centric design approach in addressing real-world challenges. Its success lies in empathetic research, iterative design, and continuous user feedback, resulting in a user-friendly platform that simplifies menu management for the service industry. The case study’s insights provide valuable lessons for future projects and improvements to everMenu itself.
Successes
- Human-Centered Design Approach: Employed a user-centric design thinking methodology to address the challenge effectively, ensuring the platform catered to user needs.
- User Research: Conducted thorough secondary and primary research to identify user pain points and preferences, leading to informed design decisions.
- Empathy Mapping: Utilized empathy maps to understand users’ personalities, behaviors, and needs, enabling more targeted design choices.
- Clear Objective Setting: Established a clear objective for usability testing, ensuring focus on functional and task-related aspects of the prototype.
- Iterative Design: Adopted an iterative approach, refining the design based on user testing outcomes and addressing issues systematically.
- User Testing: Conducted controlled user testing sessions, leading to valuable insights and improvements in the prototype’s usability.
Challenges
- Internet Connectivity: While the platform provides a user-friendly solution, addressing challenges related to internet connectivity for seamless access to menus in areas with weak connectivity could enhance its practicality.
- Feature Integration: Integrating additional features like inventory management and online payment, as suggested by user feedback, could be complex and may require careful development and testing.
- Clarity on “My Business” Page: Some users questioned the significance of the “My Business” page. Further refinement in its purpose and clearer linkage to “My Menus” could enhance its utility.
KEY LEARNINGS
- Research Depth: Thorough research is foundational to understanding user needs, behaviors, and preferences accurately.
- User-Centric Focus: Continuously prioritize users’ needs and preferences throughout the design process to ensure a user-friendly product.
- Iterative Approach: Regular testing and iterations based on user feedback lead to enhanced usability and user satisfaction.
- Clarity in Navigation: Clear navigation and intuitive icons are crucial for user engagement and task completion.
- Balancing Customizability and Efficiency: Striking the right balance between customization and user-friendly efficiency is essential for an optimal user experience.
MORE CASE STUDIES
Tiny Tales
