5個工作階段中,UI設(shè)計師對應(yīng)的工作方法
今天跟大家聊一下UI設(shè)計師在日常工作中如何理性地思考,如何將理性思考結(jié)果應(yīng)用到工作中的一個方法,文章會針對UI設(shè)計師在接到產(chǎn)品需求時,我們應(yīng)該如何支持需求?如何讓我們的方案更好地滿足需求?以便更好地解決問題,最大化地提升設(shè)計師的個人價值。
首先提個問,如果大家在接到產(chǎn)品經(jīng)理發(fā)過來一個需求時,例如:增加一個A功能、或優(yōu)化B功能等等,諸如此類需求,面對產(chǎn)品需求我們應(yīng)該怎么做?接下來就分享一下我在日常工作中是如何支持產(chǎn)品需求的。
首先我把設(shè)計師的工作周期分為5個階段:
一、需求池
需求池主要是產(chǎn)品經(jīng)理前期整理需求的階段,可以根據(jù)戰(zhàn)略目標(biāo)、用戶反饋、線上問題等整理需求的過程,最終產(chǎn)出我們設(shè)計師看到的需求(也就是我們經(jīng)??吹降脑蛨D)。
其實,設(shè)計師可以提前與需求方多聊聊需求與想法,如果有機會多參與一些需求評審階段的事情,相信我,這會讓你受益匪淺。
通常有的產(chǎn)品經(jīng)理會直接告訴設(shè)計師,按照我的原型圖美化一下就好,如果我們只是按照產(chǎn)品經(jīng)理的需求進(jìn)行美化,如下圖:
那只能說你是一個合格的美工(當(dāng)然也不要為了改而改,任何一個元素在頁面中出現(xiàn)都是有原因的),文章主要討論如何利用理性思維去判斷,利用多個維度思考不同的解決思路,最終產(chǎn)出更好的設(shè)計方案,讓我們成為一個具備全局觀的設(shè)計師。
二、需求分析階段
需求分析階段是對于設(shè)計師,以及整個項目的重要部分,關(guān)乎著方向是否跑偏、是否合理,這也是很多設(shè)計師容易忽略的部分。
這部分主要目的是讓我們最終設(shè)計的方案能夠更具理性思維,讓我們方案可以更經(jīng)得起推敲,還能讓設(shè)計師在設(shè)計評審階段有理有據(jù)的闡述設(shè)計方案(有很多設(shè)計師的設(shè)計方案都經(jīng)不住3層的追問)。
1. 現(xiàn)狀是什么(背景)
首先設(shè)計師在接到需求后,第一件事情就是要了解背景是什么?
也就是我們常說的現(xiàn)狀——目前產(chǎn)品遇到了什么問題?是否需要現(xiàn)在解決?以及線上數(shù)據(jù)是什么樣的?(確認(rèn)優(yōu)化或改版前的線上點擊率或轉(zhuǎn)化率等)一定要把這些基礎(chǔ)數(shù)據(jù)了解清楚。
2. 為什么要做(價值)
了解需求的價值,也就是需求方為什么要做這個事情?需求解決什么問題?是滿足用戶需求?還是實現(xiàn)商業(yè)目的?又或是提升用戶體驗?
設(shè)計師只有充分了解需求價值后才能明確我們的設(shè)計目標(biāo)及方向,當(dāng)然設(shè)計師要判斷并決策需求是否真的能夠?qū)崿F(xiàn)目標(biāo),是否還有更好的解決方法(例如:可以從策略、交互形式、展現(xiàn)形式等多個維度去思考解決方案)在需求分析階段只有不斷層層追問,最終明確目標(biāo),才能使我們的設(shè)計走上正確的方向。
如果方向都錯了,再炫酷的設(shè)計也是無效的,設(shè)計師應(yīng)把70%以上的時間來分析需求和導(dǎo)出解決思路,千萬不要過早的把大部分時間放在設(shè)計方案上。
3. 確認(rèn)解決方案(目標(biāo))
這個階段主要是設(shè)計師對需求進(jìn)行整體梳理,根據(jù)需求方目標(biāo),在結(jié)合設(shè)計師對需求的深挖后給出的建議,綜合推導(dǎo)出達(dá)成目標(biāo)的關(guān)鍵因素(解決思路),如下圖:
也就是說做哪幾個方面的事情可以滿足目標(biāo),結(jié)合一些現(xiàn)實情況(如外部渠道合作問題及內(nèi)部開發(fā)實現(xiàn)成本等各類因素)再篩選出當(dāng)下最優(yōu)的關(guān)鍵因素(前提是確認(rèn)對應(yīng)的關(guān)鍵因素能夠滿足大目標(biāo))再依次推導(dǎo)出設(shè)計目標(biāo),設(shè)計目標(biāo)就是具備可執(zhí)行落地的設(shè)計任務(wù)。 如果上圖沒有太理解的話可以看下圖,下圖我拿減肥為例:
獲得的具體任務(wù)還可以進(jìn)行細(xì)化,如:一小時要鍛煉核心、腹部、腿部等,盡可能讓你的想法轉(zhuǎn)化成可操作執(zhí)行的任務(wù)。
- 用戶是誰?這個用戶并不是說產(chǎn)品的用戶是誰,而是針對這個需求的目標(biāo)用戶,產(chǎn)品全部用戶中的哪一類(如新用戶、老用戶、付款用戶、免費用戶等)細(xì)分的用戶也會影響后面方案結(jié)果。
- 預(yù)期效果(驗證目標(biāo))?設(shè)計目標(biāo)明確后,要與需求方確認(rèn)本次需求的預(yù)期效果,最好能有具體的數(shù)字指標(biāo)或其他可衡量的方式,如提升點擊率多少?提升轉(zhuǎn)化多少?收入帶來多少?因為需要驗證本次設(shè)計的效果如何,最終是否能達(dá)成目標(biāo)(還要確認(rèn)埋點是否可以驗證最終的效果)。
三、設(shè)計階段
只有前期設(shè)計師了解并確認(rèn)了背景、價值、目標(biāo)、用戶、預(yù)期效果,設(shè)計師才能在設(shè)計階緊緊圍繞大目標(biāo)去執(zhí)行設(shè)計方案。
1. 信息結(jié)構(gòu)優(yōu)先級排序
根據(jù)前期關(guān)鍵因素拆解的設(shè)計目標(biāo),確認(rèn)設(shè)計目標(biāo)信息的優(yōu)先級,對應(yīng)的設(shè)計目標(biāo)會有對應(yīng)信息,確認(rèn)頁面信息展示優(yōu)先級,如下圖:
上圖展示的A、B表示信息展示優(yōu)先級(優(yōu)先級要結(jié)合用戶需求和商業(yè)需求來排序)。
2. 信息結(jié)構(gòu)分析與提煉
主要對需求方提供的文案進(jìn)行再優(yōu)化,因為有的產(chǎn)品經(jīng)理寫的文案過于產(chǎn)品化,沒有站在一個用戶的角度去理解文案,本來產(chǎn)品想表達(dá)的是“前門樓子”,用戶卻理解成了“胯骨軸子”,一個合適的文案在傳達(dá)信息上至關(guān)重要,所以設(shè)計師需要在文案上在做一些優(yōu)化,然后再與需求方確認(rèn)。
3. 方案設(shè)計
這個時候可以根據(jù)確認(rèn)的信息優(yōu)先級進(jìn)行設(shè)計工作,這是設(shè)計師最熟悉不過的階段了,可以先是調(diào)研一下競品是如何做的,當(dāng)然如果只是看一下怎么做的,就按照人家的去做,就缺少了一些思考。還應(yīng)分析競品的特點,了解他們是為何這樣做?為何不那樣做?他們有什么優(yōu)勢?以及他們有什么限制條件?哪些地方做的好?哪些地方做得不好?
最終結(jié)合競品的分析結(jié)果在結(jié)合自身產(chǎn)品的特點,輸出符合自身品牌性格的方案,前期都可以先發(fā)散的去想各種設(shè)計方案,這個階段如果產(chǎn)品已有設(shè)計規(guī)范,則在設(shè)計方案時還要考慮到自身的規(guī)范組件是否能夠滿足設(shè)計目標(biāo),最后輸出不同的設(shè)計方案,下圖為舉例示意:
在多個方案中選擇最終最適合的方案,方案確認(rèn)后還要與開發(fā)確認(rèn)方案可實現(xiàn)性、時間成本及風(fēng)險等,以便保證后面設(shè)計評審的順利。
4. 設(shè)計輸出
整理最終設(shè)計方案,輸出完整視覺交互稿,并附上:背景、價值、目標(biāo)、用戶、預(yù)期效果等,如下圖:
主要是為評審階段讓其他同學(xué)快速了解需求,然后在對設(shè)計成果進(jìn)行走查,可以做一個Checklist,如下圖:
從多個維度去檢查方案是否存在問題或疏漏,完成以上部分整個項目中最重要的部分就完成了,在確保以上部分全部完成后進(jìn)入方案交付階段。
四、方案交付階段
1. 與需求方確認(rèn)方案
這個時候,設(shè)計師要把最終的設(shè)計方案與需求方確認(rèn),確認(rèn)設(shè)計方案是否能夠滿足需求方目標(biāo)。
2. 評審及排期
一般在需求復(fù)雜或大版本迭代的時候都會走視覺評審流程(其他小需求可跳過)評審會上,評審前做一個大綱,梳理會上要講的內(nèi)容,主要圍繞設(shè)計方案是如何滿足需求目標(biāo)的方向去講,然后把各種交互狀態(tài)描述清晰,盡可能講的細(xì)一些,講的越細(xì),后期溝通成本就越低。
還有就是提前想好其他同學(xué)會提怎樣的問題,提前做一些準(zhǔn)備,考慮到評審中可能會出現(xiàn)的狀況,應(yīng)該如何對應(yīng)等等,總之就是從不同角度多考慮一些。
五、方案驗收階段
1. 成果驗收
排期結(jié)束后,就需要設(shè)計師與開發(fā)確認(rèn)方案驗收時間,可以不定期詢問開發(fā)同學(xué)開發(fā)進(jìn)度,剩下的就是后面的驗收工作。
很多設(shè)計師在驗收環(huán)節(jié)就松懈了,導(dǎo)致上線后效果慘不忍睹,我給我自己的標(biāo)準(zhǔn)是開發(fā)同學(xué)要還原交互效果及設(shè)計稿樣式的95%以上,之前在做規(guī)范組件的時都是100%還原的,開發(fā)同學(xué)都說我太吹(shi)毛(le)求(ba)疵(ji)。
驗收工作到這里還沒有完,這時設(shè)計師還需要在日常環(huán)境下進(jìn)行測試,雖然設(shè)計師不是專業(yè)測試,但可以從幾個簡單的方面進(jìn)行測試:流程是否走通、交互狀態(tài)是否完整、是否存在卡頓情況、是否存在BUG、交互及樣式在不同手機機型下顯示是否正常,總之就是盡量讓你的設(shè)計方案上線后能夠很好的展示給用戶。
2. 上線與數(shù)據(jù)驗收
這一步也是很多設(shè)計師容易忽略的,就是你的設(shè)計方案上線后就覺得結(jié)束了,上線效果也不管不問,回想一下前面所講的:“預(yù)期效果”,就是要驗證一下設(shè)計方案最終能否完成前期定的預(yù)期目標(biāo),一般情況都是產(chǎn)品經(jīng)理在上線一段時間后,讓數(shù)據(jù)同學(xué)或BI同學(xué)幫忙跑一下數(shù)據(jù),最終根據(jù)數(shù)據(jù)結(jié)果驗證需求是否達(dá)成目標(biāo)。
如未達(dá)成,則需要設(shè)計師與需求方在進(jìn)一步討論,看是需求分析階段的方向錯了,還是設(shè)計階段的形式錯了,根據(jù)偏差點去在進(jìn)行新一輪的思考。
如果達(dá)成了,說明這個設(shè)計方案完成了最初的既定目標(biāo)。
最后上傳一張我總結(jié)的流程圖如下圖:
六、總結(jié)
1. 需求池
- 多和產(chǎn)品聊聊需求,多參與一下需求評審的階段;
- 多用全局觀視角去看需求;
- 多問幾個為什么;
- 多體驗產(chǎn)品和競品,可以自發(fā)推動改善視覺或流程體驗;
2.需求分析階段
- 搞清楚背景是什么;
- 搞清楚價值是什么;
- 搞清楚目標(biāo)是什么;
- 預(yù)期達(dá)成怎樣效果;
- 搞清楚需求面對的用戶是誰;
- 思考需求方的需求是否合理,并提出你更好的解決方案;
3. 設(shè)計階段
- 信息結(jié)構(gòu)優(yōu)先級排序,以及優(yōu)化提煉文案;
- 多體驗競品流程,了解競品設(shè)計思路和限制條件;
- 多探索不同的設(shè)計方案;
- 完成設(shè)計方案并做好最后的走查;
4. 方案交付階段
- 與需求方確認(rèn)方案;
- 評審前做好充足準(zhǔn)備;
- 整理切圖發(fā)給開發(fā);
5. 方案驗收階段
- 驗收開發(fā)成果,還原設(shè)計方案95%以上;
- 日常環(huán)境測試;
- 驗收上線后跟蹤數(shù)據(jù)表現(xiàn)并做后續(xù)計劃;
寫在最后
想要成為優(yōu)秀的設(shè)計師,除了日常滿足需求方的需求外,不斷探索產(chǎn)品內(nèi)可優(yōu)化的點(包含但不限于:策略、流程、交互、視覺、文案),只要是能完善產(chǎn)品的地方都可以自主推動去做,不要把自己定位一個只會支持需求的設(shè)計師,善于發(fā)現(xiàn)機會點,推動執(zhí)行,這樣可以讓設(shè)計師從一個支持方成為一個項目的推動者,改善其他人對設(shè)計師的刻板認(rèn)知。
本文由 @Tanruy 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來自Unsplash,基于 CC0 協(xié)議
看人下菜碟吧,針對有些油米不進(jìn),怎么用設(shè)計理論說服都沒用、只想按照自己的線框圖出稿的人,只能采取拖著+隨便做做戰(zhàn)略
請問流程圖方便提供清晰的嗎
值得學(xué)習(xí)
OK,標(biāo)明出處就可以
你好,這篇文章很不錯,能給個聯(lián)系方式嗎?
您好請問有什么事情么 ??