新闻资讯

新闻资讯 媒体报道

使用8点网格使UI设计更高效

编辑:011     时间:2020-02-14

利用适合的网格系统辅助工具,让页面布局统一、规范,提高沟通效率

(一)

网格布局设计的目的

建筑设计最重要的因素之一是架构,同样设计界面也需要打好基础架构。设计师通过使用统一的元素、间距、材料设计布局可以保持平台、环境和屏幕大小之间的一致性,提升设计效率、减少决策时间,减少与开发的沟通成本。


(二)

屏幕适配性高

基本的主流屏幕尺寸都至少在横竖一个轴的维度上能被4和8整除。如果用4作为基本步进单位,页面内容会被分割的过于细碎,因此8作为基本步进单位进度合适,既不显得过于细碎,也不会因为间隔太大而显得内容分散,更适合多平台响应。



减少沟通成本

目前使用广泛的前端开源组件库都基于8的基本单位来设计,比如:Ant Design、Matierial Design等。因此如果设计师也使用以8点网格系统,开发可以轻松的丈量8的倍数,开发与设计师对接沟通效率就会很高,页面的还原度也会更高一些。


(三)

Sketch设置

在sketch中设置好相应的网格选项,设置网格尺寸为8px,并在“首选项”的“画布”中调整移动增量值为8,这样在设计的时候会方便很多。



郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

回复列表