第一篇：交互原型設(shè)計軟件 Axure RP Pro 5 中文教程

交互原型設(shè)計軟件 Axure RP Pro 5 中文教程(1)

交互原型設(shè)計軟件 Axure RP Pro 5 中文教程 [By Hawking] October 9, 2008 at 11:11 am · Filed under WEB Design

來源：http://演示文件、word說明文檔，以及對生成規(guī)則進行自行編輯、定義。

功能區(qū)2：工具欄，基本和office風(fēng)格一模一樣，功能也很容易上手。

功能區(qū)3：工作區(qū)，這就是我們平常操作工具，創(chuàng)建prototype的舞臺，將自己的構(gòu)思在這里釋放，將自己的想法在這里展現(xiàn)。

工作區(qū)的上部顯示打開的文件名，可同時打開多文檔，進行操作。

功能區(qū)4：站點地圖，Axsure RP創(chuàng)建的文件是模擬真實網(wǎng)站頁面關(guān)系的，sitemap就是通過樹形目錄關(guān)系，管理所有的站點頁面文件與流程圖文件?？茖W(xué)的文件關(guān)系結(jié)構(gòu)，對有效的演示文檔與生成易讀的說明文檔相當(dāng)重要。

我的操作習(xí)慣是先畫流程圖，然后根據(jù)流程圖構(gòu)建頁面文件框架，最后才開始頁面的具體設(shè)置。期間可以將文件分為LOFI（低保真）與HIFI（高保真）兩個部分進行分別展示，有利于不同的需求者使用。

功能區(qū)5：器具箱，囤積了所有用來畫wireframe與流程圖的對象。我們可以通過拖拽的方式將小圖形放入工作區(qū)，進行操作。對于這里面的對象，我們有必要一一詳細了解。

功能區(qū)6：復(fù)用模塊區(qū)，這里創(chuàng)建的頁面文件和sitemap的頁面相似，唯一不同的是，master的每個文件，可以當(dāng)作一個整體，被

sitemap反復(fù)調(diào)用。這個功能就相當(dāng)于程序開發(fā)中的程序復(fù)用，用好這個功能，可以減少我們很大一部的工作量。也更容易理解網(wǎng)頁文件的關(guān)系，了解網(wǎng)頁設(shè) 計師、程序員是怎么構(gòu)建網(wǎng)站的頁面的。

功能區(qū)7：頁面筆記，用來對當(dāng)前創(chuàng)作頁面進行注釋與說明。同時可以在這里對頁面里的關(guān)鍵字段和特殊問題進行詳細的描述。

功能區(qū)8：頁面載入時的交互功能。通過在這里設(shè)置，不同條件下，頁面初次打開時的狀況。

功能區(qū)9：注釋與交互區(qū)。這個注釋和交互和7、8不同，7、8針對的是頁面，而9針對的是頁面中的元素，也就是一個個widgets。

功能區(qū)的上面部分設(shè)置交互條件。通過鼠標(biāo)點擊、滑入、滑出，設(shè)置觸發(fā)的事件，與對應(yīng)widgets相應(yīng)的變化。這一部分對沒有程序基礎(chǔ)的人可能會有一點難度，我稍后會做詳細解釋。

功能區(qū)的下面部分是注釋部分，用戶可以對選定的對象進行詳細的注釋。Axure已經(jīng)設(shè)置了幾個默認的注釋字段，但是其實這些默認的注釋字段，大家完全可以不使用，因為它可能和你要說明的東西風(fēng)馬牛不相及。

那么該怎么辦呢？Axure提供了自主設(shè)置字段，只要你自己設(shè)置好自己常用的字段，然后按照自己的習(xí)慣編寫就可以了。比如說你要說明對象的功能、優(yōu)先

級、參數(shù)，那么你在設(shè)置中加入這三個字段就好了。Axure最大的優(yōu)勢就是你設(shè)置的這些注釋，在生成說明文檔時，Axure自動幫你生成PRD規(guī)格的表格

文檔，你可以省去相當(dāng)大的編號工作，與文檔工作。這些我在之后也會做說明。

這些就是Axure的主要功能區(qū)，但是其實還有兩個小的角落大家可能會忽略，那就是6、7、8區(qū)下面的一行系統(tǒng)信息，這里顯示的信息很重要，但

是一般人卻經(jīng)常會忽視。我只所以說重要，因為我們在給ui設(shè)計師wireframe的時候他們總會問，這里多少像素，那里多少像素，可是我們在畫

wireframe的時候卻無法度量。Axure創(chuàng)建的wireframe，完全可以生成html，因此我們可以在畫的時候就度量好每個像素距離。但是我

們要怎么做呢？這就需要利用到下面這行小信息欄了。

信息欄左邊顯示的是文檔保存情況。而右邊呢，當(dāng)你將一個widgets放入工作區(qū)，并選擇這個widget時，這里就有用了，它顯示的是你所選

擇widget的高寬，以及距離頁面頂部和左邊的px距離。通過使用上下左右鍵，結(jié)合這個信息欄，你可以一步一步將它移動到你想去的地方。有意思吧？

Part III :文檔管理(Document)

開章要說的是文檔管理。文檔管理看似簡單，但是這是從操作功能上來說的，而我在說功能上的時候，想把我對文檔管理的理解也一并說一下。

文檔管理的目的，其實是為了有一個清晰的產(chǎn)品思路。剛開始工作的時候，我發(fā)現(xiàn)很多剛從學(xué)校出來的朋友對文檔的命名與放置都是隨心所欲的，我也不

例外。沒有好的整理習(xí)慣，這直接導(dǎo)致每次尋找先前的文檔都要花費相當(dāng)長的時間，甚至不小心誤刪，如果恰好有事請假，別的同事也無法接手工作。

所以，做一個prototype需要首先構(gòu)建一個清晰的文檔關(guān)系，這樣一方面能夠讓自己清楚文件關(guān)系與位置，更主要的是讓開發(fā)者與接受者能清晰理解你的思路，生成更合理的產(chǎn)品說明word文檔。

Axure RP的sitemap，與windows的樹形目錄相似，是以父子關(guān)系構(gòu)建頁面關(guān)系的，每個頁面既可以是一個頁面page，也可以是一個流程圖flow。

一、工具功能條

1、增加一個子頁面：為所選擇的頁面創(chuàng)建一個子頁面。

2、頁面上移：同等級的頁面中，將所選頁面的上下排列次序，上移一個位置。

3、頁面下移：同等級的頁面中，將所選頁面的上下排列次序，下移一個位置。

4、頁面降序：將所選頁面等級降序，作為原等級中，排列在所選頁面上方之頁面的子頁面。

5、頁面升序：將所選頁面等級升序，將所選頁面的頁面等級，升序為父頁面的同等級頁面。

6、刪除頁面：將所選頁面刪除，同時刪除其子頁面。

7、編輯頁面：在工作區(qū)打開所選擇頁面，進行編輯。

二、右鍵—增加為鼠標(biāo)右擊文件所顯示命令，下同。

1、增加一個子頁面：同 一，1。（表示和第一大點，第1小點功能相同，以下同此）

2、在所選頁面之上增加一個同等級頁面。

3、在所選頁面之下增加一個同等級頁面。

三、右鍵—移動

1、頁面上移：同一，2。

2、頁面下移：同一，3。

3、頁面降序：同一，4。

4、頁面升序：同一，5。

四、右鍵—復(fù)制

1、復(fù)制頁面：復(fù)制所選頁面，作為同級頁面顯示在所選頁面下方。不包含所選頁面子頁面。

2、復(fù)制分支：復(fù)制所選頁面以及子頁面，作為同級分支顯示在所選頁面分支下方。

五、右鍵—頁面類型

