寫給設(shè)計師：如何與工程師一起工作

Julie Zhuo（ Facebook 產(chǎn)品設(shè)計總監(jiān)）：多年前，我曾當(dāng)過產(chǎn)品經(jīng)理，然后是工程師，過去七年從事的是設(shè)計工作。每天我都跟擔(dān)任這些角色的人一起工作，每一天，我對產(chǎn)品開發(fā)背后的責(zé)任、挑戰(zhàn)和藝術(shù)都有新的體會。工程師是團隊的魔術(shù)師，他們拿到開發(fā)計劃、圖像素材后，只需輕輕舞動手指，Voila（看哪）！產(chǎn)品就動起來了。身為一個設(shè)計師，妳要如何跟上他們精明、喜好自嘲卻又按部就班的做事節(jié)奏呢？請繼續(xù)讀下去。

好文系列：
寫給產(chǎn)品經(jīng)理與工程師：如何與設(shè)計師一起工作
設(shè)計師職場：在公司如何寫好你的電子郵件
 

工程師就是那個將點子化為現(xiàn)實的人

工程師可以讓好的提案變成真的，永遠(yuǎn)、永遠(yuǎn)不要忘記這件事。不管妳的公司有 5 個、500 個還是 5000 個工程師，工程師都不是一種「資源」。他們是打下基礎(chǔ)、讓產(chǎn)品動起來的守護者。他們使產(chǎn)品得以運作，而且運作起來速度飛快；他們使產(chǎn)品堅固、耐用、可靠，還能讓產(chǎn)品規(guī)?；?，使數(shù)以億計的人受益。

我說這些的意思是：工程師超厲害！
這表示……

想讓神奇的事發(fā)生？妳只需要說服一、兩個工程師

這是真的。許多傳奇性的產(chǎn)品故事都是這樣開始的：幾個朋友、一個周末、幾罐啤酒、一起「駭」一下，產(chǎn)品經(jīng)理和主管加入都是之后的事。他們會從基本的東西開始——一個想法、一個設(shè)計、一個實作。這就是為什么公司要付錢來換取與工程師之間的緊密聯(lián)系。

或是，想象一下這個情境：妳發(fā)現(xiàn)產(chǎn)品有一個小小的部分令人很不舒服，真的很受不了的那種。妳覺得那個設(shè)計根本就不對。妳該怎么辦？

1. 下次團隊開會時提出來，讓負(fù)責(zé)安排任務(wù)優(yōu)先級的人放入列表，留給之后某個新進(jìn)工程師「練習(xí)一下」以適應(yīng)環(huán)境。
2. 緊盯著某個工程師，走到她的桌邊，問她是不是可以花個五分鐘處理這個問題。看著她交出成果（也許必須用 80 年代知名樂團設(shè)計一件 T-shirt 之類的作為交換，反正妳對 Illustrator 很在行）。

猜猜看哪個選項可以最快解決問題？
這樣說吧……

如果合作的工程師也欣賞設(shè)計的價值，那么事情就容易多了

當(dāng)妳所合作的工程師，不必問妳每一項細(xì)節(jié)也知道該如何填補模擬畫面的不足之處，即便妳忘了在模擬畫面標(biāo)出網(wǎng)頁邊界距離是幾個像素，她自己也會打開 Photoshop 測量——這是多么美妙的事。特別是她還能給出一些讓設(shè)計變得更好的意見，這簡直不可思議。更驚人的是，這樣的工程師完成第一個版本后，妳會幾乎分辨不出她做的東西跟妳給的模擬畫面有何區(qū)別，一切的細(xì)節(jié)是那么的精準(zhǔn)到位。

要怎么樣才能跟這種等級的工程合作呢？Well，妳可以雇用他們。如果可以的話那妳真的很幸運，因為 UI 設(shè)計導(dǎo)向的工程師可是大家搶著要。

或是妳可以協(xié)助合作的每一位工程師學(xué)會欣賞好設(shè)計。該怎么做？別只是把仿真畫面丟給工程師——好好地跟他們解釋妳的設(shè)計。與他們分享妳的價值，告訴他們?yōu)槭裁磰叺脑O(shè)計提案值得被開發(fā)出來。協(xié)助他們學(xué)習(xí)如何判斷實作出來的成品與妳的設(shè)計是否相符。當(dāng)妳說某個東西看起來不好的時候，告訴工程師妳是怎么想的。

建立關(guān)系很重要

人們價值觀與優(yōu)先級的移轉(zhuǎn)都建立在與他人的對話之上。這很老派，但用來做事非常有效。

很多工程師或許不注重設(shè)計上的細(xì)節(jié)，但是他們大部分都很在乎使用者體驗，而且會想要把它變得更好。我不是說每一個設(shè)計師都很享受設(shè)計細(xì)節(jié)的工作，但工程師那份為了讓產(chǎn)品變得更好的心，有助于我們對他們解釋設(shè)計背后的理念。

因為工程師越是喜歡設(shè)計，他們越能夠理解背后的思維，看見設(shè)計的價值，進(jìn)而讓設(shè)計越快完成實作，而且還會做得更好。

盡早了解工程上的限制，也為自己節(jié)省時間

身為設(shè)計師，很容易栽進(jìn)「如果」的世界。如果我們可以讀懂妳的心思，明白妳想要、想看的是什么，并且呈現(xiàn)給妳呢？如果你點了這個按鈕之后畫面就爆出一陣火光的特效呢？

