Hermia days

怎样才能成为今天的移动的设计师?

Wrong™:

移动设备如今无处不在,它有自己的一套规则和限制。同时,这又是一个快速发展的平台,新技术和功能在逐年增加。我们不能像设计海报和网页那样的方式设计移动设备。那么, 兴旺移动端的设计需要怎样的条件和心态呢?


一、挑战和约束


每个媒体都有其局限性。


即使移动设备-这个最丰富的画板,设计师能梦想的仍旧是需要被解决一些这个平台特性的东西


不统一的设备


数不清的智能手机和平板电脑,每一个有不同的屏幕大小,像素密度,和物理输入(更不用说屏幕方向)。


这意味着我们不能预先假设以iPhone 5屏幕尺寸设计,然后仅仅抓住不放。在移动网络,响应设计允许我们为不同的变化做计划,使得设计可以适应不同的屏幕。在本地的移动设备设计中有较少的流动性,因此我们需要考虑我们的设计能允许不同的屏幕,并以文档的方式说明这样的变化会影响页面布局


不统一的操作系统


今天,我们有三个主要的移动操作系统考虑:Android,iOS,和WindowsPhone(按使用的次序)。


每个操作系统都有自己的一套接口模式,外部输入,和指导方针,更不用说系统版本之间的差异。


在Android里的事情更加复杂:Android设备的版本的使用将会受到这些影响:设备制造商;可以在设备上面覆盖自己的UI;设备本身和它的处理能力(甚至有些运营商企业带来的升级延迟)。


尽管这些不统一不会使设计变化太多,但他们影响用户如何体验一个操作系统和他们期许.


,例如,Android的体验,大多数用户实际上是TouchWiz触摸技术或 感应界面的体验。


 


性能


一个应用程序设计的方式可以影响能耗。


换句话说,我们的设计可以让我们的用户不带备用电源。


某些不必要的视觉效果和动画需要密集的图形处理运行;一个javascript密集型Web页面也会消耗大量的电能。


虽然我们新买的设备可能顺利运行应用程序,2年前旧设备可能会陷入困境。


这些例子只是来说明,移动设计师需要了解一个应用程序如何执行和使用设备的资源,来影响他们的决定,


开发和成本限制


就因为我们不久前看到它,很酷的新应用程序,这并不意味着它很容易实现。


设计应用程序的方法的选取可能会导致与结果失之交臂.


如果我们不清楚地知道我们所做设计决策的成本,我们基本上是在制造开发者的负担,甚至创造一个冲突的可能。


抛却旧观念


我们很多人在数码观念产生的早期,都已经接受过设计师的培训


这在历史上造成了从静态的角度去接近数字化设计(直接用Firewroks输出任何一个HTMLL?),并且导致偏差,因为设计学校仍然从这个角度去教学


移动端设计的差距甚至更大,移动带来了几乎所有我们现有的工具和方法不足以表达的问题。


所以是时候来转变一下思想了


手机不是画布


其实HTML也不是画布。


你不能像你设计一个海报一样乱加东西。


我怀疑用Photoshop设计不是帮助我们的钥匙,因为二十多年来我们一直用它来设计海报和插图和润饰照片。我们仍然“绘制”我们的界面,当屏幕尺寸分散和移动端的动态特性要求设计通往不同之路的时候。


放下静止的屏幕,开始考虑视图转换


一谈到设计我们就开始意识到“屏幕”的方法并不削减它变动时的设计。


这得益于像Facebook或Yahoo!这样的应用程序


例如展示不同天气的设计方式,我们知道我们需要设计基于试图转换而不是静态图像。


视图转换,曾经只是一次性养眼花瓶,现在正成为移动端体验的核心。


他们不仅只是生动,还增强界面的交互性:对自己合适的界面组件。


视图转换传达移动、空间变化,沟通和层次结构,并且 给用户与底层的应用程序结构交流提供一个很棒的朋友。


抛开你的设计师的自我意识


你不需要独特的或原创的,尤其是当“独特”意味着只是为了独特性重新设计一个已知的接口模式。


往往坚持本土UI元素和模式是让应用程序按时完成的最聪明的举动。


要专注于建立简单、有效的界面和创建品牌亮点,而不是你从零开始设计的UI控件。


为了寻找灵感,真正的应用程序比设计师作品集网站好


许多设计师去喜欢Behance或Dribbble上为他们的下一个移动项目寻找灵感。


你总会找到像绝佳艺术品这样网站,如果你不是一个经验丰富的移动设计师,这些模型可能会误导你。


他们中的许多是未曾实现的实体模型,而且他们可以使你的判断存在偏见 “让你相信你必须每次都要创建一个完全定制的UI。


要从真实的,成功的应用得到启发。


你会发现这样的设计让你的产品茁壮成长


他们的界面模式已经在现实中经过反复考验,然后你知道他们可以被复制。


学无止境


了解这个平台


就像做一个不错的网页设计师那样,你需要了解HTML / CSS一样,作为移动端的设计师,你也需要了解移动应用程序的底层结构,而且他们是完全不同与网页的。


例如,他们不像HTML / CSS那样有“滚动”的内容,并且那多种形式的变换,让我们应该考虑布局。


