Engenharia de Usabilidade, Acessibilidade (WCAG) e Avaliação de Interface de Feedback Pedagógico no DOMjudge TEAM

Auditoria WCAG 2.1/2.2 AA, redesenho centrado no estudante da interface TEAM e avaliação com axe-core/SUS/TAM

[object Object]
Feedback Formativo
Requer CEP
Data de Publicação

14/11/2026

Data de Modificação

14/11/2026

Código: TCC 14 · Trilha: Trilha 4: IHC, DevOps e Estudos Empíricos · Status: Disponível · Modalidade: IHC / Acessibilidade + Estudo com Usuários · Perfil: Individual · Complexidade: Baixa–Média · Regime Ético: Requer CEP (se testes com usuários)

1. Contexto e Problema

Um feedback heurístico determinístico só cumpre seu papel formativo se a pessoa estudante conseguir encontrar, ler, compreender e acionar a orientação sem sobrecarga cognitiva. A interface padrão do DOMjudge foi projetada historicamente para competidores experientes de maratonas (telas densas e tabelas técnicas), não para iniciantes do ensino técnico/graduação ou pessoas com daltonismo, baixa visão ou menor familiaridade com termos técnicos em inglês.

Na Fig. 5.5 de cap05-implementacao.tex, propôs-se um esboço visual da interface TEAM estendida exibindo veredito técnico, indicador de faixa A–E e mensagem observacional — ainda carente de auditoria sistemática de acessibilidade e avaliação empírica de usabilidade.

Nota sobre Regime Ético (CEP): A frente técnica (auditoria WCAG 2.1/2.2 AA com axe-core/Lighthouse, redesenho front-end e inspeção heurística por pares) não exige CEP. Já qualquer avaliação com estudantes humanos (testes de usabilidade, questionário SUS ou instrumento TAM) exige aprovação prévia do protocolo no Comitê de Ética em Pesquisa (CEP).

2. O que será feito (Objetivos Técnicos e Escopo)

  1. Auditar a interface TEAM estendida do DOMjudge quanto a heurísticas de usabilidade (Nielsen) e diretrizes de acessibilidade WCAG 2.1/2.2 nível AA (contraste independente de cor para faixas A–E e vereditos, navegação por teclado, ARIA landmarks e leitores de tela);
  2. Reprojetar e implementar melhorias de front-end (visualização clara da diferença entre saída esperada vs. obtida, destaque acessível do cenário acionado e separação visual entre veredito técnico e próxima ação formativa);
  3. Conduzir avaliação iterativa em duas frentes:
    • Frente técnica (sem CEP): auditoria automatizada (axe-core, Lighthouse) e inspeção heurística;
    • Frente com usuários (condicionada à aprovação prévia no CEP): teste de usabilidade com tarefas estruturadas, questionário SUS (System Usability Scale) e construtos de clareza/utilidade do TAM.

3. Perguntas para você refletir

Se você se identifica com as questões abaixo, este tema pode ser uma boa escolha:

  • Como comunicar visualmente a escala A–E e o veredito técnico para estudantes com daltonismo ou usuários de leitores de tela sem depender apenas de verde/vermelho?
  • Que layout minimiza a sobrecarga cognitiva de um iniciante que acabou de receber um erro WA ou TLE?
  • Como estruturar a submissão ao CEP logo no TCC 1 (e manter um plano de contingência técnica sólido caso o calendário ético atrase)?

4. Divisão Sugerida (TCC 1 e TCC 2)

  • TCC 1: Auditoria WCAG/heurística da interface atual, prototipação de alta fidelidade (Figma/HTML) e, se aplicável, elaboração e submissão do protocolo ao CEP.
  • TCC 2: Implementação no front-end do DOMjudge (Twig/Bootstrap/JS), reavaliação automatizada (axe-core/Lighthouse) e execução dos testes com usuários após parecer favorável do CEP.

5. Entregáveis e Métricas de Avaliação

6. Pré-requisitos e Tecnologias Sugeridas

  • Base necessária: desenvolvimento Front-end (HTML/CSS/JS, acessibilidade web), design de interação (IHC) e metodologia de avaliação de usabilidade.
  • Tecnologias e conceitos envolvidos: WCAG 2.1/2.2, axe-core, Lighthouse, Twig/Bootstrap (templates do DOMjudge), Figma, questionários SUS e TAM.

7. Origem e Ponto de Partida

  • Origem na pesquisa WOKDEX:
    • cap05-implementacao.tex (§ 5.6 e Fig. 5.5 — proposta visual da interface TEAM condicionada ao CEP);
    • cap01-introducao.tex (heterogeneidade, inclusão e acesso);
    • apendices/cep/submissao/03_questionario_tam_wokdex.pdf (instrumento TAM adaptado);
    • apendices/extensao/propostas/tccs/propostas_tcc_wokdex.md.
  • Consulte também o guia de Metodologia e Ética.

8. Como demonstrar interesse

Antes de agendarmos uma conversa, prepare respostas curtas para:

  1. Por que esse tema chamou sua atenção?
  2. Você tem interesse em conduzir o protocolo completo com usuários via CEP ou prefere concentrar o escopo na engenharia de acessibilidade WCAG e front-end?
  3. Qual sua disponibilidade semanal estimada para o TCC?
De volta ao topo