1、wireframe：頁面類型定為線框圖，文件圖標(biāo)顯示頁面圖標(biāo)。

2、flow：頁面類型定位流程圖，文件圖標(biāo)顯示流程圖標(biāo)。

六、右鍵—其他

1、刪除頁面：同

一、6。

2、重命名頁面：為所選頁面重命名。

3、編輯頁面：同

一、7。

4、生成流程表：將所選頁面以及其子頁面關(guān)系，生成流程圖。生產(chǎn)圖有兩種頁面布局方式可選。標(biāo)準(zhǔn)模式，頁面按照父子關(guān)系從上自下排列；階梯模式，頁面按照父子關(guān)系從左上至右下，以階梯方式進行排列。

5、復(fù)制頁面鏈接到剪切板。

以上就是sitemap所有命令，其實這些命令都很簡單，也很容易理解，關(guān)鍵在于怎么去使用。

由于頁面有兩種類型，wireframe與flow，所以要善于用這兩種標(biāo)記頁面，從而讓人理解你的意圖。我總結(jié)大致這兩種標(biāo)記可以如下利用。

flow圖為父頁面，wireframe圖為子頁面：先畫流程圖，然后根據(jù)流程圖構(gòu)建頁面關(guān)系。這樣在流程圖的指引下結(jié)構(gòu)頁面關(guān)系，可以更清晰的理解頁面框架。

wireframe為父頁面，flow為子頁面：為頁面線框圖中的特殊部分做流程解釋?？梢詫撁娴募毠?jié)部分進行詳盡的解釋。

當(dāng)然，這兩種結(jié)構(gòu)方式要活學(xué)活用，在復(fù)雜的產(chǎn)品頁面結(jié)構(gòu)中，他們完全是你中有我，我中有你的。

Part IV : 模板復(fù)用(Templates)

masters和sitemap面板很相似，文檔操作也一樣，它們的本質(zhì)區(qū)別是，sitemap里的文件是最終展示頁面，masters里的文件卻只是一個模塊，是頁面的一個部分。

masters的英文直譯是主人或雇主，但是我認為這里可以叫做模板，或者復(fù)用模塊。masters的文件，是頁面中重復(fù)的模塊，由于在不同頁面中這些模塊是一樣的，所以拿出來作為一個模塊編輯，然后在不同頁面中進行調(diào)用。

這個功能類似于網(wǎng)頁程序開發(fā)中的程序復(fù)用，不同頁面中調(diào)用同一段程序，一般把這段程序單獨做成一段頁面程序，然后用include命令進行調(diào) 用。master的文件就相當(dāng)于這段被調(diào)用的頁面程序。dreamweaver也有類似的功能，就是template，可以參照理解。

一、功能條

master的功能條功能基本和sitemap一模一樣，功能也基本一樣。唯一不同的是master可以創(chuàng)建文件夾，可以通過文件夾收納不同的文件，因此唯一不同的就是第一個功能按鈕，功能作用是增加一個文件夾。

二、右鍵單擊文檔——增加

增加功能的功能模塊功能除了增加文件夾其他和sitemap相同，大家可以參考教程三中的二大條。

而masters的文檔組織結(jié)構(gòu)主要依靠文件夾完成，頁面文件之間不存在父子關(guān)系。這是文檔操作與組織中與sitemap的最大不同。

三、右鍵單擊文檔——移動

文件移動功能基本上也和sitemap完全相同，但是父子關(guān)系的文檔移動是文件相對于文件夾完成，而不是相對于文件進行。

功能，基本上也可以參考教程三的第三點。

四、右鍵單擊文件——文件身份“行為”

behavior是行為的意思，這個功能是axure升級到4版本后加入的，是針對master的不同使用情況而添加的一個功能，也是要重點介紹的功能。

1、normal：普通文件。就是一般的復(fù)用文件。是默認創(chuàng)建的復(fù)用文件。

2、place in background：定位的復(fù)用模板，這類模板的特點是定位于頁面的底層，并且鎖定模板中的widgets在他原來創(chuàng)建的位置。這類復(fù)用模塊主要用于創(chuàng)建head、foot、側(cè)邊欄等明確定位的復(fù)用模塊。

3、custom widgets behavior：自定義模塊。這類模塊就類似于自創(chuàng)了一個widgets。

這類模塊與其他類型的復(fù)用模塊的不同在于，其他模塊與復(fù)用到頁面的模塊是完全相同的，模塊的功能設(shè)置是什么，功能說明是什么，頁面中的模塊設(shè)置和功能說明就是什么。

而自定義模塊與頁面中被復(fù)用的模塊是母子關(guān)系。自定義模塊只決定了模塊的功能和位置，但是進入到特定的頁面中，模塊中的各自部分的說明和功能可以重新定義。

充分理解三種不同類型的復(fù)用模塊的區(qū)別，根據(jù)不同環(huán)境有效的選擇，也是非常重要的。

五、右鍵單擊文件——其他 1、2、3功能都是文檔文檔操作功能，和sitemap一樣，分別是刪除、重命名和編輯master。4、5功能是對應(yīng)的。前者是將所選模板文件批量運用于頁面，后者是將所選模板文件，批量從頁面中去除。通過選擇此功能，會彈出sitemap文件的樹形目錄，你可以通過選擇需要添加模板的頁面，從而完成模板使用或移除。

check all：選擇所有頁面

uncheck all：所有頁面都不選擇

check all children：選擇所選頁面以及其所有子頁面

uncheck all children：不選擇所選頁面以及其所有字頁面

在4中有特殊的position設(shè)置和options命令，position中有兩個命令

place in blackground：將文件至于頁面背景

specify location：是特殊定位，可以通過設(shè)置距離左側(cè)和上邊的距離，來將模板文件放入特定的位置。

options里的多選框的意思是“只有頁面中沒有此模板時才置入”，默認是選擇的。如果不選擇而置入頁面，就會出現(xiàn)如果頁面中已經(jīng)有模板，模板被再次置入的情況。當(dāng)然如果有特殊需要的模塊，就可以這么使用了。

6、usage report：使用報告，點擊后彈出面板，顯示所有使用了此復(fù)用模板的列表，顯示的是文件名稱，通過雙擊文件名，可以在工作區(qū)打開，直接編輯。

PartV:Widget工具

Axure RP的widgets工具欄，就是我們用來畫線框圖wireframe、流程圖flow的工具，也可以說是組成我們最終輸出圖表的零件。好比我們小時候玩 的組裝積木，這些工具就是組裝積木里的一個個小部件，組成什么？組合得怎樣？完全依靠個人的經(jīng)驗和智慧。因此，熟悉每一個工具的用法和用途，才能隨心所欲 的畫出腦海中的圖形。

Widgets工具欄，下分兩類工具：

wireframe線框圖工具：基本上對應(yīng)著web頁面中的各種圖形。針對頁面中交互行為的表達，Axure RP專門增加了image map region 圖像映射區(qū)、dynamic panel動態(tài)面版、menu（vertical/horizontal）水平/垂直菜單等幾個特殊的工具。

Flow工具：流程圖所需的基本圖形框架。

我們先談wireframe線框圖工具。學(xué)習(xí)這部分工具，如果事先有html基礎(chǔ)，或者對web頁面元素有比較充分的理解，就很容易入手。以下我根據(jù)圖片中的編碼，依次講解。

1、image圖片：給wireframe中插入一個圖片站位，也可以直接置入真實的圖片。

2、text panel文本：插入文本。相當(dāng)于插入了一個< text >標(biāo)簽。是不帶鏈接的文本。但是其實也可以帶鏈接，在interactions中我們會提到。

