Cursor图标设计手稿分享

看到做图标就不得不提我今年最喜欢的一篇文章了 《The making of Cursor's icons》 https://t.co/WPpOqWKZCV 作者 给 Cursor 做了约一年 600...

看到做图标就不得不提我今年最喜欢的一篇文章了 《The making of Cursor's icons》 minoradventures.co/blog/the-makin… 作者 给 Cursor 做了约一年 600 多个图标，两种尺寸 两种样式 全部手绘，纯纯的老工匠精神 没想到 cursor 这个做 AI 的最终用了全部都手搓的图标 这篇文章非常非常翔实 尤其是后面光学补偿的内容 体现了作者的工匠精神 另一半篇幅在讲基础设施 是很干的实践 图标也很漂亮 属于常看常新的一篇了 而且在 AI 时代还是有人在坚持手搓 感觉未来人工能做成高端的定制服务 像豪车上面的手工制品一样 Tw93 @HiTw93 想给大伙随便聊聊如何给产品进行一次图标升级，有哪些需要注意的以及可以优化的点。 早上给 Mole 的图标进行了一次精细化的升级，之前使用的是系统的图标，对于简单的产品场景我感觉完全够用，不过细看会感觉缺少一点灵性的感觉。 经过调研，比较适合做 App 产品 Icon 的有 Remix Icon 和 Phosphor Icon这两个，之前写 Web 的时候用 Remix 很多，简单舒服，但是放到 App 上我感觉不是很好看，于是就换上了 Phosphor 这个，展示效果很有灵性，非常不错，差不多有 70% 左右，可以不修改直接使用，然后有 30% 的图标是我用 opus 5.5 来写SVG 自绘的，这样整体更加一致。 可能大伙直接看下面的对比图很难感觉到两者的区别，很多时候需要实际放到真实的产品里面去，我一般还会考虑到本身这个模块下一组图标的搭配感，有时候全部图标单个都好看，组合到一起就不好看的情况也有，好比一个人每一个五官单独出来都好看，但是放到一个脸上却不那么好看，这里建议就是图标的根更换你一定要放到实际的产品里面去看，放到一起去看，才会有比较好的效果。 其次，我一直想着，我们做的产品应该是有灵性的，有生命的那种感觉，而非直接 AICoding 不经任何你的思考出来的那种冷冰冰的编译产物，这个时候小细节比如icon会是给这个产品带来生命力的一个很好的切入点，比如大伙看 保持常亮我使用的是 一杯咖啡，这里会有一种 Caffeine 比喻，就是让你的电脑好像喝了咖啡一样睡不着的感觉，然后关于一般会用一个感叹号，但是我想着应该是 hello，所以就用的挥手的标志，诊断正常会有排查的那种标志，但是这里使用的是一个听诊器的标志，更像是给你的问题做一次医生检查，类似这样，很多时候，可以在产品里面加入不少你的小巧思，会让整体有趣很多。 最后，好看的设计几乎都离不开对齐、整齐、错落有致这些原则，如何在人眼看到的场景下让图标和内容以及上下模块看起来是整齐的、大小一致的，甚至是上下居中对齐的，都需要一个一个去看，去调整，包括字体和icon的对齐，以及字体里面中英文本身也没有垂直对齐应该如何优化，类似这样的，可以精雕细琢很久，非常有意思。 这种看似无用功，其实是我很喜欢做的事情，AI 可以给优秀编码、及格审美带来非常大的促进，人看着好像不要做啥了，只要动动嘴就好，反而我认为不是的，人在这里的作用更大了，AI 帮你节约的时间，刚好可以放到打磨产品上，让1%的用户有种用你产品的时候，时不时有一种秒懂、卧槽、变魔术的感觉，那就非常非常有价值和意思了，或许这也是我认为做独立产品有意思的地方。 🔗 View Quoted Tweet 💬 1 🔄 0 ❤️ 10 👀 1403 📊 4 ⚡