abr
30
2021
por Raphael Calais e Isabela Sanchez
0 comentários

Acessibilidade no Design de Interfaces – Episódio 1: As Formas

Acessibilidade no Design de Interfaces – Episódio 1: As Formas
por Raphael Calais e Isabela Sanchez
0 comentários

A Acessibilidade no Design de interfaces é um assunto bem amplo e, para facilitar o entendimento, resolvemos dividir o assunto por elementos: as formas, as cores e os textos.

Esse é o primeiro episódio, dedicado as formas e elementos que, dependendo de suas proporções, podem causar frustração e mal uso da plataforma por usuários com deficiências visuais ou mecânicas e até mesmo pessoas sem deficiências, mas com aparelhos eletrônicos limitados. 

O conceito das formas

As formas no Design de Interface definem como as informações no site ou aplicativo serão demonstradas, por exemplo: na imagem abaixo conseguimos identificar claramente onde está o botão simplesmente pela sua forma.

Não importa a língua que o site seja escrito, é possível identificar onde devemos clicar e sabemos que, ao fazer isso, seremos direcionados para algum lugar, assim como, conseguimos nos localizar pelos ícones e encontramos facilmente o campo de busca e nem precisamos entender japonês, o idioma do site no exemplo abaixo. 

Home do site rakuten que mostrar que mesmo estando escrita em japonês, sabemos onde clicar e o que fazer pelos ícones e botões. Ótimo exemplo de acessibilidade no design de interfaces.
Home do site rakuten.co.jp em abril de 2021.

Ainda no mesmo exemplo, é possível distinguir as informações que aparecem imediatamente na home do site, pois a forma define os cartões de cada item, não deixando assim as informações dispersas na página.

O mal uso das formas: 

Como podemos ver, um simples retângulo possui uma enorme importância para o entendimento e funcionamento da plataforma, mas muitas vezes, a forma é mal usada, impossibilitando até mesmo uma pessoa sem deficiências visuais ou mecânicas de se conectar ou preencher as informações requeridas.  
 
Ao tentar buscar por um estilo que remete sofisticação e modernismo, os clientes acabam por optar por formas mais simples, esbeltas e delicadas, impossibilitando assim sua visualização e entendimento por parte dos usuários, tornando mais difícil entender as informações, que antes eram intuitivas.

Antiga home do site Evernote onde o botão está escondido pelo plano de fundo.
Antiga home do site Evernote. (evernote.com)

O botão call to action, o chamariz da capa, está escondido pelo plano de fundo, perdendo seu contraste e impossibilitando diversas pessoas de vê-lo ou associar a forma com um botão.  
 
Quando falamos de acessibilidade no design de interfaces, falamos inevitavelmente de um design mais robusto, maior, mais preenchido e claro. Falamos de botões com um bom tamanho e contraste, com sombreado para destacá-lo do plano achatado da tela e que não dependem somente do famoso “hover effect” para aparecerem. 
 
Aqui, precisamos que as formas conversem e sejam visíveis e entendíveis para todos e que não priorizem somente as telas em HD dos novos monitores.  

Algumas soluções para uma melhor acessibilidade no design de interfaces: 

Investir em Acessibilidade no Design de Interfaces e no estudo da dimensionalidade das formas, junto com a sua capacidade de responsividade na maioria das telas dos smartphones e dos desktops, não é uma questão de persona ou de um visual sofisticado e comprimido, é uma questão de empatia.  
 
Se levarmos em conta que ao menos 18,6% de toda a população brasileira possui uma deficiência visual (6,7% da população possui alguma deficiência física – IBGE), estamos falando de uma boa parcela de pessoas que podem estar tentando acessar o site, aplicativo ou sistema e se frustrando constantemente.  
 
Também não podemos ignorar as pessoas que estão acessando a plataforma por um celular menos tecnológico.  
 
Logo, o primeiro passo é aceitar e investir na acessibilidade do Design e o segundo , seguir algumas regras de acessibilidade nas formas como: 
       
