MIND Coffee Web Design
Feb 2023 - July 2023
UX/UI Design Contract
In the Spring of 2023, I met the always-friendly owner of MIND Coffee, Viviana, who was looking for a refreshed website for her new and growing cafe. Inspired by her vision of creating a space for mindfulness close to Berkeley campus, I formed a team from my club, UX at Berkeley, and led the redesign from concept ideation and design to web development.
A three month long web-redesign for Berkeley’s fastest growing local cafe. The goal was to extend MIND's serene and peaceful atmosphere from their storefront to their website.
The problem
Team: Andrew Lin, Laney Fong, Rachel Lin, Tiffany Huang, Amber Louie
Our solution
My Role/Responsibilities
Project Manager, UX/UI Design, Web Design, Client Communication
Design Hierarchies: We reorganized information into more readable formats to ease navigation and improve user flows.
Strong visual identity: We unified the website visual identity around an improved palette distribution and fonts that align with the brand identity
Strong client feedback: I kept strong and constant contact with the client to ensure our designs reflected their vision.
Observations
The light background and chosen color palette created a distinct lack of contrast and readability. Additionally, the formatting of the page resulted in a lost sense of hierarchy and boundaries for the page, resulting in a cluttered feel.
Client Priorities & Design Brief
Challenges
-
Achieving a minimalist aesthetic despite the loud Header font the client wanted to maintain a large presence of
-
Translating the color palette into a readable, and calming aesthetic design
-
Balancing the client's mission of increasing access to mental health services with the business side of the site.
Through several interviews with the client and their customers, I learned about the backstory of the company and acquainted myself with the design brief - informing my design decisions.
For the first set of mock ups, we focused on two objectives: layout, and shape language. We wanted to maximize the efficiency of information per screen space, while maintaining clarity of information and ability to aesthetically convey the general ideas and feel of the abstracted data.
Low Fidelity
At this stage, we had a pretty good idea of the final look we wanted for the website, but were struggling to achieve a natural and fitting look to unify all the pages.
Mid Fidelity
Final Deliverables
Live Site
Reflection
I gained a lot of experience through my first professional UX consulting project, and had a fantastic time getting to know both my team and the client a little better. I learned the ins and outs of outlining project guidelines based on client feedback, as well as how to translate Figma prototype designs into tangible, professional Wix products.