編輯導(dǎo)語：作為產(chǎn)品設(shè)計師，除了處理日常的設(shè)計業(yè)務(wù)外，和其他業(yè)務(wù)人員進(jìn)行對接、共同推動產(chǎn)品項(xiàng)目落地，也是必須完成的事情至于。那么在產(chǎn)品設(shè)計過程中，設(shè)計師要如何避免和開發(fā)或者其他人員之間的沖突，以推動產(chǎn)品的快速落地？不如來看看作者的經(jīng)驗(yàn)總結(jié)吧！

前段時間在進(jìn)行面試的時候，問到很多候選人開發(fā)溝通上的問題上，大多人都回答的模糊不清，決定根據(jù)自己的過往經(jīng)驗(yàn)講一下在工作如何溝通協(xié)調(diào)項(xiàng)目。

本文分別以對接前準(zhǔn)備、對接中避免摩擦、對接后追蹤三個時間段講解流程中應(yīng)該注意什么。

一、對接開發(fā)的重要性

作為產(chǎn)品設(shè)計師，無論在什么公司什么崗位，都免不了與研發(fā)團(tuán)隊(duì)進(jìn)行溝通，如果不進(jìn)行溝通就無法交付我們的設(shè)計稿，即便很成熟的團(tuán)隊(duì)也會出現(xiàn)在溝通上的問題，在產(chǎn)品研發(fā)的過程中溝通是必要的流程，為了創(chuàng)造一致的用戶體驗(yàn)，設(shè)計師需要與開發(fā)人員在視覺上、交互上達(dá)到一致的想法。

但是講起來簡單，說起來難，在整個過程設(shè)計師和開發(fā)都是站在不同的角度去看待問題的，我們思考的如何達(dá)到美觀的界面、流暢的交互等問題，而開發(fā)關(guān)心的是做這件事我需要花費(fèi)多長時間，實(shí)現(xiàn)難度如何等等。

首先目標(biāo)就不在同一個維度，那么必然會造成我們在對接的時候出現(xiàn)掰扯的問題，最后耽誤的都是雙方的時間，更嚴(yán)重點(diǎn)頁面最后的體驗(yàn)也沒有達(dá)到一致。

任何團(tuán)隊(duì)都會出現(xiàn)設(shè)計師與開發(fā)脫節(jié)的問題很常見，遇見什么問題解決什么問題，畢竟人與人的性格、溝通方式等都是不同的。

我們只需要在不同的流程里去做不同的事情就可以避免這些問題了，對于任何設(shè)計師基本都會適用，往下看～

二、對接前的準(zhǔn)備

1. 產(chǎn)品信息文檔確認(rèn)

在接到一個需求的時候產(chǎn)品經(jīng)理會通知上下游進(jìn)行需求的評審，這時候一般會是產(chǎn)品經(jīng)理、設(shè)計師、開發(fā)三個組進(jìn)行需求的評估，具體的需求評審在本章就不細(xì)講，我們此次主要講設(shè)計師與開發(fā)相關(guān)的信息同步。

在評審過程中產(chǎn)品經(jīng)理會把需求背景、需求目標(biāo)等相關(guān)信息同步給相關(guān)的人員，作為設(shè)計師這時候就要關(guān)注需求目標(biāo)，這個目標(biāo)不僅是產(chǎn)品經(jīng)理的目標(biāo)，也是整個項(xiàng)目的目標(biāo)，所以與每個人都相關(guān)，需求目標(biāo)清晰后期推動開發(fā)的時候才會有依據(jù)。

評審會議結(jié)束后，產(chǎn)品經(jīng)理會同步期望上線時間，如果是常規(guī)需求，會當(dāng)時就評估出設(shè)計時間、開發(fā)時時間，我們設(shè)計師這時候就要關(guān)注這些時間，因?yàn)槲覀兺ㄟ^上線時間就可以估算開發(fā)節(jié)奏，給我們后期的修改以及臨時添加的一些動效制作時間會留出充裕的時間。

設(shè)計評審流程細(xì)節(jié)本章不進(jìn)行細(xì)節(jié)講解，本章重點(diǎn)講與開發(fā)對接。

