0文章
0评论
0获赞

体验设计师面试分析指南

707 0

为什么设计师没有面试成功呢?

在求职道路上,每一个设计师都会困惑,因为求职不仅是一个力气活也是一个脑力活,不同的面试官都有不同的喜好,可能获得了A面试官的认可,却被B面试官否定了。不同的公司对于职位的要求也不尽相同,甚至是相差很多,有些公司要求设计师不仅可以撸的了设计图,还能把玩ppt,不仅能做得了海报图,还能做得了交互动画等等。任何公司的职位要求都没有对错,因为公司职位定位是和自己的战略定位相关的。

那是不是我能撸图、把玩ppt、设计海报,做交互动画就行了。不好意思,还是不行,随着工作时间的增长,设计师不仅要具备专业技能,更重要的是提升思维。技能可以学习,但思维方式需要领悟和沉淀,思维方式的提升和改变是要在项目的推进过程中,随着时间的推移而积累的。

怎样才能面试成功呢?

接下来给大家分析一下设计师需要具备的三种思维和九种能力。这是自己的的感受和领悟,算是一家之言,有不同意的也欢迎拍砖。

三种思维分别是用户体验思维、设计价值思维、自我成长思维

用户体验思维

做过互联网设计的设计师相信都听过用户体验这个词。大家经常被教育“用户之上,提升产品的用户体验”。但通常情况下大家都是把它作为一个口号,在具体执行的过程中还是会陷入惯性思维和惯性做事方式中去。大家可以回忆一下自己的工作环境和流程是不是这个样子。用户体验思维不是一个包装视觉设计的工具,应该是一个严谨的设计思考流程。这种思维方式帮助设计师主动的去深化对于业务的理解,根据对于业务的理解,去明确产品的用户目标,梳理用户的使用场景和痛点,设计师要基于理解产品目标和用户痛点的基础上推导出设计目标,并给出合理的设计策略。用户体验思维是一种真正的基于理解业务的基础上,站在用户的角度去设计的一种思维方式。或许你会认为自己现在公司的环境不允许自己做过多的思考,因为公司要求的是效率。那么我建议,设计师自己可以在做每一个设计的时候都要问自己多个为什么?对于每一个习惯性的操作都要想想为什么?这样做有什么好处。通过每一个操作的反问,渐渐改变自己的思考方。拥有了用户体验思维才能够更好的面对面试官的关于设计师简历中作品的相关提问,更好的展现你对于体验设计的理解和自己的设计思维。

•设计价值思维

设计的价值是什么?不就是设计了一张app的介面吗?这是大部分设计师的第一反应。如果细问设计的价值什么?恐怕大多数设计师一脸蒙逼。设计价值思维能够让设计师更好的理解自己工作的意义,为什么做这个介面设计。首先是设计解决了什么问题,解决了用户的哪些痛点?其次需要明确设计价值,你的设计的价值是什么?是在设计目标的基础上谈设计价值,需要明确衡量指标,通过数据的变化来量化设计价值。例如设计方案提升了详情页的转换率、增加了用户的停留时长等等。设计师不仅要撸图撸的漂亮,更要明白设计的价值。这样才能从容的面对面试官的灵魂拷问,才能让面试官了解你的专业能力,知道你可以通过设计解决用户的问题,而不只是撸了一张漂亮的图。

•自我成长思维

你是否给自己有一个自我成长的规划,是否想过自己的目标?你想让自己成为一个什么样的人?撸图的?还是写PPT的?所以要想想自己的规划是什么?自己想在下一份工作中做什么事情,学到什么东西?因为只有想通了这些,你才能回答“你为什么离职”“为什么想要加入我们公司”这样史诗级别的问。这样做不仅仅是为了应对提问,更重要的是想想自己的未来,明白了自己的目标,才知道自己要走什么道路。

九个能力(顺序不分先后)

•沟通能力

互联网产品是一种团队的工作,在团队工作中,沟通能力直接决定你的工作的推动能力和设计的影响力。面试过程就是面试官了解你的沟通能力的关键时刻。沟通能力的强弱会让面试官决定是你否适合这个团队。如何去提升沟通能力呢?可以多在团队中分享和做项目复盘,多做Presentation,锻炼自己的沟通能力,客服自己的心里障碍,突破自己的屏障,跳出自己默默撸图的舒适圈

•设计专业能力

