Posts da Tag: User Experience - Blog da TreinaWeb

Acessibilidade e User Experience (UX)

Como é o dia a dia de um profissional de Usabilidade?

Usabilidade é um conceito importantíssimo no processo de digitalização de qualquer empresa ou negócio. Pensar em uma ótima experiência para o usuário – termo conhecido como User Experience (UX) em inglês – é a principal tarefa dos profissionais de usabilidade dentro de uma organização. Basicamente, ele é o responsável por analisar, medir e melhorar o nível de satisfação do usuário ao utilizar um site ou aplicativo. Quanto mais a solução atender as necessidades, mais satisfeito o usuário final ficará.

Em linhas gerais, um usuário prioriza sites e aplicações que lhe oferece uma experiência agradável, seja pela eficácia, rapidez ou interface. Considerando que estes fatores podem determinar o sucesso ou o fracasso de um sistema, é importante contar com profissionais que se encarreguem de analisar a experiência de navegação, que prevejam o comportamento do usuário, bem como ofereçam um sistema que o satisfaça e atenda aos seus objetivos. Em suma, é isso o que um profissional de usabilidade faz.

Atividades profissionais

O profissional de usabilidade, também conhecido como UX Designer, tende a ser mais procurado no setor da tecnologia, embora existam especialistas que realizam esta atividade elaborando produtos físicos. Na área de tecnologia, sua principal função é atuar como um elo entre desenvolvedor e o usuário final.

Este profissional é responsável por se colocar no lugar dos usuários e avaliar a necessidade de incluir, ajustar ou remover determinada funcionalidade. Caso o recurso seja incluído, ele também deverá visualizar como será o seu comportamento. Outras atividades comumente realizadas pelo UX Designer são:

  • Analisar e levantar requisitos;
  • Avaliar produtos com um olhar especializado;
  • Realizar estudos de campo com usuários atuais ou com potenciais usuários;
  • Convidar os stakeholders para realizar sessões de brainstorming e entrevistas;
  • Garantir que as melhores práticas de usabidade seram cumpridas;
  • Prever potenciais problemas ou dúvidas dos usuários;
  • Colaborar com profissionais de design, negócios, marketing e tecnologia;
  • Elaborar conjunto de protótipos para serem avaliados;
  • Ser a ponte entre o que a empresa quer e o que o usuário precisa;
  • Difinir escopos e prioridades do projeto;
  • Realizar testes de usabilidade constantemente;
  • Verificar qual funcionalidade deve ser otimizada;
  • Realizar pesquisas de satisfação e comentários ao suporte técnico;
  • Acompanhar o processo de implantação.

Atualmente as organizações estão cientes da importância de colocar o cliente no centro de sua estratégia e, por isso, precisam ter profissionais de usabilidade capazes de alinhar os objetivos de negócio com as necessidades de seus clientes.

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

Características do profissional

Pessoas que desejam se tornar um UX Desing precisam ter uma mente calma e aberta para entender o usuário, bem como ter empatia e entender que sempre está projetando algo para os outros. Além disso, este profissional deve ser um especialista em analisar e sintetizar estruturas de informação.

O profissional de usabilidade também costuma ser uma pessoa interessada em descobrir problemas e curiosa para encontrar uma maneira de como resolvê-los. Ter um perfil analítico e boas habilidades de comunicação também são características essenciais.

Outras características desta profissão são:

  • Atenção aos detalhes, para antecipar possíveis erros e analisar qual será a solução para eles;
  • Alta capacidade de comunicação, já que a maioria dos textos que acompanham os produtos tecnológicos geralmente são escritos em uma linguagem muito técnica e confusa;
  • Esta capacidade de comunicação também será um recurso importante na hora de descrever tanto os problemas identificados, quanto as soluções encontradas;
  • Ter noções de design, para fazer com que as ideias propostas sejam corretamente interpretadas pelo resto da equipe de trabalho;
  • Inquietação e muita curiosidade em saber como funcionam as coisas.

Considerações Finais

O UX Desing é um profissional que verifica se determinado produto deixará uma boa sensação nas pessoas, em relação à ergonomia, facilidade de uso, eficiência, entre outros aspectos. Portanto, esta é uma profissão multidisciplinar, de grande relevância para as organizações e de alto nível estratégico. Basicamente, ele atua utilizando habilidades de três áreas: Psicologia (para entender as pessoas), Design (para definir a interface, os elementos do produto e o seu impacto nas pessoas) e Tecnologia (para estruturar a parte técnica).


Acessibilidade e User Experience (UX)

UX Research e 360 View – O que é e como pode ser aplicado?

User Experience (UX), ou Experiência do Usuário, em português, é um conjunto de práticas e técnicas que visam gerar ao usuário uma percepção positiva em relação ao sistema, produto ou serviço. Os designers de UX analisam o comportamento humano e o serviço oferecido, com o objetivo de projetar melhores experiências e aumentar a satisfação dos clientes. Neste artigo, vamos falar sobre UX Research e 360 View, técnicas importantíssimas para elaborar uma melhor experiência do usuário.

O termo User Experience foi utilizado pela primeira vez por Donald A. Norman, professor da Universidade da Califórnia e da Universidade Northwestern, na década de 1990. De acordo com Norman, “o design centrado no cliente não é um conjunto preciso de métodos. É uma filosofia que pressupõe que a inovação começa entendendo as pessoas, vendo como elas vivem e lidam com os problemas”.

Assim sendo, a Experiência do Usuário não está relacionada somente à aspectos do design, mas também lida com questões afetivas e subjetivas, pois, são nestas experiências, que ocorrem a percepção individual do produto. Segundo Don Norman, “tudo é relacionado à sua experiência com o produto. Talvez você nem precise estar perto dele, você pode estar falando sobre ele para alguém”.

360 View

Para estruturar um projeto ou colocar uma ideia em prática, uma técnica de planejamento bastante útil é o 360 View, um modelo de gestão visual para controle de tarefas e fluxos de trabalho. Esta técnica, apresentada por Nelson Vasconcelos, divide um projeto entre as áreas de experiência do usuário, negócios e tecnologia, propondo alguns questionamentos ao seu respeito. São eles:

  • User Experience: O que as pessoas precisam? O que é útil e agradável?
  • Negócios: Quais são os objetivos de negócios? O que é lucrativo?
  • Tecnologia: O que é possível desenvolver? Quais funcionalidades podem ser construídas agora ou mais pra frente?

Estas perguntas servem para guiar os responsáveis pelo projeto e auxiliar na tomada de decisão. Com isso, os profissionais envolvidos conseguem analisar qual área do projeto está mais estruturada, qual merece mais atenção, quais funcionalidades do sistema devem ser priorizadas, se os recursos disponíveis atendem os requisitos estabelecidos, entre outros aspectos importantes. Com isso, o 360 View também se torna uma ferramenta importantíssima no momento de definir um MVP (Produto Mínimo Viável, em português).

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

