首页

设计方向和优化方向寻找方法

涛涛

做设计、做交互、做产品前都离不开一个目的就是——拆解问题,达到XX预期,从而能提升自己的专业性,让方案更加具有说服力。那么,设计师应该如何找到符合自己的设计方向和优化方向呢?

为什么要去拆解问题?

案例:

  • 背景:某 APP 作为游戏类兴趣社交 APP,个人主页作为了解他人、建立社交关系的核心一环,目前信息丰富度和社交感偏弱,故需要进行优化;
  • 目标:页面改版核心以社交为驱动,丰富页面信息,提升用户建立社交概率。

如果不去拆解问题,你知道后续的该怎么做吗?

想要找到设计方向和优化方向的,收下这篇方法论!

设计拆解:想要找到设计方向和优化方向的,请你一定要看!

想要找到设计方向和优化方向的,收下这篇方法论!

我们知道了最直观的感受信息度和社交能力弱,但是这 2 点并不能作为优化目标和设计策略。

从该截图来看,满足了:

  • 个人属性:照片、语音、标签、星座、ID、性别等等;
  • 商业属性:下单、突出异性优势等等;
  • 社交属性:关注、提示关注、聊天、小游戏场景(右下角人物)、分享等等。

1. 信息是不是很满?

那么如果不去拆解问题,是不是就不知道如何补充信息了,那么也有社交感。用户在主动状态下:漂亮、萌妹、声优也就有社交了,那么用户在被动状态下是什么?

2. 是不是越想越乱,找不到方向了?

这就需要去拆解问题了,可以让你的思路更加清晰,保持在一条线上,形成大纲,可以挖掘更多的价值。

拆解问题的好处是什么?

还是同样的案例:

  • 背景:某 APP 作为游戏类兴趣社交 APP,个人主页作为了解他人、建立社交关系的核心一环,目前信息丰富度和社交感偏弱,故需要进行优化。
  • 目标:页面改版核心以社交为驱动,丰富页面信息,提升用户建立社交概率,那么我们开始拆解问题:(前提是背景已经确认好的情况下)。

想要找到设计方向和优化方向的,收下这篇方法论!

那么背景交代的是需要强化社交关系提升信息丰富度和社交感。经过再一轮的拆解,是不是能感觉到,自己思考的方向也多了?

想要找到设计方向和优化方向的,收下这篇方法论!

我拆解问题后,获得的好处有:

1. 思维的扩展性

举个例子:信息丰富度为什么会让我觉得缺少一点灵活性?信息的展示,会不会又分为外在和内在信息?那么什么是外在信息?与同平台上的大神之间建立的关系转化为信息?

2. 逻辑的严谨性

  • 有逻辑线索可依,从而更容易找到问题所在;
  • 方案和过程都可以假设,但是假设是必须要建立在真实的场景下。

3. 产出结果的可视化

可以根据拆解,将问题变得更加清晰,从而找准发力点。

如何去拆解问题?

前面铺垫了那么久,现在回归正题拆解问题主要分为 2 种(对应着初级和中级水平,可视情况任选一种):

1. 以问题树进行拆解,将问题细化到一个点

还是以这个案例:

  • 背景:某 APP 作为游戏类兴趣社交 APP,个人主页作为了解他人、建立社交关系的核心一环,目前信息丰富度和社交感偏弱,故需要进行优化。
  • 目标:页面改版核心以社交为驱动,丰富页面信息,提升用户建立社交概率。

想要找到设计方向和优化方向的,收下这篇方法论!

△ 这是提升信息度的模块,问题树太长,就只展示部分了

想要找到设计方向和优化方向的,收下这篇方法论!

△ 这是提升社交感的模块,问题树太长,就展示部分了

挖掘到以下功能(列举功能并记录,进行权重分析):

  • 关注模块需要重设计
  • 设计车队模式
  • 匹配度设计
  • 话题引流设计
  • 群设计(包含营销活动设计,展示打赏排名)等等

这是一个很浅的影响因素分析,到了这一步,很多厉害的小伙伴,甚至会更加详细。也就是说我们要将方向点,统统转化为机会点和业务新方向(那些一直抱怨没有发言权的小伙伴可以参考一下)。

想要找到设计方向和优化方向的,收下这篇方法论!

(全局问题树展示-举例就不做详细展开了,理解意思就行)

整合内容进行归类

拆分和定位分为:

  • 开发侧:标记为 K-1 +颜色,比如群内人数限制,开发能不能帮助解决,如果不能,转换至交互侧产品侧:标记为 C-1 +颜色。比如:车队设置,以及后续的商业演化;
  • 运营侧:标记为 Y-1 +颜色。比如:群内,该提供怎么样的营销策略;
  • 设计侧:标记为 S-1 +颜色。比如:交互处理,开发不能满足群内人数的扩张,该怎么做;
  • UI 该处理:如何让页面变得更加“温暖”,根据用户群来进行页面设计;
  • 题外话:交互在我看来,其实承担着衔接与沟通和分析的角色,整合内容看到问题其实对于经验要求很高(比如能看到商业机会),请尽量带着组内专业的人进行归类分析。

整合成一个表单:

想要找到设计方向和优化方向的,收下这篇方法论!

重复确认问题我们找到上级确认:是否与上级规划的方向保持一致,不合适也能及时作出修改。

  • 证明你的专业性
  • 让领导知道你们接下来做的事情是什么,产生了什么数据价值,将有价值的内容规划,融入产品层的大纲中
  • 暗示领导给资源,有些拆解出的目标问题,是不能单方面来解决的

资源规划根据权重比,进行资源规划。适用场景对于刚上手的小伙伴,请耐心的一步步做完,老鸟的话请直接一步到位。

2. 以用户的接触点进行设计

这一块的内容需用到用研部分知识,以数据为主用研为辅的情况下去进行拆解问题。相对来说,流程会更加的长,但是获得的结果更为准确一些或者说更加偏向用户想要什么。

流程漏斗数据图

还是以这个案例:(背景需要改动一些)

背景:某 APP 作为游戏类兴趣社交 APP,个人主页作为了解他人、建立社交关系的核心一环,目前信息丰富度和社交感偏弱,故需要进行优化 。(改为:导致流失率偏高,下单转化极低)

目标:页面改版核心以社交为驱动,丰富页面信息,提升用户建立社交概率。(添加:提升用户建立社交概率,从而能提升用户粘性降低流失率)

第一步:拉取数据(某一时间段,瞎编的基础点击事件埋点数据,看个意思就好)

想要找到设计方向和优化方向的,收下这篇方法论!

△ 假的有点过分了,嘿嘿

第二步:进行梳理

先进行大纲梳理(以业务流程为主,梳理出主要问题)

想要找到设计方向和优化方向的,收下这篇方法论!

△ 以用户直接进入个人主页举例

想要找到设计方向和优化方向的,收下这篇方法论!

第三步:假设驱动即解决复杂问题时尽可能的先找到一个合理的假设。比如:刚进页面就流失,甚至停留时间都很短,那么你立马给出的结论是:

TA 真丑,不符合我的审美,严重 P 图。

想要找到设计方向和优化方向的,收下这篇方法论!

第四步:找到用户做这类测试的时候,当然一定要去找玩游戏的用户且接触过陪玩的。用户找到-约时间-去用户能放松的地方-开始浏览该软件-进行定性测试。

第五步:汇总结果定性的方式有很多种:这里我举例一个「think aloud」:

使用 think aloud 的流程:

  • 提前告知被测用户你需要边操作边思考并且说出来
  • 记录被测用户的说话记录
  • 分析文本,归纳问题分类
  • 将分类嵌套至说话的文本中
  • 计算统计结果
  • 建议使用中位数测量

最后在经过数据分析得出问题的优化重点或改版方向。

补充一句,如果条件允许,使用卡片分类法,让用户自主的搭配,个人主页中功能位置。

小结:熟练分析话术,圈重点,找到核心的发力点。也能让思考过程更加结构化、可视化。不同的话术下,找到不同的方式,帮助快速解决问题,找准切入点和挖掘机会点和后续的跟进(要玩的流畅就取决于你的树结构的清晰程度了)。

拆解后的策略是什么?

策略其实在你分析的时候就已经产生了。

想要找到设计方向和优化方向的,收下这篇方法论!

当然啦,我们是一个 team,当你产生策略的时候,需要和团队内共同讨论方案的可实行性。

如何去验证拆解结果?

1. A/B testing

进行原版和改版数据对比,重点/想改进的数据有没有提升/下降就好了。

AB 测试就是指把少部分用户分成平均的两组,其中一组用户体验网站改版的 A 版本,另外一组用户体验网站改版的 B 版本,分别记录清楚相关的所有用户操作数据以后再进行精确的比对,最后分析得出哪一个版本是用户最喜爱的。

