
在工作當(dāng)中,UI設(shè)計(jì)師經(jīng)常是和開(kāi)發(fā)人員一起協(xié)作的,那么我們應(yīng)該怎樣讓這個(gè)過(guò)程變得更高效和更順利呢。盡管客戶(hù)可能很難區(qū)分UI設(shè)計(jì)行業(yè)工作人員的角色,但設(shè)計(jì)團(tuán)隊(duì)和開(kāi)發(fā)團(tuán)隊(duì)之間往往存在鴻溝。有時(shí)與建筑師和建筑工程師之間的關(guān)系相比,UI設(shè)計(jì)師和開(kāi)發(fā)人員會(huì)發(fā)現(xiàn)很難保持一致。雙方可能都認(rèn)為對(duì)方不明白他們?yōu)槭裁匆@樣做,開(kāi)發(fā)人員不注意細(xì)節(jié),設(shè)計(jì)師只關(guān)心讓事情看起來(lái)很漂亮。
產(chǎn)品開(kāi)發(fā)人員是否需要從一開(kāi)始就與設(shè)計(jì)師一起直接與客戶(hù)進(jìn)行討論?每一方需要什么時(shí)間框架?有哪些技術(shù)可能性?不要害怕與對(duì)方或客戶(hù)坦誠(chéng)交流是否存在局限性,或者是否需要進(jìn)行更多研究才能給出答案。
開(kāi)發(fā)人員經(jīng)常發(fā)現(xiàn),向客戶(hù)和設(shè)計(jì)人員坦誠(chéng)地說(shuō)明您實(shí)際上并不了解產(chǎn)品設(shè)計(jì)的所有知識(shí),這可能會(huì)讓他們?cè)谀阃耆懦麄兊募夹g(shù)實(shí)驗(yàn)之前給你時(shí)間研究和測(cè)試新事物。
有時(shí),開(kāi)發(fā)人員可能會(huì)真正沉浸在他們的編碼中,而忘記了他們實(shí)際上是為誰(shuí)開(kāi)發(fā)產(chǎn)品。嘗試市場(chǎng)上前沿的CSS效果并解決復(fù)雜的編程問(wèn)題真是太令人興奮了。這就是為什么他們必須與客戶(hù)會(huì)面并談?wù)撍麄兊男枨蠛苤匾?/span>對(duì)于不知道整個(gè)產(chǎn)品構(gòu)建階段的設(shè)計(jì)師來(lái)說(shuō)也是如此。這涉及跨設(shè)備測(cè)試、錯(cuò)誤修復(fù)和問(wèn)題解決。
1.準(zhǔn)備好設(shè)計(jì)文件
即使設(shè)計(jì)文件是由網(wǎng)頁(yè)或UI設(shè)計(jì)師準(zhǔn)備的,開(kāi)發(fā)人員也有責(zé)任確保它們符合產(chǎn)品的期望。為了做到這一點(diǎn),雙方需要考慮一些事情。首先是討論設(shè)計(jì)師在設(shè)計(jì)階段更喜歡使用哪種程序(Photoshop、AI、藍(lán)湖、插畫(huà)圖片等)和格式,以及如何準(zhǔn)備資料。
2.排版
設(shè)計(jì)師:重要的是要記住,網(wǎng)站的標(biāo)題樣式不能超過(guò)六種。網(wǎng)站的每個(gè)排版方面都需要適應(yīng)這些風(fēng)格。例如,如果您在首頁(yè)上有一個(gè)20 PX和23 PX行距的大粗體標(biāo)題,這將成為標(biāo)題1,并且很可能也用于網(wǎng)站的其他頁(yè)面。確保所有頁(yè)面都具有相似的樣式以保持一致性,并且不要?jiǎng)?chuàng)建超過(guò)六種不同的樣式。
段落樣式也是如此。如果網(wǎng)站上有段落樣式,請(qǐng)仔細(xì)檢查它在網(wǎng)站的每個(gè)頁(yè)面上的大小和行距是否相同。開(kāi)發(fā)人員將對(duì)您提供給他們的確切尺寸進(jìn)行編碼,盡管它在網(wǎng)絡(luò)上發(fā)布后可能會(huì)是什么樣子。
開(kāi)發(fā)人員:建議創(chuàng)建所有標(biāo)題和段落樣式,將它們顯示在網(wǎng)站的一頁(yè)上,并在繼續(xù)處理網(wǎng)站的其余部分之前詢(xún)問(wèn)設(shè)計(jì)人員對(duì)結(jié)果是否滿(mǎn)意。我有很多基于設(shè)計(jì)構(gòu)建整個(gè)網(wǎng)站的經(jīng)驗(yàn),結(jié)果發(fā)現(xiàn)設(shè)計(jì)人員在看到實(shí)時(shí)字體樣式后對(duì)字體樣式并不滿(mǎn)意。
3、顏色
設(shè)計(jì)師:你希望設(shè)計(jì)稿交給客戶(hù)時(shí),他們會(huì)添加新的顏色并忽略徽標(biāo)的間距要求嗎?你也不希望這種情況發(fā)生在開(kāi)發(fā)人員身上。避免它的有效方法是創(chuàng)建一個(gè)樣式指南,其中包含你要用于網(wǎng)站的確切顏色并堅(jiān)持使用它們,就像您為印刷項(xiàng)目所做的那樣。然后確保您與開(kāi)發(fā)人員討論僅使用提供的顏色的重要性。這包括較小元素的顏色,例如按鈕、輸入字段和字體。
開(kāi)發(fā)人員:如果你在SASS或LESS中創(chuàng)建樣式表,你可以輕松地為要使用的重復(fù)顏色創(chuàng)建變量。使用此SASS指南或此LESS指南正確命名顏色。
如果沒(méi)有,你可以遵循上面的設(shè)計(jì)師建議并堅(jiān)持使用你提供的顏色,并在網(wǎng)站開(kāi)發(fā)的早期階段與設(shè)計(jì)師確認(rèn)他們對(duì)結(jié)果是否滿(mǎn)意。
4、邊距和填充
設(shè)計(jì)師:這是一個(gè)簡(jiǎn)單的提醒,要記住邊距和內(nèi)邊距,而且要在網(wǎng)站的每個(gè)頁(yè)面上保持它們的一致性。如果首頁(yè)有標(biāo)題圖像,而其他頁(yè)面沒(méi)有,使用相同的邊距和內(nèi)邊距將使用戶(hù)更容易識(shí)別菜單的位置以在網(wǎng)站上導(dǎo)航。
開(kāi)發(fā)人員:根據(jù)設(shè)計(jì)人員的指南創(chuàng)建一個(gè)重置CSS樣式表,并確保它在每個(gè)頁(yè)面上都匹配。如果編碼后尺寸看起來(lái)很奇怪,請(qǐng)?jiān)诶^續(xù)編碼之前立即與設(shè)計(jì)人員討論
了解設(shè)計(jì)更改的來(lái)源并且不要針對(duì)個(gè)人而言非常重要。嘗試在設(shè)計(jì)階段完成盡可能多的工作,以盡量減少編碼階段的更改,因?yàn)楦拇a比更改設(shè)計(jì)更難。記住,你們是一個(gè)團(tuán)隊(duì)!
本文由培訓(xùn)無(wú)憂(yōu)網(wǎng)牛耳教育專(zhuān)屬課程顧問(wèn)老師整理發(fā)布,更多UI設(shè)計(jì)課程信息可關(guān)注培訓(xùn)無(wú)憂(yōu)網(wǎng)UI設(shè)計(jì)培訓(xùn)頻道或添加老師微信:15033336050
注:尊重原創(chuàng)文章,轉(zhuǎn)載請(qǐng)注明出處和鏈接 http://m.hebeijilong.cn/news-id-12251.html 違者必究!部分文章來(lái)源于網(wǎng)絡(luò)由培訓(xùn)無(wú)憂(yōu)網(wǎng)編輯部人員整理發(fā)布,內(nèi)容真實(shí)性請(qǐng)自行核實(shí)或聯(lián)系我們,了解更多相關(guān)資訊請(qǐng)關(guān)注UI設(shè)計(jì)頻道查看更多,了解相關(guān)專(zhuān)業(yè)課程信息您可在線咨詢(xún)也可免費(fèi)申請(qǐng)?jiān)囌n。關(guān)注官方微信了解更多:150 3333 6050