Worten
header+menu

Logo WortenLogo
  • Cliente
  • Worten
  • Papel
  • Design UX/UI
  • Período
  • 2023-2024
  • Local
  • Lisboa, Portugal

1. Produto e problema

Pesquisar

Menu antigoNovo menu

A Worten é uma das maiores retalhistas de eletrónica em Portugal. O produto em causa é o cabeçalho e o sistema de navegação, a porta de entrada do site. A análise revelou uma quebra elevada antes de os utilizadores chegarem aos serviços principais, a Worten Resolve.

Três problemas sobrepostos explicavam o padrão:

  1. Os serviços estavam escondidos num menu hambúrguer na parte inferior do ecrã. Para lhes chegar, era preciso recordar o que existia em vez de o reconhecer. Isto contrariava o princípio Recognition rather than Recall.
  2. A barra de pesquisa dominava o espaço acima da dobra, comprimindo os restantes elementos e contrariando o princípio Aesthetic and Minimalist Design.
  3. A navegação dividia-se entre o topo e a base do ecrã. Era um padrão pouco convencional, que os utilizadores móveis não reconheciam como navegação.

O fluxo real, mapeado:

tocar no menu → acompanhar a animação de abertura → percorrer as opções → escolher o serviço → voltar atrás se a escolha não resolver.

Scroll para percorrer o fluxo

  1. 01Tocar no menu
  2. 02Acompanhar a animação de abertura
  3. 03Percorrer as opções
  4. 04Entrar no serviço
  5. 05Voltar atrás quando a escolha não resolve

Uma ação que devia exigir um toque passou a exigir vários passos.

2. Papel e contributo

Redesenhei o cabeçalho e a navegação móvel e participei no desenvolvimento. O handoff ficou a cargo de outra pessoa.

3. Decisões de design

A decisão central foi redistribuir os elementos existentes, sem adicionar novos.

Recognition Rather Than Recall

Colocar o ícone do menu no local esperado reduz a carga cognitiva e torna a navegação mais fácil de reconhecer.

O menu hambúrguer passa a ter uma posição fixa e visível no cabeçalho. Assim, deixa de depender da memória do utilizador.

O princípio que guiou as três decisões: conclusão imediata da tarefa antes de minimalismo visual. A hierarquia manteve-se; o custo de interação diminuiu.

4. Resultados

A nova estrutura tornou os serviços, uma oferta que já existia, mais fáceis de encontrar e utilizar.

No mobile, a navegação passou a viver num só lugar, no header.

Os serviços passaram a ser descobertos em todos os pontos de contacto. Antes, a navegação impedia essa integração omnicanal.

O que fica registado aqui é o desenho de navegação desenvolvido entre 2023 e 2024.

Worten na App Store
Worten no Google Play
Worten - Tudo o que precisas em Worten.pt
Worten - Tudo o que precisas em Worten.pt

Precisa melhorar um produto mobile ou web?

Trabalho com equipes de produto em UX, UI e sistemas de design. Conte-me sobre o seu projeto.

Entre em contato