首页

一篇文章搞懂毛玻璃拟态

涛涛


设计趋势轮回,玻璃效果以一种新的展现形式回归,我们以往对它的称呼有毛玻璃效果、磨砂效果等,在下文中统称为毛玻璃拟态。

前言


设计趋势总是在不断的变化,近几年拟物风格又以新的形式——新拟态回归大众视野,苹果发布了macOS Big Sur 操作系统,整体风格应用了新拟态的设计思路,采用了3D质感的元素设计,其中还包含了运用阴影、透明度以及背景模糊/高斯模糊手法模仿玻璃形态,构建空间感的新兴拟物态风格——毛玻璃拟态风格。

undefined


一、毛玻璃拟态的历史


毛玻璃视觉其实可以追溯到2007年微软发售的 Windows Vista和Windows7,随之后来的OS X 10.10(Yosemite)和iOS7中大量出现毛玻璃效果,比如底部快捷菜单栏、通知中心和多任务切换窗口等,苹果公司加大了模糊程度,透明效果基于扁平,更顺应当时UI扁平化的设计趋势。


后来,苹果在他们的移动操作系统中大大减少了毛玻璃效果,但是最近在 MacOS Big Sur 中又增加了毛玻璃质感。微软的 Fluent 设计系统也非常注重这一效果,他们称这种效果为 “亚克力”,并将其作为设计系统的组成部分之一。


二、毛玻璃拟态的特征及优缺点


1.毛玻璃拟态的特征

毛玻璃拟态模仿了塑料材质(凹凸质感,凸显层次感),这个新的视觉风格更加注重垂直空间Z轴的使用:

—透明感(使用背景模糊/高斯模糊的磨砂玻璃效果)

—物体漂浮在空间中,通过前后关系表现层次感

—鲜艳的色彩感,更突出了模糊的透明度

—半透明物体边缘的微妙处理,采用细腻的边框来表现玻璃质感

这是注重空间感的典型特征,意味着这种风格有助于用户建立界面的层次结构和深度。用户可以看到物体间的层次关系,哪一层在哪一层之上,就像空间中真实的玻璃一样。


2.毛玻璃拟态的优缺点


优点:

毛玻璃拟态效果之所以被大家应用和认可除了它能带来的优秀视觉表现,更重要的是其本身的功能意义,它能帮助设计师更好的拉开信息层级并达到视觉统一

(1)视觉表达

通过背景毛玻璃化,可以中和扁平化图文带来的生硬不立体。在卡片元素上添加毛玻璃效果,与其他元素叠加后视觉上建立层次感,将信息层级更好的表达出来;在图标中增加毛玻璃效果,可以提升图标通透的质感。

(2)品牌感

良好的视觉统一,有助于提升产品的品牌感。


不足:

毛玻璃拟态效果并不好应用于上线产品。它不适用于按钮或开关(这些重要的界面元素应该具备高对比度,更加清晰明确),模糊效果也要注意分寸,屏幕上过度使用模糊效果,会使整个 UI 对某些用户可阅读性差,同时也会使页面看起来显脏。

也可以这样理解,使用毛玻璃拟态风格的前提是卡片内部有足够的对比度和合适的间距来定义层次结构,并在视觉上 “分组” 所有相关的对象。它可以只在一个元素上使用,也可以作为卡片背景修饰视觉效果,这种很容易达到较好的视觉效果,页面风格也会特别亮眼,整体干净、明亮。


三、毛玻璃拟态的应用


1.卡片背景

用作卡片背景时,能很好的表达信息之间的层级感,朦胧透出下层视觉元素,营造了良好的视觉美感。


2.APP图标

用作APP图标,可以提升图标通透的质感。常见的三种图标案例:A.顶部图形为白色,底部图形为其他色;B.顶部图形和底部图形为同色,顶部图形颜色明度高;C.顶部图形和底部图形不同色


3.界面包装

运用毛玻璃去包装UI界面,页面风格整体干净、明亮,有较好的视觉效果。


四、毛玻璃拟态绘制原理


1.和任何基于卡片的布局一样,物体离我们越近,它吸引的光就越多。在这种情况下,意味着它会更透明一些。

2. 整个效果的基础是阴影、透明度和背景模糊的组合。这种风格可以使用一个透明层,也可以使用多个透明层,但多个透明层叠加在复杂彩色背景上的效果会更好(当至少两个透明层出现在一个相当复杂的彩色背景上时,玻璃形态的效果是最突出的)。


五、毛玻璃拟态-卡片背景的绘制要点


1. 如何设置正确的透明度

重要的是要记住,你不能让整个形状透明,需要调整填充的透明度来达到透明效果。如果不调整填充的透明度,仅仅是调整整个对象的透明度,就不会产生模糊的效果。

在上面的例子中,背景模糊值完全相同,但圆形图像的叠加效果看起来完全不同。当填充不透明度为 100% 时,对象的透明度再低也没有用,根本无法得到想要的模糊效果。


2.如何选择合适的背景

最底层背景在这个效果中扮演着重要的角色。不能太简单或太单调,否则毛玻璃效果就看不出来,但也不能太复杂。

复杂的背景有助于玻璃形态的展现,这可能就是苹果选择了彩色背景作为 MacOS Big Sur 默认壁纸的原因。当模糊的透明层位于背景之上时,那些容易辨别的色调差异也很容易被看到。


六、毛玻璃拟态-图标的简版教程


用作卡片背景绘制操作比较简单,使用背景模糊就可以搞定,重点在于根据实际情况进行透明度和模糊度的调整,这里就不再做展示。


下面是毛玻璃拟态-图标的教程:

第一步:绘制基础图形,顶部图形颜色#DDEDFF,底部图形渐变色#00EDFB——#001EEE

第二步:底部图形复制一层,做高斯模糊效果,高斯模糊:12,不透明度72%,将模糊层置于顶部图形上,添加蒙版

第三步:为了更好的增加图标辨识度,增加渐变描边,渐变色#FFFFFF——#D5E9FF,图标绘制完成。

过程中用到的色值和模糊度可以根据视觉美观度做适当调整,也可为图标增加阴影,提升整体效果。


结束语


作为设计师,我们可以看到,设计趋势一直在变化,每隔几年就会转向另一种风格,但似乎每种风格又有自己的前世今生。所谓趋势轮回,并不只是单纯的回归,而是以一种的更丰富、更立体、更具有层次感的方式呈现在人们面前。

我们要做的就是不盲目,不盲从,看清楚趋势变化的本质。


文章来源:站酷   作者:April_Firefly 

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


第三方支付行业发展已到下半场,产业服务商成为升级方向

涛涛

微信支付、支付宝支付这些常见的支付方式都属于第三方支付,而在互联网发展的下半场,第三方支付会走向何方呢?本文以第三方支付未来发展变迁方向洞察为重点,分析内容主要包括了第三方支付行业发展变迁盘点和第三方支付行业变迁方向预判。

01 第三方支付借势起飞,4.0时代为社会发展提供核心动力

1.0时代:第三方支付开始起步,商业模式单一限制行业发展天花板

1999年,随着首信易支付的成立,我国的第三方支付业务开始正式起步。这一阶段,我国第三方支付行业的监管相对混乱,行业的进入门槛也比较低;第三方支付公司在当时所起的作用仅仅相当于支付通道,商业模式单一,业务增值空间有限。加上该阶段电子商务在我国尚处于市场起步期,消费者对于第三方支付的整体接受程度依旧不高。因此,当时我国第三方支付行业整体的交易规模和增速均不突出,不同第三方支付公司之前的产品同质化问题较为严重,企业之间的竞争较为激烈。一些规模较小、商业模式不清晰的第三方支付公司的业务体量随之开始出现萎缩。

供需两端双向发力,第三方支付交易额快速增长。

供给端,线上交易领域,支付宝在2005年首次提出了“担保交易”的概念。这一概念的提出不仅提高了消费者对第三方支付平台的信任,也进一步拓展了第三方支付公司的业务想象空间。线下交易领域,拉卡拉从2007年开始大力进行线下便民支付点的建设和信用卡还款业务的推广,充分满足居民日常的支付需求;需求端,电商、在线航旅等行业的发展成熟也推动了消费者对于第三方支付的相关需求。在供需两端的双重作用下,2008-2010年,我国第三方支付行业的交易额连续3年增长率超过100%。

2.0时代:牌照正式发放,第三方支付行业进入合规发展阶段

随着行业的发展和成交额的快速攀升,依然处于监管空白期的第三方支付行业开始出现挪用资金、非法套现等一系列的行业问题,监管层也开始逐渐加强对于第三方支付行业的监管。2010年,央行出台《非金融机构支付服务管理办法》,确立了第三方支付相关的配套管理办法和细则;2011年,央行正式开始发放第三方支付牌照,拉卡拉等公司成为首批持牌展业的第三方支付公司,我国的第三方支付行业开始正式进入合规化发展阶段。

支付机构积极响应监管要求,相关企业开始移动支付试点。

为第一时间获得对应的支付资质,众多支付机构积极对监管的要求予以回应,努力满足监管的相关规定。

随着网络的逐渐进步和智能手机的问世,通信运营商、银联等机构纷纷开始进行移动支付的试点,国内的移动支付开始逐渐起步。2011年11月,支付宝正式推出了手机APP二维码支付业务,二维码支付正式在国内亮相。

3.0时代:硬件、场景快速成熟,二维码借自身优势成功上位

伴随着移动互联网的发展和智能手机等硬件的逐渐成熟,打车、外卖、理财、红包转账等手机端的交易场景开始接连出现,居民对于移动支付服务的相关需求开始迅速攀升。各家支付机构也开始加快移动支付相关技术的研发和市场推广。在这一过程中,二维码凭借着自身编码范围广、传播制作成本低、容错率高、识读方便等一系列优势成功上位,逐渐成为市场上最为主流的移动支付方式。

交易规模迅速攀升,支付机构全面拥抱移动互联网。

随着场景、硬件的日趋成熟和居民对移动支付认可度的快速提高,我国移动支付市场的交易规模也迎来了爆发式增长。根据易观分析数据显示,2015至2017年,我国移动支付市场交易规模的增速连续三年超过100%, 2017年的交易规模增速更是达到了208.7% ;交易规模的飞速增长也加速了相关企业的业务布局。拉卡拉、中国银联等支付机构先后推出了自己的智能移动支付产品,积极拥抱移动互联网。

4.0时代:技术、政策、相关企业协同推动产业互联网发展

随着时代的发展和社会的进步,我国的互联网也正逐渐由消费互联网向产业互联网迈进:技术领域,人工智能、云计算、区块链等技术逐渐发展成熟并被落地应用;政策领域,监管层积极出台关于产业互联网、工业互联网等方面的相关支持性政策,大力扶持相关产业的发展;企业层面,拉卡拉、三一重工、海尔等不同类型的企业均开始进行产业互联网、工业互联网等领域的业务布局,准备以全新的姿态迎接新时代的到来。

1)支付在产业互联网时代将逐渐成为商业社会运行基础设施

