Scoops

A responsive website for a local artisanal ice cream parlor

Project Details

Client Scoops

My Role UX/UI Designer and Researcher

Duration3 weeks

ToolsFigma

Background

Scoops is an artisan ice cream shop based in Los Angeles. They are known for their unique, innovative blend of ice cream flavors that you cannot get anywhere else. Some examples of their unique flavors are the “Brown Bread” and the “Pistachio Rosewater” flavors. They have an Instagram and Yelp page but currently do not have a website and are looking to expand their digital presence.

PROBLEM

Scoops do not have a website and the owner is looking to expand its online presence.

Research

Context

We want to know customers’ shopping behaviors so we can create an excellent experience.

Approach

  • Competitive analysis
  • Customer Reviews
  • Survey

Competitive Analysis Findings

In order to understand the ice cream market, I conducted a competitive analysis with direct competitors of local ice cream shops based in Southern California and indirect competitors whose target market is more national. I analyzed the pros and cons of each competitor relative to each other. This also helped me see if there are any gaps in the market.

Takeaways:

  • In order to increase engagement, the content must be high quality and the branding must be strong.
  • Scoops need to offer local delivery and pick up in order to have a competitive edge in the market
  • Scoops need to include ingredients, allergens, and nutrition facts information in all of their ice cream flavors so customers are well-informed before making a purchase
  • In order to get potential customers to connect with the brand, Scoops need to include a story about them as a business.

Customer Reviews on Social Media

I research online customer reviews on Yelp and Google to understand what current customers are saying and their specific experience at Scoops.

Takeaways:

  • It’s important for customers to have dairy-free/vegan options
  • Customers find that ice cream can be too expensive by the scoop and would rather buy at the grocery store so it’s less expensive
  • Customers are frustrated their business hours are not reflective of what they see on their postings.

Surveys

I surveyed 27 people who have experience buying ice cream to understand their habits, frustrations, and motivation when buying ice cream.

96%

want to check the menu before buying

40%

would order online for in store pick-up

59%

wants to check where a store is located

20%

needs information about ingredients & nutrition facts

"I like the option to buy pints that you can take home."

User Personas

Meet Sally, the adventurous foodie who loves to try unique flavors.

Sally has her own set of unique problems which helped me brainstorm feature ideas in the next step. Some of her frustrations include wasting money by overpaying for food, waiting in long lines, and consuming ice cream flavors that are underwhelming.

Then there’s Jason who is vegan and often needs to look at the ingredient list.

Because Jason is on a vegan diet, he scrutinizes the ingredient list in order to know exactly what he is eating. In addition, he gets frustrated when there’s a lack of vegan options when buying ice cream.

NEEDS

Ingredients & nutrition facts information

High quality ingredients

Motivation

Supporting local businesses

Convenience

Frustrations

Long lines

Wasting money

Define

Context

In order to make sense of the data we’ve gathered from our research, I need to identify high level goals of both the business’ and users’ goals.

Approach

  • Feature roadmap

Feature Roadmap

With my user persona in mind, I created a feature road map that should be included in Scoops' website. I made sure to design for both the user’s goals as well as the business’s goals.

Ideate

Context

With my features and personas in mind, it was time to focus on the scope and sitemap of Scoops' website.

Approach

  • Sitemap
  • User flows
  • Task flows
  • Wireframes

Sitemap

To help me understand how the information and content of the website will be structured, I created a sitemap of where each piece of content will be located.

User Flows

Creating user flows allowed me to understand the journey my user will take to complete a task. In this case, I created one flow where a user wants to check a store’s location information and another where a user wants to order ice cream online for in-store pickup.

Sketches

After creating the user flows, I sketched out pages that are important to my users’ journey. This also helps me better visualize key components of what to incorporate for each page.

Low Fidelity Wireframes

I digitized my sketches by creating low-fidelity wireframes and made additional pages based on my user flows.

Design

Context

Scoops was in need of a brand refresh so I created a new brand identity that can be best described as fun and playful. In designing the logo and brand identity, I kept these keywords in mind.

Approach

  • Branding
  • UI Kit
  • High-fidelity pages

Branding and UI Kit

I developed branding and a design system in order to ensure consistency across screens and devices.

High-fidelity Pages

Test

Context

I turned my wireframes into high-fidelity prototypes for usability testing. My participants are users who have experience buying ice cream.

Test Goals

  • Understand the efficiency and ease of use of finding an ice cream flavor
  • Understand if users can gain information about the ice cream on the product page
  • If users are able to successfully order an item for pickup
  • Evaluate any pain points or frustrations users might experience during the process

Usability Testing

I conducted 4 usability testing both remote and in- person. Here are some of the tasks I asked of my participants:

  • Task #1: You want to look for some vegan ice cream. Navigate and find the vegan ice creams.
  • Task #2: After browsing the vegan flavors, the pistachio rosewater ice cream flavor catches your eye and you want to know the nutrition facts and ingredient list. How would you go about it?
  • Task #3: After browsing, want to see their hours of operation. Where can you find that information?
  • Task #4: You’re interested in ordering online for pickup. You like to buy a pint for a 12:30pm pickup time in the Highland Park location.

Usability Test Findings

  • Two participants said they would like to see either a confirmation number or a statement stating they will get a text or email confirmation message.
  • One participant noticed there was a “Pint” tab on the menu page and wondered if Scoops also offered ice cream by the scoop.
  • One participant said they would like to see the days of the week when the business opens since that information was missing in the design

Next Steps

Conclusion

Overall, I was extremely happy with the results of my usability tests. There were only a few tweaks that I needed to make after the feedback I received from my participants. They are able to locate the ice cream flavor and successfully ordered online without any hurdles.

Next Steps

If I had more time, I’d conduct a second round of usability testing with my updated iteration on a new set of participants. From there, I would design for mobile and tablet and work with a developer to bring this product to life.

↑

Say hello.

zhaoelaine95@gmail.com