# 報告簡介 — STC 技術報告（含跨專案交接資訊） > **⚠️ 命名變更**：本系統原名 **OSIP**（Omni-Search Intent Parser），已正式更名為 **STC（Smart Travel Companion，智慧旅遊夥伴）**。 > 程式碼倉庫路徑仍為 `Omni-Search Intent Parser API/`（檔案系統名稱未改），但對外名稱與報告用語一律使用 **STC**。 > **這份文件的用途**： > 報告內容分散在多個專案中（STC 主專案 / exAPI / iOS / Android / LiLi 等）。 > 當作者 Jin 切換到其他專案的 Claude Code 時，**請先讀這份簡介**，再延續報告其他頁面的開發。 --- ## 報告基本資訊 | 項目 | 內容 | |-----|------| | **報告主題** | STC（Smart Travel Companion，前身 OSIP）技術介紹 + 效能優化成果 | | **核心優化主軸** | **時間（latency）** — 並行架構、prompt 拆分、模型選型 | | **報告人** | Jin（STC 負責人，jincocochen@liontravel.com） | | **預計報告日** | 隔日（製作日：2026-05-21） | | **聽眾** | 雄獅內部團隊 | | **形式** | 純靜態 HTML 投影頁（雙擊 `index.html` 即播） | --- ## 目前已完成 / 規劃中的頁面 | 頁次 | 主題 | 所在專案 | 狀態 | |-----|------|---------|------| | **第 1 頁** | Pipeline 全貌（UI 截圖開場 + 7 步驟流程 + 4 張團體卡 demo + Langfuse 入口） | **STC 主專案** `presentation/pipeline.html` | ✅ 已完成 | | **第 2 頁** | LLM 意圖分析 + 時間分析（雙引擎並行 · Prompts 全文） | **STC 主專案** `presentation/index.html` | ✅ 已完成 | | **第 3 頁** | ES 分詞器優化（含 Gemini 抽取的商品字典） | **另一專案**（請該專案 Claude Code 製作） | 🚧 **Jin 正要去製作** | | **第 4 頁** | Langfuse 觀測（已啟用 / 計畫導入 / 進階待評估 三分法） | **STC 主專案** `presentation/langfuse.html` | ✅ 已完成（明天報告後可深化） | | **第 5 頁** | Roadmap / 下一步 | 待定 | 🚧 待製作 | > **整份報告主軸**：**時間優化**（latency optimization） > 三大主題為「LLM 解析、ES 搜尋分詞器、Langfuse 觀測」，皆從不同層次切入時間優化故事。 > **跨專案交接重點**：當你（其他專案的 Claude Code）開始製作第 2 頁以後的內容時，請**沿用本頁的視覺風格與技術選型**，保持整份報告一致性。詳見下方「視覺與技術規範」。 --- ## 第 1 頁內容摘要（STC / `presentation/`） **主題**：「一句話 → 兩支 LLM 同時解析 → 結構化搜尋條件」 ### 視覺敘事 1. 使用者輸入：`春節想帶家人去日本玩 5 天，東京加大阪`（逐字動畫） 2. 兩條曲線分流到兩個 LLM 卡片 3. 兩支 LLM 並行解析（pulse 動畫，獨立計時） 4. 雙 JSON 輸出（dark theme + syntax highlight） 5. 合併為最終 query payload（雄獅橘色卡片，模擬 `aigenie.liontravel.com` 實際回傳） 6. 亮點 callout：「為什麼日期是 2027？」— 展示跨年規則（相對時間感知） ### 關鍵效能數據（prod 實測） - **平均回應時間（/intent/parse）：3.63s**（n=12 fresh curl 量測） - 中位數：3.94s ｜ 範圍：1.73s ~ 6.00s ｜ 標準差：1.34s - **並行架構優化：↓ 24.3%**（Langfuse n=10 實測，原估算 45% 是高估） - 意圖 LLM 平均 4.13s · 日期 LLM 平均 1.43s - 序列估算 5.56s → 並行實測 4.13s - **/search/products 端到端**：cold call 5-15s · warm call (intent cache 命中) ~1s · 「典型」latency 取 3.5s ### 真實 API endpoint - **Prod**：`https://aigenie.liontravel.com/api/v1/intent/parse?q=` - 回傳 schema：`Data.global_context.{trip_details, destination, common_fields, sort_type}` + `Data.queries[]` - `queries[].product_type` 是 `grp` / `vac` / `flt` / `htl` / `etk` / `vsa` 之一 --- ## STC 技術架構（要點） ``` 使用者輸入 (自然語言) │ ├──────────┬──────────┐ ▼ ▼ ▼ Input Guard 意圖 LLM 時間 LLM ← 並行 (敏感字過濾) (Gemini (Gemini 3.1 Flash- 3.1 Flash- Lite) Lite) │ │ └─────┬────┘ ▼ 合併為 query payload │ ▼ ExAPI IntentionSearch (Lion API 向量搜尋) │ ▼ 產品搜尋結果 ``` **關鍵設計決策**： - **雙 LLM 並行**：意圖解析與日期解析使用獨立 prompt，平行呼叫，避免單一 prompt 過長 + 降低錯誤交互 - **模型統一**：兩支都用 **Gemini 3.1 Flash-Lite**（成本/速度平衡） - **觀測性**：Langfuse 整合（`stc-langfuse.liontravel.com`），可追蹤每次解析的 latency、token 使用、prompt 版本 - **時間 LLM 內建 15 種日期類型**：包含台灣國定假期、季節、相對日期、跨年規則等 --- ## 視覺與技術規範（其他頁面請沿用） ### 配色（雄獅品牌色） | Token | Hex | 用途 | |-------|-----|------| | `--primary` | `#0066CC` | 主色（雄獅藍） | | `--primary-dark` | `#003D7A` | 深色標題列 | | `--primary-soft` | `#E6F0FB` | 淺底/標籤背景 | | `--accent` | `#FF6B35` | 重點橘（亮點 callout、合併結果框） | | `--bg` | `#F5F7FA` | 頁面底色 | | `--text` | `#1A1A2E` | 主文字 | | `--muted` | `#6B7280` | 次要文字 | | JSON dark theme | `#0F172A` 底 + tailwind-style highlight | 程式碼區塊 | ### 字體 - 中文：`Noto Sans TC`（400/500/700/900） - 程式碼：`JetBrains Mono`（400/500/700） - 兩者皆從 Google Fonts CDN 載入 ### 版面風格 - **商務簡報**（淺色 + 卡片陰影 + 大量留白），不走科技深色風 - 主要元件：圓角卡片（`--radius: 14px`）、`--shadow-md` 陰影、白底 - 動畫：CSS transition + JS 編排，typewriter 效果為主軸 ### 技術選型 - **純靜態 HTML/CSS/JS**，無 build step、無框架 - 雙擊 `index.html` 即可在瀏覽器播放 - 動畫：原生 JS + CSS animation，無動畫框架依賴 ### 檔案結構（本頁範例） ``` presentation/ ├── index.html # 結構 ├── style.css # 樣式 + 動畫 ├── script.js # 動畫編排 + 計時器 └── REPORT_BRIEF.md # 本文件 ``` --- ## 給其他專案 Claude Code 的建議 當 Jin 切換到其他專案要做第 2 頁以後時： 1. **先讀這份 BRIEF**，理解整份報告的脈絡與已建立的視覺/技術規範 2. **沿用本頁 CSS 變數**（複製 `:root { ... }` 區塊）以維持配色一致 3. **沿用相同字體**（Noto Sans TC + JetBrains Mono） 4. **沿用相同版面節奏**：標題列 → hero → 效能/重點數據 → 主視覺 → callout 5. **保持「動畫式說故事」的敘事風格**：用 typewriter / fade-in 帶觀眾走過流程，不要一次顯示全部內容 6. **資料來源誠實**：若有實測數據，明確標示來源（如「prod 實測 n=12」），避免捏造數字 7. **每頁有一個亮點 callout**（橘色）放在最後，作為該頁的 punchline 各子題目的可能延伸方向： ### 第 3 頁 ES 分詞器（這頁交給另一專案 Claude Code） **核心內容應包含：** - 為什麼預設分詞器不夠（旅遊領域詞、地名專有名詞無法正確切分） - **Jin 用 Gemini 把「團體」商品名做關鍵字抽取，生成自訂字典** — 這是這頁的最大亮點，請務必呈現 - 優化前後召回率 / 響應時間對比（需要有 punchline 數字） - 視覺建議：input → 分詞結果（before/after 並排） **沿用本專案的風格 / 素材：** - 配色、字體、卡片樣式都複製 `presentation/style.css` 的 `:root { ... }` CSS 變數區塊 - 字體：Noto Sans TC + JetBrains Mono（從 Google Fonts CDN 載入） - topbar 結構（含 STC brand mark + 跨頁連結）抄第 1 頁 `pipeline.html` 的 `
` - 卡片樣式可參考 `.pc` (產品卡) 或 `.lf-card` (Langfuse 功能卡) **跨頁連結建議：** - 頁面頂部加「← 第 2 頁 LLM 雙引擎 / 下一頁 Langfuse 觀測 →」 - 如果頁面想分享給 STC 專案的 Claude Code 改回，請也加上 `REPORT_BRIEF.md` 連結 ### 第 4 頁 Langfuse（已完成，明天可深化） - 已用 Langfuse API 撈真實數據設計頁面 - 報告時直接切到 stc-langfuse.liontravel.com 看實際 trace、prompt 版本 - 後續可深化方向：補真實 trace 截圖、加 prompt 版本對比 demo、Score/Eval 上線後的視覺化 ### 第 5 頁 Roadmap（待製作） 簡短條列下一步，候選項目： - Redis 快取策略擴大（intent cache 已用，可擴大到其他環節） - Input Guard 進階規則 - ToVector 向量搜尋重啟（目前強制關閉） - 新增節日類型（2027 春節等） - ES 字典持續迭代 - Langfuse Score/Eval 上線 - Cost 追蹤上線 - Multi-model 路由策略（gemini + seed-2-0-mini） --- ## 相關連結 - **Prod 前端**：https://aigenie.liontravel.com - **Langfuse 觀測**：https://stc-langfuse.liontravel.com - **STC 主專案**：FastAPI + Gemini 3.1 Flash-Lite + Redis + Langfuse - **GitHub mirror**：（主 remote 是 azure） --- _Last updated: 2026-05-21_