随着产业互联网的来临,数据对于各个企业的生产、经营和创新都开始发挥越来越重要的作用。在这样的大背景下,支付数据覆盖用户广泛、真实有效、数量庞大的优势开始逐渐体现。支付数据和支付机构开始在商业社会的运行过程中发挥越来越大的价值。支付也逐渐演变成商业社会运行的基础设施。

02 支付机构拓展增值服务业务,转型综合型产业服务商

1. 第三方支付机构开启转型变革之路,积极寻求自身二次增长

高速发展过后,我国的第三方支付行业迎来了发展变革的十字路口:一方面,受到监管政策趋严、成交额基数增大等原因的影响,第三方支付机构传统支付收单业务的增速开始放缓,业务的天花板逐渐开始见顶;另一方面,随着我国数字经济的发展和产业互联网时代的到来,越来越多的企业开始产生一系列金融服务、营销、风控等方面的增值服务需求,企业服务市场的发展潜力开始逐渐凸显。在这样的背景下,越来越多的支付机构开始深挖自身已有数据资源的价值,积极利用人工智能、云计算、大数据等一系列前沿科技进行企业服务业务的拓展,开始进行由单一支付服务商向综合型产业服务商转型的尝试,积极寻求自身的二次增长。

2. B端企业服务与C端用户深度运营成为支付公司两种升级路径

根据易观分析的观察,目前阶段,我国第三方支付机构转型综合型产业服务商的路径主要有两条:一条是以侧重于B端企业或机构的深度服务,努力为合作的B端企业或机构创造更大的价值;另一种则更加偏向C端消费者的深度运营,通过持续拓展服务场景和业务边界来巩固C端消费者与自身产品之间的关系,并为C端用户提供更加丰富的产品服务。

3. 市场竞争、产品研发等问题将成为支付机构转型阻碍

尽管我国的很多第三方支付机构已经开始进行转型综合型产业服务商的努力与尝试,但是其在转型的过程当中也不可避免的会面临来自产品研发、营销推广、外部竞争、市场成熟度不高、数据安全等各种各样潜在的风险与挑战。

  • 更加激烈的市场竞争:大量的软件公司和互联网企业同样也看到了产业互联网和企业服务市场未来巨大的发展潜力,纷纷开始进行对应业务的战略布局,这可能会使得未来企业服务市场的竞争变得更加激烈。
  • 我国企业服务市场商业模式尚不成熟:目前阶段,我国很多公司对企业服务产品的付费意愿依旧不高,这使得我国很多企业服务公司目前仍然没有形成相对成熟的商业模式,很多企业依旧在持续的亏损。支付机构在进行企业服务业务拓展时可能会面临同样的风险。
  • 更高的产品研发和市场推广风险:B端企业服务产品的研发往往要投入大量相关资源。产品开发周期长,开发难度大;市场营销方面,由于企业服务产品的单价往往偏高,而市面上目标企业客户的数量远远少于C端用户,这也就使得B端企业客户的触达和成单难度更大。
  • 更高的数据安全要求:随着各个企业对数据的重视程度不断提高,数据安全的问题也变得越来越重要。私有化部署往往会需要企业付出较高的时间和人力成本,因此如何以合理的成本在保障客户企业的数据安全也成为支付机构需要解决的重要问题之一。

03 新竞争者入局将再次引发移动支付市场争夺

1. 牌照价值凸显,未持牌公司加速抢购支付业务“入场券”

2011年至今,央行共计发放了9批271张支付牌照,但是在2015年3月之后,央行就基本停止了第三方支付牌照的发放。这也就使得后续的公司只能通过收并购的方式来获得相关的支付资质。第三方支付牌照快速成为市面上的稀缺资源。

根据易观分析不完全统计,2012年至今,我国境内共发生了近100起支付牌照交易案例,国美、美团、唯品会、小米、滴滴、字节跳动等众多企业均通过收并购的方式获得了支付业务的“入场券”。

2. 合规、节约开支和底层数据成为企业获取支付牌照主要原因

易观分析认为,未持牌企业积极收购支付牌照主要是出于以下三个方面的考虑:1、确保自己支付收单业务的合规性,规避潜在的合规风险;2、节省下对应的支付通道服务费用,获得对应的备付金利息;3、获得底层的支付数据,方便企业构建更加详细的消费者和商家画像,进行后续的精细化运营和业务拓展。

3. 新竞争者入场将为第三方支付行业带来“鲶鱼效应”

易观分析预测,拼多多、字节跳动等企业的先后入场将会再次引发移动支付机构对于C端市场的争夺;另一方面,更有实力的市场参与者的加入也将对市面上的独立第三方支付公司产生影响:依旧希望继续独立运营的第三方支付公司在未来将进一步加快自己对于场景和产品服务的建设,努力构建起自身的核心竞争力;而难以构建起核心竞争壁垒的第三方支付公司则可能寄希望于其他公司的收并购需求。

04 泛支付公司掀起登陆资本市场热潮,将成为重要构成板块

1. 进入发展成熟期,持牌第三方支付公司逐渐成为资本市场宠儿

随着我国第三方支付行业的发展,我国的持牌第三方支付公司也进入相对成熟的发展阶段,拉卡拉行业头部企业开始逐渐得到资本市场的关注加码。在这样的背景下,我国的持牌第三方支付公司在近几年开始频繁的登陆资本市场。

2. 产业链上下游公司协同受益,资本市场全新板块开始崛起

随着持牌支付机构陆续获得资本市场认可,同样位于支付产业链上的非持牌支付产业服务商和终端厂商也开始逐渐获得资本市场关注,二者与持牌支付机构共同推动泛支付行业逐渐成为资本市场上一个重要的独立板块。

3. 企业融资热度不减,泛支付上市公司未来阵容将继续扩大

除了拉卡拉等已经成功上市的泛支付公司外,收钱吧、PingPong等公司在近几年均获得高额融资;以银联商务为代表的几家持牌支付机构也在积极的谋求上市。可以预见的是,泛支付上市公司的阵容在未来将变得越来越大。

4. 相关公司获得全新发展机遇,行业整体影响力持续提升

对于泛支付板块中的相关公司来说,获得资本市场的青睐将会为公司带来更加充足的市场关注度、资金等相关资源,也可以推动公司的规范化发展。随着头部公司逐渐得到资本认可,越来越多的泛支付公司在将来也会开始尝试登陆资本市场,整个泛支付板块未来在资本市场的影响力和重要性也将不断的得到提高。

泛支付板块公司获得资本市场关注的积极意义

  • 推动企业发展更加规范:企业接触资本市场可以帮助其进一步明晰产权关系,规范纳税行为,完善公司治理,建立更规范的现代企业制度和更完善的激励机制。
  • 帮助公司获得更多资金和资源:获得资本市场的关注可以帮助支付公司更好的利用资本市场进行融资,获得公司发展必须的资金和相关资源。
  • 有效提升企业的品牌价值和市场影响力:成功上市本身就是公司荣誉的象征。此外,上市也可以帮助公司获更多投资机构,研究机构和媒体的关注,帮助自己获得更多的品牌溢价。
  • 有机会实现公司股权的进一步增值:对上市公司来说,自身的表现可以直接反映到股价上,表现良好的公司也更容易获得更高的市场估值,从而帮助自己更好的进行资本运作。提升行业整体的影响力,推动行业整体发展:越来越多的泛支付企业登陆资本市场可以帮助整个板块提升自己在资本市场的影响力;整个行业也可以凭借资本的助力实现进一步的发展。

05 海外市场将成为支付机构增长新引擎

海外市场前景依然广阔,支付机构积极构建全球业务版图。

除了继续关注国内市场的发展外,不少支付公司也已经将自己的目光转移到了海外市场。相关需求方面,随着留学、旅游、购物等海外消费的快速发展,我国居民和商户对跨境收付款的需求增长明显;市场想象空间方面,以东南亚市场为代表的移动互联网和移动支付依然处于快速发展阶段,整个市场依然有着不小的增量空间;从产业成熟度的角度来看,我国移动支付的相关技术和商业模式已经非常成熟,具备进行海外输出的能力和条件。

06 支付公司拓展跨境支付业务的原因

国内消费者和商户跨境收付款需求增长明显:

  • 根据国家统计局和易观分析数据显示,2019年,我国跨境进口电商交易规模、居民因私出境人数及出国留学人数相较去年分别增长15.8%、4.6%和7.2%;
  • 根据易观分析相关数据显示,2020年我国B2C类跨境出口电商通过第三方支付机构的收款规模预计将达到7300亿元人民币,相较2019年将增长24%。

东南亚等海外移动支付市场依然有着不小的增量空间:

  • 根据互联网公开数据显示,到2025年,东南亚的数字支付交易规模将突破1万亿美元大关,2019-2025年的复核增长率将达到10%;
  • 根据互联网公开数据显示,越南移动支付用户数量的增长率从2018年的37%增加到2019年的61%;泰国从19%增加到67%,马来西亚从17%增长到40%;菲律宾从14%增长到45%。

我国移动支付市场发展成熟,具备进行海外输出的能力:

  • 根据CNNIC数据显示,2020年上半年,我国移动支付金额继续稳居全球第一,而这也是我国移动支付交易规模连续三年居全球首位;
  • 以拉卡拉为代表的众多国内支付公司在近些年积极进行跨境支付业务的发展,帮助中国的跨境电商企业快速实现资金结算。

1. 自营与合作成为支付机构“出海”主要模式

目前阶段,我国支付机构拓展海外市场有两种比较主要的业务模式:一种是国内支付机构自己直接进行海外相关业务的展业;另一种更为普遍的则是“出海造船”模式,即通过投资或合作的方式寻找本地的合作伙伴进行技术、商业模式的输出或业务的合作推进。

在主要面向的客户群体方面,在国内C端移动支付市场有明显流量优势的支付企业在海外可能同样倾向于C端钱包账户体系的打造和消费者支付场景的拓展;而以拉卡拉为代表的其他支付机构则把业务发展的重心放在了B端商户上。

2. 支付机构“出海”优化用户支付体验,推动我国跨境贸易发展

易观分析认为,对于进行海外购物的消费者来说,支付机构纷纷“出海”可以进一步优化其跨境支付的体验,更好的保障自身的资金安全;对我国的跨境贸易来说,跨境收付款产品服务的升级可以帮助相关企业减少收付款过程中遇到的问题,推动我国整个跨境贸易的发展和增长;对于拓展跨境支付业务的第三方支付机构来说,跨境支付及相关增值服务可以帮助支付机构寻找到新的业务增长点,实现公司的二次发展。

3. 支付公司拓展跨境支付业务所产生的积极意义

对消费者:可以让更多的消费者在海外通过国内的支付APP进行付款,进一步提高消费者跨境收付款的效率,优化消费者跨境支付的体验,更好的保障消费者的资金安全。

对我国的跨境贸易:跨境收付款及相关增值产品服务的升级可以帮助相关企业减少展业过程中遇到的问题,提高自身生产经营的效率,推动跨境贸易企业以及我国整个跨境贸易行业的发展。

对第三方支付机构自身:跨境支付及相关增值服务更高的利润水平和更大的想象空间将使其成为支付机构下一阶段重要的业务增长引擎,帮助支付机构优化自身收入结构,实现营收和利润的良性增长。