O MVP é uma versão mais simples de um produto ou sistema. É utilizado para testar rapidamente, de maneira quantitativa ou qualitativa, a resposta de mercado sobre uma funcionalidade específica. Um MVP tem apenas as funcionalidades necessárias para mostrar o produto ao cliente e seu principal objetivo é evitar o desenvolvimento de recursos indesejáveis. Trata-se de um processo iterativo de geração de ideias, prototipagem, apresentação, coleta de dados, análise e aprendizagem.

UX Research

Pesquisa em UX, ou UX Research, em inglês, trata-se de uma pesquisa com o propósito de coletar informações sobre o potencial público-alvo do sistema, produto ou serviço. É de suma importância identificar o perfil do usuário, bem como quais são seus gostos, desejos e necessidades. O usuário e suas necessidades mudam constantemente, por isso os produtos devem mudar com eles. Gerenciar essas informações é essencial para que os gestores e desenvolvedores trabalhem para elaborar um sistema que o cliente deseja.

A UX Research busca entender a lógica de interação do usuário com o sistema, identificar suas preferências, analisar a concorrência, compreender o mercado, conhecer as expectativas dos potenciais futuros usuários, entre outros pontos. Assim sendo, o profissional de UX Research deve se colocar no lugar do cliente para entendê-lo e perceber as dificuldades que ele pode encontrar ao utilizar o seu sistema.

Com isso, a Pesquisa em UX ocorre basicamente em três momentos:

  1. Antes de iniciar o projeto: Obter essas informações permite saber a viabilidade de uma tela ou funcionalidade, analisar o nicho de mercado em que o sistema se posicionará, verificar a experiência do usuário, analisar a concorrência direta, detectar possíveis problemas e ameaças, etc.
  2. Durante o processo de desenvolvimento: Ao projetar uma página web, mesmo tendo claro que ela deve ser funcional, atraente, fácil de usar e adaptável a diferentes usos, devemos lembrar que o cliente final pode não gostar do resultado do projeto. O cliente deve sempre orientar os passos para aprimorar a experiência do usuário quando o projeto está em andamento.
  3. Quando o sistema está em produção: Os usuários de um site ou aplicativo são aqueles que validam ou não o que foi desenvolvido. A Pesquisa em UX nunca deve ser encerrada, pois esses tipos de projetos permanecem com constante evolução.

Principais métodos de UX Research

Antes de escolher um método de Pesquisa em UX, é importante considerar o que você deseja alcançar com o seu sistema. Abaixo comentaremos brevemente sobre as principais técnicas:

Entrevista em profundidade

É o método mais difundido e um dos mais eficazes para coletar informações sobre os usuários. Pode auxiliar a equipe a tomar decisões, até mesmo para se basear no modelo de negócios. Algumas boas práticas nas entrevistas contemplam o uso de questões abertas, permitindo que o usuário fale o máximo possível.

Questionários online

Pesquisa online é a maneira mais rápida de obter dados quantitativos sobre o sistema, produto ou serviço. Esse tipo de método pode confirmar, por exemplo, como os usuários reagiram a implementação de determinada funcionalidade.

Persona

O pesquisador coleta dados de seu público-alvo, bem como suas preferências, hábitos psicológicos e comportamentais, entre outros aspectos, e cria um grupo de usuários imaginários com essas características.

Focus Group

O pesquisador e um grupo de usuários realizam uma discussão moderada sobre o produto, suas características, benefícios e desvantagens. Esse método pode variar entre conversas informais, questionários e dinâmicas em grupo.

Mapas de calor

Com o uso de ferramentas especializadas, o pesquisador consegue analisar quais áreas do site ou aplicativo os usuários interagem mais ativamente e, com isso, poderá utilizar essas áreas de maneira mais eficiente e informativa.

Estudos de campo

O pesquisador vai, literalmente, até onde o usuário está. Esse método permite entender sobre como as pessoas se comportam no momento em que utilizam o sistema e quais ambientes elas estão inseridas.

Desenho colaborativo

O usuário tem a oportunidade de contribuir com sua visão do produto, desenhando alguns rascunhos, durante uma sessão em grupo.

Teste A/B

Uma parte dos usuários utilizam uma primeira versão do sistema por algum tempo e, logo em seguida, outra parte usa uma segunda versão. O pesquisador coleta as informações, junto com as métricas necessárias, e elabora uma conclusão sobre a eficiência das versões.

Relatórios diários

O usuário interage com o sistema durante um período determinado e elabora pequenos relatórios diariamente, dando recomendações sobre ele. Esse método ajuda a comprovar a usabilidade do sistema na perspectiva do uso de longo prazo.

Considerações finais

Experiência do Usuário são todos os aspectos relacionados às interações das pessoas com um determinado sistema, produto ou serviço. Diante disso, se faz cada vez mais necessário compreender as necessidades, expectativas, desejos e objetivos dos potenciais usuários. A Pesquisa em UX ajuda a moldar o produto e a definir diretrizes para fornecer uma boa experiência para seus usuários. Ao não dedicar tempo em pesquisas e tomar decisões baseadas somente em suposições, você corre o risco de não atender às necessidades dos usuários de maneira eficaz e eficiente.


Engenharia de Software

Como funciona a prototipação no desenvolvimento de software?

A prototipação é um processo importante no desenvolvimento de software, pois, além de servir como um primeiro rascunho de um produto ou serviço, tem como objetivo amadurecer ideias e engajar pessoas no processo de criação. Esta etapa impacta diretamente na produtividade de toda a equipe e gera valor ao cliente. É nesta fase que as ideias são colocadas em prática para facilitar o entendimento de uma aplicação ou sistema.

Com a prototipação, os envolvidos em um projeto verificam as funcionalidades de um software de maneira simplificada e conferem se todos os recursos estão atendendo os requisitos estabelecidos. Aplicando esta técnica, a equipe de desenvolvimento, os profissionais de UX Design, os clientes e outros interessados no projeto, podem analisar como todas as funcionalidades estão distribuídas, bem como se a organização do layout está correta, se o sistema oferece uma boa experiência para o usuário, entre outros aspectos importantes.

Além do baixo custo, a prototipação no desenvolvimento de software tem como característica reduzir os riscos e permitir que todas as validações sejam feitas antes da implementação. De acordo com Jakob Nielsen, cientista da computação e cofundador da Nielsen Norman Group, “estima-se que seja 100 vezes mais barato fazer mudanças antes de escrever qualquer código, do que aplicá-las após a implementação”.

