作者:差不多仙身(站酷)

原文 安卓UI设计系列知识(一) 链接:http://www.zcool.com.cn/article/ZNzEwMjg=.html

距离上一篇关于andoridUI的帖子已经有239天了,直到今天还有朋友点赞或是私信,或是沿着留下的QQ号和群号询问我有关andoridUI设计的知识,在此很感谢大家的支持。

搜集了很多朋友的问题,有一个比较明显的问题是现在网络上没有相关的教程or经验说明,书店里卖的相关书籍不是大篇大段的讲photoshop的使用技巧,就是讲一些宏观的问题,所以看到上次的帖子,很是有效。

打算写这次的教程是一周之前的想法,但是由于最近工作上忙碌,下班回家还要做私单(PS:求成都地区的web 或者 andorid或者ios的UI设计私单啦),真的没有时间整理头脑里的思路。

偶尔还是会回过头去看自己上次的帖子,还是会发现很多表达方面不够准确的地方,理工科的知识,力求一个严谨,准确的描述。在上次的帖子里,讲解的是andoridUI的设计入手方法和标注、切图方法,略显匆忙。今天开始,把与andoridUI设计相关的,andoridUI设计本身的,标准,切图等后续工作的,甚至是一些细小的工作经验方面的问题给大家分篇讲解下,具体多少篇,暂时没有预算,先写着走吧。

经常会在群里看到新人问:我如何转UI,每天坚持画icon吗?

就我个人工作经验来说,我大概总结一下“如何转UI,如何学好UI设计”几点建议,如果临时想起,我会在后面的章节里添加。

1.   一定要玩机器,玩APP。

你作为移动互联网行业中的一员,你不经常玩机器,玩APP,你是做不好UI的,

无论什么档次的手机,借周围朋友的手机看看玩玩。了解最近市场上火热的手机,看看它们的参数;同时,你要多玩app,各个行业的app都下载下来玩玩,觉得漂亮的界面别忘了截图下来,保存在手机里。在这里,推荐大家几个获得好app的途径,安卓市场里有:“ifanr”,“最美应用”,或是搜索微信订阅号“nice-app”,“appsolution”。

当然,dribbble,behance,pinterest,站酷,花瓣这些设计网站,也应该是你每天必看的。

2.无论是你iOSUI还是andoridUI,甚至是WPUI,一定要有一台测试机

不是说只有程序员才要测试机,咱们UI设计师也要有一台测试机,个人建议UI设计师一定一定要向公司申请,安卓方面,最好是超高清分辨率(720*1280)的,市面上这样的机器太多太多了,小米3,红米,三星note2等等,至于为什么,我们将在后面的篇幅里给大家解释。

很多时候,我们在电脑上画图,总觉得“尺寸够大了”“距离够宽了”“颜色够亮了”,但是一旦把设计资源交付给程序员,做出来的效果往往大跌眼镜。所以,作为UI设计师,在设计过程中一定要把效果图放在机器上查看,有时候,你真的会发现,原本“感觉”不错的稿子,在机器上查看,就走了样。在这里,推荐大家一个软件:PS play,下载地址:http://isux.tencent.com/app/psplay,具体使用方法见网站,这里就不做阐述了

3.培养一个靠谱的程序小伙伴。

很多时候,UI设计师在设计效果图中,或是切图中,把握不了所用的切图方式在程序里会不会出现预期的效果,是多磨希望能有一个即时的设备能看到运行的效果。我现在所了解的类似这样的软件有AppInventor,但是负责的操作,让设计师们还是有点搞不懂,如果网友有更好的推荐,请回复。于是我培养了一个靠谱的小伙伴,偶尔我把握不到的效果,我就把资源传给他,然后麻烦小伙伴按照所标注和解释的方法作出效果来看是不是自己所想要的。

4. 熟悉各个平台的UI设计规范。

每天坚持画icon是学习UI的一个小部分,画icon是锻炼一个UI设计师的耐心,造型能力,色彩搭配能力,质感表现能力等。除此之外,你还必须去了解,掌握,熟悉各个平台的设计规范,但是始终要记住,设计是视觉的游戏,不要沉溺于规范里,不要被条条款款约束了自己的灵感发挥。

5.将review做为UI工作的一个阶段。

老实说,在这个方面,我自己都做得不尽责,可能是因为工作时间久了,就懒惰了。或者说对于程序员的期望太高,很多时候,就懒得去看程序那边把UI实现出来的效果。