你的简历和作品就是在传递你的专业能力、你对设计认知的专业性和你对业务的理解能力。设计的专业能力直接决定着你的活好不好,也就是你能不能通过你的活好征服面试官,通常情况下初面的面试官是你未来的同事或者leader,更多关注的是你的专业能力。例如每个系统的设计规范、交互规范,业务思考,使用场景分析,设计元素的构思,组件的归纳等等通过一系列的设计产出证明你的专业能力(自己的其他文章也讲述过设计相关的能力,欢迎查看)。如何提升专业能力呢?设计师需要主动思考设计方案的全面性和合理性,放下自己的自尊心,在设计评审后结合团队成员的想法做出调整

•设计总结能力

在面试的过程中,有很大一部分的时间是围绕这作品集中的项目展开沟通的,所以对于项目的总结和思考能力,是看一个设计师对待每一个项目的态度和角度。如果你只是在作品集中罗列图片,那对于面试官而言,你只是一个撸图的,没有对项目建立一个Owner的意识。所以在项目前期做详细的沟通和了解,项目完成上线后,对整个项目做一个全面和完整的项目总结,结合产品目标和设计目标做设计方面的总结,并发现在项目推动过程中遇到的问题和解决方法,锻炼自己的总结能力,提升自己的薄弱环节

•团队协作能力

面试的过程中,会遇到被问你现在团队的协作方式,因为我在前面也讲到了互联网工作是一个团队协作的过程,每一个团队有不同的协作方式,不能过分的突出某一个环节,而是大家共同协作去完成一个项目。如果说一个设计师在合作的过程中出现了合作问题,会降低面试官对于一个设计师的感性印象。所以设计师如何与团队协作,业务方和设计师的协作关系,设计师时间配比分别是多少。这些都是面试官了解你的协作能力的不同途径。

•逆向推动能力

现在大的互联网环境对设计师的要求已经不在只是设计支持,设计团队也对设计师的要求也在慢慢的改变。所以设计师在面试时会被问有没有遇到过什么问题和有没有推动过什么项目,分别是如何解决的,如何推动的?面试官想招的人不再只是一个撸图的设计师,而是一个有追求有想法能产生价值的设计师。所以设计师需要思考自己在项目协作过程中遇到的问题,分析问题的根源找到解决方法。在工作中主动推动项目,发起由设计驱动的体验升级迭代,提升自己的逆向推动能力。

•抗压能力

在找工作的过程中,除了一对一的面试,还会有二对一、三对一的面试情况,并且会遇到类似于压力面试的情况,面试官通过一连串的深挖提问,让设计师在思考不彻底的情况下自乱阵脚,这种情况考验的就是一个设计师面对复杂情况的心理能力,所以平时在和大家分享设计中多接受大家的提问,提升自己关于对问题的抗压思考能力,提升自己的自信心。友情建议面试的时候穿一套新衣服,会间接提升你的自信心,从容面对遇到的奇葩问题

•逻辑思考能力

前面谈到面试中会遇到压力面试,多个面试官会快速的抛出很多问题,让你本来紧绷的大脑变的更加紧张,甚至会问到如果让你设计一个页面,你会怎么设计,面试官希望得到的是你的逻辑思考能力。所以在平时的项目中锻炼自己的逻辑思考设计能力,对自己的每一个设计元素都提出质疑和自我思考,明确自己的设计围绕设计目标,让自己的设计有理有据

•独立思考和规划能力

对某个产品什么看法?你觉的哪里做的好哪里不好?你觉的哪个产品做的好?为什么好呢?你对某个产品有什么修改的意见呢?你觉的什么样的产品是好的产品呢?为什么呢?你自己的职业规划是什么呢?你有什么具体计划去达成自己的规划呢?等等一系列的问题主要考验的就是你的独立思考能力和对自己的规划能力,大部分设计师可能瞬间懵掉或者自己从来没想过自己想要什么?所以平时工作中养成一个良好的思考习惯,从最低层的用户需求开始思考,同时在项目沟通中主动表达自己的想法,突破自己的内心障碍。同时要多和其他设计师沟通,并且以此确定自己的人生目标和规划

•管理和领导能力