近期我在公司做了一個商業(yè)化的直播項(xiàng)目需求，由于產(chǎn)品方?jīng)]有過多的產(chǎn)研經(jīng)驗(yàn)（后面才知道），在項(xiàng)目前期雖然進(jìn)行了評審，但是評審的參與人員沒有拉上我，等到需求給到我的時候，我順便問了一下才知道已經(jīng)評審?fù)炅耍@對于我來講是沒辦法進(jìn)行設(shè)計輸出的。

第一我不知道評審過程中開發(fā)的排期時間，以及測試時間，如果研發(fā)開始開發(fā)的時間與設(shè)計稿交付時間有沖突那么就是影響上線節(jié)奏。

第二涉及的交互操作產(chǎn)品經(jīng)理是不清楚的，有沒有哪些地方需要加復(fù)雜的交互產(chǎn)品也是同樣不清楚，那么開發(fā)就會默認(rèn)這是常規(guī)的交互，如果過程中添加那將會影響開發(fā)進(jìn)度。

第三流程上不符合要求，期間如果有關(guān)鍵性信息沒有達(dá)到共識，那將會釀成很嚴(yán)重的后果。

面對這種已經(jīng)發(fā)生的事情，如果重新拉個會評審一次會耽誤大家的時間，很多人是不愿意的，但是呢我也不能單聽產(chǎn)品一方面的溝通，因?yàn)楹芏嗉?xì)節(jié)他是不清楚的（產(chǎn)品經(jīng)驗(yàn)較少），所以當(dāng)時我的處理方法呢是我先通過產(chǎn)品給出的上線時間，然后與前端同學(xué)單獨(dú)確認(rèn)一下，這樣至少保證上線時間是同步的，至于其他的細(xì)節(jié)我當(dāng)時是利用設(shè)計評審的方式同步給開發(fā)交互邏輯、動效方式等。

此次這個需求呢本身不大是在舊版的基礎(chǔ)上優(yōu)化功能，理論上不需要走設(shè)計評審流程，但是因?yàn)楫?dāng)時沒有通知參加評審導(dǎo)致很多信息不同步，而我需要傳達(dá)給開發(fā)的東西也不能在后期在告訴他們，所以我利用設(shè)計評審流程把一些交互信息同步給開發(fā)。

2. 設(shè)計圖準(zhǔn)備

在設(shè)計稿完成后，如果是小需求一般是直接交付給研發(fā)，如果是大需求一般會進(jìn)行設(shè)計評審，主要評審維度是設(shè)計稿是否與產(chǎn)品文檔同步，設(shè)計目標(biāo)是否符合產(chǎn)品目標(biāo)等等，其次如果有復(fù)雜交互效果、設(shè)計細(xì)節(jié)、組件復(fù)用情況也需要與研發(fā)對齊。

若是直接交付研發(fā)，我們需要提前把設(shè)計稿內(nèi)涉及的切圖、圖層間距、動效使用區(qū)域等關(guān)鍵信息提前準(zhǔn)備好，避免在開發(fā)過程中臨時進(jìn)行補(bǔ)充，影響開發(fā)節(jié)奏。

在設(shè)計稿內(nèi)的切圖，我們要提前與研發(fā)溝通，切圖的范圍和形式，最后把設(shè)計稿傳入公司統(tǒng)一使用的協(xié)作網(wǎng)站，如藍(lán)湖、即時設(shè)計等平臺，大公司會有自己的協(xié)作平臺。

3. 確定設(shè)計規(guī)范組件

講個自己的踩坑案例，還是商業(yè)化的那個需求，由于為了商業(yè)化賦能，產(chǎn)品的需求文檔并沒有按照規(guī)范組件進(jìn)行設(shè)計，但是由于產(chǎn)品文檔標(biāo)注的不清楚，在設(shè)計過程中不斷與產(chǎn)品進(jìn)行溝通，最后結(jié)果當(dāng)然也是無法復(fù)用組件。

當(dāng)時我就把組件規(guī)范修改了，重點(diǎn)是研發(fā)不知道，我當(dāng)時想的是研發(fā)通過產(chǎn)品文檔應(yīng)該會了解到，事實(shí)確實(shí)我大意了，后面就導(dǎo)致組件方面我與研發(fā)進(jìn)行了相愛相殺，通過自己的以身作則我勸大家不要忽略任何一個細(xì)節(jié)！

