400-077-787913998539835
當前位置:首頁 > 新聞資訊 > 常見問題

UI入門工作流程介紹-大連網站設計

發表日期:2019-08-25文章編輯:網建科技瀏覽次數: 標簽:

UI入門工作流程介紹-大連網站設計 軟文代寫哪家好

設計師在工作中需要清楚了解設計的目的,尤其是你做的不是大眾化產品,不能以個人認知、很強的主題性(如游戲)或”潮流“風格來確定目標時。比如設計小米手機的老人模式,老人需要什么樣的顏色?增加樣式是會產生干擾還是更好的體驗感?按鈕要多大才合適?在這種產品的UI設計時,設計師需要從頭參與,而且到了設計環節時,設計師基本上已經心里有數了。

我傾向于說“交互設計的整個流程”。在我這里,UI是指“界面”,在視覺設計開始之前,界面的的交互策劃與設計是很重要的前置步驟,對終的用戶體驗有很大的影響。

我團隊在交互設計階段一般有產品經理、交互設計師和UI設計師主要參與。以我的了解,很多公司不設專門的交互設計師,而由產品經理完成相關工作。以下是我這里的工作流程(圖片來自于網絡,本團隊的就不貼了)。這個流程希望整個產品團隊都能參與其中并共同加強對產品的理解?;蛘呓枰粋€時髦的概念,我是希望團隊能具有更多Design Thinking,“設計思維”,來加強和推動解決問題的能力,并激發更多創新。

開始一定要把Scenario應用場景和persona用戶角色做出來。你的產品是在何種場景下被使用,你的用戶角色是怎樣特征的人。設計的對不對,要用用戶角色來判斷,而不是設計師或產品經理自己。把場景和角色描述清楚,并且讓整個團隊理解透徹,這能保證團隊少犯錯誤。

*用戶角色persona,實際工作中寫文字描述就好,不用做的如下圖一般高大上。如果你要給客戶或Boss提案,可以做一個提升逼格。

1.Storyboard故事版:

主要負責人:產品經理或交互設計師

早大家開始討論用戶體驗流程,在白板上邊畫流程邊添加粗略的UI元素。會后交互設計師會在在紙上做手繪版線框圖。這階段產品經理、交互設計師、UI設計師、包括技術工程師會一同作大量的討論,而且主要討論的是流程和主要功能,因此手畫故事版快方便并易于修改的。

此環節要敲定Userflow,用戶流程及其中的關鍵步驟,每一步驟都是一個主要界面。

*白板上一般都是這樣,交互設計同學會在紙上重繪。

*移動產品設計這樣做也行,不買專用的模板本和工具尺,自己打印也行。

2.Key wireframe關鍵界面線框圖

主要負責人:交互設計師

在確定的用戶流程中,選出幾個關鍵的,有代表性的步驟,做細化的Wireframe線框圖。線框圖里要確保每一個UI元素的設計,包括其大小和位置。我們做的線框圖是1:1的,也就是線框圖與實際界面尺寸一致。1:1的線框圖能在前期避免考慮不周和執行困難等很多問題的出現。

此環節要確定關鍵界面里的UI元素和布局,以及全局的布局排版風格。

*線框圖做成1:1知名。輸出到文檔里要添加說明。在后面的工作里,這份文檔可以讓UI設計同學和工程師同學共用。

3.Key visual design關鍵界面視覺設計

主要負責人:UI設計師

此環節交互設計師會按確定的用戶流程及確定的布局風格來繼續做其它界面的線框圖。UI設計師則同時開始做關鍵界面的視覺設計,進行配色、樣式不同風格的嘗試。

此環節要確定產品界面的視覺設計風格。

4.All wireframe全部界面線框圖

主要負責人:交互設計師

此環節交互設計師要完成全部界面的線框圖(1:1的)設計并且團隊確認。

*做完全部的線框圖,一般會出一個總結構圖。如果有足夠大的場地,也可以逐頁打印出來貼到一面墻上。方便團隊隨時參考。

5.prototype可動原型

主要負責人:交互設計師

此環節依產品需求而定。如果靜態的線框圖還不能完整的體現出產品特點,那就需要做成可操作甚至有關鍵界面動畫示意的可動原型。通常是HTML的可動原型,特殊項目也曾經做過Flash的。我還有一個奇葩朋友用ppT做過(ppT的開發工具+VB Script)幾乎接近成品界面的可動原型。

此環節的確認同上一步,團隊的理解會更精準。

*忍不住貼一個ppT的開發工具面板,提供VS風格的控件,并且直接用VB script寫控件邏輯!還可以帶dummy數據!客戶都以為你開發完畢了有木有。

6.UI design全部界面視覺設計

主要負責人:UI設計師

完成全部界面的UI視覺設計。

此環節確認全部UI設計。同時把確認的UI更新到文檔里。

如沒特殊注明,文章均為網建科技原創,轉載請注明來自http://www.lensng.com
相關新聞

漲知識!seo如何進行頁面優化?

  關于seo,如何對好的頁面進行優化以便于搜索引擎?可以實現的方式可以多樣化、...

日期:2020-11-21

果斷收藏:熊掌號seo操作方法!

  關于seo,“熊掌號”seo的目標是通過seo技術為熊掌號主體帶來流量,將流量轉化...

日期:2020-11-21

不得不知seo優化方法分享!

  關于seo優化,由于因特網的便捷性,可以很容易地找到有關seo方法的資料,也正是由...

日期:2020-11-21

【干貨分享】怎樣將seo排在首頁的前三位?

  關于seo,對某個關鍵字進行搜索,就會出現自然排名,隨著關鍵字排名的下降,流量或...

日期:2020-11-21

漲知識!關鍵詞如何進行seo優化排版?

  關于seo優化,網站需要大量的seo基礎優化設置,關鍵字布局就是要優化設置的,利用...

日期:2020-11-21

果斷收藏:搜索引擎優化適合什么人學?

  關于搜索引擎優化,而且seo市場的巨大需求使得更多的人開始從事seo職業,并且在...

日期:2020-11-21

不得不知Seo每天都要寫文章嗎?

  關于seo支持大量的新鮮內容,如果seo可以每天寫文章,并將文章提交給SEO,那么對...

日期:2020-11-21

【干貨分享】如何設置seo關鍵詞?

  關于seo,如何設置關鍵字需要與做seo打交道,每個頁面都可以單獨放置某些特定的...

日期:2020-11-21

漲知識!百度搜索引擎優化排名規則!

  關于搜索引擎優化,熟練掌握百度seo排名的原理,正確執行,稱為seo大神。事實上,百...

日期:2020-11-21

漲知識!seo關鍵詞如何優化推廣?

  關于seo關鍵詞,出現較多的是一些主要產品的名稱或名稱不同的產品,如果將一些...

日期:2020-11-18