⦁ Faça os botões visíveis e capriche no contraste; 
⦁ Deixe o botão bem localizado e tente copiar essa fórmula da sua localização para que o usuário não tenha que procurá-lo sempre. 
⦁ Crie os cards e campos visíveis. Não use cores claras para passar informação (caso o fundo seja branco) ou cores escuras (caso o fundo seja preto); 
⦁ Mantenha as formas bem marcadas e, caso não haja um bom contraste, acrescente contornos nela ou no hover effect da forma.  
⦁ Respeite a lei do “font size = 16px;” 
⦁ Não crie botões menores do que 48px de altura, evite que os campos de clique e interação estejam escondidos. Pense, se você está tentando escondê-los, seria melhor nem os mostrar, certo?  

Por fim, teste seu produto com a maior quantidade de pessoas possível para que cada uma, com sua particularidade, consiga ter acesso total à sua plataforma. 

Compartilhe
abr
8
2021
por Isabela Sanchez e Raphael Calais
0 comentários

O que é Matriz CSD e como utilizá-la em seus projetos.

O que é Matriz CSD e como utilizá-la em seus projetos.
por Isabela Sanchez e Raphael Calais
0 comentários

A Matriz CSD é uma ferramenta que, à primeira vista, pode parecer muito simples ou até mesmo ineficiente, mas esconde o poder de transformar seus projetos e otimizar sua entrega.  

O que é a Matriz CSD? 

Todo início de projeto vem acompanhado de dúvidas, certo? Às vezes o briefing não está tão completo quanto é o esperado ou existam divergências entre o que deve ser priorizado, entre outras questões que atrasam o início do desenvolvimento. 

Com a CSD, você exemplifica essas Certezas, Suposições e Dúvidas de uma forma prática e visual, facilitando assim o pontapé inicial. 

Como utilizar? 

A ferramenta, que pode ser usada em trabalhos individuais ou em grupo, consiste em criar três colunas em um papel, lousa ou parede, com post its de diferentes cores, fazendo anotações de qualquer aspecto do projeto para criar um retrato visual com tudo o que a equipe precisa saber. Ferramentas como o Trello, Mural ou Microsoft Planner também podem ser utilizadas. 

Certezas 

Nesse campo você irá preencher o que você realmente sabe sobre o projeto. Contudo, tome cuidado com verdades absolutas ou pré-conceitos sem fundamento e, caso você seja o facilitador, instigue os participantes a analisarem entre o que sabem e o que acham que sabem. 

Suposições 

É aqui que entram as hipóteses formuladas e o que achamos que sabemos. Se alguma informação ia ser colocada em certezas, mas não houve confirmação, mude para esse campo e considere-a como uma suposição. 

Dúvidas 

O que você gostaria de perguntar ao cliente? Quais dúvidas ficaram sem resposta durante suas reuniões? Até que essas perguntas não tenham respostas, pois é aqui que você vai colocá-las. 

É normal que no início do projeto esse campo tenha mais anotações. Entretanto, com o tempo e as descobertas (como em entrevistas e observações), as dúvidas passam para o campo de Certezas ou são excluídas. 

Quadro branco com post-its colados por setores: certezas, suposições e dúvidas

Exemplo de Matriz CSD:

Vamos supor que o cliente que vamos desenvolver uma solução é uma empresa que está crescendo no mercado dos fast-foods (vamos chamar a empresa de Burgão). O que sabemos, deduzimos ou precisamos saber sobre cliente?

CERTEZAS 

1- O Burgão vende lanches, porções e bebidas a mais de vinte anos. 

2- Existem lojas por todo o Brasil. 

3- Vendem lanches para todos os públicos, contando vegetarianos, intolerantes à laticínios e glúten e outros.   

SUPOSIÇÕES 

1- Foi o marketing que transformou a jornada do cliente. 

2- Cidades que possuem lojas apenas em shoppings estão sofrendo com a pandemia. 

3- Lojas com drive-thru aumentaram suas vendas nos períodos de quarentena. 

4- O público-alvo maior são jovens e jovens adultos. 

DÚVIDAS 

1- Utilizar um app já pré-existente para realizar nossas vendas por delivery? (iFood, Rappi, UberEats, outros…) 

2- Desenvolver um app exclusivo trará mais clientes? 

3- Os sistemas atuais das lojas comportam a quantidade de pedidos que têm recebido? 

Com esses exemplos conseguimos ter uma base de como funciona a Matriz no início. Após discussões entre a equipe e pesquisas, algumas afirmações ou dúvidas podem passar a outra categoria, por exemplo a suposição nº 3, na qual com uma busca na internet chegamos a conclusão que se trata de uma certeza. 

