Beans3.jpg

Espresso Vivace

Espresso Vivace Redesign

Overview

Rohit worked in a team to redesign and implement a new version of the website for Seattle coffee roaster Espresso Vivace. Together, they employed a user-centered design methodology to conduct research, gather feedback, design, develop, and release a beautiful new website. The final website is responsive, maintainable, and the official website of Espresso Vivace.

Design Process

Original website design

Original website design

Rohit and his team followed a user-centered design process to redesign and implement the website:

  1. Investigation
  2. Ideation
  3. Prototyping
  4. Evaluation
  5. Production

INVESTIGATION

Sample persona

Sample persona

For the initial investigation, Rohit and his team met with the client to understand their needs and come up with a list of three primary issues:

  1. Complex navigation
  2. Poor readability
  3. Hidden key information

From these, they defined a list of primary objectives, including making the customer experience online match the in-store experience, increasing time spent on educational pages, and decreasing clicks required to get basic store information.

IDEATION

Sketch & high-fidelity prototypes

Sketch & high-fidelity prototypes

Once there was a clear problem to solve, Rohit and his team conducted a competitive analysis of competing local coffee shop websites, defined personas to better understand the target audience, and created a task matrix to make sure the design would solve each persona’s needs.

PROTOTYPING & EVALUATION

Usability testing

Usability testing

Dozens of low-fidelity prototype sketches were created and reviewed to come up with a basic design for the website. Once a final design idea was converged upon, a high-fidelity prototype was created in PhotoShop for user testing. The prototype was tested and refined through multiple rounds of user testing.

PRODUCTION

Final website

Final website

The final website was produced in HTML/CSS/JavaScript and created as a custom WordPress template, to allow for easy maintainability by the staff of Espresso Vivace. The final website is responsive, maintainable, and the official website of Espresso Vivace.


Photo credit: Espresso Vivace