#本文為2022摹客RP原型工具測(cè)評(píng)大賽優(yōu)秀獎(jiǎng)作品

行業(yè)對(duì)于產(chǎn)品經(jīng)理的原型設(shè)計(jì)顆粒度要求越來越高，本文依據(jù)真實(shí)工作場(chǎng)景對(duì)摹客RP進(jìn)行評(píng)測(cè)，從原型設(shè)計(jì)→交互設(shè)計(jì)→原型發(fā)布，探索其是否符合易用性、便捷性、降本提效這3個(gè)核心價(jià)值點(diǎn)，能夠成為工作中的一把手。

文章將按照工作的真實(shí)流程和場(chǎng)景，對(duì)摹客進(jìn)行產(chǎn)品體驗(yàn)，那么摹客是否符合易用性、便捷性、降本提效這3個(gè)核心價(jià)值點(diǎn)呢？

原型設(shè)計(jì)是產(chǎn)品經(jīng)理的必備技能，但它并不屬于核心價(jià)值，原型設(shè)計(jì)不應(yīng)該成為PM的負(fù)擔(dān)，所以原型設(shè)計(jì)工具的易用性、便捷性、降本提效就成為了這類產(chǎn)品的核心價(jià)值點(diǎn)。

原型設(shè)計(jì)從早期紙上手繪原型到現(xiàn)在使用軟件進(jìn)行原型設(shè)計(jì)，行業(yè)對(duì)于PM原型設(shè)計(jì)呈現(xiàn)的顆粒度也越來越高。

在B端尤為明顯，B端客戶大多不是一個(gè)群體，而年齡普遍在40歲左右，對(duì)于互聯(lián)網(wǎng)認(rèn)知有限，這時(shí)原有的原型+文字描述來表達(dá)功能就略顯吃力，增加了客戶的理解成本；從而需要PM在原型基礎(chǔ)上，做一些肉眼可見的交互來推動(dòng)項(xiàng)目進(jìn)度，快速聚集產(chǎn)品目標(biāo)和需求，幫助客戶更好的理解產(chǎn)品、更好的達(dá)到商業(yè)目標(biāo)；對(duì)于內(nèi)部員工，也大大減少了溝通時(shí)間。

有些公司具備UX設(shè)計(jì)師，PM完成基礎(chǔ)框架后可以交付給UX設(shè)計(jì)師去完善原型和交互，而傳統(tǒng)的原型軟件并不具備協(xié)同合作的功能，導(dǎo)致信息無法實(shí)時(shí)同步更新出現(xiàn)一些冗余的操作和工作。

按照工作的真實(shí)流程和場(chǎng)景，從原型設(shè)計(jì)→交互設(shè)計(jì)→原型發(fā)布，對(duì)比即時(shí)、XD、Axure三個(gè)競(jìng)品，從易用性、便捷性、降本提效3個(gè)核心價(jià)值點(diǎn)去分析摹客是否有符合預(yù)期的體驗(yàn)。

一、摹客產(chǎn)品體驗(yàn)

1. 操作區(qū)

Axure、XD是我經(jīng)常使用的原型設(shè)計(jì)工具，所以在體驗(yàn)?zāi)】瓦@款產(chǎn)品時(shí)，發(fā)現(xiàn)整體架構(gòu)和Axure相似，操作起來學(xué)習(xí)成本低，可以做到0成本上手使用。

2. 組件區(qū)

組件區(qū)整體由組件、圖標(biāo)、資源組成，通過tab切換的交互方式操作更加便捷。

（1）基礎(chǔ)組件

基礎(chǔ)組件中的控件類型可以滿足大部分場(chǎng)景的原型設(shè)計(jì)工作；從降本提效來的角度看，組件庫(kù)可以通過工作場(chǎng)景中高頻出現(xiàn)的控件，做更精細(xì)化的功能；比如不同等級(jí)的按鈕、文字等等；這樣就省去了調(diào)整控件樣式的時(shí)間，更快的滿足需求目標(biāo)。

（2）基礎(chǔ)組件—可視化圖表

可視化組件在企業(yè)內(nèi)外演示時(shí)，尤其在當(dāng)下B端、大屏較為熱門的情況下具有極佳的效果；客戶、員工可以直觀的看到功能的視覺表達(dá)、交互。摹客的可視化圖表無須預(yù)覽就可以直接看到圖表效果，在改變圖表大小時(shí)做了自適應(yīng)，節(jié)省了調(diào)整時(shí)間。但摹客的圖表類型目前只能滿足基礎(chǔ)場(chǎng)景，種類不夠豐富，未能覆蓋復(fù)雜場(chǎng)景，這一點(diǎn)稍微有些欠缺。

