当你先进次打开手机网站的时候经常会看到精美的引导页设计，它们在你未使用产品以前事先告知你产品的主要基本功能与特点，先进次印象的优劣会极大地决定到后续的产品使用体验。因此每个公司都在努力将这几个页面设计好，从一开始就引人入胜。那接下来我跟大伙一起来探讨关于引导页的设计。

　　一、目的区分

　　依据引导页的目的、出发点不同，可以将其分为基本功能介绍类、使用表明类、推广类、问题解决类，一般引导页不可能超过5页。

　　1.基本功能介绍类

　　基本功能介绍类引导页主要是对产品的主要基本功能开展呈现，让顾客对产品主基本功能有一个大致的清楚。采用的形式大多以文字配合界面、插图的方法来展现。

　　2、使用表明类

　　使用表明类引导页是对顾客在使用产品过程中可能会遇到的困难、不清楚的操作、误解的操作行为开展事先告知。这类引导页大多采用箭头、圆圈开展标识，以手绘风格为主。以虾米音乐的引导页为例，相对较难发现的播放队列、歌词的操作方法开展的箭头引导来表明。

　　3、推广类

　　推广类引导页除了有一部分产品基本功能的介绍外，越来越多是想表达产品的态度，让顾客更明白这样的产品的情怀，并考虑与整个产品风格、公司形象相一致。这一类的引导页假如做的不够吸引人，顾客只会不耐烦地想迅速划过。而制作精良、有趣的引导页，顾客会驻足观赏。

　　以淘宝旅行为例，淘宝旅行通过清新、生活化场景的插图营造产品是一款乐享生活、跟着感觉走的出行应用，在你出行前就帮你计划好所有的行程部署，只需一个行李箱，说走就走，与产品的理念相契合。而另外一款应用，选用恬静、安逸的照片配以简洁的文字来渲染产品的基调。

　　4、问题解决类

　　问题解决类通过描述在具体生活中会遇到的问题，直击痛点，通过较后的解决方案让顾客产生情感上的联系，让顾客对产品产生好感，增加产品粘度。例如QQ浏览器的引导页设计，通过形象的插图直接明了地表明了QQ浏览器解决了其他浏览器所遇到的问题(搜不到小说、看小说花钱、小说更新必须要等)。

　　二、表现方法

　　1、文字与界面组合

　　这是较常见的引导页面，简短的文字+该基本功能的界面，主要是运用在基本功能介绍类与使用表明类引导页。这种方法能较为直接地表达产品的主要基本功能，缺点在与过于模式化，显得千篇一律。

　　2、文字与插图组合

　　文字与插图的组合方法也是现在常见的形式之一。插图多具象，以使用场景、照片为主，来表现文字信息。

　　3、动态成效与音乐

　　除了静态页面外，开始流行具有动态成效的页面。在单个页面采用动画的形式，考虑好每个组件的先后快慢，打破原有的沉寂，让页面动起来。同时结合动效可以考虑页面间切换的方法，将默认的左右滑动改为上下滑动或过几秒自动切换到下一页。在浏览引导页的时候，可以试着加入一部分与动效节奏相契合的音乐，会是一种更加新颖的方法。

　　4、视频呈现

　　在打开后通过播放视频的方法来介绍产品或传递一种理念，这种方法多见于偏生活记录类的应用，如拍照、运动类应用，给人表达青春活力、积极乐观的生活态度。优点：直观，动感，生活化。缺点：应用较大，视频播放会出现卡顿的情况。

　　三、总结

　　以上已经针对引导页的目的差别以及表现方法开展了相应归类，在具体的设计中还得注意一部分原则,它们会让你的设计更加吸引人，信息表达的成效更好。

　　1、文案言简意赅，突出关键。

　　依据爱尔兰哲学家汉密尔顿观察发现的7±2效应，一个人的短时记忆至少能回忆出5个字，较多回忆9个，即7±2个。因此呈现的文案要控制在9个字以内，超过后顾客简单遗忘、出现记忆偏差。假如表达起来困难，可以辅助一小段文字开展解释或补充。因此在较终文案的确定上，要突出重点，多余的文字尽可能地开展删减。假如文案删减后字数还是过多，因考虑对文字开展分层，通过空格或逗号或换行的方法开展视觉优化。

