goat_hill_pizza_intro.jpg
 

SFPDV

Mobile App Concept and Web Design

RESEARCH • ANALYSIS • DESIGN

 

Client: San Francisco Private Dining Venues
My Role:
Entire product design from research to conception, visualization and user testing
Project Time: 6 weeks

 
 

THE PROJECT:

San Francisco Private Dining Venues (SFPDV) is a private dining group company that is based in San Francisco. They wanted to update their website to reflect their new brand and hopefully generate new business. User feedback was that the old site was a little confusing and tough to get vital information. The challenge was to create an intuitive new website that reflected the slick San Francisco brand.


 
 
 

Research

COMPETITIVE ANALYSIS

Competitive_Analysis_White.png
 
SFPDV_Competitive_Analysis_no_BG.gif
 
 
 
 

COMPETITIVE ANALYSIS

As I conducted a competitive analysis, I found that there are not many direct private dining competitors out there... In fact, it turns out there is actually only one main direct competitor - OpenTable.com. They focus mainly on restaurant reservations and their entire private dining section is buried and hard for users to find. Their design aesthetic is very simplistic and the content and private dining information is limited.

Another competitor found was indirect, and only on the east coast - a company called Sixplus.com. Their website and app has a clean, contemporary feel with an intuitive UI. The main pain point was - after users found their ideal venue to reserve/book, they were asked (by Sixplus) to then sign up to complete the reservation process. Annoying! After signing up, users were not given instant reservation results but were told they would get back to them via email. Not exactly real-time reservations here.

Also, Sixplus.com thought that a live concierge chat would be a nice feature so users could instantly talk with a live person about their private dining needs. After I conducted multiple user tests, I found that 100% of the users did not care to have a live chat feature at all. Users were interested in speaking directly with a person however.


 
 
 

Research

RESEARCH PLAN

 
 
affinity_map-white.jpg
 
 
 

RESEARCH PLAN

I was able to conduct multiple user interviews on several key user groups: private event managers, event planners, and business owners. Creating an affinity map from those interviews brought out clear user goals - users mainly need an easy and intuitive way to search for, find and then reserve a private dining space in real-time.


 
 
 

Design

WIREFRAMES •USER FLOW •SITEMAP

SFPDV_wireframe_initial_frames_wht_BG.gif
 
 
 

WIREFRAMES

I created low-fidelity paper wireframes, then medium-fidelity wireframes in Sketch to map out the new app structure and page layouts. These were great for communicating the design vision and getting early feedback. The wireframes went through a couple rounds of iteration as final content was developed.

The initial wireframe designs were based on user feedback, and had a central filter system that would stay visible on the top area of the screen. After user testing, I found that the filter system took up too much screen space, and needed refinement. A pivot on the filter system shifted to a filter icon instead that used a drop-down menu to then alleviate the needed screen space.

 
 
 
SFPDV_user_flow.jpg
 
 

USER FLOW

I created a user flow to reach the user happy path - booking a private dining space. I included include multiple access points, a clear start and finish and illustrated steps in sequential order.

 
 
 
site_map-white.jpg
 
 
 

SITEMAP

The site map helped to have a clear picture of the product’s current content and structure. I conducted a full content inventory to asses what changes would be necessary to improve the information architecture and enhance the product’s functionality.


 
 
 

Design

MVP - MIMIMUM VIABLE PRODUCT

SFPDV_MVP_prototype_white.gif
 
 

MVP

As the list of desired functionality grew, it became important to prioritize each item. To do this I synthesized the data from the user affinity map and feedback from the wireframe user testing to pull out the critical user tasks for the product and these together represent the minimum viable product (MVP).


 
 

Design

HIGH FIDELITY PROTOTYPE

 
SFPDV_high_fidelity_prototype_wht_BG1.gif
SFPDV_high_fidelity_prototype_wht_BG2.gif
SFPDV_high_fidelity_prototype_wht_BG3.gif
 
 

HIGH FIDELITY PROTOTYPE

After more usability testing was done, I created high fidelity prototypes for desktop and mobile. More usability testing was done and small changes were made until at last, we were ready to launch.


 
 

Mission Accomplished

WEBSITE •MOBILE APP PROTOTYPE
 


SFPDV

Some design challenges are harder than others, but when you have a great client to work with, it makes it that much easier to achieve your objective. I had a great time working with this client and I’m glad that I could help them create a website and mobile app prototype that met their company needs.