首页

情绪版设计助你打开设计创意!

雪涛

我们在设计中经常会遇到新版本或改版的设计,从创意想法到设计初稿的过程可能会花费比较长的时间。而作为设计师除了自己思考设计之外,还需要与产品、设计老大沟通我们的一些设计想法。因此,我们需要在不同的阶段输出不同的内容反馈进度并达成一些共识。


在多年的设计过程中,我也经常会去尝试一些情绪版的设计,在这方面也沉淀了一些自己做情绪版设计的方法。因此可以借助这次机会给大家分享下这方面的经验,同时也希望起到抛砖引玉的作用,与大家交流下这方面的内容。




情绪版的概念


首先我们要明确什么是情绪版?我的理解是:情绪版既不是初稿也不是最终的风格方向,而是设计师在了解了相关的产品背景后,基于自己对于产品的理解给出的一个较为初始的设计建议,并且希望可以通过这个初始的建议与产品侧达成一些相关的设计共识。





II 情绪版的大概流程

情绪版的设计流程大概分为前中后三个阶段,前期:分析-收集,中期:筛选-组合,后期:打磨-呈现。




前期:分析-收集

主要是分析产品相关背景或需求本身的方向,结合产品背景及需求本身再进一步分析大概的设计方向并收集相关素材内容。




中期:筛选-组合

当我们收集完成后需要对现有素材进行二次筛选并组合,基于现有素材组合大概的设计方案结构。




后期:打磨-呈现

基础方案组合完成后需要进行二次打磨,细化方案的内容表现,检查整体的一致性及完整度,最后呈现给产品方。





III 为什么要做情绪版


可能很多设计师会疑惑为什么要做情绪版,直接设计初稿不就好了吗?如果有这个疑问,可能还没实际了解到情绪版到作用。但我们可以试着从我们在设计过程中遇到的痛点来了解情绪版的作用或者意义。


在设计的过程中你是否会存在下面几个问题:


前期思考不够——设计产出方案少;

设计不惧探索性——设计来源没有考究;

初稿多次修改没能达成共识——设计表达不出对方想要的;

设计中期出现不一致——设计没有贯彻始终。




IV 情绪版的作用

从这几个问题中,我们可以得到一个比较统一的结论就是:前期设计呈现内容不够,导致沟通不足而产生方向不统一。因此基于这个关键点,我们再来看情绪版的作用。




1/辅助构建世界观

在前期,世界观、背景方面的内容大多是以文字的方式呈现,因此设计师可以通过情绪版的方式,来输出对应的世界观设计表现,这样可以更加直观的表现出对应的视觉语言。




2/具象设计想法

在初期与产品侧沟通时,单纯靠语言表达的方式很难让对方达到一种脑补的状态。因此借助情绪版的方式更加直观的呈现设计想法,通过具象的图形或者图形,大大降低双方的沟通成本。




3/明确设计方向

基于第二点的沟通,我们可以明确的了解到产品侧的一些喜好。为后续设计初稿时起到一个清晰的方向作用。





4/提高前期设计的效率


从零到一设计一套完整的方案往往需要耗费较长的时间,借助情绪版设计的方式来快速响应一些想法及创意,这样可以大大提高前期的输出效率。





情绪版的基本原则


从多次的尝试中,我总结梳理了几个基本原则,了解这些原则可以让我们在做的时候更加严谨,输出更加准确的设计方案。




1/多方向性

情绪版的设计与我们日常设计一样,需要给出不同的方向建议,单一的方案往往难以抉择。多方案输出除了提升抉择空间之外,还可以增加方案碰撞的情况,往往可能是方案A的某部分内容叠加方案B的某部分内容才能产生最初的方向。


2/尝试性

此阶段的所有输出皆属于尝试与探索,因此不必过于考究设计细节,重点在于表达出需要相关的设计概念及思考想法,把更多的时间留作设计思考及方案尝试。


3/效率性

情绪版的输出重点在于前期沟通而达到一个比较好的共识,因此在保证质量的情况下,避免花费过多的时间而影响输出的效率性。尽量做到快与准。在过往中项目组,基本上是以半天(4个小时左右)为一个单位来完成一套方案。


4/试探性

情绪版是一种非常有效试探产品侧想要往那种方向去推动的方式,因为我们在实际的设计过程中,产品侧可能也对整体的设计大调并不少特别有明确的脑补,因此设计师可以借助情绪版的设计来挖掘产品侧想要往哪个方向进行发力。




VI 情绪版设计的方法


这里总结情绪版的设计方法大概有这几种:1.借助图像/插图、2.结合实际场景引申、3.借鉴摘取同类型设计、4.绘制草稿。


1.借鉴图像/插图

在我们设计一些专题活动或者绘制插图相关的一些设计时,可以考虑使用这种方法来输出你的情绪版设计,可以通过借鉴一些设计网站或插图网站上的现有素材来拼接,并表达自己在这方法的一些设计意图及想法。




2.结合实际场景引申

从更概念化的角度出发,通过引用一些实际场景、物品、图像,来拓展相关的图形、质感、色彩方面的设计,并且输出相关的设计雏形。例如我们在设计LOGO或者图形类的一些设计,使用这种方法就可以帮助我们突破一些现有的认知壁垒。




3.借鉴摘取同类型设计

在设计之初,我们通常会有一个大概的思考雏形,但如果直接开始设计往往效率上并不高。因此可以借助一些设计网站上的设计,通过摘取组合的方式呈现自己的初步想法。我通常会在UI新版或者改版的时候使用这种方式,但只能表达大概的想法且不能代表最终的初稿设计。




4.绘制草稿

当我们想要表达一些沟通或者框架的设计时,我们可以使用草稿绘制的方式来表现,这个方式简单快捷,可以很有效率的对齐大部分的设计共识。





VII 情绪版设计的注意事项


基于原则及方法,我们可以来简单了解下情绪版设计中需要注意的一些事项,通过这些内容让你在实际操作过程中少踩一些坑。




01/控制方案的数量

设计方案控制在2-3个左右即可,前期大多是属于试探性方案呈现及找方向,太多则容易导致选择困难。


02/避免篇幅过长

篇幅过长往往容易降低别人阅读的耐心,对于情绪版的输出也是如此。结合过往的经验,建议以16:9的画面为一页来呈现一个方案。


03/区分重点次要

在一页内呈现的方案避免过于平均,可以适当突出某些想要重点表达的内容,例如在这个方案中想要重点突出图标、颜色等,那么这里需要突出这部分在画面中的比例,适当缩小其他模块的尺寸。


04/结合世界观

在输出情绪版设计方案时还可以适当考虑结合产品的世界观,通过一些具象化的图形或者插图来表现相关的内容。例如我们之前在游戏中心改版的尝试中,就发散了几个相关的世界观,因此我们在输出方案时,则只需要把对应的世界观作为方案,通过情绪版的方式表现出来即可。


05/保持整体风格一致性

一致性是表现一个设计师是否具有系统化、全局观的思考思维,因此我们在表现情绪版时也需要关注这方面的内容,避免整体的调性不匹配。


06/完整性表达

在呈现方案时,尽量多维度的进行对比,呈现一个完整性、系统性的设计。例如我们在设计UI相关的内容,从图标、颜色、字体等等一系列的内容需要细致的阐述清楚,让人更加能够了解你的意图。




VIII UI情绪版模版分享


由于我日常以设计UI为主,因此可以给大家重点分享我在UI情绪版设计的经验。希望可以帮助到大家快速上手。


当你在做UI设计情绪版时,需要明确了解UI设计中的结构,更系统性的去思考整体的内容。我们在UI设计中往往需要包含以下这些内容:图形系统(图标+辅助图形)、颜色系统、字体字形系统、质感形态、界面形态、插图风格、动效系统、影像系统,等等这些部分的内容。




UI情绪版模版




过往实际案例分享


案例一:整体风格比较偏个性一些,页面尝试用深色的背景设计


优点:整体风格比较酷,配色比较未来感符合年轻的人的审美,深色的背景让内容更加聚焦。


缺点:深色的设计接受度是否可以,是否适合平台类APP设计




案例二:整体风格3D化的设计,包括页面的一些体验上都可以增加视察的效果来设计


优点:整体设计风格比较新颖,符合现在的设计趋势,整体感觉也比较年轻多彩


缺点:3D的制作成本相对较大




案例三:整体风格比较清爽,白色融入渐变的设计也会显得比较年轻


优点:整体页面清爽,可以满足任何内容的透出,渐变色的图标和按钮的设计补充了细节


缺点:整体氛围感、娱乐感较弱。






IX 最后总结


很多时候我们会觉得情绪版设计可有可无,或者因为时间的关系不允许我们经过这一步。但,如我一开始提到的点,情绪版可以在前期帮助我们去打通很多思考的壁垒,辅助设计师在前期直观的与产品侧进行方向上的探讨,从而找到大方向上的共识。


以上都是属于我个人总结的一些经验,因此建议大家在日常项目中多去尝试,并在尝试中找到适合自己的方法。

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

文章来源:站酷  作者:篮子瑶

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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


交互深耕-B端设计师要懂的信息架构

雪涛

信息架构这篇是本人在现阶段觉得较难学习与阐述的知识点,网上关于信息架构的知识内容也是参差不齐。在学习与探究的过程中查阅了很多资料,反复修改多次,尽量用直白的语言结合实例来阐述信息架构。目录如下:

大家可以根据上述目录来进行选择性阅读,当然全文阅读也是极好的~





1.1 前言

这篇文章的起源,来源于最近看到的话题“B端设计师会被组件库取代吗?”。从表面上看,在组件库越来越完善的时代,很多页面设计依靠组件库就能够快速搭建。


那么在这种情况下,B端设计师存在的意义和价值到底体现在哪里呢?其实B端设计的重点并不在页面的视觉上,视觉只是作为设计师最终输出成果的一小部分。个人认为B端设计师工作重心体现在做「正确的设计」,比如以下几个方面:

1.这个设计能否完成对应的商业目标和产品目标;

2.我们的信息呈现是否合理以及能否解决当前需求;

3.用户能否在页面上快速找到想要的信息;

而想要弄清楚并解决上述这些问题,在众多的话题阐述之下,我发现其论述本质上都逃离不了「信息架构」这个概念。因此我认为设计师都需要对这个概念有充分的认知,这能够帮助我们做出正确且出色的设计。


1.2信息架构概念

关于信息架构的概念,在百科上面的定义大部分都比较晦涩难懂,比如维基百科和百度百科的解释:

相信大部分人都很难明白其中描述的意思。在这里换种思路,将信息架构拆分为信息与架构去理解。

信息指的是内容的载体,常见的文字、图像等都是信息;架构的含义则形容对应的组织和结构。那么信息架构就是将信息通过一定的形式组织起来,然后呈现出来。其本质就是研究信息的表达与传递。

通俗点讲,信息架构就是让用户可以更容易的理解我们的产品,让用户在使用我们的产品时可以更顺利、更自然。因此信息架构没有一个具体的呈现形式,它更多的是体现在产品设计的各方面。具体主要表现为组织系统、标签系统、导航系统和搜索系统。





为什么需要信息架构?我们都知道B端产品设计的核心是「降本提效」,在设计这一侧的可以将其理解为降低认知成本,提升使用效率。

降低认知成本需要我们更好的表达信息,让用户能看明白我们的产品能够做什么,如何用;提升使用效率需要提升信息的传递效率,让用户能够很容易的找到需要的功能;


而信息架构从本质上来讲也正是研究信息的表达和传递。因此我们需要通过它来帮助我们更好的完成B端产品设计。如果没有信息架构来作底层支撑,那么我们在页面上看到的可能就只有功能的堆叠,让产品陷入难以上手或者不知道怎么用的尴尬境地。

一个强大信息架构是产品质量的保证,是作为设计支撑点的骨架,它会减少可用性问题,提升整体导航行,创造对用户友好的体验。比如举一个工具层面的例子:

PS的工具栏堆叠在界面各个部分,而Figma的工具栏则集中在右侧且只出现当前需要的功能。很明显Figma在信息架构中的信息组织部分做得更为友好,PS则会显得逊色一些。这也是我们在学习PS的时候会显得比较吃力的原因之一。


可以说良好的信息架构是高效用户体验的基础。视觉元素,功能,交互和导航都是在信息架构的基础上构建的。因此想要做出体验好且合理的页面设计,我们就需要参与到信息架构这个过程中来,和产品一起完成对应架构的梳理。而不是只完成从原型到页面这个部分。


如果想要搭建一个好的建筑,我们需要知道其建造的目的,是按照什么样的结构搭建,内部有哪些系统,以及最后呈现的模样。


那么信息架构也同理,我们首先需要知道信息是为了什么目标服务,然后我们通过怎样的结构来组织这些信息,以及过程中会用到的信息元素,最后如何呈现它们。这都是我们在搭建信息架构中需要进行的必要步骤。如果某些环节没有做好或者没有了解透彻,那么在输出信息架构时往往会出现方向或者策略上的问题。接下来我们看看这些步骤是如何具体呈现的。


3.1 信息获取:先理解业务,再谈架构

B端行业对于业务理解的要求是比较高的,只有在理解业务的基础上,将业务需求转化为对应的设计目标,我们才能够输出合理的信息架构方案。

个人认为理解业务的基础,就是能够用一句话讲清楚当前设计的产品。这句话可以描述为:谁在什么地方想要完成什么目标。比如「用户想要不出门就能够吃到东西」,这就是外卖软件提供的产品服务。


虽然看上去这句话很简单,但其中包括了三个要素:用户、场景和目标。因此我们在分析和梳理业务的过程中首先要弄清楚的就是这三个要素。


3.1.1用户:分清购买者与使用者

用户永远是排在第一位的,也是我们首先需要弄清楚的。在B端设计中,本质上可以分为两类角色:客户和用户。比如我们常用的钉钉或企业微信,购买客户是企业,实际用户是员工。

对于企业:「我想要有一款软件可以更好的管理员工」

对于员工:「我想要这款软件能够更好地提高工作效率」

客户决定了我们产品的购买(部分情况下也兼顾使用),而用户则决定了后续产品的复购率。因此在业务理解中,我们需要弄清楚当前产品所处的服务阶段,比如初期为了打开市场肯定更倾向于客户,而中后期为了提高产品的使用体验又会偏向于用户。


因此我们首先需要弄清楚的就是当前产品是为哪些「目标用户」服务,这也就决定了我们在设计信息架构时对应的不同侧重点。


3.1.2场景:需求源于场景

场景是指需求产生的某种条件,这个条件包括但不限于环境、时间、地点、空间等,只有上述条件满足,这个需求才能成立。这里可以把场景理解为产生该问题的原因

比如当用户提出「她需要一件衣服」,那么我们就需要弄清楚用户为什么需要添加衣服,是她感冒了自身觉得冷还是因为外界环境冷。这两种场景涉及到的解决方案是完全不一样的。


在平日的工作中我们可以通过以下两种方式来更好的了解业务场景:

1.通过业务方文档进行业务背景的初步理解。业务文档中一般都会包括需求背景,我们可以通过文档进行初步了解。

