[DASHBOARD Q.A - CARD DETALHADO] Telas de Baixa Fidelidade da Visualização Detalhada do Relato

[GabrielAderaldo]

Este card contempla a construção da tela de baixa fidelidade (wireframe) para a visualização de um relato individual ainda não triado. A proposta é mapear todas as experiências possíveis (felizes, tristes, vazias, exageradas, incompletas, absurdas...) com base nas decisões que o QA pode tomar.

O objetivo é dar clareza total à estrutura lógica e funcional da feature antes de pensar em visual ou estilo. Cada estado do componente deve ser desenhado e explicado.

---

🎯 Objetivos:

• Planejar como será a leitura completa de um relato individual
• Mapear todos os estados possíveis da tela (carregando, erro, relato não encontrado, sucesso, relato incompleto etc.)
• Explicitar como o QA irá interagir com as informações antes de aprovar/descartar
• Validar espaçamento, agrupamentos, foco visual, fluxo de leitura

---

📚 Requisitos Representados:

Elemento	Descrição
Título e Descrição do relato	Área grande e destacada para leitura clara
Informações técnicas (SO, navegador, resolução etc.)	Agrupadas em bloco lateral ou abaixo
Categoria e prioridade	Com destaque visual claro
Imagens anexadas	Espaço reservado com fallback visual caso não exista
Botões de ação	Aprovar, Descartar, Duplicado (fixos ou sempre acessíveis)
Estados visuais	Loading, erro, inexistente, sucesso, pendente, com/sem imagem

---

⚙️ Fluxo Visual de Baixa Fidelidade

flowchart TD
    A[Dashboard principal] --> B[Usuário clica em relato]
    B --> C[Abre modal/drawer ou nova rota]
    C --> D[Renderiza estado: carregando]
    D --> E[Renderiza dados do relato]
    E --> F{QA decide ação}
    F --> G1[Aprova como bug]
    F --> G2[Descarta]
    F --> G3[Marca como duplicado]

Loading

---

🧪 Critérios de Aceite:

Critério	Avaliação
Cada variação de estado tem um wireframe claro	✅
Os blocos de conteúdo estão agrupados de forma lógica	✅
Fluxo de leitura do QA está priorizado	✅
Botões de ação são sempre acessíveis	✅
Todos os estados extremos e intermediários foram representados	✅

---

Important

Em caso de dúvida, voltar ao epico pai da feature. Ele detalha a motivação, o contexto e o propósito do card.

Warning

Não avance para média fidelidade antes que o P.O valide todos os fluxos e estados propostos aqui.

Tip

O QA precisa tomar decisões rápidas — o foco aqui é estruturar essa experiência de forma limpa e intuitiva.

---