4. 支付机构“走出去”依旧需面临监管、业务本地化等多挑战

尽管“出海”在近两年成为支付行业的热门话题,但是支付机构在境内境外跨境支付业务拓展的过程中依旧可能面临来自多方面的挑战。境外业务拓展方面,海外市场的监管政策、宏观环境、用户偏好、业务合作模式和国内可能都存在着巨大的差异,这些外部因素的变化很可能使得国内支付机构之前积累的很多经验并不能发挥足够的效用;相关人才的不足也对支付机构的业务拓展造成了一定的影响。境内业务拓展方面,相比较于传统的境内支付业务,支付机构对于跨境商户的相关资质审核、交易真实性的验证和可疑交易筛查的难度也都会更大。

文章来源:人人都是产品经理   作者:易观分析

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


2021年中国电商市场的9大趋势预测

涛涛

今年受到新冠疫情的影响,线上电子商务行业飞速发展。直播带货、社区团购等成为新的风口,未来它们还能这么火吗?本文作者从自身工作经验出发,对2021年中国电商市场的趋势进行预测,与你分享。

2020年受新冠疫情影响,线上电子商务行业飞速发展。社区团购,C2M趋势越来越明显,因此预计2021年将是中国电子商务市场充满创新和扩展的一年。各商家将采用新的举措和技术,并希望将业务扩展到低端城市。以下是2021年中国电子商务市场的10大趋势预测。

  1. 直播将成为重要的传播媒介。
  2. 从KOL营销向KOC营销的转变。
  3. 短视频应用程序将继续结合电子商务。
  4. 随着主要电子商务平台启动团购功能,团购将持续增长。
  5. 小程序提供新的购物平台。
  6. 快递运输将更快。
  7. 中国基于数据的消费者到制造商(C2M)模式将推动电子商务的发展。
  8. 垂直电子商务网站将获得吸引力。
  9. 跨境电子商务的格局正在发生变化。

因此:2021年将是中国电子商务市场创新与扩展的一年。

  • 实时流媒体和短视频为零售商和品牌提供了与消费者互动和推广其产品的手段。
  • 新兴购物渠道(包括团购和小程序)将与主导的电子商务平台一起蓬勃发展。
  • 垂直电子商务网站将在2021年实现强劲增长。
  • 零售业中越来越多的技术采用和数据使用将使消费者对制造商(C2M)业务模型的增长以及更快的交付服务成为可能。
  • 跨境电子商务将通过阿里巴巴收购考拉平台进行整合,从而进一步巩固该公司在在线领域的主导地位。

01 直播将成为更加重要的传播媒介

实时流媒体在2020年对消费者的购物行为产生了更大的影响,并将在2021年继续在中国电子商务市场中发挥越来越重要的作用。这种销售媒介类似于电视购物(例如QVC),但在21世纪得到了升级。

直播会话的视频内容实时广播,观众可以通过在线链接在观看视频的同时购买商品。就像QVC上的导购一样,实时流媒体主持人出售各种各样的产品,从服装和化妆品到电子产品和汽车。

购物者被直播吸引的原因有几个:

  • 精选的产品: 直播间主持人会根据粉丝的喜好精心挑选产品,这不仅吸引了观众,而且还提高了转换率。的确,淘宝声称它在2018年的直播中拥有65%的转化率。
  • 种类繁多的产品:通过直播,在美容,时尚和杂货行业中推广各种产品。一些主持人甚至卖电影票和酒店套票。
  • 低廉的价格:淘宝直播主持人经常与品牌合作,向粉丝们分发礼品或产品折扣,直播观众通常对价格更为敏感。
  • 抽奖:抽奖是主持人与观众互动的一种流行方式。例如,著名的中国主要舆论领袖(KOL)李嘉琪(被称为“口红之王”)通常会通过举办比赛来赢得戴森吹风机,iPhone11和小米电视等高价值电子产品,以此来吸引观众参与。
  • 数量有限和限时优惠:直播主持人经常采用快速销售策略,每次销售仅持续很短的时间,可用产品的数量有限。此外,主持人将定期宣布库存余额,以增加观众购买的紧迫感。
  • 克服“选择悖论”:如果向购物者提供了太多选择,他们可能会在购买商品时感到困惑,因此什么也没买。在直播会话期间与消费者互动,以帮助消费者专注于一种产品并更轻松地做出购买决定。

通过这些策略,直播主持人能够吸引大量的购物者。例如,在2019年双十一,李佳琦直播了六个多小时,吸引了3680万观众。

在2019年双十一期间,超过100,000个品牌使用在线直播作为销售方式。在购物狂欢节的第一个小时内,在线直播产生的商品总销量(GMV)超过了去年在线直播的全日总成交量。总体而言,2019年11月11日,GMV达到200亿日元(28.5亿美元),约占阿里巴巴2684亿日元总销售额的7.5%。

02 从KOL营销向KOC营销的转变

关键意见消费者(KOC)是通过视频制作和帖子发布以分享自己产品使用体验感的普通消费者。这种新兴趋势将为品牌商和零售商提供一种新的传播途径,使他们采用有影响力的营销方式,而不是使用KOL。由于包括快手、小红书和抖音在内的一些中国社交应用程序的普及,KOC可以轻松共享其产品评论,从而影响其他购物者的购买决定。

KOC越来越受欢迎的原因之一是:消费者越来越意识到KOL是由品牌赞助来提出产品建议的人,因此他们认为提供的信息不那么可信和真实。另一方面,KOC本身就是日常消费者,他们更能提供公正的产品评论。

KOC越来越受欢迎的部分原因是购物者希望从日常消费者那里寻求建议。例如,新父母在选择母婴产品时会寻求他们的朋友和其他有经验的父母的建议。通过的社交应用,这些购物者现在可以在做出购买决定之前,观看经验丰富的KOC的视频和评论。

实际上,KOC营销是「完美日记」营销计划的关键组成部分之一,该计划已使其成为中国化妆品品牌之一。在公司成立之初,该品牌就开始与KOC进行大规模合作,这使普通消费者觉得该品牌非常受欢迎。

03 短视频应用程序将继续结合电子商务

短视频应用程序已涉足电子商务市场,我们预计这一趋势将在2021年继续。短视频的长度通常为10–20秒,富含了各种各样的内容。据报道,一些用户在短视频应用上日平均花费数小时。借助人工智能技术和算法,鼓励用户根据浏览历史和喜好定制个性化内容,更大提高了用户对短视频的拥护。

短视频行业在中国蓬勃发展,截至2019年,中国的用户数量超过8.2亿。据商业智能提供商QuestMobile称,这一总数同比增长了32%。在中国10个移动互联网用户中,平均有7.2个使用了快手和抖音等短视频应用程序。根据QuestMobile的数据,自2018年以来,用户在这些平台上花费的时间同比增长了8.6%,总计每月超过22个小时。

为了利用这些统计数据和消费者行为模式,短视频应用程序已采取步骤以通过其用户流量获利:

  • 在2019年10月,抖音添加了一项新的功能,称为“营销标签”,该功能为内容分配了标签,以帮助零售商锁定想要搜索产品的消费者。
  • 在2019年11月,TikTok取消了限制,允许所有用户通过平台销售产品。以前,社交应用程序对用户访问电子商务功能的要求为3,000个粉丝。此举可以帮助拥有32亿每日活跃用户的抖音转变为基于短视频的电子商务网站。

04 随着主要电子商务平台启动团购功能,团购将持续增长

到2021年,电商平台将大力发展社区团购,如果消费者大量购买,团购将以大大降低的价格提供产品和服务。这种购物模式对预算有限的购物者特别是二、三线城市的购物者具有吸引力。

  • 自2015年成立以来,拼多多经历了爆炸性的增长。按市值计算,拼多多目前已成为仅次于阿里巴巴,腾讯,美团和京东的第五大互联网公司,截至2020年已超过百度。拼多多的成功在很大程度上应归功于与其团购模式保持一致,消费者与朋友一起购物以确保获得更好的交易。
  • 京东于2018年6月在微信上开始了其团购小程序,并于2019年4月推出了其团购应用程序。苏宁于2018年7月建立了自己的团购应用程序。
  • 阿里巴巴于2010年推出了其快速销售和团购平台聚划算。阿里巴巴的Alipay在2018年3月推出了名为拼购的功能。

这些用户在双十一购物狂欢节中提供了巨大的消费能力:聚划算报告称,有576种产品在前两个小时内收到了超过1000万张订单;京东表示,其40%的新客户来自靖西。而拼多多在11月11日的前16分钟内售出了1000多辆汽车。

对品牌的影响:团购模式将以较低的价格提供给想要扩展到中国低端城市的品牌。这些地区的消费者往往对价格更为敏感,并且可能会寻找便宜货。团购还为零售商提供了清理库存的好机会。

05 小程序提供新的购物平台

小程序可在支付宝,美团和微信等应用程序中运行。他们为品牌提供了一个额外的在线平台来销售其产品,用户无需下载单独的应用程序即可执行类似的功能。

品牌可以使用小程序作为大型电子商务平台的补充,而不是替代。小程序用作辅助销售渠道,可以列出通过快速促销快速销售的需求商品。小程序也可以用作品牌工具——品牌可以创建交互式的视觉程序,以更好地吸引客户并鼓励他们与朋友分享内容。微信小程序现在支持增强现实(AR),它将虚拟图像叠加到物理世界上。这种类型的第一个是阿玛尼的化妆品小程序,该程序允许用户通过用户在手机上使用的自带摄像头来测试不同化妆品的外观,例如各种色调的唇膏。

资料来源:阿玛尼的微信小程序

小程序为希望打入低端市场的品牌提供了优势,购物者可能不愿下载新的应用程序。品牌可以将小程序与团购结合起来,以访问较低线城市的微信用户。

对品牌的影响:由于小程序的容量很轻,因此品牌在此投资进行营销,客户参与和电子商务是一件好事。微信小程序的创造者微信报告说,截至2019年,它已拥有7亿用户,他们每月使用微信小程序42.6次。

06 快递运输将更快

我们预计到2021年,物流提供商将通过升级物流基础设施和增加保税仓库的产能来提供更快的交货速度。这样就可以为更多产品提供当天交货。阿里巴巴的菜鸟计划旨在通过帮助物流公司大规模部署物联网(IoT)解决方案来数字化并加速整个交付过程。菜鸟计划在2020年至2022年之间将1亿台智能设备连接到其IoT技术,包括其仓库,交付机器人和算法支持的管理系统。

菜鸟还将通过最后一公里送货业务“菜鸟邮局”建立10万个中转站,以增加送货选择。菜鸟邮局提供定期送货,智能储物柜和送货上门取件等服务。

通过采用5G技术,物流提供商将能够提供更,更快的交付。京东物流于2019年北京开设了首个由5G供电的智能物流园区,并使用一代的连接性对叉车的位置和路线进行实时监控,并提供异常预警情况。

