motoring coffee

timeline

12 week solo project | fall 2023

"blended for a life in motion"
a place where caffeine and automotives thrive

role

ux researcher + designer

tools

Figma
GSuite (sheets, forms)

skills

user research, interface design, brand design, prototyping

Overview

I was tasked with a semester-long (12 week) solo venture of redesigning the website/app of an LA-based small business. I was responsible for everything- brand and user research, visual design, wireframes, and prototyping.

As someone who frequents small businesses and has a love for coffee, I wanted to choose one that had a unique flair to it, but needed someone to help showcase that online. Motoring Coffee (MC) is a cool new coffee spot on Santa Monica that’s home to vintage automobiles, F1 race cars, and good coffee.

The location is full of passionate enthusiasts, each one with their own unique style and traits.

Initial Research

I performed content audits on the existing company’s website, as well as their Instagram. I conducted 12 user interviews and collected 17 survey responses to better understand their consumer base. With this information, I was able to understand some key points about MC, as well as their consumer base.
‍
1. The experience matters as much as the product
2. Consumers want to be in the loop
3. Good coffee results in a good community
4. Motoring’s existing site lacks user interaction

User Personas

My validated personas, Patricia and Pete, are important pieces to my puzzle. They help me understand my user base, and also allow me to make decisions that benefits them the most. These passionate enthusiasts want a fun and tangible experience, and a space for individuality to grow amongst a community.

Key Pain Points

While conducting research on MC, I also took a look at their competitors and I noticed some key pain points.
‍
1. lack of information
2. limited functionality
3. little to no photos

A lot of the users I interviewed and surveyed had no idea Motoring Coffee had a website to begin with, and actually wanted a functioning website that would allow them to look at upcoming events, order coffee, and see what drinks Motoring had to offer in a particular season.

Ideating

I wanted to create features and layouts that would enhance the user experience, addressing all the pain points and needs of our consumers/users. Another important consideration was why people would visit in the first place. "You have a website. Okay, so what?"
With this in mind, I focused on meaningful interactions, with features and information that can't be readily found on social media without a few click arounds. Finally, I focused mainly on the experience of new users, building upon features that would enhance their exploration of MC. I wanted to welcome people to the Motoring Coffee community, and then give them a reason to stay around.

Critiques

I received feedback from my professor and classmates, and worked on drafting new ideas and variations of what I already had. My professor had suggested to get rid of the carousel feature, stating concerns for the mobile experience. I was also recommended to change up the layout, and I revisited my research and user data to focus more on the features that the users wanted most.

Identifying Key Users + Flows

I limited my screens to focus mainly on new users who may have discovered Motoring Coffee while cruising down Olympic Blvd, or was recommended it by a friend. I wanted the redesigned site to be fun and welcoming, true to the Motoring Coffee brand and culture.

Each persona (Patricia and Pete) has their own needs and interactions on the new website, and I wanted to tackle as many of those key experiences as possible without making it too overwhelming.

Solution

Motoring Coffee, a desktop and mobile experience, that allows coffee enthusiasts and car enthusiasts to find their fit.
‍
1. Virtual 3D tour that takes you around the space so you know what to expect.
2. Featured/seasonal drinks section for the coffee enthusiasts.
3. All inclusive events page that highlights MC’s pop-ups and local car shows.
4. Notification of slow hours, so enthusiasts know exactly when to stop by and hang out.

Takeaways

As a budding UX designer, I was eager to improve existing features, and implement new ones. If I had the opportunity to revisit this project I would find a way to incorporate trinkets that bring out more of MC’s personality- namely a Spotify plug in that plays the same music that's playing at the coffee shop (they plug their Spotify playlist).

I would also flush out the order ahead functions, since many users expressed that they would like to order drinks ahead of time. This will introduce another functionality of the site, and can also lead to the production of an app.

Finally, having this go through usability testing can help me iterate newer, more seamless experiences, and understand exactly what went right, and what went wrong.