首页

从无人阅读的文档到生动的设计系统

杰睿 设计资源

当美好的愿望遭遇现实

按 Enter 键或单击即可查看完整尺寸的图像
我们用来记录 Notion 上的设计系统组件的模板

改变一切的研究

按 Enter 键或单击即可查看完整尺寸的图像
按 Enter 键或单击即可查看完整尺寸的图像

将文档重新想象为一种生活工具

我们不需要要求团队适应我们的系统,如果我们的系统适应他们呢?

我们的新理念:展示,而不是讲述

新的文档架构

组件标题

按 Enter 键或单击即可查看完整尺寸的图像
Accordion 组件的新标题

视觉规格

按 Enter 键或单击即可查看完整尺寸的图像
组件文档的第一个面板:组件本身及其所有变体

情境指导

按 Enter 键或单击即可查看完整尺寸的图像
表格组件的上下文指南

注意事项

按 Enter 键或单击即可查看完整尺寸的图像
选择卡组件的注意事项部分

应用内示例

按 Enter 键或单击即可查看完整尺寸的图像
在应用程序中使用 Accordion 组件的示例

最终结果

按 Enter 键或单击即可查看完整尺寸的图像

结果

建立在成功的基础上

教训

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

5 个优秀的 UX UI 作品集,供您参考(2025 年)

杰睿 设计资源

按 Enter 键或单击即可查看完整尺寸的图像
Diego Rappi 产品设计师
按 Enter 键或单击即可查看完整尺寸的图像

伊莉扎维塔·比利亚耶娃

按 Enter 键或单击即可查看完整尺寸的图像
按 Enter 键或单击即可查看完整尺寸的图像
Jay Park 作品集

朴宰范

注意事项

应该做的

注意事项

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

如何使用 AI 实现 Figma 工作流程自动化

杰睿 设计资源

步骤 1:连接 Figma 以获取评论

按 Enter 键或单击即可查看完整尺寸的图像
Figma 组件的设置

第 2 步:在将评论输入 AI 之前对其进行格式化

按 Enter 键或单击即可查看完整尺寸的图像
工具组件的设置
按 Enter 键或单击即可查看完整尺寸的图像
Figma 组件的直接输出

步骤 3:使用 AI 对 Figma 评论进行分类、总结和格式化

按 Enter 键或单击即可查看完整尺寸的图像
Gemini AI组件的设置

1. 为什么选择 Google Gemini AI

2. 提供用户文本

以下是来自设计文件的 Figma 评论列表。- 严格根据内容将其分为最多 **4 个类别**。- 使用**Figma 评论中的确切措辞**,无需修改或编造内容。- 每个类别应包括:  - 使用 `<h2>类别名称</h2>` 的**标题**。  - `<p><b>此处为摘要文本</b></p>` 内的**加粗摘要**。  - `<ul><li>“实际 Figma 评论”</li></ul>` 内的**真实示例列表**,列表前有空格。  - **每个类别最多限制 4 个要点**。- **请勿添加新示例。仅使用格式化注释中提供的内容。**- 如果评论不属于这 3 个类别之一,请将其放在“其他”下。- **您只能以 HTML 格式回复**并且必须使用以下标签:  `<h2>`、`<p>`、`<ul>`、`<li>`、`<b>` 和 `<a>`。---### **Figma 评论(从文件动态提取):**{{formatted_comments}}

3. 设置输出令牌和温度

步骤 4:连接到 Google 文档

按 Enter 键或单击即可查看完整尺寸的图像
Google Docs 组件的设置

附录

1. 文本解析器不再是必要的。

按 Enter 键或单击即可查看完整尺寸的图像
文本解析器组件的设置

2. 对回应进行尽职调查。

3. 调度功能很有用。

按 Enter 键或单击即可查看完整尺寸的图像
日程设置

 

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

【游戏界面设计分享】《DUNE|Personal Work》

杰睿 平面设计

imgi_34_3db6b6213486985.6747309f530b9.png

imgi_35_773966213486985.6747309f52652.png

imgi_36_9a1e76213486985.67585eae083fc.png

imgi_90_456a13213486985.67585eae07f18.png

imgi_91_80499a213486985.67585eae08911.png

从《沙丘》UI概念设计看游戏界面经验

前几天在 Behance 上刷到一个《DUNE|Personal Work》的 UI 概念项目,整体完成度很高。作为设计师,我觉得这类作品不仅是视觉享受,也能总结出一些值得借鉴的经验点。这里就结合其中的阵营选择界面和整体展示,整理一些观察和思考。


1. 版式与结构:焦点与对称

这类「阵营选择」场景,本质上是一个决策界面。作者采用了很经典的结构:

  • 中央突出:当前选中的阵营(走私者)放在正中间,卡片更大、更亮,带有金色光晕。

  • 对称排布:左右阵营呈对称分布,层级自然清晰,符合玩家的浏览动线。

  • 信息分区:上半部分是角色立绘和阵营徽记,下半部分是机制说明和操作提示。模块分明,不容易迷失。

经验点:在决策型界面中,居中放大+光效高亮,是非常直接有效的焦点策略。


2. 视觉语言:氛围与辨识

《沙丘》的世界观强调沙漠、贵族与荒凉感,UI 也延续了这一氛围:

  • 材质:背景有金属与沙尘质感,带来厚重感。

  • 色彩:每个阵营配有主色(绿色、棕色、蓝色、金色、红色),既强化辨识,又有“品牌”味道。

  • 徽记:几何化的阵营符号,简洁且容易记忆。

经验点:大型世界观游戏的 UI,最好在颜色、图形符号和氛围感上形成自洽体系。


3. 信息呈现:符号化与层次感

在阵营说明区,信息拆解得很合理:

  • 优缺点:红色 V 表示劣势,绿色 ▲ 表示优势。非常直观,不需要额外解释。

  • 叙事与机制结合:不仅给数值效果,还加了剧情描述(例如与弗瑞曼的冲突),让选择更有代入感。

经验点:把理性信息(数值)和感性信息(剧情)结合,能让玩家在选择时既动脑又动情。


4. 交互与引导:清晰的操作提示

底部的操作提示很细致:

  • A 选择 / B 详情 / X 故事,分别对应不同层级的操作需求。

  • 玩家既可以直接做决定,也可以深入剧情,满足不同类型的用户。

经验点:关键节点上提供“浅 → 深”不同层级的操作选项,能兼顾快进型玩家和沉浸型玩家。


5. 作品展示方式:完整体验

Behance 项目整体除了界面,还展示了:

  • 不同场景的 UI(例如主菜单、HUD、资源界面)。

  • 色彩与符号系统,确保整体一致性。

  • 工具说明(Photoshop / Midjourney / 后期合成),透明展示流程。

经验点:在作品集展示中,不仅要秀界面,还要展示系统性思考和设计过程。


总结

这份《DUNE》个人 UI 概念作品给我的几点启发:

  1. 决策型界面要突出焦点,用对称和光效增强层级。

  2. 色彩与符号体系是阵营/角色类 UI 的关键资产。

  3. 信息既要数值化,又要叙事化,提升代入感。

  4. 操作引导要考虑不同层级的玩家。

  5. 作品集展示不仅是炫图,还要有系统设计思路。

如果你正在做游戏 UI 或作品集,这些经验都值得借鉴。

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

 

 

如果必须重新开始,我将如何在 3 个月内学习 UI/UX 设计

杰睿 设计管理与成长

适用对象

本指南非常适合:

  • 年轻的 UI/UX 设计师正在寻求进入该行业。
  • 希望进入设计领域的职业转换者(例如开发人员或营销人员)。
  • 想要实践设计技能并提高专业水平的专业人士。

没有经验?没问题。

您所需要的只是好奇心、学习兴趣和额外的奉献精神。

为什么 UI/UX 设计是一个很好的职业选择

按 Enter 键或单击即可查看完整尺寸的图像

工作需求和机会

UI/UX 设计正在蓬勃发展,数据也印证了这一点。美国劳工统计局预测,从 2021 年到 2031 年,数字设计专业的需求将增长 15%,领先于其他行业。

从 IT 公司到医疗保健初创企业,每个行业都需要设计师设计清晰且具有视觉吸引力的产品。

无论您想成为 UI 设计师、UX 研究员还是产品设计师,您跨工作和跨领域合作的机会都是无与伦比的。

另外,远程工作怎么样?这是此字段的默认设置。

技能优势

您可以通过字体和调色板发挥您的创造力,解决用户流程方面的挑战,并精通原型设计等技术技能。

结果如何?一份有趣又令人满意的工作。根据 Glassdoor 的数据,UX 设计师的全球平均薪资在 8 万至 12 万美元之间,顶级职位的薪资甚至更高。

智能布局生成器等人工智能解决方案旨在提高生产力,而不是取代人类的技能。

用户体验的影响

UI/UX 设计除了赚钱之外,还旨在让人们的生活更轻松。

想象一下您上次在线购买披萨或预订机票的情况。

良好的用户体验让这些任务变得毫不费力,而糟糕的用户体验会让你对着屏幕尖叫。

作为一名设计师,你将通过构建既简洁又鼓舞人心的数字体验来应对现实世界的问题。这种影响力会让你欣喜地说:“这是我设计的。”

第 1 个月:奠定基础,培养核心技能

了解基础知识

第一个月的主要任务是奠定坚实的基础。

首先,区分 UI(视觉界面,例如按钮、颜色和布局)和 UX(整体体验,例如易用性和满意度)。

我花了数周时间平滑按钮的渐变,却发现用户根本找不到它,这真是太惨了。

需要重点关注的关键技能:

  • 基本设计原则:了解排版、色彩理论、网格和布局。这些是任何优秀设计的基本组成部分。
  • 以用户为中心的设计:培养思考用户需求的实践能力。他们是谁?什么会让人感到沮丧?设计一些小型的用户画像进行实践。
  • 线框图和原型设计:开始采用低保真线框图(应用程序屏幕的草图)来规划用户流程。

