欢迎光临
我们一直在努力
广告
广告
广告
广告
广告
广告
广告
广告
广告
广告

云服务器界面设计中的认知负荷:简化复杂性,增强用户理解 (云服务器界面图片)

引言

随着云服务器技术的普及,越来越多的组织和个人使用云服务器来部署和管理应用程序。云服务器界面设计对于用户有效使用云服务器至关重要。复杂且难以理解的界面可能会给用户带来认知负荷,从而阻碍他们的理解和使用。

什么是认知负荷

认知负荷是指在执行一项任务时对工作记忆资源的需求。认知负荷过高会导致信息处理效率下降、错误率上升和用户满意度降低。

云服务器界面设计中的认知负荷

云服务器界面通常包含大量的复杂信息和丰富的功能。如果不加考虑地设计,这些界面可能会给用户带来极高的认知负荷。常见的认知负荷来源包括:

信息丰富:

云服务器界面通常包含大量的信息,包括输入,提供即时反馈。提供错误消息和警告,帮助用户识别和解决问题。允许用户自定义界面,以满足他们的特定需求。

案例研究

亚马逊网络服务(AWS)的云服务器控制台是一个简化复杂性增强用户理解的良好示例。控制台使用清晰的信息架构,将信息分组到逻辑类别中。界面布局合理,易于导航,使用标签和导航栏。控制台使用颜色、图标和图表来可视化信息,并提供教程和提示。控制台提供即时反馈,并允许用户自定义界面以满足他们的需求。

结论

云服务器界面设计中的认知负荷是影响用户理解和使用的一个重要因素。通过简化复杂性增强用户理解,设计师可以创建高效、易用的云服务器界面。通过遵循本文概述的设计原则,可以创建满足用户需求并最大限度地降低认知负荷的界面。


《网页设计综合指南》:网页设计看这篇文章就够了

设计师和开发人员在构建网站时,需要考虑很多事情,从视觉外观到功能设计。

为了简化这个过程,我们准备了这个指南。

限于篇幅限制,将这一指南分为三部分,此为第二部分内容。

本文主要内容为:二、设计页面2.1 内容策略2.2 页面结构2.3 视觉层次2.4 滚动操作2.5 内容加载2.6 按钮2.7 图像化2.8 视频2.9 行为响应按钮2.10 网页表单2.11 交互动画二、设计页面

2.1 内容策略

内容策略最重要的一点就是聚焦在页面目标上。

理解页面的目标,并根据目标安排内容。

下面是一些提高用户对内容理解的实用技巧:

防止信息超载。信息超载是一个严重的问题。用户觉得有太多信息需消化,从而无法下决定或采取行动。有一些简单的方法能最小化信息超载。一个常用的方法就是分块——将内容分成几个模块,帮助用户更好的理解和处理。结账单就是最好的例子。每次最多显示五到七个输入字段,将结帐单拆分到多个页面,必要时才逐步公开字段。

(Image credit: Witteia)

避免行话和行业术语。页面上出现的每个未知术语或短语都会增加用户的认知负荷。一个安全的方式就是为所有读者编辑内容,并选择所有用户都清楚易懂的词。最大限度地减少长内容。根据信息过载的观点,如果网站不是以信息消费为主,尽量避免长文本块。 例如,如果您需要提供有关服务或产品的详细信息,请尝试逐步展开详细信息。 将文本块写的短一些,更方便理解。根据罗伯特·盖宁(Robert Gunning)的“How to Take the Fog Out of Business Writing”这本书,为了舒适的阅读,大多数的句子应该是20个字以内。

(Image credit: The Daily Rind)

避免所有字母采用大写。全部大写的文本(也就是所有字母都是大写的文本)对于字符量较少的文本是可以的,比如缩略词和图标;但是,请避免在字符量比较大的地方使用(例如段落,表格标签,错误,通知)。正如Miles Tinker在“Legibility of Print”一书中提到的,全部大写会降低阅读速度。另外,大多数读者会觉得全部大写的文本不能快速清晰的理解。

全部采用大写,用户比较难以理解。

2.2 页面结构

一个结构合理的页面清楚地显示了每个用户界面元素位于布局中的位置。虽然没有一个适合所有页面的规则,但是有一些指导性原则可以帮助你创建一个坚固的结构:

使结构可预测。使您的设计符合用户期望。可以参考同类网站来找出在页面上需要哪些元素以及位置。使用目标用户熟悉的模式。使用布局网格。布局网格将页面划分为几块主要区域,并根据大小和位置定义区域之间的关系。在网格的帮助下,能更轻松地将不同部分组合在一起,形成一个有凝聚力的页面。

网格和布局是设计的一部分,且能适应不同屏幕尺寸的设计场景。

Adobe XD的布局网格使设计人员能够针对不同的屏幕尺寸实现一致设计及管理网格中元素之间的比例。

使用低保真线框模拟,避免界面杂乱不清晰。混乱会增加理解的难度——每添加一个按钮,图像或文本都会使页面更加复杂。在用真实元素构建页面之前,先创建一个线框图,分析它,然后去掉那些不是绝对必要的东西。

Adobe XD中创建的低保真线框图(Image credit: Tim Hykes)

2.3 视觉层次

人们大多数情况是快速浏览网页,而不是阅读所有内容。

因此,如果访客想要查找内容或完成任务,他们将快速浏览网页、找到需要的地方。

作为一名设计师,你应该通过设计良好的视觉层次来帮助他们。

视觉层次是指以重要性(即应该首先哪些、再哪些等等)呈现元素。

一个适当的视觉层次结构可以让用户更快速地浏览页面。

使用自然的浏览模式。 作为设计师,我们可以控制人们浏览页面的时,的位置。为了给访问者的眼睛设定合适的浏览路径,我们可以使用两种模式:F形模式和Z形图案。对于重文本的页面(如文章和搜索结果),F模式更好,而Z模式适用于不以文字为中心的页面。

CNN采用的F形模式

Basecamp采用的Z形模式

优先考虑重要元素。要让页面标题,登录表单,导航选项和其他重要内容成为视觉焦点,以便游客立即看到它们。

“Learn More About Brains” 按钮就是视觉焦点。

创建模型来阐明视觉层次结构。当拥有真实数据后,设计原型能够看到真实页面。在原型中重新排列元素要比技术人员开发网页时更方便,如此来避免开发过程中再修改。

使用Adobe XD创建的原型。(Image credit: Coursetro)

2.4 滚动操作

网页设计师中流传着一个谎言——用户不会使用滚动。重申:今天,每一个人都在使用滚动!

用户进行滚动操作时,提升用户体验的一些提示:

鼓励用户滚动。 尽管页面加载后人们通常会开始滚动。但页面顶部的内容仍然非常重要。顶部的内容给观众带来了第一印象和期待。只有在内容有吸引力的时候,用户才会进行滚动。因此,把你最引人注目的内容放在页面顶部:提供一个优秀的介绍。 一个优秀的介绍为内容铺设了背景,并回答了用户的问题:“这个网页是关于什么的?使用有吸引力的图像。 用户会密切包含相关信息的图像。坚持导航。当您创建冗长的页面时,请记住用户仍然需要方向感(当前位置)和导航(其他可能的路径)。长页面可能会出现导航问题;如果顶部导航栏在用户向下滚动时不可见,则当他们在页面底部时,他们将不得不一直向上滚动。最简单的解决方案是悬浮菜单——显示当前位置,并一直悬浮在页面中。

滚动后的导航 (Image: Zenman)

加载新内容时提供视觉反馈。 这对于动态加载内容的网页尤为重要(如新闻)。由于滚动过程中的内容加载是快速的(基本都在2到10秒),你可以使用循环动画来表示系统正在工作。

加载动画(如Tumblr的加载指示器)告诉用户正在加载更多的内容。

不要劫持滚动(即不要将滚动操作限定死)。劫持滚动是最恼人的事情之一,因为它将控制权从用户手中带走,并使滚动行为完全不可预知。 当你设计一个网站,应该让用户控制他们的浏览行为。

Tumbler登录页面劫持了滚动操作。

滚动的页面时固定的,而不是自由的。

2.5 内容加载

内容加载值得进一步强调。

即时响应是最好的,但有时候你的网站需要更多的时间向访问者传递内容。

一个糟糕的网络连接可能导致一个缓慢的反应,或者一个操作可能需要更长的时间才能完成。

但是不管原因是什么,你的网站都应该快速加载。

