那些爆款版式背後,都離不開這些原則

2020-12-27 騰訊網

本文轉載自:BranD的好奇心

在這個時代,無論是紙媒還是網際網路,信息的傳播都離不開版式設計,好的版式設計可以在有限的頁面內,以最快速、直接、有效的方式傳遞出核心的信息內容,並讓受眾建立深刻而良好的印象。

所以,今天帶大家學習一些版式設計知識,希望可以助你早日做出爆款的版式!

正確認識版式設計

學習基礎

首先,要了解到版式設計是將圖片、文字進行編排組合,以此通過它來更好的傳達作者想要傳遞的信息,並使得版面內容更加一目了然。那麼,它有哪些主要構成部分呢?

頁面基本元素

1#欄

版面中用線條或用空白貫通隔開的部分。

2#版心

版心是頁面中主要內容所在的區域。

3#標題

版面中字號較大的點題性文字,旨在吸引讀者注意力。

4#視覺焦點

版面中最先吸引讀者注意力的部分。

5#正文

版面中標題以外的主要內容,字號較小。

6#頁邊距

版心邊沿至成品邊沿的空白區域。

7#註解

對表格或插圖所作的解釋和補充說明。

8#天頭

版心上方的餘白。

9#地腳

版心下方的餘白。

10#出血

印刷裝訂工藝要求頁面的底色或圖片須跨出裁切線一定的位置,通常為3mm,以免出現因裁切誤差而造成的白邊,裁切線以外的部分稱作出血。

版式設計基本原則

/

比例分配

1#三分法

三分法主要目的是為了幫助你找到視覺興趣點、平衡畫面以及元素之間的不對稱狀態。

舉個例子:將畫布水平和垂直地劃分成三個大小相等3×3的網格,劃分畫面的四條線所形成的四個交點的位置,可以用於放置設計中想要突出或者主導畫面的重要設計元素。

2#黃金比例

顧名思義,恰到好處的比例分割,也因此被各個領域廣泛使用。

其公式為a:b=b:(a+b),特指較小的兩個矩形(例如矩形的較短邊)與較大的兩個矩形以相同的組合方式相關聯,與兩個部分相結合。

/

視覺層級

視覺層次非常重要,它可以創造視覺的興趣焦點,吸引讀者的眼球。除此之外,視覺的層級關係還通過元素的大小、粗細、色彩、位置以及字體的變化等方面來呈現。

1#大小與視覺重量

大號或加粗的字最先吸引讀者的注意力。

2#位置

最顯眼的位置總能優先吸引讀者。一般來說,位於上方的內容或平行時右手邊的位置的內容較為醒目。

3#字體

一般突出性字體顯示的內容往往會更為重要。

4#色彩

區分與周圍文字或其他內容的色彩視覺更能吸引人。

/

網格元素

網格系統作為平面設計重要的工具,它可以提高設計速度,幫助設計師確立視覺層級關係,加強設計的秩序感。

1#頁邊距

介於頁面邊緣和版心之間的留白區域。

2#流線

有助於引導讀者視線穿過整個頁面的標準對齊線,藉此形成橫向排列的信息。

3#模塊

頁面中被標準間隔均分的單元區域,它在頁面中重複出現,並且創建出一系列的行與列。

4#行

用於分隔版心空間,能夠存放內容的水平空間。

5#欄間空白

兩欄之間的分割區域。

6#空間區

為文字、圖像或者其他信息構成特定區域的模塊組或欄目組。

其他網格表現形式

如何做好版式設計

進行分類總結

版式設計的好壞決定你的作品被記住的程度,想要做好它得從以下幾點來探討。

點擊播放 GIF 1.1M

Sans Edgy Variable

字體的選擇

文字作為語言符號,無論在何種視覺媒體中都直接影響版式的視覺效果,它不僅是提高作品的訴求力更是賦予了版面審美的價值觀。

選用字體時,先觀看其設計風格再決定。其次,多看不同的字體,選擇其中集中熟練地套用。

確認用於各種目的的字級大小,注意字體的種類會影響文字看起來的大小,還要記住各媒體一般常用的字級大小。行間距設定為字號大小的1.5倍~2倍,字行越長,行間距越要拉寬才容易閱讀。

文字多列排版時,同樣類型的文章一定要套用相同的樣式,依據不同用途調整字距時,第一優先為文章閱讀時的韻律感,其次才是調整編排的整齊度。

