首页

三招教你营造超强画面冲击力!——以新春运营活动为例

涛涛

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

这画面根本没有冲击力!,下次试试这三招地表最强反击!

身为设计师,你是否遇到过以下情况:


你花费了大量时间来构思与设计,却得到需求方一句“这画面根本没有冲击力!”遇到这种情况我们常会把问题抛向运营同学,但定神反思一下:为什么我们会被带偏?画面如何才能具备强烈的视觉冲击力以说服他人?


什么样的画面,会让你觉得很有冲击力?想必影响因素众多,而今天我们就跟大家聊聊故事性、可读性、空间感这三个维度。




故事性


故事性主要从情绪、氛围和趣味性三个方面来表现。


  • 情绪


先从情绪开始聊,你的画面是想表现出积极上进、欢乐还是愤怒?


画面整体的情绪需要依靠主体情绪都深入刻画,情绪能带动用户的视觉感受,帮助用户更好的从图案中获取与主题相关联的信息,从而引起读者的共鸣,最终达到推广的目的。


 

  • 氛围


其次,就是氛围的把控。除了画面主体的刻画,氛围的把控至关重要。


氛围把控的好坏,直接影响到画面的统一性,这也是为什么很多同学一碰到复杂构图就逃避的原因。只要我们把握住一点,“一切的氛围只为突出主体!” 掌握这一点,相信很多同学都驾驭复杂的构图!

  • 趣味性


与前两者不同,画面的趣味性并非一种技能项,而源于你内心有多有趣!


职业化的人大多都是有职业病的,设计师的职业病应该是对视觉的敏锐度!我做广告那几年,路过地铁站或者公交站台,经常会被好的海报所吸引,也常会驻足研究海报设计者背后的思考。他是如何进行版式编排,如何对画面进行构图,如何做创意推导……如果是我,好的地方我要怎么学,坏的地方我会怎么做!

 

之所举我过去生活的这一例子,其实是想说:每个设计师身上的DNA不一样,感兴趣的事情也各自不同,所做的设计也不一样,这些都取决于你是一个怎样有趣的灵魂!


趣味性在你的画面里,大部分来源于你生活中的积累!设计源于生活,趣味源于有趣的灵魂!




但是,在商业项目中仅仅有故事性还远远不够!商业设计创作中,需要更深挖项目背景,要知道项目所面对的人群、品牌调性、推广目的、投放时间及媒介等。


以这次我们接到的新年运营活动为例,需求面向企业内部,需求方想要体现在春节来临之际对公司内部员工的关怀,目的为增强员工归属感,传达新春关怀。



我们通过对信息的梳理,脑暴得到上图的内容,推导出所需元素,接着绘制草图。

 


Tips:足够完善的草图=节约时间


这里提一个项目实施中的小Tips:我们在很多项目实践中总结出并反复验证过:草图越详细,后续就越能快速地完成项目,甚至能腾出更多的思考时间! 绘制中一旦静下心来,你就可以好好享受源源不断的灵感。只要软件不生疏,绘制起来其实是很快!切记勿要边做边想,这样只会徒劳!

 


我们通过对情绪、氛围、趣味性三个维度进行结合,画面以小哥做舞龙状态,周围围绕着祥云、锦鲤、红包、以及顺丰的元素,整个画面氛围营造一种新年的喜庆!让画面自己讲故事!

 


可读性

 

  • 构图与板式


为保证画面信息的可读性,可运用版心理论、三分线构图法、黄金分割比例等规则来验证自己在构图上的严谨性,这些规则可有效的规避主体不够突出、重心不稳等常见的版式问题。



01. 版心理论


以常见的矩形版面来说,其版心为四边形,具有四个角。我们可以把角理解成点,而版心就是通过四个点连线建立起来的。改变任何一个点的位置,版心的轮廓都会发生变化。


所以,四个点也直接影响了画面的张力,角越多张力越大,元素覆盖两个点会显得张力不足,四个点又会显得过于饱满。因此我们推荐三个点,最后一个点做弱化处理,整体就会显得透气!



02. 三分线构图


三分线构图被广泛运用,摄影、设计、绘画等艺术创作。指把画面横分三分,每一分中心都可放置主体,这种构图会使得主体和装饰元素更显得紧凑有力。它也是最基础的构图技巧,相信大家经常运用,就不赘述。



03. 黄金分割比例


黄金分割比例是现今公认的美学定律,蕴含丰富的审美价值,是视觉上最舒服的比例,与三分线构图法异曲同工。



  • 节奏


画面节奏可以使画面错位布局,营造空间,增强画面的节奏感。


如下图所示,“S型“构图是非常常见的一种构图方式,形式灵活多变,往往S型构图有着明显的层次关系,元素在空间上可以分为前、中、后景;其次,S型构图可以有效的引导读者的阅读顺序,达到视觉引导阅读的作用,从主体作为出发点,保证画面的阅读井井有条。


 


空间感
  

最后就是画面的空间感,但相信设计师在漫长的艺考生涯中,早已学会如何去运用虚实、肌理、色彩去区分主体与装饰元素之间的关系,还没掌握的小伙伴赶紧去温习你的旧课本吧!

 



 结语
 

Anyway, 以上就是有关新春运营活动的设计总结,从案例中我们习得如何通过故事性、可读性和空间感三维来增强画面的冲击力。这一方法也可以应用在项目设计完毕后,通过以上三点内容去验证设计的合理性和有效性。最后来复习下:


  • 故事性 - 你的画面能自己讲故事、表达情绪,当然趣味性也必不可少;


  • 可读性 - 在保证图文条理清晰、信息层级表达准确的前提下­­­­,对版式、构图以及画面节奏的把控十分必要;


  • 空间感 - 增加画面的色彩层次、肌理、光影的表现,这样能更好地表现画面层级间的空间感。


每个设计师都是独立、富有创意又有趣的个体,希望这一分享可以为大家打开一些新的思路!


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

 

ICON设计法则—菱形法则

涛涛

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

从不同维度对Icon设计进行解析,整理一整套Icon设计的法则

网络上有很多关于Icon设计的文章,一些文章从部分维度切入讲述Icon的设计理念,但大部分缺乏整体性。


所以我尝试把自己的思考方式结合其他人的设计理念整理了一个完整的Icon设计法则,通过简单易懂的描述语言,并且结合设计案例呈现出来,希望能够对大家有所帮助。文章使用的案例只代表个人观点,并不代表相关产品。


本文重点讲述Icon设计思维,关于Icon的具体定义以及具体的制作过程就不再赘述,网络上有很多相关文章都有讲述。


从不同维度对Icon设计进行解析,整理一整套Icon的设计法则。每一个产品中都有不同类型的Icon,产品通过Icon可以快速的向用户传递语意,通过独特的设计语言让用户形成对于产品的认知心智。Icon的重要性就不言而喻了。


ICON的设计法则-菱形设计法则,主要包括语意、层级、设计形式、风格、一致性、范围。而其他的设计思考也是这个设计法则的变体,中心思想没有发生变化。通过对以上设计思考点的聚合,来设计能够传递Icon语意,并且能够清晰展现产品结构和信息层级的Icon系统,通过差异化的设计形式展现产品设计的独特风格,让具有一致性的设计语言传递信息,和用户形成共鸣。

Image title



层级

第一层级Icon

第二级别Icon

第三层级Icon

第一层级的Icon一般指首页的井字入口Icon,让用户快速获取入口信息,完成对产品流量的分流,让用户快速完成自己的任务。这种类型的Icon是级别最高的,无论是面积、形式感、视觉冲击力都应该是最突出的,这种高层级的Icon可以简单通过一下三种方法表现,1、拟物化的设计方式增加视觉重心和吸引力。2、通过细节的增加呈现Icon设计的复杂形式感。3、采用冲击力强的色彩对比,抓住用户的关注点。除此之外具体的思考过程,后文也会详细讲述。


下图分别是“自如” “每日优鲜” “大众点评”的首页入口Icon,分别采用了拟物化设计,细节添加,色彩对比的设计方法。

Image title


第二级Icon归纳为导航类型的Icon,引导用户操作产品,完成用户的任务,同时传递品牌特色。这种Icon类似真实街道中的指向标。第二层级的Icon不需要做的视觉重点非常重,能够让用户认知到,并且了解Icon传递的信息,在操作行为上产生预期就可以。通常的设计样式是线型Icon或者是面型Icon。


下图分别是“自如” “每日优鲜” “大众点评”的二级Icon系统

Image title


第三类Icon是语意型Icon,主要是向用户传递信息,烘托信息氛围,并且引导用户浏览信息。这种类型的Icon视觉相对较轻,且不可点击,具体的设计思考在后续的内容展开。


下图分别是“自如” “每日优鲜” “大众点评”的三级Icon系统

Image title


以上三级的划分并不是说Icon只有这几种类型,这样划分是从功能和视觉上进行区分便于设计同学理解,当然在具体的设计过程中也可以对Icon进行更细化的区分,最主要根据具体的需求去定义Icon的层级,然后再采用对应层级的设计语言。


语意    

1)、Icon背后的语意(Icon的特性归纳)

2)、Icon的可识别性(Icon的特点表现)

Icon的重要意义是抓住用户能够通过图像式的语言快速获取产品信息。所以在Icon的设计之前,需要思考Icon背后传递的文字语意,理解语意,构建对于语意的多维拆解(比如沙发是由靠背、两个扶手、四条腿构成,重心要稳,和床有哪些区别等等)。同时还需要思考Icon图形化之后的可识别性,基于对用户认知的了解,归纳Icon设计中需要具体表达的几个关键特点,迎合用户的认知心里。帮助用户快速的获取Icon想要传递的信息,如果不能快速的获取,反而增加了用户获取信息的成本,那就本末倒置,削弱了用户的使用体验。


例:下图是“大众点评”二级Icon设计的语意表现思考方法

Image title



设计形式

1)、外形

2)、表达方式

3)、色彩组合

4)、Icon特色

外形是Icon 的基本形态,不同的形态传递不同的视觉感受,构建不同的心智。同时Icon的外形决定了内部元素的设计。


Icon的表达方式主要两种,分别是线型Icon,面型Icon。线型Icon形式抽象、简洁,便于用户识别,用户认知成本较低,缺点是Icon容易极简,造成了似是而非,可识别性降低。面性Icon相对线型Icon视觉重心更突出,便于用户聚焦,设计表现形式会更丰富,缺点是可能会过于复杂,造成信息层级混乱,增加了用户的认知成本。


色彩组合,就是Icon中的色彩语言,在设计Icon的过程中通常包括单色系的Icon和色彩组合系列的Icon。通过不同颜色的组合传递产品的品牌形象和产品特质,在设计Icon的过程中,尤其是导航Icon的过程中不建议使用超过两种颜色的Icon,这样容易使用户视觉疲劳。


Icon特色是Icon在设计过程中的细节,这些细节是体现Icon自身精致的部分,同时也会影响用户对于产品和品牌的认知联系。影响产品的感性认知触达用户内心。


例:下图以“大众点评”中的“拍视频”icon做举例说明

Image title



风格

1)、品牌理念

2)、产品特色

3)、视觉特色

