Prototype 在设计中的奇妙力量

Prototype,中文叫 “原型”,是设计项目中经常用到的工具。Wikipedia 上对其的定义是:

A prototype is an early sample, model, or release of a product built to test a concept or process or to act as a thing to be replicated or learned from.

也就是说,Prototype 是设计概念或产品的模型,用以表现最核心的功能特征。通过让用户与模型进行互动,来获取真实的反馈,从而更好地探索设计方向。

Prototype 不拘泥于形式,只要能达到它的作用即可。

prototype sample.png

Prototype 在设计项目中的应用

有一种说法是,“Design though research, research through design”。它想表达的是,设计师需要通过调研分析,指导设计方案的探索;同时通过设计出一些东西,从用户那里获得及时的反馈,获得新的洞察,补充调研结果;如此循环,不断迭代设计。在此过程中,Prototype 就是我们投石问路的那颗 “石子”,将可能比较抽象的设计概念具体化、甚至实体化,以便于人们理解,给出真实的反应和意见,帮设计者探到前进的方向。

Prototype 在设计的整个流程中都可以发挥重要作用,可以通过下图概括。

design process.png

下面举栗子来具体说明一下吧。

案例 1:人肉扭蛋机

这是我非常喜欢的一个私人项目,源于我对扭蛋深沉的爱(我是那种在地铁站看到扭蛋机都会忍不住多看几眼的,捂脸)。扭蛋是个很奇妙的仪式,充满了未知的刺激、欢乐与惊喜等情绪特质。那么,是否可以把这些特质移植到其他地方呢?当时的想法是从身边开始,用扭蛋机制来增进同事朋友间的友谊:把自己愿意为他人做的事写下来,放入“扭蛋”,谁扭到了你的蛋(怎么听起来有点怪怪的@~@),你就要向谁兑现那件事。所以,这是“爱的扭蛋机”。

有这个想法的瞬间,已经想到可以做成一个 App 了,甚至脑中已经闪过了一个个页面设计方案。不过等等!大家真的需要这个东西吗?如果只是我自己觉得好玩呢?大家喜欢相互奉献爱心吗?愿意为别人做什么?… 我心中有很多问题是不知道答案的。这时就需要用简单低成本的方式快速验证一下需求。

接下来,我在设计组内开展了一个小活动,集中在午饭时间进行(当时设计组承包一个小房间吃饭,关上门聊各种不可描述的话题,好怀念)。

扭蛋机原型.png

下面是其中几张便签,上面写了愿意为别人做的事。总有人的智慧可以把我亮瞎...

扭蛋机的蛋蛋.png

活动的效果惊人,搞笑有爱惊喜不断。我不但对之前的那些问题有了一定了解,并且通过大家的互动反馈,快速迭代活动的玩法规则,有一些意想不到的收获。

具体的经过和思考就不在这里展开了,之后会单独开一片文章分享。在这个项目中,Prototype 主要在 “分析”、“设计”、“测试” 阶段发挥作用。

案例 2:App 设计

在公司的设计项目中,我会在需要的时候制作 Prototype 来表现设计方案,不但自己可以更好地斟酌细节体验、快速发现问题,还可以用来进行用户测试、获取反馈。

例如,在进行懂你英语(英语流利说核心课程)各类题型的交互设计时,我发现用户在做题时比较费脑,而且有一定的时间压力。怎样让用户轻松理解玩法,为他们在专注答题时减少干扰,让他们享受学习的快感?这需要合理安排题型中各种元素的位置和相互关系、出现时机、动画效果、音效等。

在基本方案出来后,我通常使用 Flinto 或 Keynote 制作 Prototype(下图),在手机上体验,一般这个阶段自己就能发现一些在画图脑补操作时没有发现的问题。进一步优化方案后,再请同事或用户来体验 Prototype,并请他们将使用过程中的任何想法都说出来(Think Aloud), 结合观察到的操作行为和表情等,就能更好地评估方案、获得改进方向。

cc-prototype_compress-bw.gif

制作 Prototype 的一些 Tips

制作 Prototype 和制作真实产品相比,它的优势是低成本、快速、简单。在制作 Prototype 时需要考虑怎样尽可能地发挥它的这些优势,而不是为了制作而制作。

  1. Prototype 是一种思维,是一种在遇到很多问题时会想想“我能用什么方法简单快速地去做实验、去验证或否决我的想法”的精神。

  2. 定义清楚做 Prototype 的目标,有针对性地设计原型。点到为止,而不是模拟所有功能细节。Prototype 按精细程度,可分为低保真、中保真、高保真原型。选取什么样的精细度来制作 Prototype,取决于问题的精度。

  3. 你的 Prototype 需要获得足够真实的用户反馈,这需要你:

    • 明确测试目的,选择合适的精细度与测试流程;
    • 进行适当引导,让用户有不错的代入感;
    • 快速迭代。根据已测用户的反馈,针对重要问题进行即时优化,以便在之后的用户测试中观察改进效果。
  4. 舍得抛弃。记住,制作 Prototype 的作用只是为了学到东西,之后该改进就改进,该推倒重来就推倒重来。千万不要因为花了很多时间精力制作,就不舍得丢掉。

Prototype 与 Demo

在现实工作中,我发现很多人对 Prototype 的理解存在一定误区,且 Prototype 的应用程度不够。大致分享一段和一位设计师朋友的对话。

Conversation.png

从这段对话中,大家是否发现了什么?
X 先森在跟我聊 Prototype,但用的词却是 “Demo”。实际上,我在工作中听到 “Demo” 的次数远比 “Prototype” 多得多。那么这两者有什么区别呢?

Prototype 之前已经提过,是用来做测试、希望从中学到东西的;Demo 是 Demonstration 的缩写,是用来做示范、展示的。前者的目的是更好地改进设计,后者是为了展现设计、沟通方案。Demo 在一些情况下属于 Prototype 的一种分支情况,如果它的意图是通过展示方案在设计评审中获得意见反馈、优化方案的话。

prototype demo.png

好了,要说的就是这些。

愿 Prototype 精神与你同在!

推荐阅读更多精彩内容