zoukankan      html  css  js  c++  java
  • 四种常见的APP分类界面布局设计案例学习

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

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

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

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

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

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

    %e5%88%86%e7%b1%bb%e7%95%8c%e9%9d%a2%e5%ae%ab%e6%a0%bc%e5%bc%8f%e5%b8%83%e5%b1%80

    APP宫格设计 贴图

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

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

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

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

    %e7%94%b5%e5%95%86%e5%88%86%e7%b1%bb%e7%95%8c%e9%9d%a2%e5%8f%82%e8%80%83%e5%ad%a6%e4%b9%a0

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

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

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

    %e5%88%97%e8%a1%a8%e5%bc%8f%e7%9a%84%e5%88%86%e7%b1%bb%e7%95%8c%e9%9d%a2%e8%ae%be%e8%ae%a1

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

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

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

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

    比如下图这样的设计:

    %e5%88%86%e6%a8%a1%e5%9d%97%e5%8c%96%e7%9a%84%e5%88%86%e7%b1%bb%e7%95%8c%e9%9d%a2%e5%b8%83%e5%b1%80

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

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

  • 相关阅读:
    div错位解决IE6、IE7、IE8样式不兼容问题
    DIV背景半透明文字不半透明的样式
    Div 自适应屏幕大小
    mysql 设置外键 四大属性 CASCADE SET NULL NO ACTION RESTRICT 理解
    msyql 主从配置
    全国最新区划数据-四级-省-市-县(区)-乡(镇)
    ThinkPHP3.2 伪静态配置
    色彩网站
    Javascript php 异常捕获
    jQuery 操作大全
  • 原文地址:https://www.cnblogs.com/lsongyang/p/9486058.html
Copyright © 2011-2022 走看看