Apple 设计被蒸馏成可落地 Skill

有人把 Apple 的设计语言蒸馏成一份 Skill 开源了出来,GitHub 现在 17.9k stars,还在涨。

这是一份能装进 AI 的规则包

它不是那种贴一堆截图、写满"极简""留白""呼吸感"的情绪化模板。定位写得很直白:把 Apple 在 WWDC 上讲的设计理念------尤其是 2018 年那场经典的 Designing Fluid Interfaces------翻译成 CSS、Pointer Events、requestAnimationFrame 和 spring 库能真正执行的写法。

换句话说,它不是让你"感受 Apple 风格",而是把移动端那套设计语言,变成前端能敲进去的命令。

让界面一秒掉价的,往往是动效

真正把界面拉低档次的,八成是动效用错了地方。

这份 Skill 的第一条铁律特别反常识:动效不是越多越高级,而是要先问"该不该动",再问"怎么动"。它把操作按频率分了类------一天要用 100 多次的键盘快捷键、命令面板,直接建议不要动画;只有模态框、抽屉、toast 这种偶发的动作,才配上标准动效。道理很简单,高频操作你还给它加个 300ms 的过渡,用户一天被你卡一百次,烦都烦死了。

然后是最容易显廉价的部分,我叫它"塑料感三连击":

  • 元素从 scale(0) 出场,从无到有硬长出来;
  • popover 从正中心炸开;
  • 浮层没有任何参照点,凭空冒出来。

这三个动作单拎出来都不起眼,但只要中一个,界面立刻掉价。Skill 给的修法也具体:出场别从 0 开始,用 scale(0.95) 加 opacity 淡入;浮层不要从中心炸,要从触发它的那个按钮位置展开。就这么一点差别,观感天差地别------前者像廉价网页模板,后者才有那种"东西是从你手指下长出来的"顺滑感。

别机械照抄:原则是用来做取舍的

讲到这儿得踩个刹车。

Apple 自己在 WWDC26《Principles of great design》里说得很清楚:没有任何一种公式能保证完美结果,原则的作用是帮你在冲突里权衡。这话我特别认同。上面那些参数是很好用,但如果你只是把 100--160ms 无脑套到每个按钮上,你做出来的还是"标准件",不是有想法的产品。

你品品这个思路:成熟的设计,从来不是让所有人看到同一套酷炫效果,而是让不同设备、不同需求的人,都拿到最适合自己的那一版体验。这才是 Apple 那套"高级感"最底层的东西------它管理的是人的时间、注意力和信任,不是你的炫技欲。

所以我的建议很简单:别光收藏,先装上跑一遍。这里以 Codex 为例,直接发仓库地址给它:

复制代码
https://github.com/emilkowalski/skills/tree/main/skills/apple-design 把这个skill装到全局目录

Codex 使用 sub-ai.cc 轻松订阅。装完让它扫一遍你手头的项目,照着这 17 条老实抄,一个外行也能把产品做到 80 分。但剩下那 20 分,谁也没法替你抄------它藏在你学会取舍的那一刻。

相关推荐
xiaoye-duck1 天前
《C++ 项目:手写大模型接入 SDK》ChatGPT接口设计(下):流式响应实现和测试
网络·c++·语言模型·chatgpt
奈落242 天前
Codex 并进 ChatGPT 之后,“编程智能体“是变浅了还是变顺了:从官方概览页的功能分工到五家公司开发者反馈,读一次产品化合并的得与失
人工智能·chatgpt·工作流·ai 编程
xiaoye-duck2 天前
《C++ 项目:手写大模型接入 SDK》ChatGPT接口设计(中):全量响应实现和测试
网络·c++·语言模型·chatgpt
孤狼GPT2 天前
ChatGPT、Codex数据库实战:MyBatis-Plus第一页查询正常,翻到第10000页为什么越来越慢?
mysql·chatgpt·mybatis-plus·codex·深分页
jerrywus3 天前
普通人怎么用 Codex:从表格、文件和小工具开始
chatgpt·agent·mcp
仙逆GPT4 天前
ChatGPT、Codex工程实战:Agent接入企业知识库,文档明明更新了,为什么回答还是旧版本?
chatgpt·codex·rag·企业知识库·ai agent
lucas_AI4 天前
「无限 Codex」白嫖项目终结?OpenAI 12 月起把 ChatGPT 与 Codex 额度合成一个池子
chatgpt·openai
孤狼GPT4 天前
ChatGPT、Codex工程实战:Spring Boot的SSE一直在推送,为什么经过Nginx后前端才一次性显示?
spring boot·chatgpt·sse·codex·chatgptplus
孤狼GPT4 天前
ChatGPT、Codex性能实战:MySQL升级到8.0后,SQL没改,为什么接口P99反而翻倍?
spring boot·chatgpt·sql优化·codex·mysql8.0
lucas_AI5 天前
点开一条 ChatGPT 分享链接,私聊就被端了:数学键盘 + YouTube JSONP 组成的 P1 漏洞链
chatgpt