作為產(chǎn)品小白，進(jìn)入這個(gè)行業(yè)都需要學(xué)習(xí)如何做原型設(shè)計(jì)。本文AXURE為例，介紹原型設(shè)計(jì)和交互設(shè)計(jì)的定義，并探討交互常用的使用場(chǎng)景，以及對(duì)部分原型的交互做了步驟拆解，希望對(duì)你有所幫助。

產(chǎn)品小白往往在剛?cè)腴T產(chǎn)品這個(gè)行業(yè)時(shí)，都會(huì)先學(xué)習(xí)如何設(shè)計(jì)原型（以AXURE為例），但設(shè)計(jì)原型后如何讓自己的原型“動(dòng)起來”往往成為了產(chǎn)品小白目前的一個(gè)門檻。接下來我將為大家介紹原型設(shè)計(jì)和交互設(shè)計(jì)的定義，與大家探討交互常用的使用場(chǎng)景，并對(duì)部分原型的交互做了步驟拆解，希望能對(duì)大家有一定的幫助。

一、從交互本身來說

原型設(shè)計(jì)：原型設(shè)計(jì)是交互設(shè)計(jì)師或產(chǎn)品經(jīng)理與PD、PM、網(wǎng)站開發(fā)工程師溝通的最好工具，產(chǎn)品經(jīng)理通過原型可以使原本抽象的需求具體化。而該塊的設(shè)計(jì)在原則上必須是交互設(shè)計(jì)師的產(chǎn)物，交互設(shè)計(jì)以用戶為中心的理念會(huì)貫穿整個(gè)產(chǎn)品，利用交互設(shè)計(jì)師專業(yè)的眼光與經(jīng)驗(yàn)直接導(dǎo)致該產(chǎn)品的可用性。

交互設(shè)計(jì)定義：指兩個(gè)或多個(gè)互動(dòng)的個(gè)體之間交流的內(nèi)容和結(jié)構(gòu)，使之互相配合，共同達(dá)成某種目的。通俗的說，交互設(shè)計(jì)主要為產(chǎn)品各個(gè)原型元件直接的互動(dòng)，使得達(dá)成某種動(dòng)作或效果從而產(chǎn)生某個(gè)事件場(chǎng)景。

二、從端口來說

現(xiàn)以C端、B端、G端產(chǎn)品為例，整理的交互特點(diǎn)如下：

從各個(gè)端口交互特點(diǎn)我們可以看出，從端口來看，對(duì)產(chǎn)品交互的需求一般是：C端＞B端＞G端；

C端對(duì)產(chǎn)品交互的應(yīng)用場(chǎng)景一般側(cè)重于根據(jù)用戶使用習(xí)慣，設(shè)計(jì)定制化交互，從而提升用戶的使用體驗(yàn)。如返回手勢(shì)交互、頁面載入交互、選中交互等等。

舉個(gè)例子：以我們常用的釘釘（OA）為例。對(duì)于我們的日?？记趤碚f，上下班打卡是必要的用戶操作，我如果想要快速打卡需要①打開釘釘；②點(diǎn)擊【打卡】按鈕，進(jìn)入打卡頁面；③在打卡頁面點(diǎn)擊“打卡”這三個(gè)步驟才能完成操作。

對(duì)于釘釘需要打卡的用戶來說，這個(gè)頁面設(shè)計(jì)的“打卡”按鈕太小，且需要進(jìn)入二級(jí)頁面才能完成打卡，使用不便。

那么釘釘?shù)漠a(chǎn)品是如何優(yōu)化這個(gè)環(huán)節(jié)的交互的呢？釘釘在設(shè)計(jì)產(chǎn)品交互時(shí)，支持進(jìn)入釘釘首頁后，無需點(diǎn)擊“打卡”按鈕，可直接自動(dòng)打卡，簡化了用戶的操作步驟，彌補(bǔ)了頁面設(shè)計(jì)的不足，在一定程度上提升了用戶的使用體驗(yàn)。

