01 — Contexto
Em 2012, trabalhei na UI da página da Duvel para a WBeer.com.br, reaproveitando a mesma biblioteca de componentes usada nas demais marcas de cerveja do braço WBeer.
A Duvel entrou como um tema aplicado sobre header, bloco de produto e banner, adaptando a identidade da cerveja sem alterar a arquitetura dos componentes.
02 — Problemas identificados
Adaptar os componentes à identidade da Duvel
O desafio era re-tematizar os blocos de UI existentes para a personalidade da cerveja, mantendo a consistência com as outras páginas de marca do WBeer.
03 — Processo
Projeto de 2012 para a WBeer.com.br. A página foi montada com o sistema de componentes reutilizáveis, aplicando o tema da Duvel sobre os blocos de produto e banner.
04 — Abordagem
Tematização dos componentes de UI
- Reuso dos componentes de header, bloco de produto e CTA
- Aplicação do tema Duvel (paleta, tipografia e imagens) sobre a biblioteca
- Ajuste de grid e banners preservando consistência entre as páginas do WBeer
05 — Decisões de design
Identidade da Duvel aplicada como tema
Acelerava a produção da página reaproveitando os componentes existentes
Componentes compartilhados com as demais marcas
Mantinha a UI consistente em todo o catálogo de cervejas do WBeer