Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

这大概是本周最精彩的文章了。 如果你是工程师、设计师，可能非常适合阅读。 Fey 原创始人加入到 Wealthsimple 后，如何将代码工程和 UI 设计带领到下一个级别。 其中，我最喜欢的是文章这些可实时交互的 UI 小控件，可以直接感受到这些组件的设计质量与愉悦。

ZaynHao's profile picture

Zayn Hao

18,649 subscribers

80,205 Aufrufe • vor 24 Tagen •via X (Twitter)

Wissenschaft & TechnologieBildung
LIVE

Anya Rossi• Live Now

Private livecam show

10 Kommentare

Profilbild von rickyrickyri
rickyrickyrivor 24 Tagen

在中文区看见 fey 和 ws 真是梦幻联动

Profilbild von Masudur Rahman
Masudur Rahmanvor 23 Tagen

Beautiful work

Profilbild von Bryce Rambach
Bryce Rambachvor 23 Tagen

Amazing read. Also nice profile pic :)

Profilbild von Boyce Chi
Boyce Chivor 24 Tagen

Fey 的 UI 设计实在太经典了，刻入脑海。

Profilbild von lizyChy0329
lizyChy0329vor 24 Tagen

真有落地案例？

Profilbild von TheMiddleMan1980s
TheMiddleMan1980svor 24 Tagen

This is all moving toward AR interfaces since we will be spending less time at the laptop doing that type of work. We will be doing bigger thinks with robots and machines and will need ar and interfaces to help make that happen.

Profilbild von Jackywine
Jackywinevor 23 Tagen

确实值得推荐！

Profilbild von Zcoder
Zcodervor 24 Tagen

把灵、笔记和珍藏照片放一起，比纯素材库更有留存理由种「有用+有情绪」的组合挺难抄。

Profilbild von 设计阿sir是少年
设计阿sir是少年vor 24 Tagen

ai给设计师留的空间也就于“无声处听惊雷”了

Profilbild von sophs b
sophs bvor 24 Tagen

So real

Ähnliche Videos

UX 设计基础：学习指南 UX 设计入门教程汇总，来自全世界最著名的 UX 设计公司 NNgroup，内容包括： - UX 设计简介 - UX 设计哲学 - UX 设计规划和研究 - 用户界面（UI）设计 - 职业发展 英文的视频和图文教程（大家交口称赞的那些翻译插件终于有用了）。NNgroup 的工作比一般设计公司更注重理论、非常重视用户研究，所以他们的入门课程也偏原理、基础概念 适合从基础开始认真学 UX 设计的人，不适合上速成培训班很神奇地变成 UX 设计师的人 #设计入门 来个视频感受一下，这是 UX 设计入门的入门、被全世界人民问了几百万遍的问题：UX 设计和 UI 设计有什么差异？ 1/
3:15

UX 设计基础：学习指南 UX 设计入门教程汇总，来自全世界最著名的 UX 设计公司 NNgroup，内容包括： - UX 设计简介 - UX 设计哲学 - UX 设计规划和研究 - 用户界面（UI）设计 - 职业发展 英文的视频和图文教程（大家交口称赞的那些翻译插件终于有用了）。NNgroup 的工作比一般设计公司更注重理论、非常重视用户研究，所以他们的入门课程也偏原理、基础概念 适合从基础开始认真学 UX 设计的人，不适合上速成培训班很神奇地变成 UX 设计师的人 #设计入门 来个视频感受一下，这是 UX 设计入门的入门、被全世界人民问了几百万遍的问题：UX 设计和 UI 设计有什么差异？ 1/

倪爽

110,010 Aufrufe • vor 3 Jahren

