CIDER EXPERT

The challenge was to re-design the desktop website ciderexpert.com and make it responsive for mobile. Owner David Sielaff originally asked for a native mobile app for his users in the hopes that it would drive user engagement. However, we decided to complete a re-design of his existing site to make both desktop and mobile experiences coherent. Driving user engagement is really important because the site relies on user generated content. Photos and information for each cider are provided by the users themselves.

Design Brief

"10% of ciderexpert.com registered users are actively involved in providing content to the site, while the other 90% are considered lurkers. Primary goal is to increase user engagement."

My Role

This was a group project with 3 other UX designers. We all were active in the UX process from start to finish. However, these are the areas in which I had a primary role: client point-of-contact and group point person; creating scenarios; developing our persona; desktop layout & design; hi-fidelity visual treatments; usability testing and desktop site specification documentation.

Aspects we considered

  • Discover how existing users interact with the site
  • Find the barriers keeping non-active users from engaging
  • Re-design and streamline current primary processes: rating & reviewing
  • Optimize site for mobile
  • Create UI that is fun, entertaining and engaging

Research

I started with examining how current users interact with the current design through interviewing several active users.

interview findings

  • The site is most useful for researching ciders that are already available to the user
  • For general research, new ciders found via the website are helpful only if they are available to the user
  • The taste properties are helpful, but the many categories quickly become overwhelming
  • There is a high barrier to engagement and more incentive is needed
  • People would like to see a more streamlined and visually appealing site

PLAN

As a group we mapped out our interview findings as an affinity diagram. We had over 200 data points that we grouped together to visualize what we needed to tackle with our design.

Affinity Diagram

From the affinity map we created the persona hypothesis of Ashley Baxter, which I laid out visually so we could keep going back to her as we continued our design process.

Persona Hypothesis

design

After creating the persona hypothesis and the scenarios on which to focus our design work, my group and I began sketching out ideas for how our designs would look. We spent a day completing several rounds of design charrettes.

prototype

I used Sketch and InVision to create a clickable wire-frame prototype to test.

test

Issues with the first iteration included the following: test subjects missed the ‘Your Rating’ section; they thought the taste properties were already adjustable; and had confusion with 'Add to My Ciders.'

 

We continued to iterate on our wire-frame prototypes to further refine and adjust according to the data we collected from our usability tests.

After our last round of iteration on our high fidelity prototype, we conducted before and after testing to see if our re-design was successful. We tested 6 users for each group, with 10 out of 12 preferring the re-designed site.

Before and After Testing Results

next steps & Future Features

  • Design for location services - specifically where people can find ciders nearby
  • Image/barcode recognition to quickly discover ciders
  • Filter and sorting of search results by ABV, country, region, etc.
  • Rankings for ciders/cideries
  • "Like-ability" score - based on site's recommendation engine
  • Recommend cider to a friend
  • Discussion board