top of page
covers for portfolio tiles (35).png

Saffron & More

Designed a full brand identity and high-fidelity app prototype for Saffron & More, a conceptual Ann Arbor bulk-goods store, including logo creation, style guide, and polished interface design.

My Role

UI Design

Timeline

Two weeks

Visual Design

Brand Identity

Tools

Adobe Illustrator

Figma

Adobe Photoshop

Overview

Saffron & More is a conceptual small business selling bulk spices, grains, herbs, teas, and other natural goods. I developed a visual identity that conveys an organic, modern, and approachable brand while creating a high-fidelity app prototype for shopping and browsing products.

Brand Exploration

  • Brand Personality

    • ​Organic, Modern, Minimalist, Elegant, Approachable​

  • Target Audience

    • Ann Arbor residents and University of Michigan students

    • Environmentally conscious shoppers

    • People seeking high-quality specialty bulk goods​

  • Design Considerations

    • Brand translation: Make the app and visuals reflect the brand’s personality (organic, modern, approachable)

    • Consistency: Logo, colors, typography, and UI should feel cohesive across all touchpoints

    • Accessibility: Ensure legible typography, sufficient contrast, and clear hierarchy

    • Simplicity: Minimalist layout to make shopping intuitive and focused

Brand Identity

Logo

The Saffron and More logo reflects the brand's focus on organic, sustainable products through its warm, natural palette and simple leaf symbol. The marigold leaf references the color of saffron while the clay red type grounds the design in earthy warmth. Together, they create a modern yet human identity that feels elegant, natural and rooted in quality. 

Artboard 9.png

The logo was designed with flexibility in mind, allowing it to adapt across different contexts and scales. Extended and stacked variations ensure the identity remains recognizable whether used within the app interface, on packaging, or in smaller digital applications.

Typography and Colors

For the headings, I chose the type, Roca. Roca's design brings an organic, approachable tone to the brand. Its roundedness and earthy elegance express openness and friendliness, reflecting Saffron and More's natural, sustainable focus for a local customer base. 

For the body, I chose Congenial. Congenial is a humanist, friendly sans serif. It's a clean but not a sterile sans serif, which helps bring readability while still maintaining the brand's earthiness. This balance makes it an ideal complementary typeface that supports Roca's character while keeping that warmth. 

Artboard 10.png

My primary colors are chestnut red, honey bronze, champagne mist, and a deep walnut. Together these colors make up a grounded, organic palette that is elegant, and the chestnut red mirrors the color of saffron. 

Brand Applications

The Saffron & More visual identity was applied to physical touchpoints to show how the brand translates beyond the digital experience. The logo, color palette, and typography shown on the paper shopping bag express the brand’s organic personality while reflecting its focus on sustainable, high quality goods. These applications allow for consistency across in store and digital contexts.

covers for portfolio tiles (30).png

UI System & Components

The UI system translates the Saffron & More brand identity into a functional, scalable interface. The brand’s natural, modern personality is carried into the app through its color palette, generous spacing, clean typography, and simple iconography to support easy browsing and a calm shopping experience.

 

Reusable components like buttons, cards, and navigation elements maintain consistency across screens while keeping the interface minimal and focused on product discovery.

​

Page 2 (4).png

High Fidelity App Design

The final high-fidelity screens combine brand identity, UI components, and user flows into a cohesive shopping experience that feels effortless and engaging.

covers for portfolio tiles (32).png
covers for portfolio tiles (33).png
covers for portfolio tiles (34).png
bottom of page