首页

动态引导设计

博博

01 前言

在产品设计中,当有新上线的功能或隐藏功能时,我们通常会给予用户提示。常见的有小红点、角标、黑色遮罩+文字提示等这类静态提示。

而人类是视觉生物,相比于静态内容,我们的注意力更容易被动态内容吸引。

今天来聊一下页面中常见的动态引导。

02 一个小案例

当你看到这个页面时



我想你会先被色彩凸出的元素吸引,然后是面积占比大的元素,最后根据阅读习惯从上到下,从左到右,依次查看其他内容。(大致如下图)



而当页面元素都赋予细节时



假如我想让你关注到其中某个较小元素



其实只需要为它添加动态,便能使其脱颖而出,这就是产品设计中的动态引导。



03 动态引导的作用

  • 新功能提示
  • 重要内容强调
  • 诱导用户操作
  • 操作教学指引
  • 信息高效传递

新功能提示 

当产品上线新功能时,设计师们都会根据功能重要程度,来决定使用什么形式让入口元素和其他元素区分开来。常见的有小红点、标签、气泡这类静态点缀元素(通常这类形式只出现一次,当用户点击后就会消失)。当然,也有将上述点缀元素动态处理的。如果入口是图标,甚至可以为图标制作动画,这在很多电商产品的品类区经常可以看到。



动态处理的形式,比原本的静态更容易引起用户对元素的注意力(与动态方式有关),甚至传递某种情绪。由于是循环播放的动画,因此可以持续吸引用户注意力。

ps:据说,每当页面多出一个会动的元素,后台就会多出这样一些留言,捅了开发窝了[Doge]。



诱导用户操作 

动态引导还常常被设计师用来强调重要内容(有可能被产品、运营拿刀架脖子),来达成某些数据指标,通过利用动态诱导用户操作。

例如:在会员卡片中添加光效、在广告中让按钮进行缩放、为签到入口图标设置动画。



这些都能充分引起用户注意,甚至提升功能点击率。



隐藏功能提示 

我们知道,在大屏上有更多空间可以展示信息。但在移动端,受屏幕大小限制,设计师通常会折叠或隐藏不常用的功能,来保持页面简洁。



对于这些不可见的功能,在初次使用时需要进行引导,才能被用户感知与使用。



操作教学指引 

讲到引导,还必须要提的是手势引导,通过动态直观展示不同手势的作用,提示用户如何与产品进行交互。



这在游戏教学中就常常使用,它可以帮助用户快速理解游戏玩法。



回到视频 App 中,你是否留意到,当你第一打开视频时, App 会提醒你双击屏幕可以点赞,上下滑动可以切换视频。



在产品交互设计中,如果使用到一些新颖的交互方式,这类引导可以大幅降低用户学习成本,帮助用户快速上手。

信息高效传递 

动态叙述的直观性,使得我们可以减少对复杂信息进行大量文字描述。通过动态设计,我们可以创建视觉故事,这有助于将复杂信息以更简单、清晰的方式进行传递,从而帮助用户快速完成任务。

也因此,在一些含有复杂操作的弹窗中,渐渐开始应用。



但是需要注意的是,上述这些大多都只在第一次使用时才会触发。

当然有特例,例如:

在 App Store 每次下载应用进行验证时(面容解锁的情况下),系统会通过动态提醒用户电源键位置,并告知用户需要双击进行人脸识别。



在扫码时,弱光场景下出现的手电筒,通过动态引起用户注意,指引用户使用。



以及作为动态演示,帮助用户理解如何使用手掌滑动截屏



如何进行NFC感应等等..



04 总结

动态引导像是设计师用来控制我们眼睛的法宝,有的人用它改善产品体验,有的人用它提升商业转化。

但法宝虽好,我们只有理性使用,才能避免用户迷失在这眼花缭乱的世界中。








作者:
零三



蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加微信ban_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~

希望得到建议咨询、商务合作,也请与我们联系01063334945。 



分享此文一切功德,皆悉回向给文章原作者及众读者. 免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。 



蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司 

深度解析蚂蚁财富设计语言

博博







作者:菜菜不甜          来源:站酷



蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加微信ban_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~

希望得到建议咨询、商务合作,也请与我们联系01063334945。 



分享此文一切功德,皆悉回向给文章原作者及众读者. 免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。 



蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司 

信息架构及八大原则

ui设计分享达人

  1. 如何系统地了解信息架构?





良好的用户体验需要所有信息都符合逻辑且触手可及。以下是一份完整的信息架构指南,它可以避免你的用户迷失在错综复杂的网站信息中。


当我们使用任何网站或移动应用时,都会面对向我们提供所需信息的界面。这是大家都习以为常的,大多数用户甚至没有注意到网站的所有内容都经过精心组织。


内容的组织和划分被称为信息架构,它是用户体验设计的一个重要部分。如果内容没有经过适当整理,大多数用户在浏览网站或app时容易迷失方向,使得产品的真实价值被掩盖。毕竟,即使再棒的功能也需要用户去发现。


为确保你的内容结构合理并能以最佳方式呈现给用户,好好看看我们为你准备的这份信息架构指南吧。


1、什么是信息架构?
信息架构可能难以定义。
部分原因是,内容写作等其他学科可被缩小到特定职业,比如作家,而信息架构的范畴却涵盖了多项职业。的确,参与产品开发的每个人都会多少用到信息架构。





大多数网站和app都要将内容分成多个部分让用户快速理解,同时要被合理组织以便用户发现产品的所有功能。当这项工作进行的非常顺利时,用户永远不会停下来思考网站如何为他们组织信息。


Google Drive或Medium等网站就是这样,设计者必须仔细考虑如何向用户呈现信息。否则,功能就会有被淹没在随意布局的按钮和链接中的风险,用户既难以关注也不会喜欢。


在其他案例中,你可以看到信息架构的作用极其显著,同时也很难做好。


2、信息架构与UX相同吗?
不相同。
两者之间有很强的联系,尽管UX涉及大量的信息架构工作,但两者并不完全相同。


用户体验涉及范围更广,包括了信息架构不会触及的几个方面,例如要确保界面令人愉快、响应用户的某些心理需求。相比之下,信息架构则更侧重用户目标和为此付出的认知力。


以下是这两个概念的紧密联系:没有良好的信息架构,就没有合理有效的用户体验。它是界面开发的基础,为我们所知所爱的用户体验设计其他方面打开大门。


然而在此,我们应该做一个小小的区分。
信息架构是建立用户体验的坚实基础,但并不代表整个项目工作
一旦你知道如何为用户建立良好的信息架构,你需要为用户体验添加闪光点并进行其他工作,例如融合信息架构的交互设计,这样才能创造让人惊叹的用户体验。


3、一个巧妙的信息架构类比
信息架构使你的产品可用,这在电子游戏中更为明显。
电子游戏拥有自己规则和历史,是一个全新的世界。这意味着如果用户希望在游戏中进行下去,就需要向他们呈现关于这个世界的大量信息。


但你会注意到,所有这些信息不是一次性呈现的,而是随着游戏进展,一点一点呈现。
首先,你会看到场景设置介绍,通常讲述主角和一点背景故事。在此出发,新信息将以易于消化的形式呈现,从而使玩家可以慢慢探索这个世界。


在达到特定等级或完成特定动作时,那些小的对话框、内容框向用户提供的新信息,都是游戏中最好的信息架构。但是我们如何决定从开始该告诉用户什么内容呢?我们如何提供适量信息满足用户的好奇心,而非过量信息使用户感到疑惑?




图 1 刺客信条:奥德赛。摘自福布斯
4、信息架构的元素
正如大部分设计的辅件,信息架构有很多组件帮助你将这些结构应用于产品。
这些组件是由信息架构先驱罗森菲尔德和莫维尔在他们的开创性著作《Web信息架构》中建立的,如果你想深入了解信息架构,推荐阅读这本书。这些组件组成的系统,用不同方式组织内容、让内容被用户发现。


4.1 组织系统/结构
组织结构让你的内容具有意义、易于理解,即标记不同信息之间的联系并尝试构建框架,帮助用户了解产品所有信息之间的联系。
构建框架后,由于所有的内容分布都具有逻辑,用户就更容易预见某些信息的位置,这也是可用性测试的一个经典部分。在《Web信息架构》中,列出了信息架构的三种不同框架。


1)层级结构




也称为树形结构,这意味着使用滴漏效应,将广泛的分类放在顶部,更具体、更小的子类别放在下方,让用户进行导航。这种视觉层级将相关信息呈阶梯状显示,很好地传达了不同信息的重要性。


2) 顺序结构




这种形式的信息架构通过组织信息为用户创建特定浏览路径。用户需一步步操作,并仅接收当前呈现给他们的信息。这样可以避免给用户提供太多选择,从而避免因自由选择而导致的沮丧和信息过量。


3)矩阵结构




这与顺序结构有些相反。顺序结构通过一系列指定步骤带领用户,而矩阵结构则让用户自行选择他们喜欢的导航方式,允许用户以链接和按钮的形式访问所有信息并让他们决定访问内容。


可以说矩阵结构通过给用户所有可能的方向和功能,让用户在使用产品时创造自己的使用路径。


4.2 标签系统
标签系统是用单个词汇传达大量信息的一种方式。它可以帮助用户通过概念来查找内容,而不是浏览整个产品来寻找想要的信息,这也是为何使用标签系统的原因。


想想一个普通的商业网站,当你寻找业务联系方式时,可能想找一套不同的信息:电话号码、邮箱地址、办公地址……而所有这些信息,都可以在网站界面的同一个标签下找到——联系页。


4.3 导航系统
从信息架构的角度,导航系统并不意味着设计好的界面,更多则是关于用户如何在内容和信息中移动
重要的是要随时记住,信息架构只是帮助用户导航信息以达成目标的方法


某种程度上,导航系统应与内容相反。只要用户觉得有用愉快,你会想要丰富、复杂的内容;而你的导航系统则应该尽可能简单明了,同时依然能让用户获得任何想要的信息。这时,一个重要的概念就发挥了作用:元数据。


元数据是信息的信息,它在信息架构中起着重要作用。
可能听起来过于技术,但元数据是导航系统中的关键组成部分。用户在产品中进行导航,寻找特定的目标,但他们是否知道要寻找什么?是否知道所寻找东西的正确用语?


即使你的用户知道产品中所有信息的名称,仅仅以A-Z列表形式提供所有信息,并不能提供出色的用户体验,因此我们并不建议这样做。出色的用户体验,需要对内容进行汇总和分类,这样才能让导航系统成为带领用户前往任何位置的道路。


导航系统可以以列表和菜单的形式呈现出内容的类别,但要警惕:不要将成千上万的类别抛给用户,这样会导致信息超载。我们建议你创建不同的分类,然后按绝对重要性进行排序,放弃不重要的分类,因为它们只会使用户晕头转向。


你可以通过阅读Smashing Magazine上Karafilis发表的内容找到更多关于创建好导航系统的信息。




图 2 亚马逊网站
4.4 搜索系统
如你所期望,当产品中包含大量数据时,搜索系统会派上用场。如同你的标签系统,搜索系统有几个不同的方面需要考虑,你可能不会立即想到。


以一个普通的电商零售网站举例。
当你创建网站时,第一反应可能是创建一个可以查找所有信息的搜索栏,但你必须抵制这种冲动。逻辑使然,每当用户使用搜索框时,他们只会查找一种类型的数据:商品。它们不是在开放时间或数据隐私政策之后,它们在搜索栏中的索引是随机的。在这种情况下,产品是被当成搜索区对待,确保搜索栏仅向用户显示某种类型的内容即可。


而你需要在搜索系统中考虑的另一个问题是,点击搜索后信息要如何呈现?


5、信息架构的八原则
这八条基本原则可以作为任何想为产品赋予意义的UX设计师的行动指南。 最初由EightShape的创始人丹·布朗构想,这些原则将信息架构看成结构设计的实践,以下是关于如何实践的指南。


5.1 物体原则
这项原则关于你如何看待自己的内容。布朗说,不要把内容视为僵硬、无生命的东西。它像物体一样,要尝试将它当成拥有自己的生命周期、行为和特征的生命体对待。


这条原则之所以与信息架构相关,在于它可以让你根据需要灵活处理内容。如果你将内容视为自身存在的个体,便可以更轻松地看到内容与其他信息之间的可能关系、发现向用户呈现此内容的不同方式。


