Design de ponta: Estratégias de UX para a Web do Mundo Real

É fácil pensar que a maioria das pessoas tem edições atuais do iPhone como telemóvel ou até mesmo usa algum portátil lançado recentemente. A realidade, porém, é que, no nosso mundo, provavelmente milhares de milhões de pessoas não têm acesso à internet ou hardware apropriado para utilizar produtos digitais comuns. Projetar para estas situações chama-se "casos extremos", em referência ao facto de estarem no limite da funcionalidade da internet.

Estes "casos extremos" ocorrem geralmente em zonas rurais, locais remotos, mercados emergentes onde a internet é geralmente bastante instável ou mesmo locais onde apenas estão disponíveis dispositivos mais antigos ou obsoletos, seja por questões de preço ou de distribuição.

Existem milhões de razões pelas quais o design para "casos extremos" é importante, uma vez que pode expandir exponencialmente o mercado da empresa, melhorar a experiência do utilizador (UX) em geral (uma boa acessibilidade beneficia sempre todos, torna as aplicações mais claras, rápidas e eficazes) e torna o design à prova de quaisquer potenciais condições externas que possam afetar a utilização do produto. Na verdade, todos nós podemos tornar-nos “utilizadores de topo” devido a eventos meteorológicos, viagens, cortes de energia, trabalho remoto ou até mesmo ao uso de um telemóvel no metro.

Degradação graciosa

Hoje em dia, as aplicações são complexas e tendem a contemplar diversas funcionalidades, bem como uma estética minuciosamente elaborada, geralmente com belas animações e conteúdo visual. No entanto, todas estas funcionalidades são impossíveis de utilizar quando a velocidade de download do utilizador é de 0,5 megabytes por segundo. Levaria 1 hora para carregar o feed do Instagram do utilizador e provavelmente custaria caro.

Na mente de todos os designers, deve existir sempre a seguinte questão: "Como posso disponibilizar esta aplicação tão complexa a todos os nossos utilizadores?". Uma forma de o fazer é simplificar a aplicação para o essencial nestas situações, mantendo a usabilidade e a personalidade mínimas da aplicação. A isto chama-se Degradação Graciosa e há muitos usos comuns para ela, tais como:

Fallback offline:

É uma abordagem muito comum em aplicações baseadas em conteúdo, como aplicações de streaming. O fallback offline permite que os utilizadores continuem a utilizar a aplicação mesmo offline, incluindo a possibilidade de descarregar o conteúdo com antecedência, trabalhar offline e, em seguida, sincronizar automaticamente o trabalho feito no ficheiro. O Spotify faz isto incrivelmente bem, permitindo que os utilizadores descarreguem o conteúdo com antecedência e o reproduzam quando quiserem. Mesmo que o utilizador não descarregue o conteúdo na totalidade, o Spotify terá guardado alguma cache de utilizações anteriores, e o conteúdo pode nem parar imediatamente se a ligação for perdida.

Interfaces sensíveis ao contexto:

Também é possível projetar interfaces para períodos de transição, como detetar problemas de conectividade e fazer com que a interface do utilizador se adapte a isso. Um exemplo muito famoso é o Google Meets, que adapta a exibição de outros utilizadores na chamada consoante a qualidade da ligação à internet do utilizador. Quando o dispositivo deteta uma oscilação na ligação, desliga automaticamente todos os vídeos dos outros utilizadores e transforma-os em imagens estáticas, o que torna o processamento muito mais leve para o computador com uma fraca ligação à internet, permitindo uma chamada mais fluída, ininterrupta e de melhor qualidade para os utilizadores.

Priorizar tarefas críticas:

Ao reduzir o tamanho de uma aplicação, é necessário focar-se no que é realmente prioritário. Pense na Hierarquia de Maslow: primeiro o foco é a sobrevivência e depois o prazer. Um ótimo exemplo é o WhatsApp, que enfileira as mensagens para serem enviadas quando está offline e depois envia-as automaticamente ao detetar qualquer tipo de sinal. O seu principal objetivo é enviar e receber mensagens, independentemente das circunstâncias.

UI Leve

A priorização traz muitos benefícios, uma vez que o Produto Mínimo Viável é fundamental para "casos extremos". Isto inclui tornar a aplicação mais leve ou até mesmo criar uma versão leve, permitindo que os utilizadores com conectividade ou hardware deficientes "sobrevivam", de acordo com Maslow. É muito comum criar versões leves de aplicações de redes sociais, sendo o Instagram Lite e o Facebook Lite as mais famosas, que mantêm a funcionalidade principal da aplicação, mas de forma altamente eficaz.

