Skip to content

Caroline Koldus

Elementor #339

Sandie's Ordering App Design

Project Overview

In class, I was given a prompt to design a food ordering app. This was a conceptual project for a make-believe sandwich shop for customers to order their meals on the go.

Problem

I was solving for a way for people to avoid lines in-store for ordering and pickup. So that people can save time and energy when ordering from us. So people could enjoy their lunch break, take that time to relax, and not be an added stressor to their day.

Working adults want their lunch hour to be stress-free. A time to relax, maybe even zone out for a while, or socialize with their coworkers. We find this to be true across the spectrum of industries. However, waiting for their meal at a restaurant eats away at their time to themselves. Any inefficiencies a restaurant creates a disappointing experience for the customer and they will likely not come back again to repeat.

Busy people need an app from their favorite restaurant to give them features and tools to simplify their day. To match how they like to plan their break from work and eat.

Constraints

This had to be an individual-based project. 

Role

Lead Designer

User research, Creative ideation, Design strategy, Task flows, Wireframing, Prototyping, Interaction design, Visual/UI design, Data visualization, Copywriting

Duration

3 months, Jan – Mar 2022

Empathize

Firstly, I wanted to deeply understand the problem. I did this by probing further than just “We need a food ordering app.” I wanted to discover what deep need or needs we really needed to solve for our customers. Interviewing a group of people that represented our target audience for the app, I was able to better understand the daily life of our customers. This is where I realized most food ordering apps, and the app I had biasedly imagined so far, were not fully engaging the user. There were a lot of possibilities of what to prioritize in the features of designing the app. I split the ideas into 4 different users.

The Planner – they like to meal prep and plan their meals over 24 hours in advance so all they have to do day-of is pick up the order.

The Social Butterfly – co-workers that want to spend the lunch hour together or need to power through a project together

The Old Dog – this guy just wants his favorite meal from his favorite restaurant every week

The Gamer– this person loves being rewarded and wants to see promotions, awards, and points with their foodie experience.

Market Research

“It is projected that online food ordering revenue will climb to $220 billion by 2023 – 40% of overall restaurant sales. (demetra) According to the Technomic study, 46% of consumers expect restaurants to offer online/mobile or kiosk/tabletop ordering functionality, and 43% preferred mobile payment during the pandemic. (technomic) 60 percent of US consumers order delivery or take-out at least once per week. (upserve) Today, 55 percent of people prefer ordering food without having to interact with a person. (pymnts) Restaurants with an online ordering system are able to raise their delivery profits by 30% higher than those who do not. (Business Insider)

Then came doing a competitive analysis of direct and indirect competitors. I gained insights into the industry standards for food ordering apps. Some companies focused on bringing the most features to the market, some being the quickest way to place the order, and some the most well branded.

There were gaps in offering group orders and gamifying the ordering process. I became particularly interested in developing a way to group ordering within the app. I drew some ideas on how this could intersect with the ordering process. I chose to go with the inspiration I saw on the Chipotle app with allowing the primary user to share their order with others.

Research

To avoid my personal vacation booking preferences, and biases, I conducted a survey with a group of people that fit our persona demographics. The survey consisted of non-leading questions about previous experiences with short-term vacation rentals. Their answers would give insights into what we should advertise on the website.

Reading the answers participants gave I saw opportunities on how the website could fit their needs better than how our competitors have done. The Dove Nest had been recently renovated on a much grander scale than most other rental houses. This would appeal unanimously to the participants as all said they look for nicer appliances and furniture in their accommodation. It was also mentioned multiple times how an owner’s communication directly affected their experience. A website and booking process that was easy to understand and clearly explained the Dove Nest would meet that need.

Affinity Diagramming

And finally, I interviewed a previous guest to hear from an actual previous client to be able to witness firsthand someone’s experience with us.

I went broad with my research because this was a first-time design for the Dove Nest, and there was no previous first-person research to consult with.

