Design de interface para matemática adulta séria: renderização, entrada e o tema adulto/especialista

Resultados

1. Tipografia matemática: KaTeX vs MathJax

A página inicial do KaTeX destaca seu valor em torno da velocidade: “Lightning-fast, even on pages with hundreds of expressions”, a partir de renderização síncrona que “doesn’t need to reflow the page”, ao contrário de motores que precisam [2]. Não tem dependências externas, renderiza de forma idêntica no servidor via Node.js (pré-renderização para HTML puro, custo zero de JS no cliente para conteúdo estático) e compara sua qualidade tipográfica ao TeX de Knuth como “the gold standard for math typesetting” [2]. Licença MIT, mantido pela Khan Academy e colaboradores [1]. Sua fraqueza documentada: um conjunto de comandos LaTeX mais restrito que o do MathJax (a tabela de suporte lista 1000+ funções mas sinaliza as não suportadas ao invés de degradar silenciosamente) [1], e ausência de camada de acessibilidade/fala de primeira-partida — a acessibilidade do KaTeX costuma ser adicionada por pós-processamento ARIA de terceiros.

O MathJax se posiciona como “beautiful and accessible math in all browsers”, operado por uma organização sem fins lucrativos (501(c)(3)) apoiada pela American Mathematical Society e IEEE [3]. Suporta três modos de saída — CommonHTML/CHTML, SVG e MathML nativo — aceitando TeX, MathML e AsciiMath como entrada, com renderização em navegador e Node.js [3]. Suas extensões de acessibilidade dão sustentação a qualquer afirmação “séria, profissional”: os módulos Explorer/Speech da versão 4 geram strings de fala por (sub)expressão via conjuntos de regras selecionáveis pelo usuário e atributos ARIA, funcionando independentemente de o leitor de tela entender MathML, com saída Nemeth/Euro Braille — validado em 13 combinações de navegador/SO/leitor de tela (NVDA precisa de “Combine with Speech” para Braille correto; JAWS funciona com as configurações padrão) [6].

Leitura prática: KaTeX para o caminho rápido (enunciados de problemas, feedback ao vivo — a maior parte do conteúdo, na maioria das vezes); MathJax carregado seletivamente atrás de um interruptor de acessibilidade ou onde uma demonstração precisar da superfície LaTeX mais completa. Carregar ambos permanentemente gera peso desnecessário.

2. MathML Core e a lacuna de acessibilidade

MathML Core é o subconjunto focado em navegadores da especificação original — o subconjunto semântico nunca foi implementado nos navegadores e o subconjunto de apresentação produziu implementações iniciais inconsistentes, por isso o Core foi definido “adaptado para funcionar perfeitamente com HTML, CSS, DOM e JavaScript” usando convenções LaTeX e OpenType Math como referência [4]. O MDN registra como “Baseline Widely Available… since January 2023” — nativo no Chrome, Firefox, Safari, Edge [4]. Recursos legados pré-Core ainda podem aparecer em conteúdo antigo; o Math Working Group mantém polyfills para preencher a lacuna [4].

A lacuna que importa: o suporte de renderização nativa não diz nada sobre se um leitor de tela anuncia o conteúdo de forma útil. Isso é resolvido por mecanismos explícitos de regras de fala (Explorer do MathJax, conjuntos de regras derivados do MathSpeak), não apenas pelo suporte ao MathML [3][4][6]. Uma página que entrega marcação MathML sem anotação ARIA/fala é tecnicamente compatível com padrões e ainda assim inacessível na prática — a lacuna de qualidade mais comum em sites pesados em matemática que alegam conformidade de acessibilidade.

3. Entrada de matemática: digitação, teclados virtuais, escrita à mão

MathLive (licença MIT, arnog/mathlive, publicado como componentes web <math-field>, <math-span>, <math-div>) é a opção aberta mais completa para entrada de matemática via teclado/toque: digitação direta em LaTeX com 800+ comandos embutidos, teclado virtual de matemática pronto para dispositivos móveis mais atalhos de teclado físico, e exportação/importação bidirecional entre LaTeX, MathML, ASCIIMath, Typst e MathJSON [5][7]. A acessibilidade é de primeira-partida, não um complemento: comportamento “screen-reader friendly” com rótulos ARIA gerados automaticamente e otimizados para fala, além de saída math-to-speech [7]. Isso o torna a escolha mais forte para entrada baseada em teclado em desktops e tablets.

