设计管理与成长

如何自定义栅格系统

分享达人


栅格系统(grid systems)

规则的网格阵列来指导和规范网页中的版面布局以及信息分布。


基本原理

在网页设计中,把宽度为“W”的页面分割成n个网格单元“a”,每个单元与单元之间的间隙设为“i”,把“a+i”定义“A”。他们之间的关系如下:

W =(a×n)+(n-1)i

由于a+i=A,

可得:(A×n) – i = W

我们通常把a称为“柱”,对应代码中的Column;i称为“水槽”,对应代码中的Gutter;a+i=A称为“列”

设计栅格系统,本质就是定义a,i,n的数值。

UI设计中有一个通用做法,就是元素的宽度尽量是8的倍数,基于今天的大多数的网页设计,画板宽度都为1440px ,此时我们将a=24,i=24,n=24,这是一组简单美妙的数值,可算得W=(24x24)+23x24=47x24=1128px;将栅格居中于画板(偏置156px),此时的栅格系统如下:

1128栅格系统:

得到的这个栅格布局被广泛使用,比如站酷网首页:



观察计算公式W=1128=47x24=(24+23)x24,这里的47不是8的倍数,我们容易想到把它变成48,

将a=25,i=24,n=24,算得W=(24x24)+(25-1)x24=48x24=1152px;此时的栅格系统如下:

1152栅格系统:

这个栅格系统的美感在于,宽度W=48x24=1152px,两边的留白为画板1440px宽度的1/10等于144px。Ant Dseign中运用了此栅格:

以上两个栅格布局都是24栅格系统,使用24栅格系统的好处是,它可以轻松实现2等分、3等分、4等分、6等分、8等分、12等分,也可以进行1:2:1、   1:3:2、   1:2、 1:3  等不对称分割的布局。


除了最常见的24栅格布局外,也可进行36栅格布局,例如:

a=16,i=16,n=36,W=(16x36)+16x(36-1)=16x(36+35)=1136

1136栅格系统:

a=26,i=24,n=24,W=(26x24)+24x23=24x49=1176px

例如腾讯文档:

1176栅格系统:

“厂”型布局网页的栅格布局:

以上的网页布局都是瀑布式布局,在许多应用型网站中,常使用“厂”字布局,对于“厂”布局的网页,该如何设计合适的栅格系统呢?

我们可以先确定左侧菜单栏的宽度,例如飞书管理后台中左侧菜单栏的宽度为228px,在拉动浏览器时,这部分通常是不动的,再确定主体内容去和左侧菜单栏间的间隙,比如12px。

此时可以计算W=1440-228-12x2=1188。

使用24栅格系统时,12a+11i=1188,方程中有两个未知数,我们设定其中一个时,就可计算出另一个。另i=12,解

W =(a×n)+(n-1)i

1188=(ax24)+23x12

a=38

是帮助,而非限制

对开发者而言栅格是实现动态布局的手段,而设计师对于栅格的理解源自平面设计中的栅格,不应把栅格系统当成一种限制,而是帮助,也不用总是担心元素超出栅格。


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

文章来源:站酷   作者:
隔岸吃瓜

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

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

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

对于网页设计来说,栅格系统的使用,不仅可以让网页的信息呈现更加美观易读,更具可用性。而且,对于前端开发来说,网页将更加的灵活与规范。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

分享达人

但结束往往是另一种开始,从研究心得来看,任何一种横空出世的风格都能找到过去风格成分,只是当事人是否愿意承认而已,所以旧风格某程度而言能在新风格中获得新生。

新艺术平面风格总结

我们在此大致为新艺术运动做个“结案陈词”,首先这个名称源自法国,含义指“一切新出现的艺术”,单从这个定义来看,它的风格形式其实没有固定规范,但是当大家同处一个时代,经历同样变迁,艺术表达就必然有共性。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

法国“新艺术”平面设计

总体而言,新艺术运动平面设计风格能找到以下几点共性:

  • 崇尚曲线,主张学习自然,花卉枝蔓元素多,但也有一些国家例外。
  • 受日本浮世绘影响深刻,平涂技法是主流。
  • 插画是设计的核心,多数设计师本身都是插画家。

新艺术本质上属于风格群组,包含很多子分类,除了法国、美国等本身称作新艺术之外,其它国家多数有别称,比利时是“先锋派”,德国是“青年风格”,奥地利是“维也纳分离派”,意大利是“自由风格“,英国则是”格拉斯哥派“等等。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

美国地区的“新艺术”平面设计

新艺术风格如果以法国为正统,带给人的主要气质感受是:浪漫、柔美、悠闲。

而德国、维也纳跟英国区因为加入直线,显得阳刚一些,所以这三个地区的风格有时候会划分到“初期现代主义”部分去讨论,这些总结值得大家记下,有助于运用。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

英国区“格拉斯哥”风格平面设计

最简单的例子就是给甲方提供类似风格的设计时,可以谈一点历史故事,有时候有渊源就是有文化的代名词,品牌故事就是如此来的。

在新艺术运动的末期,整个社会发生了很大变化,比如资本主义国家产生内部阶级矛盾,贫富分化,经济急速发展等。

上一期说过,艺术与设计永远是时代的精神折射,在急剧变化的社会中,文化艺术界开始涌现各种现代主义运动,例如表现主义、立体主义、未来主义等,这些运动的发展明细详见史太浓「风格列传」系列,这里不重复去谈。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

表现主义风格平面设计

这些以绘画为核心的现代主义艺术运动对当时的平面设计发展产生巨大影响,逐渐形成本次要谈的主题“图画现代主义“(the Pictorial)。

这是一场发生在平面设计中的运动,以德国地区影响力最大,输出最多大咖,历史上单独将其称作“海报风格”(Plakastil),原因是以海报设计为主要载体,标志、包装、书籍一类都无法体现。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

“海报风格”平面设计

文章本天成,妙手偶得之

“海报风格“的主要特点就是简洁鲜明,主题突出、色彩扁平。

这种风格在过去历史当中难以想象,甲方看来也总感觉钱花得不值,因为留白特别多。

甲方一般也不清楚做减法比做加法难太多,这种特征其实在上一回谈意大利“自由风格“的时候,李昂内托·卡皮尔洛(Leonetto Cappiello )的作品中就已经初步具有。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

李昂内托的海报设计作品

但这种风格真正的奠基人是德国的卢锡安·伯恩哈塔(Lucian Bernhard),后面简称卢锡安,史太浓在翻译外语名字时候希望尽量像中文名,好记一点。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

卢锡安·伯恩哈塔

卢锡安同学也是自学成长的大神,1883 年时候他出生于德国斯图加特(奔驰汽车的总部就在这个城市),父亲经营工艺品生意,家境还不错,但经常出差不在家,回来的时候会带一些有意思的小物品送给卢锡安。

卢锡安从小贪玩,经常闯祸,比如戏弄老师这种事情也经常干,也父亲头疼不已。

但父亲发现儿子其实有艺术天赋,具体表现是喜欢用橡皮泥尝试做一些工艺品,而且对于讲述艺术的书籍、故事特别感兴趣。

在卢锡安 15 岁(1898 年)那年就因为爱摆弄惹得父亲非常生气,情况大致是这样的:当时德国慕尼黑举办室内装饰展览,卢锡安很兴奋的跑去看,现场带有现代气息的设计让他非常入迷,他自信满满的感觉自己可以做出来,于是决定回家实践。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

慕尼黑的室内装饰展览

恰好父亲那时候需要出差几天,机会从天而降,他找来小伙伴协助,将家里按自己的想法从新设计装饰了一遍,比如用鲜艳的油漆刷墙,是劳斯莱斯一类的拼色操作,再将一些他认为风格不符的家具扔掉,从新进行布局。

完成之后其实他并不满意,因为眼前的条件限制了很多想法的实现,我想到假设一个设计师对自己的设计结果不满意,那么去到甲方那边是肯定会出问题的,这叫“墨菲定律”,担心的事情 90%都会发生,到时自己一切的解释都变成掩饰。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

“海报风格”平面设计作品

果不其然,父亲回家看到房子面目全非之后大发雷霆,摩拳擦掌,大骂卢锡安一顿,还准备揍他,卢锡安一气之下离家出走,这一走居然就没有再回过家了。

他跑到德国柏林,在那里找到一份制造工厂的工作,一边做车间工人来保障生活一边自学美术,他内心还是强烈希望日后可以成为一名设计师,虽然还没想清楚具体设计什么。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

“海报风格”平面设计作品

时间很快去到 1905 年,卢锡安已经 22 岁,终于碰到一个改变他一生的机会。

柏林有一个老牌的知名火柴厂叫“普莱斯特“(Priestermatches),100 多年前,火柴还是民生中必不可少的产品,印象中我小时候有很长一段时间都是用火柴生火做饭的(暴露了我的年龄)。

某天这个火柴厂玩起“设计征集“这样的营销,通过刊登报纸向社会征稿,设计主题是新品海报,当时做这类征稿的商家还不多,所以博得不少眼球,另外他们也确实希望通过这种方式获得耳目一新的设计。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

“海报风格”平面设计作品

征集活动被卢锡安知道了,此时他已经自学设计多年,自然希望借此机会浮出水面,成为真正的设计师,万万没想到,还真的成功了。

事情的经过是这样的:当他发现消息时候已经距离截稿时间很近,他赶紧请假几天在宿舍闭关。

刚刚开始的时候他设计得比较复杂,海报的元素很多,最初设想是桌子上有一个烟灰缸跟雪茄烟,边上还有一个跳舞瓷娃娃增加气氛,画完之后他满意的拿给朋友看,朋友的反应却像一盘冷水,因为朋友问他是否一个卖雪茄的广告。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

年轻时候的卢锡安

于是卢锡安回宿舍后将雪茄涂掉,没了雪茄烟后灰缸自然是多余的,去掉,没了烟灰缸后瓷娃娃也很奇怪,去掉,如此这般桌子也没了意义,也去掉。

最后这些元素全部涂没了,只剩下一个蓝色的工厂名字标题,纯黑色背景,而当天晚上再不寄出征集活动就要截稿了。

卢锡安急得不停冒汗,这种体验很多广告设计师都肯定试过,他想了很多替代方案,但此时不管想法如何好都不够时间实现。

最后只能死马当活马治,在黑色背景上刷刷两笔画了两根红色杆黄色头的火柴,匆忙将稿件寄走了,心里感到万分的沮丧,类似约会心仪的女孩但是表现得不好的那种。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

“普莱斯特“火柴厂海报设计

寄出稿件之后他其实就忘记了这件事,我猜测是选择性遗忘,因为心里难受,不抱任何希望,但人生往往是充满惊喜与意外的,一个月后卢锡安收到电报,告知他居然获得活动第一名,电报中还用不少美丽的词汇称赞他为“设计天才“。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

卢锡安的海报设计

领奖金的时候他才知道原来最初他的作品被评委扔到垃圾桶,觉得过于简单,缺乏风格,后来被一位外邀的专家评委捡了起来,看了很久,认为这样的设计主题突出,名的明确,具有很好的传达功能,而且设计方式非常大胆,正是“普莱斯特“火柴厂需要的,应该得第一名。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

卢锡安的海报设计

这一类故事史太浓之前在大师列传就聊过,主人公是扎哈·哈迪德(著名女建筑师),当时也是参加比赛,我总感觉这种事情是为了增加主人公成名传奇性而杜撰,但不管如何,只能说实力跟运气都重要吧。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

扎哈·哈迪德

如此这般,卢锡安一举成名,正式投身设计界,我忽然想设计大咖李永铨在《消费森林&品牌再生》这本书里面说到的一句话:设计有时候就是需要冒险,因为设计就是投资,投资不存在零风险。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

《消费森林&品牌再生》

具有一定试错成本的时候试试,因为万一成了呢。

“海报风格”练成

卢锡安 1905 年这一份传奇的火柴海报设计让风行多年的“新艺术“风格得以”交班“,大家发现平面设计的另一种可能性,就是重视传达,信息明确,形式简练。

入行之后的卢锡安成为“海报风格“领军人物,采用这一类风格设计出很多优秀作品,比如 1912 年为斯蒂勒皮鞋公司(Stiller)设计的产品海报,也属于经典之作。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

斯蒂勒皮鞋公司海报

市场都是喜欢新鲜,爱追热点的,卢锡安开创的这种风格大胆好用,很快成为德国广告界的领军风格,市面上大量平面设计都开始走“海报风格“路线。

其中有一所叫“火雷不老与十米特“(thehollerbraumand schmidt Lithography firm)的石版印刷公司极有先见之明,抢先以丰厚酬金跟卢锡安,还有市面上善于这种风格的五位设计师签订长期合同。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

德国其它“海报风格”设计师的作品

模式类似经纪公司签约明星,市面上的其它公司如果需要找这些设计师工作,必须先通过他们,一般最后也会找他们印刷成品,这样一来让公司大发其财。

五名设计师中有一位叫朱立思·克林杰(Julius Klinger),早期在奥地利维也纳学习设计,所以设计风格受“维也纳分离派”影响不少,具有新艺术运动的曲线特点,随后再在这个基础上转向“海报风格”,有不少出色作品。

用一篇文章,帮你了解风靡平面界的「图画现代主义」

朱立思·克林杰

而这群人在我们下一期的内容中都有重要戏份,因为第一次世界大战马上到来,这次大战改变了很多设计师的命运,有人一飞冲天,有人从此凋零,有时势造英雄,也有英雄造时势。

文章来源:优设   作者:Reman刘斌

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

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

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



十分钟读完大卫·奥格威的《一个广告人的自白》

分享达人

背景

1我们坚信每一则广告都必须被看成是对品牌形象这种复杂的象征符号作贡献,以及对品牌声誉所做的长期投资的一部分。

2提到的书籍:《如何做广告》、《4A广告公司作业手册》、《广告大师奥格威》、《奥格威谈广告》。

3如果你经常雇佣比你弱小的人,将来我们就会变成一家侏儒公司,相反的,如果你每次都雇佣比你强大的人,日后我们必定成为一家巨人公司。

4奥美的广告文化:我们做广告是为了销售产品,否则就不是做广告;不要推出一个你不愿意你的家人看到的广告;消费者不是低能儿,别侮辱她的智商;我们喜欢知识纪律,你要知道广告的“根茎”在哪;不要奢望所有的策划方案都很有用。

  1. 怎么经营广告公司

通过作者的厨师工作经历,说明如何管理公司,其实很多道理都是相通的,不管是做人还是做工作。

一 、领导者做好公司管理的要点

领导者在专业能力上一定要突出,才能让团队信服你。对待工作要严厉,用强力手腕处理同事间的矛盾。适当夸奖部属,让他们懂得赞扬的可贵。增强使命感,比如让更高层领导评判文案或设计或活动效果。对不称职的人零容忍,和不称职、吊儿郎当的人一起工作,专业人员的士气就会受到影响。严格遵守服务标准,信守承诺。道德问题,坚守底线。保持办公场所的整洁,乱七八糟会产生慵懒的气氛。炫耀特权,激励部属向领导看齐的雄心。对盈利保持热情。勤劳。创造不可或缺性,让别人无法替代你。活力和足够的应变能力,对伙伴有热爱之情,能宽容他们的过失,有化敌为友的才能,有抓住良机的敏锐目光,还有道德。必须懂得如何分配任务。发掘人才,思考你想要的团队成员应当具备什么特质,面试时通过问什么问题,或什么行为能让你判断对方是否胜任。最终还是要让公司在领域内的专业性无法被取代。

  1. 如何挖掘潜力,不让自己的思维被框住

给自己时间做放松的事情,比如听音乐、跑步。在无所事事的时刻,让潜意识长流不断给我传来信息。还要有刻苦的工作精神、开放的头脑、不受任何限制的好奇心。追求更多物质的心。

  1. 怎样争取客户

一、树立公司品牌

