這 8 條走心的建議,幫你設計出更加優秀的排版

排版是設計師同用戶溝通的一種方式。在數字產品設計當中,界面的視覺和可讀性對於用戶體驗的影響是極為巨大的。曾經有一位著名的平面設計師曾經說過:「排版設計不僅僅是可見的,而且是可被聽見的。你創建出一個宏大的場景,那麼演員就可以在此登場表演了。」排版能夠呈現情緒、營造氛圍、傳遞精神,所以優秀的排版能夠為設計發聲。今天的文章為你提供一些排版設計上的小建議,雖不複雜,但是也需要你仔細揣摩,才能用好。

層次讓排版發揮作用

想要創建出能被用戶感知到的、令人愉悅的設計,設計作品應該擁有良好的組織結構和清晰的導航模式。而設計師可以通過建立視覺層次結構來明確整體的結構,視覺元素在這個框架下被組織起來,用戶則可以更為清楚地感知其中的內容。

視覺層次可以被分為不同的部分,其中只與文本元素相關的部分被稱為排版層次。排版層次是通過將文本內容劃分為標題、副標題、正文等不同的類型,從而讓文本各司其職,具備良好的層次。不同的文本類型使用不同的大小、字體、色彩來顯示,從而區分出彼此。

清晰的層次結構讓文本具備良好的可讀性。此外,文本中的關鍵部分還能高亮顯示,從而吸引用戶的注意力,甚至關聯到特定的交互和操作上去。

兼顧到上下文場景和用戶

當你在為特定部分的文本選取字體的時候,需要考慮它所處的環境,所在部分的特徵。每種字體都有其特定的功能、適合的場景和情緒,有的友好,有的有趣,有的嚴肅,有的看起來很商業,所以字體和情緒要保持一致。

在你選取字體之前,要清楚產品這個部分的特徵,瞭解客戶的目標,以及目標受眾的需求和偏好。字體的視覺效果會直接影響用戶從你的產品中所獲得的第一印象。如果這種字體不符合產品當前內容的情緒,會在用戶那邊產生誤會的。如果是一個相對嚴肅的商業網站,在其中採用有趣或者拙稚的字體,用戶會對這個企業和服務產生質疑。如果是針對青少年或者年輕人,太過於正式、沈悶的字體,則會讓頁面看起來很無聊。

深入關注移動端的排版

設計師常常會試圖使用實驗性的佈局,來讓設計看起來更加原創。但是這樣非常規的排版佈局遷移到移動端設備上,就不一定具備良好的可用性了。移動端屏幕太小,難以適配過於獨特的設計,這種限制會使得設計師難以兼顧到功能和視覺。設計師需要特別注意移動端排版佈局的細節,從字體尺寸到間距和縮進,這些細節對於整體效果的影響是非常明顯的。

與桌面端的設計相比,移動端的排版更難以達到良好的識別率。在小屏幕上,字體首先要控制到一個相對較大的尺寸,這樣不會因為難以識別而造成混亂。但是太大的字體又會讓設計看起來不夠優雅。同時,設計師還要特別注意內容的對比度,因為移動端設備周遭的環境常常會特別的複雜,如果對比度不夠好,用戶閱讀困難,對視力的損害就不可避免了。

此外,設計師還需要考慮排版佈局的功能性。如果文本中存在可點擊的內容,設計師需要確保它們能夠且易於被點擊到,還不能誤觸其他的地方。

通盤考慮移動端排版的全部細節,設計師才能為用戶帶來有價值的產品。

極簡主義的設計不是沒有道理的

在不久前,許多設計師還會在一套設計當中使用大量的不同的字體與樣式,這樣的設計之下,排版佈局中充斥著大量令人分心的細節,難以營造一致的、合理的情緒和氛圍。

經驗豐富的設計師,通常會在整個排版佈局中,沿用2到3種字體,確保了文本元素之間的對比度,還節省了設計成本,確保了整體的平衡,以及信息傳遞的準確性。在字體樣式上,設計師也會對粗體、斜體這樣的效果保持克制,對真正重要的部分進行強調,避免混亂。

除此之外,文案內容也需要足夠的簡明,不要讓無效信息干擾用戶。

0-UKvls0P_IocIeIo7.jpg

呼吸感很重要

字母之間的間距,行間距和字間距,是可讀性的主要影響因素。調整間距和留白,是排版設計中的重要環節,也是控制整個佈局呼吸感的關鍵。

缺乏留白,或者間距控制不好,最終會影響內容的可讀性:字母難以辨析,單詞看不清楚,視覺上不夠舒適,每行和每個段落看起來不夠舒服,都會影響整體的統一性和內容的閱讀體驗。有密有疏,疏密有致,才有呼吸感。

像科學家一樣排版,像藝術家一樣定制

排版是一個涉及到許多規則和條例的複雜學科,只有充分掌握了這些規則,才能作出足夠乾淨、整飭的排版。但是這還不夠。客戶總是需要一定的原創性,希望你能通過排版佈局傳遞去情感,而這些是排版規則無法幫你實現的。

作為設計師,你的靈魂中是應該有藝術的特質。想象力和對沒的感知,能夠為你的設計賦予原創性和獨特性。在嚴格的規則和獨特的構思之間,找到平衡點,你會發現自己的能力已經超出了你的客戶和你自己的意料。


彩色排版需要深思熟慮

有人認為,成熟的排版設計中沒有色彩的位置,但是也有人認為色彩是視覺設計的必需品,哪怕是傳統的排版設計,也必須具備。不過,在實際排版設計當中,色彩的出場比例並不低,所以這種情況不應忽略。

色彩在排版設計當中,不僅可以強化視覺,而且能夠為UI增加情感因素,吸引用戶的注意力,強化趣味感。不過,用色本沒問題,但是色彩一定要控制好。色彩多而混亂的失敗案例多不勝數,在排版中用色一定要深思熟慮。下面是排版設計中用色的一些技巧:

  • 構成對比。在排版中用色很容易造成混亂,讓內容難以辨認。主要控制好文本和背景之間的對比度。

  • 不要使用太多色彩。太多顏色很容易讓整個UI變得更加混亂。

  • 讓配色協調。配色是設計的基本功,善用色輪和成熟的配色方案。

  • 小心使用特效。文本上盡量少用特效,絕大多數情況下,特效並不會讓文本的視覺效果更好。

1-0SnCYbE9EUPpE5e03kk7pg-iloveimg-compressed.gif


瞭解排版的基礎知識

也許這麼說有點直白,但是確實有很多設計師壓根不瞭解排版設計的基本知識。他們大多依靠各種工具中自帶的排版工具來做排版佈局,他們只需要在選取自己的時候調動自己的審美知識就可以,而排版個諸多規則他們並不確知,只是基於經驗,似是而非地「有所瞭解」而已。

不瞭解排版知識,設計師是無法發揮出排版的真正潛力的,這也是為什麼同樣的素材在別的設計師的排布之下,就是要比自己做的來得漂亮。基礎知識很重要,這並非是一句空話。

0-wozPYAN3Yg5Wqf16.jpg

那些看起來很枯燥的字體設計書籍,當中蘊藏著乾貨。學好排版的基礎知識絕對是磨刀不誤砍柴功。

本文作者:Tubik Studio

譯文出自:优设网 陳子木

譯文出自:这8条走心的建议,帮你设计出更加优秀的排版

責任編輯:BFA 簡報 編輯部