labTech Descomplica

Um editor de código focado em educação para alunos de tecnologia, com correção AI.

Role

Product Designer

Industry

Education

Duration

3 months

welcome page with interface components

Oportunidade

Nos cursos de tecnologia da Descomplica Faculdade Digital, alunos precisavam recorrer a softwares externos ou acessar um computador remotamente para realizar seus exercícios de programação aumentando a fricção na experiência.
Decidimos construir um editor de código internamente, focado em aprendizagem e que tivesse a cara e linguagem da companhia.

Desafios

- Construir uma experiência de edição de código que ajudasse o aluno pedagogicamente.
- Estar bem alinhado com o time de desenvolvimento para entender nossas limitações assim como ferramentas importantes para o produto. Aqui mergulhei em programação para entender o que um desenvolvedor espera de um editor de código.
- Construir uma experiência fluida e acessível no mobile.
- Alinhar com o PM do time como poderíamos fatiar as releases do produto e quais features deveriam seguir no MVP.
- Contruir a correção através de Inteligência Artificial.

//

Opportunity

At Descomplica's technology degree programs, students often had to rely on external software or remotely access a computer to complete their programming exercises, creating friction in the learning experience.
We decided to build an in-house code editor focused on learning and aligned with the company’s identity and tone of voice.

Challenges

Build a code editing experience that supports students pedagogically.- Stay closely aligned with the development team to understand both our limitations and the key tools needed for the product. I dove into programming to better understand what developers expect from a code editor.- Create a smooth and accessible mobile experience.- Work with the team’s PM to define how to break down product releases and which features should be included in the MVP.- Develop the correction system using Artificial Intelligence.

Oportunidade

Nos cursos de tecnologia da Descomplica Faculdade Digital, alunos precisavam recorrer a softwares externos ou acessar um computador remotamente para realizar seus exercícios de programação aumentando a fricção na experiência.
Decidimos construir um editor de código internamente, focado em aprendizagem e que tivesse a cara e linguagem da companhia.

Desafios

- Construir uma experiência de edição de código que ajudasse o aluno pedagogicamente.
- Estar bem alinhado com o time de desenvolvimento para entender nossas limitações assim como ferramentas importantes para o produto. Aqui mergulhei em programação para entender o que um desenvolvedor espera de um editor de código.
- Construir uma experiência fluida e acessível no mobile.
- Alinhar com o PM do time como poderíamos fatiar as releases do produto e quais features deveriam seguir no MVP.
- Contruir a correção através de Inteligência Artificial.

//

Opportunity

At Descomplica's technology degree programs, students often had to rely on external software or remotely access a computer to complete their programming exercises, creating friction in the learning experience.
We decided to build an in-house code editor focused on learning and aligned with the company’s identity and tone of voice.

Challenges

Build a code editing experience that supports students pedagogically.- Stay closely aligned with the development team to understand both our limitations and the key tools needed for the product. I dove into programming to better understand what developers expect from a code editor.- Create a smooth and accessible mobile experience.- Work with the team’s PM to define how to break down product releases and which features should be included in the MVP.- Develop the correction system using Artificial Intelligence.

prints of a discovery process

Solução

Criamos um editor de código focado no aprendizado do aluno, onde ele poderia usar tanto em desktop como mobile.

Com feedback in real time, aluno poderia saber a nota no exercício e receber dicas de como melhorar.

Como próximos passos, vamos coletar dados do usuário para entender quais as próximas melhorias deveríamos focar em termos de usabilidade e viabilizar as próximas features do produto como compilação de código, por exemplo.

//

Solution

We created a code editor focused on student learning, accessible on both desktop and mobile.
With real-time feedback, students could see their score on each exercise and receive tips on how to improve.As a next step, we plan to collect user data to understand which usability improvements to prioritize and to support the development of upcoming product features, such as compile and run the code.

Aprendizados

O mais importante aspecto desse projeto foi unir a experiência do aluno ao codar com a experiência pedagógica. Para os próximos passos, vamos acompanhar as métricas de uso, conversar com alguns estudantes e evoluir com os próximos releases.

//

Learnings

The most important aspect of this project was combining the student’s coding experience with the pedagogical approach. For the next steps, we will track usage metrics, talk to some students, and move forward with the upcoming releases.


Equipe

Product Designer: Tamy Müzel
Product Management: João Prado
Tech Lead: Rodrigo Bosisio
Desenvolvedores: Wagner Filho e Leticia Souza

Aprendizados

O mais importante aspecto desse projeto foi unir a experiência do aluno ao codar com a experiência pedagógica. Para os próximos passos, vamos acompanhar as métricas de uso, conversar com alguns estudantes e evoluir com os próximos releases.

//

Learnings

The most important aspect of this project was combining the student’s coding experience with the pedagogical approach. For the next steps, we will track usage metrics, talk to some students, and move forward with the upcoming releases.


Equipe

Product Designer: Tamy Müzel
Product Management: João Prado
Tech Lead: Rodrigo Bosisio
Desenvolvedores: Wagner Filho e Leticia Souza

Tamy Müzel

Copyright 2025 by Tamy Müzel

Tamy Müzel

Copyright 2025 by Tamy Müzel

Tamy Müzel

Copyright 2025 by Tamy Müzel