产品思维, UX设计下一个趋势?-人生苦短,做点喜闻乐见的[MUX翻译]

2015年7月30日 没有评论

UX-banner980

当想起用户体验,我们经常会想到一款简洁、美观、易用产品的一系列功能,它让我们的生活更简单。针对用户遇到的问题,产品试图通过多种方法去解决,功能仅仅只是这众多可想出方法的一小部分。从产品的角度思考,意味着多维度统筹思考解决方案,包括特定用户的问题、待解决方案、产品目标、产品营收等维度。

UX_001

用户体验的核心不是一系列功能;事实上,它是用户会为你这款产品买单的原因。Uber用户体验的核心理念是任何时候轻松打车(把人带到城市的每个角落)。例如倒计时功能,能精准的显示出租车何时到达,是扩展用户打车体验的合适功能。但不论倒计时功能是否存在, Uber的产品都能运行。而从另一方面来讲,倒计时功能却不能脱离产品独立存在(任何时候轻松打车存在一定必然性)。在功能和产品之间,存在一种单向关系:功能依附于产品,不能脱离产品独立存在。这也是为什么设计师应该先站在产品角度思考的原因。

“从产品角度思考,而不是功能角度。”

 

用户为什么会为一款产品买单?

产品的核心用户体验就是这个产品存在的原因。它要么满足了用户需求,要么解决了用户遇到的问题。从而使得这个产品变得有意义,能够提供给用户一定的价值。与之相反,如果问题本身并不存在,或者说解决方案没有对症下药,那这个产品将变得毫无意义,甚至没有用户使用,最终导致产品的失败。对于错误的解决方案,我们可以修正;但对于本不存在的问题,除了重新探索发现,我们无路可走。所以,怎样才能确信我们解决了真正的问题?唉,任何人都不会100%确信,但通过观察和访谈,我们可以大大减少风险。因此,我们需要发现问题,形成用户真正想要的解决方案。

 

“知道自己想要什么并不是客户的工作” – 斯蒂芬.乔布斯

 

例如,Clay Christensen曾试图去提升奶昔的销售量。他试着让奶昔的味道更甜,提供不同口味,以及小幅度增加杯子尺寸大小。遗憾的是,这些尝试并没有起到任何作用,直到他开始观察购买奶昔的顾客。他发现为奶昔买单的顾客,其实是为了让自己早晨开车去上班没那么无聊。奶昔最大的好处,在于它是一种粘稠饮品,且保持粘稠状态要长于其他饮品,更别提它还填充你的胃。而这恰恰是真正的问题:顾客对它没有任何想法。最终,Christensen想到了解决方案,让奶昔更加粘稠,这也导致了奶昔销售额的上升。

 

“爱上问题,而非解决方案” — 劳拉·哈维尔 Laura Javier

 

产品思维:为用户的需求而设计

从产品角度思考,帮助设计师创建成功的产品功能。通过定义产品解决的问题,实际上是在回答 “我们为什么设计这个产品?” 。首先定义目标人群,思考“谁面临这些问题?”;然后寻找解决方案,思考“我们要如何解决相应的问题?” ,这样的思路将会指引我们找到全新的产品功能。设立目标,将有助于衡量这个功能是否会成功。

UX_002

解决痛点

产品变得有意义,在于它提供的解决方案能够真正解决潜在的问题,这个方案能够清楚的阐释出问题将会如何被解决。因此,针对问题的解决方案实际上定义了产品的核心用户体验。具体的产品功能可以支持并且延展产品的体验,但核心体验是无法被取代的。交互设计和视觉设计可以使产品更加美观,易用,令人愉悦,确保其在竞争中脱颖而出,但它不能使产品本身更有意义。这就是为什么一个恰当的针对痛点的解决方案是产品成功的关键。

 

产品定义

当带着产品思维思考时,用户体验设计师,首先应该能够回答以下问题:我们在解决什么样的问题?(用户问题);我们为谁而做?(目标用户);我们为什么要这样做?(视角);我们如何做(战略),我们要实现什么?(目标)。只有这样,思考我们究竟在做什么才是有意义的(产品功能点)。

UX_003

产品思维的力量

在为正确的人打造正确的产品功能等方面,产品思维给设计师带来了优势。它有助于设计师整体上理解产品的用户体验,而不仅仅是在交互和视觉的细节功能点上钻牛角尖。同时,它确保设计师解决真正的用户问题,从而降低做无用功的风险。无论何时开始创建产品功能,产品思维能够帮助我们做出正确的决定。

 

“创建产品功能很容易,为正确的用户创建正确的产品功能却是很大的挑战”

 

产品思维确保用户体验设计师发现真正的问题,创建正确的功能点,并且能够与团队成员(尤其是产品经理)更有效的沟通。在添加新功能前,它让设计师仔细思考后再做出决定,甚至可以说“不”。无论何时一个新功能或新想法被提出,设计师在绘制线框图或搭构精美布局之前,都需要想明白这些问题:“它是否适合这个产品?”-“它是否解决真实的用户问题?”-”用户是否想要或者有需求?”-“让我们先想清楚!”这将确保产品的简洁和有效。

 

小结

以产品角度思考,确保设计师为正确的人设计正确的产品功能,解决用户真正的问题。它使设计师做出正确的决策,是打造“用户所需”成功产品的基础。产品思维让产品管理和体验设计人员建立卓有成效的合作关系,携手做出更好的产品。这就是为什么产品思维是用户体验设计领域的下一个趋势。

 


 

原文地址:https://medium.com/@jaf_designer/why-product-thinking-is-the-next-big-thing-in-ux-design-ee7de959f3fe

译文仅作学习用途,如有其它用途请联系原作者。

译文转载请注明:本文来自MUX

keep calm and be awesome

 

分类: 设计用户体验 标签:

Material design是一个设计科学[MUX翻译]

为什么说Material Design是我们追求统一设计语言的最佳尝试?

自2013年苹果发布iOS7之后,整个世界都爱上了扁平化设计。扁平化设计并非由苹果首创,(事实上,微软远在苹果之前就已经支持扁平化了),但是,是苹果把扁平化普及给大众。他们确实做得很棒。

 

作为一个设计师,我放了一张非常熟悉的界面

ma_001

先从视觉来说。

每当我再次看到扁平化的设计,都感觉比上一次更加舒服。我沉浸在ios7对留白的运用中。在此之前,我一直觉得留白空间应该被填满才正常。可是我从来没有真正地想要填满它,但是使用久了,它总会被一些东西填满,并且排列得不整齐。客户们很容易发现留白并且倾向于将其塞满。但是我相信极简风格会越来越流行。摆脱拥挤,我们会感到舒畅,也便于思考。用户希望在他们的设计中拥有更多的空间和支配权,这样界面中的元素会更加清晰和明确。

苹果曾经独领风骚很久的仿实物纹理风格已经逝去!设计师和创意总监以及其他设计工作者向尸体上吐唾沫,他们高呼“打倒渐变!模糊背景!

ma_002

接下来是练习

所有出现在我办公界面上的东西都变成扁平的了,扁平到只剩下填充和描边。苹果要让界面看起来简约,所以我花了几个月的时间去适应扁平化设计,锻炼技能直到自己满意。当其他设计属性不再重要后,比例和布局成为了设计的重心。扁平化设计使得运用渐变和阴影不再能拯救我拙略的设计。然而,扁平化彻底解放了设计,它是振奋人心的。因为设计的关注点原原本本的回归到了设计本身。

 最后一步是实现

在拟物世界来临之后,设计师们开始思考,我们还能再创造些什么?这些设计理念如何帮助已经成形的设计持续地、积极地发展或者演变?然而答案并非如此。一旦新奇的事物逐渐消失,这就会成为一个问题。我们一直使用触屏设备,可是现在的界面却缺乏触感。颜色的变化仅仅只能解决可用性的问题。

这整个设计过程让我想起了第一次学习使用Photoshop的情景。我使用滤镜和效果去装点每一张图像,却仿佛摧毁了很多东西。

 

这张图像需不需要镜头眩光?”我问自己。

当然!”我自言自语到。

特效需要叠加多少次呢?

至少上百次。

 

当我的技巧跟上了我的审美,我的审美却告诉我,当时的我一定是酩酊大醉而且才做出这些失败的图像。新鲜感消失的时候,我开始寻找更加温和,内敛和巧妙的方式让图像脱颖而出。

进入Material design 语言时代

ma_003

这个设计看似简约,但蕴含着很久……

当这个世界被变的单调乏味,Mountain View 如绿洲般脱颖而出。 谷歌在2014 I/O会议上发布了基于安卓L的Material Design概念和语言。 显而易见的是,谷歌在这一设计中投入颇多。Material Design不仅是一个设计语言,它还是一套大纲级别的交互设计原则。这就好比物理学家用简单的定理去解释所有的事物。谷歌在追寻着可以统一交互设计和界面设计的定理。

“Material Design语言的不同在哪里?什么会阻止它成为一个真正的革新?” 我们等待您的提问。

其实,这很简单。问题就是。。。

Space Time

