6個精彩的編輯排版設計案例

01.Otl Aicher Isny

6個精彩的編輯排版設計案例

Otl Aicher的Isny:關於大型展覽的一本限量版書籍

德國設計師Otl Aicher用了超過10年的時間,在Isny imAllgäu小鎮創意設計了一系列海報。設計師避開了典型的彩色明信片風格,採用了鮮明、簡約和單色的設計方法,這非常有創造性。

“關於本書的版面設計,團隊感受到了真正的責任感,我們如何為項目帶來基本原理和秩序的簡寫。”

設計團隊選擇Univers字體,這種作為Isny品牌的一部分使用的字體,同時也是Aicher項目最為人所知的慕尼黑奧運會項目使用字體。

“這是一種簡單而有效的排版設計結構,印刷在一張沒有塗布的紙上,以反映出Isny海報最初印刷的材料,”Eley說。“小鎮故事以圖片的形式再現在有塗層的紙上。”

6個精彩的編輯排版設計案例

版面佈局需要與主體的審美一致

象形圖只作為實體印刷品存在,它不是矢量藝術品,所以我們必須以高分辨率拍攝所有內容,以便儘可能準確地再現它。這實際是有一定困難的。

“我們想表現出Aicher對Isny提出的創意,即版面利用網格設計元素,”Eley說,“但是我們越來越發現不太容易實現。例如,沒有什麼是真正的的方形,雖然它最初可以實現,面對這種情況,我們有些頭痛。”

6個精彩的編輯排版設計案例

Aicher的象形圖必須在高分辨率下,進行數字化處理

對於任何一個從事類似項目的人來說,Eley的主要建議是什麼?他說:“好的文件歸檔是至關重要的。知道所有東西在哪裡,誰拍了什麼照片,以及你是否有足夠高的分辨率圖片適合印刷出來,這絕對是關鍵。”

最後,他補充道,你必須非常熟悉這本書的內容。根據文章敘述內容,來進行設計。因為設計和排版是表達任何故事的基本要素,所以一定要記住這一點。

“在這種情況下,我們非常清楚我們不能‘為了藝術而藝術’。這本書的設計還是要考慮到內容,上下文,這才是真正的重點。因此,我們不能固執己見,必須使設計保持“安靜”,同時要為另一位設計師的作品制定框架並給出相關背景圖。最終,這還是一個尊重的問題。”

02.《這就是我——句號》

6個精彩的編輯排版設計案例

利用句號,以一種有趣的方式探索標點符號

《這就是我——句號》:設計充分體現了標點符號的藝術、樂趣和玩味,它利用漂亮的設計來探索“標點符號的秘密生活”。

以一種有趣的、半開玩笑的方式,來探索一個小眾話題,並充分利用簡單和空白的設計原則,將所有東西聯繫在一起。這個技巧看起來很簡單,但在實踐中很難實現。

“在設計佈局時,”Caz Hildebrand說,“我們最大的決定就是使文本始終成為正式的一貫元素,並讓插圖和設計分散開來並儘可能多地發揮它們的作用,以便它們能夠支持和增強文本的含義。與空格打交道總是一種樂趣,當然,擁有這麼多的自由發揮餘地,對於設計師同樣也是一項挑戰。

6個精彩的編輯排版設計案例

利用插圖和設計,為文本提供了一致性

他繼續說道:“這本書的文本字體相當友好和平易近人,具有足夠的權威和力量,以吸引廣泛的讀者。”同樣值得注意的是,我們用真實的字體創建了所有的插圖和設計。探索使用已知和未知的字體,一直是具有挑戰性的。

高生產價值也是核心問題。他說:“為了找到最簡單的方法來表達書的主旨,我們在黑底白色的箔紙上刻字,從而實現了啞光和光澤之間的鮮明對比,這有助於這本書脫穎而出。”

“為了保持穩固,我們把這本書裁切得很平整(我們喜歡在書店裡看到它們被碼放得很好)。在書裡面,我們用黑色的封底紙和分隔線,將讀者帶回到封面的中心位置。”

6個精彩的編輯排版設計案例

所有的插圖和設計都是使用真實的字體創建的

他繼續說:“並不是所有有意識的設計都必須被友好閱讀。所以你是設計師,也是讀者——你期望看到什麼?什麼會讓你感到驚喜?換句話說,這不僅僅是它的外觀,而是它的讀法。”

“幫助文本,不要隱藏它。排版確實能支持你說的話。書有很多頁碼,所以永遠銘記一點,書需要保留一個固有的內在正式結構,同時又能夠自由地擺脫。”

03.《印刷版圈子》雜誌第十二版 圓形19號

6個精彩的編輯排版設計案例

《印刷版圈子》雜誌第十二版圓形19號,這一版記載著志願者運營和非營利組織成立40週年,該組織旨在使設計師對字體和排版的有效結合感興趣。

“每18個月出版一次的通告就是一份不尋常的出版物,因為它沒有任何廣告,因此更加獨立,我們可以按照我們的意願去做,”設計師Domenic Lippa說。“這對它吸引核心受眾也很重要。”

該出版物的設計最值得注意的是它的大字體。Lippa說:“我們用這個來創造影響力,並挑戰人們對文字使用方面的偏見。對我們來說,它和圖像一樣重要,並不是純粹用於信息表達。”

6個精彩的編輯排版設計案例

大號的、大膽的字體設計被用來創造影響,挑戰感知

當談到設計時,每個問題都是一個獨立的部分,他補充道。“在我們開始設計之前,我們經常決定採用一種方法,其中包括字體、外觀和調色板。這些顏色有助於為整個雜誌創建一條線索。”