这种能力并不是说你不是领导,你就不需要了。这种能力也是体现设计师复合价值的必要能力。管理和领导能力考验的是设计对于自己负责项目的管理能力和领导团队成员一起解决复杂问题的能力。当然这需要设计师对自己高度的要求和很强的主观能动性、责任心。所以做好自己负责项目的风险管理,及时同步项目的进度信息和问题,让大家了解项目的情况,同时做好领导和其他协作团队的预期管理,减少错误信息的传递,和合作团队建立良好的沟通和合作机制,减少合作团队的不信任感。在团队或者团队成员遇到问题时主动提供帮助,或主动带领团队成员去解决问题,提出合理的优化意见,锻炼自己的领导力和横向管理能力

总结

以上是根据自己的经历总结的关于面试的一些结论,同时想和各位设计师说“找工作是一个展现自己能力和价值的过程,只有匹配公司要求的设计师才能成功,当然并不是说没有接到offer的设计师就不是优秀的设计师,因为有可能你和公司的需求不匹配”。所以给大家加油,2019的寒冬一定会过去,所有的设计师一定能够找到适合自己的工作。

最后想给大家说要习惯做以结果为导向的事情,明确目标之后的行动才有价值,否则就会变成战术上的勤奋,战略上的懒虫

原文地址:体验设计说(公众号)
作者:亮king

评论 (0)
请登录以参与评论。
立即登录

体验设计师需要懂一些心理学

768 0
体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

通常情况下,在做产品体验设计的过程中,设计师主要会从用户的生理特点进行设计,比较典型的就是尼尔森的可用性原则,通过各种原则来优化介面设计。生理特征是用户接受、获取信息的过程,比如用户对于优良的排版获取信息更快捷和舒适。而大家容易忽视的是用户的心理感受,心理感受是用户对于信息再加工的一种主观感受,这种感受来自于大脑处理用户通过生理接受信息的感性认知,这种心理感受来自于人的本性,是一种感性的条件性的反射性的感受。比如人类在遇到害怕的物体时,第一反应是逃离。因为人天性中有一个东西叫做趋利避害,这是一种没有理性思考的感性行为。

接下来谈一下自己对用户心理学的总结,我会用一些简单的词汇描述心理学的具体观点,并且一起看一下其他产品是如何运用这些用户心理进行设计的。

从众心理

简单解释就是其他人怎么做我就怎么做。相信大家都遇到过一群人在看天,而你也会随着望向同一个方向。(当然这里面还有一个“好奇”的心理,因为人的行为通常是由多种心理共同触发的,这里先暂且不谈)在原古时代从众心理是一种低成本的且高效、成功率很大的一种生活方式,例如食草类动物在逃离食肉动物的时候,采取的就是从众心理,这是一种存活率最高的一种生活方式。在当今激烈竞争的社会中,用户应用这种心理感受主要是抓住了低成本和高效,因为只有这样才能保证在激烈竞争的社会中生存下去。

在电商产品中,物品的列表都会经常显示该物品的销售量是多少或显示用户评价多少条。微信读书中针对书籍的列表中也会显示多少人在阅读这本书。物品的显示数量可以让用户产生这个物品有被大家喜欢的感受,所以自己可以不用费力再去分析研究。同理微信读书中的书籍能够被这么多人阅读肯定内容质量能够得到保证。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

己心理(占便宜)

只要能占到便宜,确实让自己获得好处的就会采取行动,尤其是一些看似很便宜的东西,会非常的吸引用户。这种心理感受会让用户认为自己的得到多于付出,减少自己的成活成本支出,同时还带有一些满足感,因为自己获得了减少成本支出的成功。

例如在一些app中我们经常会看到团购的概念,让用户看到团购前后的价格对比进而产生这种占便宜的心态。再比如拼多多之前非常流行的砍价的活动,不管费多大的力气,减少金钱支出获取物品,这是最吸引用户的。还有一些酒店旅游类的产品,会通过提供优惠券的方式吸引用户预定和浏览。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

性价比心理

用户会从多个方案中选择性价比最高的那个,而非是自己最需要的那个。在上面利己心理的基础上,用户会非常关注自己的付出和获得是否成正比,甚至是放大收获。记得之前看过一个用户订阅杂志的故事。方案一是订阅纸质杂志,一本50元。方案二是定于电子版杂志,一本30元,方案三是定于纸质杂志和电子杂志,总共60元。没有疑问,大部分用户选择了方案三。同时我们也会看到一些泛电商的产品经常会对重点促销的产品在方案上有一个对比,让用户的这种性价比心理产生作用。