这两天用Claude Design 给EasyApp2.0版本重新设计UI，得到的一些启发，希望给大家做一些参考。 😂Claude Design 非常消耗token，我已经消耗了 5次 5小时的用量，才做到如图所示的效果，其实还有一些地方可以继续优化/调整 1：首页找到你要参考的设计图，粘贴到对话框，Opus4.8多模态能力非常强，他能够很好的捕捉到参考图的设计系统。让Claude 以此为背景/模板来做创作，防止Claude 随意发挥，避免来回返工，消耗不必要的token 2：如果你对已存在的项目做UI优化，你可以选择Github connected、或者Link local code，这样做是让Claude读取你的代码，更加了解你当前的代码、功能，设计出来的UI更加符合你的业务逻辑 3：对于生成玩之后的设计图，局部微调效果，就用Commons功能，指哪打哪，非常精准。可以一次标记多个Commons，最后一次性发给Claude来修改。这一步基本上会占据整个设计时间的80%，非常琐碎 4：多试试Tweaks，Claude会在Tweaks中提供多种设计，选择一种你最喜欢的一套，作为最终的设计Token 5：可以让Claude 针对每个页面做成可交互的原型，带有动画效果，这样最终在还原到项目源码时，动画效果AI会自动带上，无需后续在手动告知AI 6：最后沉淀为自己的一套设计系统，以供后续复用
1:02

这两天用Claude Design 给EasyApp2.0版本重新设计UI，得到的一些启发，希望给大家做一些参考。 😂Claude Design 非常消耗token，我已经消耗了 5次 5小时的用量，才做到如图所示的效果，其实还有一些地方可以继续优化/调整 1：首页找到你要参考的设计图，粘贴到对话框，Opus4.8多模态能力非常强，他能够很好的捕捉到参考图的设计系统。让Claude 以此为背景/模板来做创作，防止Claude 随意发挥，避免来回返工，消耗不必要的token 2：如果你对已存在的项目做UI优化，你可以选择Github connected、或者Link local code，这样做是让Claude读取你的代码，更加了解你当前的代码、功能，设计出来的UI更加符合你的业务逻辑 3：对于生成玩之后的设计图，局部微调效果，就用Commons功能，指哪打哪，非常精准。可以一次标记多个Commons，最后一次性发给Claude来修改。这一步基本上会占据整个设计时间的80%，非常琐碎 4：多试试Tweaks，Claude会在Tweaks中提供多种设计，选择一种你最喜欢的一套，作为最终的设计Token 5：可以让Claude 针对每个页面做成可交互的原型，带有动画效果，这样最终在还原到项目源码时，动画效果AI会自动带上，无需后续在手动告知AI 6：最后沉淀为自己的一套设计系统，以供后续复用

sunshineLx

10,698 Aufrufe • vor 3 Monaten

YCombinator 最干货的《设计评论》写又出新作了。我先看为敬:《未来的 AI Interfaces | 设计评论》 做 AI SaaS 工具站的友友们必看！ 人工智能正在彻底改变我们与软件交互的方式。因此，在这期"设计评论"节目中，YC普通合伙人Aaron Epstein与Cron（现为Notion日历）的创始人兼设计师Raphael Schaad坐在一起，对一些突破性的人工智能用户界面进行评论。他们将共同审视各种各样的例子，从代理和自适应UI到视频提示和逼真的语音API，所有这些都是为了一窥人工智能如何改变软件的未来。
36:28

YCombinator 最干货的《设计评论》写又出新作了。我先看为敬:《未来的 AI Interfaces | 设计评论》 做 AI SaaS 工具站的友友们必看！ 人工智能正在彻底改变我们与软件交互的方式。因此，在这期"设计评论"节目中，YC普通合伙人Aaron Epstein与Cron（现为Notion日历）的创始人兼设计师Raphael Schaad坐在一起，对一些突破性的人工智能用户界面进行评论。他们将共同审视各种各样的例子，从代理和自适应UI到视频提示和逼真的语音API，所有这些都是为了一窥人工智能如何改变软件的未来。

张钊

23,240 Aufrufe • vor 1 Jahr