但是,在严格的公司,一定会有一个UIreview的步骤,看看程序最后实现的效果是不是和自己预期的一样。它产生在UI编程工作(这里谈到的UI编程就相当于网页的前端开发,写html,css等)结束后,如果没有配置专门的UI编程人员,那么就产生在开发结束后,作为UI设计师,对于程序实现效果的验收除了是对产品负责之外,也是提高自己UI设计能力的过程,因为很多时候,由于我们在设计过程中用到的单位和程序开发过程中用到的单位不同,或者说安卓设备各种分辨率不同,会带来预期之外的效果。所以,在工作中,把UI review做好,也能提高自己的UI设计能力,获得很多细小的设计经验。

有了以上几点准备,接下来我分享下一些安卓设计的知识。

北京时间2013年9月4日凌晨对外公布了该Android新版本的名称,为Android 4.4,代号 KitKat,接下来的文章里,我们都在此基础上进行讨论。

谷歌公司对于安卓4.4的规范官网地址是:http://www.apkbus.com/design/index.html(中文版)http://developer.android.com/design/index.html(英文版)个人建议在熟悉中文版的基础上,去看看英文版,毕竟老外的东西,翻译后的中文版比起英文原版有些地方表达和描述会不一样,甚至少了一些些细节的东西。

首先,我们谈“设备”,设备作为UI设计的大环境,也是一个andoridUI设计师最为痛疼的问题,主要涉及到各种设备之间的适配问题,在今后的篇章中,我会讲解各种设备的适配方法。

在最新的规范网址中,官方为我们描述了以下几种分辨率的设备:

我们从图中看到,有mdpi,hdpi,xhdpi xxdhpi,xxxdhpi几种分辨率的机器,如果我没有记错的话,官网在近期更新过这个网页,在4.4没有发布之前,还加入了最小的一个分辨率 ldpi的设备。

我们看到图中有一些说明“1x,1.5x,2x,3x,4x”。我们可以理解为相对单位或是倍数关系。在图中对于mdpi分辨率一栏有说明“basceline”,也就是说将mdpi作为一个基础,一个参考物,它为1倍的话,那么hdpi就为1.5倍,xhdpi为2倍,其他以此类推。

作为设计师的我们,要侧重关心的是横向分辨率,各种分辨率的设备其分辨率的数值为:

横向上来看:

mdpi: 360左右

Hhdpi:480左右(1.5倍)

xhdpi:720左右(2倍)

xxdhpi:1080左右(3倍)

xxxdhpi:1440左右(4倍)

这里需要说明一点的是:设备的尺寸和分辨率没有绝对的关系,不是说屏幕大的手机就一定更清晰。如果你的老板叫你“为某一个设备做设计并只适配它的分辨率,那你一定要去看的是它的分辨率,而不是它的尺寸。”

之前,我们说过,作为一名UI设计师,你一定要多玩手机,我们如何看一款手机,它到底属于哪一个分辨率呢?我举几个例子说明:

小米1,从网络上查到的相关参数,我们发现。它的分辨率为854*480(通常在描述分辨率的时候时候描述为Y轴分辨率*X轴分辨率),那也就是说,它的横向分辨率为480,属于hdpi分辨率的设备。

红米,从图中看到它分分辨率为;1280*720,也就是说它的横向上的分辨率为720.属于xhdpi分辨率的设备。

三星note3,1920*1280,横向上分辨率为1080,属于xxdhpi分辨率的设备。

我们再来看一组数据:

从数据中,我们可以发现。低分辨率的设备正在逐渐淘汰,Xhdpi或者xxhdpi等高分辨率的设备已经几乎成为统一的标准

只有了解“设备”这个大环境。你才能做好接下来的UI设计工作。

下期预告:安卓设计中的主题和风格问题,holo风格到底是什么?如何做holo风格。

我们下期见。

转载于:https://www.cnblogs.com/guhh/p/8534468.html

