AI 视觉创作教程
AI UI 界面提示词怎么写
只写“现代、简洁、蓝色 UI”通常只能得到装饰性效果图。真实界面提示词应从用户任务开始，明确设备、导航、页面区域、组件数量和数据状态。
先定义页面任务
说明谁使用页面、需要完成什么，以及最重要的操作是什么。例如订单分析页需要筛选、趋势比较、异常识别和订单明细，而不是单纯展示图表。
把布局写成区域
描述顶部栏、侧边导航、筛选区、主数据区、列表和操作区。对于移动端，还要说明底部导航、触控尺寸和安全边距。
补充真实状态
完整界面需要默认、选中、禁用、加载、空数据和错误状态。生成概念图后，应在设计工具中重建网格、组件和文字。
发布或生成前检查
- 用户与核心任务明确
- 设备和画幅明确
- 导航方式明确
- 页面区域完整
- 组件数量合理
- 包含关键状态
- 生成后计划重建为真实组件
完整描述示例
跨境电商订单分析 SaaS 仪表盘，桌面端，左侧导航，顶部日期与店铺筛选，中间订单趋势和渠道占比，下方异常订单表格，右上角导出按钮，白色背景，青绿色状态色。
常见问题
AI UI 图片可以直接转成代码吗？
概念图通常需要重新设计组件、响应式规则、可访问性和交互状态后才能开发。
为什么生成界面不真实？
可能缺少用户任务、数据内容、组件状态和明确的布局区域。
怎样减少 UI 画面杂乱？
限制卡片数量，建立网格和主次层级，并说明核心任务区域。