O UI na criação da solução Faster Exp.

Roger Maruxo
6 min readJul 5, 2022

--

Como visto anteriormente na parte de UX:

Agora falarei sobre a continuação da contrução do projeto, as partes relacionadas a contrução da solução em si, que é quando transformei toda a pesquisa e planejamento para algo real e navegável. Menos escrita e mais ação.

PERSONA 3:

Criado pela demanda de um representante para a “Caixa Surpresa” da solução, com base no pensamento inicial de um botão “random” para a escolha dentro do APP, como será visto na interface do Wireframe.

WIREFRAME:

O “Rabiscoframe…” no papel, nesse link.

PROTÓTIPO DE MÉDIA FIDELIDADE:

FExp. início.

PROTÓTIPO DE ALTA FIDELIDADE:

FExp. dentro do iFood

TESTE DE USABILIDADE:

Realizado no Maze dia 03/07/2022. Os resultados serão apresentados nas missões 1,2, 3 e conclusões e insights a seguir.

ROTEIRO DO TESTE DE USABILIDADE

Objetivos

  • Detectar possíveis problemas de navegação do aplicativo.
  • Identificar se o usuário consegue fazer as principais ações (abrir a Caixa Surpresa, chegar a tela de Resultados) de forma intuitiva, sem necessitar ficar buscando.
  • Anotar os possíveis problemas do usuário durante a utilização.
  • Identificar os possíveis caminhos que o usuário fará (completar as missões no Maze).

Participantes

  1. Leticia Valério Meira (30 anos)
  2. Gustavo Nunes de Castro (29 anos)
  3. Geovane Vital (29 anos)
  4. Hudson Alencar (32 anos)

Dos recrutados até então, a única presencialmente testada será Letícia Valério Meira, os demais serão testados remotamente, por questões do Covid e por conveniência, já que assim é mais fácil arrumar tempo e marcar uma reunião. Entre eles, Geovane Vital e Letícia Valério Meira são os que mais se aproximam das duas personas construídas anteriormente, sendo que a terceira persona o “Flávio” ainda não recebeu representatividade similar. Três dos quatro participantes usam o aplicativo do iFood, sendo que Gustavo Nunes de Castro mora no litoral de Santa Catarina e não tem vivência com o aplicativo, assim tendo uma visão menos familiar com esta ferramenta, podendo mostrar aspectos que os outros não conseguem ver. Lembrando que a avaliação é sobre a solução dentro do app do possível cliente e não do aplicativo dele em si. Todos estão dentro do público observado na pesquisa feita anteriormente, que é de 20 a 39 anos. Todos foram recrutados por mim.

Processo

Para a execução do teste será utilizada a ferramenta Maze em que apresentarei a tela do protótipo e pedirei que algumas tarefas sejam realizadas. Deixarei a tela gravando pelo próprio Maze a fim de identificar o fluxo que o recrutado seguirá. Os participantes foram convidados pessoalmente e online, já que alguns moram em outros estados, assim podendo abranger a nacionalidade do cliente e ter maior representabilidade. No dia/hora o participante receberá um roteiro de atividades. Ao final do teste será pedido que ele tente incluir o máximo possível de comentários ao finalizá-lo.

Roteiro

  • Execute uma tarefa por vez, na ordem apresentada.
  • A tela, se possível, deverá ser gravada, para relatar o que encontrou dificuldade, o que foi simples e outros comentários.
  • Ao final de cada tarefa, finalizada ou não, o moderador e o observado poderão fazer algumas perguntas sobre o processo, ações tomadas e escolhas que você fez durante a execução.

Tarefas a serem realizadas

  • Chegue até o carrinho de compras na parte dos Resultados
  • Chegue até a área de pagamento pela caixa surpresa
  • Chegue até a área de outras perguntas

Questionário de encerramento

  • Perguntas abertas
  • Como foi a atividade?
  • Você sentiu que conseguiu completar todas as tarefas sem haver dúvidas?
  • Você achou que o aplicativo é intuitivo, ou seja, qualquer um pode usá-lo? Ou ainda precisa ser simplificado?
  • Você possuiu dúvidas ao usá-lo?
  • Espaço aberto para qualquer dúvida, comentários, elogios, etc.
  • Você lembra como eram as figuras das páginas ? Se sim, como elas eram?

MISSÃO 1:

Gravação e heatmap.

MISSÃO 2:

Gravação e heatmap.

MISSÃO 3:

Gravação e heatmap.

CONCLUSÕES & INSIGHTS

Após a conclusão deste teste de usabilidade, alguns insights foram aproveitados a fim de refinar o app.

O primeiro e mais importante foi a usabilidade. Onde a usuária testada encontrou dificuldade ao usar os elementos animados da área de “Quanto quer pagar?”, sendo que já era previsto, já que em sua grande maioria, este tipo de interação também pode ser feita com o click (tap), como vemos no heatmap, ela tenta clicar diretamente para onde ela quer que a esfera na barra vá e assim ela não tentou arrastar a esfera logo de cara, tendo atraso e dificuldade nisso, durante a utilização do protótipo pelo Maze, que ainda não está completamente animado como será em sua forma de lançamento. Em consequência disso ela deu nota 4 de 5 estrelas para a solução apresentada.

Alguns erros de digitação no Maze foram detectados e que serão arrumados para os próximos testes.

Assim, com as mudanças feitas e considerações finais, pode-se dizer que a parte dos “Restaurantes” onde a solução foi aplicada inicialmente está em seu estágio final, faltando melhores animações e mais testes de usabilidade conforme as outras partes previstas também serão feitas. Sendo estas, a área de “Bebidas” no menu inicial do iFood e a ferramenta aplicada num cliente do mercado de vestuário.

Tirando o que foi dito a cima, a usuária gostou da solução, achou de forma intuitiva e rápida as informações e a trajetoria que foi planejada para ser seguida, assim completando esse teste de forma satisfatória e positiva.

LOGO:

Escolhi o cavalo por representrar velocidade e elegância.

--

--

Roger Maruxo

Bacharel em tecnologia e comunicação social, estudante de UX/UI design. Sou um profissional comunicativo, colaborativo, criativo, crítico, curioso e detalhista.