版权申明:本文出自“设计TNT”原创,感谢“设计TNT”的原创文章分享!
FEVTE编注:更多平面设计理论学习请访问飞特网平面设计理论知识栏目,地址:https://www.fevte.com/plan/shejililun/
前言
从本周开始,接下来时间里,会和大家分享如何创建精致的UI界面,共五部曲,为什么要做这个分享?曾经我学习UI设计时,网上资料很多,但是参差不齐,对于新人而言,这是很痛苦的,进步慢。因此我想通过之前踩过一些坑,集合自己的工作经验,把一些知识点分享出来。
分享的最终目的是沉淀自己,同时也希望能给有想要提升排版能力的设计师带来一些帮助与启发!所以本系列文章并不一定适合所有人。
那么本周就先从排版篇幅开启….
为什么要学习排版
排版是界面设计中最难的部分,也是非常重要的一部分,它以各种形式存在界面中,纯文本排版,图形文排版,图片文本排版等等,这是我们在做设计时候,经常会面临的问题,好的排版能有效地向用户传递关键的信息,同时也能提升产品使用体验。在我们日常生活中,离不开设计排版,包括经常见到的各种广告与电影宣传海报,如果不能让用户在短时间内记住关键信息,这个设计就是失败的。因此我希望通过今天这篇文章,能够让你对排版有一些新的认识。
提升设计排版有哪些方法
在界面设计中,影响排版设计的因素有很多,我总结归纳了7个维度(当然还有其他更细的,在这里就先暂时不讲),它直接影响整个排版质量,这些方法当然不是绝对,但是如果能巧妙综合得运用到界面中,能保证大部分界面设计感得以提升,当然也是需要不断刻意练习来提高的。
分别是:
合理运用空间的力量
大小的力量
论颜色的重要性
对齐的力量
平衡定律
选择好的字体
清晰了解设计目标
下面我会集合一些案例来和大家讲解下
空间即我们常说的留白,当设计元素紧紧地聚集在一起时,界面看起来没有重点,因此需要和谐的运用它,空间的运用规则直接影响产品的性格,小空间和大空间在视觉感受上,两者完全不同,那么我们在界面设计中如何去更好的运用空间来设计排版。
有一个很好的方法就是可以运用网格去搭建空间,在平面设计中,运用得非常多,那么在用户界面中,同样也可以运用网格去搭建,下面看一个案例
如上图作者把一个界面分为4Gird,通过搭建好的网格来进行界面中元素排版,右侧是我拆解的图(备注:网格的搭建并没有任何强制性的规定需要搭建多少列,最终的搭建列数需要根据这个产品内容复杂程度去定义的)比如我最近在做车载HMI设计语言,同样也运用了网格,那么我会根据整个车载HMI产品复杂程度去搭建,同时也运用了几种网格配合使用。
上面两个例子我们可以发现 设计师运用了大空间来设计界面,这使得整个界面呼吸感更强,更透气,因为也是娱乐类偏杂文产品,所以设计会偏艺术化一些。
韩国29cm产品是我比较喜欢的一个app,整体设计呼吸感很强,留白空间大,视觉焦点清晰
我们都知道大的物体更吸引眼球,更容易引起我们的注意,那么在设计中,我们一般都会将重要元素放大,突出显示,
飞特游客
委托设计