Papuguinho: análise técnica do app de CAA em Flutter puro

Quando vi a notícia no Br-linux.org sobre o Papuguinho, sistema de Comunicação Aumentativa e Alternativa (CAA) desenvolvido por estudantes do IFSP Jacareí e ICT-Unifesp, confesso que meu primeiro instinto foi abrir a Play Store e baixar. Não por pena, mas por revolta técnica: alternativas comerciais como Proloquo2Go e TouchChat custam entre US$ 200 e US$ 300, travam o usuário em ecossistemas fechados e raramente liberam o código. Um app gratuito, multiplataforma e com planos de abrir o repositório no GitHub é, no mínimo, um case study de impacto social com engenharia de verdade.

O que é CAA e por que devs deveriam se importar

Comunicação Aumentativa e Alternativa não é modismo terapêutico. É o conjunto de ferramentas e estratégias que dá voz a pessoas com TEA, paralisia cerebral, afasia ou qualquer condição que comprometa a fala. Na minha experiência construindo interfaces para públicos diversos, percebo que a maioria dos devs trata acessibilidade como checklist de WCAG. CAA é diferente: é design de produto pensado desde o pictograma até o tempo de resposta do toque.

O Papuguinho ataca exatamente esse ponto. Conforme a matéria do Br-linux, o sistema funciona com pranchas visuais onde a criança toca em ícones coloridos e o app sintetiza a frase falada. Parece simples, mas cada decisão de UX — espaçamento entre cards, contraste, latência do TTS — define se a criança vai conseguir usar ou abandonar o app em uma semana.

A stack técnica: FlutterFlow abandonando o FlutterFlow

A parte que mais me chamou atenção foi a migração. Segundo o Br-linux, o Papuguinho começou no FlutterFlow — ferramenta low-code que gera projetos Flutter — e hoje está sendo reescrito em Flutter puro, com Firebase como backend. Isso é raro e merece análise.

Na prática, FlutterFlow brilha no MVP. Você sobe uma tela funcional em horas, integra Firebase com cliques e valida a hipótese com usuário real. Mas três problemas aparecem cedo:

1. Vendor lock-in desonesto: o código exportado é verboso, cheio de widgets customizados que não seguem convenções do Flutter canônico. Migrar dói.
2. Customização limitada: quando você precisa de uma animação específica, um áudio com latência baixa ou uma integração com TTS nativo, o low-code vira obstáculo.
3. Debug obscuro: erros surgem em camadas que você não escreveu. Soma-se a isso a dependência de assinatura mensal.

Reescrever em Flutter puro é a decisão certa quando o produto já validou conceito. Você ganha acesso aos pacotes flutter_tts, just_audio, accessibility_tools e consegue tunar performance para hardware modesto — porque muitos usuários de CAA usam tablets Android de entrada.

Firebase vs. alternativas: o que faz sentido aqui

Firebase é escolhido com frequência em apps de impacto social porque remove a barreira de DevOps. Não preciso me preocupar com provisionamento, SSL, escalabilidade horizontal. Mas eu alertaria a equipe do Papuguinho sobre três armadilhas que vi em produção:

• Custos imprevisíveis: se o app viralizar e cada leitura de pictograma virar um get() no Firestore, a fatura explode. Cache local com hive ou shared_preferences resolve 80% dos casos.
• Offline-first é obrigatório: crianças em regiões sem internet estável precisam do app funcionando. Cloud Firestore com enablePersistence ajuda, mas o ideal é Local-first com sincronização eventual.
• Regras de segurança: qualquer dev pode esquecer de restringir quem escreve no banco. Para apps de saúde/educação, isso vira problema de LGPD.

Uma alternativa interessante seria o Supabase (Postgres + Realtime) ou um backend em Node.js com SQLite embarcado no cliente, sincronizando via CRDT. Para um projeto que vai ser open source, evitar o lock-in do Firebase é estrategicamente mais saudável.

Comparativo rápido: como o Papuguinho se posiciona

