今天小編頂著胃絞痛跟前端開發(fā)產(chǎn)品開需求會開了2個多小時砾省，幾經(jīng)崩潰的邊緣】祝看著自己蒼白無助的臉想起前幾天跟伙伴們聊天，好多設(shè)計師說跟開發(fā)對接時間久宝鼓。自從小編學(xué)了HTML/CSS刑棵，發(fā)現(xiàn)開發(fā)跟設(shè)計的腦回路就是不一樣的有沒有？愚铡！
今天我們就說說怎么提高大家的時間蛉签，畢竟高強(qiáng)度的壓力下時間就是快樂。
首先我們聊聊問什么會出現(xiàn)這個問題沥寥，大概可以分為2個原因
1.平等對待平庸
不幸的是碍舍，許多人會自信地認(rèn)為這不是他們或他們公司所遭受的問題。
這是因為生產(chǎn)力和效率是相對的邑雅。很少有UI設(shè)計師和產(chǎn)品經(jīng)理意識到有一個比現(xiàn)在更好的設(shè)計過程片橡。
我們傾向于以我們周圍的其他創(chuàng)業(yè)公司和UI設(shè)計師為基準(zhǔn)。如果每個人都以同樣的方式工作淮野，那么它可能是最有效的捧书，對嗎？
是錯的骤星！
基于我們可獲得的信息经瓷，基于我們對任何事物的概念 - 在這種情況下的效率 - 是一種常見的人類偏見。
舉個簡單的例子??
有人說我超重洞难，但是我所有的朋友都比我胖舆吮，我會認(rèn)為我是一個健康的人。因為我的參考點(diǎn)是我的朋友們不如我健康廊营。但是歪泳，這僅僅能體現(xiàn)的是他們不如我健康，并不意味著我是健康的露筒。我仍然超重呐伞。
因此，為了克服基準(zhǔn)和潛在的平庸慎式，總是嘗試創(chuàng)新伶氢，以實現(xiàn)效率的巨大飛躍，而不是小的漸進(jìn)的變化
2.設(shè)計師跟前端開發(fā)人員是不同的
UI設(shè)計師和前端開發(fā)人員之間的根本誤解 - 或知識差距
UI設(shè)計師傾向于認(rèn)為自己是藝術(shù)家瘪吏。他們的作品是一件藝術(shù)品癣防，用戶能夠理解他們的工作之美，他們將擁有數(shù)百萬的用戶掌眠。
他們喜歡排版蕾盯，并熱愛手工咖啡。他們最喜歡的顏色是＃FEB4B1蓝丙。
另一方面级遭，開發(fā)人員只想編寫很酷的東西望拖。他們不在乎它的樣子。對他們來說挫鸽，“風(fēng)格”是留給藝術(shù)家的一個難以捉摸的概念说敏，對他們來說就像“約會”一樣陌生。他們并不真正理解為什么紅色的陰影太紅或為什么標(biāo)題文本應(yīng)該在左邊一點(diǎn)點(diǎn)丢郊。
如果這兩個組因此使用了一種明確的設(shè)計語言盔沫，那么在對接的過程將非常簡單和快速。
那么我們?nèi)绾谓鉀Q這個問題呢枫匾？架诞？
作為高端大氣上檔次的設(shè)計師～我們或許可以這樣做
1.創(chuàng)建設(shè)計系統(tǒng)節(jié)約設(shè)計師跟前端開發(fā)的時間
實際上，所有前端工程團(tuán)隊都使用某種類型的庫或CSS框架來處理應(yīng)用程序中使用的樣式婿牍。這些庫通常包含常見的樣式侈贷，例如預(yù)定義的邊距，顏色和工程師用來使開發(fā)更快等脂，更一致的其他類俏蛮。這意味著如果您決定使用自定義邊距，字體大小或組件上遥，工程師必須從頭開始編寫自定義CSS以覆蓋基本樣式搏屑。偶爾會很好，但很快就會變得單調(diào)乏味粉楚。在特殊場合或絕對必要時保存這些自定義樣式辣恋。畢竟，在框架內(nèi)進(jìn)行設(shè)計簡化了我們的許多決策模软，這通常是一件好事伟骨。
所以，如果你們還沒有一套視覺規(guī)范文檔燃异，是時候開始定義一個屬于你們跟開發(fā)的規(guī)范文檔携狭，然而這份文檔并不是僅僅是你的設(shè)計團(tuán)隊使用的，更多時候回俐，是給開發(fā)使用的逛腿。（記得你的文檔要常常更新）
2.設(shè)計過程中盡早讓開發(fā)參與進(jìn)來
做為設(shè)計師，你有沒有做一個炫酷的頁面仅颇，自己已經(jīng)被自己的設(shè)計所迷倒单默，開發(fā)卻告訴你， 這個實現(xiàn)不了忘瓦。仿佛冬天里被人潑了冷水搁廓，夏天被人塞進(jìn)了沒有空調(diào)的房間的心情。
從本質(zhì)上講，工程師將在技術(shù)可能性方面考慮解決方案枚抵。這有兩個原因：第一线欲，他們可以引導(dǎo)你的思維走向可行的事情;?第二明场，他們可以引導(dǎo)你的想法走向可行的想法汽摹。
共同創(chuàng)建的最佳時間是在項目的早期階段 - 您可能會預(yù)先解決重大問題，并與開發(fā)人員建立良好的關(guān)系苦锨。（初入行的時候領(lǐng)導(dǎo)一直說一句話逼泣，盡早的接觸產(chǎn)品需求，在我們盡早了解上游的問題的時候舟舒，同樣也要讓我們的下游提前介入～）
3.設(shè)計評審
雖然?與工程師共同創(chuàng)造會很棒拉庶，但實際情況是他們通常太忙了。組內(nèi)的設(shè)計評審就將是一個很好的選擇秃励，如果你剛剛?cè)肼毷险蹋犅犂蠁T工們趟過的雷。如果你是老員工夺鲜，跟新員工擦出更多創(chuàng)意火花也是一個好的選擇皆尔。
怎么做：隨時隨地，讓整個團(tuán)隊進(jìn)入討論的階段币励，呈現(xiàn)正在進(jìn)行的任何設(shè)計：低保真草圖慷蠕，交互原型，UI組件等然后讓團(tuán)隊進(jìn)行審核并提出合理化建議食呻×骺唬或許一個筷子被飛速折斷～那么100根呢？
并且與您的PM仅胞，UX / UI設(shè)計人員和前端開發(fā)人員一起組織設(shè)計審查每辟，是必須要經(jīng)歷的階段，您可能會發(fā)現(xiàn)團(tuán)隊的所有成員都會立即看到它的價值, 弊端與問題干旧。迅速解決它渠欺。
4.了解基本的HTML / CSS / JS
我之前見過最好的設(shè)計師之一可以直接進(jìn)入代碼檢查員，并直接在控制臺中使用HTML / CSS快速創(chuàng)建原型莱革。作為一名工程師峻堰，您知道您正在使用的設(shè)計師了解您正在使用的技術(shù)，并且正在考慮這些限制因素盅视，這令人難以置信捐名。絕對沒有必要擁有全面的前端開發(fā)技能才能成為優(yōu)秀的產(chǎn)品設(shè)計師，但是一些基本的前端知識還有很長的路要走闹击。獲得最親近的同行的尊重 - 學(xué)習(xí)一些代碼镶蹋。
加我微博? ?RuiJ_??一起討論設(shè)計問題，觸碰更多靈感～
https://weibo.com/u/2991630622? ? ??
更多的設(shè)計請關(guān)注：
Dribbble：https://dribbble.com/yanruijiao2
參考文獻(xiàn)：
https://uxplanet.org/how-to-save-ui-designers-front-end-developers-up-to-50-of-their-time-39a30254ec05
https://builttoadapt.io/code-complexity-is-a-design-problem-e53e4229b5de
https://uxdesign.cc/5-rules-for-designer-engineer-collaboration-182fd74bd09f
