Web responsive restaurant discovery platform with a mobile first approach
In a highly crowded market, it’s difficult to stand out. What I learned after examining the market, is how the discovery process can be improved with an element of gamification - especially for the indecisive user. And the positive effects of adding celebration and personality into key processes.
*Real World Project
Napita, a start-up restaurant discovery platform. Planned to launch in London end of 2020.
Aiming to show the best what the city has to offer when it comes to food, starting with the minimum rating of 3 stars.
James Pearson, Jordan Smith, and Aleksandra Srna
Ideation, UX Researcher, Interviewer, UX Designer and UI Designer
Market Research, User Research, Information Architecture, User Interviews, Prototyping and User Testing, Interface Design, Low to Mid-Fidelity Prototype, Final Presentation Layout
Pen and paper: Wireframe
Sketch App: UX - UI Design
InVision App: Rapid Prototyping
Adobe Illustrator: Visual Design
Marvel: Prototype User Testing
Miro: Collaboration Platform
A passion for food that started off as a blog, slowly began to expand into a discovery platform for food enthusiasts. When we were given the brief to create a responsive website for Napita, the stakeholder had developers working on the site simultaneously. As it was in the early stages of development, the stakeholder was really excited to finally include a UX team into the process. It was clearly communicated from the start that we wouldn't have the chance to meet the developers, due to time constraints. Instead our findings would be implemented into the development of the site with the launch set end of the year.
Being introduced to the project during Covid-19 lockdown, meant that we had to adapt to the current situation and shift focus from dining out to delivery, take-away and dining at home experience.
Read recommendation from the client
All foodie lovers know the frustration before trying to dine at a new place, we often rely on family and friends and social media for inspiration, feedback, and information on what to eat and where to go. This can be both times consuming and frustrating when you always have to rely on second and third-party sources when you have high expectations on your dining experience and you want to access the information quickly.
How might we make a smooth and intuitive search and discovery process for the user to find the right restaurant.
How might we provide a simple and inspiring way for users to choose menu items for take-away or delivery.
Solutions and Goals
We created an experience that gives the food lover a fast way to access previous orders, select new with filters that help narrow down the search. My goal was to create a product that will inspire the indecisive user, with a random restaurant generator as an element to help discover cuisine recommended by Napita when you're just low on inspiration or simply curious to try something new.
After a few days into the project, I realised that the flat management structure within our team wasn't going to help us move the project forward and complete the deliverables we had set in the shared Trello Kanban. I took on the role to lead the team with daily stand-ups at the beginning and the end of the work to share where we are and what we accomplish on the day. This kept everyone involved and aware of who is currently working on what task. During the design studio, I came up with the idea of implementing a gamification element - the randomizer wheel, which was highly appreciated by the client and received great feedback from user testing. I designed from low to mid-fidelity and used the shared platform Miro that kept the whole team involved during the process of prototyping.
My Key Deliverables
Problem Statement, UX Competitive Analysis, Content Audit, and User Stories.
Participated in the Design Studio with the company stakeholder to include them in the design process and collectively create a vision for the outcome of the brief.
Created low-fidelity to mid-fidelity wireframes for testing.
Ran a number of user testing sessions and iterated my designs from the insights gained.
Ideated potential solutions to problems beyond the brief.
Implementation of a randomizer gamification element, as an option in the discovery process.
Implementation of celebratory confirmation of payment, at the end of the payment process.
Low - High Fidelity Prototype showcasing the journey from discovery to payment.
Simplification of the logo in the presentation material and the gamification element inspired the client to rethink their logo design.
My Key Learnings
What tasks are most worthy of motivation and celebration.
How to take the lead in a flat management structure.
Communicating research findings to the client to keep them informed about the design direction.
How to effectively convey to stakeholders that deviating from the main objectives, based on the research findings, is better suited for the best outcome.
How to put together clear and detailed final deliverables to the client.
How to prioritize deliverables to ensure the client gets the best possible outcome.
Focus on the bigger picture - The MVP. After conducting competitor analysis, the challenge was to get rid of the urge to incorporate "nice to have" features the established sites have and just stick to the "must-haves".
What appeared to be a simple task (the landing page and selection of filters) required most research and user testing.
After the first meeting with the client, we assumed there were only a few tweaks to be done, when in fact it was like opening a can of worms. Despite that, the client had hi-fi screens for a Napita app version and these were available for us to use, (before the client changed direction towards a responsive website) we decided to start from scratch and focus on the foundation based on our findings. I'm happy that this was my first real client project, I had expected to have achieved more, but the client really appreciated the experience and the deliverables we handed over.
Motivate and Celebrate
Product experiences are often optimised to make it simpler, faster, and more delightful for users to find value. During this project, I learned that building a long-term engagement and getting users to want to complete tasks again and again, also requires celebrating task success. Feedback from second last user testing, about how dull confirmation messages tend to be, made me think of the Mailchimp confirmation screen - with the monkey giving a high-five. This not only confirms a very important user action but does so in an awesome and distinctly brand-aligned way. As it was a last-minute implementation, I was happy that we managed to add a celebratory action, with motion design as payment confirmation. Just in time for the final hi-fi user testing.
The overall feedback was very positive as it made every user smile when completing the task. This made me realise that too often, products motivate without celebrating which can leave the user wondering whether or not the effort they put into the product was worth it.
For Napita, due to time constraint, we used some basic confetti, as I was eager to have it tested. Even though it was positively received, it would require further work and research to make it aligned with Napita's aesthetics.
Locate where the locals eat by searching within a specified radius and having more professional suggestions without interrupting the primary experience.
Further research into the use of the word ‘foodie’. From initial interviews, participants would not associate it as they found it an elitist or an intimidating word.
Ways to extend the restaurant experience to an at-home environment. Collaborating with the business to make the diner feel that they are at the restaurant when they are not.
Connecting with other Napita users with engaging social elements.
Incorporating group setting, ways users can share links, bookings, and payments.
Dive further into how users would want to interact with the mystery wheel and how to tailor it according to the user’s needs.
Further research and user testing on the payment confirmation aesthetics, without backing down from Napita's brand personality.
***Note - The graphical assets utilised in this Case Study are the collective work of the group as a whole. ***
The Final Product - High Fidelity Prototype
The randomiser wheel
My team mate, James, implemented motion design using Principle. We felt it was important to give the client and the developers an idea how users would integrate with the elements.
The prototype shows the happy path of the task we used during user testing:
As a returning user to the Napita site, you are having 3 friends over for dinner and you have all decided to eat pizza at home.