瓷片区的作用(瓷片区和金刚区的区别)

最近设计项目中涉及到「瓷片区」,于是和一些设计伙伴请教了解了一下,在此记录总结一下,也希望可以对大家有些小小的帮助。

什么是瓷片区

听说:美团内部将首页的运营广告位模块称为瓷片位,其可以根据需求变动灵活调整,就像瓷片一样灵活适用,顾名思义,瓷片区也就被叫开来了。

根据下图我们可以了解到,瓷片区在产品中的应用。

瓷片区的作用(瓷片区和金刚区的区别) 

瓷片区的功能

瓷片区作为与 Banner、金刚区并行的三大运营板块,都负责着导流的功能。此片区较两者更便于在页面中进行布局,可以灵活复用。

瓷片区的作用(瓷片区和金刚区的区别) 

在电商产品中,导流指的是通过某种形式,增加对商品/功能的曝光,使自己的用户群去购买或了解感兴趣的商品/功能。导流简化流程:导流入口 → 落地页 → 转化率,设计师需要通过在这个流程中收集的数据,进行复盘反思优化设计。

瓷片区常见类型

此片区属于运营区,在页面中通常位于用户容易点击的区域。通常为图文混排,常见的类型有:实物类、插画类。

1. 实物类

应用场景:需要对商品/服务有高曝光度的产品类型,如外卖、电商、旅游类等,通过对自有商品/服务的直观展示,达到吸引用户的目的。

优点:识别度高、适配千人千面、元素更换灵活;

缺点:图片质量要求较高;

瓷片区的作用(瓷片区和金刚区的区别) 

2. 插画类

应用场景:常见于金融类、虚拟类产品。

优点:高度概括主题的图形,通过插画增加产品的调性和趣味性;

缺点:针对性比较强,难复用,花费时间;

瓷片区的作用(瓷片区和金刚区的区别) 

设计关键点

1. 排版

瓷片区常见排版方式:左右排版、上下排版和对角线排版。设计师可以将三种排版方式组合设计,使页面更具有节奏感;

  • 左右排版:图标/插画左右布局,一行展示 1 块或 2 块,适用各种场景;
  • 上下排版:图文上下结构布局,一行至少展示 3 块瓷片,适用于功能入口;
  • 对角线排版:图文呈对角线布局,一行显示两块瓷片,适用于文字信息较多的需求;
瓷片区的作用(瓷片区和金刚区的区别) 

2. 图片

对于电商或商城类产品来说,配图的好坏是影响用户点击率最直观的元素;设计瓷片区时需要考虑全局配图和局部配图的情况:

  • 配图质量:高质量、符合产品调性、背景简洁、抠图边缘一定要干净;
  • 配图规范:统一图片或插图的尺寸和视觉面积;保证图片之间的差异性;提炼关键文案信息。
瓷片区的作用(瓷片区和金刚区的区别) 

3. 文字

  • 主副标题:通过大小、粗细和颜色进行区分,颜色不宜过多;
  • 标签文字:结合需求属性和定位,处理不同层面的标签;
瓷片区的作用(瓷片区和金刚区的区别) 

4. 背景

瓷片区背景常见类型:白色/浅色背景、渐变色背景;设计师根据产品调性及业务需求对背景进行灵活使用,但要遵守以下原则:

  • 层次清晰,是否对最重要的元素有所突出;
  • 易读,保证文本及商品符合所有设备的易读标准;
  • 视觉表现力,强化品牌风格;

小结

文中从四点对此片区进行了一个概括性的了解总结,设计要点的话在排版设计中都是需要注意的基础知识所以未多加赘述,以此为自己在项目中遇到的知识点做一次沉淀。

本文内容由互联网用户自发贡献,该文观点仅代表作者本人。号仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 3252784850@qq.com 举报,一经查实,本站将于三个工作日内删除本文链接:https://www.cawinemall.com/other/8879.html

(0)