3、hyperlink超鏈接：插入帶鏈接的文本。相當(dāng)于插入了一段帶< a >標(biāo)簽的文字。但其實在Axure中它與普通文本除了外型不同，沒有本質(zhì)區(qū)別。之所以將兩類文字區(qū)分開來，目的還是為了在視覺表達中讓人直觀的理解鏈接文本和普通文本，而這對于設(shè)計人員理解也非常重要，因此建議畫圖時盡量標(biāo)準(zhǔn)的區(qū)分鏈接文本和普通文本。

4、rectangle矩形：插入一個矩形?？梢詫ζ溥M行圖形樣式編輯。此圖形通暢被用來表達板塊的邊界。

5、placeholder占位符：插入一個占位符。占位符通常用來表達在頁面中某些特殊區(qū)域，比如情況復(fù)雜，或者在系統(tǒng)升級中不需要修改，又或者無關(guān)緊要的區(qū)域等等。作者需要結(jié)合說明文字，進行對應(yīng)的詳細表達。

6、button按鈕：插入一個按鈕，相當(dāng)于< button >標(biāo)簽。按鈕一般結(jié)合表單使用，當(dāng)然也可以作為強化的提示鏈接使用。

7、teble表格：插入一個表格。Axure的表格使用起來不是很方便，增加行、列，修改行、列寬度都不方便，算是一個敗筆。期待在下一個版

本的時候能夠有更好的進步。與標(biāo)準(zhǔn)化制作網(wǎng)頁一樣，表格的使用在畫wireframe的時候就應(yīng)該明確其作用，是用來作為數(shù)據(jù)列表展示使用，而不是作為網(wǎng) 頁布局的控件。

8、text field文本輸入框：結(jié)合表單使用。一般用作表單中提交數(shù)據(jù)。比如搜索框、用戶登錄框、注冊信息填寫框等。用作字段提交或單行數(shù)據(jù)提交。

9、text area文本區(qū)：結(jié)合表單使用。一般用作大段文字編輯、提交。比如文章編輯、留言等板塊。

10、droplist下拉列表框：結(jié)合表單使用。一般用作下拉菜單或者下拉列表選項，比如在搜索中，可以通過下拉列表框來定位搜索分類的范圍。也有人用它來做友情鏈接，可以通過下拉選擇直接進行頁面跳轉(zhuǎn)。

11、listbox列表選擇框：結(jié)合表單使用。通過文本框列表選項，通常使用在多項列表選擇，比如在填寫簡歷表的時候，選擇你所感興趣的行業(yè)，會提供列表選擇框。不過列表選擇框都會結(jié)合按鈕使用。

12、checkbox多項選擇：多項選擇通常使用在表單中，以提供多項選擇。比如在有些有些注冊要求用戶選擇興趣愛好，會提供十多個選項，因為選項可以并列進行，因此使用的是多項選擇。

13、raido button單項選擇：在一組選擇中選擇適合選項，選項關(guān)系非此即彼。比如在填寫性別的時候提供男女選擇，用戶非男即女，只取一項。當(dāng)然，不排除再多提供一個雙性選擇，這樣就是三選一，但是同樣是非此即彼的單一選擇。14、15、horizontal line水平線、vertical line垂直線：用以分割頁面中的不同板塊區(qū)域。由于web頁面中只能存在垂直與水平線，為了系統(tǒng)生成用于演示的html文件，特將兩種線條分開使用。

16、button shape形狀按鈕：相當(dāng)于圖形按鈕，多用于導(dǎo)航，或者多幀切換的版面切換按鈕。可進行邊角編輯。

17、image map region圖像映射區(qū)：它用于在web頁面中制造一片不可見的區(qū)域，一般是圖片的部分區(qū)域，相當(dāng)于圖片的熱區(qū)，從而添加說明與互動。在現(xiàn)實的網(wǎng)頁中經(jīng)常 會有一張大圖中有某個區(qū)域是觸發(fā)按鈕，而圖像映射區(qū)就可以用來說明這個區(qū)域的的功能和互動內(nèi)容。

18、inline frame框架：類似于html中的< iframe >對象。用于在頁面中制造頁面框架，每個框架中嵌入不同的頁面。我們經(jīng)常看到后臺系統(tǒng)分左右兩欄，一般都是使用了框架，左側(cè)載入的是導(dǎo)航頁面，右側(cè)是載入的管理頁面。

Axure的缺點是，暫時不支持百分比，因此iframe都是按像素度量的，和實際頁面效果還是有差距。

19、dynamic panel動態(tài)面版：是Axure為了表現(xiàn)多幀區(qū)域內(nèi)容而制造的一個工具。它的圖標(biāo)很形象的說明了它的結(jié)構(gòu)。它是不同的state疊加的一個動態(tài)區(qū)域，默

認顯示其中一個state，當(dāng)用戶觸發(fā)按鈕、圖片或者下拉列表等時，可以設(shè)置相應(yīng)動態(tài)面版切換到不同的state。不同state的關(guān)系，類似于

photoshop的層，也類似于html中的css屬性layer。

我們可以通過右擊dynamic panel進行state編輯，然后通過打開對應(yīng)state進行編輯，編輯方式和編輯頁面相同。20、21、menu（vertical/horizontal）水平/垂直菜單：用于制作水平或者垂直的菜單，可以添加漂浮的的子菜單，添加方法很簡單，就是選擇所要添加的菜單項，添加submenu。

Axure RP pro 的widgets工具欄，另一個重要的工具組就是flow，流程工具。

對于畫流程圖，是我們經(jīng)常會遇到的問題。我們和程序工程師溝通，用再多的口水，也無法挑明的事情，畫一張簡明的流程圖，就能很直白的說明關(guān)鍵問題。

有時候你可能會懊惱，因為程序員的思維猶如計算機，你告訴他為什么沒有用，你就告訴他該怎么做，是左是

右，是0是1就好了。這個時候，產(chǎn)品經(jīng)理需要的是理性思維，清晰的思路，如果你不清晰，工程師大多數(shù)會跟著你的思路亂做一團。所以多畫幾個流程，多根據(jù)頁 面需求畫清晰的流程，就能解決實際的問題。

話不多說，本章主要介紹flow里面的工具，因為圖形其實很好介紹，簡單的英文翻譯就好了，所以也順帶說說這些圖形在流程里的作用。方式還和以前一樣，編號，對號入座，咱們來一個蘿卜，一個坑：

1、rectangle：矩形

作用：一般用作要執(zhí)行的處理（process），在程序流程圖中做執(zhí)行框。

在axure中如果是畫頁面框架圖，那么也可以指代一個頁面。有時候我會把頁面和執(zhí)行命令放在同一個流程中做說明，這個時候?qū)深惒煌木匦巫錾蕝^(qū)別，然后做說明就好了。

2、rounded rectangle：圓角矩形或者扁圓

作用：表示程序的開始或者結(jié)束，在程序流程圖中用作為起始框或者結(jié)束框。

3、beveled rectangle：斜角矩形

作用：斜角矩形我?guī)缀醪皇褂茫梢砸暻闆r自行定義。或者在其他的流程圖中，有特殊含義，暫不知曉，也希望有識之士指點一二。

4、diamond：菱形

作用：表示決策或判斷（例如：If…Then…Else）,在程序流程圖中，用作判別框。

5、file：文件

作用：表達為一個文件，可以是生成的文件，或者是調(diào)用的文件。如何定義，需要自己根據(jù)實際情況做解釋。

6、bracket：括弧

作用：注釋或者說明，也可以做條件敘述。一般流程到一個位置，做一段執(zhí)行說明，或者特殊行為時，我會用到它。

7、semicircle：半圓形

作用：半圓在使用中常作為流程頁面跳轉(zhuǎn)、流程跳轉(zhuǎn)的標(biāo)記。

8、triangle：三角形

作用：控制傳遞，一般和線條結(jié)合使用，畫數(shù)據(jù)傳遞。

