In this case study, I present the concept design of an Indian restaurant takeaway service's digital interface. With a focus on enhancing the user experience, I conceptualised the name, branding and implemented a ui/ux approach to the web design.
The project involved a complete overhaul of the color scheme, imagery, typography, and page layout to better reflect the vibrant and rich culinary heritage of Indian cuisine. The goal was to create a seamless and engaging online ordering experience that not only captures the essence of the restaurant’s brand but also meets the needs and expectations of modern users. This case study details the design process, challenges faced, and the solutions implemented to achieve a cohesive and impactful website.
Define
Geography
Since this is a local business the location would be in the inner city of Liverpool, United Kingdom. This idea could be implemented in most large cities across the United Kingdom as Indian food is a popular choice of cuisine.
Goal 1 Design a visually appealing and intuitive website with s simple checkout and delivery service
Goal 2 Provide a service which offers healthier alternatives to fast food
Goal 3 Increase purchasing and increase customer loyalty
Target Users and Demographics
Outline of Scope
Content Requirements
Content Food menu with images and food prices
Content Information about delivery locations
Content Phone number and email address
Content Delivery charges, allergies, minimum order and average duration of delivery
Content Order Summary
Functionality Requirements
Function 1 Users are able to check if the restaurant can deliver to their desired address
Function 2 Users are able sign in or set up an account for faster checkout
Function 3 Users are able input their payment and delivery details
Function 4 Users are able to check the status and track their delivery
Function 5 Users can cancel within the first minute of ordering
Research
User Personas
Competitive Analysis
Key Takeaways and Strategic Recommendations
Enhance Product Listings
Provide detailed descriptions, ingredient lists, and sourcing information for each product.
Expand Product Range
Continuously update the product range to include new, innovative, and seasonal items that meet customer demands
Strengthen Online Presence
Enhance website SEO to improve visibility on search engines, targeting keywords related to sustainable living, eco-friendly products, and holistic wellness.
Enhance Customer Experience
Ensure the website is mobile-responsive, easy to navigate, and fast-loading. Implement features like product reviews, ratings, and a robust search function.
By incorporating these key takeaways, Spice Symphony can effectively compete in the market, attract a broad customer base, and ensure long-term success.
Information Architecture
Sitemap
Wireframes
UI Design
Moodboard
Created the brand's visual identity, incorporating the chosen color palette, typography and imagery.
Mockups
Re-brand
I chose to redesign the interface using a completely different look, encompassing new colors, pictures, typography, and page layout, to significantly enhance the user experience and better reflect the brand’s core values and identity. The previous design was cluttered and visually outdated, which detracted from the overall user engagement and functionality. By implementing a modern, cohesive color scheme, high-quality imagery, and contemporary typography, I aimed to create a more visually appealing and accessible interface.
The new interface is intuitive and user-friendly, allowing for smoother navigation and a more organized presentation of content. This holistic redesign not only modernizes the aesthetic but also ensures that the interface is more engaging, efficient, and aligned with current design standards, ultimately providing a more enjoyable and effective user experience.
Moodboard
Visual Changes
The images originally chosen felt too busy against the text. I needed to put content at the top of my priority when designing so with that in mind I chose stock images that I felt would better compliment and enhance the text rather than clash with it. This is most apparent in the homepage.
Colour Scheme
I wanted to keep the red and grey colours chosen when I first started the design process. Red was significant of the spices and the rich flavours of the currys and dips. It’s a colour symbolic of warmth, passion and energy which perfectly encapsulates Indian cuisine. The reason I kept the grey was purely for harmony - black and white are too harsh so I went with a pigment in between the two extremes. In this new design I toned down the pigment of these colours so it wouldnt look too busy with the imagery and content.
Typography
Futura was the typeface I chose in the first mockup but I just wanted to strip away any stylized type and keep it clean. Manrope - was necessary in achieving a minimal look. Also with multiple lines of content I thought it was easier on the eyes to read thus making for a better user experience.
Content Layout
Looking for more inspiration of websites offering similar services in the area, I came across Bundobust - a cheap, vegan Indian restaurant. I really liked the innovative way users could read the description of the food once tapped on the food image. I thought it made for great interface design as it made the menu just focus on the imagery of the food. It didnt feel like they were ‘breaking-the-wheel’ as it felt quite natural, quick and easy to understand that this is the action required to view the description making for great user experience.
Usability Testing
Users were overall very pleased with the design - they found the prototype easy to navigate but there were a few changes that needed to be made:
the logo wasn't easily conveyed - it need to be reinforced with Spice Symphony
The trash/delete icon needed to be smaller to dull the desire to do just that
considering this is a small business and not a chain, implementing a live tracker much like Uber eats would be very costly. After doing some more research the common trend with independent hospitality businesses was to send out a text message once each step of the delivery process was completed - for example ‘food is being prepared’ and ‘delivery is on the way to you’. Implementing this instead of a live tracker would be a much more viable cost-wise to implement.