Padrões

Padrões UX

Composições recorrentes usadas nos apps Carapeto. Cada padrão é uma receita: copiar, adaptar, enviar.

01

Login

Padrão dos apps Gantt e CV Manager. Logo centrado, formulário sobre fundo escuro com glows verdes.

Carapeto
Gantt

02

App shell (topbar + sidebar)

Padrão oficial de shell dos apps Carapeto. Topbar fixa (logo à esquerda, usuário à direita), sidebar colapsável à esquerda. Aberta por padrão na home, fechada nas telas internas, sempre com botão de toggle na topbar.

Carapeto
Gantt
Projetos
2 projetos · visão admin
Projeto T
Cliente T
Teste dois
Cliente T
Topbar
  • · Altura fixa de 56px, borda inferior sutil.
  • · Esquerda: botão de menu (hambúrguer) + logo do app.
  • · Direita: nome do usuário, avatar, botão "Sair".
  • · Sempre visível, mesmo quando a sidebar está fechada.
Sidebar
  • · Largura 240px aberta, 64px colapsada (só ícones).
  • · Aberta por padrão na home / dashboard.
  • · Fechada por padrão nas telas internas.
  • · Toggle sempre disponível na topbar.

03

Kanban

Padrão do Carapeto CV Manager: colunas coloridas por status, cards com drag-and-drop.

PENDENTE
1
Senior Project Manager
Empresa
EN
ENVIADO
1
Senior Project Manager
Empresa
EN
TRIAGEM
0
Vazio
ENTREVISTA RH
0
Vazio
ENTREVISTA TÉCNICA
0
Vazio
BUSINESS CASE
0
Vazio
OFERTA
0
Vazio
CONTRATADO
0
Vazio
PERDIDO
0
Vazio

04

Empty states

Sempre com ícone contextual, título curto, CTA para desbloquear o próximo passo.

Sem projetos

Crie o primeiro para começar.

Nada encontrado

Tente outros termos de busca.

Sem usuários

Convide alguém para colaborar.

05

List row com metadados

Padrão da tela de Usuários do Gantt.

J
João Carapeto
joaoluizcarapeto@gmail.com
Admin
H
Hi Carapeto
hicarapeto@gmail.com
Usuário