2. 灰度

灰度发布则是指在新的功能上线以及没有上线之间能够保证新的版本可以稳定过渡的一种发布方法,可以在灰度发布的过程当中解决一些问题或者对新版本做出一些可以提高用户体验的调整,这是保证网站可以平稳更新到新版本的有效过程。

拆解流程如何优化?

  • 没有捷径可走,只有通过不断的练习,你才能优化步骤流程;
  • 如果全文看下来,对于词汇和方法没有问题的,你已经具备了优化,差的是熟练度;
  • 这些都只是思路,并不存在百分百正确,在什么样的情况下,就选择什么样的方式。了解理论不代表知道如何实际运用,理论是基石,基石决定上层建筑。

文章来源:优设  作者:七月Xavier 

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



声音设计的魅力是你想象不到的

鹤鹤

声音记忆是一种非常普遍存在的现象。声音是基于人类本能的记忆方式,虽然并不代表它是最强的一种记忆形态,但它是最直接、原始的,因为它包含了结构化的图像、符码等特征,所以声音发出时本身就隐藏着巨大的想象力,既有直观又有想象,而且往往是被动接收的。尤其是当我们听到一段熟悉的音乐或是文字、音效,自然而然地就会想到某些事情。我一直认为音乐是记忆的载体,当然声音本身更是如此。


Ototo是一个可以让你使用任何导电物体来演奏音乐的电子套件。主控板上有对应一个八度内的所有黑白键的孔位,通过鳄鱼夹把任何的导电物件(水、水果、植物、金属餐具等等)与这些孔位相连,就能把这些导电物体变成按键。它的核心在于PCB合成器,实际上它是一块袖珍电路板,12个黑点和数个白点组成“琴键”,再加上一个外置的扬声器,只要与可导电的物体相连,摩擦就能发出声音。即便你是不懂乐理知识的人,即便没有专业的设备,也能拿起手边的日常小物创作一段美妙音乐。它还可以外接四种传感器的连接方式来改变声音模式。

Bareconductive的板子我之前在另外一篇文章中介绍过了《聊一聊音乐套件Bare Conductive Touch Board》,它比OTOTO的优势在于它有两种基础连接方式,鳄鱼夹和导电墨水。相对于鳄鱼夹,导电墨水体积更小,更方便。

下面再给大家介绍几个音乐装置项目:

  • + Looks Like Music +

Looks Like Music是Yuri Suzuki在2013年为卢森堡的Mudam艺术博物馆的暑期公共项目创作的互动式音乐装置。Yuri Suzuki设计了一系列几何造型的小型机器,它们可以沿着用马克笔画出的黑色线路前进,参与者可以在黑色线路边上涂色,这些小型机器会在经过这些颜色时把它们“翻译”成为声音。通过试验不同的涂色以及颜色之间的间距,参与者就可以创作出基本的曲调。

下面这个装置是个公共音乐装置,6个高度连小朋友也能够到的声音装置站立在博物馆外的广场上,它们能吞咽、扭曲声音和回声,组成一个音速游乐场。在任意一个喇叭面前,你都可以发出声音,说一句话,唱一句词,声音会通过弯弯曲曲的管道流淌,至于这条声音将从哪一端的喇叭里流出,就要靠你自己去探索了。

  • Synth Play

推动不同充气体的不同位置,随机产生的音乐就会响起。几个朋友共同配合,在推一推的解压氛围中便能创作出一支专属于你们的曲子。这样的创作方式将诞生出无数种组合,每一点微小的变化,都会带来微妙的听觉享受。有点呆萌的白色方块用来设定节拍,两个白色的充气体是创作音乐的主力,黑色充气体则用来控制和调节音效。

  • Face the Music

在名为 ‘ 面对音乐 ‘(Face the Music)的互动性平台上,你可以通过面部识别系统演奏电子音乐:抬抬眉毛敲敲鼓,张大嘴巴调音调,晃晃脑袋调整音长。还有歌剧、科幻小说、蓝调和电子舞曲等四种风格供你自由选择。

声音设计是很大的一个领域,现在还很少有学生专门做一个音乐装置放在作品集中,同学们如果感兴趣,想尝试的话,可以构思构思,为自己的作品集多增加一些色彩。


文章作者:程雅秋
英国皇家艺术学院产品设计硕士
擅长产品服务系统设计、用户体验设计和硬件Arduino交互

文章来源:站酷  作者:马克笔设计留学

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


聊天机器人的用户体验

鹤鹤

今天的聊天机器人远非“智能”,它们引导用户通过简单的线性流程,我们的用户研究表明,每当用户偏离这些流程时,它们都会遇到困难。

聊天机器人是智能助手的可怜“亲戚”。


定义:聊天机器人是一种特定于基于文本的对话界面,支持用户完成有限的任务。


在其他地方,我们讨论了智能助手的6个特性:语音输入、自然语言处理、语音输出、智能解释、代理和前面所有特性的集成。聊天机器人只需要具备这两种属性:自然语言处理和智能解释。换句话说,聊天机器人应该能够以自然语言接收查询,并正确地理解和解释它们(然后执行它们)。


在当今世界,至少有三个不同的因素推动着聊天机器人的发展和普及。首先,人们希望通过用机器人取代人工代理人来降低客户服务成本。其次,像微信这样的基于对话的系统的成功,提出了聊天机器人作为企业和服务的交互渠道的想法,旨在补充现有的渠道,如移动网络和移动应用程序。最后,Alexa和Google Home等语音智能助手的流行,促使许多企业在较小规模上效仿它们。


这些因素映射到今天可用的两种不同类型的聊天机器人:

在企业与客户之间的聊天交互中,客服机器人会接管部分人工负载。这类机器人的例子包括UPS的Ask UPS和阿拉斯加航空的Ask Jenn。


交互机器人的目的是提供与业务交互的额外通道,而不是用于客户服务。例如,Domino的批萨机器人允许用户订购批萨;来自Progressive公司的Flo可以提供一份汽车保险报价。这种交互机器人可以在各种平台上使用,其中最著名的是Facebook Messenger。(其他平台包括Twitter和Slack。)然而,它们也可以存在于应用程序(美国银行的Erica)中,或者通过短信(Capital One的Eno)提供服务。

UPS.com网站使用聊天机器人来回答客服问题。

Kiehl ‘s Messenger聊天机器人:用户可以通过在“发送消息”文本框中输入文本或选择屏幕上显示的选项之一(发送位置或邮政编码;文本输入框下面的主菜单选项)。


虽然客服机器人通常是纯文本的,但交互机器人将文本与可视化UI元素结合起来作为交互方法。


研究


为了了解聊天机器人的可用性,我们招募了8名美国参与者,让他们在移动设备(5名参与者)和桌面设备(3名参与者)上执行一组与聊天相关的任务。其中一些任务涉及为客户服务而与人或机器人聊天,另一些任务则针对Facebook Messenger或基于短信的聊天机器人。


对机器人的态度


一般来说,人们对机器人的态度从中立到略微积极。互动机器人是一个相当模糊的渠道:在我们的美国研究中,大多数参与者之前从未与此类机器人互动,他们也不知道它的存在。相比之下,微信公众号页面通常是这些机器人的复杂版本,我们的中国参与者对它们很熟悉。我们的一些参与者惊喜地发现了这个互动渠道,其他人则认为与其他传统渠道如网络或移动应用相比,它并没有带来足够的价值。


人们普遍认为客服机器人不如人类代表有帮助,但我们的参与者也认为它们有一些优势。最重要的优势是速度:与人类聊天通常需要很长的等待时间(要么在队列中,要么在对话开始之前,要么在人类为客户的问题寻找解决方案时),而机器人可以是即时的。另一方面,人们觉得与真人接触表明公司关心客户:“真人真的很好。他们卖给你一件昂贵的物品,所以他们必须在代理人身上花更多的钱。”另一个人说:“如果你有一个人(负责客户服务),那意味着你足够关心;如果你有一个机器人,那么·你应该有一个真正好的机器人。”


交互机器人通常很容易被识别为机器人,但客户服务机器人很难识别。有些企业并不总是提前向客户透露他们正在与机器人进行交互。我们认为这是一个错误。我们的研究参与者很高兴看到企业使用机器人是透明的,因为他们可以调整自己的期望和语言。例如,当用户意识到他们是在和机器人说话时,他们往往会更直接,使用基于关键字的语言,并避免礼貌标记。这种类型的语言通常比通常在正常对话中使用的复杂、间接的语言更成功。


用于交互聊天机器人UI


