設(shè)計師中，設(shè)計師需要清楚地了解設(shè)計的目的，特別是當(dāng)你不一個受歡迎的產(chǎn)品，不能以個人認(rèn)知、強大的主題（如游戲）或趨勢風(fēng)格來確定目標(biāo)時。例如，老年人在設(shè)計小米手機時需要什么顏色？增加風(fēng)格是干擾還是更好的體驗？按鈕多大才合適？在本產(chǎn)品中UI在設(shè)計過程中，設(shè)計師需要從頭開始參與，在設(shè)計過程中，設(shè)計師基本上已經(jīng)知道了。

　　我傾向于說整個交互設(shè)計過程。在這里，UI在視覺設(shè)計開始之前，界面的交互規(guī)劃和設(shè)計是一個非常重要的前提步驟，對最終的用戶體驗有很大的影響。

　　我們的團隊在交互設(shè)計階段通常有產(chǎn)品經(jīng)理、交互設(shè)計師和UI設(shè)計師主要參與。據(jù)我所知，很多公司由產(chǎn)品經(jīng)理完成相關(guān)工作，而不是專門的交互設(shè)計師。以下是我在這里的工作流程(圖片來自網(wǎng)絡(luò)，團隊不貼)。希望整個產(chǎn)品團隊都能參與其中，加強對產(chǎn)品的理解。或者借一個時尚的概念，我希望團隊能有更多DesignThinking，加強和促進(jìn)解決問題的能力，激發(fā)更多的創(chuàng)新。

　　一定要開始Scenario應(yīng)用場景和Persona制作用戶角色。您的產(chǎn)品在什么場景中使用，您的用戶角色是什么特征。設(shè)計是否正確取決于用戶角色，而不是設(shè)計師或產(chǎn)品經(jīng)理本身。清楚地描述場景和角色，讓整個團隊徹底理解，以確保團隊少犯錯誤。

　　*用戶角色Persona，在實際工作中寫文字描述是好的，不需要做如下圖所示的高度。如果你想給客戶或客戶，或者Boss提案，可以做提升逼格。

　　1.Storyboard故事版：

　　主要負(fù)責(zé)人：產(chǎn)品經(jīng)理或交互設(shè)計師

　　早些時候，我們開始討論用戶體驗過程，并在白板上繪制過程加粗略的UI元素。會后交互設(shè)計師會在在紙上做手繪版線框圖。這階段產(chǎn)品經(jīng)理、交互設(shè)計師、UI包括技術(shù)工程師在內(nèi)的設(shè)計師會一起做很多討論，主要討論過程和主要功能，所以手繪故事版快捷方便，易于修改。

　　這個環(huán)節(jié)要敲定Userflow，每一步都是用戶流程和關(guān)鍵步驟的主界面。

　　*白板一般都是這樣，交互設(shè)計的學(xué)生會在紙上重畫。

　　*這樣設(shè)計移動產(chǎn)品也可以，不買專用模板本和工具尺，自己打印也可以。

　　2.Keywireframe關(guān)鍵界面線框圖

　　主要負(fù)責(zé)人：交互設(shè)計師：

　　在確定的用戶流程中，選擇幾個關(guān)鍵的、有代表性的步驟并進(jìn)行細(xì)化Wireframe線框圖。確保線框圖中的每一個。UI元素的設(shè)計包括其大小和位置。我們制作的線框圖是1:1，即線框圖與實際界面尺寸一致。1:1的線框圖可以避免早期考慮不當(dāng)、執(zhí)行困難等諸多問題。

　　在關(guān)鍵界面中確定此鏈接UI元素和布局，以及整體布局和布局風(fēng)格。

　　*線框圖1:1出名。輸出到文檔中添加說明。在以下工作中，本文檔允許UI設(shè)計與工程師共享。

　　3.Keyvisualdesign視覺設(shè)計的關(guān)鍵界面

　　主要負(fù)責(zé)人：UI設(shè)計師

　　交互設(shè)計師將繼續(xù)根據(jù)確定的用戶流程和確定的布局風(fēng)格制作其他界面的線框圖。UI設(shè)計師則同時開始做關(guān)鍵界面的視覺設(shè)計，進(jìn)行配色、樣式不同風(fēng)格的嘗試。

　　本環(huán)節(jié)應(yīng)確定產(chǎn)品界面的視覺設(shè)計風(fēng)格。

　　4.Allwireframe所有界面線框圖

網(wǎng)站設(shè)計-沙漠風(fēng)網(wǎng)站建設(shè)公司" />

　　主要負(fù)責(zé)人：交互設(shè)計師：

　　交互設(shè)計師應(yīng)完成所有界面的線框圖(1:1)設(shè)計，并由團隊確認(rèn)。

　　*完成所有的線框圖，一般會產(chǎn)生總結(jié)構(gòu)圖。如果有足夠大的場地，也可以逐頁打印，貼在墻上。方便團隊隨時參考。

　　5.Prototype可動原型

　　主要負(fù)責(zé)人：交互設(shè)計師：

　　這個鏈接取決于產(chǎn)品的需求。如果靜態(tài)線框圖不能完全反映產(chǎn)品的特點，則需要制作可操作甚至關(guān)鍵界面動畫示意的可移動原型。HTML可移動原型和特殊項目也做過Flash我還有一個很棒的朋友用它。PPT做過（PPT的開發(fā)工具VBScript）可移動原型幾乎接近成品界面。

　　與上一步相同，團隊的理解將更加準(zhǔn)確。

　　*忍不住貼一個PPT開發(fā)工具面板，提供VS風(fēng)格控件，直接使用VBscript寫控件邏輯！也可以帶來dummy數(shù)據(jù)！客戶認(rèn)為你已經(jīng)開發(fā)好了。

　　6.UIdesign所有界面視覺設(shè)計

　　主要負(fù)責(zé)人：UI設(shè)計師

　　完成所有界面UI視覺設(shè)計。

　　全部確認(rèn)此鏈接UI設(shè)計。同時確認(rèn)UI在文檔中更新。