Voltar para o início
Instituto Inovação Social DP Danilo Padrin Administração
Controle de Frota · v1

Identidade visual do sistema

O mesmo padrão do painel de formulários do IIS, aplicado à retirada e devolução de veículos. Tudo o que está aqui já está pronto em tokens.css e base.css.

Cor

Oito tons, nada além

Marinho manda. Âmbar destaca.
Papel descansa.

Marinho#003B5CTopo, menu, títulos
Azul#00548DLinks e ícones ativos
Âmbar#FDC248Destaque e botão principal
Tinta#16232BTexto principal
Papel#F7F5F0Fundo da página
Carta#FFFFFFFundo dos cartões
Tinta 2#6D7B84Texto secundário
Fio#DFDACFToda borda, 1.5px
Estado

O status se lê de longe

Cor e palavra juntas — nunca cor sozinha.

Disponível Em uso Em manutenção Inativo
Revisão em dia Revisão próxima Revisão vencida Ocorrência aberta
Tipografia

Archivo, seis tamanhos

Nenhum tamanho a mais.
Número é sempre Archivo Black.

30 / 600Retirada de veículo
20 / 600Checklist de saída
15 / 600Fiat Strada Endurance
13 / 500Fotografe o odômetro e confira o número antes de confirmar.
11 / 500Retirado por Marina Alves às 07:42
RótuloPróxima revisão
Archivo Black · 72137km rodados
Archivo Black · 2452.617km do odômetro
Archivo Black · 13RTA-4C71placa
Medida

De quatro em quatro

Seis espaços, três cantos, um alvo de toque.

4 8 12 16 20 24
Nenhuma margem, nenhum vão fora desta lista.
18
cartão
22
coluna
total
botão
Alvo de toque mínimo: 44px. É app de celular, dedo com luva.
Peças

Os blocos do sistema

Botão, campo, etiqueta e menu.

Botões
Campos
Na prática

Como fica no Controle de Frota

Painel do gestor e tela do colaborador.

Total da frota12
Disponíveis7
Em uso4
Em manutenção1
FS Fiat Strada Endurance 2022 · Frota 04 RTA-4C71
Em usoRevisão vencida
ComMarina Alves
DesdeHoje, 07:42
KM de saída52.480
Próxima revisão52.000
Passo 2 de 4 Confira o odômetro
foto do odômetro
Li na foto 52.617 quilômetros
Confere? Se o número estiver errado, corrija antes de seguir.
Passo 3 de 4 Checklist de saída
Faróis OkProblema
Lanternas OkProblema
Pneu estepe OkProblema
Murcho. Foto anexada.
Triângulo OkProblema
Extintor OkProblema
Regras

O que nunca muda

1
Cor só sai da lista

Nada de tom novo no meio do caminho. Se faltar cor, a gente decide junto e coloca no tokens.css.

2
Borda é sempre 1.5px cor Fio

Não use sombra para separar. O sistema é desenhado a fio, não a sombra.

3
Âmbar é destaque, não é fundo

Serve para o botão principal, o item ativo do menu e o número que importa. Nunca para preencher área grande.

4
Número importante em Archivo Black

KM, placa e contadores. É o que o gestor procura primeiro na tela.

5
Nada abaixo de 44px de altura

Botão, campo e item de lista. O colaborador usa em pé, no pátio, às vezes de luva.

6
O KM lido nunca confirma sozinho

A foto preenche, a pessoa confere. Regra do PRD que vira regra de tela.

Instituto Inovação Social · Controle de Frota v1 Archivo + Archivo Black 01_IDENTIDADE/css/tokens.css · base.css