Goat Hill Pizza

Web Design Case Study

RESEARCH • ANALYSIS • DESIGN

goat_hill_pizza_intro.jpg
 
 

THE PROJECT

Goat Hill Pizza is a favorite of local San Franciscans and has three locations. Their website was very outdated, not mobile friendly or responsive. The information was confusing, and hard to find. It was basically a mess.
 

THE CHALLENGE

The client wanted to add an online order/delivery capability with a built-in rewards program. They also wanted to let users to have a way to upload images of their in-house created artwork or photos onto their site.


 
 
 

Research

COMPETITOR ANALYSIS

competitive_analysis_GHP2.png
GHP_Competitive_Analysis_no_BG.gif
 
 
 

COMPETITOR ANALYSIS

In order to better understand this industry and find out where the product currently fit within the market I conducted a competitor analysis. I focused on pizza companies with a similar target market that had online ordering and delivery capabilities.

Along with the analysis, I included a detailed list of suggested experience enhancements. This list included features that the top competitors had but my client was missing.


 
 

Research

RESEARCH PLAN

 
GHP_affinity_map.jpg
 
 

RESEARCH PLAN

After creating the problem statement and solution hypothesis, I conducted multiple user interviews which provided useful insights; users wanted easy ways to order pizza quickly either by phone or online. I was then able to create an affinity map with clear user goals and pain points. This helped shape and create user personas to understand our target users. Why did they come to your website? How can you solve their problem?

Once the purpose of the website is clear, you can find the most effective way to deliver the message. Content was written based on insights from customer interviews, research and a competitor analysis.
 

USER PERSONAS

GHP_personas_will.jpg
GHP_personas_sm_Emily.jpg

 
 
 

Design

WIREFRAMES •USER FLOW •SITEMAP

 
 

WIREFRAMES

I created wireframes for desktop and mobile screens. It was clear that we basically needed a simple brochure style website that outlined the company’s services, locations, and most of all gave potential customers an easy way to order pizza!. I sketched out wireframes (above) for each page of the site to block out the basic elements and to give me some blueprints to work from.

The wireframes went through a couple rounds of iteration as final content was developed.


 
 
 
GHP_user_flow.jpg
 
 

USER FLOW

The user flow was kept simple to ensure that the happy path to order pizza or find a location was prioritized and obstacle-free.


 
 
 
GHP_Site_Map.jpg
 
 

SITEMAP

I worked with the client to figure out the website structure and content. The sitemap (above) was purposely kept simple to ensure that the website could be quickly and easily navigated. I sketched out some initial concepts and discussed them with the client to ensure that we were both on the same page.


 
 
 

Design

MVP - MINIMUM VIABLE PRODUCT

GHP_MVP_prototype_white_BG.gif
 

MVP

Feedback from the user interviews and wireframe user testing pulled out the user tasks for the product. These together represent the minimum viable product (MVP): Quick and easy ways to order pizza and find critical contact information for each location, and an obstacle-free delivery process.


 
 
 

Design

HIGH FIDELITY PROTOTYPE

GHP_high_fidelity_prototype_screens1.gif
GHP_high_fidelity_prototype_screens3.gif
GHP_high_fidelity_prototype_screens3.gif
 

HIGH FIDELITY PROTOTYPE

Once we were happy with the basic concept, I moved into Sketch App to add some fidelity to the design so that I could create a prototype. I then built a clickable prototype in InDesign. We tested out the prototype, iterating on the designs based on feedback from each session. 


Release the Goat!

WEBSITE
 


GOAT HILL PIZZA

I designed an intuitive responsive website with online order/delivery service capability and a built-in rewards program - all within their budget. By adding an Instagram feed, I was able to add their secondary wish list need of having users add photos on the website.

The completed product was able to help evolved their online presence as well as their online delivery & rewards capability by implementing the new online ordering functionality and branded website.

Since the launch of the website a few months ago, we’ve had lots of positive feedback. It’s always great to see real users enjoying a product that you’ve worked on, but the journey doesn’t end here. We’ll continue to listen and learn, because as most product designers know, a good product is never finished.