AI编程⑨:claude-4-sonnet UI 提示词

 

YAML
需求文档

### **一、用户体系模块**
1. **微信授权登录**  
   • 支持微信一键授权获取用户昵称、头像等基础信息  
   • *首次登录强制绑定手机号*(符合教育类产品实名要求)  
   • *用户信息管理*:支持修改头像/昵称、查看绑定手机号

2. **积分账户体系**  
   • 积分余额展示(首页顶部状态栏)  
   • *积分明细查询*:展示充值/消耗记录及时间  
   • *积分获取途径*:  
     ◦ 充值1元=10积分(支持微信支付)  
     ◦ *分享小程序得1积分/天*(社交裂变设计)

---

### **二、核心功能流程**
1. **作文批改流程**  
   • **拍照上传**  
     ◦ 支持单张/多张拍摄(自动拼接长作文)  
     ◦ *图片预处理*:自动纠偏、去阴影、增强文字对比度  
   • **AI批改引擎**  
     ◦ 调用豆包大模型API,输出结构化批改结果:  
       ▶ 总分评级(A/B/C/D)  
       ▶ 分项评分(语言/结构/内容)  
       ▶ 错别字/病句标注(波浪线标记+修改建议)  
       ▶ 好词好句点评(高亮标注+提升建议)  
       ▶ 思维导图式结构分析(开头-发展-结尾优化建议)  
   • *批改记录保存*:自动存储最近10次记录(支持下载PDF)

2. **积分消耗规则**  
   • 每次批改消耗1积分(余额不足时弹窗引导充值)  
   • *预览基础评分*:免费展示总分及评级,点击详情需扣积分

---

### **三、支付系统模块**
1. **充值套餐设计**  
   • 基础包:1元=10积分(突出显示)  
   • 成长包:4.9元=60积分(首充优惠)  
   • *连续包月*:9.9元/月享150积分(MVP阶段暂缓开发)

2. **支付安全机制**  
   • 微信支付SDK集成(符合金融级加密标准)  
   • *未成年模式*:单笔充值≤50元,月累计≤200元

---

### **四、辅助功能补充**
1. **历史记录管理**  
   • 按时间排序的批改记录列表  
   • 支持关键词搜索(如作文题目/评分等级)  
   • *对比模式*:并排显示原文与修改建议

2. **用户反馈系统**  
   • 批改结果右下角添加「反馈」按钮(提交AI误判案例)  
   • *智能客服*:预设常见问题库(如积分规则/拍照技巧)

---

### **五、技术实现要点**
1. **OCR增强方案**  
   • 集成腾讯OCR识别手写体(准确率≥92%)  
   • *多语言支持*:优先实现简体中文识别(其他语言MVP阶段屏蔽)

2. **性能优化策略**  
   • 批改响应时间≤30秒(进度条+等待动画设计)  
   • 图片压缩传输:1MB以上图片自动压缩至800KB

---

### **六、合规性设计**
1. **隐私政策**  
   • 明确说明图片数据仅用于批改(不存储原图)  
   • GDPR合规:提供账号注销功能

2. **适龄提示**  
   • 启动页增加「适合12岁以上用户」说明  
   • 夜间模式(22:00-6:00自动切换护眼色调)

 

JSON
提示词
我想开发一个小程序,核心功能 @xuqu.md,现在需要输出高保真的原型图,请通过以下方式帮我完成所有界面的原型设计,并确保这些原型界面可以直接用于开发:
1、用户体验分析:先分析这个 App 的主要功能和用户需求,确定核心交互逻辑。
2、产品界面规划:作为产品经理,定义关键界面,确保信息架构合理。
3、高保真 UI 设计:作为 UI 设计师,设计贴近真实 iOS/Android 设计规范的界面,使用现代化的 UI 元素,使其具有良好的视觉体验。
4、HTML 原型实现:使用 HTML + Tailwind CSS(或 Bootstrap)生成所有原型界面,并使用 FontAwesome(或其他开源 UI 组件)让界面更加精美、接近真实的 App 设计。拆分代码文件,保持结构清晰:
5、每个界面应作为独立的 HTML 文件存放,例如 home.html、profile.html、settings.html 等。
- index.html 作为主入口,不直接写入所有界面的 HTML 代码,而是使用 iframe 的方式嵌入这些 HTML 片段,并将所有页面直接平铺展示在 index 页面中,而不是跳转链接。
- 真实感增强:  - 界面尺寸应模拟 iPhone 15 Pro,并让界面圆角化,使其更像真实的手机界面。
- 使用真实的 UI 图片,而非占位符图片(可从 Unsplash、Pexels、Apple 官方 UI 资源中选择)。
- 添加顶部状态栏(模拟 iOS 状态栏),并包含 App 导航栏(类似 iOS 底部 Tab Bar)。
  请按照以上要求生成完整的 HTML 代码,并确保其可用于实际开发。

 

posted @ 2025-09-12 14:54  周大福001  阅读(61)  评论(0)    收藏  举报