乐读文学

硬核运营 : 技术流新媒体养成

乐读文学 > 科普学习 > 硬核运营 : 技术流新媒体养成

第15页

书籍名:《硬核运营 : 技术流新媒体养成》    作者:计育韬


出血设定

出血线(Blooding  line)是一种来自出版行业的概念。我们制作一张需要打印的物料如海报,如果在设计软件中贴边开始制作,那么在印刷车间裁切时很可能导致边缘信息被切除。因此,设计师需要在画幅中设置出血线并得到中央的安全区。只要印刷厂工人在出血区进行剪裁,就一定不会影响到画面内容。

出血线的设定被沿用到大多数数字媒体领域中,因为设计师完成的数字设计,都可能被不同型号和尺寸的屏幕裁切。例如移动端,手机厂商设计的手机屏幕分辨率和尺寸各不相同,为了适配不同用户的终端体验,我们就必须设置出血线。

不仅手机屏幕会裁切内容,栅格系统也会裁切内容。此前已经提到运营是戴着“脚铐”的,这对“脚铐”就是栅格系统产生的页面布局结果。在一个要求上传封面图的位置,无论你原本提交何种尺寸,最终平台都只允许固定范围、比例、尺寸的画面被展示出来,因而就必须设置出血线。

所以制作一张封面图后,要确保多个平台流量分发时都达到预期效果,出血设定就必不可少。以微信公众平台封面图为例,对比信息流和列表式,我们需要兼顾两种比例的封面图效果,而裁切主要发生在信息流中(如图2-38所示)。

图2-38  封面图信息流



目前,公众号大封面图是一个2.35∶1  的范围,即在500×900的基础上,实际展示为383×900,所以运营者需要把KV的核心信息压缩到383的高度以内(如图2-39所示)。

不能忽略的是,在分享到会话窗口、朋友圈时,微信依然会抓取封面图的中央区域,因而运营者要进行以下完整的封面图出血线设定(如图2-40所示)。

图2-39  KV的核心信息压缩



图2-40  封面图的出血设定



无论是App内转发还是外转发行为,大多数新媒体平台都会进一步将画面裁切至中央的正方形。因此在调整封面图时,最后还要注意关键信息(比如主视觉、icon、关键字等)保留在画面中央。

而重要的是,公众号的订阅号在非标星情况下,会提供一个1∶1自定义封面图,所以在后台设置时,我们可以不局限于出血设定的思路,异位裁切。这就意味着信息流中的正方形封面图可以根本不是长方形封面图的一部分,而是在它的范围之外另行作图(如图2-41所示)。

图2-41  自定义封面图



色彩设定

所有信息流界面,比如微信订阅号模块、今日头条首页、微博、即刻等,从交互设计角度来说,都在高速滑动的无限界面内,深色区块拥有被触发的相对优势。例如,微信官方的一则推送(如图2-42所示),其醒目程度在滑动时不言而喻。

同样,类似JZ多媒体解决方案的标准也采用黑底封面图,因为偏深色和纯色更加醒目。但是所谓“纯色”不是一个绝对概念,而是一个相对概念,实际上只要拥有纯色连续背景+深色背景/深色前景,都将具有视觉优势。例如某订阅号封面图和JZ订阅号的封面图(如图2-43所示)。

图2-42  深色区块在滑动时的优势



图2-43  纯色封面图vs.非纯色封面图



创意设定

在信息流通过封面图拔得头筹,不仅可以依靠设计学基本原则,还可以采用更有创意的方式,使封面图突破被栅格系统固定的边界。

正如此前将头像由方变圆一样,封面图通过形状的更改可以在遵循标准尺寸的情况下,形成截然不同的视觉效果,裸眼3D式设计就是一个典型例子。

进行裸眼3D封面图设计,首先,要考虑封面图区域外的背景色,将画面中的背景色与之衔接。其次,在封面图内构建虚假边界,再将部分关键元素“突破”边界形成3D感。可参考在瀑布流主页设计中的Instagram上的案例。

