首页

有驾在现场 车展品牌全案设计【百度】

seo达人


一、什么是“有驾在现场”

有驾是百度旗下汽车信息与服务平台,累计用户超5.3亿,致力于为用户提供真实、可靠的看选买车服务,以及为车企和经销商提供从品牌到效果的一站式互联网营销解决方案。

车展对有驾来说是一个流量爆发的大事件,2021年广州车展期间有驾品牌全网曝光累计6.3亿次,创历史新高。而【有驾在现场】是百度有驾历年车展系列活动沉淀下来的品牌IP,已经成为活动固定的品牌标识。

图片

 

二、借势大事件,打造车展品牌全案

借势车展的关注度与影响力,我们想要通过分析调研总结,对本次车展进行视觉定调,建立品牌识别体系,沉淀专属有驾车展活动的品牌符号和印记;进行线上线下联合推广来打造有驾车展品牌全案,提升有驾的品牌影响力;优化活动体验来为平台进行引流,让用户对有驾产品有更明确的认知。

同时由于车展项目涉及跨部门合作,我们希望可以通过车展品牌全案,统一不同分工输出的设计物料视觉一致性,以达到提质增效的目的。

图片

以打造品牌全案为出发点,我们梳理了以下项目计划。

图片

同时,通过有驾用户画像分析,建立用户标签,分析用户属性及偏好,以更好的触达用户。数据显示有驾APP大部分用户为常驻中高线城市的年轻男性,经历着数字化信息时代的便利,同时也受到更好的教育和各界多元的文化影响,更大胆更容易被新的东西所吸引。

 

三、分析项目现状总结优化点

根据过往车展项目分析,总结发现存在品牌识别度较弱且没有统一规范、品牌统一性较弱导致用户认知成本较高等问题。

图片

 

四、提炼品牌关键词

根据用户画像及现状分析,明确业务需求,通过脑暴的形式罗列品牌关键词,基于品牌DNA对有驾车展进行视觉升级需挖掘符合核心用户的语境语言和视觉偏好,提炼出品牌关键词,根据关键词规范可延续的品牌元素,打造清晰的品牌全案以更清晰的指导后续视觉设计工作。

图片

 

五、视觉定调

根据关键词确定了以赛博朋克风格为视觉基调,通过三维建模搭建北京地标建筑场景,搭配大胆的配色和新颖的元素样式打造潮流个性且具有未来感的视觉画面,匹配车展品牌的创新理念。

同时,在活动玩法方面,通过优化活动玩法,多条件激励用户给予用户沉浸式的体验。

图片

 

六、建立品牌体系

确定基础视觉调性后,我们通过形色质构来规范和输出有驾车展品牌vi规范,建立有驾车展品牌体系,以提升视觉的产出效率,确保线上线下视觉输出的一致性。

图片

 

七、品牌LOGO

【有驾在现场】是有驾多年延续下来的品牌基因,本次车展也将继续夯实品牌资产,进行优化升级传递品牌调性。

由于旧版的字体圆角等设计样式相对柔和,不能准确表现本次车展视觉调性。为了传递有驾车展的潮酷、未来感,设计上将旧版文字加粗,圆角调整为直角,并进行一定的倾斜处理,使字体展现更加果断硬朗;同时,我们将部分笔画进行连接,让字体充满动感或速度感;最终的字型效果运用有驾品牌蓝绿色光效以更好的与画面结合。

图片

 

八、色彩尝试

由于整体风格参考赛博朋克,配色方面基于有驾品牌色进行延展,辅助色起到平衡主色的冲击效果、活跃视觉,释放潮流激情,突出重点模块;元素上尝试渐变色丰富元素样式。

图片

 

九、组件化通用元素

通过组件化通用元素,不同物料可以快速复用,节约设计成本,解决整个活动的视觉一致性,同时可以沉淀设计资产。

图片

 

十、车展主KV

根据关键词【未来感】【年轻化】分析适合有驾的设计风格和调性,通过三维建模的画面表现形式,构建充满科技感的赛博朋克画面,打造潮流科技的有驾车展基础场景。

主视觉场景设定为高楼耸立的公路上,有驾跑车向“有驾在现场”北京车展活动现场飞驰。充满速度感的跑车、霓虹灯牌、高楼大厦色调和质感的碰撞,传递出一种直观的科技感,引领新时代年轻用户和有驾一起驶向未来。

根据上述的内容进行车展主kv的场景设定,输出了草图方案。

图片

整个场景围绕“有驾在现场”进行设计,融合车展相关元素,渗透品牌标识。

采用3D和2D相结合的形式,用C4D进行场景搭建,OC渲染器进行灯光材质的渲染,反复修改调整场景布局、元素等,最终输出三维设计图后进行PS后期,输出最终的主视觉。

图片

根据以上内容,输出了对应的车展VI规范。

图片

 

十一、车展专题页

根据主KV及VI规范进行专题页的延展,部分内容复用过往车展框架模块。

新增了导航栏设计,便于用户快速跳转到感兴趣的内容模块,导航图标大胆创新尝试渐变色融合的配色形式,让扁平的图标有更加丰富的呈现。在保证阅读效果的前提下,标题样式、页面元素及配色上更加潮酷。

图片

 

十二、集卡分百万 引流活动

过往集卡活动不仅与产品、车展契合度高,并且收益明显,因此本次北京车展活动将复用、优化集卡类活动,让用户沉浸式集卡,从而提升用户活跃及量级。

图片

在玩法方面,本次集卡活动延续过往活动做任务得车卡的主玩法,优化活动体验,新增了合成稀有卡可参与大转盘抽奖的玩法以激励用户集卡,同时设立了车展大众日,在当天进入活动的用户可以获得现金红包,以此来激励用户回流,丰富活动玩法。

图片

集车卡活动的主视觉元素及配色是依据vi规范,保证整体品牌调性的统一;普通靓车卡背景延续主视觉背景,稀有卡尝试不同配色和场景凸显其特殊性。

图片

除了专题页和集卡活动,线上还包括端内社区活动设计,整体视觉调性都与我们输出的车展品牌vi保持统一。

图片

 

十三、倒计时海报

为了给车展开幕造势,我们尝试复用主KV的三维建筑模型,将倒计时1、2、3与不同视角、不同配色的场景相结合,整体风格和车展主视觉保持一致,输出了三张倒计时海报,丰富了整个项目的宣传内容。

图片

图片

整个车展项目除了线上运营活动、造势海报,还有线下展会宣传物料及其他第三方输出的设计物料,整体视觉调性都是基于我们输出的车展品牌VI进行视觉延展,保持统一性的同时,又各自有不同的视觉传播效果。

图片

 

十四、总结