O reconhecimento de escrita à mão é arquitetonicamente separado. MyScript Math é um motor comercial, impulsionado por IA (não OCR) que converte escrita manual em equações digitais ao vivo, resolve-as e suporta um gesto “scratch-out” para correção; é distribuído como aplicativos de consumo (iOS/Android) e, mais relevante, como SDK mais APIs REST (developer.myscript.com) para incorporação em aplicações customizadas [7]. Destina-se a entrada por stylus (hardware da classe Apple Pencil), não a toque ou mouse. Scribble da Apple e Windows Ink são camadas de escrita à mão ao nível do SO com menos parsing específico de matemática — menor atrito (no dispositivo, sem SDK) mas mais fracos em notação estruturada (frações, expoentes, matrizes) comparado a um reconhecedor de matemática dedicado.

4. Interfaces estilo notebook e o que se lê como “profissional”

Em Jupyter, Desmos, GeoGebra e Wolfram Alpha, o vocabulário compartilhado que sinaliza “ferramenta séria” em vez de “app brinquedo” inclui: estado persistente e endereçável (uma célula de notebook, um gráfico salvo, uma expressão reexecutável) ao invés de um único loop efêmero de pergunta-resposta; interação priorizando teclado com atalhos visíveis e aprendíveis ao invés de menus exclusivamente acionados por ponteiro; layout denso porém organizado (múltiplos painéis, sem um único botão “próximo” exagerado); e matemática tipografada — não renderizada como imagem — que pode ser selecionada, copiada e reeditada. GeoGebra visa amplitude em “geometria, álgebra, planilhas, gráficos, estatística e cálculo em um único motor” para “todos os níveis de educação”, do K-12 à universidade, equilibrando facilidade de uso com poder ao invés de optar por um extremo ou outro [10]. Essa é a pressão de design oposta à de um produto gamificado para crianças: menos elementos decorativos, mais manipulação direta do objeto matemático.

5. Modo escuro, layout denso e ergonomia para sessões longas

Ferramentas técnicas para sessões prolongadas (IDEs, editores LaTeX, Jupyter, ambientes de computação científica) convergem para temas escuros por padrão ou como primeira escolha, alta densidade de informação por tela (múltiplos painéis, espaçamento mínimo comparado a apps de consumo), numerais monoespaçados ou semi-monoespaçados para alinhamento de tabelas/matrizes, e cores de destaque de baixa saturação reservadas para estado (erro, ativo, selecionado) ao invés de decoração. Essa é uma gramática visual distinta de uma UI infantil clara, de alto contraste e com alvos grandes — os dois não devem compartilhar tokens de espaçamento/cores padrão de uma biblioteca de componentes se o público adulto deve ser percebido como um registro diferente e credível, e não como um app infantil reestilizado.

6. Andragogia: como a motivação adulta difere

As seis suposições de aprendizagem adulta de Knowles: (1) auto-conceito — adultos precisam de entrada e controle sobre seu próprio caminho de aprendizagem ao invés de serem dirigidos; (2) experiência — a experiência prévia, incluindo erros anteriores, é um recurso de aprendizagem; (3) prontidão — adultos se engajam com material de aplicabilidade imediata, não com material sequenciado apenas para a lógica de um currículo; (4) orientação — a aprendizagem é centrada em problemas, não em disciplinas; (5) motivação — motivadores internos (domínio, autorrealização) pesam mais que externos (notas); (6) necessidade de saber — adultos querem o “por quê” antes do “como” [8]. Knowles suavizou a teoria posteriormente para um continuum pedagogia-andragogia ao invés de uma divisão rígida, e críticos apontam que sua própria prática minou a alegação de “autodireção total”, sugerindo que os princípios podem ser apenas boas práticas de ensino em geral [8]. A recomendação prática: oferecer aos usuários da trilha adulta controle visível (pular, avançar para tópico, escolher dificuldade) e uma justificativa visível “por que este problema” — reter ambos é o modo de falha mais ligado ao desengajamento.

7. Por que adultos abandonam MOOCs

