FLYER Student · PRD · Onboarding walkthrough · 02/09/2026

Onboarding học sinh mới — exam.flyer.us

Walkthrough 100% các màn onboarding của tài khoản mới tinh trên Phòng thi ảo. Screenshot chụp thật 02/09/2026 bằng tài khoản test (+8412345673362), 1380×900, script tự động — đúng những gì học sinh thấy, không mockup. Phía giáo viên có trang riêng: /onboarding-teacher.

Sản phẩm: exam.flyer.us (FLYER Test)
Persona: HS mới đăng ký lần đầu
Số màn: 15 màn (8 setup + 4 tour + 3 vào bài) + 1 error state
Thời lượng thực tế: ~90 giây nếu đi mạch
Trạng thái: Đang chạy (production)

Đang tìm onboarding phía giáo viên? Xem trang riêng: Onboarding giáo viên — teacher.teado.ai (walkthrough tài khoản mới 100%, wizard 4 bước + đánh giá).

Cấu trúc flow Login → Story 2 màn → Tên → Tuổi → Trình độ → Mã lớp → Home + tour → Thử thách đầu tiên

1Sơ đồ flow

Login (+SĐT/username + mật khẩu) │ ▼ Story #1 — Bingo giới thiệu: quái vật lấy Đá Tri Thức [Đi thôi!] │ ▼ Story #2 — 3 nhiệm vụ: thử thách · đánh Ông Trùm · thu Đá [Bắt đầu nhiệm vụ] │ ▼ Hỏi TÊN ("Tên mình là: ___") [Tiếp theo] │ ▼ Hỏi TUỔI ("Tuổi của mình là: ___") [Tiếp theo] │ ▼ Chọn TRÌNH ĐỘ — 5 card: Foundation Pre-A1 → Upper-Int B2 [Tiếp theo] │ ▼ Hỏi MÃ LỚP (kèm quảng cáo Trợ giảng AI cho GV) │ └── "Bạn chưa có mã lớp? Bỏ qua câu hỏi này." [Tiếp tục] ▼ HOME — tour 3 popup của Bingo: ① "Dải Ngân Hà Bài Thi" (giới thiệu map hành tinh) [TIẾP →] ② "Menu chính" (5 việc làm được) [TIẾP →] ③ "Bộ lọc cấp độ + nhắc KÍCH HOẠT TÀI KHOẢN" [TIẾP →] │ ▼ THỬ THÁCH ĐẦU TIÊN (modal placement) "Bạn đang ở trình độ nào?" A1→C2 · Độ tuổi (6-12/13-17/18+) · Bài kiểm tra ngẫu nhiên [TIẾP →] │ ▼ Galaxy TOEFL PRIMARY → list Thử thách 1-11 → chi tiết đề │ ▼ PHÒNG THI — [TOEFL PRIMARY] Bài thi thử 1 Nghe & Đọc 2 phần · 60 phút · 72 câu · timer chạy ngay

Nhận xét khung: không có OTP verify, không hỏi email, không chọn avatar, không paywall — đúng chuẩn "học trước, gate sau". Toàn flow chỉ 2 field nhập tay (tên + tuổi) + 1 lựa chọn (trình độ) + 1 bước skip được (mã lớp). Sau home còn tour 3 popup + modal Thử thách đầu tiên dẫn thẳng HS vào bài thi thử — tổng cộng 15 màn từ login đến câu hỏi đầu tiên.

2Từng màn — screenshot thật

Màn 0 · Đăng nhập

Login — **URL:** `/login?auth_redirect_url=%2F` · Nhập SĐT hoặc username + mật khẩu. Có link Quên mật khẩu + Đăng ký. Theme không gian tối, đồng bộ với story phía sau.

Màn 1 · Story — Bingo gặp nạn

Story intro — **Copy:** "Xin chào! Mình là Bingo đến từ Hành tinh FLYER. Một con quái vật đã lấy mất những Viên Đá Tri Thức…" · CTA **"Đi thôi!"**. Quái vật hiện mờ ở góc phải trên — foreshadow Ông Trùm. Đây là móc nối thẳng vào hệ Đá Tri Thức (khen thưởng) phía teacher.

Màn 2 · Story — 3 nhiệm vụ

Story missions — **Copy:** "Cùng nhau, chúng mình sẽ: • Hoàn thành các thử thách tiếng Anh • Đánh bại Ông Trùm • Thu thập Đá Tri Thức" · CTA **"Bắt đầu nhiệm vụ"**. Ba gạch nhiệm vụ = ba trục sản phẩm (luyện tập, boss battle, reward).

Màn 3 · Nhập tên

Name — Khung hội thoại BINGO hỏi ↔ BẠN trả lời — nhập tên tự do. Nút **Tiếp theo** disabled (mờ) đến khi có nội dung. Bingo mặc kính râm lái phi thuyền bên phải.

