巨匠 AI 英語口說練習平台

2024/07 ~ 現在

全端開發
資料庫設計
AI 應用
語音辨識
已交接
精選

結合 AI 對話與語音辨識的英語口說練習系統,提供即時發音評估、學習分析報告與多層級互動練習

巨匠 AI 英語口說練習平台

採用技術

React 19

前端框架,搭配 Vite 建構現代化 SPA 介面

FastAPI

Python 非同步 API 框架,處理後端業務邏輯

PostgreSQL

關聯式資料庫,儲存使用者與學習紀錄

SQLAlchemy 2.0

全非同步 ORM,搭配 Alembic 管理資料庫遷移

OpenAI API

GPT 驅動 AI 對話引擎與發音評估

Azure Speech Services

語音轉文字(STT)與發音分析

Docker

容器化部署,支援多環境配置

Tailwind CSS

Utility-first CSS 框架

專案介紹

SoEasyEdu Speak 是一款 AI 驅動的英語口說練習平台,讓使用者透過與 AI 即時對話來練習英語口說能力。系統整合 OpenAI GPT 進行智慧對話與內容評估,搭配 Azure Speech Services 實現語音辨識與發音分析,並提供詳細的學習成績報告。

後端採用 FastAPI 全非同步架構搭配 PostgreSQL 資料庫,前端使用 React 19 + Vite 建構,透過 Docker Compose 實現多環境容器化部署。

核心功能

AI 即時對話練習

基於 OpenAI GPT 的對話引擎,支援「指定情境」與「評估測驗」兩種對話模式,根據學習者程度動態調整難度。

語音辨識與發音評估

整合 Azure Speech Services 進行即時語音轉文字,並透過 AI 分析發音準確度,提供 50-60-80-100 分級的詳細回饋。

多層級學習系統

支援多個學習等級,每個等級包含結構化的對話流程(ChatFlow),以 JSON 設定驅動學習進度與問答內容。

學習分析報告

完整記錄每次對話的成績、發音回饋與進步趨勢,提供學習者與管理者數據化的學習成效分析。

後台管理系統

管理者可透過後台管理學習紀錄、建立與編輯學習等級、查看評估群組數據,並監控系統運作狀態。

技術架構

前端

React 19 搭配 Vite 為核心,使用 React Router v7 管理路由,Tailwind CSS 建構自訂主題介面(紫色主色調 + 橘色輔助色),Axios 處理 API 通訊。

後端

採用 FastAPI 全非同步框架,透過 SQLAlchemy 2.0 搭配 asyncpg 驅動進行非同步資料庫操作,使用 Alembic 管理 Migration,Poetry 管理 Python 依賴。

AI 與語音服務

對話引擎與內容評估使用 OpenAI API(GPT + TTS),語音辨識整合 Azure Cognitive Services Speech SDK,音訊處理使用 SoundFilePyDub 進行格式轉換。

認證與安全

JWT Token 認證機制搭配 bcrypt 密碼雜湊,支援管理者與一般使用者雙角色系統。

部署

Docker Compose 多環境部署(Local / Dev / Prod),搭配 Nginx 反向代理、PostgreSQL 資料庫容器與 PgWeb 管理介面。

資料庫設計

使用 PostgreSQL 搭配 SQLAlchemy 2.0(async),以狀態機模式管理學習紀錄的生命週期,從建立、對話、結束到評分,完整追蹤每次學習歷程。

資料表 說明 關鍵欄位
users 學習者帳號(UUID 識別) id, name, email
managers 管理者帳號(密碼雜湊儲存) id, username, password_hash

API 設計

基於 FastAPI 設計 RESTful API,全面採用非同步處理以支撐即時語音對話場景:

對話與語音 /api/records

建立學習紀錄、發送語音訊息、接收 AI 回覆、語音轉文字處理

學習等級 /api/chat-levels

等級 CRUD、ChatFlow JSON 設定管理、批次匯入(Excel 轉 API)

評估系統 /api/evaluate

AI 發音評估、內容準確度分析、分級回饋產生

使用者管理 /api/users / /api/managers

學習者與管理者帳號管理、JWT 認證、Token 配額追蹤

工具服務 /api/tools

音訊格式轉換、TTS 語音合成、系統健康檢查

部署架構

多環境 Docker Compose 配置

支援 Local(直接連線)、Development(Nginx + Hot Reload)、Production(Nginx 反向代理 + 優化建構)三種部署環境,所有環境皆包含 PostgreSQL 資料庫容器與 PgWeb 資料庫管理介面。

服務組成

Frontend(React SPA)、Backend(FastAPI + Uvicorn)、PostgreSQL 15、Nginx 反向代理、PgWeb 資料庫管理、共享音訊檔案 Volume。