我認(rèn)為前段工程師和設(shè)計(jì)師師有著共同點(diǎn)的,只不過(guò)對(duì)于設(shè)計(jì)師而言是視覺(jué)上的,而前端工程師是面對(duì)的代碼。那么在濟(jì)南網(wǎng)站建設(shè)中,設(shè)計(jì)師和前端工程師該怎樣配合?
當(dāng)一個(gè)頁(yè)面發(fā)給前端工程師,在他眼里自動(dòng)轉(zhuǎn)化成一堆代碼,就像一個(gè)掃描儀器一樣,把它自動(dòng)掃描成一段段代碼,內(nèi)容的信息對(duì)待就是HTML的結(jié)構(gòu)。比如一個(gè)評(píng)論區(qū),當(dāng)沒(méi)有設(shè)計(jì)稿的前提下,可以用HTML語(yǔ)言來(lái)定位它的真?zhèn)€結(jié)構(gòu),因?yàn)槔锩嬗泻芏鄡?nèi)容是相對(duì)固定的,而且都是通用的。好比作者啊,時(shí)間啊,評(píng)論的內(nèi)容啊,表單等等。那么其他內(nèi)容就可以進(jìn)一步細(xì)化,如評(píng)論表單還可以拆成更細(xì)的對(duì)象,如富文本編輯器。這樣將信息對(duì)象化之后會(huì)發(fā)現(xiàn)有大量重復(fù)的對(duì)象和固定模式可被重用。
如果設(shè)計(jì)師在設(shè)計(jì)頁(yè)面的時(shí)候也是這種思路,基于對(duì)信息的理解,先對(duì)象化,再針對(duì)對(duì)象設(shè)計(jì)。這樣才能本質(zhì)上實(shí)現(xiàn)模塊化設(shè)計(jì)和開(kāi)發(fā)。好處是一方面能準(zhǔn)確表現(xiàn)產(chǎn)品意圖,另一方面可以使開(kāi)發(fā)過(guò)程更高效、更優(yōu)化。
那么在設(shè)計(jì)師這一塊,具體的思路都能夠搞清楚,然后很具體和清晰的表現(xiàn)在設(shè)計(jì)稿上,這樣在交接給前段工程師時(shí)才能避免很多誤解。所以在設(shè)計(jì)稿上要很多必要的標(biāo)注。下面就是一些我總結(jié)的:
視覺(jué)規(guī)格要素:
每個(gè)板塊的圖片的尺寸(大小,比例關(guān)系)
還有點(diǎn)擊的區(qū)域
板塊的劃分
布局規(guī)格
字體,字號(hào)的大小
顏色(包括漸變顏色,陰影,透明度)
具體對(duì)其的地方
首屏線
這些東西對(duì)于設(shè)計(jì)師來(lái)講是增加工作量,其實(shí)都挺反感的,但是對(duì)于前段工程師來(lái)講,這樣的配合才能設(shè)計(jì)出完美的設(shè)計(jì)。