Tipos de Protótipos

Há diversos modelos de prototipação rápida e níveis de fidelidade. Um protótipo pode ser desde um desenho na folha de papel, até algo elaborado em software especializado, e mais parecido com a solução final. Basicamente, a prototipação pode ser feita de três maneiras:

Protótipo de Baixa Fidelidade

Este tipo de protótipo também é conhecido como rascunho, wireframe e sketche. Geralmente são desenhos feitos à mão, em folha de papel ou com ajuda de post-it, representando como serão as características da interface e o seu funcionamento. Como o material utilizado para elaborar este protótipo é simples, consequentemente, o custo dessa solução é baixo. Por meio desta técnica, é possível obter diversas informações, sobretudo em relação aos requisitos da interface.

Protótipo de Média Fidelidade

Este tipo de protótipo já demanda um pouco mais de tempo para ser elaborado e está mais próximo do que foi idealizado para o projeto. Geralmente são feitos com o auxílio de softwares e permitem que o usuário simule o comportamento do sistema. Com isso, é possível validar as interações e melhorar a user experience. Apesar de ser uma solução mais elaborada, o custo desse tipo de protótipo continua relativamente baixo.

Protótipo de Alta Fidelidade

Este tipo de protótipo oferece uma fidelidade mais próxima possível do resultado final do software. Geralmente são desenvolvidos em linguagem de programação – permitindo mostrar algumas das funcionalidades do sistema – e oferece um alto grau de interatividade. Neste tipo de prototipagem, pode ocorrer a implementação de algumas partes do sistema. Vale destacar também que há um custo maior em sua elaboração, já que demanda mais tempo e conhecimento técnico.

Prototipação Rápida
Curso de Prototipação Rápida
CONHEÇA O CURSO

Qual é o melhor tipo de protótipo para o meu projeto?

Antes de escolher um tipo de protótipo para o seu projeto, há diversos pontos que devem ser considerados. Primeiramente, é importante identificar o perfil da equipe de desenvolvimento e da infraestrutura da empresa. A partir desta análise, é possível avaliar qual a melhor técnica e/ou ferramenta para que os profissionais responsáveis possam criar o protótipo.

Outra questão importante é avaliar o tipo de interface que será prototipada. Com isso, haverá como parametrizar qual modelo trará um melhor custo-benefício para o projeto. Por exemplo, em uma interface mais simples, não haveria problema de utilizar um protótipo de baixa fidelidade, porém, se o cliente for participar do processo de criação, talvez seja melhor considerar um protótipo com uma visualização mais interativa.

A etapa de prototipação facilita o processo de validação e ajuda na identificação de problemas no software. Ao identificar e escolher o melhor tipo de protótipo, de acordo com sua necessidade, fica bem mais fácil de avaliar o projeto, as funcionalidades do sistema, os requisitos de negócios, bem como ter um suporte na tomada de decisão. Com isso, as chances de a solução final atender as expectativas do cliente são muito maiores.

Se quiser saber mais sobre a prototipação no desenvolvimento de software e a sua importância, consulte o curso de Prototipação Rápida da TreinaWeb.


Acessibilidade e User Experience (UX)

Técnicas de acessibilidade para deixar o seu site mais inclusivo

Usar as técnicas de acessibilidade é um dos elementos mais importantes no desenvolvimento moderno de sites e aplicativos, pois visa adaptar as páginas para que o maior número de usuários possa ter acesso ao conteúdo publicado na web, caso não conheça o conceito de design inclusivo, já falamos aqui no blog sobre design inclusivo ou também conhecido como design universal. Com isso, todos os tipos de pessoas terão uma melhor experiência se a acessibilidade for levada em consideração.

É fundamental pensar em acessibilidade web no início do projeto, já que implementá-la adequadamente na etapa final, além de ser mais difícil, pode ter um custo um pouco mais elevado. Por isso, todo profissional de tecnologia deveria entender qual é a importância de abordar esse tema, bem como ter um entendimento, no mínimo intermediário, de como ele é tratado, elaborado e aplicado.

Acessibilidade - Introdução
Curso de Acessibilidade - Introdução
CONHEÇA O CURSO

Cartilha de acessibilidade web

De acordo com o World Wide Web Consortium – W3C, um consórcio internacional no qual organizações filiadas trabalham juntas para desenvolver padrões para a web, as técnicas de acessibilidade na internet permite que cada pessoa possa “perceber, entender, navegar, interagir e contribuir para a web”.

Nesse contexto, a acessibilidade de sites e aplicativos envolvem todas as condições necessárias para melhorar o acesso à internet, de pessoas com deficiências visuais, auditivas, físicas, de fala, cognitivas, neurológicas, entre outras.

Segundo a cartilha de acessibilidade do W3C Brasil, acessibilidade na web significa que pessoas com deficiência devem ser incluídas no ambiente digital. Ela também beneficia outros indivíduos que, ainda que não apresentem algum distúrbio, podem ter sua experiência de navegação prejudicada, como idosos.

Tim Berners-Lee, criador da World Wide Web, afirma que “o poder da web está na sua universalidade. O acesso por todas as pessoas, não obstante a sua deficiência, é um aspecto essencial”. Para o W3C, “é essencial que a web seja acessível, de modo a prover igualdade de acesso e de oportunidades para pessoas com diferentes capacidades”.

Nesse cenário, para possibilitar a igualdade de oportunidades para que diferentes tipos de pessoas, independentemente de suas situações, possam ter autonomia para utilizar a web, é necessário considerar a implementação de algumas ferramentas de acessibilidade em sites ou aplicativos. Nos últimos anos, a internet fez grandes avanços para tornar as páginas mais acessíveis, no entanto, é responsabilidade dos designers e desenvolvedores melhorar seus próprios websites. Abaixo vamos comentar sobre alguns recursos fáceis de serem implementados:

HTML Semântico

É impressionante como a quantidade de sites e páginas na web crescem cada dia mais. Por isso, juntamente com o crescimento da internet, também aumenta os padrões, técnicas e práticas de desenvolvimento web.

Diante disso, o HTML com uma boa semântica visa descrever o significado do conteúdo presente em documentos HTML, deixando tudo mais claro, tanto para desenvolvedores, quanto para browsers. O elemento button tem diversos estilos já aplicados nele mesmo e é embutido com padrões de acessibilidade pelo teclado, botões estes que podem ser navegados por meio da tecla Tab, e ativados utilizando a tecla Enter.

Além da acessibilidade na internet, alguns dos benefícios de utilizar o HTML semântico são:

  • Torna o código mais fácil de ser lido, entendido e desenvolvido;
  • Torna a página mais fácil de ser encontrada pelos mecanismos de busca.

