《UI设计-AIGC驱动赋能界面完美设计》课件 4.1 相关知识

04项目四设计与制作“校缘通”App项目

引导页界面设计（一）UI设计——AIGC驱动赋能界面完美设计4.1相关知识4.2任务实施4.3技能提升044.1相关知识

4.1.1闪屏页4.1相关知识App闪屏页是移动应用启动时展示的页面，通常用于呈现应用的品牌标识、名称及相关品牌信息，会在启动阶段短暂显示后，自动跳转至应用主界面或登录界面。作为用户接触应用的首个视觉触点，闪屏页的设计要求尤为考究。其展示时长极短，通常仅1

s左右，如何在这一有限时间内精准传递产品定位，是设计师需要重点考量的核心问题。唯有设计出定位清晰、视觉吸睛的闪屏页，才能有效强化用户对产品的认知与记忆。闪屏页主要分为品牌宣传型、节假关怀型、活动推广型三类，不同类型的闪屏页，所承载的内容信息与视觉表达形式均各有侧重。4.1.1闪屏页4.1相关知识1.品牌宣传型

App闪屏页的核心设计目的是彰显产品品牌，核心组成元素为“产品名称+产品形象+产品广告语”，其中品牌宣传型闪屏页是最直观的类型，设计上追求简洁精炼，以突出品牌核心特征为核心，如图4-1所示。2.节假关怀型

每逢节假日，多数App会通过营造节日氛围传递人文关怀。当用户看到贴合节日的暖心插画时，能真切感受到产品带来的节日祝福，进而获得愉悦的使用体验。QQ空间在节日闪屏页的设计中，会对品牌logo进行节日化延展设计，融入鲜明的节日元素，如图4-2所示。图4-1品牌宣传型App闪屏页图4-2节日关怀型App闪屏页4.1.1闪屏页4.1相关知识3.活动推广型

以特色活动为核心开展营销策划，围绕用户核心利益点营造专属活动氛围，这类闪屏页多以插画形式呈现。设计时需重点突出活动主题与关键时间节点，明确视觉主次逻辑，避免因场景画面过于繁复弱化核心信息的表达，如图4-3所示。图4-3活动推广型App闪屏页4.1.2引导页4.1相关知识引导页概述引导页是用户首次打开应用时展示的页面，核心目的是向用户介绍应用的功能、特色与使用方法。这类页面通常由不超过5页的可左右滑动屏组成，能够帮助新用户快速熟悉应用核心功能，同时完成基础的使用指引。1.功能介绍型功能介绍型引导页是引导页中最基础的类型，信息展示需具备强针对性，切忌文字冗杂。设计师需在短暂的3秒内，为用户呈现文案简洁明了、界面直观易懂的内容。功能介绍型分为带按钮和不带按钮两种，社交类产品常加入登录入口，如图4-5所示。图4-4功能介绍型App引导页图4-5引导页登录入口4.1.2引导页4.1相关知识2.推广介绍型此类引导页以传递品牌理念与价值主张为核心目的，侧重引发用户情感共鸣，通过阐述产品的品牌使命与人文情怀，清晰展现App的市场定位与视觉风格，如图4-6所示。3.问题解决型此类引导页聚焦用户实际生活中的痛点问题并给出对应解决方案，以此建立用户与App之间的情感联结，提升用户对产品的好感度，进而增强用户黏性，如图4-7所示。图4-6推广介绍型App引导页图4-7问题解决型App引导页4.1.2引导页4.1相关知识4.浮层引导页浮层引导页一般出现在功能操作提示中，是为了让用户在使用过程中更好地解决问题而提前设计的用户指导。这种引导页的浮层通常以手绘表现方式为主，使用箭头和圆圈进行设计，并用高亮的颜色来突出信息，同时采用蒙版方式来加强突出功能，如图4-8所示。图4-8浮层引导页4.1.3表现方式4.1相关知识1.固定框架类框架类引导页由简要精练的文案搭配该产品的功能框架组成，是引导页最常用的表现形式，常用于基本功能类和使用方法类界面，如图4-9所示。2.图片与文字组合图文结合是引导页设计中较为常见的表现形式，主要由文字搭配图片、手绘插图构成。设计时文字需简洁凝练，视觉层面结合产品定位，搭配契合使用场景、富有画面意境的插图，实现图文协调融合，如图4-10所示。图4-9功能框架类图4-10图文结合4.1.3表现方式4.1相关知识3.动态效果展示通过上下滑动、左右切换、拉伸放大、点击跳转、退出过渡等动态效果，将3～4个引导页界面串联起来，并搭配契合产品调性的背景音乐。用户浏览时能获得新奇有趣的交互体验，打破传统静态页面的单一沉闷感，如图4-11所示。4.视频展示引导页除静态界面、动效引导外，还可采用视频播放形式展示产品功能和信息，例如播放一段开场视频向用户传递产品的使用方式与功能，这类引导页设计多用于拍照、记录、交友、发布类多媒体等应用产品，如图4-12所示。图4-11动效展示图4-12视频展示4.1.4设计原则4.1相关知识1.合理化原则仅围绕核心需求开展内容引导，根据设计目的与出发点的不同，引导页可划分为产品说明类、使用说明类、推广类、问题解决类四大类。设计前期需对引导页进行全面分析，以此制定贴合需求的合理化设计方案。2.优化编排原则引导页常用设计形式包含文字与界面组合、文字与插图组合、动态效果搭配音乐、视频特效等；常见编排方式有逐一展示、故事串联、节日应景等。逐一展示是将核心内容提炼为独立要点并按序排列，各要点之间无需建立强关联。3.眼球效应原则有效吸引用户注意力，才能让引导页传播效果事半功倍。设计时需将视觉焦点聚焦于核心信息，通过光影突出、背景虚化、局部放大等方式强化信息表达。眼球效应也可通过交互效果、动画、视频等动态形式实现。4.1.5空白页4.1相关知识1.首次进入型空白页分为首次进入型和错误提示型两种，是由于网络问题或没有内容造成的页面。在用户第一次打开应用时，App会利用空白页的提示引导用户进行操作，指引用户找到需要的内容，如图4-13所示。2.错误提示型