Navegação – Mapa do site

InícioNúmeros33Artigos temáticosProposta metodológica para avalia...

Artigos temáticos

Proposta metodológica para avaliação de aplicativos jornalísticos baseados em cards

Methodological proposal for the evaluation of journalistic applications based on cards
Rita de Cássia Romeiro Paulino e Marina Lisboa Empinotti
p. 311-328
Tradução(ões):
Methodological proposal for the evaluation of journalistic applications based on cards [en]

Resumos

Cada vez mais os conteúdos jornalísticos para smartphones deixam de ter como base outros veículos da empresa, analógicos ou digitais, e passam a ser próprios para o novo meio. O design de notícias baseado em cards se apresenta como uma boa solução para criação de interfaces nativamente móveis. Neste trabalho discorremos sobre as maiores contribuições das interfaces do tipo cards ou “cartão” para aplicativos de notícias para smartphones e descrevemos um modelo de avaliação para este tipo de conteúdo, a fim de oferecer uma ferramenta de sistematização e classificação de pesquisas das áreas de jornalismo, design, entre outras.

Topo da página

Notas da redacção

doi: 10.17231/comsoc.33(2018).2919
Submetido: 30.11.2017 – Aceite: 15.03.2018

Texto integral

Introdução

1Em 2017, o crescimento do uso de smartphones permanece em trajetória ascendente, seguindo a tendência dos anos anteriores, embora com menor força (Gráfico 1). Dados do Reuters Institute Digital News Report1 (RIDNR) de 2017 mostram que mais pessoas usam o smartphone para visualizar notícias, enquanto menos dependem de um computador de mesa [desktop] para tal. Enquanto os mais velhos fazem a transição do computador para o smartphone, os mais jovens já iniciam seu acesso a notícias através das pequenas telas.

Gráfico 1: Gráfico mostra a ascensão do uso do celular no consumo de notícias (a) e queda no uso de televisão e impresso como fontes noticiosas (b)

Gráfico 1: Gráfico mostra a ascensão do uso do celular no consumo de notícias (a) e queda no uso de televisão e impresso como fontes noticiosas (b)

Fonte: Adaptado de Newman, Fletcher, Kalogeropoulos, Levy, & Nielsen, 2017

  • 2 Retirado de https://dados.media/-!/view/CATEGORY/DIGITAL_MEDIA/MDB_DIG_MOBILE_PENETRACAO_RKG_MULTIP (...)

2Ainda de acordo com o Relatório (Newman, Fletcher, Kalogeropoulos, Levy, & Nielsen, 2017), os smartphones ultrapassaram os computadores como principal dispositivo para se acessar notícias. O Mídia Dados2 mostra um aumento significativo na preferência do uso do smartphone, com 92% contra 25% dos usuários que preferem o tablet. O cenário descrito enfatiza a necessidade de se produzir e debater o conteúdo jornalístico para smartphones.

3Nos primeiros anos de desenvolvimento de aplicativos para celulares, o movimento de adaptação foi semelhante ao observado quando da chegada da Internet, em que os produtos impressos eram transpostos integralmente para a rede. Simplesmente transportar conteúdo da web para a mídia móvel não oferecia uma boa experiência ao usuário. Textos e mídias não se adaptavam ao tamanho dos diversos celulares do mercado, surgindo a necessidade de uma linguagem que fizesse a adaptação do tamanho dos conteúdos para diferentes tamanhos de telas. Esta situação fez surgir o design responsivo, uma técnica de estruturação HTML e CSS, em que o site se adapta ao browser do usuário sem precisar definir diversas folhas de estilos para cada resolução.

4O uso do design responsivo na programação do HTML de sites assegura uma visualização mais adaptada para textos, imagens e vídeos em dispositivos móveis sem perda do conteúdo. Se por um lado esta técnica resolveu o problema de visualização, por outro perdemos a originalidade e exploração do uso de recursos nativos. Os textos são adaptados em blocos e imagens são reestruturadas para o tamanho do equipamento.

5Como alternativa à adaptação totalmente automática surge a organização através de cards, ou cartões, que permite a adaptação para o ambiente móvel sem abandonar outras convenções de acesso à Internet e incrementando o código da página com propriedades relativas ao aparelho ou que organizem melhor o conteúdo (Mello et al., 2015). Neste trabalho o design através de cards será esmiuçado, a fim de se ter embasamento suficiente para apresentar um sistema metodológico de avaliação e estudo de interfaces deste tipo.

Cards – origem e aplicações

6A organização de informações em cards remete a diversas formas do cotidiano, utilizadas há decadas. Trata-se de usar pequenos retângulos para expor imagens e textos que servem como pontos de entrada para informações mais detalhadas. A palavra “cartões” é uma excelente metáfora para a interface digital aqui estudada, já que se parece com cartões tangíveis do mundo real nas interfaces de usuário.

7Antes da web e dos aplicativos móveis, os cartões já eram objetos comuns em diferentes contextos, como entretenimento ou apresentação pessoal, tornando, portanto, intuitivo sabermos que os cartões são apenas um pedaço de conteúdo, como na vida real. Como na vida real, os cards podem ser bons para a interface de aplicativos em muitos contextos, inclusive o noticioso. Algumas das aplicações em que melhor se adaptam são:

  1. fragmentação de conteúdo: desde o desenvolvimento de conteúdo para os sites, a ideia de se fragmentar o conteúdo em blocos informativos (chunks) está consolidada. Assim se facilita a leitura online, ou o escaneamento (passar de olhos) da informação, pois grandes blocos de texto podem levar à desistência da leitura. Os cards dividem o conteúdo em seções coerentes, de maneira semelhante à organização do texto em parágrafos;

  2. agilidade: os cards são uma ótima ferramenta para comunicar histórias rápidas, tornam o conteúdo atrativo, sem parecer longo ou demorado demais. Os usuários podem se envolver no que os interessa, da maneira que quiserem;

  3. ideal para navegação com dedos: uma interface baseada em cards é simples de modo que se use perfeitamente apenas com o dedão, ao se utilizar o dispositivo apenas com uma mão. Ao se imaginar o deslizar de cartões físicos (em um baralho, por exemplo), nota-se logo a semelhança de movimento para se transitar entre os pedaços de informação;

  4. transitam entre diferentes telas: a facilidade de manipulação dos cards os tornam uma boa opção para um design responsivo a diferentes tamanhos de telas. É possível criar uma estética única em vários dispositivos sem que se perna qualidade de experiência;

  5. visual agradável: interfaces em cards utilizam muitas imagens, e por isso também dependem delas. A grande exploração de conteúdo visual as torna atraentes e oferecem um ponto de entrada ao olhar do usuário ao transitar entre cards.

