Mascotes pet para apps de hábitos: sequências sem culpa

Por equipe Charmotion · Atualizado em 25 de outubro de 2026

Um mascote de app de hábitos deve recompensar cada check-in com uma reação curta, marcar os marcos da sequência com uma reação maior e receber um dia perdido com um estado calmo e neutro, em vez de tristeza. Pesquisas sobre sequências interrompidas mostram que as pessoas costumam desistir depois de uma pausa, então, nesse dia, o papel do bichinho é facilitar o recomeço, não lamentar a sequência.

Principais pontos

Associe cada evento de hábito a um estado: check-in para yes, dia concluído para success, marco para success e depois wave, dia perdido para idle ou wave.
Um artigo de 2023 do Journal of Consumer Research concluiu que sequências intactas aumentam o engajamento e que sequências quebradas muitas vezes o encerram, então projete o recomeço, não a culpa.
Os widgets do iOS só animam entre atualizações da timeline, por no máximo dois segundos, então planeje uma pose estática para cada humor.
Os anexos de notificação do iOS aceitam GIFs animados de até 10 MB; o texto ainda precisa funcionar sem a imagem.
Um conjunto de personagem oferece humores, não evolução: o bichinho não vai evoluir, trocar de roupa nem ganhar poses novas.

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.

De quais estados o bichinho de um app de hábitos precisa?

Apps de hábitos, foco e estudo com um bichinho de companhia funcionam com um pequeno conjunto de eventos que se repetem. Associe cada um a um único estado antes de desenhar qualquer coisa, para que o bichinho reaja sempre da mesma forma e os usuários aprendam o que cada reação significa.

Evento	Estado	Loop ou reação única	Observações
Primeira abertura do dia	wave (2), depois idle (0)	Loop	Cumprimenta uma vez e depois se acalma
Hábito marcado como feito	yes	Reação única	Pequena e rápida, pois dispara várias vezes ao dia
Todos os hábitos de hoje concluídos	success, depois happy (1)	Reação única, depois loop	A recompensa diária
Marco de sequência	success, depois wave (2)	Reação única, depois loop	Use raramente para continuar especial
Timer de foco ou de estudo rodando	idle (0) ou uma pose parada	Loop	O foco é o timer, não o pet
Timer concluído	success	Reação única	Mostre a duração da sessão em texto junto
Escrevendo uma nota de reflexão	listening (6)	Loop	Enquanto o teclado estiver aberto
Sincronizando ou importando	loading (5)	Loop	Só enquanto o processo estiver rodando de fato
Lembrete pendente (no app)	attention (9)	Loop	Ao lado do nome do hábito
Perdeu o dia de ontem	idle (0) ou wave (2)	Loop	Texto de recomeço, sem culpa
Hora de dormir ou dia de descanso	sleeping (8)	Loop	Descanso faz parte do plano

Dez estados em loop de um personagem, cada um selecionado por um número de mood de 0 a 9 — Os dez estados em loop em um arquivo Rive do Charmotion, selecionados com o input numérico mood.

A escala importa mais do que qualquer animação isolada. Um aceno a cada check-in, uma recompensa pelo dia completo e uma comemoração nos marcos mantêm os grandes momentos significativos na sexta semana. Se todo check-in recebe o tratamento de marco, nada parece conquistado. O guia de coach fitness usa a mesma escala de três níveis para treinos.

O que o pet deve fazer quando o usuário perde um dia?

Continuar amigável e deixar o próximo passo pequeno. O dia perdido é o momento mais frágil de qualquer produto de hábitos, e há pesquisas que explicam por quê.

Em um artigo de 2023 no Journal of Consumer Research, Jackie Silverman e Alixandra Barasch constataram, em sete estudos, que sequências intactas exibidas em registros de comportamento aumentavam o engajamento posterior das pessoas, e que sequências quebradas o reduziam. O efeito dependia de como o registro mostrava o comportamento passado, não do comportamento em si, e era mais fraco quando as pessoas podiam reparar a sequência (Silverman e Barasch). No texto de divulgação da universidade, os pesquisadores dizem que mensagens que relembram a falha "normalmente não funcionam" e sugerem oferecer uma nova meta no lugar (CU Boulder).

Isso se traduz em regras para o mascote:

