“Zenith Coffee Roasters” – Branding and UI/UX Design
Client: Zenith Coffee Roasters (Fictional)
Industry: E-commerce / Food & Beverage
Link: [Link to Behance, Dribbble, or Figma prototype]
Zenith Coffee Roasters is a startup brand focused on selling ethically sourced, single-origin coffee beans online. They needed a complete brand identity and a high-fidelity website design that would communicate their core values of quality, sustainability, and modernity. The project goal was to design a beautiful and user-friendly e-commerce experience from the ground up.
No Brand Identity: The client had a name but no logo, color palette, or typography, requiring a full brand system to be created.
Competitive Market: The online coffee space is crowded. The design needed to be unique and memorable to stand out.
Complex User Journey: The website had to educate users about different coffee origins while also guiding them smoothly toward a purchase.
I followed a structured UI/UX design process to ensure every decision was deliberate and user-focused.
Discovery & Branding: I began with competitor analysis and created a brand identity that included a minimalist logo, an earthy color palette, and a combination of modern sans-serif and classic serif fonts. This established a foundation of sophisticated-yet-approachable branding.
User Experience (UX) Design: I mapped out the entire user journey, from landing on the homepage to completing a purchase. I created low-fidelity wireframes to structure the page layouts, focusing on a clear information hierarchy and intuitive navigation.
User Interface (UI) Design: Using the established brand guidelines, I designed a high-fidelity, pixel-perfect mockup of the entire website in Figma. I focused on clean typography, beautiful imagery, and ample white space to create a premium, uncluttered feel. I also designed a fully interactive prototype to test the user flow.
A complete brand style guide (logo, colors, typography).
High-fidelity mockups for all key pages (Homepage, Product Page, Checkout).
An interactive, clickable prototype demonstrating the full user journey.
A design system with reusable components for easy developer handoff.
Design & Prototyping: Figma
Brand Inspiration: Behance, Dribbble
Collaboration: Miro (for user flow mapping)
Your vision into life