8Percebe-se, assim, a adequação dos cards para uma interface de acesso a conteúdos noticiosos em dispositivos móveis, aparelhos usados em contextos diferentes dos computadores de mesa e portáteis: de forma rápida, pouco profunda e geralmente em movimento, em momentos livres do dia que podem ser preenchidos por atividades em aparelhos móveis (Mello et al., 2015). Como enfatizam os autores, esse contexto não é refletido pelo modelo de acesso em navegadores ou de aplicativos híbridos, que utilizam páginas web dentro de uma estrutura de aplicações, porque envolvem um tempo de carregamento muito alto e uma sessão de leitura longa, não compatível com a forma como as informações são consumidas em aparelhos como smartphones.

9Muitos dos sites e aplicativos mais populares atualmente se beneficiam do design baseado em cards. No âmbito das redes sociais, temos o Facebook (Figura 1a) como um exemplo do uso dos cards na forma de linha do tempo [timeline] de eventos. Através deles, tem-se um resumo do conteúdo que apresentam: no caso de uma notícia, por exemplo, há o título, um pequeno resumo, e uma foto, que levam, após o clique, ao material completo. No caso do Google+ (Figura 1b) os cards são dispostos de maneira semelhante, em três colunas, e agrupados por tema. A experiência do usuário em diversos aspectos é concentrada ali.

Figura 1a: Interface do Facebook

Figura 1a: Interface do Facebook

Fonte: Reprodução Facebook

Figura 1b: Interface do Google+

Figura 1b: Interface do Google+

Fonte: Reprodução Google+

10Aplicativos como o Tinder exemplificam como os cards oferecem expectativa e sensação de “descobrimento”. A interface sugere que se deslize um card (Figura 2a) para a direita se a pessoa no card interessa (Figura 2b) e para a esquerda caso não interesse. A expectativa de não saber o que está contido no card seguinte incita o movimento.

Figura 2a: Interface do Tinder

Figura 2a: Interface do Tinder

Fonte: Reprodução Tinder

Figura 2b: Interface do Tinder

Figura 2b: Interface do Tinder

Fonte: Reprodução Tinder

11Para além do já referido Google+, o Google faz amplo uso dos cards em seus produtos. A Figura 3a mostra como o usuário encontra todas as informações utilizadas em programas da empresa em um só lugar: Gmail, Google Maps, buscador Google, etc. Neste último, os cards são usados ainda ao se buscar um conteúdo disponível na Wikipédia, por exemplo. A informação nela contida gera um bloco informativo (Figura 3b) que surge ao usuário, sem que seja necessário selecionar um site relacionado na busca para que se chegue à informação que provavelmente procura.

Figura 3a: Interface do Google

Figura 3a: Interface do Google

Fonte: Reprodução Google

Figura 3b: Interface do mecanismo de busca do Google

Figura 3b: Interface do mecanismo de busca do Google

Fonte: Reprodução Google

12No tópico a seguir serão apresentadas as especificidades dos cards, quando aplica dos ao desenvolvimento de interfaces móveis. A forma dos cards pode servir como base para textos, imagens e vídeos nas pequenas telas. A partir daí será possível introduzir o sistema de avaliação desenvolvido.

Diretrizes e modelo cards para o desenvolvimento mobile

13Nativamente, interfaces desenvolvidas para celular seguem padrões visuais relacionados às plataformas Android e iOS. Estas apresentam bases de componentes visuais sofisticados, com efeitos e muitas características disponíveis para serem personalizadas (Paulino & Empinotti, 2017). Assim surgem novas maneiras de se produzir para a mobilidade e muda também o fazer jornalístico, agregando mudanças e novos valores às rotinas produtivas:

desde esse ponto de vista, isso significa que as tecnologias de comunicação móvel abrem caminhos para novas possibilidades no jornalismo e, ao mesmo tempo, trazem inconvenientes que precisam ser investigados como resultantes dessa mesma expressão sobre as práticas tradicionais afetadas numa zona de tensão permanente. (Silva, 2013, p. 101)

14Foi a consolidação dos tablets como dispositivos de comunicação, contudo, que incentivou o desenvolvimento de aspectos do design das publicações voltadas ao novo suporte, já que o layout e suas funcionalidades são aspectos centrais na experiência do usuário. Castellet (2012) destaca as melhorias alcançadas na linguagem de marcação HTML5, trabalhada desde 2008, mas consolidada em 2014, quando foi adotada, mesmo que parcialmente, pelas principais ferramentas de layout: Blink (Chrome e Opera), Gecko (Mozilla), Trident (Microsoft), e WebKit (iOS, Safari). O HTML – Hypertext Markup Language – é usado para estruturar e apresentar conteúdo na Web, sendo o número 5 indicativo de sua quinta versão, que pode ser vista como uma alternativa viável ao atual ecossistema de aplicativos do ecossistema móvel, segundo o espanhol. A organização através de cards permite a adaptação para o ambiente móvel sem abandonar outras convenções de acesso à Internet e incrementando o código da página com propriedades relativas ao aparelho ou que organizem melhor o conteúdo (Mello et al., 2015).

