赞助商
立即赞助

既能用于排版还能用在图标的两个小技巧,快来收下!

UI设计3年前 (2021)更新 流光
4K 0 0

有时得做的图标有点奇怪,但又不道哪里奇怪,今天就来分析两个原理,看看有谁中招!

亲密性

排版有四大原则,其中有很重要的一项就是亲密,举个简单的例子,下图灰是背卡,白是信息内容:

既能用于排版还能用在图标的两个小技巧,快来收下!

按照亲密原则,信息内容应该是一个整,他们之间的关系更加亲密,所以它们之间的内间距(蓝),应该是小它们与卡的外间距(红):

既能用于排版还能用在图标的两个小技巧,快来收下!

果,我们把间距颠倒,效果就变成样:

既能用于排版还能用在图标的两个小技巧,快来收下!

是不是有点奇怪!

其实图标的时候,时也会用到这知识点,比如之看到一星友的删除图标,效果如下:

既能用于排版还能用在图标的两个小技巧,快来收下!

中间的两条竖线应该内部内,它们的内间距就应该小于外间距:

既能用于排版还能用在图标的两个小技巧,快来收下!

当然,这间距相同也 ok 的,咱们就别把内间距于外间距,然后的太离谱就好。

如果这个案例不够显,咱再整一个更显的,在做“笔记本“、“目录“图标的候,有候会做成一个矩形,然后面加条线:

既能用于排版还能用在图标的两个小技巧,快来收下!

这条线的内间距是不是应该于它矩形的外间距,比如这:

既能用于排版还能用在图标的两个小技巧,快来收下!

如果间距反过来,就会成这:

既能用于排版还能用在图标的两个小技巧,快来收下!

这回显了吧!内部西散,导致整体不够致。

实仔细观察,这个图标例子和才那个版的例子全是一事:

既能用于排版还能用在图标的两个小技巧,快来收下!

一个原,那就是——亲密性!

很要,大家定要多多理解实践!

密集节奏

密集节奏是我们很容易犯的错,如面这个图标的原作看起来密集节奏就较和谐:

既能用于排版还能用在图标的两个小技巧,快来收下!

但是当星友摹后,效果如:

既能用于排版还能用在图标的两个小技巧,快来收下!

我们抛开饱满谈,就在密集这一,这个地方离的太:

既能用于排版还能用在图标的两个小技巧,快来收下!

导致那里过于密集,两条线快合二为一了。

再比如,下这图标,我们先看临摹效:

既能用于排版还能用在图标的两个小技巧,快来收下!

是不是这两个地都太密了:

既能用于排版还能用在图标的两个小技巧,快来收下!

也是线条快合为了,我们再看看原作:

既能用于排版还能用在图标的两个小技巧,快来收下!

家这节奏感好很多。

举个例子,组图标:

既能用于排版还能用在图标的两个小技巧,快来收下!

整临摹优化的还不错,但是就是有一个比突兀,就是它:

既能用于排版还能用在图标的两个小技巧,快来收下!

我不说,大家应该也能看出来,灯泡下面里太密集,其他地方舒服,只有里有点难受。

这就家常犯的一密集节奏的问题,家多多注意。

好了,今就这多,大家可以好好消化下,尽量避坑!

注作者的微信公众号:「菜心设计铺」

既能用于排版还能用在图标的两个小技巧,快来收下!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

很多设计师经常说,现在扁平化风格盛行,很难做出亮眼的设计。因此,我把我一直都在关注的杂志风格,做一次分享。关于杂志化 ...
ui设计
前言 相信研究过直播间的同学都知道,直播间的装修样式是观众进入直播界面后,信息接收占比最大的一部分,对用户体验有着最直...
直播设计
内容营销是如今在产品设计、运营和客户转化领域最关键的手段。而在 2020 年在疫情的影响下,内容营销的重要性得到了进一步的...
产品设计
编者按:完整的 UI 设计流程到底是怎样的?从需求到产品上线,要经历多少个阶段,每个阶段有哪些应该掌握的基础知识,本次优...
ui设计
作为一名在互联网行业摸爬滚打好多年的一位 UI 设计师,也在团队里带过众多 UI 设计师和实习生,所以深刻认识到无论于团队还...
UI
编者按:看似简单的投影,在高手眼里有千万种变化。不信看看今天这篇文章,让资深设计师教你做投影设计! 在今天的 UI设计中...
APP UI
编者按:为另外一个国家的客户以及用户设计应用的时候,文化的碰撞总是免不了的。当 Tubik Studio 面对中国甲方的时候,同样...
App设计
9月4日,Google 终于发布了Android 10的正式版本。此前的内测阶段它一直以 Android Q 的名字示人,无论是交互、使用体验的优...
Android 10