Leitor de Tela

Leitores de tela são programas utilizados para capturar qualquer informação apresentada em texto, com o objetivo de obter uma resposta do computador por meio de um sintetizador de voz. Em suma, o sistema passa por textos, fazendo a leitura de tudo o que ele consegue identificar, e permitindo que o usuário escute o conteúdo publicado na internet.

Esta ferramenta possibilita a navegação por menus, janelas e textos presentes em praticamente qualquer site ou aplicativo. A navegação é feita por meio de um teclado comum, então nenhuma adaptação ou equipamento especial é preciso para que este tipo de programa funcione. No entanto, é importante destacar que esse recurso não vai no site e, usar elementos como HTML semântico e atributo alt nas imagens, auxilia em seu funcionamento correto.

A navegação por meio de leitores de tela, que permite que o usuário consiga acompanhar a estrutura da página, funciona basicamente de três formas:

  • Lendo toda a página ao navegar com as setas;
  • Lendo os links ao navegar com a tecla Tab;
  • Lendo os cabeçalhos ao navegar com a tecla H.

Esta ferramenta é usada principalmente por pessoas portadoras de alguma deficiência visual, seja ela permanente ou momentânea. Segundo levantamento feito pelo Instituto Brasileiro de Geografia e Estatística – IBGE em 2010, apenas no Brasil, existem mais de 6,5 milhões de pessoas com deficiência visual, sendo 582 mil cegas e 6 milhões com baixa visão. Considerando estes dados, uma boa parte da população brasileira pode vir a usar este tipo de recurso.

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

Leitor de Libras

Leitor de Libras é responsável por traduzir automaticamente conteúdos digitais, seja em texto, áudio, ou vídeo, para a Língua Brasileira de Sinais – Libras. Com isso, o programa permite que pessoas portadoras de alguma deficiência auditiva possam acessar os conteúdos da internet, em sua língua de comunicação, reduzindo as dificuldades e quebrando as barreiras de acesso à informação.

Uma ótima ferramenta gratuita é o Suite VLibras, um software brasileiro, fruto de uma parceria entre o Ministério do Planejamento, Orçamento e Gestão (MP), por meio da Secretaria de Tecnologia da Informação (STI) e a Universidade Federal da Paraíba (UFPB). O recurso consiste em um conjunto de ferramentas computacionais de código aberto, responsável por traduzir os mais variados conteúdos digitais.

Abaixo é possível ver o leitor de libras funcionando no site do Governo federal:

Leitor de libras para acessibilidade funcionando no site do governo federal

O leitor de Libras é usando principalmente por pessoas portadoras de deficiência auditiva. Este grupo social encontra bastante dificuldade para ler, escrever e se comunicar de maneira oral na língua do seu país nativo. De acordo com o Censo de 2010, cerca de 10 milhões de brasileiros possuem algum tipo de deficiência auditiva. Outro dado importante de destacar é que 80% dos surdos não compreendem o português corretamente e precisam da Libras para receber informações.

Alto Contraste

O Alto Contraste é uma ferramenta que deixa o fundo da página totalmente escuro e as letras mais claras, podendo também ser relacionado à troca do tamanho das fontes. Este recurso, utilizado principalmente por pessoas que possuem médio ou alto déficit de visão, bem como usuários que apresentam algum grau de daltonismo, permite aumentar o contraste das cores do texto e das imagens na tela, facilitando sua identificação.

Podemos ver o recurso de alto contraste disponível na página do Governo:

Página do governo sobre acessibilidade para web

Ao clicar no botão de alto contraste no canto superior direito, é possível ver o resultado:

Página do governo sobre acessibilidade para web utilizando alto contraste

Vale lembrar que a utilização de cores é um dos principais problemas de acessibilidade, pois nem todos os usuários as visualizam da mesma maneira, já que diversas pesquisas revelam que cerca de 8,5% da população masculina mundial apresentam deficiência na percepção de cores.

Sabemos que a cor é um recurso importante que costumamos utilizar para se comunicar na web. Entretanto, é um erro transmitir as informações somente por meio deste elemento visual. A cor deve sempre complementar uma mensagem, mas não pode ser o único mecanismo para passar o conteúdo. Para alcançar todas as pessoas, é recomendável que os designer e desenvolvedores adicionem ícones ou textos, mostrando claramente ao usuário a informação que ele deseja.

Swift - Criação de aplicações móveis para IOS Básico
Curso de Swift - Criação de aplicações móveis para IOS Básico
CONHEÇA O CURSO

Ferramenta de Lupa e Zoom

A ferramenta de Lupa tem o objetivo de ampliar palavras e imagens. O recurso, que também é um software à parte, permite que o usuário com baixa visão aumente o tamanho da fonte e/ou das imagens na tela do dispositivo, podendo aplicá-lo em toda tela ou em parte dela. Em alguns programas é possível personalizar a disposição da ferramenta nos modos: tela inteira, lente e ancorado.

Somado ao uso da Lupa, é recomendável que designers e programadores não desative a funcionalidade de zoom nas páginas da web, para aquelas pessoas que utilizam dispositivos móveis. O bloqueio do zoom, que está dentro do próprio site, prejudica pessoas que sofrem com déficit de visão, sendo que é sim possível desenvolver uma boa aplicação com zoom de até 200%.

Muitos sites disponibilizam a ferramenta de zoom para seu conteúdo, veja como exemplo, o site do Governo do estado de São Paulo:

Recurso de zoom no site do governo do estado re são paulo

De modo geral, vale lembrar que pessoas com baixa visão, mesmo que tenham acesso ampliado em seus dispositivos, estão mais propensas à fadiga, por conta da forte exposição a que ficam submetidas aos raios emitidos pelas telas. Por isso a importância de se pensar em um conjunto de recursos de acessibilidade, e não apenas na utilização de uma única ferramenta de maneira isolada.


Acessibilidade e User Experience (UX)

UX e UI: O que é e quais as diferenças?

Quando estamos desenvolvendo algum software ou um site por exemplo, devemos colocar o cliente no centro das atenções. As pessoas querem praticidade quanto utilizam um sistema/produto, por isso devemos pensar muito na experiência do usuário, para que ela seja a melhor possível. Para isso, devemos nos colocar no lugar do usuário e verificar pontos que devem ser levados em conta na hora de criar a interface (meio pelo qual o usuário interage pelo sistema). Sendo assim, vamos abordar neste artigo dois pontos muito importantes: UX e UI. Esses termos ainda são bastante confundidos por iniciantes por serem semelhantes, mas eles são duas coisas distintas. Apesar de estarem unidas e trabalharem juntas, elas têm suas diferenças.

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

