🥈 2026 YTP 黑客松 — 高中組 第 2 名 銀牌
作品:Compass AI Career Navigator 主辦方公開展示版 | 完整得獎名單見 26ytph organization
用 AI 為台北青年量身打造的職涯導引行動 App。 一段自我敘事,生成「職涯原型 → 軟實力雷達 → 客製化路徑圖 → 1111 即時職缺 → AI 對話調整」的完整流程。
![]() |
![]() |
![]() |
![]() |
![]() |
| 模組 | 路徑 | 說明 |
|---|---|---|
| 自我敘事入口 | app/(tabs)/index.tsx |
接收使用者文字 + RIASEC 測驗結果匯入 |
| 軟實力測驗 | app/influence.tsx / app/interview.tsx |
多題覆蓋同一面向,AI 雙模型交叉評分(評分 + 稽核 ±15 分) |
| AI 掃描過場 | app/scanning.tsx |
呼叫 Gemini 產生職涯原型與五軸雷達圖 |
| 職涯畫像 | app/portrait.tsx |
推薦方向、軟實力雷達、1111 即時職缺 |
| 路徑圖 | app/(tabs)/roadmap.tsx |
5 階段成長路徑 + 對話式 AI 路徑微調 |
| AI 諮詢 | app/(tabs)/community.tsx |
內嵌青年局 RAG 知識庫的對話 |
| 個人檔案 | app/(tabs)/profile.tsx |
重新掃描、語系切換 |
- 雙 AI 評分機制:
SOFT_SKILL_ANALYZER_PROMPT給分並附證據與來源 →SOFT_SKILL_VALIDATOR_PROMPT二次稽核,避免 AI幻覺。 - 亂碼 / 無法辨識輸入 → 給予 0 分,避免胡亂打高分。
- 每個面向至少由多題交叉佐證,並要求每維度提供多來源(題目編號)。
- 方向判斷邏輯:清楚 → 推薦至少 3 個 career / internship;不清楚 → 推薦 3 個 skills / community。
- 路徑可以對話調整:
ROADMAP_ADJUST_PROMPT讓使用者用自然語言請 AI 修改路徑,回傳 diff(changedNodeIds)+ 新版 5 階段架構,並嚴格保留白名單 URL。
模型:gemini-2.5-flash(透過 @google/genai SDK)。
| 層 | 採用 |
|---|---|
| App Framework | Expo SDK 54 + Expo Router 6 |
| UI | React Native 0.81 + NativeWind 4 + Tailwind 3 |
| Language | TypeScript 5.9(strict) |
| AI | @google/genai (Gemini 2.5 Flash) |
| State | React Context + Reducer + AsyncStorage 持久化 |
不想申請 API Key? 直接
npm install && npx expo start -c即可進入 Demo 模式: 所有 AI 流程(畫像分析、軟實力評分、路徑生成、AI 對話)都會自動切換到內建的示範資料, 完整 5 個分頁與互動仍可體驗,只是內容是示範的 sample。
cd compass-ai
npm install
Copy-Item .env.example .env # 沒填 API Key 也能跑(自動 fallback)
npx expo start -c只有要抓社群 IG / Threads / Facebook 公開貼文時才需要啟動。
cd backend
pip install -r requirements.txt
Copy-Item .env.example .env # 預設值即可開機;Threads 需另填 token
uvicorn app.main:app --host 0.0.0.0 --port 8787 --reload| 變數 | 必填 | 預設 / Fallback | 用途 |
|---|---|---|---|
EXPO_PUBLIC_GEMINI_API_KEY |
否 | 留空 → 走內建假資料 demo | Google AI Studio API Key |
EXPO_PUBLIC_SCRAPER_API_URL |
否 | http://localhost:8787 |
社群貼文後端位址(手機請改 LAN IP) |
EXPO_PUBLIC_CORS_PROXY |
否 | https://corsproxy.io/?url= |
1111 爬蟲在 Web 端使用的 CORS proxy |
EXPO_PUBLIC_DEBUG_ENDPOINT |
否 | 不啟用 | 爬蟲錯誤回報端點 |
| 變數 | 必填 | 預設 | 用途 |
|---|---|---|---|
ALLOWED_ORIGINS |
否 | * |
CORS 白名單(正式環境請改 Expo Web URL) |
RATE_LIMIT |
否 | 20/minute |
每 IP 速率限制 |
CACHE_TTL_SECONDS |
否 | 60 |
記憶體快取 TTL |
THREADS_ACCESS_TOKEN |
否 | 空 | Threads Graph API token;未設則 Threads 端點回 503 |
✅ 安全網:兩端的
.env都不存在或未填寫時,App 仍會用 fallback / 預設值啟動,不會 crash。
ytp/
├── README.md # 專案總說明(本檔)
├── backend/ # FastAPI 服務(爬蟲 / 快取 / RAG 端點)
│ ├── app/
│ │ ├── main.py # FastAPI 入口、CORS、路由
│ │ ├── schemas.py # Pydantic 模型
│ │ └── cache.py # 簡易記憶體快取
│ ├── scrapers/ # 1111 / 青年局資源爬蟲
│ ├── tests/
│ ├── Dockerfile
│ └── requirements.txt
│
├── compass-ai/ # 主應用:Expo + React Native
│ ├── app/ # Expo Router 路由(檔案即頁面)
│ │ ├── _layout.tsx # 根 Stack + Provider 包裝
│ │ ├── scanning.tsx # AI 掃描過場
│ │ ├── portrait.tsx # 職涯畫像 + 軟實力雷達 + 1111 即時職缺
│ │ ├── influence.tsx # 影響力 / 自我敘事題
│ │ ├── interview.tsx # 軟實力 AI 面試題
│ │ └── (tabs)/ # 底部導覽
│ │ ├── _layout.tsx # Tab Bar 樣式設定
│ │ ├── index.tsx # 首頁:自我敘事 + RIASEC 導入
│ │ ├── roadmap.tsx # 5 階段路徑圖 + AI 對話微調
│ │ ├── community.tsx # AI 諮詢(內嵌青年局 RAG)
│ │ └── profile.tsx # 個人檔案 / 重新掃描 / 語系
│ │
│ ├── components/ # 共用元件
│ │ ├── CareerCard.tsx # 職涯方向卡
│ │ ├── RoadmapNode.tsx # 路徑圖節點
│ │ ├── ProgressBar.tsx # 軟實力雷達進度條
│ │ ├── GlassCard.tsx · PillButton.tsx # 玻璃卡 / 膠囊按鈕
│ │ ├── SocialLinkRow.tsx # 社群連結列
│ │ ├── LanguageSwitcher.tsx # 語系切換
│ │ ├── themed-text.tsx · themed-view.tsx # 主題化基礎元件
│ │ └── ui/ # icon、collapsible 等
│ │
│ ├── context/ # 全域狀態(Context + Reducer + AsyncStorage)
│ │ ├── PortraitContext.tsx # 畫像 / 雷達 / 職缺 / 路徑
│ │ ├── SocialContext.tsx # 社群連結
│ │ └── I18nContext.tsx # 多語系(zh / en / ja)
│ │
│ ├── services/ # 外部服務整合
│ │ ├── geminiClient.ts # @google/genai 初始化
│ │ ├── geminiService.ts # 評分 / 畫像 / 路徑生成 / 對話微調
│ │ ├── promptTemplates.ts # 所有 Prompt(雙模型稽核、專業門檻)
│ │ ├── jobSearch1111.ts # 1111 即時職缺爬蟲
│ │ ├── jobSearch104.ts # 舊版 104 備份
│ │ ├── socialScraperService.ts # 社群連結資訊抓取
│ │ ├── socialPostsBridge.ts # 社群貼文摘要橋接
│ │ └── localeBridge.ts # i18n bridge
│ │
│ ├── i18n/translations.ts # 中 / 英 / 日 字典
│ ├── hooks/ # use-color-scheme、use-theme-color
│ ├── constants/ # Colors.ts、theme.ts
│ ├── types/ # 型別補丁
│ ├── assets/ # fonts (Manrope / Inter) + images
│ ├── app.json # Expo 設定
│ ├── tailwind.config.js · global.css # NativeWind / Tailwind
│ ├── metro.config.js · babel.config.js # 打包設定
│ └── tsconfig.json # TypeScript strict
│
├── stitch/ # UI 視覺稿(HTML mockup)
│ ├── _1/ · _2/ # 早期版本
│ ├── ai_1/ · ai_2/ # AI 過場 / 結果頁
│ └── horizon_blue/DESIGN.md # 最終視覺規範(horizon blue)
│
├── else/ # 賽題資料 / 簡報 / 知識庫原檔
│ ├── 2026YTP黑客松-賽題B_臺北市青年局-政府公開網站資訊.md
│ ├── taipei_youth_complete_knowledge_base_v3.html
│ ├── Compass_AI_Career_Navigator.pdf / .pptx # 提案簡報
│ ├── prompt.md · prompt2.md · prompt3.md # Prompt 設計草稿
│ └── 113-114TYS職涯講座參與人數.xlsx 等資料
│
└── screenshot/ # App 截圖
- tpyd.gov.taipei — 青年局官網
- tpyd.104.com.tw/jobs — 青年職缺平台
- taipei-yoip.com — 青年海外實習計畫
- startup.taipei — 創業台北(諮詢、潛力新創、Global Pass)
- youth.gov.taipei/resources — 683 筆青年求職資源
- 1111 人力銀行 — 求職網站




