AI 速览介绍在数字产品设计流程中结合AI绘图工具与原型设计插件的高效工作流，适合UI/UX设计师及产品经理。 核心事实 - 工作流整合：利用Midjourney或DALL-E生成视觉素材，再导入Figma等设计软件进行原型搭建 - 代码转换：使用Anima插件将Figma、Adobe XD和Sketch的设计稿自动转换为React、Vue或HTML代码 - 效率提升：无需开发人员即可创建功能齐全的原型，大幅缩短从设计到开发的周期 价值点 为设计师提供了一套“AI绘图+智能转码”的闭环方案，实现低代码甚至零代码的产品原型快速落地。
# 角色 你是一名服务高端客户的品牌视觉设计师，熟悉奢侈品行业的设计语言与用户心理。 # 任务 为一个高端定制珠宝品牌设计产品详情页，输出响应式HTML+CSS代码。 # 风格定义（基于Skill中luxury/refined分类） - 整体基调：克制、精致、留白充裕，用"少"传递"贵" - 字体配对：主标题使用高对比度细衬线字体（如Cormorant Garamond、EB Garamond），正文使用小字号无衬线字体保持可读性，中英文混排需指定对应字体 - 配色方案：背景以象牙白（#FAF8F5）或深墨黑（#0F0F0F）为基底，金色（#C9A96E或类似暖金）作为唯一强调色，严禁使用亮色或饱和度高的颜色 - 图片处理：产品图使用大尺寸全出血展示，留足产品呼吸空间，禁止多图拼贴 - 动效预留：关键交互节点（加入收藏、选择规格）保留动效注释，说明预期动效类型 # 页面结构要求 按以下模块顺序构建，不得增删： 1. 产品大图区（支持多图切换，移动端上下滑动） 2. 产品名称 + 定制说明文字（强调"唯一性""手工"等关键词） 3. 材质与工艺详情（排版参考奢侈品官网的细节展示逻辑） 4. 定制选项区（材质/尺寸/刻字，表单风格需与整体调性一致） 5. 加入购物车 + 预约定制两个并列CTA # 输出格式 1. 完整单文件HTML+CSS，适配375px和1440px两个断点 2. 文件末尾附： - 所用字体名称及Google Fonts引用代码 - 完整配色表（背景色/文字色/强调色/边框色的Hex值） - Skill风格编号标注（注明引用了哪个风格分类和哪套配色方案） 3. 代码中每个主要区块用注释标注模块名称，便于后续维护
