Role

User Research  & UI Design
Product Owner

Platform & Technologies

iOS, Android, Node.js, React

Your Palate, Your Rules

Nosh: an app designed to allow customers to design their meals through a visual interactive experience

The Problem

The current food ordering landscape, in general and particularly in Erbil as Nosh's initial market entrance, suffers from a critical lack of customization options. Existing delivery applications fail to provide a user interface that allows customers to personalize their orders, leading them to resort to direct calls to restaurants. Unfortunately, even this approach is riddled with limitations, as most establishments either lack customization options altogether or rely on their own delivery personnel. When minor modifications are available, communication gaps often result in incorrect orders being delivered.

Our Solution

Introducing a network of food brands that prioritize comprehensive menu customization, all operating from a shared open kitchen. Through our dedicated app, we enable effortless personalization across various culinary genres. To ensure convenient delivery, we integrate the APIs of major delivery apps into our platform, granting customers the freedom to receive their orders through their preferred service. As an initial initiative, we are launching the following brands:

Competitor Analysis

When conducting our competitor analysis, we discovered that local restaurants lacked their own delivery services and fell short on menu customization options for pizza, burgers, subs, and salads. Additionally, gourmet toppings were scarce, primarily limited to dine-in experiences rather than delivery. Instead, we shifted our focus to the two prominent delivery apps in Erbil and the larger region: Talabat and Lezzo. Our analysis centered around evaluating their features and the effectiveness of their UI/UX implementation. Below is a summary of our findings.

Note: The UI/UX ratings are on a scale of 1 (lowest) to 5 (highest) and indicate the quality of the respective app's user interface and user experience for the mentioned features.

Feature, UI/UX

Talabat

Lezzo

Order Customization

-

-

Order Tracking

5

3

Multiple Payment Options

-

-

Promotions/Offers

5

1

Guest Checkout

-

-

Automatic Sign-up w/ Email

-

-

Onboarding

5

4

Takeout option

-

-

Past Orders / Favorites

4

4

Rating / Feedback

4

3

Detailed Filtering

3

5

Web Application

-

-

Concept & Mindmap

Through multiple mind-mapping and brainstorming sessions of the founding team and several stakeholders who were aware of the concept, we explored a number of ideas, not just for the user experience but also for the business case as well. This helped us qualitatively to grasp a better idea of our goals and challenges, as well as serves as a foundation to curate better directed questions during our surveys and user interviews. Due to the visual nature of the app, a mobile-first design approach had to be taken.

Target Audience

Working professionals

Ages 18 - 45

Residing in Erbil who frequently order in their meals either at work or at home

Customers who due to the frequency of their orders and the uncertainty of trying new restaurants, customers crave a trusted establishment(s) that allows them to explore new dishes and combinations with each order.

Constraints

Efficient delivery to compete with larger competitors and API  integration with other apps

Initial user resistance to download an app for only a few restaurants

Visual representation of the customized meal in the smaller app screen relative to website

Limited project budget and timeline

Goals

Goal is to create a seamless experience on websites and phones (Apple & Android)

Separate web development for the website and native app development (or using Flutter)

Using FlutterFlow to develop the native outputs and web app with one code base

Utilize a combination of the above options to make sure it is cross platform

Survey

We conducted a survey of 30+ potential users of the app, and tried to diversify our participants' demographics - age, occupation, education, residence, lifestyle, marital status, etc. All participants had prior experience ordering food online at least once. Our survey questions revolved both around the digital user experience as well as the business concept of the idea. Here are some key metrics from the survey (multiple choice questions are represented in a bar graph while single-choice questions are represented in a doughnut chart).

How old are you?

do you use the tracking feature for your deliveries?

During what times do you usually order food?

How frequently do you order food on a weekly basis?

Select more than one if it depends on the week

Which delivery app have you used in the past month?

How have you paid for your food delivery in the past?

What device have you used to order your food from?

If you've ever ordered directly some any restaurant, what were the reasons?

User Interviews

To better understand our user needs and reinforce/revisit our assumptions, we came up with a list of questions, and conducted user interviews with 10 sponsored users. Similar to the survey, we attempted to choose our user pool to be from diverse background and demographics. The user questions and key insights gained from the interviews are shared below.

User Interview Questions

  • What's your favorite takeout/delivery foods?
  • What motivates you to order in food?
  • What challenges do you face when ordering food online?
  • What are some things that convince you or push you to order from a specific restaurant?
  • Do you have any dietary restrictions and allergies and how does it affect your online dining experience?
  • Are you vegetarian/vegan, or know a close friend/family member who is? What is the experience like when it comes to dining in general, and specifically take-out or food delivery?
  • What are some issues/challenges you notice when ordering food online and any complaints, ideas or solutions you wish to see on the market today?
  • Have you ever wondered or wanted to customize your order? How often? How do you go about achieving it?
  • How do you feel about minimum order requirements?
  • How do you usually pay for your takeout/food delivery?
  • Numerically, how do you categorize your food deliveries versus ordering take out? Tell us more.
  • Do you prefer scheduled deliveries? In what situations would you use it most?
  • Do you experience information overload when ordering food? How does it make you feel, how do you react and how do you overcome it?
  • How do you feel about a "surprise me" feature where you order a food type or fill a survey, and a sku is randomly sent to you?
  • How do these rank in your decision making: price, quality, reviews, customization, delivery speed, or any other thing that comes to mind?
  • Do you usually like to order from restaurants that specialize in certain type of cuisine/food item or prefer one with menu diversity?