這個(gè)案例主要是告訴大家在設(shè)計(jì)C端產(chǎn)品上設(shè)計(jì)交互時(shí)，需要反復(fù)琢磨按鈕存放位置、大小是否會(huì)給用戶帶來不便？交互的跳動(dòng)是否會(huì)與用戶的使用習(xí)慣相悖？怎樣做才能進(jìn)一步提升用戶對(duì)軟件的操作體驗(yàn)？

B端的交互則更側(cè)重于簡單易懂，好操作，對(duì)同一個(gè)操作需要進(jìn)行角色劃分。以美甲APP管理后臺(tái)刪除操作為例，同一個(gè)操作需對(duì)不同的角色進(jìn)行交互限制，如當(dāng)?shù)觊L對(duì)店員有刪除權(quán)限時(shí)，則需考慮二次刪除確認(rèn)彈窗作為提示作用，而當(dāng)?shù)陠T對(duì)店員本身沒有刪除權(quán)限時(shí)則可以考慮兩點(diǎn)：

①刪除按鈕是否需要展示在操作欄？

②如果展示，在操作時(shí)是否需提示當(dāng)前操作無權(quán)限？

對(duì)于G端產(chǎn)品來說，常見的交互一般不在原型上，而是在需求規(guī)格說明書上，對(duì)于政府應(yīng)用來說，文檔的規(guī)范性在一定程度上大于原型的規(guī)范上。在原型上一般實(shí)現(xiàn)簡單的基礎(chǔ)交互就可以滿足開發(fā)需求，如頁面跳轉(zhuǎn)（即 【點(diǎn)擊】xx元件，觸發(fā)【跳轉(zhuǎn)】至xx頁面）、動(dòng)態(tài)面板顯示/隱藏（即【點(diǎn)擊】xx元件，觸發(fā)【隱藏/顯示】xx動(dòng)態(tài)面板）等。

總結(jié)：其實(shí)無論是哪個(gè)端口，對(duì)于產(chǎn)品經(jīng)理來說，我們不能混淆交互的目標(biāo)對(duì)象，產(chǎn)品的交互設(shè)計(jì)一是為了開發(fā)方便，避免我們的開發(fā)人員看見我們的一堆沒有交互的原型抓瞎，二是動(dòng)態(tài)頁面的展示也更有利于我們發(fā)現(xiàn)在交互過程中存在的問題。

當(dāng)然，在原型上缺少交互設(shè)計(jì)時(shí)，我們往往也可以以文檔彌補(bǔ)交互的缺失，在寫文檔時(shí)需要考慮使用人、使用權(quán)限、前置條件、業(yè)務(wù)流程、操作步驟、后置條件等，所以對(duì)于原型交互比較薄弱的同學(xué)也不必過于擔(dān)心（當(dāng)然如果你的交互更為全面，對(duì)開發(fā)人員來說也更容易理解，畢竟實(shí)際工作中開發(fā)還是不太愿意看冗雜的文檔的）。

三、常見的簡單交互實(shí)際運(yùn)用

交互設(shè)計(jì)流程：

舉例1：點(diǎn)擊某元件跳轉(zhuǎn)至某個(gè)頁面

步驟及頁面說明：

舉例2：隱藏彈窗

步驟及頁面說明：

四、結(jié)語

作為一名產(chǎn)品經(jīng)理，對(duì)原型動(dòng)作、動(dòng)態(tài)的把控是提升產(chǎn)品梯度的重要步驟之一，我們需要在設(shè)計(jì)產(chǎn)品時(shí)深入理解各個(gè)頁面、各個(gè)元件之間的聯(lián)系。只有不斷的練習(xí)交互操作，才能在實(shí)際運(yùn)用中對(duì)交互的把控愈發(fā)如魚得水，我們可以選擇循序漸進(jìn)、由易到難，提升我們自身的產(chǎn)品能力，為我們后續(xù)進(jìn)軍高級(jí)產(chǎn)品經(jīng)理奠定基礎(chǔ)。

以上只是我對(duì)原型交互的粗略總結(jié)，希望該文章對(duì)你有所啟發(fā)，也歡迎感興趣的同學(xué)一起探討~