中文译文
构建一个名为「Alter」的 Web 应用——一个个性化数字头像创建工具。
核心功能:
- 风格选择器:8 种头像风格以视觉卡片形式呈现(职业头像、动漫、像素艺术、油画、赛博朋克、极简线条画、插画角色、水彩)
- 输入面板:用文字描述期望的外貌和氛围(情绪、颜色、个性)——MVP 阶段无需上传照片
- 生成:调用 fal.ai FLUX API,使用由风格选择和描述构建的结构化提示词——每次请求生成 4 个变体
- 自定义:背景颜色选择器叠加层,可通过 Canvas API 添加可选的用户名/标语文字
- 下载:400px、800px 和 1500px 正方形 PNG
- 历史记录:最近 12 个生成的包保存在 localStorage 中——点击任意一个即可查看并重新下载
UI:明亮、富有表现力、有趣。风格选择使用大型视觉卡片。结果以 2x2 网格展示。移动端响应式。
技术栈:React、用于图像生成的 fal.ai API、用于文字叠加的 HTML Canvas、用于历史记录的 localStorage。
English original
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.