这个原则的特点之一在于它将内容的生命周期嵌入到结构中,考虑到内容从逐渐增长到稳定的不同时代——这在内容适时变化而更受欢迎后发生的格外频繁。


布朗给我们提供了一个食谱网站的例子,食谱之间可以作为互补而互相关联,或者在某些时节关联性更强(比如感恩节时与火鸡有关的食谱)。


5.2 选择原则
布朗提到施瓦茨的心理学史诗级作品《选择的悖论》 ,告诉我们人类有一种错觉,即他们想要尽可能多的选择。而大多数用户体验设计师都知道这并非真相,这也是施瓦茨和布朗所认同的。给用户过多选择的真相是:人们的可能选项越多,就需要付出越多的认知努力来做出选择。这甚至能引发焦虑。




图 3,Habitout漂亮的极简主义首页

布朗用企业内部网站举例,大公司习惯于展示大量信息,却通常忽略了内容的分类和信息架构。结果则是用户浪费了大量时间来寻找他们实际想要的那一小部分数据,或干脆放弃使用网站。


听起来不像你想要的产品是吗?这正是信息架构所要避免的。


建议你缩短列表,尤其是在较高层级。这也是你在为内容设计矩阵结构时,需要牢记的一点:用户在停止轻松并开始积极努力的使用产品之前,只能在一定数量的选项中做出选择。


5.3 渐进式信息披露原则
该原则讲述人们只能以某种方式处理新信息的事实,意思是人们不能很好地处理预期之外以及不想要的信息——这个概念被称为渐进式披露


这意味着在信息架构中,你需要组织数据,以便人们不仅能够以正常速率吸收信息,而且还可以在呈现之前预测更多信息。在用户体验设计中,这意味着,你放在任何类型的列表或表格中连接详细内容的入口信息,都需要好好考虑让它们简洁。


让我们回到布朗的食谱网站案例。你不能指望在用户浏览的所有页面上显示完整食谱,但是要如何在列出食谱时决定显示什么呢?菜肴的类型是一个很好的指标,但它不能让用户清楚地了解在食谱中可以看到什么。你的设计应该选择足够的信息来帮助用户决定是否要点击某个食谱。


5.4 范例原则
这个原则是关于人类如何对事物进行分类的心理学。最终,我们能够通过创建一个范例列表来对概念进行分类,这些范例可以帮助我们将不同概念组合在一起,无论此分类背后的标准是什么。
在将此应用到你的信息架构时,请考虑在应用程序或网站上显示分类的方式。每个分类都需要一个包含该分类内容的范例,你可以使用最大、最常用的子分类。这样,子类别可以作为大多数用户的快捷方式,并且可以帮助用户理解每个顶级分类。


5.5 前门原则
布朗说,设计师认为用户会通过首页之外的页面访问网站是一种明智的看法。认为网站有多个可访问的入口,可能会对PC网页设计产生不小的影响,而对移动app设计的影响则较小。布朗对此提出信息架构的两个主要建议:


一、永远告诉用户他们在哪里。
你的网站拥有很多页面,访问者可以访问其中的任何页面。因此,在用户可以看到的地方显示站点地图非常重要。因此,如果你刚从Google链接打开一个博客网页,应该能看到博客文章的类别和其他类似内容。让新用户在大框架中理解逻辑非常重要,而不是像在广袤湖泊中填充少量内容,以随机的方式呈现。


二、首页不应该包括网站的所有内容。
过长的首页与好的首页区别很简单:好的首页应该让用户清楚地了解你的目的、以及整个网站上可以找到的东西,而不应该尝试向用户显示所有可能、详细的信息。在信息架构方面,首页不应该成为通往网站所有角落的快捷方式,而应该展示网站内容的概况。




5.6 多重分类原则
即使在一小群相似人群中,你仍然会发现人们有不同的信息寻找方式。有些人会输入正在寻找的主题泛称(例如沙滩装),其他人则会自然地输入他们想要的具体类型(例如比基尼)。


这对设计和信息架构很重要,你需要在搜索系统中考虑到这一点。但也需要小心对待,因为它总是伴随如下事实的出现:呈现给用户寻找信息的方式越多,他们越可能变得分心或不堪重负。


5.7 聚焦导航原则
布朗声明,导航不应该只是简单的包含网站中的所有内容。许多设计团队在网站上随意添加导航菜单,使得菜单本身看起来缺乏逻辑。然而信息架构本就是用户体验中逻辑的体现。


相反,布朗建议你为菜单制定策略,在可能的情况下为不同类型的信息提供不同菜单。例如,一个用于博客主题的菜单和一个市场营销的菜单(列出公司提供的服务)。


这能改善网站的可用性,即便删除了直接进入联系页的按钮。请记住,信息架构是按照正确类别给事物分类,让用户确切知道他们在哪以及在何处找到所需信息,而不是将每条信息连接到主页。


5.8 增长原则
对于这项规则,任何需要处理内容的人都应该牢记:产品中的内容量可能会随时间的推移而增长。这是相当合乎逻辑的,在互联网上放置内容变得越来越便宜。总的来说,电子内容每年呈指数级增长,你的内容应该遵循相同的节奏。
但是,在设计中反应出内容增长并不容易。之所以如此困难,是因为即使你知道会有更多的内容,也不可能知道会有多少内容。如何为尚不存在的内容设计信息架构是件困难的事。同样,产品也可以在不同方向上增长。是要增加新类别还是现有类别的新内容也会难以判断。


遗憾的是,布朗发现当内容增长时,并没有简单的建议或明确的方法来避免麻烦。我们所能做的最好方式就是设计能够接受新形式内容的页面,为将来可能的内容扩展做好准备。换句话说,即使你现在不使用视频内容,也要创建接受视频的页面。信息架构的结构应该具备的另一个技巧是,如果你需要在将来添加新的子类别,则应使顶级类别尽可能宽泛。
6、结论
如果你希望用户足够了解你的产品并能愉悦使用,那么信息架构至关重要。你所希望创建的结构,不仅要让用户理解、更要能进行预测,这样他们才不会兜着圈子寻找信息,轻松地便能掌握产品的使用方法。


请记住,好的信息架构和好的用户体验设计是相辅相成的:即向读者提供博客文章,或帮助新玩家在游戏世界中快速适应。请注意细节,不要用超出用户处理能力的信息轰炸他们。


使用你的产品应该感觉自然,而不是像跑马拉松一样疲惫或像在房间里四处搜寻两天没见的手机充电器一样迷茫。利用一切机会在用户测试中检验你的信息架构,确保人们不会对信息呈现的方式感到困惑沮丧。


当拥有大量信息时,很难以好的方式呈现所有信息,但我们总能找到呈现与理解信息的方法,你应该用正确的计划将这项工作反映到设计工作中,所以不要慌!


只需放轻松并回归一切的根源:每个时间点用户的目标是什么?如何以最简单的方式帮助用户实现目标?这才是信息架构中最重要的问题。

作者:Z9084488
来源:站酷

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加微信ban_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~
希望得到建议咨询、商务合作,也请与我们联系01063334945。 

分享此文一切功德,皆悉回向给文章原作者及众读者. 免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司 


[无界面交互启示录]-人人受益的设计方略

ui设计分享达人

1|从《无界面交互》开始

最近又翻了翻《无界面交互》这本书,不过与上次阅读却有了些不一样的反思与收获,这本书很多人应该都看过,起初看是因为以为里面有何新颖前瞻的交互方式与教程指南,不过之后却发现是紧扣副标题“潜移默化的UX设计方略”,尽管对标题和内容的匹配产生了失望,但还是被作者幽默风趣的写作风格与独到的思考方式所吸引了。
这本书并没有讲述很多的交互观点,也没有展开说如何进行零界面的交互实践技巧,反倒是通过幽默风趣的表达阐述早期硅谷以应用软件为中心的需求解决现象,并且使得各种需求总是以软件->以手机->以屏幕->以界面来进行交互,而这些软件的快速发展也加剧了人们与手机屏幕的依赖性,以至于我们的身体也出现了一系列不良变化,尽管我们正在适应和习惯这些不良性,例如近视人口的比例与年龄层下降,而好的UX设计不该是基于界面的,所以UX≠UI,应该是基于更加自然智能自动的服务或交互方式,作者认为最好的界面就是没有界面,我们面对未来的创新技术发展,应该试图摆脱对屏幕的依赖性,并且为此作者列举了多个例子来佐证,后文我会简单的介绍一些书中的例子,所以你不用因为好奇而马上跳离这个文章去搜索了。并且为此现象作者提出了三个原则;


一、贴合日常生活流畅,而不是一味依靠屏幕;大意是贴合日常生活中的一般工作流程,避免与手机与屏幕有过多非必要的绑定,使得避免沉迷用户界面或者说手机。


二、做电脑的主人,而非仆人:科技的飞速发展还是不能很好的让电脑智能化,时不时还是会出错,例如蓝屏闪退等,各种条条框框的限制等,如密码限制。我们健忘、脆弱、繁忙,计算机应该更加智能的解决问题。


三、适应个体情况:大意是每个用户都是特别的,可以提供定制化的服务,不在只关心平均数据或盈利趋势,而且未来的计算应该更加主动,而不是被动的等待用户来图形界面操作。


大体上内容差不多就这些了吧,作者想以潜移默化的方式来引导UX思维方式,前面部分铺垫了不少生活现象,以让我们意识到感受到手机屏幕的负面影响,以及这种基于应用软件来解决需求的惯性思维的局限,当然啦,一方面有文化差异,另一方面设计行业发展日新月异,现在的优秀设计师也不会完全聚焦在用户界面上了吧,就像书中的结束语,也许未来的某天再次翻开时,已经觉得这本书无聊透顶,观点已经过时,就像我们现在已经深知UX不是UI,也因此难免会被部分读者所吐槽。


那么回到此时此刻,虽然不知道你是否有了新的思考或收获,我来聊聊我的一些思考吧。

2|怎么看待零界面交互

我们通过感知与身边的事物发生着互动,而看见的信息往往是最丰富的最具体的,这也意味着屏幕或界面的概念会长存,即使全息影像技术随处可见,所以我们要意识到零界面交互是一种交互方式,一种交互理念,而不是说以后没有界面交互了,而且对于交互方式,基于语言系统的语音交互、脑电波控制交互、物理实体的人机交互等等,不就是没有界面的交互吗?对于零界面交互我认为有点儿奥卡姆剃刀原理的意思,能在其基础上找到更好的办法就不要复杂化,如无必要,勿增实体,并且合乎情理。智能的交互方式绝对不是多几块可交互的屏幕而已

3|UX最本质的能力

零界面交互后,作为一名UX设计者,如果不在互联网行业里了,不搞应用软件了,也无需在用户界面上花心思了,那你还能做些什么?是否就要考虑转行送外卖摆小摊呢?
当我想到这个问题的时候确实迟疑了,想到自己擅长或能够胜任的,且符合以上要求的话,可能就需要转型做技术咨询服务、视觉设计或是产品经理之类的,但之后我想了想又感觉不大对,为什么不能是UX设计师呢?我也与其他好友相续的探讨了下,UX设计最本质的竞争力不该是线框图、界面交互或是视觉呈现,尽管在应用软件中,是重要的环节,但!最本质的能力不应该是解决问题的能力与方法吗?
在得出这一结论前,我们会惯性的结合平时的工作内容与输出结果来匹配其他职能,结果反而忘了UX最本质的能力是什么,探讨时UXRen的宝珠用一个词描述道“模糊边界”,我瞬间清醒,可不就是吗?


如此看来,我们应该庆幸UX工作使得我们获取了宝贵的问题解决能力与方法,正是因为有了这些东西,即使不做互联网了,也还是能成为UX设计师,就像书中所提倡的那样,不基于屏幕的思考,反而使得UX设计更加强大了。

4|诸多的案例有何启示

案例其一

早期福特汽车公司的Escape设计组想要创造出在自己独具特色的SUV,他们观察到现实中的人们拎着或抱着重的东西走向后备箱时,并腾不出手来,只有脚可以动,并且可能因为东西太重并不想弯腰放下后,打开后备箱再弯腰抱起重的东西放进后备箱,即使通过应用软件,也要掏出手机,点一点再放回去,重新弯腰搬起重物,显然应用软件并不好使了。因此脚踢或横扫式的后备箱开启方式诞生了,他们在后备箱下的保险杠底部安装了一组传感器,只需要你踢一脚或拿脚扫一下,后备箱就开了,对于那些提着重物走向后备箱的人,很容易做到,也很符合后备箱的使用场景。