对品牌的影响:新技术将推动中国交付的进一步加速。品牌和零售商可以利用诸如智能路由之类的工具,该工具使用机器学习算法来优化交付路线,从而提高交付效率。

07 中国基于数据的消费者到制造商(C2M)模式将推动电商的发展。

中国的消费者对制造商(C2M)模式将成为电子商务发展的新动力,帮助企业更好地满足消费者的需求并实现销售增长。

在C2M模式中,工厂变得以消费者为中心。零售商和制造商从客户那里收集数据,并使用大数据创建客户资料,分析消费特征并计划生产。这有助于制造商预测产品需求并减少库存和供应链风险,这也使品牌商和零售商受益。

在2019年的光棍节购物节期间,天猫用户抢购了1.70亿个C2M产品。一家公司报告说,电动牙刷的销量在11月11日达到了25,000。罗曼利用天猫的消费者见识来影响牙刷的设计,例如牙刷头的尺寸和牙刷的颜色等。

C2M模型还与中国对产品个性化需求的增长相吻合,中国由80年代后的消费者(1980-1989年出生的人)和90年代后的消费者(1990-1999年出生的人)主导。C2M模式将允许制造商和零售商根据消费者的需求生产产品。

品牌影响:根据中国研究公司艾瑞咨询的数据,中国的C2M市场在2018年达到175亿日元(25亿美元),预计到2022年将达到420亿日元(60亿美元),复合年增长率为24.4%。据Statista估计,这相当于2018年中国电子商务总销售额的0.4%和2022年中国电子商务总销售额的0.6%。品牌可以使用C2M模型更好地满足消费者需求,并提高整个供应链的效率。

08 垂直电子商务网站将获得吸引力

垂直市场是电子商务平台,在该平台上,商品和服务被出售给特定的客户群,他们可以通过在线社区相互联系。我们预计此类网站将在2021年蓬勃发展。Babytree(专注于母婴产品)和Gegejia(面向女性市场的全球食品进口商)等网站和应用都是成功的垂直市场的例子。

  • 垂直平台自然将志趣相投的消费者捆绑在一起,并形成了围绕特定行业或产品的强大社交社区。例如,对于父母和婴儿市场Babytree,平台上的用户共享婴儿产品的育儿技巧和建议。
  • 垂直平台提供了更好的内容,可以帮助用户做出购买决定。根据麦肯锡(Mckinsey)在2019年的一项调查,中国三分之二的消费者使用他们从垂直网站收集的信息来影响他们的购买决定。

对品牌的影响:随着消费者对其购买选择的了解越来越复杂,我们希望垂直的电商站点能够吸引人们的注意力,不仅提供产品知识,而且还提供志趣相投的客户可以进行交互的社区。品牌可以与这些平台一起有效地将其产品定位到适当的消费者基础。

09 跨境电子商务的格局正在发生变化

我们预计跨境电商的格局将在2020年得到巩固。阿里巴巴于2019年9月收购了中国当时最大的跨境电商平台考拉,并将其整合到天猫。然后,阿里巴巴将占中国跨境电商市场的50%以上:根据研究公司iMedia Research的数据,网易考拉在2019年上半年占据了27.7%的市场份额,而阿里巴巴的天猫全球市场则占据了25.1%的份额。

这项收购将增加阿里巴巴接触需要跨境购买商品的中国购物者的机会。这也将帮助该公司实现天猫的商业模式多样化,该模式主要涉及邀请外国品牌在其网站上开设在线商店——考拉通常直接从外国商人那里大量购买各种商品,然后再转售给中国消费者。首席执行官Daniel Zhang表示,阿里巴巴对考拉的收购将通过阿里巴巴整个生态系统的协同效应,进一步提升该公司为中国消费者提供的进口服务和体验。

10 2021电商市场趋势总结

实时流媒体将在2021年的电子商务中扮演更重要的角色,因为它使品牌和零售商可以实时向消费者推销产品,并为消费者提供限时折扣的优势。

电商的格局将变得更加多样化,短视频平台和小程序将持续开展直播带货,为零售商提供诸如AR之类的技术,以进一步与潜在客户互动。电商大厂将继续投资,以扩大产品范围,例如阿里巴巴收购中国跨境电子商务平台考拉,并利用技术为消费者提供更无缝的购物体验(例如,使用5G连接简化交付流程)。

基于关系的营销方法将在2021年激增:垂直市场为购物社区提供参与机会。团购将以相对较低的成本提供产品,从而成为零售商吸引来自中国二线城市消费者的一种有效方法。


文章来源:人人都是产品经理   作者:阿木木

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


解读2021年9种UI/UX设计趋势

前端达人

还有半个月,我们就要跟2020年说再见了~~ 世界每一天都在按照它的意志变化着,每年也都在影响着设计趋势的走向,今天我们就花点时间来讨论一下,2021年可能会出现的UI/UX的设计趋势。      



undefined



 1. 3D


3D设计将有很大可能继续延续,成为2021年的设计趋势,广泛应用于UI、网站、角色、以及动画设计中。



UI设计



图标设计



角色设计




产品细节展示





2. 玻璃拟态


在说到Glassmorphism(玻璃拟态)之前,我们先来回忆一下另一种拟态:


在2019年底,设计圈突然刮起一阵新拟态风(Neumorphism),最初是乌克兰设计师Alexander Plyuto在Dribbble

发布的一张设计作品,引发大家的激烈讨论和争相模仿。



新拟态(Neumorphism)的出现,为当时已经流行很久的扁平化设计开辟了一种新的表现形式,很多人猜测和议论,此风格会不会接替「扁平化设计」成为新的设计主流。


从美学价值上来说,新拟态(Neumorphism)足够现代、看起来也颇具有时尚感、科技感也很足。


不过随着时间的发展,设计师们渐渐发现,在实际的应用上,新拟物化本身确实不能算是一种系统全面的设计风格,因为在很多具体的设计上,新拟态比较难以保证可用性和易用性,在层次的表达上,也有很多局限。




以IOS14和Mac OS Big Sur操作系统发布为标志,一种新的拟物风格正在悄悄流行。



Glassmorphism


这种把阴影、透明度以及模糊的背景结合到一起的设计思路,使界面呈现出介于玻璃和塑料板之间的质感,被Michal Malewicz称为Glassmorphism(玻璃拟态),对比之前火爆一时的Neumorphism(新拟态),这种新趋势更加垂直。


这种垂直性让用户可以通过它看到底层的元素,用户可以确定界面的层次结构和深度。他们可以识别出哪一层在哪一层之上,就像虚拟玻璃一样。



玻璃拟态的设计有几个特点:


· 透明度(使用背景模糊的磨砂玻璃效果)

· 类似于物体漂浮在太空中的多层方法

· 背景上鲜艳的色彩突出了模糊的透明度

· 半透明物体上的细微浅色边框





这种隔着一层玻璃的质感,呈现出一种独特的「虚实结合」的美感




毛玻璃风格ICON


值得一提的是,玻璃拟态与「 macOS Big Sur 和 iOS 14 」在视觉美学上也保持着高度的一致,尤其是在系统的设计美学逻辑上是统一的。


相比于看起来高级但是炫技多于实用性的「新拟态」,「玻璃拟物化」这种风格在各大操作系统的实行和验证之下,实用性更强,视觉美感上也得到目前的操作系统的验证。


不过作为善变的人类,我们很容易就会对流行的趋势感到厌倦,所以每隔几年就会流行到另一种不同的风格。扁平化的风格已经流行了很长一段时间了,或许现在又会慢慢向色彩更丰富、更立体、更炫丽的风格回归了。




附上那个引领新拟态风格的乌克兰设计师Alexander Plyuto 的作品






3. 真实的照片


插图和3D并不一定适合所有人,有时候真人和真实的物品会对用户产生更大的吸引力,让他们更加感同身受。




网站主页



华硕(ASUS)官网




制作美食



航空公司




4. 多彩的颜色搭配


许多设计都使用了多色搭配,使得自己的设计呈现出神奇、空灵、包罗万象的感觉,而且,鲜艳的色彩更容易区分和让人记住。




图标的多色搭配





时尚移动应用




色彩应用



Ins的图标改版



5. 模糊的彩色背景


使用模糊彩色背景的设计看起来有种特别的温暖和热情。












6. 极简主义


极简主义本身是一种设计理念,应用到UI或者平面设计领域当中的时候,可以理解为:设计中的每一个元素都应该是有用的,它简单,干净,漂亮,且实用。极简主义的设计易于用户理解,参与度也高。




大量的留白






元素规整、有条理和秩序




扁平化的元素




简化配色





可读性较高的字体


极简主义的好用之处在于它凸显关键,为用户呈现最重要的东西,并且让用户关注最重要的事情。






7.几何结构


越来越多的设计呈现整合、规整、有秩序的视觉结构,使用户增加使用和观看的乐趣。



视觉设计的平面几何





空间几何





平面设计



8. 野蛮主义


「野蛮主义」一词,最早出现于1950年,由瑞典建筑师汉斯·阿斯普隆德用以描述乌普萨拉一座名为「Villa Göth」的现代砖房。



顾名思义,野蛮主义的特征十分「简单粗暴」,通常都由不断重复的元素拼接而成,以笔直的线条和锋利的棱角居多。对于大型建筑物而言要么追求奇形怪状,要么追求严格对称,落成的建筑外墙多为毫无修饰的砖块和混凝土,整体看起来异常冰冷和沉重。


而在数字设计中衍生的的「野蛮主义」是一种故意试图显得原始、随意、无装饰的样式。刻意的不设计使这些网站几乎没有美感甚至显得有些简陋。


尽管很少有人将这种设计风格归类为漂亮,但它对于某些内容类型确实具有独特的表达魅力。而且具有鲜明大胆的风格。



 

野蛮主义设计风格短期内应该不会深入到UI设计中去,更多的会在网站,或者杂志的设计运用此种设计思想。





9. 简化UI/UX流程


此处说的简化,不是指视觉效果的简化。设计流程做的太复杂,不论对于用户或者是设计师都是不利的。


优秀的设计师会兼顾美学和实操效果,把流程简化到减无可减,给用户以丝滑流畅的体验效果。






2021年,设计将变得更多元、更新颖,不同风格也会相互碰撞,新技术也被应用在设计中。我们作为设计师,要更好的理解和跟上新趋势的发展,扩大自己知识的范围,例如设计美学和心理学知识等,就可以知道设计趋势如此流行的原因和源头。在此基础上利用好新知识和新工具,为更好的服务大众时刻准备着。

文献:Diana Malewicz (UX Collective)  素材来源dribbble,侵权删 




今天先跟大家分享到这里,谢谢观看~ 

转自:站酷

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


Pantone 2021年双流行色重磅发布:灰+亮丽黄

涛涛

今天早上,权威色彩机构 Pantone 公布了2021年度双流行色:灰+亮丽黄。

这是继2016年水晶粉+宁静蓝之后,第二次推出组合年度色,寓意光明,传递力量与希望。

灰+亮丽黄这两个独立的色彩,联手打造出梦寐以求的色彩组合,像是自然风化的岩石上浮起的日出,带来了一种更深层的体贴和踏实感,同时也表现了对未来充满希望的乐观精神。