　　有效贴切的文案也十分重要，将专业的术语转换成顾客听得懂的语言。尤其相对通过照片来表现主题的引导页设计，文案与照片的吻合度，直接决定到情感表达的成效。

　　2、视觉聚焦

　　在单个引导页中，信息不宜过多，只论述一个目的，所有元素都围绕这样的目的开展展开。视觉聚焦包含两部分，一是文案的处置，要注意层次，主标题与副标题要形成对比;二是引导页中的界面、场景、文案具象化元素，要有一个视觉聚焦点，多个视觉元素的排布采用中心扩散的方法，聚焦点的视觉面积较大，同时与扩散的元素拉开对比。这样子顾客能清晰地看到关键文案信息与文案对应的视觉表现元素。同时结合视线流动的规律，从上到下，从左到右，从大到小。因此可以依据这样的视线流的规律来开展引导页的设计。

　　如下图为天猫客户端的引导页，剖析其视觉流发现，浏览的顺序从插图到主文案，再到辅助文案，缺点在*次看到的是插图而不是文案，插图相对文字理解相对困难，因此未能迅速地获取该页的主要信息，可以考虑将文案与插图的位置开展互换，这样子会好一部分。

　　3、富于情感化

　　A、文案具象化

　　通过具体的元素、场景来表现文案，采用写实、半写实的方法开展表现，有一些应用还会配以水彩风格。以天猫为例，天猫是一款购物应用，在设计上通过商场、店铺的具体场景的具体描绘，渲染轻松、欢快的购物过程。

　　B、页面动效、页面间交互方法的差别化

　　以前相对表现方法的归类已经讲到了动画及页面切换方法，假如增加了页面动效，利用动效，包含放大、缩小、平移、滚动、弹跳，表现形式更加多样化，会让引导页更有趣，专注力更为集中。

　　而页面间的切换方法除了传统的卡片左右滑动的方法外，可以结合线条、箭头等开展引导，通常会配合动效。例如网易新闻客户端、印象笔记·食记，它们在引导页的设计上采用了线条作为主线贯穿整个引导页面，小圆点显示当前的浏览进度，滑动的过程中有滚动视差的成效。

　　4、与产品、公司基调相一致

　　引导页在视觉风格与氛围的营造上要与该产品、公司形象相一致，这样子在顾客还未使用具体产品前就给产品定下一个对应的基调。产品的特性确定了引导页的风格，产品是消费类、娱乐类、工具类还是其他，依据不同的产品特性确定了引导页是走轻松娱乐、小清新，还是规整、趣味性的风格，在较终的表现形式上也就会有有效不同的展现，是插图、界面、动画还是其他。如淘宝的娱乐、豆瓣的清新文艺、百度的工具、蝉游记的休闲等等，通过对比就能发现他们在引导页设计上的差别。

　　这样子一方面有利于产品一脉相承，与产品使用体验相一致;另一方面也会进一步强化公司形象。

　　以来往为例，来往是一款针对个人顾客的及时通讯应用，主打扎堆、阅后即焚、敲门等与微信不一样有趣的基本功能，也是想给顾客创造不一样的IM交流方法。因此在引导页的设计上通过趣味性、乃至有点搞怪的动作与表情来表现来往是这样子一款有趣、欢乐多的产品。

　　又如网易彩票，引导页的主色选用了与网易自身的红色相一致的红色，在公司产品系统性上保持高度的一致性。

　　总之：想做好引导页的设计，在理解顾客对引导页需求的基础上，怀揣热爱产品的情怀，依靠精致的布局，巧妙的构思，贴切的氛围渲染，再加一点点特色。当然光讲是枯燥的，还是必须要设计师在具体的设计中一直实践，总结出新的观点与方法，探索出标新立异的引导页设计。