01
Clareza
Hierarquia, contraste e linguagem direta antes de ornamentação.
PROXISFERA DESIGN SYSTEM • 0.2.0
Fundamentos e componentes da experiência Proxisfera.
Referência única para construir interfaces consistentes, acessíveis, responsivas e preparadas para evolução modular.
Tema atual: light
Consistência sem rigidez.
A linguagem visual deve simplificar a navegação, reforçar confiança institucional e permitir que cada produto preserve sua finalidade.
02
Coerência
Mesmos padrões para ações, estados, navegação e feedback.
03
Evolução
Componentes adaptáveis a novos módulos sem ruptura visual.
Identidade provisória.
O símbolo combina esfera, órbitas e ponto de transformação. O uso é provisório até a validação final do naming e do registro da marca.
Uso provisório
A marca ainda não substitui pesquisa de disponibilidade, registro de domínio e análise no INPI.
Paleta principal.
As interfaces devem usar tokens semânticos. Os valores brutos abaixo servem para referência e construção do tema.
Escala tipográfica.
Display
Transformar conhecimento em ação.
Heading 2
Liderança, estratégia e inteligência.
Heading 3
Uma plataforma modular e integrada.
Body
O texto de leitura utiliza espaçamento confortável e largura controlada para preservar legibilidade em conteúdos longos.
LABEL • METADADO • CATEGORIA
Escala baseada em múltiplos previsíveis.
space-28 pxspace-416 pxspace-624 pxspace-832 pxspace-1248 pxspace-2080 pxAções e organização.
Botões
Variantes, tamanhos e estadosBadges e estados
Metadados compactos
NeutroPrimárioSucessoAtençãoRisco
Cards
Conteúdo, métricas e ações08Publicações
Dados e Inteligência
Série editorial com fundamentos, métodos e laboratório.
Abas
Conteúdo relacionado no mesmo contextoConteúdo introdutório da solução ou jornada.
Métodos, ferramentas e forma de aplicação.
Resultados esperados e evidências práticas.
Acordeão
Detalhes progressivosO componente compartilhado é alterado uma vez e passa a ser utilizado por todas as páginas que o carregam.
Não. Ele padroniza a apresentação e a interação. Conteúdos e dados permanecem separados.
Entrada de dados com orientação.
Estados compreensíveis e acionáveis.
Informação
Há uma atualização disponível para este conteúdo.
Concluído
Sua evidência foi registrada com sucesso.
Atenção
Revise os dados antes de confirmar a operação.
Erro
Não foi possível concluir a ação. Tente novamente.
Tabelas e indicadores.
| Produto | Responsável | Status | Progresso |
|---|---|---|---|
| Portal institucional | PXEquipe Proxisfera | Planejado | |
| Design System | DSProduto e UX | Concluído | |
| Core da plataforma | CRArquitetura | Próximo |
Inclusão como requisito estrutural.
Contraste e foco
Estados de foco visíveis, temas claro, escuro e alto contraste, além de tokens semânticos.
Movimento responsável
Animações respeitam a preferência de redução de movimento configurada no dispositivo.
Semântica
Estrutura com landmarks, rótulos, estados ARIA e ordem de navegação previsível.
Responsividade
Componentes adaptam conteúdo e ações a telas menores sem perda funcional.