Sun's profile

你好,我是謝上智(Sun)

向下滾動

關於我

Sun 是一位專注於產品實現、使用者體驗和實用 AI 整合的軟體工程師。他專精於建構結合前端卓越技術與 AI 驅動智能的可擴展工具,涵蓋 Web 全棧、桌面應用、Chrome 擴充到 AI SaaS 平台。 Sun 目前主導多個核心專案: Threado:Threads 帳號 AI 排程管理平台,整合 Google Gemini 自動生成文章、BullMQ + Redis 排程佇列,實現從內容生成到自動發布的全自動化社群流程。 ResumeAI:AI 驅動的履歷生成工作區,透過 SSE 串流多輪對話式編輯(Cursor 風格)、7 種版型、Stripe 商業化,以及 Playwright E2E 測試保障品質。 Skyvize:社群聲量監控與 AI 情報分析 SaaS,使用 Next.js 16 + Drizzle ORM,整合 Threads、RSS、CSE 三路資料流,提供競品矩陣與 KOL 雷達圖表。 AutoLens:Windows 桌面 AI 螢幕錄製工具(Electron),透過 uiohook-napi 全局 Hook 和 Gemini 自動偵測重要畫面區域,支援時間軸編輯器與 GIF 匯出。 除了開發工作,Sun 積極透過工作坊和企業技術分享會傳授實務知識,涵蓋 Gemini API、OpenAI、Notion 整合等主題。他的技術廣度橫跨 Unity 遊戲、.NET 系統、全棧 Web、AI 工具與桌面應用。 Sun 相信偉大的技術不僅僅是演算法——而是要建構人們信任、理解並樂於使用的直觀工具。

英業達股份有限公司 - 軟體工程師

2023/12 - 至今

負責企業級應用系統開發與維護,主要使用 .NET MVC、Low Code 技術,並參與 AI 技術導入專案。

  • 開發與維護企業內部系統
  • 參與 AI 技術導入專案
  • 進行技術分享與知識交流
  • 優化系統架構與效能
  • 建立開發文件與規範

酷愛迪數位創意 - 外包軟體工程師

2020/10 - 至今

以接案方式合作,專注於 AR 與 Unity 開發,負責多項創新互動專案的開發與實現。

  • 研究 AR 臉部辨識,開發人臉位置判斷功能
  • 使用 Unity 開發跨平台手機 APP 介面
  • 開發互動式遊戲,與企劃密切溝通
  • 確保 UI 在不同裝置上的一致性
  • 優化應用程式效能與使用者體驗

宥倍實業股份有限公司 - 軟體工程師

2023/2 - 2023/10

負責多個企業應用系統的開發與維護,主要使用 .NET MVC、WinForm 技術。

  • 同時管理五個專案的開發與維護
  • 快速理解並解決程式問題
  • 提升專案開發效率
  • 建立完整的專案文件
  • 優化開發流程與架構

田野科技有限公司 - 遊戲工程師

2022/4 - 2023/2

負責開發多項影像辨識與 AR/VR 遊戲,同時管理 LINE BOT 人事系統。

  • 開發多款體感互動遊戲
  • 實現 AR/VR 技術整合
  • 設計影像辨識演算法
  • 開發 LINE BOT 人事系統
  • 優化使用者體驗與效能

專業服務項目

可接受委託

提供專業的技術開發與顧問服務,從需求分析到系統實現,為您打造完整的解決方案。

全端開發

網站系統開發與維護

VR/AR 開發

互動體驗設計與開發 (須提供設備)

遊戲開發

互動遊戲開發與設計

AI 應用開發

AI 應用程式開發與整合

APP 開發

行動應用程式開發與優化

教學課程

在各大專院校和企業分享實務經驗,提供客製化課程內容,從基礎概念到進階應用,協助學員快速掌握技術要點。

Unity 遊戲開發實務課程
Unity 結合 MediaPipe 影像辨識應用
LINE BOT 開發與應用實作
AI 應用開發實務分享
指導學生專案開發

技術能力

C#

C#

Python

Python

JavaScript

JavaScript

TypeScript

TypeScript

Java

Java

.NET

.NET

React

React

Next.js

Next.js

Tailwind CSS

Tailwind CSS

Vue.js

Vue.js

Flutter

Flutter

Unity

Unity

Azure OpenAI

Azure OpenAI

Gemini

Gemini

Computer Vision

Computer Vision

MediaPipe

MediaPipe

SQL Server

SQL Server

Git

Git

Docker

Docker

活動與分享

黑客松

DIGITIMES AWS 黑客松團隊合照
AI 開發

2025 DIGITIMES AWS 生成式 AI 黑客松

參加 DIGITIMES 和 AWS 合作舉辦的生成式 AI 應用黑客松,專注於開發創新的生成式 AI 解決方案

主要成果:
  • 使用 AWS 生成式 AI 服務開發創新應用
  • 整合 Amazon Bedrock 和 Anthropic Claude
  • 實現多代理協作系統
  • 開發多模態 AI 模型應用
  • 建立具推理能力的大型語言模型應用
