32. Layout e aparência

O layout de portal e o menu lateral, a página inicial, as Preferências e as cores de cada site.

A plataforma tem dois layouts para a área de auditoria. As telas, as permissões e a ajuda são as mesmas nos dois — só a casca muda.

•     Portal (padrão): a barra da marca no topo, a barra de seções logo abaixo e uma página inicial com destaque, atalhos e quadros. É o mesmo desenho do portal de atendimento, do portal de resposta e do console.

•     Menu lateral: o menu de sempre, à esquerda, com os grupos recolhíveis e a busca no menu.

No layout de portal a plataforma abre no Início:

•     o destaque com a busca de telas ("riscos", "aprovações", "painéis"…);

•     os atalhos com as contagens do que pede ação: auditorias em andamento, NCs sem tratamento, riscos acima do apetite, documentos para aprovar, perguntas para responder e leitura obrigatória;

•     os quadros: auditorias em andamento com o quanto já foi respondido, documentos para aprovar, o resumo das NCs e dos riscos, a leitura obrigatória e as perguntas que esperam a sua resposta.

Cada atalho e cada quadro só aparece para quem tem a permissão da tela que ele resume, e os números são os da própria tela — clicar leva a ela.

A barra de seções tem um botão por grupo (Gestão, Auditoria, Tratamento, Automação, Acervo, Análise, IMR, Catálogo, Configuração, Administração). Clicar abre o menu do grupo, com cada tela e uma linha dizendo o que ela é; Página de… abre a página do grupo, com todas as telas dele. A seção da tela aberta fica sublinhada. Esc fecha o menu.

A busca da barra da marca acha qualquer tela pelo nome, em qualquer grupo.

Nos dois layouts o cabeçalho mostra à vista só o que se usa todo dia, em ícone com dica:

•     a faísca abre o assistente (O assistente);

•     o ? abre a ajuda da tela em que você está;

•     o sino abre os avisos, com o número dos que você ainda não leu.

O resto fica nas Preferências: no layout de portal, pelo botão de engrenagem; no menu lateral, pelo seu nome, à direita — e no menu lateral o nome da tela aberta aparece ao lado da marca.

As Preferências reúnem:

•     Idioma, pela bandeira: Brasil (português), Espanha (espanhol) e Estados Unidos (inglês). O leitor de tela anuncia o nome do idioma, não a bandeira.

•     Tamanho do texto: normal, maior e o maior.

•     Tema: claro, escuro ou cinza.

•     Layout: portal ou menu lateral, quando a organização deixa cada pessoa escolher.

•     Segundo fator da minha conta, Imprimir esta tela e Como funciona, de ponta a ponta.

•     No menu lateral, também o Sair.

Esc ou um clique fora fecha o painel.

•     O console define, por tenant, o layout padrão e se cada pessoa pode escolher o seu (Console → tenant → Layout da plataforma).

•     Com a escolha liberada, cada pessoa troca nas Preferências; a escolha fica gravada na conta e vale em qualquer navegador. Voltar ao padrão da organização apaga a escolha própria.

•     Com a escolha desligada, todos veem o padrão. A escolha de ninguém é apagada: se a escolha voltar a ser permitida, cada um reencontra a sua.

São três sites com cores próprias, definidas no console (tenant → Cores dos sites): a Plataforma (a área de auditoria, no layout de portal e no menu lateral), o portal de atendimento e o portal de resposta. Cada um tem barra superior, barra das seções, destaque da página inicial e cor de ação (botões, links e ícones dos atalhos).

•     A cor do texto sobre cada faixa é escolhida sozinha, branca ou escura, pelo contraste.

•     O selo de cada cor diz se o texto chega ao mínimo de leitura (WCAG AA, 4,5:1).

•     No tema escuro e no cinza a cor de ação é clareada até ler sobre o fundo do tema.

•     A Plataforma herda as cores do portal de atendimento até o tenant gravar cores próprias para ela. Era assim antes de a plataforma ter cores suas, e um tenant que já tinha personalizado o portal não muda de cor sozinho. Plataforma igual ao portal não se grava: continua acompanhando o portal.

•     Sem cores definidas, o portal e o portal de resposta ficam com as do produto (e a Plataforma, com as do portal).

Quem instala a plataforma como aplicativo (Instalar como aplicativo) recebe o aplicativo do tenant, e não um genérico: o manifesto sai do endereço por onde a pessoa chegou.

•     Nome — o nome de exibição do tenant.

•     Ícone — gerado do logotipo do tenant, centrado num quadrado branco, sem a margem vazia do arquivo, nos tamanhos que os sistemas pedem (inclusive a versão que o lançador recorta em círculo). Só funciona com logotipo em PNG ou JPEG; com WebP, ou sem logotipo, fica o ícone do produto.

•     Cor da barra — a da barra superior da Plataforma; sem ela, a do portal de atendimento; sem ela, a do portal de resposta; e, por fim, a do produto.

Trocar o logotipo ou as cores vale para quem instala dali em diante. Quem já tinha instalado pode ver o ícone antigo por um tempo: cada navegador decide quando relê o manifesto, e às vezes é preciso desinstalar e instalar de novo para o ícone trocar.