Skip to main content

Apply cấu hình lộ trình học sang màn hình học tập cá nhân

1. Mục đích

2. Yêu cầu

  • Người dùng có thể học tập được cả mobile và web
  • Nếu người được gán lộ trình và được gán cả khóa học thì khóa học đó sẽ không hiển thị ở trang chủ nữa

3. Chi tiết

3.1. WEB

  • Trang chủ:

    •  

      image.png

       

    • Gồm 2 tab Cần học; Đã hoàn thành
    • Khi user chưa học tập hoặc đang học tập thì lộ trình ở trạng thái cần học
STT Thông tin Quy tắc Ghi chú

Lộ trình học (Đếm số lượng các lộ trình cần học của user hiện tại)  

Card từng lộ trình

Hover vào thì  lộ trình thì hiển thị đang chọn

Hiển thị tối đa 05 lộ trình trên 1 dòng

Nút điều hướng: Bấm cuộn xem các thẻ tiếp theo.

Bấm chi tiết vào từng lộ trình để mở ra chi tiết màn hình học tập của lộ trình

Trong từng lộ trình Icon icon mặc định của các lộ trình

Tên lộ trình

Hiển thị tên lộ trình

Tối đa 2 dòng, dài hơn thì hiên thị...



icon + <số lượng> khóa học


Trạng thái từng lộ trình

  • Cần học
  • Đang học
  • Hoàn thành


Bấm vào chi tiết lộ trình:  

 

image.png
STT Thông tin Quy tắc Ghi chú
1 Tiêu đề lộ trình Hiển thị thông tin tiêu đề lộ trình  
2 Thanh trạng thái lộ trình Hiển thị tỉ lệ hoàn thành lộ trình = số khóa học hoàn thành / Tổng khóa học trong khóa  
3 Các khóa học trong lộ trình

Bổ sung thêm các trạng thái của khóa học trong lộ trình:

  • Hoàn thành
  • Chưa bắt đầu (Tất cả các bài học trong khóa chưa bắt đầu)
  • Đang học (Có 1 bài học trong khóa Đang học hoặc hoàn thành)


 

Thể hiện bẳng icon    

 

image.png

Lưu ý: 

Nếu lộ trình bắt buộc học theo thứ tự thì nếu khóa nào chưa đc thì hiển thị icon " KHÓA"  --> Bấm vào hiển thị toast thông báo "Vui lòng học tập theo các khóa học được sắp xếp theo thứ tự" 

Còn lộ trình tự do thì bắt đầu từ khóa nào cũng đc

 

 4 Button "Bắt đầu lộ trình"   Bấm vào để bắt đầu khóa học đầu tiên trong lộ trình

3.2. Mobile

https://www.figma.com/design/rVsYisPzgmm0jptNAqDEPp/Homepage?node-id=11005-6800&t=EGo7ldE6q98raqU5-4

  • Tương tự các trường như web 

 

image.png
STT Thông tin Quy tắc Ghi chú

Lộ trình học (Đếm số lượng các lộ trình cần học của user hiện tại)  

Card từng lộ trình

Hover vào thì  lộ trình thì hiển thị đang chọn

Hiển thị tối đa 05 lộ trình trên 1 dòng

Nút điều hướng: Bấm cuộn xem các thẻ tiếp theo.

Bấm chi tiết vào từng lộ trình để mở ra chi tiết màn hình học tập của lộ trình

Trong từng lộ trình Icon icon mặc định của các lộ trình

Tên lộ trình

Hiển thị tên lộ trình

Tối đa 2 dòng, dài hơn thì hiên thị...



icon + <số lượng> khóa học


Trạng thái từng lộ trình

  • Cần học
  • Đang học
  • Hoàn thành


    

image.png

 

STT Thông tin Quy tắc Ghi chú
1 Tiêu đề lộ trình Hiển thị thông tin tiêu đề lộ trình  
2 Thanh trạng thái lộ trình Hiển thị tỉ lệ hoàn thành lộ trình = số khóa học hoàn thành / Tổng khóa học trong khóa  
3 Các khóa học trong lộ trình

Bổ sung thêm các trạng thái của khóa học trong lộ trình:

  • Hoàn thành
  • Chưa bắt đầu (Tất cả các bài học trong khóa chưa bắt đầu)
  • Đang học (Có 1 bài học trong khóa Đang học hoặc hoàn thành)


 

Thể hiện bẳng icon    

 

image.png

Lưu ý: 

Nếu lộ trình bắt buộc học theo thứ tự thì nếu khóa nào chưa đc thì hiển thị icon " KHÓA"  --> Bấm vào hiển thị toast thông báo "Vui lòng học tập theo các khóa học được sắp xếp theo thứ tự" 

Còn lộ trình tự do thì bắt đầu từ khóa nào cũng đc

 

 4 Button "Bắt đầu lộ trình"   Bấm vào để bắt đầu khóa học đầu tiên trong lộ trình

MỘT SỐ LƯU Ý KHI HỌC TẬP CÁC KHÓA HỌC TRONG LỘ TRÌNH

Rule 1 – Hoàn thành lộ trình

  • IF tất cả khóa học = Completed
    → Lộ trình = Completed

Rule 2 – Đang học lộ trình

  • IF tồn tại ít nhất 1 khóa học có trạng thái Not Started / In Progress / Overdue
    → Lộ trình = In Progress (Cần học)

Rule 3 – Gắn cờ quá hạn lộ trình

    • IF ngày hiện tại > hạn hoàn thành lộ trình
      AND lộ trình ≠ Completed
      → Gắn cờ Overdue

Trường hợp nghiệp vụ đặc biệt (Key Case)

Trường hợp: Lộ trình đã quá hạn, trong lộ trình có ít nhất 1 khóa học đang học (In Progress)

Kết quả:

  • Trạng thái lộ trình = In Progress (Cần học)

  • Cờ trạng thái = Overdue (Quá hạn)