首页

兰亭妙微案例分享 | 国土空间大数据可视化界面设计

杰睿 大数据可视化设计文章及欣赏

数慧时空(全称:北京数慧时空信息技术有限公司)是以空间信息技术为核心、国内领先的国土资源行业解决方案提供商,具有业务咨询、自主软件研发、数据加工和信息服务的全业务综合服务能力,是国土资源部最重要的信息化合作单位之一。数慧时空基于多年的研发理论与实战经验,蓝蓝设计基于多年的gis地理信息/大数据可视化界面设计实战与理论,强强联合。
融合西方先进的系统设计方法与中国互联网的快速迭代方法,形成了独有的系统性与敏捷性兼具的工作方法。国土一张图软件项目是数慧时空公司从2012年开始研发的重点产品,此次在国土资源部展会上以大屏的形式展示给国家各部委领导,界面设计及研发实力获得一致好评。

深刻理解国土局需求

数慧时空公司从创立公司开始,就一直在国土资源领域做产品,公司所有的产品都是转绕着国土资源开展的,可以说在这个行业中的资深专家了,公司近年来发展的越来越好,频频接到大的单子,对各身各个产品的要求也越来越高,所以,第一次把这么重要的展览会上向各级重要领导演示的产品交给了外部的设计公司。这个项目完毕之后,基于客户的客户的认可和彼此的欣赏,又继续和蓝蓝设计签下三个项目的整体设计合作协议。
在和数慧时空研发团队的配合中,他们给我们印象最深的是通情达理,积极的推进项目,充份的理解和倾听。开始的时候,需求会不断的修改或推翻或补充,会不知道客户想要什么样的风格,以什么为美,在即有布局的原型和元素的基础上如何创新,换一种完全不同的方式去展现有的内容。工作十天左右以后,视觉工作有了新想法,推倒重来也不会怕麻烦。

快速的设计迭代 现场配合

为了共同的目标--让软件产品更卓越,在展会上赢得充份关注,过程中的需求变更、研发、设计难度工作量增加,都不是问题。前一个月完成整体设计,后二个月,我们的前端工程师基本上每天都在现场,实现前端制作的代码实现和程序工程师的对接,互通有无,互相学习,谁会的谁就做,怎样快捷 怎么来,不分彼此,晚上一起加班到十一二点,周未继续。双方工作态度和积极性都极好。最终平等的对话、充份的理解和倾听,快速的设计迭代和现场配合是项目成功的关健。
 
 

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

杰睿 设计资源

当美好的愿望遭遇现实

按 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 分享内容,可改为“趋势背景 → 案例亮点 → 应用技巧 → 实际案例 → 互动引导”。
视觉细节迁移

日历

链接

个人资料

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

存档