确保常规加载不需要很长时间。网民的注意力和耐心是非常低的。根据Nielsen Norman Group research,用户保持注意力的极限是10秒。当访问者不得不等待一个网站加载,如果网站加载速度不够快,他们会感到沮丧并可能离开。如果加载时间过长,即使设计了最漂亮的加载指示,用户仍然会离开。加载过程中使用Skeleton Screens。许多网站使用进度指示器显示数据正在加载。虽然进度指标背后的意图是好的(提供视觉反馈),但结果可能是负面的。正如Luke Wroblewski所述,“按照定义,进度指标是对有人需要等待的响应。这就像看着时钟滴答下来 – 当你这样做,时间似乎变慢。”有一个很好的替代进展指标:Skeleton Screens。这些容器本质上是一个暂时空白的页面版本,信息逐渐加载到容器中。设计师可以使用Skeleton Screens将用户的注意力集中在实际进展上,并为即将到来的事物预测。这意味着事情正在立即发生,因为信息在屏幕上逐渐显示,人们看到网站在等待的时候正在采取行动。

当内容被加载时,Facebook使用Skeleton Screens来填充UI。

2.6 按钮

按钮对于创建流畅的交互流程至关重要。 这有一些地方值得:

确保可点击的元素看起来像可点击的。使用按钮和其他交互元素,考虑如何传递可用性信息。用户是如何将元素理解为一个按钮?表单应该遵循以下功能:元素的表现形式要传递使用方式。看起来像链接或按钮但不可点击的可视元素(如带有下划线的单词不是链接或具有矩形背景但不是按钮的元素)会让用户懵逼。

左上角的橙色框是按钮吗? 不,但形状和标签文本使其看起来像一个按钮。

标签按钮要符合用户的期望。可操作的界面元素上的文本标签应该与实际作用相关联。如果用户明白按钮的作用,用户使用起来会更舒适。像下面例子中的“提交”的文本标签(Awesome!),这样的模糊标签不能让用户快速明白按钮的作用。

不要让用户对按钮的作用困惑。(Image credit: UX Matters)

遵循一致的按钮规范。无论是否有意识,用户都会记住网站细节。浏览网站时,他们会将特定形状与按钮功能联系起来。因此,一致性不仅有利于设计的美观,而且增强了用户的熟悉感。下面的图片完美地说明了这一点。 在应用程序的一部分(如系统工具栏)中使用三种不同的形状不仅令人困惑,而且糟糕。

保持一致。

2.7 图像化

一张图片胜过千言万语。

人类是视觉生物,几乎能立即处理完视觉信息;我们所感知并被传达到大脑的90%信息是可视化的。

图像是捕捉用户注意力并区分产品的有效方式。

与一段精心设计的文本相比,图像更能被浏览者接收。

此外,图像能跨语言障碍。

以下原则,可以帮助您将图像应用到网页中:

确保图像是相关的。设计中最大的危险之一是图像传达了错误信息。选择最符合您的产品目标的图像,并确保它们与上下文相关。

与主题无关的图像会使用户困惑。

避免通用的人物照。在设计中使用人脸是吸引用户的有效方式。看到别人的脸能让观众觉得与他们联系在一起,而不仅仅是在销售产品。然而,许多企业网站使用通用的照片来建立信任感是非常糟糕的。可用性测试表明,这样的照片不会增加设计的价值,更是经常损害用户体验。

不真实的图像给用户带来一种虚伪的感觉。

使用高质量、不失焦的资源。网站使用资源的质量会对用户印象和对服务的期望产生巨大的影响。此外,确保图像大小适合在各平台显示。图像不应该出现像素化,因此要测试各种比例和分辨率大小。要以原始高宽比显示图像。

同尺寸不同质量的照片 (Image credit: Adobe)

2.8 视频

随着网速的提高,视频正变得越来越流行,特别是它们延长了用户在网站的时间。

今天,视频无处不在。

我们在台式机,平板电脑和手机上观看视频。

当有效地使用视频时,能非常有效的吸引用户 – 它传递更多的情感,真正给人一种产品或服务的感觉。

将音频设置为默认关闭。当用户到达一个页面,不会希望它发出任何声音。大多数用户不会使用耳机,这种情况下,他们需要快速关闭声音,会受到压力。而大多数情况下,用户会离开网站。

