一、什么是交互原型設計

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

一份好的(de)(de)(de)(de)交(jiao)(jiao)互(hu)(hu)原型，首先必(bi)須(xu)提供一個(ge)好的(de)(de)(de)(de)解決(jue)方案(an)(an)。這需(xu)(xu)要交(jiao)(jiao)互(hu)(hu)設計師(shi)對(dui)產品需(xu)(xu)求(qiu)進行合(he)理(li)的(de)(de)(de)(de)分析，明確需(xu)(xu)求(qiu)的(de)(de)(de)(de)設計目標，并(bing)使用(yong)最(zui)合(he)適(shi)的(de)(de)(de)(de)交(jiao)(jiao)互(hu)(hu)方案(an)(an)，幫助團隊達到目標。其次，一份優秀(xiu)的(de)(de)(de)(de)交(jiao)(jiao)互(hu)(hu)原型，還必(bi)須(xu)符合(he)基本的(de)(de)(de)(de)設計原則、使用(yong)符合(he)規范的(de)(de)(de)(de)控件、對(dui)各種(zhong)可能(neng)出現(xian)的(de)(de)(de)(de)情況(kuang)都給予(yu)考(kao)慮(lv)和展(zhan)現(xian)。

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

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

對(dui)于交(jiao)互(hu)(hu)設(she)計師來說，使用(yong)原(yuan)型設(she)計工具畫交(jiao)互(hu)(hu)原(yuan)型是(shi)基(ji)本功，下面為大(da)家介(jie)紹一下如何畫交(jiao)互(hu)(hu)原(yuan)型：

1、設計思路

在交互原(yuan)型的(de)第一頁，可以加上(shang)“項(xiang)目(mu)概述”這個主題，主要(yao)(yao)展(zhan)示該(gai)需(xu)求的(de)基本(ben)信息和(he)迭代說(shuo)(shuo)明，其(qi)中項(xiang)目(mu)概況、平臺說(shuo)(shuo)明和(he)功能列表都比較(jiao)好理解，迭代說(shuo)(shuo)明部分(fen)指的(de)交互原(yuan)型的(de)迭代記錄。在實際工(gong)(gong)作中，原(yuan)型的(de)設計(ji)往(wang)往(wang)不(bu)可能一步到(dao)(dao)位(wei)，一般需(xu)要(yao)(yao)經過溝通、評審慢慢確定最(zui)終的(de)原(yuan)型。在這種情況下，設計(ji)師需(xu)要(yao)(yao)把每(mei)一次(ci)的(de)變更都記錄下來，方便項(xiang)目(mu)成(cheng)員(yuan)看到(dao)(dao)每(mei)次(ci)更新修改(gai)的(de)內容，提(ti)高(gao)工(gong)(gong)作效率(lv)，節約溝通成(cheng)本(ben)，方便后(hou)期追溯(su)。

2、方案展示

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

交(jiao)互原型(xing)的本質(zhi)是一種(zhong)溝(gou)通(tong)工具(ju)，主要用(yong)于團隊內部(bu)協作，作用(yong)是傳達需(xu)求。因此，為了把需(xu)求傳達清楚，交(jiao)互原型(xing)中(zhong)必須(xu)包(bao)含(han)以下5類信(xin)息：

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

（2）界面(mian)以及界面(mian)中的元素展現需求的所(suo)有(you)功能點。

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

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

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

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

在做交互原型設計時(shi)，要(yao)把原型的(de)閱(yue)讀者想(xiang)象(xiang)成對產(chan)品和(he)(he)設(she)計一無所知的(de)人，該怎樣展示(shi)產(chan)品的(de)邏輯和(he)(he)功能，才能夠讓其(qi)通過原型來理解這個產(chan)品，設(she)計時(shi)要(yao)注意的(de)幾個事(shi)項(xiang)主要(yao)有(you)：

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

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

3、關鍵功(gong)能要有故事板：角色、場景(jing)、情節，使團(tuan)隊人員(yuan)更(geng)快、更(geng)好地理解產(chan)品。

4、要有(you)注釋和說明：圖文并茂(mao)更能準(zhun)確傳達設計方(fang)案(an)與想法(fa)。

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