Nesse ponto, é muito importante salientar que a Matriz CSD é mutável! Conforme as pesquisas são feitas, o projeto é desenvolvido e o cliente responde as dúvidas, as afirmações mudam de categoria, são excluídas ou podem ser adicionadas. 

Por que usar Matriz CSD? 

A Matriz CSD é uma forma visual de organizar tudo o que se tem sobre o projeto, todavia é fundamental para dar o pontapé inicial em projetos, ampliando os horizontes da equipe e permitindo uma gestão mais eficiente com a centralização das informações. 

A imersão em cada aspecto analisado proporciona maior segurança ao time e otimiza o desenvolvimento, esclarecendo tudo o que é necessário para que as tarefas evoluam. 

Ainda está com dúvidas? Entre em contato com nossa equipe! Estamos prontos para entregar a melhor solução para você e guiar seus projetos rumo ao sucesso!

Compartilhe
fev
25
2021
por Ariane Prado e Raphael Calais. - Revisão por Isabela Sanchez
0 comentários
Torre de Lean

Como o Design Centrado no Usuário Pode Impactar Seu Negócio

Como o Design Centrado no Usuário Pode Impactar Seu Negócio
por Ariane Prado e Raphael Calais. - Revisão por Isabela Sanchez
0 comentários
Torre de Lean

O design centrado no usuário tem se destacado em empresas de todos os tipos. Cada vez mais as empresas inovadoras acrescentam em seus valores as necessidades do usuário e alavancam suas vendas, enquanto empresas que não incluem a experiência do usuário em seus valores tendem a ter mais dificuldade de prosperar e evoluir.


Quem é o UX Designer?

Segundo Don Norman, fundador do NN Group, o UX (ou experiência do usuário) envolve muito mais que o design do produto e seu desenvolvimento, o termo engloba o modo como qualquer usuário interage com o mundo ao seu redor.

Sendo assim, o design vai além da estética e efetua um papel ativo como ferramenta para a construção de soluções, passando pela identificação dos problemas, dores e necessidades do usuário, a criação de protótipos que serão testados e receberão feedbacks para que no fim aconteça uma reavaliação. Este processo manterá o conteúdo do projeto sempre atualizado e funcional.

Estamos aqui falando de uma das funções do UX Designer (vulgo User Experience Designer). Seu papel é essencial, podendo até mesmo participar das decisões de negócios e ajudar na priorização de demandas.
Infelizmente, muitas empresas têm dificuldades em construir uma visão centrada no usuário que gere impacto e transforme de fato a forma que o produto é enxergado.

Figura Double Diamond mostrando o processo de trabalho no UX
Double Diamond é uma forma do UX organizar seu trabalho antes de criar um protótipo para ser testado.

Objetivo do User Experience ou Design Centrado no Usuário.

A verdadeira experiência do usuário vai além de vender aos clientes o que eles dizem querer.
Para a experiência do usuário ocorrer da melhor forma, é preciso atender as necessidades específicas do consumidor sem que haja confusão ou algum tipo de incômodo. Essa tarefa necessita de serviços de disciplinas como engenharia, marketing, design gráfico e industrial, design de interface, entre outros, unidos para apostar na simplicidade e assertividade no desenvolvimento de produtos, serviços ou de sistemas fáceis de usar.

Pensar com foco no cliente é atentar-se às suas emoções e estar alinhado com os sentimentos que o usuário tem enquanto está em contato com a marca, aproximando o cliente de maneira eficiente e criando uma verdadeira cultura centrada no usuário dentro de sua empresa.

Uma porta sem ux e uma com ux. No caso a sem ux está escrito puxe, mas esta sem o puxador.
Às vezes alguns erros graves passam despercebidos por não terem sido testados.

Vantagens de aplicar User Experience na sua empresa.

Em termos simples, o UX tem o objetivo de encantar pessoas e deixá-las mais felizes na usabilidade de algum produto ou serviço, podendo render vantagens valiosas, como:

Aumento da conversão nas vendas

Se um cliente em potencial tem uma boa experiência antes da decisão de compra, claramente também têm mais chances de converter e comprar de fato.
Em um cenário digital: se o usuário que se sente satisfeito com a experiência de navegação de um site ou até mesmo com os mecanismos de botões antes de efetivar a compra, existem maiores chances de ele converter e tornar-se um cliente. Ou seja, facilitar e deixar essa jornada mais intuitiva é um grande diferencial para ter mais conversõ

