diff --git a/figma-import/01-wireframes.html b/figma-import/01-wireframes.html new file mode 100644 index 0000000..c677103 --- /dev/null +++ b/figma-import/01-wireframes.html @@ -0,0 +1,15 @@ + + + +Sinapse — Wireframes Sprint 1 + +

Sinapse · Wireframes Sprint 1

Baixa fidelidade do fluxo solicitado no PRE-05. As pranchas testam estrutura, campos obrigatórios, estados e hierarquia antes de aplicar o sistema visual.

Fluxo: Login → Projetos → Novo projeto → Projeto → Épico → Feature → PBI.

+
+
SINAPSE

Entrar na área interna

Acesse a memória institucional da equipe.

E-MAIL
SENHA
Entrar →

Após autenticação, retornar à página solicitada.

+
SINAPSEBusca · Notificações · Perfil
ORGANIZAÇÃO DO TRABALHO

Projetos

+ Novo projeto

Nenhum projeto cadastrado

Crie o primeiro projeto para organizar épicos e conhecimento.

Criar primeiro projeto
+
SINAPSEProjetos / Novo projeto

Criar projeto

Nome e cliente são obrigatórios. O cadastro válido abre o detalhe do projeto.

NOME DO PROJETO *
Portal do Cliente
CLIENTE *
PRO4TECH
DESCRIÇÃO
Centralizar especificações e decisões do cliente.
Criar projeto Cancelar
Inválido
Nome do projeto
Informe o nome do projeto.
Carregando

○ Criando projeto…

Criando…
Erro

Este nome já está em uso por um projeto ativo.

Tentar novamente
+
SINAPSEProjetos / Portal do Cliente
Projetos › Portal do Cliente

Portal do Cliente

Projeto

Contexto do cliente

Épico

Iniciativa ampla

Feature

Capacidade específica

PBI

Comportamento testável

ÉPICO · RASCUNHO

Gestão de solicitações

Abrir épico
Regra de navegação

Épico é criado no projeto; feature exige épico; PBI exige feature.

+
SINAPSESalvar rascunho · Concluir
Projeto › Épico › Feature › PBI-024
RASCUNHO

Registrar solicitação

COMO UM *
Product Owner
EU QUERO *
registrar uma solicitação
PARA QUE *
a equipe possa priorizá-la.

Critérios de aceitação

01 · Criar solicitação válida

DADO que ...

QUANDO que ...

ENTÃO que ...

+ Adicionar cenário
+
diff --git a/figma-import/02-design-system.html b/figma-import/02-design-system.html new file mode 100644 index 0000000..d6b6544 --- /dev/null +++ b/figma-import/02-design-system.html @@ -0,0 +1,12 @@ + + +Sinapse — Design System +
SINAPSE / PRE-05

Design System

Biblioteca mínima para os fluxos da Sprint 1. O sistema prioriza legibilidade, contraste e baixa carga visual em um tema escuro.

+

Tokens de cor

Bg / 950
#07111F · fundo da aplicação

Surface / 900
#0B1626 · cards e painel

Action / 400
#24BEDB · ação principal

Danger
#FB7185 · erro e bloqueio

+

Tipografia e espaçamento

Título de página

Corpo de texto para explicar contexto e orientar decisões.

Inter / system-ui · títulos 30–42 px · corpo 14–16 px

Escala de espaço

4 / 8 / 16 / 24 / 32 px

Raios e bordas

8 / 12 / pill

+

Componentes base

Botões
Salvar alteraçõesCancelarVoltarArquivar
Campos e validação
O foco visível usa contorno ciano de 3 px.
Status
ATIVO Projeto disponívelRASCUNHO Pode ter campos pendentesBLOQUEADO Não é possível concluirCONTEXTO Informação herdada
+

Padrões de domínio

Hierarquia e breadcrumb

Projeto Épico Feature PBI

O pai é sempre visível e navegável; cada nível só nasce no seu pai válido.

Cenário de aceitação (PBI)
01 · Criar projeto válido

DADO que o PO esteja autenticado

QUANDO informar os dados obrigatórios

ENTÃO abrir o detalhe do projeto criado

Painel de qualidade
Título no infinitivo
Em conformidade
Cenários de aceitação
Inclua ao menos um cenário completo.
+

Comportamento responsivo

Desktop primeiro · conteúdo até 1240 px

Em telas menores, navegação lateral recolhe; formulários de duas colunas passam a uma coluna; ações de cabeçalho empilham. Áreas interativas mantêm altura mínima de 40 px.

