昨天 Visual Learning Lab 終於從 localhost 搬到 Streamlit Community Cloud，第一次有了一個真的可以打開的版本。

到了 Day 11，我原本一度想做「圖片上傳」。

想法其實很直覺：現在可以丟文字、可以丟 PDF，那再加 JPG、PNG 好像也很合理。但想了一下之後，我把這個方向取消了。

因為目前 PDF 本身就已經是 multimodal input。像公式、波形、Diagram、Graph，前面幾天其實都已經可以直接從 PDF 裡面理解。如果使用者本來就有一份教材 PDF，還要特地把其中一頁截圖再上傳，對目前這個產品來說沒有增加太多價值。

所以我回頭看了一下現在的介面，反而發現一個更明顯的問題。

Visual Learning Lab 已經會畫圖了，但那些圖其實還是「死的」。

最重要的東西反而不能問

Day 7 開始，Visual Learning Lab 已經可以根據教材自己決定要畫 Concept Map 還是 Visual Flow；Day 8 又加入 Comparison。

例如 Sinusoids 這份教材，系統會產生一張 Concept Map，把正弦波、振幅、週期、角頻率、相位、三角恆等式等概念串在一起。

1：Sinusoids 的 Concept Map

問題是，如果我現在看到圖裡面的「相位與相位差」看不懂，我其實不能直接對它做任何事。

前面 Day 9 做的 Explain This 只能出現在 Key Concepts 和 Visual Evidence，所以明明 Concept Map 才是畫面上最明顯、最像學習入口的地方，我卻還要往上找同一個概念，再從文字區塊按 Explain This。

這個操作其實有點奇怪。

所以 Day 11 的目標變得很簡單：

生成視覺化
↓
選擇我看不懂的節點
↓
Explain this
↓
直接在原本脈絡裡往下理解

我沒有直接去做「可以點 Graphviz 節點」。

那件事情當然比較帥，但現在使用的 Graphviz 本身並不是為這種前端互動設計的。如果硬做，可能會為了讓節點能點，引進額外 JavaScript 或重做 renderer，反而讓 Day 11 的範圍整個爆掉。

所以這次先做一個比較務實的版本：在視覺化下面新增 Explore this visualization。

Concept Map：直接選一個概念往下問

Concept Map 下面現在會出現一個 selector，裡面直接列出這張圖目前有哪些節點。

例如這次 Sinusoids 有：

正弦波、振幅 V_m、週期 T / 角頻率 ω、相位與相位差、三角恆等式……

我選了「相位與相位差」，再按 Explain this
2：Explore this visualization 選擇「相位與相位差

這裡比較重要的不是它「又呼叫了一次 AI」，而是這次我不需要自己重新告訴 AI：

我現在在看 Sinusoids，剛剛有一張 Concept Map，其中有一個節點叫相位與相位差，可以解釋嗎？

這些背景系統已經知道了。

它會自動把目前選到的 node label、來源頁面、與這個節點相連的 Concept Map edges、Quick Summary、附近的 Key Concepts、Relationships，以及相關 PDF 文字一起整理成 context。

所以最後的回答會直接從目前教材的脈絡解釋相位，而不是把「phase」當成一個完全獨立的問題重新回答。

這次實際測試時，它直接帶回正弦波公式 v(t)=V_m cos(ωt+θ)，並從裡面的 θ 說明相位角、不同波形之間的相位差，以及它們在一個週期中的位置差異。

這就開始比較接近我原本想做的「原地深入理解」。

Flow 不只是解釋節點，還要知道前後步驟

Concept Map 比較簡單，因為它的重點是概念彼此怎麼連。

Visual Flow 的要求反而更高一點。

如果我今天只把 Flow 裡某一個 node label 丟給 AI，例如：

Transform into an algebraic subsidiary equation

那它當然也能解釋，但這樣其實沒有利用到「Flow」最大的價值。

既然這是一個流程，它就應該知道我現在站在哪一步、前面發生了什麼、接下來又要做什麼。

所以 Day 11 對 Visual Flow 的 context 另外加入了 incoming / outgoing steps。

我重新拿之前的 Laplace Transform 教材測試，系統產生的主要流程仍然是：

Given ODE / initial value problem
↓
Transform into an algebraic subsidiary equation
↓
Solve the algebraic equation
↓
Transform the solution back to the original problem

Laplace Transform 的 Visual Flow

接著我特地不選第一步，而是選中間的 Transform into an algebraic subsidiary equation。

