设计

从UX到CX:理清体验设计的层次与边界,提升设计实践

从UX到CX:理清体验设计的层次与边界,提升设计实践

用户体验(UX)、客户体验(CX)等术语常被混用,但它们代表不同层次和范围的设计实践。本文基于NN/g的权威资料,系统梳理了从单一交互到终身关系的体验设计层次,并澄清了信息架构、视觉设计等核心领域的内涵与边界,旨在帮助设计师明确工作范畴,构建更全面、有效的设计策略。

你将学到
  • 理解用户体验(UX)与客户体验(CX)在范围上的核心差异
  • 掌握从交互层、旅程层到关系层三层体验设计的关键挑战与方法
  • 区分信息架构(IA)与网站地图(Sitemap)的本质与关系
  • 应用视觉设计五大原则提升界面的可用性与吸引力

背景:为何我们需要理清这些术语?

在数字设计领域,诸如 UX(用户体 验)、UI(用户界面)、CX(客户体验)、视觉设计等术语被广泛使用,但它们常常被混淆或互换使用。这种模糊性不仅影响团队内部沟通,也可能导致设计策略的偏差。

根据 Nielsen Norman Group(NN/g)的调查,仅与UX相关的职位头衔就多达134种,且不同组织中同一头衔可能涵盖完全不同的工作内容。术语的混乱反映了实践领域的交叉与快速演变,但清晰的定义是有效协作与专业发展的基石。

本文旨在综合NN/g的多份核心资料,为设计师提供一个清晰的框架,理解不同设计领域的核心工作、它们之间的关系,以及如何将这些理解应用到实际项目中,从而设计出更连贯、更有效的体验。

体验设计相关领域概览
用户体验 (UX)涵盖用户与公司、服务及产品互动的所有方面。客户体验 (CX)描述用户随时间推移与组织互动的总和(关系层体验)。信息架构 (IA)决定内容如何组织、关联并在导航UI中呈现的实践。视觉设计将平面设计原则应用于交互产品,处理外观、布局与美感。对话设计设计用户与聊天机器人、语音助手等自然语言系统之间的交流。设计运营 (DesignOps)优化人员、流程与技能,以扩大设计价值与影响力的实践。用户体验 (UX)涵盖用户与公司、服务及产品互动的所有方面。客户体验 (CX)描述用户随时间推移与组织互动的总和(关系层体验)。信息架构 (IA)决定内容如何组织、关联并在导航UI中呈现的实践。视觉设计将平面设计原则应用于交互产品,处理外观、布局与美感。对话设计设计用户与聊天机器人、语音助手等自然语言系统之间的交流。设计运营 (DesignOps)优化人员、流程与技能,以扩大设计价值与影响力的实践。
基于NN/g资料整理的部分关键设计领域及其核心焦点 · NicePSD 原创示意图
注意术语“用户体验”(UX)本身就有多重含义:它既可以指代“用户体验设计”这个专业领域,也可以指用户与某个特定产品互动时的具体体验。理解语境至关重要。

核心内容:体验设计的三个层次

关系层 (Relationship Level / CX)

这是最广泛的用户体验范围,即客户体验(CX)。关系层关注个人与组织在整个生命周期中的体验,以及其作为该组织客户的累积印象。

关系层体验评估的不是单次互动或旅程,而是个人与公司之间所有互动和旅程的整体。 例如,研究、购买、使用产品及获得该产品支持的整个组合体验;或者订阅一个SaaS平台、使用它、解决问题、接收新闻通讯直至账户终止的全部过程。

良好的关系层体验需要良好的交互层和旅程层体验作为基础,但整体大于部分之和。仅仅拥有好的单点体验并不足以构成好的终身关系。

  • 跨渠道和交互传递一致的信息
  • 创建无缝的跨渠道过渡
  • 在交互间提供统一的外观、感觉和语调
  • 后端技术集成,确保客户在不同渠道间移动时体验质量一致
体验设计的三个层次
1交互层:单次任务与互动2旅程层:跨渠道完成一个目标3关系层:终身关系的整体印象1交互层:单次任务与互动2旅程层:跨渠道完成一个目标3关系层:终身关系的整体印象
从微观到宏观理解用户体验的递进范围 · NicePSD 原创示意图
常见坑当单个体验在孤立环境中被设计和评估时,它们可能通过验收标准。但将独立设计的交互组合成一个真实的用户旅程时,问题常常开始出现,影响更广泛的用户体验。例如,确认邮件中的信息若与理赔流程的信息矛盾,旅程就会断裂。

核心内容:信息架构远不止网站地图

网站地图是网站内容组织的可视化表示,通常是一个由节点(代表页面或内容)组成的层级图,用箭头或线条展示网页间的关系。其主要目的是展示IA的流程,通常用作内部规划文档或参考工具。

