在上海網(wǎng)站建設(shè)中沒(méi)有哪個(gè)成功的Web項(xiàng)目是在設(shè)計(jì)師和開(kāi)發(fā)無(wú)法流暢溝通的前提下搞定的，協(xié)作才是做好項(xiàng)目的基礎(chǔ)。

協(xié)策網(wǎng)絡(luò)公司曾看到經(jīng)驗(yàn)豐富的西安網(wǎng)站建設(shè)設(shè)計(jì)師和西安網(wǎng)站建設(shè)開(kāi)發(fā)者因?yàn)闇贤ú粫澈驼`會(huì)導(dǎo)致項(xiàng)目失敗，也見(jiàn)過(guò)新手設(shè)計(jì)師和開(kāi)發(fā)團(tuán)隊(duì)一起通過(guò)高效協(xié)同，做出驚艷無(wú)比的設(shè)計(jì)項(xiàng)目。在項(xiàng)目之初充分的磨合，能讓項(xiàng)目在后續(xù)的快速迭代中更為流暢。足夠和諧的溝通不僅有利于工作，而且能讓整個(gè)團(tuán)隊(duì)保持情緒的穩(wěn)定性。

而在網(wǎng)站建設(shè)響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)項(xiàng)目中，設(shè)計(jì)師和開(kāi)發(fā)者之間的溝通流暢與否，就顯得更為重要。

設(shè)計(jì)響應(yīng)式網(wǎng)站的時(shí)候，整個(gè)團(tuán)隊(duì)必須為大量不同尺寸屏幕的設(shè)備充分考慮，習(xí)慣于“像素精準(zhǔn)”的設(shè)計(jì)師和開(kāi)發(fā)者需要對(duì)流動(dòng)的界面和大量的不同比例的設(shè)備有充分的準(zhǔn)備。簡(jiǎn)而言之，響應(yīng)式設(shè)計(jì)使得整個(gè)項(xiàng)目交付面臨著大量的不確定因素，這也是響應(yīng)式網(wǎng)站項(xiàng)目的難點(diǎn)。

希望接下來(lái)上海協(xié)策網(wǎng)絡(luò)科技有限公司為您總結(jié)的幾個(gè)小技巧，能幫各個(gè)團(tuán)隊(duì)順利搞定這種項(xiàng)目中的溝通障礙和技術(shù)問(wèn)題。

1、優(yōu)先專(zhuān)注“極端”尺寸

當(dāng)你面對(duì)著手機(jī)屏幕和桌面端顯示器這兩種極端的屏幕尺寸之時(shí)，疑問(wèn)會(huì)自然而然出現(xiàn)。有的設(shè)計(jì)師打一開(kāi)始就從動(dòng)態(tài)的視角開(kāi)始他們的設(shè)計(jì)，但是絕大多數(shù)的設(shè)計(jì)師仍然是從靜態(tài)的頁(yè)面開(kāi)始著手設(shè)計(jì)的：選擇一個(gè)固定的高度和寬度，繪制相應(yīng)的草圖或者視覺(jué)稿。

這樣一來(lái)，就引出了幾個(gè)問(wèn)題：你的開(kāi)發(fā)團(tuán)隊(duì)優(yōu)先考慮什么尺寸？設(shè)計(jì)團(tuán)隊(duì)首先交付的高保真視覺(jué)稿是哪個(gè)尺寸的？從技術(shù)限制的角度出發(fā)，你應(yīng)該優(yōu)先考慮什么設(shè)備？

我始終推薦從用戶最基本的“極端”尺寸開(kāi)始考慮，推薦當(dāng)前（2015年）常用設(shè)備中最小和最大的情況：

• 320 x 568 px （iPhone 5 ，由于它是視網(wǎng)膜屏幕，平時(shí)我們是按照72dpi來(lái)設(shè)計(jì)，但是iPhone 5的顯示實(shí)際是144px，所以我們給出了這樣的一個(gè)設(shè)計(jì)尺寸。作為UI設(shè)計(jì)師的你應(yīng)該很清楚@2x和@3x的問(wèn)題）
• 1600×1000 px （桌面顯示器的常見(jiàn)尺寸）

當(dāng)然，你的用戶的實(shí)際情況可能略有不同，稍加調(diào)查，確定“極端情況”。

“剛剛開(kāi)始響應(yīng)式網(wǎng)頁(yè)項(xiàng)目的時(shí)候，從用戶最常見(jiàn)的最大和最小尺寸設(shè)計(jì)著手。”

 

當(dāng)你面對(duì)最小的屏幕的時(shí)候，你需要在小屏幕上呈現(xiàn)出最重要的內(nèi)容，如何選取是一件頗為費(fèi)神的事情。但是面對(duì)大屏幕的時(shí)候，你所思考的事情又是截然相反的：怎么展示內(nèi)容才算是過(guò)多？分欄是否因太寬降低了易讀性？如何選取元素才能避免這樣的問(wèn)題？最后，面對(duì)兩個(gè)不同尺寸的界面，你還要考慮它們所涉及的輸入方式，最小的屏幕上通常是觸摸屏和虛擬鍵盤(pán)，最大的屏幕上，絕大多數(shù)時(shí)候是傳統(tǒng)的鍵盤(pán)鼠標(biāo)。

這里最重要的事情可能是你需要一次挑選兩個(gè)界面尺寸來(lái)做，而不是傳統(tǒng)的針對(duì)一個(gè)屏幕設(shè)計(jì)，然后完成剩下的部分。設(shè)計(jì)師和開(kāi)發(fā)者在這個(gè)問(wèn)題上出現(xiàn)分歧，對(duì)后續(xù)的影響是非常大的。

2、討論不同斷點(diǎn)之間內(nèi)容布局

在日常的網(wǎng)頁(yè)設(shè)計(jì)中，大家對(duì)于靜態(tài)的線框圖投注了如此之多的關(guān)注，但是在做響應(yīng)式設(shè)計(jì)的時(shí)候，應(yīng)該始終謹(jǐn)記頁(yè)面內(nèi)的布局是流動(dòng)的。這也就意味著，你網(wǎng)頁(yè)的用戶絕大多屬時(shí)候所體驗(yàn)到的頁(yè)面其實(shí)是它的“中間態(tài)”。所以，你必須考慮隨著屏幕尺寸大小的轉(zhuǎn)變，布局設(shè)計(jì)的每一個(gè)調(diào)整和改變。比如，當(dāng)屏幕尺寸變小的時(shí)候，文本內(nèi)容需要收縮，并且和混排的圖片會(huì)與文章縮到一欄中去。

這些適配能與不能、該與不該的問(wèn)題上，盡量不要同你的開(kāi)發(fā)團(tuán)隊(duì)去“假設(shè)”或者“推測(cè)”。積極主動(dòng)地去確定這些信息，在你負(fù)責(zé)開(kāi)發(fā)的同事還沒(méi)有做太多之前，和他們達(dá)成共識(shí)。對(duì)于復(fù)雜的布局改變，事先繪制先框圖或者草圖來(lái)單獨(dú)說(shuō)明，是非常明智的選擇。對(duì)于一些不那么重要的特性，通過(guò)簡(jiǎn)短的討論或者電子郵件通知就足夠了。