【有驾在现场】作为百度有驾车展品牌活动,我们通过未来感、年轻化、体验感三个维度来塑造有驾车展系列活动的品牌调性,搭建了基础风格,建设三维赛博朋克高品质主视觉,视觉元素细节惊喜感打磨,通过优化活动玩法进行引流,沉淀出新的大事件视觉设计思路,打造了有驾车展品牌设计全案。

未来我们的思考不仅仅只局限在视觉的表现上,还要继续挖掘品牌系列化活动的延续性与独特性,同时更要通过合理的情感互动建立和用户的链接,为品牌长线发展提供更多价值。

 


作者:设计中台

转载请注明:学UI网》有驾在现场 车展品牌全案设计【百度】

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


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


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



如何通过设计语言手册来传递品牌理念!

seo达人


 

图片

本次以3.0时代加入以人文中心主义的设计,人文感官品牌情怀社区为方向发起升级!58到家作为一款为消费者提供家政服务的产品,致力于为消费者带来品质生活!设计语言的存在需要将用户、产品、服务进行结合,并在不同服务中保持统一的展现,从而对体验和商业上带来价值。

我们将产品划分为三个阶段:

1.0:满足了以产品为中心的设计,达成生产售卖通顺闭环;

2.0:满足了以消费者为中心的设计,考虑更多用户体验;

 3.0:加入以人文中心主义的设计,人文感官品牌情怀社区。

图片

那么明确了我们本次升级的方向后,制定了整个产品的框架,底层加入了人文感官品牌情怀的相关因素,再应用到我们现有的业务上,在协同上进行高效的链接,产品到设计,设计与设计,设计到开发。最终形成了我们的前台展现页面。

 

 

图片

最适合用户的设计语言手册,才是合理的,那么在3.0阶段的人文感官品牌情怀,核心即为人,也就是我们的用户,首先我们要了解用户的情感诉求。

图片

根据我们的用户画像以及多轮访谈调研, 得知用户的相关正负情绪。生活当中家务工作的角色分配问题,一直是经常出现的一个场景。用户希望通过我们的产品服务,来提升生活的幸福指数!

在以此为前提的背景下,用户希望我们是专业标准化的省心高效的温暖温馨的舒适的具有亲和力的等等。最终都会期望以更有品质的生活而结尾,那么“品质生活”即为我们需要来传递给用户的情感。

 那么品质生活是什么呢?

图片

其实用户对我们的要求是一款提升生活品质及愉悦感的产品,而非工具。

 

 

图片

综上所述,我们确定了以品质生活成为我们的本次设计语言升级的slogan,再结合业务的自身特性,我们进行了详细的拆分后提炼出了以下相关关键词,来满足用户更多的情感诉求。

干净明亮 

居住环境的洁净会带给人更多舒适惬意的感受。首先对品牌色进行了升级,使其更鲜明。也延展与其相匹配的辅助色来打造出完善的色彩体系。

图片

 

阳光照射在屋子里,用户惬意地躺在沙发上,光总是能给人温馨温暖的感觉。针对光束进行了深度剖析,过滤掉了光源生硬的进入以及具象光源的展示方案,最终确定使用相对适中的渐变色。

专业 

专业是线上线下综合诉求的结合体,那么在线上加强品牌背书、有迹可循的一致性来达到满足所的情感诉求。

高效 

用户携带诉求而来,那么减少用户感到麻烦的情绪,对产品的识别清晰、操作便捷提升是最直接影响的。

亲和力 

服务行业需必备的能力,微笑服务也成为了我们的业务情感透传标准。提炼出微笑符号结合我们的实际场景进行运用!

慢生活… 

在对用户的相关情感诉求结合业务进行了落地后,对效率类设计原则也进行了相应的升级。

 

 整体架构 

应用整体架构也是一个应用对外呈现的基础结构,是系统风格的体现形式之一,除了特殊设计诉求,通常情况下,应用需要使用通用的应用架构来保持系统的一致性和用户操作的易用性。

图片

 栅格系统 

布局不是静态固定的,栅格系统在一个应用内的重要程度不言而喻。我们设定了以4dp / 4pt为基数的栅格系统。

图片

 文本原则  

文本作为产品中用户获取信息的主要信息载体,字号大小和字重决定了信息的层级和主次关系。对字号、字重、行高以及组合字体进行了设定,为不同的场景创造了层级分明以及清晰的信息读取体验。

图片

 间距参数  

针对页面内容区域的通用元素间距进行了分类。设计师结合具体场景的情况,来调用间距参数的适配逻辑。以此来结合栅格系统进行更好的适应相关视觉元素符号的对应变化。

图片

 圆角参数  

结合业务属性保证亲和力的透传,在产品尽量避免出现锐角图形的设计表达手法。故此针对圆角的大小也进行了系统级别的定义,进行深度统一管理!

图片

语意原则及动效等,并依据相关设计原则产出了组件库。

 

 

图片

在多元化的产品时代,时刻关注并满足用户的情绪,是产品能脱颖而出的关键!在建立设计语言手册时从提升用户体验和满足商业价值整体考虑,挖掘流程当中线上线下的触点,多维度思考并总结落地,深度传递品牌理念。

设计语言手册更多时候是一个相对宽泛的阈值,并非组件的固定值,在某些业务场景下能为用户带来增值体验或较高商业价值时,可以被打破。最后,核心就是在搭建语言手册时应思考更多“为什么”这么做!

 作者:58UXD

转载请注明:学UI网》如何通过设计语言手册来传递品牌理念!

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


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


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



160种常用的配色方案,把设计调性拿捏得死死的

seo达人

一、高端

图片

视觉调性高端的色彩,通常具有明度低、饱和度低、颜色数量少等特点,所以很多高端的设计都会以深色作为背景色,因为深色更显低调、更具神秘感,所以给人的感觉更高贵。然后以亚金色、银色、桔红色、白色等作为辅助色。

图片

 

二、科技

图片

想要表现科技感,色彩的整体调性通常会偏冷色系,明暗对比要强,且通常会使用渐变色。比如以深蓝色到蓝色的渐变作为背景色,然后用高饱和度、高亮度的青色和紫色作为辅助色,这时这些辅助色就会非常的跳跃,具有一种发光的效果。

图片

 

三、时尚

图片

其实所有调性的配色都应该要尽量时尚一点,即使是想表现复古,也不能太土,所以这里所说的时尚特指偏向年轻、潮流的时尚。这种色彩通常具有饱和度高、明度适中、色相对比较大等特点。葱爷这里概括了两类,一类是以纯色作为背景,这种色彩比较适合于品牌设计、网页设计、画册设计等;一类是以渐变色作为背景,这种色彩比较适合于电商设计、广告设计等。