User eXperience (UX)

UX (User eXperience) ou experiência do usuário, visa proporcionar ao usuário sempre a melhor experiência. Tem a finalidade de melhorar todos os aspectos da interação humana, não visando apenas em sistemas, mas também em produtos e serviços. UX está relacionado ao uso do serviço, a interação do usuário.

Pessoa apertando uma tecla do teclado

Existem diversas vantagens de aplicar as regras de UX, além de deixar a experiência do usuário tornando-a mais amigável, você gera satisfação, fazendo com que essas experiências encantem os clientes, o que acaba os fidelizando. Isso também resulta em uma maior conversão de vendas, indicações de forma orgânica e ainda aumenta o valor agregado do produto.

Vale ressaltar novamente que UX não é aplicado apenas para softwares e apps e sim para qualquer coisa, como produtos e serviços.

User Interface (UI)

UI (User Interface) ou interface do usuário, é o ponto de ligação entre o usuário e o sistema/produto/serviço. Através dele fazemos a projeção e criação de interfaces, juntamente com o design. Toda essa interação é feita através de uma interface. Nós pensamos como uma interface uma tela do computador, mas ela não precisa ser necessariamente uma tela: pode ser um microondas, um controle remoto, etc. Em geral, é o que faz a ponte entre uma pessoa e o objetivo que ela tem.

Uma pessoa manuseando um tablet

Uma boa interface é simples e fácil de utilizar. O usuário deve conseguir realizar o que ele deseja de um modo simples, e claro, com uma boa experiência. Um dos pontos para se chegar a essa boa experiência, é justamente o UX. Por isso, dizemos que UX e UI dependem uma da outra e trabalham juntas. Não tem como criar uma interface sem pensar na experiência do usuário, até mesmo porque você irá lidar com pessoas, não robôs.

Para facilitar, podemos pensar que o UI está mais ligado a parte física e prática (interface), guiando o que o usuário deve fazer enquanto usa o site. Já o UX lida mais com as emoções, como o usuário se sentirá ao usar a interface, tendo uma navegação agradável.

A pessoa que trabalha com UX e UI faz a prototipação da interface utilizando softwares, realiza pesquisas e pensa em vários aspectos no que diz respeito a experiência da interface, além de identificar e criar personas. Temos um post específico de personas em UX aqui no blog.

Uma empresa que pensa no UX e UI está pensando em seus clientes/usuários e isso é muito importante e deve ser levado em conta. Imagine que o usuário visite sua loja virtual e ao visualizar um produto não consiga achar as informações que gostaria, ou que ao clicar em comprar ele não conseguiu ver se o produto foi realmente para o carrinho? Isso é sinal de um UI mal feito, onde muitas vezes faz com que o usuário desista de comprar no seu site e vá para um concorrente. Por isso que muitas vezes a UX e UI são confundidas, porque elas têm uma ligação muito direta: se a navegação é ruim, a experiência também acaba sendo.

Confira nossos artigos sobre user experience.

Desenvolvedor Front-end
Formação: Desenvolvedor Front-end
HTML, CSS e JavaScript são a base de toda a web. Tudo o que você está vendo aqui agora depende deste tripé. Nesta formação vamos iniciar aprendendo lógica. Em seguida veremos todos os aspectos do HTML, CSS e JavaScript. Por fim, aprenderemos Sass, Google Analytics, empacotar nossas aplicações com Webpack, criação de aplicações Desktop com Electron, UX/UI e uma introdução aos frameworks mais utilizados no mercado: Angular, React, Vue e Ember.
CONHEÇA A FORMAÇÃO

Acessibilidade e User Experience (UX)

Avaliação Heurística: O que é e como conduzir

A Avaliação Heurística (originalmente proposta por Nielsen e Molich em 1990) é uma técnica de inspeção que ajuda a identificar problemas de usabilidade em uma interface. Em outras palavras, uma avaliação heurística pode ser definida como uma revisão da sua interface, levando em consideração os aspectos da experiência do usuário.

Nessa inspeção, especialistas em usabilidade examinam e julgam se cada elemento da interface está de acordo com os princípios de usabilidade (heurísticas).

Django - Módulo administrativo Django Admin
Curso de Django - Módulo administrativo Django Admin
CONHEÇA O CURSO

Vantagens e desvantagens da Avaliação Heurística

Uma avaliação heurística não deve substituir o teste de usabilidade. Embora as heurísticas referem-se a critérios que afetam a usabilidade do seu site, os problemas identificados em uma avaliação heurística são diferentes daqueles encontrados em um teste de usabilidade.

Vantagens
  • Fornece um feedback rápido e é relativamente barato.
  • Pode ser feita em diversas fases do projeto.
  • Pode ser utilizado em conjunto com outras metodologias de testes de usabilidade.
Desvantagens
  • Requer conhecimento e experiência para aplicar a heurística de uma forma eficaz
  • É recomendável utilizar vários especialistas (o número recomendado é de 3 a 5 profissionais) para conduzir a avaliação heurística
  • Problemas de usabilidade mais graves podem passar despercebidos.

Como conduzir?

A realização de uma avaliação heurística pode ser dividida em três fases: planejamento, execução e revisão.

1. Planejamento

Você deve ter um objetivo claro do que você espera com sua avaliação e definir esses objetivos antes de iniciá-la. Nesta fase é importante entender exatamente o que precisa ser avaliado. Também é essencial que você saiba quem são seus usuários, suas necessidades, motivações e comportamentos, e conduzir a avaliação heurística na perspectiva desses usuários.

2. Execução

Defina uma lista de heurísticas para utilizar na avaliação. Existem vários modelos que podem ser seguidos, entre eles, o mais conhecido são as 10 heurísticas de Nielsen e Molich.

Após definir as heurísticas, cada especialista analisa individualmente a interface, indicando em cada problema encontrado a heurística violada, o local do erro e a gravidade do problema. Jeff Sauro elaborou um excelente artigo explicando as classificações de gravidade que podem ser utilizados para priorizar os problemas de usabilidade.

3. Revisão

Nesta fase, cada especialista gera um relatório apresentável da sua avaliação e compartilha com o restante do time. Você pode utilizar screenshots ou gravações de vídeos para que o time analise os problemas levantados sem a necessidade de acessar a aplicação que está sendo avaliada.

Conclusão

Avaliação heurística é uma ótima maneira de identificar problemas de usabilidade em seu produto gastando menos tempo e dinheiro do que realizando testes de usabilidade. Quando bem conduzida e com objetivos claros, os resultados valem a pena.

