Android桌面图标圆角切图分析

用户头像
北京/UI设计师/8年前/13132浏览
Android桌面图标圆角切图分析

对于安卓桌面图标圆角切图设计多大才合适分析

本文章只用于设计交流,不可用于任何商业目的。部分图片来自网络,如有侵权请联系本人删除。如转载需联系本人,并标注出处。


近期整理公司规范,发现Android桌面图标也需要制定规范。是因为公司有多款产品,但是在同一手机平台上展示的圆角各不相同,这里所指是对桌面图标不进行统一剪裁的手机平台。 因为我们公司桌面图标样式使用大圆角更合适,那么就遇到了问题—这个圆角设置多大才在安全值内。下面我会解释为什么会出现安全值这个概念。 


因为安卓手机品牌太多,每个手机品牌系统不同可能对桌面图标的处理也不相同,并不像ios系统直接提供直角即可。需要先搞清楚对桌面图标进行统一剪裁的手机平台规范,就可知道圆角设置对大才能保证在这些平台可完全匹配,不出现白边黑边的情况。

了解到会进行统一剪裁的手机平台:小米的任何一个系统都会进行统一剪裁,oppo的一些系统、华为的一些系统(以本人拿到的安卓测试机为依据,并不是完全统计,除了小米手机,其他的安卓手机在网上没有查到规范)。小米手机给的规范只是市场应用里面完美图标的规范,也未提到桌面图标圆角的规范。


下面是我的解决方法。在多个统一剪裁的手机里面装上一些用户多的app进行比较,看是否都完美的匹配未出现白边黑边的情况。比较了淘宝、京东、qq、支付宝、微信、腾讯、爱奇艺、小红书等。发现除了小红书其他的app都未出现问题,那么就可以肯定小红书的圆角大小是不安全的。下图为从apk包里找出来的桌面图标切图,以下4个尺寸为开发包里所需要的切图尺寸。


发现在96x96px尺寸下圆角为20px占到了42%,那么21px-22px是否能保证完美匹配?可以将圆角21px和圆角22px的切图输出给开发小哥哥,放到包里然后在测试机上检验,发现在小米手机上会出现白边黑边的情况。那么可以得出结论在96x96px尺寸下圆角小于等于20px为安全值(这个安全值并不能说明可以包含所有的安卓手机,毕竟安卓手机品牌太多系统版本也是很多,但至少可以涵盖大部分主流安卓手机品牌。)


选用这个值也有一定道理,会发现20px这个值在各分辨率等比缩放下都能保证圆角是整数。

以下为小米官网对于桌面图标做出的最新规范更改说明。这次的更改对设计师还是有影响的,1.为保证更好的图标质量切图尺寸比之前要大。2.需注意缩放剪切规则,以保证图标内容显示完全。

详情可查看小米开发者平台 https://dev.mi.com/console/doc/detail?pId=1162

75
举报
|
101
分享
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
3D渐变流体抽象矢量UI背景图
Security Camera UI kit
【新年UI图标】影音icon
【新年UI图标】体育icon
高级表盘系列UI源文件
【新年UI图标】30个图标
APP/小程序商业项目UI模板|99个高保真UI+79个原型
【新年UI图标】旅行icon
【新年UI图标】积分icon
手表表盘UI系列
【新年UI图标】活动icon
盲盒APP UI设计
高级感金属拟物 UI设计组件库
【新年UI图标】礼物/活动icon
科技医疗透明柜UI界面设计
【新年UI图标】珠宝icon
UI通用设计素材1
智能家居中心 简约 UI设计组件库
新拟态风格 UI设计组件库
拟物风质感写实UI卡片合集源文件
钱包ui模板
UI界面 组件
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
你可能喜欢
大家都在看
登录注册