图片

图片

 

四、酷炫

图片

酷炫是指那种视觉效果特别张扬、甚至是极具个性的色彩搭配,比如近几年比较火的蒸汽波风格、酸性风格、赛博朋克风格、故障风格,其色彩就属于酷炫类的。该类设计通常也是以深色作为背景,图片元素会使用高饱和度且对比很强的渐变色,色彩相对较多。

图片

 

五、好吃

图片

即让人感觉很有食欲的色彩搭配,这种色彩通常以暖色为主,比如红色、橙色、黄色。饱和度较高、明度较低的组合方式通常用于餐饮行业;而饱和度较低、明度较高的色彩组合通常用于甜点、饮料等行业。

图片

 

六、夏天

图片

目前正值火热的夏季,所以葱爷专门整理了一些适合表现夏季的好看色彩,该类色彩通常会以蓝色、青色、绿色这种冷色系最为主要颜色,然后以黄色或红色、白色作为辅助色,这种色彩组合会给人清凉、快乐的感觉。

图片

 

七、清新

图片

小清新的视觉感受为轻松、柔和、淡雅,要达到这样的效果,颜色的明度通常是比较高的,饱和度偏低,常用的颜色有浅青色、浅绿色、浅黄色、粉红色等,在奶茶、女性护肤品的相关设计中比较常见。

图片

 

八、快乐

图片

快乐是张扬的、是活泼的,所以快乐的色彩饱和度较高、明度不会太低、色彩的种类会比较多,通常也是以暖色为主,但是会搭配冷色一起使用。黄色具有很强的快乐、阳光属性,所以想要表达快乐,黄色通常是少不了的。

图片

 

九、可爱

图片

跟儿童、年轻女性相关的设计,通常需要表现出可爱的调性,这类色彩通常是用冷色和暖色相互组合,颜色的明度同样不会太低,否则会有压抑的感觉,另外饱和度也不要过高,饱和度稍低一点效果会更柔和一些。

图片

 

十、健康

图片

想到健康我们立马就会想蓝天白云、青山、绿色的草地和树叶,还有黄色的小野花等等,所以蓝色、绿色、青色、黄色、白色都是常用于表现健康的色彩,红色也可以偶尔作为点缀色加进来。由于健康的调性也是要给人一种舒适、轻松的感觉,所以整体的颜色明度不要太低。

图片

 

十一、运动

图片

要想让色彩动起来,对比一定要强,可以是色相对比、也可以是明度对比和饱和度对比。橙色和黄色是两个很具活力的的颜色,所以常用于表现运动的设计里。

图片

 

十二、科幻

图片

这是一些科幻电影、机动游戏的海报设计常用的色彩搭配组合,给人的视觉感受是稳重而大气,科技感和神秘感并存,所以背景色通常也比较暗,喜欢用青色和黄色这种比较亮的颜色作为点缀。

图片

 

十三、喜庆

图片

在设计节日海报或促销海报时,通常需要表现出喜庆的调性,有些设计师会局限在大红色、黄色、和橙色里,这样搭配出来的色彩容易土,而想要解决这个问题,一方面可以加入冷色搭配使用,另一方面颜色的饱和度和亮度也不要过高。

图片

 

十四、复古

图片

这类色彩的特点是颜色的饱和度会相对低一点,而且大多数情况下,整体的明度通常也不会太高,常用类比色搭配和对比色搭配。

图片

 

十五、中国风

图片

具有中国风特色的颜色和色彩组合有很多,葱爷这里仅列举了8个组合。这类色彩同样饱和度不会达到最高,有点复古和充满文化气息的感觉。胭脂(暗红色)、缃色(中黄)、绀青(深蓝色)、黛(褐色)等是中国风常用的颜色。

图片

 

十六、梦幻

图片

梦幻具有奇妙和神秘的感觉,好像在黑暗中找到了一点曙光,奇遇了惊喜一般,所以大多数情况下,背景色会使用从深色到亮色的渐变。颜色相对会比较丰富,而且以渐变色居多。

图片

 

十七、女性

图片

女性是温柔的,是感性的,所以该类色彩组合通常为类比色,偶尔会用一点对比色作为点缀,以增加画面的活泼气息,颜色的明度和饱和度都不能太低,当然饱和度最好也不要过高,粉色、紫色是常用于表现女性的色彩。

图片

 

十八、优雅

图片

优雅可以理解为低调、高级、温和、安静,所以这类色彩的对比通常不会太强,饱和度也会比较低,整体的色彩调性会偏中性,常用卡其色、麻色,还有单色组合及类比色组合。

图片

 

十九、经典色彩组合

图片

除了以上十八大调性,葱爷还给大家推荐一些经典的配色,很难把它们具体归为哪一类,但是我们在做很多设计时,用上这种配色总能得到不错的效果,比如红黄黑、红白蓝、黄绿黑、等等,在很多平面海报设计中经常能看到。

图片

 

 

图片

以上所列举的色彩组合,矩形色块为背景色,圆形色块为画面中图片元素或文字使用的颜色。根据需要可以把其中的某些纯色转变为单色渐变,或者也可以把某些单色渐变转化为纯色。另外,在不包含黑白灰的色彩组合里,仍可以根据需要自行加入黑白灰,比如用于填充文字的颜色。
当然,能体现以上这些调性的颜色还有很多,大家可以自行补充,建立起自己的色库。 

作者:葱爷

转载请注明:学UI网》160种常用的配色方案,把设计调性拿捏得死死的

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


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


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



这个效果原来是这样做出来的

seo达人


图片

 

正文

经常使用爱奇艺刷剧的同学,有没有发现爱奇艺的应用图标又变了。前段时间爱奇艺针对品牌设计进行了较大的调整,最近又悄悄地将应用图标的背景色换成了这种多彩色混合渐变的形式。

图片

针对这个视觉效果估计大家各有看法,我们就不讨论这个话题了,今天黑马哥是来出教程的~O(∩_∩)O~。

这个类似于极光/弥散渐变的风格最近也比较流行,在 UI 场景中的运用也是比较普及的,被运用到应用图标的案例中相对较少。大概的回忆了一下,也有一些产品会使用,特别是比较知名的 Instagram 很早之前就使用了,也成为了流行趋势中的优秀案例之一。

图片

通过极光/弥散渐变(混合渐变)的形式强化应用图标外轮廓背景,不仅可以提高视觉感,也是体现年轻化趋势的一种色彩表现形式。不过渐变中的色彩本身也是关键性的因素,如果色彩不够年轻活泼,带来的效果也是千差万别的。

图片

 

一、渐变的表现形式