这正是经历过艰难的2020年后,世界所需要的。

PANTONE 17-5104 Ultimate Gray是海滩上的鹅卵石和自然元素的颜色,其风化的外观彰显了经得起时间考验的能力,象征着坚实而可靠,体现了恒久不渝的感觉。

PANTONE 13-0647 Illuminating则是充满活力的明亮欢快黄色,是充满阳光的温暖黄色阴影。

灰与亮丽黄的双流行色组合,突显不同的元素如何互相支持,寓意着阳光和友善,凝聚了更深程度的体贴感。

这个色彩组合实用又稳固,温暖又乐观,为我们带来韧性和希望。

Jil Sander Pre-Fall 2021

当人们期望寻求能量来强化自己,克服持续的不确定感时,坚实可靠而又热情洋溢的色调,恰好能够满足我们对生命力的追求。

在过去几年里,潘通的选择充满了社会意义,被看作是对全球情绪的捕捉。

而在经历了记忆中最黯淡的一年之后,2021年的组合色旨在以坚韧的精神基底传递积极和幸福即将到来的讯息,给人们带来希望,让人感到一切都将变得更加光明。

Prada 2021SS

持久耐看的灰和生动活泼的亮丽黄,联手表达出我们所需要的坚韧的正向态度。

这种力量与正向的结合,是一种结合了洞察力、创新和直觉,以及对智慧和经验尊重的颜色。

它启发了重生的能力,推动我们前进,迈向新的思考方式与新观念,最能代表 Pantone 2021年度代表色的精神。

针对这组双流行色,Pantone 还推出了5种不同的官方配色系列,表现灰和亮丽黄的多功能性,以帮助大家更好地理解和应用。

AVIARY 鸟舍

【鸟舍】是生动活泼,令人愉悦的色彩组合,有着异想天开的独特性和极强的爆发力。

持久耐看的灰带来属于大自然基本元素的颜色,温暖乐观、充满活力的亮丽黄为色彩组合注入更多能量,高雅的云端舞者白则为系列注入戏剧感。

ENLIGHTENMENT 启蒙

【启蒙】是一个面对未来、年轻的色彩故事,唤起一个催眠的空间,将我们的心灵延伸到另一个界域,激发出我们重新开始想象的渴望。

灰与亮丽黄的配比,融合了智慧、经验以及我们想要前进,迈向新的思考方式与发掘新的深刻见解的渴望。

与此同时,银金属色的铅水晶则增添一丝闪烁的月夜光泽。

INTRIGUE 魅惑

【魅惑】是一个迷人的色彩百汇,拥抱各种影响因素的大融合。一方面流露奇特又强烈的个人主义风格,同时又显示一种大众化的吸引力。

其四季皆宜的持久性,在加入稳定可靠的 P灰与象征阳光的亮丽黄之后被突显出来。

ORBITAL 轨道

【轨道】反映了探索星际旅行的狂热,是在令人着迷的外太空星系中发现的闪烁着金属色调的调色板,能让人联想到遥远的星系。

SUN AND SHADOW 光影

【太阳与阴影】是一种永恒而无性别的色彩组合,描述着我们周围的原始之美。灰和亮丽黄为大地色系注入更多的希望和力量,将今年的双色年度色的特殊韵味发挥到。

除了这五组配色之外,Pantone 还推出了一系列灰+亮丽黄的色彩营销案例。

色彩营销案例

可以预见,在接下来的一年里,我们会更多地看到这些色彩,因为它们意味着对时代精神的内在定义,传达着消费者的期望与态度。

现在,咱们就先来康康这组能够引起全球共鸣色彩的无限可能吧!

时尚领域

Agatha Ruiz de la 2021SS

Prada 2021SS

Alice + Olivia 2021SS

友善、愉悦又乐观的亮丽黄,是一种年轻个性的色彩,明媚肆意,预示着阳光灿烂的一天即将到来,让人忍不住想要亲近。

把亮丽黄带入服饰中,可以给整个造型增加一种明亮感。

Alexander Mcqeen 2021SS

Brandon Maxwell 2021SS

灰有着洗净铅华的淡然与不争,它游离于所有颜色的边缘,却能与任何色彩作搭配。彰显着低调内敛的品质感和恰到好处的高级感。

Prada 2021SS

将灰与亮丽黄相结合,给低调耐看的灰加入一些明亮感,可以带来一种另类吸引力,传达出阳光与力量的讯息。

除了服饰之外,灰和亮丽黄还经常出现在围巾、鞋履、包袋、披肩等配饰上,产生一种夺目的搭配效果。

美妆领域

灰与亮丽黄是热色调与冷色调的混搭,运用在美妆领域可以营造戏剧化的风格。

家居装饰领域

灰与亮丽黄的组合,非常适合用来为家里任意一个房间的气氛定调,增添一丝阳光与正面的气息。

黄色往往作为家具家居上的提亮高光色,而灰色则会被设计成基底色,常出现在水泥家具或地板中的颜色。

将亮丽黄与灰并用在桌布、床单及家饰品包括枕头与桌上摆饰会带来生机与活力。

以灰做为扎实的基础,衬托吸引注意、强化直觉、活泼的亮丽黄,是位于家中或商业空间的任何办公室最理想的色彩组合,点亮通往开放心灵,寻找追求知识的欲望、原创力及丰富智谋的路径。

把大门涂上亮丽黄色,并在外侧加工时用上稳固可靠的灰,可以传达着温暖欢迎的讯息。

包装设计领域

将拥有最高可见度与反光度的亮丽黄搭配坚韧的灰,不论出现在何处都能引起注目。

结合友善的亮丽黄与默默令人安心的灰,应用在装置设计上,为可靠、智慧与经验的扎实基础,注入一股活力。

文章来源:腾讯网   作者:浪设计

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

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

周周

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

一觉醒来,2020 年潘通年度色就这么发布了。

2020年年度潘通色:「经典蓝」

这款被命名为为「经典蓝」(Classic Blue)的色彩沉稳耐看,隽永优雅,按照潘通官方的说法,「经典蓝」仿佛暮色四合时的天空,宁神静心,让人驻足。「经典蓝」是一种稳固可靠的色彩,给人确信感,抚慰着每一个期待稳定者的心灵。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

为什么会选择这样一种蓝色,潘通色彩研究所的执行董事 Leatrice Eiseman 在潘通官网上,予以详细的解释。

解读「经典蓝」

「我们生活在一个亟需信念和信任的时代。潘通 19-4052 经典蓝 ,这种色彩正是自信和恒久的外化体现,这种坚实可靠的蓝色调,更能与人产生深层的共鸣,令人心安。一望无际的蓝色能够唤起人类对于广袤无垠夜空的无限遐想,经典蓝鼓励着我们透过显而易见的事实,拓展思维,放飞想象。

经典蓝敦促着我们更加深入地思考,开阔视野,进行更加深入的交流。」

——Leatrice Eiseman 潘通色彩研究所执行董事

从色彩心理学的角度上来看,蓝色色相本身有着信任、信念的含义,也是的色相。在此之前,潘通曾经多次选择蓝色作为年度色, 2000 年的时候选择天蓝色(Cerulean),在 2005 年的时候则选择了蓝绿色(Blue Turquoise),2008 年的年度色叫鸢尾蓝(Blue Iris),2016 年的年度色则是静谧蓝(Serenity)。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

相比于这4种蓝色,「经典蓝」更为沉静稳重,没有一点攻击性,也不显得沉重,轻松而易于互动。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

「经典蓝」无疑是一个略显保守,但是非常贴合当下语境的色彩。它充满了确信感,让人觉得安全,屏蔽了焦虑。同 2019 年充满前进感的「活力珊瑚橙」相比,「经典蓝」更加内敛和笃定,悄无声息地增加每一个的信心。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

除了发布这一年度色彩之外,潘通色彩研究所还专门制定了5套配色方案,这些配色方案应该会在接下来的 2020 年,得到更加广泛的应用。

「经典蓝」的5套官方配色方案

沉思

这是一套舒缓的配色方案,凉爽的蓝色调和同样柔和的暖色组合到一起,给人以沉静的感觉。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

呼吸

这套名为呼吸的配色方案当中,加入了更为经典的黑白色,选择了对比更加强烈、更加富有活力的搭配方式。这样的色彩搭配更容易唤起观者的幸福感,让你的设计更加具有田园牧歌的气息。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

沙漠暮色

「经典蓝」的灵感来源之一就是夜幕降临时的天空。而这套名为沙漠暮色的配色方案,就与此相关。充满金属质感的潘通色更能够凸显「沙漠」的闪亮质感,而恰为对比色的「经典蓝」让这套配色方案优雅无比。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

异域风情

这套配色方案比起之前的配色更加丰富,更显混搭,仿佛加入了天然的调味料。这种健康而自我的色彩搭配方式,让人仿佛身在异域,不同于此地的文化,迥异与此时的感觉,独特却令人着迷。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

非传统

打破常规的桎梏,选择异乎寻常的色彩搭配,而足够传统的「经典蓝」恰恰构成了这种搭配方式当中,作为基础的底色。这套配色方案指向时尚,突破规则,如同小品,有趣而俏皮。

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

「经典蓝」的9套精选配色方案

为了更加方便线上的设计师来使用这些配色方案,优设的小编从官方提供的这些配色方案当中,精心挑选了 9 套适合进行数字设计的配色方案,并且标注上了相应的 HEX 值便于精准取色,请尽情取用:

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)

2020潘通年度流行色 「经典蓝」新鲜出炉!(附配色方案)


文章来源:优设网        推荐:陈子木


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

政务可视化设计经验-页面视觉-下

周周



三、规划页面构图

讲到设计初期的页面构图规划问题,其实这个构图是服从你的展示方式的,即故事线。设计前期规划阶段,先想好打算怎么表达,再选择对应的构图方式。表达上我们讲究总分主次关系 ,那么构图上依旧遵循这个规则,先具体再抽象。


(一)全屏平铺式

全屏平铺式的构图方式是最常见的一种构图方式,如下图无意中构成横平竖直的辅助线将内容一格一格展现出来,界线清晰分割明确。因此模块之内的内容就会显得格外的清楚和突出,给人一目了然的感觉。注意哦,平铺并不代表完全一个一个格子码好,比如下图中的深红色区域,没有被网格框住但也码的很清楚,浅红色区域中有一对一的也有一对二的对应关系,故此类型的构图中加上这些灵活的变化就会显得没那么生硬。并且这种构图方式是遵循F型网页阅读习惯的,因此重要内容放哪大家知道了吧~


(二)中心放射式

圆形就是一个典型的中心放射式,圆是有圆心的,通过构造不同大小的同心圆起到聚焦、凸显作用。伴随一个一个同心圆自然而然形成放射线,把重要表述放中间,其他表述按照放射线编排起来。引导用户的视线聚集在我们重点突出的功能点上,先主后次,有起有落。


(三)视线引导式

