UX & Games: User Interface
Ideias que podem ir das fases direto para o seu produto
Neste próximo estágio, vamos observar como alguns jogos resolvem desafios visuais com maestria e pensar como podemos replicar esses conhecimentos na hora de criar nossas próprias experiências.
Se você não leu a Parte 1, acesse clicando aqui.
Adaptar a experiência para cada device
Diferenças entre mouse e touch
Enquanto o mouse tem uma grande precisão, que permite clicar em elementos muito pequenos, as interfaces de toque dos celulares estão limitadas pelo tamanho dos dedos do usuário.
Um jogo “point and click” como The Dig, com momentos de “pixel hunting”, não funcionaria tão bem no mobile.
Com o número de acessos mobile tendo superado o desktop, é cada vez mais importante garantir que os componentes sejam grandes o bastante para possibilitar o toque.
Vale também pensar em uma revisão de termos. Expressões como “clique aqui” não fazem sentido sem o clique do mouse.
Ergonomia no mobile
Em um jogo de celular, nossas mãos geralmente executam duas funções: realizar as ações e segurar o device. Por isso, é importante que os botões estejam localizados o mais próximo possível dos cantos inferiores da tela, para um fácil acesso do polegar.
Essa regra é ainda mais importante quando o device está na posição vertical, já que muitas vezes precisamos executar funções com apenas uma das mãos.
Aproveitar os recursos de cada plataforma
Os celulares modernos tem vários recursos que podem ser explorados: geolocalização, sensores de movimento, câmeras integradas, telas tocáveis, entre outros.
Muitos títulos de corrida, como a série Asphalt, utilizam o acelerômetro para mudar a direção do carro, imitando o movimento de um volante real. Isso aumenta a imersão e faz com que o jogador se sinta um verdadeiro piloto.
Mostre, não diga.
Esconda os números dentro da experiência
Uma barra de vida pode ser uma boa forma de mostrar quantos golpes a personagem pode sofrer antes do game over. Mas ela também carrega a tela com mais um elemento visual, além de ser um elemento externo ao mundo do jogo.
No jogo de plataforma Ghouls ‘N Ghosts, quando o cavaleiro sofre dano a primeira vez, perde a armadura, ficando só de cueca. Ao levar um segundo ataque, ele vira esqueleto e o jogador perde uma vida.
Perceba que o estado do personagem é sua própria barra de vida. Isso torna o jogo mais imersivo: você se sente mais seguro com a armadura e mais exposto quando apenas com as roupas de baixo.
Utilize o cenário para direcionar o jogador
É muito comum utilizar setas gigantes, “bat-sinais” ou pontos brilhantes no mapa para mostrar ao player para onde ir. Contudo, alguns jogos fazem isso de forma mais elegante.
Control utiliza muito bem a iluminação para dar dicas ao jogador. Uma sala ou corredor mais claro geralmente é o caminho principal, enquanto um local mais escuro é um desvio ou contém segredos que, apesar de não serem decisivos para a história, recompensam as pessoas mais exploradoras.
A câmera também pode fazer esse papel: quando está próxima e atrás da personagem, quer dizer para seguirmos em frente. Quando mostra um grande plano aberto com a personagem a esquerda, indica que devemos ir para a direita.
Mantenha a consistência
Deixe elementos semelhantes na mesma posição
O cérebro humano é muito bom em criar e reconhecer padrões. Nós designers podemos aproveitar essa capacidade para diminuir o atrito do usuário com a experiência.
Em Hearthstone, todas as cartas têm nomes, valores, imagens e descrições nas mesmas posições, facilitando a comparação entre elas (ação fundamental para a jogabilidade).
Aplique os padrões estabelecidos
Quando você vai jogar um novo jogo de tiro no console, já espera que o gatilho esquerdo no topo do controle mire e o direito atire. Esse é o padrão que a indústria criou em anos e anos de FPS.
Ao manter o mesmo esquema de botões em um novo lançamento, é possível encurtar a curva de aprendizado dos jogadores, que conseguem transferir os conhecimentos de uma experiência para outra.
Diminua a carga cognitiva
Utilize o número necessário de elementos na tela
Nesse título, a palavra chave é necessário. O senso comum pode nos fazer pensar que quantos menos elementos, menor a carga cognitiva. Mas isso não é sempre verdade.
Imagine um jogo de tiro que não mostra a contagem de balas na tela. Sem esse recurso, o jogador vai precisar saber a capacidade de cada uma de suas armas e prestar atenção em quantos disparos foram efetuados (tarefa muito complicada quando se está no meio de um tiroteio).
Trabalhe com hierarquia de informações
Existe um número limitado de elementos que cabem na tela (e um menor ainda que o jogador consegue prestar atenção). Por isso, é necessário fazer escolhas do que deve estar sempre na tela, o que deve aparecer conforme o contexto e o que ficará disponível em menus internos.
Em Mortal Kombat X, a interface mostra apenas o nome dos “kombatentes”, barra de vida, barra de especial e um cronômetro. Caso o jogador queira saber os combos, ataques especiais e fatalitys, ele pode pausar o jogo e conferir as combinações de botões para o seu personagem.
Mostre ou esconda elementos conforme o contexto
Os chamados HUDs (heads-up displays) são os ícones, números e textos que aparecem na tela do jogo para auxiliar os players. Dependendo do momento da jornada, as informações mais importantes podem mudar e é interessante que o HUD se adapte a isso.
Um mal exemplo clássico é do jogo Castlevania. Ele mostra o tempo todo uma barra de vida com a legenda enemy (inimigo). Essa barra é referente a vida do “chefão”, que só é enfrentado ao final de cada fase. Não faz sentido algum do ponto de vista do jogador (talvez fosse uma questão técnica na época) e deveria ficar oculto até a aparição do vilão.
Muito bem! Você ganhou pontos de experiência
Espero que as escolhas de interface dos jogos trazidos aqui sirvam para que você consiga criar produtos e serviços digitais cada vez melhores.
Essa foi a segunda parte de uma trilogia. Logo mais, pretendemos subir um artigo analisando como os games lidam com questões de acessibilidade. Aguardem ;)
