首页

五步提升你的版面精致度

涛涛


首先,我们怎么去理解在作品集版面中的“精致度”。我觉得可以将其转化为“质感”,“细节”,“细腻”这样的词汇。其实“精致度”不足这个问题大部分同学也是能有所感知的,只是不知道哪里出了问题,也就无从下手。当然还有一小部分同学,可能并不觉得自己有什么问题,也无法体会修改前后的差别,这样的同学,我建议你平时应该多看一些优秀的设计作品,多沉淀一下,这样的方式对你帮助更大。


很多同学经常把“精致度”理解为形式感不够,或者是不够酷炫,这么理解是不准确的。这就好像一个产品,它的精致和它的外观设计并没有什么直接联系,而是更多的取决于这个产品的做工和材质。做工体现在接缝的处理,边角的打磨等等,而材质决定了其质感的好坏。那么同理,版面的“精致度”实际上和你的设计感也是没有直接联系。那么从哪些方面体现版面中的“精致度”呢?我结合自己的经验总结了以下几个方面:

1.舒适的间距。一个合适的,让人舒适的间距特别重要。无论是文字与的,或者说认为不重要的事情。混乱的,不统一的,不舒适的间距会让版面变的排布变的无章,这就好像一个产品各个部件的拼接接缝大小不一,会导致“精致度”下降。

2.大小比例。版面中所有元素的互相之间,以及相对于整个版面的大小比例问题。这个也是非常重要的一个体现“精致度”的地方。所有内容都过于傻大粗,无疑会让版面看起来非常粗糙。

3.层次感。层次感实际上是一个非常好的提升质感从而体现出“精致感”的手段。缺乏层次感的版面会显得非常的寡淡,以及在内容较多时可能会在视觉上造成较乱的感觉。那么如何提升层次感,主要是靠对比的强弱。比如:深与浅,粗与细,大与小,疏与密等等。

4.字体。选择一个精致好看的字体,对版面的精致度有一定的提升,不过还是要注意,字体的与版面之间的大小比例要注意。


5.配图。配图的质量也一定程度上影响了版面的精致度。无论是你自己做的图,比如分析图,效果图等,还是你网上找的图,如参考图等,都很大程度上决定了你这一页的精致度。


通过以上几点的提升,我相信你的版面“精致度”一定会有较为显著的提升,而版面效果也会看上去更为高级。不过这里还是要再次提醒,精致度和设计感是两回事儿,如果只有精致度,而设计感较差,那也是不行的。希望本期的内容对你的版面有所帮助。


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

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


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

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

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


2021年设计师们最值得做的练习TOP3

seo达人


日常的设计需求需要设计师们准确、快速的解决问题,这也代表着我们很难在日常的工作中尝试新鲜或更具挑战的设计风格,所以设计练习就成为了设计师们提高自己技能水平的重要途径!新的软件、风格或者配色,总让人跃跃欲,今天我们就一起看一下,2021年全世界最受设计师们欢迎的练习方式TOP3

 

01.3D自画像

自古以来,自画像始终深受各种艺术家的喜爱。从油画、雕塑,到现在的数字插画,设计师们也用五花八门的方式展示着自己独特的性格和审美。这两年最火爆的形式毫无疑问是3D风格,3D自画像也成了越来越多设计师们表达自我、提升能力的重要途径!如果你想做些3D练习,自画像一定是很不错的选择。

图片

图片

图片

图片

图片

图片

 

02.抽象几何

方、圆、三角…这些基本的形状也是整个设计殿堂根基的重要组成部分。过去的一年中,越来越多的设计师用这些基本的几何形状,来挑战排版设计。大道至简,简单的色彩和图形更加考验设计师们对元素的控制能力,看似随意摆放的图形,其实都由设计师们精心布局和修饰!

图片

图片

图片

图片

图片

图片

 

03.暗色设计

黑色场景虽然较少,但是不可或缺。随着暗色模式的普及,设计师们随时会面对黑色场景的设计需求,在练习中熟悉其设计规范就变得尤为重要。如何进行色彩搭配,如何整理层级关系,如何兼顾亮暗双模式,这些问题对设计师来说都是不小的挑战,提前练习自己对暗色设计的熟练度吧,在黑暗中也能散发光芒!

图片

图片

图片

图片

 

原文地址:设计师深海(公众号)

作者:设计师深海

转载请注明:学UI网》2021年设计师们最值得做的练习TOP3

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

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



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

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

产品细节剖析,提升用户体验就差这一点!

seo达人



在体验优秀的作品时,我们需要站在用户的角度去发现好设计细节及交互解决方案,思考能给企业或用户带来价值并记录下来,久而久之,就能提高自己的语言组织以及总结能力,再通过不断的练习,以达到质变效果。

 

151.「keep」设置身高/体重-模拟现实生活中的固有认知

152.「网易蜗牛读书」找人共读-坚持读书的动力

153.「keep」隐私模式-一键隐藏跑步轨迹

154.「京东」删除搜索记录-决策思考

155.「哔哩哔哩」动效IP结合操作特性-提升品牌曝光度

156.「高德地图」返回-贴心的交互手势反馈

157.「腾讯视频」只看TA-满足“追星”用户沉浸式体验

158.「京东读书」你用过横屏时分栏阅读吗?

159.「ETC车宝」如何在较少的空间展示更多的内容?

160.「盒马」金刚区-引导用户直达目标、快速转化

161.「美团」酒店住宿-评价功能的重要性

162.「今日头条」内容与评论区-高速直达

163.「MONO」TAB栏图标-植入品牌记忆

164.「高德地图」屏幕常亮-减少不必要的操作

165.「哔哩哔哩」生日-通过闪屏给自己一个暖心的祝福

 

151.「keep」设置身高/体重-模拟现实生活中的固有认知

产品体验:

在keep设置身高/体重时,页面效果采用了现实生活中的尺子/称的刻度,通过左右滑动,跟随刻度变化调整出准确的身高/体重数值。

 

设计思考:

早期的互联网产品界面,很多都通过拟物化的设计来描绘现实世界中的产品,其便于用户对功能进行感知,模拟物理世界中的交互,帮助轻松掌握界面的使用方式,最大程度的降低用户学习成本。虽然后来逐渐过渡到扁平设计风格,但很多方面,依然保留了拟物的特征。拟物化风格会不会再次来临也不得而知,但从设计趋势的不但变化可以看出,如2020年火爆的新拟态设计(基本扑街)、C4D、2.5D设计等表现手法,都是在朝着贴近现实世界的认知方向延展。

在keep设置身高/体重时,通过模拟现实世界用户对生活中事物的认知,将页面设计成尺子/称的刻度样式,左右滑动即可设置完成,很符合用户的直觉。模拟现实的设计可以帮助用户轻松掌握界面的使用方式,更快的跟产品之间建立连接,根据模仿学习的基础,有利于初次接触的用户,降低学习成本、提高效率以及出错概率。

 

152.「网易蜗牛读书」找人共读-坚持读书的动力

产品体验:

进入网易蜗牛读书的介绍页面,通过“找人共读”邀请喜欢读书的伙伴加入,为坚持下去提供动力。

 

设计思考:

说起线上读书,一开始必定给自己定下各种计划,还会下定决心,从明天开始就……。可计划很丰满、现实很骨感,当你不想再看书时,可以找到上百个说法来掩盖自己坚持不下去的理由,且听上去合情合理。很多内/外因素的存在,当正在看书时收到朋友的吃烧烤邀请、网友的开黑4缺一、前男/女朋友的微信等都是放弃计划的开始,即便可以抵挡这些诱惑,但面对看到的精彩无处表达喜悦、疑惑之处无地诉说等,无法交流的痛可能是压倒你坚持的最后一根稻草。

网易蜗牛读书可以邀请喜欢看书的网友一起学习,通过交流互动、相互鼓励提升学习氛围,虽然在虚拟的网络世界,但相比一个人读书更有看书的仪式感,精彩之处相互分享、不懂之处相互交流,摆脱一个人的孤独,为坚持读书提供源源不断的动力。另外,第一次共读的用户,还可以免费得书,且后面能获得翻倍的蜗牛壳用于换书,正所谓免费东西不要白不要,以此增加用户的使用粘性,提升用户在此平台读书的频率,为后面的转化提供条件。

(一个人在电影院就算看着喜剧也可能睡着,但一群人在场很可能让你笑的岔气;一个人静悄悄的在手机追剧跟开着弹幕相比,也是两种不同的心情)

 

153.「keep」隐私模式-一键隐藏跑步轨迹

产品体验:

在keep跑步完成后,进入跑步记录页面,开启隐私模式,系统会屏蔽跑步轨迹地图上的部分文字信息,避免用户在分享后暴露自己的位置隐私。

 

设计思考:

跑步是受大家喜欢的运动之一,没有健身房里的复杂训练和费用成本,且时间灵活自由,经常跑步可以减肥、改善视力、改善失眠状况、释放压力/舒缓情绪等诸多好处。坚持跑步需要极强的自制力,如果光靠自律来让自己坚持,很少人能做到,其外在条件不可或缺,比如多人约定一起跑,相互鼓励;给自己制造必须跑步的条件和理由;打卡朋友圈,获得他人认可和鼓励等。打卡朋友圈是很多人使用的一种方法,一方面碍于面子心理,通过营造努力的人设,在他人那里博得面子和形象,给自己带来心理上的满足感;另一方面,可以通过其他人的点赞、评论获得对自己的肯定,增强自己对跑步的兴趣,以提供坚持下去的动力。