9、trapezoid：梯形

作用：一般用作手動操作。

10、ellipse：橢圓形或圓形

作用：如果畫小圓，一般是用來表示按順序數(shù)據(jù)的流程。

如果是畫橢圓形，很多人用作流程的結(jié)束。如果是在use case用例圖中，橢圓就是一個用例了。

11、hexagon：六邊形

作用：表示準(zhǔn)備之意，大多數(shù)人用作流程的起始，類似起始框。

12、parallelogram：平行四邊形

作用：一般表示數(shù)據(jù)，或確定的數(shù)據(jù)處理?；蛘弑硎举Y料輸入（Input）。

13、actor：角色

作用：來自于use case 用例，模擬流程中執(zhí)行操作的角色是誰。需要注意的時，角色并非一定是人，有時候是機器自動執(zhí)行，有時候也可是是模擬一個系統(tǒng)管理。

14、database：數(shù)據(jù)

作用：就是指保存我們網(wǎng)站數(shù)據(jù)的數(shù)據(jù)庫。

15、image：圖片

作用：表示一張圖片，或者置入一個已經(jīng)畫好的圖片、流程或者一個環(huán)境。

基本上，axure講基本流程圖、頁面框架圖、use case 用例圖涉及到的一些關(guān)鍵圖形都囊括在flow流程工具中，模糊了流程圖的區(qū)別，而盡量貼近交互設(shè)計時的工作內(nèi)容。

流程圖無疑只是一個表達的工具，我們在使用的時候應(yīng)該根據(jù)自己的實際情況使用，而不應(yīng)該死鉆牛角尖，非要知道某個圖形的通用標(biāo)準(zhǔn)。理解和溝通是第一位的。而對于某些具有標(biāo)準(zhǔn)性含義的圖形，大家人所共知，則我們應(yīng)該遵循共同的準(zhǔn)則，這樣就能達到表達的目的。

其實axure里面由于不涉及到具體的程序流程，所以有些標(biāo)準(zhǔn)的圖形并沒有提供，如不規(guī)則圖形、側(cè)面雙

矩形等，大家可以自己google一下或者baidu一下很容易就知道。大多數(shù)情況下，還是自己自定義一下自己的符號標(biāo)準(zhǔn)，就跟prd文檔加上名詞解釋一 樣，才是解決方法。

來自: http://hi.baidu.com/liuquan1021/blog/item/91ff4f365ef84c45241f1484.html

第二篇：軟件交互系的自薦信（范文）

軟件交互系的自薦信范文,關(guān)鍵詞是自薦信,軟件交互系,

尊敬的領(lǐng)導(dǎo)：

您好!衷心的感謝您在百忙之中翻閱我的這份材料，并祝愿貴單位事業(yè)欣欣向榮，蒸蒸日上!

我是x大學(xué)xx學(xué)院軟件交互屆畢業(yè)生，自從今日大學(xué)之后，高考后的輕松、獲知被錄取的喜悅隨風(fēng)而逝，因為我的從新開始，繼續(xù)努力奮斗，迎接新的挑戰(zhàn)。時光飛梭，我講到這童年的夢想、青年的理想離開學(xué)校，走上工作崗位。大學(xué)四年是我思想、知識結(jié)構(gòu)及心理、生長成熟的四年?；萦诶砉ご髮W(xué)的濃厚學(xué)習(xí)、創(chuàng)新氛圍，熔融其中四年使我成為一名復(fù)合型人才。

在校期間，我勤奮學(xué)習(xí)專業(yè)知識，努力把理論知識運用到實踐中去，曾參加全國大學(xué)生電子設(shè)計競賽，并取得佳績。此外我很喜歡電腦，不僅熟練掌握基本應(yīng)用軟件的使用，而且順利通過國家社會和勞動保障部高新技術(shù)信息職業(yè)資格中級考試和微軟ATC認證考試。在英語方面，通過國家英語四級，并且參加英語口語培訓(xùn)。

此外，我積極投身學(xué)生會和廣播站等學(xué)生組織為同學(xué)服務(wù)，表現(xiàn)出色，貢獻卓越，曾先后榮獲校級“優(yōu)秀三好學(xué)生兼優(yōu)秀團員”、“優(yōu)秀學(xué)生干部”、“校廣播站系統(tǒng)”杰出工作者“等稱號。

“長風(fēng)破浪會有時，直掛云帆濟滄?！?，我真誠地希望加盟貴公司，我定會以飽滿的熱情和堅韌的性格勤奮工作，與同事精誠合作，為貴單位的發(fā)展盡自己的綿薄之力。下頁附履歷敬請勘酌，懇請接納，回函是盼，我恭候您的佳音!

此致

敬禮!

第三篇：基于軟件交互設(shè)計綜合實踐教學(xué)研究

基于軟件交互設(shè)計綜合實踐教學(xué)研究

摘 要：針對專業(yè)交叉團隊合作模式的培養(yǎng)體系，提出綜合實踐方式，以廣東東軟學(xué)院為例，根據(jù)專業(yè)方向進行崗位設(shè)置，配備具有雙師素質(zhì)的教師、企業(yè)工程師進行全程交叉指導(dǎo)，分階段、分崗位進行考核，將軟件交互設(shè)計工作貫穿于綜合實踐開發(fā)過程的各個階段，使實踐成果達到軟件交互設(shè)計的期望目標(biāo)，同時也引導(dǎo)學(xué)生以用戶為中心并以人性化的軟件交互設(shè)計理念，培養(yǎng)軟件交互原型設(shè)計能力，加強對可用性設(shè)計的評估能力。

關(guān)鍵詞：綜合實踐；交互技術(shù)；原型設(shè)計；軟件評估概述及背景

隨著人機交互技術(shù)的快速發(fā)展，軟件數(shù)量日漸暴增，最新版本的軟件工程知識體系 SWEBOK V3.0將人機交互列為一個獨立的知識域[1]，交互設(shè)計也成為軟件產(chǎn)品競爭與創(chuàng)新的關(guān)鍵，但是軟件質(zhì)量卻參差不齊，特別是體現(xiàn)在用戶可用性與易用性等方面；同時，在實際項目開發(fā)過程中，用戶需求不明確、不完整、變更頻繁等因素導(dǎo)致系統(tǒng)設(shè)計困難，實現(xiàn)的系統(tǒng)與需求不一致，項目風(fēng)險提升，致使項目延期或者成本超支。開發(fā)者要提升軟件核心競爭力，需要關(guān)注用戶在使用過程中的體驗與感受，掌握軟件開發(fā)過程中的工程方法、核心技術(shù)及開發(fā)工具，運用綜合知識，開發(fā)出滿足用戶需求的優(yōu)質(zhì)軟件。實踐學(xué)期組織

2.1 基本思路

軟件綜合實踐安排在大二暑假學(xué)期進行，以“研究用戶需求、強化實踐技能、突出能力培養(yǎng)”為實踐思想，采用以用戶為中心的創(chuàng)新實踐教學(xué)體系，以能力培養(yǎng)為重點，以就業(yè)為導(dǎo)向，培養(yǎng)學(xué)生具備崗位所需的職業(yè)能力。

開發(fā)周期為4周，以項目團隊為組織形式，采用基于項目案例的綜合實踐教學(xué)體系以及分階段、分崗位的考核形式。實踐的組織模式更貼近實際工作需要，即根據(jù)專業(yè)（包括專業(yè)方向）的就業(yè)崗位進行項目團隊的崗位設(shè)置，項目團隊以1：2：1：1：1：1：1的比例設(shè)有項目經(jīng)理（兼）、軟件開發(fā)、數(shù)據(jù)庫開發(fā)、Web前端開發(fā)、軟件測試、系統(tǒng)實施與維護、基礎(chǔ)網(wǎng)絡(luò)設(shè)施搭建等崗位，以經(jīng)過裁剪、修改或補充的真實項目需求作為團隊的目標(biāo)進行實踐，配備具有雙師素質(zhì)的教師、企業(yè)工程師進行全程交叉指導(dǎo)。