交互样式
文本和链接/按钮都可以用于向交互聊天机器人输入信息。它们的目的略有不同:

  • 预先确定的链接和按钮避免了用户输入。这些通常显示在一个轮播列表中,可以包括图像。人们喜欢有这些选项,甚至希望它们成为常用输入。

  • 文本允许用户在选择他们想问的问题类型方面有一定的灵活性,并允许他们偏离聊天机器人(通常过于严格)的脚本。


这两种输入机制都很重要,应该同时存在。


当机器人不允许用户选择选项,而是要求用户输入时,用户会抱怨。例如,一个参与者被Booking.com的机器人惹恼了,因为它不允许他选择日期,他必须输入日期。在输入“感恩节”之后,他说:“应该有一些明显的东西来预先填充它。选项应该预先填充——手动输入很乏味。我应该可以点击按钮才对。”

人们更喜欢选择一个选项(左边是Domino的聊天机器人),而不是输入冗长的文本(右边是Booking.com)。考虑为最常见的输入创建按钮。


一些机器人完全取消了输入文本的选项,迫使用户选择屏幕上显示的选项之一。这种类型的设计使机器人类似于一个网站,并限制了用户可以在系统内探索的路径。

Car Dealer聊天机器人不允许用户在选择库存选项后输入自由文本。


当链接和按钮被清晰地标记时,它们的效果最好,人们希望能够点击交互机器人显示的几乎所有非文本元素。例如,当eero Messenger机器人展示一组图片来说明eero的行为时,我们的大多数研究参与者都会点击这些图片,希望获得更多信息。

Eero for Messenger(左):为了告诉我更多信息,该机器人显示了一个轮播,上面有几张图片和一组可能的延续(文本在圆形框中)。用户希望能够点击轮播项,但这些并不是链接。Kielh’s for Messenger (右):轮播上的大图片是不可点击的,但是下面的链接是可点击的。


除了常规的按钮和链接,一些交互聊天机器人还有一个菜单元素,当被选中时,它会显示一组可能的任务。菜单有时显示在输入文本框下面,有时显示为旁边的一个小汉堡包图标。

金州勇士队在输入框下面有一个主菜单链接。选择此链接将显示一组可用的任务。当用户开始在输入框中输入时,菜单图标就显示在它旁边。主菜单链接和汉堡包图标做了同样的事情。


其他链接有时显示在消息框下面。这些链接是相当容易发现的:我们的几个用户与它们交互;然而,靠近输入框的图标不太可能被使用。

CNN bot:信息区下面的链接显示了聊天机器人的一些主要任务(头条新闻、主题、设置)。


线性流


交互聊天机器人似乎最像Alexa的技能:它们被设计用来指导用户完成少量任务。机器人支持的任务最好被概念化为具有有限数量分支的线性流,这些分支依赖于可接受的用户答案。机器人提出一个问题,其答案将推动机器人前进到流的右边分支。

一个线性流程的例子,机器人可能通过它来完成一个任务


当用户遵循流程并提供符合系统期望的“合法”答案,而没有跳跃步骤或使用未知的单词时,用户会感到成功和顺利。例如,一些参与者能够成功地与Domino ‘s Pizza、Wingstop、Progressive等公司的聊天机器人进行交互。然而,一旦用户偏离了规定的脚本,问题就出现了。


例如,当Domino ‘s Pizza机器人询问她的位置是公寓还是房子时,一名参与者输入townhome,机器人回答“我很抱歉。我好像听不懂。”另一位寻找巴宝莉腰带的用户在消息框中输入了“腰带”,但是收到了订单取消的信息。当她把它转换成“女式腰带”时,她被告知要从一个链接列表中选择,没有一个链接与她要找的匹配。

巴宝莉的聊天机器人很难理解用户想要完成的任务,并在机器人的指令表中列出了若干任务。


机器人也很难从问题或意外输入中恢复,有时会迫使用户从树的顶部重新开始,并做更多不必要的工作来获得答案。例如,我们的一个用户想知道起亚是否有四轮驱动的电动车型。为了找到匹配的任务,她不得不遍历整个决策树,回答诸如汽车需要容纳的人数和MPG等问题。当她对车辆类型偏好回答“不”而不是选择一个显示选项时,机器人就会停止并强迫她重新开始。


然而,有些机器人更加灵活,能够理解偏离脚本的请求。例如,一个参与者知道Domino ‘s Pizza正在进行促销活动,他可以让机器人将其加到自己的购物车中。在订餐流程的晚期,他还能够改变其中一个比萨饼的外壳。

Domino ‘s Pizza聊天机器人能够对不属于预订披萨的主要线性流的请求做出满意的响应。左图:用户可以在订购前将订单加到他的购物车中。右图:用户更改了正在订购的两个比萨饼中的一个的外壳。


一些机器人很难做出假设并建立查询的上下文。例如,我们的一名参与者试图与Capital one的基于文本消息的机器人Eno进行交互。他碰巧有两张来自Capital One的信用卡,每次他问一个问题,机器人就会强迫他澄清查询涉及的是哪个账户,而不会将上下文从一个交互传递到下一个交互。


当启动新任务时,机器人通常也不能利用之前输入的信息。例如,我们的一名参与者首先决定叫披萨外卖;她输入了自己的地址,但她被告知Domino ‘s不送货上门。她又开始一遍,这次的目标是去商店取货而不是送货。机器人第二次问她的地址,显然完全忘记了她已经输入了地址。

Capital One的机器人Eno要求用户在回答完每个问题后澄清他询问的是哪个账户。左:Eno只识别用户查询中的关键字“transaction”(尽管拼错了),无法回答用户的特定问题;相反,它给出了其指令库中一个匹配任务的答案。右:Eno重复了之前问的问题。


文章来源:站酷  作者:马克笔设计留学

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



五步法帮你深度分析一个APP产品

鹤鹤

不知道你是经常会遇到这样的情况:

拿到一个APP产品不知道如何去分析他的好坏,又或者总是分析的很片面,要么仅仅是交互,要么仅仅是视觉

那么有什么好方法能够帮助我们更全面更系统的分析一个APP产品的好坏呢?


首先

我们需要明白的一点是,我们在分析产品时,应该从山顶逐渐往下看,才能够看到山的全貌,站在山脚下只能看到自己视野几百米的范围。

接下来

我们去分析一个APP产品的时候,就可以通过一个万能的公式更全面更系统的去层层剖析:

1、战略存在层(它为什么存在)

产品的核心驱动力是什么?

这个产品带给用户的价值是什么?

这个产品带给企业的价值是什么?


2、能力范围层(我们自身能力)

能做什么,不能做什么?

现在的能力储备是否能够支持?

做到这个需要什么样的能力储备?


3、资源结构层(内外部资源有哪些)

产品的利益相关者有哪些?

内外部有哪些资源?

竞争对手是哪些,相对于他们优势和劣势在哪里?


4、角色框架层(产品各个角色)

体:产品构建的矩阵如何,这个产品处于什么位置?

面:各个板块的使用场景、目的是什么?

线: 页面的布局如何?

点: 这个功能的目的是什么?用户如何交互?使用流程是否合理?...


5、感知层(如何感知产品的不同)

感知层很多时候设计师都会纠结在细节里面,总会分析色彩、图标、间距等。而感知层最重要的是要分析这个产品的调性如何?和其他同类的差异在哪里?界面设计是否能够吸引用户?


最后

我们通过这个五个步骤去分析下今日头条APP

1、战略存在层

核心驱动力:算法推荐+优质内容

用户价值:今日头条带给用户的价值是通过了解用户的喜好,精准推荐给用户最感兴趣的内容,提升用户的阅读效率

产品价值:以今日头条作为基础的流量池为其他产品相互导流

 

2、能力范围层

2019以前今日头条的slogan是“你关心的,才是头条”定义今日头条的核心是推荐算法

而2019年之后今日头条的slogan是“信息创造价值”定义今日头条的核心是打造优质的内容,让信息创造价值

今日头条从技术到内容的转变,靠的是今日头条的长久以来的能力储备,所以我们会看到今日头条推出的一系列对内容创作者的扶持计划。

3、资源结构层

今日头条的利益相关者:消费信息的用户、产生内容的创作者、广告商

竞争对手: 腾讯新闻(腾讯)、网易新闻(网易)、搜狐新闻(搜狐)、微博...

优势:今日头条通过推荐算法构建了早期产品的核心竞争力,吸引了大批大V和信息消费者,具有先发优势,之后又通过内容产品矩阵构建自己的护城河

劣势: 竞争压力大,都在竞相进入内容领域

 

4、角色框架层

体: 今日头条经过几年的发展,逐渐构建起一个内容聚合平台(图文、短视频、长视频...),作为基础的流量池,为其他的产品相互导流

面: 

首页模块你可能感兴趣的,和你感兴趣的内容