Uma dica é utilizar o UX Check, uma extensão para o Chrome que facilita identificar os problemas de usabilidade em uma interface de uma forma rápida e fácil. Com ela você seleciona no próprio navegador os elementos que não seguem as heurísticas, cria anotações de cada problema e automaticamente um screenshot é gerado. No final, você pode exportar tudo para um .docx para que você possa compartilhá-lo com sua equipe.

Referências

10 Usability Heuristics for User Interface Design – Nielsen Norman Group
How to Conduct a Heuristic Evaluation – Interaction Design Foundation


Acessibilidade e User Experience (UX)

Hierarquia visual em aplicações web

Ao desenhar uma interface, é importante priorizar os elementos principais e estabelecer uma hierarquia visual sempre buscando responder as questões iniciais que um usuário possui ao acessar a sua aplicação. Não o faça pensar, tente deixar claro: onde está, o que pode fazer e onde pode ir. Caso contrário, há uma grande possibilidade que esse usuário abandone e deixe de usá-la, aumentando o que chamamos de “taxa de rejeição”.

Django - Módulo administrativo Django Admin
Curso de Django - Módulo administrativo Django Admin
CONHEÇA O CURSO

Por que ela é importante?

Em seu artigo Communicating with Visual Hierarchy, Luke Wroblewski, diretor de produtos da Google, explica que a apresentação visual de uma interface é essencial para:

  • Informar aos usuários – A interface deve guiar o usuário de uma ação para outra e estabelecer relacionamento entre elas.

  • Deixar claro a organização – Manter a consistência dos elementos da sua aplicação

  • Comunicar efetivamente a sua marca para sua audiência – Criando um impacto emocional positivo e fornecendo ao seu usuário uma experiência agradável.

Fatores que influenciam na hierarquia visual

A maneira que processamos as informações é afetada por alguns fatores que contribuem para que priorizemos determinados elementos. Alguns desses fatores incluem:

  • Tamanho – Uma regra simples e direta: quanto maior o elemento, maior a chance de atrair a atenção do usuário.

  • Cor – As cores brilhantes são mais propensas a chamar a atenção do que tons monótonos. Por exemplo, todos nós já utilizamos um marca-texto para destacar pontos importantes de um texto. O amarelo é mais rico e brilhante do que o branco, então ele se destaca. Depois das cores brilhantes, vem as cores escuras, e na parte inferior da hierarquia das cores, os tons de cinza.

  • Contraste – Tão importante quanto as cores, o contraste ajuda a destacar os elementos mais importantes da sua aplicação.

  • Repetição – Repetir estilos pode dar a impressão para o usuário que o conteúdo é relativo. Por exemplo, destacando esta palavra , a forma que o cérebro processa e interpreta a palavra será diferente comparada com o restante do conteúdo.

  • Proximidade – Elementos similares devem estar próximos um do outro. Com referência aos princípios da Gestalt, nosso cérebro tende a agrupar mais fácil as formas que estão próximas entre si.

  • Espaço em branco – Conhecido também como espaço negativo, o uso do espaço em branco ajuda a agrupar diferentes seções de uma aplicação e facilitar a legibilidade do conteúdo.

Alguns padrões utilizados

Existem dois formatos que podemos utilizar quando desenhamos e estruturamos os elementos de uma aplicação web. Os formatos abaixo são baseados nos movimentos dos nossos olhos e podem ser aplicados dentro do contexto da cultura ocidental (leitura da esquerda para direita)

Formato “F”

Com o formato “F”, o usuário começa buscando informações ou palavras-chaves pelo topo, quando é encontrado algo de interesse, começa-se a leitura normalmente, formando uma linha horizontal. O resultado final é algo parecido com a letra “F” ou “E” como visto na imagem acima.

Formato “Z”

É possível ver esse formato aplicado na maioria das aplicações web. O formato “Z” é bastante utilizado para interfaces onde a simplicidade é a prioridade e o call to action a principal tarefa da tela. Para aplicações com conteúdo complexo, pode não funcionar tão bem quanto o formato “F”, por outro lado pode ajudar a aumentar a taxa de conversão da sua Landing Page.

Conclusão

É importante entender como a sua audiência faz a leitura das informações antes de adotar um padrão de hierarquia. Considere também uma mistura dos itens mencionados no post para chegar a uma solução ideal para o seu negócio. Uma boa hierarquia visual irá diminuir o processo cognitivo dos usuários e destacar os pontos mais importantes para que concluam suas tarefas de uma forma mais eficaz.

Referências

Visual Hierarchy – Interaction Design Foundation

Communicating with Visual Hierarchy – Luke Wroblewski


Personas são personagens fictícios criados para representar os diferentes tipos de usuários que podem usar um site, marca ou produto.

Diferente de Personas de Marketing que são mais focadas em informações demográficas, canais de distribuição e comportamento de compra, User personas ou Personas de Design são focadas em identificar padrões de comportamento e entender por que, como e em qual contexto seus usuários estão interagindo com o seu produto/serviço. O objetivo dela é facilitar na identificação dos usuários e compartilhar essas informações com todos os envolvidos no projeto, e também auxiliar em tomada de decisões quando for implementar uma funcionalidade específica ao seu projeto.

Django - Módulo administrativo Django Admin
Curso de Django - Módulo administrativo Django Admin
CONHEÇA O CURSO

Existem 2 tipos de personas que são úteis quando tratamos de UX:

  • Proto-Persona – é uma persona criada quando não há muitos recursos disponíveis para realizar pesquisa com usuários. Criada simplesmente com as informações que a empresa já possui, ela acaba sendo uma solução temporária, necessitando validar com usuários reais posteriormente.

  • User Persona – é um tipo de persona mais completa, criada através de pesquisas quantitativas/qualitativas e ferramentas de Web Analytics;

Elementos de uma Persona

Crie um ou mais personagens que representem o seu usuário, adicione também uma foto para torná-la mais real. Abaixo, alguns exemplos de informações que são incluídas ao persona:

  • Informações demográficas (idade, educação, etnia, status da família, …)
  • Objetivos e tarefas que estão tentando completar ao utilizar seu produto/serviço.
  • Uma citação que resume o que mais importa para o usuário em relação ao seu produto/serviço.
  • Seu ambiente tecnológico. Quais dispositivos o usuário utiliza no seu dia a dia? Quais softwares e aplicativos?

Como criar?

Há várias maneiras de criar personas, mas um processo bem comum seria:

  • Reúna um grupo de potenciais usuários e faça entrevista ou analise seus comportamentos.
  • Procure padrões de comportamento, respostas, ações e agrupe as pessoas que exibem o mesmo padrão.
  • Construa sua persona baseando-se em estereótipos , mas lembre-se de acrescentar detalhes de contexto, comportamentos, necessidades, etc…
  • Compartilhe a persona criada com a equipe para colher feedback e faça alterações caso necessário.
  • Defina se a persona criada é primária, secundária ou complementar.
  • Sempre que possível, atualize suas personas. O seu usuário de hoje pode não ser o mesmo daqui a algum um tempo.