隨著人機交互在軟件設(shè)計與開發(fā)中的地位變得越來越重要，有些引領(lǐng)企業(yè)如蘋果公司已經(jīng)派生出交互設(shè)計師、界面設(shè)計師、可用性工程師、用戶體驗設(shè)計師等職業(yè)，而更多的企業(yè)則由軟件工程師兼顧交互設(shè)計方面的工作[2]（如圖1所示）。根據(jù)圖1可知，Web前端開發(fā)由網(wǎng)站規(guī)劃與開發(fā)專業(yè)的學(xué)生承擔(dān)，而交互設(shè)計是Web前端開發(fā)中的核心內(nèi)容。

2.2 交互設(shè)計

交互設(shè)計（interaction design，IXD）是一種系統(tǒng)的設(shè)計，產(chǎn)生于20世紀(jì)80年代，以實現(xiàn)產(chǎn)品的“可用性”和“用戶體驗”為目標(biāo)，把握設(shè)計、行為設(shè)計和形式設(shè)計3者的相互關(guān)系，由人（people）、行為（activity）、產(chǎn)品使用時的場景（context）和支持交互行為的技術(shù)（technology）組成，簡稱 PACT [3]。

交互設(shè)計原型和可用性評估是交互設(shè)計的核心，科學(xué)地建立符合用戶需求的交互原型是交互設(shè)計追求的目標(biāo)[4]。其中，原型設(shè)計能夠快速發(fā)掘并明確用戶的需求，是交互設(shè)計師、用戶和軟件工程師收集需求、確認需求最好的溝通工具；可用性評估是基于真實用戶，找出軟件可用性方面的問題，也是提高產(chǎn)品可用性的有效途徑。實踐開發(fā)過程

整個實踐學(xué)期，從實踐項目啟動到項目總結(jié)結(jié)束，軟件交互設(shè)計崗位的工作貫穿軟件工程開發(fā)過程，采用迭代、循序漸進的方法進行軟件開發(fā)，如圖2所示。

從軟件項目實施過程來看，由于存在學(xué)生缺乏軟件開發(fā)經(jīng)驗、需求變更過多、缺乏軟件測評手段、進度計劃不合理等項目風(fēng)險，因此用戶會對軟件質(zhì)量和開發(fā)周期提出更高的要求。為了降低軟件危機，確保項目順利交付，項目的需求分析階段可采用場景劇本、角色法、訪談法、親和圖法等方式進行用戶調(diào)研，形成信息架構(gòu)；概要設(shè)計和詳細設(shè)計階段輸出交互原型，使用原型技術(shù)和可用性評估對需求及設(shè)計進行驗證；編碼階段由網(wǎng)站開發(fā)專業(yè)學(xué)生負責(zé)軟件Web前端開發(fā)，使用html、css、javacsript、Bootstrap框架等技術(shù)完成前端頁面開發(fā)；測試階段由網(wǎng)站開發(fā)專業(yè)學(xué)生對軟件進行交互設(shè)計評估、交互需求驗證、軟件可用性確認并輸出評估報告，評估報告會反饋給軟件開發(fā)崗位學(xué)生，軟件崗位的學(xué)生會根據(jù)技術(shù)約束、資金、開發(fā)時間等因素，與交互設(shè)計人員溝通，形成最終的修改方案，整個過程會迭代進行，直至項目完成。實踐內(nèi)容與成果

軟件綜合開發(fā)實踐中，網(wǎng)站開發(fā)專業(yè)的學(xué)生承擔(dān)Web前端開發(fā)，具體工作內(nèi)容包括需求分析、軟件原型、軟件界面設(shè)計、Web前端開發(fā)、軟件評估等。網(wǎng)站開發(fā)專業(yè)學(xué)生工作中的重點不僅僅是使界面美觀，還要實現(xiàn)軟件的可用性、易用性、有效性等指標(biāo)。

軟件開發(fā)流程中交互設(shè)計崗位主要工作分成4個階段：需求調(diào)研分析、原型設(shè)計、軟件界面開發(fā)和軟件評估。針對4個階段的主要工作，對其使用的工具、技術(shù)和方法以及輸出成果進行闡述，具體內(nèi)容見表1。實踐考核方式

根據(jù)各專業(yè)的畢業(yè)標(biāo)準(zhǔn)，課程?M教師制定了一套全方位、科學(xué)有效的考核體系。答辯委員會分別由指導(dǎo)老師、學(xué)校督導(dǎo)和企業(yè)工程師組成。

學(xué)生實踐學(xué)期的總體考核方案分為3部分：IT職業(yè)素養(yǎng)能力（30%）、團隊實踐成果（30%）和崗位專業(yè)技能（40%）。其中，IT職業(yè)素養(yǎng)能力和團隊實踐成果考核是各專業(yè)通用，崗位專業(yè)技能考核根據(jù)各專業(yè)單獨設(shè)置考核點。我們以網(wǎng)站開發(fā)技術(shù)專業(yè)為例進行介紹，見表2。實踐意義

網(wǎng)站開發(fā)技術(shù)專業(yè)學(xué)生于大二已經(jīng)學(xué)習(xí)了Java程序設(shè)計、網(wǎng)頁設(shè)計與制作、Web開發(fā)基礎(chǔ)、Javascript頁面特效設(shè)計、Javascript服務(wù)器技術(shù)、網(wǎng)站界面設(shè)計藝術(shù)等課程，掌握了Dreamweaver、Photoshop和Flash軟件的操作以及HTML、CSS、Javascript、Ajax等技術(shù)，具備了網(wǎng)站前端開發(fā)基本技能，但是缺乏開發(fā)經(jīng)驗，針對項目的需求分析，不能合理安排和組織內(nèi)容以及設(shè)計軟件界面，難以開發(fā)出有吸引力、易尋、易用、用戶友好的網(wǎng)站。

通過學(xué)期項目實踐，培養(yǎng)學(xué)生對用戶界面設(shè)計的審美能力，增強其對可用性設(shè)計的評估能力[5]，幫助學(xué)生積累項目經(jīng)驗和提高開發(fā)效率；在團隊合作過程中培養(yǎng)學(xué)生的團隊合作能力，樹立以用戶為中心的交互設(shè)計開發(fā)理念?；谲浖换ピO(shè)計的綜合實踐過程，應(yīng)最大限度地明確需求，減少方案設(shè)計時的隨意性和迭代次數(shù)，提高開發(fā)效率，降低項目開發(fā)的風(fēng)險，保證軟件產(chǎn)品滿足用戶需求。

綜合實踐學(xué)期結(jié)束，學(xué)校舉行院級小學(xué)期競賽，其中，人力資源管理系統(tǒng)、Neusoft好課堂、MyHouseRent房屋租賃平臺管理系統(tǒng)、SOVO?C合管理系統(tǒng)、奧運獎牌記錄管理系統(tǒng)、“程序猿”學(xué)院等作品獲獎。

教師可以競賽的方式激發(fā)學(xué)生的潛能，培養(yǎng)學(xué)生對軟件開發(fā)的興趣，同時為學(xué)生校外競賽打好堅實的基礎(chǔ)。例如，2016年攀登計劃省級立項并獲得撥款，包括基于Face++的人臉識別考勤系統(tǒng)（2萬元）、基于Android系統(tǒng)的金標(biāo)試紙定量檢測儀的研制（1.5萬元）；2016年大學(xué)生創(chuàng)新創(chuàng)業(yè)省級立項并獲得撥款，包括基于Android的老人緊急報警APP（1萬元）、“打醬油”移動社區(qū)App（1萬元）；第四屆“多迪杯”全國大學(xué)生網(wǎng)站開發(fā)大賽中，作品“ECHO商城”獲得國家特等獎，獎金5 000元。結(jié) 語