与行业相关记者,建立联系。每次发声,必引起轰动。与行业相关人员交朋友。将公司理念和经营指标,告知目标。让广告主看到,转来奥美的客户的戏剧性发展。认真倾听很重要。敢于直言,不怕说出实话,即使可能伤害对方。适当的拍马屁。不做能力之外的事情,以免砸自己的招牌。对客户要有热情,但热情不总是获得成功的最佳因素,有时候拒绝反而激起了客户要求聘用我们的愿望。

第三章 怎样维系客户

一、自身

马上准备预备方案。站在客户的角度思考问题,全面了解客户的情况。让每个客户都感受到被重视。绝不泄露客户的信息给另—个客户。

  1. 用人

把最好的人才为现有的客户服务,而不是让他们去追逐新客户。不任用处事草率,很不随和的人做客户主管。

三、沟通

和客户每个层次的人保持联系。重视客户主管与客户间的关系,适时地进行协调和处理。主动在受到责难前,承认自己的过错。和客户成为朋友。

四、客户

避免和那些—再辞掉自己广告公司的客户合作。不依赖单一的个人来维系客户关系。

  1. 怎样当一个好客户

1消除广告公司的惶恐心理。让他们把主要精力放在创作上。

2选择对的广告公司。招标只是一种参考,很多大公司会把一流人才用于投标竞争,但在工作时却用二流人才;聘用一个懂行的广告经理,让他找最能配合你工作的广告公司。通过吃饭、喝茶时他们的表现来判断其公司的氛围和上下级关系;不要想大公司可以给你提供更多服务,与公司大小无关,为你服务的人员数量是相等的。

3向广告公司全面彻底介绍你的情况。

4不在创作领域与你的广告公司较高低(何必养了狗又自己汪汪叫呢?)

5广告和产品研发同等重要。

6不让一层一层的机构干预广告宣传。

7确保广告公司有利可图。

8不要和广告公司斤斤计较。

9推诚相见,鼓励坦率,有问题就直接说,别让猜。

10定出高标准,销售不好时责怪广告公司,销售好时又不舍得把功劳给广告公司,是不体面的。

11—且经过测试,产品、媒体、标题、插图、尺寸等。

12效率要高。

13不为有问题的产品浪费时间。

14珍惜良才。

15勿使广告预算捉襟见肘。

第五章 怎样创作高水平的广告

一、广告创作是有规律可循的。(教条和创意并不矛盾)

二、好广告的判定标准,不引公众注意广告本身就把产品推销掉(好广告要客户说的不是“多奇妙的广告啊”,而应当是“我从来没有听说过这种产品,我一定要买来试试”)

三、总结的广告创作规律来源。邮购公司的广告经验(类似于公司寄出产品的广告,客户看到后想采购再把广告裁下写上基本信息寄给公司);什么技巧使百货商店成功或者失败。对广告渠道效果的调查;别人智慧的成果。

四、创作广告的11条戒律

1广告内容比表现形式更重要。最重要的是你怎么来说明你的产品,你承诺什么好处。选择正确的承诺的四种方法:将产品送到抽样消费者手里,随附不同的产品承诺,看不同承诺所吸引到的反应的百分比的高低;让消费者看印有不同承诺的卡片,请他们选择出最可能促使他们购买某种产品的承诺;用不同的承诺制作广告,把广告发给消费者,看订货量;同—天报纸刊登不同承诺的同一种产品,从索取赠品数量来看效果。

2广告要有创意。

3讲事实,枯燥的形容词和夸张的承诺无法形成购买。

4不做令人厌烦的广告。

5显得有礼貌,但不装模作样。

6要与时俱进,有现代意识。

7广告需要不断修改。

8创作了—条好广告,不妨重复使用,直到他的号召力减退。因为消费者在不断更新。

9不要说谎,不写那些你不想家人看到的广告。

10让每则广告都为树立品牌做贡献。坚持统一的广告形象。打折以及其他类似的求存方法效果是短暂的,而且会形成坏习惯。

11不要抄袭。

第六章 怎样写有效率的文案

一、标题

标题是大多数平面广告最重要的部分。

写标题的原则:

标题好比商品价码标签,用它向你的潜在买主打招呼,意思就是说卖什么一定要直接说出来。

每个标题都应带出产品给潜在买主自身利益的承诺。

始终注意在标题中加进新的信息。

标题内使用充满感情的文字可以起到加强作用,比如亲爱的、爱、宝贝等。

标题中应当包含品牌名

标题中写进销售承诺。

写能引起读者好奇心的标题

不使用双关语、引经据典或晦涩的词语,标题是以清晰传达为首要目标的。

尽量不在标题中使用否定词。

不写让客户读了莫名其妙的标题。

二、正文

1不要旁敲侧击﹔要直接了当

2不要使用最高级形容词,一般化字眼或陈词滥调。

3长文广告比短文广告更具推销力量。

4使用用户的经验之谈更让客户信服。

5向读者提供有用的咨询或服务。

6不刻意追求高雅和文笔。

7避免唱高调。

8尽量使用简单、通俗的语言。(待商榷)

9不贪图写那种获奖文案。

10优秀的文案撰稿人不会从文字娱乐的角度去写广告文案。

第七章 怎样使用插图和编排文案

1插图应当起到与文字同等重要的作用。

2插图的主题比插图的技巧更为重要。

3插图的使用规则

3.1插图应有“故事诉求”。

3.2照片比绘画更能促销。

3.3男性更注意有男性的广告,女性一样,最吸引女性的是婴儿的照片。

3.4彩色插图好于黑白插图。

3.5避免历史主题。

3.6避免使用人脸局部特写。

3.7尽可能使插图简洁。

3.8不使用老套场景,比如物业弯腰引导,比如三代同堂的全家福。

4广告一定要针对它所要刊登的刊物来设计,在它被排进出版物,你看到它被排进去的样子之前千万不要最后敲定。

5人们读照片下面的文字说明多于读文章本身。

6如何进行文案排版

6.1在标题和正文之间,插入副标题。

6.2 用大一些字号的字排正文第一个词的第一个字母。

6.3第一段控制在11个词以内,所有段落尽可能短。

6.4每行的字数不宜过长,不超过26个字符为宜。

6.5齐头散尾更易吸引读者。

6.6善于使用编号。

6.7大标题排制上,字体变化越多,读者越少。

6.8用小写字母排标题以至整个广告文案。

7路牌广告

7.1要吸引人的眼球,“色情视觉”是一个最有效的方法。

7.2最起作用的路牌广告是用写实的艺术作品或照片制作的。

7.3要保证5秒内对读者产生作用。

7.4 使用强烈、单纯的颜色,传递信息就快些。

7.5文字要尽可能大。

7.6品牌名字要安排得更醒目。

第八章 怎样制作上乘的电视广告

1电视是用画面讲故事的,语言的唯—功能是解释画面所表现的东西。

2电视广告要么带有新商情、要么可以介绍能解决什么问题、要么可以做示范表演、要么就进行感情与情绪的传达。

3避免出现太过俗套的画面内容,比如一群人的豪饮,一家人的喧喧嚷嚷。

第九章 怎样为食品、旅游地和专利药品制作优良广告

一、食品

印刷广告:以食欲为诉求;插图要大,要用彩色,最好是照片,且一张为宜;最好能提供食谱或烹饪方法,单独列出来,照片能体现烹饪最好。

电视广告:示范如何使用;用自问自答的方式、以推销产品为目的,而不是娱乐为目的。

二、旅游地

1树立正面形象至关重要。

2把你的国家最能吸引游客之处拿来做广告。

3为读者树立难以忘却的印象。

4刊登的广告媒介是有条件做长途旅行的人看的。

5国际旅行的最大障碍是费用。

6把旅游地说成是热门旅游点。

7广告的作用是让读者的梦想付诸行动。

8避免采用读者不理解的话题。

三、专利药品

要体现与竞品独有的差异;要含有新信息;要传达严肃的感觉;权威感;应适当讲解病情。

第十章 怎样才能功成名就-对年轻人的进言

1迅速功成名就的行为模式:要有大志,但不可咄咄逼人,以免被围攻;通过学习,迅速提高专业技能,对专业深入了解,甚至超过你的领导;花更多的时间投入工作;重大时机出现时,识别他,抓住他;成为专才,而不是通才。

2一些忠告:有耐心,坚持就会成功;要有做高质量提案的能力,要善于推销你的广告计划;融入每个集体,不轻视和敌对同事;要懂得在小问题上让步,在大问题上就能坚持;管好嘴和文件;私下进行协商和批评;勇于承认错误;提高文字写作能力,快速、简练、流畅的写公司文件。

3如何过有意义的假期:不要待在家里,要换换环境;假期完全不接触工作;多做运动,呼吸新鲜空气;多读书;从容,不要太过疲惫。

第十一章 广告是应予废止

文章来源:站酷  作者:成都荣影MG动画

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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



好的表格信息展示都有这三个特征

分享达人

前言


表格作为组织整理数据的手段,可以有效的向用户展示数据信息,是B端产品中出现最高频的模块之一。

下图为典型的B端表格示例:



用户主要通过表格浏览获取信息、对数据进行筛选、排序以及相关业务处理等更多复杂操作、对比数据的差异与变化(关联和区别)。好的表格信息展示设计,应当是能够辅助用户高效便捷的实现以上场景中的诉求。

今天我们就来讨论表格设计中一个重要的问题——【应该如何考虑表格信息展示】。首先抛出结论,我们认为良好呈现信息的表格应当做到疏密适度、高效扫视、精简克制。


///


一、疏密适度


常见的表格信息包含文本、标签、状态样式、数值统计图表、关键信息Icon等。表格单元格是信息填充的基本单元,行高和列宽的定义决定了表格信息的疏密程度,进而决定了表格给用户的直观感受,因而下面分别从行高和列宽两个方向来探讨表格信息展示如何疏密适度。



1、定义合理的表格行高


a、行高模数设定

在具体设定表格行高时,由于表格中以文字信息为主,我认为可以参考文字排版的常用做法,将整个表格的行高分成文字行高、文字与分割线间距离,即上下间距两部分来考虑。文字行高可以设定为字号的1.2~1.8倍,文字与分割线间距离可以设定为字号的1~1.5倍。分为这样的两部分也比较符合开发同学写代码时的习惯(多行行高同理去设定)。



根据用户场景的不同,来选择模数倍数,需保证系统内使用统一的模数。比如,针对用户快速浏览获取大量数据场景时,可以选择1.2倍作为模数,列表更为紧凑,同样扫视范围内,可获取更多信息。


b、为小屏幕考虑一屏显示的行数

表格行高决定屏幕内能呈现的行数,即用户在一屏内能获取信息的数量,主要影响用户纵向对比数据的效率。对于1920*1020(包含该分辨率)以上的大屏用户,对于一屏显示行数的感知不强,但对于1366×768、1280*720等这类小屏,显示行数有限,用户进行纵向数据对比的效率就会有所降低。在设计前,应当充分了解目标用户的行为诉求,了解目标用户设备屏幕分辨率的占比分布情况,有针对性的设置行高。


c、用户自定义行高的场景

B端产品的特点之一是通用化,覆盖用户角色多样。然而用户个体对于表格信息呈现密度的诉求经常是有所差异的。比如个人视力的原因,有些用户喜欢表格行高值大一些,看起来舒适透气,便于阅读。而有些平台用户由于很熟悉线下excel表格模式,希望线上的表格也尽可能像excel那样紧凑,以便他们在一屏内看到更多的数据,进行对比,提升工作效率。产品为了让不同用户都能获得较好的体验,可以考虑把表格疏密度的设置开放给用户,建议不是完全开放给用户去调整尺寸,而是给出一定阶梯度的快速选项,例如舒适、标准、紧凑三种高度来满足用户需求。

例如,Gmail提供默认/标准/紧凑三种表格密度设置,如图:



2、灵活扩展的横向空间


通过对表格固定位置与列宽的调整,扩大表格数据空间,使信息不局促,空间更透气,保证横向扫视易读性。


a、列宽极限值设定

设计师需要根据表格承载内容定义表格的列宽,应包含最大/最小/默认列宽的定义以及使用规则。

我推荐的一个规则是:

规则1:当相对列少【浏览器宽度-页面其他模块 > 全部列的默认宽度和】,则各个列自动等比拉伸,撑满屏幕;

规则2:当相对列多【浏览器宽度-页面其他模块 < 全部列的默认宽度和】,则出横向滚动条,每列宽度为默认宽。

另外需注意最小值设定时应避免信息展示出现【对联式表格】。对联式表格最大的问题在于,一屏内展示的行数有限,当用户纵向对比数据时,需往复滚动多次,记忆压力大;横向扫视时,阅读视线不能一直保持左右横向预览,而是不停上下左右切换,使用体验不佳。



b、横向『偷取』屏幕外空间、行高模数设定

当压缩列宽也无法在有限空间内展示大量的数据指标列时,我们可以借助横向滚动来『偷取』屏幕外更多空间。横向滚动需用户拖动滚动条进行浏览,有一定操作成本,所以要结合业务实际情况选用是否利用屏幕外横向空间。

随着行和列的增加,用户的瞬时记忆会达到极限,超过“7±2原则”的范围,用户需要依靠辅助信息去阅读表格内的数据,防止遗忘某列数据的意义。因而当表格数据列较多横向滚动时,建议为用户固定重要信息列,如标题列、操作列。同时用户浏览表格时是符合F型扫视原则的,建议固定列显示在表格左侧,方便用户从左至右浏览数据、从上至下对比数据时能够清晰定位当前所浏览数据的主体是什么,同时可根据需要快速发起操作。



同理,用户拖拽纵向滚动条来阅读数据时,可固定表格的表头,帮助用户在阅读过程中清晰知晓单元格数据的意义。


c、用户自定义展示信息

针对需展示大量数据的情景,我们除了【偷取】屏幕外空间外,可以根据B端产品提供的数据表格是覆盖全部用户角色的全量数据的特点,让不同用户角色来自定义想要浏览的信息,从而提升表格的可读性。下图为百度信息流推广平台的自定义列功能,用户可根据需要选择展示的数据列,系统将在用户完成选择后,主动帮用户保存自定义内容,下次登录后,表格依然按照用户定义的数据来展示。



///


二、高效扫视


无论是在表格中要明确的定位数据,还是顺序阅读,高效扫视都是B端用户一个很重要的诉求,我们在设计表格时可尝试一些有效手段提升用户浏览获取信息的效率。


1、合理的对齐方式


数据信息本身包含多种格式,可遵守一个基本原则即文字左对齐,符合从左到右的阅读习惯;数据信息右对齐,方便数据大小的直观对比。

具体对齐方式可参考我们建议的方式:

文本字段:可点击字段、普通文本类、数字、字母等,长短参差不齐,左对齐;

格式化字段:日期、时间、部分枚举类等,字符数一致且较短的,左对齐。

数据字段:金额、数据、百分比。带小数点等数据,方便对比为主,右对齐。



2、去除视觉杂音,强调对比关系


a、正确使用分割线,实现对表格行与列的强调

横向分割线可强调行内信息的连续性。垂直分割线在缩减元素之间的距离后也能区分不同元素,更好的强调纵向数据对比。但只要遵循良好的对齐方式,通常不展示纵向分割线,避免信息干扰。因而表格中通常仅使用横向分割线和底色分割,提升表格阅读效率。



b、斑马线作用有限

斑马线即隔行(列)变色。它能让行(列)间界限更为明显,但由于与分割线的作用类似,起到的作用有限,可针对不同场景酌情考虑是否使用。比如针对不同类型的数据(如总和、平均值)使用不同底色来区分,可以更突出强调该数据。要注意的是,隔行(列)换色的两种颜色不能反差过大,否则看来太“跳跃”。

对同一类数据而言,分割线就已经能够明显区隔,所以可不使用斑马线,但需要给出单行的悬浮状态,强化横向导视,避免出现列数过多引起数据错行的问题。



3、突显重要内容的视觉重量


