Projeto
Massas Nona Oliva

A Nona Oliva é uma empresa produtora de massas caseiras de Vacaria/RS, que em uma espiral de crescimento, resolveu mudar sua identidade visual para que pudesse atingir novos públicos em outras cidades da região. Surgindo aí também a necessidade de desenvolver um site, enquanto colaborador do Estúdio Scolaro, que pudesse transcrever essa nova etapa da empresa.

1. Objetivo

Segundo a família proprietária, a identidade visual antiga não estava mais de acordo com a imagem que desejavam transmitir, por isso, novas marca e embalagens foram criadas pelo Estúdio Scolaro. Para inseri-los definitivamente na internet como uma empresa com imagem mais séria e profissional, foram selecionados elementos como a história da empresa, o enfoque nos produtos e onde encontrá-los. Por isso, inspirado pela nova identidade visual, foi criado esse site institucional recheado de afeto, assim como essa querida marca da cidade de Vacaria/RS.

2. Começando os estudos

Todos os produtos da Nona Oliva são produzidos com um carinho especial, que só os produtos caseiros, frescos e sem conservantes podem oferecer. E é com essa premissa que podemos definir a palavra chave que norteará toda a criação a partir de agora: afeto.

2.1 Referências

Todo projeto desenvolvido, necessita de uma pesquisa extensa de concorrência e mercado, para que se possa saber qual é a abordagem utilizada por outras empresas e que o público-alvo está acostumado a consumir. Além disso, referências visuais também são extremamente importantes para instigar a inspiração e criatividade, possibilitando uma criação única, com personalidade e condizente com o nicho abordado.

2.2 Tipografia

Escolher a tipografia correta é fundamental para que seja possível transmitir a sensação que a empresa quer passar. Neste caso, foi utilizada a fonte Georgia para destacar títulos e textos, pois o seu traço é inteiramente cursivo (escrito a mão), o que torna a leitura mais acolhedora, além de trazer referências da própria marca e empresa nela.

Tipografia Georgia

Para os textos que precisávamos ter o máximo de legibilidade possível, utilizamos a Quattrocento Sans, que é uma fonte leve, moderna e agradável.

Tipografia Quattrocento Sans, Google Fonts.

2.3 Paleta de Cores

A arte é composta de diversos elementos, em que a cor também faz parte, sinalizando, transmitindo emoções e delimitando espaços com o uso do contraste. Cores transformam e nos auxiliam a associar sentimentos a objetos, pessoas, instituições e muito mais. É por isso que tons mais quentes e terrosos estão presentes nesta marca, pois remetem ao artesanal e à sensação de acolhimento e afeto.

Sinalização da paleta de cores aplicada no projeto Nona Oliva.

2.4 Wireframe

Com tudo pronto, partimos para uma das partes mais importantes: rabiscar! Sim, isso mesmo. É aqui que me permito criar sem errar, criando versões e versões rápidas de ideias que surgem a partir de todas as referências e estudos feitos anteriormente. Não são apenas uma ou duas telas criadas, são várias, sem limite! É a partir disso que consigo testar diversas opções em um curto período de tempo, até encontrar a fórmula mais adequada para o projeto, tornando cada criação única.

Alguns Wireframes extraídos do meu projeto no Figma.

3. Definição de layout

Após algumas horas de Wireframe e testes, partimos para a definição de layout. Reunimos todas as ideias que surgiram e precisamos filtrá-las, para extrairmos apenas o melhor de todas. Feito isso, nos voltamos para a disposição dos elementos na tela, aplicação de cores, imagens e textos.

4. Aprovação

Com a definição de layout pronta, o próximo passo é a aprovação com o cliente, onde vamos validar todas as informações e design aplicados no projeto.

5. Desenvolvimento

Chegamos em uma das partes que mais demandam tempo e cuidado, o desenvolvimento. Escolher o servidor e as tecnologias que serão utilizadas para dar vida a criação é algo muito sério e que pode definir o sucesso ou fracasso de um projeto. Costumo criar cada tema manualmente (estilo hard code mesmo). Dessa forma, é possível ter controle total do projeto, facilitando a sua manutenção e vida útil. Após tudo configurado e desenvolvido, a internet pode dar boas-vindas a uma nova criação, como, por exemplo, o site institucional da Massas Nona Oliva!

Print da página inicial do site institucional da Massas Nona Oliva.