前言

讀檔整理會交出資料包了。使用者還是從大廳開始：先看見有哪些製程、哪些專案，再走進一張階層表，決定要點哪一顆 block。這兩頁看起來樸素，卻決定了整座平台的導航語言。Home 若變成第二個儀表，沒人會再點進專案；Project 若只是靜態樹、不告訴你哪顆有料，工程師會直接改在網址列猜 block 名。

這堂課把兩種資料包畫清楚。Block 頁本身留給 Day 19。今天的完成定義是：兩次點擊的第一跳與第二跳，走起來像同一張地圖。

  首頁（第一跳）                         專案階層（第二跳）
  N4                                    Home / N4_SM8466
    ┌─────────────┐                     名稱          SignOff  APR葉  ECO葉
    │ SM8466      │ ──點卡──►            chip          —       0     0
    │ 12 blocks   │                     ss_sys_top    綠      1     0
    └─────────────┘                       ss_ep_top   紅      3     1
                                              │
                                              └── 點名字，預設進 APR

一、Home 只做一件事：讓人三秒內找到專案

首頁資料包帶兩樣東西：專案清單，以及依製程分好的組。畫面依組畫大區塊，區塊裡是卡片網格。卡片上只有專案名與 block 數量。整張卡是連結，指到該專案的階層頁。沒有 DRC，沒有趨勢，沒有搜尋框。專案還不夠多到需要搜尋；燈號屬於下一層，不屬於大廳。

分組規則很笨：製程名字母序，同一製程裡的專案也字母序。不要依最後修改時間排。大廳每天開門都在變陣，人會開始用瀏覽器搜尋頁面，那就表示排序失敗了。時間放在階層表的更新欄。製程當大標、字距拉開、顏色用強調色，是為了讓「我做 N4」的人眼睛先落到自己那一組，而不是先數全部卡片。

block 數量來自階層樹上收集到的名字，不是來自上傳次數。一顆從來沒跑過的葉子仍算一顆。這是刻意的：卡片在說「這個專案有多大」，不是「現在有多忙」。忙不忙，要進表才看得到。

沒有任何階層檔時，首頁不是一片空白，而是一段說明：資料目錄沒有階層、請放入守命名規則的檔。這句話是給第一個開站的人看的。空白會被理解成網站壞了；說明會被理解成資料還沒放。兩種情緒差很多，修法也差很多。

副標寫有幾張卡。那是給已經進來的人確認「我是不是看著完整清單」。卡片數對不上你丟的檔數，回頭查 Day 16 的檔名規則與 Day 17 的清單，不要在卡片元件裡找 bug。

二、為什麼 Home 必須克制

入口產品最容易在首頁發胖。PM 想看總通過率，工程師想看自己那顆的 DRC，主管想看紅燈顆數。每一個要求單獨都合理，疊在首頁就變成沒有人知道該點哪裡。Day 14 把 Home 定位成大廳，Day 21 才把跨 block 的最新一覽放進 Summary。順序不能倒。

克制還有技術上的理由。首頁若為了每張卡去組父親樹、算最新 DRC，第一次載入會把所有專案的所有上傳都算一遍。現在它只數樹上的名字，便宜、穩定、與「有沒有 run」解耦。有 run 沒 run，是下一頁用燈號與葉數量說的話。

卡片的手感也屬於導航。可點區域是整張卡，不是只有專案名那幾個字。懸停微微抬起、邊框變色，告訴你這是門，不是展示板。門的另一側永遠是同一種頁——階層表——不要有的卡進 Summary、有的卡進某顆熱門 block。例外一出現，大廳的語言就破了。

三、Project：把樹展平成人能掃的表

專案資料包帶專案 id、可選的頂層名、展平後的列、以及每顆名字對應的狀態。畫面畫一張表：名稱、深度、SignOff 燈號、APR 葉子、ECO 葉子、更新日期。頁首說明「點 block 可進各階段」，並放一顆通往專案總覽的按鈕。那顆按鈕可以先存在，內容即使素，也表示地圖上有這間房。

展平規則對應階層 JSON 的寫法。遇到小孩陣列就往下走並加深一層；沒有小孩的標成 block；有小孩的標成 Uplevel，並標出直接子節點數。頂層名若存在，另加一列標成 top。縮排用空白做出層級，這比真的樹狀控制項笨，但在投影機上比較穩：不需要展開／收合，所有名字一次在。

每一個名字都是連結，預設進 APR。為什麼不是 SignOff？因為多數工程師從「我剛跑完的那次實作」進來；檢查清單在頁籤裡一點就到。預設一穩，第二跳的肌肉記憶才會形成。列本身不要整列亂跳——點的是名字，進的是那顆 block。Uplevel 也可以點：上層若有自己的上傳，房間就有內容；沒有，就會看到空狀態。空，仍比不能點誠實。

深度欄看起來多餘，卻能在樹很深時幫你對齊縮排。眼睛可以數空白，數字可以確認「我沒看錯一層」。現場對過一次「怎麼少了一層」之後，就會感謝這欄還在。

四、列上的數字不是裝飾，是有沒有料