前面我们提到表格呈现的数据信息除文本外,还有其它一些可视化数据。可视化一方面提升了列表视觉表现力,增加差异化,另一方面让内容更加突出,提升阅读效率。例如:数据列中数据异常时,最好可以醒目的形式突显,让用户一进入页面就能快速注意到异常状况。



///


三、精简克制


体验好的表格一定是克制的,克制应表现在信息的适度隐藏以及内容折行与截断展示原则。


1、适度隐藏信息


a、隐藏低频操作

当表头需要承载排序、表头筛选、提示等功能时,不建议一股脑的将所有功能展示出来。用户对表头的诉求是定位数据指标﹥执行操作的,因此可根据具体业务定义展示哪些操作,将其它操作隐藏,有需求时用户主动触发再展示。比如,百度搜索推广平台的推广管理页面提供了全局筛选,所以表头筛选对于用户而言是相对低频的操作,我们选择隐藏表头筛选的图标,当用户鼠标HOVER表头单元格时再展示。



对于表格行内的操作我们也应当进行优先级排序,为用户专门设置操作列展示高频核心的操作,其它相对低频的次要操作可隐藏在相关数据单元格中,用户有诉求时hover对应单元格即可快速发起操作。



b、隐藏辅助信息

表格中的有些数据指标是综合纬度的,当用户关注点定位于该指标时,需要通过细分数据来理解、分析。指标的细分纬度信息虽能起到辅助用户更好理解数据指标的作用,但如果全部拿出来在表格列展示,会让表格变得臃肿不易读,此时可以考虑采取一定设计手段去隐藏这些信息,把触发展示的自由度交给用户,也更符合用户逐级查看的场景。例如,百度搜索推广平台中关键词列表中,质量度指标是由多条数据共同决定的,我们采用了将细分指标聚合在气泡卡片中,当用户HOVER质量度得分数据时展示出来。



再比如,有父子层级关系的数据,可以通过父子折叠表格将子信息默认隐藏,用户根据需要,去展开查看详细的子信息。



2、设定折行与截断规则


B 端业务的数据信息复杂多样,信息内容的长度高度是多样不可控的,很多内容会超出我们限定的最大列宽,最大列高,我们应当给出折行与截断原则去约束内容的展示,而非总是为具体情况而做特殊设计,破坏体验的一致性。

截断折行原则设定时要细分,不能简单粗暴的一刀切,比如一行截断这种,如日期、时间等固定格式内容,拖动列宽后文字应折行而非截断展示,避免影响用户误读。再比如很多业务实体标题字段是格式化的,即标题前面部分可能都是一致的,这时候如果简单的截断,用户就需要逐一Hover才能找到定位到要找的数据。因而折行与截断原则,我们建议是给出三种:单行截断、双行截断以及自适应截断,根据具体业务情景选择。



文章来源:站酷    作者:百度MEUX

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

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

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



设计师如何做好项目管理?

雪涛

本来这样的形式已经司空见惯,足以应付。但写这个文章的契机,是因为去年接了一个令人头秃的项目,这是一个平台项目,在这个平台上有 30 多个APP,核心干系人包括运营/APP产品经理/平台开团队/PO/APP的开发团队 ,位置不同,利益点也不一样,并且这里每个团队核心干系人都不是一个人,而是 2-3 个人,对接人有层层回汇报关系。抛开项目本身业务是专业领域的内容学习成本高不说,就干系人管理这一项就颇为棘手。


在这个项目中我遇到了哪些问题:

  1. 干系人繁多,有三股神秘力量

  2. 业务复杂,专业性极强,访谈过程全是专业术语

  3. PO 不是核心决策人

  4. 项目中后期,出现新的干系人

  5. 团队成员能力需要培养

  6. 时间紧张。客户预算有限,就我们自己预估的时间直接砍半


综上,这个项目着实做掉了不少头发,这样的项目要怎么做呢?希望大家在遇到这样的项目的时候也少走一些弯路。聊到这里,就要聊一下项目管理是什么了,我们从头来梳理以下,查漏补缺。也是对自己的一次复盘


项目管理是什么?

·项目管理是有效资源整合,高效实现目标的一整套管理理念

·在复杂多变的环境中,如何做好一件事情

按照时间轴罗列,项目管理分为:启动 规划 执行 监控 收尾

那我套用到设计的项目管理,大致会分为以下几个阶段:




      项目开始,在正式进入客户场地以前,就是项目启动阶段,该阶段需要了解:


项目启动

项目:

  • 项目的整体背景

  • 挑战

  • 目标

  • 项目范围

  • 时间周期

  • 客户关注方向


干系人:

  • 客户组织框架

  • 核心关系人数量,汇报关系

  • 是否有第三方人员对接

  • 是否有合作的同类型角色


现状:

  • 该项目是否存在上下游系统,是否有依赖

  • 现有系统状态(是否有现存系统,没有是如何完成工作过的)


里程碑规划:

  • 基于以上所了解到的信息,对项目全局时间计划有整体性安排,明确项目被划分为哪些阶段

  • 阶段性产出和汇报时间节点梳理

    (需要拉入客户进来讨论的时间节点需要提前规划,需要邀请用户研究的时间段需要提前规划)

  • 规划里程碑时,一定要考虑部分风险和可变化因素 ,比如需求变更,干系人多,沟通成本增多,汇报层级链路长 ,需要等待领导决策,或者部分业务内容可能涉及第三方的一些依赖,合理增加里程碑的总体规划时间 ,后期可以优化和调整规划内容,在一定规划时间内,部分阶段可以适当延长,其他的相应缩短,给项目一些buffer,减少项目延期的风险。


成员安排:

  • 对安排上来的小伙伴需要有一定的了解,了解人员的能力方向。安排能匹配或是跳一跳能摸得着的难度系数任务

  • 如果上项目的小伙伴经验比较少,需要建立团队培养机制

  • 保证项目成员安排的连续性,最好不要出现中间停一段时间,后面在续上,或者每天只安排0.2天

  • 在安排时间计划上,需要注意哪些工作是无法通过加人来完成的


资源规划:

资源包括:人/物/场地

人:外部专家支持/其他部门支持(除内部项目人员外)

物:workshop要用到的所有工具,包括白纸,笔,便利贴,蓝胶,马克笔,故事卡等等

场地:日常办公场地/会议场地



风险识别:

  • 根据现有状况,预测部分可能风险

  • 将想到的可能风险一一列举出来,并给出相关应对措施,这个如果无法独立完成,可以和甲方一起协商完成。

      当风险点都已经列举完成,为了避免风险,大家需要提前达成一致的东西,提起和大家同步信息,如定义项目上的规则,保证会议不延期,要提前一周安排会议时间,保证信息同步,每天or每周制定同步会议。当需求变更,或者需求膨胀的情况下,可以参考的优先级排序,根据某项原则,完成优先级排序,将非必须的需求先划分出去,保证需求在一定合理的范围内。

枚举风险有两个好处:

  1. 预判一些可能的风险,提前做好准备工作

  2. 拉着客户与团队一起定义规则,不要随意破坏



可以用这样的表格管理风险,也可以直接在后面加上这个对应项的相关责任人,有什么问题,我们可以方便 跟踪


举例子:

风险点:比如会议干系人核心无法到场,造成会议延期,那么遇到这种情况怎么办呢?

应对措施:提前和核心干系人确定时间,双方协商会议时间,提前一周规划时间安排,合理调整时间


风险点:疫情期间,出差隔离时间不可控

应对措施:Plan A 出差前提前了解当地相关政策,提前到达办公地区。Plan B:部署远程工作环境,建立信息共享机制,建立定期会议时间,同步信息,如果不能按时到达现场,可以启用的Plan B


粗颗粒度任务拆分:

还是基于里程碑规划的图示举例,在途中表示出来每一个阶段的阶段性活动是什么,产出物是什么,对齐产出物的颗粒度以及内容


项目规划

愿景对齐:

  • 让所有的核心干系人参与该活动,避免大家后面信息没有对齐,目标没有对齐,产出结果无法达成一致。

    高能预警:此处有深坑:注意避坑。

    我参与的这个项目,如开头所说有三股神秘的力量(在开始阶段PO 都没有介绍是三股力量,而是2边,他们的关系有点复杂),但是由于地域影响,和各个力量之间存难以琢磨的关系,他们并没有同时出现在愿景对齐工作坊中,来参加工作坊的只有一波人。愿景工作坊顺利完成,项目目标,干系人关系,在这里才得以澄清。

    虽然后面抄送了全员,并单独去找了另外一边的老大沟通目标,才发现他的目标和其他人的都不一样,甚至应该不属于这个项目范畴。

此事件复盘:

  1. 核心决策人必须参加

  2. 如果核心决策人没有发表意见,请主动请他来表达观点

  3. 如果实在无法到场,和他1Vs1的邮件会议纪要也要抄送全员。

  4. 如果发现多方意见无法统一,请不要继续项目,把他们拉在一起,对齐愿景再出发


      以下附上愿景对齐的工具——电梯演讲

在项目开始阶段,我们都会进行愿景工作坊,拉上所有的核心干系人一起,通过贴便利贴的方式,将大家的理解收集起来,并对所有的便利贴进行分类,最终收敛出最为核心的电梯演讲

电梯演讲海报的相关原则:

  1. 精炼,简介——这个愿景海报将伴随整个项目,越简单越容易被人回忆起来

  2. 对于用户需求这一项,大家一定会写很多很多,但是在项目初期,大家写出来的需求很多是作为客户方,理解用户想要的东西,是不是真实需求,还需要进一步被细化,所以这里对整体需求做较大颗粒度的归纳即可,不要深入细节

  3. 电梯演讲可以出几张?部分小伙伴可能会问我的目标用户差异很大,出两张,三张可以吗,可以!可以将上半部分分开,比如目标用户 For 哪几类人群,他们的需求差异也可以规组,但是下半部分,产品名称,产品形态,帮助企业获得的价值,以及竞品和卖点,可以是一致的,都可以在一张海报上所呈现


干系人识别:

  • 我们大致梳理了公司的管理层级。现在要把他们匹配到相当的关注层级之中

  • 识别哪些干系人是重点关注的,那些是一般关注即可


     高能预警:此处有深坑:注意避坑。一般来说项目的干系人优先级都比较稳定,不会发生改变,但是在去年的那个项目里面完全不同了,在项目的第一阶段干系人A非常的重视,干系人B基本没有太多的意见,但是到了项目的第二个阶段,画风发生了反转,干系人A参与的越来越少,相反干系人B有更多的见解和想法。对于不同的干系人,他们想要的成功是不一样的。需要明确不同阶段核心干系人的差异,汇报给不同人有不同侧重点。

所以在干系人梳理这块,还需要注意的点是:

  1. 如果workshop 这种形式的大会很难让干系人透露心声,可以通过通过 1vs1 的沟通了解他们的真实需求,问他们的KPI是什么,是非常直接询问他们最关系问题的方式。这对于复杂干系人的项目尤为重要。

  2. 也可以在workshop上新增期望对齐的环节,在下一个part会讲到。


以下附上愿景对齐的工具——干系人/团体地图


      下面两种干系人/团队地图的差异不大,可以根据需要任选其一即可,图一更多可以梳理出干系人,或者团体之间的关系,除了判定干系人的权重,还可以在途中不中干系人之间汇报的关系,以及他们之间使用的不同系统的关系


     下图也是对干系人的权重和优先级的排序,与上图不同的地方在于它更清楚的展示了我们如何去区分这些干系人的维度,维度可以根据项目需求哦进行变化。



期望对齐:

  • 从各个维度对齐干系人对项目的期待

  • 帮助干系人对各个维度有一些认知

      这个有两种做法,如果是干系人相对简单的项目,可以在电梯演讲的海报哪里,加上一类表示这个项目期望达到的目标,可以是定型的,如果团队中有很好的数据监控埋点,这个指标也可以是定量的。如果干系人繁多,大家对想要达成的期望不是非常明确的时候,可以加上这个环节,这样也能方便我们了解我们在项目过程中应该如何侧重,因为现场的时间非常有限,我们不对所有的期望一一判断是否合理。会在会后对一些超出范围的期望和项目负责人达成一致。事先,可以列举以下几个维度,帮助大家思考:功能,项目本身,技术,体验和成效,维度可以随项目目标的不同自由变更,如果大家还有新的维度,也可以在现场添加


以下附上对齐期望的工具——期望看板



权重识别:

       这个是千万不要省略的一个对齐项目,后面有诸多事宜,我们需要跟俊权重的识别来判断。比如在需求膨胀的时候,我们用什么方式判断那个需求的优先级更高,应该把哪些需求摘出去。或者在做一些决策的时候,用来判断,那些事我们应该优先处理,而另一些我们可能需要有一些妥协。后面在说到项目执行过程各种突入起来的变故的时候,这个参考项是必不可少的。在文章后面会更为详细的列举。

  • 辅助决策

  • 判断优先级



以下附上权重识别的工具——权衡滑块



详细日程排期:

  • 细化工作安排

  • 提前约定相关干系人时间

  • 提前预约用户验证时间

  • 注意那些是客户需要参与的时间点,无比准确



以下附上详细日程排模版,这个相对来说没有特定的方式,可以做到 Excel 表格中管理。也可以放到 日历 中管理,当然如果你们有设计排期的服务软件,都可以使用,我这里只呈其示意样式


下一步我们就是正式开始进入项目拉

项目执行

任务优化调整:

      进一步的细化工作安排,如果发现团队的小伙伴是新手,无法上手,就需要对任务进行拆分,拆分到什么颗粒度呢,拆分到团队的小伙伴可以上手的颗粒度,当然拉,千万不要全部包办代替的把它做完。在项目允许的范围内,让风险发生!这是团队人才梯队建立的关键时刻,说到这里,如何培养团队设计能力,又是一篇长篇大论了,我们回归正题。如过小伙伴就有很多经验,那就更可以安心的把整快大的蛋糕分给他,把他划分为责任人,下面的工作内容如何拆解,应该分几步来做,请放手。只用在关键节点和把控质量就好。

  • 明确产出目标

  • 明确产出内容

  • 明确产出目的 

  • 明确产出物依赖


拆分责任人:

      这块和上诉的任务优化调整是联系在一起的,当我们合理拆分任务后,当然要他这个任务匹配到相关的责任人,如任务优化调整所诉,可以是比较大的一大块任务,比如信息架构这一个大块,用户调研这个大块,制定相关人作为Owner ,至于他如何来拆解自任务,还需要请到那些人进行协作,由Owner 来全权负责,Owner 是需要对结果负责的人 。如果是新人,拆分成一个大块是无法下手的,并不知道我每一步应改怎么做,那就把大蛋糕切细,切到他可以尝试下咽的颗粒度即可。

      在项目活动中,对于2个设计师以上的团队,我们就可以利用设计看板。长期做敏捷交付的小伙伴对这个工具一定不会陌生。


  • 对于有经验的人,按照大块拆分

  • 对于新人,在按大块拆分以后,需要对分支任务或是阶段任务在进行下一步拆解


以下附上日常设计工作管理工具——设计看板

还是那句话,有设计进度跟踪的工具的小伙伴请绕道哦,这个是非常简单的且直白的一种设计管理模型,这样就可以每日跟踪大家的手上的工作进度了,也可以跟中哪些任务已经完成拉。上面的标题栏“待设计”“设计中”“已完成”也可以根据项目的不同阶段,放置不同的标题,当我们设计完成后,就可以领取新的设计任务拉。



每天这样移动卡片会不会乱呢,怎么和大家同步信息呢?那我们就要说到设计工作中一个关键活动了?

站会/业务对齐会


组内同步:

每日站会对项目来说是比不可少的,一般会定在每日早上,项目全体小伙伴都要参加,上班的第一件事就是开站会拉,多么有仪式感的一天,站会通常会占用10-15mins,站会可以用来:

  • 同步信息包括,昨天,今天的工作内容

  • 提出风险,有困难就喊出来,找大家一起需求帮助

    这样大家就非常明确每个人都在做什么,我的工作有什么依赖,我应该找谁解决获取上下文,另外就是及时暴露风险。及时寻求帮助


