特別感謝 海鹽社 小伙伴 @海舟 和 @QQQ 對(duì)這篇分享的指導(dǎo)和修改建議~

設(shè)計(jì)稿總是過不了、與產(chǎn)品對(duì)接需求困難重重、技術(shù)同學(xué)無法理解設(shè)計(jì)意圖，最終上線的界面還原度差，相信這些都是UI設(shè)計(jì)師在工作中經(jīng)常會(huì)遇到的問題，今天我會(huì)結(jié)合自己過往的工作經(jīng)驗(yàn)，給大家5個(gè)小妙招，來試著幫大家解決這些問題。

目錄

1. 產(chǎn)品需求了解

2. 對(duì)原型的梳理和思考

3. 競品分析

4. 技術(shù)溝通

5. 設(shè)計(jì)驗(yàn)收

一、產(chǎn)品需求了解

需求了解是UI 同學(xué)設(shè)計(jì)工作的第一步，也是非常重要的一步。我們需要從產(chǎn)品同事那里獲知需求的來源、要解決的問題、產(chǎn)品目標(biāo)、產(chǎn)品對(duì)設(shè)計(jì)的期望、產(chǎn)品的排期等等。

     

帶著疑問，我們來看看為什么要了解這些？

1. 首先，這些對(duì)設(shè)計(jì)師來說都是非常重要的基礎(chǔ)信息，有助于我們對(duì)需求有深刻的理解和認(rèn)知。因?yàn)槿绻覀儾涣私庑枨蟮膩碓春拖胍鉀Q的問題，那我們的設(shè)計(jì)注定是盲目的。界面設(shè)計(jì)師是為了解決問題而存在的，如果我們連問題是什么都不清楚，只是一味了追求好看，這勢必會(huì)導(dǎo)致過稿率大打折扣。而如果我們提前充分了解這些信息，并且抱著解決問題的態(tài)度進(jìn)行界面設(shè)計(jì)，過稿率肯定會(huì)有所提升，并且自己成長的也會(huì)非常快。

2. 了解產(chǎn)品排期，做好設(shè)計(jì)排期。時(shí)間管理能力是設(shè)計(jì)師所必須的軟實(shí)力之一，設(shè)計(jì)稿一稿過的概率非常低，所以留給設(shè)計(jì)師的時(shí)間不僅僅是輸出稿子，還要在這個(gè)時(shí)間內(nèi)做組內(nèi)外的設(shè)計(jì)評(píng)審，需要在設(shè)計(jì)之前就確定好設(shè)計(jì)評(píng)審時(shí)間，并預(yù)留修改時(shí)間，這樣才能確保在最終的時(shí)間節(jié)點(diǎn)之前輸出最適合的設(shè)計(jì)方案。千萬別等著產(chǎn)品催著要稿子的時(shí)候，你才說我以為這個(gè)不著急要呢，這樣只能顯得自己不專業(yè)。

3. 幫助產(chǎn)品規(guī)范對(duì)需求的思考。因?yàn)槲覀円矔?huì)遇到一些不成熟的產(chǎn)品經(jīng)理，他在需求評(píng)審時(shí)可能會(huì)忘記介紹一些重要信息；甚至是對(duì)需求沒有深入的思考，只是輸出了簡單的原型就丟給你了，這時(shí)候你就要發(fā)揮你強(qiáng)大的主動(dòng)性，去追著產(chǎn)品去討論需要。千萬不要覺得是別人的問題，反正不是自己為最終的結(jié)果負(fù)責(zé)的態(tài)度做事情，自己隨便做做就行了。這樣的話一來自己成長的會(huì)很慢，二來在領(lǐng)導(dǎo)的心里面會(huì)把你定義為不積極成員，升職加薪什么的，可能就得靠邊站了。

4. 減少設(shè)計(jì)中的反復(fù)溝通，提升工作效率。這是在設(shè)計(jì)師工作中比較高概率出現(xiàn)的事情。產(chǎn)品需求評(píng)審的時(shí)候可能隨便聽了聽，沒有深入理解，等到設(shè)計(jì)時(shí)才發(fā)現(xiàn)很多問題。后期需要跟產(chǎn)品反復(fù)溝通，甚至因?yàn)槔斫獬鲥e(cuò)重新設(shè)計(jì)稿子。這會(huì)導(dǎo)致3個(gè)大問題：大大增加了設(shè)計(jì)時(shí)間、自己在溝通中特別疲憊，甚至埋怨產(chǎn)品沒想清楚而導(dǎo)致矛盾、過度打擾別人的工作。