Facebook的视频会在用户进入时自动播放,但默认不会播放声音。

促销视频尽可能短。根据D-Mak Productions的研究,短片对大多数用户更有吸引力。因此,将商业视频保持在两到三分钟的范围内。

(Image credit: Dmakproductions)

提供另一种内容的展示方式。如果视频是消费内容的唯一方式,那么看不懂或听不明白的人则无法获取内容。为了用户更便捷获取内容,提供字幕和完整的视频。

字幕和视频将使内容更容易获取。(Image credit: TED)

2.9 Call-to-Action(CTA)按钮

Call-to-Action(CTA)是指引导用户实现预期目标的按钮。

CTA的重点在于引导用户进行我们所期望的行动。

一些常见的CTA的例子是:

“Start a trial”“Download the book”“Sign up for updates”“Get a consultation”

设计CTA按钮时需要考虑以下几点:

CTA应该足够大,稍远距离也能看见;但不能太大。要确认CTA是不是页面上最显著的元素,请尝试五秒钟的测试:浏览网页五秒钟,然后记录您记得的内容。 如果CTA在清单上,它的大小适当!在视觉上突出。CTA的颜色是引起用户注意的重要因素。通过颜色,可以让某些按钮比其他按钮更突出,更具视觉冲击力。对比色非常适合用于CTA,使其更加醒目。

火狐网站上绿色的CTA非常醒目,能马上得到用户。

负空间。CTA周围的空间也很重要。白色(或消极色)空间为了按钮创建了留白空间,将按钮与界面中的其他元素分割开。

以前的Dropbox主页有一个很好的例子,使用负空间来创建主CTA。

蓝色的“免费注册”CTA与背景的淡蓝色相映成辉。

面向行动的文本。为按钮编写文本,推动用户采取行动。从使用“开始”,“获取”或“加入”等动词开始。

Evernote为CTA提供了最常见且有效的文本。

提示:您可以通过模糊效果快速测试CTA。

模糊测试是确定用户的眼睛是否会到达您想要的位置的便捷方法。

将网页截图在Adobe XD中应用模糊效果(请参阅下面的示例)。

看看页面的模糊版本,哪些元素会脱颖而出?如果您不是正在预测的内容,那就修改。

模糊测试是一种检验设计焦点和视觉层次的技术。

2.10 网页表单

填写表单仍然是网页最重要的互动类型之一。

事实上,表单通常被认为是完成目标的最后一步。

用户在填写表单时,应该避免出现困惑、尽快完成表单。

表单就像一个对话,双方之间(用户和网站)应该有逻辑的沟通。

只留需要的。只要求填写真正需要的东西。添加到表单的每个额外字段都将影响转换率。总之想清楚为什么需要这些信息,以及将如何使用它。按照逻辑顺序排列表单。问题应该按照用户逻辑而不是按应用或数据库的逻辑来提出。例如,在名字之前询问地址是不正确的。将相关信息集合在一起。将相关信息按逻辑进行分组。从一组问题到下一组问题的流程更像一个对话。且将相关字段分组在一起还有助于用户理解信息。

将相关信息集合在一起。(Image: Nielsen Norman Group)

2.11 动画

越来越多的设计师将动画作为功能元素来加强用户体验。

动画不只是为了乐趣,它是提高交互效率的重要方式之一。

但是,动画只有在合适的时间和位置才能提高用户体验。

好的交互动画有一个目标:它是有意义、有作用的。

以下是动画增强用户体验的一些场景:

对用户行为的视觉反馈。良好的交互设计应该提高视觉反馈。当您需要告知用户操作的结果时,视觉反馈是有帮助的。如果操作没有成功执行,通过动画,用户可以快速地了解相关的信息。例如,输入错误的密码时可以使用摇动效果。这很容易理解,摇一摇在日常沟通中意味着“不”,因此摇动效果也能传递相同信息。

用户看到动画后,能立即了解问题。 (Image credit: The Kinetic UI)

系统状态的可见性。Jakob Nielsen的可用性的10个启发式中,系统状态的可见性是用户界面设计中最重要的原则之一。用户在任何时候都想知道当前的上下文,而不应该让他们猜测——应该通过适当的视觉反馈告诉用户发生了什么事情。数据上传和下载操作是功能性动画的常用场景。例如,一个动画加载栏显示了任务的完成进度,并展示了对任务速度的预估。