狀態對照表以 block 名為鍵。每一顆樹上出現過的名字，都會去問：最新 SignOff 的燈號、APR 樹的葉節點數、ECO 樹的葉節點數、所有上傳裡最新的日期。這些不是另一次向伺服器查詢，是讀檔整理用已經正規化的上傳現算，再放進資料包。

燈號規則死板：有失敗就是失敗，否則有警告就是警告，否則才是通過。沒有檢查資料就是橫線，不是未知綠燈。橫線的意思是「還沒有 SignOff 上傳」，與 FAIL 完全不同。PM 若把橫線當成通過，是語意沒講清楚，要改文案與圖例，不能改規則去遷就。

葉節點數讓你還沒進房間就知道這顆有沒有料。零與十二的心理意義不同。零，可能是真的沒跑，也可能是 Day 16 的鑰匙對不上——若你明明上傳了，先對名，不要先怪表。記住：葉子是父親樹裡沒有小孩的節點，不是檔案個數。十次中間版本加一次末端，葉子可能仍是一。這張表說的是「現在有幾條最新的線頭」，不是「歷史上跑了幾次」。

更新日期是所有階段裡最新的一次，用來回答「這顆最近有沒有動」。它不區分 APR 或 ECO。要區分，進 Block 再看。把太多維度塞進同一張表，掃的速度會掉下去。這張表的任務是掃，不是審。

五、空表、空樹、空燈號，三種空不一樣

完全沒有階層內容：表身寫空階層。這通常是 JSON 根的形狀與預期不同——例如根上沒有可走的節點。有樹但沒有任何上傳：名字與深度在，燈號橫線，葉子為零，日期為空。這是合法中間態，也是只丟了階層檔的樣子。有上傳但對不上名：看起來與「沒上傳」相同，這才是要對契約的時候。

畫面不該用同一句「沒有資料」涵蓋三種空。專案頁目前用橫線與零來區分「沒有燈號」與「沒有葉子」，已經比一句空話好。若你日後加提示，請指到「上傳的設計名是否等於這一列的名字」，不要指到「請聯絡管理員」。能讓丟檔的人自己修，入口才算入口。

頂層列可以沒有自己的上傳。它存在是為了讓樹有屋頂。不要因為頂層燈號是橫線就把它藏起來。藏屋頂，縮排會失去原點，Uplevel 的數字也會變得難解釋。

六、從這一頁走出去的路，要少而穩

兩條路就夠。點名字，進 Block 的 APR。按總覽按鈕，進專案級 Summary。頂部路徑可以回大廳。不要在每一列加三個小圖示分別進 APR、ECO、SignOff——頁籤是房間裡的事，不是走廊上的事。走廊上選顆 block，房間裡選階段，任務切開，誤點會變少。

深連結必須成立。把階層頁的網址貼給同事，他應看到同一張表，而不是被送回大廳。這依賴 Day 17 的地圖，也依賴專案 id 在網址裡編碼正確。id 裡若有底線以外的特殊字元，進出必須成對。測試很簡單：複製網址、開無痕、貼上。

回程同樣是契約。Block 頁與 Summary 頁都該能回到這張表，而不是只能靠瀏覽器上一頁。階層表是專案的客廳。客廳若不在回程上，使用者會覺得每一間房都是斷頭路，下次寧願從大廳重新點。

七、核對這兩頁時看什麼

打開有最小資料集的網站。大廳的製程分組與卡片數，應等於能解析的階層檔。點進你的專案，列的名字應與樹一致，縮排應與深度一致。那顆你上傳過的葉子，葉數量至少為一；若上傳含檢查，燈號不是橫線。點名字，網址應落到該 block 的 APR。再從頂部路徑回來，表還在，捲動位置不保證，但資料要在。

故意放一份專案名寫錯的上傳，表上不該出現幽靈列——幽靈只會以「葉子仍為零」的方式沉默。這是對的：表的列來自樹，不來自上傳。上傳不能在樹上長出一顆不存在的 block。若你需要那種行為，那是另一種產品；這座大廳的地圖以設計階層為準。

Lab — 數 cards、對 indent、複製 hash

Day 16 的 N4_TUTORIAL 還在的話最好；否則用現成的 N4_SM8466。

1. 數 dist/design/*.json（只算守 {PROCESS}_{PROJECT}.json 的）。Home 的 card 數應相同。
2. 點 TUTORIAL（或任一卡）。表上可點的名字數應等於卡片上的 N blocks。差一，通常是 top 有沒有被兩邊都算進去。
3. tut_mem 應比 tut_sys_top 深一層。深度欄跟眼睛數空白要一致。
4. 點 tut_cpu：hash 結尾應是 /block/tut_cpu/apr，不是 SignOff。
5. Copy #/project/N4_TUTORIAL，無痕貼上，應直接進階層，不是被送回 Home。
6. 走廊上只要一顆入口進 block。不要在每一列加 APR / ECO / SignOff 三個小圖示——階段是房間裡的 tab。

Done when： 兩次點擊的第一跳與第二跳，走起來像同一張地圖。