资源:

  • 在 YouTube 上观看简短的 YouTube 视频来掌握基础知识。
  • 阅读唐纳德·诺曼的《设计心理学》,它将彻底改变我们理解设计“为什么”的方式。
  • lawsofux.com看看那些紧凑原理,比如希克定律和菲茨定律。(你可能不信,但我有时还是会去看看这个网站,我想你应该知道这没什么问题。)
  • 为了使学习更容易,尝试玩Method.acIt's Centered That等交互式设计游戏。

专业提示:不妨从日常事物入手,比如你的咖啡机、银行应用程序或自动售货机。“为什么要这样设计?”“还有什么更好的选择?”这种态度可以提升设计师的创造力。

第二个月:培养真正的技能

按 Enter 键或单击即可查看完整尺寸的图像

学习设计工具和实践

现在是时候动手实践了。第二个月的重点是学习工具并将其应用于实际场景。

设计软件一开始可能看起来很吓人,但是一旦你掌握了它的感觉,它就像骑自行车一样简单(而且膝盖不会擦伤)。

练习,练习,再练习:

  • 重新设计现有的应用程序或网站:选择一个热门应用程序(例如你最喜欢的外卖服务),并使用第一个月的设计理念来改进其界面。重点在于提升价值和外观。
  • 建立作品集:使用这些重新设计的作品集来创建一个简单的作品集。即使只有一个完成的项目也是一个好的开始。
  • 关键技能:响应式设计(适用于移动设备和桌面的设计)、用户流(通过创建用户旅程)以及使用 Figma 或 Framer 进行高保真原型设计的技能。

资源:

我的第一次重新设计是为一个复杂的电商网站做的。我花了几个小时修改按钮的颜色,结果发现结账流程简直像个迷宫。那时我才意识到,吸引人的设计固然好,但真正能让你被雇佣的,是解决用户问题。

第三个月:建立投资组合和应对现实挑战

按 Enter 键或单击即可查看完整尺寸的图像

你已经进入最后冲刺阶段了!第三个月,你将用实际项目证明你的技能,并打造一个让你眼前一亮的作品集,让你“快来雇佣我!”

正是在这里,我从“我认为我能做到”转变为“我一名 UI/UX 设计师”。

与他人合作:

  • 从事真正的项目,例如重新设计本地企业的网站或为 GitHub 上的开源项目做出贡献。
  • 从设计社区获取反馈,例如InstagramXLinkedInDribbbleBehanceReddit 的 r/userexperience。在我职业生涯的早期,一位导师的诚实评价(“你的字体选择太疯狂了”)拯救了我的作品集,使其免于受损。

投资组合开发:

  • 在流畅的网络作品集上展示 2-3 件您最出色的作品(Notion 或 Webflow,或Framer(我个人使用)是免费选项)。
  • 为每个项目撰写案例研究,解释你的流程:调研、构思、测试和迭代。这能向公司表明你是一位思考者,而不仅仅是一个像素推手。
  • 关键技能:学习用户测试(让朋友尝试您的想法并记录任何问题)、修改(根据反馈进行改进)和演示(练习有效地表达您的工作)。

资源:

  • Behance 的热门设计师作品集可能会给你带来启发。
  • Medium 上的 UX 设计社区提供免费的案例研究模板。

使用 AI 驱动的 Figma 插件(例如智能布局工具和调色板生成器)提升您的工作效率。就像拥有一个永不休眠的设计助手。

我建议您开始在工作流程中使用 AI,这样您的工作速度就可以比其他设计师快 10 倍!

关键习惯

按 Enter 键或单击即可查看完整尺寸的图像

养成日常观察的习惯。分析实体和数字事物,例如健身追踪器、新闻应用和餐厅菜单。

可用性怎么样?为什么是这个颜色?如何改进?

这可以帮助您像设计师一样思考,并且您很快就会发现用户体验(和解决方案)的问题随处可见。

专家建议和专业提示

  • 建立人脉网,就像你的职业生涯全靠它一样。我的第一份自由职业工作来自一次偶然的机会,当时我紧张地递上了我的作品集。在领英和Instagram上直接联系你尊敬的设计师。
  • 坚持是关键。即使每天只花30分钟学习新事物,或者读一读尼尔·埃亚尔的《Hooked》,也能带来显著的变化。
  • 接受反馈:反馈虽然令人难受,但却是改进的最快途径。我曾经因为一些评论删除了一个完整的项目,但这次返工让我赢得了一位客户。

雇主希望设计师能够加快结账流程或提高客户参与度,而不仅仅是让事情变得有趣。

最后的想法

成为一名 UI/UX 设计师只需要策略和奉献精神,而不是设计学位或多年的经验。

在三个月内,您可以通过了解基础知识、创建真实世界的项目并自信地展示您的工作,从初学者进步到可以投入工作的水平。

现在迈出第一步:选择一个应用程序,重新设计一个屏幕,并与好友分享,并且不要忘记在社交媒体上分享它以获得反馈。

设计行业正在寻找您独特的见解。

感觉受到启发了吗?关注我的 Instagram (@rehan.designs),获取每日见解、作品集点评以及我的设计幕后花絮。

 

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

Agentic UX 的秘密:人类与 AI 代理交互的新兴设计模式

杰睿 行业趋势

想法简述

  • 本文探讨了 UX 设计师如何通过了解影响代理行为和用户交互的四种关键能力类型来有效地与 AI 代理合作。
  • 它强调在设计过程早期评估人工智能代理的感知、推理、行动和学习能力的重要性,以创造现实、合乎道德和以用户为中心的体验。
  • 该作品提供了实用的框架和示例——从智能家居设备到医疗保健机器人——以帮助设计师提出正确的问题、跨职能协作以及负责任地使用人工智能。

随着人工智能 (AI) 越来越深入地融入产品,设计师必须了解这些系统真正能做什么。本文介绍了一个围绕感知、推理、记忆和代理四大核心能力构建的实用框架,旨在帮助用户体验 (UX) 专业人士设计更智能、更值得信赖的 AI 体验。本书包含真实案例和实用技巧,对于任何致力于塑造 AI 界面未来的人士来说,都是必读之作。

许多人认为,人工智能代理已经存在,只是分布不均。然而,目前很少有案例能够展现与这种近未来人工智能的良好交互体验。幸运的是,在最近的 AWS Re: Invent 大会上,我偶然发现了一个与人工智能代理交互的用户体验的绝佳示例,我迫不及待地想在本文中与大家分享这一愿景。但首先,人工智能代理究竟是什么?

什么是 AI 代理?

想象一下一个蚁群。在一个典型的蚁群中,有不同专长的蚂蚁:工蚁、兵蚁、雄蚁、蚁后等等。蚁群中的每只蚂蚁都有不同的工作——它们独立运作,但又像一个紧密结合的整体。你可以“雇佣”一只蚂蚁(代理)为你做一些简单的半自主工作,这本身就很酷。然而,试想一下,你可以雇佣整个蚁丘去做一些更复杂或更有趣的事情:找出你的系统出了什么问题,预订你的行程,或者……做几乎所有人类在电脑前能做的事情。每只蚂蚁本身并不非常聪明——它们高度专业化,专注于完成特定的工作。然而,不同专长的蚂蚁组合在一起,呈现出一种我们将其与高级动物联系起来的“集体智慧”。我们在博客中一直使用的“人工智能”(AI)与人工智能代理之间最显著的区别在于自主性。您不需要向 AI 代理提供精确的指令或等待同步输出 - 与一组 AI 代理的整个交互更加流畅和灵活,就像蚁丘解决问题一样。

按 Enter 键或单击即可查看完整尺寸的图像
《人工智能用户体验:设计人工智能驱动产品的框架》 (Wiley出版社,2025年)图片来源:Greg Nudelman

AI 代理如何工作?

代理型人工智能 (Agentic AI) 的工作方式多种多样——这是一个内容丰富的主题,值得专门写一本书来探讨(或许一两年后)。在本文中,我们将以系统故障排除为例,阐述一个涉及主管代理(也称为“推理代理”)和多个工作代理的复杂流程。该流程始于人类操作员收到问题警报。他们启动调查,然后由主管代理领导的半自主 AI 代理团队帮助他们找到根本原因,并提出解决问题的建议。让我们用步骤图来分解与 AI 代理交互的过程:

按 Enter 键或单击即可查看完整尺寸的图像
多阶段代理AI流程。图片由Greg Nudelman提供

上图所示的多阶段代理工作流程包含以下步骤:

  1. 人类操作员向主管 AI 代理发出一般请求。
  2. 然后,主管 AI 代理启动并向几个专门的半自主工作者 AI 代理发出一般请求,这些代理开始调查系统的各个部分,寻找根本原因(数据库)。
  3. 工作代理将调查结果带回主管代理,主管代理将其整理为对人类操作员的建议。
  4. 人类操作员接受或拒绝各种建议,这会导致主管代理启动更多工作人员进行调查(云)。
  5. 经过一段时间的反复,主管代理提出了关于根本原因的假设并将其交给人类操作员。

如同与典型的人类组织签订合同一样,主管AI代理拥有一支由专业AI代理组成的团队。主管可以将消息路由到其监管下的任何AI工作代理,这些代理将执行任务并反馈给主管。主管可以选择将任务分配给特定代理,并在稍后获得更多信息时发送附加指令。最后,任务完成后,输出将反馈给用户。然后,人类操作员可以选择向主管AI代理提供反馈或附加任务,在这种情况下,整个流程将重新开始。

人类无需担心任何内部事务——所有事务都由“主管”以半自主的方式处理。人类所做的只是提出一个通用请求,然后审查并响应这个代理“组织”的输出。如果你能做到这一点,这正是你与蚁群沟通的方式:你将工作分配给蚁后,让她管理所有工蚁、兵蚁、雄蚁等等。与蚁群类似,单个专业代理不需要特别聪明,也不需要直接与人类操作员沟通——它们只需要能够半自主地解决它们被设计执行的专业任务,并将精确的输出反馈给“主管”代理,仅此而已。“主管”代理的工作就是完成所有的推理和沟通。这种人工智能模型更高效、更经济,并且在许多任务中都非常实用。让我们来看看交互流程,以便更好地感受这种体验在现实世界中的感受。