(Image credit: xjw)

导航式切换。导航式切换是指网站上各个模块之间的切换——例如从概述视图到详细视图。模块切换往往涉及到大块面积切换,用户思维难以跟上。动画能使用户在这些的时刻变得舒适,在切换上下文之间平滑地过渡,并通过创建模块之间的可视化连接来解释页面的变化。

(Image credit: Ramotion)

品牌。假设你有几十个相同功能的网站,帮助用户完成相同的任务。它们都能提供良好的用户体验,但人们真正喜欢的不仅仅是良好的用户体验。网站应该建立与用户的情感联系。品牌动画在吸引用户方面起着关键作用。它会形成公司的品牌价值,突出产品的优势,使用户真正感到愉快和难忘。

(Image credit Heco)

第二部分结束,请移步第三部分。

smashingmagazine

译文地址:人人都是产品经理

译者:吉诺是比利

减少认知负荷,打造更好UI的6种方法

多年来,设计师们一直在尝试通过减少摩擦以及为用户创造更多的价值来提高产品效率。

虽然很多产品需要传递众多的流程和功能,但是设计师的角色仍然是简化用户达成目标的路径。

设计师们在每一个新的用户界面上都会寻求形式和内容之间的完美平衡。

在用户眼中,一切都需要简单化。

设计师如何在避免认知负荷的同时降低复杂性呢?

以 认知工效学(Cognitive ergonomics) 的概念为出发点,我们可以认为,认知设计旨在让界面决策以促进浏览者理解为存在,减少短期记忆的负载,加速理解所呈现的内容,防止认知负荷。

说得通俗一点,只要我们的认知负荷大于我们的 工作记忆(working memory) 所能处理的范围,我们的大脑就会因为处理能力有限而面临承受认知负荷的风险。

要想更好地理解认知负荷,可以看看其鼻祖John Sweller 的著作 认知负荷理论 。

Sweller探讨了有助于理解信息的心理路径。

根据Sweller的观点,理解在很大程度上受到内容呈现给观众的方式的影响。

例如,展示一个正方形的图像比用语言描述更容易被人理解。

在另一项名为 「减少多媒体学习中认知负荷的九种方法」 的研究中,UCSB的研究人员探讨了认知负荷的几种潜在情况,并提出了一些关于如何减少或防止认知负荷的建议。

这些建议中的许多都适用于网页设计的实践。

数字体验通常始于意图:我们在Instagram上查看照片、通过Gmail发送电子邮件或在LinkedIn上阅读消息。

目标达成越难、体验越差、认知负荷越大。

根据1993年提出的 峰终定律(Peak-End Rule) ,我们都倾向于根据最关键以及最终时刻来判断一段体验。

困惑的感觉会产生焦虑和挫折感,而这些负面的感觉很可能与你的品牌有关。

在考虑用户体验时,我们必须考虑使用有效的认知设计。

在尝试解决一个设计问题之前,纵观全局很重要。

人们有不同的目标和背景,所以他们可能会对同一个挑战有不同的理解。

有些东西可能对你来说很复杂,但对你的用户来说可能就并非如此了。

花时间研究你的用户如何与你产品的界面进行交互。

在对你的用户流程进行更改之前,先观察你的用户并与之交谈,确定可能的认知负荷情况。

为了减少认知负荷,我们需要有策略地决定如何以及何时使用以下方式呈现内容:

即使我们很想通过尝试呈现多种内容选择的方式让用户能够快速获取自己感兴趣的内容,但我们还是应该尽量简化用户达成目标的路径。

将过多的信息集中在同一个地方并不是理想的呈现方式。

设计界面就像讲故事一样,用户体验中认知负荷高的主要原因之一就是故事讲得不好。

尽最大努力引导用户,保持一致的叙事结构,有清晰的开头、中间和结尾。

通过使用模式来减少认知负荷。

探索良好的实践,比如坚持遵循 用户界面设计的10个可用性启发法 ,以及使用设计系统来设计一个成功的用户界面。

认知负荷的发生并非偶然,很多因素都会造成这种情况。请记住以下这些主要的因素:

请记住:现在是2020年,不是1999年。