IA是基础,网站地图是其后产生的具象化产物。 IA代表了内容的概念性组织,是定义内容关系、理解内容应如何分组以及这种分组如何影响网站导航的复杂过程的结果。而网站地图是一个有形的视觉图表,可用于与利益相关者沟通内容组织。

网站地图并不包含IA工作的所有细节。如果网站地图像IA一样全面和详细,利益相关者会被信息淹没。网站地图被有意设计为只包含进行高效对话和集体决策所需的信息。

IA相关活动可能的交付物示例
识别和分类网站上的所有数字内容内容清单或审计报告
评估当前内容的有用性记录内容去留或更新计划的表格
构建描述和分类内容的受控词汇表具有层级结构的分类体系
进行IA研究(如卡片分类、树测试)研究结果报告(文档、演示文稿)
规划网站内容的组织和层级网站地图(Sitemap)
信息架构 (IA) vs. 网站地图 (Sitemap)
信息架构 (IA)是决定内容组织、关系和导航的实践包含命名体系(导航标签等)包含导航UI组件(搜索框、面包屑等)是概念性的、抽象的基础网站地图 (Sitemap)是内容层级结构的可视化图表是IA的一部分,用于展示内容流不包含具体的命名或UI细节是具体的、有形的交付物VS信息架构 (IA)是决定内容组织、关系和导航的实践包含命名体系(导航标签等)包含导航UI组件(搜索框、面包屑等)是概念性的、抽象的基础网站地图 (Sitemap)是内容层级结构的可视化图表是IA的一部分,用于展示内容流不包含具体的命名或UI细节是具体的、有形的交付物
两者关键差异对比 · NicePSD 原创示意图

核心内容:视觉设计的五大原则

对比原则 (Contrast)

将视觉上不同的元素并置,以传达这些元素是不同的(例如,属于不同类别,具有不同功能)。对比通常通过颜色、大小等差异来实现。

在UX中,“对比”常让人联想到文本与其背景的对比。有时设计师会刻意降低文本对比度以弱化次要文本,但这种方法有风险——降低文本对比度也会降低可读性,并可能使内容无法访问。应使用颜色对比度检查器来确保内容对所有目标用户都可读。

格式塔原则 (Gestalt Principles)

这是一组解释人类如何简化和组织由许多元素组成的复杂图像的原则。它们揭示了我们将部分下意识地排列成一个有组织的系统,从而形成一个整体,而不是将其解释为一系列 disparate 元素的倾向。

其中包括相似性、连续性、闭合、接近性、共同区域、图/底关系以及对称和秩序等原则。对于UX而言,接近性(Proximity)尤其重要——它指的是视觉上更靠近的物品被视为同一组的一部分。

  • 不对称:动态且吸引人,创造能量感和运动感。
  • 对称:安静且静态。
  • 径向:总是将视线引向构图的中心。
视觉层次原则:字体大小应用
字体大小最大用于最重要的标题或核心行动号召,建立首要焦点中等用于次级标题或重要正文,支持主要信息较小用于辅助说明、标注或次要信息,确保内容完整但不喧宾夺主字体大小最大用于最重要的标题或核心行动号召,建立首要焦点中等用于次级标题或重要正文,支持主要信息较小用于辅助说明、标注或次要信息,确保内容完整但不喧宾夺主
使用2-3种字体大小建立页面内的信息层次 · NicePSD 原创示意图
小技巧视觉设计原则不仅能提升美观度。例如,遵循比例和视觉层次原则能使界面更易于解析;良好的平衡和对比能提升可读性和可访问性;利用格式塔原则(如接近性)能直观地传达信息分组。

不同观点与适用边界

资料显示,对于UX和CX的定义和使用存在不同观点。一种观点认为,“用户体验”(UX)最初旨在描述用户与组织互动的总和。但由于它是在计算机为主要数字交互形式的时代提出的,一些人开始赋予它有限的解释,将其与单次互动相关联。

为了摆脱这种局限的视角,一些团队开始使用“客户体验”(CX)这个新术语来描述用户随时间推移与组织互动的总和。NN/g指出,无论你使用较新的术语“客户体验”还是偏好较旧的“用户体验”,重要的是记住:存在多个层次的体验,每一个对于向用户提供良好体验都同等重要。

关于哪个层次“更重要”,资料也给出了平衡的观点:关系层体验并不比单次交互的体验更好或更重要。宏大的计划可能因为几句写得糟糕的UI文案而失败。设计纵向体验很重要,但设计其组成部分同样重要。如果人们看不懂你的网站,他们首先就不会成为客户。

此外,一些领域虽然常与UX混淆,但并非传统UX的一部分。例如,市场研究(Market Research)收集关于市场、客户、竞争对手的信息以指导商业决策(如细分、定价),而UX研究则研究用户的需求、行为及其与产品或服务的交互,以指导设计决策。两者使用许多相同的研究方法,但目标不同。

