01. Problem
Many e-commerce streetwear sites struggle with one of two extremes:
- Heavy storytelling that hurts clarity and conversion
- Over-optimized sales flows that strip away brand identity
For this product, the challenge was specific:
- How do you communicate purpose and authenticity without overwhelming users?
- How do you encourage purchase without feeling transactional?
- How do you design for trust when the brand is still early-stage?
02. Goal
Design and ship an e-commerce experience that:
Balances storytelling and usability
Builds trust with first-time visitors
Makes purchasing feel intentional, not pressured
Works cleanly across mobile and desktop
03. My Role & Scope
I was the sole product designer, responsible for:
- UX strategy and information architecture
- Interaction design and page-level flows
- Visual hierarchy and content prioritization
- Responsive design across devices
- Translating UX decisions into a shipped, live product using AI-assisted workflows in VS Code
This was treated as a real production commerce product, not a concept.
04. Key Constraints & Considerations
Brand identity needed to remain central, not secondary
Users needed clarity on product value quickly
Checkout flow had to be simple and frictionless
The experience needed to feel premium without excess visual noise
Mobile browsing was a primary use case
05. Process
1. Understanding Buyer Intent
Rather than assuming users were ready to buy immediately, I designed for exploration first.
Key assumptions validated through research and observation:
- Users want to understand why the brand exists
- Visual clarity increases trust more than aggressive CTAs
- Over-designed pages reduce credibility for early brands
2. Structuring the Product Pages
Product pages were designed to answer questions in order:
1. What is this?
2. Why does it matter?
3. What does it represent?
4. How do I buy it?
Design choices included:
- Clear product imagery hierarchy
- Short, intentional copy blocks
- Visual separation between story and action
- Calm, focused calls to action
3. Designing the Purchase Flow
To reduce friction:
- Checkout steps were kept minimal
- Distractions were removed at decision points
- Users could review details without losing context
The flow supported confidence, not urgency.
06. Key UX Decisions
Narrative-first layout
Story precedes sales pressure
Visual restraint
Design stays out of the way of the product
Trust through clarity
Simple structure over decorative complexity
Mobile-first decisions
Designed for scrolling, not clicking
Consistency
Brand tone and layout patterns reused across pages
Features that didn't directly support clarity or trust were intentionally excluded.
07. Execution & Shipping
I translated UX decisions directly into the live e-commerce product using AI-assisted workflows in VS Code, ensuring:
Layouts behaved correctly across devices
Interaction decisions held up in real usage
Design intent remained intact through production
Fast iteration while maintaining quality
08. Outcome
A shipped, functional e-commerce experience
A brand-forward shopping flow that doesn't sacrifice usability
A scalable foundation for adding new products and collections
Clear alignment between brand story and conversion flow
While early-stage, the product successfully balances identity and commerce.
09. Reflection
If continuing this work with a larger team, I would:
- Test variations of storytelling depth across product types
- Explore richer content modules for returning customers
- Collaborate with marketing on lifecycle touchpoints beyond checkout
This project reinforced the importance of designing commerce experiences that respect both people and purpose.