Màn 4 · Nhập tuổi

Age — "Chiến Binh Vũ Trụ ơi, bạn bao nhiêu tuổi rồi?" — đã gọi người dùng bằng danh xưng game hoá. Input số. Tuổi này khả năng cao dùng để gợi ý trình độ ở màn sau (chưa thấy auto-suggest trong bản hiện tại).

Màn 5 · Chọn trình độ (5 card)

Level picker — 5 card: **Foundation Pre-A1** (trứng) · **Pre-Intermediate A1** (gà nở) · **Elementary A2** (gà con) · **Intermediate B1** (gà ngầu) · **Upper-Intermediate B2** (đại bàng). Mỗi card mô tả bằng "Mình có thể…" (can-do statement CEFR, tự đánh giá được ngay cả với trẻ nhỏ). Icon tiến hoá trứng→đại bàng trực quan hoá sự trưởng thành.

Màn 5b · Trình độ đã chọn

Level selected — Card được chọn viền vàng; nút **Tiếp theo** chuyển sang trạng thái active (xanh sáng) ở góc phải dưới. Subtitle trấn an: "(Đừng lo nếu bạn chưa chắc nhé)".

Màn 6 · Mã lớp học

Class code — Bước nối HS ↔ GV: "Giáo viên đã xếp lớp cho bạn trên FLYER chưa? Hãy nhập mã lớp…". Kèm 1 dòng seeding cho GV: *"FLYER tặng miễn phí tài khoản Trợ giảng AI cho giáo viên…"*. Có lối thoát rõ: **"Bạn chưa có mã lớp? Bỏ qua câu hỏi này."**

Màn 6b · Error state — sai mã lớp

Wrong class code — Nhập mã không tồn tại → inline error đỏ **"SAI MÃ LỚP - Vui lòng nhập đúng mã lớp"**, không chặn flow — vẫn skip được. Validation chạy server-side theo mã lớp thật.

Màn 7 · Home — onboarding hoàn tất

Màn 8 · Tour ① — Dải Ngân Hà Bài Thi

Tour 1 — Popup đầu của tour: **"Đây là Dải Ngân Hà Bài Thi"** — giới thiệu map hành tinh cấp độ (SET JUNIOR · TOEFL PRIMARY · STARTERS…). Có nút × tắt sớm và **TIẾP →**. Bingo đứng chỉ tay bên trái.

Màn 9 · Tour ② — Menu chính

Tour 2 — "Bạn ơi, hơi lạc lối một chút phải không?" — liệt kê 5 việc làm được từ Menu chính: luyện kỹ năng · xem thứ hạng · bài tập & lịch sử · thông báo · mini test. Header menu được highlight sáng trong khi nền tối đi.

Màn 10 · Tour ③ — Bộ lọc cấp độ + nhắc kích hoạt

Tour 3 — Bước cuối tour: chỉ vào **bộ lọc cấp độ** (thanh dưới: Tất cả cấp độ · Kiểm tra trình độ · Sổ tay) + seeding monetization đầu tiên: *"Đừng quên KÍCH HOẠT TÀI KHOẢN để mở khóa tất cả tính năng nhé"* (nút Kích hoạt tài khoản có chấm đỏ ở bottom bar).

Màn 11 · Thử thách đầu tiên — modal placement

First challenge — Modal **"THỬ THÁCH ĐẦU TIÊN"**: biểu đồ cột A1→C2 (Bingo leo bậc thang, C2 đội vương miện), chọn **độ tuổi** (Thiếu nhi 6-12 / Thiếu niên 13-17 / Đại học 18+) + dropdown "Bài kiểm tra ngẫu nhiên". Bingo tooltip: "Hỡi Chiến Binh Vũ Trụ, hãy làm thử thách đầu tiên này để xem trình độ của bạn đang ở đâu nhé!" — **đây chính là bước placement mà mục Điểm cần cải thiện đề xuất, có thật nhưng nằm SAU home tour**, không nằm trong flow bắt buộc.

Màn 12 · Galaxy TOEFL PRIMARY — list thử thách

Challenge list — Sau modal, HS được đưa vào hành tinh theo lứa tuổi/cấp đã chọn (10 tuổi → TOEFL PRIMARY): list **Thử thách 1-11** + nút NGẪU NHIÊN + TRỞ VỀ.

Màn 13 · Chi tiết đề thi

Test detail — "[TOEFL PRIMARY] Bài thi thử 1 - Nghe & Đọc" — 2 phần · 60 phút: LISTENING (36 điểm · 30 phút) + READING-WRITING (36 điểm · 30 phút). Màn cuối trước khi vào phòng thi.