渐变色在我们的设计中是非常普及的,渐变色分为线性渐变、径向渐变、角度渐变、混合渐变、流体渐变等形式。不同的渐变形式可以营造不一样的视觉体验,可以丰富色彩环境、强化光影质感、增强层次感和空间感等。

1、线性渐变

这是最常见的一种渐变方式,具备明确的方向性,由两种或者多种颜色组合形成。相较于单色来说,线性渐变可以使得画面更加丰富,色彩营造出的层次感更强。

图片

2、径向渐变

径向渐变是以中心向外扩散而形成的圆形渐变,可以作为立体感的表现,也可以营造向中心聚拢的光影效果。

图片

3、角度渐变

角度渐变形成类似于雷达扫描的效果,属于运用相对较少的渐变形式。在一些应用图标的外轮廓背景中会被使用,也可以作为营造产品的光影变化。

图片

4、混合渐变

混合渐变就是多种颜色随机混合,色彩形成不均匀的自然弥散开,也可以成为弥散渐变或者极光渐变。是最近比较流行的视觉风格,可以呈现出丰富的色彩变化和随性自然的年轻化趋势,被广泛应用到平面设计、UI 设计、电商设计等众多视觉设计领域。

图片

5、流体渐变

流体渐变就是多种颜色渐变组合,形成带有流动感的视觉效果,通常作为背景来丰富设计的视觉感。也有动态形式的流体渐变,在 APP 和一些屏幕壁纸中出现,带来的感官体验也是非常不错的。

图片

随着视觉感官体验的不断追求,设计师已经不满足于趋于平面化的渐变形式,探索出造型多变、色彩丰富、刺激感官的视觉体验,以更加丰富的表现形式来探索渐变方式。

 

二、渐变小教程

线性渐变、径向渐变和角度渐变实现起来比较简单,软件自带的渐变属性即可满足。下面重点给大家分享如何实现混合渐变的效果,以后再单独给大家分享关于流体渐变的技巧。

混合渐变顾名思义就是将多种颜色进行混合,形成色彩丰富的过度效果,需要把控的是颜色之间的自然过渡。

方法一:

通过绘制几个不同颜色的形状图形,然后执行高斯模糊形成混合渐变,模糊的参数值要适当大一些,一直到颜色自然过渡为止。

图片

方法二:

如果想要随机性大一些,可以通过画笔工具随意涂抹颜色,这样形成的效果更加随机性。然后再执行高斯模糊将颜色融合,带来自然随性的视觉体验。

图片

 

三、分享几个案例

不能只是纸上谈兵,只有反复磨练和尝试才会熟能生巧。根据以上的方式黑马哥完成了以下的作品案例,大家也一起来动动手吧!

1、邻近色系易把控

混合渐变技法层面来说并不难,配色是相对具备难度的,很多同学都会因为配色不到位而做不出优秀的作品。针对应用图标设计中的配色来说,邻近色系的搭配是最容易把控的。选择色相范围在 60° 以内的色值,混合出来的色彩排斥感都是比较低的,融合度比较高,能够呈现出比较舒适自然的视觉感官体验。

如果选择了色相角度大于 60° 的色值,只要数值的增减关系控制在 30° 以内都属于可控范围,这时候如果出现较大的色彩排斥感,可以通过降低不透明度来进行视觉平衡。

图片

2、强视觉感还得对比色

虽然邻近色的处理比较容易把控,但是带来的视觉感也是与颜色对比关系成正比的,想要达到强视觉感还得选对比色。色相选择范围在 120°~180° 之间的色值,容易形成较强的视觉张力,通过增加高斯模糊的值才能稍微过度相互之间的色彩排斥感。

图片

3、学会举一反三

今天分享的经验不局限于应用图标的设计范畴,我们要学会将这个技法举一反三,运用到更多的设计场景中。比如在下面作品中的一组信息卡片的设计中,通过混合渐变形成的卡片背景提高了局部的视觉感,配合磨砂玻璃质感的运用,提高了该部分的视觉感官体验。

图片

4、其他作品欣赏

为了辅助大家理解和开拓思维,为大家选择了几个类似的案例作品,希望可以带给大家更多设计灵感。(以下作品版权归属原作者,仅作为学习交流)

 

 

四、布置一个小作业

通过对混合渐变实现技巧的学习和案例欣赏,相信大家对于混合渐变有了比较全面的认知。学以致用的目的,下面为大家准备了一个小作业,希望以此来强化大家的理解。

图片

根据以上示意图提供的高保真原型图,以混合渐变的形式增强其作品的视觉感。

以下方案为黑马哥完成的一个示意,大家可以转换思维和调整新的配色方案,输出不一样的全新作品。

图片


作者:黑马青年

转载请注明:学UI网》这个效果原来是这样做出来的

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


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


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




百度直播丨塑造亲和力的直播间虚拟助理形象

seo达人

业务背景 

首先,我们一起解读业务场景、身份、及功能;业务场景是全品类综合电商直播间,身份是主播的虚拟助理,直播间的功能是为用户答疑解惑;基于这三个背景,初步勾勒了角色标签,目标是创造一个富含亲和力的虚拟助理形象,来呼应全品类综合直播场景和虚拟助理身份。图片 

 

行业洞察

其次,洞察行业虚拟数字人,从外形上分为卡通和写实,风格上划分为二次元动漫化、3D卡通、3D超写实、真人形象四种类型,渲染效果分为虚拟和现实;而3D卡通风格的受众群体大,接近现实的渲染效果,更平易近人,亲和感更强。 
探究形象美学,代入「巴卡罗九风格坐标图」的“曲直+量感”两大风格要素,定位到人物轮廓圆润曲直偏曲,与柔和自然的小量感「柔和型风格」是亲和的,和用户交流时无攻击性,符合亲和的带货助理身份所需的特质。 

 

设定架构

最后,结合形象的“内在+外在”的体现,与巴卡罗两大风格要素“曲直+量感”,来塑造亲和力的直播间虚拟助理形象;拆解内在围绕性格/气质/眼神特征,外在围绕形象(体型/面貌/穿搭)、举止与表情三大框架设定形象,共同塑造亲和力和感染力的形象。

图片

01 内在心与神 

解析内在形象对应的两大风格要素-曲直+量感,细分量感的指标是成熟/青春、外向/内向、开朗/稳重的综合值,曲直的指标是热情/冷漠、柔和/刚烈、感性/理性的综合值。而亲和力的内在形象,量感偏小—开朗的性格、青春乐观的心态、以及外向的性格;曲直偏曲—需具备大方热情的气质、柔和的眼神、感性的情感表达,拉近和沟通者的距离,在直播间为用户答疑解惑时,第一次见面也能给所有人留下亲切、可信任的印象。