Type Directors Club

色彩與配色

色彩有色相、明度、彩度三要素,各式各樣的色彩可用CMYK混調呈現。印刷用色分別為CMYK混色與特別調製的特別色,要輸出黑色質感時可考慮使用複色黑。

顏色會讓人聯想到溫暖、冰冷、華麗等印象,編排設計時應善用利用顏色的印象並熟練使用。

在做版面設計時,比起單一色彩,更常遇到的是各種混色的連用。多認識顏色的一些使用特點,搭配顏色時可選用同色系、對比色、以及稍微偏離前2種色彩的配色。

編排內頁時偶爾會用到色彩,淺色底搭配深色文字,深色底搭配淺色文字;在此同時,讓背景(底色)和文字之間形成對比關係。

圖片編排

當版面訴求的目的不同時,設計方式也不盡相同。圖片編排方式一般可分為以下幾種:

1#滿版排列

滿版排列主要以圖像為主,文字的編排一般放在上下、左右或置於圖像上,視覺傳達直觀而強烈。

2#上下排列

這個很好理解,版面分為上下部分,如果選擇上部分排圖片,那下部分放文字。

3#左右排列

把整個版面分割為左右兩個部分,分別在左或右配置文案。

4#中軸排列

將圖形作水平方向或垂直方向排列,文字配置在上下或左右。

5#傾斜排列

版面主體形象或多幅圖版做傾斜編排,這樣做的目的可以令版面呈現出激烈的動感和不穩定感。

6#對稱排列

對稱的版式給人穩定、理性、嚴肅的感受。對稱分為絕對對稱和相對對稱,一般多採用相對對稱手法,以左右對稱居多。

7#重心排列

重心排列有三種概念:

a. 直接以獨立而輪廓清楚的形象佔領版面中心。

b. 向心:視覺元素向版面中心靠攏的運動。

c. 離心:與向心恰好相反,其目的是產生視覺焦點。

8#三角形排列

正三角形(金字塔形)是最具穩定感的形狀(註:圓形和倒三角形則給人以動感和不穩定感)。

版面留白的基本技巧

留白的意義是在虛無的空間感中突顯主要視覺的存在感,為此強調主角視覺感的分量。

/

靜態白

1#字面的白-畫面上的留白超過60%,白與主要視覺形成對比,那麼主要視覺的存在感會增強,比例變小,則反之。

2#非白的白-有時候為了防止視線雜亂,整個版面上就必須避免使用超過兩種的主要顏色。

3#陰影的白-主圖佔比超過畫面的50%,可以讓觀者直接了解設計者想要傳達的意圖,文本僅是提點,下一層的信息更細小,反而能呈現簡潔的力道,讓觀者不自覺地從大到小依序被指引導讀。

/

動態白

1#文字主角-由於圖像與圖像之間藏有許多小空間,那麼留白可能來自四周或是內部,經過配置後變得有趣味也更多元化,讓畫面告別呆板。

2#圖片主角-圖片本身的不規則造型,決定了畫面中主要的留白部分,圖片與文字之間的關係和擺放的位置,能讓彼此產生另一個層次的動態感受。

編輯|大箏

*本篇部分文字資料整理於《今日版式》和佐藤直樹《基本的基本——版面設計的基礎思維》,僅供學習與分享,版權歸原作者所有。

