移动客户端UI设计经验(1)-流程篇

和pc端网站的设计和开发相比,移动客户端的开发工作,对绝大多数人来说,绝对是一个崭新的行当. 那么,当我们每天在iphone上,在各种安卓在各种pad上习以为常的刷着微博看着网文切着西瓜找着你妹的时候,当一大波人信心满怀的开始步入这个看似熟悉,或者说”简单”的工作中后,突然发现,悲催,完全不是那么回事嘛!
相信很大一部分产品或者设计或者开发人员是从之前的传统互联网”出家”过来的,当然,这包括我,还有身边很多很多人.
总之,这是一个坑,因为,APP,这个”看上去很简单”的东西,真心不简单.
下面分享一下在这一年多点的时间里,谈谈我的一些经验,水平有限,如有错误,欢迎指正.

本文偏技术流, 一共分两部分,一部分是流程,另一部分是设计经验及思路.以下是第一部分,我们看看流程这档子事.

1.前端工程师下岗啦!?

我们现在习惯于将某一个app叫做一个产品. 相对于web端的产品开发流程. 移动客户端的开发流程在某些流程上开始发生变化.
web端. 我们做一个产品. 从产品立项开始.
产品经理提出需求(原型等)>讨论需求>通过需求>交付设计师设计layout>确认>页面制作(俗称切页面)>交付工程师开发>修改细节及bug>上线.

移动客户端.
产品经理提出需求(原型等)>讨论需求>通过需求>设计layout(包括交互设计及ui设计)>确认>切图>交付工程师开发>后期修改>上线.

哦?好像差别不是很大嘛?
我们主要谈一下一些职位分工的变化. 前者和后者,在开发过程中,一些职位消失了.一些职位出现了. 对于我本身的理解,设计师更加的细分,虽然交互设计师在web端也会存在(分工比较细的公司),但客户端开发来说,交互却作为一个非常重要的一环出现了.对于寸土寸金的手机屏幕来说,对于开发者逻辑能力的要求也越来越高,如何在这么小的屏幕里对各种功能进行合理有效的布局显得更加重要.虽然在某些创业型组织中,设计师人数上仍然处于弱势,但对于对体验要求越来越高的用户来说.这绝对是个不能忽略的要点.

另外,我们会发现,前端工程师这样的传统职位在移动开发的流程中,消失了! 没错,是消失了! 设计师设计完设计稿,一般会直接进行切图的步骤.因为,我们知道,绝大部分的安卓和ios客户端,以及其他客户端,并不基于html(是因为效果和性能太差了吗?自己体验下吧!).所以,为我们悲催的前端工程师稍微的默哀一下(请与时俱进的做出改变吧!干爸爹!).

还是前端工程师,真的消失了吗? 不好意思,我错了! 慢慢的发现,他们的工作被另一个”前端”代替了.这就是我们可爱的程序猿同学.虽然传统的前端工程师并不能在移动客户端开发中发挥作用,但,有一点是没有变化的. 手机客户端里也是需要各种”布局”的,就像web页中的字体,图片等等的样式,各种对齐,这个还是要有人来做的.因此这部分工作,慢慢被开发人员所代替了.设计后期,对于各种细节的调整,转由这部分负责”界面”的工程师来和产品以及ui同学对接负责调整.

2. 谁来设计原型?

前面提到,手机客户端设计过程中的逻辑性比web产品的设计强不只一点半点.按照一般的产品开发流程,产品经理会在前期会使用各种原型工具如visio,axure等等来做出线框图.然后交由设计师进行ui设计.可是,根据之前的开发经验,对于网页还好,可是对于逻辑性极强的手机页面来说,这种方法并不会有多方便快捷,至少,这种静态的页面无法表现各种交互和信息的层次.如下图这样的结构,我是会晕的,而且也不是非常爱看.

当然,对于不同的团队来说,产品经理和设计师之间配合的方式都不尽相同.我们需要从中发现一种适合自己团队的配合方式. 对于迭代速度很快的app,小团队,首次开发的情况下,产品经理或者ue可以只画出app的框架及流程稿,剩下的交由ui设计师来设计也未尝不可,这样可以给设计师更大的发挥空间,虽然这样会给设计师提出更高的要求,但,相信一个负责任的设计师是非常愿意这么做的,这对于自身的提高帮助巨大啊难道不是吗? 另外产品经理可以腾出时间来做更重要的事情(产品的同学你们懂的..)

3.提高设计效率的神器

为了能对设计稿的交互有更深的理解,以及将更具象化的信息传递给开发者及其他人. 我们可以借助某些手段来提前做出一款APP来.
(1)flash.
是的,廉颇老矣,尚能饭否. flash这种神器做这个可是最合适不过的了.对于某些交互效果,如果在设计阶段就有分歧,我们可以考虑用flash将其实现出来,用于讨论或者演示.但.flash的缺点也非常明显,开发出demo的成本实在是,有点高.另外,不要妄想在手机上可以看到直观的效果了.

(2)快现.

一款号称手绘原型,拍照并在手机上制作交互的软件.但不知道为什么没能流行起来.不过如果单纯只是在手机上来将各种交互全部穿起来的话,效率确实低的可怜.