我院實踐了具有特色的實踐教學(xué)模式，即兩個理論教學(xué)學(xué)期后，安排一個綜合實踐學(xué)期，更好地把理論知識轉(zhuǎn)換為能力，突出實踐能力的培養(yǎng)。軟件綜合實踐教學(xué)體系以優(yōu)質(zhì)創(chuàng)新教學(xué)建設(shè)為目的，以達到教學(xué)質(zhì)量為最高目標(biāo)，為培養(yǎng)學(xué)生實踐能力和創(chuàng)新精神打下了堅實的基礎(chǔ)。未來的計算機軟件應(yīng)用中，人機交互必然會發(fā)揮越來越重要的作用，我們將繼續(xù)緊跟時代步伐，積極創(chuàng)新，不斷積累教學(xué)經(jīng)驗，探索合適的教學(xué)體系，不斷提高學(xué)生的創(chuàng)新能力以適應(yīng)社會需求。

參考文獻：

[1] Bourque P，F(xiàn)airley R E.Guide to the software engineering body of knowledge，Version 3.0[EB/OL].（2015-08-19）[2017-04-23].http：//www.researchgate.net/publication/224302077_Guide_to_the_Software_ Engineering_Body_of_Knowledge_2004_Version.[2] 梁爽.用戶交互技術(shù)課程的實踐教學(xué)方法探索[J].計算機教育，2015（23）： 48-52.[3] 郭璐，李雅箏.基于PACT-P模式的社交網(wǎng)站交互設(shè)計策略研究： 以“人人網(wǎng)”為例[J].今傳媒，2014（1）： 15-17.[4] 陳波，劉彥秀.基于公理設(shè)計的交互原型構(gòu)建研究[J].人類工效學(xué)，2016，22（1）： 68-72.[5] 林連南，劉嘉偉，許南鴻.人機交互課程體系設(shè)計的研究[J].計算機教育，2015（1）： 78-82.（編輯：宋文婷）

第四篇：交互設(shè)計心得整理

交互設(shè)計心得整理

長期以來我就有對幾年來交互設(shè)計的心得進行總結(jié)整理的想法。回到中國來親身體會到不少同行，主要是交互設(shè)計師和視覺設(shè)計師對于交互設(shè)計的困惑，以及其他行業(yè)對于交互設(shè)計的誤解和濫用。后來我在小范圍內(nèi)開設(shè)了一個關(guān)于交互設(shè)計的講座；現(xiàn)在把它整理成文，希望與同行切磋，共同進步。

這篇文章是我?guī)啄陙碓诿绹鴱氖陆换ピO(shè)計工作的一個經(jīng)驗總結(jié)。當(dāng)時我們遵循以用戶為中心（User-Centered-Design, 簡稱UCD）的設(shè)計原則，每一個項目都是不折不扣的按所有UCD的步驟進行。下面總結(jié)的交互設(shè)計的方法，是從UCD的過程中提煉出來，也就是說，同樣適用于任何非UCD的設(shè)計過程。交互設(shè)計的流程

如果一提到交互設(shè)計，你就想到畫線框圖或原型圖，那你只對了五分之一。交互設(shè)計是一個過程，從開始到結(jié)束有一套系統(tǒng)的流程。原型圖只是其中的一個環(huán)節(jié)。

當(dāng)接到一個設(shè)計項目，怎么開始？都應(yīng)該做哪些工作？怎樣盡可能的保證交付物滿足既定的功能以及用戶體驗層面的易用性？

第一步，是任務(wù)分析，列出界面所要完成的所有任務(wù)。第二步按各任務(wù)確定頁面流程，建立信息架構(gòu)。接下來是創(chuàng)建統(tǒng)一的頁面布局包括分區(qū)等。然后在頁面布局的基礎(chǔ)上進行原型設(shè)計，可以是低保真和高保真的原型圖。最后編寫設(shè)計說明。下面以設(shè)計一款動感相冊界面為例，逐步講解各個環(huán)節(jié)。1.任務(wù)分析

第一步任務(wù)分析。這里要做的是對于將要設(shè)計的這個新界面的所有任務(wù)的分析，也就是用戶在界面上能進行的所有操作。這個分析在功能需求的基礎(chǔ)上進行，需求方一般提供一個功能點的列表。

任務(wù)分析最常見的是任務(wù)列表，另外有任務(wù)流程和任務(wù)場景等。下面以任務(wù)列表為例。列出所有主要任務(wù)，以及每個主要任務(wù)的子任務(wù)。再把子任務(wù)細分到各個步驟。形成下面這個列表。主要任務(wù)1 子任務(wù)1 步驟1 步驟2 子任務(wù)2 步驟1 步驟2 主要任務(wù)2 …

以動感相冊為例，任務(wù)分析列表如下：

1.瀏覽相冊 1)瀏覽相冊列表 2)選擇相冊 3)瀏覽照片 2.創(chuàng)建新相冊 1)添加照片 a)選擇已有相冊 b)選擇照片 c)排列順序 d)添加字幕文字 e)選擇動畫效果 2)添加模板 a)瀏覽模板 b)選擇模板 3)添加音樂 a)瀏覽音樂列表 I.試聽音樂 II.選擇音樂 b)增加新音樂 I.打開本地文件 II.選擇音樂 4)預(yù)覽（略）… 5)命名（略）… 6)保存（略）… 3.修改相冊（略）…

任務(wù)列表包括所有功能點，并對每一個功能點的邏輯關(guān)系進行整合。必要時會對各任務(wù)的使用頻率和其它影響設(shè)計的重要因素進行分析，這里不做解釋了。2.頁面流程

任務(wù)分析完成后，進入設(shè)計的第一步，即設(shè)計頁面流程。頁面流程是設(shè)計的開始，也是重要的一環(huán)。它決定整個界面的信息架構(gòu)和操作邏輯。頁面流程是上一步任務(wù)分析的自然轉(zhuǎn)化。一般來說，一個主要任務(wù)就是一個頁面，其它子任務(wù)也可以轉(zhuǎn)化為頁面。

以動感相冊為例，頁面流程如下：

頁面幾乎是把任務(wù)分析照搬過來了。所以上一步做好了，這一步很輕松，而且越往后越輕松。注意這個流程圖應(yīng)該包括所有將要設(shè)計的新頁面，一個不少，一個不多。它不僅確定頁面內(nèi)容，頁面數(shù)量，還確定各頁面之間的關(guān)系。如果在后來設(shè)計具體頁面原型時，發(fā)現(xiàn)這個流程圖多了或少了頁面，或者頁面關(guān)系發(fā)生了變化，說明你的功夫不到家（這個比較難，我一般不苛求我們的設(shè)計師）。根據(jù)原型圖來創(chuàng)建或者修改頁面流程圖，不是在做設(shè)計，而是在寫設(shè)計說明。3.頁面布局

第三步頁面布局是具體頁面設(shè)計的開始，在上一步知道有哪些頁面需要進行設(shè)計后，這里對頁面進行劃分，對內(nèi)容進行組織。最重要的一點是確定頁面分區(qū)。以動感相冊為例，頁面布局如下： 總布局，即通用布局，適合所有頁面。

具體頁面布局，在不與總布局沖突的情況下，有更細節(jié)的布局。

