UX Design | IN-Class Client60 Bull Cafe
Overview
A proposed project for a real world client. 60 bull cafe is an upscale Charleston restaurant who’s sales have been lacking during COVID. They were seeking a new solution to improve their sales and their customers’ experience when ordering.
My Role
Competitive Analysis, User Research, Personas, Journey Maps, Community Engagement, Stakeholder Engagement, UX Research, UX Design
Who Was Responsible
I worked with the business owner. This was a class project and each student presented their designs to the owner of the restaurant.
Background
Creating an online ordering system that would make the User’s experience as easy and seamless as possible; while increasing 60 Bull Cafe’s online take-out sales.
I identified the current UX needs of 60 Bull Cafe’s current clientele through research - defining their struggles and goals by examining their purchasing habits and how they currently interact with 60 Bull Cafe’s website.
Basic problems & ResearchResearch Background
60 Bull Cafe is a proud staple of Charleston, South Carolina's restaurant scene. They offer food at a higher price point, while staying true to being local and genuine. Located in Harleston Village, the restaurant is surrounded by picturesque Victorians and neighborly customers. The food offerings are diverse and display 60 Bull Cafe’s dedication to using locally sourced ingredients.
Torrey, the owner, has mentioned how he wishes 60 Bull Cafe’s takeout order sales could be a larger part of their revenue. The fact that their takeout sales are lacking is surprising - especially during covid. However, looking at their website there is no way to order online or any copy that suggests it’s even possible to get takeout from 60 Bull Cafe. Based off of experience and research many people don’t like the process of ordering over the phone - first looking up the menu online, copying a phone number, remembering the name of the dish you’d like, waiting to dial in, being placed on hold, and then once you’re finally through you hope you can place your order as quickly as possible.
Looking at other restaurants of a similar price points and clientele, they all offer a clear way to order online. The online ordering systems are simple and clean and provide a quick way to order and inform you of when your order would be ready. Prioritizing the menu is also an important part of these other web designs. Given that Torrey won’t let his restaurant place orders through Uber Eats, their own ordering system is desperately needed.
Problem Statement
People love to order food online to help support their favorite local businesses and restaurants; often when they’re to exhausted to eat in or especially right now due to Covid. 60 Bull Cafe has no way to order online and they don’t even mention take-out on their website. Even if you knew you could order from 60 Bull Cafe, you’re still faced with the task of dealing with calling and placing an order, trying to remember what you want and hoping you get through right away. The fact they don’t offer an online ordering option negatively effects their take-out sales, something they have admitted could be better.
How Might We
How might we develop a mobile online ordering platform that will solve the lack of an easy and quick way to order from 60 Bull Cafe?
An example of a user flow pulled from the full research
A journey map from my initial research report
Wireframes from the initial research report - forgive that background color - I no longer have access to many of these assets.
This is an older project of mine, I don’t have access to much of the extensive research besides what exists on this page from my old portfolio in the button below, feel free to take a look if you’d like:
A Few Selected Mock Ups From The App
Landing Page
When you first arrive at 60 Bull’s website you would be greeted with a welcome and the option to jump straight to which menu would like to see. 60 Bull Cafe has a large menu with a large amount of sub-categories - so it was important to stress the ease of jumping straight to which category of food or drink you would like to see right away.
Menu Home
Once you have selected the menu you would like to view or order from, you will be greeted with a welcome and a prioritized highlight of the last thing you’ve ordered (that is if the site remembers you and you are logged in) I have placed a mandatory log-in at the end, that way if you just wish to view the menu you are not burdened with logging in right away.
Menu Home (Scroll/Header)
The menu functions as an endless scroll jumping into each menu category with appetizing pop-up imagery representative of dishes within that category. There is also the function to jump through to each category quicker, as seen on the previous screen with small links to each of the categories that work as a side scroll. However, after you begin to scroll, these small links become part of the header; this would happen after scrolling past their position under the hero image that greeted you on the previous mock-up.
Item View
Once you click on a dish to view, you’re greeted with a large image of the dish and a list of all the ingredients that make up the dish. Given how 60 Bull Cafe’s dishes are made from simple and natural ingredients, this is a great way to feature and highlight them. When scrolling past the dish you have the option to make changes/requests, and are shown drinks that would highlight the dish.
Search
When clicking on the three dots at the top right it will bring down a search function and a quick ability to jump through to different categories or menus, such as the drink menu or breakfast menu.