用MasterGo AI做原型布局，核心就一句话：用结构化语义告诉它“你要什么”，而不是教它“怎么画”。它不依赖手绘或拖拽，而是理解描述后自动组织视觉层级和空间关系。关键不是写得多，而是写得准。比如明确输入“微信小程序商品列表页”，用“导航栏”“轮播图”这类术语，再说明“搜索栏固定顶部，下方为横向滑动标签+每行2个商品卡片”，补充圆角、字号、安全区等细节，就能生成符合规范的布局。

说白了，AI需要的是清晰的框架锚定。比如输入“移动端电商首页”，它会默认采用竖向滚动流式布局；输入“后台数据看板”，则倾向网格+卡片+图表组合。避免模糊表述如“一个页面”，直接说“微信小程序商品列表页”或“管理后台用户权限配置页”。结构词很关键：导航栏、轮播图、三列图标区、瀑布流内容区、悬浮按钮、底部Tab栏——这些术语AI识别准确率高，能直接映射到对应组件位置和比例。

明确页面类型和主体结构

AI需要先锚定基础框架。比如输入“移动端电商首页”，它会默认采用竖向滚动流式布局；输入“后台数据看板”，则倾向网格+卡片+图表组合。避免模糊表述如“一个页面”，直接说“微信小程序商品列表页”或“管理后台用户权限配置页”。结构词很关键：导航栏、轮播图、三列图标区、瀑布流内容区、悬浮按钮、底部Tab栏——这些术语AI识别准确率高，能直接映射到对应组件位置和比例。

描述区块功能与逻辑关系

内容块不是孤立存在，AI更擅长按交互逻辑排布。例如：“搜索栏在顶部固定，下方是‘新品’‘热销’‘折扣’三个横向滑动标签，点击任一标签后，下方动态加载对应商品卡片，每行2个，带图片、标题、价格、星级和‘立即抢购’按钮”。这句话里，“固定”“下方”“横向滑动”“动态加载”“每行2个”共同定义了区块的相对位置、尺寸约束和响应行为，AI会据此生成合理间距、对齐方式和视觉权重。

指定视觉参数强化布局控制

颜色、圆角、字体大小等参数虽属样式，但直接影响布局节奏。比如加一句“卡片圆角8px，内边距16px，主色#FA2549”，AI会自动压缩文字行高、调整按钮宽度以匹配整体密度；写“标题字号20px，正文字号14px，行高1.6”，它会预留足够垂直空间避免拥挤。暗色模式、适配手势区域（如底部安全区）、手指热区最小尺寸（如按钮不小于48×48px）这类细节，也能让生成的布局更符合真实设备规范。

用迭代指令微调已有布局

首次生成后若某块偏大、太密或错位，不用重写整段描述。直接输入具体指令即可修正：“把分类导航条高度调为56px”、“商品卡片之间增加12px间隙”、“将评分图标右对齐并缩小20%”、“搜索栏左侧留白改为32px”。这类短句指令响应快，且修改结果会继承原布局逻辑，不会打乱整体结构。