ATANY – Custom Tailored Clothing Startup / MVP Project Lead Senior UX/UI Designer

Tools: Figma, Illustrator, ShopifyCustom Shopify Theme + proprietary sizing algorithm

ATAny set out to rethink how people shop for clothes online. Most e-commerce brands still follow the same formula: Size chart, model photos, and a leap of faith.

We wanted to reverse that. Instead of starting with the product, we’d start with you.

Project challenges:

Introducing a proprietary sizing algorithm (the ATA Calculator)

Educating customers on how sizing worked without overwhelming them

Supporting subscription and easy reorders for loyal customers

Integrating the fit configurator seamlessly into a full Shopify store

Goal: Create a guided, confidence-building journey—beginning with a friendly Fit Quiz, matching customers with their perfect size, and then letting them explore personalized styles and colors without second-guessing.

Create a guided, confidence-building journey—beginning with a friendly Fit Quiz, matching customers with their perfect size, and then letting them explore personalized styles and colors without second-guessing.

As Lead Product Designer, I guided the project from discovery to launch:

Conducted discovery workshops with the founders and core team

Defined the end-to-end user journey

Designed and tested the Fit Quiz experience

Built Shopify custom components for personalization

Designed mobile-first with inclusive features like high-contrast color palettes, readable typography, and touch-friendly controls to ensure a smooth experience for all users

We kicked off with three MVP workshops to align on:

User needs and business goals

Operational workflows for customers, associates, and admins

Feature prioritization and feasibility

We followed the MVP Blueprint format to ensure structure and inclusivity in ideation. These sessions generated a wide range of ideas, which were organized into themes and prioritized into actionable user stories.

From the MVP workshops, we distilled a wide range of stakeholder and customer inputs into four core themes:

Customer Experience – Fit onboarding via the ATA Calculator, clear navigation, streamlined reorders, and subscription flexibility

Education & Guidance – Clear sizing explanations, fabric benefits, and contextual recommendations without overwhelming users

Associate Tools – Fast customer account management, in-store fit adjustments, and order prioritization for urgent needs

Admin & Backoffice – Algorithm version control, SKU/content management, and tracking of returns and remakes

These themes provided a clear blueprint for wireframing, ensuring the MVP addressed real user needs while supporting operational and business goals.

With our prioritized themes in place, the next step was mapping how each user type would move through the system.

Sample: Online Purchase Flow

The process begins on the storefront, where customers can browse collections or be guided directly into the Fit Quiz. They select model, fit, color, fabric, and collection type while the ATA Calculator determines their custom size. Once the size is confirmed, users proceed through checkout, triggering backend processes that generate patterns via Gerber AccuMark and move the order into production.

By visualizing these flows early, we were able to spot friction points—such as redundant input screens and unclear fabric options—and refine the experience before moving to wireframes.

With the user flows validated, the next step was translating them into low-fidelity wireframes.

Sample Wireframe: Style-First Customization Flow This wireframe represents the journey for users who prefer to choose their style first, then customize their fit. The flow begins with style selection, followed by fabric, color, and detailing options. Once the aesthetic is set, the ATA Calculator generates a custom size profile.

Once the wireframes were approved, I applied ATAny’s visual brand identity to bring the experience to life.

The client’s brand guideline defined logo variations, primary and seasonal color palettes, typography, and apparel-specific branding details—serving as the creative foundation.

I built a Figma component library to ensure consistency, speed up iteration, and provide a single source of truth for developers.

Explored multiple visual approaches for the key flows, balancing brand personality with usability, and validating that the digital experience conveyed a premium yet approachable feel.

As the design matured, I created a set of high-fidelity prototypes to bring the ATAny experience as close to “real” as possible before development began. These prototypes weren’t just static mockups—they simulated interactions, transitions, and microanimations so stakeholders could feel the experience in action.

The prototype displayed was one of several key high-fidelity flows. It allowed users to tailor details—such as fabric, color, neckline, and sleeve style—based on the custom fit profile generated by the ATA Calculator.

Why this mattered:

Interaction realism: The clickable prototype gave stakeholders and testers a true sense of how quickly and intuitively a shopper could explore customization options.

Usability testing: Testing with a realistic UI reduced the “imagination gap” for participants, leading to more accurate feedback.

Visual consistency check: It confirmed that the brand system, typography, and component library worked together harmoniously at full fidelity.

While this is just one example, the complete set of prototypes covered the entire journey—from Fit Quiz onboarding to post-purchase confirmations—ensuring the design was validated end-to-end before handoff.

While the ATA Calculator was custom, the store also needed a cohesive theme for pages like home, about, contact, and product collections

Established structure, navigation, and content placement, with clear pathways to the Fit Quiz from multiple points.

Applied brand visuals to all storefront pages, creating a premium and responsive design while integrating the configurator into the PDP flow.

Once the theme was delivered, the client was able to add and customize content directly in Shopify, updating copy, images, and sections without developer involvement. This ensured the storefront could evolve over time while maintaining the design system’s integrity.

At the time I transitioned off the project, the platform was in the final stages of development. While KPIs and metrics were not yet available, my work delivered:

Complete, approved user flows for all core experiences

Mobile wireframes supporting the full configurator

A cohesive visual design aligned to ATA’s premium positioning

A ready-to-populate, fully configurable Shopify theme

Early alignment across teams is critical to avoid rework

Operational workflows—not just customer flows—shape the overall experience

Designing complex configurators within Shopify requires thoughtful constraints and clear developer documentation

The platform is currently in testing and preparing for launch. You can try at https://atanyforall.com/