AWS BedrockAnthropic ClaudeAmazon CodeWhispererAmazon SageMakerReactNode.js
2025 雙北程式設計節黑客松團隊合照
全端開發

2026 雙北程式設計節 城市儀表板大黑客松

參加新北市政府資訊中心、台北市政府資訊局主辦的 2026 雙北程式設計節城市儀表板大黑客松,與超過 100 支隊伍競爭,開發創新的城市數據視覺化儀表板解決方案

主要成果:
  • 開發城市開放資料視覺化儀表板
  • 整合雙北市政府多元開放資料集
  • 即時數據更新與動態圖表展示
  • React + D3.js 資料視覺化實作
  • 與 100+ 支隊伍競爭的大規模黑客松
ReactTypeScriptD3.jsNode.jsPostgreSQLTailwindCSS
雙北設計節黑客松團隊合照
全端開發

2025 雙北設計節 黑客松

參加台北市政府主辦的雙北設計節黑客松,專注於開發長照資料整合與儀表板組件優化

主要成果:
  • 開發長照數據視覺化儀表板
  • 整合雙北市長照開放資料
  • 優化儀表板組件效能
  • 建立資料自動更新機制
Vue.jsDockerPostgreSQLNode.jsTailwindCSS

演講分享

演講
演講分享

TED × AI創新應用講座

受邀擔任 TED 講座講師,分享 AI 技術的創新應用與未來展望

主要成果:
  • 分享 AI 技術在各領域的實際應用案例
  • 探討 AI 發展趨勢與未來機會
  • 與聽眾互動討論 AI 創新想法
AI 應用ChatGPTNotebookLM

教學活動

Unity 影像辨識課程
教學分享

Unity 影像辨識課程

在屏東科技大學碩士班擔任 Unity 結合 MediaPipe 影像辨識課程講師,分享實務經驗與技術整合

主要成果:
  • 教授 Unity 與 MediaPipe 整合技術
  • 人體姿態估測在遊戲中的應用
  • 手部追蹤與手勢識別實作
  • 指導學生專案開發
  • 分享業界實務經驗
UnityMediaPipeComputer Vision影像辨識人體姿態估測

主要專案

NexusOS 首頁
AI 開發

NexusOS - AI 個人知識庫 SaaS

自架多租戶 AI 個人知識庫 SaaS,以 Docker Compose 一鍵部署。將所有資料(文件、網頁、Google Drive、社群媒體、音訊影片)統一向量化後,透過 Hybrid Search + AI 多模型對話引用來源回答。類比 NotebookLM + Notion + 個人 AI 助理三合一,採全 MIT / Apache 可商用開源技術棧。

主要成果:

  • 全格式資料統一向量化(PDF / 音訊 / 影片 / URL / Google Drive)
  • Qdrant 向量資料庫 Hybrid Search,AI 對話附帶引用來源
  • Vercel AI SDK 直連多 Provider(OpenAI / Anthropic / Google / Groq)
  • BlockNote(Notion 式)文件編輯器內建於知識庫
  • Better Auth 多租戶系統,每 org 獨立知識庫
  • faster-whisper 本地音訊轉錄 + Crawl4AI JS SPA 爬取
  • 5 容器 Docker 精簡架構(Caddy + Next.js + Worker + PostgreSQL + Qdrant)
Next.jsTypeScriptPythonQdrantPostgreSQLBullMQRedisDockerVercel AI SDKCaddy
Broadvize 首頁
AI 開發

Broadvize - AI 多平台內容分發系統

智能內容分發平台,將單一內容一鍵轉換為多平台優化的社群貼文。支援 LINE、Threads、X (Twitter)、Facebook、LinkedIn 等平台,透過 Google Gemini 自動適配各平台語調與格式,大幅提升內容行銷效率。

主要成果:

  • 單一內容自動生成多平台適配貼文
  • 支援 LINE、Threads、X、Facebook、LinkedIn、Instagram
  • URL 文章自動擷取與摘要(免 API)
  • Word 文件(.docx)直接上傳解析
  • RSS 訂閱源整合,自動拉取最新內容
  • 可重複使用的品牌語調模板系統
  • 直接串接 LINE / Facebook / Instagram 發布功能
Next.jsReactTypeScriptGoogle GeminiTailwind CSSPostgreSQLPrismaNextAuth.js
Skyvize 首頁
AI 開發

Skyvize - AI 社群海巡情報雷達

以資料收集與全面分析為核心的 AI 社群監控 SaaS 平台。跨平台彙整 Threads、RSS、CSE 等社群聲量,透過時間軸、關注項目、搜尋、AI 問答與情報圖表進行深度分析,協助品牌掌握市場動態。

主要成果:

  • 跨平台社群聲量即時海巡(Threads / RSS / CSE)
  • 時間軸與關注項目追蹤系統
  • AI 問答與智能情報分析
  • 競爭對手矩陣與 KOL 發現功能
  • 自定義關鍵字與警報機制
  • Next.js 16 + shadcn/ui 現代化介面
