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.

No canto superior direito de cada página, um botão acompanha o estado do seu projeto. Ele mostra "Publicar meu projeto" enquanto o app nunca foi publicado, depois "Recompilar e enviar", "Atualizar agora" ou "Projeto atualizado", conforme o momento. Basta uma olhada para saber se ainda falta alguma coisa.

Ao clicar, a janela "Publicar meu projeto" passa em revista suas três versões: primeiro o PWA, depois iOS, depois Android. Para cada uma, o status: não publicada, etapas concluídas sobre o total, pronta, sendo gerada, em revisão, no ar, precisando ser recompilada. Ao lado, a próxima ação. Embaixo, o número de alterações prontas para publicar, com o botão "Atualizar agora" para enviá-las. Os cartões do Dashboard mostram os mesmos status, para você vê-los assim que entra.

O back office da GoodBarber abre no modo claro. Para passar ao modo escuro, clique no seu nome, na parte de baixo do menu principal: um pequeno menu se abre, com a linha "Aparência" e seus três ícones, um sol para "Claro", uma lua para "Escuro" e uma tela para "Sistema". "Sistema" segue a configuração do seu computador: se o seu sistema passa para o escuro à noite, o back office acompanha.

Clique de novo no seu nome, na parte de baixo do menu principal, e abra "Minha conta": a linha "Acessibilidade" reúne duas configurações. "Tamanho do texto" aumenta a interface em quatro níveis, de "Pequeno" a "Muito grande". "Aumentar o contraste" escurece o texto e reforça bordas e contornos.

O subtítulo da linha já diz: "Aplicado imediatamente, em todos os projetos." A configuração está ligada a você e te acompanha de um app para outro. Se você gerencia vários aplicativos, como agência ou revendedor, faz o ajuste uma vez e o encontra em todos. Enquanto você não escolher nada, o contraste segue a configuração de aumento de contraste do seu sistema.

Para escrever diretamente no JSON do seu app, cada painel de Structure tem um link entre chaves { }. Ele abre uma janela de edição avançada sobre o JSON do elemento atual, sem sair da página.

Um campo "Pesquisar uma chave ou um valor" leva direto ao lugar certo. As alterações são sinalizadas, com a quantidade, antes de serem salvas. Uma bolinha aparece antes de cada cor, e um seletor de cor permite escolhê-la diretamente. Um cadeado marca o que está bloqueado.

Essa janela abre com a extensão Edição avançada, gratuita, que você instala pela Extension Store.

• O breadcrumb da barra superior mostra a página pai e o elemento aberto.
• Na Home, um modo "Reordenar" muda a ordem dos widgets da página.
• A janela de escolha de ícone abre sobre a página, mostra o ícone atual e o campo em questão, organiza as coleções em uma coluna à esquerda e oferece vários tamanhos de pré-visualização. A busca por nome também cobre os conjuntos de ícones genéricos, e um clique escolhe o ícone.
• Abaixo de 1024 px de largura, as telas se reorganizam: o menu se recolhe atrás de um botão e, em My App, a pré-visualização vai para cima e o painel para baixo. Dá para trabalhar em um tablet como em um celular.

Tudo isso já está no seu back office: basta abri-lo. E outras novidades vão chegar nas próximas semanas.