keep为了让用户更安心分享自己的跑步记录,在跑步轨迹地图设置了隐私模式,点击“小眼睛”开启后,轨迹地图上去掉了位置及信息标记,只能看到大概的轮廓。隐私模式能有效避免用户的位置信息泄露,以最安全的方式使用产品带来的服务,给用户更容易掌控的感觉,带去安全保障的同事,还能提升用户对产品的信任度。

 

154.「京东」删除搜索记录-决策思考

产品体验:

在京东搜索页面删除历史记录时,会自动展开所有搜索记录,不打断用户浏览的情况下再次提醒是否全部删除。

 

设计思考:

应用将用户的搜索行为记录下来,其主要目的是方便用户下次使用时再次展现,可直接点击快速找到自己所需的商品。虽然保存搜索记录是在给用户提供方便,但也可能将用户较为私密的关键词暴露给其他人,如果被自己的朋友或亲人看到,就有些尴尬了,删除历史搜索记录无疑是最有效的方法。在用户删除历史记录的过程中,其不同的交互方式给用户不一样的体验,且还能提醒用户思考、是否需要放弃这一操作行为。

在京东APP删除搜索记录的过程中,系统将所有记录展开供用户浏览,且右上角出现“全部删除”的弱提示。通过展示的历史记录给用户足够的时间,以延长用户下一步操作决策的思考,降低删除成功的可能。众所周知,用户在操作删除时,其主行动目标就是删除成功,虽然在中途不太可能改变用户的想法,但每给用户多一份思考(所有历史记录),用户改变想法的可能性就会增加;每增加一定的难度(弱化删除操作,降低视觉传播速度),用户放弃下一步操作的可能性也会增加,而且应用需要通过用户多次重复的搜索记录来计算,确定是否增加该关键词对应产品的曝光频率,以达到更多的转化,用户的历史记录一旦删除成功,就会增大二次搜索关键变化的范围及不稳定性,不利于系统更精确的定向推荐产品及服务内容。

常见删除历史搜索记录的交互方式无非三种,虽然不敢说哪一种最好,但可以根据应用的实际需求酌情利用:

①、无提示:操作删除即删除成功,路径最短、效率最高,但极容易造成不可挽回的误操作(如:美团);

②、弱提示:操作删除,再次提示是否删除,弱化主操作,不影响页面浏览,给予足够的思考空间,但容易混淆原本的想法并通过信息错觉给用户“洗脑”,促使用户放弃下一步操作或引导其误操作(如:京东);

③、强提示:操作删除,通过弹窗提示用户快速做出决策,效率较高,但用户无法浏览页面内容,没有太大的思考空间,只停留在“是/否”的层面上(如:淘宝、饿了么)。

 

155.「哔哩哔哩」动效IP结合操作特性-提升品牌曝光度

产品体验:

在哔哩哔哩视频下方点赞时,或出现IP竖起大拇指的动效,生动有趣,点赞成功的同时,还传播了品牌形象。

 

设计思考:

大拇指点赞是出现过最多的一种图形表现方式,其诞生于2000年后,逐渐在全球各种应用中出现并被人们接受且成为一种潜在的点赞认知,通过自己对产品/内容的态度和认知倾向,用支持、赞同、偏爱等表达主观情绪感受。知名产品对点赞的视觉表现、交互效果都非常严格,因为它会影响所有用户的使用体验及品牌价值。

哔哩哔哩的点赞除了常规的大拇指图标交替出现外,还融入了动效品牌基因及激励性质的文案。点赞成功时,图标上方会出现一个竖起大拇指的动效IP形象,2秒后消失,利用点赞的特性结合IP强化品牌,为用户在操作过程中增强记忆,提高品牌的曝光度,且动效IP样式更具产品灵魂和趣味性。

 

156.「高德地图」返回-贴心的交互手势反馈

产品体验:

在高德地图页面返回时,使用右滑交互手势,所接触的位置会出现水滴状的返回图标,对用户做出交互反馈。

 

设计思考:

针对移动端界面的返回,第一印象是左上角的返回图标,但在全面屏手机普及后,大屏幕尺寸也又开始占据市场,屏幕大意味着内容可以更大限度地得到展示,但也会增加单手操作的难度,尤其是顶部,几乎成为单手操作的盲区,于是,很多应用开始将重要的功能往下方移动以及增加了很多隐藏的交互手势,如上/下/左/右滑动、双击、长按、多指并行等一系列便捷的操作。

其实很多交互手势,用户已经见怪不怪,基本都有接触,但是在地图类型的应用中,80%以上的用户操作各方向滑动时,思维还停留在移动地图的认知上,很少有右滑返回的概念。高德地图增加了右滑返的交互,且在人机交互的接触位置出现水滴状的返回图标,给予用户明确的反馈,便于用户快速区分对应的下一步变化是返回还是滑动地图,极大方便用户使用,简单的设计细节十分友好贴心,不知道的童鞋赶紧试试吧!

 

157.「腾讯视频」只看TA-满足“追星”用户沉浸式体验

产品体验:

在腾讯视频横屏观看影片时,点击“只看TA”,选择只想看到的明星片段,后续在看片过程中,系统会自动屏蔽与该明星无关的片段。

 

设计思考:

所谓“萝卜青菜、各有所爱”,针对喜欢追剧/看片的人群,其目的是各不相同,比如喜欢历史的,所关注的是故事的情节、改编程度及连贯性;喜欢科幻的,关注的是动感和特效。但说起青春偶像剧,喜欢看的,大部分用户都是片中某些明星铁粉,因“鲜肉”云集,打开弹幕就不难看出,铺天盖地的都是“好帅啊”“老公”“摸了女孩的手、我好伤心……爱死了”等一系列的花痴语录,什么演技、剧情都不重要,重要的是“TA”别消失,不然的话就算是通过快进、跳集也要找到(抱歉、曝光了那一类人看剧的“猫病”)。

腾讯视频APP的“只看TA”功能,解决了看片专为偶像而来用户的需求,选中“只看xxx片段”,后续会自动屏蔽与该明星无关的内容。因为感性的成分较多,“只看TA”功能对于单纯追星的用户来说,再也不用通过快进、跳集的方式去寻找相关片段,可无需任何操作沉浸式看片,给用户带来较强愉悦感和满足感。

 

158.「京东读书」你用过横屏时分栏阅读吗?

产品体验:

在京东读书的高级设置中,打开“横屏时双页”开关,在横屏阅读时会变成左右双页的样式,给用户多一个选择。

 

设计思考:

在报纸、刊物、出版物中,我们经常看到将大量的文字进行了分栏展示,其目的主要是便于快速阅读。人们在阅读大量的文字时基本都是不断地从左到右-返回-从左到右……如此循环下去,当一行文字较长时,头部和视线需要跟随文字大幅度的移动,看完一行后,再用相反的动作返回下一行的开头,费时费力费精神。而较小的行宽能让一行文字在大部分情况下始终保持在目光范围内,保证阅读的完整性,提升阅读速度。

使用京东阅读APP,在高级设置中开启横屏时双页(分栏),其实在用户看书时并没有多大作用,但根据少数用户的视觉浏览喜好多提供了一种选择。针对习惯、感触各异的互联网用户,在不影响功能、视觉体验的情况下,让他们去选择最适合自己方式,是满足用户需求的最佳之举。

 

159.「ETC车宝」如何在较少的空间展示更多的内容?

产品体验:

进入ETC车宝“我的”页面,会员版块会出现抖动的效果,下滑可展开会员权益,上滑即再次隐藏还原。

 

设计思考:

用户开通会员/购买增值服务是企业盈利非常重要的一大版块,其固定入口大部分在“我的”页面,为了引导用户转化的需要,也会合适的穿插在其他页面、状态、功能之中。因“我的”页面需要给用户提供常用的跟个人相关的功能,固会员版块展示区域,基本上不能超出自己的那“一亩三分地”,也间接导致了因展示内容较少、吸引力不够、转换率较低的情况。

ETC车宝的会员版块展示区域同样较小,但却合理利用不同的交互方式在不占用太多页面资源的情况下,展示了更多会员权益。进入“我的”页面,会员版块会出现抖动的动画效果,其最主要作用在于动态比静态更加吸引眼球,增加视觉关注度,利用轻交互动效来吸引用户视觉焦点,增加点击欲望。

一般来说,除非用户在目标非常明确的情况下,才会主动进入会员页面,因为这关系着用户的经济成本。ETC车宝“我的”的下滑可展开会员权益,上滑即隐藏,既做到了不占用页面空间,又额外给用户展示了比较有诱惑力的会员权益,吸引用户参与,勾起开通会员的欲望,同时也能在减少用户操作的情况下,了解更多会员内容,最终达到增加转化率的目的。

 

160.「盒马」金刚区-引导用户直达目标、快速转化

产品体验:

盒马APP将金刚区的入口直接做成了产品一级分类,用户进入首页,即可根据对应的需求快速到达指定位置,少了各种常规功能的弯弯绕绕。

 

设计思考:

常见的电商应用,大部分都是直接在底部标签栏设计一个分类入口,而金刚区是一个页面中头部的重要位置,也是核心功能区域,其聚合了各类子板块的入口,为各个子版块分发内容引导流量,所以其重要性不言而喻。

盒马APP直接将金刚区设计成产品类型入口,其最主要的目的是引导用户在最短的时间内找到目标,快速解决用户需求,少了常规的套路和弯弯绕绕,多了一份效率。相比tab上的分类入口,更能促进用户快速决策,避免用户被其他内容吸引而产生新的想法,影响转化。

 

161.「美团」酒店住宿-评价功能的重要性

产品体验:

美团酒店住宿详情页主图的右下角,会特别突出该酒店的综合评分和其中一条好评,点击后可进入评论页面,依然突出酒店评分,以及大数据下的住客偏好。

 

设计思考:

评价的目的更多是为了表达个人对于某问题或现象的看法以及思考,也会作为后来者是否购买该产品的重要依据,直接关系着店铺的综合评分。不难看出,用户在购买某个产品时,除了价格之外,买家秀就是决定用户是否转化的关键因素(不是唯一),商家也会使用各种方法来提高好评率,其中就包括收到快递后好评返现券、商家电话提示等。纵然如此,评论功能也都只是提供一个的简单入口或介绍完产品后象征性的展示最近两条最新评论,还没有上升到超级重要的程度。

美团APP酒店住宿版块则把评论(综合评分)的重要程度提升了一个等级,将综合评分和其中一条好评显示在详情页主图的右下角,用户进入即可被快速吸引。住客都是以自身位置为中心,因距离的因素限制了诸多选择条件,相比其他电商产品,评价似乎成了除价格之外的唯一决策条件,提高评价功能的等级,也是为了将对应的信息快速传达给用户,减少其思考时间,提升决策效率。

 

162.「今日头条」内容与评论区-高速直达

产品体验:

在今日头条的新闻详情页,点击小气泡图标,页面会自动跳到底部评论区,以供随时查看、参与评论,再次点击图标,可回到之前未看的位置。

 

设计思考:

在拥挤的公交/地铁上、忙里偷闲的上班时间里,我们偶尔会打开新闻APP来了解一些社会热点资讯,增加知识视野及“吹水”能力,偶尔还会跟随大流调侃一番。当被新闻中某个有趣的点刺激着自己的脑细胞时,会不自觉的进入评论区表达自己的想法或看看别人见解,很简单,点一下底部(大部分底部悬浮)的气泡图标就能直达。一番操作之后,要再次回到页面刚才没有看的位置就难搞了,因大部分新闻内容较长,靠下拉去查找基本不现实,且查找的时间越长,记忆力就会逐渐减弱,浪费更多的时间成本。

今日头条APP的新闻详情页面,在点击图标去到底部后,若想回到文中原来的位置,只需再次点击图标即可,避免通过调取大脑记忆滑动页面查找而浪费大量的时间,还能防止用时过长而“断片”,为用户提供了便捷的路径,减少不必要的误操作,增加产品的易用性。

 

163.「MONO」TAB栏图标-植入品牌记忆

产品体验:

MONO(猫弄)APP,底部tab栏图标直接用名称中的四个字母替代,以达到最大化品牌传播的目的。

 

设计思考:

一个应用是否好用,其视觉(交互效果/任务流程/操作方式)占据很大的作用。tab栏作为整个应用结构的入口,也不例外,不管是精致的图标、趣味的动效还是优秀的交互方式,其目的都是为了通过美观的视觉,将产品想表达的内容清晰发反馈给用户。

MONO打破了以往其他应用tab栏的常规表现方式,将名称拆解,即M、O、N、O以图标的方式至于tab栏,用最直接的方式进行品牌传播,让用户记住的并非APP里的某个功能,而是品牌记忆。虽然跟用户所需要的美观、亲和力、趣味性等,似乎是反其道而行,但存在即为合理,通过品牌基因的融入,能让产品带有灵魂, 延伸品牌价值观以及突出图标特征来提高品牌曝光度,让用户看到产品的第一印象,就知道当前使用的是什么,当品牌元素在产品的各个层面合理复用时,也能增强用户记忆,变相提升用户粘性。

 

164.「高德地图」屏幕常亮-减少不必要的操作

产品体验:

在高德的地图设置中,开启“开启屏幕常亮”功能,即可在导航过程中保持设备屏幕常亮,避免猝不及防的息屏带来安全不必要的麻烦和安全隐患。

 

设计思考:

平时我们在导航的过程中,如果长时间没有触碰手机会出现自动锁屏的情况,因事发突然,若行驶在交通复杂且不熟悉的道路口,慌忙之中选择解锁手机查看、刹车减速靠边或随便驶入其中一个路口,不管何种选择,都可能来不必要的麻烦及安全隐患。

使用高德导航时,在设置中开启屏幕常亮后,导航过程中能有效防止设备自动变暗或锁屏,避免用户在驾驶过程中手动调整设备或考虑突发事件造成大脑“开小差”,影响驾驶安全。屏幕常亮可以帮助用户将更多的注意力放在安全驾驶方面,不会因出现息屏受到影响,从而提升安全系数。

 

165.「哔哩哔哩」生日-通过闪屏给自己一个暖心的祝福

产品体验:

在生日当天进入哔哩哔哩,启动页之后会出现一个暖心生日祝福+温馨的闪屏,利用情感化的表现方式让用户在进入应用之前就能感受到友好的祝福,几秒钟后,自动进入首页。

 

设计思考:

“生”是来到这个美好世界的一种方式,“日”是纪念降临人间的日子。很多人都想在自己生日这天得到好友的祝福,只有在这一天才感觉到自己是真正的主角,听到一声“生日快乐”是对自己最好的期盼,被习惯性地祝福,即使这一天自己天犯了什么错,也会被不同程度地原谅,因为我们知道,还有人记着、爱着自己。

在智能设备普及的今天,我们身边少了很多的朋友,但却多了一个铁友-智能手机,最初给我印象最深的就是在生日这一天,从早上开始,QQ的生日祝福消息就没有断过,虽然都是虚拟的礼物,但至少是自己的朋友(Q友)亲手送出,还是无比的开心。而如今的微信、抖音、视频等平台成了手机必备,履行着我们可以没有朋友,但不能没有手机的原则。表面上看,我们似乎在和冷冰冰的机器交流,实则应用早已通过亲和、情感、趣味化的方式成为了自己最忠实的朋友。

在生日当天进入B站,系统会通过闪屏的方式给我们送上最真挚的祝福,温馨的画面+暖心的祝福语,再结合产品的特性融入情感化的设计,为用户打造了一个有归属感且温暖的“家”,为产品设计增添了人情味,并通过祝福的方式拉近用户与产品间的距离感。如果自己的生日被所有人遗忘,多少会有些失落感,而B站用温暖的方式传递爱与力量,也能抚慰每一个被情绪伤害过的灵魂,这也是巩固用户粘性与忠诚度十分巧妙的方式,一个小小的细节,就能感受到产品的温度与团队的用心,很大程度上提升了用户对产品的好感度。

 

结语:

设计师需要养成体验产品的好习惯并将优秀的产品细节记录下来,加强自己的记忆,不仅能提升自己的语言组织和总结能力,也为日后输出优秀的作品当铺垫,对自己的能力提升以及未来的职业发展带来便利。

本期产品设计细节分享结束,我们下期再见。

 

原文地址:能量眼球

作者:大漠飞鹰CYSJ

转载请注明:学UI网》产品细节剖析,提升用户体验就差这一点!

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

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



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

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

量化设计价值(三) 如何创建体系化的监控系统

seo达人



随着用户体验设计的发展,我们已经过了仅依赖需求和直觉就可以完成产品设计决策的阶段了。数据对用户体验设计师的价值可以总结为两点:1. 数据可以在「产品设计决策阶段」提供了更多元的参考意见;2. 数据可以在「产品设计复盘阶段」提供更客观的评价标准。

 

数据使用的场景

无论所处哪一种设计阶段,总的来说设计师的数据需求主要可以分为两大类:

图片

 

1.探索事物间关系的“内因/外因”:

是什么东西影响了用户的购买决策 ?我的新版网站首页的改版是否为产品提升了注册的转化率 ?这类需求的本质是探究一种事物间的欢喜和因果性,常用「推论性统计」、「相关&非参数校验」进行分析。对于这类需求,往往会有专业的数据分析师,用户研究设计师,数据产品经理承接。

 

2.发现数据中的“模式/异常”:

在一天之中随着时间的变化,用户的访问量有什么规律 ?这类需求的本质是在对已经发生的事物规律做一种总结 ,使用的统计方法更多的是「描述性统计」。对于绝大多数设计师而言,能够做到发现数据中的 “模式/异常” 基本可以覆盖绝大多数日常工作的需求。

本文主要关注解决设计师的第二类使用场景——发现数据中的“模式/异常”。目前各大互联网企业内部都会提供自研或者第三方的BI工具,因此笔者建议设计师可以通过建立一个包含关键的体验指标的数据看板系统,对自己负责的业务进行系统的总结和复盘。

以我曾经的工作内容为例,我们的产品是服务商家进行“前后端对接生产”的订单审核系统。【效率】是制造业至关重要的关注面,在一个企业用户的付费决策中也起到了相当重要的分量,客户使用我们的工具进行订单审核和流转的效率是整个用户体验模型中的重要部分。

因此我们需要构建一系列合理的指标来判断订单系统的处理效率。除【效率】外,【用户行为】【用户特征】等都是设计师关系的信息。以【效率】为起点,最终我们构建了一个笼统的包含设计师所有要监测的信息看板系统

图片

 

关键概念

本质上互联网产品中的看板(kanban)与自然科学领域研究人员的用 R 或者 Seaborn绘制的精美图表没有本质上的区别,差异点可能在于看板更加关注时效性,同时更加具备可交互性。