Nada de cara triste na falha. Sad (mood 4) ao lado de "Você perdeu sua sequência de 40 dias" transforma a falha do usuário no luto do pet. Use idle ou wave.
Nada de texto que gera culpa. "Seu pet sentiu sua falta" está a um passo do confirmshaming, que usa a culpa para pressionar as pessoas a agir (Deceptive Patterns).
Ofereça uma meta nova e menor. "Começar uma nova sequência de 3 dias?" com um wave funciona melhor do que um resumo do que foi perdido.
Cuidado com reparos pagos. Barasch chama de "totalmente irrelevante" um selo de sequência que o usuário paga para restaurar, porque ele deixa de refletir o comportamento real. Reparos gratuitos e limitados são uma escolha de design; vendê-los é outra bem diferente.
Não castigue o pet. Um pet que fica doente ou triste quando o usuário falha é uma mecânica de culpa com carinha fofa.

Como um timer de foco ou de estudo deve usar o mascote?

Durante uma sessão de foco, o pet deve sair do caminho. Um app de foco vende concentração, e um personagem que fica se mexendo no canto da visão trabalha contra isso.

Antes da sessão: attention (9) no botão de iniciar, ou um wave quando o usuário abre o timer.
Durante a sessão: uma pose parada, ou idle com pouco destaque. As diretrizes de movimento da Apple alertam que animações gratuitas "podem distrair as pessoas" e recomendam não adicionar movimento a interações frequentes (Apple HIG).
Pausas: sleeping (8) é lido naturalmente como "hora de descansar".
Sessão concluída: uma reação success, depois idle.

As regras de acessibilidade apontam na mesma direção. Pelo critério WCAG 2.2.2, conteúdo em movimento que começa automaticamente, dura mais de cinco segundos e fica ao lado de outro conteúdo precisa de uma forma de pausar, parar ou ocultar (W3C). Um pet em loop ao lado de um timer de 25 minutos se enquadra nisso, então ofereça uma opção para ocultá-lo e uma pose parada quando o movimento reduzido estiver ativado. Veja Reduce Motion no SwiftUI para o lado do iOS.

O que um pet pode mostrar em widgets e notificações?

Principalmente imagens estáticas, com uma exceção nas notificações do iOS.

Widgets do iOS. A Apple documenta a animação de widgets como transições quando os dados da timeline mudam, com "duração máxima de dois segundos", e nenhuma animação no modo Always On (Apple). GIF ou vídeo em loop não são uma opção. Entregue uma imagem estática por humor e troque a imagem quando a sequência ou o progresso mudar. O guia de limites de widgets e Live Activities aborda isso em detalhes.
Widgets do Android. Os layouts de widget são construídos com RemoteViews, que "não é compatível com todos os tipos de layout ou widget de visualização" nem com views personalizadas (Android Developers). Planeje uma imagem estática aqui também.
Notificações do iOS. Um anexo de notificação pode ser JPEG, GIF ou PNG de até 10 MB, e a Apple observa que uma imagem "pode conter uma imagem estática ou uma sequência de imagens animada"; anexos de vídeo vão até 50 MB (Apple). Em pushes remotos, uma notification service extension baixa o arquivo antes da exibição.
Notificações do Android. O BigPictureStyle é documentado com base em um bitmap, então trate a imagem grande como um frame estático.

Celular com um mascote em um loop attention ao lado de um selo de notificação

Para gerar as imagens estáticas, extraia um frame de cada clipe. Isto foi executado com ffmpeg 7.1.1 em um MP4 de demonstração:

ffmpeg -ss 0.5 -i happy.mp4 -frames:v 1 widget-happy.png

O frame do MP4 mantém o fundo sólido do clipe. Para um PNG com fundo transparente, leia o WebM transparente com o decodificador VP9 que preserva o canal alfa: ffmpeg -c:v libvpx-vp9 -ss 0.5 -i happy.webm -frames:v 1 widget-happy.png.

Qual arquivo vai em cada superfície?

