MangoPlate: App Redesign
Re-envisioning Eat, Share, Be Happy
Role: UX/UI, Mobile
Project: Application Redesign
Timeframe: November 2018
With hopes to better the search experience for all foodies out there (myself included!), I decided to redesign Korea’s very own crowd-sourcing application for discovering local and surrounding restaurants.
Analyzing user tasks in every day context to create viable solutions.
During my time studying aboard in Korea, where delicious, cheap food is all the rave and my 2nd grade language proficiency is too limited for Naver blogs on trending restaurants, I’ve grown increasingly dependent on MangoPlate to show me the number one go-to spots for good eats.
Too many times, though, I’ve found myself struggling to find exactly what I wanted, unable to draw points between my desired results and the interface at hand. I wondered if other users had similar experiences, and if so, what were the problems?
Content Audit
Breaking down the current interface.
As a relatively new user myself, I wanted to break down the current interface to do a heuristic evaluation and later compare the app’s features to how people expected them to behave and how they felt/what they did when they didn’t.
Find
This is the home page for MangoPlate and the primary mode of searching and discovering restaurants. Components here help the user refine their search and learn more about restaurants through pictures, reviews, ratings, and other relevant business information.
Picks
Content created by MangoPlate editors on different food places based on certain foods, moods, etc. Stories are shown by the latest curated and Top list showcases the stories that are trending or most viewed.
Add
Check in to a restaurant, write a review, or add your own restaurant. Doing any of these checks chosen restaurants as Beenhere (default is set to the option to mark as Wannago).
Feed + Profile
Reviews categorized by location. Can read reviews from the entire MangoPlate community or filter by those you follow or Holics (active members and contributors). Access your profile to see your own contributions and bookmarked items. Connect social media accounts like Facebook and Instagram or edit application related notifications and settings.
Task Analysis
How do users use the current system to achieve their goals?
Use Case Survey
To guide the focus of my research, I conducted a quick survey to see how and what people mostly used MangoPlate for. Responses from 70 users showed that most users used MangoPlate to search and find restaurants and sometimes write reviews. In favor of a more in depth study and because of this reason, I decided to narrow the scope of my redesign to the Find feature.
Task Analysis
After going back and doing a deeper critique on Find myself, I asked 3 frequent users and 3 new users to perform a few key tasks I thought best represented Find’s function as the app’s restaurant search engine. This way, I could capture new insights and see the overlap between both user demographics. It was helpful to see, even with certain expectations, how the returning users reacted when things did not turn out as they planned them to and what steps they took to resolve those issues.
Each participant completed 8 tasks into total, following a step-by-step that ranged from basic to complex tasks. I measured each task based on the success (direct success — 3, indirect success — 1, failure — 0), perceived difficulty ( 1–7, 7 being Not Difficult at All), and time required to complete the task. The Overall Score = Success + Difficulty, giving us a maximum possible score of 10.00.
After, I compiled the data for all users and showed the average results. The low average is 4.33, giving me an idea of what part of the flow to focus on most when redesigning. I also gathered qualitative feedback based on 5 different scenarios I gave the users to do. Here, I asked users to openly voice their thoughts as they went about completing the scenario.
- Reserve a dining space for about 15 people at an Italian restaurant with a budget of around $30/person. Find a restaurant near you that matches all these characteristics.
- Find 5 bars or lounges in Itaewon you’d be interested in to throw a surprise party. Look through pictures and reviews to find one that looks the most fun and casual.
- Use MangoPlate to find out if the viral burger chain, Cry Cheese Burger is open at 3:00pm on Tuesday.
- It’s late night and you’re craving fried chicken. Search to see if there are any chicken places in your area that are currently open and delivering.
- You are excited about a new restaurant you visited. Take photos of your meal and leave a review on your experience.
Compiling Takeaways
What are the existing problems?
Pulling together insights from the heuristic evaluation and task analysis, I summarized the pain points and key behaviors found at multiple stages of the user journey.
Inefficient Search
With Search being the primary call to action when discovering restaurants, users found a lack of constancy between what they were looking for and where they were looking for it.
Limited Sort by and Filter Options
Users felt their goals were not sufficiently supported by the Sort by and Filter options available to them. Ambiguous and app-specific word choice made for a disconnected experience and users wished more business-relevant categories were available to filter by.
Need for Guidance
Users took a particularly longer time searching for more particular things like Reviews or restaurants through Map View due to the lack of visual and textual cues. They wanted more feedback and reassurance that what they were doing was leading them to where they wanted to go.
Surface Relevant Information
Redundant actions clutter the UI and make users double think in fear that they will miss out on something important. Users felt lost in the process at times, feeling like they were going deeper and deeper in the application and wished for better prioritization of important call to actions.
Low Fidelity Prototyping
Ideation
Before mocking anything up, I went through and did a quick brain dump, grouping problems together and fleshing out ideas that could resolve them. I began sketching what these would like in the app and how they would work with the other components that remained the same.
Reiterating with User Feedback
Using paper prototypes, I went back to the same users and tested out several different designs to see which ones best mirrored a guided and predictable user flow and mitigated initial issues.
Final Designs
Combined Search and Location
In order to create a more coherent experience that mimicked restaurant searching in real life, where place and location go hand in hand, I combined Search and “You are now discovering” into one action. Suggestions for cuisine or restaurant types and areas pop up depending on whether you input food or location.
Expanding Filter by Options
Filter by now includes Sort by to eliminate toggling between the two and the option titles have been altered to be clearer. I’ve kept price, and in place of the cuisine types (which proved more useful in Search for initial search), have decided to add other business relevant filters that are more common in Korea: Open Now, Delivery, and Available Parking.
Guiding with More Relevant Information
Users can filter between different photo categories, whether it is of food, the menu, or the restaurant itself. More relevant information, like the price or how many people Wanna Go is shown in the restaurant specifics and I’ve also complemented the “Trending Nearby” with a reel on “More Places Like This.”
Accessible and Flexible Reviews
Create a distinction between All Reviews and Featured Reviews and guide users to access rest of the reviews. Add number rating to supplement food rating so users can speak upon whole experience. Make photo adding optional and not required.
Results
Measuring the impact of changes.
To ensure that the redesign delivered in the aspects we set to improve, I went back to the same users and asked them to redo the 8 key tasks I outlined at the beginning with the new designs (extended version in the works!). Compared to the first time around, both new and returning users said the new design made for a more coherent experience and helped complete 100% of their tasks without giving up. The average overall score increased by 1.86, from 6.37 to 8.23, and we eliminated any low scores. Average time taken to complete all tasks reduced more than 50%, from 4.33 minutes to 2.12 minutes.
Reflection
How the users use it matters.
As a MangoPlate user myself I was tempted to just generate my own interpretations and overgeneralize the problems at hand. Analyzing the tasks done in context guided me back to the users’ perspective, depicting what actions they took to achieve what they needed and showcasing what their actual needs were in the end.
Going back I would look at the lowest precent increases for scores, particularly for Writing Reviews and Reading Reviews. Because MangoPlate thrives as a crowd-sourced application, it would be imperative to the business to project these items better to users either by surfacing them earlier on, or making the call to actions more apparent.
Up next — Matchwork
If you find this article helpful, please 👏👏👏 so others can find it as well.