图片

02 外在形与貌

解析外在形象对应的两大风格要素-曲直+量感,细分量感的指标是大小、轻重、粗细、深浅、宽窄、薄厚、浓淡的综合值,曲直的指标是直曲、冷暖、方圆、硬软的综合值;量感偏小—特征是窄细浅小短薄淡,带来柔和自然;曲直偏曲—特征是圆暖曲软,和用户沟通时圆润舒适,以此来指引亲和形象的设定。  a)形象亲和接下来,外在形象围绕体型/面貌/穿搭三步走框架,搭建亲和力的决策框架。体型

第一步,体型选择胖瘦适中(曲直适中);肩腰臀比例协调/凹凸有致的X型(量感适中),理想型身材穿什么衣服都好看。

面貌五官

第二步,五官的起点是脸型,选择曲直适中,长短适中的鹅蛋脸(额头与颧骨等距),不挑发型。

图片

确定脸型后,是五官的决策,我们通过洞察发现,许多保持高热度的卡通形象最显著的共同特征就是拥有一双甜美可爱的大眼睛,表情生动亲切,无攻击性。在五官比例上,三庭中的中庭稍长,五眼中两侧较短,注重眼睛神情的表达。因此,在设计初始,我们先以眼睛为中心,再逐一展开眼睛/眉毛/嘴巴/鼻子的设定。

图片

眼睛:定位生动的大眼(量感大)获得生动的神情;眼型结合圆眼+桃花眼(偏曲),上眼皮弧度圆润饱满,自带月牙般微笑感。

眉毛:定位粗细适中(量感适中),眉峰圆润/眉尾自然向下的小挑眉(曲直适中)。

嘴巴:定位小嘴唇(量感小),唇型选择微笑唇,嘴角上扬提升友好度(曲直适中)。

鼻子:定位鼻翼窄小的小鼻(量感小);鼻型选择鼻头上翘的小翘鼻(曲直适中),搭配鹅蛋脸脸型。

图片

妆容

在妆容上,尝试融入电商热卖元素-火苗,来进行面部彩绘,呼应电商直播间虚拟助理的身份。

图片

头发

五官和妆容确定后,开始做她的头发,长短适中的中长发(量感适中)、发尾微微外卷俏皮柔美(曲直适中)、高颅顶发型蓬松透气。

图片

到这里,咱们面貌的部分就告一段落了,亲和力的五官,并不是说每一个五官都要量感小、曲度适中;咱们围绕业务场景、身份与功能,科学的创造虚拟形象,需注重五官与脸型的比例,和五官之间的相互搭配。

穿搭

第三步,是穿搭的设定,以上体型和面貌量感/曲直的设定,与穿衣风格有着密不可分的关系。我们以修身得体为方向,尝试了优雅的轻熟风、服务型身份的职业装、以及休闲百搭的休闲装-T恤和牛仔裤;因轻熟风的连衣裙便利性差,职业装略过正式有距离感,最终选择休闲装即适用于多品类直播间场景,又给人亲和感拉近距离。

图片

b)举止优雅

根据虚拟助理的六大服务场景,定义优雅的肢体语言,在与和用户交流时,从肢体语言(站姿、手势、头部、眼神、面部表情….)中流露出周到的礼节、细致的行为,给予用户友好的指引与反馈。

图片

c)表情生动

咱们按照场景把基本情绪划分为快乐、伤感两类;欢迎/引导/收到赞的正向行为,表现为快乐的微笑;答不上来问题和收到踩的负向行为,表现为伤感的噘嘴/皱眉,避免使用带有攻击性的(悲痛、愤怒、憎恨)。

图片图片

 

写在最后

美国心理学教授艾伯特·马伯蓝比提出73855定律:人们对一个人的印象,有7%来自于说话的内容,38%来自于说话的语调,55%来自外型与肢体语言;虚拟形象想要拥有丰富的表现力,既要注重形象、举止、表情的雕琢,也要注重声音的音色/语调/语速、语言的话术的呈现。彼时,虚拟数字人来到了聚光灯下,窥见巨大的商业潜力;MEUX将持续探索属于自身的“造人”之路。
 

作者: 富媒体用户体验 

转载请注明:学UI网》百度直播丨塑造亲和力的直播间虚拟助理形象

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


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


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



快来看看这些小功能里面的设计惊喜

seo达人

一、【抖音】点赞功能情感化设计

在七夕期间使用抖音APP点赞时,图标会变成玫瑰花符号,多次点击会出现满屏的玫瑰花,让点赞设计变得更加趣味化。并且与同类竞品在点赞的交互设计细节上产生差异化,给用户带来与节日相关联的,更加丰富的视觉和感官的触动。该设计方案不仅提高产品的调性与用户体验,并且与用户在节日情感上产生更深的共鸣。

图片

 

二、【飞书】左侧聊天框交互设计探索

飞书作为一个办公协作平台,在解决团队沟通效率方面下足了功夫。鉴于人们在认真阅读某些信息时,通常是从左到右、从上到下的浏览习惯,飞书的聊天信息全都靠左排列也正好印证了这一点,一改往常闲聊时较为随意的习惯,不仅能潜移默化的暗示用户在交流过程中该有的工作态度,还能提高其专注度、以及团队之间的沟通效率。

在使用场景中,用户可以把工作的聊天记录当成文档来看待,减少与工作无关的聊天内容,使得聊天记录就是会议纪要。

用户也可以通过飞书的设置,自由地更改聊天消息的左右排布。使不习惯于左侧聊天排布的用户调整的自由,减少这类型用户的排斥心理反应。

图片

 

三、【闲鱼】卖闲置图标场景设计

闲鱼将“卖闲置”的驼峰标签栏设计成“电风扇”的动态图标形式,结合近期高温天气,给用户带来心理上凉爽的使用体验。

图片

 

四、【每平每屋】加入话题圈卡片动效设计

每平每屋的话题圈添加卡片,做成了非常有意思的ip人物拨弄+号的动效。在视觉上起到了强调的作用,也能驱动用户的好奇心和体验心,增加话题圈的点击率和加入率,让加入圈子这件事变得轻松有趣。

图片

 

五、【Snapchat】角色创建功能应用设计

在Snapchat中角色创建完成后,在相应的应用功能界面,则会替换成用户的专属角色。

如:地图界面、表情包界面、引导界面以及视频流界面。

该设计以专属角色代替用户视角,通过让专属角色深入的参与每一个功能来提高用户粘性,以及用户存在感和归属感。

图片

 

六、【Snapchat】底部栏故事功能设计