如果你用这些网站，做不出顶级UI前端。 我让在座的一人搞一次，立贴为证。 1️⃣在线 3D / 交互设计编辑器入口。 链接： 2️⃣UI 设计灵感收集网。 链接： 3️⃣一个面向前端和 AI 编程助手的 React UI 组件 / 模板 / 主题平台。 链接： 4️⃣一个 设计资源导航站 / 工具目录 / 灵感资源库。 链接： 5️⃣一套开源的 React 组件，包含动画、交互式和完全可定制的组件。 链接：
0:32

如果你用这些网站，做不出顶级UI前端。 我让在座的一人搞一次，立贴为证。 1️⃣在线 3D / 交互设计编辑器入口。 链接： 2️⃣UI 设计灵感收集网。 链接： 3️⃣一个面向前端和 AI 编程助手的 React UI 组件 / 模板 / 主题平台。 链接： 4️⃣一个 设计资源导航站 / 工具目录 / 灵感资源库。 链接： 5️⃣一套开源的 React 组件，包含动画、交互式和完全可定制的组件。 链接：

领哥LingGe🙏

20,030 Aufrufe • vor 2 Monaten

🚨Stitch 这次升级不得了，我觉得重点不是多了几个功能，而是 Google 正在重写 AI 设计工具的定义。 1/ Google 昨晚更新了 Stitch，官方给它的新定位很直接： AI-native software design canvas。 2/ 翻译成人话就是： 它不想只做一个 “你写一句 prompt，我给你几张 UI 图” 的工具了。 3/ 这次更新，核心就 5 个方向： 无限画布 更聪明的设计代理 语音交互 即时原型 设计系统 + DESIGN.md 4/ 最值得看的第一点，是 AI 原生画布。 现在的 Stitch 不只是吃 prompt。 还可以把 图片、文本、代码 一起作为上下文。 这说明它开始更像“设计工作台”，而不是一次性生成器。 5/ 第二点，是 agent 变强了。 Google 这次明确说，新 design agent 能理解整个项目演进过程，而且还有 Agent manager，支持你并行探索多个设计方向。 6/ 第三点，是 语音进入设计主流程。 你可以直接对着画布说话 让 Stitch 一边听一边改 还能给你实时设计反馈 7/ 第四点，是 即时原型。 现在 Stitch 可以把静态设计快速变成交互原型，点一下 Play 就能看 flow，甚至还能自动补出逻辑上的下一屏。 8/ 第五点，是很多人会低估的 DESIGN.md。 Google 把设计规则做成了一个 agent-friendly markdown，支持导入、导出、复用，还支持从 URL 提取设计系统。 9/ 所以这次 Stitch 真正从“帮你出图”，走向“参与整个设计流程”。 10/ 一句话总结： 2025 年的 Stitch，更像 UI 生成器。 2026 年这次升级之后，它开始更像 AI 设计工作台。
1:29

🚨Stitch 这次升级不得了，我觉得重点不是多了几个功能，而是 Google 正在重写 AI 设计工具的定义。 1/ Google 昨晚更新了 Stitch，官方给它的新定位很直接： AI-native software design canvas。 2/ 翻译成人话就是： 它不想只做一个 “你写一句 prompt，我给你几张 UI 图” 的工具了。 3/ 这次更新，核心就 5 个方向： 无限画布 更聪明的设计代理 语音交互 即时原型 设计系统 + DESIGN.md 4/ 最值得看的第一点，是 AI 原生画布。 现在的 Stitch 不只是吃 prompt。 还可以把 图片、文本、代码 一起作为上下文。 这说明它开始更像“设计工作台”，而不是一次性生成器。 5/ 第二点，是 agent 变强了。 Google 这次明确说，新 design agent 能理解整个项目演进过程，而且还有 Agent manager，支持你并行探索多个设计方向。 6/ 第三点，是 语音进入设计主流程。 你可以直接对着画布说话 让 Stitch 一边听一边改 还能给你实时设计反馈 7/ 第四点，是 即时原型。 现在 Stitch 可以把静态设计快速变成交互原型，点一下 Play 就能看 flow，甚至还能自动补出逻辑上的下一屏。 8/ 第五点，是很多人会低估的 DESIGN.md。 Google 把设计规则做成了一个 agent-friendly markdown，支持导入、导出、复用，还支持从 URL 提取设计系统。 9/ 所以这次 Stitch 真正从“帮你出图”，走向“参与整个设计流程”。 10/ 一句话总结： 2025 年的 Stitch，更像 UI 生成器。 2026 年这次升级之后，它开始更像 AI 设计工作台。

