Estúdio de criação
O estúdio é o coração da plataforma: a tela em que o conhecimento clínico do profissional vira instrução de fabricação.
Anatomia
Seção intitulada “Anatomia”flowchart TB
subgraph header ["① Barra de passos"]
direction LR
p2["Produto<br/><small>2º passo</small>"] --- p3["Peças<br/><small>3º passo</small>"] --- p4["Cobertura<br/><small>4º passo</small>"] --- nota["Nota"] --- ajuda["Ajuda"]
end
subgraph work ["② Área de trabalho (A4)"]
direction LR
canvas["Plantigrafia + elementos<br/>(Konva)"]
tools["③ Controles<br/>tela · elementos · plantigrafia<br/>selecionar · remover seleção"]
end
subgraph footer ["④ Rodapé"]
direction LR
parcial["Parcial"] --- lados["Esquerdo · Direito<br/><small>1º passo</small>"] --- sair["Salvar e Sair"]
end
header --> work --> footer
| Região | Comportamento |
|---|---|
| ① Passos | Desabilitados até o passo anterior estar completo (aria-label “Finalize o passo anterior para habilitar este passo”). O passo ativo fica em vermelho. |
| ② Área A4 | Proporção 1 : 1,414; plantigrafia de fundo; elementos arrastáveis. |
| ③ Controles | Comandos de tela: zoom +, zoom −, recentralizar. Controles de plantigrafia: atualizar, remover. Elementos: selecionar e remover seleção. |
| ④ Rodapé | Parcial abre o resumo de preços; Esquerdo/Direito alterna o pé (é o 1º passo); Salvar e Sair volta aos rascunhos. Mostra “Salvando status…” enquanto sincroniza. |



Regras de interação
Seção intitulada “Regras de interação”- Sequência obrigatória: plantigrafia (os dois pés) → produto → peças → cobertura. Nota e ajuda a qualquer momento.
- Lado de cada peça: ambos, direito ou esquerdo, definido ao adicionar e
alterável depois (
PATCH /drafts/:id/pieces/side). - Salvamento automático do estado (
vector-state) e das imagens de criação, sem botão “salvar” obrigatório. - Informação do item: o ícone (i) em cada card abre a descrição técnica
da peça, produto ou cobertura (
infoType,miniatureInfoType).
Problemas observados
Seção intitulada “Problemas observados”| Problema | Impacto | Sugestão |
|---|---|---|
| Em 375 px de largura, o canvas e a coluna de controles passam da tela (os controles ficam cortados). | O profissional no celular não alcança as ferramentas. | Controles em barra flutuante inferior no mobile; canvas com max-width: 100vw. |
| “Salvando status…” fica visível por muito tempo nas telas de cobertura, nota e ajuda, inclusive nos dois botões do rodapé. | Dúvida se o trabalho foi salvo (H1). | Indicador discreto com estado final (“Salvo às 14:32”). |
| A tela de upload diz “folha A4 (21cm x 27,9cm)”. | 27,9 cm é a altura do formato Carta; A4 tem 29,7 cm. Pode induzir a plantigrafia em papel errado, e o papel define a escala. | Corrigir o texto para 21 × 29,7 cm. |
Rótulos dos controles em inglês (zoomIn, resetZoom) e botões só com ícone. |
Leitores de tela leem “zoomIn”; a função dos ícones não é óbvia (H6). | aria-label em português e tooltip visível. |
| O “1º passo” (pés) fica no rodapé e os passos 2–4 no topo. | Quebra o modelo mental de sequência (H4). | Incluir “Plantigrafia · 1º passo” na barra de passos. |

Desenvolvido e documentado porNós Tecnologia · Desenvolvimento Criativo