（3）資源區(qū)

摹客的資源區(qū)提供了豐富的、不同行業(yè)的模版、組件庫(kù)等等供用戶使用，可快速完成高保真的demo進(jìn)行演示；但摹客添加組件資源包的流程長(zhǎng)達(dá)五步；拿Axure舉例，添加資源包則需要兩步。每增加一個(gè)步驟或界面，轉(zhuǎn)化率的漏斗就會(huì)降低。

3. 交互流程

（1）單個(gè)控件創(chuàng)建交互信息&狀態(tài)

當(dāng)給單個(gè)控件添加交互信息時(shí)，通過拖拽控件→雙擊控件即可沉浸式完成交互信息的錄入、交互狀態(tài)的鏈接；交互觸發(fā)后的屬性面板通過懸浮的交互形式，展示在視覺中心區(qū)，操作更便捷輕量化。

（2）控件與控件建立交互鏈接

摹客建立交互區(qū)域在元素上方以紅點(diǎn)表示，用戶對(duì)于紅色的認(rèn)知有限，紅點(diǎn)作為交互區(qū)感知不強(qiáng)，對(duì)新用戶仍有學(xué)習(xí)成本。當(dāng)建立交互后直接彈出交互屬性面板，打斷了用戶當(dāng)前操作，摹客預(yù)判了用戶下一步的操作，希望在建立交互時(shí)，直接賦予交互屬性，導(dǎo)致掌控感較弱。

（3）創(chuàng)建控件交互狀態(tài)

摹客的交互狀態(tài)屬性面板，支持6種高頻場(chǎng)景中的狀態(tài)編輯、切換、自定義狀態(tài)，通過簡(jiǎn)單的勾選交互完成狀態(tài)增加或變更，整個(gè)操作流程更加流暢便捷友好。交互流程上減少了冗余提高了操作效率，但功能邏輯、結(jié)構(gòu)的不清晰也導(dǎo)致從學(xué)習(xí)成本上增加了困難。

4. 原型發(fā)布

原型設(shè)計(jì)完成后，將原型組內(nèi)成員或客戶進(jìn)行后續(xù)開發(fā)流程；摹客在原型協(xié)同上擁有豐富的標(biāo)識(shí)功能，協(xié)同合作、溝通效果更高效。

但摹客沒有更好的融合協(xié)同、原型效果演示的兩個(gè)場(chǎng)景；在點(diǎn)擊發(fā)布項(xiàng)目后，在原型協(xié)作平臺(tái)需要四步才能直達(dá)演示界面，查看交互效果和功能描述。而作為原型發(fā)布后的目標(biāo)則是評(píng)審、給到相關(guān)項(xiàng)目人員，需要快速到達(dá)預(yù)覽演示界面，查看交互效果與功能描述，其次才是輔助功能；而摹客在這里強(qiáng)調(diào)了協(xié)同合作區(qū)分了兩個(gè)不同場(chǎng)景，導(dǎo)致了交互的冗余。

二、改進(jìn)點(diǎn)

1. 組件區(qū)

（1）基本組件

摹客、Axure的基本組件基本類似；但Axure做的更精細(xì)化，比如Button區(qū)分普通按鈕、主要按鈕、鏈接按鈕，文字有一級(jí)、二級(jí)、三級(jí)，這在原型設(shè)計(jì)時(shí)都是高頻出現(xiàn)的場(chǎng)景；而摹客這方面只滿足了基礎(chǔ)場(chǎng)景，不同場(chǎng)景下仍需要手動(dòng)去調(diào)整樣式。

（2）基礎(chǔ)組件—可視化圖表

Axure通過Axhub元件，基礎(chǔ)圖表類型達(dá)34種、地理可視化達(dá)20種、可視化動(dòng)態(tài)元件達(dá)8種、其它類型8種；僅一個(gè)元件載入通過簡(jiǎn)單的拖拽交互幾乎滿足了100%的場(chǎng)景；而摹客還未能覆蓋復(fù)雜場(chǎng)景，這一點(diǎn)稍微有些欠缺。

（3）資源區(qū)

摹客的模版資源從獲取到應(yīng)用，需要五步才能完成，存在冗余步驟；而Axure則需要兩步就可以完成資源的加載；每增加一個(gè)步驟或界面，學(xué)習(xí)成本就會(huì)增加，流程越長(zhǎng)流失率越高，轉(zhuǎn)化率的漏斗就會(huì)降低。

3. 交互流程

