使用cursor进行原型图设计
1.下载cursor
2.模式设置：
模型使用claude-3.7-sonnet的think模式
3.引导词模板：
我想要开发一个中高考英语口语考试的模拟考试系统，我需要将上面的这个应用输出成高保真的原型图设计。请考虑以下的规范：
- 用户体验：先分析产品的主要功能和需求，确定下核心能力
- 产品规划：希望你作为一个20年的产品经理，来设计我们的整个产品，确保架构非常合理
- UI设计：作为30年的UI设计师，要保证符合目标人群的使用习惯，符合网页端的设计规范，使用比较现代化的UI元素，注重产品体验和视觉
- 输出：
请使用HTML+Tailwind CSS来生成所有的原型图界面，可以使用FontAwesome来美化界面，接近真实的网页效果
请根据功能拆分代码文件，保持结构清晰，每个功能界面需要一个独立的HTML文件，比如home.html, exame.html, me.html等等
尽可能使用Tailwind CSS样式，如果需要自定义的话，请用独立的css文件，然后引入到html代码中来
用index.html作为主入口，不直接写入所有界面的代码，这里我们使用iframe的方式来嵌套其他页面，并将所有页面直接展示到index页面上
界面尽可能适配大部分网页界面的真实外观
页面里面需要使用的图片，可与从unslpash，pexeis获取图片
尽最大的可能降低页面的TOKEN
保证我们的代码页面最后能够很顺畅的转为figma文件进行二次编辑
4.提示词进一步改善
可进行产品设计参考的社区：dribbleDribbble - 发现世界顶级设计师和创意专业人士
可以在里面找到自己想参考的设计图，然后在想修改的网页的chat聊天框内将图片粘贴进去，并输入以下提示词：
希望能够参考图片中的样式和颜色搭配，修改home exam me progress页面（列举需要修改的页面）
5.原型改善
- 搜索到相应的Figma插件Figma插件组件推荐-插件库安装- Figma 中文社区
- 在里面通过关键词（如：html）搜索到相应的插件---->点“open in"那个绿色按钮---->new一个figma file
- 6.部署生成的内容
- cloudflare进行部署全球云平台 | Cloudflare 中国官网 | Cloudflare
- 7.部署完之后再将部署完的url传到figma插件中生成相应的原型图