学了这么久UI，你还不知道UI设计界面包含哪些？_ui界面区域名称

为了建立有效的UI，设计师需要深入的了解移动端APP的特性，了解他们的组成部分和功能。现如今随着移动行业的快速发展，很难给所有的APP建立一个统一的界面标准。先就和南京学码思UI培训机构一起来看下吧！

那么下面将会给大家介绍几种最常见、最流行的移动端UI设计界面，并展示他们不同的设计特点，学以致用，打开创意思维。

常见的几种UI设计界面 启动页

首次打开使用app时一般会弹出一个启动页面，这也是是影响用户第一印象的重要因素，这种最初的愉悦体验很有可能让这款app流行起来。这就是为什么要格外重视启动页的原因。

启动页是用户打开APP时看到的第一个界面，它们通常很简洁，往往是一个logo、app的名称或者是这个产品的一句slogan，呈现在用户眼前。

为了确保启动页在各个不同分辨率的屏幕上适配良好，UI视觉设计师们常常会把它们放在屏幕的中间位置或者底部位置。

启动页的建议显示时间是4~8秒之间，超过这个区间，用户可能会感觉厌烦。此外，最好显示加载进度，这样一些不耐烦的用户就会知道还要多久才可以进入app。

珠宝电商APP启动页为例 引导页

引导页是APP可能提供给新用户的一组介绍产品功能、特性以及优点的界面，它们在用户首次使用的时候加载。帮助用户熟悉它的控件和对应功能，让用户更好的上手使用，并且帮助用户判断这款软件是否有用。

虽然每一款app的结构和内容都是非常独立的，然而它们的引导页还是有一些相同的设计趋势。而很多引导页都习惯于用插画的形式来表现他们的新特性或者优点，这对用户很有吸引力，同时开发成本也很低。

设计师们也常常会为app创建一个卡通形象，用它来模拟真实的使用场景，将它作为一种连接用户与app的情感纽带。还有引导页的文案也是十分重要的，它应该是简短的、有帮助的并且具有可读性。

Underwater World Encyclopedia app的 引导页

首页和菜单栏界面

首页是每个app必不可少的界面，在app中起承上启下的作用，它是用户与app产生交互的主要界面。

首页的设计取决于产品的类型，它包含各种各样常见的重要组件。首先，首页通常包含搜索栏或者搜索icon，可以帮助用户很方便的搜索他们需要的内容。

同时，因为首页是用户通往app各个功能的起点，它通常包含导航栏，让用户可以访问到不同的单元模块。

Homey app的首页

为了让用户的交互更简单，可以创建一个菜单，里面包含一些常用的功能，仅通过一次点击即可抵达。这里有两种app菜单栏的布局方法：它可以是首页的一部分。

或者是一个独立的页面，里面包含的内容最好少于7项，仅展示最重要的部分，如果想要包含更多内容，可以创建子类别。

侧边栏菜单

登录和个性化设置界面

许多app都要求用户注册登录自己的个人账号，所以每一个设计师都应该知道怎么样来设计登录界面，登录界面应该简洁清晰，以便用户可以快速的进入app。

该界面通常有两个输入框，用来输入登录名和密码，和一个确认按钮。同时还应该有注册按钮。个性化设置可以使app更加的适用于个人，并且可以帮助app为用户提供最有效的数据信息。

同时，个性化设置数据也是所有社交网络app的关键部分，它引导用户进入虚拟社区网络，并且开始与其他人进行分享。设计师的主要任务就是通过流畅的UX设计，使这一步骤尽可能的方便友好。据交互设计组织所说。

设计师首要考虑的是，个性化设置界面应该清晰明确，展示的信息数量应该限制在一定范围内。否则整个界面看上去会很乱很复杂同时要时刻确保导航栏清晰可见，这样用户就不用花费太多精力去摸索app。

最后，个性化设置界面的设计应该以目标受众为主导，如果想要你的app满足用户的使用需求，那么用户研究是必不可少的。

Dating App

数据统计界面

很多app都包含数据统计界面。它提供的数据越多，设计难度就越大。设计师需要确保所有的重要数据在屏幕上都是清晰可见并且有用的，曲线图、比例尺和统一的icon可以使整个界面看上去很流畅、很整洁。

此外，数据统计界面需要为不同的数据划分不同的区域，以方便用户阅读。

NGIN App

日历

事件app、待办清单app和一些个人app都有日历界面，取决于app的类型。日历主要有这么几种功能：提醒或者制定计划。它的视觉风格应该符合用户的心情和使用目的。

Bright Vibe Calendar App

电商类app界面 产品列表页

所有的电商平台主要目的都是为了销售产品，它的视觉设计对用户的决策有很大的影响。产品列表是公司销售的一系列商品。设计师的工作是设计一个可以吸引用户并且鼓励他们购买商品的页面。

移动端的产品列表也可以像一些web端的电商平台一样，将产品类目放置在一个容器中，可以通过上滑来查看，一行中放置的产品数量应该根据屏幕宽度来决定。

Resto App

另一种展示产品列表的交互方式是水平滑动，为了让导航更加清晰明确。页面中最后一个选项不应该完全展示，这样可以提示用户滑动的方向。

此外，产品的照片或者是插图应该是高清的，这样用户可以更好的了解他们要购买的商品。产品列表界面应该有一个行为召唤按钮，用户通过这个按钮可以将商品添加到购物车。

这样用户就能从产品列表界面获取到商品，不用再额外跳转到特定的界面。

Cafe Coupon app

产品详情页

这个界面是给那些想要进一步的人，提供更多关于产品的信息，它用来展示产品的一些主要信息，以此来帮助用户决定他们是否真的需要这个产品。

设计师一般将产品的展示图片放在屏幕中央，相关描述放在图片下方。设计师可以将尺寸、材质或者其他数据分成不同的模块，以便用户可以轻松的找到他们所需要的信息。

珠宝电商app

确认支付页面

如今越来越多的人愿意使用智能手机线上支付，各大公司纷纷对这一环节开始加以重视，力求打造最便捷的支付体验。

支付是用户购买商品的最后一步，设计师的职责是让用户在使用的过程中感觉舒