相信各位对于APP设计,已经很熟练啦。如何在熟练的基础上提高我们界面的优美度,或者是进行APP界面的迭代设计。

重构APP设计布局是我们必须要经历的一个过程。

在之前,学习UI设计的时候,经常要接触到页面的布局,布局的方式会直接影响一个APP的视觉效果,好的布局方式,往往能带来舒服的视觉效果,更能得到用户的接受与好评。

今天,25学堂跟大家来看下四种常见的APP分类界面布局

第一种APP分类界面布局:宫格式分类界面布局

宫格式布局也算是移动APP上最常见的布局方式,也是用户体验最佳的一种方式。不然锤子手机的界面就是宫格的布局。

上面这个分类界面的设计的图标非常漂亮、精致。有点MBE风格的味道。

第二种APP分类界面布局:左右对称平等分的分类布局

这类分类界面设计的公式:左边是分类名称 + 分类说明 +分类图片

这类布局方式在电商、旅游、新闻等APP分类界面当中最常见。也适合分类特别多的APP布局。

这类对设计的要求比较高,需要设计师把握好设计的尺度。比如左边和大小和右边实物图的比例要是黄金比例才行。

第三种APP分类界面布局:列表式分类界面布局设计

这类最简单,也是最经典的分类界面设计,但是可以融合一些宫格式布局来搭配。比如下面的分类界面设计非常不错。

列表式布局的优点:这种方式的在APP用户体验改进了很多,尤其在连续切换时其操作方式的连续性比较强,主体页面的过渡也更加平滑,会产生更加流畅的体验。

列表式布局的缺点:不适合类别分类目录过多的界面。而且这样连续性的滑动容易导致定位不准。或者容易触发别的栏目的类目。

第四种APP分类界面布局:分模块布局设计

这类的布局设计,适合分类种类比较多,而且扩展性强。同时也可以给设计师提供更广的设计空间。

比如下图这样的设计:

分模块的分类界面设计布局的优点就是非常清晰明了。

缺点:操作点击区域多了,对于有选择困难症的人来说,就会出现不舒服的现象。所以,对于设计师来说,就要对留白技巧掌握非常准确。通过色块和留白消除这样的现象。

四种常见的APP分类界面布局设计案例学习的更多相关文章

  1. 四种常见的App弹窗设计,你有仔细注意观察吗?

    弹窗又称为对话框,是App与用户进行交互的常见方式之一.弹窗分为模态弹窗和非模态弹窗两种,两者的区别在于需不需要用户对其进行回应.模态弹窗会打断用户的正常操作,要求用户必须对其进行回应,否则不能继续其 ...

  2. http协议里定义的四种常见数据的post方法

    原文 https://blog.csdn.net/charlene0824/article/details/51199292 关于http协议里定义的四种常见数据的post方法,分别是: applic ...

  3. (转)四种常见的 POST 提交数据方式

    四种常见的 POST 提交数据方式(转自:https://imququ.com/post/four-ways-to-post-data-in-http.html) HTTP/1.1 协议规定的 HTT ...

  4. 四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  5. 一文读懂四种常见的XML解析技术

    之前的文章我们讲解了<XML系列教程之Schema技术_上海尚学堂java培训技术干货><XML的概念.特点与作用.XML申明_上海Java培训技术干货>,大家可以点击回顾一下 ...

  6. 四种常见的 POST 提交数据方式(application/x-www-form-urlencoded,multipart/form-data,application/json,text/xml)

    四种常见的 POST 提交数据方式(application/x-www-form-urlencoded,multipart/form-data,application/json,text/xml) 转 ...

  7. application/json 四种常见的 POST 提交数据方式

    四种常见的 POST 提交数据方式   HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 ...

  8. 转:application/json 四种常见的 POST 提交数据方式

    四种常见的 POST 提交数据方式 HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 PO ...

  9. POST提交数据时四种常见的数据格式

    最近项目部署到新环境tomcat+mysql,想看看项目部署成功没有,就用soupui调对应接口开测试,soupui使用比较简单,给上接口地址,入参xml报文,把入参的media Type设置为app ...

随机推荐

  1. HDU1163 - Eddy's digital Roots

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1163 九余数:一个数除于9所得到的余数,即模9得到的值 求九余数: 求出一个数的各位数字之和,如果是两 ...

  2. Deepin Linux下安装安卓应用的各种方式

    没事啥折腾 Deepin Linux 的应用商店里集成了挺多安卓应用 , 没有的就只能自己想办法了. 我主要使用这几个app , 飞书,邮箱大师,还有一些公司内部app. 网上 搜索了一下 ,有以下几 ...

  3. css中content-box和border-box当宽度为百分比时的位置区别,vw和%区别

    盒模型 参考代码 // CSS 部分 <style> .box1,.box2{ width: 200px; height: 200px; padding: 20px; margin: 20 ...

  4. [Python机器学习]机器学习概述

    1.为何选择机器学习 在智能应用的早期,许多系统使用人为的if和else语句来处理数据,以主动拦截邮箱的垃圾邮件为例,可以创建一个关键词黑名单,所有包含这些关键词的邮件被标记为垃圾邮件,这是人为制定策 ...

  5. Linux网络课程学习第四天

    课程内容包括:管道符.重定向与环境变量. 学习心得:个人感觉本章节还是不太好理解,尤其是对自己的基础还不是特别的扎实课余时间还是要反复的复习.

  6. 题解 AT4278 【[ABC115A] Christmas Eve Eve Eve】

    题目传送门. 分析 根据题目,我们可以发现要求如下: \(d\)的值 输出 \(d=25\) Christmas \(d=24\) Christmas Eve \(d=23\) Christmas E ...

  7. WPF 不支持从调度程序线程以外的线程对其 SourceCollection 进行的更改

    该问题出现在WPF中的VM类中,ObservableCollection类型,该类型的 CollectionView 不支持从调度程序线程以外的线程对其 SourceCollection 进行的更改, ...

  8. C++->List的使用注释

    List容器的应用: //----------单链队列-------队列的链式存储结构--------------- typedef struct QNode{                     ...

  9. gtid环境下mysqldump对于set-gtid-purged的取值

    gtid环境备份的时候,还在为set-gtid-purged=0|1的选择而烦恼吗,一起来分析一下. [mysql@lxd-vm1@/home/mysql]$ mysqldump --help | g ...

  10. sqlserver删除所有表、视图、存储过程

    declare proccur cursor     for         select [name] from sysobjects where type='P' declare @procnam ...