Material design用到了时间和空间两个设计元素

ma_004

也许空间和时间这个词听起来太学术气了,但是接下来的故事很精彩,我打保票。

Space

一直以来,用户界的设计牢牢遵循拟物原则以便于用户准确得理解和感知。通常,这体现在在视觉上:界面中物体的样子源于它在物理世界中的样子。阴影和渐变的建立是为了模拟光源,并给扁平元素一厚度。这么一想,material design并不是一个全新的发明。

相反,它只是简单地提供了一个规则去管理和规划元素所在的空间。Material design将屏幕视为3d的可以模拟物理世界的板。我们平时最熟悉的且具有质感纸张就可以被模拟。我敢打赌你正在想象触摸纸的感觉

在z轴上每个空间都有自己的位置,从而给人们一种感觉,那些元素真实存在,就在屏幕下面,设备的里面。就像几张纸在彼此的上下滑动。

元素的行为可以不和物质世界的行为一直,但是同时又不打破物理规律。这样一来,用户就不会觉得不自然。Material design 创造了在电子和数码世界中独一无二的空间关系,却有没有显得格格不入。它给用户非常熟悉的感觉,但同又具有魅力和新鲜感。

ma_007

Time

之前,在用户体验中,我们大大忽视了时间这个元素。人不仅仅能感知产品的状态,也能清楚的察觉到状态之间的转换。如果状态之间的转换很僵硬,用户能感到不协调和不自然。

ma_008ma_009

打个比方,舞台剧表演中,当一个演员从右侧舞台退场却在几分钟后从左侧舞台入场,观众将会感到疑惑,注意到连续性的缺失。 这是不合常理的,并且将会打扰沉浸在舞台剧中的用户,把他们带出情景。

很大程度上,屏幕就是一个舞台。当某个东西神奇地从一个状态切换到另一个状态,并且没有任何的前兆和清晰的入口,我们就会马上感觉到奇怪并且产生疑问。界面原本想要让我们沉浸的体验被破坏,我们也从体验中脱离。

这个时候,你也许会说,那太棒了,我们就给所有东西都加上动效。但是事实并非这么简单。动效要感觉逼真和亲切。它必须看起来是被物理力驱动,就像真实世界重的物体一样。

Material design采用不对称的轴去模拟质量和重量。匀速直线运动缺乏物理世界中物体受外力而产生运动的真实感。

ma_010

Material design不只是运用动效,而是提高了动效的优先级。动效不只是 “有了更好”的东西,它具有意义。运用动效提高可用性。

扁平化设计面临的一个问题,就是其设计风格较难展现交互过程中,竞争对象们之间的层级关系和重要性的差别。仅运用色彩、形状、大小和间距是具有局限性的。但是,将时间的元素融入到设计中可以表现重要性。当某个对象比其它对象到达屏幕的速度要快,我们就会先注意到它并且自然而然的认为其它对象随它而来。这样,层级关系就出现了。

ma_011
“所以呢?”你问我。“是什么在阻止Material Design成为一个真正的创新呢,就如同之前我们所看到的设计趋势一样?” 可以说Material Design中用来组合和区分的视觉元素也许会淡出设计史册。大胆的色调和个性突出的浮动操作按钮会被时间淘汰。而不同的是,基础设计理念和力量将会存留。炫目的动画效果和具体要素背后的思想将会一步一步演化并且塑造下一代界面设计。

在早期,牛顿对万有引力的认识超越了人们的接受范围并且受到质疑。同理,Material Design的设计原则也要经受考验并且不断进步。但是我们现在还是要嘉奖Material Design,因为它是第一个为人机交互设定统一框架准则的设计理念。

如果您还没有浏览Material Design的引导说明,我要极力地向您推荐它。那些说明非常的详尽细致,考虑得全面周到。

 


 

原文地址:https://medium.com/@danhollick/material-design-is-design-science-6c99c1d76498

译文仅作学习用途,如有其它用途请联系原作者。

译文转载请注明:本文来自MUX

keep calm and be awesome

 

分类: 设计用户体验 标签:

图说2015用户体验行业调查报告

     2015年7月19日,由国际体验设计协会(IXDC)主办的亚洲最具影响力体验设计盛宴“国际体验设计大会” 在北京•国家会议中心圆满闭幕。在17日的大会主题演讲上,IXDC副会长胡晓分享了《2015用户体验行业调查报告》,报告通过从业者画像、薪资、跳槽、满意度、企业团队、核心竞争力六个方面的全面调查,对整个行业情况进行了系统的分析,为用户体验从业者了解行业现状和发展提供了客观有力的参考。本次行业调查报告由IXDC 联合腾讯 CDC 共同完成,本文以图表方式对报告核心内容进行解读。

一、同行都是谁?

     用户体验行业从业者年龄普遍偏小,从业时间较短,年轻化趋势明显;学历偏高,本科以上从业者占比大,行业专业要求在不断提高。此外,大部分从业者在民营或者外企工作,市场对于体验行业的需求旺盛。

1

     当前用户体验行业的主要工作岗位包括,管理、视觉设计、交互设计、用户研究、产品等,不同工作岗位的从业者有着鲜明的特点。

2

二、同行的薪资水平是多少?

     用户体验行业超过三成从业者税前薪资收入在5~15w,工作类别不同,薪资水平有一定区别。团队和项目管理薪资分布范围较广,高于其他岗位。

 3

     影响从业者薪资水平的主要因素是工作岗位、从业年限、公司规模;影响薪资涨幅的主要因素是公司规模和行业所属领域,企业规模越大,薪资涨幅相对较高。

 4

三、哪些人想跳槽?

     从业者跳槽的调查分析显示,有六成以上的从业者有过跳槽经历,未来一年有五成从业者考虑换工作。从业者跳槽的主要因素是“产品项目状况”、 “公司团队状况”、“薪酬和福利待遇”以及“培训学习机会”。

5A

     不难发现,用户体验行业的流动性在逐渐增加,从业者们的选择机会也越来越多,从业者的职业规划也更加多元化,这对用户体验团队、工作环境、培训等都提出了更高的要求。

四、同行对工作都满意吗?

     2015年用户体验行业从业者工作满意度为比2014有一定提升,行业信心指数比2014年略有下降。影响满意度的主要因素是“薪酬”、“工作内容”、“是否有话语权”,各类别从业者工作满意度存在差异。

6

五、行业发展趋势如何?

     报告显示,本次调查的65.5%从业者都在互联网公司工作,其中三成从业者在1000人以上的大公司工作。一般仅千人以上大型综合性公司和专门设计类的公司才设有用户体验部门,不过用户体验团队的规模在逐年扩大,行业趋于互联网化的同时,用户体验团队建设也越来越受到重视。

7

六、哪些能力最重要?

     调查分析发现,为了保证核心竞争力,用户体验行业的从业者需要具备的通用能力有“沟通”、“需求理解”、“团队合作”、“用户体验思维”、“逻辑分析”等,但不同类别的用户体验从业者能力要求的侧重点有所差异。

8

     本次行业调查的参与人员主要是一二线城市的大中小型企业从业者,调查问卷从设计、发布、回收到数据分析、报告编写均由“腾讯问卷”负责,行业报告完整版可通过腾讯CDC官网或者IXDC官网下载阅读。腾讯问卷(wj.qq.com)腾讯CDC根据多年问卷调查经验开发的在线问卷调查平台,该平台前身是腾讯公司内部进行用户、市场、产品研究的重要问卷调查工具。

完整报告:2015国际用户体验大会行业报告[完整版]

阅读全文…

欢迎来到95后的世界——《95后生活形态调研》

“萌萌哒”还是“逗比”?

“文艺”还是“接地气”?

“二次元”还是“三次元”?

“快乐大本营”还是“花样姐姐”?

 

 

15-20岁的青葱年华已不见80、90的身影,95后的年轻一代渐渐活跃在各个角落。做为最亲移动互联网的一代,1亿95后在5-10年后将成长为中国社会的消费中坚!

那95后到底什么样? MUX用户研究组海陆空立体式全方位深入95后:

13名祖国各地、生活迥异的95后详细记录7天的生活(你造他们平时干哈想哈吗?)

3000名95后参与生活、习惯、价值观问卷调查(你造他们最喜欢别人夸他们啥吗?)

近亿用户行为数据分析展示95后移动互联网生活(你造他们喜欢哪个明星吗?)

 

来,带你进入95后的世界吧~

我们是95后!

 

P0封面

帅帅帅,我最帅,就是这么自信!!!

 

P1帅

靠谱萌萌又逗比的二次元男神/女神!!!

 

P2自我标签

刷刷刷,刷空间!!!

 

P3信息渠道

吐槽卖萌涂鸦粉明星,样样都行!!!

 

P4网上行为

音乐游戏动漫,二次元都爱!!!

 

P5二次元

美女/小鲜肉,最喜欢啦!!!

 

P6综艺节目-新

女生爱学习,男生挣钱谈恋爱!!!

P7男女差异

 