比特币橙子Trader

16,604 Aufrufe • vor 6 Monaten

分享下我在 Vibe Coding 中，使用率最高，且最高效的几个工具，覆盖到设计稿生成，到代码交付，网页动效等👇 1、Codex 你只要输入一个需求，它就会调动多个AI智能体并行工作，无论是项目重构，还是从零构建MVP，，它都能独立完成，你无需关注代码，而是把更多精力放在架构设计和创造性问题解决上 2、Paper 这个可以让 AI 生成高质量设计稿，并实现设计与代码双向实时同步，你只需专注界面创作，AI 会自动还原为精准代码交付 3、21st 这个提供超多精美的前端组件，同时带有流畅的交互动画，只需点击复制 Prompt ，粘贴到 AI 对话框即可使用 4、Unicorn 这个，不用写代码，也可以做出丝滑流畅的 GPU 级网页特效，一键导出即可让 AI 接入你的项目 5、Agentation 这个，可以直接在网页上标注需要调整的元素，自动转化为 AI 能够直接理解，和执行的结构化代码上下文， 实现网站的精细化调整 6、Axion 这个，能让你的 AI 化身 iOS 开发专家，覆盖从设计、开发到调试的全流程，，输出符合 Apple 高标准、安全、高性能，且易于维护的生产级代码 7、Apple docs mcp 配合这个，可以自动检索 Apple 最新开发文档，能解决日常开发软件中 90% 的问题
1:15

分享下我在 Vibe Coding 中，使用率最高，且最高效的几个工具，覆盖到设计稿生成，到代码交付，网页动效等👇 1、Codex 你只要输入一个需求，它就会调动多个AI智能体并行工作，无论是项目重构，还是从零构建MVP，，它都能独立完成，你无需关注代码，而是把更多精力放在架构设计和创造性问题解决上 2、Paper 这个可以让 AI 生成高质量设计稿，并实现设计与代码双向实时同步，你只需专注界面创作，AI 会自动还原为精准代码交付 3、21st 这个提供超多精美的前端组件，同时带有流畅的交互动画，只需点击复制 Prompt ，粘贴到 AI 对话框即可使用 4、Unicorn 这个，不用写代码，也可以做出丝滑流畅的 GPU 级网页特效，一键导出即可让 AI 接入你的项目 5、Agentation 这个，可以直接在网页上标注需要调整的元素，自动转化为 AI 能够直接理解，和执行的结构化代码上下文， 实现网站的精细化调整 6、Axion 这个，能让你的 AI 化身 iOS 开发专家，覆盖从设计、开发到调试的全流程，，输出符合 Apple 高标准、安全、高性能，且易于维护的生产级代码 7、Apple docs mcp 配合这个，可以自动检索 Apple 最新开发文档，能解决日常开发软件中 90% 的问题

Paidax

175,113 Aufrufe • vor 6 Monaten

这个交互式的麻将教程做的太棒了： 是教老外学麻将的，设计配色舒服，教程安排特别合理，几个大块就说明了核心玩法，还有简单的交互性，我也又学习了一下，是我最近看到非常喜欢的网页设计。 之后我用它来测试一下 5.5 编码能力，看看能不能复刻一个另外的类似教程。
0:20

这个交互式的麻将教程做的太棒了： 是教老外学麻将的，设计配色舒服，教程安排特别合理，几个大块就说明了核心玩法，还有简单的交互性，我也又学习了一下，是我最近看到非常喜欢的网页设计。 之后我用它来测试一下 5.5 编码能力，看看能不能复刻一个另外的类似教程。

Viking

