Google FORM SF:好的设计工具还是挺重要的

google-form

我们与设备的交互方式已经多种多样,但是设计工具还很原始,根本没法达到现在的需求。传统方式是设计师搞了几张设计图然后交给工程师,等了几周得到一个可运行的原型,终于发现自己多么愚蠢,然后改改改,工程师陪着设计师一点点调效果(为什么部分开发工程师不喜欢调节界面的 UI 细节?)……这种方式很是不科学。从去年的没有任何设计工具到今年设计工具遍地开花,全世界的设计师们都意识到了这个问题的严重性,通过不同角度设计了很多不同的工具,来帮助自己在设计时就可以获得完整的使用体验。

 

FORM SF 2014- Panel – Design Tooling (720p)
http://v.youku.com/v_show/id_XODI4NDMwMDUy.html

 

参与讨论的人们:

  • Adam Debreczeni:Form Co-Founder
  • Brandon Walkin:Origami、Paper 设计师,Facebook 产品设计师
  • Clark Valberg:Invision CEO
  • Koen Bok:Framer 的父亲,前 Facebook 设计师,sofa 创始人
  • Paul Colton:Pixate 的父亲

 

为什么想做这些工具嘞?

Adam Debreczeni(Form):当时公司在做一个项目,是一个 3D 编辑器,每次与客户沟通的方法都是:要么发送 MP4 文件(没法交互),要么发送 PNG 文件(根本不知道界面上该如何操作)。带来了很大了沟通成本。 于是先做了一个内部工具,后来跟业内其他人沟通时发现这是一个普遍存在的问题,于是就想把它做大啦。

Paul Colton(Pixate):在决定要做一个设计工具之前,与很多公司设计团队的人都沟通过,Twitter、Pinterest 等。问了他们非常细致的问题,比如「你们在设计过程中有什么不爽的地方?我们来给你解决。」

Koen Bok(Framer):当时在 Facebook,只是单纯地想做一款能让我工作更高效更快的工具。于是尝试着使用了一些工程师用的东西。后来想,如何能让程序帮助别的设计师来更好地解决问题呢?然后就做了这个东西。

Brandon Walkin(Origami):Mike Matas 加入 Facebook 时带来了 Quartz Composer,当他用 Quartz Composer 做出动态原型时我们都吓哭了,因为从前从来没有见过这样的东西。于是我们意识到,这才是未来几年内设计应该发展成的样子。我们也开始尝试使用 Quartz Composer,但是它太老了,而且本来也不是专门用来做设计的,于是我们将界面元素加入了 Quartz Composer,做了 Origami,并且用它做出了 Paper。

Clark Valberg(Invision):设计师需要知道终端用户、其它设计师、公司 VP 等使用他们的设计的反馈来看设计的好坏。我们觉得设计师需要一个地方让这些讨论&反馈都可以发声,而且要是一个低成本的方式。好让产品更快迭代。

 

为什么这些工具这么晚才诞生?

Paul Colton(Pixate):我觉得与现在的扁平化设计大潮有关。之前的设计会比较注重纹理啊、阴影啊等等。但是自从苹果说「好,我们开始扁平吧!」,以前能去着墨的点,现在没有机会了,就把更多的重心转移到了动画上,依靠动画来补充纹理啊阴影啊等带来的效果。现在设计师都不会问「怎么处理这里的纹理阴影啊」而是会问「怎么制作这里的动画啊」。所以我们之前没有出现,而现在一股脑出现了这么多,是有道理的。

Brandon Walkin(Origami):做 Facebook Home 之前,我逢人便说 Quartz Composer 好厉害啊!但是没人鸟我。后来有一天我们的设计主管 Julie Zhuo 写了一篇 Blog,里面提到说 Facebook Home 是用 Quartz Composer 做出来的,那时我第一次感受到了设计界巨大的改变。

 

为什么我们不用基于时间线的工具呢?比如 Flash 或者 After Effects。

Koen Bok(Framer):如果建造交互工具的话,那么时间并不是不变的。状态随着时间在变化,所以 timeline 这种方式并不高效,如果你要做比较长的交互的话。

 

那为什么大部分的设计师,仍然在使用基于时间线的工具呢?

Koen Bok(Framer):那些工具是由很多前辈创立的,它们在某些方面还是非常出色的。并不是说因为我们存在了,After Effects 就要被淘汰了。但是我们工具的发展方向可能是将 After Effects 中特别出色的地方逐渐的整合或者在我们的工具中支持。

Paul Colton(Pixate):我们被要求了一万次让加入 timeline,但是有交互就意味着你无法预测用户的下一个行为是什么。或许用户又返回了上一次操作?所以加入 timeline 是木有意义的。

Adam Debreczeni(Form):我们内部讨论过很多次是要用 timeline 形式还是用一种更具交互性的方式。我们认为去掉抽象化的东西在你尝试新的想法时非常有帮助。我们的做法是,你可以直接在你需要的元素上拖动来变更它的弹跳程度,做这些用 timeline 的方式就很麻烦。

 