設(shè)計規(guī)范組件在設(shè)計前就需要進(jìn)行確認(rèn)，項(xiàng)目是否有存留的規(guī)范組件，如果有，需要在設(shè)計前以及設(shè)計中去確認(rèn)哪些模塊是否可以調(diào)用，開發(fā)是否已經(jīng)將組件寫入代碼中，如果不了解這些情況貿(mào)然的設(shè)計，那在對接過程中會出現(xiàn)修改設(shè)計稿的風(fēng)險。

如果是創(chuàng)新項(xiàng)目并且沒有相關(guān)的設(shè)計規(guī)范和組件，我們則需要在設(shè)計前就把規(guī)范組件的時間給算到需求內(nèi)，一個產(chǎn)品的規(guī)范組件，決定著后續(xù)產(chǎn)品是否嚴(yán)謹(jǐn)、項(xiàng)目研發(fā)效率等等，因?yàn)橐?guī)范組件不止是設(shè)計師的事情，還是團(tuán)隊(duì)研發(fā)比較關(guān)注的事情，研發(fā)們在代碼里同樣需要進(jìn)行規(guī)范的組件復(fù)用。

4. 輸出設(shè)計文檔

當(dāng)在做一些在舊版的產(chǎn)品頁面上優(yōu)化的需求時，還需要輸出對應(yīng)設(shè)計文檔，給前端和測試看，設(shè)計文檔需要寫清楚設(shè)計稿優(yōu)化的點(diǎn)，例如圖標(biāo)的細(xì)節(jié)優(yōu)化、文字的字號優(yōu)化、色彩優(yōu)化、界面交互等等細(xì)節(jié)。

如果涉及到一些頁面的交互，我們在提供設(shè)計稿的同時需要把具象的交互文件單獨(dú)交給開發(fā)，不要奢望前端大佬們能腦補(bǔ)出頁面之間的交互，我們不及時提供的話，后期修改研發(fā)可能會直接拒絕，并且口吐芬芳～（最簡單的找到競品頁面演示給研發(fā)看）。

我的方法▼▼▼

前端在看我們設(shè)計稿時如果不是結(jié)構(gòu)上的修改，他們不會去關(guān)注這些細(xì)節(jié)的點(diǎn)，而給測試看的目的是，有些公司測試會幫我們進(jìn)行走查，如果不出設(shè)計文檔測試沒辦法進(jìn)行對比（測試提bug比設(shè)計師提bug更具有一些權(quán)威性）。

這里看一下我工作中輸出的設(shè)計文檔，我會把需求的背景、目標(biāo)在設(shè)計文檔上強(qiáng)調(diào)一下，再添加上設(shè)計目標(biāo)，設(shè)計目標(biāo)為了需求目標(biāo)去賦能，這樣在文檔開始就與研發(fā)達(dá)成共識，讓研發(fā)是帶著共同完成目標(biāo)的態(tài)度去看設(shè)計文檔，便于我們后續(xù)推動，其次放上頁面之間的說明。

5. 交付開發(fā)

最后總結(jié)一下，我們要交付給開發(fā)什么東西，首先是基本的設(shè)計稿，包括切圖、間距、動效文件，其次是設(shè)計文檔，包括需求背景、需求目標(biāo)、設(shè)計目標(biāo)、設(shè)計修改點(diǎn)說明。

三、對接中避免摩擦

1.?不要頻繁修改

在交付設(shè)計稿后（基本設(shè)計圖、設(shè)計文檔），我們就要避免頻繁修改，頻繁的修改會導(dǎo)致設(shè)計稿來回更新，對開發(fā)造成一種困惑，最后在測試的時候，開發(fā)同學(xué)容易寫亂。

另一方面工作過的設(shè)計師都應(yīng)該經(jīng)歷過，我們在開發(fā)的過程中修改設(shè)計稿，大部分的開發(fā)都會帶點(diǎn)情緒，甚至不給我們改，這其實(shí)是因?yàn)榇蠖嚅_發(fā)的代碼寫的是比較規(guī)范統(tǒng)一的，如果中途進(jìn)行修改可能會影響開發(fā)同學(xué)的代碼規(guī)范，就像我們在完成一個設(shè)計稿的時候，產(chǎn)品經(jīng)理突然改變需求，我們也是擔(dān)心做好的設(shè)計稿因?yàn)樾薷亩淮騺y。