随着仪表盘工具和各种BI软件产品在人群中的普及,人们对仪表盘,指标(Metric)和关键绩效指标(KPI)的组成有不同的理解。为了确保我们都说相同的语言,我将定义一组术语,这些术语将构成我们讨论的基础:

  • 度量(Measure):度量是一段数字上可量化的数据。销售额、利润、留存率,都是具体衡量的例子。
  • 维度(Dimension):维度表示给定指标的不同方面属性。例如,时间通常被用作分析不同度量的维度。其他一些常见的维度包括地区、产品、部门、细分市场等。
  • 层次结构(Hierarchy):维度可以进一步分解为层次结构。例如,时间维度还可以形成层次结构,例如 年>季度>月>日。
  • 粒度(Grain):层次结构中的每个级别都称为维度的粒度。例如,年 > 季度 > 月 > 日 ,中的“年”是一个特定的粒度。
  • 指标(Metric):指标是我们经常在仪表板中显示的数据类型,它表示一个度量Measure)的数据段与一个或多个特定维度(Dimension)和相关粒度(Grain)的关系。

图片

上图是在Tableau中一个标准的指标示例-“每周销售总额” 的构建方式。在这个指标中,我们需要量化的“”是美元——即总销售额,用来观察量化数据的“维度”— 即时间,而时间维度可以被进一步分解为“年>季度>周”的层级结构“每周销售总额”需要关联的维度中的特定“粒度 ——即周。

  • 看板(Cards or KanBan): 观察一个或多个指标(Metric)运行情况的图表
  • 仪表板(Dashboard): 仪表板是多个图形,图表,量表或其他直观表示的集合。多个看板可组成一个仪表板
  • 报告(Report): 报告可以是对应图表和其他可视化的表示,也可以是可能直接相关或不直接相关的大量图表和可视化。多个仪表盘可组成一个报告。

图片

“实时、受众群体、流量获取、行为……” 上图为Google Analytics 中提供的多种类型的数据分析报告,报告可以非常广泛地涵盖广泛的相关信息。每一种特定报告内包含了若干个回答特定问题的dashboard,一个dashboard内可以包含多个相互关联的指标的看板。

一个可分析、可追踪的数据系统中,最原子的构成单位理解成一个“看板”。如何从0-1构建一个客观有效的数据看板系统?我们可以类比【一个人学习做菜】的过程,做菜的过程可以总结为三个阶段:

  1. 学习菜谱&列一个采购清单
  2. 采购食材&烹饪食材
  3. 摆盘料理&品尝美食

对应到数据看板系统的创建,我们亦可以总结为三个阶段:

  1. 了解数据的特性、明确自己需要哪些数据
  2. 通过技术手段获取数据、将粗数据加工成意义明确的指标
  3. 将指标数据可视化,观察数据并尝试分析现象

图片

 

度量Measure & 维度Dimension

“ Data is more than numbers, and to visualize it, you must know what it represents. ”

数据不仅仅是数字,数字、数组、表格、都可以被称之为数据。要将数据形象化,你必须知道它代表什么。为了构建有效的效率指标,第一步是:明确为了解决当前的问题,要观察的【度量】是哪些,以及这些度量又需要从哪些【维度】进行观察。

 

了解数据类型

一个线上的项目每天都在收集成百上千种数据,怎样确定自己需要什么数据作为 度量(Measure)呢?首先值得注意的是,不是所有类型的数据都适合作为度量Measure)被加工成指标。
不同学科,不同课程,不同领域,对于数据类型的定义基本一样,但称呼并不完全一样。统计学中,数据类型分为四种:定类,定序,定距,和定比。这四种类型是从低到高的递进关系,高级的类型可以用低级类型的分析方法来分析,而反过来却不行。

图片

定性数据与定量数据

 

从宏观角度分析,数据类型分为 定性 和 定量 两种。一个通俗的例子,以自身为例:例如衣服的颜色,头发的类型和鼻子的形状这些标识标识的是定性数据;例如身高,体重,年龄和鞋子的尺码,这些可测量的是定量数据。

1.定量数据

定量数据是统计数据,通常具有自然结构性意味着它更加严格和明确,可再细分为连续/离散两种。此类数据使用数字和值进行测量,这使其更适合进行数据分析。可以通过以下方式获取定量数据:

  • 测量
  • 实验
  • 调查
  • 市场报告
  • ……

2.定性数据

定性数据是非统计数据,本质上通常是非结构化或半结构化的。定性数据可以用来问“为什么”的问题。它是调查性的,在进行进一步研究之前通常是开放性的。从定性研究中生成的数据用于理论化,解释,发展假设和初步理解。可以通过以下方法获取定性数据:

  • 文字和文件
  • 音频和视频记录
  • 图片和符号
  • 访谈笔录和焦点小组
  • ……

想要了解订单流转的效率是怎样,最简单的方法是通过和我们的客户进行面聊一下使用情况并记录一下反馈,但这样的产物并不方便进行统计分析和展示。尽管有一些对定性数据“结构化”的方法,比如对定类数据进行的非参数校验,但实施起来成本较高。定量数据因为本身结构化的特点更适合分析,因此在这里建议设计师在构建自己的dashboard系统时,需要跟踪分析的数据尽量选择定量数据

 

确定需要观察的度量&维度

明确需要观察的度量有哪些,首先需要从要解决的问题出发。但是没有一个整体的分析模型,往往会导致我们的分析遗漏很多信息和细节,导致数据分析师无法理解彼此的需求,最终导致最后产出的看板难产或答非所问:

使用的问题分析工具—— KPI wheel

在这里介绍一种名为KPI Wheel的简单工具,可用于收集将用于定义和可视化指标的前期必备信息。您可以将 KPI wheel 的图片打印在纸上,然后开始尝试依次思考这四个方面:

  1. “ 要解决的问题是什么”
  2. “谁在关心这个问题?”
  3. “我需要去哪里获取这些数据?”
  4. “为什么这个数据很重要?”

在解答的上述的几个问题的过程中随手记录:

(1)可能引发什么进一步的疑问

(2)使用此信息可以采取什么行动或决定。

不断的提出问题并进行进一步分析,这么做的目的是让用户不断分解问题,直到他们有足够的信息来采取行动或做出决定。经过几轮完整的分析后,用户就可以大致确定指标的「度量」和 所需要的「维度」。

图片

以我曾经的工作内容为例:我们的产品是服务商家进行“前后端对接生产”的订单审核系统,我们需要构建一系列合理的指标来判断订单系统的处理效率。以下是与产品经理讨论过程中的具体流程:

 

第一轮 KPI Wheel ——

1.Answer KPI Wheel:“ WHAT?WHO? WHERE? WHY? 

  • what:我们需要一种途径了解用户进行订单审核的效率如何

针对这个问题我们联想到:

1.想要了解订单处理效率,首先需要定义什么叫订单的效率;在行业中有一种叫做「订单生命周期」的专有名词来表示订单从创建到结束的时长,是一个可借鉴的概念

2.针对我们的业务,一个工单的生命周期经历了从创建-流转&审核-通过,一个工单从创建到通过所经历的时间是我们需要记录的【度量】

 

  • who:产品/运营/设计 三个业务方都关注订单的效率

针对这个问题我们联想到:

1.对于不同的角色,在检测数据的时候都关注哪些维度?

2.订单类型分审核单&生产单这两种,两种类型的订单,订单类型是一个必要维度

3.时间是上述三个相关方都需要关注的维度,一个订单在通过审核时的时间,是一种重要的分析维度;而“时间”维度,我们可以继续拆分为: 年-月-周-日 的层次结构

4.对于运营,了解不同行业的商家的订单效率对进行深入运营是必要的。而”行业”维度根据分类方式的不同,又可以归类为一级行业(软装设计/板式家具/…),二级行业(整木定制/办公家具定制/暖通/地板/瓷砖……)

4.对于产品,为了更好的维护客情,对于特定的大客户的数据需要重点关注。因此商家账号的ID,也是重要的分析维度。

 

  • where:我们需要的数据要在哪里获取?

针对这个问题我们联想到:

1.与一般的用户行为数据不同,订单的数据都储存在后台的操作日志中

2.需要的”行业”维度,可以复用其它团队已经制定好的标签

 

  • why:效率是企业的生命,制造业中存在各种效率指标,如“人效”/“屏效”等。糟糕的使用效率会造成我们的产品在根本上是不可接受的,因此效率指标非常重要

针对这个问题我们联想到:

1.通过【订单生命周期】统计的时间,可以在整体上评估订单系统的流转效率。但是仅仅依靠一个这样的指标,缺少一些更细致的视角。可以增加对方案(订单的载体)的停留时长的统计,来计算审核在整个生命周期中所耗时间的占比。

2.The Rising Questions & Action:“ 根据问题1的答案,这还会引发什么其他问题,或者您将采取什么行动?”

 

在回答上面的4W的过程中,会引发其它衍生问题,例如 “订单审核周期的时间的最小单位是什么?”  等等。针对上述的其中衍生问题,可以再进行一轮kpi wheel的自问自答。比较简单的衍生问题,不需要4个方面都进行问题分析。

 

最终 

在多次重复上述的两个过程后,最终我们确定了要在产品中量化哪些 度量(Measure),以及这些度量需要哪些分析维度,并将所有需要的度量和相关的维度都用表格的形式记录下来。

例如,‘订单从创建到最终通过的时长(h)’,是一个需要被量化的度量。它需要关联的维度(Dimension)有时间、商家ID、一级行业、二级行业。

图片

 

指标Metric

研究完成菜谱,记录采购清单后,接下来的带班过程就是准备食材并进行烹饪。当你已经明确了要观察的 度量(Measure)、和需要关联的维度(Dimension),下一步就是通过数据建设获取这些度量,然后将度量加工成指标。

 

建设埋点