更多精彩、更多发现、更多细节请见《欢迎来到95后的世界–95后生活形态调研报告》(链接:http://pan.baidu.com/s/1bn2MxH1  密码:kdqc)

95后调研还在继续,小小剧透一下:《指尖上的生活—95后手机使用行为调研报告》《赚钱&花钱—95后生活服务使用行为调研报告》……表着急,稍后呈现~

 

感谢各位亲们观看、评论、点赞~~~MUA~~~

分类: 设计用户体验 标签:

互联网CEO大会总结

(本文出自腾讯CDC博客: http://cdc.tencent.com/?p=8435)

为设计师而生-设计导航设计总结

一、写在前面

作为设计师想要设计出足够优秀的作品,除了拥有熟练的技能外,还需要拥有出众的创造力和审美。如果对万事万物没有足够丰富的体验和感受,没有对美的认知和体会,是很难提高层次,做出满意的设计的。

“开阔眼界,提高审美”,无疑是设计师的一门必修课。你可以先从点开http://idesign.qq.com做起哟。

1

二、项目前期

不管你是刚入门的初级设计师,还是有经验的高级设计师,都需要通过“看”,也就是阅读和整理各种资讯和信息并去芜存菁,来提高审美,拓展思路。

设计师在工作中需要各种信息各种知识储备,如何“看”,是我们要解决的首要问题。

2

三、探索需求

围绕如何看这个关键点,我们开始了更进一步的分析。我们采样了一些设计师,观察他们每天浏览的习惯,浏览的内容以及目的。发现他们的活动可以归纳成以下两种情况:

看—有效率的看(发现,吸收美好的东西)这不仅仅要大量的看,更是要看更多优秀的内容,并且这些内容不仅仅只是局限于界面设计,需要从更多其他的学科,比如音乐,文学,摄影等等方面去从中学到知识,找到灵感,找到前进的动力。

看—有质量的看(借鉴,创作出美好的东西)能辨别什么是好的设计,哪些内容能够为我所用,能激发创作的灵感,去组合借鉴以及创作出更美好的作品。

基于这样的需求,设计导航的设计关键词渐渐清晰:

3

四、设计方案

一个为设计师服务的“设计导航”由此诞生。我们的宗旨是“聚合优质站点,筛选优质内容”。让设计师在设计导航可以享受一站式的阅读体验,更方便的浏览和收集信息,作为自己的灵感之源。

1433751130_10_w720_h480

五、框架结构

为了最大化的展示内容资源,我们的界面采用了扁平的两栏结构作为基础框架。

4

左侧用来罗列订阅源,右侧用来展示内容列表。我们在首页做到简洁,砍掉多余的分类和隐藏多余的操作,希望用户在使用设计导航时,能聚焦于内容,获得舒适的阅读体验。

六、内容为王

1.让内容更丰富

内容是我们设计导航的核心重点。我们发现设计师对内容的需求主要覆盖在创意需求执行需求两个方面。

创意需求是开展设计,打开思路需要的资源,比如一些设计的专业理论和方法,设计需要的高质量素材等。而执行需求则是做事的方法和流程管理,团队合作的节奏和行业知识等。

据此,我们收集整理了业内最热门的资源站点,还有来自资深设计师们的压箱推荐,以及各种高关注的的内容。可以把设计导航看做一个设计师的灵感库,不管是设计之内还是设计之外,都能找到最全面,最资深,最新鲜的资源。【优质的一站式阅读】是我们的核心。

5

我们参考了RSS阅读器的模式,将设计师经常浏览的各种网站的内容聚合起来,只需要对你感兴趣的站点进行订阅,就能轻松的在设计导航享受一站式的阅读体验了。

从此以后再也不用在各大站点之前来回奔波切换,关注的站点有更新也会第一时间查看到。

55

2.让内容更优质:

用QQ账户登录以后,除了能看到设计导航本身的推荐内容,你还可以看到其他用户都在关注什么,都推荐了哪些站点,让你发现更多的优质内容。形成良好的分享与学习,不断吸收进步的阅读生态。

你还可以给你喜欢的内容点赞,轻松创建自己的资源库。持续关注和更新自己的收藏内容。

1433751370_60_w720_h480

3.让阅读更便捷:

有了优质丰富的内容库,优化用户浏览的体验是我们的下一个课题。在设计上我们希望给用户一种无负担简洁清爽的体验,又能聚焦于内容。

在设计导航首页的设计上,我们将点赞和分享以及多余的信息降低了一个层级,用户hover到缩略图上才可以查看,这样不影响内容呈现的同时如果希望通过收藏和浏览数量来分辨内容的质量,也能很方便的找到。

1433751409_69_w720_h480

我们将内容的分类藏在了编辑内容里面,你可以简单的筛选想看的内容,同时不会在首页有阅读的负担。

1433751468_98_w720_h480

为了更方便的浏览,我们增加了一键将设计导航设为主页的功能,也设计了更为轻便的浏览器插件,不仅可以随时浏览各种设计资讯,还可以把你发现的当前优质站点一键推荐给我们,同时也是对设计导航内容的丰富和沉淀。

1433751527_41_w720_h480

八、小结

为了让设计师每天都要“看”的这件事情变得简单高效有质量,设计导航的第一版就在这样的情况下诞生了。但愿大家能在设计导航能发现更多喜欢的内容,激发出更多更好的创意,做出优秀的设计作品。

设计导航,为设计师而生~

九、项目成果与后续

后续我们会将“设计导航”逐步完善,并不断优化网站的用户体验和流畅度,秉承我们“为设计服务”的初心,继续提升用户体验,请大家持续关注,有任何问题都可以及时反馈给我们。感谢大家对设计导航的支持:)

最后大家可以登录http://idesign.qq.com体验最新的设计导航。

(本文出自腾讯CDC博客: http://cdc.tencent.com/?p=8399)

给自己的字体课(一)——英文字体基础

这是一个给自己准备的字体学习课。

开始的初衷是想解决工作中一些关于字体的疑问(如排版、LOGO设计等),同时也想通过回顾设计的基础知识来提升自己。

所以给了自己这个课题,作为初学者只接触到一点皮毛,整理分享出来,如有不足之处烦请指正。

「字体排印」位于语言、文化、科技、美学的交汇处,是一个内涵与外延非常丰富的大话题,这次分享仅选择一些基础的有用知识。

1

2

3

4

5

6

英文字体最简化的分类:衬线体、无衬线体。二者区别在于衬线体有爪形的衬线并且笔划粗细有变化。

7

一.衬线体

非常古老,可以追溯到古罗马时期的石柱铭文。它风格古典、正式,具有历史传统和意义。

按照历史发展顺序,衬线体可分类为:古罗马体(Old roman),旧风格字体(Old style),过渡字体(Transional),现代字体(Modern)。我们选取其中两个节点——Old style和Modern字体,通过对比两者特征,就可以理解整个衬线体的发展。

8

旧风格字体(Old style):

特征:对角强调线,倾斜、括弧型衬线,较缓和的粗细过渡。

风格:传统,常见于书籍、报章杂志的内文排版。

现代字体(Modern):

特征:垂直强调线,水平、极细衬线,强烈的粗细对比。

风格:横平竖直,现代感,高冷。

总结起来,在整个衬线体发展中,笔划对比变得越来越强烈,衬线越来越尖锐纤细,过渡字体的笔划粗细和衬线弧度恰好介于Old style和Modern之间。其一大原因是刻字师傅的技术越来越进步,刻工也变得细腻,使得精确的线条、更精细的粗细对比成为可能。而强调线的倾斜角度也逐渐被「扳直」,这是手工书写向现代排印转变的一个表现。

9

古罗马(Old roman)、旧风格(Old style)衬线字体案例:

《Kinfolk》是一本推崇慢生活的杂志,常介绍美食、旅行、有格调的家居设计,欣赏微小平淡,返璞归真的美。在此背景下,它的标题使用的是一种古罗马体(Old roman):Optimus Priceps,有一种手工感、古拙的趣味,以及书法的味道。可以注意F衬线左右两边的不对称,以及O笔划的凹凸不平。这种字体风格与kinfolk的定位是相符的。内文使用的有旧风格字体(Old style)Calson和Garamond,相比下我更喜欢下面第三张图内文使用的Garamond,搭配大背景图片和居中排版,显得传统、柔软,有一种诗歌般的美。

10

11

12

现代字体(Modern)案例:

因为现代字体(Modern) 有着锐利的工业感, 同时也保留着传统的衬线元素,显得现代而优雅。所以非常适合时尚工业,Vogue、Elle等杂志都使用了现代字体。许多奢侈大牌也用现代字体作为logo,强调自己百年的传统工艺和优良设计。如使用 Didot的 Giorgio Armani、Burberry,以及使用Bodoni的Valentino。

13

14

通常会认为,衬线体代表古典正式,无衬线体代表现代亲和。但衬线体真就不能传达出现代和亲民么?

15

答案是否定的。Converse所使用的字体Rockwell属于板状衬线体(Slab Serif),如下图所示。它的特点是衬线和字粗细相同,几何与单线设计呈现出现代、年轻的感觉,不似现代体(modern)的精细,适合复古潮牌。

16

所以字体的情绪其实是相对的,仅在衬线体内部,也有不同情绪的区分。

17

二. 无衬线体

无衬线体的特征和风格:

(1)完全抛弃装饰衬线,只剩下主干,造型简明有力,更具现代感

(2)适用于标题、广告,瞬间的识别性高

(3)笔画粗细对比小,视觉上看起来基本一致

(4)x高度较高

18

无衬线体也可以细致的分为四类:早期的无衬线体(Grotesk)、新无衬线体(Neo-Grotesk)、几何无衬线体(Geometric)、人文无衬线体(Humanist)。下文每类选择了一种代表字体来进行介绍,从新无衬线体(Neo-Grotesk)开始。

1. 新无衬线体(Neo-Grotesk):

代表字体是广为人知的Helvetica。用Helvetica作为logo用字体的品牌数不胜数。该字体诞生五十周年时曾有一部纪录片《Helvetica》客观的纪录了它的诞生背景、流行影响、以及各年龄层设计师对它的评价,相信很多设计师已经看过了。

19

20

“设计师的生活是战斗的生活,对抗丑陋的战斗。”——《Helvetica》马西莫.维涅里

21

先谈谈helvetica的优点

(1)中性

现代主义认为,字体本身只是传达信息的媒介,简明的字体可以让信息更快的传达,这比视觉表现、风格更重要。因此Helvetica在设计之初遵循这一设计理念,保持中性,正如那个比喻说的“字体应该像一个透明的容器一样”。由于它中性的特征,Helvetica既可以被运用到地铁导视系统,给人有一种现代、高效、清晰的感受,也可以被运用到AA这样的时尚品牌。因为中性,就有了更广阔的运用空间和更开放的解读方式。

22

23

24

(2)具有坚实的形式

在这里说「坚实的形式」而没有说「可读性佳」,是因为它的可读性是有挑战的,但Helvetica确实在字型设计上经过认真考量。在Helvetica之前,廣告、杂志上的字体充斥着浮夸花俏的手写体,Helvetica的出现就像一股清流,它去掉了多余设计,关注字体本身的结构,给设计界带来更优质的可选方案。

25

26

整体感受是简洁、清晰,没有手工感,非常冷静的字体。细节:

a. 切口齐平,笔画始终以水平或垂直收尾

b. 顶端平坦

c.  方形点

d.  据说Helvetica字母包围的面积和它的笔画所占的面积是一样的

e.  a的负空间呈水滴型

(3)与瑞士平面设计紧密相关

Helvetica的成功不是它一个字体能够完成的,是跟一系列的新无衬线体(Neo-Grotesk)的出现,以及与整个瑞士平面设计的融合,风靡全球分不开的。它们共同形成了一整套完整的理念:崇尚绝对的理性、客观、系统化。如我们所熟知的网格系统,就是推崇系统性、数学化的视觉体现。

27

28

瑞士平面设计的典型手法是以纯粹文字编排来做极简的传达。它在1960年后风行世界,是因为表现简洁、直接,并且在操作上容易标准化、系统化。当时的美国企业正在为全球化扩张寻求一种快速传播并且统一识别性的视觉解决方案,瑞士平面设计、Helvetica的出现加上各种大师的成功运用,把它们一起推向顶峰。

29

然而Helvetica并不是完美的,在这里归纳三个缺点:

(1)缺乏韵律。Helvetica的设计理念是一致、去个性,字母的整体造型都偏圆,因此缺乏阅读韵律,并且没有针对小字阅读优化,在优秀字体及细分领域都丰富的今天,Helvetica的优势减弱。

(2)中性也是一把双刃剑。冷静,客观的同时,也抹杀情感和活力,忽略了形式可能为读者带来的情感体验。

(3)滥用。可参考今天Flat design的泛滥,误用、滥用造成人们的审美疲劳。

30

如果你喜欢中性感的字体,又想修正Helvetica的可读性缺陷,可以尝试Univers,比Helvetica更加洗练的造型,并且字重齐全。

31

另两款新无衬线体(Neo-Grotesk),分别是Helvetica的前身和号称Helvetica killer的字体。

32

2. 几何无衬线体(Geometric):

代表字体是的Futura。所谓“几何”就是将字母归纳为圆、方、三角等几何形状的字体。

33

Futura受到包豪斯的影响,造型有设计感。笔划以垂直、水平的硬朗笔划为主。细节:

(1)顶角和底角非常锐利

(2)字母正圆处理

(3)升部降部偏长,优雅

34

iPhone的报刊杂志icon,「ART」三个字母使用的就是Futura。

35

Futura在德语中是「未来」的意思,因此它除了常见于有设计感的产品,如LV、Omega,也常用于「未来」题材。

36

37

在前面的图中可以看到Futura为了保持设计感,j、t省略了尾部,a、g使用单层结构,因此在可读性上有些问题,并不适于内文排版。并且它个性鲜明,有点“抢眼”。如果你喜欢几何无衬线的造型,但又想选择更温和、可读性强的字体,可以尝试Avenir。Avenir虽然同属几何无衬线体,但它在被设计时并不拘泥于几何形式,而是以视觉为准,显得人文、柔和,如a的尾部增加了一点点外翘的小细节。

38

3. 人文无衬线体(Humanist):

代表字体是Myriad。人文无衬线体具有更好的韵律感,气质开放、亲和,不呆板、不冰冷。下图通过与Helvetica的对比,可以直观感受到什么是「人文」特征。

39

(1) 人文无衬线体的x-height相对较小,使得字母之间的竖向变化更加清晰,整体更有韵律。

(2) 人文无衬线体的e、s等字母收尾采用半包围结构,更开放,不如Helvetica全包围的那么拘谨,显得亲和随意。

(3) 人文无衬线体线条柔美,不是Helvetica的工程感,更流线型,具有一定的手写味

40

41

42

案例:苹果的VI字体,用于宣传:广告、网站、产品铭文等。港铁地图的部分字体。

43

44

同属于人文无衬线体的字体还有:Frutiger、Segeo

45

46

通常会认为,衬线体代表古典正式,无衬线体代表现代亲和。那么无衬线体就不能表现优雅和古典吗?

47

答案是否定的。无衬线字体Optima融入了衬线基因,虽然没有衬线,但粗细变化相对明显,比划末端加粗,显得非常优雅有韵味。(在处理logo时如想要既优雅古典,又不显得老陈迂腐,可参考这种思路。)

48

无衬线字体的情绪轴。

49

50

51

 1.视觉平衡

52

(1)同样粗细的线条,由于视觉误差,水平的看起来要比垂直的更粗。因此在设计英文字母时,就应当充分考虑到视差。

53

(2)Futura是几何无衬线体,它的O看起来像是正圆,当我们和真正的正圆对比时,就会发现Futura的几何形状也是经过优化的,水平方向笔划微调修细。三个「圆」相比,Avenir虽然最不似正圆,但作为字母O却是看起来空间最舒服、最稳定的。

54

55

(3)这是是用圆弧和直线拼接起来的O,然而由于视差,却看起来有两侧内陷的错觉。因此在处理时,会讲两侧稍微向外隆起一点点,并微调水平方向的线条,就能把生硬不圆润的圆形变为视觉柔和的O字母了。

56

57

(4)X的造型原来不是斜线直接相交的结果,而是把斜线稍微错开,才能看起来像是相连的状态。并且为了避免四条斜线相交造成中间黑色部分太密集,中心位置的笔划略调细了一些。

58

(5)虽然无衬线体的比划粗细基本一致,但实际还是有着细微的差距。从正面看到的A(左侧图)非常正常,然而当A被水平翻转后(右侧图),立刻就有了略怪异和不稳的感受。A的右侧比左侧笔划粗,是受到历史上平笔书写以及衬线体延续下来的习惯的影响。翻墙看视频《罗马体大写字母使怎么形成的?》

59(6)绘制图标时我们都有经验,由于图标外形轮廓和内部复杂程度的不同,视觉体量感是不同的,不能完全依照尺寸大小而要根据视觉感受来判断。字体设计有共通之处。同样字号的文字,圆形O和三角形的A要高于参考线。在做LOGO时可以留心这点,参考案例NIVEA。

60

61

62

2. 负空间

63

64

负空间指的是字母内部的空间,以及字母与字母之间的空间。在字体设计过程中,设计师不仅要设计字母的笔划结构,更重要的要考虑负空间的设计,使之平衡和协调。引用字体大师马西莫的一句话:“我们通常认为,字体排印就是黑色与白色。而排印实际上是白的,而不是黑的。因为字体是由形体之间的空间来定义的。这有点像音乐,音乐不是由音符,而是由音符之间的停顿来定义的”。据说英文字体设计师对负空间关系的斟酌时间可能占整体字体设计内容的1/3左右。

(1)单个字母内部的空间: “B”上下两个内部空间,必须上面小于下面,如果上下相同,那上面的视觉上看起来会更大,字母就会重心不稳。类似的字母还有S。

65

(2)各字母间的相互平衡:字母之间也要取得负空间视觉上的一致。

66

(3)字与字之间的间距:调整字母与字母之间的空间,追求视觉上分布匀称,而非数值上的均匀,以达到一种视觉的节奏感和平衡感。比如字体中的I和小写l之间距离应该大些,因为两根竖线之间的空间是最小的; V、Y 和其他的字母相邻时间距应该缩小,因为倾斜笔划所产生的空间比较大。

67

68

1. 信息该被如何设计

69

与其说我们在学习字体设计与排印,不如说我们借由字体思考“信息该如何设计”这个问题。

在这个问题上“字体设计”至少为我们提供了两条可参考的路。

(1)形式追随功能

英文的字体一向就是“形式追随功能”的设计典范。有什么功能、在什么场景、要解决什么问题,就有怎样的字体产生与之相适应,甚至细分非常清楚。历史上,有为报纸设计的Times;有为电话本黄页设计的Bell Centennial,应对文字极小且印刷纸张、油墨极差的恶劣环境;还有我们熟悉的专为显示屏设计的Georgia、Verdana,解决低分辨率的问题。

1913年,伦敦地铁的主管Frank Pick曾为当时的地铁企业形象和字体设计提出这样的要求:“这种字体必须准确地反映我们所处的时代,能让乘客快速无误的阅读。字母就算被用作单一符号(没有上下文环境),也必须能清楚辨认。而且,这种字体要有系统性,必须要能与周围的广告文案等无关系统的信息清楚的区分。”这些要求都明确了设计的功能性目标:高度的准确性、可识别性,极端情况下都能保证清晰识别等。

以下是为法国戴高乐机场设计的Frutiger字体,由于其字碗大、开口大,并且字的粗细适中的特点,使得文字在光晕的干扰下也能保持相对清晰不黏糊。

70

71

(2)透明的容器

现代主义的理念认为,优秀的字体像一个“透明的容器”,字体仅起到承载的作用,重要的是信息的传达。

另一个来自大师Frutiger的有趣比喻是,“喝完汤后如果你还能记住汤匙形状的话,这只汤匙的设计就是失败的。”比喻略极端,其实信息和设计并不互斥,二者完全融入,浑然一体,才是完美的搭配。设计可以作为空气一样的存在,不可或缺,但用户不会明显感知到它。

2. 技术与设计的关系

72

设计过Georgia、Tahoma、Verdana、Meiryo等著名的字体的大师马修·卡特,在TED上做了演讲——My Life in typefaces。看后令人非常感动,能够深深感受到一个设计师对自我的要求以及专业精神。

字体设计实际与技术的关联非常紧密。书写工具、纸张、书籍、电子屏幕、网络,每一次媒介和印刷技术的革新,都改变着字体的呈现,也影响着设计师的理念和方法。然而在那个技术革新的年代,设计者并未回避技术,而想要被未知的想法所影响,想回应未知,想推进自己探索未知的世界。在探索技术与设计的过程中,必然有矛盾和疑惑:为缓解技术问题而做的设计是否会因为技术的更迭而彻底消失?因技术而『不完美』的设计是否因此而缺乏价值?

马修的设计做出了回应:字体的价值取决于它在应用场景下能否有效工作,字体的品质决定了它能否独立于技术存在。马修在演讲中说:“所有设计师的工作都有局限性,设计不是艺术。问题是,局限性是否会导致妥协呢?是否会降低设计的品质呢?局限性和妥协之间有着非常微妙的区别,但这区别却是我工作态度的核心。”

73

3. 设计趋势与轮回

74

(1)世界正在变得更加柔软

可能经历两次工业革命、两次世界大战的激烈后,大家都缓和多了。从政府公关,到企业管理,再到个人生活趣味,都逐渐人性化。举大旗喊口号的宣传方式不再那么有效,甚至会引起人心反弹。再也不是只要音量大就有人听的时代了。

上图两个LOGO的改版,不管是字体,还是图形造型,还是颜色都愈发柔和了。从LOGO上看,American Airline的形象仿佛从过去「我们是专业的航空领域专家」的严肃转换到了「我们提供舒适愉快旅途」的亲民。

75

76

77

(2)传统复兴

Gotham的设计师Frere-Jones对于机械技术的到来,传统手工制牌的终结十分惋惜。他的灵感取材于纽约1930到40年的旧建筑牌、商店招牌、店面广告,认为这些由当年美国普通民众手画的文字代表了纽约的「直率、诚恳、坚韧,富有个性」。因此Gotham字体既让美国人民感到熟悉,又具备新字体的现代感,既拥有可信任的稳重造型,又非常朴素亲切。这款字体在奥巴马竞选后,成为大热的字体。网站Squarespace,特斯拉都使用了Gotham。

历史上很多代的艺术家、设计师都会经历对当下社会的不满,对古典经典推崇,追求复兴传统,例如文艺复新、手工艺运动等。然而与字体设计一样,这些领域在不断轮回的同时,也在不断往其中注入新鲜活力,从而螺旋式的上升与发展。

78

79

80

最后:

看回我们的UI设计,Windows Phone网格、瓷片的设计,既是对瑞士平面设计的回溯,同时也开启了新的扁平化时代,遵循「简约现代、去除装饰、内容为核心」。然而过度的极简却造成了单一无趣的印象,且容易流于形式。此后,iOS7用细细优雅的线条,更柔和的图形方式,柔和地解决Flat design的情感、差异化问题。再到Google的新设计,不管是充满人情味和细节的插图,还是Geek精神的有趣插画,都能更多的感受到个性和细节。拟物是否也在以另一种插画的形式复兴呢?

81

82

83

84

参考书籍: 

《西文字体》 (日) 小林章

《字型之不思議》 (日) 小林章

《新概念字体基础&应用》苏克

《文字设计的原理》(日)伊达千代

《字体设计数问:知乎许瀚文自选集》

参考文章:

《文字設計的指導原則》http://invisibledesigns.org/typography-principles/

《Helvetica 字体为什么如此受欢迎?》http://www.zhihu.com/question/20707495

《人文字体为什么人文》http://www.zhihu.com/question/20769417

《字体的发展与国家形象》http://www.typeisbeautiful.com/2009/10/1536/

《为了信息传达的更加有效/交通专用字体》http://www.typeisbeautiful.com/2010/01/1981/

《最时尚的英文字体:现代样式》http://blog.justfont.com/2012/12/%E6%9C%80%E6%99%82%E5%B0%9A%E7%9A%84%E8%8B%B1%E6%96%87%E5%AD%97%E9%AB%94%EF%BC%9A%E7%8F%BE%E4%BB%A3%E6%A8%A3%E5%BC%8F/

(本文出自腾讯CDC博客: http://cdc.tencent.com/?p=8565)

2015-2016交互体验趋势

980x214

移动产品篇:

2015年移动应用数量增长依然强劲,但是移动交互体验却在发生着变化。较之去年层出不穷的新颖形式,今年交互体验趋势中,更多的是某一个方面的体验优化与深耕,而较少有创造性的引领者出现。这说明移动应用在市场在“爆发”后进入了一个新的阶段。这与智能机市场趋于饱和、手机屏幕尺寸增长与用户对应用的认知提升有着密不可分的关联。

 

今年MUX设计师们依然从体验角度出发,结合现有的报告和资料,寻找那些已经崭露头角,并且会在今年形成一定规模的交互体验趋势。与去年不同的是,我们同时给出了这些趋势的应用场景,希望对移动体验设计师有所帮助。

 

1.多媒体搜索实用化(Extensive Usage of Multimedia Search )

随着技术的不断突破,搜索的输入方式不在仅仅局限于文本搜索,多媒体搜索在搜索结果质量以及精准度上了有了明显的进步,创造了从娱乐向实用的过渡。在很多移动场景下,多媒体搜索较文本搜索有着不可替代的优势。通过《百度移动趋势报告2015》研究发现,移动互联网下一代主力军(零零后)对多媒体搜索的接受度更高。另外数据流量方面,4G增长迅猛也给多媒体搜索实用化提供了必要条件。

1.Camfind可以通过拍照物体进行搜索,准确的识别出搜索对象的颜色,质地,以及属性。并提供相关图片与相关搜索结果。

1-1

  1. Google的语音识别已经成为其搜索的主要形式之一,在很多私人场景中的应用较高,并且其语音转化成文本的精准度也有了很大的提升。

 

1-2

应用场景:文本输入成本过高,没有能力文本输入,或无法用文本描述搜索对象的场景 。

 

2.场景化前置,服务触达增强(More Entries Proposed Contextually)

根据TalkingData发布的《2014移动互联网数据报告》中的数据,全国平均每部移动设备上安装34款应用,平均打开20款。大量应用带来的竞争,促使更多应用希望通过入口前置,提高使用频率,增强易用性。但是在入口前置的方式中,只有部分提高了便捷性,更多的只是增加了用户的使用负担与负面情绪。而适合场景的前置则会显得尤为贴心,减少用户干扰,增强产品粘性与人文关怀。

 

1.网云音乐将“上一首”、“收藏”、“删除” 等快捷功能都前置到了锁屏界面。为那些想快速操作的用户带来极大的便利。同时这些功能也可以收起至“菜单”,可谓是非常的贴心的设计。高德地图将手机导航界面前置到了锁屏,解决了走路用手机导航时需要频繁解锁的不便。

2-1

  1. ios系统的锁屏界面,会根据用户的地理位置以及周边信息推荐可能需要的应用,例如用户在招商银行附近打开锁屏界面,屏幕右下角会出现招商银行应用的快捷入口。

2-2

​应用场景:使用场景明确,需要频繁操作的应用。可在锁屏界面、通知栏等位置加入场景化前置。

3.操作极致简化,核心效率提升(Minimalism of Interaction)

互联网终端多样化,使用场景复杂化,使得用户的操作越来越碎片,而且缺乏耐心。去繁就简,缩短流程成为了不可避免的趋势。与此同时,用户对主流的交互方式的认知程度有了增强,对常规的交互流程的信任度也有了较大提高,一些两年前看似激进的简化方式,现在并不会给用户带来过多的认知成本。

 

1、Blink将多媒体社交的过程极度简化,进行图片内容社交时,将”选择发送对象”,“创作发送内容”,以及“发送”三个动作,均由“点击联系人”一个触发事件完成。进行视频社交时,只需长按联系人,之后后松手即可完成整个过程。

3-1

2.Chrome将窗口的“关闭”、“新建”融入到了“刷新“动作中,一个下拉动作的变形包含三种操作形式。避开了在多窗口中进出的繁琐流程。

3-2

应用场景:操作步骤多且操作频繁的流程简化。如多媒体社交、支付等。

 

4.信息结构轻量化,减少负担(Lightweight of Information Structure)

大屏空间下内容承载更为复杂。在直观的扁平化视觉设计的背后,信息结构扁平化更为重要。出现了信息结构的轻量、清晰化趋势。轻盈的信息结构不仅可以强化内容本身,还能够减少用户对信息结构和逻辑的理解成本,缩短用户到达信息的距离。

 

1.百度手机助手在浏览应用详情的核心、高频路径中,通过半层弹层模式为整体框架和浏览行为“减负”,尽量避免了页面级的跳转,同时降低了用户浏览行为的负担感,使操作体验更加轻盈自然。

4-1

 

2.UniqDay做为 “小而美”的功能型应用,在产品设计之初会更多考虑到用户的学习成本和接受度。UniqDay就是通过轻量化的结构设计让用户在第一次使用的时候就记住它。对于倒数日的添加、编辑设计,UniqDay都巧妙的通过弹层或平移方式帮助用户理解当前所处的位置,使核心模块稳定在用户的视线内,减少页面级的跳转。

4-2

 

3.emo突破了传统的框架布局,极端强化了核心功能。这种沉浸式体验设计是结构轻量化、扁平化极端的表现,使得用户更专注于根据心情听歌的功能与呈现内容本身,而不被其他的操作路径打断。

4-3

 

应用场景:为信息层级较多、页面跳转较多的应用减负,或着功能较简单的垂类应用。

 

5.动效表现更具功能指向性,跨越成本收益鸿沟

(More Functional and Directive Motion Effects)

2014年底Android5.0 Lollipop、iOS8两大移动终端系统的发布,流畅的动效逐渐成为一个应用或系统中的“标配”。目前动效的使用出现了对于设计与情感的过度消费。需要让其发挥更多指向性和功能性的作用。通过指向性、提示性等动效自然映射抽象语言,更加直观的体现出界面、信息之间的层级和逻辑关系,让应用更加简单易懂,简化用户引导流程,降低用户学习成本,甚至带给用户惊喜。

1.Android5.0 Lollipop系统依赖于Material design设计语言对卡片化设计的定义,做出了教科书般的量子动效设计案例。系统上使用大量拟物化,指向性明确动效来引导用户,体现页面层级逻辑。

5-1

2.Yep!采用流畅的位移和变形动效,让用户理解搜索流程(选择一个活动-发送邀请-等待想做相同事情的其他用户匹配-搜索结果)的交互机制,使流程更平滑,更具自解释性。

5-2

 

应用场景:该趋势将普遍适用于应用的场景转换、提示,以及复杂信息层级表现

 

 

6.HTML5互动内容广泛应用,持续丰富产品表现

(Interactive Content Based on HTML5 Could Widespread Use)

2014年10月W3C宣布HTML5定稿。HTML5技术的发展引发了互动形式的创新:可以看到包括摇一摇、3D视图等形态的广泛使用。同时,可以看到2014年主打故事类场景、产品情怀等HTML5的设计,集中引爆移动互联网传播,并将在未来带来持续的浪潮。

 

1、大众点评的《我们之间就一个字》,主打文字方式的阅读表现。以差异化的音效、动效营造出不同的故事场景氛围,利用文字巧妙勾勒出不同主题的文字故事,通篇无人物角色却处处引发用户自身联想,多维度的促使用户产生情感共鸣。

6-1

2.《梦幻水晶球的世界》,细腻视觉画面呈现给用户一个美妙的视觉故事场景。而3D视图旋转等动效让用户可以将视角拉近看细节或推远看全局,像语言故事一样展开故事脉络,引发用户好奇心并吸引用户参与。

6-2

应用场景:强调品牌影响力的运营活动,适合情感化设计。

 

7.卡片化在多终端持续发挥优势,成就经典设计模型

(Continuously Advantage of Card Design)

卡片化内容呈现打破了原有的模式:内容至上,去除一切干扰。是目前应用比较广泛的以一种设计模式。在用户需要浏览大量信息的场景下,提高了内容的呈现效率。同时卡片化在多平台网站设计,以及多种屏幕尺寸适配方面依然具有非常明显的优势。

 

1.手机app的内容展现就采用了卡片化的形式,在信息展现上非常突出,同时针对不同尺寸的设备界面展现效果都很赞。

7-1

2. 在最新发布的apple watch应用中,卡片化的设计应用也很频繁。在下面这个手机百度的界面中,卡片化的设计能够把团购的重要信息一览无遗的展现出来。手机百度中地理位置服务也采用了卡片化的设计,保证不同的卡片组合及内容展现均能突出服务内容。。

7-2

应用场景:需要展现较大量信息的应用,跨平台应用等

 

8.大屏操作优化普及,塑造高效体验(Refine For Big Screens)

 

现如今,大屏手机已经随处可见。更大的屏幕可以展现更多的内容,优势不可比拟。根据《IDC世界智能设备跟踪报告》分析,大屏设备市场份额会持续上升。用户也越来越以开放的心态接受大屏手机。

屏幕越来越大,我们的手则不然。对于4英寸以上的大屏手机,用户的操作体验并不尽如人意。由于屏幕过大带来的操作不便利亟待解决,“为大屏设计”应运而生。通过优化界面结构,增加手势操作,以及适配单手操作布局,可以帮助用户解放双手,在大屏下更加自由便捷的进行操作。

 

1.重点功能底部聚焦:

根据情况将“功能”或“导航”等原本在顶部导航栏的按钮下移到界面底部,确保用户在单手操作时可以在易于操控的区域内,缩短操作路径,降低点击成本。轻单、KEEP、MONO等内容类的应用将主要功能按键设计在屏幕底端,不仅提升了操作的可触达性,同时突出了内容,改善了阅读浏览体验。

8-1

 

2.更多手势操作,滑动代替点击:

以iOS用户为例,常规返回按键多设定在屏幕左上角,对于大屏用户来说是不易触及的点击盲区。而Storehouse配合手势操作辅助,右滑退出界面,带来了极大便利性,滑动代替点击退出的用户习惯也逐步养成。PEEK是一个以手势为主导的应用,通过手势变化进行相应操作,大胆的舍弃了功能按键。

8-2

 

3.单手模式,缩小操作区域:

由于单手操作需求的普遍性,无论是客户端产品还是系统平台都做出了相应适应单手操作的解决方案。用户在特定场景下通过简易触发方式进入单手模式,缩小操控范围,将其控制在页面中下部手指易于触及的区域。iOS系统双击Home键以及锤子手机的下拉悬停,都是在系统层级的交互解决方案。产品层级中,百度输入法创新设计了可自主调节位置和大小的输入面板,得到了很好的用户反馈。

8-3

应用场景:平台类、工具类等,需要单手操作频率较高的应用

 

9.情感化权限请求,转化能力陡升(Prepositive Emotional Request)

 

部分iOS应用在初次使用过程中,会因为功能服务依赖,向用户请求调用系统功能的权限,如获取地理位置、访问相机等。请求方式通常为对话框询问,直接但唐突。通常用户应对这一场景做出的拒绝行为,导致关联功能服务的体验损失,进而会导致流水用户。而在新手引导中强调权限请求的“前置化”则会有效解决这一问题。通过情感化手段传递服务价值,使得用户理解调用的目的,会有效提升用户信任感进而提高授权转化率。

 

1. Looksery产品在调用iOS系统相机请求之前,通过情感化图标和询问式语言,向用户传达了调起相机的作用,让用户了解调用目的,使授权转化率得到很大的提高。

9-1

 

2.Gogobot产品在获取用户地理位置之前,描述对应使用场景及其必要性,满足用户对开放此权限的心理预期,提升授权转化率。

9-2

应用场景:适用于需要请求系统权限的应用,尤其是对其强依赖的应用

 

总体来讲,移动应用体验在未来的一年内,会在各自的领域细化与深耕,将体验向更加极致的方向推进。同时,屏幕尺寸、用户认知积累,以及产品市场的变化,给用户体验提升提供了更加有利的条件。这些变化希望能够被设计师们掌握利用,创造更优秀的体验。

 

 

泛体验篇:

泛体验包含了可穿戴设备、智能家居、虚拟现实、车联网等智能产品带来的新的用户体验。在近两年间这些新兴领域进行了快速的市场试验,虽然竞争惨烈,但其中很多优秀的产品和服务依然会脱颖而出,带给用户出色的体验。而随着今年新兴产品的数量增多,以及互联网巨头的纷纷入局,我们发现好的体验更多的是需要融合硬件、软件以及服务,对整体体验的要求会更高。

mux设计师们结合了部分项目经验,挖掘那些相对于传统交互形式更具有优势,且具备一定市场前景的体验趋势。希望这些趋势能够带给设计师更多启发,突破局限。对未来的体验设计有更多的延伸思考。

 

1.支付手段的交互多样化(The Diversification of Means of Payment)

伴随市场需求与技术进步,更多的支付手段被人们所创造,以适应更复杂的线下消费场景,并推动消费体验的改善。在移动设备领域,Apple Pay与Android Pay逐步商用。更多超出预期产品同期面世。

1.虹膜支付。用户只需在支付中看一眼手机就可以支付鉴权,完成整个支付环节。虹膜支付的安全性和准确性远远强于指纹、脸部识别。英特率先提供了具有支付功能的虹膜手机EyeSmart。

1-1
2.百度钱包联合国内公交系统利用NFC、蓝牙等技术向用户推出手机公交卡充值业务,用户只需将公交一卡通置于带有NFC或蓝牙功能的手机上即可轻松完成充值。另外还能读取用户的卡内余额、交易记录等信息,免去了用户线下排队的烦恼。

1-2

应用场景:支付、理财类产品,有线下业务的O2O产品,可以利用现有技术打通支付制造消费体验闭环。

 

2.操作交互更加细腻(Delicate Interaction)

iPhone上市之初,当大家都在吐槽触屏手机在操作上如何反人类、如何高门槛的时候,没人会想到触控屏幕会像现在这样普及。而当触控操作最基本的点按、拖动等操作已经成为大众的习惯操作后,新的触控技术也进入了量产产品中,带来新的体验。

1.2014年9月发布的Apple Watch,增加了全新的压力感应屏幕。将“点击”这个动作增加了一个维度:可以识别“重击”和“轻击”的区别。如果这种创新的操作能够成功,会将交互动作体系向前迈进一大步。

2-1

2.同样,新的MacBook笔记本电脑加入的Force Touch触控板,可以感知用户指尖的压力,通过不同按压力度实现不同的操作。不但如此,触控板还能够提供不同的触觉反馈。这样新颖交互体验为软件操作体验带来更多想象空间。

2-2

 

应用:支持触控操作的软件或硬件设备,可通细腻操作差别,进行不同体验设计。

3.AR、VR的深度应用(Deep Application of AR & VR)

随着AR(增强现实)和VR(虚拟现实)技术的逐渐成熟,交互体验的将迎来新一轮革命性的改变。从单纯的基础体验到如今深度的沉浸感知。AR(增强现实)与VR(虚拟现实)不断为使用者诠释着未来互动体验的多元化。

对于使用者AR(增强现实)倾向于真实与虚拟世界相结合来服务感知体验。VR(虚拟现实)的特点更倾向于营造出完整的虚拟世界。而就使用场景来讲AR(增强现实)相对于VR(虚拟现实)有着更为灵活、广泛以及可拓展的优势。但两者却保持着独具的体验与行为特点。

1.如今微软hololens全息眼镜应用AR技术,通过语音、手势等感知行为传达给用户展示完整的操作体验与沉浸感。这意味着使用者可以通过终端与外界进行全新的交互行为,为人们日常生活提更为丰富时信息展示与操作。

3-1

2.使用者对产品优质体验的高要求也将强化沉浸式体验的深度升级。Oculus VR(虚拟现实)设备有着惊艳的细节体验处理,为用户呈现更丰富的畅快感,将使用者在游戏中的感官体验真实化、场景化、丰富化。

3-2

应用场景:游戏娱乐虚拟试穿、虚拟家居等广泛场景

 

 

4.无缝的跨平台任务及操作(Continuous Task On Different Platforms)

笔记本,平板电脑,手机,智能手表等等,这些设备切割着我们一天的时间。我们在这些设备上安装着相同的应用,为了可以随时开始我们的工作。跨平台产品通过使用同一账号,便捷的跨终端使用相同功能,在不同的系统和设备间无缝操作同一个事件,保证任务的连续性。

1.苹果handoff:正在iPhone上编写电子邮件,此时走到Mac前,电子邮件已经在Mac上准备就绪,可以从中断的地方继续写。它适用于邮件,Safari,地图,信息,提醒事项,日历,通讯录,备忘录,keynote等。实现了Mac,iPhone,iPad的无缝衔接。

4-1

2.从google搜索网页端给手机(安卓)设定闹钟(目前仅限美国):在网页端搜索框输入“set an alarm”或“set an alarm for 11:00”,发送到选定设备。设定好的闹钟将直接出现在状态栏里,实现从网页到手机的任务传递。

4-2

应用场景:需要多终端即时同步,信息实时更新的效率类产品,以及即时通讯等产品

 

5.Apple Watch应用爆发(Outbreak of Apple Watch Applications)

Apple Watch作为智能手表的代表定义了很多新的体验。它更偏向管家角色,无声的反馈和提醒、健康监测,全新的交互操作,更多的语音互动等等。而与之匹配的应用也有3500余款,可分为“事务管理”、“健康生活”、“轻松游戏”三大类别。 这些应用将会有新的体验,而不会是简单的移植手机端。

 

1.事务管理类:在使用Apple watch版magic应用时,用户只需要点开手表上的应用图标,语音告知需求,这个需求就会被训练有素的各个领域的员工认领,并帮助用户执行。

5-1

 

 

2.健康生活类: Helthkit 通过光电测量法监测流经用户手腕的血液周期变化。再把这些光信号转化成电信号,这样Apple Watch就可以计算出用户的心率数据。

5-2

 

3.轻松游戏类:Apple watch是以展示信息为主,游戏主程序还是在iphone端运行。由于它的精简的信息提示、一键式交互等特点。消除游戏、问答型游戏、卡片类游戏和虚拟宠物养成等类型更加适合。

5-3

应用场景:原有IOS应用在iwatch端的扩展,以及为iwatch量身定做的应用

 

 

6.无人机应用更加广泛(Pervasive Application of UAV )

无人机硬件成本逐渐下降,飞控系统开源,民用和商用技术的逐渐成熟,无人机在民用和商用领域迎来增长。用途包括:航拍、小件物流、空中WIFI热点、安全监测、农田管理、环境监测、搜索救援等等。在降低成本的同时,无人机让服务我们可以享受更好的体验。

1.Matternet与无国界医生组织合作,将诊断结果和药品利用无人机进行运送。目前已准备好商业版的四轴无人机Matternet One。它可以提供一般货物(尤其是午餐和医药)的物流快递服务,能够搭载2.2磅重的货物飞行超过12英里。也可以在雨天和大风天气中飞行。

6-1

2大疆创新在纽约、伦敦和慕尼黑同时发布了大疆Phantom 3系列四轴无人机。可进行高清视频录像,可实现精准悬停和稳定飞行。用户可以在APP上实时查看拍摄内容,进行编辑和分享。

6-2

应场景用:数据监测,航拍,物流,空中WIFI等

7.更加趋于本能的手势交互(Gesture Interaction)

新产品的诞生往往伴随着不同以往的人机互动,从个人电脑点按鼠标的操作,到智能手机手指直接触摸屏幕操作,人们一直在追求更加趋近于人类本能的人机交互方式。但无论是键盘和鼠标或者是触摸操控,传统的操作方式本质上都在将我们的想法通过媒介间接的传达指令。

近几年随着可穿戴设备的兴起,虚拟现实技术的完善。比如挥动下手臂可以移动电脑里的文件,使用一个特殊的手势完成支付,这些人与机器的互动将更加直接并趋于本能。减少媒介的比重。

1.手表是贴近人体的“无感”设备,因此天然具备充当个人与虚拟世界交互入口的潜质。每当用户抬起手腕的时候,Apple Watch能够自动呈现相关信息提醒和个人健康数据,当有电话打来,Apple Watch不用触摸,摆动下手腕,即可接听电话。

7-1

2.Oculus 原本是一款为电子游戏设计的头戴式显示器,目前已经开始运用到建筑设计、教育和医疗等各个领域。它提供的虚拟现实体验使得用户戴上后几乎没有“屏幕”这个概念,用户看到的将会是整个世界。在这个世界里,你将体验到和生活中一样操作。

7-2

总结一下,在2015年,智能设备的泛体验领域经过了一年的摸索将会逐渐成熟且加速发展。加之行业中对产品整体体验的认知逐渐增强,体验设计的重要性与工作范围将会有较大提升。设计师解决问题的方式可以更加多元,希望这些泛体验的趋势能够给体验设计带来新的契机。

 

 

 

分类: 设计用户体验 标签:

[推荐] 百度 MUX2015招聘全面展开

2015job-980

job-ui

工作职责:

1. 负责参与产品(网页、手持方向)的前期视觉用户研究、设计流行趋势分析,主导设定产品的整体视觉风格,拆分设计工作量,时间安排;并跟进开发落地产品
2. 负责日常的运营活动及功能维护提供美术支持,并能够形成产品独特的具有传播力的运营设计风格。
3. 负责参与设计体验、流程的制定和规范 4. 负责分享设计经验、推动提高团队的设计能力

职位要求:

1. 本科及以上学历,美术、设计或相关专业本科以上学历
2. 从事设计行业工作3年以上,对工具型网站的设计有丰富经验,有成功案例案例者优先
3. 具有深厚的设计理论与娴熟的设计技巧,善于捕捉流行趋势,并能推动团队的设计能力
4. 热爱设计,拥有宽广的行业视野与时尚的审美标准(对平面设计、界面设计、网页设计、图标设计、符号设计、品牌设计、手持界面设计等都有了解甚至熟知)
5. 精通Photoshop、Illustartor、Flash等设计工具,了解flash(Actionscript)动画设计的优先
6. 具备良好合作态度及团队精神,并富有工作激情、创新欲望和责任感,能承受高强度的工作压力

投递简历须附上近期作品或链接 发邮件至:(邮件标题请注明“应聘视觉设计师”,附件在6M以内)

 

job-ue

工作职责:

1. 负责百度移动云事业部相关产品的交互设计工作
2. 参与到产品的规划和创意过程中,分析业务需求,并加以归纳、分解出交互需求
3. 设计产品的人机交互界面结构、用户操作流程等,完成界面的信息架构、流程设计和原型设计,提高产品的易用性
4. 编写界面交互设计说明书及交互设计标准规范和交互元件库,并对标准规范及元件库进行维护
5. 配合视觉设计师完成产品视觉设计,并协同前端及开发团队实现交互效果
6. 组织或参与用户访谈,配合用研人员进行可用性测试
7. 研究用户行为和使用场景,优化现有产品的设计缺陷并提出优化解决方案
8. 参与竞品研究,用户反馈和数据分析,进行产品可用性和易用性测试和评估
9. 分享设计经验,沉淀设计方法,总结设计思想,与团队共成长

职位要求:

1. 对行业内产品和应用有深入体验经验和理解、见解,对行业内产品和应用保持高度热情
2. 熟悉UED方法和工作流程;对交互设计有较深的理解和实践,可以独立完成整个设计过程(对流程图、线框图等到交互设计方法能熟练应用)
3. 能够独立负责多个产品或整个产品线,在产品规划、策略等方面有效推动交互设计思路
4. 能够积极参与研究过程,能够将调研结论有效转化为交互设计方案,发现并提出交互设计中的调研需求
5. 对产品有整体规划和梳理产品信息架构的能力,善于梳理各种因素之间的关系
6. 了解手机等移动客户端的交互设计和表现方法 7. 熟悉研究方法论,熟悉一般研究步骤,了解各种研究方法,有一定的统计和数据分析基础
8. 有1年以上交互设计经验,工业设计、计算机、心理学、平面设计、广告设计等相关专业,本科以上学历
9. 熟练掌握专业的设计和原型开发工具,如Photoshop,Illustrator,Axure,Visio等

投递简历须附上近期作品或链接 发邮件至:(邮件标题请注明“应聘交互设计师”,附件在6M以内)

 

Act-job

工作职责:

1. 负责百度移动事业部相关产品的交互设计工作
2. 参与到产品的规划和创意过程中,分析业务需求,并加以归纳、分解出交互需求
3. 设计产品的人机交互界面结构、用户操作流程等,完成界面的信息架构、流程设计和原型设计,提高产品的易用性
4. 编写界面交互设计说明书及交互设计标准规范和交互元件库,并对标准规范及元件库进行维护
5. 配合视觉设计师完成产品视觉设计,并协同前端及开发团队实现交互效果
6. 组织或参与用户访谈,配合用研人员进行可用性测试
7. 研究用户行为和使用场景,优化现有产品的设计缺陷并提出优化解决方案
8. 参与竞品研究,用户反馈和数据分析,进行产品可用性和易用性测试和评估
9. 分享设计经验,沉淀设计方法,总结设计思想,与团队共成长

职位要求:

1. 对行业内产品和应用有深入体验经验和理解、见解,对行业内产品和应用保持高度热情
2. 熟悉UED方法和工作流程;对交互设计有较深的理解和实践,可以独立完成整个设计过程(对流程图、线框图等到交互设计方法能熟练应用)
3. 能够独立负责多个产品或整个产品线,在产品规划、策略等方面有效推动交互设计思路
4. 能够积极参与研究过程,能够将调研结论有效转化为交互设计方案,发现并提出交互设计中的调研需求
5. 对产品有整体规划和梳理产品信息架构的能力,善于梳理各种因素之间的关系
6. 了解手机等移动客户端的交互设计和表现方法 7. 熟悉研究方法论,熟悉一般研究步骤,了解各种研究方法,有一定的统计和数据分析基础
8. 有1年以上交互设计经验,工业设计、计算机、心理学、平面设计、广告设计等相关专业,本科以上学历
9. 熟练掌握专业的设计和原型开发工具,如Photoshop,Illustrator,Axure,Visio等

投递简历须附上近期作品或链接 发邮件至:(邮件标题请注明“应聘交互设计师”,附件在6M以内)

 

分类: 设计用户体验 标签: ,

普通用户怎么看春节红包?——指尖上的春节之态度篇

2015年春节期间各大平台不吝重金为用户提供了丰富多彩的红包玩法,大家也抢的不亦乐乎。普通红包活动参与者如是说,那么普通红包活动参与者对各平台的评价如何,对于手机红包活动又是持什么态度呢,我们通过网络问卷调研了5897位参与过春节红包活动的用户,来听听红包活动参与者的声音吧~

1、从用户抢红包的平台来看,微信、支付宝优势明显,手机QQ紧随其后。

1

2、用户在手机上收发红包主要还是觉得气氛好,图个热闹好玩,可见趣味性是很重要的因素;当然,能抢到实实在在的钱,图个吉利也是吸引用户抢红包的重要方面,让用户感受到诚意也能打动人心。

2

3

3、接下来我们就来看一下用户对各平台在是否便捷、是否有趣味、是否有诚意方面的评价,针对至少同时使用过微信、支付宝、手机QQ三个平台抢红包的用户进行分析(这部分用户占抢红包总体用户的比例为25.6%),微信在便捷程度及是否有诚意方面得到了较多用户的认可,而支付宝在趣味性方面深得用户心。手机QQ在三个评价维度上都没有突出表现,要继续加油了。

4

4、大家都从哪里抢红包呢?各家主推的抢红包活动都是用户抢红包的重头,除此以外微信和手机QQ均发挥了很好的社交属性,用户能方便的抢到来自朋友,同学,家人亲戚的红包,这当中微信做的最好,如果新年想抢更多公司领导,或家人亲戚的红包,那就赶紧用微信吧;而相对社交属性较差的支付宝则通过砸钱方式吸引用户。

5

6

7

5、参与过微信红包活动的用户中,有七成用户表示参与了春晚摇一摇活动,但没有摇到的比例较高,满怀信心却没能摇到红包会让用户感到受挫,可以在体验上有进一步的提升。

8

6、抢到的红包,主要的应用场景是提现、充话费、网购,18岁及以下小朋友则更喜欢把钱用于买道具或Q币,没想好怎么用的也占据了25%的比例,可以为这部分低龄用户提供更适用于他们的消费途径。

9

7、总体上逾六成用户开始都知道抢到的红包是现金,但近三成的18岁及以下用户却当作抢着玩的游戏,并不知道是真钱。针对低龄用户的教育可以进一步加强,货真价实的钱会让用户对抢红包有更大热情。

10

8、红包活动对微信和手机QQ绑卡有明显促进作用,但对支付宝用户绑卡的影响较小。

11

9、大多数用户表示收发红包并不会对自己与身边亲人沟通产生影响;红包只是娱乐消遣,亲情才最重要。

12

注:以上数据源自腾讯问卷系统 http://ur.qq.com

(本文出自腾讯CDC博客: http://cdc.tencent.com/?p=8373)

无觅相关文章插件,快速提升流量