Backbone
Ano
2026
Categoria
Web App Design
Atuação
Lead Designer, UI Design
Dashboard de gestão de finanças voltado para usuários avançados: contadores, analistas financeiros e experientes que acompanham dezenas de contas e categorias diariamente.
Case de UI
Este design foi desenvolvido a partir de um briefing previamente estabelecido, focado em apresentar a página inicial de um Dashboard de gestão financeira da empresa Backbone para usuários experientes e tradicionais, que passam bastante tempo no software.
A interface prioriza a densidade de informações, precisão e eficiência com características de:Cores neutras e sóbrias, simbolizando o tradicionalismo e eliminando distrações visuais
Hierarquia tipográfica clara, com Headings bem definidos e apenas uma família tipográfica
Iconografia e layout com decoração mínima, estabelecendo o foco nos dados do Dashboard
Processo de Design
Para o processo de Design, iniciei buscando referências de Dashboards tanto no Dribbble quanto no Mobbin, para entender a prática do mercado, layouts, disposição de elementos e quais serviços principais estão presentes nesse tipo de Dashboard.
Dentre 4 opções de referências que entendi que faziam sentido com o briefing, selecionei os elementos-chave que adicionaria no Design.
Antes de partir para o design do Mockup, desenhei um wireframe com formas e delimitações que seguiria no Design de alta fidelidade, já pensando na disposição das funcionalidades que a página deveria ter.
Overview de Funcionalidades
As funcionalidades presentes na página principal do Dashboard são focadas nas informações principais a que o usuário precisa ter acesso, abrangendo dados de todas as suas contas registradas.
Adicionei as seguintes funcionalidades:
Resumo dos saldos de várias contas, indicando a quantidade total de contas e também um elemento para comparar a evolução de cada categoria com o mês anterior
Gráfico para acompanhamento de Saldo, com seleção de visualização por tempo
Seção de acompanhamento do Budget, com análise de valores por categorias, com seleção de visualização por período de tempo
Lista de transações recentes com recursos de filtragem, contendo informações da categoria da transação, data, status com contexto visual e valor positivo ou negativo
Além das funcionalidades internas do Dashboard, inseri um menu de navegação lateral, organizado por categorias, clara hierarquia e diferenciação entre os serviços, com o combo Ícone + Título do serviço para facilitar a familiaridade e acessibilidade.
Há também um searchbar, botões secundários de Notificações, Ajustes e elemento para identificação e gerenciamento do usuário, com indicação de cargo/nível de acesso.
Styleguide
Poket