获取度量的过程就是取数’的过程。想要创建看板,数据分析师需要通过各种方式获取一张包含所有你需要的信息的宽表。如何获得这张包含一切关键信息的表格?我们需要借助埋点获取数据。

所谓埋点就是在应用中特定的流程收集一些信息,用来跟踪应用使用的状况。您可以把用户在与您的网站或应用互动时触发交互行为理解为一个 “ 事件 ”,一个时间存在一个触发的条件,当达到这个触发条件后就会上传请求,请求中会携带需要的 “ 参数 ”。

例如“用户点击按钮将商品加购到购物车”这个行为,每次用户触发这个行为后都会发送一个请求,而这个请求中会记录:1.加购商品的金额/2.加购商品的类型/3.加购商品的商品ID…等信息。这些结构化的信息构成了我们需要的度量(Measure)与 维度(Dimension)。

在完成了最基础的埋点后,我们就获得了最基础的数据。

图片

 

如何建立有效指标建议

“指标”是量化衡量标准,未经加工的数据不具备可观察的价值。通过埋点,我们单纯只是得到了若干张包含所有用户信息的巨型表格,我们是分析不出什么有用信息的。为了更有效的去观察和分析作为度量Measure)的数据,就需要对埋点数据进行一定的加工,变得更加易于理解和表达。

当一个度量Measure)的数据段与一个或多个特定维度(Dimension)之间互相联系了起来,度量就成为了指标。例如,同样的一份关于【访问用户人数】这一度量,可以根据关联的时间维度的不同,创建 DUV 和 MUV 等多个不同的指标。

如何创建一个有效的指标,结合笔者的工作经验,下面给出三点建议:

 

(1)为一个指标设想一个高级概念:

  • 首先指标的名称需要客观,要让人乍一听就能大概会意,例如:「加购商品操作每日点击次数」。而如果您定义的是类似:“软件上手度”,这种概念比较晦涩、在业内又没有约定俗成的定义的指标,可能需要重新考虑概念是否恰当。
  • 每周访问站点的用户总数/ 每日访问站点的用户数/ 每日访问站点的新手用户数…,这些指标即相互独立,但反应的又是同一件事的客观熟悉的时候,我们可以把这些详细的指标统一用一个高级的指标概念来做一个归纳,例如“站点访问用户数”

图片

 

(2)检查并确定定义指标的细节:

  • 确定了指标的基础概念后,需要检查一遍指标的细节。
  • 例如,“订单生命周期”这个指标的定义中,生命周期是指一个订单从创建到最后通过审核耗时,而与其关联的维度有时间,订单类型等。需要强调的是,一个订单可能会存在:创建时间、通过时间,这两种不同的时间戳。而在“订单生命周期”这个指标我们需要关联的时间维度是【通过时间】。如果关联是【创建时间】,则会得到另外一种完全不同的生命周期计算方式。

图片

 

(3)将测量到的度量数据,通过计算总结为一个指标:

  • 通过埋点收集到的是大量的数据,是一个巨大的整体,而指标则是描述总体特性的参数。而把原始数据组织并总结成更易处理的形式的技术叫做描述性统计,一种最常见的方法是通过计算平均数的方法总结一组数据。
  • 这些描述总体特性的参数中又存在不同的用途,有的用来描述频数分布,有的用来描述集中趋势:平均数,众数、中位数,有的用来描述变异性:四分卫距、方差。我们需要根据自己的用途选择合适的统计方式来构建指标。

图片

 

根据统计方法的不同,常见的指标类型有以下几种,他们拥有不同的分布类型和方差的计算公式

  • 【 计数 Count 】
  • 【 概率 Probability 
  • 【 平均数 Average 】
  • 【 中位数(或其它位数)Percentile
  • 【 比率 Rate 】
  • 【 一般比例 Ratio 】

图片

 

可视化 Visualize

烹饪好食材之后,接下来的工作就是摆盘与上菜。优秀的摆盘可以让料理更加精致和高级,优秀的数据可视化可以帮助我们更好的观察与分析数据,反之糟糕的数据可视化可能会让我们丢失很多重要信息。

 

Why visual ?

为什么一定要使用看板(图表)来观察和分析数据?仅关注几个关键指标的数据是否就已经足够?

使用看板对指标进行观察和分析的意义在于:相比单纯的数字,图表可以携带更多的展示维度(大小、长度、颜色、面积…),能帮助我们多维度的观察数据、避免疏漏。

例如,安斯库姆四重奏(Anscombe’s quartet)是四组基本的统计特性一致的数据,但由它们绘制出的图表则截然不同。如果仅依靠基本的统计特性来观察数据,我们很容易忽略一些重要信息。

图片

 

选择合适的图表类型

BI工具中支持多种图表类型,比如展示浏览路径的“桑基图”、展示转化率的“漏斗图”,甘特图、散点图等。如何选择合适的图表来展示并分析你的数据可以参考下图:

图片

图表种类繁多,但只要掌握其中的一小部分就能满足绝大多数需求。对于大部分设计师,以下3种最基础的图表类型是最常用的:

  1. 条形图:是最常用的图表类型。条形图易于阅读,我们用眼睛比较条形图的末端,很容易快速得出结论:哪一类最大、哪一类最小以及类别之间的增减区别。
  2. 线图:最常用于绘制连续的数据。因为线连接了点,这就暗示了点与点之 间存在着离散数据(一系列数据分隔成不同的类别)间没有的联系。通常,连续性数据都以时间为单位:天、月、季度和年度。
  3. 饼图:在总量间各部分的占比时比较高效

最后,当我们创建了许多看板后如何进行归纳?我们可以将关注相同的问题的看板归纳在一起,就形成了一个关注同一类问题的Dashboard;对不同的 Dashboard 提取共性,将同一个业务的不同Dashboard组织起来,就形成了一个Report。一个Report内可以笼统的包含当前业务需要关注的所有信息。

图片

例如:【订单生命周期】关注的是企业的订单效率问题,但并不是唯一关注效率的指标。另外还有诸如:“审单员平均审核时长”这样的人效指标的看板,这些看板同样反馈的是订单的效率。我们将关注相同的问题的看板归纳在一起,就形成了一个Dashboard,Dashboard内的看板与指标都有关注同样的问题—效率。

除了效率,身为设计师的我们还需要关注很多其他的问题:比如使用的用户的特征、流量的来源、用户发起的行为等等,这些问题都可以拥有自己独立的Dashboard。最后这些Dashboard组织在一起,就成为了一个支持系统的观察分析当前业务的体验指标的完整报告。

 

观察与分析数据

“ 我们需要的不是数据 , 而是数据告诉我们的实事 ”。通过建立一个系统的监测体系的目的主要是为了从数据中探索:模式/ 异常。不管图表的形式是什么,我们都需要留心观察这两者。

 

1.何为「模式」:

模式即数据中的某项规律。比如机场每月的旅客人数,虽然随着时间推移变化不定,但是通过几年的数据对比,我们可能发现旅客人数存在着季节性或周期性的变化,某些月份的旅客数量一致偏低/某些月份则一直偏高。

图片

根据数据画像我们可得知某个产品的成熟期用户占绝对多数的现状,

了解了这个「模式」就可以更好的制定符合绝大多数用户心智的设计策略

 

2.何为「异常」:

异常即问题数据。异常数据并非是错误数据,也有可能是设备记录或人工录入数据时,出现的问题。我们通过异常异常分析,一方面可以分析异常原因;一方面可以发现现有系统的漏洞。

图片

苹果公司通过监控异常值、发现了位于深圳的AppleCare灰色产业,

进而改善了AppleCare的产品策略,避免了巨大的损失

最后在观察分析数据的过程中,有三个需要特别关注的数据的特性不要忘记:

  • (1) 数据具有可变性(VARIABILITY)

数据的可变性这一重要的特性让我们可以从数据中获取规律和关系。如果您构建的指标本身并不具备可变性了,那您很可能需要尝试其他指标进行跟踪和分析。

  • (2)数据具有不确定性(UNCERTAINTY )

很多数据都是只能提供一个估计而不是绝对准确的数量。例如:分析人员通常会通过样本的数据,进而对整体的数据分布进行进行猜测。

  • (3)数据需要联系上下文( CONTEXT )

数据分析离不开情境。我们知道,数据的产生必然是有其情境的,不过统计数据时,我们通常都要剥离情境;而当我们进一步分析数据时,又必须回到具体的情境中去。

例如:某个羽绒服经销商发现某一年冬季的销售额产生了明显的下降,这本应该是一个异常的信号,但我们不能简单粗暴的定义这是一个糟糕的数据。因为实际上,销售额下滑的哪一年是一个暖冬,且和同类的竞品相比自己的产品销售额下滑趋势的更低。结合情景分析数据,往往能得到意想不到的结论。

 

本文参考文献:

文章:Dashboard Design: Key Performance Indicators and Metrics —— Thomas Gonzalez文章:【统计学】区分定类、定序、定距、定比变量——YYIverson书籍:Tableau:数据可视化之极速BI —— 沈浩书籍:Which chart or graph is right for you?——Tableau图表白皮书

书籍:Data Points:Visualization That Means Something  —— Nathan Yau

书籍:Storytelling With Data —— Cole Nussbaumer Knaflic

 

原文链接:酷家乐用户体验设计(公众号)

作者:晓虎

转载请注明:学UI网》量化设计价值(三) 如何创建体系化的监控系统

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

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



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

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

详解|组件库可以替代 B 端设计师么?

seo达人


