启动页与勾引页设计险些是每个APP必备的。

在产品上架前期,设计师们常日汇合中设计产品启动页与勾引页。
启动页与勾引页是用户理解产品的第一个窗口,能给用户留下初印象~最近刚做完新产品的启动图与勾引页设计,分享自己关于做启动图、勾引页学到的干系知识与履历总结,希望对大家有所帮助,欢迎一起互换学习呀~

一、启动页、勾引页是什么?

启动页:当用户打开APP时,在启动APP的过程中被用户所看到的过渡页面或动画都被称为启动页。

浸染:

关于启动页与引导页的设计总结

缓解用户启动APP时等待的焦虑感情。
通报品牌或先容产品做事理念,加强用户对产品的印象。

特点:

展示韶光短,一样平常3s内,不可交互。
启动图设计的更新速率可以保持1~3年改换一次,不建议频繁改换,启动图设计更新该当是跟随产品全体计策进行改换的。

启动页的形式比较多样化,但UI设计师在产品上架前期紧张还是设计以产品内容或品牌为主的品牌启动图,先容产品核心做事与通报品牌,本文紧张先容的是APP品牌启动图这种形式。

其他的,比如广告页、节日闪屏等运营类的启动页形式,我们知道有这种过渡页面存在就行了,这里就不做过多先容了。

勾引页:当用户安装或更新APP后首次启动APP时展示的3-5个滑动页面便是勾引页,帮助用户更加清晰的理解产品定位与功能做事。

浸染:

呈现APP核心功能做事与产品特色或对迭代优化的地方做功能解释,让用户快速理解产品。
勾引页的设计调性能让用户对产品设计留下初印象。
勾引页已成为每个APP的仪式感设计,每次产品迭代更新,通过勾引页形式,让用户感知到产品的迭代更新。

特点:

可旁边滑动切换页面,末了一页有进入按钮勾引页个数一样平常为3-5个,个数不要超过5个,且只管即便供应直接进入或跳过的按钮勾引页的设计更新频率可以跟随每次产品升级、新功能特色进行更新,更新频率相对较频繁一些

二、启动页、勾引页怎么做?

启动图设计形式启动图常见的设计形式有纯背景+图标/slogan、背景图片、漂浮屠标、品牌渗透这4种形式。

纯背景+图标/slogan在纯色背景上,融入产品启动图标或产品slogan。
这一种是最简洁也是最经典的启动图设计形式。
大略有力的宣扬产品品牌、通报产品做事理念、加深用户对产品印象。

设计小tip:设计这种形式的启动图,我们须要把稳页面的视觉平衡。
高下比例建议采取0.86:1很多设计师在对齐的时候会直接采取工具的垂直居中,我们可以来比拟看一下直接垂直居中与微调后的视觉感想熏染~

很明显,直接采取垂直居中,高下比例为1:1的话,视觉中央是有些往下掉的;我们须要往上进行调度,达到视觉平衡。
NAVER的改版设计中,专门将启动页的比例由1:1调度为了0.86:1,让视觉达到舒适。

背景图片采取图片或短视频作为背景图。
图片或视频的选取须要符合产品调性。
这种设计形式更加直不雅观,具有场景感,能带来更大的共鸣,具有沉浸式体验。
最具代表的便是微信的启动图了,仅靠一张图片就形成了产品的影象点。

政务类产品启动图常选用当地的地标建筑或区域特色作为启动背景图。

漂浮屠标将与产品干系的功能做事图标飘散浮动在全体页面中。
最具代表的便是淘宝的启动图。

品牌渗透品牌渗透设计形式是目前市场上运用得最多的。
采取插画、3D等设计手腕,结合产品IP形象、品牌符号等与品牌干系的元素进行领悟设计,加强品牌推广,形成品牌影象。

品牌渗透的设计形式有:a.将品牌图形与做事场景进行领悟设计利用插图或3d的形式将品牌图形与功能做事场景相结合,这类设计形式也是比较盛行的,既能直不雅观的展示做事场景又能很好的宣扬品牌。

b.品牌符号由于启动图韶光特殊短,将产品的品牌符号放大或者重复排版,从而加深用户对产品、品牌的影象,这也是一个比较讨巧的方法。

c.IP形象启动图展示产品的IP形象,加强用于与产品IP的链接。
最经典的便是QQ的企鹅开屏,这么多年都是一贯保持这种设计形式。

勾引页动图设计形式勾引页设计除了帮助用户更加清晰的理解产品定位与功能做事外,现已成为每个app的仪式感设计。

每次下载新的app后,自己也很期待看到产品的勾引页,通过勾引页来推测全体app的设计调性~勾引页设计内容相对来说比较固定,一样平常为文案(主副标题)、图形部分、轮播器、按钮这四部分。

设计形式也紧张为插画、3D、实景图片这3种设计形式。

插画设计形式这是市场上运用得最多的设计形式,分为扁平化插图与2.5D插图形式。

3D元素随着3D设计形式的盛行,3D元素在UI设计中越来越常见。
3D图形比扁平化的图形更加直不雅观立体、具有场景感,在勾引页中的运用也越来越多。

实景图片采取实景图片或视频形式,让画面更具场景感,具有沉浸式体验。
这类设计形式更适宜旅游类或短视频类产品。

一个产品的启动图与勾引页设计(特殊是启动图设计)是很具有代表性的。
我们可以从启动图与勾引页看出产品的设计调性与做事理念,个人以为这两个模块也是值得设计师花心思做的~

结合产品做事与品牌进行设计方案探索,也是很有趣的。
以上便是自己关于启动图与勾引页的部分设计见地与解析,欢迎大家多多指教呀~

本文由 @小鱼晴子 原创发布于大家都是产品经理。
未经容许,禁止转载

题图来自Unsplash,基于CC0协议