Interface Homem-Computador (UI/UX)

O que é

• IHC estuda como pessoas interagem com sistemas computacionais — cognição, percepção e ergonomia.
• UX (User Experience): sensação e eficácia ao usar o produto para atingir um objetivo.
• UI (User Interface): camada visual e interativa — layout, cores, tipografia, componentes.
• CX (Customer Experience) é mais amplo; UX foca no uso do software (ex.: tela de exportação PDF).

Processo de design

• Pesquisa: entrevistas, personas, jornada do usuário (gestor exportando relatório).
• Arquitetura de informação: organização de menus, fluxos e nomenclatura.
• Wireframe e protótipo: validar antes do código caro (Figma, pen and paper).
• Teste de usabilidade: tarefas observadas, taxa de sucesso, tempo, erros.
• Design system: biblioteca de componentes consistente (botões, formulários, toasts).
• Handoff para dev: specs, tokens, estados (hover, disabled, erro).

Exemplo visual — wireframe exportar PDF

• UI-012 alinhada ao modelo textual do tópico Desenvolvimento Web.

Heurísticas e acessibilidade

• Nielsen: visibilidade do status, correspondência com o mundo real, controle do usuário, consistência, prevenção de erros.
• Feedback claro: spinner na exportação, mensagem se período inválido (RN-004).
• Acessibilidade (WCAG): contraste, labels, navegação por teclado, leitor de tela.
• Mobile first ou responsivo quando gestores usam tablet/celular.

Modelo textual — roteiro de teste de usabilidade

• Roteiro para validar fluxo US-018 / RF-012 com usuário real.

────────────────────────────────────────────────────────────
TESTE DE USABILIDADE
────────────────────────────────────────────────────────────

Produto:         [Consulta de atividades — exportar PDF]
Participante:    [perfil Gestor, n=5]
Facilitador:     [UX / PO]
Data / local:    [homologação ou protótipo Figma]

Tarefas (sem ajuda):
  1. Fazer login e abrir consulta de atividades.
  2. Filtrar período 01/05 a 15/05/2026.
  3. Exportar PDF e salvar arquivo.
  4. (Opcional) Interpretar mensagem de erro com período > 90 dias.

Métricas:
  - Sucesso sim/não por tarefa
  - Tempo até download
  - Erros observados (cliques errados, hesitação)
  - Escala SUS ou satisfação 1–5

Perguntas pós-teste:
  - O que foi confuso?
  - Confia no PDF gerado?

Ações:
  - [ ] Ajustar label do botão Exportar
  - [ ] Melhorar mensagem RN-004
  - [ ] Aumentar área clicável em mobile