Fidelização

A fidelização de um cliente ou usuário passa a se tornar realidade quando ele se sente totalmente à vontade, seja com o sistema de navegação de um site ou com a usabilidade de um produto ou serviço. Uma vez fidelizado, é bem provável que ele não busque opções em outros sites e nem novos produtos com outras marcas.

Economia de recursos

Basicamente, ao analisar a experiência do usuário, é possível fazer um planejamento mais inteligente. Isso reduz as chances de retrabalho, diminuindo também os custos e tempo dos profissionais envolvidos.

Maior valor percebido pelo cliente

O valor percebido pelo cliente trata-se da sensação que vem acompanhada com a aplicação eficaz do UX na experiência de usabilidade dele.
É importante destacar que o valor percebido não tem relação direta com custo, mas sim com o sentimento após a experiência com a sua marca, que pode ser influenciado pela qualidade da informação recebida em um site, quantidade de funcionalidades úteis de um aparelho eletrônico, ou até mesmo pelo custo-benefício de algo comprado.
Na prática: sabe quando você prefere pagar um pouco mais caro por algo porque é fã da marca e fica feliz por se relacionar com ela? Esse é o valor percebido pelo cliente.

O trabalho de UX ajuda a melhorar a imagem da sua marca, afinal uma imagem positiva, uma experiência marcante e um bom produto são palavras chaves no branding de qualquer empresa prolífera.

Recomendações e indicações

Um cliente ou usuário satisfeito (seja com a navegação de um site, processo de compra ou experiência de usabilidade de um produto) vai estar propenso a fazer recomendações da empresa que proporcionou uma melhor experiência.
O cliente fiel, por ter sido feliz em todo o processo de compra – desde pesquisa, avaliação da solução, atendimento, etc. – também pode se tornar um defensor da marca, fazendo indicações e ressaltando benefícios

Aqui falamos de lovemark. Uma relação onde o cliente enxerga a empresa como parceira.


Como aplicar o UX e as práticas do design centrado no usuário em sua empresa?

A prática do User Experience exige tempo, testes e muito esforço. Além do mais, os componentes do UX podem variar de acordo com o seu negócio, entretanto, existem três pontos chaves para direcionar uma estratégia de experiência do usuário com sucesso:

Pesquisa de mercado

As pesquisas ajudam a determinar quem é seu cliente ideal e são sempre bem-vindas. Aplicando isso no UX, é possível categorizar o público de acordo com o comportamento em seu site ou aplicativo, por exemplo.
Descubra quem são os usuários que estão convertendo mais, os que ficam mais tempo e também aqueles com altas taxas de rejeição.

Foco no usuário

Uma boa estratégia de User Experience precisa ser voltada totalmente para aquele que usará seu site ou aplicativo. Então, além de uma interface visualmente agradável, ela também precisa ser útil e intuitiva ao consumidor.
Profissionais de vendas e atendimento que possuem contato direto com o consumidor, por exemplo, podem fornecer dicas valiosas! Ideias para que as estratégias de experiência do usuário atendam suas necessidades e expectativas.

Testes

É válido reforçar que a melhor maneira de colocar em prática o User Experience é fazendo e analisando testes.
Tenha em mente que, testar a usabilidade é uma etapa fundamental antes de implementar seu layout definitivo. Afinal, a estrutura do seu projeto e o tipo de navegação que oferece pode definir se o usuário vai concluir uma tarefa ou não.
Testes frequentes irão ajudar a melhorar a usabilidade do projeto. Logo, você terá mais clientes satisfeitos e prontos para voltar a fazer negócio com você.
Com o passar do tempo, os problemas irão diminuir e sua plataforma ficará mais intuitiva.
Dica: continue fazendo pequenos testes! Sempre existe algo a ser ajustado.
O usuário precisa estar no centro das decisões. Mantenha o foco nas pessoas e nos sistemas e resolva os problemas certos!


Quer saber mais sobre o nosso trabalho na torre de Lean aqui na PerformaIt?

Serviços na Torre de Lean

Te ajudamos a entender melhor Design Centrado no Usuário? Comente com a gente o que achou do texto!

Compartilhe