15Especificamente nas interfaces touchscreen, os cards suportam movimentos, como o deslizar (um dedo desliza sobre a tela em movimento horizontal ou vertical) e o pick-up-and-move (pegar e arrastar elementos), e a possibilidade de vários arranjos gráficos. Fornecem também um ponto de entrada para informações e priorizam o uso de imagens; seu conteúdo e quantidade podem variar seguindo uma estética padrão.

16O ponto de entrada de uma informação pode conter uma hierarquia dentro do card para direcionar a atenção dos usuários para a informação mais importante. As imagens podem reforçar outros conteúdos. Entretanto, seu tamanho e colocação dentro do card dependem do tamanho do conteúdo principal ou como estão sendo usadas para complementar outros textos3. Os cards têm uma largura definida conforme o tipo de aplicativo e uma altura variável para conteúdos. A altura máxima é limitada à altura do espaço disponível em uma plataforma, mas pode expandir temporariamente (por exemplo, para exibir um campo de comentários).

17Conforme visto nos exemplos do tópico anterior, muitas vezes os cards não são apresentados sozinhos, mas em coleções, que podem ser ordenadas ou filtradas por data, tamanho do arquivo, ordem alfabética ou outros parâmetros. O primeiro item da coleção está posicionado no canto superior esquerdo. A ordem prossegue da esquerda para a direita e de cima para baixo. Os cards podem ser construídos usando blocos de conteúdo que incluem: um cabeçalho opcional; Um título primário; Rich Media (vídeos e áudios); Texto de suporte; Ações.

18Os blocos podem ser organizados para promover diferentes tipos de conteúdo. Por exemplo, em títulos o corpo de texto pode ser enfatizado aumentando sua escala tipográfica. No tablet/desktop, os cards devem seguir a orientação de 24dp – pontos. É recomendável o limite dos gestos de deslizamento dentro de uma interface, para que eles não se sobreponham uns com os outros. O gesto de pick-up-and-move pode ser usado se for importante para o usuário poder classificar os cards dentro de uma coleção.

19Para um agrupamento visualmente harmônico, buscam-se características semelhantes: a forma, cor, direção, textura, etc. Gomes Filho (2015) retrata aspectos que ajudam na composição gráfica para mídia impressa. As leis de composição da Gestalt, que englobam padrões de comportamento visual, podem ser aplicadas nas plataformas de mídia digital e percebe-se também a aplicação da teoria e das leis nas interfaces para dispositivos móveis (Figuras 4a e 4b).

Figuras 4a e 4b: Cards com tamanhos diferentes, mas formatos semelhantes

Figuras 4a e 4b: Cards com tamanhos diferentes, mas formatos semelhantes

Lei da Gestalt (a) e layout de card com áreas para mídias, textos e links (b)

Fonte: Adaptado de Paulino & Empinotti, 2017

20Os cards são altamente adaptáveis a quaisquer pontos de quebra [breakpoints] das telas, sendo assim ideais para atender aos critérios de adaptabilidade de projetos responsivos. Elencados lado a lado em uma interface para computadores podem se tor nar verticais quando vistos em pequenas telas. A Figura 5 (a e b) traz um exemplo dessa mudança.

Figura 5a e 5b: Cards em interface de mesa (a) e mobile (b)

Figura 5a e 5b: Cards em interface de mesa (a) e mobile (b)

Fonte: Reprodução The Verge

21Finalmente, ao se planejar os cards, deve-se sempre considerar a simplicidade em se ler e compreender a parte textual nele contida. A regra básica para o design tipográfico, portanto, é a de tipos simples e esquemas de cores contrastantes. Fundos de cores sólidas de forma a maximizar a capacidade de leitura das letras, em tons opostos ao do background (claro-escuro ou vice-versa). Além disso, variar tipos num mesmo card deve ser feito com cuidado, levando em consideração que um só tipo deve ser sempre o suficiente para expressar o conteúdo do card.

22Nielsen e Budiu (2014) destacam que os cartões têm um canvas de apresentação de tamanho fixo, ou seja, o desenvolvedor posiciona a informação dentro do espaço bidimensional pré-definido até ficar satisfeito, o que possibilita bons layouts, mas não é possível torná-lo maior. É preciso, assim, que o usuário avance para um novo cartão para que obtenha mais informações.

23No caso das rolagens [scroll], é disponibilizado espaço estendido para baixo, na extensão que o desenvolvedor desejar: “desta forma os usuários têm de saltar menos, mas ao custo de um leiaute menos interessante, porque o projetista não pode controlar o que os usuários estão vendo em dado momento” (Nielsen & Budiu, 2014, p. 50):

...a rolagem causava grandes problemas de usabilidade, especialmente porque, com frequência, os usuários tinham de batalhar com sites que não eram otimizados para os dispositivos móveis. Em contraste com o que acontecia em 1990, o problema não era que os usuários não rolavam, era que eles rolavam muito. Nos dispositivos móveis, eles tinham de mover seu minúsculo espaço de visualização para a frente e para trás tão frequentemente que perdiam o controle de onde estavam e do que estava na página. Com frequência, eles rolavam passando direto por algo sem perceber. (Nielsen & Budiu, 2014, p. 51)

Referencial teórico para a construção do sistema de avaliação

24O sistema de avaliação com fins metodológicos aqui descrito, baseado em componentes de interface de aplicativos jornalísticos, é embasado por dois estudos prévios e já teve um teste piloto, apresentado em Paulino e Empinotti (2017), onde três aplicações foram avaliadas segundo o modelo proposto. O primeiro estudo fornece uma abordagem de categorias inicialmente desenvolvidas para a análise de aplicativos para tablets (Oliveira, 2013) fundamentada em dois aspectos. Ele se baseia nos estudos de interface de Bardin (1977), Nielsen (1993, 1995, 2011), Saffer (2009), e Bastien e Scapin (citado em Cybis, 2003) com ênfase nos elementos básicos da construção de interfaces, como aspectos cognitivos, visuais, ergonômicos e interativos E em uma relação conceitual entre características do webjornalismo: interatividade, customização de conteúdo, hipertextualidade, multimidialidade e memória (Bardoel & Deuze, 2001; Palacios, 1999).

