Website Solano Music

UX / brand strategy / visual design

Um site responsivo projetado para apresentar, conectar e converter músicos que estão prontos para serem ouvidos.

Meu papel

UX/UI Designer

Responsabilidades

Pesquisa | Personas | Wireframes (baixa/alta fidelidade) | Conteúdo | Testes de usabilidade | Design visual responsivo

Data

Agosto de 2025 a Setembro 2025

Visão Geral do Projeto

O projeto teve como objetivo desenvolver um site responsivo para a Solano Music, pensado para oferecer uma experiência consistente em desktop, tablet e mobile. A proposta concentrou-se em três pontos principais: comunicar de forma clara o propósito da marca, apresentar o portfólio de maneira atrativa e orientar o usuário até a conversão final, representada pelo agendamento de uma reunião.

Além disso, o trabalho abrangeu o design visual e o branding da marca, com a elaboração do manual de identidade visual, definição de Style Guide, especificação de paleta cromática, tipografia, grid system, componentes reutilizáveis e diretrizes de aplicação da marca.

O problema

O desafio central foi criar uma experiência digital que conduzisse o usuário a estabelecer contato com a Solano Music, permitindo a coleta de informações estratégicas para o relacionamento com potenciais clientes. Para isso, a interface precisou traduzir os valores da marca — acessibilidade, profissionalismo e foco no artista — de forma clara, objetiva e emocionalmente conectada, mesmo diante das restrições de espaço em tela.

O site precisava manter consistência visual e comunicacional, evitando sobrecarga cognitiva e assegurando uma navegação fluida. Ao mesmo tempo, deveria engajar o usuário e direcioná-lo ao objetivo estratégico: explorar o portfólio como validação da qualidade do trabalho e acessar os canais de contato para contratação de pacotes ou agendamento de reuniões.

Processo de pesquisa

O processo de pesquisa para este trabalho foi estruturado em 4 fases: Competitor Audit, criação de personas, problem statements e User Journey Maps.

Competitor Audit

Criação de Personas

Problem statements

User journey maps

A) Competitor Audit

Para iniciar, realizei pesquisas para compreender melhor o mercado de produtoras musicais e estúdios de gravação no Brasil, com foco na experiência digital dos usuários. A principal fonte de dados utilizada foi a análise direta dos sites de cinco concorrentes nacionais: Zacconi Records, K9 Estúdio, Angorá Music, Submarino Fantástico e Estúdio Hertz. Você pode consultar o competitor audit clicando neste link

Principais descobertas da pesquisa:

  1. Portfólio e apresentação de serviços:
    O portfólio é o principal elemento de conversão. A apresentação varia entre carrosséis, seções com vídeos e imagens ou tabelas de serviços. Sites mais organizados facilitam a compreensão, enquanto layouts densos podem sobrecarregar o usuário.
  2. Experiência digital e mobile:
    Todos os sites são responsivos, mas a navegabilidade mobile varia. Alguns menus são pouco claros e elementos muito próximos. O fluxo tende a ser linear, do portfólio ao contato, mas CTAs consistentes são raros.
  3. Acessibilidade e usabilidade:
    Recursos de acessibilidade avançados são pouco comuns. Legibilidade, organização e clareza do conteúdo são essenciais para uma experiência de uso eficiente.
  4. Identidade de marca e comunicação:
    O tom e a identidade variam do profissional ao informal. Há oportunidades de reforçar consistência visual e textual para aumentar confiança, engajamento e percepção de valor.

B) Persona modelo

Com base nos dados coletados nas entrevistas e insights dos participantes, elaborei uma persona representativa que reflete os principais objetivos, dores e motivações dos usuários.

Nome e idade: João Pedro, 24 anos

Profissão: Músico independente (cantor e compositor)

Educação: Ensino Superior Completo

Cidade: Rio de Janeiro, RJ

Declaração do problema