例如在电商加到购物车的弹窗中,通过各种型号的对比,用户可以选择性价比最高的那一个,同时这个也是商家正在推销的产品,然而用户却忘记了最终想要的是什么。例如下面的图片。还有另一种典型的就是汽车,商家通过价格的对比,可以让用户从最开始的10万元的车不断提升自己的预算到15万元,最终买了一个用户认为性价比最高的车。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

选择恐惧症心理

选项过多,会让用户不知道选择哪个。给用户太多的选择,用户的决策成本就会变的很高,看起来是给了用户更大的自由度,但用户在对比选项的时间成本和思考成本相应的都会增加。所以设计师需要在设计中对决策成本和决策自由度上取得一个平衡点,记住有的时候对于用户而言不是越多越好,而是合适的才是最好的。理想中3-5个是最理想的选择数量。所以大家平时看到过的调研问卷大部分的问题的选项都是在3-5个。商家给出的产品类型对比也保持在3-5个之内。
体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

压迫性心理

人天性讨厌压力,讨厌在压迫性的环境中生活,希望快速的走出这种不舒适的环境,所以比较典型的就是倒计时打折或者限时优惠,通过时间倒计时让用户感受到时间流失的压迫从而激发出用户天性中面对压迫性时的应对反应,而用户往往也会在这种压迫性心理的情况下进行决策。

所以一些运营活动加入优惠时间倒计,甚至在最后几分钟,文字更突出,给用户明确的时间压迫。还有京东上经常采用的还剩多少件,或者酒店预定平台展示房间还剩多少间。这些都让用户感觉到再不买或者再不预定就没了的心理感受。还有就是拼多多之前非常火热的发现金活动,倒计时会刺激用户争分夺秒的去转发,让朋友点击,让自己获得现金,同时刺激产品的扩散。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

喜欢得到而害怕失去的心理

每一个人都喜欢自己得到了什么,而害怕自己失去了什么,这是每一个人最深处的观念。所以线上产品突出物品的优惠,会让用户有一种得到这种优惠的感受。所以用户会把已有的优惠作为一个很重要的决策依据。再来看双十一、618等等购物节,物品的价格旁边写原价多少。这种节日的优惠就会让用户产生一种买了就能得到这种优惠的心理感受如果不买,这种优惠就会失去,因为物品的优惠只在固定的时间内有。所以针对用户的心理展示信息,告诉用户将要得到什么和将要失去什么

例如一些网站经常会显示一段时间之内会有优惠,并且标出原始的价格是多少。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

第一印象心理

通俗来说就是颜值,物品的颜值直接决定用户的第一印象。而第一印象容易使用户对一个产品产生第一感知或者心理模型。第一印象在一定程度上决定着用户是否对他感兴趣,甚至是否有更深入了解的想法。所以淘宝电商平台针对物品图片的展示给商家制订过图片展示的规则,优化了图片中物品视觉感受。

因为在商品的展示中物品图片的质量会影响用户对于物品的认知。同理向用户展示的房源图片,房源图片的质量直接决定用户对于这个房源环境的虚拟构建和联想。当然线上产品本身的设计精致也会向用户传递产品专业的第一印象,让用户也更信赖这个平台。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

炫耀、分享的心理

每一个人都喜欢让别人知道自己的成就,认同自己的价值,因为人的天性中就包括炫耀。所以现实生活中我们经常看到的就是人们穿着名牌、开着豪车,无一例外就是都炫耀自己的资本和成就,这些都是人性心理的外在表现。

线上产品中UI中国会对个人发布的文章加推荐,或者论坛会对帖子加首推。微信读书中会显示用户的阅读时间和阅读完成的书籍数量,还有用户总共的阅读时长等等。淘宝之前每年都会针对每一个用户显示出一个用户的消费数据,形成了疯狂的传播和分享。这就是对用户心里的完美诠释。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

被夸奖和赞美的心理

人天性就喜欢被表扬、夸奖,直接表现在人们在完成一项工作或任务在被表扬之后,内心动力会更大,情绪处于极度高涨状态,做事情的意愿程度会更高。例如幼儿园的小朋友被老师表扬之后,第二天会做的更好,从而期待下一次表扬。夸奖是一种廉价的动力。

让我们看一下微信读书每次读完一本书都会有一个恭喜的词汇,或者是游戏闯关中成功之后都会有一个恭喜的话语和相关的氛围营造,这些都是在向用户传递产品对于用户的夸奖和赞美。

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

讨厌不确定性