Next.js 16ReactTypeScriptGoogle GeminiDrizzle ORMPostgreSQLRechartsTailwind CSSshadcn/ui
CodeLTP 首頁
AI 開發

CodeLTP - AI Vibe Coding 學習平台

整合學習、練習、評估、就業的一站式 AI Vibe Coding 學習平台。採用 SDD(規格驅動開發)方法論,以 OpenAI / Claude AI 提供個人化學習路徑、即時代碼評估與就業媒合服務,幫助使用者從初學者成長為產品專家。

主要成果:

  • SDD 規格驅動開發方法論實作
  • AI 個人化學習路徑規劃
  • 即時代碼練習與 AI 評估系統
  • 學習進度追蹤與成就系統
  • 獨立前端 + 後端微服務架構
  • JWT 認證 + 完整 API 設計
Next.jsTypeScriptNode.jsPostgreSQLPrismaOpenAIAnthropic ClaudeDockerJWT
VibeGame 首頁
全端開發

VibeGame - AI 遊戲展示商城

Steam 風格的 AI 實驗性遊戲展示平台,為每款遊戲打造完整的商城頁面與獨立運行環境。具備精選遊戲輪播、分類瀏覽、收藏系統、全螢幕遊玩,以及 Playwright 自動截圖功能,展現現代賽博龐克視覺風格。

主要成果:

  • Steam 風格遊戲商城完整體驗
  • 每款遊戲獨立沙盒運行環境
  • 精選遊戲輪播與分類探索系統
  • 本地收藏心願清單(裝置端儲存)
  • Playwright 自動生成遊戲縮圖
  • 賽博龐克深色 UI 視覺設計
Next.jsReactTypeScriptTailwind CSSFramer MotionThree.jsPlaywright
AllVibe 首頁
全端開發

AllVibe - 萬物集合數位內容平台

類 Steam 的廣泛數位內容發布與分享平台,支援軟體、課程、設計資源等 10+ 種內容類型。具備強大的搜尋推薦系統、社群評分評論、完整個人中心,採深色主題設計呈現現代化視覺風格。

主要成果:

  • 支援 10+ 種數位內容類型發布
  • 智能搜尋、篩選與推薦系統
  • 社群評分、評論與關注功能
  • 完整用戶管理與內容管理後台
  • Google / GitHub OAuth 多方式認證
  • Steam 風格深色主題視覺設計
Next.jsTypeScriptTailwind CSSshadcn/uiPostgreSQLPrismaNextAuth.js
Threads Story Recap 首頁
前端開發

Threads Story Recap - 年度動態回顧

讓使用者透過 Meta Threads 帳號授權,抓取歷史貼文數據,以 Instagram 限時動態風格呈現年度互動回顧。支援手勢操作的多頁面動畫播放,展示發文量、活躍時段、熱門關鍵字等精彩數據統計。

主要成果:

  • Threads OAuth 授權與歷史貼文資料抓取
  • Instagram Stories 風格多頁面動畫播放器
  • Framer Motion 手勢操作(點擊/滑動)
  • 發文量、活躍時段、熱門關鍵字數據分析
  • Mobile First 響應式設計
  • Vercel 部署
Next.jsTypeScriptTailwind CSSFramer MotionThreads API
VeyoShop 首頁
全端開發

VeyoShop - 現代化電商平台

以 Next.js 15 打造的全功能現代化電商網站,具備商品展示、搜尋篩選、購物車管理、多種付款方式整合與訂單追蹤系統。採用 Zustand 狀態管理與 React Hook Form + Zod 表單驗證,提供流暢的購物體驗。

主要成果:

  • 完整商品展示、分類、搜尋與篩選功能
  • 購物車管理與持久化(Zustand)
  • 多種付款方式(信用卡 / 銀行轉帳 / 貨到付款)
  • 訂單管理與配送狀態追蹤
  • 用戶評分與評論驗證系統
  • React Hook Form + Zod 表單驗證
Next.jsTypeScriptTailwind CSSZustandReact Hook FormZodLucide React
FlipTok 首頁
行動開發

FlipTok - Flutter 短影音購物 App

結合短影音瀏覽與電商購物的 Flutter 行動應用,以 TikTok 風格的垂直滑動介面瀏覽商品。後端採 Node.js + MongoDB + Redis 微服務架構,透過 Nginx 代理和 Docker 完整容器化部署。

主要成果:

  • TikTok 風格垂直滑動商品瀏覽體驗
  • Flutter 跨平台行動應用開發
  • Node.js + MongoDB 後端 API 服務
  • Redis 快取層優化效能
  • Nginx 反向代理完整部署架構
  • Docker 容器化一鍵部署
FlutterDartNode.jsMongoDBRedisNginxDocker
台北城市儀表板
開源貢獻

台北城市儀表板 - 開源貢獻

