Blog

Novas opções para o cabeçalho e os atalhos

O cabeçalho é a zona que compõe a parte superior do seu aplicativo. Quando seu potencial é aproveitado ao máximo, pode ser uma área muito estratégica. Esse é um elemento essencial na identidade visual do seu aplicativo, bem como uma área que oferece acesso instantâneo às seções que você desejar destacar.

Identidade visual

O cabeçalho é onde você exibe o título do seu aplicativo, ou mesmo o logotipo.
O cabeçalho é visível tanto nas seções da Home como em páginas internas. Nas páginas de detalhe do conteúdo, é usado para exibir botões de navegação e compartilhamento.

No seu cabeçalho, você pode aplicar cores de fundo, texturas e alinhamentos.
Você pode escolher os ícones dos botões de navegação e as fontes do texto. Existem inúmeras opções para configurar o design desta área, assim, você pode integrar sua identidade visual de forma customizada.

É possível personalizar a exibição do cabeçalho de acordo com a seção. Por exemplo, em um aplicativo de cozinha, você pode ter um cabeçalho específico para uma seção "Receitas" e outro para uma seção "Eventos". Esta opção oferece muita flexibilidade, mas fique atento para manter algum senso de consistência entre os vários cabeçalhos para que não confunda seus usuários.

Atalhos

O cabeçalho possui 6 espaços que podem conter links. Use esses espaços para sugerir ações rápidas que são facilmente acessíveis a partir de quase qualquer lugar no aplicativo.
Você tem a opção de adicionar até 6 atalhos no cabeçalho. Quando você possui 4 atalhos, o terceiro espaço é automaticamente transformado em um menu adicional.

O ícone, o destino, o título e as cores de cada atalho podem ser personalizados.

No celular, os atalhos só podem ser representados por um ícone. No tablet, é possível exibir um título para um atalho ao lado do ícone. No laptop ou na área de trabalho, o atalho pode ser transformado em um botão, adicionando uma cor de fundo sob o ícone e o título.

A maneira como o menu adicional funciona é idêntica no celular e no tablet. Aparece em uma sobreposição na parte inferior da tela. No laptop e na área de trabalho, ele aparece como um menu suspenso quando o ícone for clicado.
O cabeçalho oferece flexibilidade adicional para organizar a navegação em seu aplicativo — o complemento perfeito para Home e o Modo de Navegação atualizada.

Continue lendo

  7 min de leitura

Como regular as bordas na minha app?

No GoodBarber, cada célula, widget e campo já tem a sua borda de 1 px. Dê-lhe uma cor, uma espessura de 1, 2 ou 4 px, ou um só lado sob um título.

  4 min de leitura

O novo back office da GoodBarber: mais clareza para criar seu app

Tudo começa pelo design. Uma nova tipografia, Plus Jakarta Sans, um azul para a interface, um verde reservado ao que publica e valida, cantos suavizados, sombras suaves e ícones redesenhados. O conjunto se lê com calma, e cada cor tem um papel: o azul guia, o verde confirma.Em My App, a pré-visualização do seu app ocupa o centro da tela e as configurações ficam reunidas em um painel à direita. Você edita de um lado, vê o resultado do outro, e seu app continua diante dos seus olhos durante todo o trabalho.