西瓜视频,你可能感兴趣的短视频

放映厅,你可能感兴趣的长视频

所以,我们从导航栏就能够可以看到今日头条产品所构建起来的面:

核心是千人千面定制化推荐,核心之外是图文、短视频、长视频

接下去,就是线和面的分析,这就到了布局和功能层级了,这是交互方面的内容,我就不再一一细说了

线: 页面的布局如何?

点: 加这个功能的目的是什么?用户如何交互?使用流程是否合理?


5、感知层

人去感知一个物体通常常是通过5种感觉:视觉、听觉、味觉、嗅觉、触觉。互联网的产品不像线下体验店5感都能够体现,而我们感知互联网产品主要通过视觉和听觉这2种感觉。

  • 我们听到的是今日头条的报道、今日头条的视频广告

  • 看到的是是今日头条的产品、广告图。而的核心是今日头条的"信息创造价值",围绕这个最基本的核心,给用户的感知才是一致的,才是和其他产品塑造差异化的核心要点。



 

基于这些我们再去分析里面的细节就游刃有余了

比如,同为新闻自媒体平台,今日头条把内容创作者放置在列表页明显的位置,而网易新闻、腾讯新闻在内容列表创作者的名字却被弱化了,原因就在于今日头条定位的是自媒体新闻平台,重点在于内容创作者,而网易新闻、腾讯新闻定位的是新闻媒体平台,重点在于内容。

文章来源:站酷  作者:馒头UX

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

有效的竞品分析方法

鹤鹤

互联网因为技术的快速发展,用户的普遍性决定了互联网所必备的特点就是:创新、用户体验、快速迭代。而竞品分析应该贯彻应用的不同阶段。

 

我们在做竞品分析时,首先确定竞品分析的颗粒度,竞品分析可以做得更细,但是必须根据分析的动机、需求出发,清晰自己的目标,来判定做怎样详细的一个竞品分析文档(根据项目大小、时间限制等,选择适当的竞品分析程度)



01 竞品分析四大流程

1.确定竞品分析的目的:明确分析目的,和控制分析产出一样重要,分析是为了有价值的情报收集,而不是无意义的跟踪复盘。

2.筛选出目标产品:从行业出发去选择对标的竞争对手和潜在的竞争对象。

3.收集竞品资料:从分析的纬度来确定,不同职能区分,侧重点会不同(但各纬度是有机联系的,不可以孤立对待)。

战略定位、盈利模式、用户群体、产品功能、产品界面(交互方式、视觉表现)


4.分析、输出竞品分析报告:可采用【总-分-总】的结构


[ 总 ]

首先说明分析目的,然后拿出各模块的结论,这是第一个;

分 ]

围绕这些结论,展开你的分析过程,所有的过程分模块展示、最好要有数据支撑;如果没有,就要有逻辑表达,这是中间的部分;

总 ]

最后得出你在这次分析之后的感受,认为产品应该遵循什么、借鉴什么、避免什么,这是最后一个。

注:分析要追求的是客观性,不要为了分析而分析,不要为了结论而拼凑论据,分析结论的可用性并不应影响分析的初衷。



02 具体分析从哪些点入手

1.市场分析:市场规模、市场趋势、月活跃人数等

2.用户分析:用户地域分析、用户使用时段分析、用户年龄段、用户性别比例等

3.目标用户需求:A、B、C

4.产品信息:产品基本信息(最新情况、产品口号、产品定位、特点、市场规模)

5.产品迭代信息:版本更新频率、优化程度

6.核心竞争力分析

7.功能结构及其分析

8.基本功能对比

9.功能差异化分析

10.界面分析:主要界面、操作流程

11.盈利模式分析

12.其他方面:根据产品特性和类别区别对待



03 竞品分析的相关方法

1.用户体验五要素法:从抽象概念 —— 具体表象


战略层:

这个层面分析, 大多数情况下得出不了什么实质性的结果(也会有厉害的PM能分析出战略上的建议点,不过这都是属于专门去分析战略层的竞品分析)一般战略层面公司的领导或者创始人起初就会想的很明确。如果这个层面都没思考清楚,项目做的意义也不存在了。

产品目标、用户需求


范围层: 

一般是对明确的几个竞品进行功能清单收集,分析一些差异化的功能,然后分析功能背后的原因。别人这么做,有什么意义?能带来什么样的结果?能衍生出什么?

定义需求(内容清单、功能规格说明)、需求优先级排序


结构层:

针对竞品在这个层面需要下功夫,需要去分析梳理竞品的产品流程。比如:注册流程、支付流程等等。去分析现在竞品大多采用什么样的结构设计,比如:什么Tab结构、抽屉式结构等等。

交互设计、信息架构


框架层:

这个层面需要去收集的是竞品的信息是怎么设计的?收集一些竞品的相关细节设计。

界面设计(页面布局和界面各类控件)、导航设计(全部、局部、辅助导航等)


表现层:

一般不用做过多的分析,可留给设计师发挥,留给设计师专门做这个表现层的竞品分析。

感官设计(实现了以上四个维度需要满足用户的感官感受)


2.YES/NO法

主要适用于功能层面,简单来说就是将功能点全盘罗列出,具有该功能点的产品A便标记为“Yes”,没有该功能点的B产品标记为“No”,通过比对可以清晰地了解功能点上产品间的异同。



3.评分法

这个方法在用户研究工作中常会用到,通常适用于定量研究的问卷调研中,即给出1~5分的区间,根据产品中的某一方面或某点进行打分。


4.分析描述法

指将不同产品特性以比较的形式描述出来。



5.SWOT法

针对所要分析的竞品,从“优势、劣势、机会、威胁”四个维度进行比较和梳理。



并且可以进行两两组合分析:

1)SO战略就是依靠内部优势去抓住外部机会战略;

2)WO战略是利用外部机会来克服内部劣势的战略;

3)ST战略就是利用企业优势去避免或减轻外部威胁的战略;

4)WT战略就是直接减少内部劣势和避免外部威胁的战略。



6.Base+Solution分析法

Base:目标用户是什么?目标用户的核心需求是什么?通过什么解决方案能够满足?同其他产品相比,解决方案有什么差异化和卖点?如何推广营销?市场效果如何?

Solution:解决方案如何实现?还有多少空间?陌生用户进来如何使用?信息组织、交互如何?为什么要这么做?是否符合用户预期?配色、UI是否符合用户审美?用户会在哪里困惑?用户打开产品的频率如何?用户是否会向他人推荐产品?


7.Kano模型(卡诺模型)

是对用户需求分类和优先排序的有用工具,以分析用户需求对用户满意的影响为基础,体现了产品性能和用户满意之间的非线性关系。

在卡诺模型中,将产品和服务的质量特性分为四种类型:

1)必备属性;2)期望属性;3)魅力属性;4)无差异属性。5)反向属性不是用户需求,提供反而影响产品体验。


具体请查看专题文章:产品分析方法之:KANO模型


注:在描述分析的过程,尽量的可视化你的分析过程,这样别人在看的时候清晰易懂!



04 竞品分析的辅助内容

1.数据的引用

分析报告中针对用户体验方面的要素很容易夹杂过多的主观因素,譬如我们容易下这种结论:这种设计不合理!”这类主观的评断。在一份竞品分析报告中,如果为了说明某一条,那量化的数据必然是重要参考依据之一。所以,数据变得比较富有说服力。

数据从何而来?月活排名可以来自Appannie、Usage Intelligence,网站排名来自Alexa。其他数据包括百度指数、淘宝指数、易观智库、CNNIC、艾瑞咨询、新浪微博、微信、上市公司财报等都是比较主流的平台和渠道可以作为数据来源。


2.对比时有截图作参照

这方便读者了解,也在一定程度上有利于保证整份报告保证清晰可读、重点凸显、结论突出。


3.必要时可加任务或案例

任务和案例起到的作用一是佐证,二是便于读者清晰地能够在相应的场景下理解。比如当比较A产品的某项功能或业务逻辑上的问题时,如果引入一个贴切的典型案例或一个模拟的任务会让读者更加有代入感,更便于说明。

另外,在这里也可以适当的引入真实的用户评论。



05 得出结论/建议

1.首先我们也是按照从大到小去写,从框架—功能—流程这个维度去书写总结!

 2.对于结构:我们应该采用……

3.对于功能:我们应该把功能A、功能B加入到版本V1.0内,把功能C滞后、不做功能D…….

4.对于流程:我们可以借鉴竞品A的某某流程、竞品B的某某流程……

5.对于色彩:我们可以以某某颜色为主、某某颜色为辅……

文章来源:站酷  作者:体验为王UX

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



bs界面赏析分享 -- 北京蓝蓝设计

前端达人

