Build spec for a React app that generates avatars in eight styles through the fal.ai FLUX API, adds text overlays and keeps a local history.
Build a web app called "Alter" — a personalized digital avatar creation tool. Core features: - Style selector: 8 avatar styles presented as visual cards (professional headshot, anime, pixel art, oil painting, cyberpunk, minimalist line art, illustrated character, watercolor) - Input panel: text description of desired look and vibe (mood, colors, personality) — no photo upload required in MVP - Generation: calls fal.ai FLUX API with a structured prompt built from the style selection and description — generates 4 variants per request - Customization: background color picker overlay, optional username/tagline text added via Canvas API - Download: PNG at 400px, 800px, and 1500px square - History: last 12 generated packs saved in localStorage — click any to view and re-download UI: bright, expressive, fun. Large visual cards for style selection. Results shown in a 2x2 grid. Mobile-responsive. Stack: React, fal.ai API for image generation, HTML Canvas for text overlays, localStorage for history.
构建一个名为 "Alter" 的网页应用——一款个性化的数字头像生成工具。 核心功能: - 风格选择器:8 种头像风格以视觉卡片形式呈现(professional headshot、anime、pixel art、oil painting、cyberpunk、minimalist line art、illustrated character、watercolor) - 输入面板:输入期望外观和氛围的文字描述(情绪、颜色、个性)—— MVP 版本无需上传照片 - 生成:调用 fal.ai FLUX API,基于所选风格和描述构建结构化提示词——每次请求生成 4 个变体 - 自定义:通过 Canvas API 添加背景颜色选择器叠加层,可选用户名/标语文字 - 下载:提供 400px、800px 和 1500px 的正方形 PNG 格式下载 - 历史记录:最近生成的 12 组头像包保存在 localStorage 中——点击任意一组可查看并重新下载 UI:明亮、富有表现力、有趣。风格选择使用大尺寸视觉卡片。结果以 2x2 网格展示。支持移动端响应式布局。 技术栈:React、fal.ai API 用于图像生成、HTML Canvas 用于文字叠加、localStorage 用于历史记录。