尤其是和金钱财产相关的,用户非常讨厌不确定性,如果产生不确定性,用户就会有危险和危机的潜意识,别忘记人类都是趋利避害的。不确定体现的很多方面。

  1. 不符合用户的预期,
  2. 操作流程的前后不一致,
  3. 产品提供的信息不严谨。
  4. 没有明确的提示

所以不确定性一旦出现,用户会立刻离开你的产品。比如在app前后两个页面展示的信息不相同时,用户是不愿意也不可能花费高成本去确认,因为现在替代品非常多,所以用户会选择低成本的方式去做确定性的事情。这也是设计师在优化产品体验的时候必须注意的事项。

这个还没有找到合适的方案,等找到之后再更新配图。

最后说点啥

这次主要说这几个关于用户心理的总结,之后再更新关于其他心理的总结。

设计师懂用户的生理特征,能够提升产品的体验,而了解用户心理特征能够制订更优秀的设计策略,让用户喜欢上你的产品。说了这么多,不管运营、产品、设计都或多或少抓住了用户的心理特征用在了自己的产品中。最后你可以想想自己的产品,可以在回复中说出你的产品在设计中应用到了哪些心理学内容,或者还可以用到哪些心理学内容。下期再见。

原文地址:体验设计(公众号)

作者:亮king

体验设计师需要懂一些心理学
体验设计师需要懂一些心理学

评论 (0)
请登录以参与评论。
立即登录

网易蜗牛读书品牌体验设计

801 0

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

品牌体验设计(BX Design)

先简单介绍一下品牌体验设计(Brand eXperience Design),我们平时可能听到 UI Design、 UX Design、MG Design 等这些词比较多,随着近几年开始越来越关注品牌,越来越注重全链路的品牌体验,BX Design 也开始被更多的提及,品牌体验设计不仅仅是 logo 及视觉识别,包含了UI/UX、图形设计、影像设计、动态设计等与用户接触的每一个触点的体验,好的品牌体验设计通过各个设计触点的配合给用户传达融合、一致的感受和体验。

品牌探索(Brand Research)

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

品牌定位

很多人会奇怪,我们明明已经有网易云阅读这个品牌了,为什么还要重新建立一个新的阅读品牌。一方面是业务发展的诉求,另一面方面是有我们对读书这件事的一些态度和尝试。阅读这个行业依然有非常多的细分领域,目前来说主要分为两大块,一是以网络连载小说为主的快餐文学,还有一类是更加注重书籍本身质量的传统出版文学,通过典型用户画像我们可以发现两者的核心目标用户虽有重合,但在需求和喜好上还是很大的差异,两者传递的品牌调性也有所不同,区别开有利于后期品牌的差异化设计和精细化运营。蜗牛在品牌策略和定位上主打精选出版图书的深度阅读,并且首次提出时间付费的概念,以时间为轴打破书籍之间的界限,致力于为热爱阅读的用户提供简洁、安静、无干扰的阅读体验。

品牌理念

牌理念是一个品牌的灵魂,蜗牛读书的理念是「不疾而速,读点好书」,在这个忙碌浮躁快节奏的社会,希望大家可以做一只慢慢爬行的蜗牛,回归自然,拥有一颗平和宁静的内心。

品牌定义

读书是一件简单纯粹的事情,在设计理念上我们去探索了茶道、花道、禅宗等形而上的东方美学思想,结合相契合的部分作为设计美学指引。然后通过情绪版去发散和提炼品牌关键词,透过关键词去收集想传达的风格、色彩、影像或任何可以引起情绪反应的资料,作为设计方向与形式的参考,探寻品牌感觉。我们给蜗牛定义的品牌关键词是:简洁、自然、素雅、安静

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

设计原则(Design Principle)

我们定义了「简洁、友好、一致、美观」的设计原则,作为设计指导准则。虽然很多时候我们觉得设计原则很虚,但是作为设计系统的起点,设计原则可以帮助团队成员建立共同的设计世界观,在设计过程中,可以通过反问的形式衡量设计的优劣,比如信息呈现核心流程是否简洁、失败操作体验是否友好、配图是否美观等。

品牌设计(Brand Design)

品牌

品牌设计之初我们首先定义了品牌色,我们从品牌最原始和直接的品牌名入手,将「蜗牛」和「书」这两个意象进行场景化,然后从场景中去提取色调,结合情绪版,最终提炼定义了我们的品牌色,用户通过名称进行场景相关的联想很容易与品牌色建立联系,加深品牌印象。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

