接地氣!國內(nèi)知名UED團(tuán)隊(duì)的設(shè)計(jì)流程是怎樣的?

@diff_ :這個(gè)設(shè)計(jì)流程,更適合“對(duì)設(shè)計(jì)有要求的創(chuàng)業(yè)公司”,因?yàn)?,它既包含大公司的?guī)范化、核心設(shè)計(jì)過程,同時(shí),又能適應(yīng)小團(tuán)隊(duì)的快速作戰(zhàn)。這個(gè)流程,雖然有9步,但其實(shí)不復(fù)雜,在我們團(tuán)隊(duì),整個(gè)跨度,只有4周。學(xué)習(xí)時(shí)間到咯

第一版教程見:《超多干貨!國內(nèi)知名UED團(tuán)隊(duì)的設(shè)計(jì)流程是怎樣的?》

先說我們產(chǎn)品開發(fā)過程中的幾個(gè)角色:

  1. PM;
  2. 交互視覺設(shè)計(jì)師(沒看錯(cuò),就是一個(gè)職位);
  3. 開發(fā);

從拿到PM的PRD開始,說說我們團(tuán)隊(duì)的設(shè)計(jì)流程吧:

1. 產(chǎn)品找茬

  • 前提:讀懂PRD。確保在需求理解上,與PM保持一致;
  • 查找遺漏。人無完人,再成熟的PM,也難免有疏漏。找出遺漏,與PM反饋、溝通;(這個(gè)過程非常重要,若在設(shè)計(jì)后期(甚至開發(fā)后期)才發(fā)現(xiàn)疏漏,返工成本太大。)
  • 提出產(chǎn)品新想法。讀PRD時(shí),總會(huì)有一些產(chǎn)品的好想法冒出來,及時(shí)與PM和團(tuán)隊(duì)溝通。(這個(gè)階段,仍是產(chǎn)品早期,歡迎新想法);
  • 開始構(gòu)思交互;

2. 草圖快速溝通

通過草圖,快速將“產(chǎn)品關(guān)鍵流程”、“關(guān)鍵交互及界面布局”呈現(xiàn)紙面,以此與PM、技術(shù)溝通至達(dá)成共識(shí);

目的:

  1. 再次掃遺漏;
  2. 收攏想法;(這個(gè)階段,產(chǎn)品設(shè)計(jì)基本定型)
  3. 達(dá)成共識(shí);(確保讓產(chǎn)品、設(shè)計(jì)、技術(shù)對(duì)要做的事情有一致的理解)

(PM需更新PRD、技術(shù)開始做開發(fā)準(zhǔn)備)

3. Wireframe表現(xiàn)產(chǎn)品流程、界面

包含:

  • 產(chǎn)品流程圖;
  • 全部的頁面原型;

Wireframe讓團(tuán)隊(duì)對(duì)產(chǎn)品的理解無異議,對(duì)最終的產(chǎn)品有直觀的了解。這個(gè)階段,產(chǎn)品需求凍結(jié)。開發(fā)人員可以依據(jù)原型對(duì)UI關(guān)聯(lián)較小的部分進(jìn)行技術(shù)開發(fā);

接地氣!國內(nèi)知名UED團(tuán)隊(duì)的設(shè)計(jì)流程是怎樣的?

4. 視覺設(shè)計(jì)

有前面兩個(gè)“掃清障礙”的過程,這個(gè)階段,視覺設(shè)計(jì)是非常舒服的事情...
在有相對(duì)完整的設(shè)計(jì)規(guī)范、控件規(guī)范的前提下,視覺包括:

  • 風(fēng)格探索;
  • 關(guān)鍵頁面的視覺設(shè)計(jì);
  • 關(guān)鍵的交互動(dòng)畫表現(xiàn)(如果無法口頭向技術(shù)表達(dá)動(dòng)畫效果時(shí),給出一個(gè)“活的”效果,是非常直觀的);

5. 視覺素材輸出、設(shè)計(jì)文件標(biāo)注

  • 素材用Dropbox或酷盤存儲(chǔ)、管理;
  • Markman是不錯(cuò)的標(biāo)注工具;

6. 整理、提交設(shè)計(jì)方面待數(shù)據(jù)驗(yàn)證的跟蹤點(diǎn);

主要包括:

  • 待驗(yàn)證的產(chǎn)品功能點(diǎn);
  • 設(shè)計(jì)過程中爭議比較大的部分(產(chǎn)品、交互、視覺);
  • 設(shè)計(jì)師沒有完全把握、需要數(shù)據(jù)驗(yàn)證想法的部分;(比如:“點(diǎn)擊式的菜單”與“下拉手勢(shì)式的菜單”,哪個(gè)更被用戶接受?)

