Claude Code 實用功能與產品策略研究

一、Session Forking（/fork）立刻可用

概念

就像 git branch — 從當前對話分出一條新路線。新 session 帶著之前所有的 context，但原本的對話完全不受影響。

使用方式

在 Claude Code 對話中直接輸入：

/fork

適用場景

• 想試兩種方案 — fork 出去各走一條路，看哪個結果好
• 做有風險的操作 — 先 fork 再試，搞壞了原本的還在
• 聊到一半想換方向 — 不用怕浪費前面 20 分鐘的 context
• 保留進度做實驗 — 主線繼續推進，分支去探索

二、Playwright 自動化 QA 測試 鯤航適用

你的環境已安裝 Playwright，可以直接對 kunhang.com.tw 跑自動化測試。

能做什麼

最佳實踐

• 用語意選擇器（get_by_role、get_by_text）取代 CSS，不怕 Elementor 改 class 名
• 用 wait_for_load_state("networkidle") 確保載入完成（WordPress 圖多外掛多）
• 每次跑測試自動截圖，方便肉眼確認
• 多裝置同時測（Playwright 內建 iPhone、Pixel 等裝置描述檔）

測試腳本

以下腳本可直接執行，會自動檢查 kunhang.com.tw 並存截圖到 screenshots/ 資料夾：

"""
kunhang.com.tw 自動化 QA 測試
執行：python3 test_kunhang.py
截圖存在 screenshots/ 資料夾
"""
import os
from playwright.sync_api import sync_playwright

SITE = "https://kunhang.com.tw"
SCREENSHOT_DIR = "screenshots"

def setup():
    os.makedirs(SCREENSHOT_DIR, exist_ok=True)

def test_homepage_loads(page):
    """測試 1：首頁能正常載入"""
    resp = page.goto(SITE, wait_until="networkidle", timeout=30000)
    assert resp.status == 200, f"首頁回應碼異常：{resp.status}"
    assert page.title(), "首頁標題為空"
    page.screenshot(path=f"{SCREENSHOT_DIR}/01_homepage_desktop.png", full_page=True)
    print(f"[PASS] 首頁載入成功，標題：{page.title()}")

def test_nav_links(page):
    """測試 2：導覽列所有連結都能點且不是 404"""
    page.goto(SITE, wait_until="networkidle", timeout=30000)
    nav_links = page.locator("nav a, .elementor-nav-menu a, header a").all()
    results = []
    for link in nav_links:
        href = link.get_attribute("href")
        text = link.inner_text().strip()
        if not href or href.startswith("#") or href.startswith("tel:") or href.startswith("mailto:"):
            continue
        results.append({"text": text, "href": href})
    print(f"  找到 {len(results)} 個導覽連結，逐一檢查...")
    for item in results:
        resp = page.goto(item["href"], wait_until="domcontentloaded", timeout=20000)
        status = resp.status if resp else "無回應"
        passed = resp and resp.status < 400
        mark = "PASS" if passed else "FAIL"
        print(f"  [{mark}] {item['text']} → {item['href']} (HTTP {status})")
    page.goto(SITE, wait_until="networkidle")

def test_mobile_rwd(page, browser, pw):
    """測試 3：手機版 RWD 截圖"""
    iphone = pw.devices["iPhone 12"]
    context = browser.new_context(**iphone)
    mobile_page = context.new_page()
    mobile_page.goto(SITE, wait_until="networkidle", timeout=30000)
    mobile_page.screenshot(path=f"{SCREENSHOT_DIR}/02_homepage_mobile.png", full_page=True)
    print("[PASS] 手機版首頁截圖完成")
    hamburger = mobile_page.locator(
        ".elementor-menu-toggle, .eicon-menu-bar, [aria-label='Menu'], .fa-bars"
    ).first
    if hamburger.is_visible():
        hamburger.click()
        mobile_page.wait_for_timeout(1000)
        mobile_page.screenshot(path=f"{SCREENSHOT_DIR}/03_mobile_menu_open.png", full_page=True)
        print("[PASS] 手機版選單展開截圖完成")
    else:
        print("[INFO] 未找到漢堡選單按鈕")
    context.close()

def test_teacher_page(page):
    """測試 4：師資頁面截圖"""
    page.goto(SITE, wait_until="networkidle", timeout=30000)
    teacher_link = page.locator("a:has-text('師資')").first
    if teacher_link.is_visible():
        teacher_link.click()
        page.wait_for_load_state("networkidle")
        page.screenshot(path=f"{SCREENSHOT_DIR}/04_teacher_page.png", full_page=True)
        print(f"[PASS] 師資頁面截圖完成，URL：{page.url}")
        return
    print("[WARN] 找不到師資頁面")

if __name__ == "__main__":
    setup()
    with sync_playwright() as p:
        browser = p.chromium.launch(headless=True)
        page = browser.new_page(viewport={"width": 1920, "height": 1080})
        print("=" * 50)
        print("kunhang.com.tw 自動化 QA 測試")
        print("=" * 50)
        test_homepage_loads(page)
        test_nav_links(page)
        test_mobile_rwd(page, browser, p)
        test_teacher_page(page)
        browser.close()
        print("=" * 50)
        print(f"測試完成！截圖存放於 {SCREENSHOT_DIR}/")

執行方式

cd /Users/wt/PyCharmMiscProject/鯤航網站優化
python3 test_kunhang.py

三、gstack 工作流套件 值得研究

Y Combinator 總裁 Garry Tan 開源的 Claude Code 工作流套件，GitHub 兩天破萬星。

核心概念

把一個 Claude Code 拆成多個「角色」，每個角色用一個自訂 slash command 啟動：

安裝方式

# 克隆 gstack
git clone https://github.com/garrytan/gstack.git

# 進入目錄，執行安裝
cd gstack
./install.sh

安裝後在任何專案中都能用 /ceo、/qa 等指令。本質上是一組精心設計的 system prompt + slash commands，不是獨立軟體。

四、100M Offers 產品定位 — 車險 App 策略 值得研究

為什麼朋友沒在用？Hormozi 價值方程式診斷

你的 App 目前提供的是「管理工具」（增加努力），而不是「夢想結果」。業務員的夢想結果是「續保率提高 → 賺更多佣金」，不是「有一個地方輸入保單資料」。

用 Grand Slam Offer 重新包裝

不要賣「車險管理工具」，要賣「車險續保率提升系統」。

Dotcom Secrets 價值階梯

立刻可做的 3 件事

1. 回去問那兩個朋友「為什麼沒在用」 — 是不知道怎麼開始？覺得沒必要？操作太麻煩？這比任何框架都重要
2. 把定位從工具改成結果 — 所有文案改成「幫你多留住 X 個續保客戶」而非「管理你的保單」
3. 最低摩擦啟動 — 拍一張行照就能開始用，不要有空白首頁要求從零建檔

五、鯤航網站可用功能整理 鯤航適用