As aplicações bancárias são também um caso interessante, pois precisam de ser utilizadas por toda a população, o que significa que têm muitas limitações de design, sendo realmente leves e podendo caber nos ecrãs mais pequenos e nos piores processadores. Pode até existir uma segunda aplicação para o mesmo banco, mas com uma interface de utilizador mais complexa e pesada para investidores e utilizadores de nichos mais específicos, que geralmente têm melhor ligação e hardware. Portanto, uma interface de utilizador leve é uma parte fundamental do design de muitas empresas. Mas como é que elas fazem isso?

• Conteúdo simples e básico:

  Isto inclui páginas sem muito conteúdo (com muitas fotos e vídeos de alta qualidade), limitar animações de interface desnecessárias, evitar estruturas pesadas, utilizar ativos vetoriais e conteúdos SVG em vez de imagens tradicionais, tentar utilizar fontes do sistema, uma vez que todos os dispositivos podem processá-las, minimizar os pedidos do sistema para um melhor processamento e menos utilização da Internet e até pensar em utilizar um layout mais simples.

• Informe os utilizadores sobre a utilização de dados e permita flexibilidade de utilização:

  With “edge cases”, users tend to have limited internet or even limited processing. Therefore, it is paramount to inform the user if it is consuming excess data, allowing users to maneuver their own situation. Spotify does that beautifully as they clearly display to the user if they are offline, streaming or downloading with the users’ mobile data, how much cache is stored and content downloaded, while also allowing users to customize how it stores data and the quality level of the content downloaded or streamed. Flexibility is key for a product success, especially when it is a world-wide product used by everyone. The applications should bend, but not break.

Dicas

Tudo é mais simples e bonito na teoria; na prática, porém, é um pouco mais complicado. Para facilitar a vida aos "utilizadores de topo", é geralmente necessário um pouco mais de trabalho e atenção aos pequenos detalhes, tentando, com empatia, colocar-se no lugar destes utilizadores, uma vez que esta não é uma perspetiva tão natural para a maioria dos designers.

Aqui ficam algumas dicas:

• Teste em todos os dispositivos:

  Isto pode parecer um pouco óbvio neste contexto, mas teste literalmente com todos os tipos de dispositivos. Diferentes tamanhos de ecrã, dispositivos mais antigos, incluindo baixa RAM, CPUs lentos, armazenamento limitado, diferentes sistemas operativos e versões, ecrãs pequenos, baratos e de baixa resolução. Nestes testes, é importante verificar como o design se comporta nestas circunstâncias, incluindo se tudo é claro, se a hierarquia é mantida, se tudo é visível, se as animações bloqueiam a aplicação ou se algo a torna mais lenta do que deveria.

• Teste com sinal baixo:

  Existem muitas opções a utilizar, incluindo utilizar as variações de limitação do DevTools do Google Chrome ou, literalmente, ir a locais com sinal baixo. Qual a piora no desempenho da aplicação nestas condições? Existe algo que possamos reduzir para manter a melhor usabilidade? Com estas condições em mente, é possível evitar problemas como este na prancheta, aliás, muito antes do teste. Se a aplicação tiver muito conteúdo, porque não usar carregamento progressivo (carregando apenas os primeiros conteúdos e carregando progressivamente à medida que o utilizador faz scroll na página) ou até mesmo carregadores de esqueleto (mostrando ao utilizador algum tipo de progressão visual da interface da aplicação a ser carregada)

• A/B testing/Teste A/B:

  Nada é melhor do que a comparação direta feita pelos potenciais utilizadores sobre o design. Assim, é possível criar versões mais simples da aplicação para casos extremos e verificar o seu desempenho em dispositivos/internet lentos e com a pior ligação, obtendo, assim, feedback vital e real sobre o desempenho da aplicação.

Conclusão

Quando o design de um produto considera "casos extremos", cria empatia com milhões de pessoas em todo o mundo, permitindo-lhes satisfazer uma necessidade e estar mais integradas na sociedade, além de se tornarem clientes. Isto não só aumenta a usabilidade e a acessibilidade, como também os lucros e o crescimento das empresas. O UX Design tem uma natureza empática nos seus princípios fundamentais, por isso vamos garantir que os designers criam realmente empatia com todos, em todos os lugares e em todas as condições.