使用案例:使用 AI 代理进行 CloudWatch 调查

为简单起见,我们将遵循本文前面的工作流程图,流程中的每个步骤都与图中的步骤相对应。此示例来自AWS Re: Invent 2024 — 不要停滞不前:互联遥测如何助您前进 (COP322),由 YouTube 上的 AWS Events 主持,从 53 分钟开始。

步骤 1

该流程始于用户发现名为“bot-service”的服务(屏幕截图左上角)故障急剧增加,并启动新的调查。然后,用户将所有相关信息以及一些额外的指令传递给主管代理。

按 Enter 键或单击即可查看完整尺寸的图像
步骤 1:人工操作员启动新的调查。图片来源:AWS via YouTube

第 2 步

现在,在步骤 2 中,主管代理接收请求并生成一组工作 AI 代理,这些代理将半自主地查看系统的不同部分。该过程是异步的,这意味着右侧的建议初始状态为空:调查启动后不会立即显示结果。

按 Enter 键或单击即可查看完整尺寸的图像
步骤二:主管代理启动工作代理,工作代理需要一些时间才能汇报结果。图片来源:AWS via YouTube

步骤3

现在,工作代理返回了一些“建议的观察结果”,这些结果由主管处理并添加到屏幕右侧的建议中。请注意,屏幕右侧现在更宽了,以便于阅读代理建议。在下面的屏幕中,不同的代理提出了两个截然不同的观察结果,第一个代理专门负责服务指标,第二个代理专门负责跟踪。

按 Enter 键或单击即可查看完整尺寸的图像
步骤3:工作代理返回可能与系统遇到的问题相关的建议。图片来源:AWS via YouTube

这些“建议的观察结果”构成了调查中的“证据”,旨在找出问题的根本原因。为了找出根本原因,此流程中的人类操作员会提供帮助:他们会向主管代理反馈哪些观察结果最相关。因此,主管代理和人类操作员并肩协作,找出问题的根本原因。

步骤4

人工操作员会点击“接受”按钮,确认他们认为相关的观察结果,这些结果会被添加到屏幕左侧的调查“案例档案”中。现在,人工操作员已经添加了反馈,表明他们认为这些信息是相关的,代理流程将启动调查的下一阶段。主管代理收到用户反馈后,将不再发送“更多相同的信息”,而是会进行更深入的挖掘,甚至可能调查系统的其他方面,以寻找根本原因。请注意,下图中右侧出现的新建议属于另一种类型——它们现在正在查看日志以寻找根本原因。

按 Enter 键或单击即可查看完整尺寸的图像
步骤4:收到用户反馈后,代理会进行更深入的分析,并提出不同的建议。图片来源:AWS via YouTube

步骤5

最后,主管代理掌握了足够的信息,开始尝试找出问题的根本原因。因此,它从证据收集转向推理根本原因。在步骤3和4中,主管代理提供了“建议性观察”。现在,在步骤5中,它准备好进行重大揭秘(也可以称之为“结局场景”),因此,就像文学侦探一样,主管代理提出了它的“假设建议”。(这让人想起游戏“线索”,玩家轮流提出“建议”,然后,当他们准备好发起攻击时,他们就会提出“指控”。主管代理在这里也做了同样的事情!)

按 Enter 键或单击即可查看完整尺寸的图像
步骤5:主管代理现在可以指出“犯罪”的罪魁祸首了。图片来源:AWS via YouTube

建议的假设是正确的,当用户点击“接受”时,主管代理会提供后续步骤来解决问题,并防止将来再次出现类似问题。代理似乎在对人类指手画脚,建议他们“实施适当的变更管理程序”——这是任何良好系统卫生的基础!

按 Enter 键或单击即可查看完整尺寸的图像
Supervisor Agent 还提供了后续步骤来修复问题并预防未来再次发生。图片来源:AWS via YouTube

最后的想法

代理流如此引人注目,并成为当今众多人工智能开发工作的焦点,原因有很多。代理引人注目、经济实惠,并且能够实现更加自然灵活的人机界面。代理能够填补人类与机器之间沟通的空白,真正实现人机思维的融合,形成超越人类的“增强智能”,其价值远超其各部分之和。然而,要从与代理的交互中获得最大价值,也需要我们彻底改变对人工智能的理解方式,以及设计支持代理交互的用户界面的方式:

  • 灵活、可调节的用户界面:代理与人类一起工作,为此,人工智能代理需要一个灵活的工作流程,以支持人与机器在多个阶段的持续交互——开始调查、接受证据、形成假设、提供后续步骤等。这是一个跨越多个迭代的灵活循环流程。
  • 自主性:虽然目前,人机交互似乎是代理工作流程的常态,但代理展现出非凡的能力,能够提出假设、收集证据,并根据需要迭代假设,直至解决问题。它们不会感到疲倦,也不会穷尽所有选项而放弃。AI 代理还展现出能够有效地“编写代码……让工具自行构建工具”的能力,从而探索解决问题的新方法——这很新颖。这种交互本质上需要“积极主动”的 AI,例如,这些代理接受了最大召回率的训练,愿意尝试所有可能性,以确保获得最真实的积极结果(请参阅我们在此处的价值矩阵讨论)。这意味着,有时代理会“只是为了尝试”而采取行动,而不会“考虑”假阳性或假阴性结果的成本。例如,一个积极主动的 AI 代理“医生”可能会开出侵入性脑癌活检手术,而不会先考虑风险较低的替代方案,甚至不会停下来征求患者的同意!所有这些都需要更深层次的人机分析,以及针对激进的人工智能“探索想法”的多个新的审批流程,这些想法可能会导致人类伤害,或者只是导致超出预算的成本膨胀。
  • 需要新的控件:虽然大部分交互可以通过现有屏幕完成,但大多数代理操作都是异步的,这意味着大多数采用传统事务型、同步请求/响应模型的网页都无法适应这种新型交互。我们需要引入一些新的设计范式。例如,开始、停止和暂停按钮是控制代理流程的良好起点,否则你很有可能最终陷入幻想曲中“魔法师的学徒”的境地(自我复制的扫帚不停地打水,造成巨大且昂贵的混乱)。
  • 你“雇佣”AI来执行任务:这与传统的工具使用方式截然不同。它们不再是工具,而是具有推理能力的实体,各自拥有智能。AI服务目前已包含多个由主管监控的专用代理。很快,我们将引入多级管理,由下级主管和“团队负责人”向最终与人类打交道的“客户经理代理”汇报……就像今天的人类组织一样。到目前为止,组织需要跟踪产品、人员和流程。现在,我们为“人”添加了新的定义——AI代理。这意味着需要开发可行的用户界面来保护机密信息、基于角色的访问控制 (RBAC) 和代理版本控制。保护代理数据将比与人类员工签署保密协议更为重要。
  • 持续学习系统:要充分发挥智能代理的价值,它们需要持续学习。智能代理会不断学习,迅速成为其所用系统方面的专家。最初的智能代理就像新来的实习生一样,知识储备有限,但他们很快就会成为“房间里的成年人”,拥有比大多数人更丰富的访问权限和经验。这将在职场上引发巨大的权力转移。我们必须做好准备。

无论你对人工智能代理有何看法,它们无疑会与人类同行共同发展,并持续存在。因此,我们必须了解代理人工智能的工作原理,以及如何设计能够让我们安全高效地与它们协同工作的系统,充分发挥人类和机器各自的优势。

 

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

用户体验中的人工智能透明度:设计清晰的人工智能交互

杰睿 设计管理与成长

随着人工智能越来越多地融入网站和应用程序体验,区分哪些地方已经实施了人工智能,哪些地方尚未实施人工智能,变得至关重要。

最初,大多数产品将人工智能作为聊天机器人引入,用户可以通过聊天机器人发起并促进与人工智能的交互。现在,产品正在将人工智能融入仪表盘、任务和搜索功能。用户不再主动体验人工智能——人工智能体验已经预先存在。

由于用户不再控制何时触发人工智能的使用,因此需要让用户了解何时向他们展示人工智能功能或内容,以确定其有效性和质量。不仅如此,《欧盟人工智能法案》(2026年生效)将强制要求用户在与人工智能系统进行通信或互动时必须知晓。

这就是设计系统的用武之地——实施专门的视觉处理,以始终如一地将人工智能内容和特征与非人工智能内容和特征分开。

按 Enter 键或单击即可查看完整尺寸的图像
Google 的 Material Design 系统展示了按钮和分段按钮等组件
Google 的 Material设计系统文档

遗憾的是,目前只有少数开源设计系统明确地包含 AI 组件和模式。我希望很快会有更多系统加入,但目前为止,只有 GitLab 的 Pajamas、IBM 的 Carbon 和 Twilio 的 Paste 在其指南中承认了 AI。

注意:我使用Figma 的设计系统来对 AI 组件和模式进行基准测试。我没有纳入仅包含 AI 聊天机器人或对话设计文档的设计系统,因为这是一种更标准的交互模式;这包括亚马逊的 CloudscapeSalesforce 的 Lightning

让我们比较和对比这些设计系统 AI 组件和模式,看看它们可以在哪些方面进行优化以提高可用性。

1. GitLab 的睡衣

Pajamas目前不包含明确的组件或模式,但它确实包含一些关于 AI 与人类交互的有趣文档。该文档首先建议通过识别哪些自动化操作是合乎道德且有益的(例如,高风险任务 vs. 低风险任务),来了解 AI 的使用是否真的能给用户带来好处。

接下来,它建议透明地说明 AI 的使用地点——Pajamas 通过其“GitLab Duo”实现了这一点,这是 AI 特性、能力和局限性的指标。

按 Enter 键或单击即可查看完整尺寸的图像
GitLab Duo 的示例展示了用户可以在哪里与 AI 进行交互
GitLab Duo 用于指示用户可以在界面中与 AI 交互的位置

由于“GitLab Duo”用于 AI 功能和交互(而不是任何 AI 内容),Pajamas 还建议使用“<动词> by AI”(即“由 AI 总结”)标记 AI 生成的内容,并发送一条消息鼓励用户检查 AI 内容。

GitLab 也在开发一个框架来实践他们的指导方针;目前还在开发中,但大致的工作内容可以在GitLab 的 AI UX 模式中查看。他们的目标是发布一个带有文档的 AI 模式库——这正是我们所需要的(拜托!)。

GitLab 对其 AI UX 模式的愿景分为 4 个维度,以帮助选择正确的 AI 模式:模式、方法、交互性和任务。

  • 模式:人工智能与人类互动的重点(专注、支持或整合)
  • 方法:人工智能正在改进什么(自动化或增强任务)
  • 交互性:人工智能如何与用户互动(主动或被动)
  • 任务:AI 系统可以帮助用户做什么(分类、生成或预测)

例如,他们早期对人工智能模式的探索包括低保真模型,展示了如何将人工智能与图表或内联解释集成到界面中。这些模式清晰地标记了人工智能的用途,有助于建立用户对人工智能系统的理解和信任。

按 Enter 键或单击即可查看完整尺寸的图像
低保真折线图,显示当集成到界面中时可以在数据中突出显示的 AI
带有指示 AI 的标记的低保真集成图表,例如预测数据(通过GitLab 的 Vision for AI UX
按 Enter 键或单击即可查看完整尺寸的图像
使用 Gitlab 模式填写表单时使用 AI 的示例
低保真集成解释器,使用 AI 填写表格(通过GitLab 的 AI UX 愿景

判决

目前,GitLab 的文档还停留在概念阶段,仅概括了他们希望未来 AI UX 体验的样子。但它提供了一个坚实的框架,大多数设计系统都可以采用——无论哪个行业或产品。

我希望他们能尽快发布更多关于其AI用户体验模式的深入信息。我认为这对其他开发AI文档的设计系统来说,将是一笔宝贵的开源资产。

2. IBM 的 Carbon

在众多开源设计系统中,Carbon拥有最丰富的 AI 使用文档。它包含一个 AI 专用版块“Carbon for AI”,涵盖组件、模式和指南,帮助用户识别 AI 生成的内容,并了解 AI 在产品中的应用方式。

Carbon for AI 建立在现有 Carbon 组件之上,添加了蓝色光晕和渐变效果来突出显示 AI 实例。目前为止,已有 12 个包含 AI 变体的组件,例如模态框、数据表和文本输入。

按 Enter 键或单击即可查看完整尺寸的图像
IBM Carbon 中的所有 12 个 AI 组件,包括复选框和文本输入
Carbon for AI 的组件列表及具体 AI 变体

尽管组件的 AI 变体具有独特的视觉处理,但在上下文中,很难区分哪个组件当前处于活动状态(因为它们看起来都是活动的)。

在下面的表单中,AI 用于自动填充大部分输入字段,因此这些字段使用了 AI 变体。即使在默认状态下,AI 变体也会呈现蓝色渐变和边框,这导致难以直观地识别哪个组件处于活动状态。

按 Enter 键或单击即可查看完整尺寸的图像
使用人工智能帮助输入答案的示例表单,并展示人工智能组件在上下文中的使用情况
AI 组件上使用的蓝色渐变和边框使得很难判断哪个组件处于活动状态

用户可以覆盖 AI 的输入,这会将组件的 AI 变量替换为默认变量。这将触发“恢复为 AI 输入”操作,以替换输入字段中的 AI 标签,从而允许用户控制手动或自动表单响应。

按 Enter 键或单击即可查看完整尺寸的图像
带有恢复操作的文本字段,显示“恢复到 AI 输入”的工具提示
当用户覆盖 AI 输入时,Carbon 的“恢复 AI 输入”功能就会出现

除了 AI 变体之外,它还包含一个明确的 AI 标签,可以显示一个弹窗,解释特定场景下 AI 的细节(Carbon 将此模式称为“AI 可解释性”)。用户可以选择 AI 标签,弹窗就会出现在按钮下方。

按 Enter 键或单击即可查看完整尺寸的图像
一个中等保真度的屏幕模型,其中的 AI 标签弹出窗口显示了有关 AI 使用情况的详细信息
Carbon 的 AI 标签包含一个解释器弹出窗口,方便用户获取有关 AI 使用情况的更多详细信息

判决

看到像 Carbon 一样完善的 AI 模式和组件设计系统文档,真是令人兴奋。他们不仅提供了 AI 通用用法的文档,还提供了实际可用的组件和模式。

但由于组件的AI变体使得在上下文中使用时难以区分哪个组件处于活动状态,我认为存在可用性和可访问性问题。AI变体的颜色使用过于引人注目,而且看起来像Carbon的焦点状态(这可能会影响依赖焦点状态的低视力用户)。

按 Enter 键或单击即可查看完整尺寸的图像
文本字段组件的 AI 变体与文本字段的焦点状态之间的比较
Carbon 的 AI 变体与文本字段的焦点状态

3. Twilio 的 Paste

最后,Paste在“体验”版块下提供了一个“人工智能”板块。Paste 提供了关于在用户体验中使用人工智能的通用文档,以及一些可用的组件。

在设计AI功能时,Paste建议允许用户将AI结果与自身体验进行比较,并处理潜在的错误和风险。为了减少这些错误,Paste提倡赋予用户审查和撤消输出、控制数据源以及向AI系统提供反馈的能力。

Paste 还建议在设计新的 AI 功能时问自己:“如果它做同样的事情但不使用 AI,我将如何设计这个功能?”用户使用产品不仅仅是为了与人工智能互动——他们还试图尽可能高效地完成任务并实现目标。

Paste 包含一个包含 5 个组件的 AI UI 套件:人工智能图标、徽章、按钮、进度条和骨架加载器。它还包含一些专为 AI 聊天体验打造的组件,例如 AI 聊天日志。

Paste 文档中最有帮助的是他们提供的示例,包括路标、生成功能和聊天功能。

对于指示牌,Paste 建议使用带有人工智能图标的装饰性徽章来指示某个功能正在使用人工智能,例如人工智能推荐或预测。指示牌是非交互式的,但类似于按钮,因此看起来可以点击。

按 Enter 键或单击即可查看完整尺寸的图像
Twilio 的路标示例展示了带有 AI 闪光图标的徽章
Paste 使用徽章和 AI 图标的路标示例

生成功能会向用户提供提示,帮助他们使用 AI 功能,例如“总结数据”或“推荐下一步”。当您选择生成功能时,下面会出现一个弹出窗口,向用户提供说明以及它正在使用的 AI 模型。

按 Enter 键或单击即可查看完整尺寸的图像
Twilio 的生成功能示例展示了一个带有弹出窗口的按钮,用于解释有关 AI 模型的详细信息及其使用方法
Paste 的生成功能包括一个带有弹出窗口的按钮,用于指导用户与 AI 交互

最后,聊天内容是当今已知的人工智能聊天机器人的典型特征,并包含对其对话原则的引用,以发展人工智能的个性。

按 Enter 键或单击即可查看完整尺寸的图像
Twilio 的聊天示例,其中有一个空状态,并且在用户文本字段下方有多个 AI 提示
Paste 的 AI 聊天机器人处于空状态,并在文本字段下方提示

Paste 确实即将推出另一种加载模式,但我们还需拭目以待。这种模式将为用户提供一种控制和预测 AI 输出的方式;这包括停止输出以及根据 AI 输出所需的时间来调整状态。

判决

我很高兴看到一些文档和实际示例的结合。虽然其中一个示例是聊天机器人,但 AI UI 套件中的其他组件也展示了如何在界面中透明地展示 AI 的使用方法。

Paste 正在寻求对其 AI UI 工具包的反馈——他们有一个开放的Github 讨论,您可以在其中提交请求。

令人惊讶的是,很少有设计系统发布关于组件和模式的文档来处理AI驱动的内容和功能(至少是公开的)。例如,谷歌和微软都是AI行业的领导者,但开源的Material和Fluent设计系统却不包含AI模式。

由于这些 AI 领导者正在将 AI 融入到与更广泛用户群体互动的常见产品(例如 Gemini 和 Copilot),他们正在构建其他产品也需要效仿的用户心智模型。即使是Adobe 旗下的 Spectrum,虽然已将 AI 融入其众多产品(例如 Adobe Firefly),但在涉及内容和人物写作时,也只用了短短的宣传语来提及机器学习和 AI。

也许他们的AI模式还在开发中?或者他们还在等待时机成熟?

无论如何,向用户展示 AI 功能和生成的内容至关重要,这样他们才能更好地理解所展示的内容,并建立对产品的信任。我期待更多超越闪光图标和聊天机器人的设计系统模式。

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

优化用户体验 | 为信任而设计:为什么用户体验道德如此重要

杰睿 设计管理与成长

“好的设计”本应让事情变得更好。但如果“更好”的定义由商业指标而非人来决定,会发生什么?
我们构建了一个数字产品常常以点击量和转化率来评判的世界,而不是以用户尊严或福祉来衡量——说服与操纵之间的界限从未如此模糊。作为设计师,如果我们曾思考过,为什么这么多的网络设计让人感觉就是为了挫败、利用或仅仅让用户感到疲惫不堪,那么答案就在于此。
因此,这里重要的问题并非我们能设计什么,而是我们应该设计什么(以及为什么我们经常不设计)。

我从事设计行业多年,先是从事架构设计,后来又从事用户体验设计,但我仍然对人们对“好设计”的定义如此不同感到惊讶——而且这些定义会随着个人视角的不同而发生变化。对大多数人来说,好设计仅仅是外观精美。对用户来说,它还关乎产品运行的流畅程度。对管理者来说,好设计是指能够带来成果并满足业务目标的设计。而对设计师来说……嗯,这有点复杂。

人们或许会认为,设计师本身应该拥有最广泛、最细致的理解。毕竟,我们受过训练,能够在美学、可用性和业务需求之间取得平衡。然而,即使在我们自己的圈子里,也存在一个持续存在的盲点:设计的伦理维度。设计伦理常常被简化为职业忠诚度的问题——保护客户机密、遵守保密协议或避免抄袭——而更深层次的伦理问题,即那些关乎我们的工作如何塑造用户的自主性、福祉和信任的问题,却很少得到应有的重视。

有时,这种情况的发生是因为我们人类倾向于回避艰难的对话或道德争议。有时,这是因为一种错位的“职业忠诚”感阻碍了我们质疑老板或客户的优先事项。有时,是因为我们认为这无关紧要。毕竟,市场上已经有足够多的设计师了;我们制造一些噪音,很快就会被一个毫不在意的人取代,唯一的结果就是我们丢掉工作。有时,很简单,是因为我们从一开始就没有被教导去思考这些问题。

设计不只是外观和感觉,更在于其运作方式。——
史蒂夫·乔布斯

并非如此。设计不仅仅关乎外观,也不仅仅关乎其功能是否流畅。当然,产品能够帮助我们提高工作效率、更舒适地出行,甚至能煮出更美味的咖啡,这固然重要,但如果产品外观精美,也同样令人欣喜——但这只是表面功夫。

从更深层次来看,设计还关乎产品如何影响用户、塑造他们的行为、引导他们的选择并编码价值观——这些往往是无形的。不幸的是,伦理问题常常被淹没在可用性、吸引力和商业指标的表象之下。当我们开始用点击量、用户投入的时间和收入来衡量成功时,伦理维度就很容易被忽视或被合理化。正因如此,当我们谈论“它如何运作”时,同样重要的是要问:它对谁有效,以及它的目的是什么?

最初,用户体验 (UX) 的理念是将用户视为拥有自身需求、弱点和权利的个体。设计师需要解决实际问题,以系统化思维,并确保产品服务于更广泛的利益,而不仅仅是商业或技术进步。用户体验旨在弥合用户需求与商业目标之间的差距。不幸的是,随着数字产品发展成为价值数十亿美元、执着于增长的生态系统,这种平衡发生了改变。

“操纵的最大危险在于,它可能变得无形、正常化,并融入日常生活。”
——肖莎娜·祖博夫

在这个数字产品日益复杂、商业模式日益激进的世界里,用户体验(UX)最初以人为本的本质已日渐式微。商业需求往往凌驾于一切之上,用户体验设计师常常被迫将“业务影响”置于用户福祉之上。多年来用于引导用户获得价值的说服工具如今被滥用,并被重新定义为操纵工具。诱骗用户做出非本意行为的“暗箱操作”如今带来了数十亿美元的非预期订阅和购买。
这些原本旨在让科技更人性化的技能,如今却越来越多地被用来利用人性。

这种道德沦丧的现象更加令人担忧,因为它已不再是偶然事件,而是系统性的问题。许多组织的产品路线图很少提及道德设计原则,而用户参与度和盈利能力的KPI却被定期列为优先事项。我们已经形成了一种专业的环境,设计师们非常擅长优化用户行为以实现业务目标,但却很少具备(或被授权)识别和处理这些优化带来的道德后果的能力。当衡量成功的标准是界面如何有效地吸引注意力、数据和资金时,即使是出于好意的设计师也会发现自己成了用户操纵的同谋。产品开发的“三重约束”——速度、范围和成本——很少将道德作为第四个支柱,因此这种循环仍在继续。

这种以指标为导向的执念所带来的后果已不再抽象。亚马逊2023年的Prime会员取消流程要求用户浏览17个屏幕——这被联邦贸易委员会(FTC)后来认为是“旨在阻止用户退出”的数字障碍赛道——这并非个例,而是企业为留住用户不惜一切代价的蓝图。亚马逊内部为该流程起的代号“伊利亚特”颇具启发性:它指的是一段史诗般的旅程,也明确表明摩擦是设计使然。该流程利用了损失厌恶、注意力分散和认知超载等心理因素,动用各种心理杠杆来阻止用户离开,这与亚马逊以无摩擦高效著称的一键结账形成了鲜明对比。

欧洲《数字服务法案》现已将一些不道德的设计选择定义为“非法暗黑模式”,并处以相当高额的罚款。这一举措清晰地揭示了一个令人不安的转折:曾经使用户体验(UX)成为一门受人尊敬的学科的心理学洞见,例如福格行为模型、希克定律或认知负荷理论,如今却常常被用作操纵的工具。DSA的禁令,以及他们最近针对一些主要平台的法律行动,都明显表明操纵性设计已成为一个严重的社会问题。这一切背后的信息相当明确:平台不仅应该对用户的行为负责,还应该对其设计选择如何影响和塑造用户的行为负责。

“道德就是知道你有权做什么和什么是正确的做法之间的区别。”
——波特·斯图尔特

遗憾的是,我们能够侥幸逃脱的行为与真正正确的事情之间的界限并不总是清晰的。在一个往往更注重短期利益而非长期期望的世界里,人们很容易用积极的商业指标来为操纵模式辩护。但即便如此,我们仍然需要不断扪心自问:当我们为指标而设计时,我们是在真正帮助用户,还是仅仅在榨取他们的价值?
忽视用户福祉责任的后果随处可见——它们是一个更广泛问题的明显症状。当公司故意使取消订阅的流程复杂化,当界面设计得让用户参与度远远超出他们的预期,当用户需要输入账单信息才能开始免费试用期——这些都是设计选择的例子,这些选择可能在短期内带来商业成果,但却会导致信任逐渐丧失。这些并非孤立的失误,而是一种更广泛模式的迹象:商业目标始终被置于用户利益之上,这种做法常态化,最终破坏了公司本应依赖的良好关系。

这些模式背后的心理机制众所周知:互惠、稀缺、社会认同和损失厌恶。最初只是一些良性的提醒,例如对用户行为的感谢信息,如今已演变成利用用户社会顺从本能的“确认羞辱”弹窗。受赌场启发的机制,例如可变奖励计划——曾经仅限于老虎机——如今决定了约会应用程序何时显示潜在匹配对象,或电商网站何时显示“库存有限”提醒。所有这些对人们的影响越来越难以忽视:大量研究发现,社交媒体的过度使用或问题性使用与这些平台重度用户的焦虑、抑郁和其他心理困扰发生率较高密切相关。我们已经学会了通过强迫行为来赚钱,而且很多时候,我们要么选择不这样做,要么(更糟的是)选择这样做。

技术挑战我们去维护我们的人类价值观,这意味着我们首先必须弄清楚它们是什么。
— 雪莉·特克尔

这不仅仅是个别设计师的错,而是系统性的问题。产品路线图充斥着专注于注意力、提取和转化的关键绩效指标 (KPI),而道德考量却鲜有提及。大多数组织缺乏评估设计决策道德影响的流程,也很少有设计师被赋予在出现问题时进行反驳的权力。即使设计师确实意识到了问题所在,他们也常常缺乏支持,甚至缺乏足够的语言来表达自己的观点。大多数组织缺乏评估设计决策道德影响的流程,也很少有设计师被赋予在出现问题时进行反驳的权力。即使设计师确实意识到了问题所在,他们也常常缺乏支持,甚至缺乏足够的语言来表达自己的观点。

这个问题最容易被忽视的根源之一就是教育。大多数用户体验训练营和学位课程都侧重于可用性、研究和美学。道德,即使出现,也只是被当作一个旁注——一场简单的讲座或一句“不做伤害”的模糊劝诫。诸如如何应对商业压力、抵制操纵性设计、维护用户尊严等复杂的现实世界困境,却很少得到深入探讨。

这种教育差距的后果是实实在在的。新晋设计师在初入职场时,缺乏能够帮助他们识别作品是否逾越界限的工具。缺乏应对的词汇和自信,他们很快就会发现自己被迫实施“暗箱操作”,或者为了提升参与度而牺牲用户福祉。结果,设计师这个职业常常将合规与道德、商业忠诚与道德责任混为一谈。

与此同时,我们掌握的工具正变得越来越强大,也越来越危险。人工智能如今可以个性化推送,测试数百种变体,并以无情的效率优化参与度。同样的技术也可以用来检测和标记操纵模式,增强透明度,或衡量我们工作的道德影响——但除非组织选择设定这些界限,否则默认设置永远是针对易于衡量的指标进行优化:参与度、点击量和收入。

“真正的问题不在于机器是否会思考,而在于人类是否会思考。”
——BF·斯金纳

人工智能在设计领域的应用是一把双刃剑。一方面,它实现了前所未有的个性化和效率。另一方面,它也能将操控规模扩大到前所未有的程度。人工智能不仅可以识别设计中的弱点,并根据这些弱点定制信息,还能以隐形的方式大规模地进行操控。《欧洲人工智能法案》禁止“潜意识操控技术”,这恰恰表明了人工智能应用相关问题已变得多么紧迫和复杂。
问题在于,仅靠监管无法解决问题。真正的工作必须在行业内部进行。

没有勇气,我们就无法始终如一地践行任何其他美德。我们不可能善良、真诚、仁慈、慷慨或诚实。——
玛雅·安吉罗

那么,实际上需要做些什么才能使道德像任何商业 KPI 一样真实、自然地成为我们日常决策的一部分呢?

也许首先应该从我们思考设计的方式入手,以及随之而来的设计教学方式。设计并非一套工具,而是一种思维方式,其中伦理是不可分割的一部分。
商业关键绩效指标(KPI)永远存在,但它们不能成为我们遵循的唯一信号。我们应该像关注用户完成流程的速度一样,同样关注他们是否感到知情、受到尊重和掌控。我们需要
赋能设计师,让他们畅所欲言,并在他们表达意见时给予他们机构支持。
最后,我们需要认识到,我们工作的真正影响不仅在于用户做了什么,还在于他们最终会成为怎样的人。

“并非所有重要的事情都可以被计算,而并非所有可以被计算的事情都重要。”
——威廉·布鲁斯·卡梅伦

当然,并非所有问题都能用算法、清单或新程序解决。设计并非中立;它塑造习惯、信仰和社会规范。它可以强化权力失衡,也可以促进包容,可以削弱信任,也可以建立信任。随着技术变得越来越普及和具有影响力,风险只会越来越大。如果我们想要构建一个人们信任他们使用的产品以及制造这些产品的人的未来,我们就不能将道德视为事后诸葛亮,而要将其视为衡量我们成功的核心标准。挑战并非技术层面,而是道德层面。关键在于在每个阶段都要有勇气扪心自问:谁受益?谁面临风险?我们正在设计一个什么样的世界?

在用户体验设计中,说服与操纵之间的界限很少清晰,交付商业价值的压力常常将设计师推入道德的灰色地带——有时是故意为之,有时仅仅是因为没有人提出正确的问题。只要指标比意义更重要,只要道德问题被视为可有可无而非必需,这些模式就会不断重复。

幸运的是,这里没有什么是不可避免的。我们有能力挑战常规,在被要求越界时予以反击,并坚持将道德考量融入我们的流程和对成功的定义中。这并非关乎宏大的姿态或英雄事迹;而是要让道德成为其应有的样子:成为工作中正常且预期的一部分,就像可用性或可访问性一样。

如果我们希望自己的领域受到尊重,如果我们希望自己作为专业人士受到尊重,我们就需要开始像对待商业选择一样认真对待道德选择。如果我们期待情况改善,就不能坐等其他因素带来改变。改变始于我们每个人,始于我们选择不回避下一个即将面临的道德困境的那一刻。

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan

 

自适应UI设计解读 | Fathom 企业人工智能平台

杰睿 平面设计

Fathom 是一款面向企业级应用的尖端 AI 平台,核心优势在于自适应能力计算机视觉。它不仅能处理复杂的视觉识别与分析任务,还能根据不同行业场景灵活调整算法与工作流程,从而帮助企业提升自主性与运营效率。

imgi_558_original-cfc8f340944bd01924c634d555e72be6.png

imgi_577_original-0fd0acbe1a444df4948ccac15ee7e154.png

imgi_578_original-3c9ad24be39584ad4da43c3662e7694d.png

imgi_593_original-574886f35c53c61f34116c817245732e.png

original-dee23ad37d652ffadb312fd286efa806.png

该平台具备以下特点:
行业通用性 – 无论是制造、物流、零售还是医疗,Fathom 都能快速定制并部署适配的解决方案。
先进计算机视觉 – 高精度图像识别、目标检测、异常监测等能力,为生产与决策提供可靠数据支撑。
创意到落地 – 提供从构思到市场化的一体化工具链,简化研发和上线流程。
高性能架构 – 优化计算资源利用,确保大规模数据处理的速度与稳定性。
Fathom 的定位不仅是一个工具,更是企业在 AI 转型道路上的战略伙伴,让复杂的人工智能能力变得易用、可扩展、可持续。
 
一、设计语言分析
主题色调与氛围
  主色是深紫 + 黑蓝渐变,营造科技感与未来感。
  视觉重心在中上部,暗背景下的亮色文字和光晕效果强化了“高端、尖端科技”印象。
  渐变色和星空背景暗示了“无限可能”“前沿探索”。
字体与排版
  标题使用大字号无衬线字体,简洁且有张力,强调专业性。
  副标题与正文采用中等字重,行距宽松,提升可读性。
  层级分明:H1 > 功能标题 > 描述文字。
信息结构
  顶部:品牌定位(“The World's Leading Computer Vision Platform”)+ 快速行动按钮(CTA)。
  中部:可信度背书(合作品牌 Logo)。
  下部:功能模块 + 价值点 + 成功案例。
  时间轴形式呈现“从想法到落地”的流程,有助于理解产品生命周期。
图形与图标
  圆形、轨道、节点等几何元素强调“系统化”“科技环绕”概念。
  图标色彩与模块背景形成对比,快速区分不同功能。
  动态化暗示(虽然是静态图,但布局让人感觉到运动轨迹)。

二、可迁移的设计要点
视觉风格迁移
  如果你做企业级 AI 或 SaaS 产品介绍页,可以借鉴这种深色渐变背景 + 光晕 + 宇宙/星轨的氛围,强化科技与未来感。
  在其他行业(如金融、医疗)迁移时,可将主色换为品牌色或更温和的深色系,保留渐变和光效结构。
结构布局迁移
  上部:一句话定位 + CTA(方便立即引导用户操作)。
  中部:信任背书(客户 Logo、数据成就)。
  下部:功能模块化 + 价值点图标化。
  收尾:真实案例或用户评价(提升可信度)。
  这种结构可直接迁移到任何产品着陆页。
动线迁移
  从“愿景 → 信任背书 → 功能亮点 → 解决方案 → 案例”的信息节奏,降低用户流失。
  如果迁移到你的 UI/UX 分享内容,可改为“趋势背景 → 案例亮点 → 应用技巧 → 实际案例 → 互动引导”。
视觉细节迁移

人工智能自动化 | 20+ GenAI UX 模式、示例和实施策略

杰睿 行业趋势

20+ GenAI UX 模式、示例和实施策略

生成式人工智能通过关注基于意图的结果规范,为人类与系统交互提供了一种新的方式。GenAI 带来了新的挑战,因为它的输出是概率性的,需要理解变异性、记忆、错误、幻觉和恶意使用,这就带来了构建原则和设计模式的必要性,正如 IBM 所描述的那样。

此外,任何AI 产品都是一个分层系统,其中 LLM 只是其中一种成分,而内存、编排、工具扩展、UX 和代理用户流才是真正的魔力!

本文是我对 GenAI 设计模式演变的研究和记录,这些模式为产品经理、数据科学家和交互设计师提供了一种通用语言 ,帮助他们打造以人为本、值得信赖且安全的产品。通过应用这些模式,我们可以弥合用户需求、技术能力和产品开发流程之间的差距。

以下是 21 种 GenAI UX 模式

  1. GenAI 或无 GenAI
  2. 将用户需求转化为数据需求
  3. 增强或自动化
  4. 定义自动化水平
  5. 逐步采用人工智能
  6. 利用心智模型
  7. 传达产品限制
  8. 显示思路链(CoT)
  9. 利用多种输出
  10. 提供数据源
  11. 传达模型信心
  12. 为记忆和回忆而设计
  13. 提供上下文输入参数
  14. 为 coPilot、共同编辑或部分自动化而设计
  15. 定义自动化的用户控件
  16. 用户输入错误状态的设计
  17. 针对人工智能系统错误状态的设计
  18. 设计以捕捉用户反馈
  19. 模型评估设计
  20. 人工智能安全护栏设计
  21. 传达数据隐私和控制

1. GenAI 还是非 GenAI

评估 GenAI 是否改善了用户体验或增加了复杂性。通常,基于启发式 (IF/Else) 的解决方案更易于构建和维护。

GenAI 有益的场景

  • 开放式、富有创意且能增强用户体验的任务。
    例如,写作提示、总结笔记、起草回复。
  • 创建或转换复杂的输出(例如,图像、视频、代码)。
    例如,将草图转换为网站代码。
  • 结构化的用户体验无法捕捉用户意图。

应避免使用 GenAI 的情况

  • 结果必须精确、可审计或确定。
    例如,税务表格或法律合同。
  • 用户期望清晰一致的信息。
    例如:开源软件文档

如何使用此模式

  1. 确定客户旅程中的摩擦点
  2. 评估技术可行性:确定人工智能是否能够解决摩擦点。评估规模、数据集可用性、错误风险评估和经济投资回报率。
  3. 验证用户期望:
    -
    通过评估系统是否增强了人类的努力还是完全取代了人类的努力,确定人工智能解决方案是否侵蚀了用户期望,如模式 3“增强与自动化”中所述。-
    确定人工智能解决方案是否侵蚀了模式 6“心智模型”

2. 将用户需求转化为数据需求

这种模式确保 GenAI 开发始于用户意图以及实现该意图所需的数据模型。GenAI
系统的优劣取决于其训练数据。但真正的用户并非以行列的方式表达,他们表达的是目标、挫折和行为。如果团队未能将用户需求转化为结构化的、模型可用的输入,最终的系统或产品可能会优化到错误的结果,从而导致用户流失。

如何使用此模式

  1. 作为 PM、产品设计师和数据科学家的跨职能团队进行协作,并针对值得解决的用户问题进行协调。
  2. 定义用户需求通过使用三角研究:定性(市场报告、调查或问卷)+ 定量(用户访谈、观察性研究)+ 突发(产品评论、社交聆听等)和综合用户洞察 JTBD框架同理心地图将用户的情绪和观点形象化。价值主张画布将用户的收益和痛苦与功能结合起来
  3. 通过 选择合适的数据模型来定义数据需求和文档,进行差距分析,并根据需要迭代优化数据模型。一旦理解了“为什么”就将其转化为模型的“什么” 。你的AI模型需要哪些特征、标签、示例和上下文来学习这种行为?利用结构化协作来找出答案。

3. 增强 vs. 自动化

GenAI 应用中的一个关键决策是完全自动化任务还是增强人类能力。使用此模式可以使技术与用户意图和控制偏好保持一致。

自动化最适合用户倾向于委派的任务,尤其是在繁琐、耗时或不安全的情况下。例如,Intercom FinAI 会自动将冗长的电子邮件线索汇总为内部笔记,从而节省重复性、低价值任务的时间。

增强功能能够提升效率、创造力和控制力,从而增强用户想要持续参与的任务。例如, Abelton 的Magenta Studio支持创造性的控制,方便用户操控和创作新音乐。

如何使用此模式

  1. 为了选择最佳方法,请使用研究综合工具(如同理心地图(可视化用户情绪和观点)和价值主张画布(了解用户的收益和痛苦))评估用户需求和期望
  2. 测试并验证该方法是否会削弱或增强用户体验。

4. 定义自动化水平

在人工智能系统中,自动化指的是将多少控制权委托给人工智能而不是用户。这是一种战略性的用户体验模式,它根据用户的痛点、情境场景和对产品的期望来决定自动化程度。

自动化水平

  1. 无自动化(AI 辅助,用户自主决定)
    AI 系统为用户提供帮助和建议,但所有决定均由用户自行决定。例如,Grammarly会突出显示语法问题,但用户需要自行决定接受或拒绝更正。
  2. 部分自动化/副驾驶/共同编辑(AI 在用户监督下行动)
    AI 发起操作或生成内容,但用户根据需要进行审核或干预。例如,GitHub Copilot会建议开发人员可以接受、修改或忽略的代码。
  3. 完全自动化(AI 独立行动)
    AI 系统无需用户干预即可执行任务,通常基于预定义的规则、工具和触发器。GenAI 中的完全自动化通常被称为代理系统 (Agentic systems)例如,Ema可以自主规划和执行多步骤任务,例如研究竞争对手、生成报告并通过电子邮件发送,无需用户在每个步骤提示或干预。

如何使用此模式

  1. 评估用户需要自动化的痛点及其风险:当相关风险较低且发生故障不会造成严重后果时,自动化任务最为有效。低风险任务(例如发送自动提醒、促销邮件、过滤垃圾邮件或处理常规客户咨询)可以自动化,最大程度地减少负面影响,同时节省时间和资源。高风险任务(例如进行医疗诊断、发送关键业务邮件或执行金融交易)需要仔细监督,因为一旦发生错误,可能会造成重大损失。
  2. 评估和设计特定的自动化级别:根据用户的期望和目标,评估用户痛点是否应该属于——无自动化、部分自动化或完全自动化。
  3. 定义用户控件以实现自动化(参考模式 15)

5. GenAI 的逐步采用

当用户第一次接触基于新技术的产品时,他们常常想知道系统能做什么和不能做什么,它如何工作以及他们应该如何与它交互。

该模式提供了多维策略来帮助用户使用 AI 产品或功能、减少错误、与用户准备情况保持一致,以提供明智且以人为本的用户体验。

如何使用此模式

这种模式是许多其他模式的顶峰

  1. 从一开始就注重传达好处:避免深入探讨技术细节,并强调人工智能如何带来新的价值。
  2. 简化用户引导体验:在询问用户数据共享偏好之前,先让用户体验系统的价值,并优先提供基础 AI 功能的即时访问权限。鼓励用户稍后注册以解锁高级 AI 功能或分享更多详细信息。例如,Adobe FireFly循序渐进地引导用户从基础功能到高级 AI 功能。
  3. 定义自动化水平(参考模式 4) 逐步增加自主性或复杂性。
  4. 通过针对错误进行设计 来提供可解释性和信任(参考模式 16 和 17)。
  5. 传达数据隐私和控制(参考模式 21),以清楚地传达如何收集、存储、处理和保护用户数据。

6. 利用心智模型

心智模型帮助用户预测系统(网页、应用程序或其他类型的产品)的运作方式,从而影响他们与界面的交互方式。当产品与用户现有的心智模型相符时,用户会感觉直观且易于上手。当两者发生冲突时,可能会导致用户沮丧、困惑,甚至放弃。

例如,Github Copilot 建立在开发人员从传统代码自动完成的思维模型之上,从而简化了向 AI 驱动的代码建议的过渡

例如,Adobe Photoshop 建立在使用矩形控件扩展图像的熟悉方法的基础上,通过集成其生成填充功能,智能地填充新创建的空间。

如何使用此模式

通过提问来识别并建立现有的心智模型

  1. 用户旅程是什么以及用户试图做什么?
  2. 哪些心智模型可能已经存在?
  3. 该产品是否打破了任何直观的因果模式?
  4. 你是否打破了现有的心智模型?如果是,请清晰地解释如何以及原因。良好的引导、微文案和视觉提示可以帮助弥合差距。

7. 传达产品限制

这种模式涉及清楚地传达人工智能模型能做什么和不能做什么,包括其知识边界、能力和局限性。

它有助于建立用户信任、设定适当的期望、防止误用,并在模型出现故障或异常行为时减少挫败感。

如何使用此模式

  1. 明确说明模型的局限性:显示过时知识或缺乏实时数据的上下文提示。例如,当问题超出其知识范围时, Claude会说明其知识范围。
  2. 当模型无法提供合适的输出时,提供回退或升级选项。例如,当被问及与购物无关的问题时, Amazon Rufus会说:“它无法访问事实信息,我只能协助解决与购物相关的问题和请求。”
  3. 在产品营销、入职培训、工具提示或回应免责声明中明确限制

8. 显示思路链(CoT)

在人工智能系统中,思路链(CoT) 提示 技术 通过模仿人类更结构化、循序渐进的思维过程,增强了模型解决复杂问题的能力。

CoT 展示是一种用户体验模式,它通过揭示 AI 是如何得出结论的来提高透明度。这可以增强用户信任,提高可解释性,并为用户反馈提供空间,尤其是在高风险或模糊场景下。

例如Perplexity通过显示处理步骤来增强透明度,帮助用户理解答案背后的深思熟虑的过程。

例如Khanmigo是一种人工智能辅导系统,它通过模仿人类推理来逐步指导学生解决问题,以增强理解和学习。

如何使用此模式

  1. 显示“研究”和“推理”等状态 来传达进展,减少用户的不确定性,让等待时间感觉更短。
  2. 使用渐进式披露:从高级摘要开始,并允许用户根据需要扩展细节。
  3. 提供 AI 工具透明度:清晰显示 AI 用于生成建议的外部工具和数据源。
  4. 展现信心和不确定性:表明人工智能信心水平,并在相关时强调不确定性。

9. 利用多种输出

GenAI 凭借其概率特性,能够对同一输入产生不同的响应。这种模式通过并排呈现多个输出来利用可变性。展示多样化的选项有助于用户创造性地探索、比较、改进或做出更符合其意图的决策。例如, Google Gemini提供了多种选项,帮助用户探索、改进并做出更明智的决策。

如何使用此模式

  1. 解释变化的目的:帮助用户理解输出之间的差异是故意的,旨在提供选择。
  2. 启用编辑功能:让用户无缝地对输出进行评分、选择、重新混合或编辑,从而塑造结果并提供反馈。例如, Midjourney 可以帮助用户调整提示,并指导用户使用重新混合功能进行修改和编辑。

10.提供数据源

在 GenAI 应用程序中,清晰地阐明数据源对于透明度、可信度和用户信任至关重要。清晰地表明 AI 的知识来源有助于用户评估响应的可靠性并避免错误信息。

这在医疗保健、金融或法律指导等高风险事实领域尤其重要,因为决策必须基于经过验证的数据。

如何使用此模式

  1. 内联引用可靠来源:将来源显示为脚注、工具提示或可折叠链接。例如,NoteBookLM会在其答案中添加引用,并将每个答案直接链接到用户上传的文档部分。
  2. 清晰披露训练数据范围:对于生成工具(文本、图像、代码),请简单解释模型训练时使用了哪些数据,以及未包含哪些数据。例如,Adobe Firefly披露其生成填充功能是在库存图像、公开授权作品以及版权已过期的公共领域内容上进行训练的。
  3. 提供来源级信心:在有多个来源贡献的情况下,直观地区分更高信心或更权威的来源。

11. 传达模型信心

AI 生成的输出具有概率性,准确度可能存在差异。显示置信度分数可以传达模型对其输出的确定性。这有助于用户评估可靠性并做出更明智的决策。

如何使用此模式

  1. 评估情境和决策风险:显示模型置信度取决于情境及其对用户决策的影响。在医疗保健、金融或法律咨询等高风险场景中,显示置信度分数至关重要。然而,在AI 生成的艺术作品或故事叙述等低风险场景中,显示置信度可能不会带来太多价值,甚至可能带来不必要的困惑。
  2. 选择合适的可视化:如果设计研究表明展示模型置信度有助于决策,那么下一步就是选择合适的可视化方法。百分比、进度条或一些修饰语(“可能”、“不确定”)都能有效地传达置信度。合适的可视化方法取决于应用程序的用例和用户的熟悉程度。例如,Grammarly会使用“可能”之类的修饰语来描述它与用户共同生成的内容。
  3. 在低信心情况下指导用户行动:提供前进的路径,例如提出澄清问题或提供替代选项。

12. 为记忆和回忆而设计

记忆和回忆是一个重要的概念和设计模式,它使人工智能产品能够存储和重用过去交互中的信息,例如用户偏好、反馈、目标或任务历史,以提高连续性和情境感知。

  • 通过记住过去的选择或偏好来增强个性化
  • 通过避免重复输入请求来减轻用户负担,尤其是在多步骤或长格式任务中
  • 支持复杂任务,如项目规划中的纵向工作流程、通过参考或借鉴过去的进展进行学习历程。

用于访问信息的记忆可能是短暂的会话内的短期)持久的跨会话的长期),并且可能包括对话上下文、行为信号或明确的输入。

如何使用此模式

  1. 定义用户上下文并选择记忆类型。
    根据用例选择记忆类型,例如短暂记忆、持久记忆或两者兼有。购物助理可能实时跟踪交互,无需为未来会话保留数据,而个人助理则需要长期记忆来实现个性化。
  2. 在用户交互中智能地使用记忆
    为 LLM 构建基本提示,以便根据上下文回忆和传达信息(例如,“上次你喜欢更轻松的语气。我应该继续吗?”)
  3. 传达透明度并提供控制功能
    清晰地传达正在保存的内容,并允许用户查看、编辑或删除已存储的记忆。使“删除记忆”操作易于访问。例如,ChatGPT 在其平台上提供了广泛的控制功能,可随时查看、更新或删除记忆

13.提供上下文输入参数

情境输入参数通过简化用户交互来提升用户体验,并更快地实现用户目标。通过利用用户特定数据、用户偏好、过往交互,甚至来自其他具有相似偏好的用户的数据,GenAI 系统可以定制输入和功能,以更好地满足用户意图和决策。

如何使用此模式

  1. 利用先前的交互:根据用户先前输入的内容预填充输入。参考 模式 12,记忆与回忆。
  2. 使用自动完成或智能默认设置:在用户输入时,根据个人和全局使用模式提供智能的实时建议。例如,Perplexity会根据您当前的查询线索,提供智能的后续查询建议。
  3. 推荐交互式 UI 小部件:根据系统预测,提供定制的输入小部件,例如提示框、滑块和复选框,以增强用户输入体验。例如,ElevenLabs允许用户通过显示预设或默认值来微调语音生成设置。

14. 为副驾驶/共同编辑/部分自动化而设计

副驾驶是一种增强模式,AI 充当协作助手,在用户掌控全局的同时,提供情境化和数据驱动的洞察。这种设计模式在战略制定、构思、写作、设计或编码等领域至关重要,因为这些领域的结果具有主观性,用户拥有独特的偏好,或者用户的创意输入至关重要。

副驾驶 加快工作流程,增强创造力并减少认知负荷,但人类仍保留创作权和最终决策权

如何使用此模式

  1. 嵌入内联帮助:AI 建议会根据上下文进行呈现,方便用户轻松接受、拒绝或修改。例如,Notion AI 可以帮助您起草、总结和编辑内容,同时您可以掌控最终版本。
  2. 保存用户意图和创意方向:让用户通过目标、语气或示例等输入来引导 AI,同时保持原创性和创意方向。例如,Jasper AI 允许用户设置品牌语调和语气指南,帮助构建 AI 输出,使其更好地匹配用户意图。

15. 设计自动化的用户控件

构建 UI 级机制,让用户根据用户目标、上下文场景或系统故障状态管理或覆盖自动化。

没有系统能够预测所有用户情境。控制赋予用户自主权,即使人工智能出错,也能保持信任。

如何使用此模式

  1. 采用渐进式展现:从最低限度的自动化功能开始,逐渐允许用户选择更复杂或自主的功能。
    例如,Canva Magic Studio一开始会提供简单的 AI 建议,例如文本或图像生成 ,然后逐步展示高级工具,例如 Magic Write、AI 视频场景和品牌语音定制。
  2. 为用户提供自动化控制功能: 提供诸如 开关、滑块或基于规则的设置等UI 控件,让用户选择何时以及如何控制自动化功能。例如,Gmail 允许用户禁用智能撰写功能。
  3. 自动化错误恢复设计:当 AI 出现故障(误报/漏报)时,向用户提供纠正措施。添加手动覆盖、撤消或升级到人工支持的选项。例如,GitHub Copilot 建议内联代码,但当输出关闭时,开发人员可以轻松拒绝、修改或撤消建议。

16. 设计用户输入错误状态

GenAI 系统通常依赖于对人类输入的解读。当用户提供模糊、不完整或错误的信息时,AI 可能会误解其意图或产生低质量的输出。

输入错误通常反映的是用户期望与系统理解之间的不匹配。妥善处理这些问题对于维护信任和确保顺畅的交互至关重要。

如何使用此模式

  1. 优雅地处理拼写错误:当置信度较高(例如,> 80% )时,使用拼写检查或模糊匹配自动纠正常见的输入错误,并巧妙地进行表面更正(“显示结果......”)。
  2. 提出澄清性问题:当输入过于模糊或有多种解释时,提示用户提供缺失的上下文。在对话设计中,当意图明确但实体不明确时,就会发生此类错误。了解更多关于实体和意图的信息。例如,当 ChatGPT 给出“首都是什么?”这样的低语境提示时,它会提出后续问题,而不是猜测。
  3. 支持快速更正:方便用户编辑或覆盖您的解释。例如,ChatGPT 在已提交的提示旁边显示一个编辑按钮,方便用户修改输入。

17. 人工智能系统错误状态的设计

GenAI 输出本质上是概率性的,容易出现幻觉、偏见和上下文错位等错误。

与传统系统不同,GenAI 的错误状态难以预测。针对这些状态进行设计需要透明度、恢复机制和用户自主性。精心设计的错误状态可以帮助用户了解 AI 系统的边界并重新获得控制权。

混淆矩阵有助于分析人工智能系统错误,并通过显示以下计数来深入了解模型的执行情况
-真阳性(正确识别阳性案例)
-假阳性(错误识别阳性案例)
-真阴性(正确识别阴性案例)
-假阴性(未能识别阴性案例)

人工智能错误和故障状态的场景

  1. 系统故障(错误输出)
    由于数据质量差、存在偏见或模型错觉,会出现假阳性或假阴性。例如,花旗银行金融欺诈系统会显示一条消息:“异常交易。您的卡已被冻结。如果是您本人操作的,请验证您的身份。”
  2. 系统限制错误(无输出)
    由于未经训练的用例或知识缺口,会出现真负例。例如,当 ODQA 系统接收到训练数据集之外的用户输入时,会抛出以下错误:“抱歉,我们没有足够的信息。请尝试其他查询!”
  3. 上下文错误(误解输出)由于解释不清或与用户预期相冲突而导致用户困惑的
    真阳性结果属于上下文错误。例如,当用户从新设备登录时,被锁定。AI 会回复:“您的登录尝试已被标记为可疑活动。”

如何使用此模式

  1. 传达各种场景的人工智能错误:使用诸如
    “这可能不准确”、“这看起来像......”或表面置信度水平之类的短语来帮助校准信任。
  2. 使用模式传达低置信度输出的模型置信度。
  3. 提供错误恢复:如果发生系统故障或上下文错误,请提供清晰的路径来覆盖、重试或升级问题。
    例如,使用“尝试其他查询”、“让我改进一下”或“联系客服”等方式。
  4. 启用用户反馈:轻松报告幻觉或错误输出。了解更多关于模式 19 的信息。设计以捕获用户反馈

18. 设计时要捕捉用户反馈

现实世界的一致性需要直接的用户反馈来改进模型,从而改进产品。当人们与人工智能系统互动时,他们的行为会塑造并影响他们未来收到的输出。从而形成一个持续的反馈循环,系统和用户的行为都会随着时间的推移而不断调整。例如,ChatGPT使用“反应”按钮和“评论”框来收集用户反馈。

如何使用此模式

  1. 考虑隐性反馈:捕捉用户操作,例如跳过、忽略、编辑或互动频率。这些被动信号提供了有价值的行为线索,有助于调整推荐内容或发现用户不感兴趣的行为模式。
  2. 寻求明确的反馈:通过点赞/踩、NPS 评分小部件或用户操作后的快速调查问卷,收集用户的直接反馈。利用这些反馈来改进模型行为和产品契合度。
  3. 告知反馈的用途:让用户了解他们的反馈将如何影响未来的体验。这可以增强信任,并鼓励用户持续做出贡献。

19. 模型评估设计

强大的 GenAI 模型需要在训练期间以及部署后持续进行评估。评估旨在确保模型按预期运行,识别错误和幻觉,并与用户目标保持一致,尤其是在高风险领域。

如何使用此模式

三种关键的评估方法可以改进机器学习系统。

  1. 基于法学硕士 (LLM) 的评估(LLM-as-a-judge)一个独立的语言模型充当自动评判者。它可以对回复进行评分,解释其推理过程,并分配诸如有用/有害或正确/不正确等标签。
    例如,Amazon Bedrock 使用 LLM-as-a-Judge 方法来评估 AI 模型的输出。一个独立的可信 LLM(例如 Claude 3 或 Amazon Titan)会根据有用性、准确性、相关性和安全性自动审核和评分回复。例如,比较两个 AI 生成的针对同一提示的回复,评判模型会选择更优的那个。这种自动化方法可将评估成本降低高达 98%,并加快模型选择速度,而无需依赖缓慢且昂贵的人工审核。
  2. 启用基于代码的评估:对于结构化任务,使用测试套件或已知输出来验证模型性能,特别是对于数据处理、生成或检索。
  3. 捕捉人工评估:集成实时 UI 机制,方便用户将输出标记为有用、有害、不正确或不清楚。更多详情,请参阅模式 19。捕捉用户反馈的设计
  4. LLM 作为评判者和人工评估的混合方法将准确率大幅提高到 99%

20. AI护栏设计

人工智能护栏的设计意味着在GenAI模型中建立实践和原则,以最大限度地减少伤害、错误信息、不良行为和偏见。至关重要的是

  • 保护用户和儿童免受有害语言、虚构事实、偏见或虚假信息的侵害。
  • 建立信任和采用:当用户知道系统避免仇恨言论和错误信息时,他们会感到更安全并愿意经常使用它。
  • 道德合规:欧盟人工智能法案等新规要求人工智能设计必须安全。团队必须符合这些标准,才能保持合法合规并承担社会责任。

如何使用此模式

  1. 分析并引导用户输入:如果提示可能导致不安全或敏感内容,则引导用户进行更安全的交互。例如Miko 机器人遇到脏话时,它会回答“我不允许使用此类语言”。
  2. 过滤输出并审核内容:使用实时审核功能检测并过滤可能有害的 AI 输出,在显示给用户之前屏蔽或重新构建它们。例如显示一条注释:“此回复已根据我们的安全准则进行了修改。”
  3. 使用主动警告:当用户接触敏感或高风险信息时,巧妙地通知他们。例如“这只是信息建议,不能替代医疗指导。”
  4. 创建强大的用户反馈机制:让用户轻松举报不安全、带有偏见或虚假信息的输出,从而通过主动学习循环逐步改进人工智能。例如,Instagram 提供了应用内选项,方便用户举报伤害、偏见或虚假信息。
  5. 交叉验证关键信息:对于高风险领域(例如医疗保健、法律、金融),使用可信数据库备份 AI 生成的输出,以捕捉幻觉。参考模式 10, 提供数据源。

21. 传达数据隐私和控制

这种模式确保 GenAI 应用程序清楚地传达如何收集、存储、处理和保护用户数据。

GenAI 系统通常依赖于敏感数据、情境数据或行为数据。处理不当可能会导致用户不信任、法律风险或意外滥用。清晰地传达隐私保护措施有助于用户感到安全、受到尊重并掌控全局。例如,Slack AI 明确表示,客户数据仍归客户所有并控制,不会用于训练 Slack 或任何第三方 AI 模型。

如何使用此模式

  1. 显示透明度:当 GenAI 功能访问用户数据时,显示访问内容和原因的解释。
  2. 设计选择加入和选择退出流程:允许用户轻松切换数据共享偏好设置。
  3. 启用数据审查和删除:允许用户查看、下载或删除他们的数据历史记录,从而让他们能够持续控制。

兰亭妙微(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档