Snapchat将故事视频流设计成了视频“合集”,用户点开视频,通过下滑或者点击创作者的名称来关注或者查看不同的视频合集。视频合集分为xx季xx集,方便用户快速筛选。

另一个不同于普遍的视频功能设计点中,Snapchat将单击视频【暂停】的功能设计成了单击【快进】,视频切换则是左右切换。对于中国用户,需要时间来适应不同的交互习惯。

图片

 

七、【Gravity】头像装扮设计探索

在Gravity这款社交软件中,用户无法使用设置头像功能,产品将用户系统角色替代照片头像。在软件中模糊用户的头像存在感,使用户发出的内容成为社交重点,塑造一个半匿名社交平台的属性。而角色商城的装扮,则满足了用户头像多样性的选择,同时通过这种方式提高了产品变现的能力。

图片

 

八、【Gravity】角色场景界面

在Gravity的角色场景界面中,用户可以根据心情、生活、兴趣等场景来切换自己的展示形象。也可以邀请好友进入自己的场景界面,形成一个动态的“朋友圈”,通过切换场景来表示自己最近的状态和生活。动态朋友圈的建立能够增加用户与用户之间的联系,增强用户对平台的粘性。

图片

 

九、【羊驼日语】首页卡片功能设计

羊驼日语的首页不同于其他APP,摒弃了首页头部banner或者金刚区的设计方法,羊驼日语将动漫风融合进APP的设计风格中,将首页的卡片区动漫人物做主要突出。新颖的设计让用户眼前一亮的同时将思维引导到卡片功能上去,引导用户进行点击,提升学习率。

图片

 

十、【型影】构图姿势辅助功能设计

如果你拍照总是肢体僵硬,不会摆姿势,那你一定要下载这个APP。

型影APP的构图姿势由创作者提供,内含几千种不同场景不同姿势的构图摆拍。

只需要点击你喜欢的同款照片,打开相机,视频中的辅助线能够帮助你一比一复刻博主同款poss!

图片


作者:黑马青年

转载请注明:学UI网》快来看看这些小功能里面的设计惊喜

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


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


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



火出圈的《羊了个羊》,到底做了什么?

seo达人


图片

几轮信息传播下来,我的好奇心就这么被激起来了。于是到小程序里找到游戏,玩了几把。最直观的感觉就是“确实难度很高”,而且与之前的玩过的游戏还真有点不一样。

 

一、产品玩法

1、门槛低

本质上来说,《羊了个羊》是一款消消乐游戏。消消乐的特点就是门槛低,没有复杂的操作,用户只要点几下就可以了。第一关太简单了,更多的是为了教学而服务的。也正是因为简单,我不知道“卡槽里的3个相同的卡牌,即使不相邻也是可以消除的”,不过玩了几局后我就明白了。

图片

2、单局时间短

微信小游戏有一个特点就是时间短,用户可以随进随出,单局不会占用太多的用户时间,但是玩起来后也容易上瘾。这似乎与短视频非常相似,本想着只看一个视频,也就3-5分钟,不会浪费太多时间,但是一旦开始了,根本停不下来。

前几天,在我儿子的引导下,玩了一个赛车游戏。刚开始想就玩一局,结果是一局接一局,中秋放假2个晚上都玩到了深夜。

3、难度高

《羊了个羊》与传统的消消乐游戏又有些不同,增加了叠牌设计、卡槽消除玩法。看起来简单,玩起来实际上非常烧脑。

叠牌的玩法就是用户必须要消除上层的卡牌,才能激活下层卡牌。有了消除的先后顺序,就要求用户必须有一定的策略,才可能通关。

卡槽用来放置用户选择的卡牌,卡槽中出现了3个一样图案的卡牌则可以消除,当卡槽满了,也就意味游戏失败。即使卡池上存在3个一样图案的卡牌,但是卡槽中没有了空位,游戏仍然失败。

图片

所以用户不仅要关注卡池中的卡牌层级,还要关注卡槽中卡牌情况。

因此,游戏在宣传方面打出了“通关率只有0.1%”的口号。为什么搞这么高的游戏难度呢?

 

二、第二关都过不去的难度

任何游戏都必须要有一定的难度,否则用户玩几局就会觉得“缺乏挑战性,没意思”。但是只到第二关的难度,我也是第一次见。这种难度给游戏带了什么呢?

1、话题性带来流量

虽然很多游戏会有获得成就引导分享,或者分享朋友圈、好友圈复活玩法等等,但是用户要么不做分享,或者都是非常被动的分享。而这次用户发朋友圈,或许都是主动而为。

最大的引爆点就是游戏难度,有难度才会有话题性,用户才有分享和互动的欲望,才能引起更多人的关注。而朋友圈、分析文章、短视频各种渠道掀起的话题,肯定为游戏带来相当大的用户流量。

2、用户挑战欲望

如果有人对你说,“有款消消乐游戏挺好玩的,要不要试试?”,你也许只会微微一笑,甚至嗤之以鼻。

但是如果有人对你说,“有款消消乐游戏,你第二关都过不去”。你会怎样?

大概率想“怎么可能呢?我要挑战一下”。用户尝试的欲望就起来了。结果,用户越是挑战不成功,越想挑战。

3、方便广告植入

游戏难度最终是商业化服务的,用户多次尝试后不成功,就会求助道具或者启用一次复活机会。特别是单局已经投入了较多的时间成本,眼看快要成功通关的关键时刻,沉没成本促使大多数用户牺牲30秒的广告时间,换取一次复活的机会。

只要看广告的人越多,钱也就赚得越多,游戏的难度也是为了“如何让玩家看更多广告”而服务的。

图片

4、减少游戏投入

对于游戏这种产品来说,真正的热度应当来自于游戏内容,以及其带给玩家精神层次的愉悦体验、世界观、价值观构筑等方面;而游戏公司通过制作优质内容的游戏,获取商业利益,再持续开发更多游戏吸引更多关注。

所以传统的关卡游戏可能是几十上百关,甚至更多,大家也都习以为常了。随着关卡增加,游戏会慢慢加入新的玩法,吸引用户不断地玩下去,最终让用户长期上瘾。希望像挤奶牛一样,持续性地挖掘用户的价值。

《羊了个羊》则完全反其道而行之。

似乎是考虑到当下小程序游戏非常容易相互模仿。一旦一款游戏火了,之后就会冒出各种相似的游戏,就会面临激烈的竞争。所以《羊了个羊》改变了游戏策略,通过拉高关卡难度,让用户一直停留在第二关(也许有更多关,因为我没有玩过第二关),从而减少游戏的开发成本。

这种更像是快餐模式,不用过多地担心游戏风潮会过去,也不用担心用户流失,毕竟游戏的投入并不高。