2.通过业务沟通进一步加深业务背景的理解。由于很多B端业务离设计师本身的生活比较远。因此对于需求背景中不理解或者比较模糊的部分,我们可以通过与业务方或产品多次沟通来挖掘最底层的背景。

毕竟需求背景是理解业务的重要步骤,我们只有知道需求产生的原因,才能够针对性的给出解决方案。


3.1.3目标:业务目标和设计目标

目标决定了我们的产品最终的方向。我们首先接触到的一般都是业务目标,而我们要做的就是将业务目标转化为我们此次的设计目标。


A.业务目标

业务目标就是此次业务想要解决的实际问题,它通常是一个宏观上的描述。比如打车软件的业务目标简单概括来讲就是让用户能够更快速地打到车,减少等待焦虑。我们一般通过文档或者沟通来了解该目标。


B.设计目标

设计目标是我们基于业务目标而给出的设计策略,是一种更具体的实现方式。比如我们要让用户快速的打到车,那么这个时候我们的设计目标就是通过将用户位置和司机位置进行快速匹配,并通过超时补贴红包的方案来降低用户焦虑。从而实现业务目标。而这一过程涉及到的信息点就有:司机位置、乘客位置、等车时间、补贴金额等元素,并需要思考它们之间的关系和呈现方式。


可以发现从业务目标转化到设计目标这个过程,实际上就是在确定功能和信息点的过程。这样才能让我们更好地设计信息架构。


3.2信息架构核心:信息组织

从前文可以看出我们会在整体设计过程中出现很多的信息元素。如果不经过对应的组织和处理,直接堆叠在一起,那么信息含义会比较乱且难以调用。比如下方:

而右侧图片信息的组织过程可以理解为通过将零散的数据信息进行分类再以某种结构化的形式将它们重新组合排布的过程,直白一点就是先分类,再结构化呈现。我用一张图来表明这个过程:

那么这个过程中「信息组织」和「结构呈现」到底应该怎么做,也就是接下来要讲的组织方式和结构类型。


3.2.1组织方式:模糊分类和精确分类

组织方式可以分为精确分类和模糊分类。精确分类就是我们会利用物体本身物理属性来进行分类,比如位置、字母表、时间、类别、层级等方式进行组织。一些工具类应用例如滴答清单内容信息都是按照时间来进行组织的:

而模糊分类则是按照更为主观的逻辑对信息进行分类, 如主题、任务、用户、隐喻等来进行归类,比如我们常用的APP商城是按照不同的主题类别来进行区分的。

但在很多时候,产品倾向于将两种组织方式结合起来形成复合型组织方式,从而能够使我们的整体组织形式更符合用户的使用习惯。比如蓝湖的信息组织,其中既包含了模糊分类(按使用类型等分类),也包含了精确分类(按上传文件时间等)。

其实在大部分B端产品中,大都按照模糊分类来进行处理,比如按照任务、流程等方式。而精确分类更多用于在页面内的局部信息模块,比如创建时间和文件大小等。


归根结底,我们分类方式的选择需要结合我们前面提到的用户、场景和目标,这样才能让我们的分类更具说服力。


3.2.2组织结构:选择合适的结构类型

当信息按照分类维度组织后,我们接下来就是把整体信息进行结构化,这样才可以将信息整体连接起来并呈现出来。一般分为以下四种组织方式:


A.层级结构(最重要的结构)

这是信息架构中最为常见的结构,也是比较符合用户认知的结构。有时也称为「树状结构」。以子父节点的形式一层一层延展。

层级结构的优势就在于可以承载复杂的多层级内容,通过层级递进的方式将复杂的多层级拆解得更简洁。


但我们需要把控好内容的广度和深度,广度指的是在层级结构中每一层的数目,最好控制在7个以内。如果广度太宽意味着每个页面会给用户展示太多的信息,增加寻找内容的负担。深度为纵向结构,建议一般3层,最多不超过5层。过深的层级会让用户点击很多次,且不容易被用户发现。比如飞书的基本信息架构也是主要以层级结构来进行的。


B.矩阵结构(多维度结构)

矩阵结构是各个节点都相互连接的一种信息架构方式,通俗来讲就是用户既可以通过多个维度去触达同一信息,也可以从单个维度连接多种信息。

这种结构其实就更类似于我们在做相关功能时:比如当你进入电影全屏时想要退出时,既可以通过点击按钮退出,还可以通过键盘的Esc返回到,通过多点触达同一操作。


又比如我们的联系人功能,我们既可以通过输入数字拨打电话,也可以查找联系人进行拨打,还可以查询电话记录进行回拨。

矩阵结构最重要的意义在于给用户提供多种路径,使用户能够在不同路径中寻找各自想要的东西。


C.自然结构(随机性)

自然结构不遵循任何一致的模式,节点都是被逐一连接起来的。

自然结构一般都具有随机性和不确定性。这种更倾向于泛娱乐化的C端应用。比如我们常见视频网站的在推荐流都是应用的自然结构。比如打开B站等视频平台,你很难猜到刚进入看到的是什么。

但一般自然结构不会单独存在,比如B站在自然结构中也绑定了层级结构来进行层级上的划分。


D.线性结构(单一性)

线性结构是非常单一的一个结构,整体是一层一层向下递进。比较强调先后顺序的一种结构。


这种结构通常用于我们常见的软件安装程序等,也可以用于部分功能结构,比如网站的视频发布,一般都是经过上传-编辑-发布这三个步骤来依次进行。

大家可以发现在进行信息架构时,我们在很多情况下可能会运用多种组织结构方式,我们需要根据对应的用户决策场景来考虑让最适合的几种方式相结合。但最终目的都是为了让用户能够更快速的获取信息。


3.2.3注意事项:关注用户心智模型

在信息的组织过程中,我们需要注意用户的心智模型。比如当我们看到红点就知道有新信息通知,看到下拉箭头就知道可以展开。这是互联网产品在无形中给用户建立的底层习惯认知。用户目前对于普遍产品的一些基础布局、功能名称和交互逻辑都形成了一定的习惯,这都属于用户的心智模型的内容。


因此我们在组织信息时尽可能不要去打破用户常见的心智模型,否则必然会导致用户的不习惯。我们常见的「扫一扫」功能,微信、支付宝和QQ会隐藏在「+」号里面。而微博和抖音却分别放置在了「我的」和「搜索」里面。

这样会导致用户难以发现该功能。因为用户接触新的信息时,会以最初接触的局部信息为依据展开并形成初步认知,用户认知中的信息组织逻辑和实际信息的吻合度越高, 他在进一步查看或寻找信息的过程中体验会更顺畅, 反之, 若一开始形成的认知与实际信息的差异过大, 在后期的信息搜寻过程中则容易遇到困难。而这个吻合程度其实就是用户心智模型。


虽然建议在一定程度上遵循用户心智,但并不是说绝对遵循。对于用户不熟知的场景或者某些专业术语,我们需要通过灵活有效的提示(比如标记注释等)来引导用户就可以了。比如我们刚才提出的抖音扫一扫,它的应用场景其实是用于抖音官网后台登录,且在后台登录时已经给出了对应提示,那么这样的设计也是合理的。


3.3信息架构支撑:标签、导航和搜索

当经过上面的信息组织,其实我们已经能够归纳出一个大体的信息架构框架。但在信息组织之外,我们还需要关注以下三点:标签、导航和搜索。这对于信息架构的完整性也有非常重要的意义。


3.3.1 标签系统:让信息识别更通用

标签系统,通俗来讲就是要我们对当前整个系统信息节点的命名,从而让信息的呈现更容易识别。拿个最简单的例子来进行说明:

可以看到左侧和右侧关于卫生间的信息标示,可能左边你能一眼区分,右边可能就需要反应半天才能猜出到底代表什么含义了。


这其实就是关于我们的信息命名是否能够被大多数用户所接受的场景,也就是我们标签作用所起的作用。标签可以分为图片和文字标签,都需要考虑用户对该信息命名的认知程度,也就是前面提到的心智模型。那么如何能够更好的去定义标签名称呢,这里需要注意2个方面:


A.优先选用被行业广泛接受的词或图标

在进行标签定义的时候,尽量选择已经被用户所熟知的词语,比如「工作台」「通讯录」等已经被运用得非常熟练,对于类似功能就直接以该形式命名,比如我们的设计软件中,很多图标和功能名称都是通用的:

这样做能够很大程度减少用户的学习成本。因此在B端设计中我们也需要注意到我们所在的行业,哪些名词已经达成了共识,就无需再造新名词。


B.不确定的词语可以参考竞品或调研来决策

当某类功能或场景的标签难以确定时,我们就可以尝试去找一下竞品是否有类似功能,或者找该行业的领头羊(比如聊天工具的巨头微信),那么在进行标签定义的时候,可以参考它的命名体系。因为它已经替我们教育了一部分用户,会间接降低学习成本。


如果某些标签在上述过程中还是无法确定,那么我们结合自己经验或者与咨询业务相关人员来进行讨论,在必要时候可以在标签旁边添加注释来进一步说明。


3.3.2 导航系统:让用户不迷路

导航系统其实应该是大家比较熟知的一个系统了。就像使用导航系统来规划行程一样,导航系统都会存在于每个网站中。比如我们常见的侧边导航、顶部导航等。

因为网上关于导航系统已经有很多资料的讲解了,在这里阐述下四类导航的含义:

1.全局导航:位于页面最上层的导航,用户几乎在页面的每个地方都可以看见,是最高层级的导航系统;

2.局部导航:位于最高导航的下级子类导航,子类导航并不是必须的导航,根据场景进行取舍;

3.情景式导航:通过点击文字链接进行跳转的导航,比如在个人资料里面植入其它网站的链接地址;

4.辅助导航:这里包括网站地图,网站索引,网站指南等辅助类型的导航。


辅助导航的网站指南包括新手引导和演示教程等。现阶段更巧妙的功能引导,是当用户在进行某些功能的操作时及时进行提示,这样不仅达到了为用户引导的效果,还减少了一连串的新手引导对于用户的打扰。比如figma在进行组件更新后,只有当你调用组件功能时,才会及时进行提醒。


3.3.3 搜索系统:让用户轻松找信息

搜索,是我们平日最常用的查找信息的功能,它能够帮助我们快速进行信息的检索。虽然搜索功能非常重要,但并不是每个系统每个页面都需要搜索。我们决策是否添加搜索时需要考虑下列三点:

1:内容复杂度:当前页面承载的内容复杂度如果较少,对于简单内容页面往往不需要搜索;

2:内容性质:当前页面的性质是偏向于用户浏览还是查找,根据用户行为来决定是否需要搜索;

3.搜索场景:如果搜索场景很简单,考虑是否只用筛选或分类就能够解决问题;反之如果搜索内容很复杂,我们还可以搜索结合筛选来更好的查找信息;


上述3点决定了我们是否需要考虑搜索功能。而关于搜索的其他细节点,比如搜索规则和搜索结果等,在这里不做进一步的阐述。在这篇文章中更重要的是弄清楚我们何时需要搜索功能。


3.4信息架构表达:视觉化你的架构

我们通过上述方法已经知道如何梳理信息架构了,那么我们应该如何呈现它呢。这部分其实也是很多资料中比较模糊的点。

在学习的过程中,发现部分资料认为信息架构就是单纯的指思维导图,但实际上信息架构并不能单纯只用思维导图就能够完全表示。

因为信息架构包含了很多部分的内容。只能说思维导图可以是信息架构的一种表现形式,其可以帮助我们在思考阶段梳理整体产品的信息构成。


这里抛出一个很有意思的观点,那就是「功能结构图」和「信息架构图」到底什么关系,这里用两张图示例:

可以看到,功能结构图更多体现的形式是功能阐述,一般形式为名词+动词,比如头像设置;而信息架构图重点呈现的应该都为信息元素,一般为名词,比如头像图片。

但在大多数时候我们看到的产品架构图,其实更偏向于功能结构图和信息架构图的结合。因为在很多时候阐述信息构成时需要依赖功能进行辅助说明。


因此这篇文章讲述的信息架构更偏向于基于产品的整体架构。其实信息架构对于呈现形式并没有特别的限制,只要能够帮助你清晰表达产品整体结构就行。《信息架构:超越web设计》第4版中其实也并没有对表现形式这一块进行严苛的定义,其用「显示信息元素间的关系——站点地图」的说法概括了信息架构的呈现形式,其表达如下:

可以看到其表达形式包括思维导图和流程图等形式:思维导图的优势是能够总览全局信息,查看信息的深度和广度,而流程图的优势则更能够表达整体的逻辑关系。


因此信息架构的呈现需要根据你的产品场景选择合适的视觉框架表达。不必让形式限制了我们的发挥,而是应该形式追随于我们的架构表达。其只是一个信息梳理结构的说明结果(类似于中间态),我们需要借助它来更好的阐述思路与沟通想法。


3.5信息架构之后:让信息具像化

在输出信息架构之后,其实这里想聊一聊页面的呈现。因为当梳理好大的框架后,剩余的页面细节其实都需要通过原型图来进行体现。这个过程是从框架到页面的阶段,其实对于设计师来说也是很重要的部分。在这里根据自己的理解列出了以下几方面的注意点:

A.页面能够让用户看懂

这其实就是涉及到我们的信息组织和标签系统。如果当我们的某个页面不能让用户第一时间获取到该页面表达的信息,反思一下是在哪个方面做得不好。是标签系统含义模糊呢,还是信息的组织分类方式不对。从页面呈现倒推信息架构。

综合来说就是设计时的排列要考虑用户的心智模型(比如网页的常规排版和通用名词定义等),对于某些难以理解的地方给予用户帮助和解释。虽然B端产品想要完全避免学习成本是不可能的,但我们可以尽量减少其学习成本。


B.考虑用户的视觉动线

当我们在进行信息排列时,这时需要思考的就是用户的视觉动线,也就是我们常说的视觉浏览「F模型」和「Z模型」。对于不同的信息流来说,采用不同的动线模型能够让用户更好地查找信息。

F模型和Z模型的使用区分其实就是在使用场景上,对于内容页面来说F模型会更为合适(比如文章或者搜索结果),适合文本类的内容。但对于非文本的页面,则更适合用Z模型,Z型模式的设计跟踪了人眼扫描页面时的路线——从左到右,从上到下,能够更好引导用户的视线。


C.掌控好适度的信息层级

B端由于在视觉的发挥空间不多,那么相对来说保持良好的信息层级能够让整体的体验变得更为良好。

不管是原型图还是视觉,整体的视觉层级要体现得更为清晰。按理说最好的视觉层级控制在三级左右。如果发现视觉层级过多,需要考虑是不是因为信息架构设计时纵向层级过深,通过调整架构的形式来更好的呈现信息。以及对同页面的信息进行重要程度分级。


当我们做完或者听别人阐述对应的信息架构时,该如何评判呢,到底怎样的信息架构才算优秀呢。个人认为可以从3方面去进行判断:

业务层:

1.设计目标合理:能平衡商业目标和用户的目标,保证客户和用户都有较为良好的体验;

2.核心任务目标:能够让用户顺利完成产品的核心任务,需要通过用户测试来进行验证

结构层:

1.平衡广度和深度:在进行功能使用时不会隐藏的太深而找不到,是否有冗余步骤

2.保证拓展性:当前信息架构在面对未来新增或者删减信息时能够稳定拓展

体验层:

1.保证易读性:用户不经过介绍,通过页面信息呈现能够看懂该产品是用来做什么的

2.保证易查找性:用户在需要某个功能时能否快捷的找到,是否有多种查找方法(比如搜索或筛选)


合理的信息架构需要具备以上条件,我们需要在做设计呈现时也尽量保证以上条件。但在很多情况下其实并不能完全满足,这个时候我们需要根据业务目标的重要性来选择某些点进行满足。


梳理一下整体文章的架构,其实是按照「是什么-为什么-怎么做」的形式来进行拆分的:

这篇文章想要表达的观点,不是让设计师独立去梳理整体信息架构,而是让设计师拥有信息架构意识,了解其是如何进行并产生的。这样你在看到整体架构时,有足够的理论支撑去判断它的好坏,并通过自己的理论认知去理解和改进不好的地方。


当我们对信息架构有足够的认知时,我们在设计页面时才能有合理的思考方向,做出「正确的设计」,避免成为无情的作图机器。信息架构作为产品交互视觉最底层的支撑,只有骨架搭好,对于用户的使用体验才能够有本质上的提升。


注:文章中不可避免会存在不足之处,如果对文章中内容有更好建议,欢迎随时交流。


  参考资料:

《web信息架构》第四版

《信息焦虑》

《用户体验要素》

《信息架构设计》

「从设计前/设计中阶段,了解信息架构知识点」

「互联网产品如何搭建信息架构」

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

文章来源:站酷  作者:进击的M

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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

搜索框的学问

雪涛

关键词:搜索框,UI,UX交互,用户体验,响应式设计,网页

 

题外话Tips: 在写Amazon案例时,看到了歪果仁对国货马应龙的评论,简直太欢乐(以前看过人家翻译的帖子,但自己看一遍还是太搞笑了)。于是就写跑偏了,翻译了下贴了上来。随便乐乐~ (CTRL+F页内搜索可直达)



目录:(CTRL+F页内搜索可直达)

第一章 搜索框-默认状态

一、 位置

二、 宽度(包含响应式设计)

三、 按钮样式

四、 展开 or 隐藏?

五、 默认要有提示文字啊!

六、 推荐词

七、 有很多分类怎么办?

八、 一个页面里有2个搜索框怎么处理?

 

第二章 搜索框-光标触发的状态

一、下拉框中,历史记录+热搜词是标配

二、下拉框中,标配+额外内容

三、下拉框中,纯个性化内容

 

第三章 搜索框-搜索中的状态

一、 默认交互

二、 个性化交互

三、 搜索下拉框中的多选功能

四、 回车 or 不回车?



正文:

以下都是从Web端角度写的总结,Web的空间比APP大,相对来说,交互可发挥的余地更大。APP端如果有时间,就另外再写吧。



搜索框简单吧,也就输入框+按钮。但是就那么点小元素,里面也是注满了无数的小心思,死光了无数产品经理/交互设计师的脑细胞,只是为了让交互更流畅,产品体验更好。


第一章 搜索框-默认状态


搜索框的默认UI/UX样式,取决于网站的业务性质,取决于搜索功能的重要性,取决于页面布局。

 

一、位置


搜索框的位置放在哪里,取决于搜索功能对于网站的重要性。

 

N年前,就有很多小伙伴引用过如下研究报告了,我重复下吧。

Dawn Shikh 与 Keisi Lenz 的研究:展示了在142个参与者的调查中,网站搜索框的期望位置。研究发现,对用户来说最方便使用的地方是网站的左上角与右上角位置。用户可以使用常见的F形扫描模式轻松找到它。



如图,搜索框要放置在网站的右上角或者中间位置,这是用户所期望的位置。


 

目前大部分网站在UI布局搜索框时,也是大致遵循这个规则的。但总体来说,搜索框的位置,还是可以分为如下几种:

1.  页面-居中

2.  页面-顶部居中

3.  页面-顶部右边

4.  其他

 

那么,分别讨论:


1.    页面-居中


为啥居中?当然因为对于网站,搜索是核心功能。如果没有搜索功能的话,业务几乎无法开展。它最最最重要啦!

 


1)绝对居中


这种一般适用于搜索引擎的首页。页面基本就是一屏,搜索是最主要功能,其他内容不重要。

比如Google, 百度。

Google的界面就相当干净清爽。嘿,我就是纯搜索的,赶紧搜呗!



百度,可以只显示一个搜索框。

如图所示的搜索框下的大块资讯,是可以在设置中隐藏的,不想看,关掉就好。



2)相对居中,垂直略靠上部。


适用于数据库网站的首页。


因为数据库的数据量动不动就是千万、上亿的,搜索是极其重要的功能,99%的用户都是带着目的来的,直接通过搜索找数据的。搜索框需要极其醒目,需要占据首屏大部分的位置。


但考虑到数据库网站的首页也需要展示其他信息,来增加用户粘性,一般会有好几屏,比如最新信息,热点信息之类的。这些就放在搜索框大区块的下方了。

 

比如 官方司法权威网站-中国裁判文书网,全国的1亿多个案件都在这个数据库里,供免费查阅。搜索数据是核心功能,因此搜索框最醒目,占首屏大部分位置。其他信息依次往下布局展示。




2.   页面-顶部居中


为啥顶部居中?因为网站业务中,搜索是重要功能,但不是全部。不用夸大显示,但顶部的居中好位置要留给它。

一般适用于电商平台,资讯平台。


这些网站中,展示商品、广告、信息才是重点,是为了促成交易,增加流量的。搜索是工具,比较重要,但不是重点,只是为了达成目的的一个手段。因此可以放在页面顶部且居中的显眼好位置,重要,但是不过分夸张。

 

用户场景:

如果用户是漫无目的的瞎逛,可以随便浏览页面中提供的大量信息。

如果用户是有目的的找某个商品或信息,也能很容易的在页面顶部找到搜索框,定位目标。

 

比如,电商平台-京东




比如,视频平台-Youtube

看到了吗?顶部中间,不太显眼的那个灰色搜索框。




3.  页面-顶部右边


为啥顶部右边?因为网站业务中,搜索只是辅助功能,居中这么好个位置没必要,放右边看得见就行了。

 

比如, Dribbble

Dribbble,设计师都知道。一般大家都是去随便看看找灵感的,浏览信息是重点,搜索功能不太重要,放边上就行了。



比如,小米

提问:有同学会问,嗯哼,这是电商网站呀,要卖产品呀。为什么不像淘宝京东一样放顶部居中呀?

 

回答:因为,这是品牌自己的平台呀,就那么几个品类,在顶部导航条内,侧边导航条内都已经展示得清清楚楚了,鼠标点点就行了。搜索是次要的功能。

 

根据设计原则——奥卡姆剃刀原理(简单有效原理)

*  只放置必要的东西

*  给予更少的选项


顶部的品类导航条本身就能帮用户找到产品了,可以直达分类页面,是非常重要的入口,也是重要的产品宣传,需要放在顶部首行的位置。

搜索是辅助功能(此处相信小米的PM是分析过search usage的),放在次要位置就可以了。

不需要同时突出搜索框+品类导航条,来增加用户的选择成本。

 

另外,要是搜索框居中了,那展示品类的重要导航条就得布局在第二行。Web/APP的第一屏都是黄金位置,能省一行是一行。



4.    其他


1)可以放logo的右边。


比如google的搜索结果页

从设计理念上说,google的搜索框和logo放在一起,也能组成品牌和搜索引擎之间的强关系。即google=search. 用户们不也早就说,“你google一下”,而不是“你搜索一下了”嘛!

从UI上说,搜索引擎的内页一般只有列表,这样搜索框也能和列表左对齐,布局清晰。



2)其他位置,根据情况判断。


比如Figma界面,文章最后有图。此处不赘述。



二、宽度


搜索框的宽度(包括input box + search button),同样取决于搜索功能的重要性。其中,大概率取决于上文所述的搜索框的位置。

其次,也需要考虑输入的关键字的字符数。

另外,根据整体布局决定。


一般情况下,220px<宽度<650px。 请注意, 这是建议的相对值,不是绝对值。只表示搜索框在大部分Web中的情况,具体需根据自己的页面情况调整。实际应用中,也有搜索框最长到1000px的情况。也有比220px更短的。

 

根据搜索框在页面中的不同位置,搜索框宽度分别如下:


1.    如果搜索框位置在页面居中,那搜索功能也极其重要,那当然宽一点。

比如上文提到的google,百度。搜索框宽度通常固定在650px以内,保证在所有分辨率中都能显示全。也保证了可显示的关键字字符数大于60个(即60个字母,30个中文字),大大的足够了。


2.    如果搜索框位置在顶部居右,那搜索就是辅助功能,那当然短一点。

具体宽度,需要考虑顶部UI布局情况。但一般不小于220px(大概数值,自己平衡). 不然就不太方便输入关键字了,或者关键字就显示不了几个了。


3.    那如果搜索框位置在在顶部居中呢?则可长可短,根据业务情况和页面布局判断。

如果为了用户体验好的话,搜索框宽度也需要考虑「响应式设计Responsive Design」

 


既然都说到 「响应式设计」了,那么就提一下吧。


概念:

响应式设计(Responsive Design)是页面布局可以「响应」不同尺寸屏幕的设计方法。通常我们说起响应式设计都是针对网页设计的。同一个页面,随着屏幕尺寸的改变,自适应地改变页面布局。

通俗来说,这个网页就可以自动适应手机,平板,和电脑的各个分辨率。用户在各个设备上浏览这个web页时,页面布局和交互都是自动调节的,相当舒适。

 

以页面中的单个功能区为例:

*  比如,内容区块的在一定程度上能够自动调整,以确保填满整个页面。

*  比如,网格排布,能够减少/增加排布的列数。如图片布局在“1行1列” 到“1行N列” 之间,自动调整列数。

*  比如,能够适应比例变化的图片。图片自动调整大小。

*  比如,筛选功能在网页里是在页面左侧一列,全部展开显示的,在手机里就可以隐藏显示,通过按钮点击,有滑出菜单之类的。

 

Tips: 做响应式设计,需要公司舍得投入资源,因为涉及到很多额外的工作量。最起码有以下:

*  Designer | 设计——做3套设计。

*  Frontend Engineer | 前端——写响应式设计的代码,可写1套,可写3套(方便维护)。

*  QA Engineer | 测试——测不同的分辨率,最起码测3套。这还没算fix bug后的retest.

 

为啥3套?因为针对分辨率需要做2个节点。我司一般是792px<X<1440px

 

好了,响应式设计就大概讲一下吧。不然又能写好几页。收~


 


以Youtube为例,大家可以感受下搜索框的响应式设计。


搜索框的宽度是会自动调节的。最小的时候就一个放大镜图标(此时为适应手机分辨率),但最宽也就是固定到640px,不然太宽了,输入关键词时,搜索按钮离得太远,点击也会很不方便。




三、 按钮样式


搜索框的按钮样式,同样取决于搜索功能的重要性。也需要平衡整体页面布局。


按钮样式大致情况,如下图所示:

*  色块带图标的

*  只有一个图标的

*  没有按钮的

*  色块带图标+文字的。

*  其他(比如就一个放大镜图标等。图片中没做展示)



具体怎么应用,详见后文:


四、 正常显示 or 简化显示?

九、 一个页面里有2个搜索框怎么处理?




四、正常显示 or 简化显示?


有些Web中的搜索框,因为各种原因,可能就会做简化。而不是整个显示,这个需要根据情况决定,就是——随机应变~


比如,Apple官网,只显示一个放大镜图标。

此处跟上文提到的小米官网的情况类似。商品品类就这些,导航条突出品类,搜索功能弱化。


但苹果在此处更弱化了搜索,只放一个放大镜图标。(从UI上看,目测是由于导航条中品类太多,放不下搜索框了。) 等用户点击了放大镜图标后,才使用CSS / JS特效,滑动显示完整的搜索框,且居中显示。



再比如,Airbnb 爱彼迎,全球民宿短租公寓预订平台。

网站中,搜索功能很重要,是用户预定,增加销售的入口。因此需要突出搜索框。


*  首页,默认显示完整的搜索框。


*  当页面滚动时,搜索框置顶显示,方便用户查询和预定,增加潜在销售可能。但是这个搜索框的内容太多,硬要在置顶层中全部显示的话,这个始终置顶的层的高度就会很高,会影响用户浏览页面内容。

那么就把搜索框略微简化,相应的高度也就小了。(不建议只放一个放大镜按钮,太弱化搜索功能了。会流失潜在客户,流失潜在销售可能)


*  搜索框在置顶层中居中显示,点击简化版搜索框后,才动效显示完整的搜索框。




五、默认要显示提示文字啊!


在输入框中可以提示搜索示例,告知网站支持哪些内容的搜索,以及如何使用功能。防止用户一脸懵,优化用户体验。


通常适用于数据库,资讯类这些内容类型较多的网站。


比如,天眼查。(垂直顶部居中的搜索框)



比如,网易云音乐。 (右上角搜索框)


六、推荐词


基于业务需要,搜索框内经常会有推荐词,方便用户不用输入关键词就可以直达结果。同时,也是一种对商品的促销,对资讯的推广。根据不同需要,可以有不同的显示方式。


Tips: 推荐词,热搜词,促销,广告都可以这么处理。

 

1. 框内


1)单个推荐词交替显示

 

比如,小米官网



截图为动态图哦,大概5秒换一个推荐词。个人觉得间隔时间有点长了。



2)多个推荐词同时显示


比如,LexisNexis 全球顶级法律数据库 中国站

没有和小米一样,做1个推荐词的动态交替显示,是因为用户场景不同。


考虑到LexisNexis的用户都是律师群体,工作中时间宝贵。使用网站不是闲逛,而是为了快速查询数据,没有时间等待。因此一次性显示2-3个推荐词,方便用户直接看到,直接点击。


提示:推荐词可能会大于3个的,比如有8个。那就在用户每次回到首页后,显示一批新的推荐词。


或者,直接显示在框外,如下文所述。


2. 框外


比如,淘宝



七、有很多分类怎么办?


如果要针对很多内容类型分别搜索怎么办呢?搜索框怎么处理呢?有很多方法。


按复杂程度,依次进阶如下:


1. 下拉框型

一般用下拉框了,那通常分类对于搜索不是太重要,不用突出显示。


2.Tab型


如果用tab来展示分类了,那目的通常是:


*  推广产品或内容

*  引导用户,优化用户体验

 

1)横版显示。比如 某房产网站



2)竖版显示。比如 知网

搜索框的左侧的3个Tab为内容类型分类。

搜索框中展开的下拉框中是字段,此处一并展示。



3)竖版+横板显示。比如 某房产网站

如上图,是竖版分类+横版的两个搜索按钮。



如上图,是竖版的分类+横版的分类。横版的分类还做了2级分类。分类太多,相信设计师们在处理时也挺头大。




八、 一个页面里有2个搜索框怎么处理?


回答:哪个重要,就突出显示哪个呗!

 

以Amazon为例,

该页为商品评论页面。


*  顶部搜索框为全站搜索,非常重要。因此宽度较长,按钮为亚马逊的主色调黄色,醒目。

*  页面内的搜索框,为针对评论内容的搜索,则相对弱化。





第二章 搜索框-光标触发的状态


搜索框的默认状态讲完了。那么当鼠标点击搜索框,此时还没有输入任何内容,那么光标触发的状态是怎样的呢?通常,根据业务情况,大多数搜索框都会自动弹出下拉框


我们此处只讨论下拉框中的显示情况。


一、下拉框中,历史记录+热搜词是大部分网站的标配。


比如,B站。



二、 下拉框中,在历史记录+热搜词的基础上,再添加些网站自己想推广的内容。


比如,Zcool本酷。



三、下拉框中,根据网站自身业务情况,显示个性化内容。


1. 比如 Zillow, 美国知名房产估价网

网站业务就是估房价。下拉框中,第一行就是“当前位置”,点击后跳转到结果页,显示定位地址的相关结果。优化用户体验。


2.    比如,携程。

携程的业务结构相对复杂,搜索也就相对复杂。搜索项同时也涉及到很多字段/参数,其实也类似表单了。后面有机会可以讲下表单的交互,此处不延伸讨论了。大家有兴趣可以去逛逛携程。




 

第三章 搜索框-搜索中的状态


在搜索框中,一旦开始输入字符,那新一轮的交互又开始了。


一、 默认交互


目前通用的规则——搜索联想功能,Google已经定义好了。我就不重复写了,如下摘自UXPlanet:


Google自2008年以来掌握并实施了“搜索联想”。


 “搜索联想”(自动建议)可以帮助用户通过已输入的文本来预测可以找到的查询结果,为用户节省了时间并创造了更加便捷的体验。

 

交互细节如下:


*  确保搜索联想是有效的,设计不完善的搜索联想会混淆和分散用户的注意力,所以使用拼写自动更正、词根识别、语义识别和预测,可以改进搜索体验。 

Lu倾倾 注:中文搜索还要识别拼音)


*  尽可能快速的提供搜索联想,例如输入到第三个字的时候,就给用户提供相匹配的联想词汇,以此减少用户数据录入的工作。

Lu倾倾 注:现在其实输入第1个字就可以提供联想了。)


*  只提供少于10个项目的联想词句(不建议使用滚动条),否则信息将会变得难以承受。


*  允许用户通过键盘的上下键控制选择列表。

Lu倾倾 注:

百度在使用“键盘”(鼠标不行)上下选择列表时,如果高亮在某个联想词上停顿2秒以上,则等同于“回车键”,整个页面的搜索结果刷新。 Google不支持此功能。

这是用户体验的差异)


*  UI上,已输入文本和建议文本视觉上保持差异(例如,通常情况下建议的词汇通过加粗表示)



二、 个性化交互


1. 比如,Google

(Google作为搜索引擎的灯塔,搜索交互亮点的地方太多太多了,这里只举个小例子。)

如上图,不只在下拉框中展示搜索联想的关键词。

还把关键词作为一个词条显示给客户,比如电影,比如品牌。还同时显示各自的参数,比如 图片,字段。

可以帮助用户了解信息,精准定位。



2. 比如,维基百科。

由于网站的定位不同。维基百科是一个百科全书,其中都是各类词条相关的知识/信息。因此下拉框中的联想,都是以词条形式显示的。包含了图片,词条名, 参数/字段。



3. Amazon 亚马逊


亚马逊的用户体验也是做到极致了。搜索下拉框除了提供搜索联想的关键词,还按照不同的特殊关键词,提供不同的参数选项,方便用户一步到位,不用再到搜索结果页里做一次筛选了。优化用户体验。

比如,想搜索“chair”, 输入了关键词“chai”(注意,还没打全 chair),下拉框中除了显示chair相关的商品。还直接把chair的价格区间显示出来,方便用户点击后,直接显示相关搜索结果。


相信此处亚马逊的PM们是做过usage分析的,chair列表页中,应该是 “价格”筛选的usage是最高的,并且极有可能用户进入chair列表页的第一个用户行为就是对价格做筛选。PM们就干脆把筛选项放到了搜索下拉框中了。



针对关键词”ipad”, 也是同样的交互处理方式,此处是显示“尺寸”区间。



针对关键词“alarm”,下拉框中按照闹钟的不同“功能”,显示“图片+分类“,方便用户直接点击。




【亚马逊篇 番外】


在收集亚马逊案例的时候,好玩就去搜了搜国货之光“马应龙“,歪果仁们的评论简直是太欢乐了,看着看着我都笑出了鹅叫声。


于是就跑偏了,翻译了2个评论,贴了上来。大家看文章看久了,休息下~






三、搜索下拉框中的多选功能

以上,讨论的都是输入单个关键词搜索的情况。


那么输入多个关键词的交互该怎么处理呢?

N年前,我在《交互设计稿-纯实例》之前我写过,此处不再赘述了。


如有兴趣,请戳,https://www.zcool.com.cn/work/ZMjY4Nzg3MDA=.html




四、回车 or 不回车?

大部分的网站的搜索功能,都是需要在输入关键词后,点击“搜索按钮“ or “回车”,才展示新的搜索结果页的。(此处不讨论百度中,键盘移动到联想上就刷新结果页等特殊情况)


即一定要有个确认的命令,才触发搜索。这里面有很多考虑。比如:


*  数据量大,如果是实时响应+即时加载搜索结果页,对服务器和代码质量的要求都太高。


*  用户体验不太好。因为用户还没输入完,或者还没确定。页面就在不停的刷新,会干扰用户。

 


但,也有个别工具软件中,不用按回车,就实时刷新搜索结果。比如,Figma.


在软件中,都是自己的存档文件,数据量本身就不大。此时边输入关键字,边实时响应,刷新搜索结果页,让用户随时看到自己的文档。这种情况下,不用按回车,用户体验还更好。

 

 

以上,终于写完了。

暂时写到这吧,总结太累,但是值得!

 



最后,附上Amazon贝索斯的原话:




翻译如下:(没有太直译,不然有点拗口)


“以用户为中心”有很多优点,但最大的一个就是:用户是美丽的、棒棒的、不会满意的,即使他们说我们的商业很赞,他们表示很开心很满意。但他们其实想要更好的东西,不过他们自己并不知道。那么你的让用户愉悦的渴望,会驱使你代替他们去发明创造。


——杰夫*贝索斯,2016年给股东的信




额,还是拗口。简单来说,就是:


筒子们,为了让用户高兴,发挥你们做产品/交互的主观能动性吧,自己研究创造去,做个好产品出来。不用指望用户告诉你做什么/怎么做,他们也不知道。



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

文章来源:站酷  作者:LU倾倾

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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

你常常忽略的7个具有破坏性的体验鸿沟

雪涛

若想战胜竞争对手,产品无疑需要在设计上做好提前规划,并时刻树立优化意识,尽量满足用户的体验期望。然而研发团队有时总容易陷入误区,本篇文章里,作者就产品研发过程中可能忽略的、对用户体验具有破坏性的因素做了总结,一起来看一下。

毫无疑问,要想获得出色的用户体验 (UX) 需要在数字世界中保持竞争优势。尽管如此,由于某些关键盲点,改善用户体验的努力并不总能取得成功。如果忽略这些盲点,那么无论预算大小和团队的努力如何,失败都会预先留存在项目中。事实上,如果实施不准确,可能会导致所谓的“经验差距”造成的设计上的损失。

你常常忽略的 7 个具有破坏性的体验鸿沟

上图所示的具体案例:某银行投资了近 50 万美元改进其手机银行应用程序,却导致整体客户满意度下降。其根本原因是金融公司未能发现和预防不同级别的内部经验差距。那么,该如何及时识别和避开这些盲点,以保障耗资巨大的大规模数字化项目的成功呢?

一、即使预算庞大,用户体验工作也可能失败 UX efforts can fail even with huge budgets

在过去十年中,大量研究证实,用户体验对公司市场效率存在优先影响。根据甲骨文的一份报告,如果糟糕的用户体验导致多个业务问题,那么积极的用户体验会增加推荐、保留率和收入,因为 86% 的客户愿意为更好的用户体验支付更多费用。

看起来一切都很简单——只要增加预算和成本,就足以提供最好的体验?但在实际操作中,这并不容易。根据贝恩公司的研究,80% 的 CEO 认为他们提供了卓越的体验,而只有 8% 的客户同意这一点。

其主要原因可以用“经验鸿沟”来解释——这是客户期望的体验与他们从数字服务中获得的体验之间的负面差异。如果体验比预期的差很多,就会产生许多令人不快的后果,比如客户忠诚度下降、大量负面评论,甚至客户决定离开品牌。

在大多数情况下,人们往往无法认识到真正的经验鸿沟。

即使公司的领导和员工觉得有些地方不对劲,他们也往往不明白“要改进什么”以及“为什么要改进”。如果没有意识到某件事,就不可能管理它。

二、现实生活中的例子:行动中的经验鸿沟 Real-life example: Experience gap in action

为了解释“经验鸿沟”可能导致麻烦的基本原理,我想分享一个现实生活中的例子。

几年前,一家知名且受人尊敬的中欧银行开始了大规模的数字化转型之旅。当时,该银行的应用程序的评级为 3.5,并且已经过时。所以,为了实现数字化、提升银行形象,并在不断增长的数字市场中获得竞争机会,管理层打算紧急创建并推出一款现代化的银行应用程序。因此,最初的设计和开发周期为 6 个月。

尽管如此,银行还是花了三倍时间(1 年零八个月)自主构建新应用程序。无论从时间来说,还是从投资预算来说,这都可以称得上是一个重要项目。从项目的范围、所做改进和时间表来看,总成本估计在 50 万左右。

然而,结果完全没有达到预期。新应用发布后,它从之前的 3.5 下降到 2.4,并且因为它没有改进,以至一年后,其评分仍在下降,其用户体验也日渐恶化。

银行尽一切努力改善用户体验,整个团队努力工作近两年,怎么会发生这种情况?

这种情况的产生,正是由于“经验鸿沟”的存在。尽管该银行启动数十名顶级专业人士花费了 20 个月和 50 万来改良产品,但它仍未满足用户的期望。

虽然客户不满意的真正原因是无意识的“体验鸿沟”,但公司往往倾向于通过指责外部环境来解释它。例如市场的变化、竞争对手的活动、创新的出现、消费模式的变化。当然,这也是客观事实,但一家适应性强的公司应该考虑将这些因素用于其增长,而不是作为“替罪羊”。

但衡量适应效果的最重要方式是公司服务在多大程度上满足甚至超过了消费者的期望。没有意识到他们服务和客户期望之间存在差距的公司注定无法适应外部环境的变化。

在某些情况下,公司的行为甚至会导致经验鸿沟扩大到临界水平。这通常会导致目标客户对公司产品和服务的需求急剧下降。

如果我们回到这个例子,似乎管理层对重大改进是否可以成功充满信心,并投入了大量资金和精力进行广告宣传。同时,那些宣传此应用程序现代、创新和友好的广告,激发了消费者的高期望,以至于大大超出了其服务的实际质量。

结果,当产品最终发布时,客户惊讶地发现他们的期望落空了,新应用程序比改良前更糟糕。并且相关的负面评论不仅出现在 App Store 和 Google Play 上,也在社交媒体上大量涌现,人们在推特上不断讽刺该银行失败的数字化项目。

三、对鸿沟的不了解是主要威胁 Unawareness of the Gap is the main threat

接下来,让我们探讨一下数字服务和用户期望之间的鸿沟是如何形成的,以及为什么没有人能够阻止它。

事实上,最大的挑战是大家往往很难注意到这些差距。他们的原因并不明显,并且可以同时存在于各个组织架构之上。此外,它们的影响令人难以察觉,以至于最终会导致意想不到的破坏性后果。最终,直到团队面对产品在市场上的失败,才有人明白原因是什么。

弥合鸿沟的主要困难在于级别越高对经验鸿沟的不了解程度越高。实际上,在组织架构的顶部,通常会找到造成鸿沟的根源。级别越低,离用户越近,员工越能觉察到问题和差距,但他们往往没有权力和能力去消除它们,他们受制于文化。

在这种特殊情况下,售后部门每天都会接到数千个关于产品问题的电话,但由于业务流程分散,他们对此也无能为力。

客户的挫败感变得更加强烈。即使是最简单的日常场景,他们面临的问题也难以执行,但他们从银行员工那里得到的反馈是,他们并不是唯一产生困惑的人,而且目前银行正忙于交付新功能,而不是修复当前问题。

使事情变得复杂的是,经验鸿沟背后的内部流程是由过去促进公司生存和增长的相同机制引起的。该公司受制于过去的成功。就像诺基亚一样,这家全球最大的以硬件为中心的手机工厂,在苹果智能手机引领的软件革命中被彻底击败。

由于任何组织都有惰性,这些机制受到内在信念和价值观的影响,对适应市场和弥合经验鸿沟造成了阻碍。

首先,应该在管理层面解决鸿沟。因此,级别越低,离领导层越远,离客户越近,就越能感受和认识到鸿沟的存在。自然,一线员工将拥有从那些期望没有得到满足的客户那里得到最多的数据。

四、7 种体验鸿沟盲点 The 7 types of experience gap blind spots

主要的体验鸿沟可能是由组织中七个层次(文化、反馈、执行、设计、价值、品牌承诺、情感联系)中的一个或几个盲点造成的。

你常常忽略的 7 个具有破坏性的体验鸿沟

1. 文化鸿沟

在文化层面缺乏以顾客为中心的理念员工无法使服务更接近客户期望导致了“文化鸿沟”。在具有“文化鸿沟”的公司中,有助于以客户为中心的流程和活动都是处于低优先级的,相应的,它们也不会得到相关的资源。

2. 反馈鸿沟

缺乏关于客户期望和他们对产品或服务的体验数据会造成“反馈鸿沟”。在这种情况下,公司可能经常收集数据,但没有对其进行分析,也没有采取任何措施来改善这种情况。

3. 设计鸿沟

即使优先考虑以客户为中心的方法并且收集了大量有关客户期望的数据但在设计能力和方法上仍可能存在鸿沟。拥有合适的专业知识,就可以构建高质量的数字产品生态系统,从而根据客户需求提供最佳服务。

4. 执行鸿沟

这种鸿沟与糟糕的设计执行有关。如果不优先以用户为中心的来设计产品,那么创建最终产品和服务的决策和努力将注定是低质量和低效率的。这决定了公司在数字时代创造有竞争力的服务和产品的能力。

5. 价值鸿沟

如果设计生态系统在 价值金字塔的五个层次(功能、可用性、美学、地位、使命)上不符合用户的期望,就会形成价值鸿沟。

6. 过度承诺的鸿沟

正如我在上述银行案例中所表明的那样,如果一家公司只顾着积极推广其服务,承诺一些产品无法提供的东西,它会导致用户对期望的更大失望。因此,由于广告承诺与现实不符,对该服务的负面评价可能会翻倍。

7. 情感鸿沟