João busca um estúdio acessível e profissional que o ajude a transformar suas ideias musicais em produções de qualidade, mas encontra barreiras na comunicação, nos processos técnicos e na acessibilidade dos serviços, além de desconhecer questões técnicas e não saber “o próximo passo”.

Objetivos

  1. Produzir músicas com qualidade profissional sem burocracia.
  2. Encontrar um estúdio que entenda sua linguagem artística.
  3. Ter clareza sobre prazos, etapas e custos do processo de produção.
  4. Criar conexões com profissionais que possam apoiar sua carreira musical.

Dores e frustrações

  1. Dificuldade em comunicar ideias criativas para profissionais.
  2. Intimidação por termos técnicos e fluxos de trabalho complexos.
  3. Incerteza sobre próximos passos no processo de produção.
  4. Percepção de que estúdios tradicionais são distantes ou inacessíveis.

C) User Journey Map

Com base na persona definida, desenvolvi um mapa da jornada do usuário para representar seu principal objetivo. O cenário adotado é o de um jovem músico independente que busca apoio profissional para transformar suas ideias em produções musicais de qualidade. 

AÇÃO

Descobrir a Solano Music

Conhecer o portfólio

Entender serviços

Decidir entrar em contato

Primeira reunião / Conversão

TAREFAS

a) Pesquisar no Google
b) Explorar redes sociais
c) Acessar o site.

a) Navegar no site
b) Acessar o site e ouvir trechos de produções.

a) Ler o site e entender sobre os serviços

a) Clicar em algum CTA
b) Escolher a opção de contato: WhatsApp ou agendar reunião pelo site.

a) Receber confirmação da reunião ou iniciar a conversa via Whatsapp

SENTIMENTOS

Curiosidade, mas insegurança sobre qualidade e preços.

Interesse crescente, mas comparação com concorrentes.

Dúvidas sobre valores e etapas do processo.

Ansiedade e expectativa de resposta rápida.

Satisfação em ser atendido, mas atenção ao acolhimento inicial.

OPORTUNIDADES

SEO e redes sociais bem trabalhados, site com mensagem clara e valor acessível logo na entrada.

Portfólio organizado, com filtros, cases de sucesso e depoimentos de clientes para gerar confiança.

Apresentar de forma clara e objetiva, e incluir FAQs

CTAs consistentes em todas as páginas, formulário simples, opção de contato direto via WhatsApp.

Comunicação acessível (sem excesso de termos técnicos), onboarding inicial simples, reforço da identidade acolhedora e profissional da marca.

Iniciando o design: Responsividade e Wireframes

Após concluir a fase de pesquisa, iniciei o processo de design. O primeiro passo foi a criação de um mapa do site claro. Em seguida, foquei no desenvolvimento dos wireframes e na responsividade.

  • Responsividade
    Esta etapa teve como foco garantir que o design se adaptasse perfeitamente a diferentes dispositivos e tamanhos de tela. Ao considerar diversos breakpoints e layouts, o objetivo foi proporcionar uma experiência consistente e amigável em desktops, tablets e dispositivos móveis.

  • Wireframes Digitais
    Após refinar os wireframes em papel, criei wireframes digitais para oferecer uma representação mais precisa e interativa do layout. Esses wireframes permitiram testar o posicionamento dos elementos, o fluxo do usuário e a estrutura geral das páginas em diferentes tamanhos de tela.

Protótipo de baixa fidelidade

Nesta fase, criei protótipos de baixa fidelidade que permitiram aos usuários realizar as principais ações solicitadas pelo cliente. Esses protótipos ajudaram a identificar problemas de usabilidade precocemente, coletar feedback sobre o fluxo e a funcionalidade e garantir que o design atendesse às necessidades dos usuários antes de avançar para versões de maior fidelidade.

Teste de usabilidade

