童话说说技术创业美文职业
投稿投诉
职业母婴
职场个人
历史治疗
笔记技能
美文纠纷
幽默家庭
范文作文
乐趣解密
创业案例
社会工作
新闻家居
心理安全
技术八卦
仲裁思考
生活时事
运势奇闻
说说企业
魅力社交
安好健康
传统笑话
童话初中
男女饮食
周易阅读
爱好两性

一款APP设计的从0到1之:Android设计规范篇

6月2日 孤行者投稿
  之前U妹给大家分享了《一款APP设计的从0到1之:iOS精华篇》,今天U妹给大家带来的是Android的设计规范篇。
  Android的设计规范不同于iOS,Android是一个开源的系统,国内外有很多的手机厂商,这就导致了有非常多的Android机型,如小米、华为、魅族、三星等,每一家都有自己的操作系统,都有一套自己的UI设计规范。
  U妹列了一个小小的目录:
  一、基础概念
  二、Android界面设计规范
  三、Android切图标注
  四、安卓开发单位换算
  五、总结
  一、基础概念
  1、什么是DPI?
  DPI(DotsPerInch):每英寸点数,表示指屏幕密度。是测量空间点密度的单位,最初应用于打印技术中,它表示每英寸能打印上的墨滴数量。较小的DPI会产生不清晰的图片。
  后来DPI的概念也被应用到了计算机屏幕上,计算机屏幕一般采用PPI(PixelsPerInch)来表示一英寸屏幕上显示的像素点的数量,现在DPI也被引入。
  安装Windows操作系统的电脑屏幕PPI的初始值是96,Mac的初始值是72,虽然这个值从80年代起就不是很准确了。一般来说,非retina桌面(包括Mac)的PPI的取值区间在72120之间,因为这个取值区间能够确保你的作品在任何地方都能保持大致相同的比例。
  这里有一个应用实例:27寸Mac影院显示屏的PPI是109,这表示在每英寸的屏幕上显示了109个像素点。斜角长是25。7英寸(65cm),实际屏幕的宽度大概是23。5英寸,23。5109约等于2560,因此原始屏幕分辨率就是2560x1440px。
  屏幕密度计算公式:
  1080x1920px屏幕密度:
  2、什么是PPI?
  PPI(PixelsPerInch):图像分辨率;是每英寸图像内有多少个像素点,分辨率的单位为ppi,通常叫做像素每英寸。图像分辨率一般被用于ps中,用来改变图像的清晰度。
  二、Android界面设计规范
  1、Android各设备屏幕密度
  安卓尺寸众多,按每个屏幕去适配肯定是不现实的。
  所以为了解决这个问题,安卓手机屏幕有自己初始的固定密度,安卓会根据这些屏幕不同的密度自己进行适配。这一点内容掌握到能满足自己设计工作需要就可以了
  以下是Android的密度划分以及代表的分辨率,这里你可以发现已经和设计稿尺寸和切图输出开始挂钩了。
  安卓各屏幕密度
  U妹来带大家了解一下iPhone各设备的手机屏幕密度:
  iphone44S55SSE67320DPI
  2、Android开发单位DP和SP
  DP:安卓专用长度单位。以160DPI屏幕为标注,则1DP1PX
  计算公式:dpxdpi160px
  例:以720x1280px(320dpi)为例计算1dpx320dpi2px
  SP:安卓专用字体单位。以160DPI屏幕为标注,则1SP1PX
  计算公式:spxdpi160px
  例:以720x1280px(320dpi)为例计算1spx320dpi2px
  3、设计稿尺寸
  从目前市场主流设备尺寸来看,我们要用1080x1920PX来做安卓设计稿尺寸。
  以1080x1920px作为设计稿标准尺寸的原由:
  从中间尺寸向上和向下适配的时候界面调整的幅度最小,最方便适配。
  大屏幕时代依然以小尺寸作为设计尺寸,会限制设计师的设计视角。
  用主流尺寸来做设计稿尺寸,极大的提高了视觉还原和其他机型适配。
  所以做安卓设计稿时请以1080x1920px来做设计稿
  (sketch用户以540x960来做设计稿)
  界面设计控件尺寸:
  4、安卓图标尺寸
  安卓的图标相对iOS来说较少,我们只需提供一下几个尺寸就可以了,但是需要提高2套,圆角和直角各一套,因为有的地方都会用到。
  512x512px
  192x192px
  144x144px
  96x96px
  72x72px
  48x48px
  因为安卓有很多的机型,不同屏幕密度的手机对应的icon大小也是不同的,所以U妹这里没法给你给出相应的icon所被应用的位置。
  5、安卓设计字体
  英文字体为Roboto字体
  中文字体为思源黑体。在在Android5。0之后,使用的是思源黑体,字体文件有2个名称,“sourcehansans”和“notosansCJK”。
  思源黑体是Adobe和Google领导开发的开源字体,支持繁简日韩,有7种字体粗细。
  6、常见主流手机尺寸和分辨率
  三、Android切图标注
  1、标注设计稿时,使用px还是dp或sp?
  答:这个问题需要和安卓工程师沟通,推荐使用dp和sp进行标注(这里指的是在安卓设计稿的前提下)。但目前很多设计师对dp和sp这个单位并不理解,所以有些设计师提供安卓设计稿的时候依旧使用px进行标注,这一点去和你的搭档工程师进行沟通,如果不影响他开发以及他能换算清楚的前提下,你可以考虑使用Px,但是我并不推荐。
  这里要记住一点(你只需要记住能帮助你工作就可以):
  当屏幕密度为MDPI(160DPI)时,1dp1
  当屏幕密度为MDPI(160DPI)时,1sp1px
  像素字号屏幕密度160sp字号可以根据这个去算算设计稿中的像素字号标注为sp是多少,比如xHDPI下,36px的字标注为sp就是18sp,以此类推。
  按照不同的屏幕密度换算,也就是下图所示的意思:
  2。你需要提供几套切图资源?
  答:理论状态下,如果你想兼顾到目前还存在的各个机型,应该为不同的密度提供不同尺寸大小的切图。
  但这无疑提升了巨大的工作量,而且还可能浪费很大的资源空间,实际上,很多机型已经不占有主流市场了,而且很多奇葩的分辨率也没必要去考虑适配,所以,具体输出几套需要看公司的产品需求而定。
  通常我是这么干的:
  选取最大尺寸提供一套切图资源,交给开发工程师处理,适配到各个屏幕密度。
  这里要注意,这个“最大尺寸”,指的并不是目前市面上Android手机出现过的最大尺寸,而是指目前流行的主流机型中的最大尺寸,这样可节省很大的资源空间。关于最大尺寸选取多少,你需要和你们的安卓工程师沟通,每个安卓工程师对这个问题的结论并不同。(我的安卓搭档,让我提供XXHDPI的切图资源就好,我用的切图工具是Cutterman,切图一键搞定)
  3。Android的切图资源提供哪个尺寸给开发哥哥?
  答:iOS的切图有2x,3x之分,那么Android的切图根据dpi的不同,其实和iOS的类似,只不过是按照dpi来进行资源文件夹的命名,如下图:
  根据不同的分辨率进行切图归类,但是你看到了,如果切片特别多,提供5套切图岂不是要累死了?
  一般情况下,我们只需要提供3套切图资源就可以满足安卓工程师的适配,分别是HDPI、XHDPI、XXHDPI3套切图资源。
  目前我使用的办法就是只提供最大尺寸的切图,交给安卓工程师自己去缩放适配其他分辨率吧,所以和你的搭档沟通一下。
  其实现在绝大多数公司限于人力物力的限制,没有这么严格的工作方式,基本上就是一个文件夹,命名好了就提供给工程师了。
  这里还是提醒各位,没有固定的工作方式和方法,任何方式都是为了提升工作效率而进行的。
  4。在做设计稿时我们遇到的最多问题
  (1)用哪种尺寸做设计稿?
  iOS:用750x1334px来做设计稿。
  安卓:就目前的市场来看,XXHDPI属于主流机型;这样无论是标注,还是主流机型都能兼顾的到,所以推荐使用1080x1920px来做设计稿尺寸,这样即使你标注的是px,工程师也可以很方便的进行换算。
  (2)如何用iOS的设计稿去适配安卓(划重点啦)
  现在有一种情况现在非常普遍,那就是一稿两用;设计师都是做IOS版本的设计稿,来适配安卓,现在要给安卓用,应该怎么办?
  iPhone的屏幕密度已经达到xHDPI了,用750x1334px的尺寸做设计稿;
  实际上,7501334的3x的切图资源正好是安卓XXhdpi(1080x1920px)的切图资源;安卓开发用iOS的设计稿自己进行换算就可以了,前提是你必须和安卓工程师沟通。
  另一种情况:你可以把7501334的设计稿等比例调整尺寸到安卓10801920尺寸下,对各个控件进行微调,重新提供标注(用dp标注)。也就是说,你需要提供两套标注,一套给iOS的标注,一套给Android的标注。
  (3)大家可能还有一个问题,那就是我用cutterman切安卓图片输出的有drawable和mipmap2个文件夹,到底将哪个给开发工程师呢?
  答:以前用的开发工具,是只有drawable,没有mipmap的,后来新的开发工具里面才有mipmap这个文件夹,专门用来放png格式的图片的,不过drawable里面还是可以放png图片。
  所以现在我们给安卓工程师的切图输出文件只需给mipmap前缀开头的就好。
  四、Android开发单位换算
  1、安卓机型各种尺寸下的PX与DP、SP的对应关系
  2、字体单位SP与PX的对应关系
  3、距离单位DP与PX的对应关系
  五、总结
  关于《一款APP设计的从0到1之:安卓设计规范篇》就全部讲完了,希望可以给你有很大的帮助;U妹这里说的只是一种工作方法,好的工作方法才能自己事半功倍,在具体工作中也要灵活应用,一定要多和开发沟通交流,良好的沟通才是解决问题的唯一方法,有疑问题也可给U妹留言,我们下期再见!
  相关阅读
  iOS设计规范回顾:《一款APP设计的从0到1之:iOS精华篇》
