旗下产业: A产业/ A实习/ A计划
全国统一咨询热线:010-5367 2995
首页 > 热门文章 > UI设计 > 全面解析瓷片区的设计要点

全面解析瓷片区的设计要点

时间:2020-08-19来源:www.aaa-cg.com.cn点击量:作者:Gella
时间:2020-08-19点击量:作者:Gella

  很多同学不知道瓷片区是什么,于是和一些设计老师请教了解了一下,发现一些新的知识点,今天AAA教育郭老师就针对瓷片区的设计要点进行简单的说明。
 

  1、什么是瓷片区?
 

  瓷片区就是板块拼接在一起形成的运营位,视觉上像一块块瓷片贴在版面上,所以叫做”瓷片区“。通过各类促销模式,具有较高的转化率,往往能够提升整个产品的留存率。如果你对上面的概念还是不太理解,请看下图:

 



 

  2、瓷片区常见类型有哪些?
 

  瓷片区属于运营内容区,是流量导流出口,适用于平台、电商、金融、娱乐类等产品,目前常见类型有:1.产品实物图片类 2.插图类。
 

  2.1. 产品实物图片类
 

  优点:识别性高、视觉上更直观、可复用、设计效率高。
 

  缺点:对图片素材要求较高。
 

  适用场景:用实物图能更直观的表达内容的产品类型,例如外卖类、旅游类、电商类、租房类等。
 

  为何适用于这些产品:外卖、旅游、电商、租房等是用户购买真实的物品,代入感强、用户可以感知产品的质感、味觉等,举个例子:比如你看到一个色泽饱满的鸡腿实物图片和一副鸡腿插画,是不是前者更能让你垂涎欲滴呢,所以使用真实产品图片是最有效的吸引用户下单的方法。
 


 

  2.2. 插画类
 

  优点:创意性强、具有趣味性
 

  缺点:含义表达不是很直接、难以复用、绘制耗
 

  适用场景:偏概念型的产品类型,例如金融类、虚拟产品类、设计类等
 

  为何适用于这些产品:金融类、虚拟产品、设计类这些是偏概念型的产品,有时候会有多个含义融合在一起,这时用插画形式能更好的表达

 



 

  3、瓷片区设计要点
 

  说了这么多,是不是对怎么设计瓷片区有了更多的期待,下面我们一起来看看:
 

  通过拆解可以总结出瓷片区由:图片/插图+文字+背景+点缀组成,下面我们来一一分析各自的设计要点。

 



 

  3.1实物图片
 

  (1)全景配图:即配图占据整个瓷片区域,适用于外卖类、旅游类等产品。
 

  配图要求:图片素材要求清晰度高,色彩饱和度高;一般主体占1/2,背景尽量简洁,以突出主体内容为主。

 



 

  (2)局部配图:即配图占据部分瓷片区域,适用于大多数产品。
 

  配图要求:图片素材要求抠图干净、饱和度高;

 



 

  (3)抠图组合:适用于餐饮类、平台类产品。通过不同素材抠图重新组合,利用多样产品把兴趣最大化,以高价商品带动低价商品。
 

  3.2.插图
 

  插图绘制要注意提炼关键文案信息,通过关键词发散绘制关键性元素来表达商品的核心意思。
 

  3.3、文字
 

  非标签类文字:
 

  主副文案通过大小、粗细和颜色进行区分,主文案字号建议在30~34px,副文案字号建议在24~26px;不同内容板块也可采用不同颜色,但颜色一般不要超过4种;在使用颜色的时候,可以匹配业务特点进行色彩选择,如科技使用蓝色,福利使用红色等。
 

  标签类文字:
 

  标签也可分为主副文案两个板块, 标签底部颜色选取可以使用图片的邻近色,或者根据业务属性使用情绪板取色。标签一般位于瓷片区域的左上角或左边居中的位置。
 

  3.4、背景
 

  背景可分为白色背景、浅灰色背景、浅纯色背景、渐变色背景这几种,下面是背景颜色应用场景。
 

  (1) 白色背景:

 



 

  (2) 浅灰色背景:

 



 

  (3) 浅彩色背景:背景色通常跟实物图片或插图的主色调邻近

 



 

  (4) 渐变色背景:

 



 

  a浅色系渐变:选定一种颜色,向白色过渡,颜色饱和度较低、明度较高。
 

  b同色系渐变:同一种颜色,变化饱和度。
 

  c不同色系渐变:色相+饱和度变化
 

  3.5、点缀
 

  点缀可以丰富视觉效果;常用点缀元素有波浪线、圆形等几何图形;树叶、丝带等烘托气氛的元素。
 



 

  3.6.图文排版方式
 

  常见有四种排版方式:上下排版、左右排版、对角线排版、组合型排版:如对角线和上下排版组合、全景配图和局部配图组合等。
 

  总结
 

  文中对瓷片区进行了一个概括性的了解总结,设计要点的话在排版设计中都是需要注意的基础知识所以未多加赘述。因此,您现在已经了解了与UI设计师的工作相关的主要技能。如果您想了解更多信息,请访问AAA教育,包含有关在该领域工作的更多相关文章。



 

预约申请免费试听课

填写下面表单即可预约申请免费试听!怕钱不够?可先就业挣钱后再付学费! 怕学不会?助教全程陪读,随时解惑!担心就业?一地学习,可推荐就业!

©2007-2021/北京漫动者教育科技有限公司版权所有
备案号:京ICP备12034770号

老师想和你聊一聊

©2007-2022/ www.aaa-cg.com.cn 北京漫动者数字科技有限公司 备案号: 京ICP备12034770号 监督电话:010-53672995 邮箱:bjaaa@aaaedu.cc

京公网安备 11010802035704号

网站地图