品牌理念是是指产品背后的定义和想要传递的价值。通过简介的符号、文字传递给用户的认知、理解、印象、感受。通过塑造品牌理念的塑造,和用户在感性层面形成共鸣。融入品牌基因的Icon系统具有更好的辨识性和认同感。这需要设计师和业务团队一起沟通产品,深入理解业务,总结出关键词语表达品牌,最终和业务团队达成统一共识。


产品特色指产品在同行业中的定位差异,核型竞争力。通过简洁的视觉语言进行表现。通常的产品特色体现在业务范围、用户群体,使用场景,产品功能等。在这四个维度中总结归纳成可落地的具体的表达关键词,进一步具象化。


视觉特色指在竞品分析中,总结得到在视觉层面其他产品中可以借鉴的感性共性和自己产品定位差异性的结合。通过可借鉴的共性传递行业的特点,而差异化的视觉表现可突出自己产品的特色和竞争力。


例:继续以“拍视频”Icon为例子进一步解释说明

Image title



一致性

一致性的综合表现在圆角、透明度、线条粗细 、间距、颜色、层级、渐变、特色细节


Icon的一致性有利于降低用户的认知成本,便于品牌传递,而Icon的非一致性会增加用户的跳出感,降低用户对于产品专业度的认可。通常情况下可以通过以上8个维度进行分析和提炼。前七个维度大家比较好理解。重点解释一下第八个维度“特色细节”,特色细节是设计师通过对于产品和业务的理解主观加入的一些关键性视觉表现的点,增加产品一致性的基因,可能是断线,尖角,原点等等标志性元素。


例:下图通过对“大众点评”Icon做拆解进一步从六个维度说明Icon系统的一致性(并不是说每一个icon的设计必须包含八个维度)

Image title



范围

视觉范围和热区范围


随着Sketch的普及,更多的设计师开始采用一倍的设计画布输出设计方案,但在设计的过程中需要注意视觉面积和物理面积,两个Icon的物理尺寸大小是一样的,视觉感性的面积偶尔会变化。所以需要在设计完Icon之后,对Icon进行排列,进行视觉对比,发现视觉的不一致性。


热区范围是代码定义的用户可操作的交互面积,视觉是感知不到的。热区范围的确定有利于开发工程师和设计师达成视觉方案的一致。避免后期由于大家对于方案设计、开发理解的不同,增加后续沟通的成本。通常情况下会出现的问题就是

1、界面开发的还原度低

2、热区范围过小,用户无法点击

3、Icon的热区范围不一致

Image title



总结

在设计的过程中,Icon的样式可以借鉴,但要根据自己的产品做形式上的调整,具体可以通过上述谈到的几个维度作为切入点调整Icon。同时在设计的过程中避免无穷的细化,因为有些细节用户根本不会观察到,这样做只能是设计师的自嗨。设计师容易漏掉的是热区范围的确定,尽管Ios平台和Android平台都有对于Icon范围的定义,但针对产品的icon热区范围调整还是要有设计师自己的想法。这样才能增加Icon设计的思考价值,也更符合产品自身的特色。

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

让我们目瞪口呆的十大黑科技!创新改变生活!

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里 

 

科技不仅改变生活,而且正在改变着我们的生活习惯!不管哪行哪业,不去了解的科技,就面临着被淘汰的危险!电商作为离互联网最近的行业,或许能从这些高科技里找到一些方向和启发!


 

NO.10 踩不湿的鞋子
Vessi鞋,号称世界上第一个100%防水针织鞋
它看起来跟普通的鞋子无异,
但是它具有超强的防水性能,
100%防水能力
并且360°无死角
小水坑我们不放在眼里
甚至可以
直!接!踩!
Vessi鞋的秘密在于它的针织面料专利,
这个称为 Flash Knit 的面料一共有 3 层,
分为不同的功能面料,
这使得它比简单的防水涂层强得多。
第一层也是最外面一层是弹力编织层,由聚酯纤维和尼龙混纺而成,起到防水、拒水、防风的效果;
第二层是纳米过滤层,能进一步起到防水、吸湿作用,最里面一层是透气内层,帮助脚部排汗。
NO.9 材料界的“变形金刚”
下面这些彩色的小卡片—— Formcard
是由英国设计师PeterMarigold
所研发的一种神奇的修补塑料卡,
它可谓是材料中的百变星君,
想变啥就变啥
将原本硬邦邦的卡片放到热水中,
就会变软,
然后就可以捏成各种形状啦!
比如~
手机支架
高级一点的车载支架也是可以滴~
修补雨伞,哪里坏了补哪里
so easy~
虽然看起来软,
但是硬度堪比尼龙。
它的材料是一种
基于生物塑料而
完全无毒的淀粉材料
表面着色的颜料也是安全的。
值得一提的是——
这种修补塑料可以重复使用无数次,
只需要用热水泡一下,就能重新使用。
NO.8 一种“分裂”的材料
杜邦™ Tyvek® 特卫强®
有这样一种材料
防水的同时还透气
是一种会呼吸的材料
硬的跟纸一样
软的像布一样
明明脆弱的跟纸一样,
2个200斤的胖子都未必能把它撕破!
还能用于各种酷炫的手工艺品
既可以当作女生喜欢的包包
还可以变身为时尚的服饰!
杜邦™ Tyvek® 特卫强®
特别的材料特性让它成为设计师们的宠儿
各种创意设计、产品层出不穷
NO.7能修复的黑科技抹布
XG防水珠划痕修复布
这一款黑科技“魔术布”
只需3s即可快速修复车划痕
这块“魔术布”采用
聚酯纤维以及“氧化铈”成分打造。
氧化铈具有特有的切削力,
再加上聚酯纤维布具有摩擦力,
车漆表面的划痕可以快速被修复。
不仅如此,
修复的同时“魔术布”
中含有的乳化蜡成分,
可迅速附着保护漆面,
相当于再给车车做一个美容~
一块“魔术布”可使用15次左右
无论新车、旧车、深色车、亮光漆均可适用
绿色制剂成分还可以保护你的双手
NO.6 擅长堵的材料
FLEX TAPE 防水胶
水流不停
这胶带一拍就堵住了
网上称之为世界最强防水胶——
FLEX TAPE
家里水桶破了个大洞?
一拍,搞定!
家里水管爆了?
一拍,搞定!
NO.5 传说中最变态的黑科技涂料
LINE-X 涂料
据说任何东西涂上他
都刀枪不入坚不可摧,比如
西瓜涂上之后能抵抗锤子的猛击
鸡蛋涂上之后能弹起来了
汽车用钥匙刮都没任何损伤了
在活水表面涂上一层涂料
你都可以在水面
走起魔鬼的步伐
FLEX TAPE 材料
已经应用在各个领域,
尤其是军事、汽车领域
比如美国五角大楼
海军陆战队的悍马
NO.4 具有“生命力”的水泥
生物混凝土Bio-concerte
它依托于芽孢杆菌的神奇生命力
这种细菌产生的孢子
能在没有食物和氧气的情况下
存活200年之久
它将作为细菌营养来源的乳酸钙
混合搅拌成混凝土
若混凝土开裂
雨水渗透进去
休眠中的细菌通过代谢
把钙和碳酸离子结合
形成石灰石,逐渐弥合裂缝
建筑物的使用寿命
有望大大延长
实在是太神奇啦!
NO.3 能屈能伸,时软时硬的材料
P4U
国外有一种材料叫 D3O
在常规状态下是柔软的
却能防住突然的受力撞击
非常安全
鸡蛋摔不碎,防撞防震能力一流
目前已经有上百种产品用到了D3O这种材料
从手机壳到护膝再到芭蕾舞鞋
再也不怕手机碎屏了
中国市场对D3O也有强烈的需求
但 是
前期中国企业从国外采购时遇到不少阻力
难道国内就不能开发出类似的材料吗?
我们就不能做出“国产版的D3O吗”??
可以的!
它就是前面提到的
P4U
NO.2 能吃的塑料袋
这款塑料袋非常环保
由红薯、玉米、马铃薯与植物油
等12种可食用原料做成
100%有机食品
就连印刷字的油墨都是可以吃的
不仅如此
它的韧性和耐用性
不输普通塑料袋
扛得住重物,挨得过焚烧
更重要的是
它具有生物可降解性
在野外它180天就可自然降解
埋进土里45天,扔进水中1天
沸水中15秒就可以完全溶解
一个塑料袋虽小,却足以改变世界啊
NO.1 点沙成土,造福人类
可以让沙漠变成土壤的黏合剂
重庆交通大学力学教授
易志坚带领研究团队
经过7年的反复试验
研发出一种
可以让沙漠变成土壤的黏合剂
这是一种从植物中提取的
植物纤维黏合剂
它能赋予沙粒一种约束
使得沙粒像土壤一样能从任何方向结合
具有自修复和自调节的特性
将沙子与黏合剂混合后
把水倒进沙坑里再也不会轻易流失了
这项伟大的发明可以让沙漠变良田
中国科研团队已经在内蒙古阿拉善盟的
25亩沙漠里进行了实地实验,并取得成功
未来,我们将会看到
越来越多的沙漠逐渐变成绿洲
沙漠不再是寸草不生
反而可以种植瓜果蔬菜
造福人类的发明,大赞!

 

蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计

设计语言 – 按钮 (button)

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

 

一个简单的按钮需要经历无数次推敲,才能整合为设计语言。今天主讲设计语言中的基础部分,组件部分的其中一个部分-按钮。设计语言从结构上分为:基础部分、规则规范部分和业务部分,后面我也会把其它部分补全。

基础部分的画布大小是250000×56000,共47个组件部分;规格规范部分就很庞大了(工业设计、交互设计、平面设计、设计心理学等);业务部分是按系列来分的,有主次之分,目前只分了两个系列(N和S),N系列对应基础组块,S系列对应嵌套定制组块。我把一个系列的主系列称为主版,把子系列称为子版。N系列的一个子版大概有50个页面,每个页面又包含三种样式,每个系列中大概有20个子系列。工程量很大,大致算了一下,要做完两个大系列(N和S)需要做:50(页面)x3(样式)x20(系列数)x2(大系列类别)=6000(页面)。

以上简单描述的这些工作,目前都是我一个人在做,这东西成型以后,做一套网站(从前期到上线),最快只需要15分钟。而我做它的目的也很简单,就是希望帮助企业竖立品牌形象,并用专业知识解决他们所面临的问题,质量高价格低。我的信仰是帮助企业或个人实现社会价值,赋予企业或个人一定的能力,让他们为这个社会做一定的贡献,履行一定的社会责任。先利他再利己,集体利益和集体主义优先。从成本评估到定价,我是不赚钱,但只要我能活着,就一定履行我的社会责任。

说的有点多了,言归正传,这章其实不难,但有些基础知识需要细心讲解,对于有些设计师而言废话较多,但对于新手而言却有可学之处,多多体谅一下吧。

目录

1.网格基数的设置

2.按钮的基础规范

3.按钮的字符限制

4.按钮的交互状态

1.网格基数的设置

