A tela-mãe muda com o papel
Agenda para o instrutor. Painel para o gestor. O app abre no contexto que resolve o trabalho imediato.
Central de experiência
Uma operação.
Dois contextos.
A visão navegável do novo app que coloca a agenda no centro do dia do instrutor e os indicadores, o caixa e a operação na mão do gestor.
Mobile first
White-label
24telas
mapeadas
mapeadas
2papéis
5blocos
4protótipos
Projetado para uso rápido, com uma mão e leitura sob luz intensa.
Uma identidade
Troca de papel sem novo login, com o contexto ativo sempre explícito.
Dinheiro com segurança
Confirmação, rastro de autoria e privacidade para toda operação financeira.
Perfis
O mesmo app, sem ruído entre papéis
O servidor resolve as capacidades no login. O controle de troca só aparece para quem realmente exerce os dois papéis.
Instrutor
Agenda, alunos e aulas
Vê o próximo aluno, marca, desmarca e registra o que aconteceu.
- Home: Agenda
- 4 abas
- + Nova aula
Gestor
Indicadores, operação e caixa
Acompanha o CFC e executa as rotinas financeiras do balcão.
- Home: Painel
- Até 5 abas
- + Lançamento
Duplo papel
Troca de contexto em um toque
Uma folha curta troca toda a casca do app e preserva o último papel usado.
- Sem novo login
- Switcher no topo
- Preferência local
Pacote visual
Protótipos de referência
Quatro telas-chave mostram a linguagem visual de campo: contraste alto, leitura rápida, cartões estruturados e ações generosas.
↗ Selecione qualquer protótipo para ampliar e percorrer a tela completa.
Arquitetura
Mapa completo de telas
Pesquise, filtre por papel e abra cada cartão para consultar propósito, conteúdo, ações e regras da spec.
⌕Nenhuma tela encontrada
Tente outro termo ou limpe os filtros.
Jornadas
Os caminhos essenciais
A navegação muda por contexto, mas compartilha identidade, sessão, preferências e detalhe de aula.
A Entrada
A1 · Splash
↓
A2 · Login
↓
Resolver capacidades
C Instrutor
C1 · Agenda
C2 DetalheC3 FecharC5 Nova aula
B Duplo papel
A4 · Apresentação
↕
B2 · Trocar papel
D Gestor
D1 · Painel
D3 OperaçãoD4 ComercialE1 Financeiro
Entrada completa
Splash → login → capacidades → apresentação do duplo papel → home correta.
Marcação de aula
Aluno → categoria e tipo → data → horário → revisão → confirmação.
Lançamento rápido
Entrada ou saída, valor, classificação, situação e confirmação com rastro.
Quitação
Parcela → acréscimos decompostos → conta e forma → confirmação → recibo.
Fundação
Sistema visual de campo
Uma base funcional, robusta e adaptável à marca de cada CFC sem perder contraste, hierarquia ou significado.
White-label, com semântica estável
Primária#1E40AF
Secundária#F59E0B
Realizada#16A34A
Falta#DC2626
Cor nunca trabalha sozinha: situações sempre têm rótulo explícito.
48.320,15Display métrico · 32/38
Próxima aulaHeadline · 22/28
Inter, números tabulares e contraste preparado para leitura rápida sob luz intensa.
56 px
Alvos de toque generosos
Mínimo de 48 px, ações principais na zona do polegar e margens móveis de 16 px.
10 componentes-base
Reutilizados para manter previsibilidade entre instrutor, gestor e financeiro.
Card de aulaChip de situaçãoFaixa de diasBloco numéricoLinha de alunoSeletor de períodoCard de parcelaLinha monetáriaFolha com buscaTeclado de valor
Comportamento
Estados, configurações e privacidade
A interface explica o que está acontecendo, preserva o conteúdo útil e remove controles que o usuário não pode acionar.
Esqueleto do conteúdo real; na atualização, dados anteriores permanecem visíveis.
Mensagem específica do contexto e próxima ação quando existir.
Linguagem comum, sem código técnico, com “Tentar novamente”.
Faixa persistente, cache navegável e escrita bloqueada com explicação.
Sessão expirada: volta ao login com aviso e preserva o papel ativo. Ação sem permissão: o controle não é renderizado; não há botão desabilitado por permissão.
CONFIGURAÇÕES DO CFC
7 regrasO produto se adapta à operação
- Fechamento pelo instrutorBotões + aba Fechar
- Saldos do alunoDetalhe + categorias
- Observações da aulaCard + detalhe
- Telefone do alunoLigar + WhatsApp
- Janela da agendaDias antes + depois
- IdentidadeCores + logo
PERMISSÕES FINANCEIRAS
7 regrasSem permissão, sem controle
- Visualizar resumoSaldo + totais
- Exibir saldo de contasConsolidado + individual
- Lançamento retroativoData anterior
- Quitar com outra dataData da quitação
- Editar valor / acréscimosAjustes condicionais
- Movimentos de terceirosFiltro + responsável
PRIVACIDADE COMPARTILHADA
Valores sensíveis somem em um toque
O mesmo estado vale para Painel e Fluxo de caixa e persiste no dispositivo.
Saldo em contasR$ 48.320,15
Microcopy
Direta, humana e do domínio
Segunda pessoa, verbos de ação, sem jargão técnico e sem culpar o usuário.
“Tudo em dia. Nenhuma aula aguardando fechamento.”
“Aula desmarcada. O horário voltou para a grade.”
“Parcela quitada. R$ 206,40 recebidos em Caixa.”
Governança
Matriz tela × papel
O papel define a casca e as capacidades. Acesso financeiro é uma permissão adicional do gestor.
| Tela | Instrutor puro | Gestor puro | Duplo papel |
|---|
i Sem acesso ao financeiro, o bloco E e a aba Financeiro desaparecem; a tab bar do gestor retorna a quatro itens.
Próxima fase
Entregáveis sugeridos
Os cenários abaixo validam navegação, variações de contexto, estados críticos e flexibilidade white-label.
- 01Fluxo de entrada completo
A1 → A2 → A4 → home nas três formas do app.
- 02Agenda em quatro estados
Dia cheio, dia vazio, carregando e sem conexão.
- 03Marcação em cinco etapas
Incluindo uma tela de erro de regra.
- 04Painel do gestor
Quatro seções e seletor de período.
- 05Troca de papel animada
Saindo de C1 e chegando em D1.
- 06Lançamento rápido
Caminho simples e completo com parcelamento.
- 07Quitação em três variações
Em dia, vencida e via cobrança online.
- 08Privacidade financeira
Fluxo de caixa com valores visíveis e ocultos.
- 09Duas marcas
Uma clara e uma escura para provar o white-label.
- 10Persona minimalista
Configurações e permissões desligadas, inclusive sem Financeiro.