qt ui界面无法移动控件_都是知识点!移动端UI设计最基本的10种APP界面类型(上)...

如今互联网的发展和智能手机普及,移动应用成了人们的宠儿,很多多移动APP也会根据用户的需求而更迭本身的UI设计。

授人以鱼不如授人以渔,UI设计作为设计大类的一个细分岗位,如今已经随着时间的推移成为了最热门的职业。而现阶段非科班转行,依靠兴趣的入行的人也非常多。

界面作为我们认识APP的第一道门槛,是APP的“面子”,更是不可忽视的一项重点设计,为了建立有效的UI,设计师需要根据移动端APP本身的特性和当下趋势,作出不一样的改变。但当今设计趋势瞬息万变,在没有统一标准的设计规则之下,紧跟设计趋势,才能保证UI对用户的吸引力常在。

今天,就给大家介绍几种常见的移动端UI界面类型,希望对大家有帮助。

1.闪屏

每次打开App时第一眼看到的就是闪屏页(又称启动页),该页面承载了用户对这款App的第一印象,因此对设计的要求是很考究的。闪屏页给用户观看的时间很短,通常只有一秒的时间,因此,如何在这么短的时间内表达出产品的定位就是设计师需要重点考虑的问题。

只有设计出定位明确且吸引人的闪屏页,才能加深用户对产品的认知度。闪屏页分为品牌宣传型节假关怀型活动推广型3种类型,不同类型的闪屏页承载的内容信息和表达方式也不一样。

App的闪屏页是为了体现产品的品牌而设定的,主要组成部分是“产品名称+产品形象+产品广告语”,如图所示。品牌宣传型的闪屏页是最为直白的闪屏页,设计较为精简,力求凸显品牌特点。

0ea507412cb7d4ad8bce9c5ff6ac2e5a.png

品牌宣传型闪屏页

当节假日来临,很多App会通过营造节假日的气氛来体现人文关怀。当眼前出现一幅朴实的节假日插图时,观者会从内心感受到软件带来的祝福,从而拥有美好的心情。

909279ce3726e2e70c42e63b9f15615c.png

用插画体现节日气氛的闪屏页

2.引导页

一个好的App引导页能够迅速抓住使用者的眼球,让他们快速了解App的价值和功能,起到很好的引导作用。有一句话是这么说的:“优秀的UI可以造就App的点击率”。

在做引导页之前,我们首先要学会定位,了解App的目标用户群。简单来说,引导页分为功能介绍型情感带入型搞笑型3种类型。

a1272dd4f58e0d1c19acbe43c8d738c5.png

功能介绍型引导页

搞笑型引导页的阅读量一般都比较高,拼的是设计效果或动画效果,如图所示。

在一般情况下,这种类型的引导页对设计师的要求比较高,需要设计师学会扮角色和讲故事,综合运用拟人化和交互化的表达方式,根据目标用户的特点来进行设计,最终让用户身临其境,在页面上停留更长的时间。

99796ba67af3f4a95c9979ff665159f2.png

搞笑型引导页

3.浮层引导页

浮层引导页一般出现在功能操作提示中,是为了能够让用户在使用过程中更好地解决问题而提前设计的用户教育。

这种引导页的浮层通常以手绘表现方式为主,会使用箭头和圆圈来进行设计,并用高亮的颜色来突出信息,同时采用蒙版方式来加强突出功能,如图所示。

7e020513f28b1074e145055827e1651c.png

浮层引导页

4.空白页

空白页分为首次进入型错误提示型两种。简单来说,空白页就是由于网络问题造成的页面或者是没有内容的页面,例如页面中显示“没有信息”“列表为空”“错误”和“无网络”等内容的页面就属于空白页。

在一般情况下,这种页面都会通过文字信息给用户提示。好的空白页面会花费不少设计时间,因为这种页面不仅是用于提示,还会引导用户进行实质性的操作,从而加强用户对产品的黏性。要注意,空白页的设计一定要简洁明了。

在用户第一次打开应用的时候,App会利用空白页的提示引导用户进行操作,指引用户找到需要的内容,如图所示。

fe81aa9c00ce303edac53f010e1124ee.png

首次进入型的空白页

错误提示型的空白页不仅在网页中很常见,而且在App中也经常出现,例如显示“找不到页面”或者“网络中断”等,如图所示。这种页面中一般会指引用户解决问题,例如点击“刷新页面”按钮可以刷新页面等。

26d72020c9e19e7807e9bcdfbed7d524.png

错误提示型的空白页

5.首页

作为设计师,一定要做到多看多用才能够找到更适合产品本身的展示方式。下面介绍一下首页最常见的4种表现形式,分别是列表型首页图标型首页卡片型首页综合型首页,不同类型的首页布局承载着不同的内涵。

列表型首页是指在一个页面上展示同一个级别的分类模块。模块由标题文案和图像组成,图像可以是照片,也可以是图标,如图所示。列表型的首页更方便点击操作,上下滑动也可以查看更多的内容。

181c05da080d5445b86a6f63e507822d.png

列表型首页

当首页包含几个主要的功能时,可以采取图标的形式进行展示,如图所示。图标型的首页最好是在第一屏展示完整,并将点击做到最简单。

f47a3528c71dd5461bd5af531c26f8b6.png

图标型首页

电商类产品模块的表现方式比较多,有图标形式也有卡片形式等。如何才能让多块内容在页面中显示得清晰易读,这是对设计师能力的考验。

综合型的首页设计要特别注意分割线和背景颜色的区分不能太过明显,选择比较淡的分割线和背景色来区分模块即可,因为要保证页面模块的整体性,如图所示。

0f4092d2e40ca4430b03052a77896ce8.png

综合型首页

以上就是小编跟大家分享的UI设计最基本的10种APP界面类型,中的5种。

看到这些基础的知识还不快记下来!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值