A figura mais citada: MOOCs de Harvard/MIT tiveram taxa média de conclusão de 22% em 2012 [9]. Pesquisa da Stanford categorizou participantes em ouvintes (assistem sem avaliação), concluidores, aprendizes desengajados (abandono rápido) e amostradores (engajamento ocasional) — taxonomia que mapeia como usuários de um app de matemática adulto realmente se comportam, argumentando contra projetar apenas para “concluintes” [9]. A conclusão variou drasticamente conforme credencial prévia: apenas 8% entre participantes de nível graduação concluíram versus 27% entre participantes de nível ensino médio — sugerindo que adultos credenciados amostram mais e se comprometem menos, provavelmente por múltiplas demandas já validadas de tempo [9]. A explicação dominante para desistência é a ausência de interação interpessoal e suporte, não a dificuldade do conteúdo — uma comparação citada encontrou 32% de estudantes falhando ou desistindo de cursos online versus 19% em equivalentes presenciais, atribuído a altas exigências de autonomia sem estrutura compensatória [9]. Para um app de matemática de uso solo sem coorte ou instrutor, esse é o risco mais agudo: o produto deve fornecer estrutura (progresso visível, prompts espaçados, voz equivalente a instrutor) para substituir a scaffolding social que um MOOC carece e que uma sala de aula oferece.

Recomendação de renderização e pilha de entrada

Opção	Função	Tamanho do pacote (aprox., por docs oficiais)	Licença	Acessibilidade	Escolha para o Math Challenge
KaTeX	Renderizador principal para tipografia de problema/resposta	Autônomo, sem dependências em tempo de execução; documentado como o mais rápido dos dois mecanismos porque renderiza de forma síncrona sem reflow de página [1][2]	MIT	Nenhuma camada de fala/Braille de primeira parte; depende de marcação/ARIA adicionada ao seu redor	Sim — renderizador padrão para todas as renderizações padrão de problema e feedback
MathJax (v4, CHTML/SVG output)	Renderizador de reserva quando o modo de acessibilidade está ativado, ou para conteúdo que necessita de saída MathML/Braille	Maior e mais lento para renderizar inicialmente que KaTeX segundo sua própria comparação [2][3]; modular, carregável em partes	Apache-2.0 (mathjax.org afirma ser código aberto, mantido por organização sem fins lucrativos) [3]	Extensões Explorer + Speech: texto de fala em tempo real, Braille Nemeth/Euro, validado em 13 combinações de navegador/SO/leitor de tela [6]	Sim — carregar de forma preguiçosa atrás de um toggle “math acessível”, não por padrão
MathML Core (native browser markup)	Marca semântica subjacente, formato de saída de ambos os mecanismos	N/D (nativo ao navegador, sem biblioteca)	Especificação W3C, implementada pelos navegadores	Disponível amplamente como padrão desde Jan 2023 (Chrome, Firefox, Safari, Edge) para renderização; fala não é automática [4]	Use como o output target onde possível (via MathJax’s MathML mode) para que tecnologias assistivas tenham uma árvore semântica real para se conectar
MathLive	Entrada de matemática: LaTeX digitado + teclado virtual, desktop e toque	Componente web licenciado MIT; 800+ comandos LaTeX incorporados; exporta LaTeX/MathML/AsciiMath/Typst/MathJSON [5][7]	MIT	Rótulos ARIA gerados automaticamente, conversão de matemática para fala incorporada [7]	Sim — widget de entrada padrão para desktop, tablet sem caneta, e qualquer caminho de entrada digitada
MyScript Math SDK	Entrada por escrita à mão para tablets equipados com stylus	SDK comercial + API REST (developer.myscript.com); tamanho não publicado nos documentos obtidos — verifique antes de integrar	Comercial, por integração	Não é um recurso distinto; a precisão de reconhecimento, não a saída para leitores de tela, é o foco do produto	Condicional — somente se caneta/tablet for priorizado; adiciona uma dependência paga, controlada por decisão do proprietário
OS-native handwriting (Scribble / Windows Ink)	Escrita à mão de reserva sem SDK adicional	Zero pacote adicional (nível do SO)	N/D (recurso da plataforma)	Herda a acessibilidade do SO, não específica de matemática	Use apenas como fallback barato se MyScript for rejeitado; esperar análise mais fraca de frações/exponenciais/matrizes

Implicações de design para o Math Challenge

