Online Course Platform

Focusing on the UX and reducing the handoff process

role
UX Designer
team
Clients
Developers
period
Oct-Dec 2020
image of the online course platform

BACKGROUND

To focus on the user experience and differentiate from other online courses platforms, we listed up all the useful functions after conducting competitive analysis and combined them into one powerful online courses platform. We implement the Ant design system in order to reduce the ui design process and the hand-off process between ui design and front-end development.


DESIGN DETAILS

Create a course
There are 4 different sections in the create course page- Information: where the users fill in the basic info of the course; Curriculum: this is where the course contents (Reading/Video/Live Video) being created; Pricing: where the users set prices and the discount; Settings: the course setting such as pre-order, private link. etc...

image of the payment status page
image of the content editing modal

Content editing modal

image of the video editing modal

Video editing modal

Learners and Instructors
Where the users can manage all the learners and instructors. The Learners page is filter by leaners' statuses of which chapters they have completed.

image of the leaner status page

Learner status

image of the instructor status page

Instroctor status


OTHER FEATURES

Inbox page is where the instructor users can view and respond to all the messages and comments from the leaners.
Homework page is where the instructor users can review the homeworks that the learners created.

image of the inbox page

Inbox page

image of the homework page

Homework page