相關焦點

  • 2020,這些「爆款」,印象深刻!你都用過嗎?
    一起看看哪些詞是你常用的「爆款」圖片還可點擊呦2020年的這些「網言網語」,既承載著同心抗疫的珍貴回憶,也蘊藏著工作生活的苦辣酸甜,更寄託了我們對未來的無限嚮往。2021年將至,新的一年又將會有哪些熱詞陪伴我們?值得期待!
  • 圖書版式設計的幾個問題
    圖書版式設計作為圖書出版的一個重要環節,必須充分考慮圖書的市場成本和市場接受度,這就決定了圖書版式設計方面需要遵循的第二個原則,即適度性原則。首先,從經濟方面考量,圖書出版的目的是要獲得經濟收益。恰當地設計版式是降低成本切實可行的辦法。例如,選擇合適的紙張材料;選擇合適的圖書開本;調整正文的排列格式,編排緊湊,配置適當,空白少。其次,在風格方面,版式設計在思想與格調方面都要符合相關法律政策要求,有利於社會文明建設。同時,圖書中的一些設計必須充分考量審美觀念和閱讀習慣,切忌矯枉過正。
  • 樓體大字版式設計編排-字工場
    樓體大字信息內容的傳達主要依託於文字、圖形、符號、色彩、地圖等要素,而版式設計則是對這些要素進行合理編排,使信息得以有效傳達。在運用相關原則對樓體大字的版面信息內容進行合理組織後,即可根據視覺傳達的相關設計原理進行各要素的設計編排。
  • 電影海報的版式法則!
    利用比例來完成的版式設計,具有秩序感和節奏感,給人一種審美及心理上的舒適感。 比例美是電影海報基本具備的要素之一,電影海報的文字和圖形兩大主要元素在版面中所佔的比例需要符合比例美的原則。
  • 史上最全版式設計教程,看這一篇就夠了
    版式設計可以說是平面設計的基礎,在實際設計中版式設計的運用卻是千差萬別的,如何根據內容設計出合適又美觀的版面是設計師必須解決的問題。今天小佳老師為你們吐血整理了一篇版式設計全攻略,點讚收藏,絕對有用!!能看完的都是做大事的人。事實上,現在很多設計作品,雖然創意新穎、素材精緻、配色流行,但都只局限於表面的華麗,沒有思考設計背後的技巧。
  • 平面設計中需要注意的關鍵原則是哪些?
    所以,初學者必須首先知道平面設計的基本原則和要素都有哪些,學會這些才能幫你創造出美的圖形。01.平衡平衡為整體設計提供穩定性和結構性。為了更好地理解它,請認為每個設計元素背後都有分量。形狀,文本框和圖像是構成設計的要素,因此熟悉這些要素所具有的視覺重量很重要。
  • 那些爆款「10萬+」內容的背後,其實都站著一群全媒體運營高手
    相信每個新媒體人看見「10萬+」這個詞都會特別激動,但其實,無論是圖文內容、活動亦或是短視頻....那些爆款10萬+的背後,其實都站著一群全媒體運營高手。
  • 版式設計的視覺流程!
    在這些視線上的任何點都要比其它點的視覺注意率要高。同時人的視線在同一個版面的注意力分布也是不同的,注意力一般會集中在上方、下方和中上方。一個恰如其分的視覺流程必須符合這種邏輯順序。視覺流程作為一種視覺順序不僅可引導觀者閱讀,還可以減輕觀者的視覺疲勞。
  • 版式設計如何用格子設計版面?
    到了20世紀80年代,創意版式設計興起,最重要的代表人物是美國的戴維·卡森*和英國的尼維利·布羅迪**,他們結合勒曼·雷納基的光感抽象詩意攝影、
  • 這些乾隆通寶版式,遇到就別錯過!
    品相因素已經佔重要地位,美品乾隆大樣已過千元大關;尺寸因素影響價格也不小,直徑28毫米對大多數乾隆大樣來說都是一個關口;另外一些版別較少的乾隆大樣(如短足寶、方頭通大樣等)價格也要比普通大樣貴不少。 下面根據寶泉乾隆大樣由少到多地簡單羅列一下。個人認識有所偏差,不足之處還請批評指正。
  • 版式設計需要合理規劃圖片!
    這種方式放大的圖片是對某一個物體進行放大特寫,使我們能夠清晰地看清楚那些細節,給人帶來震撼感。③根據輪廓線來剪裁圖片。我們在設計一些物品食品、衣物等實物版式時常常採用沿物體輪廓線來裁圖片,這種方式可以最大限度地將物體的形狀與特點展示出來,使圖像更具有動感和靈活性;同時,沿輪廓線裁剪的圖片在與文字等其他元素進行組合編排時,可以使版面的樣式豐富多樣。
  • 送你三招PPT關鍵頁面的萬能版式,不用模板也能高顏值
    今天決定講講版式的內容,並附上大量參考案例,這些都是我自己製作的,便於各位借鑑和使用。不知道各位朋友有沒有發現一個問題,平時就算收集再多ppt模板,到真要自己製作ppt了,卻感覺力不從心。學習版式製作,個人認為是學習ppt的第一步,這是一切的基礎,萬變不離其宗的宗,只要掌握好常見的幾種ppt版式,ppt怎麼做都不會太差。一、封面頁的版式封面就是ppt的門面,也是ppt展示時間最久的一頁,所以很值得用心去對待。
  • 技術創造價值,騰訊爆款產品背後的技術大揭秘
    前臺流暢、優質的用戶體驗,離不開後臺穩定技術和架構支持。12月20日,在2020 Techo Park開發者大會騰訊爆款產品分論壇上,騰訊雲副總裁李鬱韜指出,好的產品背後是技術的不斷演進。騰訊公司成立22年,創造出一系列產品,積累了強大的技術能力,並將這些技術和能力標準化,開放給企業和開發者,讓他們靈活地把這些技術整合到業務場景中。
  • 女性雜誌封面的版式美感!
    雜誌是創意時尚版式設計的載體。女性系列雜誌封面設計清新活潑、時尚的風格獨樹一幟,深受女性讀者的喜愛。美學角度上,女性系列雜誌封面印刷精美,色彩豔麗,非常具有視覺衝擊力,能夠再現描述內容和形象的特點;版式設計中常常將一張圖片或插圖佔滿全版,增強了圖片的視覺效果,生動而富有感染力。
  • 2018梅花精選訪談top13,八一八爆款背後的流行基因
    查看文章:日刷抖音三百條,這些大V是怎麼在抖音上「吸粉」的? 關鍵詞四:跨界、國潮 摘要:六神RIO雞尾酒、老乾媽衛衣、大白兔奶糖潤唇膏……大概每隔一段時間,都有老牌的跨界爆款產品在社交媒體刷屏,品牌通過跨界來吸引年輕消費者的注意的營銷方式並不新奇,不過背後折射的更是一種文化的流行——國潮,最先將「國潮」一詞在網絡推助起來的是著名的電商平臺天貓。
  • 版式在移動界面中的應用
    二、版式設計在移動界面中的應用版式設計的常見布局有十三種:骨骼型,滿版型、上下分割型、左右分割型、中軸型、曲線型、傾斜型、對稱型、重心型、三角型、並置型、自由型、四角型等。這些布局在平面設計中應用非常廣泛,而移動界面的設計與平面設計最大的不同在於其功能性、可操作性和可交互性,版式的選擇也是基於產品的功能特性、目標用戶、使用場景等因素。
  • 《南方人物周刊》(2008—2018)版式設計演變趨勢簡析
    受國內外設計界極簡主義等思潮的影響,同時為了適應新時代快節奏、碎片化的讀者閱讀習慣與審美方式的改變,近十年來,《南方人物周刊》在版式設計上不斷探索、革新:由喧譁到寧靜、由絢麗歸於素淡、由「霸佔」利用版面一切空間到注重受眾實際閱讀體驗……歸根結底,易讀性成為統領其版面變化的首要原則。
  • 都說男人的成功離不開他背後的女人 看下十一郎為張宇寫的這些歌
    都說一個男人的成功都離不開他背後的女人,著名歌手張宇就是一個很好的例子,他的成功絕對離不開他背後的女人十一郎(蕭慧文),這對黃金搭檔夫妻寫出的歌那是一首接一首的經典啊!歌壇有這樣一句話:「張宇的好,只有十一郎知道」,十一郎本名叫蕭慧文,中國臺灣人,這個筆名也是張宇取的,從張宇出道以來,十一郎就為張宇寫了近150首歌曲,曲中不少都是人盡皆知的經典歌曲,本期就來跟大家盤點一下十一郎跟張宇一起創作的經典歌曲,看看你聽過幾首?
  • 內部揭秘|爆款背後「逆風翻盤」的騰訊《創造101》團隊
    這個夏天,和世界盃搶奪熱門話題的,當屬2018上半年的「爆款」綜藝節目《創造101》。 同樣「逆風翻盤」的,還有這檔節目背後的團隊——OMG創造101項目團隊。當霸佔朋友圈和熱搜三個月之久的《創造101》落下帷幕,我們邀請三位內部團隊的同事一起聊聊爆款背後OMG創造101項目團隊的故事。
  • 盤點怪盜基德一直在遵守的那些原則,你知道是哪些嗎?
    怪盜基德作為一個魔術師一直在遵循著三為原則,其簡稱為薩斯頓三原則。怪盜基德曾經拿著發射撲克牌的手槍對著柯南提到過這些原則,下面一起來看看吧,怪盜基德可是一直都未曾違背。請輸入圖片描述3、怪盜基德不會提前告知他今晚的魔術內容。