As a user, I want to use the backend API for user registration and login so that my account is securely created and authenticated. Implement FastAPI endpoints: POST /auth/signup (email, password, name), POST /auth/login (returns JWT token), GET /auth/me (returns current user profile). Use MySQL via Alembic migrations for user storage. Supports the Signup and Login pages.
As a frontend developer, I want to implement the FloorForge color palette (#F5F5F7 background, #FFFFFF surface, #2C2C2E text, #0078D7 accent, #A6A6A8 muted) and global typography (Inter font family) across all scaffold pages. This includes removing any unused pages not present in the user flow, setting up shared CSS variables/tokens, global layout wrappers, and ensuring all existing scaffold pages (home, login, signup, welcome, dashboard/overview, dashboard/ai-assistant, dashboard/settings) visually align with the design system. This task must be completed independently before all other UI tasks.
As a user, I want to sign up for a FloorForge account on a premium Signup page built from the existing v2 JSX design. The page includes a split-panel layout (brand panel left, form right), registration form (full name, email, password, confirm password with show/hide toggle), Google SSO button, password strength indicator, terms checkbox, and on success redirects to Login. Connects to POST /auth/signup API. Follows FloorForge color tokens and blueprint micro-interaction aesthetic.
As a user, I want to use the Studio page to view and interact with AI-generated 2D and 3D floor designs, built from the existing v2 JSX design. The page includes a 2D floor plan viewer, a 3D model viewer with toggle, a prompt refinement input for iterating on designs, and a Save to Library button. Users arrive from Dashboard and can navigate to Library after saving. Wired up in the integration task.
As a user, I want to use the AI API to submit a natural language prompt and receive a generated 2D and 3D floor design. Implement a FastAPI endpoint POST /generate that accepts a prompt string, routes through LiteLLM to GPT-5.2 for NLP interpretation, and triggers image generation via Google Nano Banana. Returns structured design data (2D image URL, 3D model data). Integrates with Langchain for prompt processing pipeline.
As a user, I want to experience the FloorForge Landing page based on the existing v2 JSX design. The page includes: NavBar with frosted-glass effect and links to all pages, Hero section with animated blueprint and dual CTAs, BlueprintDemo interactive canvas with SVG stroke animation, ValueProposition 3-column grid, FeatureHighlights zigzag rows, HowItWorks 3-step flow, PromptShowcase interactive demo, SocialProof testimonials carousel, PricingTeaser plan cards, CallToAction band, and Footer. Navigates to Signup and Login pages.
As a user, I want to use the backend API to save a generated design to my account and retrieve all previously saved designs. Implement FastAPI endpoints: POST /designs (save design with prompt, 2D image, 3D model data, title), GET /designs (list all saved designs for the authenticated user), GET /designs/{id} (retrieve a specific design). Uses MySQL storage via Alembic migrations. Supports the Studio save flow and Library page.
As a user, I want to log in to my FloorForge account on a polished Login page built from the existing v2 JSX design. The page includes email/password form with validation, FloorForge branding, a link to Signup, and on success redirects to Dashboard. Connects to POST /auth/login API and stores JWT. Follows FloorForge color tokens and premium aesthetic.
As a user, I want to use the Dashboard page as the main entry point post-login, where I can enter a natural language prompt to initiate floor design generation. The page includes a prompt input area styled as a drafting table, navigation sidebar with links to Studio and Library, recent designs preview, and account info. On prompt submission, navigates to the Studio page. No existing JSX design — include design sub-step. Follows FloorForge premium aesthetic.
As a user, I want to use the Library page to view, browse, and access all previously saved floor designs, built from the existing v2 JSX design. The page includes NavBar, LibraryHero with 'New Design' CTA, SearchFilterBar, SidebarFilters, ActiveFiltersChips, a responsive DesignGrid of saved design cards, EmptyState, and Pagination. Users arrive from Studio after saving. Wired up in the integration task.
As a user, I want the Studio page to call the AI generation API with my prompt and display the returned 2D and 3D design, and allow me to save it to my library via the backend. Wire up the Studio frontend (POST /generate on submit, render results, POST /designs on save). Handle loading states, error messages, and retry/refine prompt loop.
As a user, I want the Library page to fetch and display all my saved designs from the backend API so I can browse and reopen them. Wire up GET /designs to populate the Library grid, handle empty states, and implement click-through to reopen a design in Studio via GET /designs/{id}.

No comments yet. Be the first!