Superfície	Arquivo	Por quê
Tela do pet e lista de check-ins	Rive .riv (número de mood mais triggers) ou um MP4 por estado	O Rive troca de estado em tempo real; vídeo funciona se você só alterna poucos clipes
Widgets da tela inicial e da tela bloqueada	PNGs estáticos extraídos dos clipes	Widgets não reproduzem vídeo nem GIF em loop
Notificações push do iOS	Anexo GIF ou MP4	Anexos podem ser animados na visualização expandida
E-mail de resumo semanal	GIF com um primeiro frame significativo	Algumas versões do Outlook mostram só o primeiro frame
Capturas da App Store e redes sociais	Vídeo 9:16, MP4 quadrado	Reels, Shorts e TikTok são verticais
Movimento reduzido ativado	Uma imagem estática por estado	Mesmo significado, sem movimento

Mantenha a contagem da sequência, o nome do hábito e a próxima ação em texto em todas as superfícies. O pet define o clima; as palavras trazem os fatos, para leitores de tela e para quem ocultou o pet.

O que um único conjunto de animações de personagem não consegue fazer?

Apps de pet como o Finch constroem toda uma progressão em torno do personagem: o Internet Matters descreve um pássaro que cresce, ganha acessórios e explora novos lugares conforme o usuário acumula pontos (Internet Matters). Isso exige um pipeline de arte dedicado, com um novo desenho para cada estágio, roupa e local.

Um conjunto do Charmotion é algo diferente e menor. Você envia uma imagem do seu pet e recebe 17 animações desse mesmo personagem: dez loops (idle, happy, wave, thinking, sad, loading, listening, talking, sleeping e attention), seis reações únicas (success, error, yes, no, enter e exit) e uma intro de abertura. Isso cobre todos os eventos da tabela acima. Não estão incluídos:

estágios de crescimento ou evolução (de filhote a adulto),
roupas, chapéus ou acessórios,
novas poses, como comer, regar uma planta ou segurar um livro,
ciclos de caminhada ou deslocamento entre cômodos,
lip-sync, nem uma barra de progresso desenhada no personagem.

Todo conjunto tem os MP4s, o vídeo 9:16 e os GIFs, o que basta para widgets, notificações e redes sociais, e o .riv para estados ao vivo dentro do app (planos pagos, a partir de US$ 20/mês). Se o loop principal do seu app é colecionar roupas ou evoluir o bichinho, reserve orçamento para arte personalizada; se são check-ins e sequências, um conjunto resolve.

Perguntas frequentes

O pet de um app de hábitos deve ficar triste quando a sequência quebra?

Não. Um pet triste ao lado de uma sequência perdida transforma a falha do usuário em culpa, justamente quando ele tem mais chance de desistir. Silverman e Barasch constataram que sequências quebradas costumam reduzir o engajamento, e os pesquisadores recomendam oferecer uma nova meta no lugar. Use idle ou wave com um pequeno convite para recomeçar.

Um widget do iOS consegue reproduzir a animação do meu mascote?

Não em loop. A Apple documenta a animação de widgets como transições entre atualizações da timeline, limitadas a dois segundos, e nenhuma no modo Always On. Exporte uma imagem estática por humor e troque as imagens quando os dados mudarem. Notificações são diferentes: um anexo no iOS pode ser um GIF animado de até 10 MB.

Reparos de sequência ajudam os usuários a voltar?

Elas podem suavizar a queda. Silverman e Barasch descobriram que o efeito negativo de uma sequência quebrada era mais fraco quando as pessoas podiam recuperá-la. Barasch também alerta que uma sequência que o usuário paga para restaurar deixa de refletir o comportamento real; por isso, mantenha as recuperações limitadas e honestas, em vez de transformá-las em um upsell pago.

Respostas rápidas deste guia

O que o mascote de um app de hábitos deve fazer quando eu perco um dia?

Fontes

On or Off Track: How (Broken) Streaks Affect Consumer Decisions (Silverman and Barasch, 2023), Journal of Consumer Research
Research on streaks, marketing and tech (Barasch), University of Colorado Boulder, Leeds School of Business
Confirmshaming, Deceptive Patterns
Animating data updates in widgets and Live Activities, Apple Developer Documentation
Create a simple widget, Android Developers
UNNotificationAttachment, Apple Developer Documentation
Motion, Apple Human Interface Guidelines
Understanding SC 2.2.2: Pause, Stop, Hide, W3C WAI
Finch: a parent's guide to the self-care pet app, Internet Matters