赞助商
立即赞助

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

Banner设计3年前 (2021)发布 流光
3.7K 0 0

张运位视觉图,其实都代表着个平台视觉品质。不论是犄旮旯,是我们开屏图、首页轮播位。

发现问题

首页头部轮播图要性决定了它视觉品质不能有半疏忽,其复杂程度更是言难尽。不仅有作品宣传,有各类渠合作,有内部设计师输出,有大量 CP 支持,那么统高品质视觉输出更是难上加难。将问题排除,我们花了将近年时优化了 App 首页所有 banner,将其打造很是精美。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

是随着时移,也在不断地生些新问题:

  • 视设计的同质化;
  • 用户审美疲劳;
  • 作的转换率低;
  • 宣传图中文案过少,难以表达出一部作品的。

深入探索

我开始市场几大类运广图进深入研究,有大家所熟知「电商类运广」、「游戏类运广」,再加上我们动漫运广。

1. 电商类广图

品项广图,主要从商品属性出发,再根据品用途、颜色、装等来延展品调性。再到我们执层,按照优先级大致可分为品+文案+背景(以商品为主,文案排版为辅)。

在设计的过程中,版式可千变万,产可根据需要做同的角露及列次序。在大背景色的基础上,可继续根据产的作露适当地调节。在这一系列的操作过程中,一直处于保守态的是中的案,万变离宗,讲究的是案的版样式。再之后的色彩,细节的把控均属分项。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

2. 游戏类运广图

游戏开服可结为场景感版形广图,运图可根据优先级结为:背景+文案+物(以氛围为主)。

背景场景形式来表现,在游戏专题上面更多,因为游戏有场景支持,使分辨率大图,带给户视觉冲击,整体设计格和游戏美术格搭调,氛围感强。游戏强调的是沉浸式体验,在宣传图设计中依旧保持一种情景式体验。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

3. 动漫类运广图

几大类粗略地分析过遍后,落实到我们动漫市场,运广图可结为:背景+文案+物(以内容为主)。

目前大多数设计师对于漫推广图的设计基本按照电商、游戏的套路来走,还自成一体,综合可总结为图:

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

推广图,自然离开推广素材,如图,可看游戏类的推广素材可说是达到登峰极的地步了。电商类的大多是依赖于摄影师的拍摄,及还可靠后期的精修来弥补前面拍摄的足。然而,我们漫可说是残垣断壁。过慢的起步,国大多数的条漫,在人物及氛围营上并达到很的水准,在已定程上给我们的营图设计带来了很大的阻碍,这是漫画行的现状。但是漫画素材有自己的优点,素材中有很多于人物表情的特写,故事场景的描绘,还有人物 Q 版素材,这些东西可很好地打一个故事情境。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

为了打故事情节,我在材上和之前相就有了明显的区别。

会更注重人物表情 、经典章节 、漫画情节、吸引力文案,在这四方面进行挑选,这些都可以作为的选材,尝着另辟新路,去重新审视的选材标准。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

把这种表现法,假为一个概念:「内容植入式运营设计」。

这个视觉风格,融内容对景进行搭建。人物、文字计皆服于内容本身所赋予的义,环环相扣,不再是彼此孤的存在,以达潜移默化的宣传效果。而且,的推广图不仅仅局限于好不好的层面,更多的是把漫画核心内容展现出来。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

以《隐藏人》这部漫画运营推广图为例,了解漫画大致剧情:残缺的面容隐藏在玩偶之中,悲惨的往事隐藏于皮囊之下,夹杂在回忆现实的残酷中,人性最终爆发。似完美犯罪背后的凶是才、恶魔还是隐藏于你身边的「」……主 15 岁以上的少男少,是一部推理悬疑、言情、恐怖、烧脑漫。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

了解背景之后,再回漫画中,围绕的四个选材范围:人物表情、经典章节、漫画情节、足够吸引力的文案背景,在漫画中进行相关的截图,对素材进行筛选。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

将选中的素材,应用组 banner 中,加上字体计。组成现在这张有丰剧情的画面。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

那往期 banner 视觉图计主要由三点构成:背景 、人物 、一句话文案。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

对比一下往期的计图,给用户的第一觉,这是一部性题材的漫画而已。

右这张图,一眼能看到与文案相结合的隐藏人,图中男子惊恐颤抖的表,以及场景中的各种画面。这张图,将漫画中高潮节视觉化,推到用户面。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

可以看出我们之的作图手法中,注重的精,的法注重的故事境。

在里以看出,精美不是 banner 唯一的衡量标准,我开始以打造故内容为核心。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

新版视图设计,主要由 4 点构成:

  • 人表
  • 经典章节
  • 漫画情节
  • 强吸引案,案可为两句可为几句的形式 。

让用户在轮播图短短几秒内获取到更多感情色。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

