零编程基础小白做产品UI，请不要用Figma
开卷有益
如果你是零编程基础，想做一个产品，比如app、小程序、网页等等，首先要解决的是：我这个页面应该长什么样子？
不要去学figma
我们去小红书、B站各个地方找建议，很多人会告诉你去用figma画一个页面出来。
大家这么建议是因为使用figma设计UI，是软件行业的通用标准。
给大家科普下，一个页面的开发协作流程是，UI设计师们使用figma设计好UI布局，然后交给前端同学，前端同学根据figma来写前端页面。
但是这完全不适合小白，我自己光上手figma就花了几个小时。
终于折腾好了以后，我截图了figma页面给任何一个AI帮我生成代码，没有一个可以完美复刻的。
我的figma图完全白画了 ''__" !!
找参考才是王道
咱们小白就要用小白的思维来想解决办法，我们的原则应该是最快地、最简单的解决开发过程每个问题。
UI最重要的就是布局、风格、配色、交互，这些东西不是专业的、经验丰富的设计师是很难做好的。
我的建议是：找参考
- 低情商：抄袭
- 高情商：借鉴
就像画画一样，没人一上来就能画出蒙娜丽莎，都是从临摹开始。
- 你想做外卖app? 打开美团饿了么看看
- 想做购物小程序? 研究下拼多多微信小商店
- 想做社区? 对着小红书抖音偷师
举个例子
为了表达我的想法，我以开发一个记账软件UI为例。
所有记账软件中，我印象最深刻的就是「喵喵记账」，非常受女生们的欢迎。
它的特点是用萌宠养成来辅助养成记账。每一个分类就是一类喵，比如你记录餐饮支出，就会生成餐饮喵，记录出行支出，就会生成交通喵，你记录得越多，该类喵喵就能解锁更多皮肤。
聪明的你肯定可以出它火的原因：趣味性、萌宠属性、养成类、配图都是手绘、可爱风格
我们可以借鉴做一些东西：
- 简单粗暴版的复刻做一个「汪汪记账」、「牛牛记账」等等
- 喝水提醒小助手： 用一只小海豚作为主角， 每天喝水越多,海豚的装扮越华丽， 连续打卡解锁海洋朋友(章鱼、海星)， 还可以收集不同款式的水杯
- 冥想助手： 主角是一只禅意小猫， 冥想时长增加猫咪智慧值， 解锁不同的冥想场景， 收集各种打坐姿势
- 提肛助手：这我就不展开描述了。。。
这里我简单复刻一下记账页面
V0.dev来快速实现
V0是我目前用过的，根据截图来生成UI最棒的AI，这一点Cursor也比不上。如果你有更好的工具，欢迎评论区留言，我来尝试下
将「喵喵记账」的截图上传，并让它实现即可
1分钟就生成好：
我们来看看「喵喵记账」软件的截图：
布局上是完全一样的。差别就是那些手绘风格的配图，你可以截图它的图，然后使用AI重绘，我这里就不做这个了。
拷贝代码
V0的免费额度很小，一些稍微复杂的页面和交互，无法在免费额度下完成。
因此建议大家将代码下载到本地，使用Cursor进行二次开发，我为Cursor专门开发了一个免费的博客教程：浏览器lookai.top中查看
点击V0的右上角，然后在弹出来的弹板中，点击复制按钮
复制
打开你的电脑的终端，将复制的内容黏贴，回车并执行
执行过程中，除了其中一个会让你填写项目文件夹名字以外，其他的可以无脑回车
Cursor打开
在Cursor新建窗口，打开刚刚你命名的项目文件夹，这个时候你就可以在Cursor中二次开发了。
结语
不知道怎么做，什么是对的的时候，找参考是最快的捷径。