HSK-Leveled Mandarin Reading Platform
A Mandarin reading platform for adult learners, organising HSK 1–6 content, Hanzi, pinyin, vocabulary, audio and quizzes into one responsive learning experience.
2026Inside the system
A closer look at the operating problem, implementation approach and concrete scope of delivery.
The challenge
Content arrived from WordPress with inconsistent structures and membership states. The frontend needed to preserve reading quality while handling taxonomy, HTML sanitation, public previews, authentication and locked content correctly.
System approach
A Next.js content layer fetches and sanitises WordPress REST data, maps articles to HSK 1–6, standardises search, detail, audio, vocabulary and quiz modules, and uses PMPro checks to control access states.
Delivery scope
Built the component system, responsive UX, content API integration, HTML parsing and normalisation, article rendering, HSK taxonomy, authentication, membership gating and reusable reading modules.
Selected system views
Supporting interfaces are curated and anonymised. Open an image to view it at full size.
Leveled reading and interactive learning overview
The poster combines the reading hero, HSK-level library and article detail to show the complete journey from content discovery to sustained learning.
Learning-platform homepage
The homepage organises recommendations, learning entry points and product value so learners can quickly choose an appropriate reading path.
Editorial homepage hero
The editorial hero explains HSK 1–6 levels, audio support and progress tracking, lowering the entry barrier for adult learners.
HSK-level content library
The library filters by HSK level, topic and content type while presenting article previews and membership access states consistently.
Article reading experience
Article pages combine Hanzi, pinyin, vocabulary, audio and quizzes into a continuous, readable learning rhythm.
Leveled content and membership workflow
Sanitised WordPress content is mapped to HSK levels and routed into search, reading, audio and quiz modules, with previews and full access controlled by membership state.
Core deliverables
- 01
HSK 1–6 content taxonomy
- 02
WordPress content sanitation
- 03
Audio, vocabulary and quiz modules
- 04
Membership access and locked previews