相关推荐

  • cad2019许可管理器不起作用或未正确安装的解决办法

      CAD激活完后打开弹出显示安全系统(软件锁许可管理器)不起作用或未正确安装?很多人表示一头雾水,那下面就跟小编一起来解决吧!   1、首先,打开电脑C盘目录。   2、第二,我们要找出隐藏的文件夹ProgramData,选择 工具-文件夹选项。   3、第三,弹出“文件夹选项”对话框,选择“查看”,在高级设置找到并…

    2023年4月11日
    0
  • EXCEL同一列数据同时加减乘除同一个数的实现方法

    在用EXCEL处理数据过程中,有时我们需要对同一列数据进行相同运算,比如同时加、减、乘、除同一个数,如何快速实现这一效果呢?今天小白跟大家分享可以实现这一目的的两种方法: 公式法 在下表的数据中,需将应交数除以10,填入实交列中,用公式法可以快速实现。 步骤:1、单击“实交”列的第一个单元格,输入“=”,然后单击“应交”列的对应单元格,此时该单元格被蚂蚁线环…

    2023年4月13日
    0
  • 排版怎么排(排版怎么排好看)

    继之前教了 PPT 中的各种排版方式以后,很多同学热情高涨,提议多写写排版有关的教程,简直是救加班族于水火。 那么今天来讲讲 Word 中怎么排版。 01 对齐参考线 1. 打开一个空白的 Word,选择菜单栏的“插入”–>“文本框”–> 随便选择一个文本框     默认情况下,移动文本框,页面上不会出…

    2023年4月11日
    0
  • 电脑基础知识(电脑基础知识分享)

    当今时代每个家庭都会有一部或者几部电脑,娱乐工作上课必备。特别是疫情阶段用电脑的频次更多一些,学生老师要上网课,单位有的也要在家办公。 常见家庭用电脑无非两种,一种台式机,(台式机常见又分为组装机和品牌机)。 一种笔记本。其实它们的构造差不多,台式机有主板、CPU、内存、硬盘、电源、机箱、显示器、键盘鼠标组成。而笔记本无非集成化程度比较高些,也是由上述各硬件…

    2023年4月11日
    0
  • 酷家乐如何使用(酷家乐怎么用)

    酷家乐是一款网络在线房屋装修设计平台,我们可以下载软件也可以在线设计,应用方面包括房屋装修,可以说我们掌握了一些设计技巧就也可以给自己的房屋进行理想化的设计了,下面就给大家简单介绍下酷家乐怎么使用。   . . . 首先我们浏览器打开官网,选择登录开始设计。 .   .   . . 登陆后点击开始设计,会弹出一个而选择工具框,我…

    2023年4月11日
    0
  • excel元换算成万元(excel中的数据换算成万元的方法)

    在工作中有时我们会需要将以元为单位的金额显示为千元、万元、百万元、亿等。本文就和大家分享如何使用条件格式将数值以不同单位显示。 一、以千为单位显示数值 如下图所示,将A2:A6以元为单位的金额,显示为C2:C6以千元为单位。   选中A2:A6,按【Ctrl+1】打开【设置单元格格式】对话框,单击【自定义】,在类型框中输入“0,”。如下图所示: &…

    2023年4月13日
    0
  • word文档多余空格键怎么删除(word如何快速删除多余空格)

    工作中我们经常会遇到这样的问题,文档中有太多多余的空格,很影响美观跟阅读。那要怎么才能删除这些空格呢,一个个空格来手动删除是不太实际的,太繁琐了。今天给大家推荐一个快速删除空格的好方法。 图一 操作步骤 复制一个文档中的空格–》全选内容–》快捷键 ctrl+h–>替换–》查找内容:粘贴刚才复制的空格&#8…

    2023年4月13日
    0
  • excel求积(excel求积的方法)

    在 Excel 中求积公式需要使用函数“PRODUCT”,其功能是计算一组数字的乘积。以下是如何使用 PRODUCT 函数的步骤: 打开 Excel 表格并选择需要计算机的单元格。 在选定单元格中输入“=PRODUCT(数字1,数字2,…)”。 将“数字1,数字2,…………….”替换为要…

    2023年4月13日
    0
  • excel保留小数点后一位(公式计算保留几位小数)

    今日我们说一下,如何在Excel表格中利用公式统一保存几位小数。 首先,我们大多数人在使用Excel表格计算公式时,基本都是采取“=单元格*单元格”的方式进行计算,比如下图一:   计算后,结果为保留1位小数,而后我们将鼠标放置在公式计算单元格的右下方,待鼠标指示变为实心黑色十字时,拖动下拉,需要计算的结果就在各个单元格内了,如图二、图三: &nb…

    2023年4月13日
    0
  • 游园不值古诗的意思(游园不值古诗的意思和注释)

    你是否还记得小时候每个新学期拿到新课本时满怀期待地摩挲、翻阅?当我们重新翻阅青少年时期的语文课本,我们重温的不只是课本的内容,更多的是与那些语文名篇初次相遇时内心的触动和惊喜,还有它们对我们人生潜移默化、深入骨髓的影响。 今天我们选取了四首收入小学语文教材的古诗,大家对这些古诗一定耳熟能详,但是当我们拥有了更多的人生阅历,再重新细读文本,会有哪些新的体会呢?…

    2023年4月14日
    0