UX: Rolagem infinita vs. Paginação
Este é um artigo traduzido, originalmente escrito por Nick Babich em UX: Infinite Scrolling vs. Pagination
“Rolagem infinita ou paginação, qual eu deveria usar para o meu conteúdo?” Alguns designers (e desenvolvedores) se vêem arbitrando uma luta entre esses dois métodos para decidir qual implementar em seus projetos. Cada um deles conta com pontos fortes e pontos fracos. Nesse artigo vamos analisar os dois métodos e decidir qual deles devemos usar em nossos projetos.
Rolagem infinita
Rolagem infinita é uma técnica que permite que usuários rolem através de uma grande quantidade de conteúdo sem um final de página aparente. Esta técnica consiste em simplesmente atualizar o conteúdo conforme você rola para baixo. Por mais tentador que isso possa soar, essa não é uma funcionalidade coringa que se encaixa em todo tipo de site ou app.
Pro #1: Engajamento dos usuários e descoberta de conteúdo
Para contextos em que a rolagem é o método principal de exploração de conteúdo, a rolagem infinita pode fazer com que os usuários permaneçam mais tempo em sua página, e assim, aumentam o engajamento. Com a popularidade das mídias sociais uma enorme quantidade de conteúdo é consumida todos os dias; Rolagem infinita oferece um jeito eficiente de se navegar nesse oceano de informações sem ter que esperar páginas carregarem.
Rolagem infinita é uma funcionalidade quase-obrigatória para interfaces de descoberta. Quando um usuário não pesquisa por algo específico, este precisa ver uma grande quantidade de itens para achar algo que o agrade.
É possível mensurar os benefícios da rolagem infinita quando tomamos como exemplo o feed de notícias do Facebook. Por ser atualizado constantemente, os usuários sabem que jamais verão todo o seu conteúdo. Com a rolagem infinita, o Facebook faz o melhor para expor a maior quantidade possível de informação para os usuários, e conforme eles rolam, mais eles consomem desse fluxo de atualizações.
Pro #2: Rolar é melhor que clicar
Usuários tem melhores experiências quando rolam a página do que quando clicam ou tocam. Os botões de rolagem e Touchscreens fazem do movimento de scroll mais fácil e rápido que o clique. Para conteúdo contínuo e longo como um tutorial por exemplo, rolagem fornece uma usabilidade melhor do que a divisão de texto em várias telas ou páginas.
Pro #3: Rolagem é amigável para mobile
Quanto menor a tela, maior é a rolagem. A popularização da navegação móvel é outro fator contribuinte ao uso da rolagem infinita. Os gestos de scroll nas telas mobile fazem da navegação em páginas longas mais intuitiva e fácil. Como resultado, os usuários aproveitam uma experiência verdadeiramente responsiva, não importando qual dispositivo eles estão usando.
Contra #1: Performance e recursos do dispositivo
Velocidade de carregamento é tudo para experiência de usuário. Muitas pesquisas mostram que um carregamento lento implica em pessoas deixando o site ou desinstalando o aplicativo, resultando em baixas taxas de conversão. E essas são más notícias para quem usa rolagem infinita. Quanto mais o usuário rola, mais conteúdo é anexado na mesma página. Resultado: a performance da página vai diminuindo cada vez mais.
Contra #2: Procura por itens e localização
Outro problema com a rolagem infinita é que para chegar a um certo ponto na correnteza de informações, os usuários não podem marcar sua localização para voltar depois. Se eles saírem do site, todo o progresso será perdido e todo o trajeto deverá ser percorrido novamente para chegar no mesmo lugar. Essa inabilidade de determinar a posição de rolagem, não só causa confusão e aborrecimento aos usuários, mas também prejudica a experiência do usuário como um todo.
Em 2012, o site Etsy investiu tempo implementando a rolagem infinita em sua interface de pesquisa.Porém, mais tarde descobriu que ela não tinha uma performance tão boa quanto a paginação. A quantidade de compras se manteve praticamente a mesma mas o engajamento diminuiu bastante — agora as pessoas não usavam muito a barra de pesquisa.
Assim como Dmitry Fadeyev aponta: “Pessoas voltarão a lista de resultados com o desejo de checar os itens que elas acabaram de ver, comparando essas com algo na lista. A rolagem infinita não só quebra essa dinâmica, mas também dificulta se mover para cima e para baixo na lista, especialmente quando você retorna a página e se encontra de volta ao topo, sendo forcado a rolar a lista mais uma vez e esperar os resultados carregarem novamente. Deste modo, a interface com rolagem infinita é mais lenta que a paginada.”
Contra #3: Barra de rolagem irrelevante
Outro ponto aborrecedor é que as barras de rolagem passam a não refletir a verdadeira quantidade de dados disponíveis. Você rola abaixo com a expectativa de estar perto do fim, e quando chega muito perto, descobre que o conteúdo dobrou em quantidade. Em termos de acessibilidade, a inutilização das barras de rolagem é muito ruim.
Contra #4: Falta de um rodapé
Rodapés existem por uma razão: Eles acomodam informações que os usuários podem precisar — Se os usuários não acham algo ou necessitam de informações adicionais, normalmente eles recorrem a esta área da tela. No entanto, quando a rolagem infinita adiciona cada vez mais dados na tela, este é empurrado cada vez mais para longe de vista.
Sites que implementam a rolagem infinita devem mantê-lo acessível fazendo-o sticky ou realocando seus links para o topo ou para a barra lateral.
Outra solução é carregar o conteúdo sob demanda usando um botão ‘Carregar mais’. Conteúdo novo não será carregado automaticamente até que o usuário clique neste botão. Desta forma os usuários conseguem acessar o rodapé facilmente sem ter que persegui-los através de um mar de conteúdo.
Paginação
Paginação é um padrão de interface que divide o conteúdo em páginas separadas. Se você rolar para o fim da página e ver uma linha de números — Esta linha é a paginação do site ou do app.
Pro #1: Boa conversão
As vantagens do uso de paginação aparecem quando o usuário está pesquisando por algo específico em uma lista de resultados, e não quando só está consumindo o fluxo de informação.
Você pode mensurar os benefícios da paginação com o exemplo da pesquisa Google. Achar o melhor resultado de busca na lista, pode demorar de segundos a horas, dependendo da sua pesquisa Quando você sabe o numero exato de resultados de busca, você pode tomar a decisão sobre onde parar, ou quantos resultados paginar.
Pro #2: Senso de controle
Rolagem infinita é como um jogo sem fim — não importa o quanto você rolar, parece que nunca chegará ao final. Quando os usuários sabem o numero de opções disponíveis eles são capazes de tomar uma decisão mais embasada em vez de ter que polir uma lista aparentemente infinita. De acordo com a pesquisa de David Kieras, Psicologia na interação Humano-Computador: “Chegar a uma conclusão fornece senso de controle”. A pesquisa também deixa claro que usuários tem mais capacidade de determinar o que estão e o que não estão procurando se tiver como opções, resultados limitados mas ainda relevantes.
Os usuários também se tornam mais capacitados para estimar quanto tempo demorará para achar o que se procura, ao ver o numero total de resultados (quando o montante de conteúdo não for infinito, claro).
Pro #3: Localização dos itens
Ao observar uma interface paginada, o usuário mantem uma localização mental do item. Pode não ser necessário saber o numero exato da página, mas ele lembrará, mesmo assim o usuário pode chegar no item mais facilmente.
Paginação é recomendada para sites e apps de e-commerce. Quando usuários compram online, deve ser possível que eles voltem a exata posição que eles estavam para que possam continuar a comprar.
Contra: Muitas interações
Para chegar na próxima página, o usuário tem que achar o link (Por exemplo: “Próximo”), direcionar o mouse, clicar e esperar o carregamento da nova página.
O problema principal aqui, está em errar a quantidade de itens exibidos por página. Criar páginas mais longas sem comprometer a performance, faz com que os usuários tenham mais conteúdo por página, assim, o numero de cliques nos botões de paginação serão menos frequentes.
Quando usar rolagem infinita/Paginação?
Há muitos poucos casos onde o uso da rolagem infinita se encaixa de maneira efetiva. É melhor para sites e aplicativos que exibem conteúdo gerado por usuários (Twitter, Facebook) ou conteúdo visual (Pinterest ou Instagram). Paginação, por sua vez, é a opção mais segura além de ser uma ótima solução para sites e aplicativos que pretendem satisfazer atividades orientadas a objetivos de seus usuários.
Para ilustrar, usemos a experiência nas pesquisas Google. Google Imagens usa rolagem infinita, porque as pessoas conseguem processar imagens mais rapidamente que texto. Ler resultados de pesquisa toma muito mais tempo, esse é o motivo para que a Pesquisa de texto no Google ainda use a técnica de paginação.
Conclusão
Designers e desenvolvedores devem medir os prós e os contras tanto da rolagem infinita quanto da paginação antes de selecionar uma delas. A escolha dependerá muito do contexto da aplicação e de como o conteúdo deve ser entregue. No geral, a rolagem infinita funciona bem em algo como o Twitter, onde as pessoas consomem informações em um fluxo interminável de conteúdo, sem procurar por algo em particular. Enquanto a paginação privilegia resultados de busca onde pessoas procuram por algo especifico ou onde a localização dos itens importa.
Obrigado!
Originalmente publicado em babich.biz.
