MasterGo AI不生成小程序原生代码，但可高效产出符合微信小程序设计规范的主题UI界面图；需明确平台约束、精准描述尺寸/颜色/组件，并通过导出资源或转译代码适配开发。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
MasterGo AI 本身不直接支持“小程序原生框架”（如微信小程序 WXML/WXSS）的代码生成，但它能高效生成**符合小程序设计规范的主题 UI 界面图**，再通过手动适配或导出通用前端代码快速落地。关键在于用对描述、选对参数、善用调整指令。
明确小程序平台与设计规范
小程序有明确的视觉约束：安全区域、底部 TabBar 高度（约 50px）、顶部导航栏高度（44–64px）、rpx 布局逻辑、圆角偏小（常用 8px）、图标尺寸统一（如 24×24 或 48×48）。在输入描述时需主动体现这些细节：
- 开头注明“微信小程序首页”，而非笼统说“移动端”
- 写明“顶部固定导航栏，高度44px，背景色#FFFFFF，文字深灰#333”
- 强调“底部TabBar含4个图标：首页、分类、购物车、我的，选中态高亮色#FA2549”
- 要求“所有间距使用8px/16px/24px等偶数倍，禁用非整数像素值”
输入精准的主题化描述
主题 UI 的核心是风格一致性。不要只写功能，要带设计语言：
- 用颜色锚点：如“主色#FA2549，辅助色#666，背景色#F8F8F8，文字默认#333，禁用纯黑#000”
- 定圆角与阴影：“按钮圆角8px，卡片圆角12px，仅在卡片和弹窗加轻微阴影（box-shadow: 0 2px 8px rgba(0,0,0,0.06)）”
- 指定字体层级：“标题用18px加粗，正文14px常规，辅助说明12px浅灰#999”
- 加入小程序典型组件：“使用微信风格的‘搜索框’组件（带放大镜图标+占位文字），‘加入购物车’按钮采用绿色渐变底色”
生成后快速适配小程序开发
AI 生成的是设计图，不是即用的小程序代码，但可大幅缩短开发路径：
- 点击“插入到画布”后，在 MasterGo 中右键图层 → “导出为 SVG/PNG”，用于替换小程序静态资源
- 用“代码导出”功能生成 Vue 或 React 版本（基于 Tailwind CSS），再对照小程序语法手动转译：比如把
class="flex items-center"改为class="flex flex-row items-center"，把v-if换成wxs:if - 利用生成图的尺寸标注（MasterGo 自带标尺和间距提示），直接套用 rpx 单位：例如图中按钮高 44px → 小程序中设为
height: 88rpx（按 2:1 换算） - 对 TabBar、导航栏等高频模块，生成后保存为“设计系统组件”，后续页面复用，保证主题统一
常见问题处理技巧
生成结果若偏离预期，别重来，用微调指令快速修正：
- “把所有按钮文字改为14px，字重500”
- “TabBar 图标尺寸统一为48×48，间距调至20px”
- “将轮播图高度设为300px，图片圆角12px”
- “移除所有下划线，链接改用颜色区分（#FA2549）”