25Pellanda et al. também investigaram a formatação em cards como possibilidade para a apresentação de conteúdo jornalístico. Para os autores, o formato facilita a experiência de leitura do usuário ao permitir “uma forma de manuseio e interação com o conteúdo que é própria do meio digital, podendo resultar no agrupamento de informações e no compartilhamento de conteúdos” (2015, p. 179).

26Nielsen e Budiu referem a importância da apresentação clara de conteúdo em dispositivos móveis, já que estes oferecem uma experiência do usuário empobrecida: “telas minúsculas, conectividade lenta, maior custo de interação (especialmente quando se digita, mas também devido à inabilidade dos usuários em dar duplo clique ou flutuar) e menor precisão para apontar devido ao problema do “‘dedo gordo’” (2014, p. 61).

27Primeiramente, então, a reflexão de Bardin acerca da criação de categorias, que pressupõe, de acordo com a autora, a identificação de semelhanças e agrupamento de elementos comuns, é aqui apropriada:

a análise por categorias temáticas tenta encontrar uma série de significações que o codificador detecta por meio de indicadores que lhe estão ligados; (...) codificar ou caracterizar um segmento é colocá-lo em uma das classes de equivalências definidas, a partir das significações, (...) em função do julgamento do codificador (...) o que exige qualidades psicológicas complementares como a fineza, a sensibilidade, a flexibilidade, por parte do codificador para apreender o que importa. (Bardin citada em Caregnato & Mutti, 2006, p. 683)

28Os estudos de Nielsen (1995) guiam a noção de usabilidade: um “atributo de qua lidade que avalia quão fácil uma interface é de usar” ou “a medida de qualidade da experiência de um usuário ao interagir com um produto ou um sistema” (Nielsen, 1993, p. 26). Dois trabalhos do pesquisador são importantes neste debate: o primeiro avalia interfaces de sites acessados via desktop (1995) e o segundo usou iPads para a avaliação da usabilidade (2011). No caso dos sites as categorias aplicadas (Oliveira, 2013) foram:

  • feedback/visibilidade dos estados do sistema;

  • adequação à linguagem do usuário/correspondência;

  • controle e liberdade;

  • consistência e padrões/convenções;

  • prevenção de erros;

  • aprendizado e reconhecimento x memória e recordação;

  • flexibilidade e eficiência (atalhos);

  • estética, diálogo e design simples;

  • boas mensagens de erros;

  • ajuda e documentação.

29Posteriormente, a avaliação da usabilidade em tablets baseou-se nos seguintes critérios (Oliveira, 2013):

  • erro: áreas para toques apresentam erros básicos;

  • erro: confusão do botão voltar;

  • mais aplicativos no mercado tornam os usuários mais familiarizados;

  • formulários não são bem aceitos em ipads;

  • animações descontextualizadas irritam usuários;

  • excesso de possibilidades de navegação confunde o usuário;

  • os aplicativos deveriam ser chaveados por usuário;

  • quando o foco do conteúdo é interação, aplicativos são mais apropriados do que sites;

  • os iPads são usados para jogos, e-mails, vídeos, redes sociais e notícias.

30O trabalho de Saffer (2009) com interfaces gestuais complementa os achados de Nielsen (1995; 2011). São dez as categorias elencadas: detectibilidade; confiabilidade; responsividade; adequação e adaptação ao contexto; inteligência; significância; sutileza; divertimento; estética; ética. Por fim, Bastien e Scapin (citados em Cybis, 2003) definiram oito critérios ergonômicos que garantem a qualidade na construção de interfaces humanocomputador: condução; carga de trabalho; controle explícito; adaptabilidade; gestão de erros; homogeneidade; significado de códigos e denominações; e compatibilidade.

31Oliveira (2013) oferece um novo enfoque (Tabela 1), agrupando as categorias já relacionadas, mas fundando-o no relacionamento com o que a autora denomina “categorias do jornalismo online” (Bardoel & Deuze, 2001; Palácios, 1999, 2004): interatividade; personalização/customização de conteúdo; hipertextualidade; multimidialidade/convergência; memória; instantaneidade de acesso.

Tabela 1: As categorias da forma do jornalismo nos tablets, compilação da interface com o jornalismo online

Síntese das categorias

Categorias relacionadas

Significado

Orientação

Hipertextualidade

As informações precisam estar dispostas em diversas camadas e fluxos multidirecionais

Contextualização

Hipertextualidade; Multimidialidade (convergência); Memória

As informações devem se conectar com conteúdos complementares e suplementares

Autonomia

Interatividade; Personalização

As informações devem ser agrupadas de modo a que atendam a interesses específicos de um perfil de usuário

Padronização

Segmentação; Ritmo; Ordem

As informações devem ser expostas de forma equilibrada

Precisão

Instantaneidade de Acesso

As informações devem ser apresentadas com clareza e minimizar erros relacionados ao fator “tempo real”

Assimilação

Hipertextualidade e Personalização do Conteúdo

As informações devem ser organizadas por meio do aprofundamento e do enfoque

Economia

Hipertextualidade; Multimidialidade

As informações em excesso e com ambiguidades confundem o leitor

Estética

Multimidialidade

As informações devem apresentar recursos visuais e imagéticos

Documentação

Formalização; Institucionalização

As informações estão inseridas em um produto e em uma lógica de mercado

Imersão

Multimidialidade; Hipertextualidade; Interatividade

As informações devem prender a atenção do leitor

Fonte: Adaptado de Oliveira, 2013

  • 4 Um ambiente pervasivo, segundo Burgos citado em Silveira (2016), faz com que os conteúdos precisem (...)