安卓UI设计系列知识(一) (转载)相关推荐

  1. UI设计培训之UI设计系统知识

    最近有很多小伙伴都在学习UI设计的相关知识,很多同学都是东边一学习一下,西边学习一下,根本没有明确的学习方法,对于这个问题小编为大家整理了一下学习UI设计的系统知识,一起看看吧! UI设计培训之UI设 ...

  2. android ui设计最新字体,ui用什么字体_安卓ui设计用什么字体

    1 ui用什么字体 UI中字体使用的关键因素. 1.可读性. ui用什么字体_安卓ui设计用什么字体,可读性是UI中字体所需考虑的首要因素.字母字形必须清晰可辨,作为UI元素,其中不同的字母必须可以被 ...

  3. UI设计系列——线性,面性图标制作day1-2

    UI设计系列--线性,面性图标制作 前言 制作一个用户图标 分析 技巧 制作一个下雨天的面性图标 确定大小层次结构 复制一层 绘制内部图标 绘制一个多角星 修改弯曲度 用椭圆添加弯曲形成雨点 修改颜色 ...

  4. UI设计系列——Figma基础使用day1-1

    UI设计系列--Figma基础使用 Figma下载 文档 社区(中国) 为什么选择Figma 汉化 基本操作 创建新设计 修改项目名 使用步骤 1.新建画布 2.添加页面元素 2.1 使用标尺(快捷键 ...

  5. UI设计入门知识有哪些 怎么掌握图标设计原则

    UI设计入门知识有哪些?怎么掌握图标设计原则?随着用户体验及审美度的变化,产品界面也在相应的改变,图标作为UI设计师的吸粉利器,被看做是世界上最通用的图形语言.如何才能快速准确地把握图标,掌握图标设计 ...

  6. 怎么学UI设计入门知识 图标设计要遵守哪些原则

    怎么学UI设计入门知识?图标设计要遵守哪些原则?随着用户体验及审美度的变化,产品界面也在相应的改变,图标作为UI设计师的吸粉利器,被看做是世界上最通用的图形语言.如何才能快速准确地把握图标,掌握图标设 ...

  7. pyqt 获取 UI 中组件_安卓ui设计智能输入法如何开发,这里有介绍

    安卓是目前国内使用人数最多的一种操作系统.很多人都在使用安卓的输入法.其实小编要告诉大家,学会了ui设计,你也可以设计输入法.今天就让小编为大家介绍安卓ui设计智能输入法如何开发. 安卓ui设计智能输 ...

  8. 一些实用的安卓UI设计工具

    应用的UI设计就好似达摩克利斯之剑,一方面,一个视觉.交互.体验良好的UI可以加强应用在用户心目中的形象和识别性.而另一方面,一个体验糟糕的UI设计不仅无法让用户沉浸在应用中,还会造成用户对应用产生厌 ...

  9. 多样、互动的WinForm UI设计与开发思路 转载

    多样.互动的WinForm UI设计与开发思路(Flash.Html等) 最近一年来一直在做WinForm相关的系统,对WinForm的UI设计有一些想法想和大家讨论(主要是比较忙,所以很多只是设想, ...

最新文章

  1. 《windows中GSX的管理》之四——cmware-cmd实例
  2. shell测试命令test、[ ]、[[ ]]
  3. Tor真的匿名和安全吗?——如果是http数据,则在出口节点容易被嗅探明文流量,这就是根本问题...
  4. Angular--TypeScript finalize 方法
  5. Codeforces 861D - Polycarp's phone book 字典树/hash
  6. stringstream和cin
  7. JNI教程与技术手册
  8. sscanf用法详解-hdu2072
  9. 训练日志 2018.11.14
  10. Java:对象创建和初始化过程
  11. 测量怎么显示坐标_测量员必须掌握的——全站仪坐标放样
  12. MySQL备份/还原 Unknown storage engine 'InnoDB'
  13. log4j的org.apache.log4j.PatternLayout
  14. 关于DIV+CSS和XHTML+CSS的理解
  15. 基于大数据挖掘----浅谈大数据与大数据挖掘
  16. AudioEffect构造流程跟踪 音效库实现(native侧)
  17. 交叉验证(Cross Validation)
  18. bi报表是什么意思,有什么优势?
  19. photoshop做立体字完整的图文版教程
  20. 【百科】喜马诺变速器

热门文章

  1. GStreamer 安装
  2. 《Unity3D平台AR开发快速上手--基于EasyAR4.0》随书资源和相关说明
  3. Windows Xming +Xshell 实现远程 linux gui 界面本地展示
  4. tidb-读热点造成的单kv负载高
  5. mysql 的常见语句总结和其他基础知识
  6. 华为:配置交换机console口验证
  7. 汽车企业如何在B站进行品牌营销?
  8. hmailserver php 收邮件,hMailServer 接收外部邮件并分发到内部邮箱
  9. 女友生日贺卡(网页),(女朋友收到后感动哭了,后来我也哭了)
  10. CF1539D PriceFixed(双指针+贪心)