Conclusão

O tipo de personas que você deve criar depende muito dos objetivos e restrições do projeto. O mais importante é que você dedique tempo para aprender sobre seus usuários. Sem as personas criadas, você corre o risco de tomar decisões baseadas em deduções ou por alguma influência individual da sua equipe de projeto.

Referências

Persona (User Experience) – Wikipédia
Personas – Usability.gov


Acessibilidade e User Experience (UX)

Três leis para melhorar a usabilidade da sua aplicação

As leis aqui abordadas podem parecer óbvias mas, muitas vezes, esquecemos de aplicá-las durante o processo de design ou simplesmente precisamos justificar nossas decisões de design para todos os envolvidos no projeto.

Existem várias pesquisas para cada lei descrita abaixo mas, para o propósito deste post, daremos uma breve introdução e alguns exemplos de como elas podem ser aplicadas para melhorar a usabilidade do seu produto/serviço.

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

1. Lei de Hick

A lei de Hick tem sido aplicada dentro da área de IHC (Interação Humano-Computador) com a simples ideia de que quanto mais opções de escolha forem apresentadas aos seus usuários, mais tempo levarão para chegarem a uma decisão.

Lei de Hick

Como ela pode ser aplicada?

Categorizando escolhas – Imagine um menu de navegação que oferecesse acesso direto para cada página em seu site, os usuários levariam um bom tempo até encontrarem a opção desejada. Agrupando as escolhas em categorias, você pode ocultar as escolhas e exibi-las apenas quando houver uma interação do usuário. Um elemento de interface bem conhecido que utilizamos para este fim é o Dropdown.

Para aplicações com fluxo de navegação complexo, existe uma técnica chamada Card sorting que pode ser útil para definir melhor a taxonomia (rotulação) das categorias e como elas podem ser agrupadas de acordo com seus usuários.

Redução de complexidade – Se a sua aplicação tem um processo complexo, você pode usar a Lei de Hick a seu favor mostrando-o por etapas, tornando-o mais fácil e amigável para os seus usuários.
Lei de Hick
Em cada etapa, lembre-se de deixar claro para os usuários onde eles estão, onde podem ir e onde já estiveram.

2. Lei de Fitts

Criada pelo psicólogo norte-americano Paul Fitts em 1952, é uma lei que prevê o tempo necessário para mover-se de uma posição inicial até uma posição final com base no tamanho do alvo. Em IHC (Interação Humano-Computador), a lei é normalmente avaliada em interfaces gráficas utilizando um mouse ou outro tipo de ponteiro.

Lei de Fitts

Como ela pode ser aplicada?

Aumentando a área dos botões – Um elemento de interação deve ser visualmente diferente de elementos que não possuem nenhuma interação. E uma das formas de diferenciá-los é através do tamanho. Aumentando a área do botão, irá aumentar o nível de precisão para interagir com o elemento.

Utilizando os cantos da tela – Em desktop, os cantos da tela possuem um limite no qual você não consegue ultrapassar utilizando o mouse. O cursor do mouse “trava” quando você tenta ultrapassar esse limite. Sendo assim, os usuários precisam de menos precisão para interagir sobre essa área, pois eles podem simplesmente arrastar rapidamente o mouse para um dos cantos que o cursor do mouse não irá ultrapassar. É comum encontrarmos os principais elementos de interação de uma aplicação em uma dessas áreas, como é o caso do botão Iniciar do Windows ou o botão fechar dos navegadores.

3. Lei de Miller

Os estudos de George Miller apontam que a maioria das pessoas armazenam 7 (+-2) itens de informação na memória de curto prazo. Ou seja, a nossa memória de curto prazo comporta entre 5 a 9 itens.

Como ela pode ser aplicada?

Se uma tarefa tiver uma sequência definida de passos, você deve guiar o usuário utilizando um passo a passo ou algo semelhante. Não force o usuário a memorizar uma série de comandos ou como navegar várias telas para concluir a tarefa.
Lei de Miller

Embora as teclas de atalho e linhas de comando muitas vezes poupam nosso tempo, não devemos usá-las como únicos meios de interação, pois eles exigem memorização e aprendizado. Se você deve contar com esses atalhos, forneça um guia de referência ou algum outro tipo de material de ajuda para os usuários.

Referências

Lei de Hick – Wikipédia
Fitts’s Law – Interaction Design Foundation
Miller’s Law – Wikipedia

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

Acessibilidade e User Experience (UX)

Affordances: Desenhando interfaces intuitivas

A definição de Affordances foi originalmente proposta pelo psicólogo James Gibson em 1977 para denotar a qualidade de um objeto que permite ao indivíduo identificar suas funcionalidades através de seus atributos (forma, tamanho, peso, etc…) de forma intuitiva, sem explicação.

Por exemplo, quando olhamos para uma maçaneta de um carro, sabemos a sua principal funcionalidade sem nem “pensar”, não importando qual o modelo do carro ou se estamos vendo àquele tipo de maçaneta pela primeira vez.

Affordances em interfaces digitais

Não demorou muito para o termo ser utilizado nas disciplinas de IHC (Interação Humano-Computador) e Design de Interação. Em interfaces digitais, quando desenhamos os elementos de uma aplicação, muitas vezes adicionamos sombra, relevo e outros efeitos visuais, geralmente se baseando nos objetos que são utilizados no mundo real. Para entendermos um pouco mais, vamos abordar 4 tipos de affordances que são aplicados em interfaces digitais e o impacto que elas podem causar na usabilidade de uma aplicação.

UX/UI - Introdução
Curso de UX/UI - Introdução
CONHEÇA O CURSO

1. Affordance explícito

É quando tornamos um elemento óbvio e claro das suas funcionalidades, indicando exatamente o que precisa ser feito.

Geralmente utilizado quando ainda não há um padrão definido de como podemos interagir com esse elemento.

2. Affordance padrão

São baseadas nas experiências anteriores e que são conhecidas para maioria dos usuários. Um clássico exemplo é o link sublinhado com a cor azul.

Padrões são úteis, pois somos capazes de reduzir a carga cognitiva dos usuários quando interagem com um determinado elemento.

Acessibilidade - Introdução
Curso de Acessibilidade - Introdução
CONHEÇA O CURSO

3. Affordance escondida

Neste tipo, o affordance não está disponível ou claro até que uma ação seja realizada pelo usuário. Por exemplo, um menu dropdown, onde você precisa passar o mouse ou clicar no menu para ver os itens de da lista.

