[野路子开发] 不会编程的设计师如何做网站? Cursor AI 带我一周开发 App 图标库

[ViggoZ]

APPLORE - 探索 App 图标设计的宝库

大家好,我是一名设计师，现在算半个独立开发者。最近我花了一周的时间,开发了一个叫 APPLORE 的网站,专门用于探索和分析 App 图标设计。给大家介绍一下这个项目: APPLORE

项目背景

作为一个搞了 8 年的设计师,我一直对 App 图标 LOGO 的设计很感兴趣。每次浏览 App Store ,有很多好看的图标，但是也有很多辣眼睛的图标。如果有一个专门收集展示和分析好看的 App 图标的平台就好了。于是, APPLORE 的想法应运而生。

开发过程

整个开发过程大约花了一周时间。用 Next.js 作为主要框架, 借助 Cursor AI 的帮助快速编写代码。我不是专业的开发，所以我是完全借助 Cursor AI 帮我开发的这个项目

主要功能

APPLORE 的核心功能包括:

1. 按类别、颜色或发布日期浏览 App 图标
2. 查看每个 App 的详细信息
3. 分析 App 图标的配色方案
4. 创建和管理自定义图标收藏
5. 强大的搜索功能
6. 提交新的 App 图标到数据库

技术亮点

在开发过程中,我特别关注了以下几个技术点:

1. 使用 R2 存储来高效管理大量图标文件
2. 实现了流畅的无限滚动加载
3. 采用响应式设计,确保在各种设备上的良好体验
4. 优化了图标加载速度,提供流畅的浏览体验

未来计划

APPLORE 目前还处于初期阶段,我计划在未来添加更多功能,如:

1. 图标设计趋势分析
2. 图标风格筛选查看

结语

开发 APPLORE 对于一直做设计的人来说非常有趣。我希望这个工具能为设计师、开发者以及 App 爱好者们提供价值。欢迎大家访问 APPLORE 体验,也期待听到你们的反馈和建议!

也可以在 twitter 上找到我

[kneo]

以前我对 cursor 帖子是不是推广还半信半疑，现在我完全信了就是推广。不然不可能这么强调 cursor ，不仅放在标题，内容里还高亮。

[ztm0929]

@kneo Cursor 确实有付费推广，在 YouTube 上是有标明的。我倒是很好奇 V2EX 的推广是如何统计与结算的。似乎这个平台还算是小众。

[ViggoZ]

@kneo 哈哈 可以很确定的告诉你，不是推广。你们是开发不知道 cursor 的好，如果你们压根不会写代码用 cursor 就知道为什么好用了。我就不做解释了。

[ViggoZ]

@ztm0929 有联系方式的话发我，我去联系要个广告费

[ztm0929]

@ViggoZ 抱歉让你误解了，我没有证据说你是 Cursor 推广…我的本意是从 YouTube 观看体验推断 Cursor 有大量推广。

[GeekGao]

UI 蛮好看。 你是怎么实现效果图到代码的，Cursor 可以做到嘛？

[guiyumin]

@kneo cursor 用来糊增删改查的代码，确实太尼玛高效了，不服不行啊

[MYDB]

推广越多越难用的玩意，打着周刊名义发布广告，可能背后是一个矩阵发广的小团队，没细查 懒得去挖，block 了，域名也 dns 主动屏蔽了，并已提交至各大主流的广告屏蔽规则列表

[marquina]

赞👍
想交流一些问题。nextjs 的选型是如何做出的？ ui 库用的是哪一个？

[vsitebon]

@kneo #1 其实还有一个原因是因为最近 cursor 相关的内容就自带流量，不标在标题上没办法吸引流量

[tqyq88]

没用过 cursor ，有个小疑问，随着需求的迭代，最后 cursor 会堆出屎山吗？

[kneo]

@vsitebon 呃……那他应该知道只要发就会被质疑是不是拿钱了……

[LanhuaMa]

Cursor, Cursor Cursor Cursor, AI, Cursor, **Cursor**, Curcurcurssor, Cursor > Copilot, Cursor cursor cursor

[wzl2368014742]

看起来确实像推广，不过确实好用

[kxg3030]

@ViggoZ 你这话说的就假了 “不是推广不知道 cursor 的好” 你在说什么玩意 还有比开发更能理解 cursor 便利的么 举报

[cjh1095358798]

效果很不错，ui 是你自己出的设计图让 cursor 实现的吗，这些 app 的数据是哪里来的呢