案例其二

夏天里,停在室外水泥地上的汽车经过一段时间后,太阳的炙烤会让车的内饰变得滚烫。NBC报道称:“在美国,平均每年有超过36名儿童因车内温度过高而死亡。”


而在这个背景下,日产聆风轿车推广了一款能让你车内温度变凉的手机软件,只需提前15分钟在手机应用上远程打开空调就可以,当你回到车内时就是凉爽的,但回到复杂的现实环境,当你投入的看电影、投入的聚餐时,你不一定还记得用手机远程打开空调这回事儿,回到车里时也许还是热气烘烘的。让我们回到一个互联网跟屏幕还不够普及的年代,1991年,面对同样的问题,当时线上技术还很稚嫩,马自达汽车公司提供了一个更加自动化的可选功能,车顶配备太阳能供电,车内使用温度传感器监测,一旦温度超过一定阈值,传感器就会触发散热降温,很巧妙,很自然,尽管还不能克服极端的高温,时间快进到2009年,丰田汽车借鉴了马自达汽车这一经验,制造出了更好的制冷系统,这一功能很受欢,时至今日这个系统仍然可用。

案例其三

橄榄球运动在美国很受欢迎,但也很危险,至少我看来是硬核运动,这种运动时常发生的撞击会导致运动员患上慢性创伤性脑部病变,会引起记忆力减退、思维混乱、判断力减弱、冲击控制障碍、攻击性、抑郁症等症状。事实上在年轻的群体中,大学的橄榄球队员都渴望自己留下好印象,因此他们几乎不会上报自己的头部损伤,在一组730名大学生球员中展开的调查显示,他们的头部平均受到27次冲击后才会上报1次,为此疾病预防控制中心(CDC)研发了一款手机应用,在这个应用上,橄榄球运动员可以了解和挑选头盔更好的保护头部,以及如何察觉头部损伤的迹象,并在遭到脑震荡或其他头部损伤时,知道接下来该怎么做。


但是围绕橄榄球比赛这个场景,柔性传感器制造商与运动品牌Reebok(锐步)设计了一款智能帽子,Reebok Checklight,它是一款运动影响指示器,通过传感器持续的感应头部受到的任何冲击,并通过LED灯光进行信号反馈冲击的程度,就像信号灯那样,并且它能够很舒适的佩戴在头盔中,没有界面、没有菜单、没有选项卡导航或账号密码登陆,尽管他不能代替医疗诊断,但是可以作为额外的参考指标来帮助教练或他人做出判断与选择,无论是继续比赛还是立即就,以保障运动员的健康情况。


事实上这些案例中,确实很精妙的利用技术解决的生活中的需求场景,并且没有使用以屏幕为交互的方式,也同时为用户提供了良好的体验不是吗?案例中描述了设计师是通过怎样的方案来解决了需求痛点,但,你有注意到是通过何种方式洞察到了这些设计理念吗?也许细心的你已经从前面的案例描述读出来答案,观察,这是一种解决问题的好办法,通过对场景对事物对用户行为的细心观察来找到问题的突破口,而这也是让我对潜移默化的UX设计方略有了新的思考的部分。

5|场景化思考与观察的丰富启示

观察是设计思维的重要的一环,我们悉知的以人为本的设计流程便是以观察开始的,而观察与场景有着不可分离的渊源,我们观察用户、观察环境、观察事件等,这都是场景的一部分,我意识到场景化在任何时代任何设计过程中都有必要的价值,对于这一广泛且常常忽视的思维模式,我想以自己的视角来通俗的聊一聊。


面对各种问题,有时候痛点显而易见,有时候根据经验也能够快速看出端倪,有时候就静静的细心观察就好啦,优秀的设计师拥有丰富的问题解决策略,以及各种工具辅助,能够尽快的分析找出问题来并设计出解决方案来推敲,但这不意味着每次面对需求都将进行用户分析、市场分析、数据分析、用户研究、构建画像、构建体验地图、套用设计原则、构建原型、可用性测试等等,这些只是解决问题的方法与工具,帮助我们更好的分析人物&场景&事件的关系,以找到问题根源或解决办法。

平时的工作中,我们更多的是根据习惯与经验完成工作,并且面对各种问题的差异性以及时限要求,断然不会根据一套固定的设计策略或方法来输出,这不见得更合理更专业更高效,问问你自己,每次学了新的设计方法论或工具后你都会在后续的工作中用起来的吗?直到有一天这些方法论、设计模型、分析报告占据了你绝大部分的工作时间吗?我想不是每个项目都会给予设计者如此充裕的时间吧,同事会说,看啊,这个设计真笨,还在输出作证那点儿设计方案的分析材料,真磨唧。而通常老板也不会在意你是用了哪些方法,更在乎的是有没有解决好问题,有没有及时的解决,但是一定不会指责你没有使用用户画像、体验地图什么的,如果有人遇到过,那就是他的需求中期望看到这个。

实际上当我们熟练掌握某些设计策略或工具的原理后,即使不写出来,通过观察与思考也会有结果,这种潜移默化的过程就像是数学公式的应用,当你通过观察获取到了够用的信息后,就能思考出解决的方向,有点儿像韦东奕在接受采访时说的“其实,我真正写的题并不多,“想”的题却很多,能想明白的题目我就不写了”。所以当有人问起你是如何解决的,你说是通过对场景的观察思考,绝不会有什么不妥或显得很Low,但是你说一拍脑袋想的你试试,你看那程序员抽搐的嘴角是想干啥。就此我已经将大量的技法、设计论、工具隐匿起来了,但是场景的概念依旧不可缺失,不难看出为什么说“场景化思考与观察有着丰富的设计启示”,也许你还没有意识到平时的设计工作中,会经常用到这一概念或思维方式,只是没有人给你提示,你还没有意识到这就是场景化的洞察或思考啊。

6|简单有效的场景化思维

我跟一个设计朋友聊起了场景化这个话题,但是我发现对方似乎并没有认识到这个场景化是什么概念,并问我这个场景化是什么,我想了想说:“就是一种找到问题前因后果并有效解决的好办法,并不是游戏场景的概念”。于是又问我是怎样一回事儿,我反问道你们接到游戏活动需求后会怎么思考?对方说一般由活动详情与活动入口构成,例如一个夏日祭活动,是用作消费回馈的,会设计阶段化的消费任务与回馈奖励,刺激玩家进行消费获取超出平常的奖励,为了围绕夏日祭这个盛会主题,需要搭建一个包含游戏元素和盛会元素的场景来承载活动内容、说明、进度、领取按钮与信息,给用户带来夏日祭的活动氛围与内容卖点... 我说等等,这不就是场景化的思考吗?我们综合场景构成的多个因素,并观察思考围绕玩家展开的一系列关系变化与过程感受。

什么是场景

这里的场景不是我们常以为的情景/情境或是某个事件的使用环境,近似场面的意思,场面是指戏剧、影视中由布景、音乐和登场人物组合成的景观,而场景就是某个人在某个时间某个地点因为某个目标在做某个些事,即人物、地点、时间、目标、行为,只是某个环境或情景的画面都不能称为场景,场景能够较好的反映出特定环境下人物实现目标的过程变化,因此不必纠结“场景”或是“场景化”一词,转而注意人物在对应环境下为目标做出了那些付出与反应,剩下的就是观察与思考如何帮助人物更舒服效率的完成目标即可;


什么是场景化

场景化就是将信息不齐全的情景根据关键信息推导或收集完善成一个场景,其目的是因为我们需要特定环境观察或构思服务对象为了达成目标做出了哪些努力,然后我们为此洞察出能够帮助服务对象解决麻烦的方案,但有意思的是在场景化的过程中,有时候不一定非要苛刻的补齐场景的五个因素,就像前面讲的,通过观察人物行为也能够产生人物目标的收获,记住场景化的重点是观察或构思人物为了达成目标在特定环境下做出了哪些努力,基于不同的情况,有些次要因素我们可能不会太在意,例如我们在讨论手机电筒的使用场景时,我们就不会太在意时间因素,反而昏暗的环境与亮度更重要,所以场景化时要灵活一点,挖掘有价值的因素而不是凑齐所有因素,常见有以下几种情况:


7|作用与价值体现

场景化的视角代入作用

场景化还有个作用就是让自己更融入,算是同理心的一个窍门。我们在具有复杂性的功能自测时,我们不会只是反复的在界面上进行交互,这样的往返操作容易迷失自己,甚至忘却了我在哪儿,我在干嘛,这种情况用设计心理学描述为“记忆失效性失误”,对此,我们的解决办法就是设定场景,我们会简单的代入一个用户视角,并给自己设定一个匹配功能模块的需求目标,使得整个场景看起来合乎情理,然后带有目标的进行功能测试走查,如果这个过程中那里走不通了,不好用了,那就意味着这里的设计有问题,当然了,如果你是功能Bug测试,那我建议你找测试工程师要一份测试用例好了。

场景化的痛点&需求洞察

场景具有诸多变量,通过观察状态的变化,用户情绪与行为变化、以及实际场景中常见的干扰事件,都能为我们带来诸多的设计启示,我们可以利用起来,为用户提供更多的需求可能或是避免问题,就像车饰中的杯架,一开始汽车制造商们并不会觉得一个交通工具的驾驶室需要杯架,但是通过对真实场景下的观察与客户研究,不起眼的杯架竟然能为用户带来良好体验,以至于杯架会成为汽车内饰的广泛标配,这些巧妙的设计并不是设计师突然的灵感或浑然天成,这正是因为对场景的观察以洞察出的用户需求。

场景化可以让我们找到问题在哪儿发生了,并且问题根源大概是什么,会有怎样解决启示,而不是因为数据或结果发现了问题,在有限的认知下就问题进行错误或肤浅的设计解决方案,还记得肥皂厂对空盒子过滤的案例吗?A厂的设计师们发现了会有空的肥皂盒在流水线上,并且设计了高级的X光检测仪来改进生产线,但是B厂的设计师却根据观察找到了更好的解决方法“电风扇”,是的,B厂直接通过电风扇将质量更轻盈的空盒子吹到了一旁,那么你是老板,出于成本与研发周期,你选择哪个方案呢?


即使是线上场景也不例外,知道微信在直播场景时,收到的通讯消息已经采用了浮窗进行交互嘛?你也不想在看到精彩的时候却要关闭直播切换窗口去回复消息吧,这便是基于场景化的思考,微信为你提供了更多的直播观赏空间,而不会因为临时的消息回复使你不得不切换场景进行其他的的轻量化事件。

这便是场景化的魅力,我们可以找到真实问题的根源,并且能够充分的理解人物与环境与事件的关系,有很多设计师能够很巧妙的解决问题,并不是因为直觉或天赋,实际上更多的是结合了场景化的思维与洞察,而这并不困难,你也可以。

场景化的以用户为中心

在某个场景中,使用你产品的是谁?他们有什么特征,场景为他们带来怎样的感受,他们会面临怎样的问题或需求?这都是场景化中以用户为中心的表现,我们很清楚产品的使用者是谁,购买者是谁,我们采用场景化去打磨产品并不是让产品在场景下显得更加美观,而是让用户拥有更好的体验,其次才是美观,而作为设计师就不能以自己独到的设计理念来完全代替用户了。

事实上几乎没有一款产品是面向全人类的,出于人文差异、社会特征、个体特征、使用门槛等,做不到如此强大的兼容能力,过分兼容往往也会使得产品有缺陷或不伦不类,考虑的产品的功能作用以及商业价值,企业都会锚定一些具有某些特征或对应需求的用户群体,这样才更有机会成功,而不是迎合所有人,并且有时候还要进一步的区分用户与特征,例如使用者可能是一只猫一只狗,但是购买者往往是养宠物的人,这个时候还要顾及购买者的偏好,而不只是局限的观察场景下的使用者如何与产品交互,场景下购买者的动机与目的也是重要的,而那些线上应用就更不用说了,同一批人可能有不同的使用场景,同一场景下的用户可能会有不同的特征,识别他们的共性与差异性是以用户为中心的重要工作,为此我们可能还需要对场景下的用户进行分层,甚至允许定制化。

