恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
UI设计师在只做安卓应用时该怎么去做
0.0°
2018-09-20 原创文章 经验/观点 举报 5134 48 36 2


       本人是一名已经入职一年多的UI设计师,接手的第一个项目就是只用于Android平台的应用。因为之前只接触过iOS的设计规范,一直觉得两者区别不大,但是在真正参与设计的过程中,才发现Android真的需要你去操心(不然会把开发坑死,而且不止一次)。接下来我会分四个方面去阐述当我们单独设计Android应用的时候该注意什么:


 一、当我们在拿到一个只需用于Android平台的设计需求时,首先我们要看产品经理给的PRD(产品需求文档)里需要适配Android的哪些版本,Android如今已经升到了6.0以上版本:

     

1. 如果只适配5.0以上的话,Material Design(以下简称MD)的设计规范完                全用得上,MD是谷歌自Android 5.0发布的一款设计语言,堪称媲美苹果的              设计。

2. 如果需要还适配4.0的版本的话,就需要知道MD设计中哪些在开发过程中会              增大开发难度(比如说阴影)。

Image title


二、Android设计稿的尺寸有两个常用的分辨率 : 1280*720/1920*1080,我建议和产品商量一下用那个比较合适一点。而且还需要知道常用的MD设计规范,像有些一直在做iOS的设计师们,做Android设计稿时会直接套用iOS的规范,但是在Android里用MD会在多分辨率下使用更加流畅,开发的时候也会更方便。

       

1. 这里,我想说并不是什么应用都可以用MD的,例如:淘宝那种资源信息庞               大的应用就不适合。一些效率工具,视频,音乐等类型的应用是可以用的,               这里大家可以去看看网易云音乐,知乎,还有自带黑科技的谷歌翻译。

2. MD的基本布局规范:一切距离、尺寸都应该是8dp的整数倍

               1)状态栏高度:24dp

               2)标题栏(Appbar)的最小高度 : 56dp

               3)底部导航栏:48dp

               4)侧栏到屏幕右边的距离:56dp

               5)卡片的间距:8dp

               6)屏幕左右的对齐基线:16dp

   注:关于其他常用的MD规范还有dp、sp的换算我会在第二篇文章中单独说明。http://www.ui.cn/detail/230647.html   点击进入

 3. 如果你是一名职场新人,在设计过程中一定要多多和开发去沟通产品流程,交            互逻辑。因为有的公司没有产品经理,原型图和交互都需要UI去设计(这也是            很大的工作量啊),所以很容易会忽略一些流程细节,我一开始在做的时候就            会把加载失败,刷新的页面给忽略。而且一定要有问题就赶紧提出来,不要怕            做错了就不敢去面对,大家都是成年人,不必搞得那么拘谨(太害羞的话搞不            好开发哥哥以为你想捡肥皂)。

4. 例如汉堡包菜单,搜索,更多之类的icon,还有加载数据,刷新之类的控件,            除非产品需求要我们自行设计,那么完全可以拿Android官方原生的直接来                用。

5. 我们要对基本的开发框架结构有所了解,这样对做设计稿和标注帮助很大,很           大程度上会减少我们的返工次数,在标注的时候出现尽量不要出现小数点。

6.每个页面切记不要出现跳帧哦。


三、待设计稿经过审核之后,接下来就是切图了,基于Android手机的多分辨率,我们主要输出的有四套切图,分别是mdpi、hdpi、xhdpi、xxhdpi,也有xxxhdpi,但现在几乎用不到。这里我推荐一个大家都知道的切图工具:cutterman,我相信参加工作的都知道这个插件,在切图之前需要:

         1.点击“设置”。     Image title

           2.自定义输出比例选择“Android”(它默认的是iOS)。

Image title


3.设置当前基准,我这里设置的是“xhdpi”,原因看下图,密度/分辨率匹配表。

4.其他的不必去调整。

Image title

切图输出之后需要检查一下每个文件夹的切图大小是否有错误,以防万一。

       

点9切图:在Android中为了避免一些控件拉伸变形,需要设计师去切“点9图”,点9图可以让图片在各种分辨率下,不管上下/左右拉伸都不会变形,我所知的有三种切法:

         1. 在ps里切,我没试过,据说很考验眼里和耐力。

         2.用cutterman,我给我们开发切过一次,不能用啊,不知道其他小伙伴们试               过没有。

         3.下载一个软件——“ Draw9-patch”,具体怎么切这里就不写了,可以问问             开发,或者是私信我交流交流。

           注:同一级的icon切出来大小要保持一致,别忘了控件的各种状态。

四、最后说的就是标注了,这里主要向小白设计师传授一下,不要把标注想得很简单:

       1. 在遇到不知道怎么标的时候一定要问开发,因为我们对开发框架代码了解的少之又少,开发过程中他们对层级要求很严格,所以要按照框架去标标注中尽量不要出现小数点,如果出现的话,可能是你设计稿中某个间距和大小没处理好。

      2. 介绍一个标注工具——“像素大厨”(还是亲爱的开发介绍我用的,当时太菜),它里边可以把px一键转换成dp,就不用我们再去算了。现在的版本可以直接把psd文件丢进去标注,而且和ps是同步的。

       最后我建议对MD感兴趣的话最好把官方设计文档读一遍,里边对尺寸规范,高度阴影,标注都有帮助。本文有什么漏写的,有其他建议的,欢迎提出来,一起进步!We Fight!

                                               

                                  谢谢你们耐心的阅读




更新:2018-09-20

收藏

48人已收藏

鼻子打不开

加班炼成泪水,是一种勇敢

  • 5

    作品

  • 62

    粉丝

  • 21

    关注

  • 小麦智能家居APP
  • 来聊聊安卓平板适配问题
  • Spider-man小插画+小动效
  • Material Design在项目中常用的设计规范和解析

    猜你喜欢

      2018-09-20 原创文章 经验/观点 举报 5134 48 36 2

      UI设计师在只做安卓应用时该怎么去做

      0.0°

      你确定要举报UI设计师在只做安卓应用时该怎么去做

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年04月11日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      36
      48
      2

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录