美文网首页UI设计头条UI@认知·互联网
「设计规范」Icon的规范线到底是什么

「设计规范」Icon的规范线到底是什么

作者: 西城sakura | 来源:发表于2018-12-24 00:46 被阅读1338次
辅助线规范做图

大家好我是西城,今天我想说一下我们经常见到icon规范线到底是什么。

我就不说太多废话了,只直接说是什么吧。

\bullet 规范辅助线由三个形状组成:正方形、长方形、圆形

规范主要目的是保证图标占的面积相等,先来看看下面:

长宽高一样的三个图形

这三个正方形、圆形、三角形在我们视觉上看起来是相似大小的,再看看下面:

把他们放一起

放在一起看发现所占的面积不一样,所以这就是为什么我们做icon的时候,做的图标都是一样的宽高,然而看起来一个大一个小的原因,就是面积不一样造成的!

尺寸不协调!!

怎么办?

\bullet 那么规范就是要保证图标面积一致就行了!

一个园+两个相同的长方形+一个正方形

接下来我们就算面积吧:

我在这里给大家我已经算好1024尺寸的数值,大家只需要在sketch里做出1024尺寸的辅助图,以后都可以套用:



接下来可以再进行辅助线延展,依次增加辅助线

有助于精确绘图 垂直水平线

接下来就可以绘制icon了

绘制icon规范依次于:



正确设计规范


在AI里可以把画好的规范线按⌘(ctrl)+5变成辅助线,以便于绘图

最后总结一下:

在设计过程中,记得再预留一定的安全空白区域,正确使用辅助线不仅可以规范你的icon,还可以增加你设计的说服力。

谢谢大家~

相关文章

  • 「设计规范」Icon的规范线到底是什么

    大家好我是西城,今天我想说一下我们经常见到icon规范线到底是什么。 我就不说太多废话了,只直接说是什么吧。 规范...

  • 素材网站

    图标设计 图标学习方法 绘制功能性图标 系统学习功能图标 icon尺寸 icon规范 icon画法 金刚区设计规范...

  • MySQL数据库开发规范知识点速查

    数据库设计规范 命名规范 基本设计规范 索引设计规范 字段设计规范 SQL开发规范 操作行为规范 命名规范 对象名...

  • [Android] ICON的设计规范

    应用的图标应当是一个 Alpha 通道透明的32位 PNG 图片,根据不同的 DPI 设计几种不同大小,具体规则如...

  • 华为PCB设计规范和上海贝尔pcb设计规范

    华为PCB设计规范和上海贝尔pcb设计规范:华为PCB设计规范:

  • 安卓设计规范

    在讲安卓设计规范之前我们先来看看一下的问题: *规范是什么? *规范的目的是什么? *怎样进行规范? 规范是什么 ...

  • 常用设计规范及文档matt325

    公路桥涵通用设计规范 公路路基设计规范 公路工程设计规范 公路桥梁钢结构设计规范 公路路线设计规范 公路桥梁抗风设...

  • iOS的设计规范所传达出的设计理念

    iOS的设计规范所传达出的设计理念是什么?

  • Mysql 规范

    Mysql 规范 数据库命名规范总结 数据库基本设计规范 索引设计规范 数据库字段设计规范 数据库SQL开发规范 ...

  • 阶段性规划

    2016.12.08-2017.2.18 (1)完成结构设计规范学习:《混凝土结构设计规范》、《钢结构设计规范》、...

网友评论

    本文标题:「设计规范」Icon的规范线到底是什么

    本文链接:https://www.haomeiwen.com/subject/bgvokqtx.html