綜上所述4點(diǎn)原因，就要求我們在做設(shè)計(jì)之前一定要充分吸收、理解信息，為之后的設(shè)計(jì)工作做好準(zhǔn)備。

怎么了解這些內(nèi)容？

1. 需求文檔。需求文檔是產(chǎn)品產(chǎn)出的重要的設(shè)計(jì)文件，幫助產(chǎn)品中的各個(gè)環(huán)節(jié)的同事快速了解產(chǎn)品需求。 在一些創(chuàng)業(yè)型公司里面由于工作的不規(guī)范，很多產(chǎn)品經(jīng)理只會(huì)做口頭的需求說明，那設(shè)計(jì)師一定要盡量要求他們輸出需求文檔，實(shí)在不行通過發(fā)微信/郵件說明需求，最好不要接受口頭需求。因?yàn)椴还苁撬麤]說清楚還是你沒聽清楚，最終出現(xiàn)問題去找是誰的原因會(huì)很麻煩，并且會(huì)有很多工作交接中的摩擦出現(xiàn)。

2. 產(chǎn)品需求評(píng)審。了解需求文檔后，可能會(huì)有一些疑問點(diǎn)，那就帶著自己的疑問來聽產(chǎn)品講述需求，并且在會(huì)議上解決自己的疑問 ；如果會(huì)議中沒有問答的環(huán)節(jié)，也可以將自己的問題整理成文檔發(fā)給產(chǎn)品經(jīng)理，請(qǐng)他幫你作答。

3. 追著溝通。雖然前期的工作已經(jīng)準(zhǔn)備的很充分了，但是難免會(huì)有些內(nèi)容產(chǎn)品在設(shè)計(jì)時(shí)沒有考慮到，設(shè)計(jì)過程中要將遇到的問題整理出來及時(shí)跟產(chǎn)品溝通，對(duì)于問題要早發(fā)現(xiàn)早診斷早治療。切記模棱兩可的信息也是問題哦，千萬不要猜著做。

二、對(duì)原型的梳理和思考

原型是我們做稿子至關(guān)重要的條件之一，很多時(shí)候我們手頭的資料可能就只有原型。

1. 充分了解原型的交互細(xì)節(jié)和邏輯跳轉(zhuǎn)。我認(rèn)識(shí)一個(gè)很優(yōu)秀的設(shè)計(jì)師，她會(huì)在做設(shè)計(jì)稿之前將原型重新繪制一遍，打磨體驗(yàn)設(shè)計(jì)細(xì)節(jié)，最終的結(jié)果就是她的設(shè)計(jì)通過率特別高。我并不是鼓勵(lì)大家這樣做，而是想說對(duì)原型深刻認(rèn)知的重要性。

2. 發(fā)現(xiàn)原型中的疑問點(diǎn)，設(shè)計(jì)之前跟交互（PS. 有各個(gè)公司的職位配置不同，所以原型可能是交互同學(xué)做的，也可能是產(chǎn)品同學(xué)做的。）進(jìn)行討論，解決心中的疑慮和遇到的問題。我覺得產(chǎn)品設(shè)計(jì)的每一個(gè)下游環(huán)節(jié)都應(yīng)該對(duì)上游的工作質(zhì)量起到監(jiān)管的作用，這樣才能保證技術(shù)同學(xué)后期不來找“麻煩”，因?yàn)槿绻覀兒鲆暳藛栴}，而技術(shù)開發(fā)的時(shí)候發(fā)現(xiàn)了，會(huì)顯的我們特別不專業(yè)。我們大可以推卸責(zé)任說是交互的問題，但是設(shè)計(jì)稿還得調(diào)整吧，調(diào)整后的設(shè)計(jì)稿還得輸出吧，輸出的端口多了，溝通成本是不是也很高。 所以為了我們自己也一定要在前期將所有的疑問解決掉。

