全部案例
04教育科技

HSK 分級中文閱讀與互動學習平台

面向成人中文學習者的 HSK 1–6 分級閱讀平台,把內容搜尋、漢字、拼音、詞彙、音訊及測驗組成連續學習體驗。

2026
System / Delivery

系統內容介紹

從實際業務流程出發,說明系統所解決的問題、實現路徑及具體交付範圍。

內容來自 WordPress,文章結構及會員狀態並不完全一致。前端既要保持閱讀體驗,也要正確處理等級映射、HTML 清理、公開預覽、登入及會員鎖定。

Next.js 內容層讀取及清理 WordPress REST API 數據,把文章映射至 HSK 1–6,統一搜尋、文章詳情、音訊、詞彙及測驗元件,並透過 PMPro 檢查控制存取狀態。

負責元件系統、響應式體驗、內容 API 整合、HTML 解析與標準化、文章渲染、HSK 分類、認證流程、會員權限及可重用閱讀模組。

Interface / Detail

系統介面節選

以下為經整理及脫敏的功能介面,點擊圖片可查看完整尺寸。

分級閱讀與互動學習全景
Overview

分級閱讀與互動學習全景

展圖組合閱讀主視覺、HSK 分級內容庫及文章詳情,呈現由內容發現到持續學習的完整體驗。

學習平台首頁
02

學習平台首頁

首頁組織推薦內容、學習入口及產品價值,讓學習者快速進入合適的閱讀路徑。

首頁閱讀主視覺
03

首頁閱讀主視覺

閱讀主視覺清晰說明 HSK 1–6 分級、音訊支援及進度追蹤,降低成人學習者的入門門檻。

HSK 分級內容庫
04

HSK 分級內容庫

內容庫支援按 HSK 等級、主題及內容類型篩選,並統一呈現文章預覽與會員存取狀態。

文章閱讀詳情頁
05

文章閱讀詳情頁

文章詳情整合漢字、拼音、詞彙、音訊及測驗內容,保持連續而清晰的閱讀節奏。

分級內容與會員存取流程
06

分級內容與會員存取流程

WordPress 內容經清理及等級映射後進入搜尋、閱讀、音訊與測驗模組,並按會員狀態控制公開預覽及完整存取。

04

核心交付

  1. 01

    HSK 1–6 內容分類

  2. 02

    WordPress 內容清理與渲染

  3. 03

    音訊、詞彙及測驗模組

  4. 04

    會員存取與鎖定預覽

下一項案例
05 / AI 應用與健康科技

個人化營養與 AI 餐牌分析平台

諮詢技術對接