32Conveio buscar, para aplicação ao design por cards, uma visão mais sistêmica que envolvesse elementos independentes ligados às tecnologias. O estudo de Silveira (2016) apresenta uma abordagem sobre a narrativa digital móvel e se aproxima de categoria que definem um ambiente pervasivo4 com base em estudos prévios (Bertocchi, 2014; Ramos, 2011; Saffer, 2009).

33Porém Silveira (2016) se aproxima dos estudos de categorias específicas para a mobilidade e considera que as categorias (Tabela 2) estão diretamente relacionadas ao contexto dos diferentes desenhos dos dispositivos móveis e formatos narrativos sistêmicos e, por isso, precisam ser analisadas quando se observa a interface apresentada por produtos jornalísticos criados com essa especificidade.

Tabela 2: Categorias relacionadas ao contexto dos diferentes desenhos dos dispositivos móveis e formatos narrativos sistêmicos

Categoria

Descrição

Geolocalização

Identificação da localização geográfica do usuário.

Navegação em camadas

Possibilidade de aprofundamento do conteúdo de acordo com a vontade e necessidade do usuário.

Notificações por push

Envio de avisos automaticamente a partir da autorização do usuário.

Fluxos de dados

Capacidade de armazenar conteúdos já vistos pelo usuário e, consequentemente, não repeti-los.

Personalização de conteúdo

Possibilidade de definir que conteúdos quer visualizar.

Relação com redes sociais online

Facilitação da possibilidade de compartilhar conteúdos com outros aplicativos sem necessariamente precisar sair do primeiro.

Uso de algoritmos

Uso de algoritmos para captar dados do usuário e a partir disso definir preferências de leitura e consumo.

Uso de conceitos de usabilidade

O produto é intuitivo, oferece feedback ao usuário de suas ações e não necessita de instruções de uso.

Fonte: Adaptado de Silveira, 2016

Ferramenta de avaliação desenvolvida

34Nota-se que muitas características apresentadas e definidas pelas categorias das Tabelas 1 e 2 se repetem, se complementam ou revelam aspectos novos sobre a outra. Para a metodologia voltada aos cards definimos uma nova abordagem, retirando as categorias repetidas ou que não se aplicam no caso selecionado. Tem-se portanto três vertentes de análise de uma interface em cards, cada uma com três ou quatro categorias:

  • aspectos da forma: personalização, precisão, estética;

  • aspectos do jornalismo móvel: hipertextualidade, multimidialidade (convergência); memória, interatividade;

  • aspectos da tecnologia adotada: geolocalização, notificações por push, relação com redes sociais online, movimento.

35Primeiramente cabe definir uma nova categoria, sem precedentes teóricos nas tabelas prévias, que se refere ao movimento (animações relacionada às formas), aspecto adequado às aplicações mobile. O movimento mostra como um aplicativo está organizado e o que ele pode fazer:

  • Orientação guiada entre visualizações;

  • sugestões sobre o que acontecerá se um usuário completar um gesto;

  • relações hierárquicas e espaciais entre elementos;

  • distração do que está acontecendo nos bastidores (como buscar conteúdo ou carregar a próxima visualização);

  • caráter, estética e o lúdico.

36Os movimentos podem atrair outros elementos e juntar-se a eles enquanto se aproximam uns dos outros. Uma transição de um card para outro ajuda a orientar o usuário para o próximo passo de uma interação, além de trazer foco para elementos que precisam de atenção do usuário.

Figura 6: Exemplo de um movimento (animação) em que uma informação inicialmente é apresentada como um tópico e ao clicar ela amplia com o detalhamento da informação e ações (links)

Figura 6: Exemplo de um movimento (animação) em que uma informação inicialmente é apresentada como um tópico e ao clicar ela amplia com o detalhamento da informação e ações (links)

37Outros itens dos aspectos da tecnologia se referem a geolocalização, notificações por push, e relação com redes sociais. No primeiro item devem ser considerados aspectos que considerem a localização do usuário e do conteúdo oferecido. “É o próprio aplicativo que promove essa personalização, de acordo com o sensor de georreferenciação: pela localização do usuário, a interface do aplicativo exibe as notícias diretamente relacionadas com a região de onde se está acessando” (Palacios, Barbosa, Firmino & Cunha, 2014, p. 27). Para tal, são necessários sensores embutidos nos aparelhos: de um modo geral, os modelos de smartphone atuais contam com o barômetro, o magnetômetro/bússola e, sobretudo, o GPS. De modo complementar, considera-se que as conexões via wi-fi ou redes móveis também são atuantes, pois sistemas como o Android têm GPS assistido (aGPS), que obtém a localização aproximada do aparelho por meio das torres de telefonia celular e das redes wi-fi.

38No caso das notificações por push, buscam-se opções para que o usuário receba alertas sobre informações de seu interesse. Se antes era necessário ao usuário ir em busca de conteúdo por livre iniciativa (pull), com o jornalismo móvel este passa a chegar ao usuário por iniciativa alheia, na forma de avisos, alertas (push) (Fidalgo & Canavilhas, 2009). Existem aplicações que além de oferecer o serviço (ativar/desativar), permitem também a personalização dos assuntos e/ou frequência de envio.

39Em relação a redes sociais, identificam-se as possibilidades de integração com as redes sociais, tanto para captura de informação quanto para oferecer ao usuário a chance de compartilhar rapidamente o que deseje. Para Essenfelder e Rainieri nada caracteriza melhor os tempos atuais do que a ubiquidade das redes sociais na Internet e os cruzamentos possíveis entre elas: “pessoas, espaços e tecnologias estão o tempo todo hiperconectados. O conhecimento é individual, mas também coletivo, cruzado e compartilhado” (2015, p. 10):

A leitura das inclinações dos dispositivos e a geolocalização, quando cruzados com os comportamentos dos utilizadores nas redes sociais, por exemplo, possibilitam que a personalização dos conteúdos e serviços (Bardoel & Deuze, 2011) seja transportada para níveis dificilmente atingíveis com outro tipo de dispositivos. (Canavilhas, 2014a, p. 6)

