2014年5月20日

文字為主的「法律」「文本」相關簡報該如何設計?

最近網路上瘋傳一張某北市候選人前往新加坡做的簡報,
其密密麻麻的字被不少網友視為「簡報錯誤的經典教材」。
但事實上問題並不是出在字多字少,
不同的行業與不同的簡報性質的確有不同設計上的需求,
最重要的還是要思考傳遞出最多的「有效資訊」!

讓我們再一起回顧先前的文章,
看看「文字為主的法律、文本相關簡報該如何設計」吧!

簡報的本質之一是演講者的視覺輔助,
因此在設計上一個很重要的關鍵便是「視覺化」。
盡可能應用圖像化的方式表達觀念。
雖然有些簡報專家認為天底下所有東西都可以被圖像化,
然而實務上總是會遇到一些尷尬的情況不得不將很多文字放進投影片—
這種情況最容易會出現在「法律文件」的說明以及「文本賞析」之中。
因為法律文件與文本解析的重要眉角往往存在於字裡行間,
所以就算做得到視覺化,也難以符合該行業日常的需要。

此時或許有些人會Argue說:
「文字滿滿的投影片所扮演的角色已經不是視覺輔助,
而更像是大字報,或是大家一起瀏覽的『文件(投影件)』了!!!」
不論這個看法是否正確、這究竟是投影片還是文件,
這仍然是我們很常面對的問題。
那麼遇到這樣的問題時,我們該怎麼辦呢?

首先必須要面對的事實是,
只有文字可以呈現的簡報確實已經大大的殺傷了簡報在視覺衝擊上的優勢,
也就是BILL在先前資訊雜訊的概念中「資訊」的下降。
(也就是說,文字相對圖片更難成為對於觀眾而言的重要訊息)
正是因為提升資訊已經非常困難,
因此我們更要透過降低雜訊來提升簡報的有效資訊量。
實際上該怎麼做呢?
以下我們用一位版友建議的「自由經濟示範區特別條例草案」說明(非宣導)簡報為例,
來看看怎麼樣處理這樣的難題有哪些方法。
*該份簡報的來源網頁與下載位置可以點選這裡,網頁大致下圖所示:
法案說明的簡報最大的問題是,
簡報者往往為了顯示其正式性而加了許多顯示其階層性的大標、副標、條項款目等標示。
當內容一長、標示一多時,他們反而會壓縮到內文的空間而且造成觀眾的厭煩感
反過來如果捨棄這些階層架構引導的話,
又會讓整份簡報變得破碎、講著講著就不知道講到哪裡去了。
這樣的情況其實正是反映了文字為主的簡報設計上的困難:
我們為了增加資訊而做的設計(如設計引導用的階層架構、標示等等),
往往也會增加不少雜訊(如主要內容空間受到壓縮、觀眾覺得內容冗長複雜等等)
以上圖為例,上圖是該份原始投影片的第23頁,
當你瀏覽過此份投影片時,
你可以掌握到這張投影片講得是整份演講的第4-4部分的第某項內容。
但是這究竟是簡報的尾聲、中間還是開始,
前後的架構為何、這張投影片講的內容與其他的投影片講的內容有何關係,
卻無法一目了然。

如果我們把它進行以下的修改:
經過修改後,更利於觀眾的閱讀—
閱讀本張投影片的時候,
你很輕易地便能從上側的導引列了解到這是一份有11個部分的投影片,
其中第4到第10部分是分則的介紹,而本部分屬於分則的第4部分;
而從側邊的灰色欄得知這個部分包含7個項目、本投影片所呈現的便是第2項內容。

將原始投影片與修改後投影片並陳,
就可以看見前後的轉變如下圖:
不難發現,雖然右邊(修改後)的設計變得更簡潔了,但並不簡單,
反而包含了更多有效的資訊,
包括內容的引導、配色的提示,以及增加國發會辨識度的專屬藍色色調等。
這其實就是視覺設計最重要的精神:
視覺設計不是讓東西變得更漂亮、更花俏,
而是用最少的東西(降低雜訊)表達最多、最清楚的資訊(增加資訊)
讓畫面上每一樣設計的細節都是有意義的,
用比較俚俗的話來說,就是讓每個設計決策「拳拳到肉」XD

那麼一個拳拳到肉的視覺設計該如何執行呢?
接下來BILL會比較深入說明修改後的簡約設計的方法及原因,
不過再次提醒各位:
重要的不是把下面這些技法背起來,
而是要了解這些技法背後應用資訊與雜訊的觀念進行設計決策的過程。
從問題的根本下手,方能釜底抽薪解決問題。





1.應用色彩對比建構簡報架構提示

就如前面提到的,在修改後的版本我們可以清楚地辨認出這個簡報的架構,
而這正是要歸功于應用色彩對比建構簡報架構提示。
從上圖我們可以看見,架構提示把目錄用一種低調的方式變成了上方的導引列,
讓它時時刻刻的輔助著觀眾了解現在的進度(就是增加資訊);
同時觀察上方的引導列我們可以發現所有的設計細節都是為了協助觀眾理解目前進度—
包括深藍淺藍顏色的變化、文字透明度的變化等等。
相較原先的投影片,修改後的投影片沒有任何諸如陰影、框線、漸層等裝飾性、無法協助達成辨識目的的細節(因此減少了雜訊)
因此兩者的效果合併起來變增加了有效資訊量,
而看在觀眾的眼中則是更簡潔、清楚的簡報。