1. Entregar KaTeX como o renderizador padrão para todas as telas ADULT/UNIVERSITY/EXPERT — enunciados de problemas, campos de resposta, etapas de solução trabalhada — já que é mais rápido e livre de reflow, o que importa ao renderizar muitas expressões por tela (etapas de prova, subpartes) [2].
2. Carregar MathJax apenas atrás de uma configuração explícita “Matemática acessível”, não globalmente — sua acessibilidade Explorer/Speech/Braille é materialmente mais forte que a do KaTeX, mas seu peso extra não vale a pena por padrão [2][3][6].
3. Emitir MathML como o formato semântico de apoio onde quer que o caminho de acessibilidade esteja ativo — a única representação que ambos os mecanismos e leitores de tela padronizam, Base desde 2023 [4].
4. Usar MathLive como o único widget de entrada em desktop e tablet sem caneta, priorizando teclado com um teclado virtual de matemática acoplado, já que já fornece rótulos ARIA e conversão de matemática para fala [5][7].
5. Em tablet + caneta (iPad/Surface), oferecer escrita à mão como modo de entrada alternativo, não o único — controlar o custo do SDK comercial da MyScript versus a alternativa nativa do SO (Scribble/Ink) atrás de uma decisão explícita do proprietário; MyScript analisa notação estruturada (frações, expoentes, matrizes) de forma materialmente melhor [7].
6. No celular, usar por padrão apenas entrada por teclado virtual; tratar escrita à mão como fora do escopo para v1 — a tela do celular é muito pequena para um fluxo de trabalho com stylus ser sério, e o teclado do MathLive já é mobile-first [5].
7. Adotar um tema escuro-prioritário para ADULT/EXPERT, distinto da tematização clara usada em faixas mais jovens, espelhando ferramentas técnicas de sessões longas (IDEs, Jupyter) ao invés de edtech de consumo [§5].
8. Aumentar a densidade de informação em relação às faixas infantil/adolescente: múltiplos painéis visíveis (problema, área de rascunho/trabalho, histórico de tentativas) ao invés de um único cartão superdimensionado de foco único, correspondendo ao padrão de layout do Jupyter/Desmos/GeoGebra [10].
9. Fornecer a cada problema da trilha adulta uma justificativa de uma linha, descartável, “por que este problema” (ex.: “reforça a regra de substituição que você errou duas vezes”) — respondendo diretamente à suposição de “necessidade de saber” de Knowles, a alavanca andragógica mais ligada ao engajamento [8].
10. Expor controle explícito do aprendiz sobre o caminho: opções visíveis de pular/reordenar/ir direto ao tópico na faixa adulto/experto, honrando a suposição de autoconceito de que adultos se desengajam quando o sistema controla a sequência [8].
11. Construir estrutura que substitua a scaffolding social que MOOCs carecem: sequências visíveis/progressão vinculada ao domínio de habilidades (não ao número de sessões), e prompts de recapitulação periódicos como “voz do instrutor” substituta, já que a falta de suporte interpessoal é a causa dominante de abandono na literatura [9].
12. Projetar para segmentação de usuários ao estilo MOOC desde o primeiro dia: esperar que personas “auditor” e “amostrador” (navegam sem concluir) sejam comuns, de modo que a UI deve evidenciar valor em uma única visita ao invés de assumir uso de várias semanas [9].
13. Manter a saída KaTeX/MathML selecionável e copiável como LaTeX/MathML puro, correspondendo à expectativa de ferramentas profissionais de que uma expressão renderizada seja um objeto reutilizável, não uma imagem bloqueada.
14. Reservar cor para estado, não decoração, no tema adulto/experto (erro/ativo/sucesso atenuados em baixa saturação) — o viés oposto ao uso decorativo de cor em tema infantil — para manter o registro sério ao invés de gamificado.

Perguntas abertas para o dono do projeto

1. Deve o SDK comercial da MyScript ser licenciado para o caminho tablet+caneta, ou o Math Challenge deve oferecer apenas escrita à mão nativa do SO (Scribble/Ink), aceitando análise mais fraca de notação estruturada, pelo menos para v1?
2. O toggle “Matemática acessível” (KaTeX → MathJax/MathML/fala) deve ser uma configuração persistente do usuário, ou detectado automaticamente a partir de sinais ativos de leitor de tela/tecnologia assistiva no navegador?
3. Quanto controle visível do aprendiz (pular/reordenar/ir) é apropriado antes de comprometer a lógica de bloqueio por domínio que o app usa em outras faixas — ADULT/EXPERT recebe um contrato de progressão explicitamente diferente das faixas mais jovens?
4. Um padrão escuro-prioritário (não apenas modo escuro disponível) é aceitável para o tema adulto/experto mesmo que o restante do Math Challenge seja presumivelmente claro-prioritário, e isso requer infraestrutura de tematização separada além de um simples toggle de modo escuro?
5. Qual é o valor mínimo da primeira sessão que a experiência adulto/experto deve entregar, dado que pesquisas de MOOC sugerem que muitos usuários adultos experimentarão apenas uma vez e não retornarão — há um “ganho de sessão única” projetado para esta faixa?