除了以上说的用户群体与特征,人文差异也是场景化下值得关注的问题,需求往往是来源部分用户群体,迎合他们的人文特征可以更好的促进用户使用和购买的欲望,在产品出海设计的过程中,人文差异往往是极其重要的,因为使用场景从国内变成了国外,如果不密切关注场景下的人文变化,出海则基本会以失败告终,例如我们传统的驾驶位在左边,而部分国外的是在右边;我们很多人爱吃的烤猪蹄,在印度却不受欢迎;我们大多人阅读是从左到右,而部分国外却是从右到左。一旦场景发生了变化,我们就应该密切关注人文是否要做更新的思考。


综合性的思考方式

此前已经解释了,场景不是单一的情景,并且存在各种变数,甚至都不是静态的,我们使用场景化思考时,一定不会局限在产品本身的流程或交互上的,也不是某个或多个人物上的,所以在场景下观察时,注意力不该在单一的对象上,而应该覆盖场景化的多个重要因素上。并且场景会给出用途和一些对应关系的特性,像我们提到某个需求时,研发的同学会问是那个场景,其实就是想要了解这个场景在哪里触发,场景下的用途是什么,用户与目标是什么,关联了那些技术栈等等。如果我们在观察某个场景时,出现了意外或小插曲,作为设计师就应该警觉起来,而不是认为只是意外,不会再发生,毕竟古人云“无独有偶”。所以当你奉行场景化观察或是思考时,就不会过于局限,反而会具有综合性的思考过程,这能让结果更加可靠和易于理解。


8|开展场景化思维的窍门

贴近现实

几乎出现的所有问题都是有根源,有场景的,我们拿到需求却还是要分析需求,其目的就是找到根源,而不至于在虚假的问题或需求上窘迫的发力,而最终得到一个跛脚的结果,问题的根源常常是无比真实和深刻的,而我们结合场景化思考时,就应当贴近现实,而不要简易的虚构一个不真实的场景去匹配和思考问题,这个过程中要尽可能的追寻真实的环境,匹配的角色,更实际的问题,这个时候我们眼里的场景才有效,而不是做戏或是走个形式,并且最终你的解决方案是要搬进现实的啊,并不是以实验室的结果来定义真实的场景发生的事物,即使是模拟也是在模拟更加真实的场景不是吗?

顾及变量

倒上一杯水,抓来一碟零食,关上了窗帘,窝在椅子上,一切刚刚好,我沉浸在女鬼桥这部鬼片的精彩桥段里,我屏住呼吸,高度紧张的注视着,心里预测着下一个镜头将要如何如何,哐当一声,吓得我直起身来,其实女鬼还没有出现,但是我的猫先出现碰倒了我身后的物件。

场景化不再是理想派了,意想不到事件正在场景中发生呢!

对于场景化,几乎没有可能与我们预期的一致,场景下会有各种变量也应该有各种变量,把场景定格后应用是不对的,它应该像一个故事一样,有过程有发展变化,事件的发生、人物的行为、情绪的变化、环境的变化都是场景变量的一部分,越是忽略这些变量,越是会出现更多问题,因为这些变量会直接影响用户的行为决策与结果。交互设计师做特殊场景状态(常见有设备兼容、异常操作、网络问题,非常规操作等)的兼容与防错,不就是很好的体现吗!拆分出更多的意外场景迎合做出兼容方案反而会多出一些细微的体验差异,例如华为手机的消息通知会有自动收起内容的情况,其启示来自于真实的环境下,背后会有其他人窥探到你的个人信息。 


于此同时我们也应该清楚自身产品的局限性,我们做不到能应对各种突发事件的程度,所以设计出适当的约束来避免问题也是蛮重要的,大抵我下次在家看鬼片会先把猫关起来吧。

情感化

场景化、情感化似乎在现在的设计中经常被提及,如果把场景化比作一面灰色的墙,那么在墙上绘制多彩的小花,人物也露出愉悦的情绪,这些便是情感化的色彩,情感化传递的是一种情感价值和温度,在产品使用的场景中,我们可以结合特定的时刻来打造情感化设计,可以是通过氛围传递情绪,例如新年,产品视觉焕然一新,年味十足。又或是触发回忆,帮助用户想起那些有价值有温度的回忆画面,总之在适当的场景引起用户共鸣是一件很有温度的体验设计,哪怕只是在南京大屠杀的公祭日将线上产品的彩色斑斓抹去,也能感受的产品的情感关怀与社会价值观,总之识别出有意义的时刻,不论是节日盛典、解锁成就还是目标达成,我们都可以通过具有仪式感或视觉氛围的设计方式传递情感,让用户感受到产品设计的用心与别致的体验,这也是场景化中的环境与时间因素的识别与运用。
但值得注意的是,情感化不单单是符合特殊时刻或环境的打造,只是说就让用户觉得好看或就该这样有时还不够,情感化更多的是期望与用户情绪建立共鸣,引起用户反思,试想一部电影,为什么有的人看哭了,有的人没有反应呢?很大一部分原因就是看哭的人更投入,剧情经过了用户的反思与共鸣,从而调动了情绪才鼻酸落泪。

常规性

常规性是一个很重要的部分,它包揽了以上多个部分,常规的情景、常规的流程、常规的客户、常规的问题、常规的信息、常规的操作、常规的行为习惯、常规的难度、常规的文化差异、常规的认知等,常规意味着产品符合大多数客户群体的认知、习惯与使用情景,这能够大大提升易用性和兼容性,当设计无法接近用户认知就会变得难以理解和使用,随之门槛变高,而设计者不一定是产品的常规使用者,而常规性不仅能够使得场景化更加贴近现实,也抑制着以设计师为中心的弊端,最终保障设计模型与用户认知模型能够靠拢。


但过分的常规性也会成为创新的绊脚石,不论是渐进式创新还是颠覆式创新,依旧会保留一定的常规性,例如常规的地域文化、常规的理解认知、常规的信息维度等,但也肯定有不常规的地方,那便是它独特创新的部分,这意味着我们需要找对创新的场景,创新的部分,以及创新内容的本质与规则,要知道打破规则是一种创新是一种变革,但是前提是你得清楚规则的本质是什么,胡乱一通的创新往往达不到更好的效果,容易忽视其他变量与常规性。


这让我想起来《设计心理学3》中,唐纳德提及的指环王中创新的语种里的两个词语,一个是金属另一个是雪花,尽管这个语种里的两个单词看起来是如此的陌生,但是大多数外国人还是能够猜对那个是金属那个是雪花,因为金属的单词中包含了两个爆破音,更具有重金属的味道,而雪花的单词则具备斯斯的发音,显得更加轻盈,这源于人们对现实生活场景的理解与认知作用,这也是常规性。

9|结语

通过《无界面交互》,看见了应用软件的发展简史,看见了软件对生活服务的影响力。还真就是那句话,“当我们习惯使用软件后就需要更多更多的应用软件”,随之利弊也变得更加清晰可见,人们生活方式与行为习惯也对应发生着转变,变得是数字化的服务方式,不变的还是各个场景下的需求与优化创新,就像我上一篇关于用户行为与触发式引导的文章中描述的那样,应用程序提供的是完成需求的功能,这意味着行为方式或成本的变化,但是本质不变。

虽然书中作者批判了屏幕的种种罪恶,但是现阶段发展离不开电子屏幕的存在,或许这就是发展进步中不可避免的一些矛盾与牺牲吧,谁知道作者现在有没有躺着椅子上用手机刷TikTok呢?不过作者唾弃的以应用软件来应对各种需求服务的方式,倒是认可的,应用程序解决需求不是一劳永逸的办法,创意创新也不止于界面,最终还是要回归场景与需求的探索,朴实无华的点子依旧受欢迎。

而聚焦生活服务类的场景与需求,我认为物联网与人工智能反而是以后更好的解决方案,我在之前的一篇关于物联网交互创新探索的文章中也有归纳过物联网的特征趋势(注: 有兴趣可以在往期文章中找到,有图解不枯燥,值得一看),即自动化、智能化、云计算、傻瓜式、联动性、可视化,我认为这些特征都能很好的满足无界面交互中潜移默化的UX设计理念,而作为这些生活服务类的UX设计师,了解和熟悉物联网技术也显得尤为重要。

作者:PP_PAO
来源:站酷

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加微信ban_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~
希望得到建议咨询、商务合作,也请与我们联系01063334945。 

分享此文一切功德,皆悉回向给文章原作者及众读者. 免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司 

标签: 用户体验 设计趋势 ui 网页设计


交互设计十大原则

博博

十大交互设计原则-尼尔森十大可用性原则

交互系统设计的目标可以从“可用性”和“用户体验”两个层面上进行分析,关注以人为本的用户需求。

交互设计有许多的方法和理论,如格式塔心理学原理、尼尔森可用性原则、7±2法则、3次点击法则、功能可见性原则、菲茨定律等。

详解尼尔森十大可用性原则

一、预见性原则

系统应当在适当的时间内快速让用户知道当前所处的状态,即无论单击、双击还是滚动都会给用户一个反馈,让用户对过去发生、当前目标、以及对未来去向有所了解,防止用户出现错误操作。

