四种常见的APP分类界面布局设计案例学习
相信各位对于APP设计,已经很熟练啦。如何在熟练的基础上提高我们界面的优美度,或者是进行APP界面的迭代设计。
重构APP设计布局是我们必须要经历的一个过程。
在之前,学习UI设计的时候,经常要接触到页面的布局,布局的方式会直接影响一个APP的视觉效果,好的布局方式,往往能带来舒服的视觉效果,更能得到用户的接受与好评。
今天,25学堂跟大家来看下四种常见的APP分类界面布局。
第一种APP分类界面布局:宫格式分类界面布局
宫格式布局也算是移动APP上最常见的布局方式,也是用户体验最佳的一种方式。不然锤子手机的界面就是宫格的布局。
上面这个分类界面的设计的图标非常漂亮、精致。有点MBE风格的味道。
第二种APP分类界面布局:左右对称平等分的分类布局
这类分类界面设计的公式:左边是分类名称 + 分类说明 +分类图片
这类布局方式在电商、旅游、新闻等APP分类界面当中最常见。也适合分类特别多的APP布局。
这类对设计的要求比较高,需要设计师把握好设计的尺度。比如左边和大小和右边实物图的比例要是黄金比例才行。
第三种APP分类界面布局:列表式分类界面布局设计
这类最简单,也是最经典的分类界面设计,但是可以融合一些宫格式布局来搭配。比如下面的分类界面设计非常不错。
列表式布局的优点:这种方式的在APP用户体验改进了很多,尤其在连续切换时其操作方式的连续性比较强,主体页面的过渡也更加平滑,会产生更加流畅的体验。
列表式布局的缺点:不适合类别分类目录过多的界面。而且这样连续性的滑动容易导致定位不准。或者容易触发别的栏目的类目。
第四种APP分类界面布局:分模块布局设计
这类的布局设计,适合分类种类比较多,而且扩展性强。同时也可以给设计师提供更广的设计空间。
比如下图这样的设计:
分模块的分类界面设计布局的优点就是非常清晰明了。
缺点:操作点击区域多了,对于有选择困难症的人来说,就会出现不舒服的现象。所以,对于设计师来说,就要对留白技巧掌握非常准确。通过色块和留白消除这样的现象。
四种常见的APP分类界面布局设计案例学习的更多相关文章
- 四种常见的App弹窗设计,你有仔细注意观察吗?
弹窗又称为对话框,是App与用户进行交互的常见方式之一.弹窗分为模态弹窗和非模态弹窗两种,两者的区别在于需不需要用户对其进行回应.模态弹窗会打断用户的正常操作,要求用户必须对其进行回应,否则不能继续其 ...
- http协议里定义的四种常见数据的post方法
原文 https://blog.csdn.net/charlene0824/article/details/51199292 关于http协议里定义的四种常见数据的post方法,分别是: applic ...
- (转)四种常见的 POST 提交数据方式
四种常见的 POST 提交数据方式(转自:https://imququ.com/post/four-ways-to-post-data-in-http.html) HTTP/1.1 协议规定的 HTT ...
- 四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现
原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...
- 一文读懂四种常见的XML解析技术
之前的文章我们讲解了<XML系列教程之Schema技术_上海尚学堂java培训技术干货><XML的概念.特点与作用.XML申明_上海Java培训技术干货>,大家可以点击回顾一下 ...
- 四种常见的 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) 转 ...
- application/json 四种常见的 POST 提交数据方式
四种常见的 POST 提交数据方式 HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 ...
- 转:application/json 四种常见的 POST 提交数据方式
四种常见的 POST 提交数据方式 HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 PO ...
- POST提交数据时四种常见的数据格式
最近项目部署到新环境tomcat+mysql,想看看项目部署成功没有,就用soupui调对应接口开测试,soupui使用比较简单,给上接口地址,入参xml报文,把入参的media Type设置为app ...
随机推荐
- Web_0005:阿里云服务器OSS权限的配置开通
创建用户 1,创建子用户 2,点击新建用户 3,设置账号类型,可以同时选 设置权限 1,设置对阿里云模块的控制权限,如 oss ecs 等的访问控制权限 2,点击所需的权限 3,获取账号的Acess ...
- 小白的java学习之路 “ 选择结构(二)”
switch 选择结构: 为什么使用switch选择结构: switch选择结构可以更好地解决等值判断问题. switch选择结构的四个关键字: switch case default ...
- JS实现粒子拖拽吸附特效-sunziren
特效的效果就如同本页面的背景一样,有粒子随机移动.连结,甚至是吸附到你的鼠标周围. 代码如下,只要引入JQuery和一小段JS代码就可以了.本质上用到了Html5的canvas <script ...
- Nginx模块之ngx_http_proxy_module
ngx_http_proxy_module模块: 示例: location / { proxy_pass http://localhost:8000; proxy_set_header Host $h ...
- 使用这7个隐藏技巧让您的Mac更易于阅读和使用!
macOS Mojave(10.15)可以说是苹果公司功能最强大,功能最强大的现代Mac软件更新版.它带来了一系列新功能,安全和隐私控制,稳定性增强以及Dark Mode主题! 它也代表了最易于使用的 ...
- Android_小账本小结
登录界面:支持登录.注册以及游客登录,单纯的小账本的话其实用不到这些个登录,单纯为了巩固学习知识. 尚未部署到服务器,账号等数据暂时保存在本地数据库中. 游客登陆:游客登录会直接跳到主页中,不影响使用 ...
- LeetCodeTwo Sum IV 树的遍历+Hash大法好
题意 给定一颗二叉搜索树,返回是否存在两个节点的值之和为给定值K. 思路 同Two Sum.使用Hash表解决.只是要写个树的遍历而已,选取DFS. 源码 class Solution { publi ...
- python笔记07
今日内容 深浅拷贝(面试) 文件操作 今日内容 深浅拷贝 v1=[1,2,[34,67,9]] import copy 浅拷贝: 拷贝第一层 v2=copy(v1)---将v1的地址copy,最外层壳 ...
- 【python&pycharm的安装使用】
一.Python3.7安装 1. 运行python3.7.exe 2. 检查是否安装成功:命令窗口输入python -V 二.Pycharm安装 1. 运行pycharm.exe(社区版) 2. 配置 ...
- [AH2017/HNOI2017] 单旋 - Splay
Splay 暴力维护节点信息即可 #include<iostream> #include<cstdio> #include<cstring> #include< ...