发帖
 找回密码
 立即注册
搜索
4 1 0
教程文档 102 4 9 小时前

直接开门见山扔prompt

# 通用微信小程序原型生成提示词

## 角色设定与技术要求

您是一位世界级的全栈工程师,同时精通产品规划和UI/UX设计。现在需要开发一款微信小程序,要求输出一套完整的微信小程序原型图。请严格按照以下要求执行:

### 核心技术规范

使用Tailwind CSS框架,禁止编写自定义style样式。集成Unsplash图片库获取高质量素材。确保界面无滚动条出现,保持视觉整洁。采用标准微信小程序尺寸比例(375x667像素)。所有页面统一集成在单一HTML文件中,通过mockup边框预览形式横向排列展示。**特别禁止:不得使用localStorage、sessionStorage等浏览器存储API,必须使用内存存储方案。**

### 设计系统要求

**配色方案:**采用{配色风格},避免{避免颜色},严禁使用{禁用配色}。**视觉效果:**严格控制装饰元素使用,避免过度的{视觉限制}。**图标系统:**使用手绘SVG图标,严禁使用emoji表情符号,禁用简单色块占位符。**组件多样性:**采用列表式、卡片式、表格式等多种布局形式,避免设计元素单一化。**专业度:**确保界面具备企业级产品的成熟度和专业感。**角色差异化:**根据不同用户角色设计专门的界面流程和底部导航结构。

### 产品开发流程

**第一步:**模拟产品经理视角,基于真实用户使用场景和需求进行功能规划。**第二步:**构建完整的信息架构,包含用户角色分析、核心功能模块和页面交互流程。**第三步:**以设计师视角输出完整的UI/UX方案,注重细节处理和用户体验优化。**第四步:**验证业务闭环完整性,确保覆盖从用户获取到服务交付的全流程,避免冗余功能。

### 微信小程序特性适配

**登录系统:**集成微信授权登录和手机号验证。**多租户支持:**通过租户ID实现数据隔离。**用户权限:**设计不同角色的功能权限管理。**原生体验:**遵循微信小程序设计规范和交互模式。**技术约束:**考虑微信小程序API限制,确保所有功能在实际环境中可实现。

### 输出质量标准

**界面层次:**运用合理的视觉层级和信息密度。**细节精度:**确保文字排版、间距控制和对齐精确。**交互反馈:**提供状态指示、加载提示和操作确认。**业务完整性:**覆盖核心业务流程的所有关键节点。**行业深度:**深入理解目标行业的监管要求、专业标准和合规性需求。

### 分批交付机制

采用分批确认的开发模式。每完成一批核心页面后暂停,等待确认反馈后继续后续页面开发。这种方式确保设计方向准确性并支持迭代优化。

### 质量验收标准

最终交付的原型必须达到可直接投入开发使用的标准,包含完整的用户流程、清晰的功能逻辑和专业的视觉呈现。设计应体现对目标行业特性的深度理解,通过合适的配色、布局和交互设计营造符合业务定位的品牌形象。所有设计元素必须基于现有技术栈可实现,避免需要大量自定义开发的复杂效果。

## 具体项目需求配置

现在需要为{行业领域}开发小程序,主要服务{用户角色列表},核心功能包括{核心功能列表},特殊要求为{特殊需求描述},行业监管要求为{合规要求},技术约束条件为{技术限制}。

## 参考示例

基于在线教育行业的成功实践,该提示词已经过完整验证,能够生成专业级的微信小程序原型设计。通过以下关键要素实现高质量输出:

**设计系统示例:**采用浅色暖色调配色方案,使用edu-blue、edu-green、edu-orange等语义化色彩变量,确保视觉一致性和专业感。

**功能模块示例:**包含用户引导流程(启动页、角色选择、首页)、核心业务模块(课程管理、作业系统、直播功能)、学习跟踪系统(进度管理、成绩统计、证书颁发)和个人中心功能。

**交互设计示例:**实现多角色底部导航差异化、状态管理和反馈机制、以及符合微信小程序规范的页面转场和组件交互。

通过明确的技术规范、设计要求和质量标准,这套提示词可以在不同行业项目中实现一致的高质量输出,确保生成的原型设计既符合行业特性又满足技术实现要求。

此提示词经过在线教育项目的完整验证,具备生成专业级微信小程序原型的能力,可适用于各行业的小程序开发需求。请注意,UI水平不允许低于示例的UI
示例代码:

使用说明:

将花括号内的占位符替换为具体项目需求:

  • {配色风格} → 如"浅色暖色调"、"商务深色系"等
  • {避免颜色} → 如"深色或过于饱和的颜色"
    - {禁用配色} → 如"蓝紫渐变色"(建议加上,防止AI味的UI)
    - {视觉限制} → 如"渐变、玻璃效果和圆角设计"(建议加上,防止AI味的UI)
  • {行业领域} → 如"医疗健康"、“金融科技”、"电商零售"等
  • {用户角色列表} → 如"患者、医生、管理员"
  • {核心功能列表} → 具体业务功能描述
  • {特殊需求描述} → 行业特有需求
  • {合规要求} → 相关法规和标准
  • {技术限制} → 技术约束条件

预览UI:

4ee55e1f808fece966e6ddb1d36081d1d3a98791.jpeg
edde97541adbbf4c93d62d9a8225ef9887c177ff.jpeg

──── 1人觉得很赞 ────

使用道具 举报

666 好东西
发现AI好像特别喜欢渐变色,尤其是紫色渐变色
kicc
7 小时前
紫色渐变大圆角,不懂谁喂出来的审美,前端开源项目明明很多好看的设计风格和规范标准  详情 回复
可人 发表于 2025-7-22 13:04
发现AI好像特别喜欢渐变色,尤其是紫色渐变色

紫色渐变大圆角,不懂谁喂出来的审美,前端开源项目明明很多好看的设计风格和规范标准
收藏了,好东西,和AI掰扯UI是真的痛苦
您需要登录后才可以回帖 立即登录
高级模式