I designed an edtech experience from the ground up

Rafaela Kwiatkowski
20 de jun.
4 min de leitura

Atualizado: há 7 dias

🐙 This is Octolearn

An online learning platform focused on medium and long-term courses. It uses gamification techniques to attract, engage and reward students throughout their learning journey.

📋Overview

The challenge was to create an engaging experience that could sustain learner motivation over time. The platform is centered around gamification using elements like rewards, progress tracking, and personalized feedback to make learning more dynamic and rewarding.

🎉Results

The platform translated core educational goals into an intuitive, gamified interface. Usability tests showed that users felt more motivated, understood their learning paths clearly and appreciated the balance between learning and fun. Early feedback confirmed that the system supports long-term engagement and offers a user-friendly learning experience.

👩‍💻My contributions

As part of the design team, I collaborated on all stages of the project from research and user flows to wireframes, UX writing, and final UI design.

📅Phases

Discovery → User Research → Ideation → Wireframing → Testing → Prototyping → Testing → Launch

🧐 Problem Statement & context

Online courses have a dropout rate of up to 80%, for several reasons, including breaking of expectations, platforms with poor usability, lack of support and interaction.

One way to decrease evasion rate in distance learning is gamification. Applying game strategies to learning activities can go beyond entertainment, it can increase engagement and autonomy of the participants and promote continuous learning.

🔍 Research

Benchmarking

We analyzed learning platforms (e.g. Duolingo, Kahoot, Alura) to identify strengths and opportunities. Key takeaways:

Use of badges, points, streaks, and social features boost engagement.
Simple, clear navigation and content hierarchy are critical for focus.
Micro-interactions and progress visibility help sustain motivation.

The process of UX research

We followed a mixed-method approach:

CSD Matrix to gather data of what is already known, hypotheses, what is still unknown and needs to be investigated.
User profiling to identify learning motivations and barriers.
Quantitative research: a survey answered by 100 students, with questions to gather general insights and data.
Semi-structured user interviews to understand experiences in-depth and find answers to our hypotheses.
Data analysis to analyse everything we gathered in the previous steps and acknowledge needs and desires.

Research insights

Social elements (challenges, rankings) increase long-term retention.

Up to 2 hours are dedicated to studying daily.
The main difficulties in following an online course were: lack of interaction with other students, followed by lessons always presented in the same way.
The main reason for dropping out of an online course was the lack of personal organization about their routine and study journey”.
Some of the interviewees had a hard time navigating their courses platform.
Most students prefer a gamified platform.

👨🏻‍🎓 User personas

Based on the results obtained from the research, it was possible to define our Personas. We created 2 user profiles, according to two different types of motivation: professional/personal growth and need/obligation.

✍️ UX Writing

We applied the Content First strategy, which consists of prioritizing the use of words, for effective communication, before creating the visual interface. Through the association of word clouds, personas and in-depth interviews, it was possible to define the tone and voice of OctoLearn, along with the purpose of the brand.

Purpose - Educate, Motivate, Transform and Expand knowledge.

Voice - Funny, casual, respectful, direct and popular.

🔀 Information Architecture & Wireframes

Mapped user flows for core tasks like:

Starting a course;
Scheduling mentorship;
Redeeming rewards;
Accessing community space;

We then created medium-fidelity wireframes to test early structure and navigation.

📲 Usability test

We applied two usability tests on Maze. The first one was performed by 20 users and included 3 tasks:

Attend the Design Thinking class of the Innovation module.
Schedule a mentorship.
Trade points for rewards.

The second one included two tasks. Where 15 users needed to:

Access a scheduled mentorship.
Post a question or comment in the community page.

💡Test insights

All users completed the class attendance task, most users (17) used the homepage to find the path, while 3 used the navigation bar and clicked on "My Classes".
When accessing the schedule mentorship form, some users showed certain difficulties when choosing the date on the calendar.
In the task to exchange points for rewards, all users completed the mission by going directly to the store card.
In the task to access the mentorship, some users clicked on the calendar to access the mentorship, but did not realize that they should click below on the name of the "event - scheduled mentorship".
In the mission to post a question in the community, most users followed the path of the navigation bar.

📲 High fidelity prototype

We created the visual identity and the styleguide of the app.

The main colors are #673AB7 and #009688. The OctoLearn logo features a geometric octopus, carefully crafted to represent the essence of the online class platform's gamified approach, known as Octalysis.

After finishing the two tests, reviewing the writing of some screens and making some minor changes to the wireframes, the development of the high-fidelity prototype began.

The following are some of the main screens of the application:

🧠 Learnings

By incorporating gamification elements, Octolearn aims to revolutionize online education and create an immersive and enjoyable learning experience for students.

A more engaging experience led to higher user motivation and better content completion.
The prototype structure was scalable for future course types.
I learned how to balance fun and clarity, and how crucial UX writing is in gamified interfaces.