有很多同学跟我说,自从 Ant Design 的组件变得越来越完善,自己也越来越不知道 B 端设计师的工作意义和价值是什么了。其实除了 Ant Design,还有很多常见的、优秀的组件库,都为 B 端设计和开发的工作提供了便利。那么使用组件库真的可以替代 B 端设计师么?当然不能。B 端设计师有其存在的独特价值,本文就跟你聊聊组件和设计师之间的关系

 

图片

 

1 . 组件是「效率」工具

组件是工具,用来为设计师和开发提升工作效率。上文中所提到的 Ant Design 的初衷也并不是要做一款替代设计师的组件库,其根本目的之一也是提高整个团队的工作效率。使用组件可以从两个方面提效:

(1)工作内容上:可以将不必要的、重复性劳动的时间节省出来

(2)工作流程上:便于设计师与前端开发做交接和协作,节省沟通成本

 

2 . 组件是「质量」保障

使用组件,可以在一定程度上保证设计工作的质量。组件规范了前端和设计师的工作方法,建立相对底层的系统,设定了设计和开发的质量底线。

图片

基于组件规范,设计和开发的产品更容易具备:

(1)一致性:具备相对一致的表现样式,设计风格和交互体验上均可保持统一

(2)可用性:对于用户操作,可以保证最基本的可理解性和可操作性

(3)审美性:符合基本审美标准,虽不会很亮眼,但也不会很难看

 

3 . 设计师要「沉淀」业务组件

B 端设计师可以尝试沉淀有针对性的业务组件。很多业务领域有其独特性,比如金融类组件和政务类的产品页面列表内容就有很大区别。单一的元素组件在应用的过程中是可以被再次组合和沉淀的。

举个例子,我在做业务需求设计时,相比于 Ant Design,其实更常用的是 TechUI —— 它是建立在 Ant Design 基础上的、由我们蚂蚁的设计师通过对业务需求的提炼、组合和封装,做成的一套于蚂蚁自己的【业务组件】

二者的区别是:

  • Ant Design:是所有人的,是通用的,是单一的原子级别的(比如一个输入框)组件。
  • TechUI:是蚂蚁自己的,是私有的,是组合的区块级别的(比如一整个表单)组件,更具备蚂蚁集团自己的业务属性。

图片

针对你公司不同业务类型,沉淀出不同种类的区块级别的组件,这类组件使用起来也会更加得心应手、加倍提效。这也是 B 端设计师可以去学习和精进的一点。

 

4 . 设计师要「洞察」业务诉求

使用组件,可以让设计师把节约出来的时间和精力放到更多有价值的工作上去。作为 Ant Design 的设计师之一,坦白的说,即使你的设计稿全部使用了 Ant Design 的组件搭建,最终的页面效果也仍不完善,在用户体验上始终可以更进一步

B 端设计师应该更多去关注对用户需求和业务逻辑的深入挖掘,不仅仅是在界面细节的表现手法上下功夫,还要学会站在全局,用系统性思维看待每一个项目,为整个产品的系统流程做优化,做更全面的产品体验升级。

 

5 . 设计师要「放眼」B 端未来

随着技术的发展和迭代,B 端产品的发展也呈现出多元化趋势。我列举以下几个方面,用于思考和拓展设计师的边界:

(1)承载媒介:多端化设计需求增多

B 端产品的应用领域日渐广泛,各类终端设备普及,设计师需要更多的探索设备的应用场景。如点餐系统、收银系统、AR、VR 应用等等,最近鸿蒙系统中演示的多端联动,也可能是未来的趋势之一。

图片

 

(2)工作流程:中台策略 / 组件化设计

它是一种提效的工作方法。中台策略适用于公司层面,我们上文提到的组件化设计更适用于团队。

图片

 

(3)用户体验:重视用户个性化和体验

B 端设计越来越重视用户体验,提供个性化的配置方式,并考虑无障碍设计领域。很多 B 端的应用和业务也在逐步开放给 C 端。 例如企业微信在 2019 年打通了个人微信和企业微信的壁垒,钉钉从 2020 年也开始在 C 端发力。

图片

 

(4)视觉表现:数据可视化设计

需求多来源于政府、企业的定制化需求,更偏向于对数据呈现效果的打磨和优化,能够展示和分析数据中的关键内容,形式与内容需要高度一致,才会达到良好的展示效果。

图片

 

原文链接:长弓小子(公众号)

作者:元尧

转载请注明:学UI网》组件库可以替代 B 端设计师么?

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

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



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

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



库存领域的业务——库存模块

涛涛

导语:近期公司需要把一个事业部的发货及库存相关业务实现线上化,在我们部门内部进行业务调研及充分讨论后,库存中心的产品规划方案基本确定,本文把我们实战过程中的方案分享给大家,期望能够为读者在设计库存模块时提供些许思路。


01 场景说明

XX事业部主要业务以化工贸易为主,在市场上对部分产品处于核心地位。XX事业部自己不进行产品生产,主要提供营销服务,仓库、物流均以整合社会资源为客户提供服务为主。整体的业务流程如下:

  1. 客户自己在平台下单,或业务员代客户下单,提交订单时需要判断发货仓是否有足够的货物发出。
  2. 内勤确认订单无误后,进行发货操作,业务要求后期需要进行自动发若客户有特殊需求则需要指定具体批次货物进行发货。
  3. 根据发货单,由仓库人员处理出库,并进行实际的库存扣减。
  4. 物流人员根据发货单中的收发货信息安排承运商进行配送,并回收配送相关状态。
  5. 在客户需求变更或配送的货物发生异常情况时能够进行售后申请,把货物进行相应处理。
  6. 对于库存管理人员要求能够定时进行库存盘点,能够及时发现库存货物由于一些管理上的异常情况而导致货物数量异常的情况。
  7. 货物需要定期进行存货核算以及仓储费用结算。

在整体的业务模式中主要可分为以下三种货物供应模式:

  1. 计划性的向供应商采购货物后进行备货,再销售给客户。
  2. 在客户下单时若除常规备货的商品外还有其它货物需求,可由销售反馈给采购后进行零采。
  3. 向兄弟公司调货销售给客户(具体可分为对方公司直接发货给客户和由销售公司发货给客户两种方式)。

在库存管理的业务中,事业部相关人员要求需要及时知道有多少货能够进行销售,其中有多少是已经在仓库可以随时发货,有多少可能是已经采购但货还在配送过程中,还有一些可能是产品管理人员能够预测未来会到货的货物数量。

02 业务分析

通过对上述场景进行分析后,我们能够把和库存配送相关的业务进行如下分类:发货业务、出库业务、到货计划、入库业务、库存管理业务、调拨业务、售后处理、其它出入库业务。

整体的业务架构图如下:

产品设计:库存模块

在整体的业务架构中,各个部分具体的使用角色以及所需要负责的业务具体如下:

发货:一般由销售助理/内勤人员完成,其主要任务是执行销售订单,在客户没有特定要求下,可以设置为系统自动生成,按先进先出的规则进行批次匹配,在客户对批次有特殊要求下需要人工干预,选择对应批次的货物发给客户。

注:在化工行业不同批次货物其性质会有所差异,故客户会有一些特殊要求。而发货单也是事业部对接仓库、承运商的单据,仓库根据发货单进行货物分拣并以发货单与提货司机进行匹配,防止货物错发,同时物流调度人员也会把发货单分配给具体的承运商,承运商下的司机根据发货单到对应的仓库进行提货,并配送到对应的收货地址。

出库:公司以出库单为依据影响库存,同时也根据出库单生成实际发生的应收。主要分为销售出库、退货出库、调拨出库、其它出库。销售出库主要为根据发货的实际情况进行库存扣减,是记录货物从真实的从对应的仓库中已经发出的凭证;退货出库主要为记录售后需要进行退货处理的记录凭证,把退货业务放在出库单中进行记录有一个好处就是能够直接通过负数的单据关联原有单据进行冲销,而根据出库单生成应收后也能直接进行应收冲销,由此不会改变财务核算的逻辑;调拨出主要记录跨组织调拨、转库调拨等情况,能够记录清楚该出库时由哪家公司发起调拨而产生的,最终能够反映在内部结算上;其它出则包含了盘亏出、报损出等不同的情况。

退货质检:主要记录在客户把货物发回到指定地点后到货物再次入库之间的业务信息。能够在该单据上记录货物异常的情况以及责任所属。

到货计划:主要用于记录计划性采购订单货物接收计划,能对在途可售库存进行管理。到货计划需要记录货物是否可售,到货具体的时间、数量、位置等信息。

入库:入库单能够直接影响库存,同时能够根据入库单生成实际发生的应付;主要分为采购入库、退货入库、调拨入库和其它入库,具体逻辑和出库类似。

库存逻辑:主要分为库存设置、明细、库存量和库存报表。库存量的定义和具体逻辑是该部分最为复杂的业务,在讨论库存量前我们需要明确几个定义:

  • 现存量:指仓库(可以是虚拟仓)中实际存放的货物数量,理论上能够进行实际出库的货物数量,有些文档中也称之为物理库存、账面库存。
  • 在途可售:指货物未在仓库,当时也能够销售的库存,支持外部采购在途、内部调拨在途。
  • 待发货量:指已经下单需要进行发货的货物数量,支持销售待发、调拨待发。

以上三个库存量均有实际单据进行对应,由于我们需要管控到批次基本,所以我们需要同时在SKU和批次两个维度进行库存量的记录,在途可售不需要在批次维度进行记录。

基于此我们通过计算得出我们能够用于销售的可售量,再通过一些库存分配策略我们就能实现很好的库存管理,例如:可设置预留量20%,各个渠道设置不同的数量,各个渠道可售数量之和可以大于总库存,但每个渠道的库存则不能大于最大可售量。我们也能够设置相应的库存预警机制,在库存低于一定比例是能够进行预警或者是限售。

