當(dāng)前位置:首頁>ps入門教程>ps基礎(chǔ)教程>設(shè)計(jì)知識>教程內(nèi)容

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。(2)

來源:站酷 作者:Brandsh_Sam 學(xué)習(xí):2420人次

 

Step2. 頁面排版

1)線框圖

線框圖通過安排和選擇界面元素來整合界面設(shè)計(jì),可以確定一個建立在基本概念結(jié)構(gòu)上的架構(gòu),同時指出視覺設(shè)計(jì)應(yīng)該前進(jìn)的方向。

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。

 

2)固定寬度&響應(yīng)式(以IOS系統(tǒng)為例)

首先科普下固定寬度和響應(yīng)式的具體概念。

 

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。

固定寬度:固定網(wǎng)頁布局指網(wǎng)站內(nèi)容被一個固定寬度的容器包裹,容器內(nèi)的區(qū)塊都有固定的百分比或者像素寬度值,不管屏幕分辨率如何變化,訪客看到的都是固定寬度的內(nèi)容。

 

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。

響應(yīng)式:頁面的設(shè)計(jì)與開發(fā)應(yīng)當(dāng)根據(jù)用戶行為以及設(shè)備環(huán)境(系統(tǒng)平臺、屏幕尺寸、屏幕定向等)進(jìn)行相應(yīng)的響應(yīng)和調(diào)整,跟隨屏幕大小的變化而變化。

 

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。
整合固定寬度與響應(yīng)式設(shè)計(jì)的優(yōu)缺點(diǎn),結(jié)合二者優(yōu)勢,最后決定為每個設(shè)備進(jìn)行獨(dú)立設(shè)計(jì),可優(yōu)化設(shè)計(jì)視覺效果,同時提升最終網(wǎng)站用戶體驗(yàn)。

3)網(wǎng)格

網(wǎng)格是用豎直或水平分割線將布局進(jìn)行分塊,把邊界、空白和欄包括在內(nèi),以提供組織內(nèi)容的框架。網(wǎng)格可以輔助我們設(shè)計(jì)結(jié)構(gòu)統(tǒng)一,畫面更為整潔。

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。

然而,我們應(yīng)該勇敢地向網(wǎng)格以外的地方冒險,要創(chuàng)造一個基于網(wǎng)格的作品,不意味著任何東西都要對齊。

越出網(wǎng)格邊界的元素會讓作品看起來更加簡潔和流暢。

 

設(shè)計(jì)案例!說說品牌網(wǎng)站設(shè)計(jì)細(xì)節(jié)的重要性。

 

學(xué)習(xí) · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
用戶30221236392019-02-18 10:06
加油
安藝興辰2018-06-08 02:30
加油
嘆世2018-02-27 11:03
66666
骨頭收集狂2017-05-28 03:05
66666
皇帝的新裝2017-05-28 02:28
和女友啪啪完,把套套丟在床邊,被我家狗狗給吃了。第二天發(fā)現(xiàn)它便秘拉不出來,帶它去醫(yī)院,當(dāng)醫(yī)生從狗狗菊花里取出套套后說了句:居然插的這么深!你難道不考慮它的感受么?然后看我的眼神,我這輩子都忘不了。
皇帝的新裝2017-05-28 02:28
和女友啪啪完,把套套丟在床邊,被我家狗狗給吃了。第二天發(fā)現(xiàn)它便秘拉不出來,帶它去醫(yī)院,當(dāng)醫(yī)生從狗狗菊花里取出套套后說了句:居然插的這么深!你難道不考慮它的感受么?然后看我的眼神,我這輩子都忘不了。
葒荼綠茶2017-05-28 05:11
學(xué)習(xí)學(xué)習(xí)學(xué)習(xí)
葒荼綠茶2017-05-28 05:11
學(xué)習(xí)學(xué)習(xí)學(xué)習(xí)

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!