案例：这么有品牌感的启动页设计你考试测验过吗？

启动页面，用户打开一个产品第一个看到的页面。

它可以作为品牌传播的主要载体，比如淘宝、支付宝的闪屏每每除了通报品牌外还可以成为一个品牌广告的资源位带来商业代价，本日我们来分享下启动页的一些方向！

一、什么是启动页?

启动页是用户对付品牌感知的最直不雅观感想熏染，也是对付先容产品内容给用户的最佳领域，在UI设计中，它是用户打开APP的初始页面，在启动页的标题和副标题Slogan都是融于品牌调性和APP先容一个很好的地方，这里你可以想象成一个舞台。

正如前面所说做这类设计有一个很核心的原则便是表示品牌感，而不是刷设计存在感。

二、启动页的构造1. 承载注册登录

这种类型很奥妙的把功能和品牌很好的结合了在一起，在很多新的APP须要用户注册登录的界面里面，常日会把产品和注册登录结合在一起，常见海内有微信等等。

这个页面的启动页把登录和闪屏画面进行高下构造，上面启动页的品牌画面，采取比较常用的图标平铺风格模式，每个图标和业务明确领悟，看似大略但是实在设计细节很多，最早期手淘也是采取类似设计手腕来设计。

这个页面也是高下构造，在顶部利用的背景图片添补，下面是注册和登录入口，也是一个实用性设计。

这个产品背景没有做更多的装饰，看似大略的一个页面，实在设计细节把握很到位，页面构造采取层叠式构图设计，构造上利用斜切的设计手腕，很好的突出了差异性在里面，同时核心登录按钮清晰，直接勾引用户进行操作。

steller的设计，也是在布局上利用斜切版式，对付背景的选择则是采取的图片加彩色蒙版的设计趋势，整体设计很通透。

lonut Zamfr用的是深色，LOGO为图形结合注册登录页面，在通报品牌同时也很好的将功能结合起来。

2. 新功能勾引

这一类型的启动页面，适用于新功能先容，早期的朋友圈，大家还记得几张照片拼接的画面么，新功能勾引的形式比较丰富，可以是视频，图片也可以是插画的形式，一样平常类似讲故事的形式把功能传达给用户。

FEYNAUB在新功能勾引时候，须要用户输入位置，很好的把新功能和启动页情绪调性用插画的形式表达了出来，显得不那么生硬很自然通报了品牌。

Numero在新功能勾引页面上，采取了字母和人物结合的设计技法，衬线体笔墨和图形很好的结合在了一起，给人很精细时尚的觉得。

这个启动页设计，也是属于新的功能先容，全体设计形式感和图形感非常强，通过故事性的勾引很好的传达了功能。

Onboarding的启动页设计很好地采取了连续觉得，每张图片和图片直接连接很顺滑，同时采取2.5D设计技法，但是处理的没有那么重，很轻量化，比较适宜当下快速浏览的场景。

Coffee APP的启动页面采取目前比较常见的设计手腕，插画和笔墨的展示，海内这种设计比较多，但是Coffee在色调和图形处理上相称细腻，简洁的同时又不乏很意见意义性设计在里面。

当然目前已经是小视频的时期了，当下大概多APP的启动页面直接采取短视频的形式来通报给用户，视频的带入感和沉浸感会更加直不雅观。

Periscope很奥妙地把功能以插画的形式结合在界面中了，也是值得我们去学习的点。

非常喜好的一个日本的APP名字Sooshi，勾引页设计非常棒，从图片选择，图片光芒处理，笔墨处理都非常高水准，以是并不是背景图用照片就一定很low，处理好了，一样是很高大上。

3. 品牌承载

这种构造也利用比较多，直接很大略的用品牌图形和一句文案来通报，比较适宜于一些有名的产品，本身它们的图标符号已经是品牌的一种传达，无须做过多的润色，比如苹果，Twitter，Facebook等等。

大略粗暴，品牌色+LOGO就足够通报一起下表达的东西，用户对付这种简洁品牌表达也能很好接管。

轻微加一点一点背景色，或者LOGO的形式是一些大厂常常利用的调性。

也是同样LOGO图形结合品牌色，有时候简大略单快速进入到主页面功能也是用户最急迫须要的。

不得不说国外设计师在把品牌图形设计的很极致，一个大略的符号和图形已经便是最好的品牌表达。

4. 营销图片+品牌

在海内电商里面利用这种方法比较多，构造比较固定，上面是品牌营销，下面是品牌LOGO，一样平常这种启动页有2种场景：一种默认状态，一种品牌营销状态。
上面构造可以是容器可以承载任何形式可以是视频、图片、广告等。

（左图）正常状态，淘宝盒子打开，飞出丰富多彩的商品，象征万能的淘宝；（右图）营销状态，淘宝盒子关闭，合营双11的广告运营图来展现，用户可以跳过。

（左图）天猫默认常态；（右图）营销活动时候，LOGO收起到底部，顶部固定图片区域。

（左图）微博默认状态；（右图）微博活动常态。

（左图）虾米默认常态；（右图）虾米活动常态。

三、启动页的设计手腕1. 图标+品牌色+图案添补

顾名思义，便是品牌色和图标的展示，上面实在有讲过案例，这种比较常见，一样平常利用白底加上品牌LOGO，当然也可以是反色，品牌色+白色的LOGO是比较常用的形式。

上面是一个大略的示例，这种设计常用技法有4种：

第1种是白底和品牌的LOGO第2种是品牌色加白色的LOGO第3种是渐变色加LOGO第4种是如果以为纯色过于单调可以添加一些小图标模式作为背景色

这些都是比较好的通过品牌色以及品牌已有是LOGO和卡通形象的一些常用设计手腕，实在还是很丰富，关键在于设计师对付细节的处理和把控。

2. 图片利用

图片比笔墨更随意马虎通报感情，比如MOMO每次的图片调性就非常棒，还有微信便是很好的案例。

一张好的图片能形成这个产品用户的第一影象点，有时候还能成为经典就和电影里面经典画面一样，但是一定要图片能很好表达功能的特点，否则毫无意义。

3. 插画技法

这种目前用的比较多，也是个主流是形式，一样平常是合营节日情绪化来运营，能很好的表示出页面的调性，但是插画的形式和图片形式一样须要定期改换，否则很随意马虎造成审美疲倦。

4. 图标模式

图标模式也是一个经典技法，背景采取一些图形的表达，很好的能传达产品的功能，最早的手淘和当前版本便是类似风格。

5. 图形演化

图形演化一样平常基于品牌LOGO，把LOGO图形当视觉容器，根据图形来设计，比如常见的天猫猫头，QQ音乐的音乐光盘，还有QQ空间星星等等，这类型对LOGO图形哀求比较高，必须图形足够大略，图形随意马虎拓展。

末了

简大略单一个启动页面设计，实在背后也有很多的设计思考，我们在做类似设计时候，首先要明确产品的内容和调性，去选择一种得当的，然后在这个框架功能根本上去进一步缩小设计目标，这样我们的设计才能做到有理有据是精确的方向。

#专栏作家#

Sky，微信"大众号：我们的设计日记（ID：helloskys），大家都是产品经理专栏作家。
支付宝体验设计专家，阿里巴巴天猫设计专家；10年有名互联网公司设计履历，对付产品从0到1、品牌定位、金融产品、设计规范、运营规范、大匆匆等有丰富实战履历。

本文原创发布于大家都是产品经理。
未经容许，禁止转载。

题图来自Unsplash, 基于CC0协议。