这里的网格不是平面设计中的网格系统,是包含在绘图工具中的网格功能,虽然它俩在本质上是相同的,但现在先不要给它俩做过多的区分。用绘图工具绘制网格能帮助我们约束模块,使模块的比例存在一定的关系。例如我就拿尺寸大小为137×31的按钮A,和尺寸大小为128×32的按钮B举例,尺寸大小为137×31的按钮A是不规范的,宽137和高31是不存在比例关系的。而尺寸大小为128×32的按钮B就是规范的,宽128和高32不仅是倍数关系(128/32=4倍),而且两个数都可以整除我们在全局中设的基数4(32/4=8,128/4=32,这里的4为基数)。




当我们理解了按钮的比例关系后,我们就要在绘图工具中(AI、Ps、Sketch、Affinity Designer)找到我们的网格功能,设一个数为基准,定其为基数,然后按照这个基数来进行按钮的绘制,按钮就相对是比较规范的。因为设置完一个基数后,只要你在网格上画按钮,都是存在一定的比例关系的。那如何用绘图工具设置网格基数呢,在Ps绘图工具中找到:【编辑】-【首选项】-【参考线、网格和切片】- 弹出首选项对话框 -【网格 – 网格线间隔 / 子网格】- 网格线间隔设为【4】- 子网格设为【1】;




在Affinity Designer矢量工具中找到:【视图】-【网格和轴管理器】- 弹出网格和吸附轴对话框 -【基本】- 间距设为【4】- 分割设为【1】。这里为什么要把网格基数设置为【4】呢。这是谷歌Material Design绘制小组件的规范,而模块之间定义的基数则为【8】,这里的度量单位是DP,平时绘制网页的话单位用px像素就可以。




2.按钮的基础规范

当我们会运用绘图工具中的网格功能,设置基数来绘制按钮,用熟练了就会相当讲究,每一个细小的间距都应该符合倍数关系,不仅物理位置上能得到统一,视觉上也能满足一定的美感,例如下图所示。




当我们理解了如何用网格功能绘制一个按钮后,接下来就可以理解按钮的边角的曲率设置了。那我把按钮的边角分为三种样式:直角、曲率圆角和圆角。直角就是边角呈90度的角,曲率圆角和圆角的差别在于,曲率圆角的角弧度没有那么大,而圆角的角弧度就是一半个圆。我将按钮的曲率按照不同的样式分布展示了出来,如下图所示。




理解了按钮边角的三种样式,要怎么设置他们呢。直角设置无曲率/90度直角。圆角就设置为50%的曲率,刚好就是半个圆。而曲率圆角就稍微有点麻烦,因为曲率圆角是要根据按钮的大小做相对的变化的。按钮的尺寸变大曲率就应该也随之变大,按钮尺寸越大差异越明显。另外曲率弧度的值也应该有一定的倍数关系或基数关系,例如:4/8/16, 4/6/8,4/8/12,都是可取的。




理解了如何设置网格基数,如何设置圆角的曲率,就要讲到按钮的常用尺寸了,要注意的是这个常用尺寸是基于Web端的,道理是相同的,就看设计师如何在移动端上进行设置了。常用的按钮尺寸有:24px、32px、40px、48px,超出48px的按钮都属于特殊按钮,需要进行单独设置的。




这里的尺寸不是死的,设计师可以根据自己的理解进行尺寸的设置。而采用这几个尺寸(24px、32px、40px、48px)的目的是更好的统一并规范按钮,因为24px、32px、40px、48px都是4的倍数,数与数之间也都是±8的关系,另外在绘制按钮时尺寸也可以平分,留出按钮上下均等的距离,另外这几个数值从Web端的体验上来看,比例也是相对更合适的,所以采用这几个数较为规范一些。




3.按钮的字符限制

一个按钮包含和“无图标”和“有图标”两种形式,无图标比较好处理,直接把相应文本放在按钮中水平、垂直居中就可以了,然后再算清文本与边框之间的距离就可以了。




那设计有图标的按钮时,就要考虑把图标的内边距算出来,并与图标到按钮外边距的距离算出来。




当我们掌握的以上几种绘制按钮的方法,就可以绘制出一整套符合规范的按钮组件。




英文也一样,英文与中文的差别在于细微的尺寸差异。英文字体结构要比中文字体结构看上去更小一些,英文的字符长度也要比中文长很多。但问题不大,只要把控好文本/图标和按钮边角的距离,按照基数递增,就不会有什么问题。




4.按钮的交互状态

一个按钮的交互状态有四种,分布是:无状态、hover(触碰)、点击后、禁止。采用的配色可以递增(由浅到深),也可以递减(由深到浅)。按钮交互状态的配色深浅也是根据整体页面有关的。如果整体的调性偏深,配色可以递减(由深到浅),如果整体的调性偏浅,配色可以递增(由浅到深)。




而颜色按钮的交互状态是根据配色的色阶决定的,同理配色递增(由浅到深),配色递减(由深到浅)。




另外附上一张彩色按钮状态效果图,配色为明亮柔和。





这些按钮的绘制看似简单的不得了,其实都是些高精度的工作,差一个像素点都不可以,当然更需要具备一定的毅力与耐心。我觉得做设计应该追求,重视体验和功能,让形式追随内容,而不是内容追随形式,就这样吧。

蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计

设计思维工作坊—头脑风暴法

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

在我们的设计工作当中最不可缺乏的就是创意了,那这种创意是从何而来呢?当我们拿到一个项目时最熟悉不过的流程的就是小组讨论,那小组讨论中占据大部分的就是“头脑风暴”了,我们先来系统介绍一下头脑风暴。 

【一】什么是头脑风暴法?

头脑风暴法(Brain storming), 该方法主要由价值工程工作小组人员在正常融洽和不受任何限制的气氛中以会议形式进行讨论、座谈,打破常规,积极思考,畅所欲言,充分发表看法。它最早是精神病理学上的用语,指精神病患者的精神错乱状态而言的,如今转而为无限制的自由联想和讨论,其目的在于产生新观念或激发创新设想。 

 

【二】头脑风暴法的组织形式

1)设主持人一名,主持人只主持会议

2)设置记录员1-2名,要求认真将与会者每一设想不论好坏都完整记录下来

3)小组人数一般为6-10人

4)最好由不同专业或不同岗位者组成

5)时间一般为20-60分钟;(发散/收敛/整理3回合)

主持人和主持的注意事项:

1)提前了解会议主题及可能的引言内容

2)控制好自己主持人的气场

3)控制好时间

4)照顾好每一位成员;让每个人都能发言

5)引导会议流畅展开

6)保持团队积极参与气氛

7)适度延伸发展发言者的想法

8)随机应变   

【三】头脑风暴法遵循的主要原则

       (1)自由奔放思考

         

       2)不批判

         

       3)以量求质

         

       (4)搭便车,想法无专利

        

