Técnicas de scrollytelling
Last updated
Last updated
Baseado nos termos "scroll" (rolagem) e "storytelling" (contação de histórias), scrollytelling designa recursos utilizados em páginas web, onde a rolagem de tela controla a narrativa. Esta prática ganhou destaque inicial em publicações online do chamado "long form journalism" ou "jornalismo forma longa", porém, os mesmos esquemas narrativos e tecnologias também podem ser utilizados de forma mais ampla.
A rolagem de tela é uma da formas mais intuitivas de experiência do usuário durante a utilização de dispositivos eletrônicos, sejam eles tablets, computadores desktop ou celulares. Mesmo pessoas leigas ou crianças pequenas são capazes de reproduzir este gesto em celulares, por exemplo. Com o scrollytelling, este ato simples pode controlar a aparição de textos, fotos, vídeos ou a navegação por um mapa, como implementa o Documental, além de outras possibilidades, como a transição entre diferentes formas de visualizar dados sobre um mesmo tema.
Até o momento, não existem muitas opções gratuitas de plataformas que forneçam uma interface gráfica para a construção de narrativas com scrollyteling. A alternativa mais conhecida é o , que já publicou um artigo específico sobre este recurso. O Documental destaca-se por uma solução de código aberto que, a partir do Statamic e do Mapbox, fornece uma interface gráfica para controle do scrollyteling e inclusão dos conteúdos que formam a narrativa.
Existem, porém, diversas opções gratuitas ou de código aberto disponíveis atualmente para implementar páginas com recursos de scrolytelling "do zero". No caso do scrollytelling, em , Russell Goldenberg elenca seis alternativas para construir uma página com scrollyteling "do zero", junto com demonstrações de seus códigos em funcionamento. A elas, foram adicionadas outras referências (entre elas a própria biblioteca mantida pelo autor, criada em outubro de 2017) e comentários próprios. As opções estão listadas de acordo com a contribuição mais recente feita em seus respectivos repositórios.
: Solução para WordPress criada pelo InfoAmazônia que permite inserir blocos de mapa interativos no editor Gutenberg.
: biblioteca criada por Russel Goldenberg. Conta com uma . É uma opção relativamente acessível, mesmo para quem tem apenas conhecimentos básicos de JavaScript. O apresenta um bom passo a passo da implementação de uma página do tipo. Para trabalhar com mapas, vale conferir o repositório feito pelo Mapbox, com base no Scrollama.
: recomendada por Goldenberg para casos que exigem bastante personalização da interação. ().
: plugin em jQuery utilizado em algumas histórias do The New York Times. É recomendado por Goldenberg para iniciantes que utilizam jQuery ().
: é plugin baseado na biblioteca D3 que fornece recursos simples para scrollytelling. Recomendável especialmente para visualizações de dados que também façam uso de D3 ().
O artigo de Goldenberg também cita duas bibliotecas que estão há mais tempo inativas, como o , cuja última atualização do é de setembro de 2016, e o , que está oficialmente inativo.
Além das alternativas acima, há a opção de se utilizar o . Neste caso, vale a pena conferir o , que conta com um componente específico para este tipo de visualização interativa, e o mostrando como implementar scrollytelling com o Svelte.