R85Design estratégico.
Impacto real.
Agendar diagnóstico WhatsApp
Agendar diagnóstico Conversar no WhatsApp
Voltar aos projetos

Hortifruti e Natural da TerraMuda a loja. A jornada continua.

Regionalização, troca de loja e preservação do carrinho em uma experiência multimarcas.

Atuação
UX/UI · Rafael Rossini
Colaboração
Times da Quality Digital
Contexto
Supermercado · Regionalização

Resumo

Conduzi o UX/UI da regionalização de Hortifruti e Natural da Terra em colaboração com os times multidisciplinares da Quality Digital. As marcas compartilham uma plataforma, mas possuem design systems distintos: Hortifruti no Rio de Janeiro e Natural da Terra em São Paulo. O trabalho conectou localização por CEP, disponibilidade regional e troca de loja. A funcionalidade foi entregue em produção, com preservação do carrinho confirmada no projeto.

Contexto

Em uma compra de supermercado, a localização participa da experiência de produto. Preço e estoque dependem do CEP atendido, por isso a definição da região precisa estar ligada ao que a pessoa encontra na loja.

A plataforma também precisa orientar situações em que o atendimento envolve outra loja ou marca. Nessa transição, uma interação consistente ajuda a explicar o que está acontecendo, enquanto a identidade visual mantém a distinção entre Hortifruti e Natural da Terra.

Meu papel

Minha responsabilidade foi conduzir UX/UI com os times da Quality Digital, considerando as experiências mobile e desktop. O escopo incluiu a entrada de localização, os estados de atendimento e os caminhos de troca de loja, em uma plataforma compartilhada por duas identidades visuais.

As telas mostram a contribuição de design para organizar essas condições e conectá-las à jornada de compra.

A solução em uso

Telas do projeto. Abra uma imagem para explorar os detalhes.

O desafio

O desafio era manter um padrão funcional entre lojas e regiões sem apagar as características visuais das marcas. O fluxo precisava contemplar regiões atendidas e não atendidas, lojas cadastradas e não cadastradas e situações de transferência entre marcas.

Havia também uma condição importante na composição da interface: localização e troca de loja convivem com elementos como minicarrinho, aviso de cookies e chat Zendesk. A ação principal precisava continuar identificável nesse conjunto, especialmente no espaço disponível no mobile.

Evidências do trabalho

O arquivo de design documenta a localização e a troca de loja em mobile e desktop, incluindo composições com cookies e chat. Esses estados permitem examinar a experiência para além do primeiro preenchimento de CEP.

A documentação também apresenta uma proposta de eventos e de experimento para acompanhar o fluxo. Esse plano de mensuração é separado da entrega em produção; não representa um teste A/B executado.

Conectar localização às condições da compra

O CEP orienta a regionalização de preço e estoque. A solução torna a definição de localização parte da jornada, permitindo apresentar o atendimento de acordo com a região. Isso dá contexto para a pessoa entender por que a loja disponível e as condições dos produtos podem variar.

Compartilhar a lógica e preservar as marcas

Os fluxos mantêm um padrão funcional entre Hortifruti e Natural da Terra, respeitando os design systems de cada marca. A consistência está na forma de conduzir a tarefa, preservando a identidade visual da loja de destino.

Representar as alternativas de atendimento

Os estados contemplam regiões atendidas e não atendidas, diferentes condições de cadastro de loja e a transferência entre marcas. Dar espaço a essas variações evita que o fluxo seja especificado apenas para um CEP com atendimento imediato. A solução precisa orientar a continuidade também quando a primeira combinação de região e loja não atende à compra.

Coordenar localização e elementos da interface

O uso de modal e painel lateral segue uma lógica consistente com o minicarrinho. As composições com aviso de cookies e chat consideram a necessidade de não obstruir a ação principal. Esse cuidado trata a regionalização como parte da interface existente, e não como uma camada independente dos demais componentes.

Resultado observado e impacto esperado

A regionalização está em produção e preserva o carrinho. Esses são os resultados confirmados da entrega. A preservação dá continuidade à seleção já realizada, sem representar uma garantia de que preço, estoque ou condições serão idênticos entre regiões.

O impacto esperado é reduzir rupturas na jornada e tornar mais claras as condições regionais da compra. Não há, neste recorte, indicadores quantitativos confirmados para atribuir uma variação de conversão, abandono ou receita à solução.

O plano de acompanhamento propõe observar abertura do modal, inserção de CEP e aceitação da troca de loja, incluindo origem e destino do fluxo. Essa instrumentação permitiria investigar em quais contextos a regionalização ajuda a continuidade e onde ainda existem dificuldades.

Síntese profissional

O case evidencia que consistência funcional e identidade visual podem ser tratadas em camadas diferentes. Também mostra a importância de especificar transições e exceções com o mesmo cuidado dedicado ao caminho principal. Em experiências regionais, preservar a continuidade exige coordenar localização, atendimento, carrinho e comunicação das condições de compra.

O próximo desafio pode ser o seu.

Se sua equipe trabalha com jornadas multimarcas ou experiências que variam por região, entre em contato para conversarmos sobre esses desafios de UX/UI.

Conversar sobre meu projeto Próximo case: H&M
Abrir imagem em outra aba