上图内容与我们功能模块(导航)配合更加融洽,内容故事氛围更加浓厚,在这里,所谓「内容植入运设计」不仅仅括我们 banner 内信息,而容纳了我们 UI 框架内结构信息。

实践论证

案例一

是在 APP 首页二屏的位置,进行小模块试运营新版设计图,原有视图设计主要是品主角加简单的背,以及一句文案构成。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

以《黑良》部漫画运营推图为例,漫画大致剧情:世间流传一种秘术,以让人家糊口,也能富有四,能让人权倾天下,也能让人家破人亡,号为──财术……主打 15 岁以上的少男少女,是一部高效、奋斗、市漫。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

背之,我们回到漫画中,围绕我的四个选材范围,对素材进行筛选。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

组合到画面中,加上部分简单字设计,组合成下面个具有富剧情的宣传图。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

△ 新版视图设计

随着文案剧增,我们更加注排版严谨性,并在小小条内融入了更多文案信息,括作品名、经典文案或知名作者信息,加入与文案相关物、剧情,造更强烈情感。剧增内容信息并没有设计师造成压力,而是有赖优质排版造出和谐新秩序。右边是应用了「内容植入运设计」新版视觉图。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

案例二

接下来是一个正方形的特殊模块,个模块运营的需求就是图要够大,且为不一样而不一样。

潜意识里这样需求目,是放张精美大图而已。是,我们真不样。

我们先来一起分析一原图,眯眼看,版细碎,在之滑类大模,细碎更为明显。除非做到顶通栏,会稍微弥补这个缺陷。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

在技术层面无法实施的前,首先思考的是如何将画面零为整。UI 层面减必要的层级,在容层面,将案与人物素材,做到图结合,再是彼此孤单的存在。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

△ 整个UI框架中的展示效果

在这一次将 「内容植入式运营计」应用在这个模块的计中,用不同的计法融入了更多的息素。在对其进行计之前,除了出于画面的考虑,还思考了后续的灵活应用。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

在《九段》的案例中,主要采用了三角稳定构图,首先使复杂的画面做安静、均衡,并不失灵活性。作品名人物的结,人物置于文案之中,图文有系、有互动。配上右侧的人物介绍,杂而不乱,整个画面清晰有条理,突出重点,亦不失侧重点。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

这张的构图,也和上一张完全不同。主体只有主,且占了画面。这人物的布局斜着把画面一为二,采用了「对角线构图法」,能让本调死板的主体变得有运动。同,趣味中心点也在面部,让容易就被这一双美丽的眼睛所吸引。并且有关人物介绍的融入,在画面中补充排版,人物相辅相成。

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

在上面三个模块的不同案例中,让视觉模块完成了一次升。其实也不难出,有些排版布局的巧好多伙伴也都应用过,可以说这些巧在多地方是可以通用的。计本身没有对错,有的只是适不适。也有不少的巧,值得去深挖。多一些尝,也许就能找适,适当前工作的套路、方法。

总结

从「内容植入式运营计」的探索挖掘过程,这套方案的实施落地,整个过程尝了多做图方式,最终通过后数据显示,只有的「内容植入式运营计」这套方案效果是最为显著的。使运营模块数据都得了大的提升,至少在现阶段是比较适腾讯动漫的一套视觉方案, 在后面的发展中,也是继续做更多的尝,寻求更多的更优的方案。

欢迎关注「TCD设计中心」公众号:

感觉 Banner 千篇一律不想点?腾讯动漫用这个设计让你点爆!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

原型图的设计,是项目经理给甲方提案时,需要展现的能力和专业性。本文主要是为项目经理提供一套方便使用,而且设计统一,视...
App原型
近年来,「设计规范」逐渐被「设计体系」或「设计语言」的概念重塑。基于一套架构严谨、规则统一的体系框架,产品表现层面的...
一致性原则
随着移动互联网的不断发展,「以移动为中心」的理念和战略也不断渗透,互联网的「短、平、快」往往使设计师们无法长时间停下...
App设计
春天来临,马上 2021 年毕业的小朋友就要开始实习、找工作了。 最近看了 100 多份设计方向的简历和作品集后,我明显感觉到现...
作品集
本人比较喜欢研究各种各样的App,下载使用过的应用更是不下900款,但是最终保留的App少之又少,这是为什么呢?通过多次分析得...
产品价值
现在,当你打开 Instagram、Airbnb、Apple Music、Twitter、Dropbox 这些应用的时候,乍一看很难区分清楚彼此的区别:带有圆...
App设计
没有人喜欢失败。那么玩家为什么可以花80%的时间体验挫折,还仍然热爱着游戏呢? ── Jane McGonigal 在之前的文章中,我主要...
Eugen Eşanu
用户测试其实相当于在收集用户对某一个功能,或流程的行为反馈数据以及满意度指标数据,但很多时候你的用户测试是无效的,那...
可用性测试