網頁設計“立體感”不夠,技巧來湊!
發表于:2017-09-30
我們生活在三維的立體空間,周圍的物體都是三維的存在,能看得見摸得著。但是瀏覽網站的設備屏幕是二維,看得見摸不著,所以在網站頁面上的視覺表現要比真實生活用肉看看到的視覺感差。
為了能讓設計更有深度,看起來更加“立體感”,該從哪些方面進行調整呢?
重疊位置關系
設計稿版面的中心位置是視覺的焦點,也是最佳的視覺區域,然后依次為上方、左側、右側、下方的位置順序。通過重疊的位置關系,將圖象或文字作前后疊壓排列,將重要的信息或視覺流程的信息安排在注目價值高的部位,讓主要信息掩蓋次要信息,同時營造了一種縱深感。
比例關系和尺寸
大的物體看起來要近,小的物體看起來遠一些,即近大遠小產生近、中、遠的空間層次。在設計排版的時候,可以將主體形象或標題文字放大次要形象縮小,通過不同尺寸大小的物體來建立層次分明的空間關系,以達到增強設計稿的立體視覺效果。
動靜關系、畫面肌理
“動”態的設計稿視覺上充滿活力,能夠吸引用戶獲得更高的關注度;“靜”態的設計稿版面則會比較含蓄高冷,兩者在版面的組織上,以動為前,靜為后,彼此以動靜的對比關系來建立空間感。
畫面肌理的運用會給瀏覽者一種暗示,以細小的文字或圖象組織的版面,透過屏幕可以感受到現實生活中視覺元素的表面。
黑、白、灰的空間層次
網站設計強調色彩的調性,或高調、低調、灰調;或對比強烈;或對比柔和。優秀的網站制作公司,設計稿色調都非常明確,網站整體瀏覽起來非常和諧。
反之,如果色調沒有處理妥當,網站整體會比較混亂,嚴重降低用戶的瀏覽體驗。因此,應加強形與空間大小面積的對比關系、文字的整體關系,以及用集中近似的面積等來達到色調統一。
總結
更多的設計技巧可以更好的駕馭設計,不同的方法可以展現設計稿有不用層次的“立體感”,不妨試試以上幾種方式,在網站制作的過程中讓網頁設計更出彩。
(非特殊說明,本文版權歸原作者所有,轉載請注明出處 )
標簽: 上海網站建設、上海網站制作、高端網站設計、邁若網絡
手機隨時獲取邁若動態,掃描左側二維碼
添加邁若微信公眾號【manro_since2005】