常见的反馈有刷新提示、加载提示、支付提示、下载提示、进度提示等(具体见#产品中的反馈机制#文章)

示例:进度条、已读文章标题变灰



二、场景化原则

软件的使用更符合现实的场景,通过直观的视觉来贴近真实的世界,比如使用易懂和约定俗成的表达。

示例:图标ICON等图形化手法代替纯语言文字(音乐播放转盘)



三、可控性原则

产品需要支持用户“反悔”,即在用户出现误操作时,需要给用户提供“紧急出口”,做出“撤销”“返回”“取消”“重做”等功能。

示例:微信聊天的撤回及重新编辑功能;备忘录的恢复删除功能



四、一致性原则

产品的信息架构、交互方式、视觉表现等应该具有一致性,主要包括结构一致性、色彩一致性、文字一致性、操作一致性、反馈一致性



五、防错原则

给用户错误的提示不如在用户发生错误之前避免它,可以帮助用户排除一些容易出错的情况,或者进行二次确认。

示例:微信朋友圈编辑内容后点选返回会出现是否保留此次编辑的弹窗以及在付款页面等重要操作之前给出弹窗是否确认支付,银行卡号输入时自动以4位数字为一组便于用户输入防错



六、协助记忆原则

将用户的记忆负担最小化,尽量减少用户记忆信息,应该提供信息让用户辨认。

示例:淘宝的搜索功能,使用关键词联想要搜索的内容,避免有些商品名称记不全可以轻松搜索到;引导页的新功能提示



七、灵活高效原则

既能保证第一次使用者能清晰明白功能,又能给老用户提供更高效的使用方式,允许用户可以定制常用功能。

示例:支付宝首页可以自定义放置常用功能;饿了么订单页面支持用户再次购买上次的菜单,不需要重复选择



八、轻量简约原则

去除冗余和不相关元素,适当留白,让功能突出,不会分散用户注意力,简洁精致的图形能留下深刻的印象。

示例:知乎、简书等内容为主的产品,减少元素使用,让用户聚焦内容,提升用户体验



九、容错原则

尽量帮助用户从错误中恢复,让损失降到最低。指出错误信息,并给解决建议。

示例:word的自动保存功能;登录页密码输入错误,给出错误提示并修改建议



十、人性化帮助原则

当用户需要帮助时给予用户适当的帮助入口,帮助文档要易于查找, 专注于用户任务。

示例:微信 、淘宝等页面的帮助与反馈




作者:Nanngua      来源:站酷

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加微信ban_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~
希望得到建议咨询、商务合作,也请与我们联系01063334945。 

分享此文一切功德,皆悉回向给文章原作者及众读者. 免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司 

一起来了解“交互设计文档”吧

博博

大部分的设计师应该都没有见过所谓的“交互设计文档”吧?在实际工作中,所谓的交互设计文档是由交互设计师所输出的,但是大部分的互联网公司是没有交互设计师的。交互设计师的工作内容被UI设计师与产品经理相互分摊。那公司为什么不招聘一个交互设计师岗位呢?(boss:呵呵~一个人能完成的任务为什么要两个人!)
所以本篇文章为了让我们设计师能够很好的了解什么是交互说明文档?它是干嘛的?有什么用?如果制作?有哪些内容等多方面全面了解。(哪里有了解的不到位错误的地方,也希望各位大神多多指点相互学习。让我卷~)

一、交互设计文档

什么是交互文档?

交互文档,即交互设计说明文档(英文名“Design Requirement Document”)。又称“DRD文档”。用来承载交互说明、交互原型、项目背景等内容,存档并交互项目相关伙伴的团队协作文档。

为什么需要交互文档?

也许你想到:什么?交互文档(DRD)我压根没见过,这难道不是口头说说就行嘛?无需交互设计师。(大部分公司的交互文档是由UI设计师/产品经理来撰写)但是有的公司产品也分担着UI设计师的工作.......只要你如果优秀干啥都行,不优秀话语权都没有。(比如我们这些“小美工”。职位只是对一个工作的划分不代表对你能力的划分,只是公司的一种小手段~

回归正题,作为交互设计师,工作职责起到“对接上下游,承上启下”的作用,不论是在方案评审的讲解,还是日常的工作沟通,都应具备优秀的沟通能力、语言表达和DRD表达能力。而DRD不仅能完美的诠释出产品的内容和需求,还能够为产品出一套完整的设计规范,让产品保持一致性,方便团队协作减少沟通成本,也方便后期的修改。



DRD是利于团队协作的媒介,也是产品规范与项目总结的重要输出文档。

交互文档给谁看?

交互文档撰写并不是只有给自己看,最重要的是给:产品经理、UI设计师、开发(最需要)等等。并且作为交互设计师的输出物,交互文档是联系开发流程上下游的重要文件,它需要具备良好的可读性、唯一性和时效性。

产品经理

首先不同公司,不同团队产品经理与UI/UX设计师之间的配合输出物是不固定的。

1. 大部分公司,产品经理细心点会连交互说明和原型一起出了(包含在PRD文档里),但是大部分会出现体验层的漏洞。

2. 如果公司产品是负责传一句话,有交互设计师的情况下,交互需要从功能规划、信息架构、原型说明一起搞了。

3. 还有在小公司比较罕见的流程就是产品搞PRD,交互搞交互文档,彼此之间的逻辑可以互相印证。

UI设计师

作为交互设计师的下游,我们也需要较早的介入需求沟通之中,提早避免后期可能存在的问题出现。

(但是很多时候交互设计师就是我们自己)


开发(前端设计师)

开发是最需要看交互文档的重要成员之一,因为他决定着产品的逻辑以及页面的跳转流程、交互方式、动效方式等等。(不过大多数公司只有简单的PRD文档,开发也只是简单看看~)

二、交互文档(DRD)如何撰写?需要有哪些内容?

你习惯用什么工具撰写交互文档?PPT、Sketch、AI、Axure … ?
你习惯用什么格式输出你的交互文档呢?PPT、PDF、HTML …?
其实使用什么工具都无所谓,只要能够正确的描述出交互文档所需要表达的内容和逻辑就行。(就是谁都看得懂)



我比较喜欢使用Axure软件撰写交互设计文档,大家可以根据自身爱好或者公司规定进行选择(例如sketch、figma、PS等等..都是可以的。

说了这么多,究竟交互文档包含哪些内容呢?
一般来说,一份最基本的DRD文档需要包含:DRD封面、更新日志、文档图例、产品背景、页面交互、业务流程图、交互原型、回收站等模块。



DRD封面

DRD封面:包括产品/项目名称、版本编号、撰写时间、撰写人等基本信息。按需可增加参与该项目的各方负责人。(如:产品经理,交互设计师,视觉设计师,开发,测试,团队名称等)



更新日志

更新日志,包含具体新增或修改的内容,修改人,修改日期等信息。在实际工作中,方案的修改和优化是不可避免的。更新日志方便项目成员一目了然关注到重点更新的内容,也方便开发找到对应的负责人进行沟通,提升工作效率。



文档图例

针对你在该文档所用到的图例进行说明,辅助阅读(如:操作/跳转图例、标签图例、流程图例以及手势操作图例。)。特别适合刚入团队,首次阅读你DRD文档的人来讲,是非常有利于团队成员对你文档的理解。



产品背景 

可包括一些项目背景、需求分析、用户调研、竞品分析等。用于设计思路的整理和记录,方便阅读,方便参与评审会的人理解整个项目背景下的设计思路,也方便日后总结与沟通。但无需将所有的分析内容都放入,结构化整理重点内容放入即可。



业务流程图

业务流程图的目的就是梳理并分析优化业务流程。我知道很多同学做UI设计师的时候可以完全不管业务,直接做设计,但是作为交互设计师了解产品业务是非常重要的,因为不了解业务你就无法完成交互设计,优化业务场景。
举个例子:在教育考试系统中一般流程是:教育局出通知→学生报名考试→老师审核→报名通过→老师编排学生考试名单→学生开始考试对号入座→教育局公布成绩→学生查询成绩→考试结束,看这一些列的流程,因为关联特别多,如果对业务不熟悉的话设计起来会非常的不便,如果前期因为业务流程不熟悉而设计出错误的交互稿的话,后面就会特别麻烦。

如何绘制业务流程图?

一听: 先听客户/产品介绍。以最简单的方式了解产品重点,即基本要素中的角色、活动、协作关系梳理出即可。
二沟通: 完成上一步后,就可以进行提问了。主要是沿着流程进行发问,重点放在分支、产物关系上。看看是否存在分支的情况,各协作之间是否有交付物。
三确认: 最后一步就是自己讲一遍流程,和客户代表或者业务产品进行确认是否有理解偏差的地方。



以医院APP取号业务为例

页面交互

页面交互是交互文档的主要内容可以详细说明界面中元素的来源,控件的交互方式,数据的样式,字段的长度规定,页面元素的状态变化等。每个交互页面的内容应该包括:文档页面标题、界面标题、界面、设计说明。

文档页面标题:一般在每一页文档的顶部。写明当页内容是属于哪个模块或流程的,让看的人不容易迷失;
界面标题:注意命名,方便交互稿中的互相联系,如“跳转【XX页面】”,“回到【XX界面】状态”;
界面:界面尺寸建议按实际界面的比例缩小,避免你想当然的设计并不符合规范,也避免一个界面太大影响阅读效果;
设计说明:逻辑关系、操作流程或反馈、元素状态、字符限制、异常/特殊状态 等等,都可以放在设计说明中;





作者:不知名小明      来源:站酷

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加微信ban_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~
希望得到建议咨询、商务合作,也请与我们联系01063334945。 

分享此文一切功德,皆悉回向给文章原作者及众读者. 免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。 

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司 

专访腾讯交互设计师对话?

纯纯

随着互联网的发展与深化,很多服务早已从线上渗透到了线下,腾讯CDC在服务设计课题上都做了哪些探索?

 

从互联网走向传统行业,互联网金融与保险的线上和线下的探索,是相对来说比较典型的尝试,让我们感受到从互联网到传统行业的融合,这个过程也可用过往积累的互联网理念完成。只不过从做线上线下相结合,到向其他领域扩展,工作环节和内容越来越复杂。

 

我们有十几年互联网用户体验设计的经验积累,并以此做出了工具和平台,比如一直在对外推广的腾讯设计云服务——腾讯设计体系TDesign、内部设计协同和设计管理工具 CoDesign和ProWork。用户研究也是我们多年专注的领域,2022年腾讯调研云将正式对外发布,当前已上线的工具是腾讯问卷、腾讯兔小巢、卷叔填填圈已经在互联网及传统行业中被广泛应用。

 

腾讯在产业互联网领域始终在做着前沿领先的服务。国家政务项目“数字广东”的集成民生服务小程序——粤省事,“一站式更省事”的指尖办事模式已成为全国在线政务服务的标杆工程。

 

互联网公益方面,在环保领域的动物保护上,使用腾讯AI技术结合服务设计,做了“雪豹保护”项目,为动物保护专家、守护员,提供一套线上动物识别的服务,帮助他们在艰难的户外环境中提高工作效率。

 

我们通过技术工具平台,联动社会公益机构与志愿者解决问题,正在研发的长城保护的服务设计项目,引入专家复原长城,希望公众能了解更多长城的知识,是继“云游敦煌”项目之后又一个广受人们关注的世界文化遗产保护工作。

 

近两年我们也在公共服务领域有很大的投入,比如社会应急服务升级,包括急救与突发社会事件的响应该如何更好去应对?2021年下半年开始又在全面关爱大众人群,包括儿童与老年人心理健康的社会服务上。比如,通过网络实现心理健康方面知识的传播、让社会机构与志愿者能及时对接上需求,形成心理专家与社会机构之间形成服务闭环,为社会建立起民众身心健康的防线。



 

从用户体验到服务设计,它们之间有着怎样的关系?

 

用户体验的关注点更多在用户使用服务时的感受如何,而发展到服务设计层面时,我们除了关注用户体验外,也会关注服务提供者这一侧的需求。

 

服务设计与用户体验设计的理念和工作方法一致,但服务设计体系更复杂。做互联网产品时,人机交互的设计流程相对更容易固化,只要程序的交互设计过程没有大偏差,用户的使用体验就不会太差。

 

服务设计的工作往往同时涉及线上和线下。线下服务场景中,不但要考虑多设备联动,还有人对人的一整套服务流程。比如做金融、做政务的项目,它们的服务会涉及到政策、法律法规和各种标准,都是我们做服务设计时的思考点。这些标准制定方,有很多不同的岗位角色为公众提供多样化服务。

 

与做产品不同在于,产品设计往往面向特定的服务对象,而政务类的服务设计,面向的是所有人,每一位公民都享有平等被服务的待遇,于是复杂程度是几何级数提升,但其中一脉相承的原则是以人为本。腾讯的经营理念始终是一切以用户价值为归依,从人机交互的用户体验设计,到服务设计,以用户为本的核心前提不变,只是复杂程度的增加。


粤省事小程序是一个基于移动端的聚合式政务服务平台。以这个项目为例,设计团队探讨了基于互联网的设计理念与传统政务服务相结合的模式,来推进产品体系中各模块的设计工作,为整体重塑广东电子政务服务的远期目标积累了重要经验。


过去是群众在一个个政府部门面前排队办事;现在是我坐在这里,一个个政府部门在我面前一起办事。小程序是一个开放接入平台,政府各部门愿意接入哪些移动端的业务能力,就接入哪些业务,是自下而上的设计。▼


在解决方案上采取以办事为中心的信息架构。 ▼


我们希望用户一进入粤省事小程序,有一种“这就是我的”那种感觉。他们可以直接打开自己的电子身份证、电子护照、电子驾照等等,就像打开自己的钱包那样。小程序采用了以证件为中心的主程序设计。 ▼

 

以我能办什么事为中心的二级页设计。 ▼

 

设计带来的一个突出的变化是,从“罗列服务内容让用户来找”转变为“深入了解需求,把服务打包好送到用户面前”。在实际设计过程中,我们重点重建了服务的使用场景。把可以分角色分阶段展示的功能拆分开,根据具体服务场景更聚焦的去展示内容。▼


为了更高效接入100多项服务,采用了模块化的设计方法。将业务整理分类、抽象出最基础的业务模型,得出办事模型。以下模型可以涵盖小程序现在接入的70%的办理业务。再针对单个模块进行细化设计,让不同的过程以拼积木的形式组装完成,从而实现符合规范的个性化接入。▼




对于腾讯CDC来说,做公益项目与商业项目间最大区别在哪里?

 

自从有设计以来,一切就是在以用户价值来考量,核心的经营理念是用户价值与商业价值之间的博弈。在设计决策上,此前更多是在两者间取得平衡,但近几年想法有了升级,在我们看来,仅是用户价值与商业价值之间的关系已经不够了,要能站在产业层面去看用户和商业,如何能通过提升产业环境,来实现社会服务的提升。

 

团队做B端服务,希望能通过挖掘过往经验,做更多社会创新探索,与整个社会大环境提升有更好的结合点。这时用户的概念就延伸了,用户不仅指接受服务的人,也包含了服务的提供者——产业涉及到的每一个环节中的每一个角色,每一个具体的人。

 

比如互联网应用适老化改造项目开始推进时,通过优化界面、简化程序、增加功能等方式,来适应老年人的手机使用需求,然而用研的同学发现,改大字号,或者是语音交互等,仅仅是让长辈用手机购物更方便,解决的是“更好用”,却依然没有解决“不会用”的问题。银发青松助手作为线上版本的教程,对所有参与项目的同学来说,都是全新又极富挑战的领域,一边结合现有适老化改造经验,一边通过可用性测试不停地发现和解决问题,然后把解决方案体现在这个小程序里。


又比如腾讯首个雪豹保护数字化平台,用AI技术识别雪豹,优化雪豹的数据录入、处理、分析流程,解决一直以来动物巡护员主要靠红外相机、传统表格记录、人工审核照片等耗时费力的雪豹保护中等困难。▼




创新是每一个设计领域中的关键点和难点,服务设计中的创新点和基础是什么?

 

创新的基础是挖掘社会价值。以团队提供的设计云服务举例,如果我们看重商业价值,就会从产品设计与产品运营角度出发,看它能够覆盖多少设计师、多少B端企业购买我们的服务、营业额等等,这种逻辑是商业价值所寻求的。但是当我们去寻求社会价值时,这些商业逻辑中的问题,至少就不会放在首要问题的列表中了。

 

我2003年入职,是腾讯的第一位专职交互设计师,当时对设计的认知很浅,幸运地进入互联网交互设计领域,入行不久就意识到这是一个有前景的领域,然而成长过程中有很多迷茫困惑与困难,我认为仅凭个人力量很难做好工作,每个人都生活、工作在一个个环境中,需要小环境、大环境与自身的配合;只有当环境变好时,自己才会更好。我们本着这样的思考和理念,首先努力打造公司、专业领域的小环境,同时也不断影响行业、产业大环境,每一位设计师才会有更好发展。

 

作为交互设计师,过去听得最多的词是“人机交互”,但我常对别人说,交互的最高境界是人与人的交互,因为机器是人设计的,机器的另一端也是人。而服务设计就是“人人交互”。

 

在做互联网金融行业的服务设计的时候,我们陆续与许多金融界同行交流,他们对用户体验设计的方法与工具抱有极大兴趣,希望我们能对外提供服务,我们也认为更多人变好才是真的好。这是社会价值的体现,是我们做设计云服务的出发点与创新点。

 

除了做工具外,我们会不断输出理念,做一些行业观察,比如每年发布的互联网新兴设计人才白皮书。

 

团队也一直沉淀工作经验,陆续出版成书,希望能从产业一线的需求与视角出发,去帮助想要从事这个领域的其他团队和个人。

 

在人才培育上,都在讲产学研一体,我们在与高校在招聘、实习生培养上的合作基础上,2021年CDC与南方科技大学、深圳大学等高校进行超越以往的深度合作。过往与高校的合作模式是课题式,只让老师带学生做课题,以此帮他们感受来自产业一线需求的探索,从而了解真实的用户、团队的工作方法,我们也会将学生的创意转化成产品、服务和工具。在这种合作模式下,学生们的基础还是由学校自己去培养,课题只是实践。

 

2021年我们与深圳大学开展的是微专业合作,与学校一起跨专业、跨领域招生,将团队的工作方法和理念,形成一套1-2年的课程,从更基础的层面去告诉学生们学什么?怎么学?学成之后怎么用?同时我们也为同学们提供职场实习机会,让他们更早了解实际工作与产业的需求,他们才会更明白自己在学校里的学习目标。

 

与南方科技大学的合作是探索共建无障碍实验室。我们提供更多真实用户的样本、数据和诉求,让学生们了解用户,去探索可能性,也会将这些创新点回归到产品上,以验证这些研究是否卓有成效。

 

让产学研有更好结合,是CDC寻求社会价值的新方式。希望能从学生抓起,从学术与研究的结合处做起,让社会里更多相关领域的人一起探索和进步。腾讯CDC只是其中的一环,通过服务设计提供更好的触点和界面、更好的工具与环境,将产业中的每一个角色卷入进来,大家在其中都能迸发出新想法。环境培育起来后,慢慢将会诞生新产品、新物种、新理念,这与我们过往做任何一个界面设计、用户体验设计都不同。

 

云游敦煌,是由敦煌研究院、人民日报新媒体、腾讯联合推出的,首个拥有丰富的敦煌石窟艺术欣赏体验的微信、QQ小程序。▼




在后疫情时代,人们的需求,以及你们在做设计项目时思考的方面有变化吗?

 

疫情之后大家都在面临很多变化,不论工作、生活还是大环境。我们会思考如何才能更好去体会人们新的难处,帮助他们解决问题。

 

2015年9月,腾讯公益慈善基金会发起人兼荣誉理事长陈一丹先生,在第一届腾讯99公益日上说:“社会的痛点,就是公益的起点。”对于我们设计师来说也是一样的,思考出发点不再只是从用户体验的角度,不仅仅去做锦上添花的事,而是思考真正的痛点在哪里,落到以人为本的根源去做事。

 

“微光行动“是腾讯联合深圳网警、专业心理辅导团队共同发起的网络抑郁症群体的关爱活动,期望帮助大众更好了解抑郁、正视情绪,并通过微光小程序等渠道,为用户提供线上情绪出口,进行心理健康的正向引导。


抑郁症已成为人类第二大杀手。国家卫健委去年发布的《探索抑郁症防治特色服务工作方案》中,将老年人、青少年、孕产妇、高压职业从业者都列入抑郁症高发的重点人群。大众对抑郁症等心理疾病科学认知不够,甚至存在偏见和病人的病耻感,加上专业医学、心理学领域专业门槛高,让抑郁症救助难度增加。在这样背景下,微光行动小程序,我们在产品上增设专业科普资讯、暖心电台、书单、音乐等治愈系功能和内容,并计划去连接用户与专业心理咨询师,针对线上线下两种就诊模式提供了相应心理援助和医疗帮助。




完成一个典型的服务设计项目,通常需要哪些人员参与?

 

我们理念一直都是除了设计师、研究员外,尽可能多卷入不同角色的人员参与项目。

 

过往大家对CDC的认知是设计团队,但现在我们已不再只是设计团队,设计师也不是团队中人数最多的职能。现在团队人员包含研发、产品经理和产品设计的全流程岗位,还包括产品运营与市场营销。


除了团队成员外,项目中还会卷入不同的外部角色,比如将客户、社会上的服务对象,卷进项目中。为此,我们做了用研工具卷叔填填圈,适老化的项目中,为了更好更快完成改造工作,我们就在填填圈中沉淀老年人样本,让大家能更容易触达到服务对象。

 

卷叔填填圈小程序 ▼




2016年之前你们就开发出了对设计师及项目管理效能帮助很大的平台工具设计云,这几年团队有没有新的挑战?

 

设计行业对效率的追求永无止境,然而挑战一直都存在。一个核心问题是如何才能不再做重复性工作?除了项目管理平台以外,我们还做了提效工具,尽可能不去浪费设计师的时间。它们集中解决两个方面的问题——生产怎么做才能更快?有更多人协作项目,不同职能角色间工作流程如何缩短?

 

ProWork 是 CDC 在腾讯内部沉淀多年的便捷高效的协同平台,为团队中的不同角色提供支持。团队成员可以通过日历、清单来规划每⽇的工作,同时管理者也可以通过统计报表随时掌握团队状况。通过简单灵活、多角色统筹、任务量化统计的产品特性,实现日程管理、项目追踪、人力统筹。▼


另一个方面的挑战是对新方向的探索和尝试。在这个层面上不是工具做好了就能解决的,为什么说我们的很多项目叫社会创新?因为我们必然会尝试未曾接触和了解过的服务。它们可能成功也可能失败,如何才能缩短从失败到成功之间的距离?如何降低试错成本?这些都是CDC面对的新挑战。




工具智能化以及设计师如何才能不被AI替代是近年来被广泛讨论的话题,基于数据的设计、智能化的边界在哪里?设计师的核心价值随着时间是否有些改变?


照相机出现后画家还有生存空间吗?我觉得大家应该开心拥抱AI,因为AI永远不可能替代人类,但可以帮我们节省很多工作时间。


回顾工业设计发展史,从手工到工业时代,再到大生产时代,一直分两派,一派做工具,一派做设计,有人做组件、模块和结构,有人使用它们去做产品。只有组件和工具在持续创新的基础上创新才能更快。


用户体验设计如今正踏上这条自动化道路,我们如何才能更好走下去?都说现在是工业4.0时代,大家已经在用数字工具做设计了,但和许多工程领域相比,我们依然落后,还有很多设计师在做重复性的投入,其实一些设计工作是可以用智能化工具去“拼装组件”的。这就像手工业时代,每一个组件都靠手工打磨,而大工业时代只需到市场上采购零部件,产品就可以组装出来。


AI帮助我们做设计,而不是替代我们做设计。设计师的关注点应是如何更好利用工具提升设计产出。自动化生产能让设计师更好地释放劳动力,才能孕育出更多可能性。让重复劳动交给机器,当你的时间和双手被解放之后,头脑更活跃,创新也就更活跃了。




大设计奖的主旨是发现与提升设计的价值,设计团队从哪些方面建设和提升,才可能成为公司的战略核心组成部分?

 

很多设计团队往往是“一只手”,需求方要什么,设计师就呈现出来,但设计还可以成为公司的大脑。进一步提升设计的价值,意味着设计需要从技艺上升到设计思维,不仅探讨如何使用工具、做好图形图像、界面和各种效果图等工作,还要思考如何让设计思维成为促进经营的工具,去挖掘商业模式、社会创新,探索新型社会服务的可能性。




作者:大设计奖 来源:站酷

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加蓝小助,微信号:ben_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系01063334945。

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

交互设计 | 信息流提高转化的策略

纯纯

起初由Facebook在社交行业重新定义为News Feed,现在被大量用在电商、社交、资讯类等领域。信息流突出卡片的信息,用户可以无限制地下拉刷新,偏重于“沉浸式”的体验,用户可以在里面“逛”起来。 


undefined




那么问题来了,在处于这样闲散的“逛”的状态下,怎样提高用户的转化率,让用户在Feeds中产生点击行为?有如下几点可以进行尝试,抛出来相互探讨。 



一、“千人千面”机制的尝试



什么是“千人千面”?字面意思上说就是一千个人看到一千个面,每个人所看到的内容都不一样,实现“ 个性化”定制。 

举一个场景,作为一个软妹子,你的某宝Feeds呈现成这样的,嗯,美妆、衣服和家居产品更多。 


设想一下这样的画面,如果在你的Feeds列表里面推荐的是一些机械键盘和游戏装备,那作为用户,会心想“晕,这些东西又不能让我变瘦变美,跟我啥关系?往下翻翻再看看有没有什么可买的东西”。



如果再滑个2~3屏还是这类似于“今年流行的POLO衫”等跟你没关系的内容,那可能就没耐心看下去,sorry,直接退出了。 


而“千人千面”机制能解决这个问题,它要达到的目的就是, 对每个用户而言,都是各自喜欢的内容。



那么怎么做到千人千面? 
1. 千人千面的影响基于用户人群的标签。标签分得越细,流量就会被分割得越厉害,推荐也会更精准。针对具有标签思维的同学来说,展现价值以及访客价值利用率更高了。 

举个栗子,如果最近你要搬家,在某宝看行李打包带,那么你可能被平台分类为“搬家”这个标签。如果再细一点,“打包带”也可能为一个标签。 

那么在你的Feeds中就有可能呈现出既有打包带,也有纸箱、胶带、打包绳等这样搬家常用的物品进行推荐,是不是很人性化?可能就在这些推荐内容中发现一些自己也没想到但能好用的东西。 

像这样根据消费者的浏览记录和购买习惯来制定个性化服务,通过对这些信息进行分析来给消费人群贴上标签,从而达到 实现把产品精准推荐给消费者的目标 。精简的信息能够及时满足消费群体的需求,帮助消费者快速找到感兴趣的内容,由此带来了极好的用户体验。



2.千人千面的机制是推荐式的:一种基于C端消费者行为轨迹(比如用户在页面的浏览和点击行为)和途径反映的购物意图进行匹配推荐,如上面所举的“看行李打包带”的栗子; 



第二种:基于B端店铺(即商家),进行在后台设置的店铺人群画像(即在后台设置一些选项,告诉平台他的目标用户是谁),平台进行智能匹配推荐的。C端和B端的信息相互依存才构成了现在完整的Feeds“千人千面”推荐机制。 

这个时候,交互设计师能够做些什么事? 
1.将信息流的卡片进行结构化和组件化。卡片信息即用来表达用户的标签信息的。定义好最整体的框架,以及各种信息缺失情况下的展示方式。稍安勿躁,如下图,往下翻,在本文下一节进行详细讲解。 



2.将用户人群进行分层,然后和卡片信息进行匹配。用户人群分层,有多种维度。最常用的是将用户分为新客和老客,偶尔会有准新客、僵尸用户、流失用户3个层级的添加。但作为不同的产品、店铺,甚至是在不同的地点,对新老客的定义都不一样。 



比方说在杭州某小区旁边的奶茶店,老客可以定义为“方圆3公里以内一个月内在本店下过单的人”,新客可以定义为“方圆3公里以内从未在本店下单的用户”。 

如果这家店在各大外卖平台上提供外卖功能,那么对老客人群标签为“3公里以内”“下过单”,那么对老用户可以采用折扣的形式,比方说老用户下单88折等优惠信息进行吸引;新客的标签为“3公里以内”、“未下过单”,那么对新用户可以采用尝鲜的方式,比方“新客1元尝鲜价”等方式进行吸引。 

这样对用户人群的分层决定了我们的信息是否准确以及有效。如果将新客定义为“方圆1公里以内从未在本店下单的用户”,可能因距离太近而失去对稍远一点顾客的覆盖。 

在工作中,这样的人群定义一般是和产品经理、运营一起商议进行决定的。 

二、利益点的透出

利益点,即能够影响C端用户做决策的因素,这些因素对用户来说都是有利的。这些利益点主要包括如下两个方面。 
1. 商品信息:满减信息(比方说满200减20、88VIP9.5折),促销信息(比方说61狂欢)、订单量、用户评价、排行榜等。如下图中各种标签 



2. 商户信息:品牌标签(比方说品牌、优质商家等)。商户信息的透出,对追求品牌的用户来说是个有利的促进因素。如下图中商户的“品牌”标签。



光有这样的利益点也还不够,设计师需要做的就是将这些信息进行表达,怎样表达?设计方案将卡片进行结构化和组件化。什么是结构化和组件化?如之前的图(某平台的商品卡片结构)

同一个卡片,保持相同的位置出现的内容性质相同,即结构化。如上图商品媒体展示区,展示商品的信息,可以是图片、视频、直播等等多媒体的展示。 



组件化是指,卡片信息可以不必全部完整,可以只支持其中的某些信息进行展示即可,没有的可以进行隐藏。比方说满减信息,如果商品暂时不打折,那这一块就没有信息,可以进行隐藏。如下图 



三、兴趣点的试探



当用户一直在浏览迟迟不行动时,原因可能是没看到自己感兴趣的内容,那么策略可以再转换一下。范围由小到大可以分为如下三个层次。 

1. 尝试推荐同类商品的不同品牌。用品牌尝试效果,如下图。 



在同类商品中还可以尝试 榜单或者清单的方式进行进一步的促进。两者都代表着品质和认可。 



2.尝试推荐不同类别的商品。

为保持用户在信息流中所看到的信息更丰富,可尝试在信息流中除了推荐商户标签词的内容,还会穿插一些其他内容的信息。 

比方说你是个爱美达人,但同时也可能是个音乐爱好者,那么当在化妆品的信息流中,推荐一些当季新款耳机是不是很有吸引力。 

再或者你是个钢铁直男,喜欢体育,同时也喜欢玩游戏,那在你的feed中同时出现这两样商品是不是一件很开心的事情? 

3.相似内容的推荐。在浏览过程中,可根据用户的浏览行为进行相似词的推荐,如下图。相似词的推荐又分为2种,一种是直接推词,另一种是根据用户的点击行为进行推荐内容,都能起到扩展内容的作用。如下图。 





总结来说,要提高Feeds的转化率,逻辑如下。 


1.做好信息的展示和匹配。将卡片结构化和组件化,并做好用户分层进行利益点的匹配。 
2.根据用户的行为进行实时内容推荐的变化。

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加蓝小助,微信号:ben_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系01063334945

作者:Sophia的玲珑阁   来源:站酷

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

点赞功能背后的洞察与价值

ui设计分享达人

关于「点赞功能」的一些思考,之前一直存放在我的Blog里,第一次发布站酷,感谢

最近美剧《风骚律师》第六季正式回归,本来想等着全部更新完之后在一口气看个痛快。但是豆瓣里一万多名用户给出了9.9分的评价,就让我有点坐不住了,势必要看看「律师」是如何超越「毒师」的,也弥补一下近期的剧荒

当我打开Netflix之后,引起我注意的是「超爱这部!」这个功能,第一眼看到的时候有些疑惑,这个功能的意义是什么?与点赞功能的区别是什么?我点了之后会怎么样?我一直理解Netflix的点赞功能和Youtube、Twitter和抖音类似,点击之后会推荐给我更符合口味的内容或者有收藏的作用。但是对于Double the Thumbs的疑问是,除了喜欢与不喜欢之外,还可以给用户带来什么体验?它是Like功能的进化体么?已经拥有18年历史的点赞功能还有可优化的空间么?借此话题,来和大家聊聊点赞功能背后的洞察与价值 


幼年时期的点赞


早期的点赞把原本静止的内容变成了社交的媒介,用户间通过赞来简单直接的交流。我喜欢,我就点赞,蕴含赞同、支持和鼓励,此时的点赞更单纯与纯粹

2004年,社交新闻聚合器Digg的创始人Kevin Rose发明了Digg功能,用户从内容列表中查找自己感兴趣的内容并将其“Digg”出来——本意「挖掘」,你可以理解为「顶」——以表达自己对这篇报道的认可。当一篇文章得到足够的Digg之后,就会被提升到首页上,让更多的人看到 


就像是一个朋友给你讲了一个故事,你十分激动。这个故事是你从来没有听过的,你记住了它并将这个故事分享给了其他的朋友 

2007 年,社交聚合网站FriendFeed 将“Like” 按钮作为一项新功能发布并推广,两年后,随着 FriendFeed 被 Facebook 收购,这项功能也整合到了 Facebook 里。随后,各大社交产品纷纷效仿,同期的 Tumblr、Vimeo以及后来的 Instagram 都增加了这一功能。在国内,微信4.0版本推出的朋友圈,后来抖音的小红心、知乎的大拇指或者老铁双击666,不管什么样式的图标和表达方式,点赞即可满足用户的基本需求,又可以为产品实现商业价值,已经成为了社交产品的标配并且一直延用至今 


点赞背后的洞察


去点赞 


先问各位几个问题,你一天会给几条抖音、朋友圈或者知乎的回答点赞?你一天又会收到几个点赞?那你会记得一天跟多少人打过招呼么? 

可能你会认为我很无聊,谁会每天统计点赞和打招呼的次数呢。可正是因为这些你根本不在意的数字,无意的一个举动影响着生活。在电梯里碰到同事你要点头示意,领导发了一条朋友圈你要点赞附和,朋友积赞领优惠券你要支持。你需要礼貌的简单问候,或是处于功利维护人际关系,点赞无非是门槛最低,负担最小的表达方式,是敷衍的象征。相比于转发显得太重,评论则需要输出观点,模糊不清的态度绝对不会承担责任,还可以维持住一定的距离感 


在社交媒体里,我们点赞做的只是观察他们,表示认同,而不是向他们展示我们关心的事情,更别说用它加深友谊 「 Karen North - 数字社交媒体教授」

在传统的社交中,我们有点头之交的关系,然而互联网的出现让我们生活和工作中又出现了一种新型的关系“点赞之交”,它已经成为了网络社交的通用礼仪,虽然它无关紧要,含义不足以加深感情,但是想躲也躲不掉 


被点赞


作为一名内容输出者来说我的体会更深,我的视频怎么没人看,为什么点赞还不到一百个,每十分就会拿起手机看十几次,内心的挣扎与惶恐开始纠缠着我,是不是话术太枯燥,是不是灯光太暗了等等的问题反复的问自己。就比如当你精心拍了一张照片,编辑好一段文案准备点击发布按钮的那一刻你在担心什么?你耗费几个小时发出自我感觉良好的的一条朋友圈之后,点赞数只有稀稀拉拉的一两个。原本的炫耀因为点赞数太少变成了日记本

相反,点赞数成倍增加的时候,大脑就会开始分泌大量的多巴胺肾上腺素飙升,同时,你可能将在更多的社交平台重复这一受捧的过程,以及无数次打开这条动态,进入一种高度的自我欣赏状态。一个必要功能的出现,也意味着它承载着人们必要的需求。点赞满足的就是人们「被关注被看见被认同」的底层需求 


点赞的商业价值


重要的指标 


当产品经理们发现了用户的底层需求之后,如何让用户不产生疏离感,积极参与并且促进用户留存?点赞功能给了他们一个非常轻量级的机会,任何用户只要点个赞,就可以在整个社区的内容量级评定上贡献自己的影响力。另一方面,内容的生产者能够从点赞中获得更正面的反馈,进而更愿意进行分享实现转化,这是平台更愿意看到的

Facebook 2009年在全球推广点赞功能之后,用户发贴的数量和质量都随之提升,约 30% 的用户每天都会多次点赞。另外,广告商们马上解锁了「营销密码」,Facebook将数据售卖给广告商,打破了传统媒体市场的盈利模式,把用户的「喜爱度」拿捏的死死的。就连美国国务院在 2011 年 – 2013 年,只为在 Facebook 上获得更多的赞,就已经花费了 63 万美金

但凡事都有利弊,毕竟人性极端化是难以避免的。不知道各位有没有经历过可以在淘宝上给微博买粉买赞买评论的阶段,看似大把的流量在手其实都是流量造假,早期微博上的电影大V都是靠着一手盗版资源和买粉赚的盆满钵满,如果活跃度较高,很容易成为天选之子,平台还会亲自送你粉丝,这种效果显然与社交网络设计之初,希望通过虚拟社区增进情感联络的初心是相悖的,另外,造假产业环环相扣侵蚀了平台的利益,这就不是平台愿意看到的了,所以改善社区环境是必然

各个平台也做过努力,例如微信朋友圈在点赞功能发布不久,就对公众号集赞送礼品等诱导分享行为严厉打击。2019年左右Facebook、Instagram包括Twitter在内的 Demetrication(去数量化)顾名思义,就是将点赞数量隐藏,让用户看不到有多少人给帖子点赞,强制用户把注意力放在内容上。类似于教育改革落实“双减”政策将百分制改为ABCD的等级制,考试结果不排名、不公布,全面关注学生综合素质的培养。但是,有条新闻,一名老师大白天的拉着窗帘偷偷摸摸搞培训被社区抓现形的新闻想必大家都看过,贪荣慕利,众星捧月的潘多拉魔盒已经打开了,与用户的底层需求博弈注定不是短期就可以完成的

转眼已经三年过去了,海外的社交平台显然没有做到 Demetrication,技术手段根本完不成的任务。国内的社交平台则是把压力放在了创作者身上,利用起了用户底层需求,你想让作品在流量池里获得更多的点赞、评论和转发就要不断优化内容质量,寻找自身问题,或者花钱买数据,抖音的抖加和小红书的薯条都是社区平台迭代后的现状。既能避免黑产保护平台利益,又能给创作者来带可观的数据何乐而不为呢 


更好的评分制 


说回 Netflix 的 Double the Thumbs,官方给到的解释“这是一种让会员们了解自身喜好,更精准的看到想看的电影和电视的另一种方式”

其实就是通过更细微的分类比如导演、演员类型或者制作团队等等给奈飞的用户推荐相关的内容,只能说这很奈飞。从1997年开始卖碟片直到2006年转战流媒体,Netflix 的用户增长和商业成功的关键就是把猜你喜欢做到极致,这也是手握全球两亿付费用户的原因

不难看出Netflix更依赖用户,用户对于平台的反馈很重要。2017年Netflix抛弃了类似豆瓣一样的五星评分制,原因在于用户的打分并未遵从内心,评分较高的电视剧/电影会越来越火,不火的内容永远不会被用户看到,乱打分的现象频繁出现,Netflix不希望用户变成批判家,受到其他人影响,你只需要看你喜欢的内容就好。就比如说,周末你想跟女朋友去甜甜蜜蜜度过一个周末,舞台剧「莎士比亚」和电影「小时代」你会选哪个?我想大部分人都会选「小时代」,因为它话题性强,电影结束后可以在餐桌上和女朋友一起吐吐槽。但是,如果让你在平台上给两部剧评分,一定是「莎士比亚」高于「小时代」,问题就在于Netflix在乎的并不是评分,而是用户会看哪部剧 


显示性偏好(Revealed preference)和是期望性偏好(Aspirational preference),这在日常生活中也很常见,比如一个决定中午吃轻食的人实际点了炸鸡,一个计划下午去图书馆备考的人实际仍躺在宿舍里刷剧,一个决定更温和些的人在面临类似的矛盾时仍选择发脾气 - 经济学家保罗·萨默尔森(P.Samuelson) 

另外,Netflix与YouTube、抖音和B站又有所不同,Netflix全部都是PGC内容,都是自己花钱买的,流媒体版权的成本越来越高,被淹没掉的内容几乎失去了竞争力,对于平台的冲击巨大

Netflix不得不做出改变,只有不断优化推荐算法,向用户推荐更精准的内容才是王道,显然点赞/点踩对于用户来说更方便且选择单一,是获取数据最高效最精准的方法,在一项 Beta 测试中,Netflix 向全球数十万新用户推出了点赞/点踩手势,发现评级参与度上升了 200% 


Netflix产品副总裁Todd Yellin指出这种无法完全准确洞察用户喜好的评级系统对Netflix当下原创内容的储备没有益处 

如果各位很喜欢看美剧应该知道Netflix有非常多的自制剧,自制剧要比买别人的版权便宜的多,如果版权到期或者竞品的乘胜追击,也不会让自己处于被动局面。只有自制剧、自制内容才是平台的护城河,比如「纸牌屋」和「鱿鱼游戏」等等,这些优质的内容之所以能制作成功出现在大众视野,全部都来自点赞功能获取的用户数据

如今,Netflix在点赞/点踩的旁边增加了Double the Thumbs,改为了三星评分制度,从官方给到的解释“用户可以通过它告诉 Netflix,自己对某种特定内容情有独钟,包括主演、制作团队、角色类型、小众剧集类型等等,Netflix 的推荐也就能够更具体入微”,反之,Netflix可以通过更细微的分类来洞察用户喜好,一方收获了利益,一方收获了效率

2022交互设计趋势观察|PC端 上

ui设计分享达人

随着移动互联网的发展,原本PC互联网连接商业支付、购买商品、浏览信息流等的能力已经转移到移动端,而PC互联网更加专注于其他领域的优势:

  • 1、更大的屏幕能够包含更多的信息,并获得更深度的沉浸感受,如观影、浏览网页等。
  • 2、通过鼠标、键盘、触控板、手绘板的连接,提供了更多的交互方式,能够执行更加繁杂的工作任务,如表格编辑、程序开发、视频制作、文档书写、图像制图、3D制图等。
  • 3、得益于显卡、CPU、存储、USB插槽、显示器等的扩展性,在大型游戏、大型3D渲染、复杂制图上相较于手机端依然有一定优势。
  • 4、从场景(办公场景、娱乐场景)来看,PC端移动性较差,但同时基于该特点,PC端能够更加专注当前任务。模块化、多人协同、多端协同的发展正不断地提升用户的使用体验。

下面是我观察到的目前比较主流的交互设计点,与大家分享。分别是:

  • 一、无缝体验
  • 二、交互更加高效
  • 三、更加智能化、降低门槛、降低门槛、降低门槛
  • 四、更加模块化
  • 五、更加简洁、甄别关键任务
  • 六、3D动效、大图、带来更深的沉浸感
  • 七、协同合作的兴起

一、无缝体验

典型的案例就是苹果的Mac系统与Ios系统越发趋同,都采用了卡片化、模块化,整个交互规范、视觉感受都一致以达到多端统一。同时信息可以自由流转:比如在同一Apple账号下,Mac与IOS中复制的信息可以进行同步粘贴。备忘录、日历、提醒事项、录音中的信息进行流转,在任何一台Mac上登录Apple账号后都可以进行同步。

在国内,B站的网页端与App端的体验也逐步趋同,框架设计上更加卡片化与扁平化。信息流转上,手机上暂停的视频到网页端继续播放,实现了无缝切换。

淘宝首页:从过去复杂的信息流导航变为现在更加简洁的个性推荐卡片。整体体验与淘宝手机端一致。


 二、交互更加高效

总结:精简无关信息,关注最重要的核心任务,减少用户跳出,沉浸式心流设计。

1、登录方式更加高效

许多网页接入腾讯、阿里的生态,支持扫码关注公众号/手机验证码即可完成注册。省去了用户编辑个人信息、输入邮箱、输入密码等复杂的交互流程。

2、减少页面跳转

心流式体验设计是这几年很热门的词,指的是通过优化用户体验让用户能够沉浸式地高效完成目标任务。这需要做到产品的交互习惯满足用户使用习惯,并且交互流程满足用户预期。过于频繁的弹窗打扰和页面跳转的等待时间都会影响用户进入心流。

比如,例如飞书审批,审批详情不需要跳转,点击卡片即左侧弹出详情页弹窗;让用户可以在同一个页面即可浏览信息,不需要进行跳转到新的页面进行查看,方便用户完成批量的审批任务。

再比如:阿里云,开通服务的时候不需要跳转,而是在侧边弹出订单弹窗,方便用户操作。

3、交互组件的易用性迭代,不再局限于大弹窗

上面说到,频繁的弹窗提醒也会影响用户进入心流,用户在对表单、画布中的内容进行删除的时候,如果使用全屏二次提醒弹窗,会感到创作过程被打断。

钉钉宜搭:卡片画布类产品,删除操作时,不局限于大弹窗,而是用靠近按钮的小弹窗,使鼠标的滑动路径更短,操作更加简便;并且在不过多打扰用户的前提下,完成了目标操作。

三、更加智能化,降低门槛、降低门槛、降低门槛

复杂性守恒定律由Larry Tesler于1986年提出,也称泰斯勒定律。指的是“任何系统都存在其固有的复杂性,且无法被减少,只能设法调整、平衡。我们要考虑的是,怎么样更好地处理它,让用户简单、高效地使用它”。

很多的中后台系统中很多表单会存在大量的配置项,这些配置项是否可以简化,让平台变得更简单智能?大部分时候答案都是否定的,过度追求简化往往容易弄巧成拙。功能逻辑易于解释与理解才是更好的方案,当你试图简化降低复杂度,可能在其他地方埋了雷。

其中一个解决方案是将复杂度转交给系统,苹果公司的黑盒理论与此互通;就是用户不需要了解系统或功能背后的实现逻辑,只需要关注呈现在用户眼前的交互界面即可。如今数据智能化处理正不断发展,我们也看到了智能化在PC端领域的应用。

1、剪映

剪映相比于老牌视频编辑软件更加简单,提供各种在线特效模板,来降低任务复杂度。相比传统的PR、AE软件需要本地存储预设文件,或者手动编辑简单了很多。用户不需要知道背后的实现的技术原理,也不需要掌握过多的特效制作、调色技巧即可完成视频的剪辑、调色工作。

2、钉钉宜搭画布

推荐组件功能:用户在进行流程搭建时,不需要从左侧组件区拖拽组件,而是点击连接线中间来添加组件。如果可以其实还可以更进一步,就是根据后台数据分析创建目标流程需要的组件,向用户主动推荐相关组件,以此来降低用户的创建门槛。

四、更加模块化

随着传统业务向互联网转型越发普遍,线下业务流程转到线上的需求场景越来越多,一个单一的系统不能完全满足所有的业务场景需求,由此需要一个更加灵活模块化的系统来针对不同的应用场景来应用不同的产品架构。而该系统中的功能框架、交互组件又可以重复利用,于是更加灵活、模块化、可自定义配置的系统后台越发受到欢迎。

1、飞书、钉钉易搭

飞书、钉钉易搭内的审批流程、会议系统、工单系统都可以通过模块化的组件进行高效搭建,不需要代码即可像搭积木一样实现用户的自定义需求。

2、天猫优品

阿里的天猫优品电器店线下门店设计平台,整理了线下门店所需的16个模块(前台、小家电中岛、洗衣机、橱窗、空调、吧台等),通过线上三维化场景直接进行可视化设计,所见即所得,并且能够模拟现场灯光效果,根据门店现场规格,直接在三维空间里修改,快速导出效果图;非常高效地完成了其他门店的需求化定制。

五、更加简洁,甄别关键任务,路径缩得更短

1、抖音、快手网页端

抖音网页端的用户体验沿袭了手机App端的风格,用户进入网页的核心目的就是看短视频打发时间,于是进入首页即可看短视频,不需要用户手动选择分类,并且手机端的用户偏好通过用户的账号同步至网页端,有了很顺畅的用户体验。

相比快手网页版,快手延续了常规视频网站的交互方式,将视频内容分为短视频、直播、同城、长视频、小剧场等多个类别,由用户自主去选择观看的内容,内容虽然更加多元,但确实路径过长,不够直接。

2、淘宝、京东首页

再举个例子,新版的淘宝网页端不再像个门户网站导航,而是通过数据分析用户喜好来主动推荐代替用户自己选择。用户来淘宝网页端,其实并不是买东西,大众用户已经习惯了在手机上进行支付,到了网页端反而会不适应。用户来到淘宝网页端的更多目的就是逛,看有没有自己想要的东西,遇到喜欢的,就点进去看了。于是新版淘宝通过个性化推荐把过去复杂的活动运营页板块、特价板块、品类板块替换掉了,让用户在网页端获得更好的“逛街”体验。

而京东,在首页做了复杂的流量分发设计,通过不同的频道、不同的板块将用户引流至相关的专题页面,再进行商品浏览。本质上来说,用户来到淘宝、来到京东的目的都是因为闲,而淘宝的通过数据智能,大数据精准推荐用户喜欢的商品,简化了用户的使用路径,并且使整体页面更加简洁。

六、微动效、大图、3D元素带来更加深的视觉刺激

网页的官网、首页承担着产品介绍、流量分发、增强品牌印象等的职责。我观察到越来越多产品官网都开始采用3D元素、视频背景、大图元素、微动效来让页面呈现更加具有质感和动感。

1、3D元素

它是由Web3D技术的发展而兴起,能够给网页Banner带来更强的视觉吸引力,同时也强化了公司融合了AI技术的品牌印象。如法大大官网、腾讯云、阿里云的首页Banner展示。法大大首页Banner,鼠标滚轮向下滚动3D元素会相应产生变动,文案与元素一静一动,对比明显,也更易于用户注意到文案信息。

2、大图、视频

大疆官网首屏采用了全画幅大图的形式展示热门产品,下方的产品推荐页自动播放宣传视频,提升了页面的视觉冲击力,展示了其科技属性。

七、协同合作兴起

疫情时期,线上办公的需求和频率激增,线上协作兴起,许多办公软件都有了多人场景编辑功能。特别是对于复杂的项目,需要团队成员共同完成,协同合作的功能越来越受欢迎。

比如我们熟悉的figma,逐渐取代了传统UI设计软件ps、sketch等的头部地位,其中的项目协同功能更是广受欢迎。只需要发送项目链接邀请成员即可进行项目协作,还支持多人标注、语音沟通,大大提升了工作效率。

许多办公软件也都上线了类似的功能,比如幕布可以通过设置权限、发送链接或二维码来邀请协作者共同编辑文档,为产品的使用场景提供了更多可能。

总结

曾鸣在《未来商业20讲》里说:“未来的互联网世界的两大趋势是数据智能、网络效应”。 

这在PC端也得到了印证。淘宝网首页、抖音首页、哔哩哔哩网页端将PC端与APP端的数据进行互通,并对用户行为偏好数据进行分析,为用户提供更加精准的信息流的同时,还使得页面的交互更加简单,视觉效果更加简洁,过去依赖用户自主选择进行流量分发的形式将会越来越弱势。

在工具类产品中,利用数据智能化可以将用户操作上的复杂度转移给系统,从而降低用户使用门槛,提升用户体验。与此同时,工具类平台也越发灵活化化,通过模块化设计来自定义搭建不同用户的使用需求的产品,还能节省资源建设成本。

网络效应的部分应用体现在用户在使用工具类产品中,不再是孤单的个体,而是能通过线上协同,让用户与用户之间能够产生共同协作,共同交流,更加方便地完成任务。

作者:为美好而设计

转载请注明:站酷

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加蓝小助,微信号:ben_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系01063334945。


分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。


蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

日历

链接

个人资料

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

存档