jhk-1617329495749.jpgjhk-1617329712960.jpgjhk-1617329746696.jpgjhk-1619342875081.jpgjhk-1619343080605.jpgjhk-1619343085673.jpgjhk-1619343095622.jpgjhk-1619343164521.jpgjhk-1619343150526.jpgjhk-1619343131411.jpgjhk-1619343119804.jpgjhk-1619343108913.jpgjhk-1619343106553.jpgjhk-1619343096660.jpg


--手机appUI设计--

--bs界面设计--

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

谈谈Banner应用&交互设计

涛涛



编辑导语:UI设计师在日常工作中经常会进行Banner的设计,Banner代指任何投放于线上的各种尺寸的广告图,在设计Banner图时,需要考虑到多种因素,内容、受众、效果等等;本文作者分享了关于Banner应用和交互设计,我们一起来了解一下。

Banner是每个UI设计师家常便饭的项目,聊聊banner的那些事。

banner翻译成中文是横幅或旗帜,为了体现产品的中心意旨,利用鲜明的内容去表达最主要的情感思想或宣传中心,从而给整个产品起到宣传的效果。

在互联网时代,banner被广泛应用在pc网页、app设计等互联网平台间,作为设计师做一张banner乃家常便饭,如何才能设计一张高质量的banner呢?

一、设计风格

创意新颖、风格贴切的banner能第一时间吸引用户眼球,有利于banner的触达,带来高效率的点击,创造更高的价值。

1. 素雅文艺型

关键词:文艺、气质、素雅、安静、格调。

画面大量的留白;色彩以高级灰为主,饱和度和纯度低,明度高;字体多采用衬线体,标题文案突出,辅助文案偏小,整体突出高级感;画面点缀多采用精细的线条。

2. 时尚高冷型

关键词:高冷、时尚、大气、品质。

色彩多以黑白灰;文字清晰简洁内容少;焦点主图很大,突出表现细节;画面精简,无点缀物。

3. 传统国风型

关键词:传统、中国风、意境、韵律。

画面采用对称式构图,文字排版有采用竖排;色彩上采用中国传统颜色,采用物体的固有色,避免艳丽刺激的色彩;字体多采用书法字体,书法主要分为篆、隶、楷、行、草五种书体;图形活用中国风元素,剪纸、灯笼、折扇、祥云、梅花、水墨等作为辅助元素。

4. 青春活力型

关键词:青春、活力、年轻、动感、时尚。

色彩饱和度和纯度高;排版多样性,视觉冲击力强;运用几何图形装饰在产品、背景、氛围装饰上。

5. 可爱甜美型

关键词:可爱、甜美、卡哇伊、Q、呆萌。

色彩鲜亮透明,营造软萌可爱的感觉;字体采用少年字体、手写字体、卡通字体;点缀元素多使用卡通小元素。

6. 促销活动型

关键词:促销、活动、节日、热闹。

画面整体氛围热闹,内容饱满,很少留白;色彩丰富,红色、黄色、橙色、紫色偏多;主标题文字偏大,字体刚硬,视觉冲击力强,点缀元素有光效、舞台、五彩的渐变、冲击性的线条或多边形等。

7. 未来科技型

关键词:未来、科技。

科技类banner,文字和背景图非常具有科技感,画面具有空间感;色彩以冷色调为主,常见有蓝色、紫色、黑色;点缀元素有光效、金属、线条、光点。

8. 手绘风格

关键词:场景、趣味、手绘感、扁平。

画面具有故事性和趣味性;色彩扁平的配色,上色没有高光和阴影;字体偏向年轻化,圆润、无衬线体字体;点缀元素以涂鸦的小装饰为主。

二、设计流程

1. 创意监控

1)创意监控

产品在用户心中需要良好的正面形象,banner传播对内容需要进行严格控制,把握好政治导向关、价值取向关和格调品味关。广告内容需真实准确,不引起歧义。

2)情景约束

用户体验产品需要有愉悦感,banner需呈现积极阳光的正面情景,素材图片传达正向的情绪和氛围。

3)版权约束

避免法律纠纷,图片素材、文字等内容应该要有版权,banner中不使用来源不明的字体、图片、视频等素材。

2. 前期沟通

1)确定文案

文案尽量简洁明了,用词准确、文案通顺、语言生动。用词准确是最基本要求,活动、权益、业务表述文字内容符合业务方需求,无错别字。文案通顺、表述清晰,适合产品目标群体阅读与理解。语言生动、精简、有吸引力,集中核心诉求点,亮点突出。

3. 设计执行

1)板式

排版结构:

banner由多元素组成,banner内在包含:色彩、构图、风格等,外在包括文案、产品配图、背景、点缀这几个部分组成,设计过程通过拆分一步步执行,思路清晰且效率高。

构图方式:

对齐构图

画面中相关内容遵循对齐原则,便于用户视线快速浏览,接受重要信息。常见的对齐方式左对齐、右对齐、居中对齐,建议banner中只使用一种对齐方式,多种对齐方式用户阅读视线分散,增加用户认知成本。

聚拢构图

画面内容拆分为文字区、图片区、氛围区,相关内容聚集在一个区域,其次聚焦一个视觉重点,弱化其他元素,视觉出现层级。

留白构图

根据产品页面留出适当的安全边距,保证banner在适配过程中不会出现重要信息看不全的情况。排版时,元素之间需要留出空隙,画面看起来有透气感,减少用户认知信息的负担。

降噪构图

色彩、文字的种类不宜过多,点缀图形运用不合理,会分散读者注意力,成为用户阅读的“噪音”。

重复构图

排版注意整体设计的一致性和连贯性,避免出现不同类型的视觉元素,使画面出现跳跃。

对比构图

banner中重点信息加大与周围元素间的视觉差异,通过颜色对比、字体的大小字重对比、构成的面积对比等方式,以便于用户快速获取重点信息,丰富banner的视觉层级,吸引用户。

构图样式:

对称构图

通过对画面的平均分割保证画面的平衡,对称构图给人有力、稳固的视觉感受。

居中构图

居中构图很好的突出主题,画面中规中矩,活跃感较弱;用户视觉焦点会聚集中心位置,视觉焦点需要重点刻画,周围元素弱化处理。

左右构图

左右构图分为2种,左文右图、左图右文。2种构图样式,区别在于用户的浏览过程中是先看文字还是先看图片。

当配图示意不明确时,建议使用左文右图的排版。

配图主要是根据文案内容绘制的辅助图形,用户只看图无法明确活动内容,建议采用左文右图的板式。根据“F形”阅读模式,浏览习惯往往从左向右从上往下,将文字信息放在左边有助于用户快速浏览,获取重点信息。

当配图示意明确,图比文字更加重要时,建议使用左图右文的排版。

用户根据图片即可明白活动内容,运营或业务方希望有吸引力的活动图片获取用户的注意力。

衍生构图

基于banner受限尺寸和高度,会衍生出一些构图方式,例如放射性构图、倾斜构图等。不规则的构图,设计上具有层次感,丰富的视觉呈现给人眼前一亮,更容易吸引用户眼球。

构成比例

banner大多为左右排版,图文比例4:6,接近黄金分割比例0.618,文案标题比例约2:1。画面中文案占比一定要大于配图,用户更关注是是内容本身。

2)配色

色彩体系:

暖色系

暖色系主要由红、黄、橙等构成的色调。容哟联想到阳光、火焰、热血等场景,给用户积极、活泼、温暖的感觉。暖色系色彩的饱和度越高,温暖属性越突出,用于电商活动,渲染气氛。

冷色系

冷色系主要由青、蓝等构成的色调。容易联想到海洋、冰雪等场景,给用户寒冷等感觉,适宜表现恬静、低沉、严肃、理性的内容,比如科技类产品。

同色系

同色系又称单色,这种色系的搭配在产品本身颜色比较统一的情况下,提取产品邻近色,作为画面的搭配色,让整体画面变得统一和谐。

类似色系

类似色相比同色系,它具有丰富性和可变化性,基于banner整体的主色调以后通过添加与主色相近的辅助色,是整个画面变得丰富活跃起来,同时这些配色方式也相对容易。

对比色系

对比色系,色相环上相距120度-180度之间的2种颜色(180度则为互补色),对比色之间的搭配能够给画面带来华丽、跳跃、浓郁的视觉美感,高纯度、高明度、等面积的搭配,会产生强烈的刺激感,干扰用户视觉体验。画面中往往会考虑补色之间的面积比例、纯度比例、明度比例、空间间隔的比例,平衡画面之间的视觉感。

创新配色

除了基本的色系配色系外,还可以尝试更多的配色风格。画面中有目的地运用色彩元素,丰富画面的色调。

色彩比例:

banner色彩需要考虑页面统一性;banner尺寸较小,信息色彩不宜过多,2-3种即可。画面主要由主色、辅色、点缀色组成,色彩的黄金法则60:30:10的法则,60%左右的主色、30%左右的辅助色、10%左右的点缀色。

3)字体

字体类型:

无衬线体

粗的黑体,具有官方严肃气质,自带有力量感,视觉冲击强烈,与速度线条、碎片、划痕等设计手法十分搭配。细的黑体,具有年轻、简约、细致的感觉。无衬线体易读性较强,常用于科技类banner中。

衬线体

衬线体装饰性较强,给人带来活泼、轻松的感觉。比较适用于文化、文艺、美食、女性、时尚等行业。

圆体/卡通字体

具有趣味性和活泼感,适用于儿童、宠物类、休闲食品、家居等行业。

书法体

有韵味和艺术感,视觉张力丰富,适用于中国风、艺术感等画面。硬笔书法字体:优雅、有亲切感,适合传统、文化等画面。

字体样式:

考虑字体大小、字重、颜色。文案有主文案和副文案之分,需要有对比性。字体的颜色选择需要考虑与背景色的搭配效果、banner主题间的关联,选择合适的颜色能凸显文案。

4)辅助图形

几何图形:

几何图形是banner设计中常见的辅助元素,它的多样性和简约性设计师十分着迷。几何图形可以创作无线的可能,用户对其有意无意地进行自我诠释。

圆形

圆形象征着圆满、融合、自然、和谐、无穷,在设计中具有非常强的包容性,由于其自身的可拓展性,将圆形进行拉伸、叠加、重复可获取丰富的图形。

三角形

三角形具有方向感、变化感,它的锐利给以垂直、刚强、庄严、向上的感觉,其长度有穿透感,象征崇高和无限。

方形

方形具有对称、有序、平静、专业属性,给人稳定安全统一感。

多边形

多边形的形状会给人带来稳重感,通过多边形凸显产品的尊贵感。

不规则图形

不规则的图形营造画面的氛围,突出主体元素,激发用户点击欲望。

流畅的线条:

流畅的线条给画面带来韵律感。

立体几何图:

立体几何载体让整体画面格调显得品质高。

5)动效

展现商品质感和工艺或者展示同商品不同状态时,动态banner比静态banner点击率高。呈现商品多样性和系列感需要静态广告。

4. 审核

1)传达

呈现出来的画面鲜明地表达活动主旨,文案内容,可用性。

2)美感

板式设计、配色、字体设计、风格、插图、点缀图案以及动效这些运用是否合理。

3)效率

整体复杂程度,后期banner修改和加工工作难度,可不可重复利用。

4)创意

画面主题是否突出,具有吸引力,刺激用户点击。

三、设计应用

1. 轮播banner

现实中多是单张banner图,而互联网产品中大多采用多张轮播banner。有限的屏幕内采用多张轮播提高空间的利用率,其次用户长时间盯单一广告会疲惫,轮播banner有利于吸引用户注意,激发用户探索欲望。

2. 胶囊banner

电商产品用得比较多,全圆角矩形或不规则矩形,此类banner运用在促销活动中,实效性特别强。

3. 白底banner

运营强度较弱,banner在页面权重较低的专题活动会用到白底模版化banner。排版左文右图,内容由主标题、副标题和小插图组成,例如支付宝首页中间位置banner。

4. 悬浮banner

需要吸引用户来参与运营活动,可以采用悬浮图标的形式,吸引用户的注意力,对页面布局不产生影响。

5. 广告组合

用于产品中同一个功能模块,多个不同入口,或者不同服务类型的商品入口。商城或者热门板块使用。包括:两个入口、三个入口、四个入口、五个入口、六个入口。

四、交互设计

1. 交互需求

1)功能

banner在页面中所承担的责任是什么,活动运营、功能区入口、系统公告、还是第三方广告。

2)数量

banner位置所承载内容数量是多少,同时存在几个内容。

3)频率

banner采用的是静态banner还是轮播的方式。固定banner多久更换一次,轮播形式的banner,几个banner轮播,轮播的速率是多少。

4)层级

banner在页面中与其他功能区相比,banner位所属的信息层级是什么样。

2. 交互思考

1)静态/动态

静态banner。如果内容中有一个非常重量级的,其他的都是差不多的不怎么重要的,可以考虑只将重量级内容放在显眼位置的Banner上,且静态不轮播,其余内容放在别的运营位里。

动态轮播。轮播banner图注意帧数不宜过多,加上轮播指示器,提示用户banner的个数以及banner可以左右滑动。

2)尺寸

屏幕占比大的banner有更强的营销感和氛围感,常见电商平台的顶部banner。

屏幕占比小的banner会低调些,不会干扰用户阅读浏览页面,例如金融类平台。

3. 设计输出

1)图片大小

保证产品启动加载时间和操作流畅,上传广告图的大小建议在300kb以内。

2)图片格式

输出的格式:JPG、PNG、JPEG、BMP、GIF。


文章来源:人人都是产品经理  作者:
界白

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




做好国际化体验设计,你应该知道的事

鹤鹤





章节一:为什么要坚持国际化设计?



坚持走国际化设计的背景

出海早已成为中国互联网公司的不二选择。相比在国内厮杀,国外有更多的人口/政策/资源红利。并且因为互联网的可复制模式,使得成熟的经验可以快速运用到国外,从而抢占先机。而做好国际化的本质就是【做好每个地区的本地化设计】,想用一套国际化的标准去用在全世界的各个地区取得成功是非常困难的

那有什么好的方法和理论能够让设计提前着落,为业务带来一线用户信息和设计价值呢?接下来我将给大家介绍一些实际的方法和案例帮助大家做国际化的设计,让自己的设计价值有理可依


*以下内容与公司无关,更多的是基于笔者国际化工作经验的复盘,如有错误,欢迎指正(Salute~)



写在前面

首先我们要知道,一套通用的设计标准很难在多个国家吃的开,从而拿到用户信任

我们先来看个案例,这个是日本UBER司机端和日本滴滴司机端对比

最明显的区别在于,滴滴国际化在日本业务和Global业务这块,司机端采用的是移动端(global)+平板端(日本),而UBER则是一套方案解决全球问题,可能有些人会问,一套设计不是成本更低,效率更高么,为什么非要制作两套。这就要从决策成本的角度去考虑问题,而日本市场相对于滴滴其他地区市场有着完全不同的因素,涉及到了资本,使用场景,市场地位,用户画像等多方因素决定,这时的【成本与效率】已经无法排在做与不做的第一位了,接下来我们通过两张照片来看下日本司机的接驾场景

通过照片我们是否发现日本司机的画像其实和全世界其他的出租车司机都不太一样?是不是明显发现他们的年纪相对的更大一些?会穿制服佩戴白手套? 那年纪更大是不是意味着司机的视力会相对于中年人有所下降,白手套是否会影响他操作屏幕交互,那针对这么不同用户群体是否需要单独设计呢?最终的目标是占领市场的话是否要根据本地情况去服务好当地司机呢?


那我再来举两个例子来看看,我们来看看针对日本本地化做的特殊设计细节在哪些方面?



案例一:针对司机群体老龄化设计———大屏幕设计:

日本属于老龄化国家,司机平均年龄更是在50岁以上,高龄人群的视力相比于青年处于退化阶段,因此对于高龄人群来说在驾驶的过程中去读和操作小屏幕来说是一件非常痛苦的事情,UBER采用的是一套国际化的设计语言并没有针对日本的市场进行单独的设计,DiDi在日本则是针对司机群体采用了单独平板端设计,更大的屏幕降低了司机误操作可能性的同时,也能将字体放大,尽可能让司机方便识别



案例二:针对日本司机人文的设计———语音接单

“日本服务业发达,体现在服务的细节。出租车司机出于对客户的尊重,都会戴上白手套。但是在带着手套的时候,司机很难去点击屏幕进行操作,而且在行车过程中,触碰屏幕本来就是不合规的行为。无论是从法律层面还是价值观层面我们都不鼓励司机做出这种行为,于是开发了语音接单的功能。考虑到司机群体的年纪特征,我们选用了在日本相对普及又好识别的“了解しました(りょかいしました)”进行快速语音接单,在新版本上线后,司机可以通过屏中屏的方式去学习语音接单功能,只有他完全掌握这个功能才会为他完全展现,如果司机因为自身原因无法很好地说出那句话,我们依旧会为他保留按钮输入的方式”------国际化业务中的本地化设计


(图片来自于SUXA文章《国际化业务中的本地化设计》-吕诚)




国际化设计的思维框架

通过两个日本的案例我们能明确一个点【国际化实质就是做好每个地区的本地化设计】