而一些当时风靡一时的小游戏,例如“跳一跳”、“打纸飞机”、“旅行青蛙”等,确实在大火之后迅速降温。想想自己这几年也曾经玩过一些小游戏,不过基本上都是“3分钟热度”,玩一段时间就放弃了。

或许这也是《羊了个羊》拔高游戏难度的一个原因吧。

 

三、关于激励机制

当然,在《羊了个羊》游戏中也有传统游戏必备的激励机制。例如有省区代表队排名,“最强王者”等荣誉勋章称号。但这些激励机制在目前的阶段,似乎并不重要,通关成为了用户最大的目标。用马斯洛需求层次理论来解释就更加合理了,温饱还没解决,谈什么个人荣誉呢?

用户当前最大的需求就是“该如何冲过第二关”。

图片

以上就是我的一些思考,欢迎大家评论区留言交流~


作者:子牧先生

转载请注明:学UI网》火出圈的《羊了个羊》,到底做了什么?

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


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


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



怎样解决设计好看又符合市场需求的问题?

seo达人


在商业设计中,好看和有效按理来说应该是一体的,因为脱离了市场需求的好看没有意义,而设计师所做的工作就是要解决降低传播成本的问题,通过专业的审美和技巧让设计更美观,也是为了满足市场需求、达到更好的传播效果。

举个例子,在一张产品海报中,最好不要让一个产品孤零零的“飘”在海报上,而应该加一些元素与产品进行组合,以强调产品的功能属性和行业属性等;或者搭建一个场景加强氛围感;又或者加上用户以加强代入感。这些处理手段都是从设计的功能性来考虑的,但是出来的视觉效果确实也会比只摆放产品要更好看。

图片

图片

比如上面两张海报,忽略画面中的文案意思和尺寸,单纯从设计上来看,很明显图二更好看,也更有带入感和氛围感,所以相比之下,图二更符合市场需求。

而如果不出于对市场的考虑,只要做到美观,那么我们就可以在产品周围加很多花哨的元素,甚至把产品和文案尽量缩小,让装饰元素作为主导,这样可能更好看,但是产品和文案被抢了风头,消费者的关注点都在装饰元素上,导致最终效果可能会大打折扣,这就是不符合市场需求的好看。现在很多国内的电商设计在这一方面有比较明显的问题。

图片

还有一个老生常谈的问题,就是关于中文和英文的排版问题,我们都知道用英文排版更容易做出好看、洋气的版面,所以现在的很多海报中都会有英文。

其实适当加一点英文进行辅助也没什么不好,毕竟我们可以把英文当成是与产品或主题相关的元素,既然图形能做装饰元素,那么文字也可以,何况现在国人整体的英文水平也有所提高,国内也有不少国外友人。

图片

但主次问题一定要把握好,既然是国产品牌,目标群体又是普通的国内大众,以中文为主、突出中文才是符合市场需求的。着重突出英文或许会更加好看,但同时也会弱化中文,那么传播成本就提高了,甚至还会让消费者怀疑,在这些看不懂的英文里是不是隐藏了一些对他们不利的信息,所以这种做法并不可取,客户通常也接受不了。

 

二、并不是丑的设计就有效

有很多设计师会习惯性的以为,好看的设计就是花里胡哨的、没有效果的;而丑的设计就是接地气的、有效果的、符合市场需求的,甚至喜欢把符合市场需求当成设计不好看的借口,这绝对是一个误区。

比如有些人觉得椰树牌椰汁包装很有效,是因为它丑,其实美与丑只是个人的视觉感受,美丑之下传递了什么信息、达到了怎样的效果才是关键。椰树椰汁的包装之所以有效,不是因为它丑,而是因为它不一样,还有它把包装本身当成了广告媒体,大量宣传了它的利益点。

图片

想象一下,如果一开始的包装就请设计师按照这种思路精心排版一番,做好看、做时尚一点,效果难道会比这个差吗?应该不会吧,而且可能年轻人会更喜欢,更敢于拿着它走在大街上。

图片

图片

▲ 上图是网友自发设计的包装。

 

还有的人觉得有效的设计就是把文字和图片都尽可能地放大、把重点文字填充成大红色,逻辑是面积占比大了、颜色不一样了,自然更容易被看到、更容易阅读,所以更有效。而事实上不一定,原因有三。

❶ 如果所有信息都大、都突出,那么就等于没有重点,消费者在有限的时间里不知道该看什么。

❷ 如果文字和图片都大,那么留白空间就会减少,版面太拥挤就会加大阅读的难度。

❸ 如果因为元素太大、红色强调的信息太多,从而导致画面变得很难看,那么可能会引起消费者反感,从而放弃阅读信息,甚至是损害品牌的形象。

下图是葱爷在一家超市门口看到的海报,文字都很大,版面得到了充分利用,也用颜色突出了重点信息,但是效果很好吗?不一定吧,如果合理美化一下是不是能得到更好的效果。

图片

把重点信息放大、用红色突出也没有错,但突出信息的方式不只有这两种,以不变应万变的种做法很偷懒,效果也不会太好。

 

三、如何在符合市场需求的基础上尽量做好看?

1、加强氛围感

即把产品或主题的属性加强,比如科技产品的设计要有很强的科技感、食品海报要有很强的食欲、运动海报要有动感和放飞自我的感觉。加强氛围感的主要方式有增加场景、增加光影、填充大面积的颜色、增加与产品相关的素材等等。

加强氛围感强可以使设计在视觉上变得更美观,但基本不会影响到原来信息的可读性、产品也不会被抢风头,这样的设计会更有带入感,更能促进消费者采取行动。

图片

图片

比如在上面的两则banner中,图二在图一的基础上增加了背景色和光影,氛围感增强了很多,同时视觉上也更好看了。

 

2、加强设计的形式感

比如使用一种新颖的构图方式、新设计风格、新的创意表现、新的元素组合方式等,有形式感的设计会更整体、更特别。当然,在视觉上也会比没有形式感的设计更美观、更具视觉冲击力。

图片

 

3、有主次、有层级

产品和重要信息当然可以突出,但不能盲目地突出,而是要按信息的重要程度和逻辑关系来安排信息的层级关系,引导消费者高效阅读信息。

图片

 

4、设计手段不要太单一

比如为了突出重点信息,我们除了放大字体还可以采用其他手法,还可以加强字体对比、空间对比、方向对比、空间对比、留白对比、风格对比、点线面对比等手段,照样能起到突出的作用。而且手法丰富了以后,视觉就不会那么单调,从而也会好看很多。

图片

图片

▲ 图二比图一 的设计手法就要丰富一些。

 

5、细节要精致

