作者：胡波

網(wǎng)易杭州研究院

妹子工作三年了，我和她相當(dāng)熟，她最近一份工作從平面設(shè)計(jì)轉(zhuǎn)到了UI設(shè)計(jì)，在平面設(shè)計(jì)她已經(jīng)游刃有余，能夠高效地完成工作中的推廣設(shè)計(jì)、活動(dòng)詳情頁、電商詳情頁、Banner、海報(bào)設(shè)計(jì)及線下物料等平面設(shè)計(jì)工作。

UI設(shè)計(jì)特別是移動(dòng)端，一直是她想所追求的工作。以前做平面設(shè)計(jì)她一直跟我訴苦，突如其來地需求，不停的工作，缺少自我學(xué)習(xí)和思考的時(shí)間。現(xiàn)在她終于有機(jī)會(huì)做UI設(shè)計(jì)，我很替她高興。

以下是我們的對話

視覺妹子：現(xiàn)在終于可以做UI設(shè)計(jì)了，兩個(gè)星期完成了自己的第一個(gè)App，從logo的設(shè)計(jì)到icon的設(shè)計(jì)，從主色調(diào)到輔色調(diào)再到排版。感覺都比推廣設(shè)計(jì)要輕松太多了。

開發(fā)的我：這么厲害啊。以前做推廣設(shè)計(jì)和現(xiàn)在UI設(shè)計(jì)有什么不同嗎？

妹子：以前做推廣設(shè)計(jì)太苦逼多了，遇上難纏的運(yùn)營或者市場就悲催了。設(shè)計(jì)出來總說這不好看那不好看，視覺沒突出活動(dòng)主題（雙11，圣誕節(jié)，元旦節(jié)）、沒有體現(xiàn)產(chǎn)品特色、文案改了又改、沒有素材時(shí)還需要自己畫（素材還要考慮版權(quán)問題）、要考慮各種排版、各種字體、各種顏色搭配、有時(shí)候還要做flash動(dòng)畫。

妹子：最糟糕的是，這種活動(dòng)推廣的設(shè)計(jì)需求經(jīng)常是突如其來。比如說上個(gè)月烏鎮(zhèn)世界互聯(lián)網(wǎng)大會(huì)，當(dāng)天早上，運(yùn)營說中午前必須趕出一個(gè)視頻直播的推廣視覺稿，弄得我中午都沒有休息，當(dāng)天計(jì)劃的其它工作也沒有完成。

我：突入其來的需求確實(shí)是很惱人的，如果運(yùn)營最好能夠提前預(yù)知未來需要做什么。但是很多情況下，由于運(yùn)營自身或者工作流程的問題，會(huì)有很多不可預(yù)估的工作。那現(xiàn)在你覺得做UI設(shè)計(jì)有何不同呢 ？

妹子：現(xiàn)在UI設(shè)計(jì)的時(shí)間是可控的，我能夠預(yù)估我今天是否需要加班，我這個(gè)產(chǎn)品版本迭代周期的工作量，在UI設(shè)計(jì)中的難點(diǎn)。同時(shí)我不需要考慮像推廣設(shè)計(jì)過程中種種問題，不需要花哨的字體，不需要陰影，不需要畫各種素材和插畫。最重要的是，我的產(chǎn)品經(jīng)驗(yàn)是累積的，下個(gè)版本的視覺迭代是在這個(gè)版本的基礎(chǔ)上，給了我很多思考的時(shí)間。

我：確實(shí)，你以前經(jīng)常和運(yùn)營和市場人員打交道，他們的定位是視覺是為推廣和市場服務(wù)的。如果視覺設(shè)計(jì)得不好，可能影響banner的點(diǎn)擊量，花了很多錢去推廣安裝量，可能因?yàn)橐曈X設(shè)計(jì)的不好看而讓用戶根本沒有心思去下載...運(yùn)營和市場很多時(shí)候不會(huì)為視覺設(shè)計(jì)本人去考慮，在一些人心里，視覺就是美工，所以很多時(shí)候他們只能用好看不好看等詞語去評價(jià)視覺。

妹子：是的，其實(shí)有些時(shí)候推廣設(shè)計(jì)是靠自己感覺和經(jīng)驗(yàn)的累積，背后沒有那么多理論去支持。但是在UI設(shè)計(jì)中，產(chǎn)品定位，交互設(shè)計(jì)，iOS&Android設(shè)計(jì)規(guī)范，競品&精品的設(shè)計(jì)，開發(fā)實(shí)現(xiàn)方式，我們有很多參考和借鑒的東西，有章可循，可成系統(tǒng)。這個(gè)版本迭代如果設(shè)計(jì)得不夠完美，可以下個(gè)版本迭代中循循改進(jìn)，推廣設(shè)計(jì)感覺就是一次性東西，比如這次雙11活動(dòng)做完了，花了那么大精力，下次做一個(gè)校園推廣活動(dòng)感覺沒用了。

我：嗯，還不錯(cuò)嘛！都全棧設(shè)計(jì)了，看來成為大神指日可待啊...

妹子：但是在UI設(shè)計(jì)中我還是新手，和開發(fā)、交互、產(chǎn)品的溝通，還有很多地方需要學(xué)習(xí)。

我：嗯，做產(chǎn)品設(shè)計(jì)，同理心很重要，除了設(shè)計(jì)本身，大部分時(shí)間都是在溝通，如果溝通不好，后面工作就不太好施展開來了。

……