+
diff --git a/figma-import/03-prototipo-sprint-1.html b/figma-import/03-prototipo-sprint-1.html new file mode 100644 index 0000000..aa1daa5 --- /dev/null +++ b/figma-import/03-prototipo-sprint-1.html @@ -0,0 +1,17 @@ + + + +Sinapse — Protótipo Sprint 1 + +
PRE-05 · ENTREGA DE UX

Sinapse · Protótipo navegável / Sprint 1

Fluxo de especificação: autenticar, criar o contexto do projeto e decompor a necessidade em Épico, Feature e PBI testável.

+
+
+
Cauan Gabriel · Product Owner ▾
ORGANIZAÇÃO DO TRABALHO

Projetos

Reúna o contexto do cliente e organize os requisitos da equipe.

+ Novo projeto

Nenhum projeto cadastrado

Crie o primeiro projeto para começar a organizar o trabalho.

Criar primeiro projeto
+
Cauan Gabriel · Product Owner ▾
Projetos / Novo projeto
NOVO CONTEXTO

Criar projeto

Nome e cliente são obrigatórios. A descrição contextualiza a especificação.

Dados preenchidos. Pronto para criar.

Criar projeto Cancelar
Estado alternativo: criando projeto…
+
Cauan Gabriel · Product Owner ▾
Projetos / Novo projeto

Criar projeto

Informe o nome do projeto.
Este nome já está em uso por um projeto ativo. Escolha outro nome para continuar.
+
Cauan Gabriel · Product Owner ▾
Projetos / Portal do Cliente
ATIVO

Portal do Cliente

PRO4TECH · Centralizar solicitações, decisões e requisitos.

+ Novo épico
PROJETO

Portal do Cliente

Contexto e conhecimento do cliente.

ÉPICO · RASCUNHO

Gestão de solicitações

Descrição, objetivo, escopo macro e resultado esperado.

FEATURE · RASCUNHO

Cadastro de solicitações

Capacidade específica vinculada ao épico.

PBI-024 · RASCUNHO

Registrar solicitação

História separada e critérios testáveis.

ÉPICO

Campos obrigatórios

Descrição, objetivo, escopo macro, resultado esperado e critérios.

Editar épico
FEATURE

Vínculo visível

Ao abrir a feature, o épico de origem permanece acessível.

Editar feature
REGRA

Criação contextual

Feature exige épico; PBI exige feature. Não há criação fora da hierarquia.

+
Salvar rascunho   ·   Cauan Gabriel
Portal do Cliente › Gestão de solicitações › Cadastro de solicitações › PBI-024
RASCUNHO

Registrar solicitação

Um PBI descreve um comportamento testável e pertence obrigatoriamente a uma feature.

Em conformidade: começa com verbo no infinitivo.

História do usuário

Critérios de aceitação

Contexto da feature · Exibir os critérios gerais da feature sem sair do PBI.
01 · Criar solicitação válida

DADO que o Product Owner esteja autenticado

QUANDO informar os campos obrigatórios e confirmar

ENTÃO a solicitação deve ser criada e exibida na lista

+
Cauan Gabriel · Product Owner
Portal do Cliente › Gestão de solicitações › Cadastro de solicitações › PBI-025
RASCUNHO

Registrar solicitação

História do usuário

COMO UM Product Owner
EU QUERO registrar uma solicitação
PARA QUE a equipe possa priorizá-la.

Critérios de aceitação

Nenhum cenário registrado.

+
diff --git a/figma-import/04-design-system-garakis.html b/figma-import/04-design-system-garakis.html new file mode 100644 index 0000000..ccb38e9 --- /dev/null +++ b/figma-import/04-design-system-garakis.html @@ -0,0 +1,10 @@ + + +Sinapse — Biblioteca Garakis
Sinapse · referência Garakis

Biblioteca de componentes

Consolidação fiel dos documentos Main.dc.html, Componentes.dc.html e Padroes.dc.html>. Não utiliza o conteúdo de docs/design/prototipo.

+

Tokens de cor

Fundo
#0B0D10
Superfície
#111827
Acento
#ED6A32
Erro
#F0635D
+

Tipografia e forma

Backlog do produto

Public Sans · títulos 42/800, 28/700, 18/600

Texto de leitura contínua para descrição, critérios e contexto do item.

Inter · corpo 15/400 · interface 14/500 · apoio 13/400

Raio único: 10px. Pílula apenas para etiquetas.

+

Controles

Botões

Salvar itemDescartarVer históricoArquivar

Campo com orientação