Visual Flow 的 Explore this visualization

這次 Explain This 的回答會先說明：前面已經對原本的 ODE 套用 Laplace transform，現在這一步是在把包含微分與時間函數的問題改寫成 Y(s) 的代數方程。

最後它甚至直接接到：

The next step is to solve this equation for Y(s).

這一點我覺得滿重要。

因為它證明現在 Explain This 不是只看到「這個節點叫什麼」，而是真的吃到了這張 Flow 的前後結構。

我沒有再做第二套 Explain This

這次還有一個我很刻意維持的東西：沒有因為視覺化可以互動，就重新做一套 explanation system。

Day 9 已經有 Explain This，也已經有固定的 Structured Output：

• In simple terms
• Why it matters
• Intuition or example
• Source context

所以 Day 11 做的是把新的 target 接進原本架構。目前多了 concept_map_node、visual_flow_node 和 comparison_item 三種 target type，但最後都還是走同一套 explanation pipeline。

這樣做的好處是，之後不管 Explain This 的 prompt、語言控制、來源說明或 UI 要修改，都不用維護兩套不同邏輯。

Concept Map 和 Flow 的 node 本來也都有 structured ID，所以 UI 顯示的是「相位與相位差」這種正常文字，內部則繼續使用 node ID 當身份。

最怕的事情：按 Explain This 又把整份 PDF 重跑一次

Day 9 做 Explain This 時，我就很在意這件事情。

一份 PDF 的完整分析包含原始 PDF、抽取文字、Structured Outputs、Visual Evidence、Flow、Concept Map、Comparison 和 router。如果每次只是想問一個節點，就把整份 PDF 再分析一次，不只慢，而且 API request 也完全浪費。

Day 11 一樣延續這個設計。

主分析結果繼續放在 st.session_state，使用者在 Explore this visualization 裡面切換節點，不會重新呼叫主要分析 API。

Explanation 本身也有 cache，現在 cache identity 大致由三個東西組成：

material hash
+ visualization target type
+ structured target ID

所以同一份教材、同一種視覺化、同一個節點，如果已經解釋過，再回來選它就可以直接使用原本的結果。

如果重新分析一份新教材，material hash 也會改變，舊的 explanation 就不會錯誤地跑到新的教材裡。

Comparison 也保留同一個互動方向

Day 8 做的 Comparison 也一起接進了 Day 11 的架構。

Concept Map 和 Flow 選的是 node，Comparison 選的則是 item。

例如比較三相感應馬達與同步馬達時，如果使用者選「Three-phase induction motor」，系統不只會把這個名稱交給 Explain This，而是把這個 item 在目前比較表中的各項 criteria/value 一起送進 context。

也就是說，轉子轉速、slip、轉子磁場來源、控制方式、典型應用等資訊，都可以直接利用已經產生好的 structured comparison，不需要讓模型重新猜一次這張表原本比較了什麼。

目前這也是我開始很喜歡 Structured Outputs 的地方。

它不只是讓輸出比較整齊而已。

前幾天產生的 node、edge、item、criterion，到了今天居然可以直接變成新的互動功能。

Day 11：開始把「生成結果」變成介面

前幾天我的注意力比較常放在「AI 能不能生成正確的東西」。

能不能讀 PDF、能不能看到公式、能不能判斷 Concept Map 和 Flow、能不能做 Comparison。

但 Day 11 開始，我比較在意另一件事情：

生成完之後，使用者到底能拿它做什麼？

如果 Concept Map 最後只是一張圖，那它其實就是一次性的 output。

如果 Visual Flow 最後只是一條流程，那它也只是把文字換成另一種形式顯示。

但當每個節點都開始可以往下探索，這些視覺化才開始從「結果」變成「介面」。

現在還不是真正可以直接點圖上的 node。v1 只是先在圖下面用 selector 選擇節點，再按 Explain This。

但底層需要的東西其實已經接好了：穩定的 node identity、來源頁碼、附近 context、session state、explanation cache。

未來如果真的把 Graphviz 換成可以互動的 renderer，理論上前面的 explanation architecture 可以繼續沿用，而不是全部重寫。

這也是今天做完後，我覺得 Visual Learning Lab 又往「學習工具」多走了一點的地方。

不是一直增加 AI 可以產生多少東西，而是開始讓已經產生的東西可以被使用。

GitHub Repo：
https://github.com/f24131128-lgtm/visual-learning-lab