怎么样让国际化的设计有法可依,我们先来看懂一个关系框架。做好一个产品实质是服务好每一个场景,那一个场景由哪几个方面组成,简单来说是由【业务】+【用户】组成,这并不难理解,我们作为产品设计师,首先是背靠业务,解决公司的商业诉求,给业务带来利益的同时给用户带来更多的使用价值然后获得用户的认可。在这个过程中,我们会将商业诉求和用户价值进行一个有效的结合,从而满足双方,但是还不够,因为一个场景还依赖客观的条件,比如时间和空间维度,最终也会影响整体的质量,我们将所有的因素通过包含关系展示出来

接下来我们往细的方向进行拆解,【业务】根据公司行业,阶段的不同以及基础能力的不同,呈现的点也不尽相同。最核心的点在于当前所属阶段,是1.0阶段力求生存下来,还是说2.0和竞品之间产生差异化,还是活3.0去打败竞品阶段。在不同阶段设计师要了解的事情也不同,对于1.0阶段来说,更精准的展示出用户画像和了解当地的文化与习惯是重中之重。但是到了2.0则应该更加关注产品目标与竞品的差异化竞争,通过差异化(杀手级)的功能形态获取更多的摇摆用户

不同的赛道,业务不同,打法也不同。我今天主要想讲的就是左右场景的另外一个因子【用户】。那如何定义一个用户呢?我们先来列举些具象的特征:

【外貌/文化风俗/地域特征/语言等】是一个用户的画像的基础组成,但是光有画像基础并不精确,因为每个国家的【法律/政策]同样会影响用户的行为。而在当今的互联网模式下,用户体验的提高必须得考虑各地区【硬件的水平以及当地的网络状况】,最后就是如何与【本地化的设计团队进行友好的合作】让体验和设计策略能够更加精准的传达到真实用户手里,获得用户认可,特别是在20年后,疫情的爆发导致设计师无法到前线进行真实有效的实地探测,那么加强合作以及对齐目标,为业务拿结果将是重中之重,接下来,我将对于每个影响【用户】的因子进行举例讲解








章节二:如何快速了解你服务的用户



做任何的设计都离不开用户画像,而做国际化设计一定也绕不开-霍夫斯泰德文化维度理论

可能你知道,在给拉美客户做单的时候他们会要求你的界面颜色亮丽,看起来更加奔放,而在给亚洲客户做单的时候则会相反,整体看起来更加约束。但是你能清楚的知道背后的原因么?如果不清楚那你的这块分辨更多是依赖于经验和他人的总结。那有没有一套理论能够很好的去辅助你去分析你的客户用户画像,去支撑你的设计。答案是有的,他就是【霍夫斯泰德文化维度理论】


霍夫斯泰德文化维度理论(Hofstede's cultural dimensions theory)是荷兰心理学家吉尔特·霍夫斯泰德提出的用来衡量不同国家文化差异的一个框架。他认为文化是在一个环境下人们共同拥有的心理程序,能将一群人与其他人区分开来。通过研究,他将不同文化间的差异归纳为5个基本的文化价值观维度


百科连接:霍夫斯泰德理论详情 (<-点击快速查看)

完全不懂的可以看看上面的链接,我们这里跳过部分解释….通过文化将维度理论我们将文化价值观划分成6个维度

了解完霍夫斯泰德理论以后我们该如何去使用呢?我们先从拉美用户和日本用户的差异对比开始

通过霍夫斯泰德官网查询我们可得知差距最大的两个分别是【男性化与女性化(Masculinity versus Femininity)】与【长期取向与短期取向(Long-term versus Short-term)】,差值比例达到了46和44.

接下来我们来对【差值较大】以及【分值较高】的因素进行解释和举例,去理解背后的原因



男性化与女性化(Masculinity versus Femininity)

日本是个生性好斗竞争意识强烈的民族。在日本企业中工作狂是他们男性气质的一种表现;而日本男主外女主内,62%的女性在第一个孩子之后选择辞职,也是男性气质的另一表现.

在日本想要成为一个出租车司机,就要在5年之内不能有任何违规,某些地方还会有特殊的考试,这里面的合格率并不高。并且在通过考试之后再在通过一系列的评分后,才能被评为A级或者AA级别的出租车,虽然这仅仅只是一张小贴纸,但是他也代表着一个出租车司机的荣誉。在这一方面,也体现日本社会的男性气质的确定性。

相比较日本,巴西人更会以家庭为中心、以教育为重心、博爱、具有个人风格意识。家庭是关键。家庭是巴西人生活的中心,也是其社会的核心价值观。对于一个家庭而言,家人共同用餐的时间是非常重要的,还有星期天的烧烤活动,能让更多的远房亲戚和朋友聚会。所以在巴西你很难看到休息日去工作的同事,甚至无法联系上他们:)



长期取向与短期取向(Long-term versus Short-term)

日本人将生命视为一个非常短暂的时刻,所以调查发现日本人普遍相信宿命论,他们鼓励节俭和现代教育的努力,作为为未来做准备的一种方式。

巴西相较于日本经济落后,人民的收入水平普遍不高,很多司机收入仅仅能够维持一家的支出,很难有结余,在巴西工资会按照周维度支付,以保证一家人的生活开支能够承担。

针对巴西的情况我们做了适合当地政策和环境的本地化服务。钱包1.0的时候我们先是和当地的银行合作推出了巴西99卡,允许司机随时提现且提现速度远远大于了当地的其他银行(48小时),那这种优势在收入较低的司机群体当中就会发挥很大的优势。在3.0的改版中,我们将钱包打造长了本地生活平台,我们允许司机通过平台去完成转账/水电费/电话费/还款等行为,原本需要走到线下便利店的服务被我们搬到了线上,更是大大的方便了使用99卡的群体。未来呢,我们将加大加多权益,达到使用场景独占的目的。通过这些服务为我们给用户带来了使用价值,同时我们也给业务带来了价值,更多的绑卡渗透率为我们后续的推广和矩阵式的打法提供了导流的入口

(99与当地银行合作的线上本地生活功能-99Pay)



不确定性的规避(Uncertainty Avoidance)

日本地处自然灾害频发地带,没有丰富的自然资源,生存条件不太好,所以日本人有很强的危机意识,学会了为任何不确定的情况做好预防措施,对待事情也希望有明确性

而巴西虽然处于平原,没有自然灾害,但是因为社会安全因素,整个社会对于社恐事件还是有较强烈的危机意识,所以司机会更加关注接送流程中是否会前往不安全地区,以及乘客的质量

(日本司机的真实驾驶场景)


费用收取的正确与否也是服务体验优秀的表现,日本司机会用计步器进行计价,如果涉及到了其他的费用则会使用单独的计算器进行精确计算,这么做的原因是为了避免计算错误给乘客带来困扰和争执,那从这个环节来看,司机为了规避【计算错误的可能】而预备了计算器,减少了差体验的可能


在巴西,滴滴如果对司机派单如果过远会或者是危险地区会进行提示,允许司机取消派单。并且根据调研司机群体特别是夜班司机会有随身携带防护性的武器用来自我保护,那么也能很好的说明整个社会对于社恐事件还是有较强烈的危机意识。那么做为设计师,是不是意味着可以把危险地区的派单做的更加醒目,让司机能够更快识别,更快决策,而不是为了平台和用户利益进行隐藏。是不是可以把安全链路透传做的更强,让司乘都能更加快捷第一时间选择自助服务









章节三:绕不开的硬边界



法律法规的约束

每个国家的发展阶段不同,对于隐私重视程度不同,因此针对不同地区的海外市场,作为业务的合作伙伴设计师们需要针对不同的市场配套不同的安全合规方案,这一点格外需要注意,不然会被罚的很惨,通常获取地理位置/账号信息保留是每个公司都非要需要的,因此在空投其他国家之前需要了解是否立法关于隐私相关的法律,如果有则需要通过配置化将其他国家上线的隐私条款和设置方式复制过来使用

LGPD和GPDR风控合规

简单来说就是要做到信息安全,保护个体隐私。大家都知道在中国我们的信息被侵犯的体无完肤。其实在国外也是一样,各种权限,各种信息默认保留和上传。但是随着各国的重视,个人隐私也逐渐走向明确的法律保护层面。在拉美有LGPD,在欧洲有GPDR


GDPR 是(The European General Data Protection Regulation )的缩写,即通用数据保护条例。是欧盟议会和欧盟理事会在 2016 年 4 月通过,在 2018 年 5 月开始强制实施的规定。

GDPR 意义在于推动强制执行隐私条例,规定了企业在对用户的数据收集、存储、保护和使用时新的标准;另一方面,对于自身的数据,也给予了用户更大处理权。也就是说在18年生效之后,如果再有欧洲任何公司App不对用户的数据进行合规处理,擅自收集信息就将会受到严惩