焦点时刻: 

      蓝蓝设计组织部分小组成员以“如何成为一家很牛的UI设计公司?”为主题进行了一次头脑风暴活动。我们将过程做了一下梳理。 

   (1)主持人引言之后,与会者每个人进行了积极地思考并将想法写在便利贴上

        

   (2)每人根据自己的想法畅所欲言,并延伸其他人的想法。

   (3)将便利贴适度的分类整理。

        

   (4)最后我们整理出来了结果(wow!/有了更好/基础的     

     

             



总结: 

脑力激荡并不是为了提出主意让他人去评估和选择。通常在最后阶段,本组成员会自己评估这些主意并从中挑选出解决问题的方法贯彻整个解决方案的每一步都必须对小组成员透明,并有责任分配给每一人以便他们在其中担任重要的角色。在项目还未明朗时,必须有一个共同的决策过程来推进协作努力的成果并对任务进行重新分配。在重要转折点上,需要有评判标准来决定小组讨论是否朝着最终的答案行进。在整个过程中需要不断的鼓励,以便让参与者保持他们的热情。

 通过这个过程,员工的亲身参与,对“很棒的UI设计公司”的定义,再落实行动,向着WOW的方面努力!

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计

信息的阻力设计

涛涛

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

什么是阻力?


用户使用App时需要穿越层层页面,在穿越这些页面时需要消耗时间和精力,称之为阻力。


首先探讨一下品类方面的阻力。


Image title


如图,这是几个电商App界面,一眼望过去并不知道哪个页面是哪家电商,其实这个并不重要。如果你到一个平台购物,往往不是因为线上产品用户体验不一样,而是因为卖的商品不一样,或者商品的价格亦或配送速度不一样。所以这里它们长的一样我觉得没有太大问题,甚至我认为他们之间雷同是一件好事,用户省去了切换的成本,尤其是新平台跟老平台长得像都是没什么问题的,这样用户切换新平台阻力就小了很多。


但是当我们需要定义一个新品类时,这个思路就会不一样。



定义新品类


举个例子,国际化品牌Airbnb,在2014年的改版中做了很大的调整,这次改版后发现,要找房子下单,搜索浏览和操作效率并不是很高,但是他们还是做了这种低效高颜值的选择。


Image title


对大多数人来说,私人房屋短租给其他人的这种服务是个新产品,是高端还是低端用户其实没有概念。所以在2014年Airbnb重新推广的时候,他的设计理念是各位房客先别管这个产品是什么样的模式,先说这个事情是不是看起来很酷。是不是酷这件事对于一个新产品是重要的,如果我用过一个酷的产品,分享给朋友。对方往往也会因为我分享的产品酷而觉得我这个人很酷。有些实用性还不错但是品牌调性没那么高的产品,用户使用完后会觉得“把这个产品分享给别人,并不会给我加分”而止步分享。鉴于此,我认为Airbnb高颜值虽然一定程度上牺牲了效率,但是拔高了品牌调性,也就提高了产品的推荐值,是一个正确的选择。


那么当我们需要重新定义一个已有品类时,我们的思路是什么呢?



重新定义品类


Image title



这是我们2016年发版的首页设计,自如和跟之前的租房平台不太一样,所以我们的首页设计要重新定义一个品类。以前,尤其是我们80后对于租房会有什么样的感受都是有一些认知的,比如说黑中介…其实大家都有一些印象,被坑过的80后不在少数。自如出现的时候可能就需要重新整理大家对于这个品类的认知。所以我们在设计首页的时候,先用一个高颜值大图展现一下房子是什么样子(因为我们的房子确实颜值很高品质不错),搜索按纽也不是很大。所传达的思路是我们希望用户在找房子之前对我们的平台有些认知,或者说对租房这个品类,打破固有的刻板印象,有重新的认知。我把这种重新定义已有品类的设计方法定义为“我们不一样”。



在今年,自如的影响力大了很多,在这个背景下我们进行了新一轮的改版。虽然从用户的角度讲可能进APP第一件事是要找房子,但是从企业的角度,企业有很多想要传达给用户的信息,这个页面也是让用户知晓其他业务的入口(自如给大多数人的印象是一个租房平台,但是我们也有像保洁,搬家这类的服务)这些入口也许用户当时不会点击,可是当他需要用保洁,或者搬家的时候就会想到好像自如有这么一个业务,之后他会去自如的首页找。所以多条业务线的并列呈现,也有类似广告曝光的作用。


Image title


我用这张图来代替我们的原型图,我们要展现多条用户线的时候很依赖于这个界面上的多个按纽,当时就想能不能顺着这个思路在尽可能的情况下做的好看一点。我们之所以觉得这个界面给你的感觉没那么好,是因为这个界面信息量太大了,还有色彩的冲撞过猛了。 


我觉得色彩的间隙太小了,应该加大,所以加了一些白框,让这些颜色之间离的更远,颜色间的冲撞也就比较小。


Image title


然后再看这个颜色本身,我们是不是可以选一些相对共性的颜色,比如把标准的红绿蓝改成红,暖绿,和偏绿的蓝(暖蓝),然后把选中的颜色找他的扩展色,用扩展色画出一些按纽。


Image title


这就是我们后来首页的样子。



低频应用的阻力设计


作为一个低频使用的App,跟高频使用的App阻力设计思路最重要的不同点是什么呢?我从学习成本这点来切入。



学习成本


微信的聊天记录删除功能,有一点学习成本。


Image title


用户在使用中偶尔向左滑发现了可以删除聊天记录,通过偶尔的触发,用户学会了这样删除聊天记录。通过后期每天不断地使用强化了对这个功能点的记忆。


但是我们的低频App似乎没有这个机会,由于使用次数比较少,有些功能隐藏起来的话用户大概率永远都不会去用。设计时不但要把点赞的按纽放出来,而且点赞的时候还要告诉用户,点赞后飘在右上角。


Image title


告诉用户收藏之后,收藏列表可以点击右上角这个按钮查看。我们不但要把所有的功能摆出来,而且还要告诉用户这个功能下一步怎么走。因为他如果这次没学会,以后可能也不会用这个App了,这点跟高频的产品不一样。



点击数据


我们设计首页的时候对于点击数据会有一个预期和目标,但是往往数据反馈会跟设计初衷多少有些不相符。大家可以猜一下哪是点击率最高的…在这里我只能告诉大家一个大概的排名。我们当初希望是租房的点击高一些,因为用户点击后可以了解我们有多少个租房产品,所以我们把它在视觉上设计的重了一些。但是其实搜索是排在他前面的,用户对于大面积的区域像banner这类东西是有免疫力的,所以不管做的多花哨其实用户会习惯性的忽略掉,也就是视觉中心和实际的交互中心不见得一样。合租在租房的前面,整租都可以在前面,看来用户还是比较仔细的看了我们的界面,而且可以断定大家对于合租是什么东西了解的很清晰。


Image title


可以看到,“租房”这个按纽我们刚开始设计的时候,感觉应该是高的,因为这个是总集,我们在后期的访问中发现用户认为这个是表示分类,所以设计的虽然明显,但是用户仍然认为这个不可点。



减少阻力


减少阻力,需要跟用户的预期相符。


租房按纽怎么做交互才能让用户感到顺畅?租房的按纽包括右边的四种,其实是个1.5级(介于一级页面和二级页面之间)的界面,所以点击左侧的租房,用户会进入“租房”页面。而右边的这四个Button应该还在,只是这四个按纽变成放大精细版。包括租房Button的底图,也是放大放在页面最上面,这跟用户的预期才比较一致。


Image title


从首页到列表,到详情再到下单及更深层的页面,页面的ICON和精细程度和用力程度都不一样,层级越深视觉冲击越轻。


Image title


如图,最右侧预约那一列,假设设计师有足够精力和时间,是否可以把最右侧的页面做的视觉更丰富,甚至跟首页一样?然而我们现在的规范里面仍然不允许做的更花哨,原因是我们认为在前半段的时候,用户需要一些阻力来提升注意力,从首页先认知这个租房APP跟他平时认知的不一样,接下来有一些信息的输入比如图片,再往后,如果一旦点约看或者是点签约,这时他的决策做好了,产品要做的事就是一步步往以最快的速度,完成这个事情,不要让他有任何的犹豫,不要让他分心,任何的分心都有一定的概率让这个流程中止甚至是终止。


Image title


如图,我把整个流程的信息阻力画了一个曲线,首页阻力是最大的,越往后越小,实质性的信息越多。决策前需要让用户提升注意力,所以信息量要大,表达要丰富。一旦决策后,信息的传达以最简洁的排他形式存在,让用户路径尽可能的缩短也让信息阻力尽可能的变小。


以上就是是我对信息阻力设计的整理,希望大家能够有所收获。

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

你的设计,用户真的看得懂吗?

涛涛

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

设计师经常犯的一个错误就是上帝视角,高估了用户的理解能力。一顿操作猛如虎,结果用户可能根本没看懂你的设计。

前段时间个人所得税app 上线,用户可以在线办理个税专项扣除申报。我自己也尝试使用了一波,在申请房贷利息抵扣的时候发现了一个问题。

在房贷信息模块里需要我输入证书编号,但是我根本不知道到底要哪个证书编号。输入提示非常的简洁,就三个字「请输入」,到底要输入什么?这样的表单在很多产品中都可以看到,让用户输入生日,但没有告知日期的格式。日期格式真的太多了,用户到底选择哪种?

设计师经常犯的一个错误就是上帝视角,高估了用户的理解能力。一顿操作猛如虎,结果用户可能根本没看懂你的设计。

更快:交互层

有的时候用户并不是看不懂你的设计,而是没时间看你的设计。如果我们做了一个抽奖活动,用户看了一眼主界面没有弄明白是怎么玩的,那么这个抽奖大概率是失败的。你或许会不服,我明明把活动规则已经写在下方了,可是用户根本不会看。因为他们真的很「懒」。

所以让「用户看懂你的设计」,首先我们应该做到「让用户更快的看懂」。我们需要提升信息的传递效率。

1. 信息可视化

俗话说「字不如表,表不如图」。用户对于具象元素(表格、插画、icon和图像等)的感知能力更强,具象元素也更能传递情绪。例如:道路两旁的路标多数是以图形为主体的。这是因为在车子高速行驶的过程中,司机没有足够的时间阅读标示上的文字。

场均122.4分,30.6个助攻,45.0个篮板……这些数据对于我们来说只是冷冰冰的数字,我们很难理解其背后的含义。雷达图对球队数据进行了可视化处理,提升了信息的可读性。因为相较于纯文本,大脑处理图形的速度要快得多。

以谷歌日历为例,如果我要做瑜伽,那么就会在日程详情页配一个瑜伽垫的插画;如果我要跑步,那么就会配一幅跑鞋插画。用户甚至不用看文字,通过插画上所描绘的场景就可以知道自己接下来的行程。用户可以更快地看懂。

2. 合适的组件

选择合适的组件可以降低用户的学习和操作成本。以上面的生日为例,与其通过输入提示告诉用户日期格式,还不如直接给用户提供一个日期组件。

多数的选择场景中我们都会使用底部动作栏来承载选项,如选择优惠券/银行卡。参考了一些产品,发现他们都在底部加上了关闭/确定按钮。我们不妨来思考:动作栏界面底部需不需要提供关闭/确定按钮?

决定一个元素的去留,我们需要明白它的作用是否可以被替代。底部的按钮是供用户点击关闭底部动作栏的,光看「关闭动作栏」这个动作,底部按钮并不具备不可替代性。因为点击上方的空白区域或者把关闭按钮放在右上角都可以关闭动作栏。

这样一看,底部的按钮是可以删除的。那为什么其他的产品都保留了呢?因为我们忽视了组件的信息属性,我们没有考虑如果没有它是否会对用户了解系统当前的状态造成影响。

没有底部的按钮,用户无法确定底部动作栏是否正常加载。用户不知道我是只有一张银行卡还是只加载出来一张银行卡。

更准:文案层

前段时间去体检,发现排队显示屏中有的人前面有咖啡图标,有的人没有。好奇的我特地找护士问了一下,发现咖啡意味着接下来的体检项目不需要空腹,你可以去吃早饭了。图标的确很简洁,可是有多少人看到这个咖啡图标会立刻意识到自己可以吃早饭了呢?

过度追求信息传递的效率,而忽视了精度,从一个极端走向另一个极端——简洁易懂的文案是保障信息准确性的重要措施。

前段时间针对报错文案做了一个梳理,发现了一些文案中的共性问题。

1. 没有提供解决方案

一个合格的报错文案应该由:报错场景、报错原因和解决方案共同构成。首先告知用户具体遇到了什么样的报错场景并且解释原因,最后提供解决方案。多数文案都只做到第一步,只描述了报错场景,这并不能满足用户的需要。

  • 如果照片上传失败,用户需要知道是因为格式不对还是图片太大了。
  • 如果因为系统升级,导致服务暂停,用户需要知道什么时候可以再次提供服务。
  • 如果把报错场景看成是一个坑,那么报错文案应该告诉用户你掉进了一个什么样的坑,为什么掉进来以及怎么样才能爬出去。

2. 拥抱数字

多数的文案都不爱提供数字,用户能获取的信息也比较模糊。我们尽量给用户提供准确的数字,包括时间、金额、次数等,让用户对当前的状态有一个准确的认识。

输入手势密码错误是有次数限制的,可是你并没有告诉用户今天还剩几次机会。

我们经常会遇到资料审核的场景,最常见的方法就是告诉用户「资料审核中」,非常的省事。但是用户会疑惑到底要审核多久,给用户提供一个大致的审核时间,让用户有目的的去等待。

备胎:在线客服

如果前面两个方法都不能解决用户的疑问,那么我们只好给用户提供在线客服了。

1. 入口的必要性和统一性

客服的入口一般在首页或者用户的个人信息页,除此之外我们需要在用户有客服诉求的场景中给用户提供客服入口。如果不提供入口,用户遇到问题就要返回到首页或者我的页会很繁琐。如果用户在一个表单页中录入信息,突然对某一项内容不确定,返回到首页找客服咨询。这样可能会导致用户之前填写的信息丢失,用户需要重新输入一遍。

以下图为例,这是一个借款的表单页,用户在这里录入借款信息。我们会给用户推荐一款借款人安全险的保险产品,提示文案是「保费60元,贷款利息可节约55.33元」。

但是用户反馈不知道这个60元的保费是一次性扣除还是每月都会收取,并且这个利息节省是什么意思。因为对收费标准不确定,用户的购买意愿也会受到影响。这里的文案表述不清楚,我们可以给用户提供一个客服的入口。

因为在线客服是一个共有的模块,不同的业务线都可能会调用。那么在入口的设计上,我们需要注意一致性。当然我们也不能过于死板的追求一致性,因为不同场景用户对于客服的诉求是不一样的。就以支付宝为例,生活缴费和蚂蚁借呗两者在线客服的入口是不一样的。

因为相对来说,用户对借钱的场景更加敏感,有更多的疑问去确认。这笔贷款的利率怎么算的?还款方式是怎么样的?会不会影响我的个人征信?所以在借呗页中,用户对于客服的诉求更高,所以在布局上会放在更加显眼的位置。

2. 对话式交互

用户进入客服系统不意味着立马可以跟客服小姐姐聊天。咨询问题一般会经历以下几个步骤:

  • 提供猜你想问的问题;
  • 客服机器人;
  • 真人客服。

以支付宝为例,首先会根据你的来源给你推荐你可能想问的问题。例如:你从充值中心进入客服,首先会给你推荐充值缴费相关的问题。

如果提供的问题列表里没有用户想问的,用户就需要手动去查找问题。这时客服机器人登场,根据你输入的关键词,给你提供相应的解决方案。如果客服机器人不能解决你的问题,那么可以召唤真人客服来帮你解答。

京东金融与支付宝的客服流程大同小异,其中的一个区别在于它额外提供搜索框来查找问题,而支付宝是通过对话式交互来查找问题。

对话式交互也是近年来比较热门的一个话题。对话式交互主要的优点在于学习成本低,我们现有的交互体系都是建立在人工智能不够智能的基础上。如果足够的智能,未来的产品界面可能就是两个对话框,你只要打出或者说出你的需求就可以了。

年初一下午我要看韩寒的新电影,帮我预定一张票。系统根据你的行程和之前的观影记录,猜测出你当天观影的影院和时间顺便根据你的喜好选好座位,生成了一个订单或者同时生成好几个订单供你选择,你确认一下就可以。

当然这只是一种设想,目前的技术还无法实现,系统无法真正分析出用户的真实意图并且做出反馈。例如,在现实人与人的对话中,同样的一句话,不同的语境下有着不同的意思。

把这个场景带入客服中,我们输入「修改」可以发现有这么多相关的问题。如果我从白条页面中进入客服,我输入「修改」,那么应该优先从白条相关的问题中筛选出与「修改」相关的问题。而目前来说,不管从哪个模块进入客服,输入「修改」给你推荐的问题都是一样的,没有考虑语境。在这种不够智能的情况下,对搜索结果的展示上传统的搜索框模式更加合适。

总结

以上是我简单的分析和总结,如果你有不同的看法和建议欢迎留言。


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

 

2019广告营销案例抢先看

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

 

2018年已过,转眼又到了2019,但营销圈中战火从未消停过……

2018年各大品牌营销玩出了新花样,优秀的营销案例层出不穷,揽获了众人的芳心。

面对2019新的一年到来,各大品牌当然也不会放过一个大好的借势营销黄金机会,都争先恐后搭上了这趟“借势营销”的顺风车,为打响2019年第一炮,自然是无可厚非的。

然而,迎来2019新年,各品牌纷纷借势“耍花招”,精彩不输往年,各种多元化新玩法碰撞在一起产生了巨大的火花,再次燃烧整个营销界。因此,在这个竞争激烈的营销战场上,频繁出现了众多品牌活跃的身影,各种刷屏级的案例也相继诞生。

下面为大家盘点的刷屏案例,看看这些品牌都是如何借助“新年”这个热点事件的势能,迅速抢占超级流量,赚足众人的眼球?

特仑苏

主题文案:更好的2019,做更好的自己!

点评:往年的特仑苏代言人只有陈道明、靳东,而今年又有两位新代言人加入特仑苏——张钧甯和邓伦。特仑苏邀请了这四大代言人共同拍摄了2019广告,又以一个全新的面孔面向用户。

广告中花式植入产品,将产品巧妙融入到画面情境中,以达到潜移默化的宣传效果,顺理成章地符合了产品植入讲究“随风潜入夜,润物细无声”的最高境界。

四大代言人共同拍摄广告,无疑是突破了传统的广告模式,强大阵容助阵,可大大体现出明星在营销中的号召力与影响力,明星背后带着庞大的粉丝群体,推动这次广告更广泛地覆盖目标受众。加大了此次广告营销的宣传力度,从中也表达了特仑苏坚持“从更好的开始”的品牌主张。其次,对于用户而言,特仑苏这波新年广告带给大家更多的是惊喜与新年的美好祝愿:更好的2019,努力做更好的自己。

京东白条

主题文案:“一点当典行”网红店横空出世

点评:就在2018年尾声已敲响时,京东白条又出来“搞事情”了,竟然在京城“四大凶宅之首”—— 朝内81号开了快闪店,使得拥有百年历史的“京城第一鬼宅”, 摇身一变,成为了一家网红店,吸引众多时尚潮人前来打卡,深夜排队的壮观场面实在令人惊叹。

京东白条精准洞察年轻人现实痛点和情感需求,以及抓住了他们的猎奇心理,将无数传说的冒险胜地——朝内81号,首次改造成京东白条“一点当典行”,为大众提供了全新的刺激潮玩体验。让年轻人通过【当与换】的仪式感,把负能量、情绪、杂念统统“分期”丢掉,切身感受“一点改变,好过一成不变”,告别社畜、废青的过去,获得新生,在2019开始更好的人生。

京东白条“一点当典行”网红店的问世,可谓打破传统印象中的金融理财玩法和当铺玩法,从一点事务局到一点当典行,京东金融始终在突破体系和行业的限定,持续打造坐拥“潮人”人设的品牌。同时也彰显出一个拥有年轻人的潮玩精神、有温度的品牌,更有效建立了品牌与用户深度沟通的情感纽带。不得不说,这一反常态玩起时尚新潮,简直是颠覆了人们对京东白条的印象,京东白条这波营销实在是妙!

据悉,2019年将会有5期系列活动陆续落地全国,既佛系又丧的年轻人,不可错过!

OLAY

主题文案:下一站,无惧年龄

点评:新的一年里,BBDO广州携手OLAY,带来无惧年龄的《下一站》,OLAY这支反逼婚广告,戳中了多少人的心窝?相信,给了你不少启发。

广告中讲述的是一个发生在“年龄列车”上的故事,女主手握一张名为“年龄”的车票,正在寻找着自己的位置,突然惊奇发现这里的车厢都是按照年龄划分的。通过这极为扎心的故事情节激发更多“大龄剩女”的思考,但也引发了更多女性产生坚定的想法,不应该因为年龄而仓促步入婚姻的殿堂。

其实,这一广告刷屏朋友圈,那是因为这广告基于对女性的心理洞察,找准众多女性的痛点,让人产生强烈的代入感,更能给予女性启发,正确面对自己的每一个年龄阶段。由始至终,OLAY给人传达了一种“不畏年龄,勇敢做最真实的自己”的精神,无形中体现了OLAY对用户的最切实的关怀,使得其品牌深得人心。

迪士尼

主题文案:“梦想成真”

点评:迎来新的一年,这支由迪士尼推出的暖心广告正式上线后,获得众多网友的一致好评,都称这已被故事中的“小白鸭”所吸引。

广告片讲述了一只小白鸭费尽千辛万苦,终于和偶像唐老鸭见面的故事。以呆萌的“小白鸭”形象,然后制造感人的故事,直击用户的内心深处的情感,从而引起用户的共鸣,加强了用户对品牌的认同感。

这次广告贴合了现实生活,从用户的情感出发,唤醒人们的梦想,不忘初心,勇往直前,因此,迪士尼给人传递的不只是对美好生活的向往,更多的是对梦想的追求与执着。还有向用户表达了:尽管我们都长大了,迪士尼还在守护我们最童真的梦想。所以,迪士尼通过这一波触动人心的情感营销,为品牌与用户之间架起了一座真正的情感桥梁。

荣耀手机

手机性能测试

(扫描二维码观看视频)

点评:说到手机的耐摔性,很多人都会想到诺基亚,但诺基亚在现如今的手机市场普及性明显不如其他品牌。而在今年,荣耀手机开始耍出了新招——推出一创意广告,铁证荣耀手机才是“坚强者”。

这是一支荣耀测试手机性能的宣传片,让手机历经各种考验,包括油烟考验、零下40度的超低温测试、高达55度的超高温测试、残酷的刮擦实验等,最后用结果彰显:荣耀手机的性能强大。

所以,荣耀手机通过展示这优质的手机性能来加强用户对其产品的认知,刷新用户的荣耀手机原有的印象。从用户的角度考虑,用实验证明,体现产品的最大价值,从而满足用户对手机产品的各种需求,也引导用户对荣耀手机产生正面的认识。最后也突显了“生活中1%的可能,也要100%的做到”的品牌理念,然而,既有可看性,又“用实力说话”的产品广告,自然会把人征服得心服口服。

网易云音乐

主题文案:“遇见你真好”年度听歌报告

点评:2018年的网易云音乐的年度报告,居然在2019年的第四天才迟到出现,网易云音乐的“遇见你真好”年度听歌报告,又双叒叕刷屏了……

众所周知,网易云音乐于2013年4月23日正式发布,也是国内首个以“歌单”作为核心架构的音乐APP,每次网易云音乐的营销与“走心”产生了密不可分的关系,大众千呼万唤始出来的网易云音乐年度总结报告终于出来了,虽然QQ音乐、酷狗音乐也在年前亮出了年度音乐总结,但偏偏是网易云音乐的年度听歌报告刷屏了。

这次的年度总结,满足了用户对音乐的需求,也满足了一些有情怀的用户,而且其歌单给予用户满满的成就感,轻易地完成了一次阶段总结。吸引更多用户参与其中,纷纷晒出自己的年度歌单报告,使得这次网易云的年度听歌报告,引发了广泛的传播。

屈臣氏

主题文案:“做自己,美有道理”

(扫描二维码观看视频)

点评:就在2019年到来的钟声一响起,大家便纷纷立了新的flag,而屈臣氏上线的H5,彰显着“做自己,美有道理”的品牌主张,刚好迎合了各大女性在新的年“追求更完美的自己”的美好愿望。

视频中的“四位小姐姐”show出了“不跟随、不妥协、不伪装”的模样,还有人的语言配合动感的画面,折射出现实生活中年轻女生渴望表达自我,追求个性与态度。呼唤大家在新的一年,立起了2019新flag。同样也展现了屈臣氏就是一个有态度的品牌。

只想说,在这2019新年之际,屈臣氏推出了这一波满满正能量的广告,能俘获用户的芳心也是毋庸置疑的了。

纵观以上品牌营销案例,可谓各有千秋,但共同点旨在使得品牌深入人心。

然而,众多品牌营销过程中需要从用户角度出发,都说,一个成功的营销,是因为“走心”,在传达品牌产品信息的同时,也能使得受众与品牌成功产生情感的共鸣,让用户更深刻地记住其品牌。

当然,我们也更期待2019,品牌主们能推出更多刷屏级的好案例。

蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计

关于产品的需求分析方法,这篇全帮你总结好了!

涛涛

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

随着互联网产品的不断向前发展,「产品设计导向」一类的概念已经不仅限于大公司中,在往日越来越注重「短期效率」的小公司也都纷纷开始注重产品设计方面的建设。

所谓的「产品设计导向」指的是产品建设之前要围绕着产品的立项、目标用户等等去规划产品的功能点,明确产品核心价值;在产品上线之后,通过数据分析和功能反馈,发掘更多的需求,去规划下一步的「功能增删改」,将产品的设计方向引导到更正确的位置,提升用户留存率,延伸挖掘出产品更多的可能。

另一方面,从现在的设计环境而言,对所有的设计师既是机遇,又是挑战。大量的 UI专用工具(Sketch、Principle、Flinto、Origami等)的出现,大大提升了产品前期 UI设计师的工作效率,所以现在「全链路思维」已经从刚出现时的「概念化思维」变成了「主流化趋势」。所以现在很多的 UI设计师在站酷发布自己的作品的时候大部分都喜欢加入一些产品前期分析(功能设计、用户画像等)内容。

但是很多设计师的分析环节明显就是为了证明「有」而去「做」,缺少了真正的分析部分。给我印象很深刻的就是之前看到的一个二手房买卖的UI设计作品,典型用户画像里主流用户是:「男、七十岁、目标是给自己的儿子购买婚房」。实际上这种所谓的产品分析流程对于设计师而言是没有任何帮助的,只是从形式上走个过场罢了。

本篇主要讲述产品设计中的一些分析方法,范围从「个人练习式设计」到「团队合作式运作」,适合初级产品经理、交互设计师,在工作中职能范围与产品规划有关的 UI设计师,想要学习产品设计的新人阅读。

产品运作流程概览

我遇到的比较普遍的问题是:很多设计师对于自己所在公司产品的运作流程并不是十分了解。这样会在你实际配合工作的时候感到无从下手。有的甚至于同一家公司的不同设计师对于产品设计方面的理解也不尽相同。所以说要从浅到深的学习产品功能设计,就必须先理清当前工作的常规流程,例如常见的产品运作流程。

上面是一个相对规范的产品开发流程,实际上你在看到上述流程图后,对照自己公司的情况,会发现有一些岗位上的缺失。出现这种情况最大的原因是因为很多公司会把一些职能进行合并用来节省成本,现在仍然有大多数的公司并没有交互设计师的岗位,但是交互设计的职能不代表没有,而是被产品经理或者视觉设计师兼任了。你需要明确团队中各个人负责的职能部分,才能更好地提升沟通效率。

个人思考方法(一):空·雨·伞

上面讲到了设计师的「全链路思维」现在已经成为了一种主流的观点,将来前期的铁三角「产品经理、交互设计师、UI设计师」很有可能结合变成是「交互视觉二合一」甚至是「产品交互视觉三合一」的状态。所以现在很多的设计师开始尝试自己去 DIY 一个需求或者做ReDesign 这样的设计,希望可以通过这样的方式完成自己跨领域能力的一个积累。但是当他们打开电脑的时候,大部分人会发现自己突然变得没有思路,从产品方向点确定到产品视觉产出之间出现了断层。

其实做过设计练习的人都知道,由于一些现实场景的不同,一些人在做设计练习的过程中会受到很多条件的局限,尤其是在孤立无援的情况下,你面对自己的练习作品往往会无从下手。当然,不同的场景下有不同的分析方法。

在团队协作的时候,分析方法要全面、严谨、反复推敲。

在个人练习的时候,分析方法要、直接、简化不必要的流程,以培养自己的分析能力为主。在这种场景下,空·雨·伞就是一个非常好的思考提升方法。

简单概述「空雨伞」思考方式:观察(事实) → 思考(内在) → 产出(解决方案)。

运用在设计上就是:发现痛点 → 思考原因 → 提出解决方案。「空·雨·伞」因为简单、成本低、易上手,可以作为设计入门培养思考能力的一种方法,但是在使用空·雨·伞的分析方法时需要结合一定的具体调研(或者轻量级的用户研究)相配合,不然又会变成一味的「拍脑门儿」式的主观臆测,对于分析能力提升没有丝毫帮助。

个人思考方法(二):逻辑树

逻辑树又称问题树、演绎树或分解树等。很多咨询公司分析问题最常使用的工具就是「逻辑树」。逻辑树是将问题的所有子问题分层罗列,从最高层开始,并逐步向下扩展。

简单来形容一下逻辑树:把一个已知问题当成树干,然后开始考虑这个问题和哪些相关问题或者子任务有关。每想到一点,就给这个问题(也就是树干)加一个「树枝」,并标明这个「树枝」代表什么问题。一个大的「树枝」上还可以有小的「树枝」,如此类推,找出问题的所有相关联项目。逻辑树主要是帮助你理清自己的思路,不进行重复和无关的思考。

如果你要运用逻辑树方法去分析产品,主要的一点在于学会细化拆解目标。

举个例子:在2017年我创建了自己的个人号,但在发布了一部分的文章之后,我开始意识到文章的可读性始终不高。在这个时候我们就可以按照逻辑树的分析方法去进行拆解分析,去发现自己提升的空间。

如上图,就是逻辑树最简单的一种场景应用。确定目标后向下进行拆分,拆分出三级逻辑树是比较容易的,甚至你可以沿着已经列出来的大纲继续深入细化,再拆分出更细更深层的各种提升点。

逻辑树分析法在个人作品中的主要作用是发散思维;在实际工作中的作用则是针对特定问题进行分析,理清思路。总而言之,是让你在分析的过程中更加有条理,避免重复思考。但是逻辑树分析也有一个缺陷,就是在逻辑树分析的过程中,根据现象分裂出子层级的步骤十分依赖你的认知能力,就如同做设计一样,当你感觉界面的视觉出现问题的时候,需要利用你学出来的知识去进行视觉优化,如果你对设计理论知识掌握程度并不是很强,那就不能采用逻辑树分析法解决问题。

总而言之,逻辑树分析法适用于对问题研究十分深入的情况下,如果你对当前的环境认知并不充足,那么就很容易走入歪路,跑偏主题。

实际项目:用户调研访谈

在一些实际项目中,用户调研是需求来源的主要渠道。提起用户调研,很多人会觉得这不属于 UI设计师应该做的事情。其实行业逐渐规范的现在,用户调研、分析需求的能力也成为了衡量 UI设计师能力的一个标准。现在的互联网产品种类繁多,从早期只做主流行业,到现在基本所有的冷门行业都有涉及。作为设计者,大多数设计师已经开始在设计的过程中心有余而力不足。

造成这种现象的主要原因是随着行业的细分以及范围的扩大,我们距离用户的真实场景偏离太远,导致我们在设计中很容易理所当然地赋予给用户大量无用的东西,偏离了用户所需要的主要轨道。因此对于很多的设计师来说,学会了解用户以及分析需求成为了十分重要的事情。

下面是我整理的在用户调研过程中的几点认知。

1. 保证调研的目标的准确性

我们需要明确,我们希望通过调研达到怎样的目的?例如:提升部分页面转化率,收集用户对于产品不满意的地方,通过用户使用产品发现用户潜在的痛点。

2. 有目标的选择用户

一般来讲互联网公司都有收集客户反馈的部门,他们掌握着所有客户的反馈意见。我们在选择调研用户的时候,最好可以根据我们在调研行动确立初期拟定的目标去选择调研目标。

3. 适当的准备调研内容

当我们确定了调研目标和调研用户之后,就可以根据现有状况去准备调研内容。调研内容一定是要在事先拟定好(开始调研之后根据实际情况进行改动)。

一般市场调研细分的维度通常有四种,分别是:地理、人口统计、行为、心理统计。运用在互联网产品里面就更加的复杂。以B端产品为例:我们在调研中可能要把调研对象分为客户(老板)和用户(业务员)去进行不同情况的信息跟踪,而且根据产品的属性不同,需要提前预设好调研内容的侧重。

4. 调研过程中

在调研过程中,我们可以适当结合上文讲述到的「空雨伞」方式去进行调研观察,收集用户需求。

在调研过程中,除了思考之外更多需要注意的是对用户洞察的记录与剖析,在记录用户行为的过程中,需要遵循「不干扰」、「不引导」、「记录客观」等原则,这样才可以保持用户行为记录的准确性。

5. 获取反馈整理结果

在调研结束后,我们应该产出一份完整的调查报告,按照本次调研预设目标进行整理,规划出合适的大纲,把调研收获转化为明确的产出,产出形式最好以报告(PPT、PDF),而不是口述或者微信消息,这两者之间差别很大。

需求归类:KANO模型

虽然说现在很多的公司都开始建立了用户体验类的部门,但是因为用户调研或者体验类的工作很难去量化产出。而且在大部分情况下当产品按照用户调研反馈的结果进行调整后,往往很少会出现我们幻想中的「逆袭」、「口碑急剧上升」,有时还会因为受到一部分用户观点的带偏导致产品口碑下降,用户表示不满;又或者会出现需求级规划混乱,重要功能反而后上线这种尴尬的情况。

所以这驱使着团队中负担「用户体验」职能的角色对用户需求进行正确的分类和排序。

这个时候就可以运用到卡诺模型(KANO模型)。

KANO模型是东京理工大学教授狩野纪昭(Noriaki Kano)发明的对用户需求分类和优先排序的有用工具,以分析用户需求对用户满意的影响为基础,体现了产品性能和用户满意之间的非线性关系。根据不同类型的质量特性与用户满意度之间的关系,狩野教授将产品服务的质量特性分为五类。

1. 基本型需求

用户对企业提供的产品或服务因素的基本要求。是用户认为产品「必须有」的属性或功能。当其特性不充足(不满足顾客需求)时,用户很不满意;当其特性充足(满足用户需求)时,用户也可能不会因而表现出满意。对于基本型需求,即使超过了用户的期望,但用户充其量达到满意,不会对此表现出更多的好感。

例如对于网盘类产品来说,用户的基本需求是能快速地上传和下载。如果下载速度达不到用户的期望,则用户满意度将一落千丈。对于顾客而言,这些需求是必须满足的,理所当然的。对于这类需求,企业的做法应该是注意不要在这方面失分,需要企业不断地调查和了解顾客需求,并通过合适的方法在产品中体现这些要求。

2. 期望型需求

提供该功能,用户满意度提高,如果不提供该功能,用户会感觉到不满。当然在这里要补充一句,这里的需求并不都是我们整理出的主观需求,也有可能是用户在使用的过程中产生的客观类需求,例如遇到不会的体验,需求得到响应时我们给的反馈。

例如对于一些 O2O类的产品,虽然做的都比较成熟,但是由于体量庞大的原因,偶尔也会受到糟糕的体验,用户在受到糟糕的体验之后往往会期望能通过反馈得到心理上的安慰。例如携程(旅程预计时间偏差)、美团(酒店体验差)、饿了么(用餐体验差)等。在用户遇到这种糟糕体验之后,期望能通过投诉建议获得官方的反馈,那么官方把这种问题解决的越圆满,用户的满意度也会随之提高。

3. 兴奋型需求

兴奋型需求又称魅力型需求,指的是不会被用户过分期望的需求。对于兴奋型需求,随着满足用户期望程度的增加,用户满意度也会急剧上升,但一旦得到满足,即使表现并不完善,用户表现出的满意状况也是非常高的。反之,即使在期望不满足时,用户也不会因而表现出明显的不满意。

4. 无差异型需求

不论提供与否,对用户体验无影响。是质量中既不好也不坏的方面,它们不会导致顾客满意或不满意。

5. 反向型需求

用户没有这个需求,提供后用户满意度反而会下降。

按照 KANO模型分析可以对收集到的产品需求进行分类,筛选掉一些不合理的需求。更好更有目的性的完成产品待办清单的记录。

最后

对于设计师来讲,不管是个人设计练习还是团队项目,都应该掌握一定的产品需求收集和分析的方法。如果你真的下定决心要向交互设计、用户体验方向发展,那就更需要下定一些功夫去学习相关的知识,学会形成自己的思考方法。一开始可能会很痛苦很累,但是如果一味的试图走捷径,最后只会得不偿失。

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


谷歌设计师:看起来很高大上的设计思维到底是什么?

涛涛

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

提到设计思维,我们大部分时间会把它理解成「用设计师的思维去设计」,但其实它并非一种思维,而是一种方法论。Interaction Design Foundation 把「设计思维」(DesignThinking)定义为一种可反复使用的模式,并要遵循「以人为本」的核心去了解用户,挑战老旧的思想和重新定义问题所在,并通过五个程序:共情(Empathise)、确定(Define)、形成概念(Ideate)、原型(Prototype)、测试(Test)来找出适当的解决方案。

△ 设计思维的五个步骤(图片来源:99U)

无论是创造一个新产品,或者是给现有的产品添加新功能,革新教育,改善一个企业的运营。设计思维(Design Thinking),这个存在了差不多半个世纪的方法论已经渗透到了各行各业。

前不久,Khoi Vinh(平面设计大神,前纽约时报的设计总监)在他的博客Subtraction.com 上面发表了一篇很有趣的文章《In defense of Design Thinking,Which is terrible》(为设计思维辩护)。这篇文章是他和 Natasha Jen「Pentagram(五角)合伙人之一,她在去年在99U上发表的演说《DesignThinking is Bullshit》(设计思维就是纯扯淡)引发了一波对设计思维的讨论,在第三届Phil Patton讲座上的交流记录总结,再加上他自己的一些感触而成。那时,我深度接触设计思维这个方法论也有段时间了。这篇文章以及 Natasha 的演讲引发了我对这套方法论的思考。就这个话题,我跟国内外的设计师朋友,产品项目经理进行了一些交流,加上本人的工作经历,跟大家谈谈我对这个方法论以及设计本身的看法。

△ 图片来源:https://www.subtraction.com

先总结一下两位大神的观点。Natasha 认为,设计不是一个线性的过程,它不能被简简单单流程化,并且可以运用在任何一个行业去解决任何问题。她还认为设计思维这个词盛行的现象是令人担忧的,设计思维里的五个环节中也完全缺乏了批判这个板块。而批判、总结,再加以改进设计方案是直接影响一个作品/产品成功与否的重要因素。所以,如果这种缺乏批判的设计(方法论)被越来越多的人接受并且加以使用,这有可能会导致设计的「下坡路」,而且会误导大众对设计本身的理解。所以在她看来,设计思维是纯扯淡的,除非她能看到一些真实存在的证据,证明设计思维的优点。Khoi 从非常客观的角度跟大家探究了设计思维,比如它让许多不同领域的人都能参与到设计,解决问题的过程当中(设计的一大功能就是解决问题 problem solving)。Khoi 从 Natasha 演讲里感觉到了她对设计民主化的一种恐惧,他认为 Natasha 觉得只有设计师才能设计,而且只有设计师应该设计。让非设计专业的人来设计会直接导致差设计的产生。Khoi 认为这种领土性质想法是有问题的。当更多人了解并且投入于设计当中后,并不会导致设计的整体质量下滑。如果能有更多非设计专业的人来解读设计并尝试设计,这其实对设计本身是非常好的。就像科技,当它被更多人学习,应用并加以改进之后,才会有更多的突破和革新,设计也应该如此。但是他也同意,设计思维是一把双刃剑,也有不足之处。比如它不可避免的方言性,和它促进设计民主化的效应力其实并不高。

对于他们两个所说的观点,我觉得都对。但是更准确的说,他们两者所提到的设计并不能相比,因为设计思维(方法论)与设计其实是两个非常不一样的东西,从名词上来说已经能嗅出它们的不同。

文章目录

  • Natasha Jen – 批判在哪里?
  • 为什么设计思维是纯扯淡?
  • 谷歌的设计冲刺
  • Khoi Vinh – 设计(思维)的方言性
  • 「当你都不会这门语言」的时候…
  • 「那就更别提去理解这门语言了」
  • 总结

Natasha Jen – 批判在哪里?

Natasha 所说的设计是设计师们通过自己的独特风格以及对当前的设计潮流的敏锐感觉来创造出满足客户/大众审美的作品。这里的设计,狭隘地来讲,可以定义为一种主观的行为。那么这个行为可以通过很多不同的方式实行。Natasha 本身作为一个非常成功的设计师,她对视觉的敏感是不用说的,在 Pentagram 这种设计巨头里,她也是创造设计潮流的那批人。「虽然我们公司涉及到的项目种类非常广,包括企业形象设计,展览设计,出版物,动态图形等等。我还是会用平面设计师来定义自己。」她的开场白「设计思维现在是个流行语。这就是问题所在,当今社会尤其是设计师圈子里,并没有很多对设计思维的批判。我认为像我这样非常在乎自己发布的作品质量的设计师们,真的应该好好思考一下设计思维的含义,以及它会给设计领域乃至社会带来的影响。」之后,Natasha 讲解了设计思维的五个环节以及通过在谷歌图片搜索「设计思维」得到的答案,也就是五个排列整齐的六角形以及密密麻麻的3M便利贴,风趣的总结了社会对设计思维的理解,并简单介绍了设计思维的由来。

△ 图片来源:https://99u.adobe.com/videos/55967/natasha-jen-design-thinking-is-bullshit#

什么是批判?如果你就读过设计学院,你肯定知道在设计过程中的每一个步骤,每一次讨论中,批判都是非常重要的。你提出一个创意,并展示出支持你创意的证据,然后在场的各位就开始各种建设性质的喷你。这才能真正促使你的提高啊,对吧?与此同时你也能开始真正掂量和反省,到底什么是好的?但是批判在设计思维里面完全不存在。──Natasha Jen

我完全同意她所说的,但是 Natasha 的设计并不是设计思维,设计也确实不是一个线性的流程。当然啦,打草稿,被喷,修改,再被喷,再修改,最终结束,大体有一个套路。这个设计也不完全能被模式化,并用于任何行业去解决任何问题。咱们再来看看设计思维的五个环节,里面真的没有批判么?其实也是有的,而且每一步都有批判,只是它存在的形式跟 Natasha 所讲的批判不一样。怎么讲?我马上跟你们慢慢道来。在那之前我们来看看设计思维到底扯淡在哪里。

为什么设计思维是纯扯淡?

设计思维为什么扯淡?同学们先要明白,设计思维并非是一种思维,它是一个方法论。那么这个方法论本身是没有正面也没有负面的。其实就看企业和团队如何使用这个方法论了。挪威设计师 Lillian Ayla Ersoy 发表的《为什么设计思维在走下坡路,我们应该做些什么?》一文中探究了这一话题。她提到了她近几年周游世界参加各种设计研讨会所看到的新发布的产品已经变得千篇一律。她提出,设计思维不应该是一种生产线。它其实应该促进新创意和解决问题的方案,如今的设计思维已经变成了一个差不多产品的生产线。平面设计,动效设计,情感设计等都在慢慢失去它们的价值,但是决定产品成功与否的重要因素也都是它们。这其实跟 Natasha 提到的观点非常相似,她认为对于很多企业来讲设计(思维)只是一个需要被打勾勾的盒子,并没有注重这个方法论能够带来的潜在价值。当一个团队发现一个可行的解决方案,却又只是发现了冰山一角的时候,就赶紧实现产品然后发布,并没有经过多轮的改进探究来让方案变得更加成熟。设计师们有时候也要为多个权益人展示进度和解释设计而头疼。权益人太多也会不必要的拖延设计的进度,让设计师们花费不必要的精力和时间。

设计师和创意人士所处的环境也是决定他们个人提升的重要因素,如果一个本身很有天赋的设计师把大部分的精力都花在给其他人解释TA的设计决定,而没有在自我深造上面的话,那么过几年TA的设计水平不会提高反而会下降。──Lillian Ayla Ersoy《为什么设计思维在走下坡路,我们应该做什么?》

创意环境,工作氛围很重要,我觉得不管是管理阶级或是我们这些手艺人都应该积极地为对方打造一种可持续发展的创意环境,这样才能推进创意的发展以及对我们本身实力的提高。

「刚刚发现到冰山一角之后,赶紧投入生产然后发布,然后赶紧失败,看看大众的反应。」和「没有真正的结束,只有没完没了的发布!」

我不知道国内的具体情况是什么,我也知道这肯定是极个别情况,但是上面这两句话让我想到一位在国内一家科技公司的朋友分享他工作经历的时候提到的,团队里设计了一个新功能之后赶紧实现,然后发布,用真实用户做实验,看看反应怎么样,行就接着来,然后根据用户回馈来改进方案,不行的话直接把这个功能取消,再想下一个功能。这种实验型的做法OK么,必须OK。结合团队所处的整体环境,包括市场,文化,以及用户对新科技/新产品的认知度/接受度的不同,设计、开发、发布的步骤有不同的套路和节奏是正常的。而且,通过测试所得来的回馈是对产品最好的批判。我觉得这种方法有一定的优势,这也有可能是国内的发展能如此迅速的因素之一吧。但是什么都是有利有弊的。那就是在这个节奏如此之快的过程中,我们作为设计师是否在逐渐丧失批判性思考的能力,设计不再是利用我们设计师本身的思维,以人为本的核心以及对视觉的敏感去解决用户的问题,而变成了一个纯粹的实验,然后通过用户测试/调查,再改变参数,再测试,如此反复最终产出一个理想的产品/功能。在这个过程中设计本身的价值有没有得到提升?长久来说,设计师对自己本身的看法会不会改变,甚至会不会丧失了对「设计」的信念,并因为这种机械化的创意模式而变得萎靡不振?如果真的这样下去估计设计师早晚也可以被自动化取代。

好的设计不是赶出来,也不完全是实验出来,好的设计需要足够时间,加上队员们积极的思考,突破,设想,测试所造出来的产物。

拿撰写动效规范来举个例子,前前后后参加不同的设计冲刺,收集证据,并反复提炼语言就花了差不多一年的时间。当然了,撰写动效规范与视觉设计不是一个东西,但是为了取得高质量的结果,两者步骤上面还是有相似之处的。我也是非常有幸能有我现在的工作环境,上司对我信任,队友们互相给予支持。我的经理为了方便我收集材料,让我尽可能多参加设计冲刺,了解其他的产品在干什么,未来的目标是什么,需要解决的问题是什么。我在撰写规范的同时,也会参与到决定这些产品的未来方向是什么的过程中,更重要的是在这个过程中更加了解动效设计到底是什么,动效规范应该怎样改进,怎么样设计动效以及它在现行科技领域的一个定位和走向。那么下面让我通过谷歌里的设计思维实践来证明,批判在设计思维里其实无处不在。

谷歌的设计冲刺

△ 图片来源:https://www.charitydigitalnews.co.uk

在谷歌里我们会定期做 Design Sprint(设计冲刺,时长通常为三天,利用这三天来集中精力解决UI/UX问题,并且总结出可执行的下一步。)它可以是为了解决一个产品的某一个功能的用户流程(User Journey)定一个大方向,也可以是为了让不同产品之间更好的相互合作而研制一套相同的设计框架。格式其实就跟设计思维一样。第一步,Empathize(共情)。在每一个 Design Sprint 的开始,我们都得要明白这次活动的目的,现在所面临的问题是什么。通常会有来自不同队伍的关于主题的演讲(LightningTalk,闪电说),其实批判从这里已经开始了。在听演讲内容的同时我们得把值得探究,改进的地方记录在便利贴上面(叫做How might we,我们能怎么样去……),这里批判的思考就已经开始了。而且由于组员们的专业不同,思维方式不同,在同一个关键点上面,设计师,工程师,项目经理,调研员所考虑的事情都是不一样的。在共情环节结束之后,我们会把这些便利贴贴在墙上,开始第二步,Define(确定)。把捕捉到的观点综合处理,归类,把大家达成共识认为重要的内容按照种类排好,再把不重要或不相关的内容除去。我们得批判的思考才能更好的分辨便利贴们之间的潜在关系,以及哪些保留,哪些需要被除。咱们再看下一环节,也就是 Ideate(形成概念),这里也是我认为是批判最多的一个环节。我们先会做一个叫做 Crazy Eight(就叫它疯狂8分钟吧)的小活动,针对需要解决的问题,每个组员在8分钟内想出8个点子,然后相互分享。接着全员投票,把最有可能成为解决方案的点子选出来加以点评并且定制出冲刺接下来的计划。之后,我们会安排固定的时间来分享我们的设计进度,在分享与展示的过程中,组员们就得给出建设性的批判。我作为动效设计师,需要思考在设计出来的界面之间符合活动主题范围内的潜在交互实践范例,找出界面与交互设计方面的漏洞,以动画的形式展现给大家并加以讲解。经过至少三轮的分享与改进,冲刺的最后一天的末尾,我们才会给利益相关人展示我们得出的结论。这就是我们的设计冲刺格式。我注意到的是,设计冲刺不是为了解决问题,而是在短时间内得出一个具象的结论/共识,以便之后的设计与开发。

那原型(Prototype)和测试(Testing)呢?是的,不是所有的设计冲刺都会涉及到原型与测试。工程师们在冲刺当中除了与我们设计师一起发散的思考之外,他们还会提出方案在实现方面的可能与局限。现在有很多工具可以非常迅速的制作出原型,原型也确实在展示设计漏洞方面有很大的用处,但是它也有局限性,比如在展示一些特定交互实例的时候,无法展现动效过程中具体发生了什么。比如说允许用户在过渡中途转向或返回,这种我没有在原型工具里看到,不知道大家有没有遇到过有这种功能的原型工具。再说如果能利用有限的时间尽可能多设计,为什么不呢?再说测试,其再经过几轮冲刺后,我发现,测试最好别在冲刺的时候做。一次冲刺只有三天,好钢用在刀刃上。文章上面提到过,测试也是一个很好的批判。通过测试原型所收集来的回馈,加上我们的分析并找出解决问题的机会所在,才能更好的改进产品/功能。当然不排除是因为谷歌的财大气粗,所以可以给原型和测试环节足够的时间和资源,让他们撒欢儿地玩耍。

所以这样看,其实在冲刺的过程中,批判是无处不在的。

关于 Natasha 有关设计思维属于纯扯淡就谈到这儿,下面看看 Khoi 的设计思维是把双刃剑的论断。

Khoi Vinh – 设计(思维)的方言性

设计思维使得来自不同领域的人一起合作解决问题。它促进了设计的民主化,让更多的人来了解设计。设计思维有很多正面的元素,但是当然也有它不好的地方。──Khoi Vinh 《Indefense of Design Thinking,Which is terrible》

△ Khoi Vinh 图片来源:https://www.designweek.co.uk

Khoi 的观点使我产生了许多共鸣。他在文中所提到的设计民主化,以及用工程领域的开源对科技的提升乃至对社会的影响,这个话题太大了,我就不聊了。但是从毕业到工作,我的经历可以好比从 Natasha 的设计思维是纯扯淡到设计思维是一把双刃剑的过程。我个人认为,因为设计思维本身作为方法论,它其实是中性的。所以与其说设计思维的方言性,应该是设计或者任何一种专业的方言性。

我们先来看看这两句话:

When you lack language,you also lack the capacity to understand.

当你都不会这门语言,那就更别提去理解这门语言了。──Khoi Vinh

还有:

抵押支持债券,次级抵押贷款,国际货币基金贷款划分的「部分」。听起来让人有点摸不着头脑对吧?这些词儿是不是让你觉得很无聊,甚至让你怀疑你的智商?呵呵,它们作用不过如此。华尔街那帮人特别喜欢用这种模棱两可的词语来让你觉得只有他们才能胜任他们的工作。也有可能,就是想把自己与其他人分割开来。── 电影《大空头》

电影《大空头》(The Big Short),里面的瑞恩·高斯林用上面这句话把 Khoi 所说的解释得淋漓尽致。Khoi 所说的也让我感触特别深刻。我认为他提到的这个是设计思维,也是设计双刃剑里最「锋利」的一面。先拿在用户体验这个专业的方言性举个例子。在谷歌刚入职的时候,我其实对这个岗位并不看好,干了个把月之后甚至开始跟朋友抱怨说谷歌里创意已死,只有古板的设计,办公室政治还有盲目的服从。因为那个时候我对动效设计这个专业的理解也只是停留在 UI动画制作上,对用户体验这整个专业那是七窍通六窍。那你们会问我是怎么进去的,当时他们雇佣我当合同工也只是让我制作动画素材。那时候,我并不知道,动效设计可以增加应用的连贯性(Continuity)和可用性 (Usability),促生心智模型(Mental Model),阐述界面中组件的空间关系(Spatial Relationship),主次关系(Hierarchy),以及暗示可执行交互动作(affordances)等等。

「当你都不会这门语言」的时候…

第一次参加设计冲刺,也是因为刚入职,所以并没有能真正参与到冲刺的过程当中,当时能做的就是帮设计师们制作动画素材,然后他们再研究设计中的漏洞。吊儿郎当的参加到冲刺第二天,开始第一轮的分享设计进程,一个来自瑞典的小哥开始讲解他们小组所做出的设计方案。我当时站在那里,真的一句都听不懂,所有词儿都知道是什么意思,但是放到一块儿我就不明白了。我以为是因为我的语言不达标,于是就问了站在旁边的一个美国本土小哥,他也是一个跟我有相似背景的动画师:「嘿,他在说什么?我听不懂啊。」意外的是,他竟然回答道:「我也不知道啊。」就是在那个点上,我被设计思维和用户体验狠狠的划了一刀。

单从用户体验来讲,得先学到多少的专有名词才能在这个专业里面轻松游走?直到现在,还是有很多专业术语会让我摸不着头脑。曾经读过一篇国内关于 Material Design 的文章,在评论区里看到这样一条评论:英文应该成为 UI设计师补习的第一个技能哎!之前在准备演讲的时候,我在翻译上面花了不少功夫。因为同一种组件用英文说是一个名词儿,但是用中文估计就不是直译那么简单了。举个例子,MaterialDesign 里面的旅游应用 Crane 使用了一个叫做「Back Drop」的组件。我当时给翻译成了「背幕」,之后觉得还是不妥所以干脆就不提这个组件了。后来跟礼包哥聊天的时候才发现这东西叫做「抽屉」。这里不是想说谁的名词儿才是官方的,只是觉得很有趣。

专业有方言性,不同团队其实也有。为了能更好的跟队友合作,不同团队都会不自觉的去创造一门「自己人」的语言。这也不纯粹限于语种的不同,举一个例子。我之前收到谷歌另外一个团队的动效问题,问我一个 Logo 动画在应用 Warm Start(暖开始)和 Cold Start(冷开始)之间的使用区别,当时我就迷茫了。就问道什么叫做暖开始和冷开始。后来解释说,暖开始就是你的应用已经是打开的状态下从别的应用回到该应用,而冷开始是从应用本身的关闭状态被打开。而我们队里,会直接说「When you open the app when it is closed/When you return to the app.(当你打开/回到这个应用的时候。)」 我其实就是觉得,你用来跟我解释「冷暖开始」的时间,都可以跟我说多少遍「当你打开/回到该应用」这句话呢?非得发明一些队外的人不明白的词句,还得再花更多的时间去解释,何必呢?

能说会道必须是一种能力,用天花乱坠的词语解释设计也并非易事。你也会发现,设计水平相当的时候,往往是那些听起来越「聪明」的人,越会说的人升迁越快。但是少一点逼格,多一点真诚,也绝非坏事啊。最近跟礼包哥交流,我问他关于对设计思维的看法,他提到了产品思维并解释道:「寻找用户痛点,刺激用户痒点,满足用户爽点。」就算你不是用户体验专业的,是否也能大概明白什么是产品思维?

我们都想让别人觉得我们很聪明,并用酷炫的语言还有别人不懂的专有名词讲解设计。这样众人会觉得设计是一种神秘的学科,不是什么人都可以做的。就像 Khoi 说的:「尤其是对于在广告机构,艺术工作室的自由设计师来讲,把设计的奥妙保护起来是正常的,毕竟设计师们有明确的利益动机嘛。」要是谁都懂我们的专业,都会干我们干的东西,那我们赚什么钱,吃什么去?不同专业的方言性绝对不可避免,你们也看到了,就连同公司内部队与队之间交流都存在困难。当然,我也不会说你必须得用大白话去解释你的专业。不过你可以试试看,跟你不是搞设计的朋友,聊聊设计,或者跟你爸妈解释一下你是干什么的,看看他们能不能明白。设计思维在设计民主化方面有一定的作用,但是它的效果真正有多少呢?国内外设计圈子还是相对来说比较小,大众对设计的认知度还是比较低,很大一部分原因是因为这种不可避免的「方言性」。当然还有好大一波儿认为「设计根本就是特别简单的东西,不值钱!」的人。

「那就更别提去理解这门语言了」

就好像你想要做出好的电脑动画,你得先要驾驭好电脑软件,不能让其变成你的绊脚石,然后才能更好地展示你的故事,构图,动画节奏等等。想要能够更好的跟队友们研讨工作,你得先懂得使用用户体验的语言。我因为从一开始对用户体验专业的知识缺失,不得不去读关于这方面的书籍与相关读物。现在已经养成了习惯,每天至少会拿出两个小时的时间在阅读上。但是讽刺的是,当我对这个方言掌握到一定程度,并能够跟同事交流甚至提出影响设计方案的建议的时候,我发现不但再没有觉得谷歌里创意已死,只有古板的设计,反而也能明白这个专业有意思的地方,并发现能够发挥创意的地方其实有很多。现在再看我之前的抱怨确实有点可笑。这也告诉我有时候如果不了解一个事物,还是少评论两句。

总结

设计思维会随着科技的发展不断进化。此文没有想定义设计思维是好是坏,只是呼吁大家用辩证的态度去对待设计思维,以及其他甚至还没出生的方法论。我们应该根据项目、团队的情况去选择不同的方法论,而且要更加注重设计的过程,学习怎样为不同的用户,交互情景做出适当的设计,并积极的思考。

设计思维只是一个起点,应该用它来激发新的创意和解决问题的方法,而不是一个加快产品生产速度的秘籍模式。

专业的方言性不可避免,在与其他队交流的时候,可以主动的解释一下「自己人」的语言,平时尽可能用易懂的词句解释设计思路。

一个团队,一个企业里每一员都有为对方打造一种可持续发展的创意环境的责任。

不知道大家对设计思维怎么看?设计再怎么说还是为解决问题而生,用什么方式去解决问题也只是设计的第一步。在2019年里,希望大家能用探究与批判的态度去看待设计和自己的工作。


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

 

日历

链接

个人资料

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

存档