ChatGPT 是否有可能生成 UI？
我之前测试过几次，但结果却令人失望。
下面是我两个月前在一份时事通讯中分享的一个例子。
它看上去太卡通了，不太实用。
然而，上周，OpenAI 推出了一个重大更新，所以我决定再次尝试。
根据我的提示，我能够生成更好的UI模型。我甚至可以根据自己的需求创建多个设计选项：
今天，我将向你们展示我进行的实验、我使用的提示以及过程中的一些惊喜和收获。
让我们开始吧。
OpenAI 宣布，现在可以使用 GPT-4o 在 ChatGPT 中生成高质量图像，而不是使用较旧的 DALL·E 模型。
它更擅长遵循指令，并且可以更好地呈现图像中的文本。
上周，许多人尝试将照片转换成人工智能艺术作品——这就是吉卜力风格艺术潮流流行的原因。
我也尝试过：
但在网上看到很多有趣的艺术作品后，我想：
如果我可以使用 ChatGPT 生成对产品设计师真正有用的 UI 会怎么样？
实验就是从这里开始的。
我使用 ChatGPT 来帮助我生成我想要的 UI 的详细提示。
# 为名为“SkillVerse - 热门微课程”的应用设计一个简洁、现代的移动 UI 界面（iOS 风格）。布局应遵循以下结构化部分。## 1. 状态栏（顶部）- **样式**：标准 iOS 布局（顶部安全区域）---## 2. 标题部分- **居中标志**：“SkillVerse” - **字体**：中等粗细，小尺寸 - **颜色**：蓝色文本 ---## 3. 特色课程轮播（水平滚动）- **风格**：具有圆角和柔和阴影的可滑动卡片 - **卡片**: -**卡 1** - 标题：**动态设计简介** - 字幕：*4 月 2 日开始* - 视觉：动画缩略图 -**卡 2** - 标题：《自由职业者精通 Excel》 - 字幕：*3 月 31 日开始* - 视觉：生产力图标 ---## 4. 导航标签-**标签**： - **趋势**（活跃，**粗体标签**带有**蓝色下划线**） - 受到推崇的 - 已注册 - 已保存 ---## 5. 过滤行- **过滤器（下拉菜单）**： - **过去 7 天**（基于时间） - **所有主题**（类别） - **所有级别**（难度） ---## 6. 热门课程列表- **布局**：可重复课程项目的垂直堆叠： - **左**：圆形缩略图 - **中心**： - 课程名称 - 级别（例如，初学者、中级等） - **右**：保存图标 - **底部**：入学人数 + 趋势（例如，入学人数 2.4k，+12%） ---## 7. 底部导航栏-**标签**： - **主页**（活动，突出显示颜色） - 搜索 - 活动 - 轮廓 - **风格**： - 下方有标签
然后我将其粘贴到 ChatGPT 中的新聊天窗口中，然后单击“生成”图标。
令人惊讶的是，ChatGPT 在右侧打开了一个额外的面板，触发了它的 Canvas 功能。然后它开始生成代码。
这立刻让我想起了克劳德的神器功能。
然后我点击了右上角的“预览”按钮。
生成了响应式、代码支持的 UI。
看起来很有趣，但似乎不如克劳德那么精确/精致。
由于我的目的只是生成一个图像（一个可视化模型）而不是一个代码支持的 UI，因此我请求后续提示来纠正它：
创建一个可视化模型。而是一个视觉模型。
结果如下：
结果出乎意料地好，尤其是与 ChatGPT (DALL·E) 之前生成的版本相比。这是一个巨大的提升。
测验：你能在上述 AI 生成的 UI 中找到多少个拼写错误？:)
尽管用户界面看起来不错，但我仍然对图像截断感到有点困扰，所以我问了：
顶部和底部看起来有点截断。您能将 UI 缩小 20% 左右，让它整体更小一些吗？顶部和底部看起来有点截断。您能将 UI 缩小20%左右， 让它整体更小一些吗？
结果如下：
看起来不错！
然后我开始更有创意了……我想，如果我让它生成多个设计方案供我参考会怎么样？那会更有帮助！
所以我写了这个：
创建三个设计选项。使用相同的核心内容，但根据以下描述改变布局、UI 元素和视觉重点：选项 1. 大胆且引人入胜- 优先考虑视觉冲击力和品牌表达选项 2. 功能强大且快速- 优先考虑速度、清晰度和生产力- 紧凑的用户界面，卡片更小，信息层次更密集选项3.个性化和温暖- 优先考虑联系、信任和个性化- “为你推荐”轮播，包含人工智能策划的课程建议- 社会证明（头像、徽章、朋友活动）- 添加“社区”选项卡，用于同行共享内容
结果如下：
再次，我对 GPT-4o 图像生成能力的提升感到震惊。
虽然这三个选项看起来仍然非常相似，但如果仔细观察，就会发现一些小细节 - 例如“搜索”图标、社交证明和副本 - 试图使每个版本都与其他版本区分开来。
不过，结果肯定还有改进的空间。例如，由于一张图片中包含了大量信息，ChatGPT 的精度开始下降。你可能会注意到，部分文本变得无法识别/扭曲。
接下来，作为一个有趣的测试，我使用Codia AI 的插件根据 ChatGPT 生成的视觉模型生成 Figma 设计。
所有组件（包括文本）都可以在 Figma 中编辑。
它使用的字体系列是 Intel。
好得可怕。
如果我想进行更改，这使我能够自定义 UI 模型。
ChatGPT 生成 UI 视觉模型的能力是一个巨大的提升。与之前版本相比，它提供了更高的精度和对提示的遵循性。
话虽如此，速度还是有点慢，准确率还有待提高。有时图像生成到一半就停止了；有时结果很随机，而且与指令不完全一致。
当我要求 ChatGPT 根据设计选项创建 3D 模型时，事情变得有点扭曲和奇怪——但还不算太糟。
不管怎样，这已经是一次很棒的升级了。我现在能生成以前无法生成的东西了。
这一切都在 ChatGPT 聊天窗口内完成。多么方便啊？
我非常兴奋并希望未来会有更好的升级。
是的。我们想知道为什么产品设计界这么多人都走到了崩溃的边缘？我想说，我不认为设计已死。只是我觉得我们迷失了方向。
2023年，Airbnb首席执行官布莱恩·切斯基（Brian Chesky）曾说过： “设计师必须有勇气。”说实话，我们过去确实很有勇气。一种无所畏惧的自信，一种打破现状的近乎疯狂的喜悦。“惊喜与愉悦”、“精益求精，保持简洁”一直是我多年来领导设计团队的座右铭。
我陷入了以收入为中心、痴迷于图案设计的陷阱。
然而，不知何故，在某个时刻，也许是在无休止的会议、OKR、业务目标和盈利报告的催促下；又或许是因为公司内部不断边缘化设计——这种自信消失了。我们从协作型的摇滚明星变成了解决问题的小齿轮，再变成了生存主义者。因为现在机器来了。
多年来，我本着脆弱的精神，陷入了以收益为中心、痴迷于图案设计的陷阱。DS 是一种令人兴奋的、以特定价格点进行设计的方法。让我们去创造收益！让我们去优化利润！让我们快速实现各种创意！我们为什么要在应该创新的时候重复造轮子呢？
听起来很熟悉？
这就像个兔子洞。我和同事们聊过，大家都觉得，
如果我们用设计系统的方法录制一张专辑，每首歌在技术上都是完美的，但它们听起来本质上都一样。哪个用户会因为反复听这首歌而受到启发呢？我们自己的设计故事已经支离破碎了。
我们很多产品设计人员都生活在艾维所说的“企业议程已将设计和创新的重点从目标转移到利润”的境地。追求收益令人精疲力竭。创造性的故障排除被误认为是创造力。基于卡班板混乱和闪电般快速发布的产品经理微观管理的压力。MVP 地狱景象。毫无结果的 A/B 测试，因为利益相关者不理解。整体创新解决方案被所谓的“安全”的快速解决方案扼杀。而这一切都是有代价的。灵感更少，活力更少，友善更少，压力更大。更多的自我限制。更多的模仿。更多千篇一律、复杂而扁平的用户体验。等等。
过去一周，我的观点与多年来形成的理念发生了转变。我最近去一家大型游戏公司面试领导职位，面试的主题是如何创造收入。这才是整个团队最关心的问题。他们没有考虑用户需求，也没有考虑他们正在构建的工作和体验的乐趣。这些从未被讨论过。
这真的让我很困扰。非常困扰。这不是我第一次遇到这种情况。我一次又一次地发现，出现了两件事：
我们大多数人都在无意识中直接促成了这一点。我们甚至没有意识到这一点。然而，要论证人类首先是情感实体，这并不需要太多说服力。我们能够立即感知和感受事物，然后再运用逻辑，这与人类的进化直接相关。然而，我们的设计方法在很多方面都缺乏这种能力。
（我在这篇文章中只关注设计的作用。但科技领域其他角色的出现，以及流水线投资回报率驱动的 IDEO 方法，无疑导致了设计优先级的下降，不再以用户感受为重点。）
我们需要重新进行重大的直觉选择并重新感受事物。
有两件事无疑产生了最大的影响。
- 新的 Google Material DS “发送”按钮
。-
采访乔纳森·艾维。
两者都重点讨论了“欢乐与喜悦”和“火花”的设计。
谷歌界面的更新打破了所有固有规则，打造了独特的数字体验。他们抓住了机会，用数据验证了这一可能性，最终他们的努力让用户参与度提升了4倍。
Jony 在Stripe大会上的采访非常鼓舞人心。如果你今年需要看一部作品来了解设计对我们这个瞬息万变的世界的重要性，那非看不可。他让设计回归了它的本源，那就是那神奇的“火花”。
当我思考这些时，我发现伟大的设计中存在着一些更具体的事情——颠覆。
在数字体验的早期，没有数据，没有关键绩效指标 (KPI)，也没有流水线式的技术开发方法。当时的设计纯粹是为了品牌价值、功能和实验。我们有两个代码库：HTML 和 Flash。工作的多样性令人兴奋。网站以及最终的原生应用都易于使用，易于导航，没有算法，非常人性化。
我们也只是想打造一些我们的朋友和同事会谈论的非常酷的东西。
设计团队和工程团队围坐在一起，讨论他们想要构建的目标，并在整个过程中不断合作。如同合作伙伴一样。一份简单的路线图充满了宏大的想法和雄心壮志。方法是什么？“我想要一个能够实现_____的酷炫解决方案，因为我想做_____。”
我们受到的启发是（用艾维的话来说）“设计一些能够推动物种发展的东西”，“为人类服务”。我们也只是想打造一些非常酷的东西，让我们的朋友和同事谈论。
有些品牌正在疯狂地颠覆这个领域。比如Acorn和Airbnb。但当突破设计界限的设计如此罕见时，这对任何人来说都不是好兆头。什么时候突破设计界限的设计非常罕见，这对任何人来说都不是好兆头。
人工智能。
我们正为此疯狂。长期以来，我们一直谨慎行事，构建一套设计方法论式的设计系统，结果却事与愿违。我和其他人一样，也为自己的谨慎行事感到内疚。不到五年，产品设计将不再像过去十五年那样存在。这原本是一个令人恐惧的前景，直到我直面恐惧。
想想看，不用再构建模式库了。不用再花费无数时间迭代数据和最佳实践。不用再熬夜撰写和设计战略方案了。这可不是设计，而是繁重的工作。说真的，让机器来做吧。
我可以重新做我最擅长的事，运用我的智慧、想象力和经验来推动事情发展。当然可以。报名吧。我就是来干这个的。
我们不再打破常规。我们遵循着基于指标和绩效的群体思维美学。我们各自为政，各自为政，各自为政。我们用耗时的方法来构思创意。我们迷失在迭代的泥沼中。我们没有逼迫自己打破常规。
如果我们退一步，纵观设计的全局，就会发现我们所做的最伟大的设计，其核心都是“颠覆性”。敢于创新，敢于思考。它不断尝试新事物，探索新的视野。然而，我们对这门学科的内在部分却感到厌恶。
我不知道“幸运眷顾勇者”这句话是谁说的。
我的一个使命就是让它重新回到我们的世界。
回去工作。
让我们打破思维定势。
让我们都做些史诗般的事。
计发展日新月异——转瞬即逝，你就会落后。把握设计的发展方向是成功的一半。以下根据目前的发展情况，概述了五大可能在 2026 年占据主导地位的 UX/UI 趋势。
上周，我在一个熙熙攘攘的共享办公空间里画界面时，一位刚接触 Figma 的学生设计师朋友凑过来问我：
“你是怎么跟上这些变化的？”
这句话深深地触动了我。多年从事设计行业，我明白了：洞察潮流才能保持敏锐。以下是我关注的领域。
我现在用的新闻应用会根据我的阅读习惯，根据文章的长度和深度来筛选文章。无需手动调整——它就能满足我的需求。
设计的任务是打造一个能够学习且不会让用户感到害怕的系统。通过人工智能实现的个性化应该像一个乐于助人的朋友，而不是一个跟踪狂。关键在于平衡智能自动化和用户控制。
AR 正在摆脱游戏的桎梏。想象一下一款家居维修应用：它将虚拟的架子投射到厨房墙上，让你四处走动，看看它们是否合适。
到2026年，AR设计将成为标杆。还在觉得它只是个噱头吗？是时候重新思考了，否则你就错失良机了。
人工智能工具正在彻底改变我的工作流程。最近，我请一位人工智能工具为一个 SaaS 项目快速设计图标——一分钟内就得到了 10 个方案，全部符合 WCAG 标准，并且符合品牌形象。
真正的问题并非AI能否设计，而是我们如何与它合作，将项目推向新的高度。不妨把它想象成一位由你掌控全局的智能助手。
我吃过不少苦头才明白这一点：为“普通”用户设计是失败的。在一个项目中，我重新设计了一个移动应用的注册表单，因为我意识到它对于手抖的人来说太笨重了。
到2026年，包容性设计将不再只是一张纸，而将成为一项竞争优势。满足多元化需求，打造人人喜爱的产品。
上周末，我通过一个应用程序预订了一张餐厅餐桌——甚至都没注意到我已经付款了。指纹验证，我的常用设置自动应用，搞定了。
设计的作用是减少摩擦，同时保持用户的控制力。设计的目的是让日常操作感觉安全，而不是草率。
“我们把屏幕上的按钮做得如此好看，让你忍不住想舔舔它们。” ——史蒂夫·乔布斯
我记得亨利·福特曾经说过：“如果我问顾客想要什么，他们会告诉我一匹跑得更快的马。”人们不知道自己想要什么，除非你把东西展示给他们看。—— 史蒂夫·乔布斯
在很多地方，这简直就是认知超负荷和可读性低下的噩梦。玻璃折射需要一定的透明度才能达到最佳效果，而这种透明度会让一半的背景显得格格不入。
说实话，我真不知道苹果是怎么做到的。在尝试模仿之后（使用 AGSL 着色器——作者注），我对液态玻璃产生了全新的敬意。我猜他们也用了着色器——只是更加精妙。苹果花了数年时间打造一个可以实现这一功能的系统。安卓系统还没达到这个水平。也许小米或其他中国品牌会找到解决办法。但在我们找到开源解决方案之前，在安卓系统上实现真正的玻璃形态仍然遥不可及。
我们发现浏览器支持有限，这迫使我们不得不使用一些不太理想的解决方法。随着时间的推移，WebKit 引入了 backdrop-filter CSS 属性，但它仍然是性能杀手——浏览器每次滚动时都必须重新计算模糊效果。也许 Apple 已经在其设备上对此进行了优化，但我强烈建议任何在 Apple 以外的平台上构建 Liquid Glass 设计的人都进行彻底的性能测试。
“好的设计是无形的。” ——迪特·拉姆斯
社会从由电台主持人主导的音乐体验，到通过购买黑胶唱片和 CD 唱片（由唱片店中的流派部分引导），再到让用户完全控制其播放列表的 Spotify。
如果你想了解更多关于现代主义和后现代主义的区别，你可以阅读：科技和披头士乐队如何改变艺术、性、工作和真理
音乐听众从适应现代社会习俗，成为亚文化的一员，变成完全独特的人。
“一位尽职尽责的咖啡馆服务员会将自己完全认同于服务员的角色。但这种认同是一种不诚实的表现，因为它否定了人类意识的超越性。”
“民族主义不是原因，而是结果，是集体神经症的结果。”
“宗教实践的表演维度是将宗教规范作为身份构成的一部分来体现的一种方式。”
“规范性观念是通过权力在身体、个人和群体中实施而得到阐述和植入的。”
蓝蓝设计的小编 http://www.lanlanwork.com