另一项活动是我特别喜欢在团队中使用的:业务对齐会

当项目比较大,每个设计师或者业务分析师分为了多个条线跟踪业设计和业务。那业务对齐会也是比不可少的,当然业务对齐会不仅仅可以对齐业务输入,当需要开发判定方案是否可行,或者需要其他的角色一起讨论问题时,我们都会放到放到每日或者隔天的或者隔周的业务对齐会上一起讨论,会议频次根据项目实际情况自行安排,邀请成员通常是设计师和业务分析师一起,又是也会邀请其他角色,视会议需要讨论问题而定

  • 方便参与不同业务条线的同学对业务全景保持一致

  • 不对角色的思维方式存在差异,可以转换视角看待问题

  • 可以相互评审设计稿,业务分析流程等活动,查漏补缺


  它的优势是:

  1. 保证出方案时间的完整。不会随意打断大家输入和思考的时间,固定时间同步信息

  2. 高效同步信息。不会一次同步太多信息,信息量太大,趋于饱和,会少量多次,最长不要超过1h,如果超过就要增加会议频次来减少时长。



干系人沟通:

终于写到干系人沟通了,这真正是一个大坑

干系人沟通有几个关键点:

  • 建立信任 — 一切良好沟通的基础

  • 频繁沟通 — 减少风险

  • 及时提出自己的见解 — 体现你的价值


建立信任—特别是在项目开始的时候,这一点是致命的,如果开始时能建立良好的信任关系,那么在后期很多小问题的决策上,还有客户对你方案的认可上都会容易的多。


如何在项目开始的时候建立信任呢?

  • 对客户现有产品业务能快速的理解——C端的可绕过(相对比较简单,容易理解)。这里特指B端产品,部分B端产品的业务有时专业性极强,特别是之前我们做的这个项目,做用户访谈时,每一句话都能用多个专业术语,你还没有弄清楚这是怎么回事,就要跟上下一个话题了。对于我们这种非本专业的设计师来说,要想做好设计,提升用户体验,开始就要建立对产品业务的了解。


      -自主学习,通过各种渠道找学习课件,提前对该领域专业术语作出梳理;对相关的背景知识有所了解,对领域现状有所认知,包括现存的竞品也可以找来看看,借鉴学习。


      -找领域专家寻求帮助,对于是在无法获取经验的领域,也找不到相关的一些信息渠道,可以涉及到一些行业机密,可以酌情寻找第三方领域专家,和领域专家进行访谈,从他们哪里可以拿到很多一手资料。当我们对项目有一些假设时,也可以找领域专家验证假设的可行性


     -向访谈对象学习,可以判断访谈对象的性格特质,如果很明显的流露出善于表达,喜欢和你倾诉更多的信息,那么可以把握好机会,适当的询问一些领域问题


     -向客户学习,PO也许不负责具体的业务条线,也可能多年不再碰具体的业务操作,但是他们对于理论的掌握还是有一定的借鉴作用的。

       

       当然了,现在收集到了这么多信息,还需要整理和消化,并且验证信息的可靠心是否是正确。

       多渠道信息交叉验证

       信息之间能否相互关联,相互串联,形成闭环


  • 专业技能维度——专业能力维度是设计师的立足之本了,毋庸多说,但这里需要强调几点


    -设计逻辑清晰,设计结果很重要,但设计思路同样重要,很多设计师在展示自己的方案的时候,只呈现做了什么,结果如何,很好,很精良,但是一定要有逻辑连贯的思考过程,才能体现你的思维逻辑,我们的方案不是凭空捏造的,不是一拍脑袋想出来的,我们的设计是经经过了哪些步骤,这个步骤的作用是什么,设计结论是如何推倒的,这样的设计包含了哪些设计原理 ,好处是什么。牺牲了什么,如何权衡它的牺牲的。

       

    设计从战略层倒表现层,越是取近于表现层,其评判标准就越主观,众口难调,特别是面向非设计领域的专业人员来说,这个评判标准在我们手上,我们要给出来我们这样做的理由是什么,好处是什么,才能得到客户的信任。


频繁沟通 不要闷头设计哦,在项目的每个阶段都要定义定期展示案例的时间点,除了这些时间点外,还可以约

这里从问题的角度来会切入吧

  • 需求变更,反复无常

  • 半路杀出程咬金 — 干系人变更

  • 增加项目范围

  • 老大不满意

  • 干系人意见冲突

  • 干系人不认之前做的决策



》需求变更,反复无常

一般情况下,按照正常的项目流程来走,我们我们通过痛点发散出来的机会点一步步的收敛出需要继续设计的方案后 ,用户侧的需求优先级是已经被考虑进去的,所以突然变更的需求大多可能是来自也无方,或者超级VVVIP 用户

判断是什么类型的需求?

合理需求:可以对需求进行规划,判断项目需求的优先级,如果合理且紧急,可以和相关干系人对齐,给予初步方案计划,对部分现有需求做出置换(如果干系人经常变更需求,可以对设计方案作出估点,按照人/天置换需求),如果合理不紧急,拿出我们的权衡滑块, 明确需要 foucs 在当前项目优先级下,不要过于发散,可以定制相关产品演进路线通过迭代演进方式逐步实施


不合理需求:可以委婉拒绝,如果实在无法拒绝,可以花费一些小effort,告知他为什么不合理



半路杀出程咬金—干系人变更

  1. 可以在识别核心干系人的时候,询问清楚在项目进行过程中是否有核心干系人的变更,提前识别

  2. 有时干系人的变更是突然的,无法提前识别,不要慌,继续往下做。一般干系人变更可能会带来以下问题:

  • 要推翻之前的方向——相当于要从新立项,如果方向都被否定了,就不要继续往下做,及时止损,重新规划项目方向。

  • 要新增项目范围——新增的范围非常大,大到可以重新规划一个新的项目,就在规划新的项目;如果新的范围可控,还是根据本项目的权衡滑块来判断,哪些是优先级高的范围,先做,不高的置换出来。


》老大不满意

   1.减少老大不满意的风险,就是多建立沟通,最好可以亲自向上层级汇报。

   2.保证方案的逻辑性,所有的设计思路都是有据可依。

   3.保证方案给用户给企业带来的价值。对于比较成熟的项目,最好价值是可以被量化,可衡量的,如果无法用数据横向衡量,可以用定性的方式来判断价值,比如在用户验证的时候,检测新的方案是否能满足客户的需求,用户对新的方案是如何评价的,在无数“证据”下,老大也不会无缘无故的不满意


干系人意见冲突

  1. 不要做干系人之间的传话筒

  2. 拉着意见不一致的干系人一起讨论问题



》干系人不认之前做的决策

这件事情在某些客户干系人身上还挺常见的,对于超级难管的干系人,每次大会都要发邮件,不是不敏捷,是为了介绍缺少文字证据,而出现更多的坑

  1. 重要结论,会议纪要+邮件跟踪

注意:一定要结论先行,大部分的人没有耐心看完所有的内容,但是加粗字体的会议结论是能简明扼要的概括,本次会议通过了什么决策。有什么遗留事件,具体的责任人是谁,需要完成的截止事件都要标明


以下附上邮件纪要的格式介绍


项目监控

这个过程和项目执行的过程应该是穿插进行的,时间是非常有限的,不要面面俱到的跟踪,抓大放小,只在关节节点验收,比如前面项目执行中提到的如何拆分任务,同理,在验收的过程中,也可在组内的对齐会上验收设计输出内容是否符合标准,是否有易用性问题,如果这是非常细小的圆角,交互的方式,布局的方式,可以交给团队成员自己把控,如果一个设计师从用户体验要素的5层出发,每一层都面面俱到,无微不至,在这样的大项目里面是很难管理的,把更多的空间留给设计师自己。


把有效的时间集中放在有较大提升价值的事情上:

  • 保障产品价值交付

  • 用户体验是否有所提升

  • 现有的资源下,如何平衡,实现价值


拆分对内验收节点:

把大的任务蛋糕拆分给每一个小伙伴后,他具体怎么吃,可以让他自行安排,告知完成的时间阶段,在特定时间端内验收质量问题。


定期复盘:

通常我们通过 Retro 的方式进行复盘,时间周期视项目的时长来定,较短的项目可以安排为每两周一次的 Retro,Retro 的步骤。1.宣誓(可以跳过)/2安全性检查/3分别梳理 好的部分,不好的部分,和建议。好的部分鼓励团队继续保持,不好的部分通过投票,选取前 Top 问题进行 讨论整改建议。在下一次的 Retro 的时候进行复盘,看看这些问题是否都有改进。


当然还有很多做复盘的方式,方法本身不是最重要的,复盘的核心就是为了改进上一阶段做的不好的地方,并且在下一阶段有所改进措施。让项目运行变得越来越好。


进度跟踪:


通常会用项目周报的方式,想客户展示项目的进度,现在进行到项目的什么阶段,有哪些产出物,项目是否存在风险,项目计划及人员投入比例



项目收尾

整体&归档:整理交付物,包括设计资产,使用说明和相关目录,方便其他人员可以持续迭代

设计归档包含的重要组成部分包括且不限于:

  1. 设计源文件

  2. 用户研究报告

  3. 用户验证录屏材料

  4. 用户访谈大纲

  5. 遗留问题跟踪

  6. Showcase材料

  7. 知识传递录屏

  8. ...

  

 如果文件夹过于分散,则需要写一张目录,目录上附上文件夹的链接,方便呢其他的小伙伴能快速的找到


知识传递:注意保留录屏文档,当项目人员变更,可以及时传递上下文

  1. 在做知识传递之前,要和大家确认现有的产出,保障产出物不会在作修改,保障所有人都达成一致后,在开始后做知识传递。

  2. 做知识传递的时候,一定要记得录制屏幕,以防有的小伙伴没有参加,或是之后还要分享给其他的小伙伴使用,这样就可以避免一边一边的重复人工讲解啦,还有预留给大家提问题的时间,看看大家还有没有不清楚的地方,尽量在会上一一解答。



PS:还想再分享一个,当项目中所要处理的事情过多时,如何排列优先级的问题

一般情况下,先看一下这些事情的依赖关系/事件难度,当紧急成度都很高的情况下

有依赖的关系的一般需要提前去收集信息,跟催进度,但花费是假相对较多,可能还有相互依赖,外力因素不可控

或者需要提前与人沟通事件,判断沟通时间是否合适,但花费是假相对较少,但需要提前预约,外力因素不可控

事件越难的越需要留更多的时间处理,内在因素不可控,事件简单的则可以安心放在后面进行,内在因素可控


可以按照风险等级排序方案:信息收集类> 约人沟通类>困难事件类>简单事件类


文章来源:站酷 作者:青沐CHIMO 

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

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

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


职场太内向,怎么破?

seo达人



很多同学工作后一定要明白,企业不是学校,职场也不是学校,公司招你过去是希望你给公司带来价值,对设计师定位一定不是学生,好的企业可能会有很多内部培训,学习的机会,但是一定是靠你去主动学习。这也是职场的潜规则。关于职场、关于工作方法的问题。今天分享一篇和工作无关的内容,更多是关于设计心态的问题,希望给此刻迷茫的你一点方向。

 

1.企业不是学校 

图片

很多同学工作后一定要明白,企业不是学校,职场也不是学校,公司招你过去是希望你给公司带来价值,对设计师定位一定不是学生,好的企业可能会有很多内部培训,学习的机会,但是一定是靠你去主动学习。

这也是职场的潜规则,工作越久越会发现,很难有人会毫无保留的教你,如果我们一直处于学生思维,只会在职场中失去好的机会。职场上的学习,一定是主动的。

图片

学生时候我们学习是被动接受,老师教什么,我们学什么,但是职场不一样,一定要从“被动”改为“主动”,公司会有很多内部培训,学习资料,但是学习一定要记得是自己的事情。

好的公司会有体系化培训,相当多的公司是不愿意付出培养成本的。比如之前在阿里,内部很多设计培训、课程,但是大家都主动去报名学习,没有人逼着你一定要学,大家时间都是一样的。所以从“被动学习”到“主动学习”是新人设计师职场进阶的第一步,现在互联网上学习资源那么多,无论我的星球,还是各种教程,只要你想一定能学到,关键在于你自己意愿是否足够强烈。

a

 2.掌握正确的学习方法 

图片

互联网很难做,也有很大一部分原因是,现在信息爆炸,每天充斥着各种需要我们学习的知识,仿佛不学习就会落伍,C4D、AE、插画等等,如果没有独立思考和判断的能力,我们很容易随波逐流,什么都学,最后越学越迷茫。

图片

上图就是我们大多数学习状态,每周学下AE,学下C4D,然后三天打渔两天晒网,最后会发现,都学的很一般,没有一个学的很精通。

聚焦学习,单点突破

图片

正确的学习方法是什么,是单点击破,横向拉通,我们要聚焦学习,一段时间只学习一个知识点,比如你最近学AE,就花精力把这个技能彻底掌握,再去学下一个,我把这个叫100小时刻意练习,我在星球里,也是带着大家这样去学习知识点。当你学习一件事情持续100小时,每天3小时,坚持3个月,你会比90%人都要学习的好。

图片

别看只是一个小点,但是当我们掌握的点多了,自然而然就形成了线。

 

考虑投入产出比

图片

学习的目的最终是要学以致用,现在大家每天工作本来就很忙,如果毫无目的地学就没有意义了。一定要考虑投入产出比,要根据自己的规划去学。

图片

比如你未来是走体验设计师的方向,那么你就应该学技能树里面相关的内容,比如数据研究、交互知识、产品思维、商业思维这些维度,这些方向是未来帮你迈入新的台阶需要具备的能力。

如果你去学习C4D,或者学品牌设计,哪怕你学会了,也学得很精通,你去面试支付宝设计师,你说你最强的技能是画LOGO,那肯定是不合理的,因为说不定支付宝LOGO几年都不会换一次,你这个技能在团队,根本用不了几次,更别说成为优势。

w

3.性格上一定要有「要性」

图片

阿里有一个词叫「要性」,什么意思呢,简单的说就是对一件事物的渴求程度。作为设计师也是如此,无论我们学习,做项目,还是工作上,都需要有这种精神。

 

要性决定判断

图片

我们今天接到一个项目,判断这个项目好好做一定会有很大的市场反响,比如我做双11这个项目一定会被上亿人关注,那么我判断这个事情价值后,我会很拼,会拼尽全力做好,因为我知道这个事做好后带来的价值,假如我没有那么强渴望这个事情,或许我就当一个普通项目,也不会去判断它的价值,说不定就错过了提升和磨练的机会。

 

判断决定行动

图片

要性能决定我们的判断,假如我判断这个事情一定要做好,做好后可以发到behance,或者放作品集里面。那我的行为也会跟着变成正向。

工作多年后,其实对于加班不加班,其实很好衡量,这个事情加班做好对你晋升、对你成长有没有好处,如果有自发都会去加班,如果这个事情就是一个投入产出比不高的,我可能就会去另外更有价值的事情。要性决定我们的行为。

同样个人学习也是一样,如果你渴望掌握它的欲望足够强烈,那么根本不需要人督促你,你都会自发去学习。这就是信念的力量。

 

行动决定结果

图片

没有好的过程一定没有好的结果,特别在这个商业互联网大背景下做设计,如果没有好的流程和过程,最后很难拿到好的结果。所以作为设计师,必须在职场生涯都具备这种「要性」,渴望成功的心态去做每一件事情。

 

4.当你没优势的时候,唯有勤奋 

图片

每个人都想去大公司,去做优秀的产品,但是光有想是不够的,最重要是去做。能在夏天做的事情就在夏天完成吧,不然到了秋天,它就黄了,到了冬天,它就凉了……

w

想不等于做

图片

光想是没有用的,大公司的设计产出,你目前能做到一样设计质量么,或者差不多水平,如果不可以,凭什么觉得大公司要你,前面我也说了,企业不是学校,不是你想去就能去,何况大公司就那么些职场,说万里挑一毫不夸张,你没有过硬的本事,你没有做过大的项目,凭什么相信你可以做好几亿的用户的设计。