Comece por um verbo no infinitivo.
ⓘ Troque por um verbo no infinitivo.

Etiquetas

MustShouldRascunhoAprovado
+

Padrões do domínio

Hierarquia

ProjetoÉpicoFeaturePBI

Breadcrumb expõe sempre o pai e dá acesso ao contexto de origem.

Cenário estruturado

01 · Criar projeto válido

DADO que o PO esteja autenticado

QUANDO preencher os campos obrigatórios

ENTÃO abrir o detalhe do projeto

Qualidade

✓ Título no infinitivo
✓ História completa
ⓘ Inclua pelo menos um cenário completo.
+
diff --git a/figma-import/05-modulos-ia-e-ingestao.html b/figma-import/05-modulos-ia-e-ingestao.html new file mode 100644 index 0000000..25b770a --- /dev/null +++ b/figma-import/05-modulos-ia-e-ingestao.html @@ -0,0 +1 @@ +Sinapse — Módulos de conhecimento
SNAPSE
ARQUITETURA DE CONHECIMENTO

Conhecimento não é uma área de upload

Documentos pertencem a um projeto. Depois de processados, eles — junto de itens e decisões — compõem o acervo, que pode ser pesquisado ou consultado em conversa.

DENTRO DO PROJETO

Documentos

Envio, estado de processamento, autoria e data. O contexto do projeto permanece visível.

Ver tela de documentos →
CONSULTA TRANSVERSAL

Conhecimento

Busca conteúdo já indexado. Cada resultado informa projeto, tipo e origem navegável.

Ver tela de busca →
CONVERSA COM FONTES

Conversa

Consulta o acervo no escopo selecionado; histórico e fontes aparecem apenas neste módulo.

Ver tela de conversa →
Operação administrativa: a carga inicial de API-1, API-2 e API-3 fica em Administração. Ela não substitui o envio de documentos dentro de um projeto.
diff --git a/figma-import/06-prototipo-navegavel-garakis.html b/figma-import/06-prototipo-navegavel-garakis.html new file mode 100644 index 0000000..8891215 --- /dev/null +++ b/figma-import/06-prototipo-navegavel-garakis.html @@ -0,0 +1,13 @@ +Sinapse — Protótipo Garakis
SNAPSE
+
ESPAÇO DE TRABALHO

Projetos

Cada projeto concentra seu backlog, documentos e decisões.

ATIVO

Portal do Cliente

Cliente: PRO4TECH · 12 PBIs · 9 documentos

RASCUNHO

Central de Serviços

Cliente: PRO4TECH · sem itens ativos

ATIVO

Aplicativo do Parceiro

Base documental indexada

+
/Novo projeto

Crie um espaço de trabalho

O projeto será o contexto para backlog, documentos e decisões.

O nome deve ser único entre projetos ativos.
+
/Portal do Cliente
ATIVO

Portal do Cliente

Cliente: PRO4TECH · Contexto central do produto.

Backlog

3 épicos · 6 features · 12 PBIs

Documentos

9 processados · 1 em processamento

Conhecimento

O conteúdo processado pode ser pesquisado e consultado.

+
//Backlog
PROJETO ATIVO

Backlog

Estruture o trabalho em Projeto → Épico → Feature → PBI.

PROJETO

Portal do Cliente

Iniciativa ativa.

ÉPICO

Gestão de solicitações

Resultado amplo.

FEATURE

Cadastro de solicitações

Capacidade funcional.

PBI

Registrar solicitação

Comportamento testável.

+
///PBI-024
RASCUNHO

Registrar solicitação

Feature: Cadastro de solicitações.

Qualidade da especificação

✓ Título com verbo no infinitivo

✓ História do usuário completa

Critérios de aceitação podem ser adicionados antes da conclusão.

+
//Documentos
DOCUMENTOS DO PROJETO

Referências de Portal do Cliente

Arquivos enviados aqui pertencem somente a este projeto e alimentam seu conhecimento após processamento.

Como funciona: depois do envio, o arquivo é processado. Quando estiver pronto, poderá aparecer na Busca e na Conversa com origem identificada.
PDF
Backlog_Produto_v1.1.pdf
2,4 MB · enviado por Cauan em 08 set.
PROCESSANDO
MD
Decisoes_do_projeto.md
42 trechos indexados · enviado por Ana em 07 set.
PROCESSADO
DOC
Briefing_cliente.docx
Falha na extração. O arquivo continua vinculado ao projeto.
+
CONHECIMENTO

Buscar no acervo