即使在每個問題中,他們的目標都是多樣化的,他補充道。“我們希望不斷挑戰自我,展現自己,不讓設計變得重複無聊,因此每一種傳播有不同的個性——我們不是設計法西斯主義者!”

6個精彩的編輯排版設計案例

甚至在每個問題中,設計師都會使用各種不同的佈局方法

“對我而言,各段文字之間的尺度關係是排版設計中最重要的元素。 你不應該害怕,而是應該自信地使用字體。”他說。

“我相信作為設計師我們需要不斷質疑現狀。為什麼我們這樣做?永遠不要停止學習,永遠不要停止嘗試,否則你將成為了思想枯竭的設計師和思想家。”

04.《魅力、好戰與任性》

6個精彩的編輯排版設計案例

瘋狂的封面,瘋狂的傢伙

《魅力、好戰與任性》:GBH的不完整專著作品,你注意到的第一件作品,封面都是引人注目的。

Mark Bonner解釋說:“我們想做一些事情來支持我們剛剛開始的想法,我們還沒有完成。我們對人類進化很感興趣,我們喜歡這個古老的想法:在一個房間裡,有100只猴子,只要有時間,就能創造出GBH的完整作品。”在GBH中,我們用了25個,這已經給我們一個嘗試的機會了。

6個精彩的編輯排版設計案例

這本書旨在與設計界進行更廣泛的對話

他說,團隊希望這本書能實現兩個目的。“我們需要對每個項目的設計進行解釋,我們希望能與讀者進行更廣泛的對話,瞭解我們在製作過程中所存在的不安全感和勇氣。”

我們覺得沒有人說過這些令人不安的事實。很多關於設計的書都是自我吹捧的,但我們想要誠實表達出來,分享我們在創造新事物時經歷了很多情感的事實。

6個精彩的編輯排版設計案例

Bonner說,讓自己沉浸在文本中,是實現好的設計排版設計的關鍵

在任何一個設計排版設計項目中,Bonner認為“閱讀文本,感受它,在你甚至想要把它全部展示出來之前,要深入瞭解它”,這是非常至關重要的。

他還補充說,尤其是在這本書中,排版需要易於理解,而且易於閱讀。因此,我們努力尋找一個排版系統,讓項目和故事的“展示和講述”共存。

6個精彩的編輯排版設計案例

6個精彩的編輯排版設計案例

每一頁設計,都要達到最大的視覺效果

“把一個想法只推廣到固定一個模板的日子,已經一去不復返了。現在,讀者可以點擊、翻頁、移動到下一頁,所以我們的目標是用講故事的語言、圖形和圖像,來引導讀者的眼睛。”

6個精彩的編輯排版設計案例

善用圖像和強烈的色彩,讓事情變得有趣

最後一點是增加速度。“每一頁和屏幕視圖都應該關注到眼睛的不同體驗,有時是強有力的、充滿活力的,有時是微妙而舒緩的。通過選擇插圖和圖像來幫助實現這一點。”

06. 新聞網站攝影區

6個精彩的編輯排版設計案例

這裡有大量的信息需要挖掘,但是這個網站的設計的佈局,無論你使用哪個設備,都是靈活的、響應性的,它使用了大量的空白和優雅的比例,從而避免了佈局上的混亂感覺。

“不像印刷,在網頁上,一篇文章通常被設計成一個整體,它的所有的正文都在一個頁面上,而且設計者往往不能控制它的呈現方式,”“它可以是在手機上呈現,可以打印出來,也可以是其他東西。”因此,重要的是要使文章具有靈活性,並能適應不斷變化的環境。

“保持佈局簡單,並接受響應性設計技術,試著用不同的格式來表達主要觀點,不要擔心它們之間的細微差別。這與雜誌的兩頁式傳播形成了鮮明的對比,在這兩頁的內容中,設計師能決定內容將以什麼形式和何時出現。”

6個精彩的編輯排版設計案例

大量使用空白和優雅的比例,使得網站可以在所有設備上輕鬆閱讀

“除此之外,保持頁面乾淨,使用大量空白和清晰可讀的排版風格,在網頁上使用這些規則比紙質印刷上使用這些規則,要更加重要。因為在屏幕上閱讀會很難,所以最好不要讓雜亂的頁面分散讀者的注意力。”

在網上看到的最大錯誤往往根源在於糟糕的排版。“太寬的線寬可能是最大的問題,”“我也看到很多網站試圖使用打印字體進行文本的排版。”

6個精彩的編輯排版設計案例

所有的文章都很容易在智能手機屏幕上導航和閱讀

“就設計而言,你必須馬上抓住讀者的注意力,讓他們對文章感興趣。標題和版式是這方面的關鍵。當讀者瀏覽網頁時,應該能夠立即知道文章的大概內容。寫一個偉大的標題,並使設計做到真正引人注目。從概念和視覺的角度上,為標題添加一張相關的、很棒的照片或插圖,把設計真正做得深入人心。”

“一旦你引起了觀眾的注意,經過優秀設計的文字內容將會保留住觀眾的注意力。選擇一個好的網頁字體,並設置足夠大的廣告主體文本,以便閱讀。把文章分成幾個部分,為每個部分寫標題,有的放矢地放置圖像,用引號和其他設計元素,以鼓勵讀者滾動頁面。”

【原文地址:http://www.haiko.com.cn/html/zhuanzhu/zazhi/857.html】


分享到:


相關文章: