presentation on 林協霆醫師

pdf-presenter：在瀏覽器中提供完整簡報模式的輕量 PDF CLI 工具

Sat, 18 Apr 2026 00:00:00 +0000

# Introduction（引言）

學術演講與醫學會議仍以 PDF 投影片為主要交付格式，但 PDF 缺乏專業簡報模式：演講者無法同時看到備註、下一張投影片與計時器。商業簡報工具（如 PowerPoint、Keynote）雖支援此功能，但要求原檔同步而難以分享給他人；網路工具則常需上傳檔案至雲端。本專案以「在本地瀏覽器中還原專業簡報模式」為目標，提供開源輕量替代方案。

# Methods（方法）

工具以 JavaScript 撰寫並打包為 CLI：使用者於命令列指定 PDF 路徑，工具即啟動本地伺服器並在瀏覽器中載入投影片。介面提供四個核心功能模組：講者備註區（從 PDF metadata 讀取或外部檔案掛入）、下一張投影片預覽、可暫停／續啟的計時器、以及錄音整合並產出時序對齊資料。所有元件以可調整大小的窗格呈現，使用者可依場域偏好排版。

設計重點在於「不離本機」：所有檔案處理皆在本地完成，避免醫療簡報意外上傳雲端。錄音整合為一大特色：演講後可獲得錄音與每張投影片切換時間點的對齊資料，便於後製與重複利用。

# Results（結果）

工具可被快速部署於任何具備 Node.js 環境的電腦，無需安裝額外簡報軟體即可獲得專業簡報體驗。對於學術演講者，錄音與時序對齊功能特別有價值：演講結束後可直接產出可被切片重用的素材，作為日後線上課程或文章發表的基礎。

# Discussion（討論）

本專案展示了「以最小工程改善高頻場景」的思維：簡報是學術人最頻繁的活動之一，任何改善皆能放大時間收益。限制方面，瀏覽器投影片的視覺一致性仍受 PDF 渲染品質影響；備註的擷取需要使用者預先以工具支援的方式準備。未來可加入即時 Q&A 投影、串接 LLM 自動產生簡報摘要，並支援 Markdown 為原始格式。

# 連結

GitHub：htlin222/pdf-presenter
主要語言：JavaScript
最後更新：2026-04-18

image-step-by-step：可編輯場景與 metadata 匯出的本地圖片步驟標示工具

Wed, 08 Apr 2026 00:00:00 +0000

# Introduction（引言）

醫學教學常需要在同一張圖（如 X 光、心電圖、組織切片）上呈現多個重點區域，並依步驟揭露給學員。傳統 PowerPoint 的動畫雖可達成此目的，但維護成本高且不利版本控制。線上工具又常涉及上傳敏感影像。本專案提供一個本地網頁 GUI 工具，將「逐步揭露重點」的場景以結構化方式儲存，便於重複使用與分享。

# Methods（方法）

實作以 JavaScript 為主，以本地伺服器運行，使用者可載入圖片並以介面標註多個「場景（scene）」，每個場景對應一個重點區域與對應說明。所有場景以 JSON 格式儲存於本機，可被版本控制管理。匯出時可選擇靜態圖序、互動式 HTML 或包含 metadata 的封包，便於整合至既有簡報或教學平台。

設計重點為「資料即內容」：場景定義與圖片內容分離，學員看到的逐步揭露其實是同一張圖加上不同遮罩的呈現。如此使內容易於更新（例如修改說明文字不需重做整張圖），亦便於不同教師共用素材。

# Results（結果）

工具可被臨床教師在門診教學、晨會討論或考前複習中使用。對於影像判讀類主題（如胸部 X 光、骨髓塗片），逐步標示的形式比一次性框出全部重點更能訓練學員的觀察順序。本地運行的特性也滿足醫療影像不離院的隱私要求。

# Discussion（討論）

本專案展示了「以最少工程改善高頻教學情境」的價值。其貢獻在於提供一個輕量、可重複使用、可版本控制的圖片步驟標示工具。限制方面，當前僅支援靜態圖片，影片與 3D 影像尚未涵蓋；介面設計仍以工程友善為主，對非技術使用者門檻偏高。未來可加入 LLM 自動產生標註說明，並支援多人協作與評論。

# 連結

GitHub：htlin222/image-step-by-step
主要語言：JavaScript
最後更新：2026-04-08

my-slidev-template：含 Chart.js 元件與 Tailscale Funnel 開發伺服器的 Slidev 簡報模板

Wed, 08 Apr 2026 00:00:00 +0000

# Introduction（引言）

Slidev 為基於 Markdown 的程式設計師友善簡報工具，能在版本控制下協作維護講稿，並支援程式碼高亮、互動 demo 與動畫。然而其預設模板與醫學／研究演講需求並不完全契合：缺乏統計圖元件、缺乏快速分享連結機制。本專案以個人需求為基底打造可重用模板，將反覆出現的版型、元件與部署設定一次到位。

# Methods（方法）

模板以 Vue 為主要實作技術，整合 Chart.js 提供原生統計圖支援：使用者可在 Markdown 中以結構化資料定義圖表，模板自動產生風格一致的視覺呈現。版型方面預設了標題頁、章節頁、引用頁、結論頁等學術簡報常用樣式。為解決現場演示時的網路分享需求，模板內建 Tailscale Funnel 開發伺服器設定，可一鍵將本機簡報暴露於網際網路供觀眾掃碼觀看。

設計重點為「合理預設、可被改寫」：所有元件皆以 Vue 元件方式提供，使用者可依個別演講需求調整。Markdown 編輯體驗保持單純，避免將模板複雜度推給作者。

# Results（結果）

使用此模板可大幅縮短一場學術演講從草稿到可演示的時間，特別是在有大量資料圖需求的情境（如試驗結果簡報、Meta 分析摘要）。Tailscale Funnel 整合則簡化了「演講中即時分享連結」的痛點，讓觀眾能在自己裝置上同步閱讀，提升互動性。

# Discussion（討論）

本專案展示了「將個人演講基礎建設模組化」的工程實踐：與其每次重做樣板，不如把它打磨為可複用資產。限制方面，Slidev 對複雜動畫的支援仍不及 Keynote／PowerPoint，部分高度視覺性需求需妥協；Tailscale Funnel 需使用者預先設定帳戶。未來可加入更多醫學演講常用元件（試驗流程圖、生存曲線、決策樹），並結合 Claude Code 一鍵生成投影片草稿。

# 連結

GitHub：htlin222/my-slidev-template
主要語言：Vue
最後更新：2026-04-08