w

充分利用工作外的8小时

图片

所以在我们起跑线比较低的时候,没有学历,没有知名项目,没有大厂背景,唯有勤奋,上班时间8小时,大家都是被项目缠住,重复利用下班和周末时间,不断去提升专业技能,唯有勤奋你才能有弯道超车的机会,我们这一行和其他行业不一样,没有任何捷径,如果有,很多人都去尝试了。

o

学会曲线救国

图片

大公司招人都是有标准的,有些岗位就是有鄙视链的,比如喜欢招知名公司背景,海外的,年轻有潜力,做过知名APP的,如果简历上没有这些很难进去的。但是就因此放弃么,当然不是。

学会曲线救国,我没有知名项目,那我是不是提升我专业项目,争取去一个规模小点公司,积攒知名项目案例,比如每年TOP100的应用榜单,里面其实很多小而美的公司,先去这些公司锻炼好了,再去二线公司,再去一线公司,循序渐进往上走。

不要一根筋的,在毫无背景、毫无资历情况下去碰壁,试想你是大公司人,你是不是也想招一个被市场验证过,有过同样公司背景和项目的设计师。

 

5.设计师推动力是带着方案 

图片

很多时候,我们很想为产品做点什么,也发现很多产品不好用的地方,然后在没有任何准备下,去吐槽产品,吐槽设计,这是一个大的忌讳。因为你不了解当时背景,是排期不够,还是人手不够,导致线下效果。盲目吐槽毫无意义。
正确的做法是,今天你对某个页面不满,或者设计不满,应该带着你觉得满意合理的方案,去和主管向上沟通,有设计依据和推理过程。

q

左手艺术,右手科学

图片

你推动的方案,切忌只是从设计师视角出发,一定要从更全局去出发,所以除了设计上方案要比之前好,你的设计过程一定有理有据,艺术一面是视觉交互维度。
那么科学一面,一定是有数据支撑,比如提案前你充分梳理了现有数据,从数据中发现的问题,都可以作为设计线索。同时可以加入一些设计声音,比如苹果商店评论,或者微博评论,客服或者用研那边建议。通过这些来支撑你的设计提案。

t

让决策者做选择题,而不是判断题

图片

提案也有很多技巧,后续再和大家分享,但是很重要一点就是提案时候,不要给领导太多的方案选择,很多设计师很容易犯的错误就是,提案时会放一堆方案给领导看,让领导做决策,这样最终结果还是继续改下去。

其实提案,领导关注你的设计逻辑和推导过程,如果整个过程比较顺利,结果一定是符合预期,有正确的设计过程结果也不会差到哪里去,一般设计提案重点推导一个方案,让领导说「YES」或「NO」,如果领导说不可以时候,再把其他方案抛出来。

 

6.你的一招鲜就是你的竞争力 

图片

什么是竞争力?人无我有,人有我全,如果你在一个几十人团队,怎么能被领导记住,一定是你具备其他人不具备的技能,或者你这个技能在你们团队是最好的。任何时候,设计师具备一招鲜的能力,都会很吃香,你可以想下你的团队,那些备受领导喜欢的设计师是不是都具备这个特征。

图片

每个人都想成为主角,团队核心,怎么做到,就是某个专业能力上,设计总监或者主管有事情第一个想到就是找你来完成,那么就成功了。

比如插画第一个想到你做,UI第一个想到你来改版,品牌第一个想到你来完成。如果做到这样,平时加薪升职一定少不了你,任何时候一招鲜的设计师都可以在职场上有一席之地。

q

7.打造自己的标签 

图片

职场是个人情社会,有人的地方就有江湖,每个人在其它人心中都有个「标签」,虽然我很讨厌职场贴标签这种潜规则,但是无法避免。所以与其你被人贴上一个标签,不如你自己把标签人设立好。职场人都需要2个标签。

w

第一个:专业标签

图片

专业标签,毋庸置疑也是最难的,大家对你专业上评价怎么样的,哪方面是你特长,在主管心中是很一般,还是说UI上是你优势,数据是你优势,你需要自己给自己定位好,假设你想让别人觉得数据分析是你专业标签。

确定好了后,然后需要项目不断去反复验证这一个标签,在大家心中的印象,无论项目沟通,还是团队分享,都应该去打磨这个标签,打磨好了,优势是很大的,正如我前面所说,大家后续领域想到你,你就是第一人。

o

第二个:性格标签

图片

性格标签很好理解,你在大家心中是个什么性格的人,活泼的,有才华的,有魅力的,吃货还是内向的,职场上人和人之间关系很微妙,虽然不提倡站队,但是这种事情哪里都少不了。

那些性格活泼开朗,比较玩的开的,往往容易受欢迎,所以你要问自己,你希望在大家心中是个什么样性格,是内向的老黄牛,还是吃货一枚,还是美食专家。你需要建立一个性格标签,去和身边的人情感上维系。否则很容易职场上吃亏,和主管没有共同语言,没有尿到一个壶里,那你后面晋升,涨薪股票,或许也没你什么份。

w

第三个:没有无缘无故的爱

图片

和同事之间多去培养一些共同的爱好,在互联网公司做事情,很多事情其实难的不是事情本身,而是人的关系处理上,在大公司的同学应该很能体会。

要不,很多同学一起去抽烟,一起去逛街,一起去喝酒,很多时候先成为了朋友,做事情会更加顺畅,同时这个过程你获得的信息也足够多,信息的不对称往往会让你做事情云里雾里,所以没事,多和研发的兄弟,产品运营的同学,吃吃饭,培养一下革命友情,对你只有帮助,没有坏处。

 w

最后 

图片

这是我所总结出来的一部分职场心得,或许和设计无关,但是在我们工作中却尤其重要,希望今天的分享你会喜欢。

原文地址:我们的设计日记(公众号)

作者:sky

转载请注明:学UI网》职场太内向,怎么破?

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

截屏2021-05-13 上午11.41.03.png


文章来源:csdn

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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



设计要知道-HMI设计必看!车载中控的前世今生

分享达人

首先先普及下HMI的概念

HMI:- Human Machine Interface : 人机界面,现在多指车载交互系统体验设计。

既然说到人机界面,我们先来设计的载体是如何演变的。




一、车载中控仪表盘演变过程


1886 年,由卡尔·本茨发明的第一辆汽车。当时根本就没有所谓的仪表盘概念,所以载体还得从1908年T型车(Ford Model T)说起,到2012年划时代的特斯拉Model S,汽车仪表盘目前经历四代。



1、第一代:以按键为主


机械式仪表盘: 第一个时代仪表盘为机械芯仪表,一般包含了车速里程表、转速表、机油压力表、水温表、燃油表、充电表等,之后汽车仪表还需要装稳压器来稳定仪表电源的电压,抑制波动幅度,保证汽车仪表的准确性。初代的汽车仪表盘主要以传统的热式和动磁式,显示的信息极为有限,更多的是车辆物理信息“通信员”的角色。


在机械时期中控台哪有什么屏幕可言,那时候的中控台就是收音机和空调的调节器,而且都是实体按键的,只能满足驾驶的基本需求,没有屏幕,都是照搬飞机中控布局,以实体按键为主,功能简陋单一。堆砌功能按钮仪表,没有交互可言。






2、第二代:电气式仪表盘+小中控屏


第二个时代的电气式仪表盘终于诞生,从真空荧光显示屏(VFD),发展到采用液晶显示屏(LED)及小尺寸薄膜晶体管显示器(TFT),显示屏显示的信息越来越清晰、快捷。目前电气式仪表在市场的保有量最大,且一般采用机械仪表结合数字仪表的方式,例如车速、转速信息采用指针,指示灯信息采用LED等点亮,其它信息则采用TFT屏。



虽然相较于第一代机械机芯仪表增加了不少功能,汽车信息反馈也更全面更及时,但是其发展速度却明显与汽车行业不相匹配,对于更深层次的驾驶需求,电气式仪表仍无法满足。




3、第三代:全数字化仪表


汽车仪表盘领域在不断追求更新,于是划时代的全数字液晶仪表盘孕育而生,也是就我们常说的虚拟仪表盘。全数字汽车仪表盘使用了一整块液晶屏取代了传统的指针和刻度表,所有信息都通过这块屏幕显示出来。


单从外观上来看就能给人以一种比较高大上的感觉,这类仪表盘上往往没有指针等部件,所有信息都通过屏幕传递出来。功能更强大、信息显示更具逻辑性,驾驶者接受信息更快,提升行车安全。也可以根据个人喜好调整相应参数,比如比亚迪的仪表盘就可以改变背景颜色。在高级点的,像宝马的全数字仪表就可以切换N多种模式。


2007年iPhone问世后,大屏、轻薄机身、高清显示屏、可安装应用等功能引领了整个行业的革命。电动汽车行业飞速发展,智能AI和人际互联等人车交互概念也跟着兴起,对于中控台的需求和功能复杂度也跟着越发精细起来,结果就是屏幕越来越大。


2013年上市的特斯拉Model S,座舱里最惊艳的就是那块17寸的大屏。超高的分辨率和流畅的操作,和漂亮的UI设计,最初让很多美国民众疯狂。就像苹果手机颠覆了传统手机业,特斯拉也颠覆了传统汽车行业。


2014年换代的奔驰S级将两块12.3寸屏幕连在一起,合成了一块23寸大屏,比特斯拉的大屏还多出6英寸。




拜腾M-Byte,48寸巨屏,横向贯穿仪表台,再一次颠覆汽车的内饰设计。



比亚迪系列汽车的旋转大屏,玩出新花样,可以旋转控制,就像手机横屏和竖屏的场景。


纵观下来,其实不难看出,虽然汽车的中控屏幕也是往着越来越大的方向发展,但因为空间以及功能需求的不同,相比起手机来说,中控屏幕的变化更具备多样性。




4、第四代:HUD显示屏


从上世纪80年代,抬头显示技术在汽车领域已经开始被使用,直到现在才开始逐渐展露头脚。

HUD抬头显示器(Head Up Display),又叫平视显示系统。它可以把重要的信息,映射在风窗玻璃上的全息半镜上,使驾驶员不必低头,就能看清重要的信息。


战斗机是率先应用HUD抬头显示器的。飞行员在空战中,需要交替观察舱外目标和舱内仪表,易产生瞬间视觉中断,因此会导致反应迟缓、操作失误,并有可能贻误战机,采用HUD抬头显示可克服这一缺点。


第一架使用HUD抬头显示的飞机是美国海军的A-5舰载机。民用航空最早使用HUD抬头显示是法国达索飞机公司的mercure飞机。



在复杂多变的道路上开车,驾驶员双眼离开车辆前方,是个非常危险的事情,尤其是在高速公路上更是明显。于是很多车型,就给车辆配备了一个不需要挪开视线,就能知道车辆基本信息的配置,这就是HUD抬头显示。



HUD作为一款新技术,优势显而易见。当驾驶员需要查看仪表盘或中控台上的信息,视线至少需要转移0.3秒,而HUD投影的信息就在驾驶员平视的正前方,驾驶员可以将更多的注意力放在路面上。将驾驶体验及驾驶员对于路况信息的认知能力进行革新式升级。





二、六大车载系统的特点


现在各家系统百家争鸣,各家车载系统设计有哪些不同?



1. 阿里 斑马智行


简介:


1、阿里车载小程序是一种无需下载安装即可使用的“应用”,旨在为用户打造“随时可用”、“用完即走”的使用体验。


2、AliOS作为互联网汽车操作系统,原生地支持阿里小程序,引入阿里生态服务的同时也面向开发者开放,围绕车场景为用户提供从出行到生活的各类智慧服务。


特点:


1、设计特点:


独立的大卡片式的内容界面模块方便车主在行车过程中单手操作,其配色鲜艳,风格扁平,符合使用场景和国人的使用习惯。


2、功能特点:自带场景智能感知的基因。


得到车主授权后,车载小程序可以围绕行车场景,实现上车前、行车中、下车后自然串联的智能化场景服务。


用户可以在车上通过触控、语音、手势等多模态交互方式,咨询附近的推荐餐厅,小程序会基于用户的喜好作出推荐,还可以预约排号;到达餐厅附近,系统会自动唤醒小程序,为用户找到停车场;下车后,车载小程序会无缝连接到手机小程序端,用户可以在手机上查看餐厅的预约信息等。


△ 斑马智行2.0系统设计


斑马智行,采用智能手机界面和应用商城下载 APP 的使用方式,实现车载和手机的双重控制。


强大的云端特性在语音识别和线上互联方面提供了良好的使用体验,车主可以连接手机蓝牙后,读取其手机通讯录,实现利用车载系统拨打和接听电话的功能。支持 USB 接口,通过 U 盘实现播放音频、视频文件等。在娱乐生活方面,内置虾米音乐,蜻蜓FM,喜马拉雅等,支持在线搜索,在线播放以及在线广播等服务。


同时,斑马智行依靠阿里强大的技术和资源支持,打通停车场,加油站,高速公路支付等,使用户驾车时产生的费用均能通过支付宝支付。




2. 百度 Car Life和Apollo


简介:


1、打造智能车载服务生态,满足用户出行、娱乐、生活等多元化需求,构建人-车-家一体化互联闭环成为时代趋势。


2、智能小程序,是百度提供的一种技术解决方案。开发者基于此开发出来的服务,在各类宿主环境(手机 App、车载系统、IOT 设备等)中,可做到用户无感知安装,即点即用。


特点:


1、设计特点


车载端主界面分别采用蓝、绿、红、灰四个色块对应四个功能模块,「发现」集成音乐、娱乐、听书、电台等特色音视频服务,采用红色在界面中最为突出,其设计风格整体扁平,面性 icon 利于识别与点击。


2、功能特点


智能小程序包括“车后服务”、“资讯”、“休闲游戏”、“视频”、“购物”、“亲子”、“旅游”、“工具”等8个类别,一共80多款。车企可以根据车型定位和自身需求自行定义和组合可供使用的车载小程序。


百度的车载小程序大部分场景下还是只能依靠用户用语音唤醒,但在生态的开放性上,百度车载小程序则做得更为彻底,可以在百度App、百度地图、百度贴吧、百度网盘百度系App上运行。





3. 腾讯 Ai in Car




简介:


1、“腾讯小场景”是专为出行场景打造的车载轻应用生态,部署在云端,不需要下载,即用即走,并支持语音交互。


2、分为3类,出行服务小型车、生活服务小程序和视听服务小程序。


特点:


1、设计特点:


运用的FutureLink3.0系统,FutureLink3.0 基于安卓平台开发,在 12 英寸的中控屏幕上并没有将大量的图标堆砌在首页,反而以地图为背景,将六大功能模块以大板块的形式布局在地图下方,整个界面设计简洁。


2、功能特点:


最大特色:基于位置和场景会被自动唤醒。比如用户经过加油站、停车场、旅游景点的时候,有些购买和支付的服务就会主动弹在车机上,用户再通过语音完成操作。


手机小程序是“人找服务”,那么腾讯车载小程序则进化成“服务找人”。


△ 腾讯在车载场景下的生态布局


Ai in Car,顾名思义,基于 AI 的连接能力和生态,融合腾讯内容生态的优质资源,包括资讯、视频、IP、文学等板块,为车主提供更丰富的内容消费。风行搭载的 FutureLink3.0 车联网系统,就是和腾讯深度合作而诞生的优质案例。



△ FutureLink3.0系统界面


只在设置页中,才会出现二级子菜单列表,而且提供的设置项目也不多,界面层级简单,不累赘,也给司机带来轻松愉悦的操作体验。同时,基于行车安全考虑,在类似天气、股票等查询功能上,比较依赖语音控制。在娱乐生活方面,打通手机和车机账号,用户无需切换账号就可以与车载导航、电台、QQ音乐、微信等功能无缝衔接,支持车主组建聊天组,在行车途中与好友进行实时沟通。