如果實(shí)在需要修改，一定要說明原因，而不是突然一個想法覺得這里設(shè)計不合適就進(jìn)行修改（產(chǎn)品需求修改除外），我們要換位思考，具有同理心去工作，并且讓開發(fā)同學(xué)感受到我們是在幫助他們減少工作量，這樣在后續(xù)的一些需求中，我們的對接會很順暢。

2. 重要信息及時通知

上面說的是站在設(shè)計師的角度去修改，還有一種情況是研發(fā)在開發(fā)過程中，作為設(shè)計師的我們突然收到產(chǎn)品經(jīng)理的修改建議，這時候我們需要及時的同步給開發(fā)，或者給開發(fā)同事達(dá)成共識信息。

因?yàn)楹芏鄷r候，產(chǎn)品經(jīng)理讓我們修改的時候往往不會通知開發(fā)，因?yàn)閷τ诋a(chǎn)品經(jīng)理而言就是一個小的修改，例如改個位置、改個顏色等等，但不管是對我們還是對于開發(fā)其實(shí)都是比較重要的，不及時同步就會出現(xiàn)不好的結(jié)果，如果在測試階段沒有發(fā)現(xiàn)問題，上線后就會造成設(shè)計師背鍋的情況。

我曾經(jīng)在做一個頁面改版的時候，就遇到類似的問題，當(dāng)時產(chǎn)品找到我說改一個地方的交互，并且我也覺得那個交互方式應(yīng)該改，當(dāng)時的我以為產(chǎn)品經(jīng)理會同時告訴開發(fā)修改的地方，但是直到項(xiàng)目上線后開發(fā)都沒修改那個地方的交互。

本來這個修改點(diǎn)是個小事情，誰知剛好那一個版本被用戶吐槽那個頁面的交互，結(jié)果可想而知領(lǐng)導(dǎo)拉個會議開始復(fù)盤，為什么沒有改，索性大家沒有互相甩鍋的情況，產(chǎn)品經(jīng)理說沒有同步到開發(fā)，而我也是幫產(chǎn)品兜了一下說更新設(shè)計稿沒有告訴開發(fā)，這個事情原本是個很小的事情，只需要我順口同步給開發(fā)，就能夠避免的，就因?yàn)槲覜]有及時同步，造成用戶的反饋，影響了產(chǎn)品的體驗(yàn)。

所以各位設(shè)計師工作中如果遇到類似的事情一定要及時同步！

3. 統(tǒng)一需求目標(biāo)

開始講到過，在需求評審的時候要與開發(fā)對齊目標(biāo)，為什么需要對齊目標(biāo)，因?yàn)橐粋€項(xiàng)目如果目標(biāo)不對齊，那么每個人都會站在自己的角度去做這個需求，設(shè)計師思考的是通過設(shè)計的手段，去幫助產(chǎn)品完成目標(biāo)，如果設(shè)計稿上的復(fù)雜效果較多的時候，開發(fā)則會考慮你為什么這么做，這么做開發(fā)成本非常高等等。

這也是說為什么我們開始就講要輸出設(shè)計文檔，如果這一切都不存在的話就會導(dǎo)致開發(fā)是帶著疑問寫我們的頁面，如果過程中在修改需求什么的，那我們跟開發(fā)又要相愛相殺了。

我的設(shè)計方式是通常是在產(chǎn)品評審階段就與開發(fā)明確講清楚，我大概要做什么樣的效果，什么的交互形式，預(yù)計什么時候會交初步方案，中途也可能會有修改的點(diǎn)等等，提前讓開發(fā)有個心理預(yù)期，避免在開發(fā)過程中產(chǎn)生抵抗情緒。

我的經(jīng)驗(yàn)▼▼▼

4. 輸出交互動畫