03 功能设计

通过对具体的业务进行分析后,我们即可对产品功能进行详细设计,根据业务的实际情况,整体的功能结构如下图:

产品设计:库存模块

从业务分析中我们可发现主要涉及两个领域的业务:物流配送领域和库存领域,物流配送领域我们暂且不做具体的功能设计说明,对库存中心整体分为四个大的模块:出库管理、入库管理、库存管理、其它管理。

出库管理主要满足库存扣减相关的业务场景,例如:销售出库、调拨出库或其他出库,但有一种特殊情况就是售后退货也是放在出库模块,主要是出于财务核算逻辑考虑,如果公司财务核算是应收和收款核销,应付和付款核销,没有应收和应付核销的模式,那么售后退货就应该用出库模块解决,如果公司由应收和应付核销的模式则也可以把售后退货放在入库模块;但第二种模式会增加财务核算的难度,同时在进行库存统计是也会造成入库数据虚高,实际出库不足,主要还是看具体业务的模式。

由于我们服务的事业部暂没有做应收和应付核销的模式所以我们就采用了第一种方式,而对于出库单之前是否一定需要有发货单也是要根据具体业务进行规划,如果仓库管理、物流配送都是自己公司内部完成,也可以使用出库单+配送单的模式进行处理。

由于我们的业务是物流配送和仓库管理都是外包给第三方所以对外是以发货单为标准单据进行管理,所以出库单只是发货单的具体执行情况的记录。

入库管理主要满足库存增加的相关业务场景,例如:采购入库、调拨入库和其它入库,同出库一样在采购发生退货时也是以入库单的形式进行处理,如此设计的理由和销售侧是一样的。

对于库存管理,则属于库存中心最为核心的业务模块,根据业务分析中的相关概念,我们把单据对库存的影响整理一张图:

产品设计:库存模块

上图中有一个核心公式:可用量=现存量+在途可售-待发货量,由于化工行业的产品有分批次的特性故需要考虑SKU级的库存结构设计和SKU+批次级的库存结构,批次级的现存量合计一定要等于SKU级的现存量,而待发货量则不一定相等;在提交订单时(提交或支付)以SKU级的库存(不考虑库存分配规则)进行校验即可,在进行发货时则需要同时满足订单上的可发货量和SKU+批次及的可用量以防止超发或者超卖。

在SKU级的可用量的基础上我们可以根据具体的业务设计库存分配策略,库存策略以可分为预留和可售,预留则表示不对外进行销售,可售又可按渠道、活动级其它逻辑进行分配,各个方式之间的总和可超总可售量,但每种方式不可超总可售量,通过如此设计我们可以最大限度利用库存,而避免出现超卖现象。

库存的核心计算逻辑主要在图示蓝色部分,基本上把各种单据对库存的影响都罗列进去了,但以上的整体逻辑还是基于有货(或在途)的情况下开展的,但还有一种特殊情况是该逻辑不能覆盖的即预售/期货模式,预售/期货模式是以销定采的模式,是在确定了销量的情况下再去进行集中采购;所以对于预售/期货模式 我们需要单独设计一个虚拟库存的模块,而该模块根据实际经营可以轻量级的方式在商品中心进行实现,最终在进行货物交付的时候在通过出库单进行管理即可。

在库存中心还有库存预警、盘点、期初处理等功能,在此不一一展开说明,大家可根据自己的实际情况进行产品功能设计。

04 总结

库存领域的业务是一个相对比较专业和复杂的领域,市场上也有十分之多的传统软件或SaaS,在很多企业认为通过采购的方式去部署一套软件性价比会比自建库存中心要高。

但笔者认为在数字化转型的浪潮之下,通过数字化的工具提升供应链的效率、降低供应链管理的成本一定是一个十分之重要的目的之一,营销测的数字化转型大多数企业已经通过消费互联网认识到了其价值,我想供应链测的数字化转型在接下来的这几年也一定会逐渐显现其宝贵的价值。

传统的库存管理软件不管其架构还是对业务的实现都有其弊端,很难实现和营销侧的互联网架构的系统进行完美对接;所以自建基于互联网架构的库存中心,并培养懂库存业务知识的互联网人员是大多数要做数字化转型或产业互联网的企业必须要完成的任务之一。


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

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


文章来源:人人都是产品经理   作者:不可分类者

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

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






CentOS7 升级PHP到7.2

前端达人

写在前面

CentOS7下安装PHP默认是5.4的,但是有些框架要求PHP的版本得在5.4以上,这就需要我们把PHP升级一下了。

yum provides php 
  • 1

开始升级PHP:

rpm -Uvh https://mirror.webtatic.com/yum/el7/epel-release.rpm #更新源
rpm -Uvh https://mirror.webtatic.com/yum/el7/webtatic-release.rpm
yum remove php-common -y  #移除系统自带的php-common
yum install -y php72w php72w-opcache php72w-xml php72w-mcrypt php72w-gd php72w-devel php72w-mysql php72w-intl php72w-mbstring  #安装依赖包 
  • 1
  • 2
  • 3
  • 4

查看版本

php -v 
  • 1

PHP 7.2.8 (cli) (built: Jul 20 2018 15:20:01) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.2.0, Copyright (c) 1998-2018 Zend Technologies
    with Zend OPcache v7.2.8, Copyright (c) 1999-2018, by Zend Technologies

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

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


转自:csdn 作者:Peithon

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

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

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

centos7重启php环境

前端达人

apache
启动
systemctl start httpd
停止
systemctl stop httpd
重启
systemctl restart httpd
或者

service httpd stop

service httpd start

service httpd restart


mysql
启动
systemctl start mysqld
停止
systemctl stop mysqld
重启
systemctl restart mysqld

或者

service mysqld stop

service mysqld start

service mysqld restart



php-fpm
启动
systemctl start php-fpm
停止
systemctl stop php-fpm
重启
systemctl restart php-fpm


nginx
启动
systemctl start nginx
停止
systemctl stop nginx
重启
systemctl restart nginx

或者

service nginx stop
service nginx start
service nginx restart

开机自启

chkconfig httpd on

chkconfig mysqld on
 

 

一、MySQL启动方式

1

2

3

4

5

1、使用 service 启动:service mysqld start

 

2、使用 mysqld 脚本启动:/etc/init.d/mysqld start

 

3、使用 safe_mysqld 启动:safe_mysqld&

二、MySQL停止

1

2

3

4

5

1、使用 service 启动:   service mysqld stop

 

2、使用 mysqld 脚本启动:/etc/init.d/mysqld stop

 

3、mysqladmin shutdown

三、MySQL重启

1

2

3

1、使用 service 启动:service mysqld restart

 

2、使用 mysqld 脚本启动:/etc/init.d/mysqld restart

四、强制关闭

以上方法都无效的时候,可以通过强行命令:“killall mysql”来关闭MySQL,但是不建议用这样的方式,因为这种野蛮的方法会强行终止MySQL数据库服务,有可能导致表损坏……所以自己掂量着用。

Windows下重启MySQL服务,对于没装mysql图形管理端的用户来说启动和停止mysql服务:
…\…\bin>net stop mysql
…\…\bin>net start mysql

 

 

卸载PHP

yum remove php
yum remove php*
yum remove php-*
yum remove php7
yum remove php70
yum remove php7.0
yum remove php-common
这才是苦大仇深卸载个干干净净= w

 

 

Centos下Yum安装PHP5.5,5.6,7.0

默认的版本太低了,手动安装有一些麻烦,想采用Yum安装的可以使用下面的方案:

1.检查当前安装的PHP包

yum list installed | grep php

如果有安装的PHP包,先删除他们

 yum remove php.x86_64 php-cli.x86_64 php-common.x86_64 php-gd.x86_64 php-ldap.x86_64 php-mbstring.x86_64 php-mcrypt.x86_64 php-mysql.x86_64 php-pdo.x86_64

2.Centos 5.X

  rpm -Uvh http://mirror.webtatic.com/yum/el5/latest.rpm
  CentOs 6.x
  rpm -Uvh http://mirror.webtatic.com/yum/el6/latest.rpm
  CentOs 7.X
rpm -Uvh https://mirror.webtatic.com/yum/el7/epel-release.rpm
rpm -Uvh https://mirror.webtatic.com/yum/el7/webtatic-release.rpm

如果想删除上面安装的包,重新安装
rpm -qa | grep webstatic
rpm -e  上面搜索到的包即可

3.运行yum install

  yum install php55w.x86_64 php55w-cli.x86_64 php55w-common.x86_64 php55w-gd.x86_64 php55w-ldap.x86_64 php55w-mbstring.x86_64 php55w-mcrypt.x86_64 php55w-mysql.x86_64 php55w-pdo.x86_64
 

yum install php56w.x86_64 php56w-cli.x86_64 php56w-common.x86_64 php56w-gd.x86_64 php56w-ldap.x86_64 php56w-mbstring.x86_64 php56w-mcrypt.x86_64 php56w-mysql.x86_64 php56w-pdo.x86_64


注:如果想升级到5.6把上面的55w换成56w就可以了。

yum install php70w.x86_64 php70w-cli.x86_64 php70w-common.x86_64 php70w-gd.x86_64 php70w-ldap.x86_64 php70w-mbstring.x86_64 php70w-mcrypt.x86_64 php70w-mysql.x86_64 php70w-pdo.x86_64
4.安装PHP FPM

