三连竞价推广B面向广告商进行效果广告投放平台

我们满足基础投放需求一款工具到现在越来越意识到保持克制的视觉设计对于业务的重要性

因此,团队希望通过本次的品牌升级,能够从视觉识别、产品体验用户心智多个维度来传递品牌核心价值,同时遵从高效稳定、内容至上、品质细腻产品设计理念,形成一套完整统一的设计语言

 

1.品牌

蓝色天空基本色视作自然可靠专业信赖象征广告投放B产品我们常常遇到需要大量信息针对核心操作元素进行场景因此我们亟需一种更具【穿透力】品牌

我们绿色辅助色位次提升首位平台增添一丝平衡生机同时依旧保留旧版色彩方案其他5辅助平台多维度信息展示足够色彩冗余

2.品牌LOGO

LOGO迭代升级我们继承三连LOGO鲁洛克斯三角形播放器文化同时基于三连平台稳定可靠、值得信赖平台特征引入进行图形表达

保障B特色投放平台我们经过多轮激烈讨论最终还是保留B站品牌同时避免三连LOGO差异太大导致辨识度问题

字体采用粗细较为一致笔画进行勾勒设计大部分转折圆角进行处理使饱满简约,曲线优美具备亲和力

3.平台页面

3.1.全局框架

页面背景:
剔除无意义设计元素同时加深背景颜色从而纯白色内容面板突出

顶部导航:
更聪明细腻的顶部导航!
创编页面向上滚动自动向上隐藏更多屏幕空间创编进行信息展示
页面滚动随即立即唤醒承接可能跳转操作

侧边导航

重新定义侧边导航取消背景所有图标进行视觉重构层面增加贝塞尔曲线约束使得页面体验更加丝滑细腻

3.2.平台首页(建设中)

主要是进行视觉收敛去掉五颜六色账户图标重点突出业务内容账户总览核心数据进行版面融合同时数据指标数量进行扩容

image.png

3.3.沉浸式创编

1、剔除侧边步骤背景用户有限注意力聚焦创编面板

2、弱化图标多余设计元素利用更具穿透力进行图标风格收敛内容至上

3、创意卡片封面卡片100%用于内容展示多余操作悬浮隐藏卡片

4.数据可视化

数据可视化基于品牌色进行视觉上的优化能够数据更容易理解图形形式表现出来

折线图

用平滑的曲线代替折线,适用于横轴为连续类别(如时间)且注重变化趋势、预测;主要用于报表页面以及首页,其中包括单色折线图、双色折线图以及双色多维度折线图

柱状图

系统使用柱形显示维度的数值。横轴显示分类维度,纵轴显示相应的值其中包括单色柱状图双色柱状图以及堆叠柱状图新版堆叠柱状图使用的是邻近色对比,先对于老版颜色交汇处没有那么的突兀

环形图

环图与饼图基本功能类似,用于比较整体和部分的关系,每个弧形切片表示整体中的一个分类。基于无障碍设计原则使用颜色需要有明度对比主要单色环形图多色环形图

区域分布图:

此类型的图标主要是可视化的方法显示地理区域上的数据

5.图标风格

主要归结三大类别侧边栏图标、内容图标以及特殊类图标

内容图标

内容图标升级之后主要单色毛玻璃形式展现为了更好凸显内容使页面看上去干净简洁

侧边栏图标

特殊图标

特殊内容类以推广目的为例未选中状态下弱化图标,突出文字内容,减少对用户阅读的干扰 选中之后则可稍微强化一点效果,可以让用户比较明确的知道自己选中的内容