如何設計簡報中的資訊圖表(Infographics)：個案討論

這時往往適合的視覺/用餐動線扮演著非常重要的角色，

上圖是該份簡報的部分頁面。
簡報主要介紹的是呈汝生技公司的主力產品—
由林才民醫學博士（該公司創辦人）發明並獲多國專利的MAFT Gun（精微自體脂肪移植槍）。
簡報的內容是想要呈現MAFT Gun的獨特性能，以及「精微」自體脂肪移植的重要性。
經過風格的統一之後變成如下所示：

雖然如何進行簡報風格及視覺元素的統一是個非常值得探討的議題，
但是本篇主要是要聚焦在「如何設計簡報中的資訊圖表」的議題上。
（對風格統一有興趣的讀者可參考：跟模板說拜拜，改用統一的元素建構投影片！ ）

我們以下面這張投影片為例：

上面這張投影片要介紹的背景如下：
根據講者的經驗，自體脂肪移植的手術在進行時，
（也就是把自己身上其他地方的脂肪移到想要填充脂肪之處，如豐胸或臉部整形等）
過往的手術方式往往注入過量的脂肪。
研究顯示注入的脂肪組織只有表面往內1~2mm的厚度的部分有較高（約40%）的存活率，
因此過量注射的脂肪因為體積過大，超過1~2mm厚度的中心部分會產生組織壞死
（該份簡報中，該現象稱為「中心壞死」Central Necrosis）。

因此這張投影片想要表達的是，
如果我們把移植的脂肪體積降低到夠小、半徑小於等於1~2mm之間，
那就可以讓整顆脂肪球都有較高存活率、避免中心壞死。

上圖中原始設計的文字部分的確有表達到要傳遞的意思，
但是若圖片未搭配很詳細的解說，
恐怕難以完整表達上述複雜的概念。

有些坊間的簡報者相當迷信滿版出血圖片的威力，
認為大字配上美美的圖借可以做好投影片。
如果硬套這樣的思維，去找一張可以表達「小」的意思的圖片，
再把字洋洋灑灑的寫上去，那大概就會變成這樣：

這樣迷信滿版出血圖片搭配、大圖大字的設計策略的結果，
就是讓這個世界多了一張漂亮的圖片的同時，也多了一張意義不明的投影片。
事實上投影片設計所追求的並不是美麗或好看，
而是傳遞最多的有效資訊。
而濫用滿版出血的圖片其實就是逃避了這樣的問題。

那實際上該如何設計這個簡報中的資訊圖表呢？
回顧資訊的概念乃是符合目的+邏輯相連結
因此「釐清這張資訊圖表設計的目的（重點）乃是一開始的關鍵！」
我們可以把前面的敘述加以整理，
成為要即將設計的簡報資訊圖表中，需要加以凸顯的數項重點：

1. 脂肪球與中心壞死（Central Necrosis）的示意圖
2. 不同大小脂肪球與中心壞死範圍的半徑差異
3. 脂肪球半徑縮小會使得中心壞死跟著縮小
4. 表面往內1~2mm的厚度的部分有較高（約40%）的存活率
5. 當脂肪球半徑縮小到1~2mm，推論中心壞死的現象就會消失（重點）、整顆脂肪球都會有較高的存活率

這些目的（重點）就是我們要呈現的資訊，
有了他們作為引導之後，
我們接下來就是逐步應用簡單的幾何圖形與視覺設計技巧，
用簡約的方法實現這些目的。

首先我們先拉出兩個圓如下圖所示，
凸顯重點1中脂肪球部分的示意圖，
及重點2不同大小脂肪球部分的半徑差異。
（中黑體的中文字以及橘色箭頭屬於說明用途，不包括在設計之中）
其中選擇粉紅色的原因乃是因為順應整份投影片的設計風格（參考第3張的全覽圖）
而選擇實心單色的圓形、避免邊線、陰影、倒影及立體效果，
則是為了減少雜訊（這些效果無法增進觀眾的了解，因此可以視為雜訊）

接著我們完成重點3的脂肪球部分，凸顯半徑縮小的效果。
這非常容易做到，只要讓圓球由左至右逐步變小即可，如下圖所示。
另外投影片同時應用了顏色半透明以及濃淡效果，
讓觀眾產生由左到右半徑縮小的感覺，
同時亦可平衡左右兩邊的視覺重量（訊息強度）。
這中間值得注意的是，
我們是為了重點3「由左到右變化逐步縮小的感覺」才使用這個效果的，
效果本身唯有符合目的才具有意義，
若有個效果很漂亮卻不符合我們目的的任何一部分的話，
那不論它再漂亮，都只是干擾理解的雜訊而已。

前面我們已經完成了重點1,2,3之中脂肪球的部分，
接著我們把重點1,2,3的中心壞死的部分都加以完成，
並加以標注，如下圖：

到了此時，我們的示意圖已經足以完整描述重點（目的）1,2,3。
接下來先跳過重點4，聚焦在重點5「當脂肪球半徑縮小到1~2mm，推論中心壞死的現象就會消失（重點）、整顆脂肪球都會有較高的存活率」之上。
我們在這一個步驟中加入了兩條虛線，
凸顯「當脂肪球半徑縮小，推論中心壞死的現象就會消失」的特質：

加上兩條相交的虛線後，
重點5的部分便已完成一半，
還剩「…縮小到1~2mm…」的數據部分，以及「整顆脂肪球都會有較高的存活率」的特質。
這部分可以與重點4「表面往內1~2mm的厚度的部分有較高（約40%）的存活率」一起呈現。
於是我們設計了一個長方形遮罩，
利用每個人對於長方形必定等高的直覺，外加文字說明與輔助的虛線，
放在大小連續變化的脂肪球與中心壞死之間的範圍，如下圖：

第1~5的步驟都是增加資訊的過程，
我們透過幾個簡單的幾何圖形便表達了前面所整理5大重點（目的）。
最後一步就是一個去除雜訊的過程：
我們在不更動主要設計的情況下，將圖片的角度稍加調整，
便可以創造兩個水平的對齊線、降低雜訊。
同時將一邊變成水平，另外一邊下降的角度便相應的變大，
會讓由大而小的變化趨勢變得更明顯。
（下面則是選擇性加了一點陰影，讓觀眾有東西放在桌面的錯覺，合理化水平的設計。）
完成調整以後便如下圖所示，
此時一個簡報中微型的資訊圖表便大功告成啦！

是不是比一開始的設計清楚明瞭多了呢？

最後還記得提到前面我們曾經提過
簡報中的資訊圖表像是一般的西餐會依序的上菜，
可以透過動畫先後順序的建構掌握度視線流動嗎？
現在我們就將這張投影片配上動畫以後加以呈現，