Cliente
Cliente
Serviço
Serviço
iFood
iFood
Design
Design
Local
Local
Ano
Ano
2024
2024
São Paulo, SP
São Paulo, SP
Direção de art & UI/UX Designer
Miguel Okubo
Conceito
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.
Direção de art & UI/UX Designer
Miguel Okubo
Conceito
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.
Direção de art & UI/UX Designer
Miguel Okubo
Conceito
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.
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.
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.
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.
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
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
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
Como conduzi essa etapa
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
Benchmark
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
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
Como conduzi essa etapa
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
Benchmark
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
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
Como conduzi essa etapa
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
Benchmark
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 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
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
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
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
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
Home
1
Categorias
2
Lista de produtos
3
Detalhes do produto
4
Carrinho
5
Checkout
6
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
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
Home
1
Categorias
2
Lista de produtos
3
Detalhes do produto
4
Carrinho
5
Checkout
6
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
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
Home
1
Categorias
2
Lista de produtos
3
Detalhes do produto
4
Carrinho
5
Checkout
6
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.
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
Checkout
Ofertas
Detalhes
Carrinho
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
Carrinho
Banner perde
prioridade
Busca
reposicionada
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.
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
Checkout
Ofertas
Detalhes
Carrinho
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
Carrinho
Banner perde
prioridade
Busca
reposicionada
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.
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
Checkout
Ofertas
Detalhes
Carrinho
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
Carrinho
Banner perde
prioridade
Busca
reposicionada
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.
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.
Oferta
Produto
Carrinho
Compra
Checkout
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.
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.
Oferta
Produto
Carrinho
Compra
Checkout
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.
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.
Oferta
Produto
Carrinho
Compra
Checkout
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.
Principios
Consistência
01
Os mesmos padroes foram reutilizados entre todas as telas
para reduzir esforço cognitivo.
Hierarquia
Cores, pesos tipográficos
e espaçamentos direcionam
a atenção do usuário.
02
Escalabilidade
Os componentes foram
estruturados para facilitar
futuras evoluções da interface.
03
Acessibilidade
Contrates, áreas de toque
e tamanhos foram definidos
para favorecer a usabilidade.
04
Navegação
Adicionar ao carrinho
Ver detalhes
Display
Cores
Botões
Tipografia
Heading
Body
Navegação
Cards
Heading
Pesquisa
Aplicação
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.
Principios
Consistência
01
Os mesmos padroes foram reutilizados entre todas as telas
para reduzir esforço cognitivo.
Hierarquia
Cores, pesos tipográficos
e espaçamentos direcionam
a atenção do usuário.
02
Escalabilidade
Os componentes foram
estruturados para facilitar
futuras evoluções da interface.
03
Acessibilidade
Contrates, áreas de toque
e tamanhos foram definidos
para favorecer a usabilidade.
04
Navegação
Adicionar ao carrinho
Ver detalhes
Display
Cores
Botões
Tipografia
Heading
Body
Navegação
Cards
Heading
Pesquisa
Aplicação
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.
Principios
Consistência
01
Os mesmos padroes foram reutilizados entre todas as telas
para reduzir esforço cognitivo.
Hierarquia
Cores, pesos tipográficos
e espaçamentos direcionam
a atenção do usuário.
02
Escalabilidade
Os componentes foram
estruturados para facilitar
futuras evoluções da interface.
03
Acessibilidade
Contrates, áreas de toque
e tamanhos foram definidos
para favorecer a usabilidade.
04
Navegação
Adicionar ao carrinho
Ver detalhes
Display
Cores
Botões
Tipografia
Heading
Body
Navegação
Cards
Heading
Pesquisa
Aplicação
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.
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 10
Resultados
Após a implementação da solução, o aplicativo passou a oferecer uma experiência mais organizada e intuitiva, apoiando a estratégia digital do Empório Redepas e contribuindo para a evolução do produto.
Impacto do projeto
+1.000
novos usuários cadastrados nos primeiros
12 dias após o lançamento
Retenção
CRM
GMV
Impacto no Produto
Navegação reorganizada
Descoberta de produtos facilitada
Estrutura preparada para expansão do e-commerce
Fluxo simplificado
Impacto no Negócio
Crescimento da base de usuários
Base preparada para evolução
do e-commerce
Melhor aproveitamento do aplicativo como canal digital
Apoio as campanhas de CRM
Mais do que modernizar uma interface, este projeto demonstrou como decisões de UX podem gerar impacto real quando alinhadas aos objetivos do negócio, transformando o aplicativo em um canal digital mais eficiente e preparado para crescer.
ETAPA 10
Resultados
Após a implementação da solução, o aplicativo passou a oferecer uma experiência mais organizada e intuitiva, apoiando a estratégia digital do Empório Redepas e contribuindo para a evolução do produto.
Impacto do projeto
+1.000
novos usuários cadastrados nos primeiros
12 dias após o lançamento
Retenção
CRM
GMV
Impacto no Produto
Navegação reorganizada
Descoberta de produtos facilitada
Estrutura preparada para expansão do e-commerce
Fluxo simplificado
Impacto no Negócio
Crescimento da base de usuários
Base preparada para evolução
do e-commerce
Melhor aproveitamento do aplicativo como canal digital
Apoio as campanhas de CRM
Mais do que modernizar uma interface, este projeto demonstrou como decisões de UX podem gerar impacto real quando alinhadas aos objetivos do negócio, transformando o aplicativo em um canal digital mais eficiente e preparado para crescer.
ETAPA 11
Aprendizados
01
Projetar dentro de limitações
Aprendi que nem sempre é possível redesenhar um produto por completo. Em muitos cenários, o desafio está em gerar impacto respeitando restrições técnicas e de negócio.
02
UX antes de UI
A reorganização da arquitetura da informação e dos fluxos teve mais impacto na experiência do que qualquer decisão visual.
03
Decisões precisam de contexto
Cada alteração realizada foi baseada em pesquisa, benchmark e entendimento do produto, reduzindo decisões guiadas apenas por estética.
04
Pensar em produto
Cada alteração realizada foi baseada em pesquisa, benchmark e entendimento do produto, reduzindo decisões guiadas apenas por estética.
ETAPA 11
Aprendizados
01
Projetar dentro de limitações
Aprendi que nem sempre é possível redesenhar um produto por completo. Em muitos cenários, o desafio está em gerar impacto respeitando restrições técnicas e de negócio.
02
UX antes de UI
A reorganização da arquitetura da informação e dos fluxos teve mais impacto na experiência do que qualquer decisão visual.
03
Decisões precisam de contexto
Cada alteração realizada foi baseada em pesquisa, benchmark e entendimento do produto, reduzindo decisões guiadas apenas por estética.
04
Pensar em produto
Cada alteração realizada foi baseada em pesquisa, benchmark e entendimento do produto, reduzindo decisões guiadas apenas por estética.
ETAPA 11
Aprendizados
01
Projetar dentro de limitações
Aprendi que nem sempre é possível redesenhar um produto por completo. Em muitos cenários, o desafio está em gerar impacto respeitando restrições técnicas e de negócio.
02
UX antes de UI
A reorganização da arquitetura da informação e dos fluxos teve mais impacto na experiência do que qualquer decisão visual.
03
Decisões precisam de contexto
Cada alteração realizada foi baseada em pesquisa, benchmark e entendimento do produto, reduzindo decisões guiadas apenas por estética.
04
Pensar em produto
Cada alteração realizada foi baseada em pesquisa, benchmark e entendimento do produto, reduzindo decisões guiadas apenas por estética.
© 2026 Miguel Okubo — Todos os direitos reservados.
© 2026 Miguel Okubo — Todos os direitos reservados.