Processo de criação de marca/UI Design — Crescer+

Como embasamos a criação da marca, a escolha de cores, etc.

6 min readJan 30, 2022

Todo o trabalho de pesquisa, definição e priorização das iniciativas propostas durante um processo de UX Design são essenciais para garantir, sobretudo, a precisão e convergência na entrega das soluções propostas. Porém, é na etapa visual (marca, cores, tipografia e protótipo) que conseguimos tornar a solução, de fato, tangível.

Após a definição da solução, tom de voz e personas (que você pode ver clicando aqui), iniciamos a criação da marca “Crescer+”, que dá nome ao aplicativo que propõe tornar mais prático o acompanhamento do desenvolvimento da criança de 0 a 14 anos.

Para que possamos explicar mais detalhadamente o processo de escolhas, precisamos antes dar alguns passos atrás e recapitularmos quem é nossa persona e qual a tônica que ela nos sugeriu durante este desenvolvimento:

Persona

Roberta é mãe-solo, de 35 anos, que atua como vendedora em Pernambuco. Cuida sozinha de seu filho Pedro, de 3 anos, e por isso, precisa de ajuda para acompanhar seu desenvolvimento, pois divide o tempo entre o filho, o trabalho e os afazeres de casa.

Voz e Tom de Voz

De acordo com a dinâmica realizada pelo time de UX Writing para nortear a voz e o tom de voz que a marca seguiria, chegamos a conclusão de que:

Se a Crescer+ fosse uma pessoa, seria informativa e falaria de forma amigável.

Em outras palavras, precisamos ser leves, seguros, empáticos e, acima de tudo, confiáveis, para oferecer aos responsáveis todo o suporte necessário no acompanhamento do desenvolvimento infantil.

Naming

Painel de brainstorming para escolha do nome da solução

Com apoio nas decisões de negócio anteriores, iniciamos o processo de escolha do nome para a marca. Algo que deveria impor, quase que instantaneamente, seu propósito. Após uma longa sessão de brainstorming, chegamos ao nome de Crescer+.

O desafio do nome não é apenas ser a alcunha pela qual a solução ficará conhecida pelos usuários, mas também o de ser o principal responssável pelo primeiro impacto positivo que a solução causará para quem ainda não é usuário e busca algo como o que nos propusemos a oferecer. E para que a experiência do primeiro impacto fizesse sentido, precisaríamos de cores, de fontes, de um símbolo. De vida.

Escolha das cores

A escolha das cores utilizadas no solução foi orientada para convergir com o proposto na definição da persona, os anseios e as dores que precisávamos sanar enquanto negócio.

Após uma sequência de estudos minuciosos, chegamos a conclusão de que as três cores que melhor definiam o que a solução se propõe a entregar são azul, por simbolizar segurança e força; o laranja, por representar alegria e confiança; e o verde, por remeter a crescimento e saúde. Iniciamos então, a definição das tonalidades adequadas para a solução de acordo com estudo de proporçõs, contraste visual, acessibilidade, etc.

Com o apoio da Adobe Color Wheel, localizamos as tonalidades com contrastes ideais embasando-nos na tríade complementar e, em seguida, desdobramos as diversas tonalidades, por se tratar de uma aplicação para web. O resultado da escolha do color guide pode ser visto abaixo:

Tipografia

A fonte escolhida foi a Montserrat, com pesos Regular e SemiBold.

Por ser uma fonte moderna, sem serifa e discreta, passa segurança e estabilidade sem perder o conceito digital e de fácil legibilidade. Além disso, faz parte do catálogo das Google Fonts, o que garante rápida indexação e otimização do page speed.

Os tamanhos também foram cuidadosamente escolhidos para que fizessem sentido de maneira sinérgica com os demais conteúdos da solução, como ilustrações, avatares, animações, etc.

Ilustrações e avatares

A escolha dos avatares foi feita para proporcionar segurança e manter a confidencialidade da imagem da criança para os responsáveis mais preocupados com a veiculação nos meios digitais. Pensados para criar um rapport entre interface e usuário, eles são amigáveis e autênticos, buscando englobar a maior parte dos grupos étnicos, promovendo a amplitude e a diversidade.

Já os ícones foram desenvolvidos com o intuito de misturar o informativo e o lúdico, de maneira a deixar clara a ação a ser executada, porém, mantendo a navegação amigável e leve.

Logomarca

Por fim, a criação da logomarca ocorreu após alguns experimentos e testes realizados utilizando como base diversas referências da área da saúde, cuidado e bem estar infantil. As cores, citadas anteriormente, são trazidas como proposta mais direta para um chamado visual que remete ao sorriso, ao estar e sentir-se bem. A palavra Crescer em evidência destaca o propósito da solução, ser o principal aliado do responsável no acompanhamento do desenvolvimento infantil e o sinal de “+”, com ajuste simétrico, evidencia a preocupação da marca em ir além, em propor novas soluções e inovar no cuidado, na saúde e no crescimento da criança.

Abaixo, temos algumas das versões iniciais para o logo da solução: