AI-Powered Fashion Design Platform | ABLO.AI
My Role
Led the 0→1 creative direction for Ablo.ai, a generative AI platform designed to democratize fashion design. My role encompassed defining brand identity, product flow, interaction logic, and motion strategy, ensuring a seamless user journey. Critically, I spearheaded the AI model's creative training and the development of a data-driven, user-centric style system (like 'curated style categories'). This allowed non-designers to effortlessly generate, customize, and sell high-quality, brand-aligned fashion creations.
-
Company
Space Runners
-
Year
Jan 2024 - June 2024
-
Role - Creative Director
Creative Director | Product Strategy, Interactive Design, UX Systems
-
See Product at
KEY CONTRIBUTIONS
AI-Driven Personalization
Integrated generative AI to enable dynamic, behavior-driven interfaces with real-time 2D customization.
Designed adaptive UX patterns that support personalized user journeys, enhancing creative expression and engagement.
Created scalable interaction logic that adjusts based on user behavior, supporting long-term product growth.
Real-Time Systems Thinking
Built interaction frameworks that scale across real-time environments, supporting seamless transitions and responsive microinteractions.
Integrated motion as a core element of the product architecture, aligning motion logic with broader product goals.
Used real-time data to optimize system performance, reduce cognitive friction, and improve user retention.
Interaction System Design
Developed real-time interaction systems that reduce cognitive load and guide users through complex customization workflows.
Created foundational UX architecture for multi-step interactions, integrating responsive feedback loops for intuitive navigation.
Designed adaptive, context-aware interactions that support personalized user journeys, enhancing creative expression and engagement.
DESIGN STRATEGY
The Ablo.ai design system supports a seamless, scalable user experience for AI-driven fashion creation. It includes a comprehensive set of font styles, color palettes, and reusable components, allowing for rapid prototyping, consistent brand experiences, and efficient design-to-development handoffs.
This system is designed to reduce cognitive load, speed up prototyping, and ensure visual consistency across all product surfaces, supporting the broader Ablo.ai mission of democratizing fashion design.
Components
Top Navigation
Sub Menus
Buttons
Visual Cards
Input Fields
Interactive Elements
Design Tokens: Font sizes, spacing, color tokens for rapid scalability
User Journey – From First Interaction to Product Mastery
UX Design Strategy
1.Problem
Users are unsure where to start when trying to create a shirt design. The interface offers multiple options (e.g., font, style, layout tabs). Giving just a blank canvas creates friction for first-time or casual users, when they’re expected to make creative decisions.
2. User Behavior Analysis
a. Session Flows
High bounce rates after landing on the "Create Design" screen.
Low interaction with the “Style” and “Font” sections until users enter text.
Frequent toggling between tabs (T-shirt, Layout, Font, Image) with no final design created.
Back button used often after minimal engagement.
b. Feedback Patterns
Users say:
“I don’t know what to do here.”
“Where do I start?”
“Too many options at once.”
Users often enter text but then stall, unsure whether to pick a style, font, or switch tabs.
3. UX Flow
Step 1: Inspire
Step 2: Prompt
Use a clear CTA like: “Subject”
Offer toggle buttons:
Cat
Sunrise
Motel
Dog
Display Style options (Graffiti, Scrap Collage, Origami, etc.) to give the user a direction in the visual style.
Display Style options (Graffiti, Scrap Collage, Origami, etc.) to give the user a direction in the visual style.
Display Style options (Graffiti, Scrap Collage, Origami, etc.) to give the user a direction in the visual style.
Step 3: Assist
Highlight the Design options as selected
Style: Graffiti
Color Filter: Bright
Trending Prompt
Selection: Cat
Highlight “Generate” once the Subject is filled out to clearly show the user to create the AI design
Step 4: Refine
Generate will create 3 AI image options for the user to select.
If the user does not like the initial AI images and wants more options they can select “Generate Similar” to receive more options.
If they don’t like the concept all together, they can click “New” to start the process over.
Step 5: Place the design
Once the user has selected the image they want, the “Place Artwork” is highlighted and the largest button to help the user easily move on to placing the artwork.
4. Solution Strategy
To solve the problem without using motion (e.g., no animated walkthroughs), we used:
Static Visual Hierarchy Improvements
Static Visual Hierarchy Improvements
Have the Style and Color Filter be the first options to help direct the user in the over design style.
Use a light grey tabs to help inspire the user’s “Subject”
Style Recommendations After Text Entry
Once a user types a word, dynamically highlight 2–3 recommended combos:
Text: Monster
Suggested Style: Graffiti
Suggested Color Palette: Black/White
Motion System
Reusable behaviors that scaled across UX surfaces.
To support clarity and behavioral consistency across the product flow, we built a modular motion system — simple enough to implement, yet flexible enough to reuse across tools and surfaces.
Swipe-in
What it does:
Animates a transition when moving to a new screen or page — for example, when a user selects a product and enters the design studio.
Why it matters:
Reinforces directional flow in multi-step navigation, helping users stay oriented and understand progress within the journey.
Scalable Use:
Used across onboarding flows, product selection, and transitioning between creation surfaces.
Pop
What it does:
Provides feedback when a user selects something (e.g., choosing product type or design style).
Why it matters:
Reduces ambiguity and builds momentary delight — important for creativity tools.
Scalable Use:
Used across product tiles, style icons, font previews.
Swipe-up
What it does:
Reveals tool panels (e.g., font/style selectors) from the bottom of the screen.
Why it matters:
Maintains screen clarity while surfacing secondary options, guiding novice users without clutter.
Scalable Use:
Style selector, image import, font tools — reused across multiple tools and templates.
AI Model Creative Training & User-Centric Styles
Recognizing that our users weren't designers, we focused on providing intuitive starting points instead of complex prompts. Collaborating with a UX researcher, we analyzed current fashion trends and user needs to develop curated style categories (e.g., Kidult, Line Art, Pixel, Monochrome). This system empowered users to generate high-quality, brand-aligned results with simple selections, significantly reducing cognitive load and enhancing creative confidence.
I led the creative direction for training our customized Stable Diffusion XL model, specifically leveraging LoRA (Low-Rank Adaptation) techniques. This was crucial for shaping Ablo.ai's unique aesthetic output:
Strategic Dataset Curation: I prepared and curated extensive image datasets that served as the AI's foundational learning material. This involved strategically sourcing diverse visual references (from the web) and generating new ones (using ComfyUI) to align the AI's output with our desired aesthetic (e.g., minimal forms, nostalgic textures, sculptural silhouettes, and our specific 'Kidult' or 'Line Art' styles).
Workflow for Dataset
For instance, to achieve our distinct 'Line Art' style, I personally generated a dedicated training dataset in ComfyUI, which was then used to train a specific LoRA model. This was a critical step in programming the AI's visual vocabulary.
Custom Model Deployment: This iterative process culminated in the deployment of our custom-trained LoRA models alongside the base Stable Diffusion XL, enabling our platform to generate consistent, brand-aligned outputs at scale.
Semantic Training & Captioning Guidance: I partnered closely with engineers to translate subjective creative concepts like 'soft,' 'playful,' or 'edgy' into actionable AI learning parameters. This included providing guidance on detailed image captioning (leveraging LLMs for description), ensuring the AI accurately interpreted and categorized stylistic nuances within the dataset. This defined how the AI would understand and reproduce specific visual languages for both txt2image and img2img generation.
Workflow for Dataset
Creative Execution
Vision & Strategy Development:
Established a creative vision that seamlessly integrated generative AI with interactive storytelling, redefining the user experience in AI-driven fashion design.
Developed strategies to highlight dynamic, personalized interactions, positioning AI as a transformative tool in the creative process.
Cross-Functional Collaboration:
Led a multidisciplinary team of designers, developers, and AI specialists, ensuring a cohesive execution across visual, technical, and user experience elements.
Partnered with marketing and product teams to align creative concepts with business objectives, maximizing user engagement and industry impact.
Interactive & Visual Experience Design
Directed the creation of AI-generated visuals, including dynamic 3D models, interactive animations, and personalized digital experiences that elevated fashion aesthetics and user engagement.
Designed intuitive interaction flows, ensuring users could seamlessly explore and co-create AI-powered fashion designs.
Technology Integration & Iteration:
Collaborated with AI engineers to push the boundaries of generative design, refining visuals based on real-time user testing and data-driven insights.
Optimized AI-driven customization tools, ensuring a seamless and immersive cross-platform experience.
Launch & Optimization:
Delivered the final campaign with high-impact digital assets, coordinated for web, social, and interactive platforms.
Implemented feedback loops for post-launch optimization, improving engagement metrics through iterative enhancements based on user behavior.
Building the design system & UX Visual Language for ABLO.AI
Result & Impact
Reduced Cognitive Load: Faster onboarding and higher first-session success rates.
Higher Retention: Increased return visits and user engagement through context-aware guidance.
Scalable Design System: Developed reusable frameworks that reduced time-to-market for new features.
Business Growth: Achieved 20% increase in user engagement through personalized, real-time interaction models.
Social Impact: Built a community of 235K+ followers across platforms, creating an active, recurring user base with high engagement rates.
Recognition: Featured in Fast Company, Blockstar for innovative use of AI in digital product design.
Ecosystem Impact: Positioned Ablo.ai as a critical piece in the larger Space Runners ecosystem, connecting product creation (Ablo.ai), digital engagement (Spaceverse), and ownership (Digital Collectibles).
Brand Partnerships: Collaborated with leading fashion and lifestyle brands, including Crocs and SmileyWorld, to bring user-generated designs into real-world expression — bridging digital creativity with physical product experiences.