如果在前期沒有時間進(jìn)行動效設(shè)計并沒有關(guān)系，研發(fā)在開發(fā)過程中可以在把動效方面給空出來后續(xù)寫，這里講的交互動畫分為兩種，一種是展示的動畫，一種是ui中的動效。

a）展示動畫

目的是為了告知開發(fā)頁面運(yùn)動的軌跡，在1-4中講到我個人用的方法，大家如果是剛對接研發(fā)的話，建議還是輸出完整的交互動畫，這里推薦一些工具AE、Principle、Pixso、Figma等。

• AE：大家就比較熟悉了，經(jīng)典的動效繪制軟件，什么樣的效果都能實(shí)現(xiàn)，但是使用成本比較高（不建議）
• Principle：國外的一款交互軟件，制作頁面交互很方面，可以直接導(dǎo)入figma和sketch，由于是國外軟件需要使用英文界面，但是國內(nèi)也有漢化版，我這里給大家準(zhǔn)備好了鏈接（建議使用）
• https://www.macz.com/mac/166.html?id=NzY5NTA5Jl8mMjcuMTg3LjI5LjE0MA%3D%3D
• Pixso：國產(chǎn)最新的設(shè)計軟件與figma類似，做交互的方式是使用多個頁面添加熱區(qū)進(jìn)行使用，具體體驗(yàn)如何還不清楚（可以用用）
• Figma：設(shè)計軟件目前的天花板，流暢的體驗(yàn)，支持頁面動畫設(shè)計，但是需要安裝插件才可以（建議使用）

b）動效文件

這個比較重要！我們一定要與研發(fā)同事溝通好，產(chǎn)品內(nèi)使用什么樣格式的動效文件，統(tǒng)一后能提升后續(xù)的開發(fā)效率，動效格式使用亂套的話，后續(xù)我們做更新迭代時做替換會很麻煩，開發(fā)也同樣如此，這里推薦幾種動效格式文件，分別是GIF、json、pag、svga這4種。

GIF：傳統(tǒng)的動效文件格式，優(yōu)點(diǎn)是學(xué)習(xí)成本低，第一個缺點(diǎn)是內(nèi)存大，圖片容易失真模糊，他的原理就是把每一幀的圖片融合在一起，最后形成動畫，圖片越多，內(nèi)存越大，第二個缺點(diǎn)是占用產(chǎn)品資源，當(dāng)內(nèi)存過高時，在加載時會出現(xiàn)卡頓。

Json：該文件格式是通過Lottie實(shí)現(xiàn)的，是 Airbnb 開發(fā)的一款能夠?yàn)樵鷳?yīng)用添加動畫效果的開源工具，它的優(yōu)點(diǎn)就是內(nèi)存小、無需加載、動畫不會失真，缺點(diǎn)呢就是支持的動畫方式?jīng)]有g(shù)if那么全面，以及使用成本也比較高。

具體使用步驟是需要我們裝ae插件bodymovin，通過插件導(dǎo)出json，常遇見的問題就是在導(dǎo)出漸變動畫時，漸變效果會消失，這是因?yàn)槲覀僡e安裝的都是中文版，而該插件更多的適配的是英文版，不過沒關(guān)系這里可以把漸變效果的名字改為gradient fill1就可以了，如果多個漸變的話我們更改后面序列號就可以，比如gradient fill1、gradient fill2、gradient fill3…，這里把漢化插件鏈接也給大家找到了。

https://zdo.fun/?p=557

Pag：pag是騰訊研發(fā)的一種技術(shù)文件，最初主要用于游戲動畫和直播動畫，用來解決復(fù)雜的動畫效果，目前在ui頁面中運(yùn)用也比較多，優(yōu)點(diǎn)是占比內(nèi)存比json文件更小，支持的動畫方式也更豐富，運(yùn)行時可編輯，缺點(diǎn)是適配原生有些問題，壓縮位圖時會出現(xiàn)不顯示，這個軟件目前還在完善階段，我曾經(jīng)也使用過，后來因?yàn)檫m配問題就放棄了，感興趣的大家可以通過下面鏈接下載。

https://pag.io/docs/install.html

svga：該文件格式的強(qiáng)大之處在于可以完整的將位圖轉(zhuǎn)換成二進(jìn)制代碼，并且內(nèi)存占比較于json更小，播放資源占用更低，并且技術(shù)上相對穩(wěn)定（建議使用）。

https://svga.io/designer.html

我們看下svg實(shí)現(xiàn)的效果。

最后，我們一定要統(tǒng)一產(chǎn)品內(nèi)使用的動效文件格式，這樣既方便我們，也方便開發(fā)，讓開發(fā)看到我們設(shè)計師的嚴(yán)謹(jǐn)性，便于后續(xù)合作。

四、對接后應(yīng)該干什么

1. 跟進(jìn)開發(fā)進(jìn)度

作為設(shè)計師，我們需要實(shí)時了解開發(fā)的進(jìn)度，這樣能夠保證我們在過程中掌握自己的設(shè)計節(jié)奏，什么時間交給開發(fā)動效文件，如果進(jìn)行修改也可以不影響上線時間（當(dāng)然不建議這樣做），那么具體需要怎么跟進(jìn)呢，大概分為以下幾個維度。

a）時間進(jìn)度跟進(jìn)

設(shè)計師可以時不時的問一嘴，是否能按照正常的計劃時間節(jié)點(diǎn)提測（正常需求提交后，開發(fā)會給出開發(fā)排期，盡量按照時間排期走，否則項(xiàng)目進(jìn)度會變得很不可控）。

如果開發(fā)反饋時間會有延期風(fēng)險，那設(shè)計師第一時間就要了解原因，以及預(yù)計延期多久，然后自身評估以下對設(shè)計上是否有影響。

b）需求變更跟進(jìn)

一般開發(fā)過程中，或多或少都會出現(xiàn)一些需求調(diào)整/變更的點(diǎn)，那么其中就會涉及設(shè)計上的改動，改動小的話產(chǎn)品經(jīng)理有時候會直接告訴我們，并不會告訴開發(fā)，這時候如果身為設(shè)計師的我們要及時通知開發(fā)，并說明原因（避免爭論）。

并且，需求變更后，需要和開發(fā)評估新的項(xiàng)目上線時間點(diǎn)，站在我們或者產(chǎn)品角度理解有時候我們認(rèn)為的修改，對于開發(fā)來講是耗費(fèi)時間較長的，需要我們注意是否會影響上線時間。

c）交互動效實(shí)現(xiàn)跟進(jìn)

在2-4中講到我們要輸出交互動畫，雖然我們輸出的動畫很直觀，以及動效文件也完整，但是避免不了認(rèn)知上的偏差，有時候開發(fā)會按照技術(shù)難度以及自身理解去完整交互效果，我們中途要隨時跟進(jìn)了解，避免開發(fā)在錯誤的路上越走越遠(yuǎn)。

d）測試跟進(jìn)

及時了解該需求是否已經(jīng)提測、哪些還未提測，若到了提測時間的功能未進(jìn)入測試，可以詢問產(chǎn)品或開發(fā)什么原因，這樣對項(xiàng)目或設(shè)計師都是負(fù)責(zé)的。

另外一點(diǎn)是我們設(shè)計師需要在提測階段介入UI走查，因?yàn)楦鱾€公司或者項(xiàng)目測試時間有長有短，所以我們要及時把UI走查工作介入進(jìn)去，給開發(fā)預(yù)留出修改時間，有的小公司不重視UI走查流程，這里我們就可以自驅(qū)進(jìn)行走查，主動找測試同學(xué)了解提測時間，及時走查，保證頁面還原度。

2. 設(shè)計走查

走查是UI工作中最為重要的工作，它決定著產(chǎn)品上線后能否完美的展現(xiàn)給用戶，下面我大致把走查的流程以及范圍給大家梳理下。

a）創(chuàng)建走查文檔

在UI走查階段，我們首先需要建立走查文檔便于開發(fā)瀏覽解決，走查文檔主要包含日期、版本、項(xiàng)目名稱、模塊、端口、問題描述、修改狀態(tài)、圖片標(biāo)注，這樣一方面能夠讓問題更加詳細(xì)，體現(xiàn)設(shè)計師的專業(yè)度，一般我是使用在線表格去建立走查文檔，當(dāng)然這個看每個公司所使用的協(xié)作平臺。

b）開通手機(jī)權(quán)限