O diferencial do Papuguinho está no custo zero, no suporte nativo a Português brasileiro e no desenho centrado no nome e nas cores derivados de pesquisa com o público — azul e verde, relação com a natureza, ave que reproduz sons. Isso é UX research, não decoração.

Na Prática: um widget de prancha em Flutter

Para devs que querem entender a mecânica, segue um exemplo funcional de como construir uma prancha visual básica. É a espinha dorsal do tipo de interface que o Papuguinho implementa:

import 'package:flutter/material.dart';
import 'package:flutter_tts/flutter_tts.dart';

class PranchaSimples extends StatefulWidget {
  @override
  _PranchaSimplesState createState() => _PranchaSimplesState();
}

class _PranchaSimplesState extends State<PranchaSimples> {
  final FlutterTts _tts = FlutterTts();
  final List<Pictograma> _pictogramas = [
    Pictograma(texto: 'Eu quero', icone: Icons.favorite, cor: Colors.blue),
    Pictograma(texto: 'água', icone: Icons.water_drop, cor: Colors.green),
    Pictograma(texto: 'banheiro', icone: Icons.wc, cor: Colors.teal),
    Pictograma(texto: 'ajuda', icone: Icons.help, cor: Colors.indigo),
  ];

  String _fraseMontada = '';

  @override
  void initState() {
    super.initState();
    _tts.setLanguage('pt-BR');
    _tts.setSpeechRate(0.45); // mais lento para melhor compreensão
  }

  void _adicionarPictograma(Pictograma p) async {
    setState(() {
      _fraseMontada = _fraseMontada.isEmpty 
          ? p.texto 
          : '$_fraseMontada ${p.texto}';
    });
    await _tts.speak(p.texto);
  }