83,554 Aufrufe • vor 5 Monaten

🚨再说一遍：日本是个工业大国，其工业技术和设备都是全球最顶级的。一旦把这些技术、设备转移或部分转移到军工生产，日本的军工产业将会变的非常可怕🔥
4:31

🚨再说一遍：日本是个工业大国，其工业技术和设备都是全球最顶级的。一旦把这些技术、设备转移或部分转移到军工生产，日本的军工产业将会变的非常可怕🔥

RICHARD FULL

162,655 Aufrufe • vor 9 Monaten

说实话，Codex做设计其实可以很好的！ 不只是文章介绍的方法，甚至不用 Fable 5，用 codex 或 Claude Code 也能做成👇视频这种设计效果。 按我的思维，看到即可复刻，想象力到位了，就能驱动AI破解出来。 当然，尊重原视频老师的版权，是dy“言言老师”分享的设计实践！我这里只是二剪搬运，支持观点 顺带一提，Jacky兄真的是干货输出机啊，一天一篇爆款长文，吾自叹不如！
0:29

说实话，Codex做设计其实可以很好的！ 不只是文章介绍的方法，甚至不用 Fable 5，用 codex 或 Claude Code 也能做成👇视频这种设计效果。 按我的思维，看到即可复刻，想象力到位了，就能驱动AI破解出来。 当然，尊重原视频老师的版权，是dy“言言老师”分享的设计实践！我这里只是二剪搬运，支持观点 顺带一提，Jacky兄真的是干货输出机啊，一天一篇爆款长文，吾自叹不如！

Leaf Yeah!

93,448 Aufrufe • vor 2 Monaten

什么扼杀了数据可视化设计创新 #设计入门 交互式数据可视化是艺术、设计、技术和数据的结合。作者是专家，她列举了这个领域缺乏创新原因，比如： - 手机用户喜欢简单、易于消化的信息 - 用户喜欢普通的柱状图、曲线图 这两条算设计领域的普适标准，尤其第二条。虽然设计师竭尽所能增加动效、动画…各种视觉刺激，但天天被刺激就无感了，一般人只想快速获取信息，而不是欣赏复杂的、炫技的设计
0:34

什么扼杀了数据可视化设计创新 #设计入门 交互式数据可视化是艺术、设计、技术和数据的结合。作者是专家，她列举了这个领域缺乏创新原因，比如： - 手机用户喜欢简单、易于消化的信息 - 用户喜欢普通的柱状图、曲线图 这两条算设计领域的普适标准，尤其第二条。虽然设计师竭尽所能增加动效、动画…各种视觉刺激，但天天被刺激就无感了，一般人只想快速获取信息，而不是欣赏复杂的、炫技的设计

倪爽

41,810 Aufrufe • vor 1 Jahr

个人觉得，世界最顶级的网页效果教程分享社区： Design Engineer 一定不能错过的！ 前端开发+视觉设计的最终交汇点！ 比如，这里是之前 HaoqiWen 个人主页的技术解析文章，作者亲自写背后的那些技术细节和设计思路：
0:36

个人觉得，世界最顶级的网页效果教程分享社区： Design Engineer 一定不能错过的！ 前端开发+视觉设计的最终交汇点！ 比如，这里是之前 HaoqiWen 个人主页的技术解析文章，作者亲自写背后的那些技术细节和设计思路：

Jackywine

12,151 Aufrufe • vor 1 Monat

Figma 正式推出了官方的远程 MCP 服务器，现在不需要安装 Figma 客户端 只需要在支持的软件比如 Cursor、Cluade code 里面添加，并在打开的网页里面完成账户授权就行 而且现在设计组件和前端组件的映射信息也可以通过 MCP 获取到，如果你的团队有设计系统的话，然后你的设计稿组件采用程度高 前端可以一键用 AI 生成全部的前端代码，而且保证高还原度，设计师和前端协作会到一个新的时代
0:29

