Solucionado (ver solução)

Importante

Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!

Solucionado
(ver solução)
1
resposta

[Projeto] Layout móvel

Insira aqui a descrição dessa imagem para ajudar na acessibilidade
Insira aqui a descrição dessa imagem para ajudar na acessibilidade
Insira aqui a descrição dessa imagem para ajudar na acessibilidade
Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta
solução!

Olá, Vivian. Como vai?

Seu dashboard na versão para dispositivos móveis ficou simplesmente fantástico! Criar um design voltado para telas menores (mobile layout) é um dos grandes diferenciais de um profissional de Business Intelligence, pois os tomadores de decisão costumam acessar os indicadores diretamente pelo celular no dia a dia.

Analisando a sua sequência de telas, a distribuição visual está super organizada e a escolha da paleta de cores em tons de roxo e amarelo trouxe uma identidade muito moderna e amigável, casando perfeitamente com o tema do segmento pet!

A estrutura de leitura que você montou está impecável, seguindo as melhores práticas de User Experience (UX):

  • Cartões no Topo: Colocar os grandes números (Faturamento total, Média de Pets e Qtde. de Vendas) logo na primeira tela entrega a informação mais importante de forma imediata ao usuário.
  • Filtros e Buscas Acessíveis: O campo de busca de produto, a seleção de marcas e o controle de datas com controle deslizante ficaram muito bem posicionados, permitindo uma navegação por toque confortável no celular.
  • Gráficos Limpos: O gráfico de pizza (Faturamento por Gênero), os gráficos de barras por bairro e a linha de tendência temporal com rótulos de dados bem visíveis facilitam muito a leitura rápida, sem poluição visual.

Para agregar ainda mais valor ao acabamento do seu projeto nas próximas criações, deixo duas pequenas sugestões de boas práticas voltadas ao layout móvel:

1. Ajuste nos Textos Longos (Truncamento)
Na tela que exibe o faturamento por bairro, note que alguns nomes foram cortados com reticências (Cidade tir..., São Migu...). No layout mobile, como o espaço horizontal é reduzido, uma boa alternativa é aumentar um pouquinho a margem esquerda reservada para os rótulos do eixo Y ou reduzir sutilmente o tamanho da fonte desses nomes nas propriedades visuais do gráfico. Assim, o nome completo dos bairros aparecerá sem quebras.

2. Margens de Segurança
Certifique-se de deixar um pequeno espaçamento uniforme (margem) entre as bordas dos gráficos e o limite da tela do celular. Isso evita que o usuário clique sem querer em um filtro ou gráfico ao tentar rolar a página para baixo com o polegar.

Seu primeiro dashboard móvel demonstra um capricho técnico e estético excelente! Você dominou muito bem a habilidade de reorganizar os elementos da tela do computador para o formato vertical.

Espero que possa ter lhe ajudado!