SCooter’s Frozen Custard: Website Redesign

Artboard.png

project brief

To explore and practice information architecture and produce prototypes for e-commerce websites, I explored and expanded upon Scooter’s Frozen Custard’s website.

My Roles: User Research, Wireframing, Prototyping, Usability Testing

Project Duration: 2 Weeks


What’s the Problem?

Scooter’s Frozen Custard wants to give their website an e-commerce option so that the user may pay for their orders online or have items put on hold for easy pick up at the store location.


What’s the solution?

By adding a shopping cart and reorganizing the navigation, the user now has the opportunity to keep items on hold whether she completes the transaction online or not, making it easier for her to attain what she needs without the wait while still supporting a local business.

 

DISCOVERY

COMPETITIVE ANALYSIS

 

The first research method that was conducted was a competitive analysis on the heuristics of the current website. Comparing Scooter’s with Andy’s Frozen Custard and Oberweis, I looked at both the landing/ home page and the product pages on each of these websites.

From this basic evaluation, I can see that Scooter’s needs to work on:

  • The hierarchy of their content

  • Purpose of images

  • Product pages to inform e-commerce capabilities

 
 
 

USER INTERVIEWS & AFFINITY MAPPING

Interviewing a few peers, I gathered information on why users generally visit restaurant/food websites and what they expect to see from any restaurant.
Answers ranged from:

  • To view the menu

  • To view higher quality images not found anywhere else

  • To see different/more updated offerings that other platforms do not have already

  • To experience the brand before going into the physical location

 

DEFINE

Screen Shot 2019-05-02 at 11.16.56 PM.png

DESIGN

WIRE-FRAMING & GRIDS

 

PROTO-PERSONA: Megan

  • Creating a proto-persona helped organize frustrations for the user and potential solutions.

Megan is a stay at home mother who is constantly running around for all of her kids’ events. She enjoys Scooter’s Frozen Custard because it’s near her home, her children love it, and she loves to support a local mom & pop style shop. Unfortunately, due to time constraints and long lines at Scooter’s, it’s often hard to find time to enjoy her favorite frozen treat.

 

After conducting the heuristics evaluation and finding out the main pain points of a user who is unable to order through a website, I started creating the grid system for the website in which all the global elements would live in one place.

As I started building it out, it was important to take into account all the content and in which page they will reside in.

Screen Shot 2019-04-29 at 11.02.12 AM.png

NAVIGATION SCHEMA

I created a high level map of what the internal pages would look like when clicking on “Take It Home,” which is the page for people to get in to order their frozen custard online.

nav.png

CLICK HERE TO SEE MEGAN’S user flow

 

WHAT I’VE LEARNED & NEXT STEPS

INFORMATION ARCHITECTURE

  • It’s helpful to rely on conventions and standards when creating a layout so that the user is not confused by unnecessary “delights”

  • Creating global and modular elements can help save on time in creating and user testing

NEXT STEPS

  • I want to create a user flow that requires less steps and/or make the flow easier to follow

  • Because the idea of ice cream is fun and delightful, I would incorporate more fun and delightful elements to the pages such as animation or video