视线引导式主要是依靠点线面的关系形成一条清晰的视觉引导线,引导用户的视线,避免杂乱无章的堆砌。视线流动的轨迹多则是从上至下从左到右移动,故在大屏上从左到右,从主到次,减小用户的负担和阅读疲劳。如下图是我同事做的一张大屏,指标琐碎,每个指标与指标间没有太强的相关性。当时发现大方向上有一定的前后关系,故最后用这种方式把数据串起来。设计稿上需要把样式给全,看上去有点碎,实际开发后效果还是蛮不错。


(四)水平罗列式

水平罗列式的构图方式有点像全屏平铺式,同样是利用人从左至右的阅读习惯。如下图,不一样的是四个大类有明显的前后关系,并且彼此之间存在对比。利用无形之中形成的水平线条把内容串在一起,将同级且对比的意思表达出来。


(五)三角排列式

三角排列式的构图方式,核心思想就是一个稳!从上至下的三角构图,能把信息层级罗列得更为规整和明确。这张大屏是我做的某地数字驾驶舱中的一个分页,用来总览这个分支的三个内容,每块内容上面是政策解读下面是数据结果,清晰明确。


四、营造页面氛围

页面的氛围个人主要认为是通过恰到好处的细节堆砌出来,这些细节要自然合适不突兀,讲究一个“巧”字。对于我来说这些细节就好像欧亨利小说的结局一样,意料之外又在情理之中。不过讲道理这些氛围的东西并没有很明显的一定之规,有些方法在这个场景下合适在那个场景下就不合适了,需要设计师在做的时候不断尝试,也是一个缘分。


抄现实是我们在设计中最直接的也是最常用的一种表达方式,它的含义就是提取现实中存在事物的点线面关系。因此往往在发散思维中找到与主题相关的灵感点后,用方式提取其中的内容后,能紧密的结合主题。它将抽象的主题通过实体表达出来,并以之作为内容信息的载体,能够合适的存在于页面之中。这个纬度的内容我直接举几个案例描述下。


(一)案例-公安项目中的细节

公安的项目是我同事做的,在用户那边得到了一致的好评,并且也是团队前期重点研究的一个DEMO。这个项目好在业务逻辑清晰,并且在表达方式上做到合理合适的程度。如下是项目其中一张大屏的一处细节,需求是需要排列公安系统中处置人员的不同分布,在大屏中也是核心区域。


一般在页面核心区域我们会花点心思将这块的内容做充实做饱和,毕竟第一眼需要留下好印象。设计的时候提取了警徽的基础形状、警徽的构成、胸徽的线条排布、旌旗的基础形状、放射线的构图方式,然后将文案排布形成设计结果。最后客户这边对于这块内容直接过稿,认为设计环节带出了警队的特色,给了高度的评价。


(二)案例-驾驶舱项目中的细节

驾驶舱的项目是我直接参与主导的,当时这个项目的欢迎屏风格稿做了好几版本的,用户一直都不认可。过程中去除主观因素,总结用户对于驾驶舱的认知和理解。客户的需求是驾驶舱需要在“驾驶”的时候,眼中不光有舱内的内涵,也要有舱外的风景。如下是欢迎屏的基础状态(交互操作并未展开),设计的时候提取了汽车仪表盘的基础形状和风格组成、星光点与点的关系、逆光山体风景的天空渐变,然后组合在一起形成设计结果。最后客户这边看到后过稿,这个设计也留到了项目最后。


(三)案例-大佬作品山海经中的细节

如下的作品是behance上一个大佬的作品,作品的名字叫做山海经,我们也是经常拿出来学习参考。在人物设定中,作者将古代的乌纱帽、官服、官徽纹样等内容融入角色的道化服之中,并且角色周边环境中大量融入一些官府的元素,比如官兵举得牌子、衙门的建筑体等。整个作品虽然融入大量的古代元素,但是用赛博朋克的方式表达出来,成品没有一丝违和感。确实给了大家一个方向,原来国风的东西可以这么玩。


总结

1.使用足够并且容易区分层级的颜色去构造页面。数据可视化的项目往往信息的量级是不可控的,准备工作需要做充分。

2.合适的字体能让你的页面事半功倍。挑选字体得对比,确保不同的使用场景下有一致性的显示。条件允许下,针对自身业务场景打造对应的显示字体(羡慕脸.jpg)

3.好的构图可以让表达更上一个台阶。根据故事线的讲述,挑选对应的构图方式,做到从总到分、有主有次。

4.氛围彰显作品的细腻程度。细节决定成败,在作品中增添“巧”的细节,会让观赏者更加投入获取信息的节奏中。



文章来源:tob.design        作者:王亮亮同学


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


政务可视化设计经验-页面视觉-上

周周

前言

从入行到如今的这些年中,眼中的设计风格不断变化。伴随这些年行业的兴起,从最早的拟物风到现在的内容当道,越来越多的设计师参与其中,为行业贡献着自己的理解。但也发现同质化的现象越趋明显,个人认为这里面有设计师本身的问题,也有行业风气的问题。同质化的现象有很多的组成因素,可能是页面视觉是直接的拿来主义,亦可能是脱离不了舒适圈的习惯为之。


我很担心的一件事情就是我们一味的反对同质化的假,最后会演变成另外一种假。是一味的摈弃,还是部分的接纳。这是一个界限的问题,而这个界限我还没想明白。如今风格太现成,都像麦当劳一样,思想的麦当劳,短暂的吃下去了,饱了,不去想了。这个惯性思维很可怕,最可怕的是可能有段时间自身都意识不到这个问题。


那么如何跳出这个惯性思维?我这边借用冯小刚导演在十三邀里说的一段话来解释。创作过程太正常很多时候是经验在发挥作用,每次都和自己的经验作斗争,最后可能会出现一个在经验之外又让自己激动的东西。简而言之就是革了自己的命。可能哪天我想明白这个问题,会再写一章如何创新来讲这个问题。


那么本章主要讲我们是如何在前期定义一张大屏的风格?主要可以从几个方面来讲:配色、字体、构图、氛围。


一、定义页面配色

定义大屏配色的前提是对于用户的政务有着充分的调研,明白是主管哪个行业的,分别用对应的色系去定调子。


举个例子,生物医药、环保等行业通常选用能表达健康安全的绿色;公安、教育、政府等通常选用能表达科技未来的蓝色;消费业、服务业等行业通常选用能表达热闹、朝气的暖色调。


它们有个共性就是主色调不管倾向于哪个颜色,背景通常是对应颜色的暗色系。因为可视化大屏使用环境通常是在室内、展厅等这种外部环境比较暗的地方,避免对于观赏者视觉上的不适应。而且这也有帮助观赏者对于数据的聚焦比对的工作,暗色调的背景加上高亮的配色,也容易在界面中将层次做出来,这点特别适用与3D城市的构建,以后我们会讲述如何在城市中做出层次对比的方法。





色彩心理学普遍还是适用于可视化大屏的,颜色对于人意识的倾向性还是比较强烈的。但是需要明确的是在数据可视化领域中,有些配色规则并不适用。在传统UI设计中我们一般会拟订主色辅色特殊状态色,甚至在灰阶会把标题、正文、背景的颜色区分做全。这样做的好处就组件一致性,给人统一的感觉。数据可视化一般会定一个主基调,围绕这个主基调会用至少5-6中以上的调色板进行设计。


(一)使用足够并且容易区分层级的颜色种类


假设我们需要做一个政务的可视化系统,在设计初期敲定了以靛蓝(H:200)为主色调的设定。那么我们会寻找在这个颜色周边的邻近色去做这个靛蓝色调的搭配,比如在青(H:180)和深蓝(H:220),使得整个大面积的色彩整体上过渡会比较自然。通过对纯度S和明度B的调节,我们可以找到很多色调用于数字、文字、点线面等视觉元素。然后在靛蓝色调的对比色上去寻找用于高亮的展示,比如绿(H:120)这类的,起到强化主色调的层级作用。最后找到靛蓝色的互补色左右的红(H:10)和黄(H:45)用于重点强调内容。主色调的互补色需要少量并且珍惜的使用,需要有但不是大面积得使用。


色彩是为了突出内容的重要信息,请有选择、有策略的使用颜色,切勿滥用。配色没有绝对的好坏,只有在当前场景下是否适合,色环理论只能大致告诉你一些配色的方式,最重要的是靠设计师自己眼睛去感受颜色带来的冲击力。上述的配色方式仅仅是我们工作的一个惯用方式,不同项目敲定的内容也不同,请灵活使用。


当然我们在这边提及的色调并不是一个确定的值,而是围绕选定颜色周边的一个色域。可能在文字或者数字上会沿用传统UI的规则,保持特定的统一。但是在点线面、配饰、特殊状态的触发等元素上使用这些色域去提高整个界面的层次和细节,使得画面没有那么硬,各个板块之间是有舒服得过渡。这里的色域以前是需要自己将色调于黑白二色融合的渐变中选取不同位置的颜色组成色板,如今AntDesign的轮子比较友好,填入主色就可以对应生成有层级的颜色。



我们上述的配色方案是有倾向观赏展示型的,由于用户使用大屏普遍都是汇报展览并且用户样本容量小。故在表达的过程中大量借鉴了运营设计的方式方法,因此配色方式存在包容性不够的现象,对于色盲色弱的人群是有障碍的。比如青色、蓝色、紫色在色域展开的过程中,选取其中几个颜色做叠加色板样式时,灰色模式下存在颜色拉不开的现象。可能是“蓝色”是对色障人群最友好的颜色,AntV保留MPC叠加色板,但同时在使用建议中也写明推荐使用MOB叠加色板。



在数据可视化领域中,还需要界定清楚你做的是偏向观赏展示型的还是偏向实战分析型。这两者的区别主要在观赏性的数据可视化往往需要大量的视觉语言去烘托气氛、用辅助性的元素去增强观赏的趣味。实战分析型的主要是需要消除不必要的视觉杂音、强化传达的力度。因此这就是一个尺度的问题,是偏向品牌创意的手法多一点,还是偏向传统UI的手法多一点,君可自决~


(二)反面案例解析

以下的案例是我自己工作中犯的错误,拿出来共勉(捂脸233333)。做的时候由于可视化的经验并不是很多,在选用颜色的过程中并没有把颜色的层级拉的特别开,导致长时间观赏容易产生识别不清的问题,进一步讲有可能在比对数据过程中产生认知障碍。回首一看,中央的核心区插画的比重大于数据本身要表达的内容,出现了喧宾夺主的情况。这也是一些设计师容易犯的错误,需要再次明确所有的手法和表达方式都是服从一个原则,即清晰有效地传达与沟通信息。



设想一下,一个充满数据的界面本身就是会伴随视觉疲劳的。人是有惰性的,会自然的抗拒一些不清晰不明确的展现方式。数据可视化在我们理解中就是通过设计师清晰有效地传达与沟通信息,使人有能力抗拒自己的惰性去从枯燥的数据中分析出超额信息。


二、挑选页面字体

数据可视化和大量数字打交道,选对数字的字体挺重要的。涉及到字体版权的问题请自行解决,在推荐字体之前有两件事情需要注意下:


第一、文字习惯左对齐,数字习惯右对齐。文字左对齐是人一般从左至右阅读,数字右对齐能够快速识别数据量的大小,容易与其他数据比对。因此在选用数字字体的时候,尽量使用字间距相同的字体(比如Lato字体和DIN字体,注意PS中比对的时候需要选择度量标准,使用视觉的字间距会有问题),这样比对数据的时候字间距相同更容易产生比对结果。



第二、选用数字字体的时候需要检查下常用字符是否有缺失、是否显示正常。比如钱币的符号“¥”和“$”以及“%”。还有就是“1”和“7”、“0”和“O”这两个需要能够清晰识别。(国外的很多字体是没有人民币的符号的,DIN的0和O并不是特别好识别,故很多公司会自己改良字体满足自身业务的要求)



我们最长使用的就是思源黑体、思源宋体,开源并且字体库全。缺点就是比较中性,在数字上辨识度不是很友好,因此我们在数字上最常使用的就是DIN字体。DIN 是德国标准协会,Deutsches Institut für Normung 的首字母缩写。1975年起,德国政府把DIN作为国家标准体系,DIN 标准在国际和欧洲范围内被广泛使用。DIN 字体继承了严谨可识别度高,被广泛运用。


DIN也是有缺陷的,支付宝设计师SKY在专栏里也讲过4的开头较大,以及5,6字体的圆形不够一致,7缩小后识别度问题,所以很多公司都会基于这些问题进行二次设计,比如微信钱包、京东金融、百度金融都在一些地方对DIN字体进行了微调后使用。


接下来我们直接推荐几个有风格的英文和数字字体给大家(私货环节!):


(一)英文字体

1.Futura

Futura这个字体是我自己特别喜欢的一个字体,字体表现很现代,看上去特别利落,继承了包豪斯的设计理念。


2.Optima

Optima也是我个人比较心水的一款,字体充满人文主义。字体本身严格遵循了黄金分割原则,比例优美,字里行间充满了变化。

3.Garamond

Garamond简直就是衬线体之中的典范,就这么说吧,经典的设计中一定会出现他的身影。


4.Bodoni

Bodoni被誉为“现代主义风格最完美的体现”。字体粗细对比强烈,给人浪漫的感觉。


5.Didot

Didot和Bodoni很相似,都是给人浪漫的感觉,不同的是Didot在数字上面做了不一样的处理,两者在电商上使用都蛮多的,一般用做价格显示。


(二)数字字体

1.DIN

DIN被德国人视为“国民字体”,有着悠久的历史。德国的路标和路牌的标准字体就是DIN。其中的4这个设计挺有个性和特点的,容易辩识出来。除了前面说的问题,真的是精准的徳国工艺阿(dog脸~)

2.lcdD

lcdD是常见的电子表数字的字体风格,更加端正鲜明的视觉效果,运用在数字提示等内容上,倾斜风的设计让字体更有自己的独特魅力。


3.Lato

Lato就是那种非常现代科技感的一款,并且具备了很多常用自己的特点,属于那种用了不会出错的字体。


4.Avanti

Avanti和DIN在字形上是很相似的,但是它的字形更加饱满。差异主要在3、5、8这三个数字以及G、Q都做了不一样的处理,上半部较小而下半部较大,多了一些变化和趣味性。这个字体还有一个细体,一粗一细,灵活使用。


5.Tensans

Tensans和Avanti也很相似,如5和8上下部分的比例,6和9的转折以及中圈部分都挺相似的,有点像Avanti字体的加粗版本。但是Tensans特征更加明显,比如2、3、4、7的转角尖锐,切角锋利,具有很浓重的现代工业气息,比较适合速度、刚猛、游戏等主题的设计。


6.Impact

Impact这个字体第一感觉就是厚重醒目,视觉冲击力很强。特粗的笔画、紧缩的间距以及狭窄的中宫,特别适合大标题和醒目的价格展示。


7.BebasNeue

字体字面比较秀长,笔画流畅,简约大方。适用于化妆品、服装等女性向。


8.Niagara-Solid

和上面哪个BebasNeue是有点相像的,字面细瘦,挺拔优美。多了一些衬线体的字重和体势的变化,设计感与装饰感更强,尤为时尚,在女性、文化、时尚类中用的格外多。


9.Gaoel

Gaoel有着Avanti的韵味,但是更加年轻、圆润,令人惊喜的是大写的字母有着统一的特点,特别未来。不过需要注意的是该款没有小写,小写就直接变成如下样子。整体字体设计很圆润,年轻化,可爱非常适合一些偏年轻化的产品,同时字重非常适合金融产品的字重效果!


10.Proxima Nova

Proxima Nova的style还是比较多的,我个人用的比较多还是在它的细体上做修改,比较纤细现代。


11.Gotham

Gotham号称发布会字体,特别现代干净的一款字体,这些年看到的较多是手机发布会的海报设计,纤细的字体压在海报上很有力量。


12.Expansiva

Expansiva也是特别有个性的一款字体,用于做数字的也比较多,目前看到的可视化设计中存在,但是使用量并不多,由于字形骨骼的因素,用于数字上比较多。


文章来源:tob.design        作者:王亮亮同学


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

政务可视化设计经验——故事线

周周

前言

故事线,即故事框架,在前面的系列有略微提到过,毕竟如何串起信息点以及页面的构图方式是服务于故事线的。在我们服务用户的过程中,发现有些项目的表述方式是重复的。那重复的原因是啥呢?简单的想了下这些问题,不难发现用户吸收信息的方式和业务逻辑大致是相似的,所以我们在做项目的过程拿到用户给出的需求后想出的解决办法中也是具有一定的相似性。


解决办法中的表述方式是单独存在的,是对应不同的业务场景,我们想要的是将故事线的方法论总结下来,毕竟思想是永恒的。专门用一章讲一下我们总结的方法论是因为这些故事线本身是抽象的,具有高度的总结性,能够适用于大多业务,也方便新人设计师在做需求的时候有一定之规可以参考。


一、发现现象-提炼问题-问题分析-解决问题

发现现象-提炼问题-问题分析-解决问题这条故事线,是我自己写文章的时候想出来的,确实故事线最早的体现就是工作报告之中。这个可算是黄金故事线,百分之八九十都能套进去。因此适用面特别广,我们经常使用这条故事线来讲民生问题,特别在脱贫攻坚的专题中用的较多。那么就围绕脱贫攻坚专题来讲一下怎么铺开这条故事线。


以茶农的故事作为切入点,我们发现实际的场景是这样的。A地的茶叶产业链较完整 ,B地是A地的帮扶对象,但是B地的经济民生一直不温不火的状态。从大数据的角度,通过监控B地产业链的指标不难发现其实是有文章可以做的,简单来论述下主要是以下四块内容。


发现现象:B地移植了A地的茶叶产业做法,本以为能大力提升B地经济 ,但是从B地的GDP、产业增加值、人均可支配收入并没得到明显持久性提升。

提炼问题:通过监控B地的茶叶市场调研数据,不难发现B地的市场和A地的高度重合。B地的经济不温不火应该是做法全盘照抄A地,并未形成自身特色,在市场上未拉开差距,一直以低廉利润来维持销量,产生不了其他高额的产品附加值。

问题分析:通过分析B地的茶叶市场调研数据,发现在其他纬度上B地的茶叶产业市场并没有拓展。比如A地深耕多年在销售渠道上,建立了产业全国销售网,从数据上分析上表示祖国东南板块基本被A地垄断,但是其他板块并没有全部渗透,B地是否可以向那些板块进军。诸如此类的问题都可以从数据层面分析出来。

解决问题:当核心问题被提出分析后,得到一些改良意见。那么未来的产业运转以这些意见为参考,建立起合适的监控指标,用来佐证这些改良意见是否具有成效。



这条故事性适用性广,挺多问题都能放进去。但是需要明确一件事,每一步的对应指标需要有代表性,不然说明不了问题,还有上面的故事线是如何铺开的仅仅作为解释。


二、宏观-中观-微观

宏观-中观-微观这条故事线,是我在做经济项目的过程之中挖掘出来的。当时在做项目的时候主要还是从宏观和微观两个角度去论述,通过化繁为简、以小见大来表达我们的想法。最后通过总结整理后,发现加上一个中观纬度会更加顺畅和饱满。这条故事线适用于不同领域至上而下的政策传导和政府关怀的信息串联。


就拿这个经济项目为例子讲一下这条线怎么铺开。当时拿到的需求是客户想通过数据看下十三五规划后一个变化,怎么去响应中央的号召,怎么通过解读工作将政策和人民群众建立起桥梁,怎么将人民群众落到实处。其实这就是一个从宏观到微观过程,换句话说就是方向-工作-成果。通过归类提炼信息点,我们不难发现可以将信息分成三块内容。


宏观:中央经济会议的主基调、国家层面的重大项目、国家统计局颁布的监测重点指标;

中观:省委或者地方上是怎么解读政策的,并且针对自身特点增添了什么内容;

微观:人民群众的生活变化——物价的监控指标、人均收入的监控指标、生活质量的监控指标;



分清楚这些后就用设计语言一步一步的表述下去,形成从上到下的一整套解释。顺便提一嘴,需要在横向上做上数据比对分析。这样纵向有业务,横向有数据,整条线才算饱满。


三、基础-工具-落地-成果

基础-工具-落地-成果这条故事线,是我同事在和警察叔叔斗智斗勇好几个月后积累出来的,经过我们不断实践总结出这条故事线。这条故事线是从大量的业务逻辑中提取的,环节和环节之间并不是完全独立,是互补互存的,描述的过程中需要4个环节同时存在才能为最后形成的结论产生背书。这条故事线适用于描述自有业务的从无到有的演变过程,体现自身在对应领域的耕耘。


那么就拿我同事这段不堪回首的往事来解释这条故事线是怎么铺开的(dog脸~)。当时的需求是这样的,我们的客户即警察叔叔需要向外界介绍他们工作成果(向保护我们安全的警察叔叔致以最高的敬意!)。我们抽调了很多相关的历史重大事件的破案历程来诠释警察叔叔的辛苦,但是警察叔叔们均不满意。他们认为还是太片面了,并没有将大局讲清楚。反复和客户沟通最终确认了业务,因此有了这条故事线的雏形。简单来论述下主要是以下四块内容。


基础:公安存档的犯罪记录库与人脸识别前端设备相结合产生大量的预警,在库内形成预警日志;

工具:简单来说同一类犯罪,比如赌博经常出现在某个片区,通过建立模型可以知道大致动向。那么不同的规则不同的对象可以建立不同的模型,即犯罪模型就是工具;

落地:把模型推广用出去,使用模型进行分析。比如多位赌博人员被捕捉到经常出现在大屏上某个特定的片区,多地协调开始侦办该犯罪活动。

成果:将缴获赃款、犯罪人员、案件细节反补入基础库中,形成业务上的闭环。



这条故事线需要将自身想表达的业务嵌入这四个环节之中,并且从头至尾必须同时存在,缺少哪个环节最终的闭环无法形成。多地业务反馈,形成良好的闭环是优势互补、避免资源浪费的最好体现。


四、核心-纬度1/纬度2/...纬度N

