聽眾同時只有兩條輸入管道:視覺與聽覺,而語言處理是共用的。這一條事實推導出簡報設計中最多違反的規則——當螢幕上的文字與你正在說的話內容相同時,兩者都變慢。Mayer 稱之為冗餘原則(redundancy principle):從圖 + 口說學習的效果,優於圖 + 口說 + 相同內容的螢幕文字。「投影片朗讀」之所以令人難以忍受,不只是禮貌問題,是它在機制上主動干擾理解。
五條可直接施工的原則
Mayer 的多媒體學習原則中,與簡報最直接相關的五條:
| 原則 | 內容 | 簡報中的施工 |
|---|---|---|
| Coherence(連貫) | 排除無關材料時學習更深 | 刪掉裝飾圖、公司 logo 水印、無資訊的動畫、與論點無關的「有趣」補充 |
| Signaling(標示) | 加入標示組織結構的線索能提升學習 | 完整句標題、地圖頁、高亮唯一重點、章節編號 |
| Redundancy(冗餘) | 圖 + 口說優於圖 + 口說 + 同樣的螢幕文字 | 論述放講者備忘,畫面只留關鍵詞與視覺 |
| Spatial contiguity(空間鄰近) | 對應的字與圖要放在一起 | 標籤直接放在圖上,不要另做圖例;圖與說明不分兩頁 |
| Segmenting(分段) | 拆成使用者可控的小段優於連續播放 | 逐步揭露、章節化、每段之後停頓 |
Coherence 是其中證據最強的一條——Mayer 的整理中 23 次實驗全部支持,中位數效果量 0.86。這給了一個實用的排序:當你只能做一件事來改善投影片,是刪東西,不是加東西。
訊噪比:把「刪」變成可判定的動作
Garr Reynolds 在 Presentation Zen 把版面品質定義成訊噪比——訊號(你要傳達的訊息)相對於噪音(無關或干擾元素)的比例,並主張「透過簡化來放大」(amplification through simplification)。他也提醒一個常被誤讀的地方:不是所有非必要元素都是噪音,一張能承載情緒的影像可以是訊號,即使它不傳遞事實。
把它變成可執行的檢查,對每一個畫面元素問三個問題:
- 拿掉它,聽眾會不會誤解?→ 不會,就是候選噪音。
- 它是不是在重複我正在說的話?→ 是,移到講者備忘。
- 它是不是在跟我要他們看的東西競爭注意力?→ 是,壓暗或移除。
三題都通過還留著的,才是訊號。實務上第一輪刪除通常能移除三成的畫面元素,而且沒有任何人在事後發現少了什麼。
每頁一個重點:檢驗方法
「一頁一個重點」是老生常談,難在判定。可用的判定法:把整頁遮住,只留標題,問「標題自己能不能成立為一個完整主張」;再把標題遮住,只看圖,問「這張圖能不能只支持這一個主張」。如果圖同時支持兩個主張,那就是兩頁。
在 open-slide 裡,/slide-authoring 這套內建規則已經把它寫進約束:canvas 不捲動,agent 必須在寫 JSX 之前把整頁的垂直空間預算對到 1080 px,寧可拆成兩頁,也不縮小字級來塞下。這條規則的價值不在排版,在於它把「一頁一重點」從自律變成物理限制。
三個垃圾桶:刪不下去的內容去哪裡
刪不下去,通常是因為沒有安置的地方。準備三個容器,刪除就變成搬移:
| 容器 | 放什麼 | open-slide 的位置 |
|---|---|---|
| 講者備忘 | 完整論述、數據來源、口說用的完整句子、時間錨點 | export const notes = [...],索引與頁面陣列對齊 |
| 附錄頁 | 完整參數表、原始圖表、法規原文、備援答案 | 頁面陣列尾端;正文明講「在附錄第 N 頁」 |
| 講義/文件 | 需要事後逐字閱讀的所有東西 | 另寫 Markdown 或文件,與 deck 分開交付 |
第三個容器最重要也最常被跳過。投影片不是文件——把投影片寄給沒來的人,他看到的是一堆脫離語境的關鍵詞。要嘛另寫文件,要嘛在 notes 裡寫成完整句子後另外匯出。
Signposting:讓聽眾隨時知道自己在哪
Signaling 原則在演講中的具體化就是 signposting,四個層次:
- 整場層:開場的地圖頁 + 每章重複出現的同一張地圖(高亮當前章)。
- 章節層:反轉配色的章節頁,加編號(「2 / 4」)。
- 頁面層:完整句標題。標題即結論,不是標籤。
- 句子層:口說的轉場詞。「這是第一個原因⋯⋯」「這裡有個例外⋯⋯」「重點來了,接下來這一件事會推翻剛才說的一半」。
第四層完全不花版面成本,卻是最常被忽略的。講者腦中有結構,但沒有把結構說出口,聽眾就只能聽到一串平坦的句子。
資料密集頁的處理:先看整體、再看局部
一張複雜圖表無法違反上述原則,但可以分段。標準做法是同一張圖分三拍:
- 完整圖,但全部壓灰,講「這是什麼、軸是什麼」。
- 高亮一個區域,講「這裡發生了什麼」。
- 只留下結論句與那個區域,其餘淡出。
這同時滿足 segmenting(分段)與 signaling(標示)。在 open-slide 裡,這三拍是同一個 Page 裡的三個 Step,或三個共用同一個 chart 元件的頁面配合 MorphElement 讓圖在頁間連續——後者在視覺上更順,但成本較高,一份 deck 用一兩次就夠。
動畫:只有三種正當用途
多數簡報動畫是噪音。正當的用途只有三種,且都對應到認知功能:
- 逐步揭露——控制節奏,防止聽眾預讀(segmenting)。
- 標示變化——同一張圖上「從這個狀態變成那個狀態」,用移動來表達因果(比並排兩張圖更有效)。
- 維持物件同一性——同一個元素跨頁時保持連續,避免聽眾重新尋找(open-slide 的
MorphElement正是為此)。
飛入、彈跳、翻頁、3D 旋轉,一律歸為噪音。open-slide 的預設是沒有轉場(頁面直接切換,除非 deck 或頁面自己宣告 transition),這個預設方向正確:動畫應該是刻意加入的,不是預設存在的。它同時自動遵循 prefers-reduced-motion: reduce。
字級不是美學問題,是可讀性下限
1920×1080 的舞台需要比網頁大得多的字。open-slide 的 /slide-authoring 給出的預設型級是可以直接採用的基準:
| 角色 | 尺寸(px,1920×1080 canvas) |
|---|---|
| Hero 標題 | 140–200 |
| 章節標題 | 80–120 |
| 頁面標題 | 56–80 |
| 內文 | 32–44 |
| 說明/標籤 | 22–28 |
內容距離畫布邊緣留 100–160 px,標題行高 1.2、內文 1.5–1.7。內文 32 px 是下限而非目標——換算到實際會議室,32 px 大約是「最後一排要瞇眼」的臨界,見 08 的可讀距離換算。
延伸
來源
- Richard E. Mayer, “Principles for Reducing Extraneous Processing in Multimedia Learning”(The Cambridge Handbook of Multimedia Learning)— Cambridge Core
- Mayer 12 原則整理:Digital Learning Institute
- Garr Reynolds, Presentation Zen;訊噪比章節見 O’Reilly、設計原則見 garrreynolds.com/design-tips
- open-slide 型級與空間規則:/docs/skills/slide-authoring