如果品牌传播是纯粹的信息传播专注于功能特征那么就无法与用户形成情感联系。由于人类基于情感做出决策,因此基于情感构建服务价值会对客户期望和最终用户体验产生积极影响。

五、弥合经验鸿沟 Bridging the experience gap

每个客户都会不知不觉地根据自己的期望来评估他们所接受的服务。用户体验质量所引发的情感将形成品牌的声誉。

在现代世界,数字渠道已成为品牌的主要“营销”和公关渠道。

一个应用程序,即使有一百年的服务客户历史和其他渠道的优质服务,负面体验也会破坏品牌推广的所有努力。

这仅仅是因为在数字时代,移动渠道占主导地位,对于某些人来说,它正在成为与品牌互动的唯一途径。这就是为什么了解如何弥合数字产品出现的七个体验鸿沟的方法如此重要。

1. 弥合文化鸿沟

在文化方面,转型基于高层心态的改变并将这种影响渗透到整个的公司文化和内部价值观。特别是,可形成“以客户为中心”的体验思维模式。

2. 弥合反馈鸿沟

在银行案例中,开始弥合反馈鸿沟的第一步,是深入了解社交媒体上的负面评论以及致电售后部门的电话。接近这些客户才容易消除反馈鸿沟。事实上,他们比管理层更了解应解决哪些问题,并且往往渴望积极分享自己的情绪并希望得到倾听。如果一家公司足够开放并准备好接受批评,它可以使用这些数据来弥合鸿沟并提高产品迭代的敏捷性。

3. 弥合设计鸿沟

通过整合设计方法和设计思维来制定弥合鸿沟的策略可以使用设计金字塔。该框架从五个层次(流程、团队、行动、结果和价值)确定了能够提高公司整体效率的设计集成。

4. 弥合执行鸿沟

组织必须将经过验证的设计执行方法(例如设计思维、HCD 或 UX 设计方法)与分步系统相结合,以设计符合客户期望并能够弥合执行鸿沟的数字产品。

5. 弥合价值鸿沟

产品的功能级别为客户创造真正的价值和利益并通过提供卓越的可用性进行功能扩展;美学 ——令人惊叹的视觉识别;状态 —— 针对产品特定受众的个性化,最后是建立产品的价值观与使命。

6. 弥补过度承诺的鸿沟

数字时代的客户要求透明关怀诚实和开放的沟通。由于网络效应,几乎不可能销售劣质产品,因为每个人都可以在社交媒体上发布负面反馈,而这些负面反馈将深深地损害客户的信任。因此,做出不仅可以兑现,甚至可以超额兑现的承诺至关重要。

7. 弥合情感鸿沟

对客户的同情和关怀比以往任何时候都更加重要。在品牌与客户之间建立情感联系对于确保长期忠诚度和需求至关重要。这种联系是通过之前涵盖的所有阶段建立的——将客户放在第一位的正确心态;收集反馈并在此基础上进行改进;使用正确的工具和方法来创建产品设计和生态系统;创造真正的价值和利益,最后,通过诚实和超额兑现承诺。

六、成为深受喜爱品牌的途径 The pathway toward becoming a beloved brand

该途径涵盖了可能破坏数字产品创造的 7 个主要体验鸿沟以及可以帮助避免和解决这些鸿沟的 7 个桥梁。如果一个品牌能意识到这些盲点,它可以立即获得比仍处于盲点的竞争对手的显著市场优势。

仅凭意识就可以产生巨大的差异,但将意识与行动相结合会导致长期成功,成为一个需求量很大和深受喜爱的品牌。

本文翻译已获得作者的正式授权(授权截图如下)

你常常忽略的 7 个具有破坏性的体验鸿沟

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

文章来源:人人都是产品经理  作者:TCC翻译情报局

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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


在线音乐杀出个程咬金

雪涛

今日,有消息称字节跳动将会推出一款名为“飞乐”的音乐流媒体产品。字节跳动的入局,或将引起音乐行业的新波澜。本文作者对此发表了自己的观点,一起来看看吧。

擅长“四路出击”的字节跳动,又双叒叕出手了……

长期以来,关于字节跳动扩张的消息就一直不断。前有抖音内测“心动外卖”进军外卖领域,后有字节跳动收购VR公司的消息登上热搜……近日,有报道称字节跳动将于今年下半年推出一款音乐流媒体产品,产品的名称暂定为“飞乐”,项目内部代号为“luna”。而字节跳动的再次入局,或将引起音乐行业的新波澜。

一、坚持不懈的音乐梦

今年4月,字节跳动成立了音乐事业部;7月份的时候,字节跳动将音乐升级为P1优先级业务,与游戏业务和教育业务平级;不久之后还内测了音乐代理发行平台“银河方舟”。除了自身做音乐之外,字节跳动还投资了校园音乐平台。这一系列动作无一不展现了字节跳动发力音乐领域的决心,而字节跳动之所以如此看重音乐业务也是有一定原因的。

首先,音乐业务有助于字节跳动获取新流量。据CNNIC发布的第47次《中国互联网络发展状况统计报告》显示,截至2020年12月,我国的网络音乐用户规模达6.58亿,与2020年3月相比增长了2311万,占网民整体的66.6%。其中,手机网络音乐用户规模达6.57亿,与2020年3月相比增长了2379万。随着短视频领域流量见顶,字节跳动亟需找寻到新的流量增长点。

其次,音乐行业用户的付费意愿在逐步增强。据前瞻产业研究院发布的相关报告显示,我国的网络音乐付费用户规模已经由2016年的2017万人,增长至2020年的7192万人,网络音乐付费渗透率也由2016年的4.0%增长至2020年的10.9%。网络音乐用户的月度消费金额也由2017年的8.5元,增长至2020年的9.5元。

以腾讯音乐为例,据其最新发布的二季度财报显示,截至2021年6月30日,腾讯音乐的在线音乐付费用户人数达到了6620万,同比增长了40.6%,与今年一季度相比净增长了530万人;付费率为10.6%,与去年同期和今年一季度的付费率相比均有所提升。

最后,音乐业务与字节跳动旗下的短视频业务相辅相成。配乐是制作短视频必不可少的环节之一,配乐和内容契合度极高的优质短视频往往能收获很高的播放量,但也正因短视频配乐使抖音多次陷入侵权局面,不少短视频也因其所使用的音乐无版权而被做下架处理。倘若字节跳动推出音乐产品,就能够为短视频用户提供更为方便的曲库支持,有利于短视频用户进行创作。

二、逐梦音乐有“加成”

7月24日,国家市场监管总局责令腾讯音乐解除其网络音乐独家版权;8月31日,腾讯发布了《关于放弃音乐版权独家授权权利的声明》。众多音乐平台不再被音乐版权“卡脖子”,字节跳动于此时再度发力数字音乐,自然也能享受到行业大环境变化所带来的重大利好。除此之外,还有其他原因也会对字节跳动发展音乐业务产生积极影响。

其一,是其拥有庞大的流量优势。据抖音发布的《2020抖音数据报告》显示,截止2020年12月,抖音的日均视频搜索次数突破4亿;截止2020年8月,抖音的日活跃用户数量突破6亿。有抖音这一巨大流量池为其引流,无论是音乐流媒体产品的用户获取,还是音乐作品宣发都会容易一些。

9月9日,工信部相关业务部门召开了“屏蔽网址链接问题行政指导会”,提出有关即时通信软件的合规标准,要求9月17日前各平台按标准解除屏蔽。随着屏蔽外链的解除,字节跳动也将从中获益,迎来新一波流量增长。

其二,是创作者扶持计划成效显现。早在2018年,抖音就启动了“看见音乐计划”以扶持原创音乐,随着不断进行的音乐扶持计划,抖音的音乐生态也在逐渐完善。据《2020抖音音乐生态数据报告》显示,2020上半年抖音的音乐人入驻数量增长近3万;近半年抖音音乐人涨粉累计超3亿,其中涨粉超1000万的音乐人有6位,涨粉超500万的音乐人有23位。

而抖音扶持音乐计划的成功,也给字节跳动的音乐流媒体产品打了样。字节跳动在发展音乐业务时,也可以采用类似的策略进行音乐产品内容生态的完善。另外,部分抖音音乐人也可能成为字节跳动音乐业务的潜在音乐人,为字节跳动音乐业务的发展添砖加瓦。

其三,算法优势助力音乐业务发展。众所周知,算法是字节跳动的一大特色,今日头条和抖音能取得当前的成绩,与字节跳动的算法推荐不无关系。据悉,字节跳动的音乐业务主要由前台和市场、算法两大中台支持构成。在中台方面,由抖音的市场团队承担国内音乐人合作与版权宣发,算法团队负责提供智能配乐、安全风控等技术支持。

三、在线音乐硝烟起

无论是后版权时代的来临,还是字节跳动自身的优势都对其发展音乐业务大有裨益,但机遇与挑战并存,字节跳动在迎来重大利好的同时,依然面临着不小的挑战。

一方面,腾讯音乐的霸主地位难以动摇。在“取消网络音乐独家版权”尚未落地之前,腾讯音乐凭借海量的正版歌曲曲库以及持续建设的内容生态,稳居行业头部。据腾讯音乐发布的财报显示,今年二季度腾讯音乐的在线音乐月活跃用户数为6.23亿,仅月活跃用户数这一项指标,字节跳动在短时期内就很难与之相匹敌。

另一方面,网易云音乐的音乐社区文化别具一格。在被音乐版权“卡脖子”的时期,网易云音乐凭借其音乐社区文化,成功地从众多音乐平台中脱颖而出,浓郁的社区氛围也极大地提高了用户的黏性。另外,网易云音乐不断推出的扶持计划也增强了其内容竞争力。

网易云音乐的这些特色化优势,也将为其在今后的发展中提供助力,但对字节跳动来说,拥有这些差异化优势的网易云音乐,无疑是一位强劲的对手。

另外,快手也在音乐领域有所布局。早在2018年的时候,快手就推出了一款音乐产品“光音Mulight”;今年2月26日,快手推出了音乐K歌APP“回森”;5月份的时候,快手推出了音乐APP“小森唱”,该软件的核心功能是AI创作词曲用户进行演唱,在演唱之后还可以通过点赞评论等方式进行互动,最终达到社交的目的。随着快手在音乐领域的不断加码,也会对字节跳动音乐流媒体产品的发展产生影响。

目前来看,随着行业大环境的变化,在线音乐领域的竞争愈发激烈已经是无可辩驳的事实。无论是稳居头部的腾讯音乐,还是擅长打情怀牌的网易云音乐,亦或是跨界而来的快手,都是字节跳动音乐流媒体产品的强劲对手。而字节跳动能否在强手如云的音乐行业闯出一片天,仍待时间验证。

文章来源:人人都是产品经理  作者:韭菜财经

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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

行业研究:分析框架与思考维度

雪涛

做好行业研究,有助于企业或个体从业人员更好地洞察市场,进一步发现机会,或者找准产品定位,推动企业战略决策和后续实施。本篇文章里,作者就行业研究的分析框架与思考维度做了总结和梳理,一起来看一下。


一、行业研究的目的

以始为终,构建行业研究的方法论和分析框架,需要从目的出发,下面列举几类典型的行业研究报告目的。

券商的报告(二级市场),分析某个行业是否有投资价值,从行业赛道的选择过渡到这个行业赛道中的值得被投资的公司,说明这个行业中哪些公司更有投资价值。报告结果是要用于股票投资服务的。二级市场由于公司财务报告的披露性质,公司的财报分析在行业报告中也是重要的构成部分。

互联网战略投资部门/VC的报告(一级市场),互联网战略投资部门通常以公司的战略发展目标为出发点,布局上/下游产业链,或通过收购竞品公司,巩固和发展公司在行业的竞争力,提升市场占有率,开拓新的市场;VC通过布局细分的赛道,选择合适的投资标的,参与风险投资。

值得注意的是在互联网初创企业的财报分析通常不作为重要参考因素,多数互联网公司在初创期将投入大量资金,长期处于亏损状态,此时,市场份额和估值与传统二级市场的分析方式有较大差异。

咨询公司的报告,目的是为行业内的公司服务的,说明该行业的行业规律、行业风险、行业机会、行业发展趋势等。在行业研究的内容方面,咨询公司常见的模式还包括访谈调研行业内公司高管。

二、行业研究的常规分析框架

基于行业研究的目的,常规的行业研究框架,包括一下几个核心部分:宏观分析、行业分析、公司分析、消费者分析、竞争者分析,其中宏观分析和行业分析的视角都是从赛道链路的角度,进行整体分析,而公司、消费者和竞争者则是从市场参与者的角度进行分析。

1. 宏观分析

1)宏观分析思考的维度

  1. 宏观分析的因素大多非直接影响行业和公司,而是通过影响宏观基本面,进而对行业产生间接影响。
  2. 在宏观分析中,多数分析不是仅仅是单因子影响,而是混合因子影响的结合。
  3. 除了行业分析的分析范围,宏观分析应该考虑更广阔的范围要素,例如如果限定为某一国家的具体的某一行业研究,需要将宏观分析的内容范围扩展至全球范围内的影响要素分析,将中外的宏观影响影响都考虑到。
  4. 最后,宏观分析需要考虑时间维度,不能局限于静态分析,既要考虑存量数据,也要考虑趋势变化,同时考虑增量数据。

2)宏观分析考虑的内容:

宏观分析中考虑的因素点对行业环境的影响,因素点可采用PEST模型分类,但不必拘泥于PEST模型,因素点间可能是组成多因素,从而对行业环境产生间接或直接影响。基于PEST模型,因素点可以分为:

① 经济类

包括经济发展水平、社会经济结构和宏观经济政策,其中经济发展水平可以通过较为典型的量化指标进行衡量,例如GDP\CPI\进出口规模等;宏观经济政策主要包括货币政策和财政政策;社会经济结构主要体现在经济体制和产业结构构成。

② 政治类

包括政治体制、政局稳定性、和相关的政治政策。

其中政治体制包括资本主义、社会主义和中国特色社会主义等,政治体制对行业的影响为间接影响;政策包括投资政策、环保政策、进出口政策、货币政策和财政政策等,也有针对具体行业的政策,例如近期发布的教育“双减”政策就对在线教育行业产生了不小冲击,网络安全隐私数据保护政策对互联网公司获取用户使用偏好数据,产生了非常大的影响。

其次,除了政治政策,政局的稳定性对行业发展稳定产生重要影响。

③ 文化环境类

包括人口因素、社会流动性和消费心理,此类因素可与消费者分析关联,对消费者细分市场和市场定位产生了重要的影响,主要从聚类的角度,对消费群进行分析。

人口因素主要考虑人口总数、年龄构成、性别比例、教育水平、人口地理分布等,社会流动性主要考虑社会阶级流动性和贫富差距;消费心理主要包括生活方式、文化传统和价值观等,对消费者偏好心理产生影响,从而影响消费者的行为决策。

④ 科技类

主要包括专利技术数量和质量、相关产业技术等,科技对一个产业的生产效率与产品更新,甚至一个产业的萌芽和灭亡都将产生巨大的影响,例如智能芯片对手机行业产生了巨大的冲击,原有的非智能手机迅速被智能手机取代,生产非智能手机的厂商迅速破产。

综上,宏观类因素多数为混合因子对产业产生直接或者间接的影响。

2. 产业分析

1)产业分析思考的维度

① 整体市场分析

整体市场分析除了关注静态的存量市场,也需要关注动态的增量市场。市场的现有市场规模和增速决定了市场的规模,体现为市场的“宽”度和市场的“长”度,行业壁垒和驱动因素影响参与市场的玩家数量,体现为市场的“陡”度。

② 市场参与者

市场参与者从各个角度,在产业分析上有不同的分析时间,例如从产业链角度,分析上下游供应商和购买者、从行业参与者的角度,分析竞争者和行业集中程度。

③ 影响因素

产业影响因素和宏观影响因素的区别在于,产业影响因素从供给需求、驱动和壁垒的角度分析更为直接的影响因素对产业产生的影响。

2)宏观分析考虑的内容

① 产业规模

产业规模可以从空间维度进行解析,产业的宽度代表现有市场规模,产业的长度以时间为维度,代表增长率和增长率增速,而产业规模=现有市场规模*增速。

由此可见产业规模的衡量有两个重要的衡量标准和指标,即市场规模与复合年均增长率(CAGR),市场有多宽指行业规模有多大、增长的天花板有多高,是衡量一个行业现有市场容量和将来市场发展空间的最重要的标准,现有市场容量决定了该市场有多少蛋糕可以分,而市场增速决定了行业发展潜力,行业增速可与行业的成熟度曲线紧密联系。

② 产业生命周期

产业的生命周期以时间为维度,一般分为导入期、成长期、成熟期和衰退期。产业生命周期在导入期、成长期、成熟期和衰退期的不同阶段,可以从经营风险、财务风险、产品差异、单位利润、产品特征等不同维度进行分析,详见下图。

③ 产业链

产业链分为上游供应商、下游购买者、潜在进入者和现在竞争者,将企业放在产业链进行分析,需要对供应商和购买者有较高的议价权,能有效面对竞争者。

其中,影响供应商议价能力的影响因素包括市场占有率、转换成本和供应商战略,影响购买者议价能力的影响因素包括价格敏感度,相对议价能力等,影响潜在进入者的障碍有结构性障碍和行为障碍,影响替代品威胁的主要因素包括产品同质化程度和劳动生产效率等。

④ 产业驱动因素与行业壁垒

产业的驱动因素主要分为两个部分,第一是生产要素驱动,第二是相关支持性产业驱动,其中,生产要素包括高级生产要素和初级生产要素,而相关支持性产业,则表现为产业链上下游的聚集驱动。

行业壁垒:行业壁垒分为限制性要素和市场壁垒,可以通俗理解为一只“看得见”的手和“看不见”的手,即政策限制和市场限制。

政策限制如进出口限制、许可证、配额等,实现限制如规模效益使得成本降低,对新进入的小规模玩家形成行业壁垒,又比如缺乏品牌技术,而只能成为代加工企业,获取最低的生产制造利润等。

如果行业的门槛很高,竞争者难以进入市场,行业的垄断程度也相应比较高,通常用行业集中度来分析衡量,即CR5(行业中前5名的企业占据的市场份额)。

但是,垄断程度越高,企业越有机会获得超额利润,但行业的垄断程度并非仅仅由行业壁垒所决定,消费者的需求差异也会对垄断程度产生重要影响,例如手机行业的垄断程度较高,而餐饮行业却很难出现寡头垄断,因为餐饮的消费者偏好差异非常大。

⑤ 供求分析

供给侧主要包括产能分析,同时也受行业集中程度的影响,即上文所述的行业垄断程度,产能分析包括产能利用率水平、库存周期、产品使用寿命、订单周期,这里比较典型的行业是电子产品生产制造业。

需求侧主要从消费者市场出发进行分析,同时考虑替代品,需求预测包括消费者整体购买力和细分需求市场,这里的消费者整体购买力受到宏观因素的影响,例如人均可支配收入、贫富差距等;替代品的细分影响因素包括国家进出口和国内市场替代品。

⑥ 产业结构

产品结构:产品结构可以从加工阶段和主导构成不同的视角进行分析,加工阶段主要以产业链维度为分析视角,从初级产品、中间产品和最终产品进行分析,主导构成主要从驱动因素进行分析,分为劳动密集型产品、资金密集型产品和技术密集型产品等。

市场结构:市场结构从分类上可以分为市场主体结构、市场客体结构、市场空间结构和市场 时间结构,从行业集中程度,可以分为完全竞争市场、完全垄断市场、垄断竞争市场和寡头垄断市场等,影响行业集中程度的因素在前文已经提及。

3. 市场参与者——公司与竞争者

1)公司思考的维度

① 战略

战略需要将企业放置在宏观和产业的角度,通过对赛道、竞争者和消费者的分析,制定战略,从整体分配资源,规划产品和服务。

② 经营分析

经营分析从数据量化的指标,动态指导经营过程中的业务发展。运用定量分析、业务分析和行为分析相结合的方法,对企业进行综合分析的一种现代经营分析体系。包括:经营基础分析、财务分析、市场分析、劳务分析、生产分析、物资分析等。从业务单元的视角优化运营。

2)公司分析考虑的内容

① 战略分析

战略分析包括企业能力与资源分析、价值链分析、产品组合分析、外部分析、内部分析、财务指标分析和商业模式分析等。

  • 外部分析:外部分析从企业所面临的产业环境出发,分析企业在产业环境中所面临的机会和威胁
  • 内部分析:内部分析从企业内部经营的角度出发,分析企业所拥有的资源与能力的优势和劣势,即下文所展开的企业能力与资源。企业的外部分析和内部分析构成了SWOT模型。
  • 企业能力与资源:从企业能力的视角可以分为研发能力、生产管理能力、营销能力、组织管理能力、财务能力等,这些能力构成了企业的核心能力,成为企业在市场中竞争的制胜因素,构成了企业的护城河,其次,从企业资源的视角,可以分为有形资源和无形资源。
  • 价值链:可以分为基础设施和基本活动两大类,其中基础设施包括财务、战略、法务、人力资源、技术开发和采购管理,基本活动包括内部后勤、生产经营、外部后勤、市场营销和运营。
  • 商业模式:从企业提供产品和盈利模式出发,主要关注一类企业在市场中与用户、供应商、其他合作伙伴(即营销的任务环境的各主体)的关系,尤其是彼此间的物流、信息流和资金流。
  • 产品组合:从提供的服务和产品出发,例如零售行业中的品类策略,包括产品线的和SKU的设置,即品类的长度和深度,也可以从经典的波士顿矩阵出发,分析销售增长率和市场占有率的矩阵,针对明星业务、问题业务、瘦狗业务和金牛业务制定不同的策略。
  • 财务指标:从财务指标,以始为终,进行测算和分析,包括毛利率、现金流、ROE等。

② 战略选择

战略选择可以从总体战略和智能单元战略出发,如果业务涉及海外业务,需要分析选择国际化经营战略。

  • 总体战略:总体策略是公司的总策略,可分为发展战略、稳定战略和收缩战略,其中发展战略可以分为一体化、密集型和多元化战略。
  • 职能战略:从业务单元视角,制定单元战略,一般包括营销、生产研发、运营、人力和采购战略。例如营销战略中需要制定细分市场STP,进行营销战略的选择,包括产品、渠道、促销和分销(4P)等,其余业务单元策略,在此不做过多的赘述。
  • 国际经营战略:根据全球化协作程度和本土独立性和适应能力的差别,本土企业的国际化经营战略可以分为四种类型,即国际化战略、多国本土化战略、全球战略与跨国战略。

3)竞争者思考的维度

  • 优势:竞争者分析的思路可以简单分为,发现优势是什么,以及采取何种策略发大优势,形成企业的护城河。
  • 劣势:其次,竞争者分析需要思考与竞争者相比,企业的劣势是什么,如何缩小这种劣势。

4)竞争者分析考虑的内容

  • 竞争分析:竞争分析主要从前文所述的企业资源和能力角度进行分析,包括产品优势,技术壁垒、分销渠道优势、用户增量和存量、财务状况、组织架构、核心管理层(人才资源)等视角分析,同一赛道的不同玩家在市场中的竞争力。
  • 战略选择:基于竞争分析,针对赛道中的竞争者,可以采取不同的竞争者战略,主要包括三类,即蓝海战略、中小企业战略和基本竞争战略,其中,基本竞争战略可以分为成本领先战略,差异化战略和集中化战略。

4. 消费者

1)消费者思考的维度

细分市场与精准营销:在互联网数字化的革新下,原有的消费者聚类分析越来越精细化,不仅有群体的聚类标签,个体消费者的标签也能层层穿透,为精准营销运营提供了条件。

2)消费者分析考虑的内容

基本属性:基本属性包括年龄、收入、性别、受教育程度和地域分布等。

购买动机和购买行为:根据MBA智库的定义,营销学家把消费者的购买动机和购买行为概括为6W和6O,从而形成消费者购买行为研究的基本框架。

① 市场需要什么(What)——有关产品(Objects)是什么。通过分析消费者希望购买什么,为什么需要这种商品而不是需要那种商品,研究企业应如何提供适销对路的产品去满足消费者的需求。

② 为何购买(Why)——购买目的(Objectives)是什么。通过分析购买动机的形成(生理的、自然的、经济的、社会的、心理因素的共同作用),了解消费者的购买目的,采取相应的市场策略。

③ 购买者是谁(Who)——购买组织(Organizations)是什么。分析购买者是个人、家庭还是集团,购买的产品供谁使用,谁是购买的决策者、执行者、影响者。根据分析,组合相应的产品、渠道、定价和促销。

④ 如何购买(How)——购买组织的作业行为(Operations)是什么。分析购买者对购买方式的不同要求,有针对性地提供不同的营销服务。在消费者市场,分析不同的类型消费者的特点,如经济型购买者对性能和廉价的追求,冲动性者对情趣和外观的喜好,手头拮据的购买者要求分期付款,工作繁忙的购买者重视购买方便和送货上门等。

⑤ 何时购买(When)——购买时机(Occasions)是什么。分析购买者对特定产品的购买时间的要求,把握时机,适时推出产品,如分析自然季节和传统节假日对市场购买的影响程度等。

⑥ 何处购买(Where)——购买场合(Outlets)是什么。分析购买者对不同产品的购买地点的要求,如快速消费品,顾客一般要求就近购买,而选购品则要求在商业区购买,一边挑选对比,特殊品往往会要求直接到企业或专卖店购买等。

三、总结

综上所述,行业研究的框架可从宏观、赛道、市场参与者进行分析。


文章来源:人人都是产品经理  作者:Elaine.H

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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


如何提升用户登录成功率

雪涛

什么是登录?

登录是进入一个应用程序 、网站或服务的入口。帮助用户建立他们的账户。

  • 一个登录流程通常包括一个主要的登录页和一个相当复杂的重置流程,其中包括 “忘记密码”、重置密码和其他登录方法。
  • 登录的首要目标是确保用户成功登录到他们的账户。

什么是登录目标?

让我们花点时间来定义一下“登录目标”这个术语,这是在做设计决策时的关键。

登录目标是指用户进入登录流程的意愿。以有声思维来表达,它可以是 “我想登录”、“我想检查我的电子邮件”、“带我去那里”,等等。

当用户进入到登录页时,他们可能没有登录意愿。可能会产生“嗯,我不在乎,以后再做”或“这太麻烦了”或“呀,我现在该怎么办?”的想法。忘记密码、半路遇到困难或切换到另一个页面/设备,都可能是缺乏登陆意愿的迹象。

掌握这 7 条准则,提升用户登录成功率!

我们得到了登陆目标

保留或增强登录流程中的登陆意愿是很好的目标,下面的准则都是为这个目标量身定做的。

设计熟悉的体验

设计熟悉的体验,虽说不是设计师最喜欢的设计准则,但是与整个生态系统中最好的体验保持一致是非常重要的。例如使用简单、公认的布局,使用众所周知的术语和文案,都有助于用户自信而轻松地进行熟悉的操作。

保持通用的设计也有助于将页面轻松扩展到不同的形式和设备。

掌握这 7 条准则,提升用户登录成功率!

Pinterest 有一个传统的、居中的覆盖式登录页。它有一个亮红色的主要登录按钮,并提供 Google 和 Facebook 作为额外的社交登录选项。

滑到最后,有我对网络上流行的成功登录经验的总结。这就把我们带到了下一个问题 —— 创新的界限在哪里?

登录是一个品牌展示的绝佳机会点。在视觉上,它可能使用品牌色、品牌照片、品牌插图,甚至是营销信息。和大多数设计问题一样,登录页品牌展示的关键在于平衡。登录操作应该一直占据中心位置。页面上的其他元素必须谨慎规划好,不应该夺走登陆操作的注意力。

一条优秀的经验之谈:用户在登录页面上花费的时间越少越好。帮助他们继续前进,尽快发现产品中的优点和价值。

聚焦设计

快速回顾一下:用户在登录页面上花费的时间越少越好。根据这一点,登录(或恢复)操作应当占据用户的全部注意力。

  • 最好是把登录框放在页面的中心。如果你打算把它放在一侧,最好是赋予它核心视觉效果。
  • 对于文案写作来说,指明用户在某一步骤中到底需要做什么才是很重要的!比起冗长的解释,一句简单的 “输入密码”就能起效。幽默、复杂的行话、技术术语和花哨的文笔在登录体验中是没有用武之地的。

在恢复体验中,将一套复杂的操作分解成多个步骤是很有效的。安排用户一次只做一件重要的事情!例如:输入你的手机号码和输入发送到你手机上的验证码是两个独立的步骤。

掌握这 7 条准则,提升用户登录成功率!

Facebook 在页面中保持用户信息在右侧,并将恢复流程分解为多个步骤。

掌握这 7 条准则,提升用户登录成功率!

亚马逊把它的恢复流程分解成多个步骤。它将次要的恢复选项设置为 “我需要更多帮助 ”的可扩展部分,这有助于保持注意力集中在主要操作。

保持注意力集中在主要操作的技巧:

  • 登录框可以布局在一个主页、叠加页,或一个独立页面。
  • 使用卡片式布局
  • 将操作分为主要和次要操作
  • 使用一个大而醒目的登录按钮
  • 尽量减少次要操作的数量 —— 避免出现任何与核心登录操作无关的内容。

给予明确的反馈并在用户失败时提供帮助

在登录过程的每个阶段,用户都可能失败。电子邮件地址输入错误、密码输入错误或忘记密码、网络问题,所有这些都可能导致登录意愿的急剧下降。因此,登录界面以最恰当的方式回应用户是非常重要的。清晰、及时、精心编辑的错误提示信息能起到很大帮助。

掌握这 7 条准则,提升用户登录成功率!

错误信息包含有用的提示/暗示,指明你在失败时可以做什么

掌握这 7 条准则,提升用户登录成功率!

当你密码登陆失败,但你有一个 Gmail ID 时,Facebook 会增加一个 “用 Google 账号登录 ”的功能

指导用户恢复的技巧:

  • 鼓励用户尝试合适的替代方案
  • 在用户失败后,安排替代的登录方案,同时将用户导航至一个独立的页面
  • 在文本中展示出最有用的登录方案,并在出现错误时对用户做出积极响应!

尽量保留登录痕迹

重点是让用户知道平台识别出了他们,并提供一个欢迎回归的体验。这有助于提升用户的登录意愿。

保留登录痕迹的方法:

  • 像 “记住我”这样的功能
  • 预先填写上一步收集到的字段,例如:在跳转到恢复流程时,预先填写登录步骤中收集到的电子邮件 ID
  • 如果使用的是两步式登录,为用户提供个性化的登录方式是个不错的主意 —— 用户对电话OTP(一次性验证码)登录更满意?还是电子邮件+密码?记住用户上次选择的登陆方式可以提升用户的登录意愿,并让他们感觉到登录体验的自然和舒适。
  • 在企业 SSO(单点登录) 中,用户可能会用多个账户登录。在检测到多个账户的情况下,最好是将这些账户选项呈现给用户,让他们选择他们想使用的账户。

灵活提供多种登录方式

对于你的平台应该提供哪些登录方法,没有一个放之四海而皆准的方案。最好是提供一到两种额外的方法(除了用户名+密码),这样用户就有了选择,以防他们忘记密码。这些方法可以是基于电话号码的登录、人脸识别,或最常见的社交登录,如 Google、Twitter、LinkedIn 或 Facebook。如果你正在考虑社交登录,思考为平台添加最流行和最安全的方案。

需要注意的是 —— 增加很多的登陆方法会使页面变得混乱,可能会导致登录意愿降低!将额外的选项限制在 2 或 3 种。

针对最常用的登陆方式进行优化,并明确区分主要和次要方式。这些选项通常被证明是需要重置密码(以防用户忘记密码)的很好的替代方法,但同时也被认为是一个乏味的步骤。情况允许时,应智能地浮现其他登陆选项并进行个性化处理。例如:如果用户是通过电子邮件登录,提供一个带有一次性链接的登录选项可能会有效。

掌握这 7 条准则,提升用户登录成功率!

在此提供 Medium 登录页的案例。虽然清晰且设计良好,但它确实有太多的登录方法。不得不回访 Medium 的设计者,如果这个设计对他们来说是好的!

无密码登录正火速流行起来。特别对于只有移动端的应用程序来说,基于电话号码的认证已常态化。指纹和 FaceID 在许多地方出现,使认证流程变得快速、安全。为平台找到最适合(且可开发)的方法,并将其作为主要登录选项。

登录是信任敏感的时刻

登录涉及到用户输入敏感的个人数据,如电子邮件、密码和电话号码 —— 这是决定了他们与平台关系的敏感时刻。

登录框代表了品牌,任何视觉上的改变都必须缓慢进行——因为整体的视觉变化可能会失去用户信任。

登录也是(有用的)保障 —— 足以让坏人无法进入系统!

虽然减少普通用户的操作是很重要的,但如果我们怀疑用户可能是黑客,那么出现额外的认证也变得很重要。这可能是一个很好的机会去提醒用户能够采取哪些措施来加强他们账户的安全性 —— 例如:强密码、双重认证等。

通过调研确定用户类型

之前有提到过,投入足够的时间去调研用户,有助于提高登录意愿!这一点是很重要的。

登录是一种体验,你的用户角色可以是各种各样的 —— 每个人都可能拥有一个你平台的服务账户!如果可能的话,缩小你的角色范围。

情况允许时,像我这样(为社交媒体平台设计),可以尝试以下方案:

  1. 登录漏斗 —— 与项目管理人员合作,找出用户在登录流程中互动和放弃的关键点。
  2. 登录入口 —— 用户是通过电子邮件进入登录页面?还是通过搜索引擎的结果?还是当他们在使用产品时?或是在应用程序中?你可以利用这些入口点作为线索,为用户展现出最相关的选项。
  3. 已知的设备 —— 手机、浏览器和已知的设备可以有助于为用户提供受欢迎的、个性化的登陆体验。
  4. 用户群组 —— 根据用户特性进行划分,如网络/移动、年龄组和地域,也能有帮助。
  5. 在用户没有登录时,使用这些线索可以增加用户的登录意愿。采取微小的步骤进行用户识别,并且使用户易于接受。这有助于你提高登录成功率!反之这也会为你的平台带来更多的活跃用户,每个人都能成为赢家。

案例介绍

以下是我对网络上我最喜欢的登录页进行的总结,包含一些我经常访问的平台。欢迎推荐更多登录页!

掌握这 7 条准则,提升用户登录成功率!

Google(谷歌)打破了标识优先的格式 —— 改成了分步式登录模式,在不同的步骤中输入电子邮件和密码。这种模式对于 Google 有安全优势,也可以使他们在接下来的步骤中为用户提供个性化的选择。页面也是最小的、全白的、聚焦的。

掌握这 7 条准则,提升用户登录成功率!

Uber 的登录页是简单且聚焦的,允许用户输入他们的电话号码并进入下一步。

掌握这 7 条准则,提升用户登录成功率!

Facebook 有几个登录方案,他们用这些方案进行实验和 A/B 测试 —— 这是一个右对齐的登录框案例,它很好地突出了重点。左侧的空间被用来打造积极的品牌形象 —— 总体来说是成功的登录体验。

掌握这 7 条准则,提升用户登录成功率!

Pinterest 做了 一个简单居中的叠加表单,有硕大的输入框 —— 不断吸引用户!还有一个亮红色的登录主按钮,以及一些额外的社交登录选项。

掌握这 7 条准则,提升用户登录成功率!

尽管 Airbnb(爱彼迎)在很多方面都做得很好,但它的登录页让人感到操作繁多,这也许是因为基于手机号码登录,也许是因为大量的次要登录选项,导致相当多的认知负荷!

掌握这 7 条准则,提升用户登录成功率!

LinkedIn(领英)很好地保持登录框的简介、聚焦和居中,有一个醒目的主登录按钮。

掌握这 7 条准则,提升用户登录成功率!

我对 Dropbox 的登录页面持犹豫态度——插图很好看,但它的颜色与界面按钮的颜色相似。这是附加元素分散注意力的案例。就我个人而言,我喜欢在界面中大胆使用插图,但评估插图的使用环境也很重要。

掌握这 7 条准则,提升用户登录成功率!

Amazon(亚马逊)的登陆页视觉设计上有些老旧,但对于管理用户注意力是一个很好的案例,巨大的黄色“继续”按钮以及页面上没有任何干扰,使登录任务看起来简单快速。

掌握这 7 条准则,提升用户登录成功率!

在登录页面上放置广告可能不是一个好主意,但同时 Yahoo(雅虎)有一个与众不同的标识在登录框中,其中设计了一些巧妙的功能,帮助用户减少输入。(参考下图)

掌握这 7 条准则,提升用户登录成功率!

掌握这 7 条准则,提升用户登录成功率!

我想把 Figma 纳入优秀的登录案例中,该页居中于浮层,Google 登录被突出展示(也许是 Figma 的首选和推广的登录形式?),它非常简洁,几乎是线框式的。用户体验非常好。

感谢我的产品合作伙伴 Apurva 和我一起学习。采取微小的步骤进行用户识别,并且使用户易于接受。这会使你的用户登录成功率越来越高!同时这也会为平台带来更多的活跃用户。:)希望你能从这篇文章中得到启发,并应用于你自己的产品和设计工作中。

文章来源:优设  作者:TCC翻译情报局

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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


提高操作效率的B端设计

雪涛

我从自身实践的B端项目经验中总结了几个最典型实用的b端的交互设计,来提高用户的操作效率。

目录:

一、简约至上

二、提高用户的操作效率

三、智能化操作设计



       在设计领域已经有很多经过时间和实践检验的定律法则来作为设计的指导原理,它能够帮助设计师更快更有效的将需求转化成合理的界面,并且可以有预见性的去提高产品的用户体验。被推崇的有尼尔森十大原则、用户界面设计的八项黄金法则等。但是实践出真知,一切的方法论都是源自不断实践中提炼和优化的。从原则的输入理解,到实践内化,就是自身不断进步的过程。站在巨人的肩膀上,我们应该总结更多属于自己的设计方法去解决问题优化设计。我从自身实践的B端项目经验中总结了几个最典型实用的b端的交互设计,来提高用户的操作效率。


一、简约至上

      

       1951年威廉.埃德蒙.希克首先提出,认为人们从数组中选择目标的时间取决于可用选项数量。这表明提出的选项数量与随后的选择反应时间之间存在线性关系。从广义上说,界面越复杂,用户就越难找到自己的核心操作点,功能越多,就越难发现真正对用户有价值的东西。

        2011年Giles Colborne在《简约至上》,提出“交互设计四策略”,即:合理删除、分层组织、适时隐藏和巧妙转移这四个令交互设计最大程度简单易用的策略。其本质上就是消除多余的信息干扰,保留了用户主操作流程的心流。

       作为设计师我们利用“删除、组合、隐藏、转移”,不单单是为了简化而简化,我们首要明白的就是要在对用户真正重要的事情上节省他们的脑力。需要把组织成功的标准清晰地构建在产品的简单上。一次交互就是用户与设备之间的一次对话,提高效率就是要节约他们的认知成本,学习成本,操作成本,衡量的指标就是完成某个目标的时间。

      B端管理项目有大量的表格处理,一个表格对应的数据项有很多,遵循简约至上的原则我们不会把所有字段都展示给用户看,只会优选跟业务最核心、用户关心的数据来展示给用户,让他们看到的尽量简约的表格信息。即使是最常用的查询工具,我们也会根据优先级排序,把常用的展示出来,其他的折叠收纳,用户想用到的时候可以展开更多查询条件。我们无时无刻不遵循着这个设计原则。

 


二、提高用户的操作效率


1、快速定位目标信息


       在信息量大的B端系统里,快速找到目标信息是最常用的功能。除了导航上的搜索,我所负责的项目几乎在每个信息页面中都使用了查询,筛选、排序功能,这也是常规表格对信息处理的一种快捷方式。常规的信息定位有搜索、查询、筛选、排序,不同的方式数据的检索模式也不同。根据不同业务场景,合理的使用才能帮助用户缩小信息范围,找到目标信息,提高用户完成一个任务的效率。


搜索:是用户指定任意条件(文本、语音等),平台对此条件进行检索后,展示对应内容。搜索由用户自定义条件,主动表达意图 ,目的性明确。由于搜索行为是用户主动表达意图,往往一个简短的关键词并不能完整表述用户想法,因此,搜索结果的内容通常包含多种类型从精确到模糊的展现规则。


查询:是利用关键字、词组对系统内的相关信息进行多条件组合检索。同时用户也可以输入指定条件的信息作为搜索项,但由于查询功能无法对非结构化的文件内容进行查找,所以输入条件不够精准将无法查询到最终信息。


筛选:是平台为用户提供指定条件,用户可以选择查看符合一类或多类条件下的内容。投顾项目一般都是先大范围查询,再从查询结果列表中,进行表头(快捷、对应、条件更明确细化)的信息筛选。


排序:是根据已设定的内在逻辑,将一组“无序”的记录序列调整为“有序”的记录序列。




2、缩短操作路径


        缩短操作路径简单的说就是减少操作的步骤来提升操作效率,是基于对用户、任务及环境的清晰理解的前提条件下,对用户操作的路径进行优化。我们可以从以下两方面入手:


2.1、通过预测用户下一步的行为

        通过预测用户下一步的行为,对用户进行直接引导,缩短用户的行为路径,减少操作步骤。比如在一系列连贯的操作流中某个链路执行出现问题时,用户下一步的行为是需要及时查看错误内容并处理相关信息,在执行结果中增加一个快速查看的按钮,引导他去查看和处理问题。这比他去菜单中重新查找对账信息效率要高很多。



2.2、通过用户操作路径分析减少操作步骤

      涉及到大量的信息管理时,那对于信息的快速处理就涉及到批量操作。通过用户操作路径分析,用户勾选批量执行的操作频繁,单项处理在较少情况才会用到。针对此分析,我们找到了一些具有共同批量操作特点的管理页面,对其进行操作路径的优化。批量操作可完全合并成一个执行触发点。将这个执行点,单独成一个tab切换页,细化操作为另一个切换页。tab页面的设计,也为错误信息的显示腾出了空间,整个页面清晰可对比。经过操作路径的验证,这个按钮使用率极高,明细操作几乎没有使用到,也缩短了管理页面的操作时间。




3、减少记忆负担


       减少记忆负担,是减少用户在操作时,需要记忆的信息量。一方面我们需要,简化多余的信息,减少用户对页面的认知负荷,另一方面我们可以设计记忆性功能可以帮助用户记忆。


       为什么要去减少用户的记忆负担,一方面,缩短整个操作的时间快速达成操作目标,另一方面,降低记忆数据量,有助于提升用户使用的愉悦感。从心里学来讲, 人们往往更容易记住那些自己喜欢的事物,而对不喜欢的东西记起来比较吃力,在信息大爆炸时代,我们要记忆的很多信息如登录号、证件号、密码、账户号等,这些信息有的不但复杂,而且对用户来说枯燥无味不想记忆,有一种天然的排斥感。那我们通过帮助用户去记忆留存,再在合适的机会调用显示,会提高他们在使用过程中的轻松和愉快感。比如对历史登录账户号的保留,秘钥储存功能,再到短信验证的直接不用密码即可登录,验证码还可以直接复制到剪贴板,这都是为了降低他们的记忆成本。



      随着业务的发展,平台菜单数越来越多,对用户来说非目标菜单的数量增加,用户需要更长时间来记忆所选项目的位置,到最后完全只能选择上方的搜索框进行菜单搜索。Google对用户的测试表明,没有一个人始终会把搜索作为第一选择。相反,他发现只有在网站没有提供有效导航的情况下,用户才会使用搜索。搜索需要输入关键词,即使有模糊匹配,还要进行选择,而且这个过程不一定顺利,可能需要反复操作才能顺利找到才能找到自己心中的目标。我们小组设计师通过竞品分析和用户访谈得到的一个验证性的问题,就是平台存在菜单设计命名不合理的情况,急需优化。优化思路一个是合理菜单命名与菜单结构,但这个不是一蹴而就的事情,需要从产品整个角度去整理和长远排期,持续迭代。为此我们先选择了帮助用户记忆的思路,即做一个菜单收藏的功能。用户可以手动把常用菜单直接收藏在首页,如果在没有收藏或者收藏未满限制数量时,会根据记录的用户访问次数提供最常用的菜单(以用户为导向,自定义功能;以首页为核心提供业务线支持),无需去记忆菜单位置,不断寻找菜单。




4、信息可对照 


      在处理信息的时候,提供信息的对照,减少了跳转,增强关联信息的对比,可以很大程度提升用户处理信息的效率。从系统上讲就是分屏,处理多任务事件(苹果和Windows系统均很好的使用了分屏功能)。从页面角度来讲,其实就是合理化信息模块展示,一个页面不止展示一个信息层级的内容。信息内容有从属关系(避免跳转)、因果关系(显示结果)、并列关系(同级对比)。



      同样具有审批功能的B端项目可能审批流程的设计会完全不同。我负责的另一个项目主要任务是对重大任务的监控,保障日间重点工作按时完成,审批必然严格,且需要单条仔细处理。所以我们设计的是树菜单的形式,让用户可以将待处理信息的条目和内容可以直接对照来处理,提高效率。



三、智能化操作设计


      随着B端行业日益成熟,越来越多的C端设计师转型成B端设计师,B端行业的设计思维也不断的融合和革新,如今B端产品也越来越重视产品的情感化建设、整体的用户体验、简约高效的智能化提升。

      首先让大家了解一个概念,那就是泰斯勒定律,也就是我们常说的复杂性守恒定律。泰斯勒定律认为每一个过程都有其固有的复杂性,这个复杂性存在一个临界点,超过了这个点就不能再简化了,你只能将固有的复杂性从一个地方移动到另外一个地方。



      对于我所负责的项目来说,最能体现产品日趋智能化的交互设计就是清算流程的设计。以往的清算流程是分大流程,点击流程步骤跳转至相关操作页,再进行子模块的操作与检验。完成后,切换回住流程去执行下一个模块的操作。操作员的操作连续性差且操作步骤多,完全由操作员手动操作触发,体验繁琐及不流畅。为此我们重新梳理了所有清算流程步骤,精间可合并的操作步骤,然后将所有步骤按照时间节点顺序排列,完成先前步骤才能进行下一个步骤。流程下方就是对应的执行模块,只需一键执行便可完成当前清算步骤。极大的提高了用户清算的操作成本。



      后续我们UE小组也会针对平台进行用户调研,建立了用户画像。对于运维人员痛点分析后,提出清算流程自动化设计,用定时任务直接去执行相关的流程操作,用户不用进行操作,即可完成结算,只需要关注状态和处理错误信息。



       自动化智能设计的最大缺陷就是无法遇到极致的准确率。实际处理过程中,还是会有清算错误信息存在。为了解决这个问题,我们保留了执行按钮(不手动操作时,自动跑完),运维人员也可以手动执行,处理问题。除了将操作日志信息模块,作为组件,分屏来显示错误信息,我们还按照商户维度来计算状态,以便于运维人员发现具体的错误位置。帮助操作员去查看和解决错误信息。智能化的设计解放了很大一部分的重复劳动,让用户更聚焦有意义的工作。

        智能化已然成为了设计趋势,这将会对系统的性能提升和信息处理精准化提出更高的要求。


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

文章来源:站酷  作者:上仙修行

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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


关于后台系统设计规范总结

雪涛

一套完善的产品化设计系统,可以解决内部协作的一致性问题,解决设计系统更新的周期性问题,解决一群设计师与工程师如何规模化的生产各种业务、UI的问题,从而最终解决用户体验一致性的问题。说到自己,公司的产品从接手开始便是以antdesign作为前端框架,所以很多人会说后台用antdesign、Element或者Taro的框架就足够了呀,当然不~在已有的成熟框架下,也并不能完全满足产品日(sang)益(xin)旺(bing)盛(kuang)的需求,所以设设计规范还是很有必要的。

作为B端设计师,视觉表现层面权重逐渐减少,更多的是需要梳理逻辑流程,将线下业务更好的梳理到线上流程,所以熟知设计规范可以更效率的完成工作。



设计规范的目的:


1、解决内部协作的一致性问题

为设计师内部沟通协作起到决定作用,当同一个项目存在多个设计师横向设计的时候,设计规范会避免颜色错误、间距失调、控件混乱等问题。

2、解决设计系统更新的周期性问题

随着产品的不断推进和发展,为了新增的需求和不断优化的用户体验,这时候会需要对某些规范控件进行调整,在有设计规范的情况下,可以迅速对接开发快速全局调整控件,极大的提升了设计和开发的工作效率。


3、解决设计师与工程师如何规模化的生产各种业务

关于和开发对接,图标在如今有了iconfont的项目管理下,项目可以建立自己的图标库。再加上设计建立的可复用的公共控件库,开发可以更加快捷的复用控件,减少返工率,也为后期的修改降低开发成本。


关于建立后台设计规范:


首先要了解项目适用的主要场景,也就是用户爸爸一般是在什么情况下用什么样的设备来进行操作的,然鹅你永远不知道会有什么的场景和什么样奇葩的设备在等待你。在后台的设计群一直有一个经久不衰的话题,那就是后台设计的设计分辨率是向下适配还是向上适配更合适(是1980*1080 还是 1440*900 ),这两者都是可以的,本案由于用户使用笔记本的情况居多,且设备并不是很新所以采用1440*900的分辨率向上适配1980向下适配1200。
在清楚的了解到项目背景之后,开始着手于设计规范的建立,这里关于设计规范的建立是随着设计的不断深入从而不断完善的,不必刻意深入,但是要随时更新规范文档。



关于页面构成


开发与设计所理解的页面是不一样的,所以会造成开发出来的页面有时候会因为各种原因与高保真相差较大,在设计看来(比如sketch),一个页面是由多个组结合而来,每个组里包含一个或多个字段、图片和图标等,在调整大小、间距、颜色之后慢慢成为高保真。而在开发的角度来看,整个页面就是由多个box构成,盒子与盒子之间存在空白间隔,且盒子存在一定的属性,例如盒子默认对齐于左上,盒子之间相互嵌套或覆盖需要基于所属盒子来定位。


颜色

根据品牌背景和产品定位来确定你的品牌色,用于字体、icon、按钮、插画等业务流程。功能色则是为特殊场景,例如失败、成功、提醒等情况。


字体

通过购买商用字体或使用免费字体来使用,如果选用免费字体同时也要注意区分系统,通常情况下mac系统使用默认字体苹方字体,windows系统使用微软雅黑。如今免费等字库已经越来越多了,所以这对设计师来说是一个好消息,今年阿里也在UCAN上公布了普惠体,年尾oppo也推出了自己的免费字体,文章末尾附上群友整理的免费字体导图。


边角

倒角的使用可以起到样式的区分,从而让用户感知到功能区域的分别。


图标

快速帮助用户理解产品并顺利完成操作,好的图标具有高度浓缩并快捷传达、便于记忆的特性,能够更好的传达品牌特性。


阴影

阴影的添加可以更好的提高界面品质,让用户易于区分功能区域


按钮

按钮是传达它将要发起动作的载体。 用户可以点击一个按钮来开始一个过程或工作流程,或触发一个动作。

用法:

1、要传达重要的行动。如:提交表单;

2、要导航到另一个屏幕,触发一个模式或启动一个动作。如:在进程中指定新的动作或模式;

3、按钮上的文本应保持简洁,带着明确、可操作的动词,例如:注册、下一步、下载 ;

4、优先考虑最重要的行动。行动号召太多会引起混乱,并使用户不知道下一步该做什么。

选择输入框

如无特殊需求,则默认采用框架内输入框,特殊情况可同研发一起讨论修改。这边因为一些特殊原因,在修改了代码的情况下实现了标题、选择、输入同时在框架内,这样为寸土寸金的后台界面留出了更多的空间。


表格

表格在后台系统中无处不在,对数据管理和分析起到了重要的作用,方便用户阅读,分析和比较数据。表格一般由表头、表尾、数据单元格组成。


模态/非模态弹窗

用户交互的两种方式,模态弹窗强制交互完成当前操作流程,非模态则是弱提示。

缺省状态

缺省页是指操作异常状态下给予用户反馈的提示页面,它的作用不仅是提醒用户,安抚情绪;更重要的是用“空白”触发用户的操作行为,营造良好用户体验。


结语


以上是我对于设计规范的部分总结,还有很多没有涉及到,包括非常重要的可视化部分,可以多了解一下ECharts(https://www.echartsjs.com/zh/index.html),然后希望可以和大家互相学习。设计规范的建立是长征的第一步,贯彻执行才是根本,在B端庞大的设计系统中,我们需要维护好产品的组件库,不断的完善用户体验和清晰的梳理线上业务,保证产品的功能需求才是重中之重。


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

文章来源:站酷  作者:请叫我红领今

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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


整理数据报表系统的7个步骤

雪涛

清晰且有效的数据报表可以反映出数据变化,进而帮助团队人员确定后续的产品优化迭代方向,找出可能存在的问题。那么,产品经理应当怎么整理出清晰且直观的数据报表?本篇文章里,作者总结了产品经理整理数据报表的可操作步骤,一起来看一下。

之前聊数据埋点的时候曾经提了一下,说是后面聊一下数据报表的事情,今儿个正好有空,捋一捋,跟大家做个分享。

上次分享的是《产品经理整理埋点需求的6个步骤》,有兴趣的朋友可以进去看看。

大家都很关心数据的事情,因为数据能比较直观地反应哪些地方发生了新的变化,能够提醒相关人员去关注和调整,同时一个新的优化上线之后也能够根据数据去判断优化方向是不是正确的问题。数据是最便捷的方式。

但是你想看数据就需要先把数据报表理出来,一个业务或者一个APP会产生大量的数据,你需要根据关联性和重要性去整理出具体的数据表,然后再去观察,直接看明细或者日志那你得疯。

怎么整理数据报表呢?

它需要根据核心业务流程和业务指标来梳理,然后兼顾到职级分层、部门分类、重要程度、使用频次来分别处理。

我们以电商业务为例来简单说说,选电商是因为大家对电商业务更熟悉。

我整理了一下,大致上可以按照以下步骤去整理数据报表系统。

第一步,确认要做哪些表。

你先确定有哪些部门需要看报表,常规来说包含市场、商务、运营、产品、客服、售后等部门。

然后你去看这些部门都会需要哪些报表,譬如市场部门需要渠道流量转化表等,运营部门需要营销转化表、业务流程表、销量排名表等,产品部门需要业务流程表、产品日常数据表等(观察用户留存与活跃的),客服需要用户反馈问题进度表等、售后需要售后问题进度表等。

以上只是我不专业的一个举例,实际上表是非常多的。

这里面有个地方需要注意一下,有些表看上去字段是差不多的,譬如渠道流量转化表和业务流程表,很多字段都是重复的,那么要不要并表就是一个需要考虑的问题。有的公司管理比较严格,那么最好不并表,这样可以通过后台权限来控制展示,如果相对宽松那么可以向相关部门做一下确认然后决定要不要并表。

注意:数据后台和管理后台是分开的,不能混淆。管理后台用来管理用户、商品、商户和看明细数据(用户信息表、购买订单表)等等,数据后台就是用来看统计数据的。

第二步,整理不同部门报表需要展现的字段。

以业务流程表为例。

先把业务主流程的关键节点梳理出来,到成交算是一个流程。电商的话流程大概是用户注册/登录→查看商品详情→加入购物车→立即购买/结算→立即付款→完成付款。

那么业务流程表的字段也就清楚了:

注意:报表字段是有了,但是也需要说清楚这些字段的具体含义,譬如注册/登录用户数,指的是在统计时段内,注册+登录用户的人数之和,需要去重。

不要小看这个说明,这个说明决定了大家的理解能不能一致,边界请不清晰,上面那个例子,如果没有后面那个“需要去重”那么技术在处理的时候是不会去重的,这样的话如果一个用户在指定时段内登录了多次就会统计多次。

一定要写这个说明,不写的话技术就自己发挥了,每个人对业务的理解是不一样的,所以一定要写。

第三步,去扩展报表的统计维度。

数据报表是有了,但是统计维度也需要定义,譬如需要按照日期、按渠道、按类目(商品)、按商户、按地区等等维度去看数据,那么就需要把这些和报表相关的维度加上去,这样就能实现按维度看数据的目的。

这个比较简单,有什么维度加什么维度就行,但是在处理的时候需要注意,多个条件组合能不能筛选出数据的问题,这个比较细节。

第四步,整理核心转化公式数据表。

核心转化公式数据表是给公司高管和核心业务骨干看的,高管是不可能看什么部门表的,看不过来也没必要,高管们看的表只需要体现核心数据和指标就可以。

高管们关心的也就是部门负责人关心的,部门负责人关心就应该是一线员工关心的,这就是一个拉齐公司内部认知的一个表,所以核心转化公式数据表特别重要,重要到需要单列一个步骤说明。

整理核心转化公式数据表之前就需要去梳理业务的核心转化公式,电商业务的核心转化公式如下:GMV=注册登录用户数*购买转化率*客单价*人均购买数量*(1-退货率)。

这就是一个用户从曝光到复购的一个简化的转化公式,这个公式的意义在于聚焦提高产值的关键步骤,目标不会偏。

注意:这个公式很重要,不能错,如果自己没把握的话可以问一下公司领导,知道弄清楚为止。

其实做KPI的时候也一定会需要这个核心转化公式,这样大家就能知道在哪些环节可以提高绩效,分别是提高多少,由哪些部门具体负责。

根据这个核心公式就可以整理相关的字段:

这样公司领导每天看这个数据就知道业务有没有在向预定目标发展,以及距离目标还有多远。

当然有了字段以后也需要加维度,这个就参考前面的步骤就可以。这里的统计维度其实是比较少用到的,但是功能还是必备。

 第五步,整理日常大盘数据表。

大盘表是给所有员工看的,可以作为数据后台的首页。

大盘表通常是昨日数据的汇总统计,譬如GMV、销售订单数、销售商品数、退货商品数、退货总金额、新增商户数、新增用户数、新增商品数,大概看一下数据的变化,给大家一个总体的印象。

第六步,整理实时统计表。

有一些业务对于数据的实时性要求比较高,所以会涉及到需要做实时统计表,实时统计表一般每小时更新一次数据,如果流程出现问题就可以及时进行排查和修复,但是对于大部分业务来说其实不需要,如果不是发布了新的代码,理论上是不会出现这个问题。

当然像电商APP,如果遇到双11这种,一般来说还是需要看一下实时数据的,因为全公司都很关心当天的战果,属于重要时刻。所以电商APP需要做实时表,字段的话一般也就是大盘数据表上的字段就行,额外字段的话可以根据领导的要求做。

第七步,最后确认报表字段和整理成需求文档。

把整理好的表格和各部门对一下,根据各部门的要求调整完成后制作成需求文档。

这个步骤就不多说了,按照需求的整理流程处理就行。

以上就是整理报表系统的几个步骤,当然因为细节太多了,其实没有办法在一篇文章里面讲的非常清楚,但是至少80%的东西还是在了,所以还是有参考性的。希望对大家有所帮助。

实际上做报表系统是一个持续优化和新增的过程,如果是从0开始做的话就需要单独立项然后分期做,一下子肯定是不现实的,因为工作量太大了,项目的进度不好控制,还有就是有些表并不需要马上做的,也可以缓一缓,这样优先级高的数据报表就会更快的上线。

如果业务不大的话甚至可以用excel先统计起来。总之展现形式和处理方式还是很多样化的。

产品经理在数据方面我认为其实可以多花点功夫,形成一套比较具有实操性的方法论比较好,一个数据产品和一个APP产品在竞争力上还是有差异,实际上越细分专业度越高,竞争力越强。当然首先至少要做到及格。


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

文章来源:人人都是产品经理  作者:代号道长

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档