RESEARCH • ANALYSIS • DESIGN
Client: Fentons Creamery
My Role: Entire product design: Research, Conception, Visualization,
Information Architecture, Wireframing, Web Design and User Testing
Project Time: 7 weeks
Fentons Creamery is such a great place — it’s an historic landmark in Oakland, California, and has some of the best handmade ice cream in the Bay Area.
Fentons wanted a new website, as their old version was outdated and not responsive, plus it was hard to read and navigate on mobile devices. The old site was a complete Flash site, so the SEO needed to be overhauled as well to help them rise in organic searches.
Ability for users to view ice cream flavors and menus quickly.
View locations and contact information easily and intuitively.
Ability to quickly view online store information.
Showcase photo library throughout the site.
Fentons also wanted the ability to make edits to their website. They needed a CMS that was simple and easy to use. Squarespace.com is one of the best platforms for doing that: the interface is very intuitive and the platform is very stable and secure. A perfect fit for their needs.
Taking the requirements and user goals, I created users journeys.
Using both the business goals and the User Journeys as a guide, I completed a card sort exercise. The result is the site map below.
Low Fidelity Sketches
Quick, hand drawn screen iterations were made to see what the initial layout might look like.
Using the paper hand drawn iterations as a guide, I worked in Sketch to create wireframe screens. I then created a clickable prototype in InVision to see how the screens would transition together. After some user testing was done, changes were made to improve usability.
BRAND STYLE GUIDE
Using existing elements of their brand (logos from existing collateral) I put together a brand style guide with logo elements, a font family, and color pallet
HIGH FIDELITY DESIGNS & AN INTERACTIVE PROTOTYPE
Using the style guide, wireframes and the Fentons library of imagery, I designed high fidelity mock up screens in Sketch, and a clickable prototype using InVision.
The New Fentons Website
MOBILE FIRST, USER CENTERED DESIGN
The hi-fidelity designs and prototype were reviewed and approved for development. To accommodate the clients need to make in-house edits, I implemented the new website using Squarespace. The end result was a responsive, mobile-first web site.
Each of the business goal and user requirements were met:
· Intuitive and easy way for users to find ice cream flavors.
· Multiple easy ways for users to find menus.
· Intuitive way for users to find location and contact information.
· A way for users to shop products online.
I also added new organic descriptive page titles, and meta data (key words and page descriptions) throughout the website to help raise their search engine ranking, and give their website more visibility. The new website elevated their online presence and place them on page one on the search engine rankings. I will continue to review their site analytics and rework key words to organically help their SEO on an ongoing basis.
Feedback & ROI
Feedback from the client was fantastic! Since the site was launched, there has been a large ongoing spike in web traffic and in sales.