40Seguindo para os Aspectos da Forma, temos: Personalização, Precisão, e Estética. O primeiro item se refere à possibilidade de definir quais conteúdos se quer visualizar. Por serem de caráter pessoal, individual, os dispositivos móveis tem potencial de personalização muito superior ao do computador, um equipamento possivelmente compartilhado. “Essa personalização deve considerar todos os elementos contextuais, como o local onde o consumidor se encontra, a hora, o tipo de atividade que desenvolve, suas preferências, etc.” (Canavilhas & Colussi, 2016, p. 206).

41Em Precisão considera-se a instantaneidade do acesso. Além de serem apresentadas com clareza, as informações não devem conter erros relacionados ao fator “tempo real”. Por fim, Estética é onde se enquadram itens relacionados à multimidialidade. Recursos visuais e imagéticos devem ser incorporados às informações e ao design.

42Finalmente, em Aspectos do Jornalismo Móvel temos: Hipertextualidade, Multimidialidade (convergência), Memória, e Interatividade. No primeiro se estudam as organizações aplicadas às informações (links, conexões) a fim de disponibilizar um aprofundamento do que se lê e/ou fatos relacionados, que possam ser de interesse do usuário. No segundo, para além do já visto item Estética, cuida-se para que não haja informação em excesso e/ou ambiguidades que deixem o conteúdo confuso.

43Em Memória são avaliadas as formas de conexão com o banco de dados da empresa ou com conteúdo apresentado anteriormente, para que a informação disponibilizada seja completada com informações prévias. Avalia-se também a possibilidade de busca dentro da aplicação. O último item a se considerar é a Interatividade, no qual se busca a capacidade intuitiva da aplicação, oferecendo feedback ao usuário de suas ações, sem necessidade de instruções de uso. As informações devem ser agrupadas de modo que atendam a interesses específicos de quem usa e devem captar sua atenção. A Tabela 3 traz a síntese do sistema classificatório desenvolvido e acima descrito.

Tabela 3: Sintetização do modelo de classificação desenvolvido para avaliar apps baseados em cards

Aspectos da Forma

Personalização

As informações devem ser expostas de forma equilibrada; Possibilidade de definir quais conteúdos quer visualizar

Precisão

As informações devem ser apresentadas com clareza e minimizar erros relacionados ao fator “tempo real”

Estética

As informações devem apresentar recursos visuais e imagéticos

Aspectos do Jornalismo Móvel

Hipertextualidade

As informações devem ser organizadas por meio do aprofundamento e do enfoque

Multimidialidade

As informações em excesso e com ambiguidades confundem o leitor

Memória

Conexão com o banco de dados da empresa ou com conteúdo apresentado anteriormente; possibilidade de busca

Interatividade

Interação entre o meio e os leitores nas instâncias de seleção, intervenção, e participação nos conteúdos

Aspectos da

Tecnologia Adotada

Geolocalização

As informações devem apresentar recursos visuais e imagéticos

Notificações por push

Envio de avisos automaticamente a partir da autorização do usuário

Relação com redes sociais online

Facilitação da possibilidade de compartilhar conteúdos com outros aplicativos sem necessariamente precisar sair do primeiro

Movimento

Animações relacionadas às formas; mostra como o app está organizado e o que ele pode fazer

44O sistema apresentado pode ser aplicado de diversas formas, e aqui recomendam-se três maneiras distintas:

  1. quanto à presença ou ausência dos itens avaliados. Neste caso, forma-se uma tabela semelhante à Tabela 3, adicionando apenas uma coluna denominada “presente” e outra denominada “ausente”, à direita. Após avaliação da aplicação, marca-se a opção encontrada;

  2. quanto ao nível de aplicação dos itens avaliados. De forma parecida à anterior, mas com três níveis de classificação: “implementado”, “parcialmente implementado”, ou “não implementado”;

  3. de forma discursiva livre, como fez Oliveira (2014). Neste caso não se trabalha com tabela, mas com o texto corrido no qual se descreve o comportamento observado, item a item. Toma-se como exemplo o modelo da autora para avaliar apps brasileiros para tablets: “os três aplicativos estão conectados à identidade visual dos demais suportes de suas organizações jornalísticas. O Diário Catarinense e o Estadão Noite são aplicativos modestos quando comparados ao aplicativo O Globo A Mais. Este, de fato, chama a atenção pelo espaço privilegiado ocupado pelas fotografias, vídeos, infográficos, ilustrações e animações” (Oliveira, 2014, p. 186).

Considerações finais

45Neste trabalho foi apresentada uma metodologia para a avaliação e sistematização de interfaces de aplicativos jornalísticos para dispositivos móveis baseadas em cartões ou cards. Vimos como a organização de informações em cartões remete a diversas formas no cotidiano, aplicando-se ao cenário mobile para apresentar conteúdo fragmentado, de forma ágil e visualmente agradável, dentre outras vantagens enumeradas.

46O espaço para disposição de conteúdo é pequeno nos celulares, mas com o movimento (animação) dos cards podemos usar camadas de informação. A animação em cards abriga mais conteúdo em subníveis de camadas. Essa forma de visualização favorece uma imersão em camadas de mídias, camadas de textos que no final das contas são agrupadas em novos cards. Por isso, optou-se por adicionar às categorias de análise propostas, derivadas de estudos prévios de Oliveira (2013), e Silveira (2016), um item relacionado ao Movimento. O uso efetivo destes movimentos merece atenção em trabalhos futuros, para se buscar novas formas de organização de conteúdos móveis.

47Reitera-se que o sistema de avaliação com fins metodológicos aqui descrito, baseado em componentes de interface de aplicativos jornalísticos, já teve um teste piloto, apresentado em Paulino e Empinotti (2017). A análise de três aplicações não encontrou a incorporação dos itens de Movimento, mas detalha a apropriação das demais categorias incluídas na proposta metodológica. Enfatizamos o uso dos cards como opção de interface móvel e recomendamos uma pesquisa mais aprofundada, que acompanhe a experiência do usuário na interação de movimentos com os cards, e que inclua testes com aspectos da forma e de elementos editoriais como textos, tipos de mídias, links e organização visual para verificar se o que está sendo desenvolvido atende as necessidades dos consumidores.