闪烁的动画和GIF不再是典型的好设计之选。

并且,动画和微交互的存在应该有明确的目的。

任何形式的视觉刺激都应该用于引导体验而非误导体验。

米勒定律(Millers Law) 指出,一般来说,我们的短时记忆中能够容纳七条信息。

这并不意味着一个界面只能有七个元素,但它提醒我们要牢记自己的认知局限,以避免认知负荷。

解决方案

回顾每个刺激背后的意义,并使其与界面的主要目的保持一致。

每个颜色、动画、插图和微交互都必须有明确的目的。

在决定同时显示什么内容时,少即是多。

过多的内容会使焦点偏离主要目标动作,降低转化率。

希克定律(Hicks Law) 告诉我们,选择越多,做决定的时间就会越长。

解决方案

根据上下文将你的内容分离成逻辑组。

你可以通过分类学研究、动态卡片排序、以及将内容分成选项卡、区块、屏幕或不同的视觉组来探索选项。

保持用户熟悉的视觉设计、交互和导航。

如果搜索栏位于主页的右上角并带有一个蓝色的图标,那么没人希望它跳到下一页的页脚。

如果你的销售渠道中的确认按钮总是绿色的,那就确保它一直保持绿色,即使是在那个被遗忘的联系表单的末尾。

解决方案

现在是时候让你的设计系统大放异彩了。

通过原子系统保持从最小到最大组件的一致性,并将其标准扩展到界面的任何操作,包括导航结构和动画。

你是否曾发现自己在填写注册表单信息时,不知道为什么需要填写某项内容?消除任何对完成主要任务不重要的内容。

额外的字段、多余的信息、验证和点击次数越少越好。

解决方案

只有在必要时才进行干预。

分析你的内容是否有多余和不必要的步骤。

改进默认选项,减少用户的交互需求。

作为设计师,我们不必总是无谓地重复。

经过多年与不同界面进行交互,用户期望看到熟悉的模式。

当这种情况没有发生时,工作记忆会发生较大的负荷来处理信息。

解决方案

在设计已经被大家熟知的解决方案时,你不必从头开始。

请参考与可用性相关的行业标准,例如人们通常不阅读网页上的每个单词,而是以F-Shaped模式扫描内容。

重复出现的元素,如搜索栏、登录屏幕和导航菜单都有完善的标准。

重复使用而不是重新设计。

为了简化心理学家Paul Fitts在 1954年的研究中提出的建议 ,按钮需要大而易懂。

让用户更容易做出决定是设计师的责任所在。

这里值得一提的是 奥卡姆剃刀(Occam’s Razor) 。

简单的说,当给你几个产生同样结果的选项时,通常最简单的那个是最好的。

简洁性与可访问性必须齐头并进。

解决方案

使用负空间(negative space)等特征简化信息的呈现,以强调关键内容。

重新审视和应用 格式塔原则 Gestalt ,如邻近性、相似性和连续性,以优化用户体验,不产生混淆。

避免歧义,同时保持文字的清晰和客观,保持组件符合可访问性原则,并提供必要的帮助量,作为简洁体验的核心要素。

通过所有关于认知负荷的理论和讨论,往往很容易通过产品和业务指标看出一个UI的表现是好是坏。

如果没有很好的理由,就不要从根本上改变已经成为标准的内容。

最重要的是,观察、倾听,并让与你的界面进行交互的用户发声。

只有这样,我们才能设计出能够真正解决用户问题的有用产品。

对于网站改版,您有什么建议?

1、创造有焦点价值的产品有太多的产品试图让你更用户做更多的事情,每个企业都试图成为行业中的瑞士军刀。

但是,如果你希望产更加简单,那么你需要有一个核心价值,并且确定产品真正针对的是谁,并非每个产品都应该成为 Facebook。

你的产品的核心价值是什么?2、删除所有不必要的内容想要简化产品,最简单的方法,是经过深思熟虑之后再进行简化和删除。

如果组件或者模块的功能、价值存疑,那么请删除。

次要信息、不常用的控件、分散注意力的样式,都在这个范畴内。

就这么简单。

一旦采用这一的方式,你会立刻马上看到结果。

当然,删除的时候,请务必深思熟虑。

3、将数据转换为有意义的样式我们日常设计的绝大多数产品,都涉及到需要用户理解大量数据。

