Rise Start

IllustrationAnimationEdutainmentInstructional Design

23 Dec

Client: Highwood Education and RISE Education Cayman Ltd

The Challenge

Audience: Preschoolers aged 4 to 6 years old
Responsibilities: Instructional design (action map, storyboards, mock-ups, prototype), Visual design, eLearning Development
Tools Used: Adobe Photoshop, Adobe Illustrator, Esoteric Spine, Google Docs, Google Sheets, HTML and Javascript

RISE START is a cutting-edge digital learning program from RISE Education, designed for preschoolers aged 4 to 6 .

The client sought interactive and engaging lessons on 12 key themes: letters, numbers, colors, animals, body parts, action verbs, jobs, weather, shapes, patterns, musical instruments, and holidays. The challenge? Capturing the attention of young learners with limited English skills.

The Process

Collaborative Planning

We worked closely with the school to create an action map that clearly outlined the learning outcomes for each theme. This collaboration guided the development of 73 lessons across 12 themes, ranging from letters to holidays, all tailored to engage preschoolers with limited English skills.

To keep learners motivated, we integrated gamification into the lessons, such as visual badges and interactive moments, rewarding students for completing sections. These elements not only sustained engagement but also made learning fun, helping students retain key information.

Additionally, we embedded micro-assessments throughout the lessons. These simple, interactive quizzes provided immediate feedback, enabling students to self-correct and stay on track. The assessments also offered valuable insights to educators, helping them adapt lessons in real-time to better meet the students' needs.

Storyboarding

We began by developing a detailed storyboard in Google Docs, outlining each key section of the course. A timeline was also created in Google Sheets to ensure the project stayed on track.

Mock-ups & Character Design

High-fidelity mock-ups were crafted in Photoshop to visualize the structure and flow of the lessons. We designed characters inspired by the school’s mascots, ensuring they were relatable for the preschoolers. These characters were then animated using Esoteric Spine, bringing them to life with interactive features like running across bridges and playing musical instruments.

Animation of a hippo like character dancing

Animation of a crocodile like character nodding and pointing

Scene from the educational tool showing three tappable characters. When tapped each one does a different motion - walk, run and jump - with an animation matching it. In the foreground there's a fourth character, leading the lesson.

The animations started simple but became more complex over time, letting the characters do things like run on bridges and play instruments in a band.

Animation of three characters moving on a bridge towards the viewer. There's a monkey like character running, a crocodile like character walking and a cat like character jumping.

Development

The development process involved creating all 73 lessons, complete with animations, interactive elements, and assessments. Our team worked collaboratively, with each member handling different tasks: instructional design, technical content, background creation, character development, and user interface design.

To streamline collaboration and reduce revision cycles, we built a Level Editor that allowed for quick adjustments and efficient editing. This tool eliminated tedious micro-edits, speeding up the development process. After multiple rounds of review and feedback from both the client and educators, we finalized the lessons, delivering polished animations and engaging content—on time.

Throughout the project, we regularly sent builds to the client for feedback, ensuring that all revisions were promptly addressed and the final product met their expectations.