如何創造視覺層級

更新於 2024/07/18閱讀時間約 5 分鐘
視覺層級並不侷限於平面設計,在用戶體驗及介面上更是一個重要的核心之一。

視覺層級除了讓畫面的視覺編排更加精緻好看,更重要的功能是能讓畫面有效地被組織,讓觀者更容易理解。


視覺層次?層級?

多數人較多接觸的詞彙是「層次」,較常描述畫面是否豐富有變化?而這邊說的「層級」則是注重於優先順序。

層次是指系統在結構或功能方面的等級秩序。具有多樣性,可按物質的質量、能量、運動狀態、空間尺度、時間順序、組織化程度等多種標準劃分。不同層次具有不同的性質和特徵,既有共同的規律,又各有特殊規律

最初心理學家基於格式塔原理來檢測用戶對於元素之間關係的視覺感知,發現人們傾向於將視覺關係靠近的元素群視作為有關係的一組。

雖然層次與層級的意思很接近,但他們之間還是有些許的差異。

  • 層次:既有共同的規律,又各有特殊規律。
  • 層級:注重在優先順序,且有層次的特性。

不只要了解層次,更要學習如何運用層級來提升你的視覺;當你會使用層級的時候,其實就已經擁有了層次的概念。

最簡單的方式就是善用對比。

接下來介紹這些對比方式:大小、上下左右、色彩、圖片,最後則是學習如何融會貫通且打破規則。


運用大小

通常我們會優先注意最大或最顯眼的對象,最簡單的作法,就是使用大小來將元素製造優先順序。


上下左右會影響視覺順序

上下左右的順序,與我們的閱讀習慣有很大的關係。


「由上至下」、「由下至上」

右圖我們習慣由上面的點閱讀至下方的點。

而左圖就算有大小的變化,但因為視覺的對比不夠強烈,所以第一時間還是有可能先往上方的點看,再來因為由上往下觀看,可能會產生由小至大的感受,所以就分不出到底是上面的圓優先還是下方較大的圓優先?


「由左至右」、「由右至左」

左右的差別以圖形來說並沒有太大影響,但以文字來說,閱讀順序的方向會隨著內容而改變。通常我們最常以 “Z” 字形的方向閱讀。


色彩更直觀卻也較不好掌握

無彩色會優先注意到顏色較重的圓,因為他與背景的白色對比較高;而有彩色又比無彩色更顯眼,因為灰色跟白色皆為無彩色,所以對比沒有比與有彩色對比強烈。

無彩色:白、灰、黑等色系。

為何會說較不好掌握呢?因為當我們的背景是深色甚至是其他有彩色的時候,對比情況也會有所不同。

加入了色彩以後,就必須要了解不同色系之間的對比關係,彩度、明度、補色等等對比,若處理得不好就會讓人有種畫面混濁或是沒有達到凸顯效果。


圖比文字吸引人

當畫面只有圖片與色塊的時候,我們會將目光優先放在圖片上,並視讀圖片的內容。

並不是放張圖就能達到吸引人的效果,而是圖片的內容是否吸引人?
以上先以最簡單的方式區分,這些方法都是為了達到「視覺引導」的目的,引導觀者先觀看畫面不同區域的優先順序。

更多時候我們不只運用單個方式呈現,而是混合使用,並且觀察與分析一個富有視覺階層的設計是如何達成的?並且維持平衡的狀態,而不是一昧的強調所有訊息。


範例

接下來會介紹幾個範例,以視覺是有引導舒服平衡的狀態為主:

第一眼看過,會先注意到中間的女人與荷葉圖案,接下來可能會往上或往下看藏在畫面中的VATTIN字眼,最後才觀看右上角的小字,而背後的深色底襯托整體的神祕感,讓畫面顯得更吸引人。


運用顏色的統調,讓畫面看起來舒適,整體用白色來作為視線引導,以螢幕的亮度以及白球的前後大小變化相呼應,畫面的螢幕即為水平視線。

在插畫上也能讓畫面具有層次,且內容的物件是互相有關聯的,可以點擊圖片觀看更多系列的插畫。


因應主題,可以大膽的留白,藉由線條引導搭配切痕的流動,最後讓畫面聚焦到刀尖上。畫面中的物件安排具有視覺層級,看似不單調,也不會讓主題失焦。


最後的碎碎唸

  • 主角是誰?畫面只敘述一件事情或核心,切勿貪心。
  • 畫面的主題很重要,不為了強調而與畫面主題背道而馳。
  • 精隨在於傳遞訊息。
  • 除了練習視覺引導、編排等,也可以觀察或臨摹不錯的作品。
  • 打破規則,使用不同的方式呈現,避免一成不變。
  • 清楚每個元素的關係,不管是大至背景,或小至點綴的物件。
  • 你可以更大膽一點。
  • 注意呼吸與留白。