注意术语“体验设计”(Experience Design, XD)有时被用作涵盖UX、CX、服务设计和产品设计的 umbrella term(总称),它们都关注人、结构化问题解决、迭代以及用户研究和旅程地图等方法。在实践中,“体验设计师”常常是“用户体验设计师”的替代职位头衔。

对设计师的实际建议

基于以上分析,设计师可以采取以下具体行动,提升设计实践的清晰度和有效性:

1. 明确沟通定义:在团队内部,就UX、CX、IA等关键术语的范围和含义达成一致。避免因术语混淆导致的设计盲区或重复劳动。可以创建团队内部的术语表或参考本文的框架进行讨论。

2. 采用多层次视角:在设计时,有意识地从三个层次思考:我的设计在单次交互中是否有效(交互层)?它如何融入用户完成目标的端到端流程(旅程层)?它如何影响用户对品牌的长期看法和关系(关系层)?即使你的主要职责在交互层,了解上游和下游的影响也能做出更明智的决策。

3. 区分IA与交付物:进行信息架构工作时,不要只产出网站地图就认为任务完成。要深入进行内容审计、分类研究(如卡片分类)、命名规范制定等工作。理解网站地图只是沟通IA决策的一种工具,而非IA本身。

4. 系统应用视觉原则:在设计界面时,有意识地运用比例、层次、平衡、对比和格式塔原则。例如,在进行设计评审时,可以逐一检查这些原则的应用情况,这能使设计决策更有依据,并提升最终产品的视觉质量和可用性。

5. 拓展相邻领域知识:了解与你工作相邻的领域,如内容设计(决定提供什么信息及如何提供)、对话设计(设计自然语言交互)、设计运营(优化设计团队效能)等。这有助于你更好地协作,并规划个人职业发展路径。

设计评审检查清单(部分)
视觉层次是否清晰?用户能否快速识别最重要的元素?视觉设计原则本次交互的设计,是否考虑了用户在旅程前一步和后一步的上下文?旅程层视角导航标签(命名)是否准确反映了内容组织(IA)?信息架构我们的设计决策是优化了单点,还是损害了整体关系体验?关系层视角视觉层次是否清晰?用户能否快速识别最重要的元素?…视觉设计原则本次交互的设计,是否考虑了用户在旅程前一步和后一步的上下文…旅程层视角导航标签(命名)是否准确反映了内容组织(IA)?…信息架构我们的设计决策是优化了单点,还是损害了整体关系体验?…关系层视角
基于本文概念,可用于自我检查或团队评审的启发式问题 · NicePSD 原创示意图

总结

用户体验设计是一个丰富且不断演进的领域,其相关术语的复杂性反映了实践的深度和广度。核心在于理解体验发生在从微观交互到宏观关系的连续谱系上,不同设计学科关注这个谱系的不同部分。

通过厘清UX与CX的范围差异,我们认识到设计不仅关乎完美的单点交互,也关乎连贯的旅程和持久的客户关系。通过区分信息架构与其交付物(如网站地图),我们能进行更扎实的内容与导航基础建设。通过掌握视觉设计原则,我们能创造出既美观又高度可用的界面。

最终,对这些概念和层次的清晰把握,能够帮助设计师更精准地定位自己的工作,更有效地与团队协作,并设计出在每一个层面都经得起推敲的卓越体验。无论头衔如何变化,对“体验”多层次本质的深刻理解,是设计师核心价值的体现。

要点速览

  • 用户体验(UX)包含交互、旅程、关系三个层次,客户体验(CX)通常指最宏观的关系层体验。
  • 信息架构(IA)是组织内容的实践与系统,网站地图(Sitemap)仅是可视化IA结构的一种交付物。
  • 视觉设计五大原则(比例、层次、平衡、对比、格式塔)能系统性提升界面的美感与可用性。
  • 设计时应避免“孤岛思维”,需考虑单点设计对用户旅程和长期品牌关系的整体影响。
  • 团队内部对关键术语达成共识,是确保设计策略一致性和协作效率的基础。
  • 了解内容设计、对话设计、设计运营等相邻领域,有助于拓宽设计视野与职业路径。

参考来源

  1. UX Disciplines: Glossary Nielsen Norman Group · Raluca Budiu
  2. User Experience vs. Customer Experience: What’s the difference? Nielsen Norman Group
  3. The Definition of User Experience (UX) Nielsen Norman Group
  4. Information Architecture vs. Sitemaps Nielsen Norman Group
  5. 5 Principles of Visual Design in UX Nielsen Norman Group

封面为 NicePSD 原创设计,未使用原文图片;封面中出现的产品名称和标志归各自权利人所有,仅用于标明文中讨论的工具,不代表合作或认可。原创声明:本文由 NicePSD 基于海外公开资料整理、消化并重写,观点归原作者所有,详细内容请阅读参考原文。转载请注明出处。

更多前沿文章