智能硬件的普及度以及新旧

硬件的普及率以及新旧差异也同样影响着本地化设计,通过调研和外界公布的数据我们得知,在拉美高端手机的占比远远低于发达国家。因此在给发达地区做设计的时候可以考虑更多体验上的拓展,但是在给发展中国家做设计的时候则需要进行小屏幕最小尺寸的适配,这样做是为了最好的进行向下兼容,从而保证所有用户都能够使用。同样,如果你在给发展中国家做设计,那么复杂的动效和高清晰解析的大图最好是不要去做的

(网上后台数据展示截图)



当地的网络环境和下载速度及物流环境

拉美国家,基建水平滞后,网络下载的速率波动较大,且存在不稳定的情况,以及流量费用的价格差异。因此某些设计手法在较发达国家能带来体验但是在发展中国家可能会是灾难


举个例子,司机端的历史列表如果存在400条记录,如果司机有诉求想刷新查看更多的订单,是一次性下拉刷新展示全部好呢?还是一次性展示50条好呢?还是一次性展示20条呢?


答案是一次性展示20条是最稳妥的选择,因为网络的不稳定性,一次性加载太多数据会导致过长时间,而网络不稳定极有可能导致下载失败,并且一次性下载太多数据可能并不符合司机查询的最初诉求,反而浪费司机的宝贵流量,最终会引擎流量消耗过快引发进线,这里的决策是损失一些用户的体验去保障司机的收入,但是在拉美因为手机的性能/网速的稳定且快速/套餐足够便宜,因此我们可以尝试使用一次性加载全部的数据,这样能让体验感受更好

(99信用卡的申请权益展示/激活流程页面)


再举个例子,拉美物流相对没那么发达,且因为政治/经济局势的不稳定性,导致物流包裹存在无法送达的情况,如果收件人不知晓当前的状态而超出了等待的预期,那么他就会进线询问。那在这个场景我们有什么更好的办法?是否可以透传更多的包裹进度方便收件人查看,再者再将用户导流到客服自助而非进线?这样的好处一来体验的链路完善了,让司机可以找到自助的出口,二是方便我们可以更好的了解哪些地区收到邮寄的折损率最大?从而探索新的业务,发现新的机会点








章节四:生活习惯和历史文化遗留带来的本地化策略



收入/支出方式占比反映了一个群体的现状

聊这个话题前我们先将选择的范围进行收缩,聚焦在一个国家的一个群体内去看会比较容易解释。在巴西司机的收入的往往只能支撑下一周的家庭支出,难有结余。这也导致司机会选择双开(同时使用UBER接单或者其他竞品)或者进行其他赚钱的方法,如果整个群体都是这样的情况下,那么司机的忠诚度(这里指的忠诚度不是贬义词,而是每周的出车时长)必然下降。那样对于大盘的运力来说便是损失。那有没有什么办法帮助司机更好的应对这些问题


我们该如何思考这个问题,通过马斯洛的需求理论我们能够将人的诉求归为三类,基础的生存诉求/归属感和成就感。那这三种可以再细化成两类,物质层面的诉求和精神层面的诉求。司机愿意在滴滴平台跑单是基于了物质层面。那么,我们是不是可以丰富收入以外的奖励形式,提供活动奖励或者权益的折扣,又或者尝试下小额贷款,那这些是不是可以给用户带来价值点呢?


精神层面我们是不是也有发挥的空间,对于补贴,往往是有限的。那如何做到持续长期刺激司机群体?如果一个乘客对于司机进行了表扬和小费的激励,是不是可以给司机带来更大的信心去服务好乘客,那我们是不是要加强这方面的透传。是不是可以给司机提供虚拟奖励,让司机存在足够的拥有感和成就感,让司机群体也能感受到平台对他们的看重。如果勋章可以,那等级是不是也是成就之一呢?



现金与线上支付普及与思考

不同的国家线上和现金的支付比例大不相同,这里受经济环境和政治环境影响较大。总的来说习惯了线上支付的习惯后就很难回到现金支付的环境,因为确实更加方便便利。一个国家大量使用现金支付的情况下,往往是互联网公司能做的发力点和蓝海。核心做法是通过核心业务导流到钱包模块,在与当地的银行和机构进行合作,增加卡和账户的渗透率。然后通过做权益和服务,满足用户的生活诉求,从而达到场景独占。最终将会让公司的业务矩阵从单核的核心业务到核心业务+本地生活




文字的适配/i18n翻译的本地化(不同地区/国家语言精准翻译,拒绝里语/文字长度折行问题)

这里我们需要提到一个概念,i18n(其来源是英文单词 internationalization的首末字符i和n,18为中间的字符数)是“国际化”的简称。在资讯领域,国际化(i18n)指让产品(出版物,软件,硬件等)无需做大的改变就能够适应不同的语言和地区的需要。对程序来说,在不修改内部代码的情况下,能根据不同语言及地区显示相应的界面。 在全球化的时代,国际化尤为重要,因为产品的潜在用户可能来自世界的各个角落。通常与i18n相关的还有L10n(“本地化”的简称)


了解完i18n的相关背景以后我们大概可以把他定义成做国际化翻译的一个中台,所有的本地化设计在经过研发代码实现后,都会进过他们去对文案进行翻译校对,最终变成当地人可以理解的话术落地到界面上,从而进行本地化的空投,但是这里面往往存在一个适配优化的问题。大家知道英文的单词平均长度要长于汉字,而西语和葡语是英文的1.25倍到1.5倍之间,而俄语的长度更是能达到葡语的1.25倍。那么面对多国空投的适配不仅仅需要i18n进行精准翻译,还需要把控字符长度,避免折行和省略问题


我们来看下下面这个例子


(不严谨的快速翻译,只是为了更方便的展示不同文化下的文字长度)


不同国家的语言不同,文字也不同,则会存在单词,句子长度/行高的差异。如果一个产品在初期没有做好适配的话,到后期替换当地语言的时候极有可能出现文字溢出的问题,这也是为什么在做海外设计的时候最好拿当地的语言进行设计,能初筛出一些细小的问题 ,避免在和翻译中台对接的时候因为文案太长提供的空间不足而修改页面间距和留白的适配问题



中东国家客户的产品需要注意适配

如果你服务中东客户,务必需要呈现出当地的阅读排版方式(尊重本地化设计)具体的适配细节这里就不过多说了,网上搜索【RTL适配方法】即可

(Material Design中的RTL适配)



缩写是否合适(日期/业内专属名词)- 时间格式/货币符号/联系方式/地址等

格式也是做国际化中一个非常常见且体现专业度的地方,不同国家的时间展示方式不同,会影响用户的阅读,举个例子“03/08/2019”,如果在A国理解是2019年3月8号,在其他国家复用是会存在理解成2019年8月3号的,更别说我们加上的星期之后的展示方式。这就要求我们在进行开新的国家的时候务必于前线进行更好的沟通,保障阅读的习惯和当地一致,那货币符号/地址等也应该遵守当地的习惯去展示,通常的解法是设计团队去收集信息并且与前线当地人员进行交流确认,将格式记录下来,最后与研发根据上线的国家展示不同的格式









总结

因为时间仓促,无法面面俱到的将每个点都进行举例论证,尽可能把我认为重要的点都提了出来。理解了这篇文章并不代表看懂看明白就能做好国际化,它更像是一个方法论,帮助没做过国际化业务的同学能够快速理解当地的用户和业务的打法


希望我的文章能够抛砖引玉,给大家一些灵感,也希望更多朋友能够将国际化的经验分享给设计的朋友们。让我们一起把中国互联网国际化的业务做到越来越好


最后引用我一老哥的话进行收尾“更好的国际化就是以更好的本地化思维去看待,去理解它们。而不是仅仅以一个理性的角度去看待。要站在用户的角度去看,永远不要轻易地相信自己的理解

文章来源:站酷  作者:大宝蛋

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


问卷发布后,如何整理体验反馈意见?

涛涛

本文从详细问题反馈分析及分类、体验问题价值优先级评估、意见反馈体验问题价值优先级评估等方面,帮你学会整理反馈意见。

问卷发布后,如何整理体验反馈意见?

问卷发布后,如何整理体验反馈意见?


文章来源:优设  作者:
vv酱•-• 

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





本文从详细问题反馈分析及分类、体验问题价值优先级评估、意见反馈体验问题价值优先级评估等方面,帮你学会整理反馈意见。

问卷发布后,如何整理体验反馈意见?

问卷发布后,如何整理体验反馈意见?


文章来源:优设  作者:
vv酱•-• 

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





日历

链接

个人资料

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

存档