像 Form 和 Origami 这种学习成本较高的工具,应该怎样帮助他们呢?

Brandon Walkin(Origami):Quartz Composer 的界面非常吓人是真的。但重要的是它可以实现任何东西,你的想象力可以在这里得到充分的发挥,连我们也不知道你会在这里做出些什么样的东西。

 

Sketch、Photoshop 这种这种没有引导的工具和 InVsion 有明确引导的工具对设计会有什么影响?

Clark Valberg(Invision):我觉得产品设计有三个维度:1、美学维度 2、交互维度 3、故事性。每个产品都在无意识地让你去集中注意力在其中一种维度,InVision 呢就是会强调产品故事性的一款工具。我们觉得,产品界面决定用户可以去做哪些事情,交互方法决定了用户可以怎样使用它,但是一个产品的故事性才是决定着用户会不会去使用它的因素。

Paul Colton(Pixate):你并不需要一个复杂的工具来生成复杂的产物。比如笔。笔非常简单,但是你可以用它来画出非常复杂的画。我们的产品也是遵循着这个原则:产品要非常非常简单,但是它绝不会遏制你的想象力,你可以用它做出非常复杂精美的东西。而且我们希望我们的产品不会影响你使用我们的产品做出来的东西的样子和风格——我们希望你做出你脑海中的产品,Pixate 只是那只笔而已。

Adam Debreczeni(Form):Form 一打开也是一张空画布。我们做 Form 时的一个工作重心即是:如何制作更加连贯、一致的系统?由于所有东西都是连贯一致的,你之前用 Form 做出来的东西都可以复用。你可以制作你自己的 patches。渐渐的,你面对的就不再是刚开始的空白 canvas 了,你已经建立起一个自己的系统了。

 

你们的工具是着重于设计周期中的某一点还是全部?

Koen Bok(Framer):我们经常被定义为一个「微交互工具」。但是我们希望它是可以用于整个 app 的设计过程中的。

Brandon Walkin(Origami):在 Facebook,我们会在设计初期就开始使用 Quartz Composer。我们通常拿给 Mark 看的是和开发出来的功能和界面无异的高保真原型。

 

未来设计工具会成为一个大而全的平台还是一个个独立的小工具?

Koen Bok(Framer):对于设计师来说,有多重选择总是好的。曾经有很长时间所有设计师都在使用 Photoshop,但现在很多人都已经在尝试使用其它多种多样的工具了。我很惊讶我们这些新工具有这么多种不同的方案解决思路,我认为未来的设计工具应该是一种很聪明的平衡,包含了多重设计需求, 而且或许学习成本并不高。

 

如何处理不同设计工具的数据?

Paul Colton(Pixate):毫无疑问现在的设计工作流有个很大的缺口。我不认为一个工具能完成所有的设计工作,我也不认为设计师希望能够用一个工具完成所有设计工作,否则就不会出现 Sketch。我们现在面临的挑战,以及我们的愿景是:希望能够用一种更好的方式补上「把一个工具中的内容转移到另一个工具中」这个让人烦躁的缺口。

Clark Valberg(Invision):我认为 aesthetic authoring 会出现在现在的工具组中。虽然现在还未实现,但是我觉得会实现的,到时候所有数据会汇集在同一个地方。

Paul Colton(Pixate):工具一体化还是挺重要的。我觉得需要解决的是不同工具间更加流畅的数据转移工作,让工作流更加顺畅。

 

我们离在设计工具里直接实现产品的开发还有多远?

Adam Debreczeni(Form):我觉得非常近了!Form 就是想做这个。不远的未来,你就可以直接把文件加载到 Xcode 中,然后给工程师,这样就避免了转译过程的数据丢失。

Clark Valberg(Invision):我觉得这个还是挺难的。即使你的工具可以直接生成对应的 code, 但它离真正产出可用的产品还远呢。总的来说,比你想象的要复杂很多。

Brandon Walkin(Origami):同意

Koen Bok(Framer):同意。但是在设计-开发这个过程中,还有一些没有解决的问题,我们其实可以做得更好。比如现在可能有人还在发送压缩文件吧,其实挺傻的…

 

Google FORM 背景介绍

Google FORM 是 11 月由 Google 在旧金山办的设计大会,主题涉及设计教育、招聘、工具、创新等等,与会者来自 Google、Dropbox、Framer、Uber、Pixate 等公司的酷炫人士。

  1. Google 设计副总裁 Matisa Duarte 和彭博商业周刊首席数字内容官 Joshua Topolsky 的对话
  2. 视频合集:FORM SF 2014
  3. 照片合集:FORM SF 2014

 

文章编译来源:知乎专栏
顶部图片来源:http://www.google.com/design/form/#main

 

 

发表评论

您的电子邮箱地址不会被公开。