Etomon is a virtual education platform where users can access well online courses to acquire different knowledge and new skills. Additionally, it empowers instructors to provide their unique teaching experience in a large variety of subjects.
Before designing this online education platform, our team divided the entire ecosystem into multiple small design tasks for following sprints because of the large project scope and tight timeframe. I took main responsible for 3 of them：
Create interfaces that helps students find their favorite course and drive them to enrollment in simple a way.
Improve the experience for students to enroll & checkout a course during the payment processing.
Design a complete workflow for instructor registration, verification and course publication.
I need to learn about the benefits of e-learning and the reason why student opting for online education initiatives instead of traditional methods of learning. Therefore, I created research protocol and questionnaire asking users to talk about their e-learning experience.
With new technologies developments and instructional strategies, the online education continues to remain a steady rising trend both in the number of enrolled students and commercial marketing.
After analyzing, the main target users is aged 18- 35, such as students and technical employees and instructors.
“When I face challenges within studies, I would like to seek help from others.”
Students need to easily find private tutors/teachers in order to help their study.
“I cannot ensure the teaching quality of unacquainted tutors”
Employees need to make sure the quality of teaching in order to launch or advance their career.
“I rely on educational agencies to find students. However, agencies would charge a fee.”
Instructors need to find student sources in order to increase their incomes.
After research and analytics, I informed simple and institutive user journey map from student perspective.
I sketched preliminary wireframes and workflows. Then, I presented my ideas and get critiques from the internal team review.
I illustrated my initial concept for this task to create an appealing homepage & course detail page that helps students find their favorite course and drive them to enroll it in as quick and simple a way as possible. Also, I talked about the possible ideas that I could include on the first prototype.
The initial prototype aims to test visual aspects and usability of my design solution. I created a series of protocol and interview questions, then conducting multiple rounds of user testing.
After user testing, I gained an overall impression of the interface/interaction from users. I analyzed the feedback in order to make necessary changes to my high-fidelity prototype.
“I have to handle multiple actions before searching because too many filter options and they limits the scope of results out of the comfortable range.”
“It has low contrast between some interface elements, like course detail cards. It makes these visual compositions hard-to-read.”
“Course Description is clear but sounds like a robot. It is not engage to read long paragraphs merged together. It doesn't help me know how the course resolve my issues.”
“Separate the blocks of course description clearly and use more space to visually separate different blocks of information.”
“The time conflict error is only indicated by using color on the timetable. There is no actionable feedback to ease the process for a correct entry.”
“Chat box is available on profile page only. However, I may need more clarification about course through chat before I enroll one. Good to have a chat link on the course page .”
In order to minimize visibility issues and improve aesthetic & consistency of design, I followed and maintained the established Etomon style guide with comprehensively annotated design specs to create high-fidelity prototype.
After users enrolled, they need to checkout their on-demand course. The platform offers 3 different course types and each type of course has different checkout process. (E.g. One-time course only need to be paid once, but long-term section courses need recurring payments.) Therefore, my second task is to improve simple, secure and worry-free checkout experience.
The idea is accepting a wide range of payment methods, including 3rd-party payment. However, just adding multiple payment options could introduce complexity to the checkout process. Besides, the price may be affected by other factors such as free trials & promotions. These courses and payments information needed to be display in a clear way. I sketched the workflow and defined which of the features were more fitting to resolve these problem.
User experience wouldn't end after they've complete checkout process. By contrast, we should give clear instructions to users on the next steps in order to ease their potential concerns.
The checkout is one of the most complicated process in the project. The possibility of error occurs likely increase here. For example, when users manually entered card information into a payment form, a typo error might creep in. I discovered that users were frustrated because of such errors and likely abandon their course enrollment. Therefore, providing a checkout experience for user as smooth as possible.
After I completed the first 2 tasks, I diverted my sight from the student to the teacher's side. The design challenge is that the workflow of becoming an instructor was kind of confusing, especially for first time users. Therefore, this task aims to improve this journey for users to register as instructors, verify qualifications and publish their course on the site.
Before I jumped into proposing a new design, I tried to go through the instructor registration & course creation process and analyzed existing features. I collaborated with PM and evaluated qualitative data in order to know if other users feel the same as I did when they were trying to become an instructor.
I found the most common issues users encountered are being unable to complete burdensome process, as well as not knowing where they are in the process without a clear indicator. These issues could cause users getting frustrated and abandoning a half-completed registration/course creation. Therefore, I optimized the information architecture to tackle those problems.
The use of mobile devices in online courses was widespread. The web interface is designed that look good on all devices, since a sizeable group of learners expressed a desire to complete their course on a smartphone or tablet.
