UI 設計的整個工作流程是怎樣的?

2021-09-14 01:45:47 字數 3173 閱讀 7603

作為乙個專業ui設計師,不僅僅要了解整個產品在ui介面設計,互動設計中的工作流程,更需要了解整個產品從需求提出到產品上線的整個工作流程。

以下是網際網路產品個部門的工作分配及流程:

從圖中可以看到,乙個網際網路產品從策劃到最後的上線營銷,都需要由不同的部門分擔其責,而每個部門中,根據崗位的劃分,在細分到每個工種上來,所以乙個網際網路產品的開發流程,並不是單個的人,或者個別的部門可以實現完成的,它是乙個完整的團隊通力合作的產物。部門與部門,崗位與崗位相互協作配合,才會出色高效的完成專案。

一般網際網路公司會有幾個部門劃分:

1、產品部門(產品經理、產品專員)

2、設計部門(gui設計師、互動設計師、前端工程師)

3、研發部門(構架工程師、程式開發)

4、測試部門(測試專員)

5、市場部門(銷售、渠道、公關、品牌)

6、運營部門(客服、運維)

各部門的工作職責如下:

產品部門:負責產品調研,產品方案策劃,產品原型圖設計,和技術開發對接,後續可能和運營部門對接。

設計部門:負責產品視覺設計,互動設計,前端布局。有一些公司會把前端這一塊劃分到開發部門,理由是前端的工作和程式開發一樣,都是碼**,設計部門就是單純的只管視覺設計方面。但是這種說法其實不太正確,前端的**實現和後台的程式開發,雖然都是碼**,但是運用的技術是不一樣的,實現的功能和效果也是不相同的,所以前端工程師劃分到設計部門會更合理一些。

研發部門:產品構架設計,資料庫設計,前後臺編碼設計,後期的運維,網路安全。

測試部門:測試程式中的bug,編寫測試計畫、測試用例及測試報告等文件,優化流程。

市場部門:產品企劃策略,**活動的策劃及組織,品牌規劃和品牌的形象建設,市場廣告推廣活動和公關活動。

運營部門:seo/sem優化推廣,平台活動策劃(線上線下),廣告投放,客戶關係管理,資料分析。

設計部門的崗位劃分通常有ui設計師、互動設計師、前端工程師,小型公司崗位劃分不完善,會把互動設計師的工作(互動流程、互動線框、交互動效)交由產品人員來完成,以下梳理出ui設計師參與和需完成的流程:

一、需求梳理、分析

在這個過程中會根據提煉的真實使用者需求來確定產品需求,產品經理將根據溝通中的相關資料的word、ppt、jpg等等東西翻譯成邏輯語言,最簡單的就是產出一張產品功能腦圖或者乙份功能列表。

產品功能腦圖:

產品功能列表:

大家開始討論使用者體驗流程,在白板上邊畫流程邊新增粗略的ui元素。之後產品經理會在紙上做手繪版線框圖。這階段產品經理、ui設計師、包括技術工程師會一同作大量的討論,而且主要討論的是流程和主要功能,因此手畫故事版最快最方便並易於修改的。此環節要敲定userflow,使用者流程及其中的關鍵步驟,每一步驟都是乙個主要介面。之後產品經理繪製紙質版低保真互動原型圖(可借用專業的模板本和工具)

二、關鍵介面線框圖(可不帶互動功能)

初步產品功能需求梳理清楚之後,產品經理持續跟進,反覆溝通,在確定的使用者流程中,選出幾個關鍵的,有代表性的步驟,做1:1細化線框圖。此環節要確定關鍵介面裡的ui元素和布局,以及全域性的布局排版風格。

三、關鍵介面視覺設計

此環節ui設計師會做關鍵介面的整體視覺設計,嘗試不同風格、顏色的搭配,ui元素的運用,最終確定產品的視覺設計風格。

四、全部介面線框圖(帶互動功能)

產品經理完成1:1帶互動和流程的全部介面線框圖設計並確認。

介面線框圖(為互動功能新增釋義和說明。)

線框流程圖

五、全部介面視覺設計

ui設計師輸出全部介面的視覺設計圖,並確認。

六、介面標註、切圖

1、在確認全部介面視覺稿以後,首先對每個介面進行標註,標註圖移交前端工程師。

標註圖(畫素大廚、藍湖等軟體)

2、介面切圖,移交前端工程師

切**件夾

切**件

至此,ui的工作流程才算完成,但是現實專案中,很多環節是乙個交替迭代的過程,需要不停的修改和優化,包括整個流程進入到開發以後,也會需要ui設計師協同調整,所以ui設計師的工作,不單單是只完成單純的介面視覺設計,前面包括使用者定位,線框繪製,流程梳理,互動實現,後面包括前端布局,很多環節,ui設計師都必須參與進來,只有多角度的了解專案,了解各崗位的工作流程,才能做出符合市場需求,符合使用者需求的產品。

**:千鋒ui設計學院的回答 - 知乎

UI設計師整體工作流程!

我傾向於說 互動設計的整個流程 在我這裡,ui是指 介面 在視覺設計開始之前,介面的的互動策劃與設計是很重要的前置步驟,對最終的使用者體驗有很大的影響。我團隊在互動設計階段一般有產品經理 互動設計師和ui設計師主要參與。以我的了解,很多公司不設專門的互動設計師,而由產品經理完成相關工作。以下是我這裡...

UI入門必讀!完整的UI設計學習流程是怎樣的?

目前ui設計師現越來越火,薪資也越來越高。隨著技術領域的逐步拓展,產品生產的人性化意識日趨增強,越來越多的企業開始注重互動設計 使用者測試方面的投入,這也就意味著兼具美術設計 程式編碼 市場調查 心理學分析等諸多方面綜合能力的ui設計師,將有更為廣闊的發展前景。很多同學剛接觸ui設計這個新的專業,但...

UI視覺設計師工作流程上的總結與建議

最近有一些剛入行的學妹過來問我,如何才能成為一名合格的設計師,我想三言兩語很難傳達,於是準備了一篇長文,主要是根據積累的經驗和對該行業的認識來敘述作為視覺設計師需要哪些能力。1.理解業務需求 產品定位和互動邏輯 2.理性確立設計風格並初步評審 3.設計過程中結合需求,合理優化設計 4.保持有效溝通,...