当用户对于趋势和变化感兴趣的时候,请尽量使用可视化的方式来呈现信息,而不是一堆数字。

尝试从数据中提取有效的内容,可视化地呈现在用户眼前,这才是有意义的简化。

4、提供对快速决策的支持用户长期遭受复杂抉择机制的折磨,帮助用户看清各种信息,更好的决策是简化的方向之一。

席克定律曾经对此作出过非常经典的解释:用户做选择所需要花费的时间和精力往往会随着选项数量的增加而增加。

因此,如果你希望用户决策变得简单,那么你需要简化选择,消除不必要的选项,来帮助用户进行选择。

5、太多选择会吓走用户当前心理学理论和调研肯定了一件事,就是足够多的选择可能会给人带来积极的情绪,相应的衍生出一个流行的观点,就是选择越多越好,但是人类天性中的管理能力是不足以支撑过多选择的。

果酱实验是消费心理学当中最著名的实验之一:为消费者提供更少的选择,对于销售更加有利。

这一点是至关重要的——更少的选择,能够带来更多的销量。

在这个实验当中,选择较少所带来的转化率几乎是更多选择的转化率的10倍。

这是一个选择过载带来不良后果的一个重要范例——过多选择抑制了用户选择购买的想法。

6、在提供多种选择的时候,给用户以建议如果多个选择总是无法避免,那么不妨给用户提供建议,或者告诉用户多数用户的选择。

向用户清楚地传达选项之间的差别,这在定价策略上会带来更多积极的效果。

7、将用户注意力吸引到对的区域当你了解用户流程的时候,就应该有针对性将用户注意力引导到的对的目标上去,找到关键区域,让用户在界面中优先注意到它们。

8、使用色彩和版式来呈现内容的结构层次你应该经常会听到类似「可读性很差」这样的表述。

有很多设计的确存在这样的问题。

在设计当中,有太多的因素会影响信息的传达——字体的选取,大小变化、间距、大小写和配色,都会影响到层次结构,影响到用户汲取信息的方式。

使用正确的配色和版式,让内容的层次结构更加清晰,最好还能反映出品牌特征,这样就更能增强吸引力和用户对它的印象了。

有组织的元素不仅有着更高的识别度,也更容易被记住。

在数字产品当中,记住常见控件的位置和功能无疑是重要的。

同样是上面这张图,如果不是计数,而是记住每个点的位置,你能不能做到?毫无疑问,缺少组织结构,这是一件艰难的事情。

10、给相关内容分组在简化复杂页面结构的时候,对组件和内容进行分组通常是最为有效的方法之一。

通过层级划分,用户每次需要处理的信息量都会更小,而不是在无关的组件中来回穿梭寻找。

借助边框和卡片将相关度更高的内容整合到一起,这是非常便捷的方法。

此外,关于关于分组,格式塔原理中的分组原则是非常值得借鉴的:接近性、相似性、连续性、闭合性和连通性。

11、拆分任务,按列布局几乎任何产品当中都会涉及到不同类别的表单,这是获取用户信息的一种方式。

有的时候,即使删除掉一些不必要的字段,表单依然会很长。

因此,我们可以将巨大的表单或者任务拆分开来,这样一来,整个执行过程会变得简单不少。

设计表单的时候,尽量使用单列而非多列,这样更加顺畅、易于填写。

用户无需思考接下来要填写什么,而是按照一条线继续操作下去即可。

12、透明清晰地展现路径和状态不确定性让人感到焦虑,尽可能地在设计当中规避这种不确定性。

这就是为什么要让用户在任何时候都清晰地知道他在流程中所处的位置,以及接下来会发生什么。

总结之前所提供的信息也是个好主意,能够减轻用户的负担,避免反复检查之前的内容。

13、替用户进行计算人脑对于涉及计算的部分通常会比较费力,对于这些不太占用计算力的内容可以交由系统来进行计算,和计算相比,人的大脑在处理具象化的信息的时候更加擅长。

尝试利用系统,而不是将压力转嫁给用户。

14、用逐步展现来隐藏复杂性渐进式的展开是用户体验设计当中的一种范式,这种方法能够让界面更容易被理解。

