Kosmos Bakeshop

01. Pesquisa e Estratégia

Comecei pesquisando sites de outros restaurantes e confeitarias para entender os padrões do setor. O que encontrei foi sempre o mesmo: um horário fixo, como "seg a sex: 09h às 20h". A Kosmos tinha uma lógica completamente diferente, com dias e horários específicos para o café da manhã, brunch, almoço e confeitaria.

Esse foi o principal desafio de arquitetura de informação do projeto: como apresentar essa complexidade sem confundir quem só quer saber se consegue tomar um café agora?

Outro aprendizado da pesquisa foi sobre o papel das imagens. Em gastronomia, a foto não é decoração. Ela é o que convence o usuário a fazer um pedido ou visitar o lugar. Isso moldou diretamente as decisões visuais do projeto.

02. Ideação e Design

Antes de abrir o Framer, usei o Lovable e o Bolt para criar esboços rápidos da estrutura. Funcionaram como wireframes de baixa fidelidade, me ajudando a validar a organização das informações antes de investir tempo no design final.

Com a estrutura definida, parti para o design de alta fidelidade no Framer. As cores seguiram a identidade visual da própria Kosmos, mantendo coerência com a marca. As imagens ganharam destaque em todo o site, especialmente na home, onde são o primeiro contato do usuário com o universo da confeitaria.

Para o cardápio, optei por páginas separadas por categoria em vez de um CMS unificado. Apesar das páginas serem visualmente parecidas, a quantidade de itens varia muito de uma para outra, o que tornaria o CMS uma solução mais limitante do que prática.

03. Teste e Iteração

Como o projeto era um case study, os testes foram feitos com conhecidos. Dois feedbacks se destacaram.

O primeiro foi técnico: a fonte do menu estava grande demais no mobile. Ajuste simples, mas que faria diferença na experiência real.

O segundo foi comportamental: durante o teste, percebi um usuário tentando deslizar o dedo na imagem da home. O carrossel original passava de imagem apenas automaticamente, sem responder ao gesto. Essa observação me fez transformá-lo em um carrossel que responde tanto ao tempo quanto ao toque do usuário. Uma mudança pequena, mas que surgiu diretamente de observar o comportamento real de quem usava o site.

04. Solução Final

O site é responsivo, organizado por categoria e fácil de navegar em qualquer dispositivo. Nos testes, nenhum usuário teve dificuldade para entender os horários, que era o maior desafio do projeto.

O principal aprendizado foi a confirmação do valor dos testes com usuários, mesmo em escala pequena. A mudança no carrossel não teria acontecido sem observar um usuário real interagindo com o site. Pequenas observações geram grandes melhorias.