Com mais de 50 anos de atuação, a LTD Commodities é uma das principais varejistas online e de catálogo da Inglaterra, reconhecida por oferecer produtos de qualidade a preços acessíveis.
O projeto teve como objetivo a reformulação completa do e-commerce B2C da marca, em parceria com a Compasso.
A iniciativa fazia parte de um movimento de transformação digital, buscando modernizar a experiência e estabelecer uma base visual e estrutural que pudesse ser replicada para outras marcas do grupo.
Problema
O site precisava ser reformulado para:
Modernizar a experiência visual
Tornar o layout mais clean e acessível
Estruturar um padrão visual consistente
Criar uma base escalável para replicação futura
O desafio não era apenas redesenhar telas, mas criar uma estrutura visual sólida que pudesse sustentar múltiplas marcas do grupo.
Antes e depois da página de produto.
Plataforma e Estrutura Técnica
O e-commerce foi desenvolvido sobre a Oracle Commerce Cloud, utilizando a arquitetura nativa da plataforma como base.
A estratégia priorizou:
Uso de componentes nativos
Customizações pontuais
Aderência à arquitetura padrão
Redução de complexidade técnica
A estilização foi aplicada sobre os componentes existentes, garantindo alinhamento visual sem comprometer performance ou manutenção.
Essa decisão foi fundamental para que o projeto se tornasse modelo estrutural para outras marcas do grupo, funcionando como framework digital replicável.
Solução
Direção Visual e Style Guide
Antes da criação das telas, foi estruturado um novo Style Guide com o objetivo de garantir consistência, escalabilidade e eficiência na implementação.
A proposta manteve os principais elementos da identidade da marca, mas trouxe evoluções para melhorar contraste, hierarquia visual e acessibilidade.
O Style Guide definiu:
Paleta de cores: azul como primário, novo verde como secundário e reformulação dos tons de cinza.
Tipografia: Roboto como principal e Merriweather como apoio.
Componentes e estados: botões, inputs e elementos interativos estruturados com variações e estados.
Elementos visuais: iconografia, ilustrações e sistema de sombras padronizados.
Essa estrutura foi fundamental para acelerar o desenvolvimento e permitir a replicação do layout para outras marcas do grupo.
Componentização
Para garantir eficiência e consistência:
Componentes estruturais foram definidos antes da criação das telas
Elementos recorrentes foram padronizados
Variações e estados interativos foram mapeados
Foram criados componentes como:
Header
Footer
Cards
Carrossel
Essa organização reduziu retrabalho, facilitou manutenção e acelerou a expansão para outras marcas.
Resultado
Após a aprovação das telas, o layout foi replicado para outras marcas do grupo:
Lakeside Collection
Fresh Finds
A estruturação do Style Guide e da componentização foi decisiva para:
Reduzir tempo de implementação das novas marcas
Garantir consistência visual
Facilitar manutenção e evolução do produto
Criar uma base escalável de design
O resultado foi um layout clean, elegante e acessível, alinhado às expectativas da empresa e preparado para expansão.
Aprendizados
Este projeto reforçou:
A importância de estruturar um Design System antes de escalar
O impacto da componentização na eficiência do time
O valor estratégico da organização visual para múltiplas marcas
Mais do que um redesign, foi a construção de uma base sustentável para crescimento digital.