Topo da página

Bibliografia

Bardoel, J. & Deuze, M. (2001). Network journalism: converging competences of media professionals and professionalism. Australian Journalism Review, 23(2), 91-103.

Bardin, L. (1977). Análise de conteúdo. Lisboa: Edições 70.

Bertocchi, D. (2014). Dos dados aos formatos: o sistema narrativo no jornalismo digital. Comunicação apresentada no XXIII Encontro Anual da Compós, Belém.

Canavilhas, J. (2014). A reportagem paralaxe como marca de diferenciação da Web. In P. R. Rey & C. G. Pisonero (Eds.), Contenidos innovadores en la universidad actual (pp. 119-129). Nova Iorque: McGraw-Hill Education.

Canavilhas, J. & Colussi, J. (2016). Jornalismo em ambientes multiplataforma: diálogos convergentes. ÂNCORA-Revista Latino-Americana de Jornalismo, 3(1), 194-213.

Caregnato, R. & Mutti, R. (2006). Qualitative research: discourse analysis versus content analysis. Texto Contexto - Enferm., 15(4), 679-684. doi: http://dx.doi.org/10.1590/S0104-07072006000400017

Castellet, A. (2012). El ecosistema del contenido móvil: actores, líneas de evolución y factores de disrupción. Tese de Doutoramento, Universidad de Murcia, Murcia, Espanha. Retirado de https://dialnet.unirioja.es/servlet/tesis?codigo=95771

Cervo, A. L. & Bervian, P. A. (1983). Metodologia científica: para uso dos estudantes universitários. São Paulo: McGraw-Hill do Brasil.

Cybis, W. de A. (2003). Engenharia de usabilidade: uma abordagem ergonômica. Retirado de http://www.unicamp.br/~ihc99/Ihc99/AtasIHC99/AtasIHC98/Cybis.pdf

Fidalgo, A. & Canavilhas, J. (2009). Todos os jornais no bolso: pensando o jornalismo na era do celular. In C. Rodrigues (Ed.), Jornalismo on-line: modos de fazer (pp. 96-146). Rio de Janeiro: PUC Rio.

Gomes Filho, J. (2015). Gestalt do objeto: sistema de leitura virtual da forma. São Paulo: Escrituras Editora.

Mello, A. F. de, Pase, A. F., Goss, B. M., de Souza, D. R., Pellanda, E. C., dos Santos, F. F. & Sica, K. (2015). Jornalismo adaptado a novas telas: um estudo da linguagem jornalística nas novas interfaces móveis. In J. Canavilhas & I. Satuf, Jornalismo para dispositivos móveis: produção, distribuição e consumo (pp. 83- 102). Covilhã: Livros LabCom.

Newman, N., Fletcher, R., Kalogeropoulos, A., Levy, D. A. & Nielsen, R. K. (2017). Reuters Institute Digital News Report 2017. Retirado de https://reutersinstitute.politics.ox.ac.uk/sites/default/files/Digital%20News%20Report%202017%20web_0.pdf

Nielsen, J. (1993). Usability engineering. Boston: Academic Press.

Nielsen, J. (1995) 10 usability heuristics for user interface design. Retirado de http://www.nngroup.com/articles/ten-usabilityheuristics/

Nielsen, J. (2000). Projetando websites. Rio de Janeiro: Editora Campus.

Nielsen, J. (2011). iPad App and website usability. Retirado de https://www.nngroup.com/reports/ipad-app-and-website-usability/

Nielsen, J. & Budiu, R. (2014) Usabilidade móvel. Rio de Janeiro: Elsevier.

Oliveira, V. R. de (2013). Interfaces jornalísticas em tablets: o design digital da informação nos aplicativos móveis. Dissertação de Mestrado, Universidade Federal de Santa Catarina, Florianópolis, Brasil. Retirado de https://repositorio.ufsc.br/handle/123456789/122597

Palacios, M. (1999). O que há de (realmente) novo no jornalismo on-line. Conferência proferida por ocasião do concurso público para Professor Titular na FACOM/UFBA, Salvador, Bahia.

Palacios, M., Barbosa, S., Firmino, F. & Cunha, R. (2014). Aplicativos jornalísticos vespertinos para tablets. Cartografia do fenômeno ante o desafio de uma produção original e inovadora. Sur le journalisme About journalism Sobre Jornalismo, 3(2), 40-55.

Paulino, R. & Empinotti, M. (2017). Interatividade e visualização de notícias em apps: um design baseado em cards. Comunicação apresentada no 15 SBPJOR, São Paulo.

Pellanda, E. C., Pase, A. F., de Mello, A. F., da Silva, F. C. V., dos Santos, F. F. & da Cunha, K. S. (2015). Estudo sobre “Cards” como uma linguagem do jornalismo para um contexto de telas com diferentes funções. Contemporanea-Revista de Comunicação e Cultura, 13(1), 177-192.

Ramos, D. O. (2011). Formato, condição para a escrita do jornalismo digital de bases de dados: uma contribuição da semiótica da cultura. Tese de Doutoramento, Universidade de São Paulo, São Paulo, Brasil. Retirado de http://www.teses.usp.br/teses/disponiveis/27/27154/tde-23092011-180325/pt-br.php

Rodrigues, J. M., Pereira, J. A., Sardo, J. D., de Freitas, M. A., Cardoso, P. J., Gomes, M. & Bica, P. (2017). Adaptive card design UI implementation for an augmented reality museum application. Comunicação apresentada no International Conference on Universal Access in Human-Computer Interaction, Vancouver, Canadá.

Saffer, D. (2006). Designing for interation. Creating innovative applications and devices. São Francisco: New Riders Publishing.