品牌标识

在品牌图形设计这个阶段我们的大脑中会迸发出无限的灵感和创意,草图可以帮助我们快速的呈现概念,这个阶段不要限制你的想象力,也不要太关注绘画的技巧,重要的是尽可能多的呈现创意和想法。这里我以「蜗牛」「书籍」「时间」「速度」四个关键词去进行概念的发散和尝试。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

然后选取一些概念草图进行矢量化,通过筛选确定了左下角这种线性 logo 的方向,造型上也融合了蜗牛和书的意象。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

选定一种形式和方向后,我们继续进行方案的迭代,我们尝试做了加法,融入了速度的概念,希望在品牌 logo 中呈现「不疾而速」的品牌理念,蜗牛给人慢的印象和 logo 中速度概念的呈现给人以反差感,塑造更加深刻的品牌印象。经过最终的评选,最后选择了方案二更加简洁的视觉呈现。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

选定了造型上的案后,接下来会对造型进行提炼优化,主要从蜗牛头部身体比例以及线条的粗细去反复尝试,找到一个视觉上的最优方案。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

这是最终确定的 logo,造型和意象上融合了蜗牛和书的概念,以流畅的线条风格呈现一种简洁优雅的视觉效果。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

logo 图形确定后,我们还需要设计与之搭配的品牌文字,这里我们选择现有的中文字体去和 logo 图形进行组合搭配,尝试了几十种组合,通过不同的组合探索各种不同可能性,这个阶段最主要是找到跟品牌性格以及图形风格相契合的字体骨架。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

最终我们选定了汉仪清雅体简作为基础的文字骨架,它骨架平稳,字形简洁优雅,笔画干净利落的同时在撇捺折钩处细微的粗细变化让字体显得不那么极简现代,而有一分文化感。选定骨架后,我们从比例、字重以及品牌基因的融入去优化,使其与 logo 的搭配更加和谐。

最终版本

然后我也设计了品牌标识的动态表达,主要用于产品启动页品牌展示以及其他推广传播渠道。动相比静更加能吸引注意,当用户对静态图形有了初步的品牌印象之后,再通过变化性、互动性的动态图形加深品牌记忆,达到品牌传播的目的。

APP设计(Application Design)

品牌基因

在互联网产品设计越来越趋于同质化的今天,做出有品牌个性和差异化的产品是我们每个设计师需要面对的挑战。在蜗牛里面,我们通过品牌基因的提取,视觉语言的构建去传递独有的品牌气质。除了品牌色的植入,我们还从品牌意象和图形 logo 入手,提取了「圆」的基础图形作为品牌基因,并将其贯穿在整体的品牌体验设计之中

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

在蜗牛的介面设计中到处都能看到「圆」这个视觉语言的融入,从图标、按钮、头像、书封、卡片、配图等,到整个 APP 介面边角圆角的处理,完整统一的视觉语言传递了更加和谐一致的品牌感。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

这里还引入了一个比较特殊的圆角--连续曲率圆角,应用场景是在弹框、卡片等这些圆角较大的地方。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

在我们平时做设计的时候,当圆角设置稍微大一些的时候,总是会发现圆角并不是那么完美,直线和曲线的过渡很生硬,通过曲率梳状图,我们可以看到左图常规的圆角曲率的过渡是突变到半径值,而右图圆角曲率则是平滑过渡,右图用的就是连续曲率的圆角,虽然这是一个难以被发现的细节,在蜗牛的设计中我们还是希望尽量减少这种生硬的衔接带来的切割感,提供更加友好和顺滑的体验。

排版布局

在排版布局上主要考虑层次和空间关系,我们在排版中引入了 4pt 的 UI 网格系统和 2pt 的基线网格系统,当信息在空间中的排列有规律可循时,用户则更容易找到想看的信息,基于系统的规则,可以给用户提供更加一致的感受与体验,一致产生重复,重复产生节奏,让用户与信息的交互更加高效和愉悦。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

投影

在介面的设计中也用到了微投影去构建视觉层级和营造空间感,基于品牌调性,我们希望介面中光影的感觉是自然和谐柔和的,一般真实的投影的衰减是曲线衰减的,而我们在软件中模拟的投影是线性衰减的,所以这里会用到几段线性的投影去模拟曲线衰减过程,为了使投影更加自然柔和。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