Frequentemente utilizado para diminuir a complexidade visual de um design, exibindo apenas as informações relevantes em um determinado contexto.

4. Affordance metafórica

Utilizamos objetos do mundo real como metáforas em interfaces digitais. Ícones e símbolos são grandes exemplos: carrinho de compra, envelope, telefone, vídeo, câmera, impressora, etc…

Elas podem ajudar a comunicar ideias abstratas sem muitas instruções. Ao utilizá-las, certifique se a sua audiência irá entendê-la.

Concluindo

Entender o conceito de affordances é um dos primeiros passos para desenhar interfaces intuitivas. No seu próximo projeto, após conhecer a sua audiência e entender suas limitações, tente combinar os quatro tipos de affordances descritos acima para criar uma boa experiência do seu produto/serviço aos seus usuários.

Referências

Affordances – Interaction Design Foundation
O Design do Dia a Dia – Donald A. Norman


Design

Prototipagem e suas armadilhas

Após entender os requisitos do negócio e passar por todas as etapas de pesquisa com usuários, chega o grande momento de desenvolver um protótipo.

Seja de baixa, média ou alta fidelidade, o objetivo do protótipo é facilitar o entendimento do produto e suas interações, validar questões técnicas e alinhar as ideias com todos os envolvidos. Contudo, é importante escolher o tipo certo de protótipo para as necessidades atuais do projeto.

Protótipos fazem parte do dia a dia da equipe de design, mas como podemos otimizar e maximizar a sua eficácia?

Neste post, vamos abordar algumas armadilhas que podemos encontrar durante o processo de prototipagem.

Django - Módulo administrativo Django Admin
Curso de Django - Módulo administrativo Django Admin
CONHEÇA O CURSO

Foco na entrega, não no aprendizado

Focar na entrega do resultado final é importante, porém, mais importante do que isso é aprender algo durante esse processo. Ao coletar feedback e validar a ideia com usuários, somos capazes de aprender mais sobre seus respectivos comportamentos e entender melhor sobre o problema que estamos tentando resolver.

Focando no aprendizado, a chance de você criar um bom produto no final é bem maior.

Muita convergência, pouca divergência

Não raramente, selecionamos a primeira ideia brilhante que vem à mente e começamos a refiná-la. No processo de prototipagem, essa etapa de selecionar e refinar é conhecida como convergência.

Na etapa de divergência, a equipe não se contenta com uma única ideia/solução apresentada. Em vez disso, procuram outras abordagens para resolver o mesmo problema. Passando mais tempo nessa etapa, você entende melhor o problema, faz comparações das opções apresentadas e seleciona a melhor alternativa.

Processo de prototipagem sem iteração

No processo de prototipagem, um ciclo pode ser divido em 4 fases:

  • Planejamento:
    Qual o objetivo e o que queremos aprender com esse protótipo ou protótipos? Como sabemos se estamos chegando perto do design final?

  • Implementação: Desenvolvimento do protótipo ou protótipos.

  • Mensuração: Coletar dados e feedbacks de todos os envolvidos para demonstrar o resultado do protótipo.

  • Aprendizado: Analisar o ciclo e descobrir o que aprendemos de novo e quais questões somos capazes de responder na próxima iteração.

Passar por esse processo de iterar é essencial para sermos capazes de avaliar, propor melhorias e refinar o protótipo até chegar no design final.

O código do protótipo usado para o produto final

Dependendo de como você está desenvolvendo seu protótipo, nem sempre aproveitar o código é a melhor opção.

Quando estamos desenvolvendo um protótipo, geralmente não pensamos na qualidade, segurança e otimização do código. Focamos no que é mais importante naquele momento como a interação das telas, funcionalidades do sistema e na organização do conteúdo.

Aproveitar esse código provavelmente irá demandar mais tempo e esforço para organizar e dar manutenção futuramente. Na maioria dos casos é mais rápido e eficaz desenvolver um novo código para o seu produto final.

Concluindo

Cada protótipo é um novo aprendizado. Evitando algumas das armadilhas descritas acima, irá te ajudar a maximizar os resultados do seu protótipo com menos esforço.

E você? Já vivenciou alguma dessas situações? Conte-nos um pouco da sua experiência?


Design

UX: A importância da experiência do usuário nos projetos

“A experiência do usuário (UX) engloba todos os aspectos da interação do usuário final com a empresa, seus serviços e seus produtos.” – Nielsen Norman Group

Uma definição simples mas que sintetiza todos os aspectos de UX.

UX não é somente interface (website, aplicativo, etc…), e sim toda a experiência que os usuários possuem ao utilizar o seu produto ou serviço. É desde o primeiro contato do usuário com a empresa até a relação pós-venda.

Django - Módulo administrativo Django Admin
Curso de Django - Módulo administrativo Django Admin
CONHEÇA O CURSO

E as empresas cada vez mais estão percebendo que investir em UX pode trazer benefícios e um excelente retorno financeiro (ROI).

Veja abaixo alguns casos que provam a importância da experiência do usuário nos projetos:

  • Scroll infinito pode diminuir as taxas de abandono. O Time.com reduziu a taxa de abandono em 15% depois de implementar o scroll infinito. (Fonte)

  • A ESPN.com aumentou suas receitas em 35% depois de colher sugestões de seus usuários e implementá-las na sua homepage. (Fonte)

  • Escolher um determinado tom de azul resultou em lucro adicional de $80 milhões de dólares para o Bing. (Fonte)

  • Para cada $1 dólar investido em email marketing, a média de retorno é de $44,25. (Fonte)

  • 88% dos usuários alegam menos chance de retornar a um site depois de uma experiência negativa. (Fonte)

  • Sites com problemas de performance causam uma perda de $2.6 bilhões de dólares em vendas cada ano. ( Fonte )

  • O julgamento dos usuários sobre a credibilidade de um site é 75% baseado na sua qualidade estética. (Fonte)

  • As primeiras impressões são 94% relacionadas ao design. (Fonte)

  • 85% dos adultos acreditam que a versão mobile de um site deve ser tão bom ou melhor quanto a versão desktop. (Fonte)

  • 90% das pessoas usam uma variedade de telas sequencialmente. (Fonte)

  • Você tem 279,64% mais chances de escalar o Monte Everest do que clicar em um banner. (Fonte)

Concluindo

Em um mercado competitivo, projetar uma boa experiência acaba sendo fundamental para o sucesso de um produto ou serviço. Não investir em UX ou não considerar os usuários durante as etapas do projeto (Design centrado no usuário), implica em projetar algo com base em achismos, baseando-se somente nas necessidades do negócio.

Referências:

The definition of User Experience

13 mind-blowing statistics on user experience