目的:

  • 為下個(gè)版本的設(shè)計(jì)溝通、設(shè)計(jì)過程提供數(shù)據(jù)支持;
  • 通過數(shù)據(jù),讓設(shè)計(jì)師的主觀判斷有依據(jù);為設(shè)計(jì)師自我觀念、想法迭代提供依據(jù)(沒有眼睜睜的事實(shí),除了難改變別人的想法,也很難改變自我的想法)。

7. 設(shè)計(jì)文件整理、新的設(shè)計(jì)控件入庫

累活。主要包括:

  • 整理設(shè)計(jì)文件,方便團(tuán)隊(duì)其他人查閱、使用;
  • 將設(shè)計(jì)過程中產(chǎn)生的新的控件,納入控件庫;更新控件設(shè)計(jì)規(guī)范;

8. 開發(fā)后期,細(xì)節(jié)跟進(jìn)

與開發(fā)跟進(jìn)細(xì)節(jié),是設(shè)計(jì)過程的一部分。

在我們團(tuán)隊(duì),完全依靠規(guī)范作業(yè)、設(shè)計(jì)文件標(biāo)注(不和開發(fā)人員說一句話 : P),能夠確保80%的交互、視覺細(xì)節(jié)能夠被還原。剩下的20%,就要設(shè)計(jì)師與開發(fā)人員肩并肩坐在一起打磨了。開發(fā)過程中,一定要預(yù)留這個(gè)時(shí)間。

主要包括:

  • 邊距;
  • 字體;
  • 界面動(dòng)畫的數(shù)值微調(diào);

9. 項(xiàng)目設(shè)計(jì)總結(jié)

包括:

  • 設(shè)計(jì)過程中遇到的問題,以及解決方法;
  • 犯的錯(cuò)誤是?你是如何糾正的?以后如何避免?
  • 分享整個(gè)設(shè)計(jì)過程中,你最有成就感的部分;

這個(gè)部分,對(duì)于初級(jí)設(shè)計(jì)師非常有幫助,能夠快速成長;同時(shí),能夠檢測(cè)設(shè)計(jì)過程遇到的問題,提高設(shè)計(jì)、產(chǎn)品開發(fā)效率。

以上是個(gè)人實(shí)戰(zhàn)總結(jié)。

這個(gè)設(shè)計(jì)流程,更適合“對(duì)設(shè)計(jì)有要求的創(chuàng)業(yè)公司”,因?yàn)?,它既包含大公司的?guī)范化、核心設(shè)計(jì)過程,同時(shí),又能適應(yīng)小團(tuán)隊(duì)的快速作戰(zhàn)。這個(gè)流程,雖然有9步,但其實(shí)不復(fù)雜,在我們團(tuán)隊(duì),整個(gè)跨度,只有4周。

或許你有留意,我寫在最前面的角色介紹里,有“交互視覺設(shè)計(jì)師”。

在我從業(yè)的過程中,著實(shí)沒有發(fā)現(xiàn)“交互設(shè)計(jì)師”的這個(gè)職位的生存意義,無論向上向下,高素質(zhì)的PM和視覺設(shè)計(jì)師都可以兼任。所以,在我們團(tuán)隊(duì),我對(duì)設(shè)計(jì)師的要求是:

  1. 對(duì)產(chǎn)品的理解,不能弱于產(chǎn)品經(jīng)理;
  2. 交互設(shè)計(jì),是思維;
  3. 視覺表現(xiàn),是手段;

剛好,我們團(tuán)隊(duì)正在尋找這樣的交互視覺設(shè)計(jì)師,有興趣的私信我。我們的產(chǎn)品是:英語流利說

設(shè)計(jì)師進(jìn)階好文推薦!

騰訊設(shè)計(jì)師的進(jìn)階建議,超實(shí)用!
《17條經(jīng)驗(yàn)之談!視覺設(shè)計(jì)師如何進(jìn)階提升自己能力》

想過稿就得先了解下設(shè)計(jì)評(píng)審!
《說到心坎了!關(guān)于設(shè)計(jì)評(píng)審的一些思考》

提高效率才有時(shí)間進(jìn)步呀!
《秒變?cè)O(shè)計(jì)快刀手!10個(gè)幫設(shè)計(jì)師提高效率的經(jīng)驗(yàn)分享》

原文地址:zhihu
作者:@diff_

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱:2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計(jì)師學(xué)習(xí)平臺(tái),專注分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書:史上最全的設(shè)計(jì)師圖書導(dǎo)航:http://hao.uisdc.com/book/
設(shè)計(jì)微博:擁有粉絲量98萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ,歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航:全球頂尖設(shè)計(jì)網(wǎng)站推薦,設(shè)計(jì)師必備導(dǎo)航:http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎?
添加 優(yōu)秀網(wǎng)頁設(shè)計(jì) 微信號(hào):【youshege】優(yōu)設(shè)哥的全拼
您也可以通過掃描下方二維碼快速添加:

接地氣!國內(nèi)知名UED團(tuán)隊(duì)的設(shè)計(jì)流程是怎樣的?

收藏 90
點(diǎn)贊 6

復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。