MasterGo AI生成Dashboard卡片布局需“分块引导+结构优先”，先用自然语言明确方向、数量、对齐与间距，再辅以截图和设计稿链接双参考提升还原率，最后校验骨架、启用自动布局、分块精修。

☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

直接用 MasterGo AI 生成 Dashboard 卡片布局，关键不是“一气呵成”，而是“分块引导+结构优先”。它能快速搭出卡片排列的雏形，但真正可用的布局，得靠你明确告诉它：方向、数量、对齐方式、间距逻辑——而不是只说“做个数据卡片”。

先定骨架：用自然语言锁定基础结构

别从细节开始。打开 MasterGo AI → 选「AI 生成界面」→ 输入类似这样的描述：

• “后台 Dashboard 页面，顶部横向排列 6 张统计卡片，每张卡片宽高比为 1:1，等宽等距，左对齐，卡片内含图标、标题、数值、趋势箭头”
• 加上约束：“使用系统默认字体，主色 #2563EB，卡片圆角 8px，阴影柔和”
• 避免模糊表述，比如“看起来专业一点”或“风格现代”，AI 无法解析这类主观词

用双参考提升还原稳定性

单靠文字描述容易跑偏。建议同步提供：

• 本地截图：把设计稿中卡片区域单独截下来，放进 reference 文件夹，让 AI 看到真实比例和视觉节奏
• MasterGo 设计稿链接：确保 AI 能读取原始设计系统中的间距值（如卡片间 gap=24px）、字体层级（H3 标题 16px/20px）、颜色变量名（如 --color-primary）
• 两者并用，结构还原率可从 50% 提升至 70% 以上，尤其在卡片行列数、对齐基准线上更可靠

生成后立刻做三件事：校验骨架、启用自动布局、分块精修

第一版出来后，别急着调颜色或图标——先稳住布局逻辑：

• 检查卡片是否真按 6 列横向排布；若错成 3×2 或堆叠，说明方向指令没生效，需重输“水平排列 6 张”
• 选中所有卡片容器 → 按 Shift+A 添加垂直自动布局（适用于卡片组整体），再对单张卡片内部添加水平自动布局（图标+文字+数值自动对齐）
• 用画布上的手柄拖动调节卡片间距，右侧面板输入精确值（如 spacing=16px），避免目测误差

避开高频翻车点：文字图标不切图、背景定位写数值

顶部卡片区最容易出问题的地方，恰恰藏在细节里：

• 图标别用 PNG 截图：AI 会把它当静态图拉伸失真。应输入“使用 IconPark 的 trend-up 图标，尺寸 20px，颜色同文字”
• 背景图/渐变要带定位参数：比如“卡片背景为线性渐变，角度 135deg，起始色 #3B82F6，终止色 #1D4ED8，背景位置 center”
• 数值单位必须显式声明：写“当前销售额：¥128,450”比“销售额：128450”更易被识别为数字格式，利于后续导出代码时保留千分位