UX用户体验设计 ·

如何设计更好的app的启动引导页面?

苹果官方对于iOS启动页的设计说明:

当用户在主屏幕上点击您的应用程序图标时,iPhone OS会立即显示这个启动图像。一旦准备就绪,您的应用程序就会显示它的首屏幕,来替换掉这个启动占位图像。请记住,启动图像并不是为您提供机会进行艺术展示;它完全是为了增强用户对应用程序能够快速启动并立即投入使用的感知度。

一、启动页、引导页与UI间的关系

1、启动页与UI间的关系

为了增强应用程序启动时的用户体验,您应该提供一个启动图像。最终的目的是为了增强用户对应用程序APP 能够快速启动并立即投入使用的感知度。一般只有1张图或动画,停留时间控制在3秒左右。

现在启动页面的几个设计角度:

(1)品牌展现

品牌传递类的启动页相对较简单,基本采用产品名称+产品标志语为结构,简单突出主题即可。

(2)情感化设计

通过一张短短的启动页去说一个故事或是表达情怀,确实不是一件容易的事情。

2、引导页与UI的关系

所谓引导页,就是引导用户学习app用法或了解app作用的页面,其核心在于“引导”二字。一般出现在全新概念的APP上,或是产品的迭代之后。页面控制在5页以内。一个好的APP引导页面可以最快速的抓住用户的眼球,让你快速的了解APP价值和功能。也就是说好的UI可以引导用户更快的进入使用环境。

引导页的设计类型:

(1)特性性功能类

对主要产品的主要功能进行展示。以文案与插图组合再加上点状指示器的方式来表现。

点状指示器的功能:明确告知引导页的数量,和当前所在位置。

(2)推广类

含类似市场专题推广,情感化内容运营。

(3)品牌展现类

主要以与APP理念相符合的图片来表现主题。例如,美食类的APP图片采用食材图片来表现;社交类的以人物图片来表现。

在产品更新迭代后,利用半透明的蒙版遮罩与功能指引图片来告知产品的功能调整或增加及如何使用等。

二、人、物的设计方法

不论启动页还是引导页,它们的形式都是以图片为主,配合文案、点状指示器来表现,文案的设计方法与Banner相似,点状指示器的设计也比较简单,下面我们就来了解图片主题的设计吧。

1 如何做扁平化设计?

(1)脑暴构思,剪影化

扁平化设计,就是舍弃具体的实物的细节,进行轮廓剪影的概括。例如苹果的LOGO设计:

又如下图扁平化引导页中的PAD,其实它是有厚度,有质感的。当把这些东西舍弃后,它就是以个长方形加按钮和听筒的形式存在。剪影化就是保留物体特征,舍去多余细节。

(2)贴合主题

页面的图片、文案、按钮,的风格要与产品的风格统一。图片要结合产品与文案来设计;文字部分层次要分明,字数不能太多,控制在2-3行;按钮部分的颜色,圆角大小需与产品规范统一。

(3)构图合理

构图需分清主题与背景,中心不能偏移。突出主体,吸引用户目光。

(4)色彩的运用

自身色感的培养,关注潮流的配色风格,借鉴好的作品,才能运用好色彩。

2、人与人的扁平设计方法

与物的设计类似,也是剪影化,只是风格比较多。

(1)高度概括,舍弃细节

(2)比例合理,特征明显

以上就是今日所有的分享,希望对你的设计之路有所帮助!

 

文章来源:百度ue讲堂

参与评论