頁面布局賦予零碎的內(nèi)容以邏輯性，以分區(qū)的形式把頁面各區(qū)域所對應(yīng)的功能區(qū)確定下來，減少具體設(shè)計時的隨意性。這是設(shè)計嚴謹與否的表現(xiàn)所在。把類似的操作放在一起，對于用戶來說是可以預(yù)見的，用戶能夠判斷哪個操作在哪個區(qū)域，減少盲目尋找?guī)淼睦щy和疑惑。4.原型設(shè)計 這一步是大家熟知的，即具體頁面的設(shè)計。這一步設(shè)計把所有的界面元素表現(xiàn)出來?？梢杂械捅Ｕ婧透弑Ｕ嬖蛨D。低保真即是線框圖，高保真多是接近最終效果圖。下面是動感相冊的低保真原型圖。

5.設(shè)計說明

最后一步需要做的是對所有頁面進行詳細的描述，包括對頁面上所有元素進行說明，比如默認狀態(tài)，跳轉(zhuǎn)頁面，字號字體，尺寸等。這里就不解釋了。這是交給開發(fā)人員的文檔，以及測試人員進行測試的依據(jù)。小結(jié)

交互設(shè)計是一個過程，它不僅僅是畫線框圖。交互設(shè)計最關(guān)鍵的兩個環(huán)節(jié)是頁面流程和頁面布局，前者建立清晰的架構(gòu)和嚴密的邏輯，后者整合零散的信息并確定分明的主次關(guān)系。這一切都是為了我們的終極目標(biāo)——讓我們的界面符合用戶的預(yù)期，不帶給他們?nèi)魏蔚囊馔?。一切都在用戶的意料之中?/p>

第五篇：交互設(shè)計檔案

交互設(shè)計師的基本素質(zhì)

首先，談?wù)勎覀€人對交互設(shè)計師基本素質(zhì)的看法。從我個人的理解來看，可以簡單歸納為九字訣：“聽、看、想、說、磨、做、驗、寫、講”（如圖1.1）。

圖1.1 1）聽：做一個交互設(shè)計師，最重要的一點就是要懂得傾聽（這里蘊藏了一個隱晦的性格屬性：謙虛?。?。通常情況下，我們不是用戶，所以很難 100%代表用戶，更左右不了老板，所以我們首先要有聽的本事，把來自用戶的、老板的、PD的、視覺的、前端的、開發(fā)的、測試的、市場的、業(yè)界的等各方面的聲音都聽過來，聽進去。

2）看：99%的情況下，交互不是一蹴而就的創(chuàng)造工作，它是站在前人肩膀上不斷迭代更新的行為過程。我這里指的“看”是要求設(shè)計師能博覽、能泛獵，看到好的，見過差的，什么都略懂，交互才能變得很美??

3）想：交互是思考的輸出產(chǎn)物和表現(xiàn)形式。當(dāng)設(shè)計師將之前聽到的和看到的內(nèi)容在頭腦中加以整理、分析，經(jīng)過發(fā)散的創(chuàng)造性碰撞和嚴謹?shù)倪壿嬚撟C后，逐漸得到了相對靠譜的交互產(chǎn)物。這個思索分析的過程貫穿于交互設(shè)計工作流程的每個環(huán)節(jié)。

4）說：一個能說會道的人不一定是一個優(yōu)秀的交互設(shè)計師，但一個優(yōu)秀的交互設(shè)計師必然是一個善于準(zhǔn)確表達自己想法和觀點的人。在這一點上，我堅持交互是一門分享的學(xué)科，需要的是開放的性格和良好的溝通技巧。

5）磨：耐心、技巧、熱情的綜合表現(xiàn)。在一個項目的進程中，不可避免的會面臨很多的挑戰(zhàn)，優(yōu)秀的交互設(shè)計師善于發(fā)揮“磨”的精神，他們懷揣對交互專業(yè)的無比熱情，以無所不用其極的技巧，耐心的纏死一個又一個質(zhì)疑方，最終讓大家認同并幫助推動設(shè)計的實現(xiàn)。通常來說，一個優(yōu)秀的交互設(shè)計師會是一個優(yōu)秀的Idea推銷員。

6）做：交互設(shè)計師專業(yè)度的核心表現(xiàn)。俗語說得好，是騾子是馬，牽出來遛遛。對于交互設(shè)計師來說，之前的環(huán)節(jié)做得再好、再完美，也只是停留在設(shè)計師自己的腦子里，游蕩于聽眾們的耳膜間。如果理論落實不到實際，那所有的想法都只是空中樓閣，你之前所有的努力都只是在佐證你的空泛和不切實際。所以我們不僅要能 “做”，更要“做”得漂亮，“做”得完美！我一直都是這樣認為：“做”決定了一個交互設(shè)計師是不是靠譜，決定了一個交互設(shè)計師的高度，是一個交互設(shè)計師最根本的專業(yè)素質(zhì)。

7）驗：用戶體驗設(shè)計，最終是要落實到用戶的身上的?？陀^中立的驗證、分析、評估能力是一個優(yōu)秀交互設(shè)計師的重要素質(zhì)。無論個人還是團隊，設(shè)計的成果都需要通過精準(zhǔn)的測試才能算得上合乎標(biāo)準(zhǔn)，此時，一顆平常心和一雙敏銳的眼睛是設(shè)計師最需要的。

8）寫：分析、歸納和總結(jié)能力的綜合表現(xiàn)。一個項目，無論成功還是失敗，總是有很多地方值得設(shè)計師本人或后來人借鑒。交互設(shè)計之路不是一座苛求零失誤的獨木橋，但絕對是一條要求零“重復(fù)”失誤的單行線。評價一個設(shè)計師的專業(yè)度，很重要的一環(huán)就是看他能不能多犯前人從來沒有犯過的錯誤，并能有效總結(jié)給后來人。于是，他就成了大家，路就這樣被趟了出來??

9）講：演講能力。這里所指的是在項目后期進行的交流分享。一個專業(yè)的交互設(shè)計師會站在宏觀的高度上，以平和的心態(tài)同他人溝通，驗證自己先前設(shè)計的合理性、全面性和科學(xué)性，更好的提高自己的專業(yè)能力，為今后的交互設(shè)計做好準(zhǔn)備。

·交互專業(yè)度的具象化表現(xiàn)

剛才講了很多，但總體來說還是偏理論，還是讓人摸不著頭腦，虛幻的概念最大的優(yōu)勢在于它的顛簸不破和四平八穩(wěn)，誰也揪不住它的小辮子。但這不是我的風(fēng)格，更不是我寫這篇文章的初衷，我希望的是拋磚引玉，給大家?guī)硪恍┱嬲饬x上能直接使用的東西。所以，接下來，我們來些“干貨”，玩點簡單粗暴的??

圖1.2

根據(jù)阿里巴巴目前的產(chǎn)品開發(fā)流程（如圖1.2），交互設(shè)計是大環(huán)節(jié)中的一個小點，拋開雜亂的干擾信息，單純考量交互設(shè)計師在過程中的參與度，我們就能得到一個理想化的交互設(shè)計行為流（如圖1.3）：

圖1.3 流程沒什么好講的，更沒什么好爭辯的，無非也就是增加一個、減少一個、偷換概念、細分歸納之類的忽悠。我這里想和大家分享的是流程中每個環(huán)節(jié)的專業(yè)輸出物，我有一個激進的想法：如果某人能精準(zhǔn)的完成某些公認的標(biāo)準(zhǔn)化輸出物，那他99%可以被稱為是一個“專業(yè)”的75分交互設(shè)計師了，剩下的 1%，也許是拼RP??

這里，我先簡單交代一下即將涉及到的流程節(jié)點、對應(yīng)輸出物的圖形色塊的代表含義。

1）流程環(huán)節(jié)說明（如圖1.4）：