Silva, F. F. da. (2013). Jornalismo móvel digital: uso das tecnologias móveis digitais e a reconfiguração das rotinas de produção da reportagem de campo. Tese de Doutoramento, Universidade Federal da Bahia, Salvador, Brasil. Retirado de https://repositorio.ufba.br/ri/handle/ri/13011

Silveira, S. (2016). Design de conteúdos jornalísticos pervasivos: o formato da narrativa digital móvel. Comunicação apresentada no XXXIX Congresso Brasileiro de Ciências da Comunicação, São Paulo.

Topo da página

Notas

1 Retirado de https://reutersinstitute.politics.ox.ac.uk/sites/default/files/Digital%20News%20Report%202017%20web_0.pdf

2 Retirado de https://dados.media/-!/view/CATEGORY/DIGITAL_MEDIA/MDB_DIG_MOBILE_PENETRACAO_RKG_MULTIPLATAFORMA

3 Orientações para o uso dos cards. Retirado de https://material.io/guidelines/components/cards.html

4 Um ambiente pervasivo, segundo Burgos citado em Silveira (2016), faz com que os conteúdos precisem transitar por interfaces responsivas de tablets e celulares, dispositivos wearables ou vestíveis (como relógios inteligentes ou produtos que estejam ligados à lógica da Internet das coisas), carros conectados, vitrines, entre outros. Isso quer dizer que a informação transita em sistemas midiáticos híbridos que estão sendo utilizados por consumidores mais participativos e envolvidos no processo de produção, consumo e distribuição.

Topo da página

Índice das ilustrações

Título Gráfico 1: Gráfico mostra a ascensão do uso do celular no consumo de notícias (a) e queda no uso de televisão e impresso como fontes noticiosas (b)
Créditos Fonte: Adaptado de Newman, Fletcher, Kalogeropoulos, Levy, & Nielsen, 2017
URL http://journals.openedition.org/cs/docannexe/image/369/img-1.jpg
Ficheiro image/jpeg, 56k
Título Figura 1a: Interface do Facebook
Créditos Fonte: Reprodução Facebook
URL http://journals.openedition.org/cs/docannexe/image/369/img-2.png
Ficheiro image/png, 1,2M
Título Figura 1b: Interface do Google+
Créditos Fonte: Reprodução Google+
URL http://journals.openedition.org/cs/docannexe/image/369/img-3.png
Ficheiro image/png, 3,6M
Título Figura 2a: Interface do Tinder
Créditos Fonte: Reprodução Tinder
URL http://journals.openedition.org/cs/docannexe/image/369/img-4.png
Ficheiro image/png, 2,4M
Título Figura 2b: Interface do Tinder
Créditos Fonte: Reprodução Tinder
URL http://journals.openedition.org/cs/docannexe/image/369/img-5.png
Ficheiro image/png, 1,1M
Título Figura 3a: Interface do Google
Créditos Fonte: Reprodução Google
URL http://journals.openedition.org/cs/docannexe/image/369/img-6.jpg
Ficheiro image/jpeg, 100k
Título Figura 3b: Interface do mecanismo de busca do Google
Créditos Fonte: Reprodução Google
URL http://journals.openedition.org/cs/docannexe/image/369/img-7.jpg
Ficheiro image/jpeg, 288k
Título Figuras 4a e 4b: Cards com tamanhos diferentes, mas formatos semelhantes
Legenda Lei da Gestalt (a) e layout de card com áreas para mídias, textos e links (b)
Créditos Fonte: Adaptado de Paulino & Empinotti, 2017
URL http://journals.openedition.org/cs/docannexe/image/369/img-8.png
Ficheiro image/png, 216k
Título Figura 5a e 5b: Cards em interface de mesa (a) e mobile (b)
Créditos Fonte: Reprodução The Verge
URL http://journals.openedition.org/cs/docannexe/image/369/img-9.png
Ficheiro image/png, 5,0M
Título Figura 6: Exemplo de um movimento (animação) em que uma informação inicialmente é apresentada como um tópico e ao clicar ela amplia com o detalhamento da informação e ações (links)
URL http://journals.openedition.org/cs/docannexe/image/369/img-10.jpg
Ficheiro image/jpeg, 28k
Topo da página

Para citar este artigo

Referência do documento impresso

Rita de Cássia Romeiro Paulino e Marina Lisboa Empinotti, «Proposta metodológica para avaliação de aplicativos jornalísticos baseados em cards»Comunicação e sociedade, 33 | 2018, 311-328.

Referência eletrónica

Rita de Cássia Romeiro Paulino e Marina Lisboa Empinotti, «Proposta metodológica para avaliação de aplicativos jornalísticos baseados em cards»Comunicação e sociedade [Online], 33 | 2018, posto online no dia 29 junho 2018, consultado o 13 janeiro 2026. URL: http://journals.openedition.org/cs/369

Topo da página

Autores

Rita de Cássia Romeiro Paulino

Rita de Cássia Romeiro Paulino é Professora Doutora Titular do Departamento de Jornalismo da Universidade Federal de Santa Catarina (UFSC) e do Programa de Pós Graduação em Jornalismo da mesma universidade.
E-mail: rcpauli[at]gmail.com – Morada: Rua Estilac Leal, 129 bloco C h105, Florianópolis – Brasil – 88080760

Marina Lisboa Empinotti

Marina Lisboa Empinotti é jornalista e Mestre em Jornalismo pela Universidade Federal de Santa Catarina (UFSC), Brasil. É doutoranda em Estudos de Comunicação - FCT na Universidade da Beira Interior (UBI).
E-mail: marinaempinotti[at]gmail.com – Morada: Estrada da Circunvalação, 7762E h23, Porto – Portugal – 420-162

Topo da página

Direitos de autor

CC-BY-NC-4.0

The text only may be used under licence CC BY-NC 4.0. All other elements (illustrations, imported files) may be subject to specific use terms.

Topo da página
Pesquisar OpenEdition Search

Você sera redirecionado para OpenEdition Search