在设计大方向做得不错的情况下,如果再加强细节的处理,那么其美观性也可以得到很大提升。比如把标题做一下字体设计、把图片精修一下、颜色搭配在整体和谐的基础上增加一点新意、排版用网格系统规范一下等等。

 

比如在上图的两张海报中,图二在图一的基础上做了图片美化、网格规范排版、色彩优化等细节调整,视觉上也更美观了,甚至也更符合市场需求了。

 

图片

想要设计既能满足市场需求又能满足审美需求,确实不是一件容易的事情,因为设计不是数学,没有标准答案,如何把握好这个度,如何让两者完美结合达到最好的效果,是需要设计师去反复探索和尝试的,但毫无疑问,它们是可以共存的,而且应该共存。


作者:葱爷

转载请注明:学UI网》怎样解决设计好看又符合市场需求的问题?

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


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


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



需求太朦胧,设计师如何拆招?

seo达人


 

图片
图片 
先举一个栗子,如果你正在进出地铁口,迎面而来的是一张信息繁杂,需要解读时间较长的海报广告,你是否会驻足观看?

图片

除了部分“犯职业病”的同学可能会研究一下,绝大多数人可能并不会耗费时间去解析,因此这个海报也就失去了传播信息的价值。

图片

或许设计师在设计这张海报时运用了某种创意,但因为对场景限制的欠考虑或者并未提前了解投放地点,而没能达到预期效果,的确有点儿得不偿失。

图片

因此,在开始着手设计前,建议设计同学要和AE或客户确认好目标用户、使用场景和时间节点等关键信息。只有在思考到这些之后,才能尽量确保自己的设计能真正助力品牌或一场营销活动。 

 

图片

▷  它被广泛用于企业管理和创意设计,对于从不同角度发散设计思维很有帮助,同时也助于弥补设计产出的疏漏,让你的设计工作更成体系。

图片

图片
▷ 在参与项目时,这些信息点可能不会完整的给到,这就需要我们主动进行提问、了解。有时,提出一个好的问题,就意味着完成了“一半”的工作。收集到的“情报”越多,也越有利于提高出品的准确性、合理性。

 

图片 

▷ 那么当下次有一张“你看着设计就行”的海报需求时,你通过对它进行拆解,可能得到的答案是——为迎接双十一,客户要在商场电梯两侧,做产品促销广告,希望通过更优惠的价格吸引人购买的海报了。

 

图片

图片

图片

 

图片

▷ 我的建议是延续品牌调性走,至少也要跟着所属品类的调性走。因为不同行业、品类的风格是有差异的,比如:快消品可能要传达很“嗨”的感受、奢侈品要很有高冷feel等… 

 

一般情况下,我们不能用做快消品海报的风格来设计奢侈品海报。 

图片

▷ 这是我浏览网页时偶然见到的一个例子,可能比较极端,但这里想建议大家的是,在开始设计前,可以先大概看一下服务品牌以往的视觉调性,了解行业、品类的视觉特点,做到心中有数,这样即使在没有明确需求时,我们至少也能做到尽量不跑偏。 

 

 

图片

图片

“字再大点儿”这几个字在商业设计上“战功卓著”,引无数设计同仁竞折腰…把字放大和设计师对审美的坚持,有办法调和么?面对诸如此类的“设计需求”,我们可以如何拆招呢? 

图片

▷ 我认为最关键的点落在这个词上——翻译。当客户说他没有别的需求,把字再放大一些就行时,你确认只是字面上的意思么?其实大部分情况下好像并不是,他虽然表述不出来,但内在的意思有可能是再醒目一些、一眼就能看见。

 

图片

▷ 我们来看一个案例。提交第一张图时,客户反馈字还要放大,但这里我们尝试换一种思路来处理这个需求。

 

图片

▷ 原图的字号我们保持不变,把颜色重新调整一下。通过更简明、醒目的方式,让其传播信号的能力更强,从而达到客户的真实目的。

 

 

图片

▷ 除了颜色上的调整,也可以通过对文字的重新布局,达到“字要大”的需求。

 

图片
▷ 上面第一张图是我在网上找到的一个案例,但因为它的行距和字距相近,所以让人阅读起来非常困难。我只是在它字号不变的基础上调整了字距,这样看起来信息就清晰了很多,相应的传播的信号也有所增强。

图片

以上两个例子虽然都没有直接按照需求把字放大,但同样能达到客户的预期,因为通过这些变化,我们实现了更醒目,传播信号更强的目的。

 

 

图片

除了字要大,“没有品质感”应该也是让各位设计同学经常挠头的反馈了…按照上面所讲,我们来尝试翻译下这个需求。

▷ 品质感本身是一个比较模糊的、虚拟的、对设计作品综合性的评价。可以从两个方向去理解,“品”一般是指物体的品相、细节,而“质”则代表物品所传达出的感受、气质。

 

图片

▷ 我们来看一下大众比较认可的具有较高品质感的苹果产品的页面设计,通过加入一些光影以及渐变、材质,使产品看起来更加真实、细腻。这也是非常值得我们借鉴的。

 

图片 
 
▷ 通常我们在logo提案中,会给甲方展示一些logo的样机贴图。这样能让客户更直观的感受到logo的具体应用效果。但如果样机的材质不够真实和细腻,那么很有可能导致提案的效果大打折扣。比如上方的两个样机贴图,我们就能很明显的感受到哪一个更有品质感。

 

 

图片

再来看一个比较常见的客户反馈——“看着不喜庆,想用大红色”。一般情况下,如果按照这个诉求直接调整,可能会影响整体的美观性,这个时候我们是不是可以尝试换一个同色调的其它颜色呢?

图片 

▷ 按照客户的要求调整后,虽然看起来有一些喜庆的氛围,但画面显得不透气,并且也和主体的颜色类似,造成画面没有层次感。

图片 
 
▷ 我们换成了同样具有热闹属性的黄色,不仅能衬托主体,也能传递出热闹的氛围,并且提交后,客户表示符合预期,非常满意。

 

 

图片

图片  

这是因为,虽然在各位设计同学眼中,我们使用的是不同的颜色(它们唯一的共性是暖色,即使在简版的潘通色卡中,暖色就有上百种),但是很抱歉,它们在客户这块儿,可能统一都被称为是“大红色”。 

 

 

图片

所以,当客户表面上在说要喜庆、要大红色时,我们可以尝试进行需求的翻译,其内在的诉求可能是想传达温暖、亲切感;也可能是热闹、豪放感…大家可以根据实际服务项目的行业属性、风格特征等做进一步的分析,灵活运用。

 

 

写在最后:

图片

 


作者:大目

转载请注明:学UI网》需求太朦胧,设计师如何拆招?

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


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


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




日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档