大众点评在一个圣诞节呈现的服务号图文专题也是这方面的案例(如图2-44所示)。

图2-44  大众点评的封面创意



这种封面图设计方法应用十分广泛,我们以微信公众平台窗口的设计方法为例,目前订阅号、服务号的会话窗口中都支持应用该方法。

第一种方法是直接进行图像穿透。其要点在于:

·  穿透部分可以单独制造投影;

·  封闭部分两个顶角制作弧度以更好地伪装。

在500px上先任意下载一张可供教学实验用的免费测试图片,比如香烛台的一张仰拍图(如图2-45所示)。

图2-45  挑选设计素材



在*Adobe  *PhotoShop中先设置纯灰色背景,至于具体色值,你可以通过截屏自己的手机并在软件中拾取颜色。不过,由于微信会对任何上传的封面图进行细微的加深处理(RGB各方向增加1~2),而且Android系统压缩又比iOS系统严重得多,所以具体色值可由运营者自行定夺(如图2-46所示)。

图2-46  设置纯灰色背景



置入测试素材调整位置和大小,在你认为合适的位置切片(如图2-47所示)。

图2-47  调整大小并切片



在上方切片添加图层蒙版,细心擦出要做穿透的内容。当然你也可以用插件快速抠图(如图2-48所示)。

图2-48  擦出要穿透的内容



这时再让一部分烟雾穿透出来,通过贴上一份烟雾素材并增加图层样式来实现(如图2-49所示)。

图2-49  增加烟雾穿透



然后根据情况选择性增加投影,别忘了下方的切片用圆角矩形增加一个图层蒙版进行伪装。随后导出.png格式并上传封面图,一张有范儿的穿透式封面图就做好了(如图2-50所示)。

图2-50  穿透式封面



第二种方法,是通过构建伪边框让封面图更有爆发力。其要点在于:

·  图像素材本身应有纵深感,可以是近焦图甚至微焦图;

·  画面主体内容应在正面或15°角范围内;

·  画面的3D部分集中于顶部并且构图可向上延伸;

·  构建伪白框,高度在封面图3/4处。

和穿透式封面图类似,先用灰色打底并预备好一个白框(如图2-51所示)。

图2-51  预备好灰色打底的白框



随后置入素材,分别对白框图层和素材图层增加图层蒙版并擦出需要的部分(如图2-52所示)。

图2-52  增加图层蒙版



基于这两种制作方法,你就能在不同背景中形成诸多图像创意。



卡片



Banner、按钮、模块等一切具备真/伪落地页的视觉模块,在新媒体运营中可以称为卡片。通常,卡片由负责电商、活动的设计师完成并交付给你,你只需要正确上传并指向落地页即可。但是在伪落地页的卡片设计中,它的目的往往在于突破平台制约。

二维码/小程序码卡片

微信公众平台并不支持通过JS按钮的点击在第三方页面或图文中直接关注一个订阅号/服务号,但依然有不少新媒体尝试制作了卡片,引导用户通过长按识别二维码关注。这种卡片效果和目前官方广点通系统投放时的视觉效果比较接近。

以往,我们通过CSS可以将一张透明度为0的二维码引导图通过移动到关注键位置。不过由于微信现已禁止点开有透明度的图像,所以我们采用以下两种方式解决。

二维码隐形法

这种方法涉及一种在图像透明度保持1(完全可见)的情况下依然让你无法察觉的排版策略,需要在一张png图片中:

·  文案内容均为白色;

·  二维码黑色部分镂空。

由于笔者此前已经提到,微信采用的是截屏的二维码扫描模式,因此当二维码进入图片查看状态时,黑色的查看器背景能重新填充镂空部分,被系统“误判”为一个有效二维码。这种新的卡片设计模式,极其适合格调较高的品牌,在不遮挡按钮边框、文字的情况下,你还可以添加更多黑白纹理内容。