（1）控件與控件建立交互鏈接

摹客：

摹客獲取焦點(diǎn)時(shí)以上方紅點(diǎn)表達(dá)，當(dāng)建立完交互時(shí)隱藏交互關(guān)系線，通過icon 表達(dá)當(dāng)前已有交互；當(dāng)面臨多個(gè)項(xiàng)目或大量交互場(chǎng)景時(shí)，容易造成交互關(guān)系的迷惑，這時(shí)只能通過右側(cè)交互面板找到相關(guān)聯(lián)的交互元素。

當(dāng)建立交互后，直接彈出交互屬性面板，打斷了用戶當(dāng)前操作；摹客預(yù)判了用戶下一步的操作，希望在建立交互時(shí)，直接賦予交互屬性，導(dǎo)致掌控感較弱。

即時(shí)設(shè)計(jì)：

即時(shí)在獲取焦點(diǎn)時(shí)，從圓點(diǎn)變?yōu)?增強(qiáng)變化感知；交互屬性面板右側(cè)展示，不干擾/打斷用戶當(dāng)前操作，使主視覺區(qū)清晰可見，而對(duì)比摹客來說掌控感更強(qiáng)；當(dāng)某一元素獲取焦點(diǎn)時(shí)，僅展示相關(guān)聯(lián)的交互元素進(jìn)行視覺引導(dǎo)，在面臨復(fù)雜場(chǎng)景時(shí)可快速找到關(guān)聯(lián)關(guān)系。

XD：

XD獲取焦點(diǎn)時(shí)通過箭頭的方式進(jìn)行引導(dǎo)，對(duì)新手用戶更友好，而對(duì)比摹客上方的紅點(diǎn)感知較弱；當(dāng)多個(gè)元素建立交互時(shí)，展示全部交互關(guān)系線，在復(fù)雜場(chǎng)景時(shí)邏輯關(guān)系在視覺上有些混亂。

（2）創(chuàng)建控件交互狀態(tài)

摹客添加交互流程：

摹客的交互更輕量化，操作更便捷；狀態(tài)面板支持正常、選中、禁用、懸停、按下、焦點(diǎn)；但禁用與其它狀態(tài)是互斥的，從邏輯和層級(jí)上這里是共存關(guān)系，程序也未做任何控制，支持全部勾選，在預(yù)覽時(shí)就會(huì)出現(xiàn)效果沖突的情況，交互設(shè)計(jì)原則是不要讓用戶思考，而這里仍有待完善的空間。

三、原型發(fā)布

1. 摹客查看原型流程

摹客在點(diǎn)擊發(fā)布項(xiàng)目后，在原型協(xié)作平臺(tái)需要四步才能直達(dá)演示界面，查看交互效果和功能描述，交互路徑有些冗余。

2. 藍(lán)湖查看原型流程

藍(lán)湖僅需兩步即可查看原型效果與功能描述；在進(jìn)入項(xiàng)目后，直接選擇產(chǎn)品就可以查看原型界面；將評(píng)論功能內(nèi)嵌到原型預(yù)覽上，交互更加便捷，結(jié)構(gòu)更為清晰。

總結(jié)

原型工具的核心價(jià)值是要解決原型設(shè)計(jì)的易用性、便捷性、降低學(xué)習(xí)成本、提高工作效率，在最短時(shí)間內(nèi)完成原型設(shè)計(jì)并發(fā)布演示或需求評(píng)審。各個(gè)產(chǎn)品入門門檻低、上手快、效果好則成為了產(chǎn)品的核心競(jìng)爭(zhēng)點(diǎn)。

目前在線/客戶端設(shè)計(jì)工具已相對(duì)成熟，而各產(chǎn)品都有自己的特色與差異化，目標(biāo)群體都是UI設(shè)計(jì)師或UX設(shè)計(jì)師；從摹客RP界面功能上看，應(yīng)該算是垂直細(xì)分領(lǐng)域，目標(biāo)群體為PM。

以上是在使用摹客過程中的一些體驗(yàn)和心得，有不對(duì)之處還請(qǐng)斧正。

本文為2022摹客RP原型工具測(cè)評(píng)大賽的測(cè)評(píng)文章，如對(duì)摹客RP感興趣可點(diǎn)擊體驗(yàn)鏈接：https://www.mockplus.cn/rp-event/?hmsr=woshipmzhoujinhu

本文由 @三范范 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議

該文觀點(diǎn)僅代表作者本人，人人都是產(chǎn)品經(jīng)理平臺(tái)僅提供信息存儲(chǔ)空間服務(wù)。