Com a experiência validada, o projeto foi implementado e passou a apoiar a estratégia digital do Empório Redepas, contribuindo para a evolução do aplicativo e seus indicadores de negócio.
ETAPA 9
Protótipo
Com a interface consolidada, desenvolvi um protótipo navegável para validar a experiência entre as principais telas do aplicativo. Essa etapa permitiu simular a jornada do usuário e verificar se as decisões tomadas ao longo do projeto resultavam em uma navegação fluida e intuitiva.
ETAPA 4
Com base nas análises realizadas, reorganizei a arquitetura da informação do aplicativo para tornar a navegação mais intuitiva e reduzir o número de etapas até os principais conteúdos. O objetivo era priorizar as funcionalidades mais relevantes para o usuário e estruturar uma base sólida para a evolução da interface.
Arquitetura da
Informação
O que mudou
Categorias
Reposicionadas para facilitar a descoberta de produtos.
01
Hierarquia
Elementos reorganizados conforme sua importância para a jornada.
02
Navegação
Fluxos simplificados para reduzir etapas.
03
Estrutura
Organização preparada para suportar o e-commerce.
04
Home
Banner
Promoções
!
!
Categorias
Produtos
Carrinho
ANTES
Promoções
Produtos
Carrinho
Busca
Categorias
DEPOIS
Home
Arquitetura antes e depois
Principais decisões
PROBLEMA
#
DECISÃO
01
Categorias escondidas
02
Busca distante
03
Informações competindo
04
Fluxo longo
Reposicionar acima dos banners
Trazer para a primeira área visível
Criar uma hierarquia clara
Reduzir etapas
Com a nova arquitetura definida, foi possível transformar essas decisões em fluxos e wireframes, validando a organização da experiência antes do desenvolvimento visual da interface.
PRÓXIMA ETAPA
Como UI/UX Designer, participei da evolução da experiência do aplicativo desde a análise do produto até a entrega para desenvolvimento. Durante o projeto conduzi pesquisas, benchmark, arquitetura da informação, criação de wireframes, protótipos e interfaces, além do handoff para desenvolvimento, sempre considerando as limitações técnicas da plataforma.
Contexto
O Empório Redepas é uma rede de supermercados com oito unidades no interior de São Paulo que buscava fortalecer sua presença digital por meio do aplicativo. O principal objetivo era transformar o aplicativo em um canal mais relevante para os clientes, facilitando o acesso às ofertas, aumentando o engajamento e preparando a plataforma para a implementação do
e-commerce.
Meu papel
ETAPA 1
Objetivos do projeto
Melhorar a navegação
Reduzir atritos durante
a jornada de compra.
Facilitar o acesso às categorias e ofertas.
Facilitar a descoberta de produtos
Estruturar o e-commerce
Preparar o aplicativo para vendas online.
Retenção e engajamento
Estimular recorrência e engajamento.
Evoluindo a experiência
digital do Empório Redepas
Um projeto focado em melhorar a navegação, reorganizar
a arquitetura da informação e implementar o e-commerce para aumentar a retenção dos usuários.
Empresa
Empório Redepas
Meu papel
UI/UX Designer
Duração
4 Semanas
ETAPA 7
Interface Final
Com a estrutura validada em baixa fidelidade, desenvolvi a interface final do aplicativo priorizando clareza visual, consistência e facilidade de navegação. Cada decisão de UI foi construída para reforçar as melhorias identificadas durante as etapas anteriores, mantendo o foco na descoberta de produtos e na experiência de compra.
Oferta
Produto
Carrinho
Compra
Checkout
Navegação simplificada
Principais melhorias
Hierarquia visual reorganizada
Descoberta de produtos facilitada
Estrutura preparada para o e-commerce
Com a estrutura validada em baixa fidelidade, iniciei a construção da interface visual, transformando as decisões de experiência em uma solução consistente e alinhada à identidade do produto.
Outros projetos
Você tem um projeto?
Vamos conversar e construir
algo incrivel juntos!
Navegação
Social
®2026 Todos os direitos reservados. Miguel Okubo.
Apesar de oferecer funcionalidades importantes para os clientes, o aplicativo apresentava uma experiência que dificultava a descoberta de produtos e o acesso às principais funcionalidades. A navegação exigia muitas etapas, a hierarquia visual não direcionava corretamente a atenção dos usuários e informações estratégicas competiam entre si, tornando a jornada menos intuitiva.
Principais desafios encontrados
Navegação extensa
Os usuários precisavam percorrer
muitas etapas até encontrar produtos.
01
!
Categorias pouco visíveis
As categorias competiam visualmente
com banners e outras informações.
02
!
Baixa hierarquia visual
Elementos importantes não
recebiam o destaque necessário.
03
!
Experiência pouco eficiente
A jornada dificultava a descoberta
de produtos e impactava o uso do
aplicativo.
04
!
Antes de propor qualquer solução, era importante entender como outros
aplicativos do segmento organizavam suas experiências e quais padrões
poderiam servir de referência para esse contexto.
PRÓXIMA ETAPA
ETAPA 2
Desafio
Descoberta
Antes de propor mudanças na interface, busquei compreender como outras empresas do setor estruturavam suas experiências digitais. O objetivo era identificar padrões consolidados de navegação, oportunidades de melhoria e validar quais soluções faziam sentido para a realidade do Empório Redepas.
ETAPA 3
Benchmark
Analisei aplicativos de grandes
redes supermercadistas para
entender padrões de navegação,
organização de categorias
e descoberta de produtos.
01
Produto atual
Avaliei a estrutura existente
para identificar gargalos de
navegação, pontos de atrito
e oportunidades de melhoria.
02
Concorrentes
Comparei soluções utilizadas
por empresas do mesmo segmento
para identificar boas práticas
aplicáveis ao projeto.
03
Referências
Busquei referências de interface
e usabilidade para validar padrões
visuais e decisões de experiência.
04
Aplicativo
Oportunidade identificada
Carrefour
Promoções em destaque
Assaí
Navegação simplificada
Pão de Açúcar
Busca com maior prioridade
Mercado Livre
Organização da home
Principais insights
Categorias recebem
prioridade na
navegação
01
A busca precisa estar
acessivel em poucos
segundos.
02
Promoções funcionam
melhor quando não
competem com
elementos principais.
03
A hierarquia visual
direciona a descoberta
de produtos.
04
A partir dessas análises foi possível identificar padrões recorrentes
e oportunidades que serviram como base para reorganizar a arquitetura
da informação e definir uma nova estrutura de navegação para o aplicativo.
PRÓXIMA ETAPA
ETAPA 5
User Flow
Com a arquitetura da informação reorganizada, defini o fluxo de navegação para reduzir etapas e tornar a jornada mais objetiva. O foco foi conectar as principais funcionalidades do aplicativo de forma intuitiva, diminuindo o esforço necessário para localizar produtos e concluir a navegação.
FLUXO PRINCIPAL
Home
1
Categorias
2
Lista de produtos
3
Detalhes do produto
4
Carrinho
5
Checkout
6
Menos etapas
A jornada foi simplificada para reduzir o tempo até o produto.
Navegação intuitiva
As principais ações ficaram concentradas nos primeiros níveis.
Maior previsibilidade
O usuário consegue entender facilmente o próximo passo da navegação.
O que esse fluxo resolveu
Com o fluxo validado, foi possível iniciar a construção dos wireframes, explorando diferentes alternativas de layout antes da definição da interface final.
PRÓXIMA ETAPA
Checkout
Ofertas
Detalhes
Carrinho
ETAPA 6
Wireframes
Com a estrutura da navegação definida, iniciei a exploração das telas em baixa fidelidade para validar a organização das informações e testar diferentes alternativas de layout. Essa etapa permitiu identificar oportunidades de melhoria antes da construção da interface final, reduzindo retrabalho e tornando as decisões de design mais consistentes.
Definição da prosição dos
principais elementos da
interface.
Organização
Priorização das
informações mais
relevantes para cada tela
Hierarquia
Validação do fluxo entre
as principais funcionalidades.
Navegação
Com a estrutura validada em baixa fidelidade, iniciei a construção da interface visual, transformando as decisões de experiência em uma solução consistente e alinhada à identidade do produto.
PRÓXIMA ETAPA
Carrinho
Banner perde
prioridade
Busca
reposicionada
ETAPA 8
Sistema Visual
Durante o desenvolvimento da interface, defini padrões visuais para garantir consistência entre as telas e facilitar futuras evoluções do produto. Em vez de construir um Design System completo, organizei uma base visual reutilizável composta por cores, tipografia e componentes essenciais.
Navegação
Adicionar ao carrinho
Ver detalhes
Display
Cores
Botões
Tipografia
Heading
Body