从整体来看 FutureLink3.0 的设计,它更像是一个把需求页面展现在车主面前的「轻应用」,没有传统概念上的主界面、多层交互菜单以及相应的「系统特质」的设计,它更希望把海量资源建立在云端,终端只给车主呈现其所需要的服务即可。




4. 谷歌 Android auto


简介:


Android Auto 系统的工作原理是将手机连接到兼容的汽车,让驾驶员可以使用汽车屏幕和语音操作与手机的应用程序进行交互。它提供了一种导航、收听媒体和消息等的简单方法。


特点:


1、设计特点:


在 UI 框架设计方面,主屏幕以卡片的形式显示通知、活动、导航和消息,右下角有启动语音命令的麦克风图标和底部的活动栏,这些特性属于全局 UI。在它下方,应用程序内容区域显示应用程序启动器或当前使用的主应用程序的内容。



△ Android auto手持设备与车载设计系统


Android auto 将 Android 平台扩展到汽车上,它有两种使用方法:在手机上或在兼容的车载屏幕上。


它有一个简单的界面,标准化的用户交互模型和强大的声音动作,其目的是帮助司机尽量减少分心。需要注意的是,为汽车设计交互式应用程序与手持式设备的设计有根本上的不同,其应用程序的交互界面应该简化,以确保司机的眼睛和手集中在开车上,减少司机分心。


△ Android auto车载系统UI框架


卡片上提供如消息字符串、图标、图形和操作等内容,会根据用户最近的使用情况和优先级来确定卡片的大小。主屏幕会限制卡片的数量,以保持列表的简短和相关。因此,当新的、更相关的内容出现时,应用程序的通知可能会从屏幕上消失。同时,抽屉式的交互方式,提供了简单的操作和导航。每个抽屉项目必须提供一个单一的触摸目标,避免在抽屉里放长的列表,或者在相同内容的视图之间切换。这里官方给出的最佳 UI 做法是简化内容,关注上下文,显示新鲜的、有用的和大多数不滚动的项目,使用单行,对决策至关重要的较长字符串使用两行。




5. 苹果 CarPlay



简介:


CarPlay 车载系统旨在令用户通过汽车制造商之原生车载系统来使用、操控iOS设备并发挥其功能。该产品的首个版本计划于2014年发布,最早出现在一些制造商的汽车展览上。


特点:


1、设计特点:


基于手机映射,所以界面除了横向布局外,icon都和手机端统一。以简洁的布局提供有用的、重点突出的信息,便于从驾驶员座椅上进行扫描。不要用不必要的细节和不必要的装饰来弄乱屏幕。


在整个应用程序中保持整体一致的外观。一般来说,具有相似功能的元素应该看起来相似。


2、功能特点:


作为车内辅助、操作、娱乐的中心,Carplay 可以直接连接到汽车中控的触摸屏上,提供基于 iOS 的相关的服务和应用。Carplay 的整体设计围绕着车内驾驶这一使用场景,而它的设计原则也围绕着这一场景来规划:

  • 成熟。基于最熟悉的 iOS 应用,来设计界面元素,并提供熟悉、直观的体验。

  • 简短。采用尽可能简短的交互,不过度引人瞩目

  • 相关。屏幕显示信息高度相关,提供尽可能少选项,不需要复杂决策

  • 语音。基于Siri,以语音交互为核心,司机无需视线离开前方,手也不用离开方向盘即可完成交互。


全新的电子车钥匙,加上 Apple CarPlay 车载流畅的使用体验,让 iPhone 能在旅途上发挥更多作用。地图、电话、信息、音乐、日历、一言、一触、一旋随你驾驭。






6、华为车机应用



简介:


HMS for Car是华为终端云服务打造的智慧车载云服务解决方案,基于HMS(Huawei Mobile Services),通过AI场景引擎结合华为生态资源,为用户提供精准丰富的出行场景内容和服务,助力汽车从交通工具向具有交互和服务的能力的智能终端进化。


华为快应用是一种基于行业标准开发的新型免安装应用,其标准由主流手机厂商组成的快应用联盟联合制定。开发者开发一次即可将应用分发到所有支持行业标准的手机运行。


HMS Core提供端、云开放能力,帮助开发者实现应用高效开发、快速增长、商业变现,使能开发者创新,为全球用户提供精品内容、服务及体验。

1、全球化分发。已上线超过170+国家和地区。

2、全终端接入。全面支持从小屏幕到大屏幕各种智能终端。

3、全场景支持。快应用直达链接和卡片嵌入全终端场景。


特点:


1、设计特点:


在交互界面上,Carplay和Carlife由于使用的投屏方式,主界面依然是一个个的APP图标,需要点击启动进入后才能使用。笔者认为采用这样移动端过于笨重的交互方式并不适用于车载场景;HUAWEI HiCar的设计理念是"安全便捷、自然舒适、智能贴心", 对车载端的人机交互要素重新布局规划设计,采用桌面卡片的设计方式,以满足复杂驾驶状态下的使用需求。



桌面卡片是应用内容和功能特性的重要载体,用户通过对卡片的快捷操作直达应用的核心功能,提升交互的便捷性。应用可通过接入 HUAWEI HiCar 桌面卡片的方式呈现最核心的功能和服务,并根据自身的需求特性,自行组合卡片元素以满足不同场景下的用户诉求。

  • 背板:背板样式可以为色彩填充或设置背景图。

    背景色支持黑、白、彩色三套。

    应用需提供三套背板以适配卡片主题切换。

  • 品宣区:品宣样式为图标+文字,应用可根据在此区域显示品牌图标和名称。

  • 内容区:展示与应用场景相关的信息,其内容可以是图片、文本或图文样式。

  • 操作区:操作区为文字或图片按键,最多 3 个控件或 1 个控件组。



2、功能特点:


华为智慧助手,可结合用户使用场景,以卡片形式推送提醒、服务和行程,实现智慧化服务找人。例如,送孩子上学时,车机端华为智慧助手将自动推送"有声续播"卡片,用户点击卡片,即可一键续播孩子在华为手机上没听完的有声儿童内容;用户在开车下班回家路上,进入离家500米范围内时,车机系统可自动启动"回家模式",提前打开家中的窗帘、空调等设备,方便用户享受惬意生活。



My Car功能面向车企开放华为手机等智能硬件系统级入口能力,能够实现远程控车、查车、汽车服务/告警关键信息等反向推送能力。远程控车功能,可以满足用户高频控车诉求,例如,远程开关空调、寻车、查看门窗状态等。另外,当车辆胎压不足、门窗未关闭时,用户也能通过手机、车机及时收到提醒。





三、系统的开源地址


1、阿里Alios开放平台

https://miniapp.alios.cn/index#/document


2、百度车载生态开放平台

https://chelianwang.baidu.com/homepage/openPlateform/design/sec-4-1.html


3、腾讯-车载小场景(私我领取PDF)


4、谷歌驾驶

https://developers.google.com/cars/design/design-foundations


5、苹果apple car play

iOS - CarPlay 车载


6、华为车机三方应用交互设计规范

https://developer.huawei.com/consumer/cn/doc/50902#h2-1587181522014






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

截屏2021-05-13 上午11.41.03.png


文章来源:站酷    作者:郝小七

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

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

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



UI&UE实用方法论 | 「美即好用效应」就是UI存在的价值吗?

分享达人

有研究表明,人们会自然地认为外表更漂亮的人拥有更加优秀的品质特质。即我们对一个人的外表印象会影响对他品质的感受和思考,心理学上将这种行为称为「光环效应」


同样有人认为,这样的光环效应作用于人机交互设计领域也一样是奏效的。好看的设计,会让用户认为产品更好用,外观会影响用户对产品可用性的感受,这就是所谓的「美即好用效应」



一、关于该定律的实验


前面我在谈「费茨定律」或是「恐惧留白」的时候,大多数方法论都可以溯源到真实的科学实验或心理学文献记录。


但在查找「美即好用效应」资料的时候,所有内容对初始实验都是一笔带过:


1995年,日立设计中心的研究员 Massaki Kurosu 和 Kaori Kashimura 通过26种不同的 ATM 交互界面对 252 位参与者进行详细的用户体验测试。结果发现,这些因素中很大一部分对真实可用性的影响微乎其微,反而界面美观度对真实可用性的影响出乎预料的大。


表现可用性的决定因素对真实可用性的影响系数大多在 0.000-0.310 之间,而界面美观度这个数据达到了 0.589。



我试着到很多地方去搜索更多关于该实验的记录,却都没有找到相关论文。所以对于这个实验的结果,我只能保持观望态度。(也可能是我检索资料的能力还有待提升...)


首先是我无法确定所有参与者在这个实验中的需求目标是否发生变化,概述中既没有阐明对照组,也没有告知实验对比过程的细节。


其次在「美观度对可用性的影响较大」的实验结论中,科研人员是如何定义「美观度」的标准的?审美是一种主观意识,那么「美观度」应该如何被定义,科研人员究竟是从配色、排版、统一性,还是动态和谐的交互流程定义了实验界面的「美观度」?我们也不得而知。


所以「美即好用效应」在人机交互领域的可用性,究竟是一条科学实验结论,还是属于用户心理研究,抑或只是人传人传出来的自然规律,作为笔者,我本着对我读者负责的前提下,也只能画个问号。


二、「美」在商业产品中的价值层级


在人们追求基本生理需求的时代,「美即好用效应」的作用力必然不会比温饱时代的大。


为什么这么说?从马斯洛需求层次理论模型中就可以看到,对于用户而言,“审美需求”是在保证了一系列缺失性基础需求之后,才会追求的需求层次。



马斯洛需求层次理论映射到用户体验五层理论也是异曲同工,从战略层到表现层,越是重要的层级挂靠的马斯洛需求层次就越基础。拥有巨大商业价值的产品,往往影响其在商业市场中走向的,都是基础需求,而非高层级需求。


这就为什么我前文说道,很多人抽离前提来谈「美」的重要性。用户对「美」的追求是在满足了基础需求的前提之下,如果一个产品的战略、范围层难以落地,空谈「美即好用效应」便是空中楼阁罢了。


表现层在没有可靠的战略前提之下,是毫无商业价值的个人狂欢。


三、UI到底该关注什么


UI是一项纯艺术性创作的职业吗?在我刚接触UI行业的时候,我是这么单纯地认为的,但现在已经不再是了。


我前一阵子看了像素范泡泡老师的直播,其观点我非常赞同,也在社群里和大家进行过了交流。在此我引用两个泡泡老师举到的 iOS UI 的案例,来阐述 UI 探索的「美」,究竟是在探索什么。


  1.iOS为什么激励大部分APP适配暗黑模式?  


大概在去年,网传苹果将强制要求 APP Store 中的应用程序要适配暗黑模式。暗黑模式也掀起了一轮新的视觉设计潮流,暗调的设计语言让产品在视觉上看上去更酷更年轻。


但苹果激励大部分应用程序适配暗黑模式,只是单纯的为了视觉上的好看吗?其实并不是。


是因为后期的苹果硬件设备多采用OLED屏幕技术,比起其他厂商的LCD屏幕技术,有其优点,但也有其缺点。OLED采用低频PWM调光模式,也就是通过低频频闪的方式控制屏幕亮度(一亮一暗、一亮一暗如此反复)。在调低屏幕白光亮度的情况下,频闪很容易造成用户视觉疲劳。这一点极可能成为苹果设备的销售弱点。


于是苹果希望在用户需要调低屏幕亮度的场景中,通过暗黑模式的视觉手法,大量运用黑色,这样OLED屏幕的光源就可以直接关闭,而不需要采用频闪的方式来控制屏幕亮度,从而减轻用户视觉疲劳的现象。



(ps.看不懂的朋友莫急,文末我放了B站up主硬件茶谈的《全网最简洁易懂的OLED与LCD屏幕工作原理与优劣科普》视频,感兴趣的小伙伴可以查看)


苹果主动落地暗黑模式的开发,并且激励在应用市场上架的其他应用也适配暗黑模式,实际上是与其商业目的挂钩的一种行为,只是将解决方案落实到了表现层。


  2.iOS从拟物风格向扁平风格的转换  


iOS7掀起的扁平设计风潮,至今还在影响着UI设计趋势以及用户的审美。但你硬要从个人审美角度去评判曾经的拟物风格与现在的扁平风格究竟哪个更好,只能说仁者见仁。


泡泡老师认为,iOS 拟物风格向扁平风格的转换,也不仅仅是基于视觉「美」的考虑。因为曾经的苹果在全球移动品牌厂商中,拥有更加优质的屏幕硬件,他们的屏幕可以高清显示更多的设计细节,于是仿真的拟物风格在苹果设备上通过其光影、阴影的展示,可以突出苹果的屏幕优势,从而成为其商业卖点。


但后来随着移动设备品牌商的硬件差距不断缩小,高清显示已不再成为苹果独家的亮点,苹果也就不需要再花费更多的设计成本在拟物设计上了。此时的拟物设计成本并不能再持续带来高效的商业回报,从而转向扁平风格,一方面可以提高设计效率、降低设计成本,同时对其周边设计的延展性更高。



从这两个案例中可以看到,UI虽然做的是表现层的工作,但实际上也是在为用户、为商业、为战略而服务。除了视觉的「美」,我们也应该关注产品背后的数据、商业价值,我想这就是UI与纯艺术性创作型设计岗位的区别吧。


四、总结


说了一堆,感觉我好像一个「美即好用效应」的ANTI份子...其实也不全是。我清楚「美即好用」在一些商业案例中的运用,我不否定该定律存在的价值,只是想表达一些看法。


首先我认为不应该在产品还没有扎根市场,拥有产品自身的商业价值之前,过分拘泥于视觉表现层的内容。在腥风血雨的互联网商业市场,迅速小跑迭代,做好用户数据分析,增强产品自身留存实力、激活市场潜在用户,比把目光放在视觉表现上可能更有价值。当产品在一个领域或市场积累了一定忠实度较高的用户之后,「美即好用效应」可能才会发挥其功效。


其次我想对话同行的UI设计师,我一年前在《UI如何提升个人价值?UGD思维了解一下》中已经说到过,UI设计不应只停留在视觉表现层,想提升自我价值,一定要培养超脱表现层的思维能力。


我们不应该一味地信奉「美即好用」。作为UI设计师,我们要通过避免「美但不好用」或「不美但好用」的极端来平衡视觉表现与功能的体验。

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

截屏2021-05-13 上午11.41.03.png



文章来源:站酷  作者:UCD耍家

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

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

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


深度解析蚂蚁Ant Design的设计原则

分享达人



『 Ant Design是什么 』


众所周知蚂蚁集团的B端产品是一个庞大的系统,数量多且功能复杂,而且变动频繁,常常需要设计师和开发人员能快速做出工作上的配合。同时这类产品中有存在很多类似的页面以及组件,根据原子设计理论可以得到一些稳定且高复用性的内容。

随着这两年B端产品的逐渐白热化,越来越多的用户对更好的用户体验有了进一步的要求。带着这样的一个终极目标,蚂蚁集团体经过大量项目实践和总结,逐步打磨出一个服务于企业级产品的设计体系 —— Ant Design。通过组件化设计规范,降低冗余的生产成本,让设计者专注于更好的用户体验。



『 Ant Design设计原则是什么 』


针对B端产品反复出现的一些设计体验等问题, Ant Design 给出标准的设计原则,实现跨应用交互一致性的有效融合。依照这些原则使用 Ant Design 组件设计界面,既减少了不必要的认知成本,又能够提升设计的效率。考虑到需要适应各种定制化的业务场景,设计原则具有一定的灵活性,万变不离其宗,通过了解设计原则的构建逻辑,高效组织信息、帮助建立用户与界面的互动等原则性要求,可以衍生出更具场景特性的设计方案。


① Ant Design设计原则的由来