核心-纬度1/纬度2/...纬度N这条故事线,是在做西湖项目的时候发现的。主要的做法就是以一个核心为内容,分不同的纬度去诠释这个核心的价值。在表达方式算是总-分的概念,可能最后在从分的地方再绕回来。相比其他的故事线,这比较“面”。将一个大问题分割成几个小问题,一块一块去介绍。这条故事线适用于核心内容比较宽泛,涉及业务领域较多的主体单位。


简单介绍下这个项目用来解释这条故事线是在怎么铺开的。西湖的项目是一个大结合体,是西湖管委会关于自身治理的一个成果展示。由于管辖的区域中存在较多不同领域的内容,故此采用这种方式论述。主要是以下五块内容。


核心:西湖景区主要是旅游产业,对应的核心是景区游玩人数(即公园年卡办理数、收费景点入园人数)。那么围绕这个核心就有挺多纬度是可以影响的,最后确定下来的是五个纬度。

纬度1:治景。监控实施客流,以及分景点监控其客流量和停车服务,实现动态分析拥挤程度;

纬度2:治业。监控与西湖相关的产业和企业的状态值,掌握周边合作企业的发展状态;

纬度3:治安。辖区内以网格为单位,监控网格内治安事件的状态,比如综合治理、市场监管等事件的发生数;

纬度4:治水。西湖大面积是水,因此监控西湖的水质水量也是重要的一环;

纬度5:治山。监控西湖的山体内基础资源的布设,是便民利民的体现,也是管理成果之一;



形象的解释就是核心是块大饼,不同的纬度就是去分这块大饼。最终的目的是让受众更好的了解故事,因此分大饼的时候请不要过于深入展开某个纬度,各个纬度偏向均衡介绍。避免过于陷入某个纬度导致宏观核心不可观。


五、起初-然后-接着-最终

起初-然后-接着-最终这条故事线是按照用户行为沉淀出来的,一般人在介绍自己经历的事情的往往也是用这样的格式。其实这个故事线我们也是偶尔在需要点题的内容上做分析诠释,拿出来讲只是想多个内容多个探讨的资源。这条故事线适用于具体案例一步一步按照节奏讲述的场景。


那我们拿一个用户满意度的流程来解释这条故事线是在怎么铺开的。这个用户满意度的项目是分析市民来窗口办理业务的效率以及情绪,从宏观层面统计辖区内所有网点窗口的业务办理效率。需要我们将市民来窗口办理业务的整个流程清楚细致的剖析,通过对业务流程的观察,我们利用这条故事线大致分了以下四步。


起初:排队取号阶段。分析目前所有网点窗口排队取号的拥挤程度(取号量和等待人数)

然后:业务办理阶段。分析目前所有网点窗口业务办理的速度效率(办结量、过号量、办理时长)

接着:现场评价阶段。分析目前所有网点窗口现场及时反馈的情况(数量、满意率、网点排名)

最终:回访评价阶段。分析目前所有网点窗口业务办理的质量(是否最多跑一次、回访评价)



按照节奏讲述具体案例有个需要明确的是,信息的接收方会随着介绍陷入具体的场景,这时候当讲完后绕回来辅以几个总结性指标来概括整个场景,会更加适合信息传达。


总结

以上五条故事线均是从表达中抽离出来的,它和视觉手法等都是为信息传达服务的,目标都是为了受众更好的接受信息。故事线本身是抽象的,需要多使用在业务上才会熟悉。上述讲述的这五条,其实大家细心点会发现并不是完全独立,存在换套说辞就可以融在一起的情况。我们自己在使用的过程中也是多条一起讲问题,衡量的标准就是把故事讲清楚。


文章来源:tob.design        作者:王亮亮同学


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

政务可视化设计经验——思考方式

周周

引子

说起大数据这个领域,可是近些年相当炙手可热的产业,而伴随这个产业提供了很多就业机会。党和国家大力推进政府数字化转型,我们也受益于这波浪潮并在其中得到了成长。我们主要是作为第三方企业帮助政府推动数字化转型,在这个过程中承担数据可视化设计的环节。大数据时代下,党政机关的数据量也是庞大且复杂的,我们的用户也需要新的技术去面对日常工作,对于设计而言是一个颇有挑战的课题。

 

写本系列的初衷是想把工作过程中的一定之规总结沉淀下来,坦诚的讲我们也是站在前人的肩膀向前。比如我们的后台数字化解决办法中融合了蚂蚁金服AntDesign的精神和阿里云对于体验的标准化反馈机制,并且针对自身业务在某些纬度上做了倾向性的调整和变化。

 

在此多说一句,我们很荣幸站在这个时代的浪潮上去观赏中国崛起的史诗画卷,但是我们也时刻保持着冷静和客观。我们很钦佩那些将比较成熟的东西标准化,拉高整个行业的体验基准线的团队。标准化一定是一件需要全行业一起推动的事情,在此献上我们的一些总结和思考。

 

前言

与传统的数据可视化设计体系相比较,由于我们的用户是党政机关、事业单位,因此更有倾向性的选择和探索。长时间的观察用户,发现外界普遍存在夸大事实的宣传和固执己见的成见。对于LOGO又大又红的需求,其实有绝大多数是沟通存在了障碍。

 

在我们为用户服务过程中,存在经常加班和反复改稿的现象,在一定程度上造成资源浪费。作为B端的设计师,冷静的复盘项目过程,排除其中的主观因素,客观的分析现象。认为问题可能是很多同事无论在业务理解和前期规划都有一定的障碍和不适之处,不能和用户达成目标的一致性。发生这样的问题是因为组内大部分设计师C端的思维并未完全过渡到B端,在工作中没有凝炼自己的方法论。故此,写本系列是奔着将我们过去总结的方法论给到新人设计师,为了更好的融入工作,减少试错成本。

 

一、明确用户的痛点-用户想要关注的内容

要搞清楚这个问题,首先我们需要解释下什么是数据可视化。

 

什么是数据可视化?

数据可视化主要旨在借助于图形化手段,清晰有效地传达与沟通信息。但是别轻易认为是简单的将数据转换成图表,而是以数据为视角,看待世界。换句话讲就是用一些方式方法将以数据为内容的信息直观清晰的展现在用户面前,帮助用户了解真实的世界,明白数据背后隐含的变化规律。

 

那么问题来了,用户需要看的是什么?

 

举个例子:有的时候我们给党政机关做可视化大屏的时候,用户在宏观角度下并没有明确表达需要展现的内容,往往这个过程中我们需要挖掘用户的心态。一千个人眼中有一千个哈姆雷特,每位来视察的领导对于看到的内容都有不一样的诠释。通过经验判断,有些常用的内容是有价值的,比如GDP增速、一产二产三产的产业增加值等。这边我不是说让大家都去码这些指标,这种拿来主义我们从来不倡导。我们是想让大家明白,用以上的指标是因为这些内容是地方官员工作成果和工作成绩的体现,这些指标是通过大量计算的一个结果值,是反应政绩的一种量化指标。以往汇报的时候,讲诉的时间并不长,因此要抓住机会讲结果。

 

 

因此,用户关注的不是数据项,数据项是过程的产物,真正的关注点是最终处理后的信息。

 

知道用户关注哪些内容后,就冒出一个问题,让用户怎么看!简而言之,你怎么去码这些关注的内容。在政务系统长期的建设下,我们对用户的数据有多庞大是有所了解。哪怕归集数据的主体是一个小的部门,定义其工作性质的就有几百个指标。你需要理解用户是长期在哪种环境下的,收到的信息是以什么样的方式传递的。

 

举个例子:你注意下我们这篇文章的主次关系,有没有发现是按照大标题-标题-中标题-小标题-正文的方式叙述的。有空看下政府的红头文件或者当地的报刊杂志,都是按照规范的行文方式传递信息的。那么用户长期在这样的环境,就会依赖这种方式去接受信息。

 

 

当你发现一个页面承载过多信息,建议先将信息分类梳理,逐步细化。

将信息结构化,用写文章写书那样的方式将信息传达,建议使用总-分或者总-分-总的方式。当你这样还不能梳理清楚,可以借鉴扉页-目录-章节等方式去表达。

 

二、归类提炼故事化-有组织有节奏的表达内容

有的时候,缘分就是那么巧妙。我们的自我要求和用户的诉求趋于同步,一个故事讲的好不好直接关系着一群人的工作成果。这里的故事化换句话说,就是框架。正所谓大道至简,信息传播最牛逼的就是把一个特别复杂的内容用最朴素近人的语言总结,比如独立之精神,自由之思想。

 

(一)归类提炼信息点

我们以一个案例来剖析如何有组织有节奏的表达内容,以下是有关于经济的内容,仅供参考。

 

首先,先拆解经济的信息点,信息本身是有层级有关系的。单独存在的信息点没有比较,是无法从侧面反应客观规律的。为了我们尽量少的产生纰漏,先开始逐层拆分。我们明确信息点有哪些,根据上一节的内容,我们获知信息点取决于用户需求,而传播信息点又受传播媒介影响,即表达目的。总结而言,就是用户想看什么和你想让用户看什么?这个地方需要仔细想想,不然起步就错了。

 

在经济大屏中领导一般关心的是工作成果和工作成绩。

 

 

当确定这两个内容的时候我们继续细化拆分信息点。当前这两大类是很笼统,不具备结论性。我们需要继续拆分信息点,直到可以对这两大类提供结论。此时我们的惯用方法就是用宏观-微观作为拆分依据,如下:

 

 

(二)梳理串联故事化

故事化的作用就是将信息点有组织有节奏的表达出来,零散的信息点毫无意义的。换句话说就是用框架的形式清晰完整的表达内容。好的故事是有主有次,主能概括、次能点题。

 

主要故事线:用户接受度高,能够概括整个屏幕的内容,快速了解页面概况或者特别关注的重要信息。

次要故事线:对主要故事线起到解释补充的作用,能够全面阐述页面信息或者点题的作用。

 

那么这边就清楚了,主要故事线就是宏观内容,次要故事线就是微观内容。解释下,次要并不是说不重要。像这边的微观内容代表的就是地方上的信息,需要存在但不是全面展开,它是宏观的基础土壤,往往我们在介绍的时候是用来点题,以小见大的。

 

 

(三)关联绑定数据

最早我们就说用户关注的不是数据项,数据项是过程的产物,真正的关注点是最终处理后的信息。我们诉求的信息点是从用户想看什么和你想让用户看什么中挖掘出来的,需要有数据背书。即数据关联信息点。

 

 

总结

1.明确用户关心的内容是重中之重,它决定起调的方向。有的时候陷入项目之中,往往是关注项目细节忽略了大局观,所以经常低头做事也需要抬起头看看路。

2.按照用户习惯的方式去梳理信息点,减小使用成本。用户长时间沉浸在有条理有层次的环境中,因此灌输信息的方式也要依循这个节奏。

3.归类提炼信息点,用故事去串联信息,用数据背书信息。有条有理的去表达我们的想法,能够让人更好的接受并且理解。


文章来源:tob.design        作者:王亮亮同学


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

日历

链接

个人资料

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

存档