AI中的新UI和UX

AI 时代 UI/UX 新方法的不断更新集合。如果你在野外看到了什么……请告诉我,我会将其添加到此文档中,并向你致谢(当然!)!

1、刻度盘、旋钮和滑块

物理旋钮、数字滑块和象限“刻度盘”可用于调整 AI 交互的响应音调或其他输入变量。

这个第一个新颖的 UX 想法来自 Figma 的新 Figma Slides 产品中的生成文本功能。你可以滑动橙色指示器,将语气从休闲变为专业,从简洁变为扩展。

此示例来自 Twitter 用户 Johannes Stelzer 的一篇文章。我不知道细节,但喜欢这个演示。

这是我自己的小型 AI 项目……一个总结任何网页的 Chrome 扩展程序。你可以使用滑块调整输出。想要一个四字故事吗?很简单:将其调整为 4 个字。想要一篇文章?写长篇大论。

2、节点和边图

LangGraph Studio 使用节点和边图系统来可视化 LangChain 代理的逻辑和流程。每个代理内部都是节点和边的集合。每个节点都是一个“微代理”,它执行一项任务并连接到其他节点以构成一个系统或流程。通过这种方式,你可以从基本构建块构建复杂的代理。

3、无限画布

无限画布为你提供了一个开放的空间,让你可以随时构建和创作。Figma、FigJam、TLDRAW 和 Visual Electric 就是很好的例子。以下是 Visual Electric 的画布。

Figma 和 FigJam 也有“无限”画布。工作环境有助于发挥广泛的创造力。这是 Julie W. Design 使用 FigJam AI 在无限画布上进行干扰。

这是一个 Claude 的 Artifacts 和 TLDRAW 的无限画布结合使用以制作近乎即时的网站构建器的示例。

4、语音输入

我们的数字体验之前有过语音输入,但人工智能的“聊天界面”思维模型让语音输入感觉很自然。这不是我们能拥有的人工智能的唯一思维模型,但它是 OpenAI 的 ChatGPT 获得关注的模型。(h/t David Lam)

这是 New.Computer 的 Dot。除了在聊天中输入内容外……还有一个优雅的语音输入选项。如果你看这张图片的左后方……你会看到一个带有卡片视图的屏幕。然而,这不是普通的卡片视图,你可以通过从主聊天中“捏出”来到达那里。这是一种狂野、非常酷和流畅的体验,证明了为什么 Jason Yuan 是最好的之一。

5、视觉界面

人工智能工具也能够处理视觉输入。这是 OpenInterpreter 通过网络摄像头看到 Killian 拿着一张便签,然后继续连接到 wifi。

6、并排显示

在这种方法中,您可以在左侧聊天,在右侧获得结果。此模式适用于桌面,但需要选项卡或滑动或其他移动设备。以下是一些示例。

这是Layla的旅行计划AI。您可以在左侧窗口中谈论您对假期的希望和梦想。结果、链接、视频和优惠以及您的行程显示在右侧。

Layla的AI旅行计划应用程序并排显示

这是Claude的并排用户体验,当您要求Claude帮助您编写某些代码时。左侧有一个标准聊天窗口,右侧有一个结果页面。在这种情况下,结果顶部有一个切换开关,以便我们可以看到代码和代码结果。

Claude Sonnet 3.5已打开工件…

7、全身界面

此视频显示媒体管道跟踪您的手势然后创建结果。这是AI吗?嗯……是的……里面有机器学习。不过,总的来说,这很酷!

8、AI聊天评论

如果文档中的评论栏是人工智能的聊天输入会怎么样?或者 Arbel 在这里向我们展示了如何做到这一点:

敬请期待!我会在收到更多示例时添加它们……如果你看到一些有趣的东西,请告诉我,这样我就可以将其添加到列表中。


原文链接:New UI & UX in AI

汇智网翻译整理,转载请标明出处