可以说 Ant design的设计规范摄取了《web界面设计》和《写给大家看的设计书》两本书中的精华原则,并做了理论之外最佳的设计实践。其十大设计原则反过来是对书本理论的补充,我在看书的过程结合『Ant Design 』能更好地理解那些原则的释义。每一个原则都用了大量通俗易懂的案例来补充说明,这也是为什么国内的企业一直以来都很喜欢使用这套组件的原因。


② Ant Design设计原则的适用范围

1. 我们先说说『Ant Design 』的适用范围:

稍微了解 Ant Design 的小伙伴都知道,本系统是针对B端后台系统,承载媒介是PC端的浏览器。使用的人员主要包括:用户体验设计师、交互设计师、UI设计师、前端程序员等。

2. 再说说 『 Ant Design 设计原则 』的适用范围:

顾名思义『 设计原则 』主要是针对设计师在创作页面时依照的标准。虽然『 Ant Design的设计原则 』是 Ant Design 系统的一部分,但是前文已经提到,此原则是摄取了《web界面设计》和《写给大家看的设计书》两本书中的精华,所以设计师可以把这些原则运用到任何的设计领域,并不要局限于企业后台系统的PC端产品。

为了方便大家理解,讲一个小故事。故事来自于《写给大家看的设计书》,作者有一年圣诞节收到一份礼物——一本关于植物的百科全书。作者翻阅之后,发现其中有一颗叫约书亚树的树,造型奇特,自己从未见过。于是决定出门转转,然而发现外面到处都是这种树。故事到这里就完了。

可能大家会想,这个故事要讲一个什么道理呢?简单来说就是,当你手中有个锤子,满世界都是钉子。当你了解到下面要讲的十个设计原则后,你会发现它们处处都适用。


③ Ant Design设计原则的内容

十大原则如下:

  • 亲密原则(Proximity)

  • 对齐原则 (Alignment)

  • 对比原则 (Contrast)

  • 重复原则 (Repetition)

  • 直截了当 (Make it Direct)

  • 简化交互 (Keep it Lightweight)

  • 足不出户 (Stay on the Page)

  • 提供邀请 (Provide Invitation)

  • 即时反应 (React Immediately)

  • 巧用过渡 (Use Transition)



『 如何运用Ant Design的设计原则 』


对于一个初级设计师而言,想要了解UI用户体验等知识,学习 Ant Design 的设计原则算是比较快能上道的,因为 Ant Design 是吸取了很多前辈的精华,提炼而成的系统。打个简单的比喻,对于设计师而言 Ant Design 就是设计师学习『 视觉规范 』,掌握『 设计原则 』最好的字典。

接下来我就给大家说说我是如何快速理解 Ant Design 的这10条设计原则并运用到工作当中。

Ant Design 定义了10条设计原则,根据『 席克定律 』选项太多不易记忆,于是我找到了这些设计原则的共通性,将其归为4类,也就是大家只需记住四类设计原则,在工作中适当延展即可。


① 视觉层级清晰

包含 Ant Design 的设计原则有:『 亲密原则 』『 对齐原则 』『 重复原则 』『 对比原则 』。

「视觉层级清晰」的重要性体现在 交互前 用户看到的内容结构是清晰明确的 。一个层级混乱的界面,任何信息的传达都是无效的。所以保证清晰的排版布局是人机交互前的基础。


1. 亲密

如果信息之间关联性越高,它们之间的距离就应该越接近,也越像一个视觉单元;反之,它们的距离就应该越远,也越像多个视觉单元。亲密性的根本目的是实现组织性,让用户对页面结构和信息层次一目了然。


1.1 纵向间距关系

  • 纵向间距:在 Ant Design 中,通过「小号间距」「中号间距」「大号间距」这三种规格来划分信息层次结构。这三种规格分别为:8px(小号间距)、16px(中号间距)、24px(大号间距)。


  • 增加元素:通过增加「分割线」来拉开层次。在这三种规格不适用的情况下,可以通过加减「基础间距」的倍数,或者增加元素来拉开信息层次。注:在 Ant Design 中,y = 8 + 8 * n。其中,n >= 0,y 是纵向间距,8 是「基础间距」。


1.2 横向间距关系

  • 组合排布:为了适用不同尺寸的屏幕,在横向采用栅格布局来排布组件,从而保证布局的灵活性。(注:栅格是另外一个模块的内容,这里不赘述。)


  • 复选框内:在一个组件内部,元素的横向间距也应该有所不同。


2. 对齐

正如「格式塔学派」中的连续律(Law of Continuity)所描述的,人类的视觉系统往往倾向于将看到对象的直线继续成为直线,曲线继续成为曲线。在界面设计中,将元素进行对齐,既符合用户的认知特性,也能引导视觉流向,让用户更流畅地接收信息。

格式塔学派(德语:Gestalttheorie):是心理学重要流派之一,兴起于 20 世纪初的德国,又称为完形心理学;主张人脑的运作原理是整体的,「整体不同于其部件的总和」。——摘自「维基百科」


2.1 文案类对齐

如果页面的字段或段落较短、较散时,需要确定一个统一的视觉起点。


  • 推荐使用:标题和正文左对齐,使用了一个视觉起点。

  • 不推荐使用:标题和正文使用了两个视觉起点,不推荐该种对齐方式,除非刻意强调两者区别。


2.2 表单类对齐

  • 冒号对齐:冒号对齐(右对齐)能让内容锁定在一定范围内,让用户眼球顺着冒号的视觉流,就能找到所有填写项,从而提高填写效率。


2.3 数字类对齐

为了快速对比数值大小,建议所有数值取相同有效位数,并且右对齐。


3. 对比

对比是增加视觉效果最有效方法之一,同时也能在不同元素之间建立一种有组织的层次结构,让用户快速识别关键信息。

注:要实现有效的对比,对比就必须强烈,切不可畏畏缩缩。


3.1 主次关系对比

为了让用户能在操作上(类似表单、弹出框等场景)快速做出判断, 来突出其中一项相对更重要或者更高频的操作。

注意:突出的方法,不局限于强化重点项,也可以是弱化其他项。


  • 需要区分主次场景:


  • 不需要区分主次的场景:「通过」和「驳回」都使用次按钮,系统保持中立。在一些需要用户慎重决策的场景中,系统应该保持中立,不能替用户或者诱导用户做出判断。


3.2 总分关系对比

  • 总分关系:通过调整排版、字体、大小等方式来突出层次感,区分总分关系,使得页面更具张力和节奏感。


3.3 状态关系对比

常见类型有「静态对比」、「动态对比」。


  • 静态对比示例:用不同颜色的点,来表明不同状态。


  • 动态对比:鼠标悬停时,该项和其他项呈现出明显不同的视觉效果,响应用户操作。通过改变颜色、增加辅助形状等方法来实现状态关系的对比,以便用户更好的区分信息。


4.重复

相同的元素在整个界面中不断重复,不仅可以有效降低用户的学习成本,也可以帮助用户识别出这些元素之间的关联性。


4.1 重复元素

重复元素可以是一条粗线、一种线框,某种相同的颜色、设计要素、设计风格,某种格式、空间关系等。


  • 线框重复:


  • 设计要素重复:


  • 文案格式重复:


② 交互操作高效

包含 Ant Design 的设计原则有:『 直截了当 』『 足不出户 』『 简化交互 』『 即时反应 』。

「交互操作高效」的重要性体现在 交互时 用户操作流畅、简单、用时短。如果仅仅只是解决高效的问题,却忽略用户能否理解流程如何操作,那这样的解决方案也是徒然。有的时候并不是解决实际时间的长短,而是用户的心理时间是否太长的问题,就像我们打游戏往往会觉得时间过的很快,但是在等待页面加载时却不耐烦。


1. 减少打断

能在这个页面解决的问题,就不要去其它页面解决,因为任何页面刷新和跳转都会引起变化盲视(Change Blindness),导致用户心流(Flow)被打断。频繁的页面刷新和跳转,就像在看戏时,演员说完一行台词就安排一次谢幕一样。

变化盲视(Change Blindness):指视觉场景中的某些变化并未被观察者注意到的心理现象。产生这种现象的原因包括场景中的障碍物,眼球运动、地点的变化,或者是缺乏注意力等。——摘自《维基百科》

心流(Flow):也有别名以化境 (Zone) 表示,亦有人翻译为神驰状态,定义是一种将个人精神力完全投注在某种活动上的感觉;心流产生时同时会有高度的兴奋及充实感。——摘自《维基百科》


  • 气泡提示:对于操作的反馈是必要的,下文会提到,但是为了减少打断用户,轻量级的反馈气泡提示即可。


  • 输入覆盖层:鼠标「点击」图标触发;鼠标「点击」悬浮层以外的其他区块后,直接保存输入结果并退出。不用弹窗或跳转的形式编辑,只需要在触发图标附近弹出浮层即可,这样避免用户视动线的混乱,减少打断用户操作的心流。

2.缩短步骤

正如 Alan Cooper 所言:「需要在哪里输出,就要允许在哪里输入」。这就是直接操作的原理。eg:不要为了编辑内容而打开另一个页面,应该直接在上下文中实现编辑。


常规的编辑模式,界面都会跳出一个弹窗或者是一个页面跳转,无形之中用户走了更多的流程路径,如果能在当前页面就把编辑问题解决掉那就符合了 Ant Design 『 足不出户 』的设计原则。

  • 文字链/图标编辑:

状态一:在可编辑行附近出现文字链/图标;

状态二:鼠标点击「编辑」后,出现「输入框」、「确定」、「取消」表单元素,同时光标定位在「输入框」中。


  • 多字段行内编辑:编辑模式在不破坏整体性的前提下,可扩大空间,以便放下「输入框」等表单元素;其中,在 Table 中进行编辑模式切换时,需要保证每列的不跳动。


  • 拖放图片/文件:在早前很多产品在上传功能上,都是跳出弹窗再选择文件上传,现在基本都可以实现拖拽上传了。这样的设计大大提高了用户使用上传功能的效率。


  • 模糊搜索:系统根据用户所查询的关键词,智能匹配可能的结果。


  • 定时自动更新:新增的列表项「高亮」,持续几秒后恢复正常。不需要用户手动刷新,减少不冗余的操作。


3.避免回忆

人们在思考的时候,是需要依靠大脑神经元之间相互传递信号,而回忆是需要调用更多的的神经元传递信号,简单地说就是非常费脑子。


  • 搜索历史:搜索历史的功能,可以减少用户的回忆,使得整个体验更加轻松愉悦。


4.信息降噪

