Mascotes para apps infantis e de educação: lições do Duolingo
Por equipe Charmotion · Atualizado em

O mascote de um app de educação deve reagir ao aprendizado, não pressionar quem aprende. Use reações rápidas yes e no para as respostas, uma reação success para lições concluídas e loops calmos durante as esperas. Nunca deixe um rosto triste em loop diante dos erros nem use culpa para fazer o usuário voltar. Em apps infantis, revise a COPPA e o UK Children's Code antes que o mascote colete voz ou fotos.
Principais pontos
- O Duolingo usa state machines do Rive para a sincronização labial dos World Characters em mais de 40 idiomas e mais de 100 cursos.
- O Duolingo relata que uma animação de ofensiva (streak) aumentou em 1,7% a retenção de novos alunos no 7º dia; o número de 3,6 vezes mais conclusões de curso é uma correlação.
- Comemore as respostas certas mais do que reage às erradas e volte rápido ao neutro depois de um erro.
- A COPPA Rule alterada entrou em vigor em 23 de junho de 2025, com a maior parte das exigências de conformidade valendo a partir de 22 de abril de 2026.
- Lembretes que fazem o usuário se sentir culpado são confirmshaming; o UK Children's Code alerta contra explorar a necessidade de aprovação das crianças.
Já tem um personagem ou logo? Veja seu personagem em telas reais de app: telas de splash, onboarding, carregamento e estado vazio. É grátis, roda no navegador e não envia nada.
Como o Duolingo anima seus personagens?
O Duolingo é o caso mais bem documentado de animação de mascote em um app de aprendizado. O blog de engenharia da empresa descreve o uso do Rive para a sincronização labial dos seus dez World Characters, com mais de 20 formatos de boca, em mais de 40 idiomas e mais de 100 cursos. A equipe escolheu o Rive em parte pelo tamanho compacto dos arquivos e porque a state machine permite que os desenvolvedores controlem por código quais estados de animação são acionados (blog do Duolingo).
Depois, o Rive descreveu o recurso Video Call do Duolingo, em que a personagem Lily combina 8 animações de cabeça e 8 de corpo em mais de 64 variações de idle, enquanto o arquivo continua abaixo de 1 MB (blog do Rive). Esse é o relato do próprio Rive sobre um projeto de cliente.
A lição para apps menores está na arquitetura, não na escala. Um único arquivo interativo com state machine permite que um personagem reaja a muitos eventos sem um vídeo separado para cada momento. O código da lição define um estado, e o arquivo cuida das transições.
Para uma introdução geral a esse padrão, veja estados de animação de mascote e como criar um mascote animado para app.
Animações de ofensiva e de comemoração ajudam apps de aprendizado?
O Duolingo publicou dois números muito citados, e eles significam coisas diferentes (blog do Duolingo):
- Alunos que chegam a uma ofensiva de 7 dias têm 3,6 vezes mais chances de concluir o curso. Isso é uma correlação. Alunos motivados tanto mantêm ofensivas quanto terminam cursos; a ofensiva não causa necessariamente a conclusão.
- Uma nova animação de ofensiva aumentou em 1,7% a probabilidade de um aluno recém-chegado ainda estar usando o app 7 dias depois. Esse é o resultado de um teste A/B de uma única animação, divulgado pela empresa.
Os dois são números da própria Duolingo, de um produto com público enorme. Eles reforçam a ideia de que uma comemoração bem posicionada pode fazer diferença, não de que qualquer comemoração fará.
A conclusão para o design é colocar a maior reação no momento mais importante para o hábito, como terminar uma lição ou estender uma ofensiva, e manter todo o resto discreto. Se cada toque vira festa, os momentos importantes deixam de se destacar.
De quais estados de mascote um fluxo de lição precisa?
Um fluxo de lição é uma sequência de eventos curtos, o que combina com uma mistura de loops e reações únicas:
| Evento | Estado | Loop ou reação única | Observações |
|---|---|---|---|
| Início da lição | enter, depois idle (0) | Reação única, depois loop | Mantenha a entrada abaixo de um ou dois segundos |
| Pergunta exibida | listening (6) ou thinking (3) | Loop | Discreto; o foco é a pergunta |
| Resposta certa | yes, depois happy (1) brevemente | Reação única | Volte ao idle antes da próxima pergunta |
| Resposta errada | no, depois idle (0) | Reação única | Nunca deixe sad (4) em loop em erros repetidos |
| Lição concluída | success | Reação única | A maior reação do fluxo |
| Leitura em voz alta ou fala do tutor | talking (7) | Loop | Só enquanto o áudio toca |
| Inativo ou pausado | sleeping (8) | Loop | Calmo, pouco movimento |
| Tela de lembrete ou de retorno | wave (2) | Loop | Texto sem culpa |
A assimetria importa: respostas certas ganham uma recompensa visível, respostas erradas recebem um reconhecimento rápido e neutro. Quem erra três vezes seguidas não deve ver o mascote ficar cada vez mais chateado.
Como comemorar sem manipular crianças?
Crianças reagem muito à aprovação de personagens, e é exatamente por isso que ela não pode ser usada contra elas. O Children's Code do Information Commissioner's Office do Reino Unido (padrão 13) orienta a não usar técnicas de nudge para levar crianças a fornecer dados pessoais desnecessários ou desativar proteções de privacidade, e alerta contra explorar a necessidade delas de aprovação. O mesmo padrão incentiva nudges a favor do bem-estar, como fazer pausas (ICO).
Na prática:
- Comemore o aprendizado, não os dados. Nunca recompense uma criança por ativar o microfone, adicionar uma foto, convidar amigos ou aceitar rastreamento.
- Mantenha o mascote fora das telas de consentimento e privacidade. Nada de loop happy ou attention ao lado de um botão "Ativar".
- Use o mascote para pausas. Um estado sleeping ou wave que sugere parar depois de uma sessão é um nudge positivo.
- Vincule as recompensas ao esforço. Uma reação success ao terminar uma lição não tem problema. Uma reação feita para manter a criança tocando na tela depois do fim da lição, sim.
Essas regras também valem para apps de aprendizado para adultos.
O que a COPPA e o UK Children's Code significam para o design de mascotes?
Mascotes em si não são regulamentados, mas o que eles coletam é. Nos Estados Unidos, a COPPA Rule alterada pela FTC entrou em vigor em 23 de junho de 2025, e a maioria das obrigações tinha de ser cumprida até 22 de abril de 2026. As alterações incluem consentimento parental verificável separado antes de divulgar dados de crianças a terceiros, a inclusão de identificadores biométricos na definição de informação pessoal e a exigência de uma política escrita de retenção de dados (Federal Register).
Isso importa para recursos de mascote que parecem inofensivos:
- Um mascote que "ouve" uma criança lendo em voz alta coleta dados de voz.
- Um mascote que reage ao rosto da criança pela câmera pode envolver dados biométricos.
- Um serviço de analytics ou de IA de terceiros por trás do mascote pode contar como divulgação a terceiros.
No Reino Unido, o Children's Code acrescenta as regras de nudge descritas acima. Se o seu app atende crianças, passe qualquer recurso do mascote que use microfone, câmera ou um serviço externo pela sua revisão de privacidade. Este guia é uma orientação de design, não aconselhamento jurídico.
Um mascote que só reproduz animações prontas em resposta a toques e respostas não coleta nada por conta própria. É o design mais simples de manter em conformidade.
Como evitar lembretes que fazem o usuário se sentir culpado?
Telas de lembrete e de cancelamento são onde os mascotes mais passam do limite. Confirmshaming é um padrão enganoso reconhecido, em que o usuário é manipulado emocionalmente a fazer algo que não faria de outra forma (Deceptive Patterns). Um mascote chorando com um texto como "Você vai me abandonar?" é um exemplo clássico.
Padrões mais seguros:
- Notificações de lembrete: um wave amigável e uma frase neutra, como "Pronto para a lição de hoje?"
- Dia perdido: idle ou wave, com um texto que dá as boas-vindas de volta em vez de contar perdas.
- Desativar lembretes ou cancelar a inscrição: idle ou exit, com uma confirmação simples. Nada de estado sad.
- Ofensiva interrompida: reconheça isso no texto e mostre a próxima meta alcançável.
O loop sad pode ficar no seu arquivo para momentos divertidos durante a lição, mas mantenha-o longe de qualquer tela em que o usuário esteja decidindo se continua, paga ou compartilha.
Como adicionar movimento reduzido e controles de pausa?
Telas de aprendizado combinam movimento com leitura, exatamente a situação de que trata o WCAG 2.2.2. Conteúdo em movimento que começa automaticamente, dura mais de cinco segundos e aparece junto com outro conteúdo precisa de uma forma de pausar, parar ou ocultar (W3C). Um mascote em loop ao lado de um exercício de leitura se enquadra nisso.
- Respeite as configurações do sistema. Na web,
prefers-reduced-motionindica quando o usuário pediu para minimizar movimentos não essenciais (MDN); as plataformas nativas têm equivalentes. Mostre uma pose estática no lugar. - Adicione uma opção no app. Crianças raramente mudam configurações do sistema. Uma chave visível de "modo calmo", de preferência numa área para os pais, resolve isso.
- Deixe os loops se acalmarem. Depois de uma reação, volte para um estado idle ou sleeping com pouco movimento, em vez de pular sem parar.
- Mantenha o feedback também em texto. "Certo!" ou "Tente de novo" precisa aparecer em texto, para que a lição funcione com o movimento desativado.
O conjunto do Charmotion inclui os estados que este guia usa (yes, no, success, happy, listening, talking, sleeping, wave) em um único .riv, além de MP4 e GIF para prévias na loja. Um personagem arredondado como o Kiko, a raposa do elenco próprio do Charmotion mostrada acima, representa o lado mais amigável, adequado ao público mais jovem.
Perguntas frequentes
Como o mascote de um app infantil deve reagir a respostas erradas?
De forma breve e sem constrangimento. Toque uma reação no (não) rápida, depois volte ao idle neutro, e nunca deixe uma cara triste em loop quando os erros se repetem. Comemore as respostas certas de forma mais visível do que reage aos erros, e garanta que o feedback também apareça em texto, para funcionar com o movimento desativado.
A animação de sequência do Duolingo realmente melhora a retenção?
O Duolingo informa que uma nova animação de sequência aumentou em 1,7% a parcela de alunos novos ainda ativos depois de 7 dias. Esse é o resultado do próprio teste A/B da empresa. A afirmação separada de que alunos com sequência de 7 dias têm 3,6 vezes mais chance de concluir um curso é uma correlação.
A COPPA se aplica ao mascote de um app?
A COPPA se aplica aos dados que o seu app coleta de crianças menores de 13 anos, inclusive por meio de um mascote. Se o personagem usa o microfone, a câmera ou um serviço de terceiros, ele se enquadra na regra alterada, em vigor desde 23 de junho de 2025, com prazo de conformidade em 22 de abril de 2026. Consulte um advogado para os detalhes.
Um mascote triste numa tela de lembrete é um dark pattern?
Pode ser. Fazer o usuário se sentir culpado para voltar ou manter a assinatura é confirmshaming, um padrão enganoso reconhecido. Use um estado wave ou idle neutro e um texto acolhedor no lugar. Em apps infantis, o UK Children's Code também alerta contra explorar a necessidade de aprovação da criança.
Respostas rápidas deste guia
Fontes
- How Duolingo's characters lip sync (visemes), Duolingo Blog
- Duolingo's AI-powered Video Call brings Lily to life, Rive Blog
- How Duolingo's streak builds habit, Duolingo Blog
- Children's Online Privacy Protection Rule (final rule amendments), Federal Register (FTC)
- Age appropriate design code: 13. Nudge techniques, Information Commissioner's Office (UK)
- Confirmshaming, Deceptive Patterns
- Understanding SC 2.2.2: Pause, Stop, Hide, W3C WAI
- prefers-reduced-motion, MDN Web Docs