如何让我的icon看起来差不多大?

用户头像
上海/UI设计师/3年前/132浏览
如何让我的icon看起来差不多大?

用一个简单的方法就可以让我画的图标看起来差不多大

【一些碎碎念】👇
刚入行UI的时候我始终画不好图标,那个时候页面图标画得一塌糊涂毫无美感,后来有幸接触到了有个课程讲到关于图标的制作,因此学会了让图标在视觉上看起来更具平衡的方法。我使用这个方法绘制了icon网格,在每一次进行图标绘制的时候直接复制过来使用,的确很好用。
但是最近关于icon的绘制重新困扰着我,那就是当图标多起来了,我就会忘记这套网格规范。如今开源的icon网站越来越多,赶工期的时候很多时候都是下载网上的资源直接改,项目走到开发那里我有时间重新梳理设计规范的时候就发现icon们自己玩自己的,毫无一家人的感觉。
今天花了“一点点”时间重新了解了一下图标绘制规范,不管是谷歌还是iOS看完都只剩懵逼,所以我还是使用原来的方法,等到时机成熟我大概就能明白那些关键线分割是怎么画出来的了吧。🧠🧠

画图标是先画出点击区域,其次是视觉区域

提取一个缩进值,缩进值=icon视觉区域*10%

⚠️注意:所禁止取整数、偶数,举例如果是4.4就取4,取最近的一个值

由此可得:
正方形:视觉区域减去缩进值就得到了正方形icon的尺寸
横向长方形:宽度为视觉区域的最大值,高度=视觉区域-2*缩进值
纵向长方形:高度为视觉区域最大值,宽度=视觉区域-2倍缩进值
圆形:视觉区域就是圆形尺寸

2
举报
|
2
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
Security Camera UI kit
【新年UI图标】30个图标
新能源APP应用UIKit
UI通用设计素材1
我的钱包-UI界面设计-app
【新年UI图标】活动icon
【新年UI图标】旅行icon
高级表盘系列UI源文件
【新年UI图标】体育icon
手表表盘UI系列
APP/小程序商业项目UI模板|99个高保真UI+79个原型
【新年UI图标】影音icon
户外旅行飞机情侣假日出行
3D卡通UI界面图标可爱插画免扣素
UI 登录界面设计模板包
智能家居中心 简约 UI设计组件库
【新年UI图标】礼物/活动icon
【新年UI图标】珠宝icon
拟物风质感写实UI卡片合集源文件
【新年UI图标】积分icon
新拟态风格 UI设计组件库
3D渐变流体抽象矢量UI背景图
高级感金属拟物 UI设计组件库
你可能喜欢
相关收藏夹
地产VI
地产VI
地产VI
地产VI
大家都在看
登录注册