当涉及到多屏、大量信息和操作的时候,这种逐步展现的机制,可以避免让用户感到不知所措,也可以隐藏一些无关的信息,直到最后用户可以清晰明白内在的关联性为止。

逐渐展现的方法,遵循着「从抽象到具体」这样的一种概念,而 iOS 系统当中,所采用的导航方式,无疑就是这种思路的典范。

一屏一个步骤,逐渐展现,最后给用户一个确切的结果。

15、善用通用的交互模式和设计范式用户将绝大多数的精力都耗费在各种各样的其他数字产品上,这意味着用户对于其他的网站和APP的交互模式、使用方法都有着清晰的了解,对于特定的模式有具体的预期。

因此,无论你是设计网站,某个 APP ,甚至是冰箱上的控制系统,都可以遵循既有的设计和交互模式。

这并不是意味着停止创新,而是在很多事情上,你无需重新造轮子。

16、初次体验应当精简在设计任何产品的时候,都应该让用户尽快感知到产品的价值。

因此,除非是满足功能性的需求,在用户初次打开应用的时候,都尽量把其他的干扰去掉,因为这都是让用户了解产品价值的障碍。

第一印象很重要,如果不满意,很多用户会立即离开。

如果你第一次尝试,即使是最简单的操作,可能也是有挑战性的,有时候新手使用 APP 的时候需要引导,但是最好的方法是尽量让体验和功能一目了然,搭配上下文环境的说明引导,而不是提供复杂繁琐的学习材料。

17、结合使用场景,巧用人体工程学简约易用的产品大多能够合理地结合人体工程学的设计。

绝大多数人可能会想到诸如汽车座椅、控制面板和手柄这样的案例,但实际其实远远不止。

人体工程学适用于几乎所有涉及人的产品设计。

1954 年,心理学家 Paul Fitts 仔细了解了人的运动系统,并且提出了费茨定律——移动到目标所需要的时间取决于和目标之间的距离,并且和目标大小成反比。

这个定律反馈到具体的界面设计上,就是尽可能让常用元素更大,并放置到更容易被触及的地方。

17、结合使用场景,巧用人体工程学简约易用的产品大多能够合理地结合人体工程学的设计。

绝大多数人可能会想到诸如汽车座椅、控制面板和手柄这样的案例,但实际其实远远不止。

人体工程学适用于几乎所有涉及人的产品设计。

1954 年,心理学家 Paul Fitts 仔细了解了人的运动系统,并且提出了费茨定律——移动到目标所需要的时间取决于和目标之间的距离,并且和目标大小成反比。

这个定律反馈到具体的界面设计上,就是尽可能让常用元素更大,并放置到更容易被触及的地方。

19、使用智能默认值,减少认知负荷智能默认值——或者说智能占位符是一个非常有用的策略。

一方面可以帮助用户更快更精准的填写表单,另一方面,也给用户提供了相对准确的范例。

只不过,默认参数的确定,需要设计师和开发团队对用户的使用场景等信息进行研究,通过测试和调研,确定用户使用状况,以此来确定默认参数应该是多少。

如果需要进行明确地参数或者选项,那么可以将默认值设置为 90% 用户可能会选的选项,并辅以说明。

20、防止出错出错信息会给用户带来很大的压力,为了避免用户陷入这样的状况,防止用户无法完成任务,请使用数据输入检查的功能,对于格式输入错误的表单和内容,对用户予以警报和提醒,避免错误发生。

对于极为重要的操作,在用户提交之前,让用户二次确认信息,做好检查。

对于某些强制性、破坏性乃至于不可恢复的操作,确保用户知道这一操作带来的影响。

21、无障碍设计数字产品的可访问性是老话题了,要让产品和设计对于所有人——包括有视觉障碍的用户,都可以轻松地使用。

最常见的,就是不要使用色彩来作为传达信息的唯一途径,确保文本和背景之间有足够的对比度,支持键盘导航操作等等。

可访问性问题并不限于特定的群体,坚持不断的改善和提升,有助于每一个用户的体验。

挺好的

赞(0)
未经允许不得转载:优乐评测网 » 云服务器界面设计中的认知负荷:简化复杂性,增强用户理解 (云服务器界面图片)

优乐评测网 找服务器 更专业 更方便 更快捷!

专注IDC行业资源共享发布,给大家带来方便快捷的资源查找平台!

联系我们