介面设计的根本目标,是以产品功能性为基础去构建使用体验,以使用体验为基础去塑造视觉美感,蜗牛的介面排版设计中,在满足产品功能性和可用性的前提下,尽可能的增加了介面的留白和对比,去塑造简洁优雅的视觉美感和传递品牌调性。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

图片设计

图片的通用调性上都紧密与品牌的气质相结合,将品牌理念融合到所有图片设计中。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

动效设计

动效有很多作用,比如可以传达状态,提供反馈,传递层级关系,吸引视觉焦点等等,好的的动效设计可以提升整体的品牌体验。

在蜗牛的动效设计中,主要遵循以下设计原则:

功能性:以功能性为前提,不做无意义的动效,不为了动效而动效;

克制:不做过度多余的动效;

顺滑:遵循物理世界的规律,提供自然顺滑的体验;

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

根据不同场景,我们定义了 6 种不同的贝塞尔曲线,通过贝塞尔插值法进行复用,保证局部场景的个性化定义和整体的一致性体验。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

在实现上,为了保证设计开发的还原度,我们也会给出完整的动效标注文件,标注文件中包括动画属性、动画时间、动画变化量、动画曲线、触发条件。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

动效的设计制作上主要用到了 AE 和 Lottie ,Lottie 是 airbnb 团队开源的一个动画库,以往我们设计师设计好的一些比较复杂的动效通常会通过 Keyframes 或者 GIF 的形式输出给开发同学,都面临着导出文件大、适配性和扩展性差、开发代价高的问题,让一些好的动效因为时间和资源的问题都最终被搁置。而通过 Lottie ,设计师可以将 AE 里制作的动效通过 <a href="https://www.uiue.com/%e5%a6%82%e4%bd%95%e8%bf%90%e7%94%a8lottie%e5%ba%93%e8%ae%a9%e5%8a%a8%e6%95%88%e8%90%bd%e5%9c%b0%e9%99%84Bodymovin%e6%8f%92%e4%bb%b6%ef%bc%89/” style=”color: #ff134d;” target=”_blank”>Bodymovin 插件导出一个非常小的 JSON 文件,工程师也只要通过简单的配置就能100%的还原动效,大大降低了设计开发的成本,目前 Lottie 还支持网络读取 JSON 文件,做 A/B Testing 也更加方便。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

接下来来看一下蜗牛 App 里面的一些动效设计:

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

设计规范(Design Guideline)

在品牌体验设计过程中为了保持设计的一致性以及提升团队各角色之间的协作效率,基于不同的角色和目标我们会制定不同的规范,比如品牌手册、UI Style Guideline、Pattern Library 、动效规范、运营规范等等。设计规范本身是一个比较大且耗时的工程,所以建立规范的时机以及复杂度也是需要考虑的。

蜗牛的规范目前也在随着产品的稳定逐渐完善中,挑一些简单说明一下。

这是蜗牛的 UI Style Guideline,主要作用于设计师和设计师之间的协作,保证设计风格的样式的一致。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

书籍正文精编书的模版规范,主要作用于设计和开发的协作,这里我也用到了 html/css 语言去制定规范,省去了将设计语言转化为代码的过程,避免在这个过程中产生误差,同时也节省了设计以及走查调整的工作量,另外也有正文设计的复杂度和特殊性的原因。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

蜗牛精编书的配色规范以及标签规范,主要作用于设计师和运营编辑人员的协作。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

品牌延伸(Brand Extension)

一些线上线下的活动和物料设计,它们也是品牌和用户的触点,同样在设计的时候需要延续整体的品牌调性,传递出统一的品牌感。

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计

设计验证(Design Verification)

设计是一门感性和理性相结合的交叉学科,也是一个 「分析 – 研究 – 设计 – 验证」 的闭环过程,设计师需要在产品不同时期把控体验和产品目标的平衡,通过反馈和数据去验证每一个设计的合理性,然后不断迭代优化。

写在最后(End)

目前线上最新版大家可能会发现品牌色进行了调整,主要是出于集团战略上的一些考虑。

以上是我在设计蜗牛时的一些过程和思路,希望对大家有所帮助,品牌体验设计其实还有很多方面,蜗牛也还有很大的提升空间,如果有什么好的想法和建议欢迎来跟我交流。

原文地址:网易UEDC(公众号)

作者:俞树峰

网易蜗牛读书品牌体验设计
网易蜗牛读书品牌体验设计
评论 (0)
请登录以参与评论。
立即登录