Figma 正式推出了官方的远程 MCP 服务器，现在不需要安装 Figma 客户端 只需要在支持的软件比如 Cursor、Cluade code 里面添加，并在打开的网页里面完成账户授权就行 而且现在设计组件和前端组件的映射信息也可以通过 MCP 获取到，如果你的团队有设计系统的话，然后你的设计稿组件采用程度高 前端可以一键用 AI 生成全部的前端代码，而且保证高还原度，设计师和前端协作会到一个新的时代

歸藏(guizang.ai)

157,848 Aufrufe • vor 1 Jahr

Codex 重磅更新：Product Design 插件上线！ 以前 Codex 代码强但 UI 审美常被吐槽 上世纪风，这次直接把产品设计思维装进大脑，审美和专业度瞬间拉满！ 下面视频展示了我用最新 Product Design 插件设计的三个网站，完全不输高级设计师～ 先设计，后开发：它不再是直接盲写代码，而是先给你 3 张不同风格的高保真参考图！ 确认了审美，再开始写代码，这种 设计驱动 的流程太专业了。 丝滑的滚动叙事、动态背景、视频卡片，交互细节拉满。 这种先定审美、再定交互、最后落地的流程，才是未来 AI 开发的终极形态！
0:43

Codex 重磅更新：Product Design 插件上线！ 以前 Codex 代码强但 UI 审美常被吐槽 上世纪风，这次直接把产品设计思维装进大脑，审美和专业度瞬间拉满！ 下面视频展示了我用最新 Product Design 插件设计的三个网站，完全不输高级设计师～ 先设计，后开发：它不再是直接盲写代码，而是先给你 3 张不同风格的高保真参考图！ 确认了审美，再开始写代码，这种 设计驱动 的流程太专业了。 丝滑的滚动叙事、动态背景、视频卡片，交互细节拉满。 这种先定审美、再定交互、最后落地的流程，才是未来 AI 开发的终极形态！

爱丽丝呀！

140,561 Aufrufe • vor 3 Monaten

我现在尝试的方案是： 1. 先用 出一个大概的风格，可以扩展不同的设计风格和布局，它可以把当前设计打包成一整套提示词，导出给其他 agents 使用。 2. 在其他 agents 比如我用 Replit ⠕ 还原，基本粘贴它的提示词都能完美还原，然后让 Replit 再基于这个设计完成其他页面和功能。(Replit agent 4.0 支持 canvas 也可以生成不同风格和布局的设计) 3. Replit 绑定 Github 后代码是实时同步到你的 repo 的，基本满意后 fork 到本地，让 Claude Code 重构。
0:26

我现在尝试的方案是： 1. 先用 出一个大概的风格，可以扩展不同的设计风格和布局，它可以把当前设计打包成一整套提示词，导出给其他 agents 使用。 2. 在其他 agents 比如我用 Replit ⠕ 还原，基本粘贴它的提示词都能完美还原，然后让 Replit 再基于这个设计完成其他页面和功能。(Replit agent 4.0 支持 canvas 也可以生成不同风格和布局的设计) 3. Replit 绑定 Github 后代码是实时同步到你的 repo 的，基本满意后 fork 到本地，让 Claude Code 重构。

Ding

56,866 Aufrufe • vor 6 Monaten

这是我今年见到的最棒的网页滚动设计 就像一个电影一样，你一直在期待接下来是什么效果。 这也就是 AI 目前没法代替设计师的原因，如果你想要这么惊艳的效果，那么肯定是需要极致的想象力，如果你和 AI 直接描述说要惊艳一点，那么它一般会给你提供一个非常丑蓝紫色渐变。
0:38

这是我今年见到的最棒的网页滚动设计 就像一个电影一样，你一直在期待接下来是什么效果。 这也就是 AI 目前没法代替设计师的原因，如果你想要这么惊艳的效果，那么肯定是需要极致的想象力，如果你和 AI 直接描述说要惊艳一点，那么它一般会给你提供一个非常丑蓝紫色渐变。

Viking

112,227 Aufrufe • vor 1 Jahr