2.善用適當的文字間距(行距與段距)
BILL先前的文章「這段文字該擺在哪裡?談簡報的文字排版(上)
曾經討論過文字間距對於有效資訊量的影響。
簡單來說,
太大的行距會使文字受到過大的空白空間干擾、
太小的行距會使文字受到不同行之間的句子彼此干擾;
(經驗上一倍行高到兩倍行高之間的大小是適合觀眾閱讀的)
而透過這個原則我們將修改後的投影片與原始投影片相較,
就不難發現修改後投影片的行距較不擁擠、適合閱讀,
因而降低雜訊、有利於提升有效資訊量。






如果法律文件會應用到基本圖案當做示意圖的話,
那麼在前一篇「如何設計科學簡報的概念示意圖?」提到的概念示意圖設計方法,
也一樣適用於此。
下圖是該份簡報的第7頁的內容,
介紹的是自經區(草案)條例的總則章的架構:
我們可以看出,設計者為了簡化冗長的文字敘述,
非常盡力、用心的設計了其彼此之間的相對關係圖。
然而就如前面所說的,
為了增加資訊而做的設計往往也會增加不少雜訊,
雖然彼此的關係變得明確,
但是大大小小的框框卻把畫面搞得凌亂不堪。

下面是BILL應用視覺設計的方法,
將雜訊加以去除、增加有效資訊量的的修改後設計:
把兩者相比較,立刻以看出其中的不同:
看到右圖簡潔的投影片,
許多人心裡會覺得這一定要花許多時間才能設計出來。
但事實上只要應用資訊與雜訊的概念必能事半功倍。
下面的3, 4, 5三個方法其實一樣是降低雜訊、增加有效資訊量的過程:





3.適當的對齊降低雜訊
對齊是一個一而再、再而三被提及的概念,
在科學簡報的概念示意圖或是以文字為主的簡報皆然。
不過重點是要了解「對齊」與「增加有效資訊量」之間的關聯:
當物件不對齊時,就會顯得突出、被觀眾注意到;
但是當每個物件通通沒有對齊時,
因為觀眾注意力有限,所以即使通通變得突出,
觀眾也會選擇忽略,
讓物件的位置變成沒有價值的訊息(雜訊)。
因此善用對齊可以讓觀眾不必費神注意到沒有意義的雜訊,
而能把注意力放在其他的項目(如顏色變化的提示)
或是其中沒有對齊、刻意突出的項目。





4. 用遮罩代替邊框的使用
使用邊框因為由外到內有3次顏色改變,
因此對於觀眾而言是三個訊息;
同時邊框的線條粗細接近或僅略大於文字本身的線條,
眼睛在辨識時需要花額外的精力將兩者加以區分,
因此越多的框框容易造成越多雜訊。
(如果難以理解的話可以想想斑馬身上的條紋是如何造成掠食者的混淆,兩者的原因相似)
因此當我們改用遮罩之後,
由外到內僅有2次顏色改變,
同時遮罩也賦予文字「文字圖片化」的效果,
因此雜訊變得較少、有效資訊量得以提升。





5. 保留架構引導的同時聚焦于特定項目
(可參考「一次專注一個重點,聚焦你的簡報內容」)
複雜的圖表即使已經極致的簡化,
當你在專注說明其中某一項時,其旁邊的事物仍然是某種程度上的雜訊。
但是若加以移除又是失去圖表說明架構的功用。
因此此時便可以應用下圖的方式,
在保留架構引導的同時聚焦于特定項目,
其餘的項目則相對淡化減少干擾:
而這對引導觀眾的聚焦特別有用,
比方說如果我們要依序介紹圖中央的三個項目的話,
便可以設計三張投影片依照下圖的方式進行播放:
如此,每一位觀眾皆可在任一時間了解整份圖表的架構,
與此同時又可以專注在演講者正在說明的頁面上。
這個原理與「1.應用色彩對比建構簡報架構提示」頗為類似。





以上5種方法是有效資訊量的概念在簡報視覺設計的一些經典應用方式。
如果各位是長期follow簡報藝術烘焙坊的讀者,
一定會覺得許多方法看似不同卻又似曾相識。
事實上這正是因為不論是何種設計方法,
原理皆萬變不離其中—降低雜訊、提升資訊以提升有效資訊量的概念。
(大家可以參考「是『資訊』還是『雜訊』?剖析投影片設計的有效性」)
大家之後在應用BILL今天介紹的方法時,
別忘了在應用技巧之餘,思索其背後的意義喔~

最後再補一句,
好的簡報視覺設計必須搭配好的簡報內容,
才會是一份有效、精彩、可以說服人的簡報。
如果本身就乏善可陳、缺乏邏輯並與民意相左,
那麼再好的視覺設計也只是枉然XD