如果你沒有及早搞懂技術(shù)或時間上的限制，那就別為了根本不可能實現(xiàn)的設(shè)計費心。（就算這是個值得一試的設(shè)計也一樣，如果你真的明白它的限制，就會知道這有多困難。）最糟的情況是妳投注大量時間和心血去完善設(shè)計，倒頭來卻發(fā)現(xiàn)根本不可行。好的設(shè)計師已經(jīng)夠少了，要解決的大問題又那么多，我們最不需要的就是這類沒效率的事。

所以下次如果有什么好點子冒出來，但妳心中對于是否可行卻感到疑慮重重時，別猜，直接問工程師。

另一邊也一樣……

省下工程師的時間；隨時讓他們知道最終設(shè)計長什么樣子

如果妳要工程師去實作一項設(shè)計，但是在看見成品之前自己也不太確定設(shè)計可以運作得多好，那么請妳一定要讓工程師知道很有可能東西還會再修改。對他們而言沒什么比熬夜趕工后卻拿到一張寫著「哎呀，整個設(shè)計已經(jīng)改啰」的便條更困擾，這下子他們只得把自己全心投入、幾乎已是產(chǎn)品水平的程序代碼給丟掉。

當(dāng)然，沒有哪個工程師不曾把程序代碼砍掉重練的。這就是工作的一部分，設(shè)計也是。好的工程師知道產(chǎn)品開發(fā)過程會是一團亂，東西做出來之前我們不會知道是否行得通。事情會變來變?nèi)?，設(shè)計會改來改去。但是決定出哪些部分仍須繼續(xù)探索、哪些部分必須就此定下來，可以幫工程師理出程序代碼的架構(gòu)——到底要趕快寫出來呢，還是寫得彈性一點，之后再行修改。

確保工程師可以把東西做出來的最佳辦法，就是極度密切地合作

要像「東西完成的時候妳就坐在他們旁邊」那樣密切。我不知道該怎么說才不會顯得過度強調(diào)：確保大家進(jìn)度一致最容易的辦法，就是大家在同一個空間工作。如此一來，問題浮現(xiàn)、被解決的速度會快很多。

最終產(chǎn)品完成后要是得不到大家的愛，批評、責(zé)難便很容易紛沓而至?！膏福业哪M畫面好極了，但工程師做得不對。」這是有害的想法。妳，設(shè)計師，擁有的是要對用戶發(fā)表的產(chǎn)品，不是妳計算機里的 Photoshop 仿真畫面。如果有什么地方做得不對，妳怎不有所行動？妳怎么不請工程師完工后為妳展示一下，好讓你們審視細(xì)節(jié)？為什么在實作的過程中妳不問工程師對設(shè)計有沒有疑問？為什么妳看到 bug 后沒有立即開票請工程師處理？

對，去擁有它。

工程師最在乎的，是設(shè)計要完整

很有趣，人們形容設(shè)計師是「細(xì)節(jié)導(dǎo)向」，但事實上大部分他們給的設(shè)計規(guī)格會遺漏很多使用上可能遭遇的狀況，最后靠著必須將所有情形都實作的工程師去把他們找出來。

想成為工程師心中的設(shè)計英雄嗎？請確定妳的設(shè)計解決方案是完整的、已考慮所有極端情形，像是：

1. 國際化：妳的設(shè)計在其他語言下看起來如何？有注意到德文那些很長的字對排版所造成的威脅嗎？
2. 錯誤狀態(tài)：網(wǎng)絡(luò)突然中斷的話會發(fā)生什么事？如果數(shù)據(jù)庫當(dāng)?shù)袅四兀炕蚴瞧渌愃频那闆r。
3. 極端的使用者：用戶如果沒有活動或信息，讓這一頁空白的話怎么辦？或是他有太多活動記錄或信息怎么辦？
4. 轉(zhuǎn)換：到底 A 畫面轉(zhuǎn)換到 B 畫面的具體方式是？好的工具或許能幫上忙，請看 〈 How to Survive in Design (and in a Zombie Apocalypse). 〉。

設(shè)計上述這些狀況不僅能在全面檢視過妳的設(shè)計后建立起信心，還有助于工程師規(guī)劃整個系統(tǒng)的架構(gòu)，對于開發(fā)時程給予適當(dāng)?shù)脑u估。更不用說完整的設(shè)計還可以避免最后一分鐘才倉徨拼湊出一堆空白的爛東西——只因沒人發(fā)覺，此時再來補救也為時已晚。

請當(dāng)個乖寶寶。確定妳的設(shè)計是完整的。別只為理想的使用情形做設(shè)計，踏出那個滿是模擬畫面的太虛幻境。就像每個工程師都知道的，只有把產(chǎn)品做出來才算數(shù)。

 
原文地址：medium.com
編譯：inside.com
 
================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是一個分享網(wǎng)頁設(shè)計、無線端設(shè)計以及PS教程的干貨網(wǎng)站。
【特色推薦】
設(shè)計講座：每月邀請國內(nèi)互聯(lián)網(wǎng)公司設(shè)計前輩及行業(yè)總監(jiān)在群內(nèi)及YY語音（YY頻道：156982）分享實戰(zhàn)經(jīng)驗。
設(shè)計微博：擁有粉絲量55萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計 ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計資源、下載頂尖設(shè)計素材。
設(shè)計導(dǎo)航：全球頂尖設(shè)計網(wǎng)站推薦，設(shè)計師必備導(dǎo)航：http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設(shè)計教程、經(jīng)驗分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁設(shè)計 微信號：【youshege】優(yōu)設(shè)哥的全拼
您也可以通過掃描下方二維碼快速添加：