Oddle Eats: Revamp homepage
User Interface Design (UI) | User Experience Design (UX) | Mobile Application
Timeline: 1 week| Tool: Sketch . Figma . Photoshop
Oddle Eats — A newly launched Order delivery platform
This case study is carried out by my own. Is no way affiliated with the existing web service of Oddle Eats nor with any collaborators or related organisations, but an opportunity to learn more about revamp the UIUX research and design.
Background
Oddle Eats is a newly launched online food directory that connects directly with all 800+ food makers to all food lovers island-wide from the Order delivery platform — Oddle/Oddle Shop. Customers can discover and search their preferred cuisine in this platform also create their own food list for planning their future meals.
Challenge
Data has shown a high drop-off rate during the customer journey, with the landing page showing the highest bounce-off. Propose a recommendation in the form of concepts or UI solutions on how to improve it.
Product Overview
Strict deadline within 1 week. Conduct a UI/UX review of the Oddle Eats homepage and find solutions to improve the user experience and customer engagement on the site.
The process
In order to actually improve and differentiate from the apps, it was vital to get the right information from the beginning. The design went through several stages of understand, research, sketch, design and evaluate.
The clear structure and sequence of tasks helped develop a through understanding and provide a product with the user always at the centre.
Mission Statement
How might we improve the user experience and customer engagement of the Oddle Eats Website and Mobile App?
Heuristic analysis of the current website design (Homepage)
Poor website layout
As a customer who has just landed on the mobile web page, the above content does not attract me to scroll down the page to find more information. Delivery or pick up alone occupies the entire mobile web page.
Contents are not arranged to help improve customer engagement. Primary content are included in the mid-section or bottom part of the homepage, where a secondary content is being pushed up to the top of the homepage.
Icon design are not according to branding
The icons in the Highlight section does not follow a consistent theme with the Oddle Eats branding. Images used in the icons does not relate to the overall theme of the website.
Call to action button (CTA)
The Go to Shop CTA button is confusing, it directs the customer out of the Oddle Eats website.
No personalisation of content
Frequent customers who visit the website are not recommended new items based on their interest.
Too much interaction for viewing of homepage at desktop
The desktop version scrolling left and right is not necessary as it causes more hassle for desktop users.
Hidden reviews for restaurants
It takes a few steps to view the reviews for restaurants.
Identifying the Proto-Persona
After heuristic analysis of the current website design (Homepage). I began to identify the persona who would likely patronise Oddle Eats. And set my persona Curtis.
User stories
I started to write user stories for our prototype persona Curtis to understand her pain points and scope of the challenge.
User story 1
As a customer, I want to explore new restaurants that’s near me
so that, I can receive my deliveries quick and fast.
User story 2
As a customer, I want to receive recommendations based on my surfing habits so that, I can have a personalised experience and save my time while browsing the website and mobile app.
User story 3
As a customer, I want to know what are the promotions and new products of the month so that I never get bored and I can make better decisions and not miss any promotion items that interest me.
Prototyping
During my ideation stage, I started sketching the various ideas based on the different user stories using the mobile first approach.
Once I done my low fidelity evaluation for this stage. I start developed my designs further into high fidelity screens in mobile and desktop prototypes.
Ideate & Create
The website layout and structure are organised according to the main, secondary and tertiary content. Organising content in this way helps to prioritise content based on user needs and promotes customer engagement with a more friendly layout. The content that needs attention in each section is ranked higher in order of importance. I choose to display the information with proper structure and proper visual grouping to help users better understand the content of the page.
Improvements
Conclusion
Through this case study, I learned how to organised the new layout from the current website according to the main, secondary and tertiary content. At the same time, improve the navigation part for our user based on her desired. Provide more user friendly interface. I hope you enjoyed reading my ideas for the improve version of Oddle Eats!