[tracebundy]

用下来 Cursor 确实是最强的。但不能支持 Jetbrains 还是选择 Copilot

[ViggoZ]

@marquina tailwindcss 的基础样式我会一些，AI 给了简陋的界面我自己手动去改，或者参考一些 tailwind 模板样式让 AI 自己改，或者我自己手动改。

[ViggoZ]

@GeekGao 我基本没有设计稿，都是做一步看一步，我个人感觉直接设计稿生成代码不太好用

[ViggoZ]

@cjh1095358798 UI 是我自己改的，tailwindcss 样式还是很好写的，可以让 AI 辅助来写，比如“这个按钮用黑色描边，内边距大一点”等等这种。等于是之前花 UI 稿，现在直接用 tailwind 来写样式就行了。

[cjh1095358798]

@ViggoZ 包括交互都是 cursor 写好的，然后你用 tailwindcss 调样式吗，目前我看其他人分享的 cursor 项目包括我自己写的一些 cursor 实现功能都不错，但是 ui 这一块基本上还是按照 cursor 生成的为主，如果要做成完善的用户体验好项目还需要设计还原，这部分你做得很好，可以分享下如何做设计到代码实现这块用 cursor 详细实现吗，或者期待出一个视频分享，关注你的 twitter 了

[ViggoZ]

@cjh1095358798 因为我本来就是做设计的，这些样式都是自己直接上手改的，跟做设计差不多，边找好看的网站参考，边让 AI 帮我改，基本都是一点一点改，就按钮大一点，间距小一点，用 cursor 的 ⌘+K 比较多，或者就是 Chat 直接问。我 twitter 上会发一些分享，有空

[xuAN111]

cursor 很好用啊，目前已经替代 vscode 成为主力了。

[tianzeteam]

op 请教个问题，图标 Screenshots 资源是哪里来的

[lizy0329]

Cursor 好像知道我要做什么似的，就是免费 得 2000 completions 用得太快了，写两行就没了

[lizy0329]

@GeekGao 先画个线框图给 V0 ，再告诉 Cursor 自己要做什么，不断调用 ask/edit 功能，再自己了解下 tailwind 排版规则，应该是不难得

[Dragonphy]

不是，哥们儿，这我还搞鸡毛编程啊，学设计去了

[ViggoZ]

@tianzeteam 苹果官方的 API

[cPO3Im7cn3lD39cU]

哈哈哈 除非 lz 开源源码 要不然这绝对是推广帖

[hhacker]

一天两稿洗 v2, 三番五次推 cursor

[ixinshang]

眼熟的 OP ， 某个导航网站的作者？

[ViggoZ]

@tpjaord 开源也不是不行，我已经开源了好多个项目了

[gogogo1203]

你那个 get-all-app-info fetch 也太离谱了。跟上次那个做 checkplug 的一样， 花点时间在编程基础和看看 production ready 的 repo . Cursor 再好用，你也要问对问题。

[ViggoZ]

@gogogo1203 说实话你说的这些我看不懂，我就当你是在炫技了，没问题的，我确实不懂代码， 我也只是用现有的 AI 工具做出来我想要的东西，自己能用，也能帮到别人，我的目的就达到了，并没有什么离谱不离谱的一说。

[gogogo1203]

@ViggoZ 离谱的意思是 fetch 太大，等待时间太长，传了整个 app 里 5000 多个 icon 的几万行 json. 炫技没有，我只是看了太多 cursor\claude 拼出来的东西。 当初我自学编程要几千个小时，现在不会编程的人利用 AI 可能几百个小时就能达到很高的地步。可惜绝大部分的人不会去专研一下。

[ViggoZ]

@gogogo1203 等待时间太长这个问题我知道的，技术方案我是有考虑过的，我当然是问了 AI ，也问了朋友的，权衡利弊的方案才用的 json ，用 AI 的意义是在于之前学习代码成本太高，做不出来东西，现在能做出来了，至于做的好不好，是需要时间学习的，不是说不专研，都是需要过程的。

[gogogo1203]

@ViggoZ 我纯粹是建议而已。copilot\gpt4\claude\cursor 我都是很早就开始用了，我知道 AI 能实现什么。像你转过的那个 check plug 项目， 完全经不起推敲, 具体你可以看一下 https://www.v2ex.com/t/1075261?p=1#reply46

[cPO3Im7cn3lD39cU]

@ViggoZ 支持开源 开的时候 请 at 我 谢谢