Màn 14 · Phòng thi — bắt đầu làm bài thật

Exam room — Phòng thi ảo thật: timer đếm ngược **30:00**, "Đã hoàn thành 0/72 câu", Part 1 (7 questions) "LISTEN AND CHOOSE THE CORRECT ANSWER", audio player + tuỳ chọn "Chọn hình nền". Onboarding kết thúc — từ đây là trải nghiệm làm bài chuẩn của app. **Không còn màn onboarding nào sau bước này.**

3Quan sát & đánh giá UX

Điểm mạnh

Điểm	Chi tiết
Ngắn	Chỉ 2 input + 1 lựa chọn + 1 bước skip. ~90 giây hoàn tất. Không OTP/email — friction thấp nhất có thể.
Kể chuyện có mục đích	Story 2 màn không trang trí suông: Đá Tri Thức + Ông Trùm là hệ thưởng & boss battle có thật trong app — HS bước vào là hiểu vì sao làm nhiệm vụ.
Can-do statement khi chọn level	Không dùng nhãn A1/B2 khô cứng làm chính — mô tả "Mình có thể nói về gia đình…" giúp trẻ tự chọn đúng hơn. Icon trứng→đại bàng thông minh.
Seeding 2 chiều	Màn mã lớp vừa nối HS vào lớp GV, vừa quảng cáo Trợ giảng AI miễn phí cho GV — một màn phục vụ 2 phễu.
Error không chặn	Sai mã lớp vẫn skip được — không ai kẹt ở onboarding.

Điểm cần cải thiện

Vấn đề	Màn liên quan	Mức	Đề xuất
Tuổi đã hỏi nhưng không auto-gợi ý trình độ — 10 tuổi vẫn thấy cả B2	Màn 4 · Tuổi Màn 5 · Trình độ	Trung bình	Pre-select card theo tuổi (10 tuổi → highlight Foundation/A1), vẫn cho đổi
Không có placement test ngay trong onboarding — tự chọn level dễ lệch	Màn 5 · Trình độ	Trung bình	Thêm lựa chọn thứ 6: "Làm bài kiểm tra 5 phút để FLYER xếp giúp" → trỏ vào Kiểm tra đầu vào có sẵn
Nút "Tiếp theo" disabled trông giống enabled mờ — trẻ em bấm nhiều lần không hiểu vì sao	Màn 3 · Tên Màn 4 · Tuổi	Thấp	Thêm shake animation / tooltip khi bấm lúc chưa điền
Không thể quay lại màn trước (no back)	Màn 5b · Đã chọn	Thấp	Thêm nút back nhỏ, nhất là màn trình độ
Nhập tuổi tự do (có thể gõ 99)	Màn 4 · Tuổi	Thấp	Giới hạn 4–18 hoặc dropdown
Tour giới thiệu home tồn tại (popup "Dải Ngân Hà Bài Thi") nhưng dễ tắt bằng × và chưa dẫn tới 1 hành động cụ thể	Màn 7 · Home	Cao	Kết thúc tour bằng CTA hành động ("Làm bài đầu tiên nhận 50 coin") thay vì chỉ giới thiệu; đo tỉ lệ tắt sớm

Phát hiện kỹ thuật khi chạy walkthrough: form login submit native (GET) nếu bấm trước khi JS hydrate xong → lộ mật khẩu trong URL /login?identifier=…&password=…. Người dùng mạng chậm có thể gặp thật (bookmark/history/log sẽ chứa password). Nên đổi form thành method="post" hoặc chặn native submit ngay từ server-rendered HTML.

4Data ghi nhận phía sau

Tên → learner_profiles.display_name (hiển thị ngay header home: "MINH ANH").
Tuổi → learner_profiles.date_of_birth (hoặc field tuổi tương đương).
Trình độ → gắn placementLevel / test_level khởi điểm — quyết định map luyện tập mặc định.
Mã lớp (nếu nhập đúng) → class_students join lớp GV ngay từ onboarding.
Trạng thái onboarding lưu server-side — login lại đi thẳng home, không lặp story.

Acceptance criteria (đã kiểm chứng bằng walkthrough 02/09/2026)

Tài khoản mới login lần đầu → thấy story 2 màn đúng thứ tự.
Không điền tên/tuổi thì không đi tiếp được (nút disabled).
Chọn 1 trong 5 trình độ mới mở nút Tiếp theo.
Mã lớp sai → báo "SAI MÃ LỚP", vẫn skip được.
Hoàn tất → home đầy đủ menu, tên hiển thị đúng, Coin/Kim cương khởi tạo = 0.
Login lại lần 2 → bỏ qua onboarding, vào thẳng home.

← Danh mục PRD · PRD Tài khoản & hồ sơ người chơi · Kiến trúc hệ sinh thái · Roadmap