根据费茨法则(Fitts's Law)所描述的,如果用户鼠标移动距离越少、对象相对目标越大,那么用户越容易操作。通过运用上下文工具(即:放在内容中的操作工具),使内容和操作融合,从而简化交互,起到信息降噪的作用。

费茨法则 :到达目标的时间是到达目标的距离与目标大小的函数,具体:。其中:1.设备当前位置和目标位置的距离(D);2.目标的大小(W)。距离越长,所用时间越长;目标越大,所用时间越短。


  • 列表嵌入层:将列表为多层级时,隐藏弱层级列表内容,可以让用户更加直观地看到重要信息。当我在聚焦某一个列表模块的内容,鼠标悬浮即可展开。


  • 标签页:标签也换可以将信息内容进行分类,让用户更易理解。


  • 渐进式展现:用户在填写表单时,会根据当前录入的数据,展现下一项需要填写的内容,这样的展现方式可以屏蔽掉无关紧要的内容。


  • 悬停即现工具:鼠标悬停时,出现操作项。这样将不重要信息或者操作隐藏起来,不会干扰到用户浏览其他重要内容。


③ 系统反馈即时


包含 Ant Design 的设计原则有:『 简化交互 』『 巧用过渡 』『 即时反应 』。

「系统反馈及时」的重要性体现在 交互之后 立即给出反馈。就像「牛顿第三定律」所描述作用力和反作用一样,用户进行了操作或者内部数据发生了变化,系统就应该立即有一个对应的反馈,同时输入量级越大、重要性越高,那么反馈量级越大、重要性越高。


1.实时反馈

虽然反馈太多(准确的说,错误的反馈太多)是一个问题,但是反馈太少甚至没有反馈的系统,则让人感觉迟钝和笨拙,用户体验更差。

牛顿第三定律 :当两个物体互相作用时,彼此施加于对方的力,其大小相等、方向相反。——摘自《维基百科》


  • 实时预览:根据用户的输入,提供关于密码强度和有效性的实时反馈提示。


  • 文字链热区:当悬浮在 ID 所在的文字链单元格时,鼠标「指针」随即变为「手型」,单击即可跳转。


2.过渡反馈

人脑灰质(Gray Matter)会对动态的事物(eg:移动、形变、色变等)保持敏感。在界面中,适当的加入一些过渡效果,能让界面保持生动,同时也能增强用户和界面的沟通。

Adding: 新加入的信息元素应被告知如何使用,从页面转变的信息元素需被重新识别。

Receding:  与当前页无关的信息元素应采用适当方式移除。

Normal: 指那些从转场开始到结束都没有发生变化的信息元素。


  • 表格加载:网络不好或者表格数据过多,都有可能导致加载缓慢,这时有一个小动画可以缓解用户的焦虑感。


  • 富列表加载:用户在打开列表时,页面无法做到一次性加载所有的数据,同时有为了减少翻页的繁琐操作,就有了下拉自动加载的。


  • 页面加载:当用户访问的页面体量过大时,系统会通过给出倒计时或完成百分比,来缓解用户焦虑,并且给用户友好可控的感觉。


  • 滑入与滑出:可以有效构建虚拟空间。  


  • 折叠窗口:在视图切换时,有助于保持上下文,同时也能拓展虚拟空间。


  • 对象增加:在列表/表格中,新增了一个对象。


  • 对象删除:在列表/表格中,删除了一个对象。


  • 对象更改:在列表/表格中,更改了一个对象。

    • 状态一:用户更改了「详情」中的值;

    • 状态二:用户点击「保存」后,详情所在的网格出现「黄底」,表明该对象发生了更改;

    • 状态三:底色持续几秒后,恢复正常。


  • 对象呼出:点击页面中元素,呼出一个新对象。


3.结果反馈

用户常常会疑惑自己的操作是否成功了,哪怕是失败了也是需要系统反馈,这样才能安心进行下一步的操作。


  • 页面反馈结果:


  • 气泡反馈结果:


④ 用户自由可控


包含 Ant Design 的设计原则有:『 提供邀请 』『 足不出户 』『 即时反应 』。

「用户自由可控」的重要性体现在 交互前对下一步操作的预判;交互时 不论操作后的结果多严重都要允许用户自主决策;以及交互后 能否对自己的操作结果反悔。


1.未来预判

很多富交互模式(eg:「拖放」、「行内编辑」、「上下文工具」)都有一个共同问题,就是缺少易发现性。如果用户在操作前就能得到下一个交互层次的提醒和暗示,以表明在下一个界面可以做什么。  这样人机交互的过程往往更加自然、顺畅。



  • 点击刷新:对于设计师而言,最常见的例子要属花瓣了,我们时长会沉浸在我们浏览的瀑布流卡片中,如果系统强行刷新当前页面,用户很有可能迷失。邀请用户主动更新,既不会错过新的消息,又不会导致我们的心流被打断。


  • 未完成邀请:用户在当前页面无法完成登录操作,为了减少用户迷茫的焦虑感,系统告知用户点击“更改”链接,可以去向何处。


  • 悬停邀请:鼠标「悬停」时,出现「选择此模板」的按钮。


2.自主决策

虽然系统中缺少不了一些危险操作或者不可逆操作(eg:删除、重置、重装系统等),但是仍然要用户自主决定是否继续,我们能做的就是让用户再三确认。


  • 弹窗提示:虽然弹窗打断用户心流,但是对于重要的操作,这样是最保险的方式。


  • 删除知识库提示:是钉钉中,删除「知识库」这一重要内容,是不可逆的,系统需要用户谨慎操作。


3.准许反悔

如果说「自主决策」中提到的案例都是不可逆的,那「准许反悔」的后果严重性会弱一些,系统对用户的操作没有那么强的阻断性,所以要准许用户反悔的,


  • 删除撤销:用户点击「删除」后,直接操作;出现 Message 告知用户操作成功,并提供用户「撤销」的按钮;用户进行下一个操作或者 1 分钟内不进行任何操作, Message 消失,用户无法再「撤销」。



『 Ant Design的优点与缺点 』


① 优点


1.助初创团队快速产品快速上线

Ant Design在"幸福者示例中"写到“Ant Design 无法保证业务产品能否成功,但是能帮助业务产品『正确的成功』或者『正确的失败』。”

如果团队有一个产品idea,我们需要通过最少的资源开发此产品并投入到市场中,通过听取用户反馈,验证idea是否可行,快速迭代最终做出更完善的产品。但理想是美好的,但现实是骨感的,在前期研发的过程中通常会出现两个情况。创业团队没有足够的设计资源和时间,前几个版本的产品通常用户体验非常差,这种情况体验差有可能让用户放弃这款产品。创业团队没有好的方法论和协作模式,需要磨合,设计和开发进度一延再延,结果错过了风口,市场被竞品抢占,还没上线就倒闭了。

Ant Design提供了一套完整的界面实现方案,即有代码框架能直接拿来提高开发效率,每个界面组件都经过蚂蚁金服多个项目的考验,具备优秀的用户体验。用Ant Design来做0-1,能快速发布用户体验优秀的产品,听取用户反馈,快速迭代。


当然,创业是九死一生,市场和用户口味都充满了不确定性,谁也没有能力保证产品是否成功,但是只要你能高效的产出质量优秀的产品,不断试错,说不定以后就能成功。


2.减少设计和开发的不确定性。

用 Ant Design 就能高效的产出高质量的产品,减少设计和开发的不确定性。

因为我们公司就使用了 Ant Design 的系统,所以时常会与前端小伙伴沟通,以下都是他们在使用过程的感想。

Ant Design 提供的大量功能比较全面且UI风格统一的组件,能帮助开发者快速搭建通用场景下的应用界面。这大概是得益于蚂蚁金服业务线上极为广泛的应用场景,驱动了 Ant Design 团队通过对使用情况的观察汇总,整理出来了这么一个组件库。他们的经验积累如此之丰富,足以让这个库支持大部分其他前端开发者的需要。

其设计团队给出的设计规范相当详细且经得起推敲,令许多其他团队获益匪浅。


3.节省设计与开发的人力成本

我见过太多宣称自己在乎用户体验的公司,给用户的产品质量确实比较高,但是自己员工内部使用的系统和管理一团糟。种种不便让员工经常加班,情绪消极,这样的团队抄抄竞品达到行业标准体验还行。要想突破是不可能了,因为创新需要员工有充沛的精力和主动性,天天加班谁还有这精神。

用 Ant Design 系统提供的设计工具和组件框架能给设计师和开发者减少负担,能用更少的时间呈现给用户体验好的产品。这样带来的好处不仅仅是设计师和开发者觉得少加班成就感高而幸福,他们重新恢复活力和激情能做出更有创意和竞争力的产品,给公司带来更大的收益,这是一个三赢的结局。


② 缺点


1.无法根据业务场景定制组件,灵活度不够

一定有小伙伴会有这样的疑问,目前市面上有这么多的第三方设计规范,例如 Ant Design ,Element UI,有必要自己造轮子做一遍吗?

这里要视情况而定,如果公司产品是初创期,而且研发人手不足,那确实没有必要自己造轮子。反之在资源足够的情况下,是有必要设计团队重新做一套属于自己产品的规范组件库的,因为B端自身的业务性决定了市场上没有万能的设计规范,那些设计规范的组件并不能100%满足我们产品的需求。另外一方面使用封装好的第三方设计规范,在此基础上进行修改,效率很低,适配的复杂度和重新开发相差无几。


2.组件细节深入度不够,只能“将就”使用

对于比较普通的设计解决方案是可以的,但是 Ant Design 包含的组件细节仍有不足,毕竟 Ant Design 没必要投入过多的精力在组件细节深入度上,规范定义的越是精细,对于产品组件而言可延展性就越差,限制也会越多。而 Ant Design 只需要解决80%企业,80%的通用问题即可。


3.竞品同质化严重,视觉上无法脱颖而出

当市场大部分产品都在使用 Ant Design 设计系统时,产品的同质化就会很严重。为了避免这种情况发生,我们就有必要从设计语言、设计原则、设计组件三个部分开始,设计自己的规范。那些大厂的成熟的组件库该如何用呢?我认为应该把它当成一个字典,有不会的地方,可以去参考人家的成熟的解决方案。



『 总结 』


这篇文章简单的介绍了一下 Ant Design 是什么、 Ant Design 的设计原则是什么以及 Ant Design 的优缺点。当然也重点总结了一下,设计师如何运用 Ant Design 的设计原则,可以将这些原则分为四类:视觉层级清晰、交互操作高效、系统反馈及时、用户自由可控。希望大家通过这篇文章能够更深一步了解 Ant Design 的设计原则,并将其灵活运用到设计工作中。




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

截屏2021-05-13 上午11.41.03.png


文章来源:人人都是产品经理    作者:菜菜不甜

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

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

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


社区管理之痛,将成为谁的智慧切口?

雪涛

编辑导读:随着城市化进程加快,城市的体量在不断增长,随之而来的社区形态和管理也在日趋复杂。智慧社区能否解决社区管理之痛呢?本文作者对此进行了分析,与你分享。


社区是城市在小区域范围内的一个缩影。因为两者之间的体系结构和发展模式存在一定程度的相似和关联,所以在智慧城市的建设路径上,以智慧社区为切口,做好小区域范围的智慧管理成为当下市场和社会的一个风口,也是治理切口。

在中国,随着城市化进程加快,城市的体量在不断增长,随之而来的社区形态和管理也在日趋复杂。对此,暨南大学教授、华南城市研究会会长胡刚认为,建设智慧社区是作为当下社区建设的重要内容,至少应该包含三方面内容:

一是智慧信息,包括社区信息、住户信息等基本数据的采集;

二是智慧服务,比如在此次疫情下,部分社区实行封闭管理,居民可以在网上买菜,然后有人帮他们送到门口这样的服务就很重要。还包括社区的选举,平时大家都上班,不容易聚集在一起,这时候就需要有这样的网络选举投票服务;

三是虚拟社区,居民可以在虚拟社区聊天、共享资源、处理事务等。

由此可见,智慧社区的建设重点主要有三方面,信息感知、服务延伸以及虚拟社区。在腾讯、华为、旷视、海康威视等服务厂商的解决方案里,都能看到类似的思路和落脚点。但是如果说真正做好这三点内容的社区平台,或许还属微信。

为什么要这么说呢?

在这里需要理清一点,对于智慧社区建设,大部分人认为应该是房地产商、科技公司或者安防厂商的事情,但是实际上并不是,社区群众也在参与其中的建设,以微信为支点的数字化社区正在加速形成。

一、智慧社区的“群众路线”

值得一提的,以微信为支点推动数字化社区的成功构建并不能归功于腾讯,而是社区群众。

这是一个自发的、自上而下的、无意识的社会行为,微信只是一个“被民众借用”的工具或者说平台。

微信作为移动互联网时代国内最大的社交软件和聚合平台,很多服务和模式实际上已经逐步跳脱出了它原本的范畴,通过用户自发形成的社群成为了很多新概念的实践场所。就以智慧社区来说,或许很多厂商还没想明白要如何切入庞大的人群体系,实际上社区群众已经在微信群上做到了胡教授所提及的三大内容:

首先是信息感知。尽管这样面向小区住户的信息采集不全面、不系统,但是通过微信群,大部分社区确实在人员信息收集、人员联络和信息传达方面实现了很多跨越。过去需要挨家挨户上门、打电话通知的内容,在短期内都能实现双向传递和感知。

广西某小区物业人员张春花(化名)告诉“智能相对论”,“从疫情爆发到现在组织打疫苗,微信群都帮了我们很多的忙,解决了大部分的联络组织工作。只要把通知、链接发到群里,艾特大伙,基本都能通知到,实在是没有反馈的再通过电话或上门的形式传达一下就行。包括现在谁没打疫苗、第一针、第二针,只要在群里吆喝一下,都能快速的组织起来……”

其次是智慧服务。实际上,对于张春花所在小区的业主来说,智慧服务是什么,他们还搞不清,但是比起以前,现在通过微信群的方式,很多服务确实方便了许多。陈先生(业主)提到,“当时疫情那会儿,物业就是在微信群上来帮各家各户统计买菜信息、送菜什么的,很方便。现在有什么社区投票、活动举办的事情,我们基本都是在微信上来参与和讨论。”

最后是虚拟社区。这对于微信群来说,基本没有什么异议。本来作为一个社交平台,微信给用户带来的就是一个虚拟社区的概念。现在各家各户有什么事情需要帮忙、或是信息需要分享的话,基本上都会通过业主群来进行发布和传达,平常没事也会聚在一起聊聊天、发发红包活络一下。

张春花表示:“小区的老人们经常在群里讨论跳舞、下棋什么的,要是遇到下雨天,也都会在群里唠唠嗑,念叨念叨,看着他们这样互动,有种回到以前住在村里的感觉……。”微信群对于他们来说,俨然成了另一个线上的社区。

可以说,微信群的存在很好的将社区的人连接了起来,为智慧社区的构建提供了一个基本的雏形。这种基于群众力量自发形成的新社群,是现在很多小区管理推进的常态。

二、社群虽好,槽点满满

很显然,作为一个自下而上的自发行为,社群的形成在一定程度上解决了很多社区管理的问题,但也存在诸多槽点,限制了这种模式的进一步发展。

1. 社群不系统、不全面,缺乏必要的顶层设计。

自发形成的社群本质就是片面的,它无法构成一个系统、全面的体系,很难在智慧社区的建设上发挥统领全局的作用。以具体反馈来看,虽然业主群可以覆盖大部分的住户,但是并不是全部,仍旧存在“漏网之鱼”,而且在信息管理上,社区也将处于一个非常被动的局面,住户可以选择提供信息,也可以选择不提供信息,很难规范住户的信息条例。

这也意味着,未来的智慧社区建设在信息感知上需要化被动为主动,借助更加有效的设备或模式来提高信息感知能力。正是看到了这种进阶的需求,所以科技厂商和硬件厂商此前在做智慧社区的时候,大多会从顶层切入,从全局出发来进行社区改造。

比如旷视科技目前提出的以人脸为ID的AI方案就是这样——用户经过小区门禁刷脸进入小区,系统可以自动识别并做好人员管理,使得进出小区的人员数据都能得到全面感知。基于人员数据的高度识别,智慧社区在人员管理方案,智能停车、智能物业,智能地产、安防、零售等方面都能获取相应的数据支持,从整体上把控社区的管理工作。

2. 社群做好了“人”的连接工作,但是没能做好“物”的数字化升级。

社群的另一个本质是人的聚集,对于业主群来说,它只是做好了人群的沟通、连接工作,但是在整个社区范围内,仅是做好人的工作,还不足以构建一个高效、便捷的智慧社区,仍需要在“物”的基础上实现数字化升级,比如监控、快递、消防、电梯等等场景。

“人”与“物”构成智慧社区建设的两条路径,对比来看,海康威视等硬件厂商更倾向于后者的升级——通过智能硬件,比如监控摄像头、门禁设备、对讲设备等的支撑,海康威视能在多个社区场景里进行数字化升级,来实现社区智慧化的表现。

比如,有了智能摄像头,社区的管理系统可以对小区的可疑人员进行预警、对电梯内进入电瓶车等危险行为予以提示、对高空抛物等违法行为提供24小时监管,等等。物理设备的数字化升级对于智慧社区的搭建尤为关键,可以说等同于社区智慧化的基础,这是微信群无法实现的。

3. 去中心化的社群无法接轨智慧城市建设。

社群是一个去中心化的概念,它由业主自发的创建,也可能会因为各种人为原因崩塌,比如广告过多、管理不善、业主矛盾等等。这种不稳定的模式很难进一步拓展应用,只能作为一个辅助性的管理。

特别是对于智慧社区的构建而言,未来的城市智慧化需要建立在一个又一个的智慧社区之上,因此要考虑到智慧社区与智慧城市的协同发展就必须要有一个稳定的系统予以支持。对此,我们可以看到中国电信在打造智慧社区的过程中,积极推动社区系统接轨电力、水力、燃气、养老等政务服务系统,使得小区人员可以足不出户的享受到购电、购气、通信缴费等服务,也确保了社区数据连接城市系统,实现双向互利。

那么,对于智慧社区的建设而言,社群存在诸多缺陷,很难进一步推动我国数字化建设,需要更多服务厂商从大局出发,做好顶层设计来构建一个全面、高效的智慧社区。

三、智慧社区的未来:人与物的双重数字化

尽管如此,但是对于智慧社区的构建来说,并不是一个极端地行为,它不需要推到一个模式,再树立另一个模式。反之,不同的路径在当前复杂的建设进程上都应该被重视,在融合中发挥更加显著的价值。

简单来说,群众的社群路线和厂商的技术路线不冲突。在当前的现实情况下,社区的管理和人员联络需要微信支持,这是毋容置疑的。前者是“人”的数字化,后者是“物”的数字化,如何把这两方面结合起来发挥双重价值,才是智慧社区的未来所在。

因此,“智能相对论”认为,在智慧社区的构建上,腾讯是具有显著优势的。在滨海泰达智慧社区的建设上,腾讯就展现了这一优势——通过投入老人关爱门磁,依托物联网技术,利用实时感应传输功能打通网格化平台,泰达街道能做到对独居老年人等特殊人群居家情况的动态掌握,一旦出现异常情况,社区网格员便可通过微信接收到实时异常告警,精准服务相关人群。

简单来说,腾讯手握微信,在“人”的数字化上具有明显的优势,其未来只需要做好“物”的数字化,就能进一步推动智慧社区的构建。但这并不意味着腾讯会比其他厂商少做一个层面的事情,相反的,如何继续拓展微信的社群优势需要腾讯做更进一步的构思和验证。社群对于智慧社区建设的想象力还没有触碰到天花板。

在湖北宜昌,企业微信正在实现治理规范化,成为当地网格化管理向互联网拓展的新载体,也成为了社区居民互助、交流、自治的微载体。

具体来看,社区网格员通过企业微信建立统一的社群,网格员形象统一,有官方认证的身份,形成“中心化”管理的雏形。同时,基于企业微信和微信互通的能力,社区普通居民使用微信即可与网格员联系,也可在群中反映噪音、污染、故障等各种问题。而除了在群内沟通,网格员进行跟进调解外,还可以把相应的问题通过企业微信工作台提交工单,转给横向的相关部门,如城管、环保、公安等部门处理。

简单来说,在企业微信的支持,社群有了官方人员的介入逐步形成了一个更加系统和有效的社区管理与治理同步的体系。这对于腾讯而言,就是在“人”的数字化上发挥出了真正的信息优势。

对于其他厂商而言,这并非是不可超越的。中国电信的短信通知同样可行,只是相比微信缺乏了一点社群交互的基础,但在连接人的功能上并不输给微信。因此,对于一众服务厂商来说,若能准确地认识到“人”与“物”的双重数字化需求,也就能快速地把握智慧社区的建设思路,来打造出一个全面智慧化的社区。

四、结语

如今,新小区的搭建、“老旧改”的推行,智慧社区依旧是一个没有边界的蓝海市场,据数据显示,2020年中国智慧社区产业规模达到5000亿,近3-5年仍将以至少40%的比例增长。而市场上,更多的厂商仍在专注于“物”的智慧化和数字化,对于连接人的工作似乎都丢给了微信,但伴随着智慧社区的需求愈发增长,或许其他的厂商也会逐渐把目光转向社群的搭建和经营之上。

 

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

截屏2021-05-13 上午11.41.03.png


文章来源:人人都是产品经理   作者:智能相对论

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

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

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

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档