A screenshot of the Y&F websiteA screenshot of the Y&F design systemA screenshot of the Y&F design systemA screenshot of the Y&F design system
Brand & Web Design

A brand & web design exercise

Q4 2023

Y&F Brand and Web Design

In collaboration with Yeast & Flour (Y&F), we crafted a brand identity and website design that elevates the bakery's image and engages customers in a delightful, modern, and user-friendly way.

Brand identity

Wheat is a golden-yellow. Baked wheat takes on a darker, browner hue. We chose a vibrant gold and bold brown to serve as the brand's main colors. A cheeky crimson red supports these two colors, along with white.

The art of baking is rooted in tradition and is beloved by many of us in modern times. For this reason we decided to pair and classic serifed typeface with a more modern sans-serif to help with screen legibility. The soft humanist strokes and terminal of EB Garamond provide an time-honored feel for the Y&F's image while the sharp and geometric forms of Work Sans brings in a touch of modernity.

We extracted the logo from the "Y&F" set in EB Garamond small caps and tightened the kern. The simplicity and contrast of the strokes and curves give this logo its life.

Web design

To translate the brand into a digital experience, we created a clean, visually appealing design with elements from their brand identity. The website design seamlessly integrated the bakery's logo and branding elements throughout, ensuring a consistent and compelling visual presence.

Key design elements included: images of the bakery's products presented to tantalize visitors; typographic clarity and use over solid and photographic backgrounds; and a user-friendly ordering system for individual and wholesale customers.

Deliverables

  1. Brand Guide
  2. Web Design System
  3. Webpage designs: home, contact, our story, orders, wholesale orders, menu, blog

Results

The updated website designs reflect their new brand identity and offers customers an easy, engaging, and visually captivating platform to explore, order, and interact with the bakery.

Note: Y&F is not a real business. The Yeast & Flour company used in this case study is fictional and any similarities to businesses is coincidental.

View in Figma

Back to Portfolio