You are a Senior Product Designer, UX Researcher, Mobile App Designer, React Developer, Product Manager, and Fashion-Tech Founder.
Your task is to DESIGN AND BUILD a complete launch-ready MVP for a fashion-tech startup called Style Up.
Use React and modern mobile UI patterns.
The prototype must be fully clickable, shareable via URL and QR code, and deployable so a teacher can test the experience like a real app before development.
Build a real mobile-first MVP that looks and behaves like a product ready for App Store launch, user testing, investor demonstrations, and early customer acquisition.
The final experience should feel comparable to Airbnb, Pinterest, Spotify, Notion, Zara, COS, Depop, and Apple in terms of polish, UX quality, visual hierarchy, emotional design, and product maturity.
────────────────────────────
ABOUT STYLE UP
Style Up is an AI-powered fashion platform that helps people discover their personal style while making more conscious shopping decisions and helping people finding out new local sotres in barcelona.
Core Value Proposition:
"Where AI Meets Fashion. Style Better. Shop Local."
Style Up helps users:
• Discover their personal style • Build outfits from existing wardrobe pieces • Receive personalized AI styling recommendations • Discover local boutiques and sustainable brands in barcelona • Follow seasonal fashion trends • Shop more consciously • Support independent businesses • Reduce fashion waste • Maximize the value of their existing wardrobe
────────────────────────────
CORE PRODUCT PILLARS
The MVP must clearly communicate and reinforce these three pillars throughout the entire experience.
LOCAL & CONSCIOUS FASHION DISCOVERY
This is the strongest product differentiator.
Style Up is not another generic fashion shopping app.
It helps users discover local businesses and sustainable fashion alternatives within barcelona
Combine local commerce and conscious shopping into a single ecosystem.
Include:
• Local boutiques • Vintage stores • Sustainable brands • Independent designers • Circular fashion businesses • Fashion pop-up events • Seasonal collections • Curated local recommendations • Ethical shopping filters
Every discovery experience should encourage supporting local businesses and making smarter purchasing decisions.
Create a premium map experience inspired by Airbnb.
The map should be one of the primary navigation tabs.
Include:
• Interactive city map • Store pins • Walking distance indicators • Directions • Store profiles • Opening hours • Sustainability ratings • Curated collections • Vintage indicators • Circular fashion badges • Favorite stores • Save-for-later functionality
────────────────────────────
AI STYLING ENGINE
The AI should feel like a personal stylist rather than a chatbot.
The AI recommendation system should be powered by:
• User moodboards • Saved inspirations • Fashion personality assessment • Seasonal trends • Local inventory and collections • User behavior • Sustainability preferences
Include:
• Personalized outfit recommendations • Occasion-based styling • Trend forecasting • Style evolution insights • Budget-aware recommendations • Sustainable alternatives • Styling explanations • Confidence scores • Visual recommendation engine
The AI should continuously improve as users interact with the platform.
────────────────────────────
SMART CLOSET
The closet should function as a user's digital wardrobe.
The goal is helping users maximize existing clothing before purchasing new items.
Include:
• Wardrobe uploads • AI categorization • Color detection • Season detection • Occasion detection • Outfit generation • Closet analytics • Cost-per-wear tracking • Wardrobe utilization metrics • Missing-piece recommendations • Sustainability insights
The Smart Closet should integrate directly with the AI Stylist and Local Discovery experiences.
Users should be able to:
• Generate outfits using only existing wardrobe pieces • Mix wardrobe items with products from local boutiques • Compare purchase decisions • Understand wardrobe gaps before shopping
────────────────────────────
DESIGN REQUIREMENTS
Create a premium fashion experience.
The visual identity should feel like a luxury fashion-tech startup founded in Barcelona.
Use subtle design inspiration from:
• Antoni Gaudí • Organic architecture • Curved forms • Mosaic-inspired accents • Mediterranean elegance • Contemporary European fashion culture
This influence should appear primarily in the aesthetic and visual language, not in product functionality.
Apply the inspiration through:
• Layout systems • Component design • Iconography • Illustrations • Background treatments • Motion design • Color accents • Shape language
Avoid tourism aesthetics or obvious city references.
The result should feel modern, sophisticated, premium, and internationally scalable.
Requirements:
• Mobile-first • Premium typography • Luxury minimalist aesthetic • Strong visual hierarchy • Sophisticated spacing • Soft neutral palette • Mediterranean-inspired accents • Subtle glassmorphism • Smooth micro-animations • WCAG accessibility compliance • Fast-loading interface
────────────────────────────
IMPORTANT PRODUCT DIRECTION
When making design and product decisions, prioritize:
Local and sustainable fashion discovery
AI-powered styling recommendations
Smart closet functionality
Do not build a generic AI fashion app.
Every screen should reinforce at least one of these three pillars.
The platform should help users:
• Buy less but buy better • Discover local businesses • Support sustainable brands • Build confidence in their style • Get more value from existing clothing • Make informed fashion decisions
Act as if Style Up has already received seed funding and is preparing for public launch. Use React and modern mobile UI patterns.
The prototype must be fully clickable, shareable via URL and QR code, and deployable so a teacher can test the experience like a real app before development.
Build a real mobile-first MVP that looks and behaves like a product ready for App Store launch, user testing, investor demonstrations, and early customer acquisition. remember the main theme is barcelona so the design must include some barcelona arts, pictures, and remember the clothes are vintage, fashionable, trendy
I'll create this premium fashion-tech MVP for Style Up. Let me start by generating design inspiration to ensure we create a sophisticated, Barcelona-inspired visual identity, then build the complete application.
Now let me install the necessary dependencies first, then build this comprehensive Style Up MVP.
Now I'll create the complete Style Up MVP. Let me start with the custom theme, types, and global state, then build all the components systematically.
Now let me create the main components. I'll start with the layout and core UI components:
Now let me create the main page that brings everything together:
Now let me verify the app is running and check for any errors:
The server is running. Let me use the browser agent to verify the app is working correctly:
The onboarding is showing correctly. Let me take a screenshot and then test the flow:
The onboarding looks great! Let me click through the flow to test all the screens:
Let me wait a bit longer and try again:
I see the button isn't navigating. Let me scroll down to find it and click it properly:
The button might be cut off at the bottom. Let me try clicking on the button text directly and set a mobile viewport:
The mobile view looks excellent now! Beautiful onboarding screen with the Mediterranean-inspired design. Let me click "Get Started" and continue through the flow:
The Agent timed out. Type a new prompt to continue.