圖1.4 2）流程環(huán)節(jié)各輸出物說明（如圖1.5）：

圖1.5 在我看來，一個專業(yè)的交互設(shè)計師，在一個理想化產(chǎn)品設(shè)計的過程中，有一些是屬于必須的輸出物，有一些屬于最好有（推薦）的輸出物，還有一些屬于可有可無的輸出物。同時，根據(jù)項目的實際情況和參與角色的分工情況，存在一些交互設(shè)計師可能需要負責(zé)的輸出物，具體細節(jié)我將在下面逐一介紹。1）需求獲取階段：

此階段通常來說會由PD等外部資源發(fā)起，輸出物主要是FRD文檔和時間計劃文檔，用以描述問題、提出初步目標(biāo)，假想可能的解決方案、預(yù)估資源并梳理時間計劃等。當(dāng)然，對于從UED內(nèi)部發(fā)起的項目，這兩部分的輸出也可以由交互設(shè)計師完成，屬于可能責(zé)任輸出物； 2）需求分析階段：

歷史數(shù)據(jù)的關(guān)注和分析階段，基于項目本身，要針對競爭對手、行業(yè)現(xiàn)狀等做詳盡的收集和分析，其中的關(guān)鍵考核點是要做必要的頭腦風(fēng)暴，獲取發(fā)散而全面的信息集合。在此階段，競爭分析報告和頭腦風(fēng)暴輸出物是交互設(shè)計師專業(yè)度的重要表現(xiàn)。

3）用戶訪談階段：

對于一些條件允許的項目，我們建議能在項目初期尋求一些用戶的信息，定義一些用戶的屬性，這些對于之后的交互設(shè)計都會是堅實的基礎(chǔ)。一個高專業(yè)度的交互設(shè)計師甚至?xí)鲃咏槿朐L談問卷的設(shè)定工作，客觀的參與調(diào)研報告輸出的全過程。

4）需求修正階段：

專業(yè)的交互設(shè)計師通常不甘于淪為一個純粹的資源，抗拒被動的接受命令。我們之前經(jīng)歷的需求分析和用戶訪談都是為掌控主動權(quán)而做的準(zhǔn)備。如今，我們有理有據(jù)，應(yīng)該主動出擊，和需求方討論研究需求的合理性、可行性，明確最終的修正目標(biāo)，并對達成目標(biāo)所涉及的重點突破點有理性的分析判斷，篩選出各設(shè)計點的優(yōu)先級。5）設(shè)計草稿階段

項目目標(biāo)和設(shè)計方向確定下來后，我們將進入核心的設(shè)計環(huán)節(jié)。作為交互設(shè)計師的“殺手锏”，交互流程和線框草圖當(dāng)然一個都不能少，但此時我更想強調(diào)一項輔助性質(zhì)的調(diào)研分析工作。從交互的角度來看，在大流程大框架敲定的情況下，交互設(shè)計師通常會投入更多的精力在一些核心的設(shè)計點，也就是我們在需求修正階段確認的設(shè)計重點。此時，專業(yè)的設(shè)計師絕對不會拍腦袋設(shè)計，更不會想當(dāng)然出方案，而是會針對這些核心點做業(yè)界調(diào)研和分析，為自己即將進行的設(shè)計尋求一個足夠?qū)拸V厚實的肩膀。6）設(shè)計細化階段

第一階段的設(shè)計工作將在此階段性輸出。我們回顧一下，截止此時的設(shè)計產(chǎn)物有：用戶調(diào)研報告、FRD確認文檔、交互流程、線框草圖、核心設(shè)計調(diào)研分析、核心設(shè)計詳細說明、交互流程整體說明等?；旧?，一個交互設(shè)計師的專業(yè)度，已經(jīng)可以根據(jù)此時的輸出物數(shù)量、質(zhì)量看出個大概齊了 7）專家評審階段

一個專業(yè)的交互設(shè)計師，要謙虛。此刻，我們進入小范圍專家評審的階段了，三個臭皮匠還頂一個諸葛亮呢，更何況是參與評審的專家呢。此時設(shè)計師的專業(yè)度就體現(xiàn)在 “聽”、“說”和“想”這三訣上，耐心的做好評審記錄，有理有據(jù)的同專家們進行專業(yè)溝通，并確認最終的結(jié)論和方向。8）設(shè)計優(yōu)化階段

經(jīng)歷了專家團的考驗，又該抖擻精神重新上路了，沒什么好說的，把過程做好了，你的專業(yè)度也就到位了。設(shè)計優(yōu)化階段的投入度和產(chǎn)出將直接影響到后續(xù)Demo及測試的效果，和最終設(shè)計也息息相關(guān)，各位交互設(shè)計師們，千萬別打瞌睡了！

9）仿真Demo開發(fā)階段

終于到了仿真Demo的模型化階段啦，這時盡管并沒有直接的交互輸出物，但還是需要交互設(shè)計師用百分百的挑刺精神，協(xié)助視覺和前端精準(zhǔn)的達成我們之前的設(shè)計，嚴格保證最佳的輸出效果。10）測試驗證階段

仿真Demo出來之后，將進入最后的測試驗證階段，根據(jù)項目的實際情況，可能是QA測試，也可能是用戶測試，總之，這個環(huán)節(jié)能幫助設(shè)計師最后把關(guān)設(shè)計的合理性，專業(yè)如你，一定要親自跟進測試并給出最終的評估報告，哪些點是前期沒有考慮周全的？那些點是成功的？哪些點是必須立即改進的？哪些點能以后再說？哪些?? 11）完成設(shè)計階段

最后的設(shè)計階段，根據(jù)之前的測試驗證評估報告，交互設(shè)計師要對所有之前的輸出做一次嚴格的檢查和修正，完成最后的輸出。

12）開發(fā)上線階段

盯緊視覺設(shè)計師和前端工程師吧，最關(guān)鍵的時候終于到了，經(jīng)歷了那么多紛繁復(fù)雜的環(huán)節(jié)，我們等的就是上線的這一瞬間。當(dāng)然，千萬別忘了后續(xù)的跟蹤和分析，這能為你的專業(yè)度加分不少哦 ·總結(jié)和展望

綜上所述，我們已經(jīng)整理出來了體現(xiàn)交互設(shè)計師專業(yè)度的過程輸出物了，總結(jié)一下：以75分交互設(shè)計師的標(biāo)準(zhǔn)來看，我們的專業(yè)度能通過以下的關(guān)鍵輸出物衡量：FRD目標(biāo)確認文檔、競爭分析報告、頭腦風(fēng)暴產(chǎn)出物、項目初期用戶調(diào)研報告、核心設(shè)計點調(diào)研及分析報告、專家評審報告和評估報告、原型測試報告、交互流程圖及詳細說明文檔、頁面線框圖、核心設(shè)計點說明文檔和最后的跟蹤分析報告。

基本上，所有的輸出物都是反復(fù)易稿的結(jié)果，都是細碎過程的迭代輸出，都飽含了設(shè)計師辛勤的工作投入。所有有夢想的交互設(shè)計師們，請正確的審視這些輸出物，珍惜自己的付出，它們不光是單板的形式教條，它們更是證明自己專業(yè)度最有利的武器！

被很多同學(xué)都質(zhì)疑過：那么多的輸出物，平時做需求怎么可能全部做出來？每當(dāng)此時，我的回答都是一樣的：“是的，找借口總是很容易的。大家的確都很忙碌，按季度來說，基本上每個人都會經(jīng)手大大小小幾十個需求，但我們真的忙碌到輸出一個高質(zhì)量設(shè)計的精力都沒有了嗎？還是我們打心里就本著做交互、混日子的想法呢？”

不是不能，是不愿！那才是交互設(shè)計這個職業(yè)最可悲之處??

作者信息：本文http://