yum install php55w-fpm 
yum install php56w-fpm 
yum install php70w-fpm
注:如果想升级到5.6把上面的55w换成56w就可以了。

nginx重启不了



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

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


转自:csdn 作者:锅巴胸

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

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

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


HarmonyOS Sans - 华为把鸿蒙系统自带的字体开放给全社会免费商用了

涛涛

最近华为发布了鸿蒙系统并且开源了代码,成为了科技圈的热闻。不过我注意到了,系统内置的字体也是开放免费商用的。



关于 HarmonyOS Sans

华为鸿蒙字体 (HarmonyOS Sans) 是华为和汉仪字库合作定制,专门为鸿蒙操作系统设计打造,设计上聚焦于功能性、普适性,字形和之前介绍过的谷歌思源黑体阿里巴巴普惠体以及 OPPO 手机公司的 OPPO SANS 等免费商用字体有点类似,是一款适合阅读的多字重中性字体。

HarmonyOS 字体特性

  • 5种字重粗细调节。HarmonyOS Sans 支持可变特性,让用户选择他们喜欢的字体粗细来进行文本的显示。

  • 支持等宽与变宽两种样式。变宽数字在阅读文本段落中能让阅读体验更加连贯。而等宽数字在强调数值以及数据需要经常变化的表格、时钟数字的 UI 界面使用时,效果会更好。

  • 支持多国语言。HarmonyOS Sans 支持简体中文、繁体中文、拉丁、西里尔、希腊、阿拉伯等5大书写系统,105种语言全球化覆盖。

  • 通用性极佳,中英文混排效果优秀。鸿蒙系统是一款面向全场景的分布式操作系统,无论在手持设备、电视大屏幕还是手表的小屏上, HarmonyOS Sans 鸿蒙字体都具备极强的通用性和协调性。无论是粗体还是细体均需拥有出色的一致性。

undefined
harmonyos-sans 5种字重

字形特点

在保障字体体验的功能性前提下,HarmonyOS Sans 在人文和现代中找到新的平衡。在短笔画时保持横平竖直,简约无装饰,撇捺弯钩长笔画中融入书法的笔势美学,带来全新的视觉感受。

undefined
harmony-sans 字形特点
undefined
harmonyos-sans 笔画特点

在排版设计中常见的“字体不协调”问题之一就是中英文混合的排版,鸿蒙字体对此做出了针对性的优化,把西文字体设计得更显大更显宽,与中文对齐的匹配度更高,细看起来更加和谐。

undefined
harmony-sans 英文字形

一张图对比其他同类字体字形:

undefined
和其他类似字体比较

字体应用效果

undefined
harmonyos-sans 应用例子
undefined
harmonyos-sans 应用例子

使用场景和用途

HarmonyOS Sans 易读性强,字型简约富有科技感,在各种不同尺寸的屏幕上都能获得清晰的显示效果,既适合用于设计制作、平面印刷,也可用于阅读,显示大量文字也依然干净清爽。拥有5种字重,用在正文阅读通透流畅,粗细结合的标题也更醒目。

而对于移动 UI 界面设计来说,HarmonyOS Sans 本身优化了显示效果和协调性,特别是对数字的优化(比如时钟显示的冒号,往往需要手动调整),使得对 UI 作品整体气质有所提升,因此也可以用在效果图或作品集中。

当然了,你也可以设置为日常的办公文档字体,也可以下载用来替换自己手机设备的默认字体,即使没有华为设备,也能体验一下鸿蒙系统的文字显示效果。鸿蒙字体的格式为 .ttf,可以在 Android、WindowsmacOSLinux 等系统上使用。

免费商用说明

华为鸿蒙字体 (HarmonyOS Sans) 是随鸿蒙系统发布的中西文字体,有华为联合汉仪字库专为鸿蒙系统设计,现在华为将其公开发布,任何个人和公司都可以免费下载使用,包括商用。

需要注意的是,windows 系统内置的微软雅黑字体以及 macOS 内置的平方字体都是不能商用的,用在设计或者印刷上会面临侵权风险。喜欢这一类中性字体的,除了思源黑体阿里巴巴普惠体,现在又多了一款鸿蒙系统字体可以选择了。




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

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


文章来源:站酷   作者:weyman_me

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

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





太强了!这些Dribbble顶尖插画大神的作品,是我学习的源泉

seo达人

今天彩云跟大家分享的是Dribbble上,我非常喜欢的插画设计大佬们。优秀的太多,这里仅放10位我觉得最值得看的,可谓是精选中的精选,所以我建议你一定要收藏学习。(彩云花了3个多小时艰难选择出的10位,太难取舍了,最后入选的标准是一些更具风格特点插画大佬们)

 

1、Mikael Gustafsson

https://dribbble.com/MikaelGustafsson

首先推荐的这位大佬是我超喜欢的插画师,他在dribbble上发的作品不算多,但不发则已,一发惊人。每一张作品中,不论是画面构图、场景、配色都非常优秀而且还把插画做成了动态(其实是在Unreal引擎中落地的游戏场景动画),细节做到了极致。尤其喜欢他作品中的配色,我经常参考他的作品找配色的感觉,推荐你一定要去看看。

图片

图片

 

2、Beresnev

https://dribbble.com/Beresnev

这位大佬也是我在Dribbble上关注比较早的插画师,他的作品大多数都是动态的,其实发现他的动态也是做到了极致。插画的风格偏简洁矢量,很有自己的个人风格。可以从他的作品中学到很多动画动态细节,画面的动态速度、动作曲线、转场,极简的配色等等。他发布的作品量也不算大,但每一个都值得学习。

图片

图片

图片

 

3、Jenny Yu

https://dribbble.com/jennyyu

这位小姐姐很擅长在画面中运用光影关系打造意境,效果超喜欢,而且每一张图都能让看的人感受到一个故事,富有情感。画风比较轻盈,喜欢在画面中添加一些彩色的噪点,像是水彩撒上去的感觉,值得学习。

图片

图片
图片
图片

图片

 

4、Andrey Prokopenko

https://dribbble.com/Pro_Art

这位插画大佬擅长在结合图形本身构成的不规则暗色框里作画,从几年前就开始流行这种风格的画法。大概在5年前,彩云也画了不少类似这种风格的插画,当时跟这位大佬还经常互动,每次他发作品我会点赞,我发作品他也会给我点赞。只是他现在还在坚持更新这种风格图,我已经好久没画了,惭愧。总之,学习他的构图,细节,配色都是非常不错的,值得关注。

图片

图片
图片

图片

 

5、MBE

https://dribbble.com/Madebyelvis

Mbe插画风格应该很多人都已经熟知了,而他就是引流这股趋势的创始人。这种风格技法上较为简单,应用范围较广,曾经有段时间,各大厂的应用在空状态页,启动页面等等都进行了跟进。从这位大佬的作品中可以学习他的构图,配色细节,尤其是可以学习他对于可爱风格的表达。

图片

图片
图片

图片

 

6、Burnt Toast ®

https://dribbble.com/BurntToast

这位大佬在Google,Facebook,Samsung,Microsoft都工作过,跳遍国外大厂啊。他的插画具有很明显的个人风格:明亮的色彩,简单平滑的曲线描边,清新有趣可爱。我很早就关注了他,非常喜欢他的风格,给了我很多的灵感。他发布的作品量挺多的,很多都比较适合用到UI领域,推荐关注学习。

图片

图片
图片

图片

 

7、Brian Edward Miller

https://dribbble.com/bemocs

他是美国科罗拉多州的一位独立插画师,作品风格偏古典,擅长使用噪点笔触给画面增加细节。画面细节较为厚重,在一些风景,场景的表达上,比较适合参考。相比较于前面的一些插画风格,这位大佬的作品算是比较特别的,推荐给大家。

图片

图片
图片

图片

 

8、Canopy

https://dribbble.com/canopy

这是一家在纽约的插画工作室,他们的作品以矢量插画为主。我很喜欢他们画的这种图形规则的矢量风格,对于不擅长画插画的同学比较友好,很适合来临摹学习,也能用到一些UI项目中。他们对于颜色的不同明暗过渡运用的非常好,值得学习。

图片

图片

图片

 

9、Matt Carlson

https://dribbble.com/matt-carlson

这位大佬的插画作品,风格较为多变,擅长画一些风景画,尤其是对于树的表达有自己的特点。也是我关注的比较早的一位插画师,功底很好,值得关注。

图片

图片
图片

图片

 

10、Ana Miminoshvili

https://dribbble.com/Anano

最后推荐的是一位自由插画师,她的作品喜欢加一些噪点,并结合一些特别的图形外框,用出界的构图方式营造立体感,增强了视觉表现力。她的小插画,也很适合用到UI和运营里。在她的作品中从图形上,构图上,能看出是一位功底深厚的插画师,值得学习。

图片

图片
图片
图片
图片

总结

文章中列出来的这些是我从关注列表中再三筛选出来的比较有代表性的顶尖插画大神,在我的工作学习过程中,他们给了我很多的灵感。当然,这份推荐名单只是我自己的个人喜好,无关粉丝数量,排名也不分先后。

这篇分享,一定是值得收藏的,不论是找灵感,还是临摹学习,不用到处找,这10位大佬的作品就足够你研究了。当然,插画能力的提升离不开大量的练习,可以把这篇文章中分享的作品收藏起来(彩云挑选出的比较有代表性的作品),慢慢临摹学习都是极好的。

 

原文地址:彩云译设计(公众号)

作者:彩云Sky


转载请注明:学UI网 » 太强了!这些Dribbble顶尖插画大神的作品,是我学习的源泉


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

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



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

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



日历

链接

个人资料

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

存档