Key Insights from Interviews

User Personas

Empathy Maps

User Journey

Action

Deciding
what to eat

Ordering
Food

Waiting for
Delivery

Receiving
Order

Feedback

Tasks

Feeling hungry, opens the app and browses food options

Makes decision, customizes choice, checkout

Closes app and waits. Sometimes, checks app to track the order

Gets the food in unique branded packaging

Tastes and evaluates order

Feelings

Unsure with what type of meal to go with. Considering taste, health and pricing

Once they decides, joyfully customizing the order with favorite ingredients

Worried about delayed delivery and the food becoming cold

Pleased with the cute packaging that isn't damaged and friendly service

Thinking of trying it again and recommending it to friends

Emotions

Neutral

Excited

Concerned

Relieved

Satisfied

Possible
Improvement

In future with more brands added, categorize by cuisine

Simplify the customization steps. Promotions are bonus

Split the tracking, with notification to user. Rider map tracking and flexible requests

Simply feedback form with option to go into detail about food, delivery and packaging

Customer service contact with negative review. Push referral rewards program then.

Information Architecture

User Flow

Sketch & Wireframes

Given the time constraint of the project and the urgent need to show an interactive hi-fi prototype to an investor, we had to get creative with the time in our hands. Therefore, even if it meant extra work later down the line, I created sketches and lo-fi wireframes for only the basic functionality and general template.

Quickly after, we had to put that into creating an interactive prototype. In doing so, I ignored a crucial part of the application such as the UI/UX of the user entry, task flow entry and exit, cart addition efficiency, account, etc. My focus was mostly on designing the customization process of the app.

On a more positive note, having a more polished version of the app, even if not fully complete, helps more when it comes to user testing. Hence, we planned to refine the UI design of overall architecture and user flow in a later iteration after receiving feedback from our sponsored users during testing.

Interactive Prototype & UI Design

As mentioned, the wireframes were quickly implemented into an interactive UI using Figma and tested by myself very quickly. We knew it wasn't complete, but we had to embraced the situation and reminded ourself that design means iteration.

Of course, I could have simply combined the UI process into one iteration, making a happy perfect scenario. But I believe the story of how something comes about is as important, as is how you adapt to things that come your way. Most of the time, especially in smaller constrained operations, a designer needs to be flexible, break his routine. I believe a great designer makes the process work for him, instead of working for the process.

Branding

Similar to the other phases of the project, the branding is an iterative process and I am certain I will make changes to what we got currently, both major ones as well as small tweaks to details.

Since the executive decision was made, and later confirmed during our interviews and brainstorming sessions, to segregate each food category across different restaurant brands, we needed a name for the app/website. The name I came up with for now is Nosh.

In addition to easy spelling and pronunciation (a major factor for the local culture where language barriers exist), Nosh was especially unique since it has its meaning in both English as well as the local Kurdish language. In English, Nosh is a noun meaning food, more commonly in Britain. As a verb, it means to eat food enthusiastically or greedily. In Kurdish, Nosh is a short way of saying "Noshi gyani bet" which translates to Bon Appétit.

I will not go very in-depth into the branding process, as the branding is part of a larger project and I don't want it to be super lengthy. Instead, I will touch on some milestones to arrive to the final logo as well as presenting the final concept for each restaurant.

From the different fonts I experimented with, I decided to go with Newake 400 as it was bold and strong, but its mild rounded corners gave it a friendly approachable vibe. Moreover, its strong structure made it scalable and easy to read even in smaller font sizes, as would be the case of this logo most of the time.

Next, I started experimenting with my second concept, which was a geotag/location mark. Both positions below felt non-geometric and off. I knew I could fix the geometry by adding some slogan as one of the variations and creating other variations, so I let that go for now. Focusing on the logomark, I wasn't happy as well. Just a geotag mark felt too generic, boring and not indicative of the full brand message. It signified the delivery aspect, but nothing about food.

Next, I had this idea to combine both concepts into one, by adding a bite mark inside the geotag and then adding some alt-text under the logo to solve the geometry issue -- and it seemed like something clicked.

Icon Creation

Bun & Crust

The Sub Club

As for the color scheme, I went with a black and red against a white background (for digital applications) and kraft beige (for packaging applications). Playing off the word "club", I used some abstract dot pattern (representing disco lights) and round concentric circles (representing a record player).

Bloom Salad Bar

For the packaging, I went with a negative print idea where the logo and a surround thin circle would effectively "not be printed" inside of the black circle badge -- where instead the contract of the salad would bring out the logo contrast.