Project Duration: 3.5 months
Platform: Mobile iOS
Software: Figma, UserTesting.com, Zoom
Contributors: Krystal Ebron, Maria Menendez Intriago, Jiae Oh, Ruhee Shah, Carolyn Yu
My Role:
Meet-A-Meal is more than just a restaurant social networking app, it helps introverts to find potential friends who have common interests. It aims to provide people with the opportunity to be united and have an enjoyable time and build a community through the Meet a Meal social dining experience.
Design Process
Discover
THE PROBLEM
When it comes to interacting with people, introverts tend to avoid large crowds and meeting new people. They lack of interest or desire to be around others often, which provokes loneliness and in some cases depression. All of this does not mean that they want to be lonely. Instead, they tend to open up with increased desire and willingness to share with others, if they are provided with the right platform where they feel comfortable and safe.
COMPETITIVE ANALYSIS
USER RESEARCH
6 interviews
We have conducted 6 in-depth user interview with introverts (we each conducted one interview). Each interview consisted of 11 questions addressing the objective. Based on the feebacks, we have collaboratively created the empathy map in order to gain deeper insights into our audiencce.
USER PERSONA
A user persona was created based on the research, including secondary research and interview feedbacks. It is the realistic and reliable representation of our key target audience, the introverts.
Design
MAIN FEATURES
CUSTOMER JOURNEY MAP
The following customer journey map has been created to tell the story of the users' experiences with our app across all touchpoints.
SITE MAP
A site map has been identified to reflect all the features of our app. The navigation is simple and straightforward, including 5 major functions - explore, chat, host, notify and profile.
Deliver
DESIGN SYSTEM
We together created a complete design system for the app with various design elements identified. The logo is a combination of a fork and shaking hand, inspired by the app name “Meet a Meal”. In addition, we set the brand voice to be “Welcoming, Engaging and Trustworthy”. I was in mainly in charge of selecting the color swatches to reflect this message – midnight blue being reliable and safe while sunshine yellow being friendly and accepting. Accessibility has also been tested to ensure high color contrast.
The full design system can be found here.
WIREFRAME & USABILITY TESTING
35 screens
6 usability testings
We have created wireframes for 35 unique screens in total, once the site map and design system being defined. In total, we created wireframes for 35 unique screens. I was in charge of creating the screens for exploring meets/restaurants and detail pages (7 screens in total).
After completing the wireframes, our team conducted 6 moderated remote usability testings via Zoom (we each conducted one). With 5 tasks, participants' performances on each task was manually scored using task completion rate, SUS score and comfortable scale.
The following are the problems identified through user testing as well as the potential solutions we came up with.
FINAL PROTOTYPE
After finalizing the wireframes with appropriate changes, we developed a set of high-fidelity prototypes that incorporated all of the research, analysis, testing, and iterations.
The full version of the prototypes can be found here.
Final Thoughts
WHAT I HAVE LEARNED/GAINED
Narrowing down our target audiences helped us to make the app better, as we added more features that were specific to introverts;
It was always preferred to have real usability testing and not assuming what they would like as we did for our icebreaker games;
Take advantage of the design system as it made it much easier for all 6 of us to work together on the prototypes;
I strengthened my design skills especially on Figma;
Working in a relatively large group taught me the importance of efficient communication and being a good listener.
“We tend to be distracted by the voices in our own heads telling us what the design should look like.”
— Michael Bierut