como
ux research
ux design
ui design
teste de usabilidade
design gráfico
naming
netnografia aplicada
quando
2019 até atualmente
onde
Especialização UNICAMP &
Mestrado UNICAMP
bithoven
design de interação
para gamers surdos
Os games são uma das principais formas de entretenimento, mas nem sempre oferecem boas experiências para jogadores surdos. Muitas vezes, a paisagem sonora é a única informação que fornece um feedback, causando frustração para quem não ouve.
Este trabalho apresenta o desenvolvimento de uma interface que tem como finalidade tornar o universo dos games mais acessível para pessoas surdas.
research
conhecendo o gamer surdo
Para entender as necessidades do usuário, o projeto se baseou na compreensão da cultura surda e nas dores do usuário, a fim de criar ferramentas que ajudem a reduzir os principais problemas encontrados. A interface criada também se concentra na centralização de conteúdos relevantes para jogadores surdos, para que uma comunidade sólida possa ser criada e crescer.
O mercado dos games, que está em constante crescimento, também é de grande importância para as pessoas surdas, mesmo que grandes dificuldades são encontradas nesse meio, principalmente em jogos online.
A tradutora e intérprete Paloma Bueno foi contratada e realizou um incrível trabalho. Ao total foram gravados 21 vídeos, desses 19 são referentes às perguntas, 1 para a introdução ao questionário e outro que foi utilizado nas redes sociais para convidar para a pesquisa.
A pesquisa foi fundamental para a definições dos objetivos e para o novo rumo que o projeto tomou. Não sendo mais apenas um radar, mas se transformando em uma plataforma.
ux design
definição de fluxo
Para garantir uma boa usabilidade, foi definido um fluxograma com os possíveis passos do usuário, desde a instalação até o uso da plataforma. Essa etapa foi importante para definir as principais telas e garantir uma coerência na navegação, embora durante a construção do layout alguns pontos tenham sido alterados para melhorar o resultado final.
.jpg)
identidade
naming
O nome é de grande importância para um projeto, pois através dele as pessoas podem sentir ou não uma conexão. Alina Wheeler (2012) fala sobre a necessidade de um bom nome:
" O nome certo é atemporal, não cansa, é fácil de lembrar; ele representa alguma coisa e facilita as extensões da marca." (WHEELER, 2012).
O novo nome foi criado a partir de um mapa mental, que levou a testes através da aglutinação de palavras. Para isso, foram criados alguns mapas com palavras que poderiam funcionar juntas. Então, através de uma ramificação de “som”, foi possível chegar a “música”, lembrando um dos nomes mais conhecidos do mundo musical: Ludwig van Beethoven, que, apesar de não ter nascido surdo, perdeu a audição com o passar do tempo.
Com esse nome em mãos, foi possível identificar uma semelhança sonora e, principalmente, escrita com BIT e o começo de Beethoven, surgindo então o nome "Bithoven".
identidade
identidade visual
A identidade visual do Bithoven precisa criar uma relação entre o universo gamer e a cultura surda. É com ela que o jogador surdo irá se identificar e se sentir incluído na comunidade. Para isso, foi necessário planejar um sistema visual que fosse compatível dentro de um ambiente digital, onde ele será mais usado.
Assim, após a primeira concepção, foi feito um levantamento de imagens de apoio para a criação do símbolo. Elas foram: BIT, a letra B no alfabeto de Libras e alguma representação sonora facilmente reconhecida.
As imagens de apoio serviram como base para a criação da malha de construção do símbolo. Essa malha visava criar espaços iguais, para que fosse feita a construção de um elemento visual que remetesse a uma imagem em 8 bits.
A construção da assinatura visual também foi feita a partir da primeira malha, para que os espaçamentos entre o símbolo e o logotipo pudessem ter uma boa relação.
ui design
definindo o sistema
tipografia
Para compor o sistema de identidade, foi escolhida a família tipográfica Pill Gothic, criada pelo designer Christian Robertson e distribuída pela Foundry Betatype.
A família foi utilizada devido à possibilidade de criar títulos e parágrafos utilizando uma fonte com fortes características visuais, sem distrair o leitor por causa dela.
cores
A paleta de cores foi construída levando em consideração uma interface baseada em Dark UI. Esse tipo de interface é bastante utilizado em programas relacionados ao mundo dos games.
elementos e ícones
Os elementos da interface foram desenvolvidos de forma que se adequem aos padrões da Dark UI. Os ícones e botões foram pensados para funcionar em todos os estados das interações.
cursor
Foi criado um cursor personalizado para funcionar quando o programa estiver ativo.
Além do fator estético, que se enquadra melhor na identidade visual do que o cursor padrão, ele foi construído para facilitar a navegação de alguns usuários. A massa densa do cursor é maior do que a dos cursores padrão, para que ícones possam ser inseridos dentro dele.
tradução digital para acessibilidade em libras
A plataforma precisa ser de fácil utilização tanto para os surdos que são oralizados e têm preferência pela língua Portuguesa, como para aqueles que se sentem mais confortáveis com Libras. Desta forma, um tradutor de Libras acompanhará e traduzirá os elementos textuais sempre que o usuário desejar.
Foi escolhido então o Hand Talk para cumprir esta função. O Hugo, carismático tradutor virtual, estaria presente em toda experiência. A viabilidade técnica não foi totalmente aprofundada, mas foi minimamente pensada.
ui design
telas principais
tela inicial
A tela principal do programa exibirá os últimos jogos executados pelo usuário, permitindo que ele acesse a tela interna do jogo ou tenha acesso rápido ao radar.
modo de exibição
Através da funcionalidade de “modo de exibição”, o usuário poderá escolher a melhor forma de listagem que se adapte à sua navegação. Nos exemplos abaixo, é possível encontrar a navegação em lista e uma navegação que já exibe o conteúdo interno da página.
preferências e acessibilidade
O usuário terá acesso a uma janela de preferências na qual poderá adaptar os ajustes ao seu uso. Ele poderá, por exemplo, alterar o tamanho do texto e escolher um padrão de cores diferente do padrão da plataforma, visando assim gerar maior acessibilidade para todos os usuários.
tradutor
O usuário também poderá personalizar a tradução para Libras. Podendo escolher onde o personagem ficará (sendo três opções), desativar a tradução (visando surdos oralizados que preferem fazer a leitura do texto) e fazer a tradução apenas quando existir a interação com o cursor e uma tecla de atalho.
interação entre usuários
Os usuários também poderão interagir na página da comunidade respondendo ao artigo ou a outros comentários. Para facilitar os usuários que querem conversar através da Libras, foi inserido o botão “responder com vídeo”, funcionalidade presente em alguns padrões de redes sociais para surdos.
modificações
As modificações em jogos são bem presentes na comunidade. Mesmo jogos de estúdios famosos pecam em questão de acessibilidades. Às vezes, até por falta de legenda.
A página de MOD’s sempre indicará alguma aplicação em destaque, mostrando já uma opção para baixar o mod, caso o usuário ainda não o tenha instalado, e alguns reviews dos usuários. Abaixo, será possível encontrar um filtro e uma funcionalidade para enviar um MOD.
página interna
A primeira página interna de um jogo exibirá o radar favorito do usuário, assim como a opção de criar um novo, os MOD’s que ele tem instalado daquele jogo e uma avaliação do jogo feita pela própria comunidade, levando em consideração fatores de acessibilidade.
design de interação e
sound design
o radar
Grande parte dos sons criados pelos designers de jogos são voltados para algum feedback ao jogador. Muitos desses sons não são representados graficamente na interface do jogo.
Existem vários itens que compõem a paisagem sonora em um jogo. Huiberts (2010) formulou o modelo IEZA (acrônimo de interface, efeito, zona e afeto). Seu modelo traz ferramentas teóricas para o desenvolvimento de sound design.
Interface: Sons fora da ficção que comunicam alguma atividade do jogo;
Efeito: Sons dentro da ficção que comunicam alguma atividade do jogo;
Zona: Som ambiente, dentro do mundo ficcional
Afeto: Som que caracteriza emocionalmente um ambiente, não estando dentro do mundo ficcional.
padrões de radar
O usuário terá 4 modelos padrões para a representação sonora. Cada um poderá ser editado da melhor forma que se adequar ao jogo escolhido. A opção de “animar radar” irá trabalhar com o aspecto sinestésico do som e explorar outras formas de visualização, utilizando partes do próprio radar para dar a sensação de intensidade, duração e distância.
customização
Ao ativar a perspectiva da grade que ajuda na composição do radar, ela mudará, facilitando a visualização no formato desejado.
radar em ação
Cada radar poderá desempenhar diferentes funcionalidades, dependendo da forma como for personalizado. Abaixo temos o exemplo de um radar horizontal, que funciona melhor em jogos 2D do estilo plataforma.
finalizando
Pessoalmente, este trabalho proporcionou-me conhecer uma cultura que antes era distante para mim, sendo eu mesmo o culpado disso.
Essa situação me levou a refletir sobre quantas vezes fui negligente com determinado grupo de pessoas durante o projeto de alguma interface.
Porém, sendo uma antítese, também me possibilitou conhecer formas pelas quais o design pode solucionar impasses criados por algum meio que não fornece meios acessíveis de serem utilizados. Foi um processo de evolução do projeto, acompanhado por uma evolução pessoal. Por fim, um dos maiores prazeres que tive em todo o projeto foi ler a última resposta de uma gamer surda na entrevista qualitativa:
“agradeço de coração por tentar melhorar a vida do surdo”.
legal o bithoven, né? que tal ver como criei um totem interativo ou uma ferramenta de avaliação 360?