毅耘資
返回列表
手機UI視覺設計構圖的基本法則
手機UI視覺設計構圖的基本法則2018-02-06毅耘科技1389

手機UI視覺設計構圖的基本法則

【毅耘科技】

手機UI視覺設計構圖的基本法則

蘋果手機的UI視覺設計構圖都是我們值得去學習的好案例。

這節課主要講解UI視覺設計構圖的基本原則。

 

1、什么是構圖?

構圖就是有限的畫面中,將各種元素進行合理地布局和安排,使圖形和文字在畫面中達到最佳位置,產生最優視覺效果。

構圖是整個畫面的骨架,決定了視覺營銷界面是否準確的表達主題,吸引用戶注重。

2、構圖的四項基本法則—分別為:均衡、對比、律動、視點

今天跟大家分享的主要從APP指導頁設計,APPbanner圖設計說起,這四項基本視覺構圖法則適合偏平面設計。當然這也是大家學習APP ui設計的基本理論知識。

當然一個完整的指導頁界面包含:主題圖、背景渲染圖、文字、點綴圖以及動畫元素組成。

第一條構圖法則:均衡

手機UI視覺設計構圖的基本法則

 

 

各元素在布局上保持視覺重量的平衡和勻稱,從而使視覺界面具有平衡感和穩定性。堆成是均衡的一種極端情況,平衡感和穩定性很強,適合體現但局限性較大、缺乏轉變。

 

視覺構圖的理論模型圖如下:

手機UI視覺設計構圖的基本法則

第二條構圖法則:對比

手機UI視覺設計構圖的基本法則

 

在視覺界面中通過大小對比、字體大小、粗細對比、疏密對比、曲直對比等形式來凸起和強化主題,引起用戶關注。

 

視覺構圖的理論模型圖如下:

手機UI視覺設計構圖的基本法則

第三條構圖法則:律動

可以理解為有節奏、規律、跳躍、動感等元素。

手機UI視覺設計構圖的基本法則 手機UI視覺設計構圖的基本法則

起指導用戶的視覺軌跡的作用。研究注解,畫面右上角最能吸引人的關注,而左下角對人的吸引力最小。律動能給人視覺上富有規律的節奏效果,進而吸引用戶了解APP界面內容。

 

視覺構圖的理論模型圖如下:

手機UI視覺設計構圖的基本法則

第四條構圖法則:視點

即 ?視覺的中間點或者是視覺焦點 ?跟我們拍照的時候,需要頂一個焦點。也是視覺傳達要素的核心點。

手機UI視覺設計構圖的基本法則

 

視點:即畫面的視覺中間。構圖的視覺中間一定是界面最主要的內容,也是必須讓用戶了解的內容。視覺中間常常在畫面中八分之五的地方,以此為基礎進行視點構圖,能更凸起地體現視覺主題,并將用戶的注重力集中到主要內容上。

 

視覺構圖的理論模型圖如下:

手機UI視覺設計構圖的基本法則

所以,均衡、對比、律動、視點就是UI視覺設計構圖的四項基本法則,大家必須會充分理解和會使用。

希望下面的5個視覺設計基本體現手法,值得大家好好的理解和使用。

① 秩序法:均衡、對稱、擴大縮小、平行位移等有秩序有節奏地構圖,制造形式美。

② 對比法:色彩、外形等的對比,給人鮮明生動的視覺印象。

③ 元素法:強化點、線、面構圖元素,創造視覺交響,寓多樣性于個性之中。

④ 矛盾空間法:顛倒、錯位、鏡像,在空間上構成特殊性,產生一種無限可能、無限發展、無限趣味的空間感。

⑤ 共形法:巧妙嵌合邊緣形態,重疊共用,互生互補,變幻相生,給人新穎奇特,別開生面之感。

 

本文標題:手機UI視覺設計構圖的基本法則

本文網址:http://www.sontosi.com/news_detail/id/809.html

原創網址:小程序開發公司< 毅耘科技 >版權所有,轉載標明出去,并以鏈接形式鏈接網址http://www.sontosi.com/

文章標簽: 合肥小程序開發 合肥小程序

毅耘科技(www.sontosi.com)提供小程序開發,微信開發,商城小程序,小程序定制開發,新零售O2O模式,餐飲,社區,門店,教育,預約,微信小程序微信商城,解決方案,一站式全商業小程序平臺,是專業為企業提升價值的公司

相關文章

友情鏈接: 合肥網站優化  知識付費平臺  合肥網站建設  手機商城系統  合肥app開發 
安徽毅耘科技有限公司 版權所有 Copyright ? 2017 All Rights Reserved 法律聲明 皖ICP備17006053號    XML地圖/ 網站地圖
關閉 内页底部: 五十老熟妇乱子伦免费观看,A片无码免费视频在线观看,日本人成网站18禁止久久影院,国产毛1卡2卡3卡4卡免费观看
<蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <蜘蛛词>| <文本链> <文本链> <文本链> <文本链> <文本链> <文本链>