3. 明確信息層級(jí)。對(duì)于初級(jí)的設(shè)計(jì)師來說這一點(diǎn)在工作中還是比較常見的，相信我們的工作中經(jīng)常會(huì)碰到稿子特別漂亮但就是過不了的情況，這時(shí)候就可以考慮一下是不是界面中的信息層級(jí)出現(xiàn)了問題。最好是在原型評(píng)審的時(shí)候，要求交互設(shè)計(jì)師講解清楚，如果不行就自己主動(dòng)去溝通。

三、競品分析

競品分析可以提供非常有價(jià)值的內(nèi)容信息，這里的競品主要指的是功能模塊，如果你的產(chǎn)品不是獨(dú)創(chuàng)的新功能，那你就很有必要做這件事情

1. 體現(xiàn)競品的功能點(diǎn)，可以發(fā)現(xiàn)其他產(chǎn)品的一些優(yōu)缺點(diǎn)，這樣有助于我們在設(shè)計(jì)的時(shí)候合理的借鑒，并解決遇到的問題。

2. 整理市面上類似功能模塊的界面樣式，尋找適合形式，在成熟設(shè)計(jì)模塊的基礎(chǔ)上，再探索出自己產(chǎn)品的功能樣式，因?yàn)檎驹诰奕说募绨蛏喜拍茏龅礁谩?/p>

四、技術(shù)溝通

技術(shù)同學(xué)將我們的想法變?yōu)楝F(xiàn)實(shí)至關(guān)重要的一步，如果你以為將設(shè)計(jì)稿和標(biāo)注丟給技術(shù)同學(xué)就好了，那你這的很天真呀，這樣的結(jié)果就是當(dāng)你看到開發(fā)效果的時(shí)候，腦袋疼。所以，為了最終設(shè)計(jì)完美還原，我們要緊緊地配合技術(shù)同學(xué)，做好前期的工作和后期的配合。

     

1. 首先，在設(shè)計(jì)輸出之前，需要跟技術(shù)同學(xué)確定設(shè)計(jì)方案的可實(shí)現(xiàn)性，自己輸出的特別前衛(wèi)、有想法、展現(xiàn)自己真正實(shí)力的設(shè)計(jì)稿，可能由于技術(shù)框架問題或者技術(shù)本身能力的問題而難以實(shí)現(xiàn)，排期又很緊的情況下，我們就需要尋找更合適的替代方案（如果真的是技術(shù)同學(xué)懶惰，那就要靠自己的魅力去征服他幫你實(shí)現(xiàn)了~）

2. 輸出標(biāo)注切圖之前溝通技術(shù)的實(shí)現(xiàn)方式，這樣雙方的工作效率都會(huì)有很大的提升。

3. 要考慮多機(jī)型適配的問題，并在標(biāo)注中清晰說明如何適配。

五、設(shè)計(jì)驗(yàn)收

這個(gè)是設(shè)計(jì)結(jié)果展示在用戶面前的最后一道屏障，我們一定要站好最后一班崗，來確保上線的設(shè)計(jì)稿可達(dá)到一個(gè)比較完美的狀態(tài)。

1. UI驗(yàn)收可以提前進(jìn)行，越往后靠，工期越緊，技術(shù)同學(xué)肯定會(huì)優(yōu)先解決功能bug，視覺問題只能被延期處理，甚至是上線后再慢慢解決，也許就會(huì)成為界面中的頑疾。所以要提前跟前端同學(xué)溝通，讓他們在有產(chǎn)出的是可以先給我們看一看，提前解決部分問題。

2. 讓領(lǐng)導(dǎo)爭取一下視覺的驗(yàn)收標(biāo)準(zhǔn)，如果不達(dá)標(biāo)就不允許上線。這一招特別管用，不過這要看公司的發(fā)展階段，以及對(duì)視覺的重視程度。

總結(jié)

以上五點(diǎn)就是在工作中需要非常注意關(guān)鍵點(diǎn)，對(duì)充分了解產(chǎn)品需求、全面梳理原型、再結(jié)合競品分析，輸出的設(shè)計(jì)稿更貼近產(chǎn)品目標(biāo)和用戶使用習(xí)慣，相信大家的過稿率自然會(huì)有所提升；設(shè)計(jì)稿提交前與技術(shù)的充分溝通和提前進(jìn)行設(shè)計(jì)驗(yàn)收，可以有助于提升設(shè)計(jì)的還原度。如此下去你的工作將不再是被動(dòng)的被安排，而是可以主動(dòng)出擊，讓自己掌握工作的主動(dòng)權(quán)。