投诉 评论 转载

关于卡片设计、分割线、无框设计的思考本文作者将对不同产品界面的布局样式进行分析和梳理,希望可以给你带来一定的思考enjoy每年都会有一波又一波的设计趋势流行起来,被设计师们追随和模仿着。大家总觉得迎合着趋势……一款APP设计的从0到1之:Android设计规范篇之前U妹给大家分享了《一款APP设计的从0到1之:iOS精华篇》,今天U妹给大家带来的是Android的设计规范篇。Android的设计规范不同于iOS,Android是……交互理论深度解析尼尔森十大交互设计原则在设计中的用法JakobNielsen(雅各布尼尔森)的十大交互设计原则。它们被称为“启发式”,因为它们是广泛的经验法则,而不是特定的可用性指导原则。因此,我们不能把它上升为一种标准,而是应……2018年移动端UX设计的12个趋势移动端APP的世界真的是瞬息万变啊,各种设计技法和新鲜趋势你方唱罢我登场,想要维持住产品的热度和关注度,设计师需要不断地学习和调整设计,应对越来越严苛的挑战。接下来,我会……制作设计指南时,一定不能忽视的6个关键点设计指南是最大程度提升设计团队输出效率和确保品牌一致性的核心工具,成功的设计规范并非一蹴而就,需要注意的问题并不少。对于一个网站甚至一个品牌而言,设计指南不仅仅是一份规范……智慧出行:汽车仪表盘交互体验设计分析(一)本文将从用户体验角度切入对汽车仪表设计展开分析。当前,移动设备在消费市场得到很大的变化从手机到可穿戴设备。移动设备越来越实惠,实现了前所未有的大面积普及。慢慢地,移……深入研究GUI和VUIGUI和VUI的差异来自信息维度、信息量大小、交互方式、内容驱动、任务类型等等,今天我们一起探讨一下GUI和VUI的差异,最后重点聊一下如何将GUI转化为VUI。今天我们……服务设计思维下节点转化思考服务设计是一种顶层思考方式。什么是服务服务即流程服务即无形体验流程,用户带着一定程度目标(明确目标、半精确目标、无目标)在特定环境下与对象完成序列互动。序列就是特定……实战复盘:天猫精灵全链路营销设计设计究竟是如何赋能业务,帮助扩大产品营销的效果的呢?文章通过实际案例为你解读。在刚刚过去的2017天猫双11全球狂欢节当中,一款网红爆款横空出世天猫精灵,在很短的时间内登……设计规范Web端设计理念篇设计团队的意义是能理解分析最终用户的需求,通过专业的设计手段、方法去实现企业战略解决相关问题。设计理念是设计的核心思想与运作原则,是为了明确设计团队方向,确保围绕着核心准……设计师如何优雅地回复需求邮件本文作者将结合自身经验与你分享设计师应如何优雅地回复需求邮件,enjoy工作中回复各种邮件数不胜数,设计师回复的产品需求邮件就是一类,以前回邮件时都是比较率性而为,并没有……基础篇网易设计师教你如何系统地优化APP如何把产品打磨的更加精致是每个UI设计师的目标,但作为设计师我们如何系统的去优化APP,让产品更有趣,我们可以一起来探讨下。一。为什么要视觉优化?大多数人看来从视觉……
看一个武侠故事,明白权限的那些事儿轻教育知识服务行业的破局之路OTA实战分解(1):快速阅读API及场景应用海外销售业务流程分析:产品关于数据埋点,你需要了解这些基本知识关于弹窗四大控件的3个问题订单履约:商品配送时效如何展示?弹窗设计的基本样式和10大应用场景类图是怎样炼成的?iOS13,暗黑模式不是所有产品都适合如何从0到1打造一款AI产品?掌握四个交互方式,提升用户体验实用的中秋节的月亮作文300字集合九篇员工个人工作计划民事一审审理期限是多久拼多多回应特斯拉降价4万是正品碧玉轩最好的朋友特别容易疲劳是为什么?空巢老人常见的心理疾病之抑郁症最美的平凡《大唐无双》手游冒险点获取方法A股反弹结束以后,后面很可能会出现大跌数学老师熬夜整理:数学几何60种图解公式,。。。

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找作文动态热点娱乐育儿情感教程科技体育养生教案探索美文旅游财经日志励志范文论文时尚保健游戏护肤业界