一般在走查移動端產(chǎn)品時，安裝測試包需要開通賬號權(quán)限，這里可以找公司的開發(fā)或者測試同事給開通，避免影響走查效率。

c）走查范圍

分為基礎(chǔ)走查、細(xì)節(jié)走查、適配走查。

基礎(chǔ)走查包含字體、顏色、圖標(biāo)、間距、對齊方式等具體可根據(jù)產(chǎn)品形態(tài)進(jìn)行延伸，其中間距走查比較費(fèi)時間，需要我們通過測試機(jī)截圖后，按照倍數(shù)縮放到源文件內(nèi)進(jìn)行測量，測試機(jī)分辨率需要保證與設(shè)計稿一致，否則測量不準(zhǔn)確，如設(shè)計圖是375*812，以蘋果為例測試機(jī)則需要使用 iPhone X，這里給大家參考鏈接。

https://developer.apple.com/design/human-interface-guidelines/foundations/layout

細(xì)節(jié)走查包含字體截字、按壓狀態(tài)、組件內(nèi)容、交互狀態(tài)。

適配走查包含關(guān)鍵信息是否超出屏幕、是否出現(xiàn)擠壓、是否出現(xiàn)重疊、識別度是否清晰。

3. 避免添加復(fù)雜交互

在走查階段如果我們發(fā)現(xiàn)部分的交互效果不太理想，并未達(dá)到預(yù)期，我們可以與開發(fā)進(jìn)行溝通是否可以修改，或者添加新的交互效果，因?yàn)樵谶@個階段我們重新設(shè)計或者定義一個新的交互動效的話，會增加非常大的開發(fā)工作量，可能也會與開發(fā)產(chǎn)生爭吵，我們在這個時期盡量避免這個問題，如果實(shí)在沒有解決辦法的時候再去添加新的交互。

我在工作中，如果遇到這種事情，會分兩點(diǎn)考慮這個事情。

第一評估下當(dāng)下這個交互效果是否會影響用戶體驗(yàn)，如果影響用戶體驗(yàn)我會要求開發(fā)必須100%還原，當(dāng)然我會講述清楚為什么改，避免讓開發(fā)產(chǎn)生情緒抵抗。

第二是如果不影響用戶體驗(yàn)，但是還原度沒有達(dá)到預(yù)期，我同樣會先找開發(fā)進(jìn)行溝通，例如按照交互稿還原會有什么困難，是時間上的困難還是技術(shù)上的困難，時間上如果困難我會溝通好下一期必須還原到位，技術(shù)上困難我一般會修改交互形式，盡量保證上線后給用戶展現(xiàn)的是完美的狀態(tài)。

4. 數(shù)據(jù)追蹤

作為設(shè)計師在需求上線后并不代表需求就結(jié)束了，我們還需要追蹤數(shù)據(jù)情況是好是壞，為什么我們設(shè)計師要去追蹤這個數(shù)據(jù)呢，追蹤數(shù)據(jù)是為了讓我們在工作中提升自己的設(shè)計價值，隨著現(xiàn)在互聯(lián)網(wǎng)發(fā)展逐漸飽和，那么企業(yè)對于各個崗位的要求也跟互聯(lián)網(wǎng)初期不一樣，以前我們只需要畫畫圖交付就可以了，但是現(xiàn)在的企業(yè)更看重的是綜合能力。

說簡單點(diǎn)就是做UI的人很多，優(yōu)秀的UI一樣很多，那么我們就得被迫提升核心競爭力否則就是被淘汰。

而追蹤數(shù)據(jù)其實(shí)就是增加我們得核心競爭力，同時也是能夠體現(xiàn)自己設(shè)計能力的一項(xiàng)內(nèi)容，設(shè)計最終是為商業(yè)而服務(wù)的，但我們不能嘴上說說，而是要拿出實(shí)際的行動，這個行動就是數(shù)據(jù)，我們的設(shè)計如何為數(shù)據(jù)賦能的，如何幫業(yè)務(wù)達(dá)到目標(biāo)等等，數(shù)據(jù)如何分析是個很龐大的體系這里只講下我們身為設(shè)計師為什么需要追蹤數(shù)據(jù)。

簡單講下工作中數(shù)據(jù)解析的案例。

下面是我做的一個直播商業(yè)化改版需求，改版背景呢是直播業(yè)務(wù)由原先的為c端用戶賦能改為，為b端企業(yè)賦能，通過與企業(yè)合作而產(chǎn)生價值，那么基于這個直播形態(tài)肯定是需要變化的，需求目標(biāo)由原先的【用戶收益】改為【企業(yè)收益】，新的目標(biāo)具體為提升企業(yè)品牌曝光點(diǎn)擊、互動、預(yù)約人數(shù)、提升直播在企業(yè)客戶測的感知收益。

案例▼▼▼

基于這個目標(biāo)，其實(shí)不難發(fā)現(xiàn)，目標(biāo)已經(jīng)從用戶側(cè)改為大客戶，更多的是為企業(yè)去賦能，頁面的結(jié)構(gòu)肯定需要進(jìn)行變化的，左邊的圖呢是改版之前的，右邊的是改版之后的，那么我當(dāng)時的思路呢其實(shí)就是基于數(shù)據(jù)方面去進(jìn)行優(yōu)化。

整體：產(chǎn)品策略添加了二級浮窗用來承載更多內(nèi)容。

直播介紹：首先舊版策略是直播介紹對于用戶而言并不重要，用戶只需要通過看到直播標(biāo)題就能夠了解大致直播內(nèi)容，更多是以引導(dǎo)形式存在，所以信息外漏較少，而新的策略是講企業(yè)介紹默認(rèn)展示在二級浮窗內(nèi)，用戶可選擇關(guān)閉，提升企業(yè)感知。

投遞簡歷：舊版策略是需要側(cè)重用戶投遞率，因此在預(yù)約界面就展示入口，而新的策略是需要給企業(yè)強(qiáng)化觀看人數(shù)、預(yù)約人數(shù)從而提升客戶價值，基于這一點(diǎn)，我當(dāng)時是通過數(shù)據(jù)后臺看了下預(yù)約頁面的點(diǎn)擊數(shù)據(jù)，發(fā)現(xiàn)點(diǎn)擊率最最高的是【投遞簡歷】入口，而【預(yù)約直播】入口點(diǎn)擊率相對較低，因此把投遞簡歷入口調(diào)賬到浮窗tab區(qū)域，降低層級，讓預(yù)約直播成為視覺焦點(diǎn)，而上線后數(shù)據(jù)也是符合預(yù)期。

企業(yè)關(guān)注：將企業(yè)名稱與關(guān)注結(jié)合并且放大，提升關(guān)注量，強(qiáng)化企業(yè)品牌感知和數(shù)據(jù)感知，關(guān)注與預(yù)約直播兩者無論數(shù)據(jù)高低，都是符合企業(yè)目標(biāo)，從而便于業(yè)務(wù)人員與企業(yè)進(jìn)行合作溝通。

從我這個案例中我們能清楚看到，基本上任何需求都是可以通過數(shù)據(jù)的維度，進(jìn)行優(yōu)化，并且通過量化指標(biāo)提升設(shè)計價值，無論對公司還是個人都有很大收益，并且我們追蹤數(shù)據(jù)也便于后續(xù)我們與開發(fā)對接時，可以通過數(shù)據(jù)維度去促進(jìn)我們設(shè)計上的修改、完善等工作，這也是為什么說我們需要對每個需求都要進(jìn)行數(shù)據(jù)追蹤。

五、總結(jié)

無論是對接前、對接中、對接后，在哪個階段都需要我們認(rèn)真對待，熟知這些細(xì)節(jié)后，才能更好的與開發(fā)合作，進(jìn)行項(xiàng)目推進(jìn)，優(yōu)秀的設(shè)計師不僅是專業(yè)和技術(shù)上的成熟，還需要有協(xié)作上下游的能力，在很多團(tuán)隊(duì)中設(shè)計師跟開發(fā)都會面臨不一樣的挑戰(zhàn)最終可能會因?yàn)槟承﹩栴}發(fā)生沖突，我們需要減少這樣的沖突。

作者：愛吃貓的魚；公眾號：防脫發(fā)藥水

本文由 @愛吃貓的魚 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議