趋势网(微博)讯:让我们一起快速浏览一下设计者和工程师们是如何开发UI功能的。
樊振东宣布退出世界排名 疑似可可西里网红狼被大货车压死 满洲里市领导被指与举报者互骂 徐娇劝阻男子抽烟餐厅道歉 赵露思坐轮椅
Tumblr创意总监Peter Vidani
曼哈顿扁铁区Tumblr办公区外,纽约城的噪声轰鸣。办公区内部,Tumblr总部充满了相当强烈的嗡嗡声。今天,我被员工带到工作区的四条狗包围着。很明显,还有更多的狗潜伏在垂直排的课桌后面的某些地方。而更令人觉得整件事很诡异的地方在于,这些狗都不会发出声音甚至狂吠。就好像有人告诉了它们这里有设计者和工程师们在工作一般,总之无论如何它们也就这样表现着。
我在这儿采访Tumblr的创意总监Peter Vidani, 他将会为我们揭开Tumblr设计过程及用户体验的神秘面纱。我所谓的设计过程,并不只是只配色方案及字体。我来这儿是想弄清楚其交互设计的过程:Tumblr的团队是如何提出关于用户在其网站和移动手机应用程序用户界面的想法的。我也想知道,他们的工程队是如何将这些想法转变为产品的。
请先和趋势网海外记者一起回顾一下五月:当时雅虎宣布其用11亿美元收购Tumblr。雅虎表示,Tumblr将继续独立运营,虽然我们可能会看到很多由Tumblr主办的以百万计的博客文章和雅虎的搜索引擎技术的内容交叉。
其实,有一个鲜为人知的事实,雅虎多年以来通过他们的设计模式库,已经向UX的专业人员及开发人员提供了一些有用的工具。该设计模式库里分享了雅虎的很多最成功的以及最能经受时间考验的UI格调,并且在这儿还可以与网络开发人员互动。现在说Tumblr的UI元素是否能过滤回这些模式库里可能还为时过早。同时,我也和Peter Vidani谈论了Tumblr的UI 功能如何活跃起来的问题。
该产品研发团队,仅仅只有9位工作人员,与拥有85名成员的工程队相比起来,算是很小的一个团队了。开发团队除了Vidani,包含了两个其他的产品设计师,以及一些沟通设计师和作家。Vidani负责开发iOS应用,而另一个产品设计师负责Android的开发。
一切都始于纸上素描
大量的专业设计想法都始于一种工具,那便是纸上素描。许许多多绝佳的我们能在Tumblr上看到的UI理念及格调,都源于一个小小的笔记本,而这个笔记本占据了设计师们关于用户界面的所有视线。在这次采访中,Peter向我们展示了他曾经用于Web网站版本的草图,以及一些没有达标的设计图。
利用这些草图,Peter及其团队将会在Photoshop中构建一些模板,而这些模板也将继续充当工作原型。
用户测试及迭代
Vidani说:“在一款应用正式发布之前,都会有一个该应用的测试版,让在这里工作的上百的工作人员试用。基本上都是这样。在这一点上,我们正在测试相当大的漏洞,用户流量不一致,错别字及用户死角的问题。但是,即使正式发布后,我们依旧会测试,看看有什么互动的工作,人们是如何使用的应用程序,以及人们可以一直使用多长时间。它使得我们询问一些我们可能之前没有问自己的设计问题。”
Tumblr会为他们的员工提供专有工具,让他们运行移动应用程序,并触发他们正在用来查看该工具的设备。那就是——它会向工程队提交一个程序错误提醒。根据Vidani的说法,一些功能和交互作用可以通过几个迭代(持续使用员工作为测试者,他们将会给工程团队发送错误报告),直到他们恰到好处。
通过趋势网小记整理的这个链接,你可以看到一个关于这些草图是如何演变成最终的UI元素的视频:http://bcove.me/62csaaf0
Tumblr交互设计的原则
Vidani说:“当Tumblr到来的时候,我确确实实被它吸引了,因为它能提供很多工具帮我创建很多非常简单的内容,而且这些工具根本不会胁迫用户。它不会要求很多。而且那些用于创建自己的网站的工具也是最漂亮的,而且是我从未体验过的简单方便。”
最后的UI元素:从上面的草图我们可以看到,这个辐射状的工具的开发、测试和完善
Vidani曾经是设计主题的,当他设计的一些主题引起病毒的时候,他也同时得到了该公司的关注。一年后,他受雇到这家公司工作。
据Vidani说,Tumblr的设计原则很短很简单,就是两个步骤。自从该公司推出了iOS和Android版本,以及其旗舰桌面版本,其原则都没有多大改变。
趋势网在此引用Vidani的话作为本文结尾:“设计原则便是,一、要明确意识到所有你将会要求用户所要意识到的屏幕上的一切。二、必须保证产品(Tumblr)小而且集中。我们都在期待是否将会有更多的原则补充。”