參與台北市政府智慧城市研究所(TUIC)主導的開源城市數據視覺化平台開發。在 Fork 基礎上新增食安儀表板 7 組件、AI Flow UI/UX 設計、Docker/Airflow 部署設定,以及完整的 AI Agent 操作指南,累計超過 72 個 commits 遠超原始版本。

主要成果:

  • 開發食安儀表板 7 個完整資料視覺化組件
  • 設計並合併 AI Flow UI/UX 功能(PR #1 merged)
  • 建立完整 Docker + Airflow 部署自動化設定
  • 撰寫 AI Agent 使用指南與技能文件
  • Vue.js + Python + Go 全棧技術貢獻
  • 72 commits 超越原始版本持續開發
Vue.jsPythonGoPostgreSQLDockerAirflowQdrant
VibeWorkshop 首頁
全端開發

VibeWorkshop - 課程管理平台

為 AI Vibe Coding 工作坊設計的全端課程管理系統,前端採 Next.js App Router,後台管理系統具備儀表板、課程管理、學員追蹤、訂單管理、數據分析與報表功能,以 Framer Motion 實現流暢頁面轉場,並支援 PostgreSQL 資料層。

主要成果:

  • 課程管理完整 CRUD(課程、成員、訂單、反饋)
  • 管理員儀表板:數據分析、報表、設定
  • Framer Motion 頁面轉場動畫效果
  • Prisma ORM + PostgreSQL 資料庫整合
  • 前後端分離架構(Workshop 前台 + Backend 管理後台)
  • Tailwind CSS 4 + 自定義 UI 組件庫
Next.jsTypeScriptTailwind CSSFramer MotionPrismaPostgreSQLReact
SpecFormula 工作區介面
桌面應用

SpecFormula - 多編輯器技術規格協作工作區

基於 Electron 的桌面技術規格工作區,整合 20+ 種專業編輯器於單一介面。支援 BDD Gherkin、OpenAPI、ERM 實體關係圖、活動流程圖、心智圖等,採用 pnpm monorepo 架構與 Cucumber BDD 作為規格與測試雙重用途。

主要成果:

  • 20+ 種專業規格編輯器整合(BDD、API、ERM、心智圖等)
  • Monaco Editor 多語言代碼編輯(JS/TS/Python/JSON/SQL)
  • @xyflow/react 活動圖與流程圖視覺化
  • Markmap 心智圖自動生成
  • Cucumber BDD 規格即測試雙重用途
  • pnpm monorepo 獨立 packages 架構
  • Git Diff 檢視器與行內協作留言
  • Playwright E2E + BDD 自動化測試
ElectronReactTypeScriptMonaco EditorTailwind CSS v4Radix UIMUIPlaywrightBiome
ToolNest 工具首頁
前端開發

ToolNest - 實用工具集合網站

基於 Next.js 15 打造的極簡主義實用工具集合平台。內建 QR Code 產生器、AI Prompt 優化器、閃字閱讀器等工具,所有功能在本地處理確保資料隱私,採單色極簡設計風格,讓使用者快速完成任務並提升工作效率。

主要成果:

  • QR Code 產生器(輸入文字即產生可下載圖片)
  • AI Prompt 優化器(自動優化提示詞品質)
  • 閃字閱讀器(逐字顯示提升閱讀速度與專注力)
  • 所有工具本地處理,零資料外傳
  • 極簡主義單色設計風格
  • Next.js 15 + React 19 最新技術棧
Next.jsReactTypeScriptTailwind CSS
Threads Saver Logo
前端開發

Threads Saver - 瀏覽器擴充工具

一個強大的 Threads 瀏覽器擴充工具,提供多種實用功能來增強您的瀏覽體驗。Threads Saver 讓您輕鬆下載和保存 Threads 上的內容,包括文字、圖片、影片等,支援多種格式輸出和批次處理功能。

主要成果:

  • 智能下載功能:一鍵下載 Threads 帖子的所有內容
  • 多格式支援:Markdown、JSON、HTML、純文字、CSV 格式
  • 批次處理:支援批量下載多個帖子
  • 進階設定:自定義下載品質等選項
  • 即時通知:操作結果即時反饋
  • 狀態記憶:下載狀態持久化保存
  • 視覺反饋:下載完成後圖標變色提示
  • Threads風格介面:採用原生深色主題設計
Chrome ExtensionTypeScriptJSZipManifest V3CSS3WebpackSharp
LexiTechly 主介面
AI 開發

LexiTechly - 智慧英文內容分析

使用 Google Gemini AI 分析英文網頁內容,提供 CEFR 等級評估、單字解析、AI 互動對話與語音發音功能,提升您的英文閱讀與學習體驗!

主要成果:

  • 網頁英文內容的 CEFR 等級分析
  • 全方位的詞彙、語法和主題難度評估
  • 互動式 AI 對話功能
  • 單字列表與 AI 詞彙分析
  • 支援單字和例句的語音播放
  • 無限制的本地儲存空間
Chrome ExtensionHTMLCSSJavaScriptGoogle Gemini AISpeechify APIIndexedDB
Sun UI Design Logo
前端開發

Sun UI Design

一個具有精美動畫效果的現代 React UI 組件庫,使用 React、TailwindCSS 和 TypeScript 構建。提供現代化且可自定義的組件,支持 Tree-shaking 導出。

主要成果:

  • 設計並實現多個現代化 UI 組件
  • 支持獨立包或整體打包安裝
  • 完整的 TypeScript 類型支持
  • TailwindCSS 整合優化
  • Storybook 文檔與展示
  • 優化的打包與發佈流程
ReactTypeScriptTailwindCSSStorybookLernanpm
DeepCrawlAI Screenshot
AI 開發

DeepCrawlAI

一個結合網頁爬蟲和 AI 分析的智能爬蟲工具,能夠深度爬取網頁內容並使用 Gemini AI 進行智能分析。

主要成果:

  • 智能網頁爬蟲,支援多層次深度爬取
  • 使用 Google Gemini AI 進行內容分析
  • 支援動態網頁爬取(Selenium)和靜態網頁爬取
  • 自動提取相關連結並遞迴爬取
  • 將網頁內容轉換為結構化的 Markdown 格式
  • 防止重複爬取相同網頁
PythonGoogle Gemini AIBeautifulSoupSeleniumCloudscraper
Snapraze Logo
全端開發

Snapraze

提供圖片雲端儲存、編輯標記以及原圖比對功能的平台。使用者可以上傳、管理、編輯和比較圖片,支援多種圖片格式,並提供完整的圖片管理系統。

主要成果:

  • 雲端圖片儲存與管理系統
  • 圖片編輯與標記工具
  • 原圖與編輯圖即時比對
  • 支援多種圖片格式
  • 完整的修改記錄追蹤
  • 使用者權限管理
Next.jsTypeScriptTailwind CSSShadcn/uiCloudinaryPostgreSQLPrismaFabric.js
汽車工廠供料防呆系統監控介面
後端開發

汽車工廠供料防呆系統

使用 .NET 開發的汽車工廠供料監控網站,整合工料機制進行防呆檢測。當供料與工單不對應時,系統會即時顯示錯誤並提供錯誤編號,確保生產線正常運作。這是舊系統的全面翻新專案,由我獨自負責開發與工廠端對接。

主要成果:

  • 設計並實現供料與工單對應檢核機制
  • 建立即時錯誤監控與通報系統
  • 開發錯誤編號管理與追蹤功能
  • 完成舊系統架構全面翻新
  • 建立與工廠設備的串接介面
  • 優化防呆檢測算法提升準確度
.NET FrameworkASP.NET MVCSQL ServerC#JavaScriptBootstrapAJAX
AR 垃圾車體感遊戲介紹
遊戲開發

AR 垃圾車體感遊戲

結合 AR 與影像辨識技術的垃圾車主題體感遊戲,包含「垃圾車等等我」追逐模式和「打擊垃圾車」戰鬥模式。運用身體動作控制遊戲角色,完成追趕垃圾車和攻擊垃圾車的任務挑戰。

主要成果:

  • 開發雙模式體感遊戲系統
  • 整合 AR 影像辨識與人體姿態追蹤
  • 實現身體動作控制機制
  • 設計垃圾車追逐與戰鬥玩法
  • 建立 3D 城市場景與垃圾車模型
  • 優化手機端 AR 效能與體驗
UnityAR FoundationMediaPipeComputer VisionC#3D ModelingMobile Development
LINE BOT 人事管理系統介面
後端開發

LINE BOT 人事管理系統

基於 LINE BOT 開發的企業人力資源管理系統,整合員工日常工作流程,提供便捷的行動化辦公體驗。透過 LINE 介面實現打卡、請假、簽核、發票上傳等核心人事功能,大幅提升企業內部作業效率。

主要成果:

  • 設計並實現 LINE BOT 對話流程
  • 建立員工打卡與考勤管理系統
  • 開發請假申請與審核流程
  • 實現多層級簽核機制
  • 整合發票上傳與報帳功能
  • 建立人事資料管理與權限控制
LINE Bot SDKJavaScriptWebhook
OpenRing 介面
行動開發

OpenRing - Android 輕量 RPA 工作流引擎

基於 Android AccessibilityService 的輕量級 RPA 工作流引擎,完全在手機端執行,無需 PC 後端、無需 Root。整合 Gemini AI ReAct 代理、本地 GGUF 模型推論、語意 UI 解析,支援 Chat-Driven 對話式指令控制任意 Android App,並提供完整的視覺化腳本編輯與排程系統。

主要成果:

  • 無 Root、無後端,完全在手機端執行 RPA 自動化
  • Chat-Driven AI Agent:Gemini ReAct 工具調用(點擊/輸入/截圖/記憶)
  • 可選本地 GGUF 模型(Qwen / Phi / Gemma)離線推論
  • AccessibilityService 語意 UI 樹解析與精準操作
  • JSON 腳本編輯器 + WorkManager 任務排程系統
  • QuickJS 沙盒技能插件系統(Skill Plugins)
  • GitHub 19 ⭐ 公開開源專案
KotlinAndroidAccessibilityServiceGoogle GeminiGGUF / llama.cppWorkManagerQuickJS
Threado 首頁
AI 開發

Threado - Threads AI 排程管理系統

基於 Next.js 的全棧應用,整合 Threads 帳號實現文章管理、AI 自動撰寫與排程發布功能。透過 Google Gemini 根據主題自動生成文章內容,結合 BullMQ 任務排程實現全自動化社群經營流程。

主要成果:

  • Threads OAuth 整合與帳號綁定
  • AI 自動生成 Threads 文章內容
  • BullMQ + Redis 任務排程系統
  • 文章排程發布與狀態管理
  • 支援 Google / GitHub / Email 多方式登入
  • Next.js 15 全棧架構實作
Next.jsTypeScriptGoogle GeminiThreads APIBullMQRedisPostgreSQLPrismaNextAuth.js
ResumeAI 工作區
AI 開發

ResumeAI - AI 智能履歷生成器

面向求職者的 AI 驅動 Web 履歷工作區,透過 Google Gemini 將零散文稿轉換為結構化履歷。支援即時 A4 預覽、對話式增量調整(Cursor 式體驗)、7 種版型切換,最終以瀏覽器列印匯出 PDF。

主要成果:

  • Google Gemini AI 驅動履歷結構化生成(SSE 串流)
  • 對話式增量修改(Cursor 風格編輯體驗)
  • 7 種履歷版型與自訂 CSS 主題切換
  • 即時 A4 分頁預覽與瀏覽器列印 PDF
  • Stripe 商業化(Sprint Pass 所有制功能解鎖)
  • 區塊拖曳排序與可調整欄位寬度
  • Playwright E2E 自動化測試邏輯
Next.jsTypeScriptGoogle GeminiReactTailwind CSSStripednd-kitPlaywrightMarkdown
TryCodeScan 首頁
AI 開發

TryCodeScan - AI 技術債掃描平台

專為 AI 生成代碼設計的全自動化技術債掃描 Web 平台。提供靜態分析、安全漏洞偵測、技術債優先級排序與修復建議,支援 GitHub / GitLab / Bitbucket 接入,並整合 CI/CD 持續整合流程。

主要成果:

  • AI 生成代碼靜態分析與安全掃描
  • 技術債識別與智能優先級排序
  • 支援 GitHub、GitLab、Bitbucket
  • CI/CD 持續整合支援
  • Three.js 粒子系統 3D 背景動畫
  • JWT + GitHub OAuth 雙模式認證
Next.jsTypeScriptNode.jsThree.jsPostgreSQLRedisDockerJWT
方界:破碎祭壇
遊戲開發

方界:破碎祭壇 - 體素 RPG 沙盒遊戲

沉浸式體素風格 RPG 沙盒遊戲,以 Three.js 與 React 打造。玩家在無限生成的程序化世界中探索多樣生物群系、戰鬥升級,並透過 Gemini AI 以自然語言生成體素模型。支援 WebSocket 實時多人互動。

主要成果:

  • PSRD 噪聲算法無限世界地形生成
  • WebSocket 實時多人同步系統
  • 多種敵對 AI(史萊姆/螃蟹/蝙蝠)+ 升級系統
  • 內建體素角色編輯器與動態動畫預覽
  • 滑翔傘、划船、游泳多樣化移動系統
  • Gemini AI 自然語言生成體素模型(實驗性)
Three.jsReactTypeScriptViteWebSocketNode.jsGoogle Gemini
Ticktive 首頁
AI 開發

Ticktive - AI 郵件 ERP 整合工具

AI 驅動的 ERP 整合工具,專為處理非結構化郵件資料設計。透過 AI 自動解析郵件內容並對應 ERP 欄位,支援自定義模板管理、管理員分析儀表板,採微服務架構並完整 Docker 容器化部署。

主要成果:

  • AI 自動解析非結構化郵件並對應 ERP 欄位
  • 自定義郵件處理模板管理系統
  • 管理員統計分析儀表板
  • 微服務架構(前端 / 後端 / 管理)
  • 完整 Docker 容器化部署與熱更新
  • PostgreSQL + Prisma 資料層設計
Next.jsNode.jsTypeScriptExpress.jsPostgreSQLPrismaDockerAI/LLM
CardFlow 首頁
前端開發

CardFlow - 3D 互動名片系統

使用 Next.js 與 Tailwind CSS 4 打造的炫酷互動名片平台,具備 3D 翻轉效果、即時預覽和無限網格展示。使用者可即時填寫個人資訊,卡片即時更新並以精緻動畫呈現正反面詳細資料。

主要成果:

  • 3D 翻轉卡片動畫效果
  • 即時資訊填寫與卡片預覽
  • 可拖拽無限網格展示系統
  • 漸層背景與發光視覺效果
  • 響應式設計支援各裝置
  • Next.js 16 + Tailwind CSS 4 最新技術棧
Next.jsReactTypeScriptTailwind CSS
Promptly 彈窗介面
前端開發

Promptly - AI 提示詞組合器擴充功能

革命性的瀏覽器擴充功能,讓使用者在任何網頁上快速構建專業級 AI 提示詞。自動偵測輸入框並智能推薦相關模板,支援模組化組合與跨平台使用,將提示詞構建時間從分鐘縮短至秒級。

主要成果:

  • 自動偵測網頁輸入框並顯示組合器圖標
  • 智能提示詞推薦(即時顯示於輸入框下方)
  • 模組化提示詞拆解與靈活組合
  • 內建優化過的專業提示詞模板庫
  • 跨平台支援(ChatGPT / Claude / Gemini 等)
  • 一鍵插入完整提示詞至任意輸入框
Chrome ExtensionTypeScriptManifest V3HTMLCSS
Liminal 互動介面
前端開發

Liminal - 互動式 React 開發實驗場

打破「撰寫代碼」與「視覺呈現」之間隔閡的互動式 React 開發實驗場。透過高性能即時滑桿,開發者可在原始代碼與渲染後的 UI 之間無縫穿梭,並體驗獨特的數位雜訊(Glitch)轉場特效,讓代碼與視覺即時同步成為直覺體驗。

主要成果:

  • 即時滑桿無縫切換代碼視圖與 UI 渲染視圖
  • 數位雜訊(Glitch)視覺轉場特效
  • 高性能實時代碼與 UI 同步架構
  • Remix 框架 + Vite 建構
  • Google AI Studio 生成式 AI 驅動開發
TypeScriptReactRemixViteCSSGoogle Gemini
VibeAcademy 課程首頁
教育平台

VibeAcademy - AI 時代軟體工程教育平台

專為 AI 時代設計的軟體工程基礎教育平台。不教學生死記語法,而是培養「與 AI 協作」的思維框架——問題定位、系統設計、精準下指令、評估 AI 輸出、察覺並修正 AI 走偏方向,真正讓學員具備做產品的能力。

主要成果:

  • 四大核心模組:思維框架 / AI 協作 / 軟體工程 / 產品能力
  • 互動式課程頁面(React、TypeScript 實戰單元)
  • 卡片式學習結構,Module → Part → Unit 層次清晰
  • GitHub Pages 線上訪問,零部署門檻
  • Python http.server 本地快速啟動
Next.jsTypeScriptReactTailwind CSSGitHub Pages
AutoLens 錄製介面
桌面應用

AutoLens - AI 智慧螢幕錄製工具

專業的 Windows 桌面螢幕錄製 Electron 應用程式,具備 AI 智慧放大、自動聚焦滑鼠操作區域功能。整合 Gemini AI 自動偵測重要區域,支援音訊混合錄製(系統聲音 + 麥克風),並可添加漸層背景與陰影效果,輕鬆製作高品質教學影片。

主要成果:

  • Electron + React + Vite 跨平台桌面應用
  • AI 智慧聚焦:Gemini AI 自動偵測重要操作區域
  • uiohook-napi 全局滑鼠鍵盤 Hook(無需窗口焦點)
  • 视窗選擇與全螢幕錄製模式
  • 系統聲音 + 麥克風音訊混合錄製
  • 時間軸編輯器+拖曳排序剪輯
  • GIF 影片匯出支援
  • 漸層背景、陰影等專業視覺效果
ElectronReactTypeScriptViteGoogle GeminiTailwind CSSRadix UIBiome
Zettelify 筆記管理
前端開發

Zettelify - 卡片盒筆記法知識管理平台

基於卡片盒筆記法(Zettelkasten Method)的現代化知識管理平台。支援 Markdown 格式筆記、靈活標籤系統、筆記間智能連結關係管理、全文搜尋篩選,以及筆記統計分析,幫助使用者建立、連結並持續發展個人知識體系。

主要成果:

  • Zettelkasten 卡片盒筆記法完整實作
  • Markdown 格式筆記建立與即時編輯
  • 筆記間智能連結與關係圖譜管理
  • 靈活標籤系統(顏色自定義 + 篩選)
  • 全文搜尋 + 統計分析儀表板
  • 淺色 / 深色 / 系統主題切換
Next.jsTypeScriptReactTailwind CSSTurbopack
iT邦幫忙輔助工具 Logo
前端開發

iT邦幫忙輔助工具

一個專為 iT邦幫忙 (https://ithelp.ithome.com.tw/) 設計的Chrome擴充工具,提供更好的編輯體驗和寫作輔助功能。

主要成果:

  • 垂直工具列:將原本水平的編輯工具列轉換為垂直顯示
  • 懸浮定位:工具列固定在左側,不影響編輯區域
  • 拖拽移動:支援拖拽調整工具列位置
  • 快速匯入Notion:一鍵匯入Notion內容到iT邦幫忙
  • 拖拉上傳圖片:支援拖拉圖片直接上傳到編輯器
Chrome ExtensionTypeScriptManifest V3WebpackCSS3
Postly Logo
全端開發

Postly - 反思分享社群平台

專注於個人成長和反思分享的社群平台,讓使用者能夠記錄並分享他們的日常反思和見解。提供每日反思提示、社群互動、個人成就追蹤等功能,使用現代化的 Next.js 和 React 技術構建。

主要成果:

  • 每日精選反思主題與深度思考引導
  • 完整的社群互動系統(按讚、評論、分享)
  • 個人成就追蹤與連續反思紀錄
  • 即時互動通知與參與度分析
  • Google OAuth 認證與安全的使用者管理
  • 響應式設計與無障礙功能支援
Next.js 15React 19TypeScriptTailwind CSS 4NextAuth.jsTanStack QueryHeadless UI
CoinHub App Logo
移動應用開發

CoinHub - 加密貨幣交易與投資組合管理

基於 Flutter 開發的綜合加密貨幣交易和投資組合管理應用程式,提供用戶完整的數位資產管理平台。透過 Web3 和 API 整合,支援多種區塊鏈網路和加密貨幣交易所。

主要成果:

  • 實現即時加密貨幣價格追蹤
  • 建立完整的投資組合管理系統
  • 整合多個區塊鏈網路與交易所 API
  • 實現錢包連結與交易功能
  • 開發圖表視覺化與技術分析工具
  • 建立安全的資料儲存與加密機制
FlutterDartweb3dartWalletConnectfl_chartshared_preferencescryptoWebSocket
Google Form AI 自動填寫工具
AI 開發

Google Form AI 自動填寫工具

使用 Google Gemini AI 來自動填寫 Google Form 的智能工具,只需提供表單網址和基本資訊,即可自動生成填寫用的網址

主要成果:

  • 使用 Gemini AI 智能生成答案
  • 自動解析 Google Form 結構
  • 支援多種題型:簡答題、詳答題、選擇題、下拉式選單等
  • 同時提供純前端應用與 Python 後端版本
  • 完整的使用說明與錯誤處理
HTMLCSSJavaScriptPythonGoogle Gemini AIRESTful API
Synvize 首頁
AI 開發

Synvize

AI 驅動的內容生成平台,能夠自動整合網站、YouTube、新聞和文本等多元資料來源,透過 AI 分析並生成結構化文章。使用者可以編輯生成的內容,並與社群分享。平台內建 AI 助手,協助讀者快速理解文章重點。

主要成果:

  • 多源數據自動蒐集與整合
  • AI 智能分析與文章生成
  • 社群內容分享與互動功能
  • 內建 AI 助手即時解答
  • 自動新聞追蹤與更新
  • 文章編輯與發布系統
Next.jsPythonGoogle GeminiPostgreSQLWeb Scraping
MemoryLane Logo
前端開發

MemoryLane

優雅的 LINE 聊天記錄回顧網站,讓您以全新方式重溫珍貴對話與回憶。支援上傳 LINE 聊天紀錄並以時間軸方式呈現,提供彈幕特效與完全本地處理機制保護隱私。

主要成果:

  • 簡易上傳 LINE 匯出的聊天記錄檔案
  • 精美的按月份時間軸顯示
  • 瀏覽特定月份時顯示隨機對話彈幕特效
  • 所有處理皆在本地完成,保護隱私
  • 響應式設計,支援多裝置體驗
  • 簡潔直觀的用戶界面
Next.js 15.2React 19TypeScript 5Tailwind CSS 4Framer Motiondate-fns 4localStorage
Carbon 代碼美化介面
前端開發

Carbon - 原始碼美化截圖工具

全球知名的開源代碼片段美化工具,將程式碼轉換為高質感分享圖片。支援 100+ 語法高亮主題、自訂字型與背景、URL 永久連結分享,以及 Puppeteer 無頭截圖 API,被全球數百萬開發者使用。

主要成果:

  • 160+ 開源社群貢獻者參與開發
  • 100+ 語法高亮主題(Solarized、Monokai 等)
  • 自訂字型、背景顏色與邊距設定
  • URL 永久連結分享(Firebase 儲存)
  • Puppeteer + Lambda 無頭截圖 API
  • PWA 離線支援
  • 13 種語言 README 國際化
Next.jsReactCodeMirrorPuppeteerFirebaseTypeScriptVercel
VR 恐龍射擊遊戲畫面
遊戲開發

VR 恐龍射擊

VR 射擊遊戲,整合不同專案架構,實現流暢的 VR 射擊體驗

主要成果:

  • 整合多個專案架構
  • 優化 VR 互動體驗
  • 設計怪物生成系統
  • 實現多樣化武器系統
UnitySteamVRVR 開發