Product Design
Menu

Normcore — Accelerate & Scale for Wholesales and Large-catalog

UX Strategy, Cross-team Collaboration, System Design
with Đình Collective
2025
Normcore represents our team’s boldest leap yet—a purpose-built Shopify theme for large-catalog and wholesale merchants.
  • End-to-end UX strategy & feature definition
  • Research & analysis
  • End-to-end design execution
  • Design system creation & component library
  • Stakeholder facilitation
  • Documentation & knowledge management
My Role

Context

Normcore, SalesHunterThemes' fourth Shopify theme, launched in mid-2024 with a focus on large-catalog and B2B merchants. Our 2-people product design team's in-depth market research identified an underserved segment of large-catalog merchants on Shopify's platform, which inspired us to begin development.

Problem Statement

Large-catalog and wholesale Shopify merchants face challenges with inflexible themes that don't support complex products or scale well. This leads to slow setup, performance issues, and poor visibility into conversions, despite having solid business operations.

Vision & North-Star

To solve this, we defined a bold vision:

Help merchants launch quickly with smart presets while offering powerful customization options for scaling their stores.

Our north-star metric became:

In Q1 after launch, over 400 merchants adopted Normcore with 20+ reviews at 100% satisfaction, validating our niche focus.

Stakeholder Alignment

In our critical alignment session with the Head of Product and product team, led by product designers, we established five key deliverables:

  • Aligned on requirements and metrics
  • Created roadmap to launch
  • Set MVP features
  • Defined key milestones
  • Set up communication channels

This alignment set the foundation for Normcore's focused execution.

From then, the first epic for version 1.0 was officially created
Kickoff & vision

We partnered with visual-design agency Đình Collective to enhance aesthetics while our in-house team focused on UX and research. As the product designer, I took charge of leading weekly alignment sessions to keep their artistic vision aligned with our product goals and January 2025 launch timeline, ensuring their creative work stayed focused on solving real merchant needs.

The work was split into two parallel tracks:

  • In-house UX & Feature Research by our product design team, focused on merchant workflows and feature development
  • Visual Direction Research by Đình Collective, developing visual style and core design elements
The overview of our design process

After aligning both tracks into a shared vision, I developed our initial design system and settings framework:

  • Created design tokens and patterns
  • Built Figma component library
  • Defined UI flows

This was just the initial version of these systems - we continued refining them throughout development.

Planning & strategy

First, we needed to understand our two key user groups:

  • The merchants managing large catalogs and driving our revenue
  • The end customers browsing these catalogs and generating merchant revenue

Using Baymard Institute reports and StoreLeads data, we created two persona profiles with ChatGPT - one representing merchants struggling with complex setup processes, and another showing customers dealing with overwhelming product catalogs.

Using FigJam, we mapped user journeys and identified key needs: merchants wanted sophisticated catalog filtering, while shoppers needed simple navigation.

A card-sorting workshop helped create a focused backlog of core and future features based on persona insights.

A snapshot of our card sorting process

Building on our card‑sorting exercise, my design manager and I transformed the brainstormed ideas into a feature prioritization board—grouping every feature into Must‑Haves, Should‑Haves, and Nice‑to‑Haves across each major theme section.

An example of the feature prioritization of section Header
Research

Using our prioritization, we defined core v1.0 features and created Figma wireframes:

  • Each section organized by page and type
  • Settings aligned with wireframes, including stakeholder notes
An example of a wireframe of section Product details which used to display product information

This tightly integrated layout ensured that every prioritized feature directly mapped to a merchant-facing setting—keeping design, development, and stakeholder expectations perfectly in sync as we moved toward hi-fi mockups.

Feature set & wireframing

We integrated Đình Collective's visual designs with our wireframes and built an Atomic Design-based system for consistency and easy customization.

  • Design Tokens: Created base scales for color, typography, and spacing with merchant-adjustable values.
  • Component Hierarchy: Built from atoms (basic elements) to organisms (full layouts), organizing UI systematically.
  • Documentation: Maintained a centralized Figma library with clear usage guidelines.

This systematic approach ensured theme consistency and simplified future refinements.

Atomic design, as always
Design system

After finalizing our components and visuals, I moved from wireframes to high-fidelity designs, focusing on refinement:

  • Built hi-fi screens & animations: Created detailed layouts in Figma and complex interactions in Principle
  • Developer feasibility checks: Worked with engineers to identify and adjust features based on Shopify's limitations
  • QA & edge-case fixes: Resolved responsive issues and accessibility gaps with appropriate fallback states
  • Agency alignment: Maintained consistent design through weekly syncs with Đình Collective

This iterative process helped us create a robust theme that stayed true to our vision.

Check out Normcore's intro video to see what it's all about

Hi-fi mockups

After multiple review rounds with Shopify, we launched Normcore to their Theme Store in Febuary 2025. Since then, We've already reached 50% of our Q1 adoption goal with 200 merchants and 8 five-star reviews, showing strong momentum toward our quarter-end targets.

Us on submitting day. Missed those days haha
Submission & Launch
Notable stores

Here are the key principles that guided this project:

  • User-first thinking: Design choices focused on solving real merchant and customer pain points.
  • Forward-looking approach: Systems built to scale and adapt with evolving needs.
  • Ethical decision-making: Priorities shaped by data and feedback to ensure genuine value.
  • End-to-end ownership: Balanced vision with practical constraints throughout the process.
  • Collaborative spirit: Maintained alignment across teams through regular communication.

Throughout the project, I focused on delivering scalable solutions through effective collaboration.

Reflection