跳到主要内容

提示词示例参考

提示词示例参考​

  1. 图表不显示，修复参考提示词
示例​
<xxx图表>不显示，请检查echarts代码完整性并修复

---将<>中的内容替换成实际图表名称---
  1. 图表显示尺寸不正确
示例​
1.如果图表对应的父容器是隐藏状态，需要监听父容器显示，再进行图表初始化
2.监听图表对应的父容器dom尺寸变化
3.等变化完成后，再重新对相应的echarts对象进行resize操作，resize的参数需要是父容器的宽高
注意：需要防止容器无限变化
  1. 如何让页面编辑起来更方便

初次生成时，提示词最下方加上示例这一段，可以让生成的页面基本都是支持平台编辑操作的静态内容，

示例​
所有内容都使用静态页面生成，不要使用JavaScript动态生成或者append html. 
代码中的JavaScript代码只用来做跳转或者html元素显隐
  1. 在桌面端模式下一次性生成多张移动端UI图
示例​

## 产品需求：
应用类型：英语背单词的应用

## 技术规格：
▸ 单个HTML每行为3个横向排列的页面预览，可以有2行，六个页面；代码需要包含所有功能页面；
▸ 画板尺寸：375x812（带1px描边模拟手机边框）；强制隐藏滚动条

---核心是技术规格---
  1. 使用deepseek等优化提示词

使用以下模板，让deepsee等大模型优化你的需求描述

示例​
你是一名专业的ui设计师
请对用户输入的需求从页面布局，交互，风格等角度进行优化

用户输入：

输出：

  1. 响应式设计提示词

平台生成的页面默认支持响应式设计，如需要指定变化要求，可参考下方示例

示例​
好示例："生成博客首页原型：桌面端（>1200px）显示3列文章卡片；平板（768-1200px）显示2列；手机（<768px）显示1列，导航栏转为汉堡菜单"
坏示例："博客页要适配手机和电脑"
  1. 表单设计类提示词
示例​
好示例："生成注册表单：2列布局，左列姓名（文本框，必填）/邮箱（格式验证）/手机号（11位数字），右列密码（8-16位含大小写）/确认密码（与密码一致）/验证码（6位数字+发送按钮）"
坏示例："注册表单要有姓名和密码"
  1. 增删元素提示词
示例​
好示例："修改商品详情页：在价格下方新增'服务承诺'区块（图标+文字'7天无理由退货'），删除右侧'加入收藏'按钮（位于'加入购物车'下方）"
坏示例："商品页加个服务说明，去掉收藏按钮"
  1. 布局调整提示词
示例​
好示例："修改列表页：将商品卡片从2列布局改为3列（每列宽度从50%减至33.33%），卡片间距从20px调整为16px，保持响应式断点不变"
坏示例："商品列表改密一点"
  1. 交互调整提示词
示例​
好示例："修改搜索功能：原点击搜索按钮触发搜索，改为输入框输入完成后300ms自动搜索，同时保留按钮触发方式"
坏示例："搜索要改得好用点"
  1. 内容替换提示词
示例​
好示例："修改轮播图：将首页第2张轮播图（当前显示'夏季促销'）替换为'秋季新品上市'，图片尺寸保持1920x500px，文字位置居中"
坏示例："换一下轮播图的内容"
  1. 数据展示样式调整提示词
示例​
好示例："修改销售报表：将'月度销售额'折线图的X轴从'日期'改为'周'（显示近12周），Y轴刻度从0-10000调整为0-15000，添加数据标签"
坏示例："报表的时间维度改一下"
  1. 加载状态样式提示词
示例​
好示例："修改列表加载：将商品列表的整页加载动画（顶部转圈）改为卡片骨架屏（每个商品位置显示灰色占位块，图片区圆形加载动画）"
坏示例："列表加载动画换一种"