Para validar a estrutura da versão web da Solano Music, realizei um breve teste de usabilidade com usuários representativos. O objetivo foi levantar insights rápidos sobre possíveis barreiras de navegação e avaliar a clareza das funcionalidades no protótipo de baixa fidelidade.

Dois pontos principais surgiram: o recurso de gamificação, que não gerou o engajamento esperado pela falta de feedback imediato após a interação, e a seção de blog, onde os filtros disponíveis se mostraram limitados, dificultando a personalização da busca por conteúdos.

Esses achados guiaram ajustes no design, resultando em uma experiência mais intuitiva e alinhada às expectativas dos usuários.

Os parâmetros deste teste você pode encontrar aqui

Descobertas

01

A primeira melhoria identificada teve como foco esclarecer e aprimorar o elemento de gamificação, que inicialmente causou frustração nos usuários. Embora a intenção original fosse coletar respostas e, em seguida, fornecer um feedback personalizado, os testes de usabilidade revelaram que essa abordagem parecia insatisfatória. A falta de opções imediatas ao final do processo gerava uma sensação de distanciamento, já que os usuários não tinham controle sobre o que aconteceria em seguida.

Os usuários completavam o questionário, mas eram apenas informados de que a Solano Music entraria em contato posteriormente, sem receber escolhas ou próximos passos claros. Isso gerava uma sensação de desconexão com o processo.

Antes do estudo de usabilidade

Substituí o questionário estático por um chatbot interativo e, ao final, ofereci três opções claras de como o usuário gostaria de prosseguir — incluindo agendar uma reunião com um produtor, que é o objetivo principal.

Depois do estudo de usabilidade

02

A segunda melhoria chave focou na seção de portfólio, que se destacou como um ponto de interesse para os usuários durante os testes, pois mostrava o trabalho e as capacidades da Solano Music. Os testes de usabilidade revelaram que, embora o portfólio fosse fácil de acessar, os usuários sentiam falta de detalhes essenciais — especialmente sobre a contribuição da Solano Music em cada faixa.

Anteriormente, os usuários tinham apenas uma funcionalidade: ouvir a música. Não havia informações adicionais ou contexto, deixando-os sem conhecimento sobre o papel ou contribuições específicas da Solano na produção.

Antes do estudo de usabilidade

Agora, os usuários podem ver claramente as contribuições da Solano na produção, incluindo seu papel no processo. Essa melhoria não só fornece um contexto mais rico, como também promove uma conexão mais profunda entre o usuário e a marca.

Depois do estudo de usabilidade

02A segunda melhoria chave focou na seção do blog, que se mostrou uma área de grande interesse para os usuários, alinhando-se diretamente com nossas personas. Durante os testes de usabilidade, identificamos que os filtros de pesquisa existentes para os artigos eram muito limitados e careciam de personalização, reduzindo sua eficácia.

O blog oferecia apenas filtros básicos, dificultando que os usuários refinassem suas buscas ou encontrassem artigos adaptados aos seus interesses. Essa funcionalidade limitada frequentemente gerava frustração, pois os usuários precisavam navegar manualmente pelo conteúdo.

Antes do estudo de usabilidade

Introduzimos um sistema de categorização mais robusto, organizando os artigos do blog por temas, tópicos e necessidades dos usuários. Essa melhoria permite que os leitores naveguem facilmente pelo conteúdo, descubram artigos relacionados e se engajem com material que ressoe com seus objetivos específicos.

Depois do estudo de usabilidade

Protótipo de alta fidelidade

Após coletar feedback do protótipo de baixa fidelidade, apliquei as melhorias sugeridas e avancei para a criação da versão de alta fidelidade. Esta etapa permitiu refinar não apenas o design visual, mas também o fluxo geral e os padrões de interação.

Takeaways

Impact

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Desktop

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Vamos nos conectar

Sinta-se à vontade para entrar em contato caso queira se conectar ou saber mais sobre meu trabalho. Estou sempre aberto a feedbacks, colaborações e novas oportunidades.