We Make Eyelet^®

We Make Eyelet is a small clothing brand featuring original creature graphics printed by hand. This project focuses on developing the brand identity and online store.

This project documents the development of We Make Eyelet across brand identity, product design, UI/UX, and web design, from initial creature sketches to an online store.

ROLE

Owner, Creative Director, UI/UX Designer

TEAM

Small family business with my son

DESIGN PROBLEM

We Make Eyelet needed a cohesive brand identity that connected its original creature graphics with its products and online store. The challenge was to carry the brand’s visual character into a clear, accessible shopping experience.

DESIGN SOLUTION

The work spans brand development and e-commerce design, from refining the creature graphics and visual identity to designing the online shopping experience. Competitive analysis and customer journey mapping informed the UX. User flows, wireflows, a reusable UI system, and a hi-fi prototype supported the online store’s development and refinement.

BRAND

We Make Eyelet began as a collaborative project with my son, making hand-painted T-shirts during the pandemic. Together, we developed original creature graphics that balance cuteness with something slightly unsettling, leaving room for interpretation through their empty eyes and loose, irregular forms.

CREATURE COLLECTIONS

COLLECTION: SCREAMERS

Screamin’ Birdy

COLLECTION: TWISTED

Twisted Bunny

COLLECTION: VACANTS

Vacant Teddy

UI/UX

The UI/UX process focused on translating We Make Eyelet’s distinctive visual identity into an intuitive and accessible online shopping experience. Through competitive research, customer journey mapping, and iterative design, I developed a user flow, wireflow, and reusable UI system to guide the experience from product discovery to checkout.

COMPETITIVE ANALYSIS

Before designing the website, I reviewed clothing brands that inspired us and researched competitors. The analysis covered target audiences, positioning, and brand strengths and weaknesses, helping identify opportunities to differentiate We Make Eyelet.

CUSTOMER JOURNEY

Mapping the customer journey helped identify the priorities of We Make Eyelet’s young adult audience, including affordability, self-expression, and sustainability. These insights informed decisions about the online shopping experience.

USER FLOW

The user flow outlines the steps from the homepage to purchase completion, including product discovery, product options, cart review, and checkout. It accounts for key decisions such as guest checkout and entering shipping and payment details.

WIREFLOW

The wireflow combines page layouts with the user flow, showing how users navigate from the homepage to the product page. It helped identify layout and navigation issues before developing the hi-fi prototype.

UI SYSTEM

The UI system brings together reusable components, variables, and auto-layouts to maintain consistency across the website design. Variables allow colors and spacing to be updated centrally, while auto-layouts support flexible layouts.

HIFI PROTOTYPE

The hi-fi prototype demonstrates the shopping experience across the homepage, collection pages, and product pages, including the add-to-cart interaction.