A Sol Agora é uma plataforma líder no ecossistema de energia solar no Brasil. Ela conecta integradores, clientes e instituições financeiras para viabilizar projetos de geração de energia limpa e acessível. Atuando como ponte entre tecnologia, mercado e sustentabilidade, a empresa oferece soluções digitais que simplificam a venda, o financiamento e a implementação de usinas solares em todo o país.
Problema
Com o crescimento rápido da base de usuários e o aumento da complexidade de funcionalidades, a experiência visual e de navegação da Sol Agora começou a se fragmentar. Cada nova feature era construída com estilos ligeiramente diferentes, o que gerava:
- Inconsistência visual e de marca.
- Dificuldade na escalabilidade e manutenção do código.
- Curva de aprendizado maior para novos times de design e desenvolvimento.
- Experiência do usuário menos fluida e coerente.
Além disso, a marca estava em transição para uma nova identidade visual, demandando um redesign completo que refletisse seu posicionamento atualizado e fortalecesse a confiança do usuário.
Componentes antigos, sem consistência visual
Solução
A resposta foi criar o Sunrise Design System, uma linguagem visual e funcional única para todo o ecossistema digital da Sol Agora. Principais conceitos adotados nos componentes:
Geometria Radial e Modular
Assim como os raios de sol se expandem a partir de um ponto central, o grid e os componentes foram pensados de forma radial e expansiva. O espaçamento e as proporções seguem múltiplos harmônicos (base 8px), criando uma sensação de ordem e previsibilidade.
Assim como os raios de sol se expandem a partir de um ponto central, o grid e os componentes foram pensados de forma radial e expansiva. O espaçamento e as proporções seguem múltiplos harmônicos (base 8px), criando uma sensação de ordem e previsibilidade.
Paleta e Gradientes Solares
Cores derivadas da luz solar ao longo do dia — do amarelo suave do amanhecer ao laranja e dourado do entardecer — foram combinadas com neutros sofisticados. Isso cria contraste, legibilidade e uma sensação de calor e proximidade com a marca.
Cores derivadas da luz solar ao longo do dia — do amarelo suave do amanhecer ao laranja e dourado do entardecer — foram combinadas com neutros sofisticados. Isso cria contraste, legibilidade e uma sensação de calor e proximidade com a marca.
Metáforas de Luminosidade
Uso de sombras sutis e camadas translúcidas para simular a incidência e difusão da luz, dando profundidade e hierarquia visual sem pesar a interface.
Uso de sombras sutis e camadas translúcidas para simular a incidência e difusão da luz, dando profundidade e hierarquia visual sem pesar a interface.
Componentes com “Energia”
Botões, cards e indicadores foram desenhados para transmitir movimento e ação, inspirados na ideia de energia fluindo. Pequenos microinteractions reforçam essa vitalidade.
Botões, cards e indicadores foram desenhados para transmitir movimento e ação, inspirados na ideia de energia fluindo. Pequenos microinteractions reforçam essa vitalidade.
Simbologia Solar
Ícones e elementos gráficos trazem formas circulares e semi-circulares, remetendo ao disco solar e às fases do dia, conectando o usuário à narrativa central de geração de energia.
Ícones e elementos gráficos trazem formas circulares e semi-circulares, remetendo ao disco solar e às fases do dia, conectando o usuário à narrativa central de geração de energia.
O resultado é um design system que não é apenas funcional, mas também narrativo, criando um elo emocional entre a marca e seus usuários.
Conclusão
Identidade unificada: Todos os produtos compartilham o mesmo visual e comportamento, aumentando a percepção de marca.
Agilidade no desenvolvimento: Novas features podem ser concebidas e entregues mais rapidamente graças a componentes prontos e padronizados.
Integridade de código e design: Menos divergências visuais e técnicas, facilitando manutenção e evolução contínua.
Melhor experiência do usuário: Interfaces mais intuitivas e consistentes, fortalecendo a relação com integradores e clientes finais.