Cards

Cards são elementos usados para dividir conteúdos e ações sobre um determinado tópico de maneira fácil e objetiva.

Pode ser composto por diversos elementos, que devem ser colocados de maneira que indiquem com clareza a hierarquia das informações. Dentre os elementos que podem compor um card, estão:

• Thumbnails (miniaturas): um avatar ou logotipo, por exemplo.
• Título
• Subtítulo
• Mídias: fotos ou gráficos, por exemplo.
• Texto de suporte: breve descrição do assunto ou ação contida no card.
• Botões
• Ícones

No AcessoCidadão Admin, os cards são amplamente usados para facilitar a navegação do usuário. Abaixo, alguns exemplos de uso de cards no sistema:

Página Inicial

Na página inicial, os cards foram usados para substituir um menu lateral ou navbar, deixando visível todas as principais funções do sistema. Em caso de expansão do sistema, podem ser criadas até 3 linhas, mantendo a divisão em 3 colunas.

Sistemas

Para facilitar o fluxo, foi inserida uma linha de cards com os principais sistemas utilizados pelo usuário, que podem ser identificados como favoritos. Caso seja necessário, pode ser incluída mais uma linha, mantendo a divisão em 6 colunas.

Navegação

Os cards usados para navegação dentro do sistema seguem a mesma lógica dos usados na página inicial. Podem ser usados em até 3 linhas, mantendo a divisão em 3 colunas.

Cards com abas

Abas dividem informações em seções e promovem uma rápida navegação do usuário entre as divisões.

Para que as abas tenham sua função garantida, os gráficos devem criar a ilusão visual de que a aba ativa está na frente das outras. Para isso, ela precisa ser de uma cor diferente ou de um tom contrastante, e também deve se conectar diretamente com o espaço abaixo dela, onde a informação consta.