換帳號唷
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
如果你能保持穩定吸收,就能保持穩定輸出。你的靈感總是像曇花一現,來了就走了?還是像枯竭的青春,一去不復返?不管是不是創作者,都會面臨這困境;經過多次的體驗,終於找到了答案「如果你能保持穩定吸收,就能保持穩定輸出」。
素描擁有那無法比擬的美感,藏著你的氣息。素描是所有繪畫的基礎,甚至是設計的基礎。運用簡單的線條筆觸,加上輕重緩急,就能繪製出各種畫面。
練習線條&排線的手感,掌握輕重緩急的表現。這些看似簡單的線條,經過安排之後,可作為基本的繪畫練習、創作前的草稿、視覺的紀錄,也能是完整的視覺藝術作品。
如果你能保持穩定吸收,就能保持穩定輸出。你的靈感總是像曇花一現,來了就走了?還是像枯竭的青春,一去不復返?不管是不是創作者,都會面臨這困境;經過多次的體驗,終於找到了答案「如果你能保持穩定吸收,就能保持穩定輸出」。
素描擁有那無法比擬的美感,藏著你的氣息。素描是所有繪畫的基礎,甚至是設計的基礎。運用簡單的線條筆觸,加上輕重緩急,就能繪製出各種畫面。
練習線條&排線的手感,掌握輕重緩急的表現。這些看似簡單的線條,經過安排之後,可作為基本的繪畫練習、創作前的草稿、視覺的紀錄,也能是完整的視覺藝術作品。
你可能也想看
Google News 追蹤
Thumbnail
本文探討了複利效應的重要性,並藉由巴菲特的投資理念,說明如何選擇穩定產生正報酬的資產及長期持有的核心理念。透過定期定額的投資方式,不僅能減少情緒影響,還能持續參與全球股市的發展。此外,文中介紹了使用國泰 Cube App 的便利性及低手續費,幫助投資者簡化投資流程,達成長期穩定增長的財務目標。
Thumbnail
本文探討了原生家庭的業力法則、豐盛的物質生活和撰寫適合自己的願望清單。通過重新定義業力,作者解釋瞭如何達到身體健康,並提出了有效的願望清單撰寫建議。
了解口碑行銷是什麼與影響力創造產品價值 A. 口碑行銷是什麼: 口碑行銷意義,作為一種古老而又經典的行銷方式,是指消費者通過口口相傳、分享自己的使用體驗和感受,從而影響其他人對品牌或產品的看法和購買決策。它源於人們對他人的建議和推薦更容易產生信任,因此口碑行銷在當今信息爆炸的社會中具有越來越重
Thumbnail
文案設計是一種重要的視覺傳達技巧,透過文字、圖形、色彩等元素的搭配,傳達出品牌或產品的訊息。其中,色彩是文案設計中不可或缺的元素,它可以影響人們的視覺感受、情緒和心理。學會利用色彩在文案設計中,可以讓你的設計更加吸引人,一眼就被看見。以下將介紹7種常見顏色在文案設計中的魔力,以及它們適合用在哪裡
Thumbnail
你是否想了解如何創造客戶無法拒絕的超值優惠?你是否想利用社群媒體和電子報打造超過10萬美元的線上事業?你是否想在 LinkedIn 上獲得更多關注?你是否想利用 TikTok Shop Dropshipping 創業新機會?你是否想設定合適的收費標準? 如果你有上述疑問,那麼這篇文章就是為你寫的。
Thumbnail
運動不僅可以強身,更是一門好生意! 2022年初的世界棒球經典賽,重新燃起棒球迷的棒球魂,魔獸霍華德登台、林書豪返鄉打球,都讓國內職籃再起風雲,運動賽事不僅再次受到人們重視,更帶動了啦啦隊員的知名度與曝光度,成為人們目光焦點。
今天,我想談談家的溫度,不只是指物理的溫度,更是指家的氛圍和舒適度。作為一個智能家居創業家,我葉瀚林的目標是創造一個讓人感到溫暖和舒適的居住環境。 我相信,一個好的居住環境應該能夠迎合居民的需求,讓他們感到安心和放鬆。這就是為什麼我在智慧家居系統中加入了許多功能,以提供更好的居住體驗。
Thumbnail
講到西方文明的文學與戲劇傳統,莎士比亞可說是貨真價實的文學與戲劇之神:他的作品是文學課程的必讀文學經典,也是歷代西方的大中小學生們一定要上台演出的戲劇經典。能同時在文學與戲劇這兩個領域成為經典,可說是空前絕後,從莎士比亞之後,再也沒有別人可以完成這樣的成就了。
Thumbnail
#WhatIsMyCenter我的本質是什麼 #動力就像空氣_不能沒有_擁有時又忽略它的存在 "捍衛聯盟 Rise of the Guardians
Thumbnail
周末花了點時間重複聽了MAYO創辦人 簡士評在 商業思維學院 中的講座「人力資源工作者如何創造高價值」。James從過去在科技業的豐富經驗中思考HR應如何從人事行政的工作解放,並從策略、人才布局的面向為企業帶來價值。我筆記了一些相當具啟發性的思考與大家分享,這些觀點非常寶貴,值得反思自己的工作內容。
Thumbnail
如果你是一個每個月等待著薪資入帳來支付所有的帳單或債務的人,那麼從這篇文章中你可以得到一些有用的資訊,我從過去的工作經驗中,了解到不管是熱情、快樂、幸福感,甚至是健康、財富,這些都不會從天上掉下來,而是需要主動去追求,你總不可能躺在沙發上吃著洋芋片喝著含糖飲料,卻還希望自己有個健美的身材吧?
Thumbnail
本文探討了複利效應的重要性,並藉由巴菲特的投資理念,說明如何選擇穩定產生正報酬的資產及長期持有的核心理念。透過定期定額的投資方式,不僅能減少情緒影響,還能持續參與全球股市的發展。此外,文中介紹了使用國泰 Cube App 的便利性及低手續費,幫助投資者簡化投資流程,達成長期穩定增長的財務目標。
Thumbnail
本文探討了原生家庭的業力法則、豐盛的物質生活和撰寫適合自己的願望清單。通過重新定義業力,作者解釋瞭如何達到身體健康,並提出了有效的願望清單撰寫建議。
了解口碑行銷是什麼與影響力創造產品價值 A. 口碑行銷是什麼: 口碑行銷意義,作為一種古老而又經典的行銷方式,是指消費者通過口口相傳、分享自己的使用體驗和感受,從而影響其他人對品牌或產品的看法和購買決策。它源於人們對他人的建議和推薦更容易產生信任,因此口碑行銷在當今信息爆炸的社會中具有越來越重
Thumbnail
文案設計是一種重要的視覺傳達技巧,透過文字、圖形、色彩等元素的搭配,傳達出品牌或產品的訊息。其中,色彩是文案設計中不可或缺的元素,它可以影響人們的視覺感受、情緒和心理。學會利用色彩在文案設計中,可以讓你的設計更加吸引人,一眼就被看見。以下將介紹7種常見顏色在文案設計中的魔力,以及它們適合用在哪裡
Thumbnail
你是否想了解如何創造客戶無法拒絕的超值優惠?你是否想利用社群媒體和電子報打造超過10萬美元的線上事業?你是否想在 LinkedIn 上獲得更多關注?你是否想利用 TikTok Shop Dropshipping 創業新機會?你是否想設定合適的收費標準? 如果你有上述疑問,那麼這篇文章就是為你寫的。
Thumbnail
運動不僅可以強身,更是一門好生意! 2022年初的世界棒球經典賽,重新燃起棒球迷的棒球魂,魔獸霍華德登台、林書豪返鄉打球,都讓國內職籃再起風雲,運動賽事不僅再次受到人們重視,更帶動了啦啦隊員的知名度與曝光度,成為人們目光焦點。
今天,我想談談家的溫度,不只是指物理的溫度,更是指家的氛圍和舒適度。作為一個智能家居創業家,我葉瀚林的目標是創造一個讓人感到溫暖和舒適的居住環境。 我相信,一個好的居住環境應該能夠迎合居民的需求,讓他們感到安心和放鬆。這就是為什麼我在智慧家居系統中加入了許多功能,以提供更好的居住體驗。
Thumbnail
講到西方文明的文學與戲劇傳統,莎士比亞可說是貨真價實的文學與戲劇之神:他的作品是文學課程的必讀文學經典,也是歷代西方的大中小學生們一定要上台演出的戲劇經典。能同時在文學與戲劇這兩個領域成為經典,可說是空前絕後,從莎士比亞之後,再也沒有別人可以完成這樣的成就了。
Thumbnail
#WhatIsMyCenter我的本質是什麼 #動力就像空氣_不能沒有_擁有時又忽略它的存在 "捍衛聯盟 Rise of the Guardians
Thumbnail
周末花了點時間重複聽了MAYO創辦人 簡士評在 商業思維學院 中的講座「人力資源工作者如何創造高價值」。James從過去在科技業的豐富經驗中思考HR應如何從人事行政的工作解放,並從策略、人才布局的面向為企業帶來價值。我筆記了一些相當具啟發性的思考與大家分享,這些觀點非常寶貴,值得反思自己的工作內容。
Thumbnail
如果你是一個每個月等待著薪資入帳來支付所有的帳單或債務的人,那麼從這篇文章中你可以得到一些有用的資訊,我從過去的工作經驗中,了解到不管是熱情、快樂、幸福感,甚至是健康、財富,這些都不會從天上掉下來,而是需要主動去追求,你總不可能躺在沙發上吃著洋芋片喝著含糖飲料,卻還希望自己有個健美的身材吧?