Pesquise conteúdo já processado: itens de trabalho, decisões e documentos.

Escopo: Portal do Cliente ·

PBI
PBI-02.1.1 — Anexar documento ao projeto

Aceita PDF, DOCX, MD ou TXT, valida tipo e preserva o vínculo com o projeto.

DOCUMENTO
Backlog_Produto_v1.1.pdf

Projeto: Portal do Cliente · Processado em 08 set.

+

Olá, Cauan

Consulte o conhecimento da equipe com fontes verificáveis.

Escopo ativo: Portal do Cliente
As respostas usarão somente documentos, decisões e itens deste projeto.

Respostas fundamentadas no acervo. Sempre verifique as fontes antes de tomar decisões.

+
ADMINISTRAÇÃO

Carga inicial do acervo

Operação restrita: seleciona materiais de projetos anteriores para compor a base inicial.

ACESSO ADMINISTRATIVO
Não é upload de projeto. Esta carga é excepcional e não substitui a aba Documentos de cada projeto.
API-1

Backlog e requisitos

12 arquivos elegíveis

API-2

Gestão de equipe

9 documentos elegíveis; anexos de teste excluídos.

API-3

Dashboard e documentos

7 arquivos elegíveis

+
diff --git a/figma-import/GUIA_UX_HEURISTICAS_NIELSEN.md b/figma-import/GUIA_UX_HEURISTICAS_NIELSEN.md new file mode 100644 index 0000000..1333d1e --- /dev/null +++ b/figma-import/GUIA_UX_HEURISTICAS_NIELSEN.md @@ -0,0 +1,71 @@ +# Guia UX — clareza de contexto e heurísticas de Nielsen + +## Princípio central + +O usuário não deve precisar deduzir onde está nem para onde seu conteúdo vai. Toda tela deve responder, visualmente e antes de qualquer ação: + +1. **Em que contexto estou?** (organização, projeto ou toda a base) +2. **O que posso fazer aqui?** +3. **O que acontecerá com esta informação?** +4. **Como volto ou verifico a origem?** + +### Linguagem de navegação + +| Termo | Significado visível para o usuário | Não deve significar | +| --- | --- | --- | +| Projetos | Espaços de trabalho de clientes/iniciativas | Documentos globais | +| Backlog | Épicos, Features e PBIs do projeto selecionado | Arquivos ou conversas | +| Documentos | Arquivos anexados ao projeto selecionado | Conhecimento pesquisável por si só | +| Conhecimento | Busca no conteúdo já processado do acervo | Local de upload | +| Conversa | Perguntas ao acervo, com fontes e escopo | Chat genérico sem evidência | + +## Regras globais de interface + +- A barra superior mostra a área atual. O item ativo tem texto e fundo diferentes, não depende somente da cor. +- Sempre que a pessoa estiver dentro de um projeto, mostrar breadcrumb fixo: `Projetos / [Nome do projeto] / [Área]`. +- Um selo de contexto no topo informa `Projeto: Portal do Cliente` ou `Escopo: Toda a base`. +- Ações de criação usam verbos claros: `Criar projeto`, `Adicionar épico`, `Enviar documento`; evitar o genérico `Salvar` sem contexto. +- Ações destrutivas exigem confirmação, mostram impacto e oferecem saída segura. +- Estados vazios explicam a causa, o próximo passo e o resultado da ação. + +## Aplicação por tela + +| Tela | Clareza necessária | Heurísticas de Nielsen aplicadas | +| --- | --- | --- | +| Lista de projetos | Deixar evidente que é a porta de entrada e que cada card é um contexto isolado | 1 Visibilidade: contadores e status; 2 Mundo real: nome do cliente/projeto; 3 Controle: filtro e retorno; 4 Consistência: mesmo padrão de cards | +| Criar projeto | Explicar os campos e impedir ambiguidade de nome | 5 Prevenção de erro: validar nome obrigatório/duplicado antes de criar; 9 Recuperação: mensagem ao lado do campo; 6 Reconhecimento: exemplos de objetivo e cliente | +| Visão geral do projeto | Confirmar persistentemente o projeto ativo e apresentar as áreas pertencentes a ele | 1 Visibilidade: status/atividade; 6 Reconhecimento: abas Backlog e Documentos; 8 Minimalismo: somente resumo e próximos passos | +| Backlog do projeto | Explicitar a hierarquia e o pai de cada item | 2 Mundo real: termos do guia PRO4TECH; 4 Consistência: Projeto → Épico → Feature → PBI; 7 Eficiência: filtro, busca e atalho para criação; 1 Visibilidade: rascunho/concluído/arquivado | +| Detalhe de item | Separar campos próprios de Épico, Feature e PBI e mostrar qualidade em tempo real | 5 Prevenção: bloquear conclusão incompleta, não rascunho; 1 Visibilidade: checklist de conformidade; 9 Recuperação: indicar campo e correção; 3 Controle: descartar ou manter rascunho | +| Documentos do projeto | Tornar explícito que o arquivo pertence ao projeto exibido e informar seu ciclo de processamento | 1 Visibilidade: aguardando/processando/processado/falhou; 2 Mundo real: nome, tipo, autor, data e tamanho; 5 Prevenção: tipo e limite antes do envio; 9 Recuperação: motivo da falha e `Tentar novamente` | +| Carga inicial do acervo | Distinguir importação administrativa de upload normal e comunicar seleção/risco | 2 Mundo real: origem API-1/2/3; 5 Prevenção: lista explícita do que será excluído (código, anexos de teste); 3 Controle: revisão antes da confirmação; 1 Visibilidade: progresso e relatório final | +| Busca no conhecimento | Explicar que pesquisa conteúdo indexado, não arquivos em tempo real, e manter a origem visível | 1 Visibilidade: filtros/escopo/resultados; 6 Reconhecimento: tipo e projeto da fonte; 7 Eficiência: filtros por projeto, nível e status; 10 Ajuda: explicar indexação e estados sem resultado | +| Conversa | Fixar o escopo, mostrar fontes navegáveis e distinguir conversa de busca | 1 Visibilidade: selo de escopo persistente e estado de resposta; 3 Controle: trocar escopo e iniciar conversa; 9 Recuperação: indisponibilidade preserva a pergunta; 10 Ajuda: informar limites da base; 6 Reconhecimento: histórico com título, data e escopo | + +## Padrões obrigatórios para feedback + +| Situação | Resposta da interface | +| --- | --- | +| Documento enviado | `Arquivo enviado para Portal do Cliente. Processamento iniciado.` | +| Documento processado | `Pronto para busca e conversa neste projeto.` | +| Resultado fora do escopo do chat | `Não encontrei evidência em Portal do Cliente. Buscar em Toda a base?` | +| Chat sem evidência | `Não encontrei informação suficiente no acervo selecionado.` Sem resposta especulativa. | +| PBI incompleto | `Rascunho salvo. Faltam 2 campos obrigatórios para concluir este PBI.` | +| Exclusão de documento | Modal com nome, projeto, impacto no índice e opção explícita `Remover documento e conteúdo indexado`. | + +## Critérios de aceite de UX para o protótipo + +1. Em teste de cinco segundos, participantes identificam o projeto ativo na tela de Backlog e Documentos. +2. Participantes distinguem, sem ajuda, `Enviar documento ao projeto` de `Carregar acervo inicial`. +3. Participantes entendem que o chat responde apenas usando o escopo e conseguem alterar esse escopo. +4. Ao abrir uma fonte do chat, participantes chegam ao documento ou item correto e veem seu projeto de origem. +5. Em estados vazios, participantes conseguem concluir a primeira ação sem recorrer a ajuda externa. +6. Nenhuma ação crítica depende apenas de ícone, cor ou memória do usuário. + +## Ajustes prioritários no HTML atual + +1. Inserir breadcrumb e selo do projeto em Backlog, PBI e Documentos. +2. Tirar `Documentos` e `Importar acervo` da navegação principal; o primeiro vira aba do projeto e o segundo, Administração. +3. Adicionar uma tela de Busca no conhecimento, distinta da tela Conversa. +4. Exibir no chat o seletor de escopo de forma persistente e oferecer ampliar para toda a base quando não houver evidência. +5. Fazer as fontes do chat navegarem ao item ou documento de origem. diff --git a/figma-import/PLANO_ARQUITETURA_TELAS.md b/figma-import/PLANO_ARQUITETURA_TELAS.md new file mode 100644 index 0000000..de923cc --- /dev/null +++ b/figma-import/PLANO_ARQUITETURA_TELAS.md @@ -0,0 +1,83 @@ +# Plano de esclarecimento — arquitetura de telas do Sinapse + +## Decisão de domínio + +O produto tem quatro conceitos distintos, que não devem competir como se fossem módulos equivalentes: + +`Projeto → Itens de trabalho / Documentos / Decisões → Acervo indexado → Chat` + +- **Projeto** é o contexto organizacional: cliente, descrição, status e tudo que pertence àquela iniciativa. +- **Itens de trabalho** são o backlog daquele projeto, na hierarquia `Projeto → Épico → Feature → PBI`. +- **Documentos** são anexos de um projeto (ou, no caso de protótipos, de um PBI). Eles não existem como coleção global independente. +- **Acervo** é uma projeção de consulta: reúne automaticamente documentos processados, itens concluídos e decisões, preservando projeto e origem. Não é outro lugar para cadastrar o mesmo conteúdo. +- **Chat** é uma forma de consultar o acervo. A conversa guarda escopo, histórico e fontes; não cria uma segunda base de documentos. + +## Navegação global proposta + +Na Sprint 1, a barra superior deve conter somente o que existe funcionalmente: + +1. **Projetos** — lista, criação e acesso ao detalhe. +2. **Backlog** — visão transversal ou atalho para o backlog do projeto em contexto. + +Itens futuros devem entrar progressivamente, sem antecipar telas que ainda não possuem capacidade entregue: + +3. **Conhecimento** (Sprint 2) — busca no acervo; também pode ser acessado por uma aba do projeto. +4. **Conversa** (Sprint 3) — chat sobre o acervo, com o histórico lateral exclusivo desta tela. +5. **Administração** — acesso por menu do usuário e condicionado à permissão. + +“Documentos” não deve ser item global do menu. “Importar acervo” também não: é uma operação administrativa de carga inicial, não uma área de trabalho recorrente do usuário final. + +## Mapa de telas + +| Área | Tela | Responsabilidade | Relação | +| --- | --- | --- | --- | +| Projetos | Lista de projetos | Localizar, filtrar e criar projetos | Entrada principal do produto | +| Projetos | Criar projeto | Nome, cliente e descrição; validar duplicidade | Após criar, abre detalhe do projeto | +| Projeto | Visão geral | Contexto, indicadores e atividade recente | Contém as abas abaixo | +| Projeto | Backlog | Navegar por Épicos, Features e PBIs | Cada item abre o detalhe correspondente | +| Item | Detalhe/edição | Campos próprios do nível, qualidade, decisões e rastreabilidade | PBI pode ter anexos visuais | +| Projeto | Documentos | Enviar, listar, acompanhar processamento e remover anexos | Alimenta o acervo automaticamente | +| Conhecimento | Busca | Recuperar itens, documentos e decisões por texto/semântica | Mostra origem e abre a fonte | +| Conversa | Chat | Perguntar sobre o acervo no escopo escolhido | Histórico lateral; fontes levam ao item/documento | +| Administração | Carga inicial | Curar e importar API-1, API-2 e API-3 | Excepcional; não pertence ao fluxo diário | + +## Fluxos principais + +### Especificar backlog + +`Projetos → Detalhe do projeto → Backlog → Épico → Feature → PBI` + +Ao concluir ou alterar um item, o sistema registra rastreabilidade e atualiza sua representação no acervo. A edição deve continuar viável sem IA. + +### Preservar conhecimento + +`Projeto → Documentos → Upload → Processamento → Acervo` + +Itens de trabalho e decisões também entram no acervo automaticamente. A listagem de documentos mostra o estado do arquivo; a busca e o chat mostram o conhecimento recuperável, nunca uma cópia desconectada do arquivo original. + +### Consultar conhecimento + +`Conhecimento (busca) ou Conversa → selecionar escopo → resposta/resultado → fonte → item ou documento de origem` + +O escopo pode ser um projeto ou toda a base, deve permanecer visível e restringe o conteúdo recuperado. O chat precisa declarar ausência de evidência e citar somente fontes efetivamente utilizadas. + +## Decisões de UX para o protótipo + +- Transformar a tela atual “Itens de trabalho” em uma aba de **Backlog** dentro do detalhe de projeto; manter uma visão transversal opcional no menu global. +- Mover a tela atual “Documentos” para a aba **Documentos** do projeto e manter o projeto selecionado sempre visível no breadcrumb. +- Renomear “Importar acervo” para **Carga inicial do acervo** e movê-la para Administração, com acesso restrito a administradores. +- Tratar “Acervo” como busca/consulta. A tela não deve oferecer upload nem criar documentos. +- Manter a lista de chats no lado esquerdo somente na rota de Conversa, como solicitado; ela representa histórico privado do usuário, não navegação global. +- Fazer fontes do chat abrirem o detalhe de PBI, épico, feature ou documento, conforme a origem. + +## Sequência de implementação + +1. Sprint 1: Projetos, detalhe de projeto, Backlog, detalhe de item e aba Documentos. +2. Sprint 2: processamento, estado de indexação, busca no acervo e copiloto dentro do editor de item. +3. Sprint 3: Conversa, histórico, escopo, fontes navegáveis, perfis e administração. + +## Pontos a validar com a PRO4TECH + +1. A pendência Q4 já aparece resolvida na especificação de `PBI-01.1.1`: existe Projeto acima de Épico. Confirmar a decisão formalmente para fixar a navegação. +2. Confirmar se a busca transversal precisa estar disponível no menu global já na Sprint 2 ou apenas dentro do contexto do projeto. +3. Definir quais perfis podem executar a carga inicial e o expurgo completo do acervo. diff --git a/figma-import/README.md b/figma-import/README.md new file mode 100644 index 0000000..1c26e87 --- /dev/null +++ b/figma-import/README.md @@ -0,0 +1,55 @@ +# PRE-05 — Design system e protótipo navegável + +Artefatos de design para o habilitador **PRE-05**. Este material é uma referência inicial para +alinhar a Sprint 1 e liberar as tarefas de frontend dependentes; não substitui a validação com a +PRO4TECH nem representa a especificação visual definitiva do produto. + +## Fonte de verdade do protótipo atual + +- HTML navegável: [`06-prototipo-navegavel-garakis.html`](06-prototipo-navegavel-garakis.html) +- Figma consolidado: [Sinapse — PRE-05 · Protótipo e Design System](https://www.figma.com/design/qwALFr6yeP0fyOkLo6GiUB/Sinapse-%E2%80%94-PRE-05-%C2%B7-Prot%C3%B3tipo-e-Design-System?node-id=1-2) +- Página Figma: `PRE-05 — Protótipo e Design System` (oito telas na mesma página) + +## Conteúdo da pasta + +| Arquivo | Papel | Situação | +| --- | --- | --- | +| `06-prototipo-navegavel-garakis.html` | Protótipo de referência atual, com rotas e telas revisadas | Usar para desenvolvimento e revisão | +| `05-modulos-ia-e-ingestao.html` | Mapa conceitual de Documentos, Conhecimento e Conversa | Material complementar | +| `04-design-system-garakis.html` | Tokens e componentes inspirados na base Garakis autorizada | Referência visual | +| `GUIA_UX_HEURISTICAS_NIELSEN.md` | Critérios de experiência e heurísticas por tela | Referência de UX | +| `PLANO_ARQUITETURA_TELAS.md` | Arquitetura de domínio, telas e relações | Referência de produto/arquitetura | +| `TUTORIAL_FIGMA.md` | Instruções de importação manual | Operação | +| `01-wireframes.html`, `02-design-system.html`, `03-prototipo-sprint-1.html` | Explorações anteriores | Histórico; não usar como fonte principal | + +## Escopo visual atual + +`Projeto → Backlog / Documentos / Decisões → Acervo indexado → Busca e Conversa` + +- **Projetos** são o contexto de trabalho. +- **Backlog** apresenta a hierarquia `Projeto → Épico → Feature → PBI`. +- **Documentos** pertencem a um projeto e só passam a alimentar o acervo após processamento. +- **Conhecimento** é busca no conteúdo já indexado; não é área de upload. +- **Conversa** consulta o acervo com escopo persistente, fontes verificáveis e histórico lateral próprio. +- **Carga inicial do acervo** é uma operação administrativa, separada do envio de documentos do projeto. + +## Limites desta entrega + +- As interações são demonstrativas e não persistem dados. +- IA, busca, upload e processamento são representações de interface das Sprints 2 e 3. +- O script de captura do Figma existe apenas para facilitar a importação dos HTMLs. +- O visual deve ser revisado após retorno formal da PRO4TECH e implementação dos componentes reais. + +## Como revisar localmente + +```bash +cd figma-import +python3 -m http.server 4173 +``` + +Abra `http://127.0.0.1:4173/06-prototipo-navegavel-garakis.html`. + +## Pronto para commit + +Este diretório deve ser enviado integralmente no commit do PRE-05. Não incluir capturas +temporárias, arquivos em `/tmp`, nem artefatos exportados do navegador. diff --git a/figma-import/STATUS_PRE05.md b/figma-import/STATUS_PRE05.md new file mode 100644 index 0000000..2c97f73 --- /dev/null +++ b/figma-import/STATUS_PRE05.md @@ -0,0 +1,37 @@ +# Status de entrega — PRE-05 + +## Objetivo + +Disponibilizar uma referência navegável inicial e um design system de trabalho para desbloquear +as tarefas de frontend da Sprint 1, especialmente a estruturação de itens e a navegação do backlog. + +## Entregue + +- Protótipo HTML navegável com oito telas consolidadas em uma página Figma. +- Navegação e nomenclatura coerentes com o backlog: Projetos, Backlog, Documentos, Conhecimento, + Conversa e Administração. +- Tokens dark Garakis/Sinapse, componentes básicos e estados visuais. +- Diretrizes de arquitetura de telas e heurísticas de Nielsen. +- Referência de Figma pronta para comentários e handoff visual. + +## Não entregue neste habilitador + +- Implementação React, persistência, autenticação ou autorização. +- Upload real, extração, embeddings, busca semântica, chat ou streaming. +- Biblioteca Figma de componentes com variantes e tokens vinculados. +- Validação formal do cliente e aprovação definitiva de UX/UI. + +## Decisões para as tarefas dependentes + +1. Tratar `06-prototipo-navegavel-garakis.html` e o Figma consolidado como referência de layout. +2. Não implementar o protótipo como contrato fechado: campos, rótulos e fluxos podem evoluir após + validação do Product Owner e da PRO4TECH. +3. Implementar a Sprint 1 priorizando Projetos, Backlog, detalhe de item e Documentos vinculados + ao projeto. Conhecimento e Conversa são preparação visual para Sprints 2 e 3. +4. Manter a regra de domínio: documentos não são globais; o acervo é derivado e consultável. + +## Critério para encerrar PRE-05 + +- Time de frontend confirma que consegue iniciar as telas Sprint 1 usando a referência. +- Product Owner valida hierarquia, nomenclatura e fluxos prioritários. +- Comentários críticos do Figma são incorporados ou registrados como follow-up. diff --git a/figma-import/TUTORIAL_FIGMA.md b/figma-import/TUTORIAL_FIGMA.md new file mode 100644 index 0000000..9ab80d0 --- /dev/null +++ b/figma-import/TUTORIAL_FIGMA.md @@ -0,0 +1,36 @@ +# Como importar os HTMLs no Figma + +Os arquivos foram feitos como páginas HTML autocontidas: cada tela está em uma seção (`.frame`) +de 1440 px, sem imagens, scripts ou dependências externas. Isso torna a importação mais +previsível em plugins que convertem HTML em camadas editáveis. + +1. No Figma, crie ou abra o arquivo destinado ao design do Sinapse. +2. Abra **Resources** (`Shift` + `I`), procure o plugin de importação HTML disponível no time + e execute-o. Exemplos comuns são “HTML to Figma” e “Builder.io HTML to Figma”. +3. Escolha a opção de importar por **arquivo** ou cole o conteúdo do HTML — use um arquivo por + vez. Comece por `04-design-system-garakis.html`; depois importe + `03-prototipo-sprint-1.html` e `05-modulos-ia-e-ingestao.html`. +4. Quando o plugin perguntar pela largura, mantenha **1440 px** para as pranchas desktop. + Para o wireframe, importe `01-wireframes.html` em uma página separada. +5. No painel Layers, renomeie o frame raiz conforme o `data-name` da tela e mova as pranchas + para as páginas `Wireframes`, `Design system`, `Sprint 1` e `IA & ingestão`. +6. Revise a tipografia. Os arquivos usam `Public Sans` em títulos e `Inter` no conteúdo; + caso o plugin não as reconheça, instale/habilite essas fontes no Figma ou substitua por + uma fonte aprovada pelo time. +7. Conecte as interações no modo **Prototype**. No HTML de Sprint 1, as relações já estão + sinalizadas pela sequência: Login → Projetos → Cadastro → Hierarquia → PBI. No arquivo + de IA, a sequência é Importação → Upload/embeddings → Chat. + +## Arquivos recomendados + +| Ordem | Arquivo | Página no Figma | +| --- | --- | --- | +| 1 | `04-design-system-garakis.html` | Design system | +| 2 | `01-wireframes.html` | Wireframes | +| 3 | `03-prototipo-sprint-1.html` | Sprint 1 | +| 4 | `05-modulos-ia-e-ingestao.html` | IA & ingestão | + +Se o importador não aceitar arquivos locais, abra o HTML no navegador, copie o conteúdo-fonte +e use a opção **Import from code / Paste HTML** do próprio plugin. A aparência é preservada, +mas elementos podem chegar como grupos ou vetores dependendo do importador; nesse caso, +converta os controles recorrentes em componentes do Figma após a importação.