你没有神奇的CSS继承(至少没有那么光鲜的,并且不是立即可用的)以单独标记与显示。


哦,我差点忘了:这里也没有“标记”。


你需要深入一些适合于开发人员的文档,阅读手册,了解移动应用程序组装,编译和出版。


理解一个移动设备是如何工作的以及哪些是最消耗电的。


甚至从长远来看你可能需要学习一些基础代码:你可以学习开发人员的语言,这样你设计会有效率而且会考虑其可行性。


知道移动技术具体细节


这里有一个清单让你开始:位置服务(wi - fi和gps),蓝牙,低能耗蓝牙,灯塔,前后摄像头、麦克风、陀螺仪、加速度计、振动器、指纹扫描仪,眼睛跟踪、语音识别,人脸识别,等等,这样的例子不胜枚举。


每一个新技术打开了全新一代的应用程序的大门。作为一个设计你的责任就是要知道那最前沿的东西


 


探索本地组建,看看你能使用到什么程度


本地UI组件实际上给定制工作很多自由,但是你要确切的知道怎么使用它们。


如果你能做到对大部分本地UI控件做一点微调,你将会节省大量的开发时间,开发人员会感激你的。


 


知道移动设备的工作流程。


学习移动端的SDK,安装并运行它们。


了解移动框架,如RubyMotion,Xamarin, or Titanium


熟悉IDES,图表资源位于移动端项目哪里,他们应该如何命名,等。


 


学习移动接口模式


三大移动平台在如何理解移动交互设计上有着深刻的异同。


它们的用户对他们有不同的期望。


作为一个移动设计师,你应该完全意识到这些差异,并能够察觉到他们。


不要坚持做一个移动平台。


尝试所有三个,或者至少每半年使用一次Android和iOS


我做到了,而且做的不错,每个平台获得洞察力,你将几乎不会随便使用或看屏幕截图。


当然也需要适当的休息:执迷于其中,不利于手机设计师


 


文档说明和解释你的UI


因为界面不会告诉你所有的事情,你需要用文档说明不同的状态、视图转换、以及应用程序如何对数据对环境作出反应。


注解释你的原型,提供动画实例,并为手持设备预订方向。


 


UE设计阶段精益求精


现代设计师应该是一个战略设计师。


所以你的目标,并不是仅仅设计出一些美丽的东西,


是将已经了解了该产品的一切注入到设计里


优先考虑快速原型是为了更早的洞察到用户想要什么。


保存详细的艺术作品日后再看看。


确保所有的设计对准核心价值提案与用户需求。


 


实施阶段信奉敏捷UX.


你不能仅仅只是把原型交给开发人员,然后忘记他的存在,要知为大多数的图形需求将出现在开发阶段。


永远会存在以前未考虑到的界面,新的视图转换,很新状态,总会需要新的图形资源。


你需要时刻准备着回应。


所以坐在开发者旁边,时刻准备着在他们需要时设计。


确保开发人员只专注于开发,而不需要考虑用户体验


 


 


关于移动网络上一些额外的建议


对响应要有责任感


对于移动Web,响应设计并非一成不变的解决方案。


在某些情况下,有时候有道理,有时候又讲不通。


你的责任是知道手机端需要一个专门的解决方案,另外其中对一点响应的微调是不足以维持一个单一的代码库的。


即使你是“传统”的网络设计,也要计划你的布局,使它自如地适应不同的屏幕尺寸。


并且注意软件的大小:1MB大小漂亮的全屏背景图像可以让你的游客浪费流量。


 


小心使用CSS和JS美化。


是的,CSS动画、渐变过渡,阴影是很棒的并非常容易实现。


还有优雅的视差,加上所有酷的东西,这样对吗?


你要知道这些元素可以影响一个移动设备耗电量。


所堆积的,“活”的视觉效果越多,将消耗更多的能量。


甚至无辜的CSS3选择器影响低端设备的性能。


可能的时候宁愿使用ID的和类,尽量降低你的包含选择符。


所以,如果你可以用#submit 代替.main .container .form > div .submit,,这是一个好主意。


 


所有这些已经过时了


不是全部如此,但移动技术进展的步伐是令人难以置信的。


面对挑战我们已经没有时间了,可穿戴设备,智能家电,并且与移动端app对接。


每天都有新的东西产生


所以,作为一个设计师,保持活力,灵活,好奇会让你在这个过山车上保持一席之地.



评论

热度(22)

  1. Wrong™Wrong™ 转载了此文字  到 each other
  2. 10科四Wrong™ 转载了此文字
  3. ~orange。Wrong™ 转载了此文字
  4. gvegve_goodWrong™ 转载了此文字
  5. smile 然Wrong™ 转载了此文字
  6. 榕。Wrong™ 转载了此文字
  7. Hermia daysWrong™ 转载了此文字
  8. ylq1888Wrong™ 转载了此文字
  9. ^乖^囡^Wrong™ 转载了此文字
  10. littlelittlewanWrong™ 转载了此文字
  11. 香沫咖啡奶茶Wrong™ 转载了此文字
  12. PonphyWrong™ 转载了此文字