Yola Case Study

Online Language Learning
Platform in Vietnam
Laptop screen showing an educational dashboard with progress overview of class course progress, a graph of class lesson grades, and a list of lessons with details. The progress bar indicates 4 of 41 lessons completed. The grade graph tracks top, average, and bottom scores across three lessons. A student watchlist on the right shows three students with their names, photos, and average scores around 67-71%. The announcements section lists three messages from Mrs. Nguyen reminding students to bring class materials, each with a timestamp.

Client Overview

​Yola Institute is a premier provider of educational services in Vietnam providing a wide range of educational programs and products. These include test preparation courses, English language, soft-skill training, after-school learning and several other services.

Screenshot collage of an educational platform user interface showing progress charts, course completion status, student performance scores, and lesson plans with homework and activity details.

Project Goal

Yola was looking to use the Open edX platform to build personalized study roadmaps, improve student outcomes and create an active learning community through the following measures:

Tracking student progress

Sharing targeted resources to help students achieve outcomes

Identify medium-risk students and help them more effectively

Blending learning with personalized learning for students

Medium-term goal to create stand alone online only course

Services Provided

Learning Platform Setup,Advanced Software, Customization & Hosting
Instructional Design,Technical Support, Software Architecture
UI/UX Design, Project Management, Python Software Dev
Front-end development (HTML/CSS/JS), Product Development Operations

Approach

We worked towards process optimization with mapping processes to determine the starting point and the ‘Actual State’.

UX Consulting, Review and selection of the technologies was done with the client along with weekly delivery of developments keeping the end user involved in the process of development and testing.

Lastly, we determined the KPIs, reports and other metrics in order to monitor the process.

Tools

JavaScript logo
Javascript
Python logo
Python
amCharts logo
Amcharts
jQuery logo
Jquery

UX Research and Discovery with YOLA team

Affinity Mapping Exercise

Student User Testing Volunteer

Student User Flows

Person with glasses looking at a whiteboard covered with multiple sticky notes arranged in columns and handwritten notes, diagrams, and arrows in blue and red marker related to lessons and student assessments.
Multiple overlapping browser windows showing an educational course interface on a blue and white platform named Yola, featuring course navigation links, user profiles, vocabulary activities like flash cards and matching, video introduction, and graded assignments.

Opportunities

Multiple roles

Yola user role management in Open edX

dashboards

Custom dashboards for student, teacher and parents

activities

Online activities like Auto generated MCQs, etc.

custom grading

Customized grading system for homework

registration

User registration in with YOLA Student Information System

feature management

Vocabulary management for class work with schema file upload

Solution

Interactive learning experiences were defined, designed, and implemented, resulting in more engaged students, more learning, and higher grades and test scores.

Advanced online activities: Match the pair

Screenshot of an online vocabulary matching activity showing five words—Down Pour, Storm, Weather, Clouds, Pasta—linked to the same definition: "The state of the atmosphere at a place and time as regards heat, dryness, sunshine, wind, rain." On the left, study progress shows 1 of 8 completed with one correct and one incorrect attempt; a blue Restart button is below. At bottom right, a blue Next button invites trying the next set.

Advanced online activities: MCQs

Screenshot of an online vocabulary activity showing multiple choice questions and study progress with 3 correct and 2 incorrect answers, and a highlighted correct answer for the definition of weather.

Advanced online activities: Flashcards

Online flashcards activity interface showing completed study progress at 120 of 120 with a green progress bar. Main message reads 'Great Job, You've got through all the flashcards!' with blue buttons labeled 'Restart and Shuffle' and 'Back to Vocab'. Navigation arrows are at the bottom.

Vocabulary Management

Screenshot of an online learning platform showing a course navigation sidebar with lessons focused on verbs and an active lesson titled 'Lesson 2: Introduction + Listening and Speaking.' The main panel displays a tooltip definition for the noun 'Suction cup' describing it as a cup-shaped object made of rubber, glass, or plastic used to adhere to surfaces, with an example sentence. Behind the tooltip, instructional text explains how to watch an introduction video and navigate the course, and a video player with a welcome message is partially visible at the bottom.

Custom Dashboards for Teachers

Custom dashboard interface showing progress overview with class course progress bar at 4 of 41 lessons completed, and a color-coded class lesson grades graph for lessons on verbs and vocabulary. The right side features a student watchlist with three student placeholders and their average percentages of 67%, 70%, and 71%. Below is an announcements section listing recent messages from Mrs. Nguyen about bringing class materials, with timestamps on June 20 and June 21, 2017.

Customized grading system for homework

Student Le Thi Lam 'Kyle' with grades for Lesson 2: Introduction + Listening and Speaking, submitted 09/09/2017, no parent signoff. Fixed response questions show 4 out of 5 correct with a green progress bar. Essay prompt and student answer text area are shown with repeated hipster-style placeholder text. On the right, prompt grading categories Ideas, Pronunciation, Fluency, and Intonation and Expression are rated on a scale of 1 to 4, with Ideas at 4 Mastery, and the others at 3 Proficient. Each category has space for additional comments.

Custom Dashboards for Students and Course Information

Dashboard interface showing current lesson 'Lesson 0: Verbs I' due on 20/06/2017 with option to open homework, a progress bar indicating 4 out of 41 lessons completed, a line graph of lesson grades over time, a Word of the Day section defining 'linguistic' with pronunciation and example, exam dates for Midterm and Final tests, and a section for announcements.

Vocabulary Management for classwork with schema file upload

Screenshot of a vocabulary management interface titled 'Lesson 1: Blah Blah Words' with six colorful cards describing words: suction cup (noun, cup-shaped object used to adhere to surfaces), remora (noun, fish that attaches to other fish), skinny (adjective, very thin), attach (verb, to fasten or connect), hitchhike (verb, travel by getting free rides), and from the sharks point of view (phrase, like the shark sees it). Each card shows examples and some include a hover-to-show image prompt.

Separate apps for each module in Common Django app

Each app can work independently and can communicate effectively similar to Django apps

Created apps in common so in future if data needs to be accessed by CMS, it can be done easily

Flow chart with Open edX Platform at the top, connected to three nodes: LMS, Common, and CMS, with Common further connected to Teacher, Student, and Parent nodes.

Results

The platform resulted in a significant improvement in learning skills among enrolled students and continues to increase the percentage and learning interest in students.

Parents got the access to view their child’s progress and contact teachers
Parent got the ability to sign homework online for teacher’s grading
Completed the integration with Yola Information System
Teachers find the platform easy to use, convenient and organized