一、什么是交互原型設計

交互原型是交互設計師的主要產出，是交互設計師在接到產品需求之后，經過一系列分析，利用原型設計工具，將(jiang)抽象(xiang)的(de)文(wen)字產品需求(qiu)轉化成具體的(de)圖形產品方案的(de)產物(wu)。

一份好的(de)交互原型(xing)，首先必(bi)須(xu)提供(gong)一個好的(de)解決方案。這需(xu)要交互設計師對產品需(xu)求(qiu)進行(xing)合理的(de)分(fen)析，明確(que)需(xu)求(qiu)的(de)設計目(mu)標，并使用最合適的(de)交互方案，幫助團隊達到目(mu)標。其次，一份優秀的(de)交互原型(xing)，還(huan)必(bi)須(xu)符(fu)合基本的(de)設計原則、使用符(fu)合規范的(de)控件、對各種可能出(chu)現的(de)情況(kuang)都給予考慮和展現。

該圖片由注冊用戶"荊湖酒徒"提供，版權聲明反饋

二、交互原型設計工具如何畫交互原型

對(dui)于(yu)交互設計師(shi)來說，使用(yong)原型設計工具畫交互原型是基本功，下(xia)面為(wei)大家介紹一下(xia)如何畫交互原型：

1、設計思路

在交互(hu)(hu)原型(xing)的(de)第一(yi)頁，可以加(jia)上“項(xiang)目(mu)概述”這個主題，主要展示該需(xu)求的(de)基本(ben)信(xin)息和(he)迭代說(shuo)明，其(qi)中項(xiang)目(mu)概況(kuang)、平(ping)臺說(shuo)明和(he)功(gong)能列表(biao)都(dou)比(bi)較好理解(jie)，迭代說(shuo)明部分指的(de)交互(hu)(hu)原型(xing)的(de)迭代記錄。在實(shi)際(ji)工(gong)作中，原型(xing)的(de)設計(ji)往往不可能一(yi)步到位(wei)，一(yi)般需(xu)要經過溝通、評審慢(man)慢(man)確(que)定最終的(de)原型(xing)。在這種情況(kuang)下，設計(ji)師需(xu)要把每一(yi)次的(de)變更(geng)都(dou)記錄下來，方便項(xiang)目(mu)成員看到每次更(geng)新修改的(de)內容，提高工(gong)作效率，節約溝通成本(ben)，方便后期追溯(su)。

2、方案展示

這是交(jiao)互(hu)原型(xing)中最(zui)核心的(de)(de)部分(fen)(fen)(fen)。需要提醒的(de)(de)是，交(jiao)互(hu)原型(xing)的(de)(de)制(zhi)作是在設(she)計(ji)師(shi)拿到(dao)需求(qiu)后，經過(guo)(guo)設(she)計(ji)分(fen)(fen)(fen)析(xi)后開始(shi)進行。制(zhi)作原型(xing)的(de)(de)過(guo)(guo)程，只是把前(qian)面的(de)(de)分(fen)(fen)(fen)析(xi)過(guo)(guo)程的(de)(de)結果，用頁面的(de)(de)形式(shi)畫(hua)出來。所以(yi)交(jiao)互(hu)設(she)計(ji)師(shi)一定不要把“畫(hua)原型(xing)”當成自(zi)己最(zui)主要的(de)(de)任務。交(jiao)互(hu)設(she)計(ji)師(shi)的(de)(de)核心價值，是通過(guo)(guo)高質量的(de)(de)交(jiao)互(hu)方案達到(dao)設(she)計(ji)目標，以(yi)解決某(mou)種問題。

交互原型的本(ben)質是(shi)一種溝通工(gong)具(ju)，主(zhu)要用于(yu)團隊內部協(xie)作，作用是(shi)傳達需(xu)(xu)求。因此，為了把(ba)需(xu)(xu)求傳達清楚，交互原型中必須包含以下5類信(xin)息：

（1）原型展現完整的流程(cheng)。

（2）界(jie)(jie)面以及界(jie)(jie)面中的元(yuan)素展(zhan)現需求的所有功能點。

（3）界面中元(yuan)素的各種狀態說明。

（4）元素操作后的效果。

（5）異常、極限狀(zhuang)態說明。

三、交互原型設計注意事項

在做交互原型設計時(shi)(shi)，要把原型的閱讀者想象成對(dui)產(chan)品(pin)(pin)和設計(ji)一無所知(zhi)的人，該怎樣展(zhan)示(shi)產(chan)品(pin)(pin)的邏輯和功能(neng)，才(cai)能(neng)夠讓其(qi)通過原型來理解這(zhe)個(ge)產(chan)品(pin)(pin)，設計(ji)時(shi)(shi)要注(zhu)意的幾個(ge)事項主要有：

1、使用灰度線框圖：顏色和視覺(jue)效果會影響大家對易用性的判斷(duan)。

2、清晰(xi)地(di)展示流程(cheng)：順暢的操(cao)作流程(cheng)是產品易用性最基本的標準。

3、關鍵(jian)功能要(yao)有故事板(ban)：角(jiao)色、場景(jing)、情節(jie)，使團隊(dui)人員更(geng)快、更(geng)好地理解產品。

4、要有注(zhu)釋和(he)說明：圖文并茂更能準確傳達設計方案與(yu)想法。

5、一(yi)致性和規范(fan)性：優秀交互原型的元素(su)、組件、頁面甚(shen)至文案用語的調性都(dou)是規范(fan)一(yi)致的。