I narrowed down the feedback on the basis of whether or not it was related to the problem statement we were solving, and if it was a mutual problem for the target audience we were solving for.

With the exploratory research, I conducted a competitor analysis on both direct and indirect competitors to both get inspired by their features and how we could monopolize on their UX weaknesses. I saw a gap in the lack of guest reviews. From the survey, I knew this was of huge value to people during their decision-making process. The biggest gap that our competitors had that I could take advantage of was their sites’ navigation. Some were overcrowded, overwhelming the user on where to start to complete their task. Some had jargon in their headers that was not intuitive for the majority of users. The Dove Nest had an opportunity to provide simple navigation that would match the need of our older users to effectively book us for their stay.

Goals

Customers’ ability to independently find us and complete the self-booking process with ease.

From a business perspective, this independent booking feature outside of Airbnb needs to increase Dove Nest’s booking rate, thus, increasing overall profit for the owners.

The site needs to serve these purposes for the business.

  • Increase audience exposure.
  • Have a booking feature independent of Airbnb to increase Dove Nest’s booking rate.
  • Better the user experience of finding a place to stay in Granbury.

Ideating

Broadening

For the Ideation stage, I did the 8-minute challenge and drew up a bunch of different sketches of what the wireframe could look like, with no limitations on what could or couldn’t be possible. I didn’t want to immediately say no to any ideas to keep the process creative. I then circled all of the things I liked in each of the sketches. This resulted in a final sketch with the most effective features. I took this to Figma and created a lo-fi mockup that would be testable for the first round of users to test. My mindset was to get prototypes in front of users quickly since I would iterate on the mockup from the results. I was open to widening my scope from the feedback I received and did not want to pigeonhole myself into the wrong solution just because I had pursued it for too long.

Left Side Home Page Wireframe

Right Side Booking Page Wireframe

Narrowing

By always having a lens of the user knowing that guests’ deeper purpose is to create charming memories for their friends and family, I came up with the solution of highlighting a spacious home, with a luxury feel, by using big beautiful pictures that accurately represent the home.

Responsive Design

It was important the computer and mobile experience of the site were consistent. This made the layout deliberate and focus on what content constituted space on the screen. I think this ultimately led to a more effective design by taking much consideration into the mobile layout.

Navigation Menu

Booking Process

Features

Booking

Booking directly on our site without relying on other 3rd parties enables trustworthiness since users can book directly with our business. The process is simple and easy to understand why what information is needed in the checkout process.

Simple Navigation

The hamburger navigation menu bar cleans the header for the main task to be executed, booking. The booking button is the prominent action to take and the hamburger menu make’s this obvious. More than that, by having the menu a pop-up, I can provide more options to click to without clogging up space. It reads vertically in popularity of what’s important to users.

Testimonials

The testimonial section rotates through first-hand accounts of guests’ stays at the Dove Nest. This is a gap with our direct competitors of lack of transparency between the host and guest for their stay that people in the decision-making process of which accommodation to choose to rely on.

Gallery

The gallery page creates an immersive experience of what it’s like to stay at our house. There is ample detail of the house through pictures of every room and the luxurious amenities that our target audience seeks out.

Local Guide

The Local guide section shows how our home is not only a central location for all guests to start from, but also delights with having all the information they need to plan their vacation in one spot.

Design Choices

Lessons Learned

Based on the initial research, I didn’t realize all the possibilities still to be had with food ordering apps that hadn’t been put into design yet in a major way. From meal-planning your week with your favorite restaurant, to preparing a group order with your colleagues, there’s still so much to be mastered by designers for users to intuitively use.


From this project, I had a valuable experience of testing with actual participants and hearing such a wide variety of feedback. It was important to learn how to prioritize feedback, and that helped me stay focused on what solutions pertained to the ultimate problem I was solving for. At the end of the day, I learned that people were quite willing to help.