作為開發(fā)，在產(chǎn)品開發(fā)過程中，大量時(shí)間都在和UI視覺做溝通。深知，如果溝通不暢，將會(huì)導(dǎo)致一系列問題。視覺如何與開發(fā)更好地溝通，開發(fā)如何更好地理解視覺呢？

視覺如何與開發(fā)更好地溝通

• UI設(shè)計(jì)師主動(dòng)參與到產(chǎn)品需求討論中，學(xué)會(huì)傾聽，這樣可以更快速地了解產(chǎn)品，了解交互，了解開發(fā)的技術(shù)實(shí)現(xiàn)難點(diǎn)。從而減少信息的不對稱、產(chǎn)品需求理解的不一致。

• 設(shè)計(jì)視覺規(guī)范，一些通用模塊以規(guī)范性的視覺稿給出，比如通用的背景顏色，字體大小，字體顏色，加載動(dòng)畫，列表間距，動(dòng)畫參數(shù)。如特殊地方需特殊標(biāo)明。

• 視覺風(fēng)格確定后，視覺設(shè)計(jì)后期，多考慮空態(tài)、加載失敗、圖片沒有加載出來等異常情況下的視覺表現(xiàn)。

• 跨視覺設(shè)計(jì)學(xué)習(xí)，了解下開發(fā)的實(shí)現(xiàn)原理。比如：頁面布局的實(shí)現(xiàn)方式（比如iOS的xib布局）、基本控件、列表實(shí)現(xiàn)的基本原理等。這樣在溝通時(shí)才能有效地理解開發(fā)所描述的信息。對于不懂的地方可以隨時(shí)向開發(fā)討教，相信大部分開發(fā)還是愿意分享的。

• 建立與開發(fā)的信任。不說“實(shí)現(xiàn)很簡單”，“只是改了個(gè)間距或者圖標(biāo)而已”等話語。

• 大局觀，當(dāng)按照視覺稿開發(fā)確實(shí)有實(shí)現(xiàn)難度時(shí)，考慮上線時(shí)間及實(shí)現(xiàn)成本，尋求折中設(shè)計(jì)方案。追求完美雖然必要，學(xué)會(huì)適當(dāng)?shù)耐讌f(xié)和欣賞殘缺美，退一步海則海闊天空，形式追隨功能。

• 和開發(fā)做朋友。

開發(fā)如何更好地理解視覺

• 稍微學(xué)點(diǎn)美學(xué)，學(xué)點(diǎn)基本的色彩、構(gòu)圖知識(shí)。多逛逛視覺設(shè)計(jì)網(wǎng)站，如Dribbble，Sketch，或者你先可以先去了解日本的一些設(shè)計(jì)大師。

• 不以“不好看”等沒有建議性的話語去評論視覺。

• 尊重視覺的勞動(dòng)成果。視覺如同開發(fā)一樣，也是一項(xiàng)很有創(chuàng)造性的勞動(dòng)，對于難以實(shí)現(xiàn)的視覺稿，不要僅一句話“不能實(shí)現(xiàn)”來回絕視覺設(shè)計(jì)師，從后期的維護(hù)、版本兼容、實(shí)現(xiàn)原理或者實(shí)現(xiàn)難度等角度曉之以情，動(dòng)之以禮。

• 及時(shí)了解視覺的工作進(jìn)度，合理安排各個(gè)模塊間的進(jìn)度安排。

• 對于視覺稿有意義的地方及時(shí)與視覺溝通，不要等功能已經(jīng)實(shí)現(xiàn)完再去責(zé)備視覺與開發(fā)不一致。

• 建立與視覺的信任，相信視覺設(shè)計(jì)師的專業(yè)性。

• 和視覺做朋友。

由此引發(fā)的其他一些其它思考

其實(shí)溝通導(dǎo)致的問題都是容易解決的，同理心很重要。我很尊重視覺設(shè)計(jì)這份職業(yè)，同時(shí)也很羨慕能做視覺設(shè)計(jì)的同事。其實(shí)不管是平面推廣設(shè)計(jì)還是移動(dòng)端UI設(shè)計(jì)或者工業(yè)設(shè)計(jì)，不管是扁平還是擬物化，設(shè)計(jì)很多時(shí)候是相通的。

誰會(huì)說幾十年前的日本的工業(yè)設(shè)計(jì)和平面設(shè)計(jì)如今過時(shí)了呢？

前文提到的妹子能在很短期間內(nèi)駕馭移動(dòng)端UI設(shè)計(jì)是因?yàn)樗谕茝V設(shè)計(jì)方面的積累。如果她能夠?qū)Ξa(chǎn)品、交互、開發(fā)進(jìn)一步了解，必然會(huì)在自我提高上更進(jìn)一步。

但是在我所看到的近兩年，移動(dòng)端設(shè)計(jì)很多方面都沒有創(chuàng)新，包括交互。競品間都相互“借鑒”，小到icon大到整個(gè)產(chǎn)品。不過技術(shù)終將會(huì)改變世界，相信隨著AR和VR、智能設(shè)備等技術(shù)發(fā)展，在交互上的創(chuàng)新也會(huì)越來越多。

技術(shù)上，誰知道iOS & Android等平臺(tái)十年后會(huì)不會(huì)不復(fù)存在呢，那時(shí)又有多少開發(fā)面臨失業(yè)？但對美的向往永遠(yuǎn)是我們更古不變的追求。

網(wǎng)易云信∣讓開發(fā)和視覺在一起

ID：neteaseim ?長按識(shí)別，關(guān)注精彩

總結(jié)

以上是生活随笔為你收集整理的一场开发与视觉的对话引发的思考的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。