產(chǎn)品設(shè)計(jì):怎樣產(chǎn)出靠譜的原型?
設(shè)計(jì)原型之前,需要考慮哪些關(guān)鍵點(diǎn)呢?
產(chǎn)品設(shè)計(jì)是產(chǎn)品真正開始實(shí)現(xiàn)的第一步,也是連接產(chǎn)品策劃與產(chǎn)品落地的橋梁。在前面環(huán)節(jié)里我們研究需求、用戶和定位,就是為了能在產(chǎn)品設(shè)計(jì)環(huán)節(jié)有的放矢,切中要點(diǎn)。
互聯(lián)網(wǎng)產(chǎn)品本質(zhì)上是一種服務(wù)。QQ為大家提供的是即時(shí)通訊的服務(wù);百度提供的是信息獲取的服務(wù);阿里提供的是零售服務(wù)。
產(chǎn)品與服務(wù)的最大差別有點(diǎn)類似于打孔機(jī)和墻上的孔,用戶要的是墻上的孔,而打孔機(jī)只是幫用戶實(shí)現(xiàn)了這個(gè)需求的方式之一。當(dāng)我們以服務(wù)為出發(fā)點(diǎn)時(shí),就會(huì)以用戶獲得和用戶滿足,而非產(chǎn)品為中心來做設(shè)計(jì)。
而互聯(lián)網(wǎng)服務(wù)又有自己的特點(diǎn)。他的擴(kuò)散速度極快,他對(duì)于流量非常依賴,他的邊際成本很低。因此,在設(shè)計(jì)過程中,就會(huì)和別的實(shí)物產(chǎn)品不一樣,比如會(huì)采用MVP模型先上線最小價(jià)值產(chǎn)品;同時(shí)快速上線,快速反饋,持續(xù)交付。
一、一些原則
對(duì)于互聯(lián)網(wǎng)產(chǎn)品的設(shè)計(jì),有一些經(jīng)驗(yàn)總結(jié)的最小必要原則:
1、足夠簡(jiǎn)單。
可以簡(jiǎn)單,就別復(fù)雜。我們需要讓用戶用起來足夠方便。張小龍?jiān)?jīng)舉過一個(gè)微信搖一搖設(shè)計(jì)的例子來說明極簡(jiǎn)的意義。
我們來看這個(gè)“搖一搖”的功能,它非常簡(jiǎn)單,任何一個(gè)人都會(huì)用,不用做任何的學(xué)習(xí)。我們會(huì)避免在界面里面出現(xiàn)任何的一個(gè)文字解釋,一旦一個(gè)功能需要文字解釋,這個(gè)功能的設(shè)計(jì)已經(jīng)失敗了。
上一次Pony很認(rèn)真的給我發(fā)了一個(gè)郵件,說我們搖一搖的功能真的很好,但是我們要防止競(jìng)爭(zhēng)對(duì)手抄襲模仿我們的功能。因?yàn)樯洗挝覀冏隽艘粋€(gè)查看附近的人,然后競(jìng)爭(zhēng)對(duì)手也做了,并且加了一個(gè)小創(chuàng)新在里面,叫做表白功能。這樣通過一個(gè)小創(chuàng)新來突出,跟我們就不一樣了。
Pony說為什么我們沒有預(yù)先把這些該想到的都想進(jìn)去,讓別人想模仿的時(shí)候都沒有辦法再來做一個(gè)微創(chuàng)新了。我說微創(chuàng)新是永無止境的,別人總可以加一點(diǎn)東西來跟你不太一樣。然后他說這個(gè)搖一搖,我們?cè)趺礃幽軌虬言撟龅亩甲隽?,而且別人沒法在上面來改變一下。
我說不用著急了,因?yàn)槲覀冞@個(gè)東西已經(jīng)做到最簡(jiǎn)化了,別人沒法超越了,因?yàn)榫拖襁@個(gè)手機(jī)只有一個(gè)按鈕一樣,除非你做一個(gè)沒有按鈕的手機(jī)。這里只有一個(gè)動(dòng)作,甚至連按鈕都沒有。
做到簡(jiǎn)單到不能再簡(jiǎn)單,才會(huì)讓用戶有獨(dú)特的感覺。微信跳一跳的游戲也有同樣的特點(diǎn),我讓3歲的弟弟去直接看他馬上就能學(xué)會(huì),知道按下放開就能跳起來,這樣沒有學(xué)習(xí)成本的設(shè)計(jì)就是符合人性的設(shè)計(jì)。
2、無需思考。
好的設(shè)計(jì)是在潛意識(shí)里和用戶溝通,因此能做到讓用戶不思考,就要做到不思考?!禿o not make me think》里提到用戶訪問互聯(lián)網(wǎng)的三個(gè)特點(diǎn):
- 用戶并不閱讀,而是掃描;
- 用戶不作最佳選擇,而是滿意即可;
- 用戶不會(huì)追根究底,而是勉強(qiáng)應(yīng)付。
我們會(huì)發(fā)現(xiàn),這樣的特征在用戶用手機(jī)的時(shí)候更厲害,用戶的時(shí)間更加稀缺,因此對(duì)于APP的操作更多是下意識(shí),不思考的,由此我們的APP應(yīng)該是為掃描而設(shè)計(jì),既如此,就需要盡量突出重點(diǎn),降低用戶思考成本,做到越傻瓜越好。
3、即時(shí)反饋。
互聯(lián)網(wǎng)在培養(yǎng)我們一個(gè)習(xí)慣,任何一件事情我們都希望能獲得馬上的反饋,發(fā)一條朋友圈希望馬上得到點(diǎn)贊;看一個(gè)微博希望馬上得到回復(fù)。只要不是即時(shí)回復(fù)的消息,人們就會(huì)焦慮。
因此,有反饋比沒反饋好,關(guān)心用戶情緒的反饋比不關(guān)心用戶情緒的反饋好。這一點(diǎn),用在平時(shí)的工作和人際交往中也是很管用的,我們更愿意信賴那些可以給出及時(shí)反饋的人,無論結(jié)果是好是壞,都需要。
二、設(shè)計(jì)流程
原則是用來做取舍用的,基于這些基本原則,以及不同業(yè)務(wù)的特點(diǎn),和不同平臺(tái)的標(biāo)準(zhǔn)就能正式進(jìn)入產(chǎn)品設(shè)計(jì)了。產(chǎn)品的具體設(shè)計(jì)流程可以歸納為以下6步。
價(jià)值設(shè)計(jì) -> 功能設(shè)計(jì) ->流程設(shè)計(jì)->框架設(shè)計(jì) -> 頁面設(shè)計(jì) -> 視覺設(shè)計(jì)
1、價(jià)值設(shè)計(jì)
先梳理價(jià)值。這需要回答的問題就是:
通過什么方式為哪些用戶創(chuàng)造什么核心價(jià)值。最后用戶獲得了什么,我們獲得了什么?
功能只是手段,價(jià)值才是目的。首先需要弄清楚的是做這件事能帶來多少用戶價(jià)值,多少商業(yè)價(jià)值,這些價(jià)值是怎么分配的。當(dāng)遇到相互沖突時(shí)哪個(gè)優(yōu)先。
2、功能設(shè)計(jì)
下面是功能設(shè)計(jì)?;谝粋€(gè)解決方案,我們會(huì)拆解為具體一個(gè)個(gè)的功能點(diǎn)。功能一般對(duì)應(yīng)需求文檔里的功能列表。
舉個(gè)例子,滴滴打車的原始概念來源于連接出租車司機(jī)和普通打車的人,那么需要把這個(gè)解決方案,拆解為司機(jī)端接客系統(tǒng)、乘客端打車系統(tǒng),和管理系統(tǒng)端,再基于三方的具體的需求完善每個(gè)子系統(tǒng),拆解出具體的功能點(diǎn)就是功能設(shè)計(jì)這一環(huán)節(jié)最重要的任務(wù)。
3、流程設(shè)計(jì)
流程設(shè)計(jì)則是把這些具體的功能拆解成具體實(shí)現(xiàn)的步驟。流程一般由流程圖來進(jìn)行分析,去完整的勾畫需要哪些環(huán)節(jié)。流程圖以這樣的示意圖標(biāo)來表示。
根據(jù)這些標(biāo)志,畫出簡(jiǎn)單的流程圖是這樣的。
針對(duì)多方參與、多階段的業(yè)務(wù)還會(huì)有泳道圖。泳道圖增加了業(yè)務(wù)方的維度和流程過程的維度。
4、框架設(shè)計(jì)
接下來,基于已經(jīng)設(shè)計(jì)出來的功能和流程,我們需要把他們植入到APP的結(jié)構(gòu)中。這有點(diǎn)類似于我現(xiàn)在已經(jīng)有很多店了,星巴克、MUJI、迪卡儂等,現(xiàn)在需要把這些店裝到一個(gè)綜合體里面,讓用戶能夠訪問到,對(duì)于這個(gè)綜合體結(jié)構(gòu)的設(shè)計(jì)就是框架的設(shè)計(jì)。
對(duì)于移動(dòng)應(yīng)用,常見的導(dǎo)航包括:標(biāo)簽式、抽屜式、桌面式、列表式、平鋪式等。
每種導(dǎo)航都有自己的特點(diǎn),適用于不同的場(chǎng)景。而對(duì)于一些復(fù)雜的APP而言,一般會(huì)幾種導(dǎo)航穿插使用,下面總結(jié)了幾種導(dǎo)航的特點(diǎn)及典型應(yīng)用場(chǎng)景。
5、頁面設(shè)計(jì)
基于這些準(zhǔn)備,我們才開始真正設(shè)計(jì)頁面原型。新手產(chǎn)品一般從頁面開始進(jìn)行原型設(shè)計(jì),而實(shí)際上頁面的設(shè)計(jì)需求是來源于更底層的梳理。頁面是具體某個(gè)頁面的布局情況,把哪些信息放在哪些位置上。頁面基于功能的不同一般有兩類,注重信息展示的頁面、注重流程引導(dǎo)的頁面,這兩類在設(shè)計(jì)上的KPI是不同的。
6、視覺設(shè)計(jì)
視覺則是一般把原型稿交付之后,由設(shè)計(jì)師產(chǎn)出,這時(shí)候的UI稿就可以直接用于開發(fā)了。
在《用戶體驗(yàn)要素》這本書中,作者把面向用戶體驗(yàn)的設(shè)計(jì)分為5個(gè)層次:戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層、表現(xiàn)層,可以與設(shè)計(jì)的6步驟相互對(duì)照。
五層次劃分的意義在于,在設(shè)計(jì)或者討論問題的時(shí)候,可以定位到自己的設(shè)計(jì)到底是哪里的問題,于是可以找到對(duì)應(yīng)的解決方案。比如某個(gè)按鈕的顏色的問題,可能回溯到框架層甚至戰(zhàn)略層才能找到正確的解答。
三、增長(zhǎng)設(shè)計(jì)
由于更加高昂的獲客成本,現(xiàn)在從0到1的產(chǎn)品設(shè)計(jì)中,不僅要探索產(chǎn)品價(jià)值,同時(shí)在產(chǎn)品本身的設(shè)計(jì)中也需要包含增長(zhǎng)的手段,即產(chǎn)品就是渠道,對(duì)于產(chǎn)品的傳播最好能包含在產(chǎn)品的功能之中。
這需要在產(chǎn)品功能設(shè)計(jì)中增加激勵(lì)用戶分享的功能,比如增加邀請(qǐng)機(jī)制、分享機(jī)制,通過這些方式能夠讓交付的產(chǎn)品本身成為傳播的一個(gè)節(jié)點(diǎn),幫助產(chǎn)品獲取新用戶。在行最新推出的小程序:我最在行,采用體力值激勵(lì)的方式鼓勵(lì)用戶分享和進(jìn)行好友PK,以幫助產(chǎn)品獲取新用戶。
產(chǎn)品設(shè)計(jì)是一件實(shí)踐性很強(qiáng)的事,然而如果能遵循足夠簡(jiǎn)單、無需思考、即時(shí)反饋的原則,并根據(jù)產(chǎn)品設(shè)計(jì)深入淺出的步驟,同時(shí)兼顧產(chǎn)品的增長(zhǎng)機(jī)制,一定有利于你設(shè)計(jì)出更有生命力的產(chǎn)品。
練習(xí):隨著入口的逐步放開,2018年小程序?qū)?huì)迎來一個(gè)新的增長(zhǎng)點(diǎn),你可以嘗試結(jié)合自己的業(yè)務(wù)和小程序場(chǎng)景的特點(diǎn),按照價(jià)值、功能、流程、框架、頁面、視覺6個(gè)步驟,設(shè)計(jì)一款和自己業(yè)務(wù)相關(guān)的小程序。
七個(gè)關(guān)鍵步驟,打造有競(jìng)爭(zhēng)力的產(chǎn)品,下一篇我們將進(jìn)入產(chǎn)品迭代,敬請(qǐng)期待。
相關(guān)閱讀
產(chǎn)品流程拆解:如何提升產(chǎn)品的競(jìng)爭(zhēng)力
打造有競(jìng)爭(zhēng)力的產(chǎn)品系統(tǒng):需求分析與洞察
打造有競(jìng)爭(zhēng)力的產(chǎn)品系統(tǒng):用戶研究
打造有競(jìng)爭(zhēng)力的產(chǎn)品系統(tǒng):產(chǎn)品定位
作者:許晉誠(chéng),微信公眾號(hào):健行筆記,分享打造有競(jìng)爭(zhēng)力產(chǎn)品的方法論,微信公眾號(hào):健行筆記(xuexibiji007)。
本文由 @許晉誠(chéng) 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來自 PEXELS,基于 CC0 協(xié)議
寫的好棒,受教了!
[不過公眾號(hào)為什么搜不到~~~]