設計師中,設計師需要清楚地了解設計的目的,特別是當你不一個受歡迎的產品,不能以個人認知、強大的主題(如游戲)或趨勢風格來確定目標時。例如,老年人在設計小米手機時需要什么顏色?增加風格是干擾還是更好的體驗?按鈕多大才合適?在本產品中UI在設計過程中,設計師需要從頭開始參與,在設計過程中,設計師基本上已經知道了。
我傾向于說整個交互設計過程。在這里,UI在視覺設計開始之前,界面的交互規劃和設計是一個非常重要的前提步驟,對最終的用戶體驗有很大的影響。
我們的團隊在交互設計階段通常有產品經理、交互設計師和UI設計師主要參與。據我所知,很多公司由產品經理完成相關工作,而不是專門的交互設計師。以下是我在這里的工作流程(圖片來自網絡,團隊不貼)。希望整個產品團隊都能參與其中,加強對產品的理解。或者借一個時尚的概念,我希望團隊能有更多DesignThinking,加強和促進解決問題的能力,激發更多的創新。
一定要開始Scenario應用場景和Persona制作用戶角色。您的產品在什么場景中使用,您的用戶角色是什么特征。設計是否正確取決于用戶角色,而不是設計師或產品經理本身。清楚地描述場景和角色,讓整個團隊徹底理解,以確保團隊少犯錯誤。
*用戶角色Persona,在實際工作中寫文字描述是好的,不需要做如下圖所示的高度。如果你想給客戶或客戶,或者Boss提案,可以做提升逼格。
1.Storyboard故事版:
主要負責人:產品經理或交互設計師
早些時候,我們開始討論用戶體驗過程,并在白板上繪制過程加粗略的UI元素。會后交互設計師會在在紙上做手繪版線框圖。這階段產品經理、交互設計師、UI包括技術工程師在內的設計師會一起做很多討論,主要討論過程和主要功能,所以手繪故事版快捷方便,易于修改。
這個環節要敲定Userflow,每一步都是用戶流程和關鍵步驟的主界面。
*白板一般都是這樣,交互設計的學生會在紙上重畫。
*這樣設計移動產品也可以,不買專用模板本和工具尺,自己打印也可以。
2.Keywireframe關鍵界面線框圖
主要負責人:交互設計師:
在確定的用戶流程中,選擇幾個關鍵的、有代表性的步驟并進行細化Wireframe線框圖。確保線框圖中的每一個。UI元素的設計包括其大小和位置。我們制作的線框圖是1:1,即線框圖與實際界面尺寸一致。1:1的線框圖可以避免早期考慮不當、執行困難等諸多問題。
在關鍵界面中確定此鏈接UI元素和布局,以及整體布局和布局風格。
*線框圖1:1出名。輸出到文檔中添加說明。在以下工作中,本文檔允許UI設計與工程師共享。
3.Keyvisualdesign視覺設計的關鍵界面
主要負責人:UI設計師
交互設計師將繼續根據確定的用戶流程和確定的布局風格制作其他界面的線框圖。UI設計師則同時開始做關鍵界面的視覺設計,進行配色、樣式不同風格的嘗試。
本環節應確定產品界面的視覺設計風格。
4.Allwireframe所有界面線框圖
網站設計-沙漠風網站建設公司" />
主要負責人:交互設計師:
交互設計師應完成所有界面的線框圖(1:1)設計,并由團隊確認。
*完成所有的線框圖,一般會產生總結構圖。如果有足夠大的場地,也可以逐頁打印,貼在墻上。方便團隊隨時參考。
5.Prototype可動原型
主要負責人:交互設計師:
這個鏈接取決于產品的需求。如果靜態線框圖不能完全反映產品的特點,則需要制作可操作甚至關鍵界面動畫示意的可移動原型。HTML可移動原型和特殊項目也做過Flash我還有一個很棒的朋友用它。PPT做過(PPT的開發工具VBScript)可移動原型幾乎接近成品界面。
與上一步相同,團隊的理解將更加準確。
*忍不住貼一個PPT開發工具面板,提供VS風格控件,直接使用VBscript寫控件邏輯!也可以帶來dummy數據!客戶認為你已經開發好了。
6.UIdesign所有界面視覺設計
主要負責人:UI設計師
完成所有界面UI視覺設計。
全部確認此鏈接UI設計。同時確認UI在文檔中更新。