  void _falarFrase() async {
    if (_fraseMontada.isNotEmpty) {
      await _tts.speak(_fraseMontada);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Papuguinho — Prancha'),
        backgroundColor: Colors.green.shade700,
      ),
      body: Column(
        children: [
          // Exibição da frase montada
          Container(
            padding: EdgeInsets.all(16),
            color: Colors.grey.shade100,
            width: double.infinity,
            child: Text(
              _fraseMontada.isEmpty ? 'Toque nos pictogramas' : _fraseMontada,
              style: TextStyle(fontSize: 22, fontWeight: FontWeight.w600),
            ),
          ),
          // Grid de pictogramas
          Expanded(
            child: GridView.builder(
              padding: EdgeInsets.all(16),
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 2,
                crossAxisSpacing: 12,
                mainAxisSpacing: 12,
                childAspectRatio: 1.4,
              ),
              itemCount: _pictogramas.length,
              itemBuilder: (ctx, i) {
                final p = _pictogramas[i];
                return ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    backgroundColor: p.cor,
                    foregroundColor: Colors.white,
                    padding: EdgeInsets.all(8),
                  ),
                  onPressed: () => _adicionarPictograma(p),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Icon(p.icone, size: 48),
                      SizedBox(height: 8),
                      Text(p.texto, style: TextStyle(fontSize: 18)),
                    ],
                  ),
                );
              },
            ),
          ),
          // Botão de fala
          Padding(
            padding: EdgeInsets.all(16),
            child: ElevatedButton.icon(
              onPressed: _falarFrase,
              icon: Icon(Icons.volume_up, size: 28),
              label: Text('Falar frase', style: TextStyle(fontSize: 20)),
              style: ElevatedButton.styleFrom(
                backgroundColor: Colors.orange,
                padding: EdgeInsets.symmetric(vertical: 16),
                minimumSize: Size(double.infinity, 60),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

class Pictograma {
  final String texto;
  final IconData icone;
  final Color cor;
  Pictograma({required this.texto, required this.icone, required this.cor});
}

Esse código mostra os três pilares de uma prancha CAA bem feita: feedback visual imediato (a frase montada aparece em destaque), síntese de voz com latência baixa (TTS em Português do Brasil, SpeechRate reduzido) e área de toque generosa (botões com minimumSize e padding robusto para crianças com coordenação motora reduzida).

Erros comuns que devs cometem ao construir apps de acessibilidade

Depois de anos revisando projetos desse tipo, vejo os mesmos deslizes aparecerem. Se você for contribuir com o Papuguinho no GitHub (ou buildar qualquer app CAA), fuja destes:

• Usar Material Icons genéricos. Eles não foram desenhados para comunicação. Prefira o banco de pictogramas do ARASAAC, que é gratuito, com licença CC e validado com terapeutas ocupacionais.
• Ignorar o tamanho do alvo de toque. WCAG orienta mínimo de 44x44px, mas para crianças com TEA, o ideal é 60x60px ou maior. Erro clássico de dev que testa sozinho e tem dedos de adulto.
• TTS padrão do sistema. No Android, a voz padrão pode ser robótica e rápida. Use o pacote flutter_tts configurado para voz neural e velocidade entre 0.4 e 0.5.
• Não tratar sessão local. Se o app trava no meio de uma frase, a criança perde confiança. Persistência da frase montada com shared_preferences evita isso.
• Confundir acessibilidade com usabilidade. Adicionar Semantics é obrigação, mas o botão precisa ser visualmente óbvio também. Contraste mínimo 4.5:1, feedback háptico (HapticFeedback.mediumImpact) ao tocar.

Por que open source muda o jogo neste nicho

Segundo o Br-linux, o Papuguinho planeja hospedar o código no GitHub e aceitar contribuições. Eu iria além: licença MIT (não GPL) facilita adoção por escolas públicas e prefeituras que têm restrições contratuais com copyleft. Tradução para Libras, suporte a AAC simbólico por categorias semânticas, integração com óculos de RA — tudo isso explode quando a comunidade entra.

Projetos referência como o Cboard (criado pela UNICEF, código aberto, totalmente acessivel) mostram que o modelo funciona. A diferença é que o Papuguinho tem DNA nativo em PT-BR e pesquisa de UX feita com o público real, não traduzida de outro idioma.

FAQ — dúvidas reais de devs sobre o Papuguinho

O Papuguinho é realmente gratuito ou tem limitações?

Sim, é 100% gratuito. Está disponível na Play Store (Android) e Microsoft Store (Windows). Versões para macOS, iOS e Linux estão planejadas. O código-fonte ainda não está público, mas a equipe confirmou que será liberado no GitHub.

Posso usar o Papuguinho comercialmente em clínicas ou escolas?

Por enquanto, o foco é uso pessoal e institucional sem fins lucrativos. Quando o código for aberto, os termos de licença vão definir. Para uso clínico formal, vale validar com o CAEE/CREFITO local e seguir orientações do CONADE sobre CAA.

Quais pictogramas o Papuguinho usa?

A fonte original não especifica. O mais provável é que usem o banco do ARASAAC (gratuito, CC BY-NC-SA) ou PCS Symbols (pago). Se depender de mim, eu migraria para ARASAAC para evitar custo de licenciamento futuro.

O app funciona offline?

Depende de quais telas. Como o backend é Firebase, funcionalidades de personalização de pranchas e sincronização multi-device exigem internet. A leitura dos pictogramas e a síntese de voz funcionam offline por serem recursos locais do Android e Windows.

Como posso contribuir tecnicamente?

Aguarde a abertura do repositório no GitHub. Enquanto isso, valide o app, dê feedback técnico estruturado às instituições envolvidas (IFSP Jacareí, ICT-Unifesp, Unesp) e, se puder, doe tablets Android usados para famílias de baixa renda — o impacto do app multiplica quando o hardware também é acessível.

📖 Ler a matéria original no Br-linux

Gostou? Me segue no GitHub e deixa um comentário se tiver dúvida ou quiser aprofundar algum ponto. Se você trabalha com Flutter, acessibilidade ou impacto social com tech, vale muito a gente trocar uma ideia sobre como contribuir com projetos de CAA open source.