Meu Outback
UX/UI Design ⋅ Design Responsivo ⋅ Handoff ⋅ Food
Cardápio e
Promoções
Cliente não se importa em fornecer dados para ter uma experiência mais personalizada;
As pessoas querem recomendações, seja do garçom ou de um app;
Cliente não se incomoda em esperar na fila desde que possa passear pelo shopping;
As pessoas gostariam de um app que reunisse todos os serviços, que hoje estão espalhados em diversos canais;
As pessoas acham a pesquisa de satisfação muito longa e cansativa.
Unificando a jornada de consumo em um ecossistema simples
Entrar na fila, reservar uma mesa, fazer um pedido. Gerenciar sua conta e seus benefícios.
Do pedido à entrega ou retirada
Dividimos o checkout em 2 etapas e organizamos as informações em blocos para diminuir a carga cognitiva.
Adiamos a autenticação para o final do pedido, reduzindo a fricção de entrada.
Mantivemos o botão de sacola e fila presente em toda a navegação, permitindo o acompanhanhamento do pedido ou da posição na fila durante o uso de outras áreas do app.
Espera digital e reserva de mesa
Projetamos a rápida troca entre formas de consumo, mantendo essa funcionalidade presente em toda a navegação.
Separamos o fluxo de seleção da forma de consumo em etapas e solicitamos apenas o necessário para reduzir a carga cognitiva.
Propusemos que o app guarde os endereços usados anteriormente para facilitar o próximo pedido.
Consistência do mobile ao desktop
Optamos pelo uso de drawer para facilitar a realização ou acompanhamento de um pedido enquanto navegando pela aplicação.
Criamos botões no header para acessar a sacola e ao mesmo tempo outras formas de consumo, como uma reserva agendada.
Pensamos uma experiência consistente entre app, PWA mobile e PWA desktop, trazendo familiaridade e interação fluida, mas respeitando as especificidades de cada situação de uso.
Fluxos e Fidelidade
Checkout / Separar a sacola em passos: resumo do pedido, entrega e pagamento.
Login e cadastro / Permitir que o login ou cadastro seja feito apenas no final e solicitar apenas os campos necessários.
Upsell / Oferecer upsell de produtos alternativos (nos detalhes do produto) e complementares (no carrinho).
Fidelidade / Deve ser fácil de entrar, ter mecânica simples, permitir o compartilhamento de recompensas e usar dados para se aproximar do cliente na hora certa.
Usabilidade
Erros / Explicar e direcionar o usuário em telas de erro.
Writing / Uma boa escrita UX nunca presume. Use mensagem clara e sempre considere 2 usuários com diferentes emoções.
Motion / O motion deve auxiliar o usuário no uso de algo. Alinhe o motion com a necessidade do usuário.
Gestos / O conteúdo não deve se esconder por trás de gestos ou interações complicadas.
Acessibilidade
Carrosséis devem ter até 3 ou 4 etapas e o conteúdo deve ser acessível de outra maneira também.
A acessibilidade é mais barata quando feita com antecedência.
Projetar para baixa largura de banda.
Usar mais do que cores para indicar informações importantes.
Usar palavras que possam ser aplicadas a todos os usuários.
Usar CTAs para definir uma expectativa clara e correta para o usuário.
iFood
Endereço na tela inicial e banners promocionais e categorias em destaque.
Layout clean e fluxo intuitivo, fácil de usar.
Botão de sacola que permanece em toda a navegação.
Carrinho dividido em etapas: resumo, entrega e pagamento.
Referências visuais
Produtos com imagem em destaque e diferentes formas de mostrar o cardápio.
Blocos de informação no carrinho para facilitar o uso.
Gestos que facilitem a interação, como ao remover um item do carrinho.
No acompanhamento do pedido, destacar as informações principais, podendo ver mais detalhes, e ter uma forma de acompanhar na tela inicial do app.
Na versão desktop, usar drawer para mais ações sem sair na tela em que está.
