Upload
patricia-prado
View
1.439
Download
4
Embed Size (px)
DESCRIPTION
Para desenvolver a interface de uma infografia que mostre graficamente o índice de poluição das praias de Santa Catarina explanou-se sobre a história da infografia e sua transição para o meio digital. Ao percorrer o caminho trilhado pela transição, foi verificada a possibilidade de linguagens, visualização de dados, conceitos de navegação e usabilidade. Por fim, foram apresentadas algumas ferramentas possíveis para a construção e aplicação de uma interface.
Citation preview
SISTEMA BARDDAL DE ENSINO FACULDADE BARDDAL DE ARTES APLICADAS
CURSO DE DESENHO INDUSTRIAL PROJETO DE PRODUTO E PROGRAMAÇÃO VISUAL
PATRICIA PRADO
DESIGN DE INFORMAÇÃO: INTERFACE WEB PARA INFOGRÁFICO SOBRE
BALNEABILIDADE NO ESTADO DE SANTA CATARINA
FLORIANÓPOLIS 2012
2
PATRICIA PRADO
DESIGN DE INFORMAÇÃO: INTERFACE WEB PARA INFOGRÁFICO SOBRE
BALNEABILIDADE NO ESTADO DE SANTA CATARINA
Trabalho de Conclusão de Curso apresentado como requisito à obtenção do título de bacharel em Desenho Industrial – Programação Visual das Faculdades Barddal. Orientador: Raphael Augustus
FLORIANÓPOLIS
2012
3
PATRICIA PRADO
INTERFACE WEB PARA INFOGRÁFICO SOBRE BALNEABILIDADE NO ESTADO DE SANTA CATARINA
Este Trabalho de Conclusão de Curso foi julgado adequado como requisito para obtenção do grau de bacharel em Desenho Industrial – Programação Visual e aprovado em sua forma final pelo Curso de Graduação em Desenho Industrial, da Faculdade Barddal de Artes Aplicadas.
Florianópolis, 2 de dezembro de 2012.
_______________________________________________ Dulce América de Souza
Prof. Coordenadora do Curso de Desenho Industrial
_______________________________________________ Tatiane Passos
Prof. Coordenador de TCC – Presidente da banca examinadora
_______________________________________________ Carlos Eduardo Senna
Prof. Examinador 1
_______________________________________________ Juliana Silveira Anselmo
Prof. Examinador 2
_______________________________________________ Rafael Augustus Pacheco
Prof. Orientando
4
RESUMO
Para desenvolver a interface de uma infografia que mostre graficamente o índice de
poluição das praias de Santa Catarina explanou-se sobre a história da infografia e sua transição
para o meio digital. Ao percorrer o caminho trilhado pela transição, foi verificada a
possibilidade de linguagens, visualização de dados, conceitos de navegação e usabilidade. Por
fim, foram apresentadas algumas ferramentas possíveis para a construção e aplicação de uma
interface.
Palavras-chave: design de informação, infografia interativa, base de dados, interativida-
de, interface, visualização de dados, balneabilidade.
5
ABSTRACT
To develop an interface of a computer graphics that show graphically the state of pollu-
tion of the beaches of Santa Catarina expounded by the history of computer graphics and its
transition to digital media. However, go up the path trodden by the transition and, therefore,
there was the possibility of languages, data visualization, the concepts of navigation and
usability. Finally, some possible tools are presented for the construction and implementation of
an interface.
Keywords: information design, interactive computer graphics, databases, interactivity,
interface, data visualization, bathing.
6
LISTA DE ILUSTRAÇÕES
Figura 1. Infografia simples.
Figura 2. Representação geográfica e humana.
Figura 3. Ilustração e mapas.
Figura 4. Infográfico: acidente do Titanic.
Figura 5. Versão do aniversário de cem anos do naufrágio do Titanic.
Figura 6. Versão antiga do naufrágio do Titanic.
Figura 7. Gráfico de comparação.
Figura 8. Gráfico de comparação das eleições de 2008 nos EUA.
Figura 9. Visualização de dados do Gapminder.
Figura 10. Primeiro mapa historicamente registrado.
Figura 11. “A criação de Adão”, Michelangelo.
Figura 12. “Última Ceia”, Leonardo da Vinci.
Figura 13. Infografia de Michael van Langren’s.
Figura 14. Infografia de Michael van Langren’s.
Figura 15. A morte de Blight.
Figura 16. Fotografias de Eadweard Muybridge.
Figura 17. Fases da transição da infografia impressa para online.
Figura 18. Vôo 3054.
Figura 19. A guerra do século 20.
Figura 20. Ferramentas de visualização de dados
Figura 21. Ferramentas de visualização de dados.
Figura 22. Max Plank Institute.
Figura 23. Processo de formação de um bom infográfico.
Figura 24. Sketch de um infográfico no workshop do Malofiej 20.
Figura 25. Unificação.
Figura 26. Leis da Gestalt.
Figura 27. Elementos da forma.
Figura 28. Elementos da forma com textura.
Figura 29. Suástica.
Figura 30. Modos de Implantação X Variáveis Visuais X Níveis de Organização.
7
Figura 31. Ferramenta do Google aplicada em infográfico do New York Times.
Figura 32. Grupo de ferramentas do Google.
Figura 33. Fragmentação e minimalismo na informação.
Figura 34. Teste visual.
Figura 35. Mapa antigo do metrô de Londres.
Figura 36. Plano do metrô de Londres por Henry Beck, 1933.
Figura 37. Tríade de Pierce.
Figura 38. Desmembramento do signo.
Figura 39. Comparação de uso na web.
Figura 40. Cognição durante a navegação.
Figura 41. Sistema de navegação principal.
Figura 42. Comparação de uso na web.
Figura 43. Tela inicial da infografia.
Figura 44. Navegabilidade e estética aplicadas em uma infografia.
Figura 45. Tela inicial da infografia.
Figura 46. Imagem de um trecho do vídeo.
Figura 47. Tela inicial da linha do tempo.
Figura 48. Trecho do vídeo sobre design de informação.
Figura 49. Distorções que podem aparecer em um mapa.
Figura 50. Trecho da entrevista com Erik Spiekermann.
Figura 51. Primeira fase da transição da infografia.
Figura 52. Visualização da Agenda Survey 2011.
Figura 56. Profile de Hans Rosling no TED.
Figura 57. Visualização de dados do Gapminder.
Figura 58. Processo criativo da arquitetura da informação utilizada pela Magel.
Figura 59. NYT Labs.
Figura 60. Max Plank Institute.
Figura 61. Trecho do vídeo The fundamental elements of design.
Figura 63. Infográfico do jornal ZH sobre a Segunda Guerra.
Figura 64. Contextualização visual dos métodos da infografia impressa.
Figura 65. Relatório online da balneabilidade.
Figura 66. Informação líquida.
Figura 67. Showcase de quatro tipos de configuração do Gmaps.
Figura 68. Showcase de gráficos de bolhas.
8
Figura 69. Bubble Chart com diferenciação de cores.
Figura 70. Esboço e finalização de layout.
Figura 71. Ferramenta Kuler.
Figura 72. Diagrama de estudo tipográfico.
Figura 73. Ícones do Google.
9
LISTA DE SIGLAS
AV: Ambiente Virtual.
BD: Banco de Dados.
DI: Design de Informação.
IHC: Interação Homem-computador.
SBDI: Sociedade Brasileira do Design de Informação.
TI: Tecnologia da Informação.
TICs: Tecnologia da Informação e Comunicação.
10
SUMÁRIO 1. INTRODUÇÃO ........................................................................................................ 12
1.1. PROBLEMÁTICA .............................................................................................. 123
1.2. OBJETIVOS .......................................................................................................... 13
1.2.1. Objetivo Geral ...................................................................................................... 13
1.2.2. Objetivos Específicos ........................................................................................... 13
1.3. JUSTIFICATIVA .................................................................................................. 13
1.4. METODOLOGIA DA PESQUISA ...................................................................... 14
1.5. ESTRUTURAÇÃO DO TRABALHO ................................................................. 14
2. FUNDAMENTAÇÃO TEÓRICA ........................................................................... 15
2.1. INFOGRAFIA ....................................................................................................... 15
2.1.1. História ................................................................................................................. 25
2.2. TRANSIÇÃO E CONVERGÊNCIA DE MÍDIAS ............................................. 31
2.3. FACES DO DESIGN ............................................................................................. 38
2.3.1. Princípios básicos do design gráfico .................................................................... 39
2.3.2. Visualização da informação com bases de dados ................................................. 47
2.3.3. Interpretação da informação ................................................................................. 49
2.4. COGNIÇÃO APLICADA À ARQUITETURA DA INFORMAÇÃO .............. 56
3. REFERENCIAIS DE PROJETO ............................................................................ 65
3.1. A bateria da Grande Rio ......................................................................................... 65
3.2. Behavioural Dynamics Institute ............................................................................ 65
3.3. Brasília 50 anos ....................................................................................................... 66
3.4. Design de informação .............................................................................................. 67
3.5. Diagramming/Mapping (complex) information: Theory and Practice .................... 68
3.6. El periodista y los mapas ......................................................................................... 68
3.7. Entrevista com Erik Spiekermann ........................................................................... 69
3.8. Estadão: O vírus da gripe suína ............................................................................... 70
3.9. Global Agenda Survey 2011 .................................................................................... 70
3.10. Hans Rosling: profile on TED.com ....................................................................... 71
3.11. Hotsite Brasília 50 anos: como foi construído ....................................................... 72
3.12. Map of New York City Police Stops: Interactive Feature ..................................... 73
3.13. Max Planck Research Networks ............................................................................ 74
3.14. Palestra de Moritz Stefaner .................................................................................... 75
11
3.15. The Fundamental Elements of Design ................................................................... 75
3.16. Zero Hora: Especial Segunda Guerra .................................................................... 75
4. METODOLOGIA DE PROJETO .......................................................................... 77
4.1. Briefing/Pauta .......................................................................................................... 80
4.2. Apuração e levantamento de dados ......................................................................... 81
4.3. Arquitetura de informação ....................................................................................... 82
4.4. Interface ................................................................................................................... 83
4.5. Legibilidade ............................................................................................................. 85
4.5.1. Estudo de cores .................................................................................................... 85
4.5.2. Estudo de tipografia .............................................................................................. 86
4.5.3. Estudo iconográfico .............................................................................................. 87
4.6. Análise heurística ................................................................................................... 87
5. CONSIDERAÇÕES FINAIS ................................................................................... 89
REFERÊNCIAS ............................................................................................................ 90
12
1. INTRODUÇÃO
Desde a concepção do computador pessoal e da inserção da tecnologia na vida cotidiana
das pessoas, muitos parâmetros culturais, sociais, organizacionais e até institucionais vem se
transformando e se adaptando a essa realidade. Essa nova identidade está em processo de
construção. As pessoas ainda estão aprendendo a se envolver nesse universo rico em
informação e, ao mesmo tempo, aprendendo selecionar o que é mais relevante.
Na administração e organização da informação na forma convencional, em meio impresso
ou offline, é de responsabilidade do designer ou artista gráfico a conversão da informação
textual em informação visual, e realizar o que é chamado de infografia.
Essa nomenclatura vem sendo discutida dentro do universo online. Alguns autores
chamam de infografia online, infografia animada, infografia interativa, design de informação
(DI), ou simplesmente infografia – termo que será utilizado neste trabalho.
Em um primeiro momento, a infografia passou por uma transposição, ou seja, migrou do
offline para o online levando apenas o conteúdo estático e usando poucos recursos multimídia,
como, por exemplo, vídeo, áudio e galeria de fotos. Atualmente, a infografia ultrapassou esses
limites e está sendo trabalhada junto à área de Tecnologia da Informação (TI), utilizando
cruzamento de dados. Com esse recurso, a infografia ganha mais significância e perenidade, ou
seja, passa a interpretar dados enviados pelo usuário ou leitor. Torna-se, assim, uma ferramenta
estatística de avaliação e interpretação de dados.
Com esse novo formato da infografia, é possível perceber uma forma não linear de
apresentar e consultar a informação. Os vínculos e o acréscimo de informação realizados pelo
usuário criam uma rede de associações inteligentes. Assim, o usuário pode desenvolver o
próprio percurso e a forma de divulgar uma informação.
A partir dessas rápidas observações, percebe-se uma oportunidade de trabalhar a
infografia online com um material que sempre está sempre à disposição da população - o
relatório de balneabilidade oferecido pela Fundação do Meio Ambiente (FATMA), que oferece,
em tabelas, a informação sobre a poluição das praias do litoral catarinense. Nota-se que tal
material é rico em informação, mas, em contrapartida, possui uma leitura lenta.
Atualmente, o jornal Diário Catarinense possui uma versão que já melhora a visualização
das informações, mas a interface utilizada tem uma visão estática da infografia, e não se alcança
o cruzamento de dados. Portanto, busca-se melhorar a visualização das informações por meio de
uma interface que comporte informações dinâmicas. Com isso, é possível criar, visualmente,
um índice mensal, semestral ou anual do estado de poluição das praias catarinenses.
13
1.1 PROBLEMÁTICA
Como criar uma interface gráfica que atenda aos requisitos de infografia online e
interprete os dados oferecidos pela FATMA, que mostram o índice de poluição das praias do
litoral de Santa Catarina?
1.2 OBJETIVOS 1.2.1 Objetivo Geral
Desenvolver uma interface gráfica para um infográfico online sobre a balneabilidade. 1.2.2 Objetivos Específicos
Traduzir os sentidos cognitivos de visualização de uma informação estatística;
Compreender a abstração da informação em formas visuais;
Fundamentar o comportamento da informação verbal em visual;
Desenvolver uma interface gráfica para uma infografia.
1.3 JUSTIFICATIVA
Com o foco cada vez mais voltado ao usuário, torna-se necessário um estudo dos
conceitos de infografia e comunicação, uma vez que a plataforma que leva a informação é outra
- o papel não é mais a principal plataforma de divulgação e disseminação da informação,
chamada no meio jornalístico de hard news. A agilidade com que a informação chega ao
receptor é muito maior. Atualmente, há uma linha crescente nas plataformas portáteis, como
telefone, tablets, notebooks, entre outras.
Machado (2007) alega que o design de interface tende a explorar o conhecimento do
usuário com bases de dados, ou seja, as bases servem para guardar informações enviadas pelos
usuários de um sistema. Na mesma visão, Machado afirma também que as bases ajudam a
compor uma nova ferramenta para outros modelos e formatos de narrativas multimídias. Além
disso, oferecem uma interface tipificada e espaço navegável que permite explorar, compor,
recuperar e interagir com a narrativa.
Portanto, busca-se compreender como a infografia pode facilitar a compreensão de dados
e atribuir valor informacional a estes, explorando a conexão da rede como forma de chegar a um
novo caminho de visualização de dados estatísticos.
14
1.4 METODOLOGIA DA PESQUISA
Ao focar as especificidades da infografia, esta pesquisa é definida como qualitativa, de
caráter exploratório delineado por meio de um levantamento bibliográfico. Com o estudo
exploratório é possível averiguar os novos conceitos e formatos que poderão atender às
necessidades do projeto, identificando, assim, o estado atual da infografia. Este trabalho é
embasado em pesquisa bibliográfica, com consulta a fontes relevantes ao tema que auxiliem não
só na coleta de dados, mas principalmente na reflexão concomitante à pesquisa exploratória e
aos estudos de caso. Nesta primeira etapa, os estudos de caso serão imprescindíveis para o
desenvolvimento da segunda etapa, que contará com a elaboração do design de interface para
um infográfico dinâmico. 1.5 ESTRUTURAÇÃO DO TRABALHO
O primeiro capítulo deste trabalho contempla uma visão geral da evolução da infografia e
da convergência de mídias - pontos de divergência e convergência, além dos benefícios da
agilidade trazida pelas plataformas portáteis.
O segundo capítulo traz um estudo aprofundado da infografia, e faz referência ao estado
da arte e à linguagem visual que tornam possível o desenvolvimento da interface de um
infográfico.
No desenvolvimento do terceiro capítulo, o foco será a análise do desenvolvimento de um
design baseado em dados: como se formula, desenvolve e conclui a partir da experiência de
autores que já estão se dedicando à infografia.
Já o quarto capítulo é direcionado para a metodologia do projeto gráfico, avaliando a
melhor cartografia, visualização e demonstração de gráficos sob a nova ótica da infografia. Esta
análise inclui elementos gráficos e tipografias que possuem melhor comunicação dentro do
ambiente virtual. Assim, direciona-se para uma melhor solução visual no desenvolvimento da
interface, usando os conceitos absorvidos pelos estudos acadêmicos.
No quinto capítulo concluem-se os conceitos e, desta forma, o desenvolvimento dos
estudos teóricos sobre infografia.
15
2. FUNDAMENTAÇÃO TEÓRICA
2.1 INFOGRAFIA
A infografia é muito utilizada em periódicos para a construção de diagramas ou
organogramas de informações. Cairo (2008) afirma que a infografia tem o objetivo de
organizar, estruturar e exemplificar visualmente qualquer tipo de informação, transmitindo a
mensagem de uma maneira didática e concisa.
A linguagem visual de um infográfico, segundo Silva (2010, p.16), “é o referente
principal da infografia e sua finalidade de comunicação, portanto, cabendo como argumento
estético”. Desta forma, pode-se compreender linguagem visual, segundo Dondis (1997, p.7),
examinando “elementos visuais básicos, as estratégias e opções das técnicas visuais, as
implicações fisiológicas da composição criativa e a gama de meios e formatos.” William (2010,
p.9) afirma que é uma linguagem não-verbal, analógica, habilitada a oferecer taxas
informacionais elevadas a partir da constituição de seus elementos.
A figura 1 mostra uma forma simples de infografia. Não traz nenhum texto explicativo e
passa a informação apenas com signos e numerais que mostram a sequência a ser seguida. Este
infográfico utiliza conceitos que a linguagem verbal teria que argumentar muito para alcançar.
Figura 1. Infografia simples.
Fonte: Google images. Disponível em http://bit.ly/AbzkPx. Acesso em 25/01/2012.
Cairo (2008, p.21) fundamenta que um “infográfico não tem porque incluir palavras
necessariamente. Em alguns casos, o texto de acompanhamento ou explicação não é necessário,
e pode mesmo impedir o entendimento do conteúdo.”
16
Segundo Sartre apud Émille Peillaube (2009, p.33): “As imagens são necessárias à formação dos conceitos, não há um único conceito que seja inato. A abstração tem precisamente por objetivo, em sua função original e geradora do inteligível, elevar-nos acima da imagem e permitir-nos pensar seu objeto sob uma forma necessária e universal. Nosso espírito não pode conceber diretamente outro inteligível senão o inteligível abstrato, e o inteligível abstrato só pode ser produzido da imagem e com a imagem pela atividade intelectual. Toda matéria suscetível de ser explorada pela inteligência é de origem sensorial e imaginativa...”
A composição de uma abstração inteligível pode ser um diagrama ou um mapa que
representa uma área geográfica e que dispensa detalhes não relevantes para a compreensão de
uma mensagem. Segundo Cairo (2008, p. 22), “um gráfico estatístico representa uma série
numérica e uma ilustração, uma representação abstrata de objetos físicos”.
A representação abstrata, segundo Costella, pode tornar-se uma composição semântica de
conceitos que são convencionados dentro de uma sociedade. “A escrita pictográfica consistiu na representação desenhada de objetos concretos, figuras de animais, etc., formando em sucessão, um relato coerente. Gradualmente, alguns destes sinais tomaram um sentido convencional e passaram a designar conceitos abstratos, tornando-se ideogramas. Em outros sistemas, acresceram-se as sílabas que, articuladas, formaram palavras e, por fim, surgiram as letras, isto é, os sinais alfabéticos que, correlacionando com fidelidade à escrita e à voz humana, representaram graficamente a fala.” (COSTELLA:2002, p. 14)
Como continuidade ao mesmo argumento de Silva, Bourdieu afirma que as
representações de sinais tornam-se símbolos e que esses símbolos: [...] “são os instrumentos por excelência da integração social: enquanto instrumentos de conhecimento e decomunicação, eles tornam possível o consensus acerca do sentido do mundo social e contribuem fundamentalmente para a reprodução da ordem social: a integração lógica é a condição da integração moral.”
Com isso, percebe-se que a abstração pode mostrar caminhos, transparecer ideias, criar
vínculos, atribuir valores, compor harmonia a partir de uma partitura, como na música. Os
símbolos podem assumir diversas formas, desde que a principal função, ou significação, não
seja mistificada e, sim, que o conceito seja pleno de significados.
Passos e Moura (2007) analisam a abstração por meio da aglutinação de dados
informacionais quando argumentam sobre como a informação deve ser encaminhada: [...] o tratamento da informação pode se dar pelo processo de agrupamento das informações semelhantes, e seus acessos devem ser configurados de acordo com as características almejadas pelos usuários e suas forma de navegação.” (PASSOS E MOURA: 2007, p.1)
Ou seja, é possível notar que a abstração da informação pode acontecer por meio da
aglutinação ou agrupamento de dados semelhantes e que contenham as mesmas características.
Assim, pode-se analisar a figura 2: a abstração está na representação do corpo humano. A
silhueta de um corpo é utilizada para exemplificar a estatura dos jogadores e, caso não houvesse
17
os números mostrando a altura de cada jogador, ainda assim, seria possível perceber qual é o
mais alto. Outro item para se analisar é a área geográfica onde é mostrado o local de origem de
cada jogador.
Figura 2. Representação geográfica e humana.
Fonte: Jornal ANotícia.Publicado 6 de Junho de 2010.
Lévy amplia o entendimento, e inclui os símbolos em uma sociedade analisando os
sistemas de símbolos de uma cultura, quando afirma: “É impossível exercermos nossa inteligência independentemente das línguas, linguagens e sistemas de signos (notações científicas, códigos visuais, modos musicais, simbolismos) que herdamos através da cultura e que milhares ou milhões de outras pessoas utilizam conosco. Essas linguagens arrastam consigo maneiras de recortar, de categorizar e de perceber o mundo, contêm metáforas que constituem outros tantos filtros daquilo que é dado e pequenas máquinas de interpretar, carregam toda uma herança de julgamentos implícitos e de linhas de pensamento já traçadas. As línguas, as linguagens e os sistemas de signos induzem nossos funcionamentos intelectuais: as comunidades que os forjaram e fizeram evoluir lentamente pensam dentro de nós. Nossa inteligência possui uma dimensão coletiva considerável porque somos seres de linguagens.” (Lévy: 2011, p.97)
Como se observa nos exemplos de infografia, mostrado anteriormente, percebe-se que
utilizar abstração de símbolos ou imagens pode representar objetos ao narrar fatos históricos,
uma linha do tempo ou a ordem cronológica de algum acontecimento, mostrar dados gráficos,
localizar situações, comparar informações graficamente.
18
Enfim, a infografia pode ter diversas faces e, segundo Rodrigues (2009, p.23), “consiste
em utilizar ferramentas visuais como mapas, tabelas, desenhos, ilustrações, legendas,
combinadas com texto no intuito de transmitir ao leitor informações de fácil compreensão”. Em
contrapartida, Cairo (2008, p.21) afirma que é uma representação diagramacional de dados e
Sancho (2000, p.21) assume uma definição mais extensa: “é um comportamento informativo, realizado com elementos icônicos e tipográficos, que facilitam a compreensão dos acontecimentos, ações ou fatos da atualidade com alguns aspectos mais significativos, e acompanha ou substitui o texto informativo.”
Com uma concepção mais jornalística, Silva (2010, p.7) afirma que “qualquer informação
apresentada em forma de diagrama, isto é, desenho no quais se mostram as relações entre as
diferentes partes de um conjunto ou sistema, é uma infografia.”
Na figura 3 pode-se observar que as imagens também seguem a ideia de abstração sem
perder o foco no que realmente interessa e, assim, destacam pontos que são mais importantes.
Analisando os pormenores, percebe-se que as conchas da draga estão apresentadas em estágios
diferentes de uma forma abstrata, pois o desenho apenas representa o objeto verdadeiro, mas
que contém muito mais detalhes.
Figura 3. Ilustração e mapas.
Fonte: Jornal ANotícia.
O mapa de localização é outro ponto que pode ser analisado, pois mostra apenas as linhas
limítrofes e o ponto onde será feito o porto. Observa-se a falta das características básicas de
19
dados cartográficos que Loch (2006) apresenta, como, por exemplo, escala, projeção e
simbolismo. Dessa forma, apresenta apenas localização e abstração.
Com isso, pode-se perceber que as outras informações não são relevantes para o
entendimento do esquema, porém, não há nome da cidade nem o significado da marcação em
amarelo e da linha em vermelho. São informações aparentes, mas sem sentido.
Portanto, a infografia, segundo Passos e Moura apud Moura (2003a, p. 252), “envolve a
organização das informações e o planejamento da maneira como os usuários as encontrarão, o
que caracteriza um projeto de estrutura e acesso”.
A Sociedade Brasileira de Design da Informação (SBDI), em declaração disponível no
site oficial, disponibiliza uma visão de infografia que entra no contexto digital e na interface: “é uma área do design gráfico que objetiva equacionar os aspectos sintáticos, semânticos e pragmáticos que envolvem os sistemas de informação através da contextualização, planejamento, produção de interface gráfica da informação junto ao seu público alvo. Seu princípio básico é o de otimizar o processo de aquisição da informação efetivado nos sistemas de comunicação analógicos e digitais”.
Em um plano virtual, os infográficos podem apresentar uma notícia com outros recursos
linguísticos. Segundo William (2010), esse processo se chama hibridismo, ou seja, no caso do
offline: fotos, ícones, gráficos, pictogramas, etc. No online, gráficos interativos, murais, fotos,
vídeos, áudios, jogos, entre outros. No mesmo prisma, SILVA (2010 p.7) afirma: “Os infográficos baseiam-se na representação da notícia a partir de elementos icônicos, ou seja, referente às imagens, constituindo-se do hibridismo de outros ingredientes da prática do jornalismo, tais como a fotografia, o desenho e o texto.”
Um infográfico pode apresentar, tanto no meio impresso quanto no meio virtual, diversos
estilos, e Silva (2011, p.37) aponta alguns: “Diagrama descritivo: “possibilita uma avaliação mais minuciosa de um acontecimento por parte do leitor em razão dos recursos como vistas de corte, análise passo a passo ou descrição tópica dos componentes e detalhes.” Processos: que mostra uma reação em cadeia ou etapas de um projeto. Arquitetônico: tem por função mostrar o espaço de algum lugar. Gráficos: administra visualmente números estatísticos e comparativos.”
Na figura 4, é apresentado o naufrágio do Titanic e, é possível observar cada estilo
apresentado por Silva - há um diagrama descritivo, onde apresentam os principais detalhes do
navio e os pontos mais importantes. Os processos apontam os momentos antes, durante e depois
do acidente e as horas de resgate, e a tabela gráfica mostra o número de sobreviventes.
Analisa-se, nesse infográfico, que com a complexidade e a quantidade de dados, a sintaxe
e o planejamento das informações foram desempenhados com minúcia, pois se consegue
absorver e digerir visualmente todas as informações, sem que nenhuma atrapalhe a outra.
20
Neste ponto, é interessante ressaltar a colocação de Cairo (2008, p. 32): “a infografia é
uma ferramenta que reduz a complexidade da informação”. Nesses termos, pode-se imaginar a
dificuldade que seria explicar, na forma escrita e rapidamente, toda a gama de informações
apresentada no infográfico.
Figura 4. Infográfico: acidente do Titanic.
Fonte: Fábio Abreu
Nesse infográfico, é possível observar um mapa que localiza o naufrágio, as cidades onde
o navio esteve e o destino final. Além disso, também é representado o trajeto do navio que
afundou e o trajeto que o navio de resgate fez, mostrando, ainda, a cidade para onde foram
levados os sobreviventes.
Percebe-se que podem existir muitos estilos na representação e visualização de
informações. Por exemplo, a representação por meio de mapas geográficos, demonstrados no
naufrágio do Titanic, é traduzida por Cairo (2008) para a realidade dos infográficos em um
discurso sobre dados cartográficos, localização, escalas. O autor afirma que “a origem da
21
representação visual de informação se encontra na ideia de mapa, entendida de maneira ampla
como representação esquemática de relações entre elementos, geralmente geográficos.”
Esses mesmos elementos podem ser observados em infográficos no ambiente virtual,
porém, neste caso, apresentam outros mecanismos sensoriais, como interação, interface,
movimentos e áudio, apresentados por Passos e Moura, William, SBDI, entre outros autores
comentados anteriormente e que ainda terão questões aprofundadas no decorrer deste trabalho.
No entanto, é possível notar que as estruturas de construção de um infográfico também são
utilizadas no ambiente virtual, como nos infográficos feitos pela Veja online, e reproduzidos nas
figuras 5 e 6, que contam a história do naufrágio, utilizando a mesma base da figura 4.
Figura 5. Versão do aniversário de cem anos do naufrágio do Titanic.
Fonte: Veja online. Disponível em http://bit.ly/LxHlUr. Acesso em 20/04/2012.
Figura 6. Versão antiga do naufrágio do Titanic.
Fonte: Veja online. Disponível em http://veja.abril.com.br/historia/titanic/info/. Acesso em 20/04/2012.
22
Nesse infográfico, observa-se que existe um mapa, cronologia e demonstrações de como
era o navio e de onde se partiu. A particularidade no ambiente virtual é o acesso à galeria de
fotos e a vídeos, entre outros recursos.
Já na figura 7, mais um estilo de infografia - a comparação entre o republicando John
McCain e o democrata Barack Obama, candidatos a eleição presidencial do EUA em 2008. Os
gráficos comparam a diferença entre os candidatos na disputa, analisando o número de votos de
cada colégio eleitoral, que é composto por delegados.
Figura 7. Gráfico de comparação.
Fonte: A Notícia.
O jornal Publico, em Portugal, apresentou um infográfico na internet que priorizou o
mapa dos EUA com os respectivos estados, colocando a comparação entre os candidatos em
segundo patamar. Na figura 8, pode-se observar o mapa na totalidade – nota-se que a interface
esconde os dados de comparação entre o candidato que venceu e o que perdeu a eleição
23
americana. Com a seleção realizada, o comparativo é apenas do estado e não apresenta o
resultado do país inteiro. Assim, expõe outra forma de ilustrar a informação.
Figura 8. Gráfico de comparação das eleições de 2008 nos EUA.
Fonte: Publico. Disponível em http://bit.ly/M7xR3Z. Acesso em 24/02/2009.
Outro estilo que pode ser observado na internet é o de visualização de dados, apresentado
por Alberto Cairo em palestra no MidiaLab, por David McCandless no TED, pela revista
Smashing Magazine e, finalmente, pelo inspirador deste estudo, o professor sueco Rans
Rosling. Ainda há outras pessoas que falam sobre este estilo, como Rosana Hermann, jornalista
e fisica-nuclear.
Este estilo trabalha com milhares de informações e transforma os dados para que o olho
humano consiga interpretá-los sem precisar ver minuciosamente cada informação, ou seja, é
feita uma aglutinação em blocos. Assim explica Fernanda Viegas, que apresentou, no TEDxSP
2009, esta ideia e uma ferramenta que considera milhares de informação e transpõe de uma
maneira rápida, dinâmica e compreensível.
Na figura 9 é apresentada a ferramenta de visualização de dados do professor Roslin, o
Gapminder. Observa-se que cada ponto do gráfico representa dezenas de números aglutinados
que demonstram a saúde versus a riqueza dos continentes durante os anos desde 1800.
24
Cada círculo tem uma cor diferente que representa a região do mapa. Na barra inferior é
apresentado um botão de play que aciona os dados e estes se movimentam com a linha do
tempo.
Segundo o próprio Roslin no TEDx, “hoje temos muitos dados. Mas ter os dados não
basta. É necessário apresentá-los de forma que as pessoas consigam entendê-los e apreciá-los.”.
Esta foi a ideia que levou Rosling a projetar o Gapminder.
Figura 9. Visualização de dados do Gapminder.
Fonte: Gapminder. Disponivel em http://bit.ly/MnyyE4. Acesso em 06/05/2007.
Sendo assim, as análises acima mostram que a infografia pode ser um suporte importante
ou, até mesmo, substituir uma informação escrita a partir do estilo de visualização de dados, e,
por isso, é tão respeitada.
Entretanto, em alguns casos a infografia pode ser usada como um esquema figurativo em
um contexto em que não precisaria existir.
Neste prisma, Cairo (2008, p.21) afirma que: [...] não é um objeto decorativo, cujo principal objetivo é fazer as páginas mais ágeis, dinâmicas, coloridas, mas deve funcionar como uma ferramenta de análise da realidade a serviço dos leitores, melhorando sua compreensão.
25
Portanto, as infografias dentro do universo online ou offline podem ser apresentadas
com a mesma estrutura, porém, com distinção de linguagem. No ambiente impresso, percebe-se
que não é possível utilizar um vídeo, dezenas de fotos que formam galerias, áudios,
interatividade ou interação, entre outros.
Estes recursos, segundo Cairo (2008), são chamados de multimídia, que é um dos grandes
fatores que definem a infografia no ambiente virtual: “Outro fator que define a visualização da informação online é o multimídia. As mídias de comunicação para web têm uma grande capacidade de combinar diferentes mídias e pacotes informativos integrados: texto, diagramas, vídeos, áudio, fotogalerias, etc. Todas as ferramentas comuns nas mídias audiovisuais têm ajudado na visualização interativa, e é interessante explorar seu uso consciente.”(CAIRO: 2008, p.79)
Outra definição de multimídia vem de Levy (2010), quando afirma que o termo significa: “aquilo que emprega diversos suportes ou diversos veículos de comunicação. Infelizmente, é raro que seja usado nesse sentido. Hoje, a palavra refere-se geralmente a duas tendências principais dos sistemas de comunicação contemporâneos: a multimodalidade e a integração digital. (LEVY: 2010, p.67)
Levy (2010) interpreta as modalidades sensoriais como visão, audição, tato e as sensações
proprioceptivas. O autor defende a ideia de que multimídia não seja o termo apropriado para
este movimento de digitalização das mídias e que o emprego da palavra é uma emergência do
crescimento da internet.
Depois de compreender como pode ser apresentada uma infografia e, após analise de
estrutura, elementos, funções e comportamento, busca-se entender, a partir de agora, a questão
histórica. Assim, será possível localizar o momento em que este recurso chegou à internet, para,
posteriormente, entender os elementos semiológicos e desenvolver uma interface apropriada
para um infográfico que apresenta dados estatísticos.
2.1.1 História
A comunicação estabelecida visualmente, segundo Sancho (2001), é anterior à escrita,
pois era apenas visual e não linguística - muito anterior a qualquer codificação de linguagem.
Compreende-se que o surgimento histórico da infografia aconteceu na pré-história, e os
primeiros mapas foram criados muito antes da escrita.
No anexo1 – Marcos na história da visualização de dados, de Michael Friendly e Daniel
J. Denis,de York University, Canadá, traduzido por Mario Kann –, pode-se perceber
cronologicamente a evolução da infografia e dos estados estéticos: como eram usados os mapas,
tabelas, ilustrações e os detalhes estruturais.
26
No período de 6200 a.C até o século 17 surgem os primeiros mapas e diagramas, e Kanno
apresenta a origem da visualização a partir dos diagramas geométricos, tabelas de posição das
estrelas e mapas. O registro do primeiro mapa, reproduzido na figura 10, foi a representação,
por meio da escavação de uma pedra em 6200 a.C., de uma cidade da Babilônia encontrada na
região de Kirkuk, Iraque.
Figura 10. Primeiro mapa historicamente registrado.
Fonte: Marcos da história da visualização de dados. Anexo 1.
Itanel Quadros (2005, p.4) afirma que “é necessário relembrar que, enquanto suporte do
pensamento, o visual antecede qualquer linguagem utilizada na comunicação entre pessoas”.
Esta é uma história que começou nas cavernas há cerca de 30 mil anos e prossegue até os dias
de hoje. Santaella também (2012) discursa sob o mesmo prisma e afirma que: “os desenhos rupestres, encontrados nas cavernas pré-históricas, que são formas de expressão de conteúdo emocional e não racional ou de organização da informação, também funcionam como um registro em suporte fixo de algo que o homem contemporâneo pode relacionar como o tempo e o espaço. (SANTAELLA: 2012, p33)
Peltzer (1992, p.98) reforça a ideia quando relata que: “A escrita, desenhar letras é mais fácil que desenhar bisontes, tem códigos que apareceram milhares de anos após os desenhos daqueles animais. Primeiro foi fala e a língua, nessa ordem, segundo Saussure, depois a escrita, que é um modo de representar a língua e seus fonemas (sistema fonético) ou por conceitos (sistema ideográfico). A linguagem visual, a língua, a fala e a escrita são sistemas de signos completamente diferentes. Um é visual, o outro lógico, o seguinte fonético e o último lingüístico. A lembrança da ideia leão põe na minha cabeça a imagem do leão. Posso tentar desenhá -lo (fá-lo-ia se fosse mudo e analfabeto) para comunicar o que vi (o meu conceito de leão) a outra pessoa. Ou posso dizer a palavra leão: um conjunto de fonemas que unidos significam esse animal; e também poderia escrever
27
as letras que correspondem a esses fonemas, unidos para significar o referente leão (escrita fonética), ou desenhar o ideograma – se soubesse fazê-lo – para comunicar a um chinês o conceito leão (escrita ideográfica).”
Segundo Silva apud Costella (2002, p. 14): “escrita pictográfica que consistiu na representação desenhada de objetos concretos, figuras de animais, etc., formando, em sucessão, um relato coerente. Gradualmente, alguns destes sinais tomaram um sentido convencional e passaram a designar conceitos abstratos, tornando-se ideogramas. Em outros sistemas, acresceram-se as sílabas que, articuladas, formaram palavras e, por fim, surgiram as letras, isto é, os sinais alfabéticos que, correlacionando com fidelidade à escrita e à voz humana, representaram graficamente a fala”.
Outros autores, como Dondis (1997) e Clark (2003), relatam que grandes obras, como “A
criação de Adão”, de Michelangelo, e a “Última Ceia”, de Da Vinci, representadas nas figuras
11 e 12, respectivamente, são descrições e narrativas visuais de acontecimentos que tinham
objetivo utilitário, ou seja, transmitir mensagens às pessoas que não decodificavam as letras. Em
um prisma mais elaborado, assumem o caráter de realismo e dramaticidade que as letras não
alcançariam.
Figura 11. “A criação de Adão”, Michelangelo.
Fonte: Wikipedia.
Figura 12. “Última Ceia”, Leonardo da Vinci.
Fonte: Wikipedia.
Kanno (Anexo 1) aponta para a evolução no século 16 – com expansão marítima da
Europa, novas técnicas e instrumentos foram desenvolvidos e, assim, novas, e mais precisas
formas de apresentação visual do conhecimento apareceram.
28
Segundo Cairo (2008) e Peltzer (1992), o desenvolvimento de diversos equipamentos
auxiliou no aperfeiçoamento da infografia, que está relacionado à história da tecnologia, como a
prática da gravura, da fotomecânica, entre outros. Por fim, está ligado à organização dos
complexos sistemas e subsistemas necessários para impressão criados por Johan Gutenberg, em
1436.
Kanno (Anexo 1) relata que os maiores problemas do século 15 se referiam à “medição
física – do tempo, distância e espaço – para astronomia, navegação e expansão territorial.
Avançam as estimativas, as probabilidades, a demografia e todo o campo de estatísticas. No fim
do século, os elementos para iniciar um “pensamento visual” estão prontos”.
Na figura 13 é apresentada uma infografia, feita em 1644, por Michael van Langren’s,
que tem a intenção de mostrar as 12 referências de longitude de Toledo a Roma.
Figura 13. Infografia de Michael van Langren’s.
Fonte: Mario Kano. Anexo 1.
Na figura 14, em infografia do fim do século 16, percebem-se características mais
analíticas de dados. Esta infografia, segundo Kanno (Anexo 1), foi datada de 1786, feita por
William Playfair, na Inglaterra. Observa-se um gráfico de barras e de linhas com dados
econômicos e o uso de tipografias diferenciadas.
Figura 14. Infografia de Michael van Langren’s.
Fonte: Mario Kano. Anexo 1.
29
Pelzter (1992) registra também que o primeiro mapa publicado em jornal foi na Inglaterra,
no dia 29 de março de 1740, no Daily Post de Londres. Era uma gravura com informação visual
de um ataque realizado por Vernon, almirante inglês, à cidade de Portobello, nas Caraíbas,
durante uma incursão contra o tráfico de ouro espanhol.
Segundo Kanno (Anexo 1), a infografia moderna deu os primeiros passos no século 17,
com o primeiro gráfico informativo publicado em jornal na capa do “The Times”. Peltzer
(1992) afirma que, em abril de 1806, na cidade de Londres, a morte do Mr. Blight foi destaque
na capa do “The Times”. (Figura 15)
Quadros (2005, p.5) descreve a infografia da seguinte forma: Era uma informação visual sobre como se dera o assassinato de um cidadão chamado Isaac Blight, composta por uma vista da casa de Blight nas margens do Tâmisa e um plano dela com referências numeradas dos passos do assassino, da trajetória da bala e do deslocamento de Blight até onde caiu morto. No rodapé aparecem legendas com explicações dos números postos no gráfico.
Figura 15. A morte de Blight.
Fonte: Quadros (2005, p.5)
30
Ainda no século 17 acontece, segundo Kanno (Anexo 1), a era de ouro da estatística. Uma
infografia considerada importante pelo fator científico, aponta Belém (2011), é a gravação do
movimento de uma corrida de cavalos por meio de câmeras acionadas por fios, criadas por
Eadweard Muybridge, nos EUA. (Figura 16)
Percebe-se que é usada a técnica de fotografia para captar as imagens do cavalo durante a
corrida, e o intuito é observar que o animal, em certo momento, deixa de encostar as quatro
patas no chão.
Figura 16. Fotografias de Eadweard Muybridge.
Fonte: Veja online. Disponível em http://bit.ly/MHqCit. Acesso em 20/01/2012
No século 19, argumenta Kanno (Anexo 1), “John W. Tukey reconhece a importância da
análise gráfica dos dados e lança novos padrões e inovações. Na França, Jacques Bertin publica
sua Semiologia Gráfica, organizando visão e percepção dos elementos gráficos. Por último, os
computadores começam a mostrar seu potencial”.
Kanno (Anexo1) finaliza as observações sobre a história dos infográficos afirmando que: “o desenvolvimento de softwares e sistemas de computador, altamente interativos e de fácil manipulação, foi a alavanca para tudo. Os novos paradigmas de manipulação de
31
dados, a invenção de técnicas gráficas e os métodos de visualização multidimensional deixaram suas marcas”.
A consolidação das ferramentas técnicas e metodológicas da visualização da informação
veio durante a Guerra do Golfo1.
Esta evolução superou o papel e outras tecnologias começaram a surgir. A possibilidade
de envio de imagens via cabo ou antenas, e posteriormente via satélite, tornou a comunicação
entre mensageiro e receptor mais ágil, possibilitando a publicação de mapas, imagens e
informações. Peltzer (1992, p.115-116) acrescenta valor a essa descrição: “Quando se dá a separação entre a fotografia e o visual não fotográfico, e a união de ambos os sistemas num mesmo processo, a remissão de uma informação visual começa a realizar-se de um modo digital e ampliam-se as possibilidades de confecção diretamente segundo um código digital, ou mediante a digitalização dos gráficos e desenhos realizados de forma clássica. (...) A digitalização permitiu o uso generalizado, pela imprensa, da linguagem visual. (...) Foi então que a linguagem reservada às enciclopédias e outras obras de divulgação científica e técnica pôde ser transferida para a imprensa e para a urgência do jornalístico (...). “
Sancho (2001, p.54-57) concorda que o avanço tecnológico possibilitou um incrível
avanço na construção da infografia: “Nos anos 80 se deu o renascimento dos gráficos explicativos, influenciados pelo desenvolvimento dos computadores pessoais dotados de programas específicos para gerar ilustrações. A aparição do computador Apple Macintosh, em 1984, facilitou enormemente a criação de imagens e se converteu em boa medida no padrão de trabalho para um grande número de ilustradores e designers gráficos (...) Nesse contexto aparece uma nova infografia utilizando como ferramenta de trabalho a informática adaptada às representações, ao tratamento da imagem etc. (...) Desde 1986 até o presente se produziram avanços espetaculares tanto nos programas informáticos como nas redes de transmissão de gráficos, o que possibilitou que a sua publicação se generalizasse nos jornais. A infografia se revelou como o meio mais eficaz para transmitir de maneira rápida e concisa os aspectos fundamentais da informação de temas, que por sua novidade, desconhecimento geral ou distanciamento do leitor, precisariam de muitas palavras para serem explicadas. Ela ampliou o universo cognitivo e incorporou elementos distantes.”
Percebe-se, portanto, que a infografia se redescobre e começa a utilizar a tecnologia a seu
favor, buscando aperfeiçoar técnicas e metodologias. No entanto, observa-se que a infografia
mostra alguns estágios dentro do próprio universo, distribuídos dentro da transposição da
informação.
2.2 TRANSIÇÃO E CONVERGÊNCIA DE MÍDIAS
1 Guerra do Golfo – Guerra ocorrida em 1991, entre a coalizão de países liderados pelos EUA, contra o Iraque, de Saddam Hussein, em decorrência da invasão do vizinho Kuwait, em 1990. 2 Transposição, segundo Michaelis online, é o ato ou efeito de transpor, transferir, transmitir ou transportar, ou Iraque, de Saddam Hussein, em decorrência da invasão do vizinho Kuwait, em 1990.
32
Com o suporte da tecnologia, pode-se perceber algumas transições na infografia até
chegar ao nível mais experimental no ambiente virtual. Esse comportamento ainda está sendo
analisado por alguns especialistas e profissionais, que ainda divergem quanto à nomenclatura
ideal. Rodrigues (2009, p.33) relata sobre os autores e as nomenclaturas: “Alguns autores classificam de infografia “Interativa” (CAIRO, 2005, 2007, 2008, SALAVERRÌA, 2005) ou “digital” (SANCHO, 2001), multimídia (RIBAS, 2005, RODRIGUES, 2005, 2008, 2009a), infografia jornalística digital animada (RIBEIRO, 2008, RANIERI, 2008), outros como infografia animada, porém todos se direcionam ao mesmo objeto de estudo.”
Pode-se afirmar que a infografia é um concentrador de algumas mídias, fato observado
por Palacios (2003, p.3): “refere-se à convergência dos formatos das mídias tradicionais (imagem, texto e som) na narração do fato. A convergência torna-se possível em função do processo de digitalização da informação e sua posterior circulação e/ou disponibilização em múltiplas plataformas e suportes, numa situação de agregação e complementaridade.”
Entretanto, os elementos que a compõe podem ir além dos formatos de mídias
tradicionais. Levy (2010) aponta outros formatos, como navegabilidade, interação, caminhos
multilineares e expõe aspectos como “tomar caminhos transversais, produzir dobras interditas,
estabelecer redes secretas, clandestinas, fazer emergir outras geografias semânticas”. Portanto,
pode-se subdividir esse trajeto para a internet.
Rodrigues (2009) explora alguns períodos da transposição2, sendo a primeira fase linear,
com a estrutura impressa utilizada dentro do mundo virtual. Em seguida, a fase multimídia ou
multimodal, que necessitava de galeria de fotos, vídeos e áudio. E a última etapa, que é a busca
pelo cruzamento de informações e pelos formatos que Levy (2010) descreve a partir de uma
base de dados que permite a criação, a recriação e a reatualização do mundo de significados que
o ciberespaço3 oferece.
Rodrigues (2009, p.35) descreve essas fases da seguinte forma, na figura 17:
2 Transposição, segundo Michaelis online, é o ato ou efeito de transpor, transferir, transmitir ou transportar, ou seja, dentro do universo da comunicação visual é o momento em que a preocupação é de disponibilizar o conteúdo na internet sem a preocupação estético-funcional de uma linguagem visual adequada para a internet. 3 Santaella assume uma descrição longa, porém, esclarecedora “o universo paralelo, que tem sua matriz na internet, que abriga megalópoles, ou banco de dados comerciais, e uma infinidade de portais e sites de todas as espécies, vem sendo chamado de ciberespaço. [...] O ciberespaço é como Oz – existe, chegamos a ele, mas não tem ubiquação. [...] Consiste de uma realidade multidirecional, artificial ou virtual incorporada a uma rede global, sustentada por computadores que funcionam como meios de geração e acesso. Nessa realidade, da qual cada computado é uma janela, os objetos vistos e ouvidos não são nem físicos nem, necessariamente, representações de objetos físicos, mas têm a forma, caráter e ação de dados, informação pura. [...] Como o ciberespaço se relaciona com a realidade virtual, com a visualização da informação, com as interfaces gráficas dos usuários, com as redes, com os meios de comunicação múltiplos, com a convergência das mídias, com a hipermídia? Ele se relaciona com todos, inclui todos, pois tem a capacidade de reunir e concentrar todas essas faces em um objetivo comum.
33
Figura 17. Fases da transição da infografia impressa para online.
Fonte: Rodrigues (2008). Disponível em http://bit.ly/pq3gqz. Acesso em 20/09/2010.
SILVA (2011, p.17) absorve as definições de Rodrigues e compreende: “Primeira fase: tem por característica os infográficos lineares, de sequência estática, linear; os primeiros modelos práticos no jornalismo, executados em plataforma impressa e que podem ser encontrados também na internet. (TEIXEIRA, 2007, apud%TEIXEIRA, 2008; p. 164) Segunda fase: envolvida no suporte da internet, baseia-se na multimidialidade dos elementos constitutivos dos infográficos:“imagens em movimento, gravação sonora, ilustração, fotografia, vídeos e outros recursos interativos” (RODRIGUES, 2009, p. 201). A forma de leitura também se altera em relação aos infográficos estáticos, com variações multilineares, lineares ou não-lineares. Terceira fase: tem como propriedade, segundo Rodrigues (2009), a introdução de base de dados na formatação dos infográficos na plataforma web.”
34
Um exemplo de transposição linear é o infográfico sobre o acidente do avião Airbus
A320, voo JJ 3054, que vinha de Porto Alegre para São Paulo e explodiu no momento da
aterrissagem.
A revista Veja mostra como foi o acidente, o trajeto e as hipóteses, de uma forma linear.
Imagem e texto se complementam sem um tomar o lugar do outro. A estrutura mostra as
especificações técnicas e cada elemento tem importância e localização. (Figura 18)
Figura 18. Vôo 3054.
Fonte: Revista veja
Veja como aconteceu a transposição para a internet em http://glo.bo/woOEps -
transposição simples, sem recursos audiovisuais. Outro exemplo que pode caracterizar essa fase
é o primeiro modelo do infográfico sobre o naufrágio do Titanic, mostrado anteriormente
(Figura 6).
Posteriormente, percebeu-se a utilização de materiais audiovisuais, como galeria de fotos,
a presença de animação, interatividade e hiper-realidade. Portanto, entra-se na segunda fase que
Rodrigues apresentou.
35
No trabalho realizado pelo jornal Zero Hora sobre a Segunda Guerra, pode-se observar a
presença constante de áudio, vídeos e galerias de fotos, e este material apresenta recursos que
correspondem à segunda fase da transposição apresentada por Rodrigues. (Figura 19)
Figura 19. A guerra do século 20.
Fonte: ZH. Disponível em http://bit.ly/u1H92C. Acesso em 07/08/2011
A infografia pode assumir mais funções dentro do universo da web. Rodrigues (2009, p.3)
afirma que:
36
Pode ser pensada numa nova forma cultural e digital para os produtos jornalísticos, com funções de indexar objetos multimídia (sons, imagens, gráficos), armazenar material produzido e de arquivo (memória), agilizar produções, compor conteúdos para a web, recuperar, informações e, principalmente, cruzar dados que gerem uma nova informação visual e dinâmica.
Este contexto mostra que a infografia deixou de utilizar apenas texto, imagens, mapas e
ilustrações. A terceira fase da transposição apresenta mais do que a presença de mecanismos
audiovisuais, e passa a existir a retroalimentação, como chama Cairo (2008), que é a emissão de
uma resposta pelo usuário, ou seja, é realizado um feedback de uma ação. Além disso, são
coladas em prática todas as características comentadas por Santaella (2011): conexões e
controles perceptivos que resultam em uma gama de rotas semióticas.
Na revista online Smashing Magazine, algumas ferramentas de visualização de dados
com esses conceitos são apresentadas. (Figura 20)
Figura 20. Ferramentas de visualização de dados
Fonte: Visual.ly. Disponível em http://bit.ly/tjT4F4. Acesso em 23/09/2011.
Outro exemplo é apresentado pelo jornal New York Times, que utiliza esses conceitos no
NYT labs 4, onde são realizados estudos com base de dados e design de interface. Um projeto
elaborado pelo NYT Labs é o Cascade (Figura 21), que tem por finalidade analisar a
propagação de uma informação dentro das redes sociais e gerar visualização da análise dos
dados captados pela ferramenta, relacionando o comportamento da navegação com a atividade 4 The New York Times Company Research & Development Lab trabalha para inovar em novas tecnologias, antecipando os comportamentos de consumo e construção de novas interfaces de notícias.
37
social relacionada com a matéria pesquisada, ou seja, rastreia a atividade por URL dentro da
internet.
Figura 21. Ferramentas de visualização de dados.
Fonte: Cascade. Disponível em http://nytlabs.com/projects/cascade.html. Acesso em 28/09/2011.
Outro projeto que pode exemplificar a terceira fase da transposição é a interface que
representa um mapa onde são apresentadas as publicações acadêmicas dos últimos dez anos nos
EUA. (Figura 22). A apresentação do projeto afirma que “a dinâmica de rede compõe um mapa
de alto nível do Instituto Max Planck e suas conexões.” Pode-se perceber que o mapa apresenta
ícones com tamanhos diferentes que representam os números de publicações. A largura das
linhas apresenta o número de publicações feitas em conjunto com o instituto, ou seja, quanto
maior for a largura da linha, maior é o número de publicações. Toda essa informação é
disponibilizada com tela touch screen - isso pode representar uma forma de interação com o
usuário, utilizando outra sensibilidade motora.
Observa-se neste exemplo a possibilidade de comunicar por meio de uma interface apenas
com linhas e círculos, contando com a ajuda de localizações em um mapa. Portanto, percebe-se
uma interface altamente abstrata, mas que disponibiliza uma gama de informações.
38
Figura 22. Max Plank Institute.
Fonte: Max Plank Institute. Disponível em http://bit.ly/wA8RNL. Acesso em 23/09/2011.
Rodrigues (2009) explana sobre o aprofundamento da participação da infografia online: “[...]pode requerer do usuário uma interpretação, uma análise mais aprofundada com níveis de interatividade maior, a depender de cada gráfico, funcionando como um mecanismo de exploração da informação. Com os infográficos de caráter mais analítico, onde há muitos dados se cruzando e em alguns momentos em tempo real, exige-se, portanto, maior atenção e interpretação do usuário, porque as possibilidades de leituras aumentam na medida em que o relato noticioso contém mini-estórias, diagramas, entrelaçamento de dados.” (RODRIGUES: 2009, p 37)
Portanto, avalia-se que a terceira fase da transposição atinge a visualização dos dados
informacionais transformando dados numéricos, históricos e informacionais em uma leitura
visual mais rápida e compreensível, com o trajeto livre para o usuário escolher o que é mais
interessante.
Após inferir sobre o que é a infografia e por quais estágios passou, a atual dialética
encontra-se no ciberespaço. Busca-se, adiante, entender como o design utiliza essas
informações e de que forma pode resolver a visualização dos dados sobre a balneabilidade em
SC.
2.3 FACES DO DESIGN
Campos e Silva (2008) levantam uma indagação sobre a personalidade estética das
interfaces do mundo digital e consideram que há um tempo o conteúdo da web era apenas
textual, estruturado com links e hiperlinks que se conectavam a outro conteúdo textual, o que
exemplificam com a Wikipédia. Entretanto, a tecnologia avançou, oferecendo novos
39
navegadores e permitindo que mais informações fossem disponibilizadas. A velocidade inserida
na navegação também cresceu, o que melhorou muito a interface.
Campos e Silva (2008) afirmam que: As tecnologias surgidas a partir daí permitiram que uma página da web se tornasse tão elaborada quanto uma página de revista ou de jornal impresso. A metáfora de página de livro cedeu lugar à metáfora do conteúdo de publicação diária. A biblioteca acadêmica cedeu lugar à banca de jornal, o jogo de papel e o cartão impresso foram substituídos pelos videogames. (CAMPOS E SILVA: 2008, p.14):
Observa-se, portanto, que esse movimento foi um divisor de águas no sentido de
ferramenta para questões semiológicas, estéticas e de interações na apropriação das mídias
anteriores. Hoje, segundo Campos e Silva (2008), a estética de internet na verdade é uma
herança de jogos eletrônicos, da mídia impressa jornalística e dos CDs ROM. Esta, por sua vez, ao reunir esses e outros elementos, implementou uma linguagem própria, ao incorporar também a interatividade. O leitor espectador deixou de ser um receptor passivo, podendo, agora, até mesmo interferir no conteúdo acessado, seja acrescentando comentários, seja personalizando páginas que, amiúde, altera, gerando conteúdos inéditos, algo que as outras mídias apenas faziam − ou tentavam, indiretamente, fazer – com o uso de duas mídias em paralelo (televisão e telefone, rádio e e-mail etc.). (CAMPOS E SILVA: 2008, p.15)
Percebe-se, então, que é neste ponto que a internet se diferencia e mostra a principal
característica que tem: a interação de pessoas por meio de uma interface que possibilita a
transição de informações. Portanto, podem-se fazer analogias: Nas páginas da web se percebe que os ícones possuem uma função análoga a dos sinais de trânsito. Assim como estes têm por finalidade orientar o fluxo de automóveis e pedestres, aqueles têm por função orientar a navegação dos internautas. Mas a analogia poderia parar aí, pois, no meio ‘físico’, os sinais se relacionam com o espaço tridimensional, articulando-se como uma referência e um referente, diversamente do (atual) espaço bidimensional da web. Não há como relacionar elementos nesse espaço da maneira como se costuma fazer no mundo real. (CAMPOS E SILVA: 2008, p.15)
Portanto, busca-se compreender melhor estes ícones e símbolos, e dar sentidos a eles para
orientar o fluxo de navegação dentro da interface sobre a balneabilidade. Assim, facilitar as
descobertas de novos caminhos que podem ser trilhados e, principalmente, poder transparecer
as informações analíticas visualmente.
2.3.1 Princípios básicos do design gráfico
O design visual pode interpretar informações e transpô-las em conceitos visuais como cor,
forma, contraste e luz. Isso permite construir uma composição visual clara e objetiva.
Conhecer e examinar, com afinco, os elementos visuais básicos, pode oferecer uma
estratégia de composição criativa de uma linguagem visual para qualquer plataforma ou suporte.
40
Carol Holfmann (2010) afirma que “tornar algo compreensível e não apenas fácil de
olhar, é função do design gráfico, design de interface e infografia. Todos têm por objetivo
principal transmitir informações e dados.” Na figura 23, Holfmann constrói um gráfico para
exemplificar a construção de um bom infográfico.
Figura 23. Processo de formação de um bom infográfico.
Fonte: abcDesign. Infográficos: da essência ao clichê na era da Informação Digital. Disponível em
http://bit.ly/JGB9Mp
Em um workshop no Malofiej 20 International Infographics, Alberto Cairo lançou o
desafio da construção de um infográfico em um prazo muito curto. O desafiante concluiu o
workshop impressionado com o resultado, e argumentou: “observe os desenhos bonitos e
as toneladas de canetas e papel sobre as mesas. Isto é o “Não fale, mostre”. Assim, finalizou o
41
workshop sobre planejamento, desenho, pensar e partilhar ideias antes mesmo de tocar um
teclado de computador. (Figura 24)
Figura 24. Sketch de um infográfico no workshop do Malofiej 20.
Fonte: The funcional art: Information Graphics Workshop in Spain. Disponível em http://bit.ly/I4Ri9y
A adequação dos elementos tem como objetivo atender, segundo Teixeira (2005), os
quatros itens mais importantes para a composição do infográfico: “Agrupamento: a proximidade, segundo as leis da percepção, é um forte fator no estabelecimento de uma relação entre os elementos visuais (...). Podemos conduzir nosso leitor.
42
Adequação dos elementos visuais à informação: a capacidade de passar mensagens subliminares, as imagens atuarão como elementos coadjuvantes na leitura e compreensão dos infográficos (...). Toda informação visual quando lida, é analisada e interpretada por um conjunto de parâmetros culturais individualizados na experiência de cada leitor (...). A imagem informa para além da organização racional. Ela busca também a harmonia estética e o ritmo neural. Poluição visual: equilíbrio, contraste e harmonia são inconscientemente buscados pelo leitor. Exploração dos recursos estéticos: formas, cores, ilustrações, fotos, efeitos, tons, composição, harmonia, ritmo e tantos outros são um conjunto de detalhes voltados à necessidade de beleza do ser humano (...).” (TEIXEIRA: 2005, p.5)
Os elementos citados por Teixeira (2005) podem ser analisado junto às teorias da Gestalt,
que utilizam “pontos, linhas, planos, volumes, cores, sombras, brilhos, texturas, e outros
atributos – isolados ou combinados entre si”. (Gomes Filho: 2008, p.27).
O conceito de unificação, segundo os preceitos da Gestalt, e o agrupamento, citado por
Teixeira, são nomenclaturas diferentes, mas que tem uma relação. A unificação, citada pela
teoria da forma, pode ter uma gama de elementos ou ser apenas um só. Já na visão de Teixeira,
o agrupamento é a unificação formada por vários elementos.
Na figura 25, a teoria se apresenta verdadeira. No primeiro quadrado, composto por
outros quadrados, a harmonia é perfeita - todos têm o mesmo tamanho e formam um quadrado
maior com a mesma proporção. Assim, está de acordo com outras leis da Gestalt, como
“proximidade, semelhança, fechamento e boa continuidade”.
No segundo quadrado, a continuidade é interrompida pela diferença de cor, causando um
“ruído”. No terceiro, o mesmo acontece - não há continuidade por conta da falha de alguns
quadrados e o círculo não deixa que a leitura seja coerente.
Finalmente, o último representa o caos. Pelo movimento dos quadrados e as diversas
cores, a harmonia e a continuidade na legibilidade visual se perdem.
Para Suassuna (2011, p.53), “consiste na grandeza e na ordem”, referenciando, assim, a
harmonia das partes de um todo como unidade e totalidade.
Figura 25. Unificação.
Fonte: Filho (2008, p.31).
43
Na figura 26, são apresentadas as leis mais importantes da teoria Gestaltiana, como:
semelhança, proximidade, continuidade, pregnância e fechamento, que são utilizadas na figura
anterior para mostrar o funcionamento, entre outros. A figura também mostra a conceituação
sensível da forma, os aspectos metafísico, lógico, epistemológico, estético e formal.
Figura 26. Leis da Gestalt.
Fonte: Gomes Filho (2000).
A teoria da Gestalt pode fornecer ao designer o embasamento científico para o sistema de
leitura visual, que solidifica as diretrizes para construção de infográficos com a possibilidade de
ultrapassar os elementos técnicos, permeando os anseios da forma e tateando o campo estético.
A forma, como é descrita na figura 27, é definida por Filho (2000, p.41): “como os limites exteriores da matéria de que é constituído um corpo e que confere a este um feitio, uma configuração. A percepção da forma é o resultado de uma interação entre o objeto físico e o meio de luz agindo como transmissor de
44
informação, condições e imagens que prevalecem no sistema nervoso do observador, que é, em parte, determinada pela própria experiência visual.”
Wong (1998) divide a forma em quatro grupos básicos: elementos conceituais, visuais,
relacionais e práticos.
Figura 27. Elementos da forma.
Fonte: Wong (1998).
Wong (1998) relata a união dos conceitos da teoria da forma, e sugere adaptações que se
apresentam como o principal suporte do mecanismo de estruturação e organização de um
45
infográfico. Um exemplo prático é exposto por Munari, apenas utilizando a textura para mostrar
o funcionamento da teoria de Wong: (Figura 28)
Figura 28. Elementos da forma com textura.
Fonte: Bruno Munari (2006, p.11).
A interpretação destes elementos básicos e o contexto do meio ou suporte onde estão
inseridos, segundo Dondis (1997, p.5), atuam como “cenário para as decisões relativas ao
design”, estruturando os elementos conforme os significados.
O sistema de elementos organizados sistematicamente pela Gestalt e Wong apresenta-se
como um refinamento do que foram as percepções humanas em relação aos objetos. Esta
estrutura é chamada por Dondis (1997, p.16) de “alfabetismo coerente com regras sintáticas
básicas”. Seguindo as concepções de Dondis (1997), toda a percepção das definições acima
pode também ser influenciada pela psique formada por um grupo social.
Sartre (2009, p.39) comenta que “toda criação imaginativa exige um princípio de
unidade”, e que esta unidade passa por um processo de “dissociação externa e interna”: 1) a seleção tendo em vista a ação; 2) causas afetivas “que governam a atenção”; 3) razões intelectuais, “designando por esse nome a lei de inércia mental ou lei do menor esforço”. As causas externas são as “variações da experiência” que apresenta tal objeto, ora provido, ora privado de certa qualidade: “O que foi associado ora a uma coisa, ora a outra, tende a se dissociar das duas”.
Aparentemente uma informação apresentada a um indivíduo ocidental pode ser
interpretada de uma forma diferente por um indivíduo oriental, que não tem acesso aos mesmos
costumes. Ou seja, quem mora no Sul do país tem uma palavra para identificar um objeto, e no
Norte a mesma palavra pode significar outra coisa.
Um bom exemplo é o símbolo da suástica, representada na figura 29, que traz mensagens
com mais de três mil anos, segundo dados do site Brasil Escola. O nome significava “cruz
gamada” e a suástica era gravada em moedas da antiga Mesopotâmia. O primeiro significado
nasceu dentro do hinduísmo como “aquilo que traz sorte” e, para os chineses, a suástica
representava o número 10.000. Na maçonaria, é a representação de uma constelação próxima à
46
estrela Ursa Maior, e os bascos representam por meio da suástica a imagem de uma dupla
espiral. Porém, o significado mais conhecido atualmente é símbolo do nazismo.
Figura 29. Suástica.
Fonte: Brasil Escola. Disponível em http://bit.ly/KBWjLl. Acesso em 21/06/2012
Nesse contexto, Ramos e Zago (2007, p.7) argumentam que: Todo ato perceptivo subordina um fenômeno em conceitos visuais [...] é o conhecimento sensorial das formas ou de totalidades organizadas e dotadas de sentido e não a soma de sensações elementares. Sensação e percepção são o mesmo. É o conhecimento de um sujeito corporal, uma vivência corporal. O mundo exterior não é uma coleção ou soma de coisas isoladas. É organizado em formas e estruturas complexas, dotadas de sentido. (RAMOS E ZAGO: 2007, p.7)
Em visão aprofundada, percebe-se que os elementos sistematizados ficam a priori dos
juízos empregados pela pessoa que recebe a informação. Assim, a percepção “não é uma
propriedade do objeto, algo que se encontra no objeto, e sim uma construção do espírito do
contemplador colocado diante do objeto” (SUASSUNA: 2011, p.30).
Ramos e Zago (2007) concluem que: A percepção é uma relação do sujeito com o mundo exterior e não uma reação físico fisiológico (empiristas) e nem uma idéia formulada pelo sujeito (intelectualistas). A relação dá sentido ao percebido e aquele que percebe - um não existe sem o outro. Uma experiência é dotada de significação. O percebido é dotado de sentido, faz parte do nosso mundo e de nossas vivências. (RAMOS E ZAGO: 2007, p.7)
Portanto, com a percepção definida, pretende-se explorá-la com os conceitos de
comunicação que, segundo Júnior (2005), sem importar o suporte, acontece de corpo para
corpo, cada um interpretando a informação conforme o conhecimento intrínseco. Busca-se
interpretar os dados de balneabilidade e traduzir informações em dados visuais para se
comunicar com o maior número usuários, sem confusão ou ruído. Desta forma, ficam
47
compreendidos os estudos sobre como se comporta a informação desde a a construção até a
recepção pelo usuário.
2.3.2 Visualização da informação com bases de dados
Sunagawa (2010) apud Betin (1983) introduz os níveis de organização de um gráfico, que
são “divididos em quatro propriedades perceptivas ou níveis de organização: associativo,
seletivo, ordenado ou quantitativo”
Percebe-se que a autora aprofunda a questão sobre os elementos apresentados pelas leis
da Gestalt e de Wong, e converte para uma linguagem infográfica a partir de três níveis de
interpretação, como modos de implantação, variáveis visuais e organização visual de dados.
Segundo Sunagawa (2010), os modos de implantação estão relacionados aos quesitos
visuais, relacionais e práticos dos elementos das formas, apresentados por Wong (1998). Os
elementos conceituais de Wong se relacionam com as variáveis e com os níveis organizacionais
apresentados pela autora.
Portanto, Sunagawa (2010) apresenta, na figura 30, um exemplo prático que utiliza os
elementos da forma e transforma em visualização de dados.
Figura 30. Modos de Implantação X Váriáveis Visuais X Níveis de Organização.
Fonte: SUNAGAWA: 2010, p.59.
48
Cairo (2008) articula sobre a implantação dos dados variáveis do Google Maps, que se
tornou uma ferramenta importante para o desenvolvimento de mapas interativos, pelo fato de o
código de programação ser aberto e por oferecer possibilidades de manipulação dos dados.
Alguns sites jornalísticos já estão utilizando recursos oferecidos pelo Google, que usa as
variáveis visuais apresentadas por Sunagawa (2010).
Na figura 31, o NYT apresenta de uma forma interativa os lugares onde realiza, a cada
ano, uma inspeção sanitária. Em cada ponto do mapa é apresentado o nome do estabelecimento,
o grau de violação e, ao clicar, apresenta todo o relatório do local. Além disso, há um sistema de
busca na parte superior do infográfico.
Percebe-se que as variáveis visuais tornam-se gráficos mostrando o grau de reincidência
do estabelecimento nas inspeções. Ou seja, a informação numérica é transformada em dados
visuais.
Figura 31. Ferramenta do Google aplicada em infográfico do New York Times.
Fonte: Interactive Map. Disponível em http://nyti.ms/IrST9z
Cairo (2008) afirma que a ferramenta elaborada pela Google em 2005 condicionará o
futuro da infografia na web, pois define “a hibridação de serviços de diversos provedores para
criar um novo produto.” (CAIRO: 2008, p.7) Também afirma que, os dados são recombinados
de maneira que respondam às necessidades de cada infografia, e oferecem suporte para a
arquitetura da informação. Estes dados podem ser compartilhados, modificados e distribuídos,
utilizando os conceitos de inteligência compartilhada.
49
Na figura 32, o Google Development apresenta um showcase de vários modelos de mapas
interativos.
Figura 32. Grupo de ferramentas do Google.
Fonte: Google Code. Disponível em http://bit.ly/IrSjsi
Neste trabalho, portanto, foi descrito como os elementos visuais podem auxiliar a compor
uma interface que analise dados numéricos e os transforme em gráficos, apresentados por
Sunagawa (2010), prospectando a utilização das ferramentas oferecidas pelo Google Maps,
citada por Cairo (2008) como uma ferramenta de alta qualidade.
Percebe-se que a interface pode ser manipulada conforme os dados oferecidos pela Fatma,
e que é, com a sugestão de Cairo (2008), uma ferramenta com alto desempenho para
administrar estes dados graficamente.
Nos estudos, foi encontrada uma ferramenta brasileira chamada SAD-EE, que utiliza
dados do Google Earth para mostrar um gráfico geográfico do desmatamento que acontece no
Brasil. A visualização que se busca com este trabalho tem como objetivo mostrar a
balneabilidade em um mapa geográfico e desmembrar a análise conforme a necessidade do
usuário.
Portanto, observa-se que, apenas conhecer a ferramenta e saber o caminho do design pode
não ser suficiente para enviar uma informação visual. Além disso, busca-se a interpretação da
informação e de como o usuário pode utilizar os recursos e navegar.
2.3.3 Interpretação da informação
A visualização da informação depende também dos conhecimentos de comunicação,
portanto, conhecer apenas a aplicabilidade dos elementos da forma pode ser insuficiente na
50
comunicação de uma mensagem. Dondis (1997) acredita que a forma pode ser modificada ou
interpretada de forma diferente por pessoas diferentes. “O resultado final de toda a experiência visual, na natureza e, basicamente, no design, está na interação de polaridades duplas: primeiro as forças do conteúdo (mensagem e significado) e da forma (design, meio e ordenação); em segundo lugar, o efeito recíproco da articulação (designer, artista e artesão) e do receptor (público). Em ambos os casos, um não pode se separar do outro. A forma é afetada pelo conteúdo; o conteúdo é afetado pela forma. A mensagem é emitida pelo criador e modificada pelo observador.” (DONDIS: 1997, p.131)
Santaella acrescenta de uma forma mais filosófica que: De todas as aparências sensíveis, o homem — na sua inquieta indagação para a compreensão dos fenômenos — desvela significações. E no homem e pelo homem que se opera o processo de alteração dos sinais (qualquer estímulo emitido pelos objetos do mundo) em signos ou linguagens (produtos da consciência). (SANTAELLA: 1985, p.7)
Percebe-se que os infográficos podem agregar informações textuais com representações
visuais que sofrem influências objetivas e subjetivas. “Compreender a engedração do
infográfico, suas relações com o interpretante, tornaram evidente seu poder simbólico e de
produção de sentido.” (SILVA: 2010, p.10).
Dias e Carvalho apud Freitas (2011) afirmam que a visualização de dados é: “uma área da Ciência que tem por objetivo o estudo das principais formas de representações gráficas para apresentação de informações, a fim de contribuir para o entendimento delas, bem como ajudar a percepção do consumidor a fim de deduzir novos conhecimentos baseados no que está sendo apresentado. É uma ciência que combina aspectos de computação gráfica, interação humano-computador, cartografia e mineração de dados.”
Toda a visualização de uma informação pode ser abstrata, o que se vê no papel ou na tela
de um computador seria uma representação do real, uma interpretação de fatos e dados. Cairo
(2008, p7) confirma que “um diagrama é uma representação abstrata de uma realidade.” Ou
seja, representa números em forma de gráfico, podendo, assim, ser comparado visualmente.
Quanto maior o poder de abstração de uma infografia, maior o grau de compreensão de
uma informação. Na figura 33, de um lado há um quadro com vários números e, no outro, são
destacados no quadro apenas os números necessários.
Figura 33. Fragmentação e minimalismo na informação.
Fonte: Cairo (2008, pg.21)
51
Dias e Carvalho, seguindo a mesma concepção de Cairo, propuseram a dois profissionais
das áreas de matemática e desenvolvimento de games, o teste presente na figura 34. Foram
propostas quatro formas de visualização de uma informação, e posteriormente os profissionais
foram questionados sobre o que identificavam no resultado do desenho - cada um deles
interpretou a informação conforme a compreensão particular.
Figura 34. Teste visual.
Fonte: CARVALHO e DIAS (2007)
52
A abstração é um componente importante para a composição de informações em um
mapa. Para exemplificar essa ideia, Cairo (2008) utiliza os mapas do metrô de Londres,
demonstrado na figura 35. Muitos destes mapas costumavam mostrar o trajeto exato percorrido
pelo veículo. Vários seguiam a mesma ideia: Mapas de metrô têm sido parte da vida de Londres, desde o nascimento do Underground, e foram inicialmente tão confusos quanto a própria cidade: um emaranhado de linhas diferentes tecidos ao redor do rio Tamisa. Harry Beck, um engenheiro que em 1931 surgiu com a ideia radical de apresentar a rede cada vez maior como um diagrama de circuito, em vez de um mapa geográfico – para criar um ícone do design modernista que nunca foi superado. (THE GUARDIAN: 2009, http://bit.ly/IrIuOs)
Figura 35. Mapa antigo do metrê de Londres.
Fonte: The Guardian. Disponível em http://bit.ly/IrIuOs. Acesso em 20/09/2011.
Beck utilizou a linguagem e a sintaxe para desenvolver um mapa, exposto na figura 36,
que dispensa a geografia do solo, a distância entre as estações, o trajeto e muitos outros
detalhes que o usuário de metrô não necessita saber. Na realidade, o usuário precisa saber onde
está e para onde quer ir – a partir disso, observar um mapa simples.
53
Figura 36. Plano do metrô de Londres por Henry Beck, 1933.
Fonte: The Guardian. Disponível em http://bit.ly/IrIuOs. Acesso em 20/09/2011.
Cairo (2008) cita outros exemplos semelhantes, como a inserção de montanhas e vales em
um mapa estático, o que não é relevante para mostrar um roteiro, ou o uso de uma ilustração -
representação abstrata de objetos físicos.
Para compreender a abstração em plenitude, os aspectos da fenomenologia podem ser
significativos. Segundo Santaella (1983, p.2), torna possível conhecer como o “homem opera no
processo de alteração dos sinais (qualquer estímulo emitido pelos objetos do mundo) em signos
ou linguagens (produtos da consciência).” O termo linguagem se estende, também, à linguagem
binária utilizada nas máquinas para comunicar o homem. Desta forma, o homem se vale de
signos para interpretar algum objeto.
Percebe-se, então, que para o homem entender ou interpretar alguma informação, ele tem
a lógica, os aspectos sensíveis e o social como aliados para formular uma ideia, concepção,
compreensão, entre outros.
A fenomenologia tem a tarefa “dar a luz às categorias mais gerais, simples, elementares e
universais de todo e qualquer fenômeno, isto é, levantar os elementos ou características que
pertencem a todos os fenômenos e participam de todas as experiências”. (SANTAELLA: 1985,
p.7).
A concepção de Santaella (1985) sobre os fenômenos são baseados nas teorias de Pierce,
que atuavam em três campos:
54
1) a capacidade contemplativa, isto é, abrir as janelas do espírito e ver o que está diante dos olhos; 2) saber distinguir, discriminar resolutamente diferenças nessas observações; 3) ser capaz de generalizar as observações em classes ou categorias abrangentes (SANTAELLA: 1985, p.7).
Para fins científicos, Pierce resolveu fixar a terminologia de primeiridade, secundidade e
terceridade, pelo fato de ser palavras livres de outros significados ou associações. Santaella
explica, baseada na teoria perciania: Primeiridade: é a categoria que dá à experiência sua qualidade distintiva, seu frescor, originalidade irrepetível e liberdade Secundidade: é aquilo que dá à experiência seu caráter factual, de luta e confronto. Ação e reação ainda em nível de binariedade pura, sem o governo da camada mediadora da intencionalidade, razão ou lei. Terceridade: que aproxima um primeiro e um segundo numa síntese intelectual, corresponde à camada de inteligibilidade, ou pensamento em signos, através da qual representamos e interpretamos o mundo (SANTAELLA: 1985, p.11).
Para Messa (2005, p.15): A primeiridade refere-se a todo aspecto de qualidade que você vivenciar nessa experiência, a secundidade é a reflexão envolvida nesse processo e a terceiridade é a representação que você fará.
Assim, constata-se que para interpretar algo o homem passa por estas três etapas: os
sentidos, a interpretação e a conclusão. Perante os fenômenos, para conhecer, compreender e
reagir, a “consciência produz um signo” (SANTAELLA: 1985, p.11), isto é, um pensamento.
Na figura 37 é apresentada, graficamente, a tríade pierceana.
Figura 37. Tríade de Pierce.
Fonte: SANTAELLA, Lúcia. O que é semiótica. São Paulo: Brasiliense, 1985
55
A intenção do signo é representar as formas e simbolizar ideias da percepção do mundo e
das coisas. Para isso, existe a necessidade de abstração de imagem, mas não de conteúdo, como
verificado nos exemplos das páginas anteriores.
Cabe ressaltar que a semiologia, que posteriormente passa a ser semiótica5, “de Ferdinand
de Saussure, é a ciência com origens na linguística que estuda vida dos signos como parte da
vida social. A relação entre as duas semiologias refere-se à estruturação do pensamento e as
leituras das relações significante-significado.” (SUNAGAWA: 2010, p.70)
Santaella (1983, p12) assume a ideia, originalmente de Pierce: O signo só pode representar seu objeto para um intérprete, e porque representa seu objeto, produz na mente desse intérprete alguma outra coisa (um signo ou quase-signo) que também está relacionada ao objeto não diretamente, mas pela mediação do signo.
Niemeyer (2007, p25) considera que a união dos signos constitui a linguagem: O signo tem o papel de mediador entre algo ausente e um interprete presente. Pela articulação dos signos se dá a construção do sentido. Os signos se organizam em códigos, constituindo sistemas de linguagem. Esses sistemas constituem a base de toda e qualquer forma de comunicação.
Além da tríade apresentada, existem outras explorações de Pierce: a relação do signo com
o signo, com o objeto e, finalmente, com o interpretante. Assim é possível observar outra tríade
na figura 38:
Figura 38. Desmembramento do signo.
Fonte: SANTAELLA, Lúcia. O que é semiótica. São Paulo: Brasiliense, 1985 5 Semiótica. A semelhança e afinidade da Semiologia à Semiótica: ambas tratam do estudo dos signos e surgiram em momentos muito próximos (início do século XX). A semiologia teve suas origens na Suíça e estendeu seus domínios aos países de língua francesa, enquanto a Semiótica iniciou nos Estados Unidos por meio do filósofo Charles Sanders Peirce (1939-1914). Por força de novas posturas metodológicas, os semiologistas criaram outro movimento, chamados estruturalismo. Em 1969, o comitê fundador da Associação Internacional de Estudos Semióticos, resolveu que as duas ciências fossem fundidas, passando a designar-se somente Semiótica. (SUNAGAWA: 2010, p.70).
56
Tais conceitos discursados podem ser aplicados à estrutura da comunicação humana,
segundo Watzlawick (2011, p.18 e 19): O estudo da comunicação humana pode ser subdividido nas mesmas três áreas de sintaxe, semântica e pragmática para o estudo da semiótica (a teoria geral de sinais e linguagens). [...] a primeira dessas três áreas abrange os problemas de transmissão de informação [...]. O seu interesse reside no problema de código, canais, capacidade, ruído, redundância e outras propriedades estatísticas da linguagem.[...] para que seja perfeitamente possível transmitir séries de símbolos desprovidos de significado se o emissor e o receptor não tivessem antecipadamente concordado sobre sua significação. Nesse sentido, toda a informação compartilhada pressupõe uma convenção semântica.
Percebe-se que surge outra tríade considerada o núcleo da teoria da comunicação6: A trilogia emissor-receptor-mensagem – repetindo, assim, muitos séculos depois, o modelo da Retórica de Aristóteles, de acordo com a qual as “provas de persuasão” residem seja “no carácter moral do orador [ethos]”, seja “no modo como se dispõe o ouvinte [pathos]”, seja, finalmente, “no próprio discurso, pelo que este demonstra ou parece demonstrar [logos].
O grande desafio de comunicar uma mensagem com mais precisão é “decodificar
elementos e a linguagem proporcionada pelo objeto, sobretudo no campo analógico (a
linguagem não-verbal)” (SILVA: 2010, p.11).
Ferrara (2004, p. 53) afirma que, para o desenvolvimento de projetos em design, “o ver
semiótico é uma arma imprescindível ao designer, que incorpora a dimensão cultural à
competência técnica e isso lhe permite aliar o uso funcional do objeto à sugestão informativa de
outros valores culturais”.
Desta forma, busca-se a abstração da forma, com uma grande quantidade de conceitos e
informações sem ruídos, para que os dados sejam interpretados rapidamente. Os elementos
estéticos funcionam como uma massa de modelar na realização de uma interface.
2.4. COGNIÇÃO APLICADA À ARQUITETURA DA INFORMAÇÃO
Com o encaminhamento deste estudo é possível que algumas das percepções visuais que
acontecem na realidade se aplicam ao ambiente virtual. Toda a teoria da forma, as teorias de
Pierce, da informação e de visualização podem embasar teoricamente e, inclusive, de forma
prática, a construção de uma interface dinâmica, interessante, interativa e com informação.
6 Resumidamente, por Serra (2007, p.78), os principais elementos da comunicação são o comunicador (emissor), o conteúdo (da mensagem), o canal, a audiência (o receptor) e os efeitos (sobre os receptores). Outro desses modelos, formulado por Roman Jakobson nos anos 60, procuram descrever a comunicação verbal a partir de seis elementos essenciais, a cada um dos quais corresponde uma determinada função: o destinador (função expressiva ou emotiva), o destinatário (função apelativa), a mensagem (função poética), o código (função metalinguística), o contexto (função referencial) e o contato (função fática).
57
Afinal, busca-se com toda essa dialética e experiência de estudos no campo visual, a base para
aplicação no ambiente web.
Devido à explosão do uso de computadores pessoais, as aplicações e os softwares
puderam evoluir e se tornar intuitivos. Com isso, percebe-se um crescimento de profissionais
que aparentam ser, em maioria, provenientes da área de tecnologia. Em virtude disso, percebe-
se que os conhecimentos específicos sobre percepção, visualização e compreensão da forma
ainda estão em processo de acomodação no que se refere ao uso da arquitetura da informação7,
usabilidade, interface, entre outros.
Estas informações sugerem que há uma preocupação em comum: “melhorar o fluxo de
intercâmbio de informações entre o indivíduo e um dispositivo. Em outras palavras: converter a
interação de um dispositivo em algo fácil de aprender.” (CAIRO: 2008, p.63).
Bell (2010, p.113) acrescenta que “os aspectos de navegação da arquitetura da informação
são bastante úteis para se ter uma ideia de quais páginas funcionam como vias de
comunicação”. Portanto, percebe-se que para desenhar uma interface navegável, os conteúdos
respectivos à arquitetura da informação podem ser importantes.
Lévy (1999) aprofunda ainda mais ao desenvolver uma tese de que o termo interfaces é
designado “a todos os aparatos materiais que permitem a interação entre o universo da
informação digital e o mundo ordinário”.
Para Agner (2009, p.29), existem nove conceitos básicos aplicados à interface: Consistência: sequências de padrões e a construção de linguagem; Atalhos: atalhos e comandos para diminuir o tempo de resposta; Retroalimentação: agilidade na ação e reação do sistema; Diálogos precisos: mensagens de finalização a uma sequência de cliques que deixam o usuário satisfeito e pronto para a próxima etapa; Prevenção de erros: comunicar ao usuário uma ação inapropriada; Reversão: o usuário poder voltar ao estado inicial; Auto-controle: o usuário deve ter sempre a sensação de controlar o sistema e reconhecer as respostas do sistema; Memória humana: deixar sempre os itens importantes para a navegação visíveis; Design centrado no usuário (UCD8): saber como o usuário do sistema se comporta, o que ele espera e quais são seus métodos de navegação.
Alguns autores, como Krug, Kalbach, Belle Cairo, respeitam estes conceitos para o
desenvolvimento de projetos, porém não na mesma sequência. Kalbach (2009), por exemplo,
acrescenta que tais conceitos afetam a credibilidade de informação no site e, consecutivamente,
7 Segundo Bell (2010, p.112), uma das primeiras influências do IHC não veio da psicologia, mas da arquitetura e do design. A arquitetura de informação usou ideias do planejamento urbano para ajudar no entendimento sobre sistemas de informação de hipertexto. Segundo Moraes e Rosa (2008, p.23), arquitetura da informação pode ser definida como o design estrutural de grupos de informações relacionadas [...] se difere do design ou da programação visual pelo fato de focalizar na estrutura. 8 UCD:!Acrônimo do original em inglês User Centered Design.
58
a rentabilidade. Cairo (2008) assume um lado mais estético/funcional, afirmando que quanto
mais visíveis estão as funções de um objeto, mais fácil é a criação de um modelo mental de
navegação. Krug (2008) já é prático e afirma que o usuário é mais ativo e que quer respostas
rápidas. Para Bell (2010, p.67): “Criar limites simples e óbvios para ação dá às pessoas noções claras em relação ao que é possível de se fazer em uma pagina. (...) Em termos de navegação, organizar elementos para que possam ser usados como ferramentas de navegação funciona bem.”
Segundo Moraes e Rosa (2008), para estabelecer o intercâmbio entre os indivíduos e o
dispositivo são necessários o entendimento dos princípios de interação e a arquitetura da
informação. O princípio básico é desenvolver sistemas nos quais os usuários possam executar as
tarefas com segurança, eficiência e satisfação – o que é definido como usabilidade.
Krug (2008) sugere que a usabilidade deve ser um fator comum em todo o projeto e que a
intuição precisa se constituir como algo predominante no desenvolvimento de uma interface.
Na figura 39, Krug mostra a reação do usuário em tipos de usabilidade diferentes. Ao
visualizar a imagem, é possível concluir que o uso da percepção e interpretação do usuário é
muito explorado no ambiente virtual.
Figura 39. Comparação de uso na web.
Fonte: Krug (2008, p.15)
Agner (2009, p.12) chama a atenção do desenvolvedor para o detalhe de que muitas vezes
um projeto é construído para um cliente, e nem sempre é o cliente que vai ser usuário do
sistema. Desta forma, o desenvolvedor tem que estar atento para conhecer diretamente o
usuário. Kalbach (2009) concorda com Agner quando afirma que: Ele consiste de metodologias que tornam o usuário uma parte integral do processo de desenvolvimento, com atividades como entrevistas, observações e vários tipos de testes. Isso substitui o trabalho de adivinhar o comportamento do usuário e fazer suposições sobre isto baseadas em pesquisa. No final, o design geral do site deve espelhar como os usuários entendem o assunto e como eles esperam encontrar as informações que precisam. (KALBACH: 2009, p.38)
Braga (2004) sintetiza que os usuários:
59
detêm o controle de todas essas funções através da utilização das Interfaces Gráficas de Usuário (G.U.I.), ou simplesmente Interface. Este termo, de acordo com o dicionário, significa um ponto comum, uma divisa ou fronteira entre duas coisas. Isso direciona as G.U.I.s para a função de ponto de interconexão entre o usuário e a tecnologia, para um sistema de interação entre o homem e a máquina. O que explica, então, as funções de qualquer interface homem-máquina é a definição de sistemas. (BRAGA: 2004, p.10)
Em conformidade à linha de raciocínio de Braga, Moraes e Rosa (2008) comentam que o
projeto de interfaces interativas é para fazer o usuário participar e ter uma experiência
confortável e satisfatória. Em função disso, é preciso criar mecanismos para diminuir o excesso
de cargas cognitivas, estéticas e de usabilidade.
Assim, percebe-se que a cognição9 é importante para que a navegabilidade funcione com
êxito. Segundo Bell (2010, pg67), “organizar elementos para que possam ser usados como
ferramentas de navegação” pode ser um verdadeiro desafio para o designer. Já para Rodrigues
apud Machado é o principal instrumento para composição de novos modelos e formatos de
narrativas multimídia.
Quando o projeto de navegação está sendo construído, tudo está organizado para o
usuário encontrar o que necessita. Krug (2008) mostra que, na realidade, é um caos, porque os
olhos não seguem o caminho convencional como na leitura de um livro (a imagem à direita na
figura 40), da direita para a esquerda e de cima para baixo. A leitura feita no meio virtual é
aleatória (figura 40, à esquerda) - os olhos percorrem todo o ambiente como se estivessem
procurando algo interessante que acione o mecanismo de percepção.
Figura 40. Cognição durante a navegação.
Fonte: Krug (2008, p.21)
9 Santaella (2004, p.73) explica que cognição é o ato de delinear quais habilidades motoras, perceptivas e mentais são colocadas em ação pelo leitor imersivo, habilidades que se distinguem daquelas que são empregadas por um leitor de livro e por um espectador de imagens.
60
Krug (2008) ressalta que a leitura no ambiente virtual acontece rapidamente, e faz uma
comparação: é como se o usuário que navega estivesse passando por uma mídia externa em um
carro a 140km/hora. Ou seja, o usuário capta pouca informação e só fixa atenção em algo que
realmente seja importante para ele. O design mostra os caminhos, mas é o usuário que vai
escolher o trajeto que quer percorrer, modificar ou participar.
A navegação é o espaço por onde o usuário acessa um mecanismo de interação, como
software, página, aplicativo, e, no caso deste trabalho, infográfico. Agner (2009) afirma que a
navegação é o movimento cognitivo através dos espaços de informações e conhecimentos. “Os
documentos eletrônicos não são apenas observados, agora os usuários têm o poder de interagir e
modificar.” (AGNER: 2009, p.17).
Para Cairo (2008, p.25), “se o designer é consciente de que a percepção humana
discrimina com mais rapidez as variações de cores, texturas (variações da intensidade da luz
refletidas pelos objetos) e diferentes formas”, entenderá como trabalhar cada conceito na
composição visual. Como resultado, atrairá a atenção para locais específicos do projeto.
Para navegar, alguns elementos são considerados em um primeiro estágio de análise.
(Figura 41)
Figura 41. Sistema de navegação principal.
Fonte: Agner (2008, p.24)
Para o Instituto Asilomar, a arquitetura da informação pode ser definida como design
estrutural de grupos de informações relacionadas à ciência ou às artes. A organização estrutural
de sites, aplicativos e software tem como foco trazer princípios de design e arquitetura para o
ambiente digital. O instituto disponibiliza um trabalho feito por Jesse James Garrett (anexo 2),
onde é estruturada cada etapa, que, segundo os resultados dos estudos, são os itens mais
importantes da arquitetura de informação.
Agner (2008) mostra um sistema simples de arquitetura, apenas em um sistema inicial que
introduz ao de interação, mais elaborado, que Kalbach explora mais profundamente. Na figura
42, sugere ir além da navegação de uma página inicial e alcançar um sistema de navegação
entre conteúdos e páginas.
61
Figura 42. Comparação de uso na web.
Fonte: Kalbach (2009, p.6 – 10)
Para Bell (2010, p.112): “A arquitetura de informação descreve como as informações são organizadas para que sejam relevantes a diferentes grupos de usuários. Organização e forma de informações é o grupo de ferramentas principais, mas a biblioteconomia tem contribuído muito. Vocabulários controlados, taxonomias e descrições formais de conteúdo como objetos oferecem uma boa forma de lidar com grande volume de conteúdo. (...) Os aspectos de navegação da arquitetura de informação são bastante úteis para se ter uma ideia de quais páginas funcionam como vias de comunicação.”
Todos estes conceitos são suportes para o desenvolvimento de projetos de interação e
interface, principalmente para infográficos. Na figura 43, é possível analisar uma infografia,
62
feita pelo IG, como é o comportamento da informação dentro destes sistemas, a partir de um
conteúdo sobre a bateria da escola de samba Grande Rio.
Figura 43. Tela inicial da infografia.
Fonte: Portal IG. Disponível em http://bit.ly/zOXnWe
Observa-se que os elementos de navegação estão visíveis na parte superior, junto ao
elemento onde estão informações sobre o que o usuário vai encontrar em cada componente
(comande a bateria, os instrumentos, mestre de bateria, a bateria na avenida e os créditos).
Abaixo, os elementos gráficos mostram o comportamento da bateria na avenida.
Próximo ao ícone do apito há uma mensagem explicando como o usuário deve operar o
sistema. O infográfico fornece apenas uma sugestão de navegação, mas um internauta mais
experiente pode usar os elementos de navegação para explorar toda a plenitude de informações.
As figuras acima mostram a aplicação de alguns conceitos de navegabilidade pela criação
de padrões estéticos, simbólicos e organizacionais. Assim, a linha de menu se mantém igual do
começo ao final da sequência, como mostra a figura 44, auxiliando na criação de um modelo
mental para o usuário - separa os instrumentos usados pelos integrantes da bateria em cores
diferentes, e com sinais mostra o trajeto feito durante o momento mais importante da
apresentação da bateria, o recuo. Logo abaixo do menu “A bateria na Avenida” existe a
subnavegação que expõe em qual etapa do processo o usuário está. Por fim, nota-se que em
63
cada processo existe um pequeno texto explicando cada etapa, caso o usuário necessite de
auxílio verbal.
Figura 44. Navegabilidade e estética aplicadas em uma infografia.
Fonte: Portal IG. Disponível em http://bit.ly/zOXnWe
A infografia também explora os conceitos de interação, e encaminha o usuário para ser
um mestre de bateria – é possível comandar musicalmente a bateria com o se estivesse na
avenida.
Portanto, este infográfico do IG sugere vínculos de interação com o usuário, mas é polido
se esclarecer a diferença entre as palavras interativo e interação. Percebe-se o uso contínuo sem
conhecimento do significado. As duas palavras se diferem pelo fato de que interativo é indireto
e a interação é direta, ou seja: Interação na sociologia: nenhuma ação humana ou social existe separada da interação. (...) designando a influência recíproca dos atos de pessoas ou grupos. (FERNANDES: 2006 p.25). Interação na ciência da computação: na ciência da comunicação, interação é definida como a relação entre eventos comunicativos. Essa definição considera “comunicação interpessoal”, “relacionamento humano” e “interação humanos” como sinônimos. O conceito de interação vem de épocas remotas; entretanto, o de interatividade é recente. (FERNANDES: 2006, p.26).
O significado da interação veio muito antes da interatividade, pois esta surgiu depois da
disseminação dos computadores pessoais, segundo Fragoso (2001, p.10): Em 1954, propunha-se um programa que permitia desenhar num monitor. Porém, o verdadeiro impulso para uma interatividade nessa área foi dado por Ivan Sutherland, em 1963, com o programa Sketchpad, onde o usuário podia desenhar diretamente no monitor através de uma caneta (pen light). A partir disso, ainda nos anos 1960, o termo interatividade foi cunhado como uma derivação do neologismo inglês interactivity.
64
Entretanto, Lévy (1999) sugere que interação são atividades humanas com articulação de
pensamento e ação entre: pessoas, entidades materiais naturais e artificiais, ideias e
representações. É impossível separar o humano de seu ambiente material, assim como dos signos e das imagens por meio dos quais ela atribui sentido à vida e ao mundo. Da mesma forma, não podemos separar o mundo material - e menos ainda sua parte artificial - das ideias por meio das quais os objetos técnicos são concebidos e utilizados, nem dos humanos que os inventam, produzem e utilizam. (LÉVY: 1999, p.22).
Segundo as próprias definições, Lévy (1999) também assegura que ao procurar aumentar
a autonomia, as experiências interativas multiplicam as faculdades cognitivas do usuário.
Kotler (2010, p. 37) faz um adendo sobre a interatividade no mundo do marketing,
afirmando que “a experiência de um produto jamais é isolada. É o acúmulo das experiências
individuais do consumidor que cria maior valor para o produto. Quando os consumidores
individuais experimentam o produto, personalizam a experiência de acordo com necessidades e
desejos singulares”.
Já Quéau afirma que: “a verdadeira revolução reside, no entanto, nas possibilidades
específicas da infografia, notadamente na sua capacidade de interação com o espectador e na
sua possibilidade de geração em tempo real, dando assim o sentimento de uma “imersão” na
imagem”.
Em linhas gerais, conclui-se que para poder haver interação são necessárias duas pessoas
conectadas por um dispositivo, como um canal de bate-papo, por exemplo, ou um jogo online
ou em dupla. Na interatividade, a resposta de uma ação vem do mecanismo utilizado, um
sistema, uma ferramenta, um dispositivo móvel, ou seja, um jogo que se joga com um
computador sem a participação de outro ser humano. Portanto, a ação do usuário ao controlar a
Bateria da Grande Rio está em um processo de interatividade.
Desta forma, é possível avaliar a importância deste processo dentro da infografia, pois,
conforme análise, a interatividade é um instrumento que instiga a curiosidade e a liberdade na
navegação de um conteúdo informativo.
65
3. REFERENCIAIS DE PROJETO
3.1 A bateria da Grande Rio.
A infografia composta pelo portal IG é de entretenimento - informa e diverte no mesmo
instante em que o usuário interage com os recursos. Durante o trajeto percorrido, é descrito o
comportamento da bateria e quais instrumentos são utilizados, além de explicar como o mestre
deve se comportar. O mais interessante é a interatividade oferecida para o usuário assumir o
comando a escola, o que torna explícita a terceira fase da transposição da infografia.
O objetivo deste trabalho foi desenvolver uma interface com liberdade para navegação e,
principalmente, proporcionar interatividade ao transformar o usuário em ator do infográfico,
deixando ele comandar a escola de samba.
Outro ponto interessante são as informações – são apresentados os instrumentos, os
componentes da escola e a forma como acontece o desfile na passarela. Acredita-se que este
exemplo alcança a forma informacional e de entretenimento.
Figura 45. Tela inicial da infografia.
Fonte: Portal IG. Disponível em http://bit.ly/zOXnWe
3.2 Behavioural Dynamics Institute.
66
Vídeo que mostra como se comporta a percepção dos indivíduos frente a informações que
são construídas de formas diferentes. Ad informação é interpretada e processada, e o sentimento
é exposto pelo indivíduo.
A linguagem do vídeo é acessível, pois utiliza exemplos simples para descrever esse
processo perceptivo. As informações são direcionadas para o mercado, ou seja, publicidade ou
marketing, no entanto, o vídeo apresenta como o comportamento pode mudar de acordo com a
forma que a informação é utilizada ou manipulada.
Busca-se, com este vídeo, compreender como a informação pode ser interpretada e qual é
a melhor forma de enviar uma mensagem visual. Além disso, é possível entender como a
informação pode ser recepcionada pela cognição e percepção do usuário, e, com isso, direcionar
a interface para uma visualização mais acertiva.
Figura 46. Imagem de um trecho do vídeo.
Fonte: Youtube. Disponível em http://bit.ly/xlDSS2. Acesso em 22/09/2011
3.3 Brasília 50 anos.
Este é um especial desenvolvido pelo Governo Federal para o aniversário de 50 anos de
Brasília. Apresenta sistema de busca com filtro de categorias, o que atende a visão estudada
neste trabalho, mas deixa a estética e os sentidos cognitivos em segundo plano. Outra
67
característica importante é a linha do tempo secundária, logo abaixo da principal, que mostra a
cidade e os fatos políticos ocorridos naquele momento da história.
O objetivo de analisar este material é a forma externa ao conteúdo, ou seja, os elementos
de busca. A proposta deste trabalho é uma interface que possibilita ao usuário buscar e cruzar os
dados entre balneário em que está e os outros do Estado.
Figura 47. Tela inicial da linha do tempo.
Fonte: Governo Federal. Disponível em http://bit.ly/x6rc1w. Acesso em 03/11/2011.
3.4 Design de informação.
O vídeo discute alguns dos principais quesitos da infografia e do estado que apresenta no
ambiente virtual. Utiliza cores e símbolos para exemplificar os conceitos, como contar uma
história e compartilhá-la. Alguns destes conceitos foram apresentados neste trabalho:
visualização de dados, cognição e percepção da forma e dos elementos psíquicos, e de que
forma abstrair os dados de uma informação retirando as partes que causam ruídos ao
interpretante.
Neste vídeo é possível verificar formatos de análise de dados, conforme apresentados por
Sanagawa (2010), porém com outra linguagem, como modos de implantação versus variáveis
visuais versus níveis de organização.
68
Figura 48. Trecho do vídeo sobre design de informação.
Disponível em http://vimeo.com/29684853#. Acesso 09/11/2011.
3.5 Diagramming/Mapping (complex) information: Theory and Practice. Disponível
em http://bit.ly/wQIGkH. Acesso 13/03/2012.
Artigo de um blog que fala sobre infografia, mapas e a origem destes na cartografia. O
texto mostra que diagramas e mapas unidos trabalham com informações complexas que podem
ser trabalhadas apenas visualmente. Segundo o artigo, na era da informação, o boom é da
visualização de dados - quase tudo o que é produzido, é visualizado. Infografia, design de
informação, representações esquemáticas, diagramação e visualização de dados de mapeamento
estão no auge. No entanto, estes métodos nasceram há anos, e renascem com o uso de
ferramentas digitais.
O que se busca neste artigo é o aprofundamento em diagramação e em mapeamento de
dados. O artigo discute sobre o estado da arte e a história da infografia no ambiente virtual.
3.6 El periodista y los mapas.
Post do blog Periodismo con futuro, do El País, escrito por Alberto Cairo, que explica e
mostra a evolução do uso de mapas em textos, jornais, livros ou manuscritos. Cairo cita toda a
importância e a mentira dos mapas na história.
Com esse artigo foi possível compreender formas de localização, métodos para utilizar
um mapa, distorções, ícones e linguagens diferenciadas para cada mapa. Neste trabalho será
utilizado um mapa localizando as praias analisadas pelo relatório de balneabilidade da Fatma.
69
Figura 49. Distorções que pode aparecer em um mapa.
Fonte: El periodista y los mapas. Disponível em http://bit.ly/xJZXjS. Acesso em 08/12/2011.
3.7 Entrevista com Erik Spiekermann.
Spiekermann é um typedesigner e arquiteto da informação e explica sobre a metodologia
que utiliza e o processo criativo. Afirma que um bom líder é formado por uma boa equipe e que
nada se constrói sozinho.
Neste vídeo, Spiekermann comenta sobre novas linguagens visuais, processo de design,
analogias entre música e tipografia. Por isso, justifica que é necessário melhorar a cultura para
visualizar novas ideias e oportunidades. O que se analisou neste vídeo é a metodologia que ele
utiliza para desenvolver as tipografias. Também se buscou compreender os sentidos metafísicos
de uma ideia e como esta ideia pode ser esboçada ou construída de forma concreta.
Figura 50. Trecho da entrevista com Erik Spiekermann.
Fonte: Vimeo. Disponível em http://vimeo.com/gestalten/erik-spiekermann. Acesso em 23/01/2012.
70
3.8 Estadão: O vírus da gripe suína.
Este trabalho do Estadão é típico do início da transição dos infográficos para a internet.
Apresenta apenas dois movimentos de interatividade, um de avançar e outro de voltar. Neste
infográfico, buscou-se contextualizar as etapas de transição, e foi possível observar que
representa a primeira fase.
Figura 51. Primeira fase da transição da infografia.
Fonte: Estadão. Disponível em http://bit.ly/upc1PO. Acesso em 27/04/2009.
3.9 Global Agenda Survey 2011.
A Global Agenda Survey 2011 foi um trabalho encomendado aos membros da Agenda do
Conselho Global para identificar as tendências mundiais mais importantes que provavelmente
impactariam a economia global, a sociedade e o meio ambiente nos próximos 12-18 meses. Esta
apresentação destacou as principais conclusões da pesquisa.
Na apresentação, buscou-se analisar a utilização dos conceitos de visualização de dados
traçados, o comportamento destes quando transformados em informação, o cruzamento de
dados e o visual da interface. Também foi analisada a utilização dos recursos apresentados pelas
leis da Gestalt, os conceitos expostos por Wong e por Sanagawa. Assim, foi possível verificar
como se comportam as cores, os ícones, os gráficos de dados, a navegabilidade e a cognição.
71
Figura 52. Visualização da Agenda Survey 2011
Fonte: Report. Disponível em http://bit.ly/zZgXPp. Acesso em 08/01/2012.
3.10 Hans Rosling: profile on TED.com.
Grande inspirador desse trabalho, Hans Rosling é um médico sueco que visualizou
informações estatísticas sobre a humanidade e fez comparações em diferentes países, utilizando
técnicas de visualização de dados. Inovador e muito espirituoso, Rosling interage com o gráfico
e explica alguns pontos importantes. É o criador do GapMinder, que utiliza a manipulação de
dados online a partir do cruzamento, contextualizando os dados mais importantes da história
desde 1800 até 2011.
As concepções adquiridas a partir das análises históricas feitas por Rosling mostraram que
os dados de balneabilidade podem ser armazenados e recuperados em uma interface, conforme
o projeto GapMinder. Desta forma, foi o que direcionou este trabalho.
Figura 56. Profile de Hans Rosling no TED.
Fonte: Ted. Disponível em http://bit.ly/rxLsL6. Acesso em 04/06/2011.
72
Figura 57. Visualização de dados do Gapminder
Fonte: Gapminder. Disponivel em http://bit.ly/MnyyE4. Acesso em 06/05/2007.
3.11 Hotsite Brasília 50 anos: como foi construído.
O hotsite do aniversário de Brasília foi produzido pela Magel Studio, e este link mostra a
metodologia utilizada pelo escritório.
Para este trabalho, buscou-se compreender a metodologia utilizada pela Magel ao
construir o hotsite em comemoração aos 50 anos de Brasília: os processos criativos, as
alterações necessárias durante o desenvolvimento do projeto, alinhamentos, linha do tempo,
navegação, interface, entre outros tópicos.
73
Figura 58. Processo criativo da arquitetura da informação utilizada pela Magel.
Fonte: Magel Studio. Disponível em http://bit.ly/ywXXnQ. Acesso em 03/11/2011.
3.12 Map of New York City Police Stops: Interactive Feature.
Este é um dos primeiros trabalhos construídos pelo NYT labs que tem como característica
o estudo com base de dados e design de interface. Também considera o compartilhamento –
com o uso da barra superior, os usuários podem compartilhar a informação entre si. Neste caso,
procurou-se entender o mecanismo de manipulação de dados junto à utilização da ferramenta do
Google Maps, e se realmente a interface poderia ser manipulada conforme a necessidade de um
projeto.
74
Figura 59. NYT Labs.
Fonte: NYT Labs. Disponível em http://nyti.ms/vrhDuE. Acesso em 03/04/2011.
3.13 Max Planck Research Networks.
Mapa construído para mostrar as publicações acadêmicas dos últimos dez anos nos EUA.
A dinâmica de rede compõe um mapa de alto nível do Instituto Max Planck e as conexões
referentes a este. O mapa apresenta ícones com tamanhos diferentes que representam o número
de publicações, e a largura das linhas expõe o número de publicações feitas em conjunto com o
instituto. Estas informações são disponibilizadas em tela touch screen – o que representa uma
nova forma de interatividade com o usuário.
Figura 60. Max Plank Institute
Fonte: Max Plank Institute. Disponível em http://bit.ly/wA8RNL. Acesso em 23/09/2011.
75
3.14 Palestra de Moritz Stefaner : Designer de informação. Disponível em
http://vimeo.com/28443920. Acesso em 23/01/2012.
Stefaner apresenta a metodologia e o processo criativo que utiliza durante um congresso
da Organization for Economic Co-operation and Development (OECD). Mostra quatro
exemplos de metodologia para visualização da informação e explana sobre os detalhes de cada
projeto.
3.15 The Fundamental Elements of Design.
Vídeo que apresenta os elementos fundamentais do design, como ponto, linha, forma, e
cores, além de mostrar como se transformam em um mecanismo de comunicação. Utilizou-se
este vídeo para compreender como se introduz os conceitos de design na infografia online.
Figura 61. Trecho do vídeo The fundamental elements of design.
Fonte: Erica Gorochow. Disponível em http://bit.ly/AvZDjK. Acesso em 27/01/2012.
3.13. Zero Hora: Especial Segunda Guerra.
Este infográfico, composto pela Zero Hora, utiliza a segunda fase da infografia no Brasil,
com recursos de vídeos, fotos e hiperlinks, para transmitir informações sobre a Segunda Guerra
Mundial.
Este trabalho é referência da segunda fase da transição da infografia online, em que se
percebe a utilização da convergência de mídias, como jogos eletrônicos, vídeos, hiperlinks,
entre outros.
76
Figura 63. Infográfico do jornal ZH sobre a Segunda Guerra.
Fonte: ZH. Disponível em http://bit.ly/u1H92C. Acesso em 07/08/2011.
77
4. METODOLOGIA DE PROJETO
Em um planejamento de viagem, por exemplo, é estabelecido qual é o destino, tempo de
estadia, transporte, quanto de dinheiro é necessário, entre outras questões. Mas alguns itens
podem passar despercebidos, ou até mesmo pode acontecer de aparecer roteiros alternativos
interessantes em certo momento da viagem.
Qualquer metodologia, como Panizza (2004) comenta, é passível de adaptações. No do
universo do design, as metodologias são aplicadas para sugerir e especificar um trajeto ou os
processos de forma que se atinjam os objetivos de um projeto - neste caso, desenvolver uma
interface para um infográfico online.
O desenvolvimento do projeto tem como possibilidade mesclar várias metodologias,
portanto, a utilização de vários autores pode ser necessária. Panizza (2004) argumenta que o
grau satisfatório de uma metodologia em um projeto não significa necessariamente que esta
metodologia pode ser aplicada em outros projetos.
Contudo, as metodologias engessaram alguns processos e, na sociedade pós-moderna,
segundo Panizza (2004), os projetos obtiveram liberdade quase que total, criando, assim,
processos únicos e produtos inovadores com grande valor de mercado. Dentro desta avaliação
de Panizza (2004, p.81), é importante ressaltar que durante o pós-moderno “a forma sobrepujou
a função, a expressividade, o método e a valorização de objetos "conceituais" cresceu
dramaticamente.”
Ferrara (2004, p.55 a 57) sugera que: Para o design, essa experimentação se confirma por meio de um diagrama que usa o desenho analógico ou digital para testar, em interfaces complementares, materiais, tecnologias, técnicas, resistências, formas, funções, volumes, espaços, visualidade, legibilidade ou identidade cabendo, em cada caso, uma ampla discriminação de características e, sobretudo, uma complementaridade responsável por uma interface que, atualmente, se impõe pela possibilidade de sincretizar linguagens e veículos, tecnológicos ou não. Mas, em qualquer caso, pensa-se em produção nova e capaz de intervir para mudar. [...] Interfaces de procedimentos e de linguagens, associações contínuas, interatividade entre produção e consumo constituem a tarefa rotineira do designer e concretizam uma atividade de recombinações que a semiótica já propõe como atividade sistêmica, e que a moderna hipermídia só faz reconhecer ou reapresentar.
A metodologia pode ser uma poderosa ferramenta na redução de erros, tempo e custo.
Entretanto, observa-se que a prática profissional não pode ser negligenciada, pois é por meio
desta prática que as regras são quebradas. Bonsiepe (1997, p.187) segue no mesmo prisma, e
defende uma visão mais suave: “a teoria pode ser caracterizada como domínio no qual se
desenvolvem distinções que contribuem para uma auto-interpretação refletida na prática
projetual”.
78
A metodologia no design busca resolver problemas e, segundo Munari (1981), se um
problema não tem solução então não é um problema. Para falar sobre metodologia, é preciso ter
um problema passível de solução. Busca-se, com a metodologia, responder os requisitos do
projeto que pretendem fornecer usabilidade e navegabilidade a uma interface para um
infográfico que apresenta dados sobre a balneabilidade do litoral catarinense.
Como todo o projeto de design precisa seguir planos e metodologias, segundo Cardoso
(2004), há necessidade de gerar objetivos, planos, esboços ou modelos.
O processo do projeto se assemelha com uma receita gastronômica, em que o chef segue a
receita sem desconsiderar a intuição e a experiência. Munari (1983, p.20) afirma que “o método
projetual não é mais que uma série de operações necessárias, dispostas em ordem lógica, ditada
pela experiência. O objetivo é atingir o melhor resultado com o menor esforço.”
Ao iniciar um projeto de design, é muito importante definir os valores e objetivos
essenciais do projeto por meio do briefing, como afirma Phillips (2007). Mas nem todos os
valores são absolutos e imutáveis – acontecem adaptações conforme o andamento do projeto.
Munari (1983) concorda com essa ideia quando afirma que as regras e os métodos do design
não bloqueiam o projetista, pelo contrário, aguçam a percepção e estimulam a criatividade.
Segundo Phillips (2007), no processo de elaboração do briefing todas as etapas do projeto
são analisadas e estipuladas para evitar perda de tempo e recursos. É uma importante ferramenta
para que o projeto atenda as metas estratégicas. Geralmente, neste processo, é especificado o
tipo do trabalho (produto, web, editorial, embalagem), a quem se destina, quais as
especificações do projeto, o cronograma e os orçamentos, além de outras informações
pertinentes ao projeto.
Em entrevista concedida à Juliana Guimarães Carvalho, Fabio Abreu, editor de arte do
Jornal A Notícia, afirma que o ideal é que o infografista participe de todo o processo, desde a
ideia, apuração, pesquisa e consulta de fontes. Nem sempre a produção acontece assim, a
“demanda e as urgências de um jornal diário não permitem um processo perfeito”. Assume que
o infografista “algumas vezes influencia e organiza todo o processo, em outras recebe um
pacote pronto”. Quando este último caso acontece, já existe um estilo pré-definido, chamado
template.
Abreu comenta que o processo de criação começa no briefing (ou pauta para o
jornalismo), independente se é verbal ou descritivo. O responsável pelo trabalho desenvolve um
esboço, “para ter uma ideia de como vai organizar a informação” e ver o comportamento da
leitura, define as cores, pesquisa imagens, entra em contato com fontes, por meio de entrevistas,
leitura e livros. Depois revisa o layout e avança para a estética, revisões, correção e o
79
acabamento. Segundo Abreu, este processo só acontece com prazos “elásticos” - no cotidiano,
as infografias mais simples são solucionadas com os templates, para agilizar o trabalho e
cumprir o horário de fechamento do jornal.
Observa-se que algumas etapas de elaboração de um infográfico impresso podem atender
a estruturação do infográfico online. Carvalho (2007, p.58) estruturou a infografia impressa da
seguinte forma: Pauta/Briefing: discussão e definição do tema; Apuração e levantamento de dados: pesquisa e consulta de fontes; Análise de similares: inspiração e referencias estéticas; Elaboração de conteúdo: o texto em si; Arquitetura da informação: texto, imagem, forma; Arte final: esboço é convertido para o layout final. Cores, texto e imagem ganham propriedade informacional; Acabamento: ajustes, tratamento nas imagens e preparação para a impressão; Revisão: todo o texto e legibilidade é revista; Publicação: enviado para o suporte que deverá ser publicado; Análise crítica: avaliação do produto final para o crescimento e amadurecimento com intuito de aprendizagem.
Todos estes métodos foram pesquisados por profissionais da área e ajudaram na
composição de um organograma de procedimento estruturado por Carvalho (2007). Na figura
64, Carvalho (2007) exemplifica visualmente as etapas de elaboração do infográfico estático na
mídia impressa. Desta forma, pode ser que sejam utilizadas metodologias de interface junto à de
Carvalho (2007).
Figura 64. Contextualização visual dos métodos da infografia impressa.
Fonte: CARVALHO (2011, p.60).
80
Para sintetizar, a infografia é constituída por linguagem visual composta por regras
estabelecidas por meio da semiótica e estética e com o objetivo de enviar alguma informação.
Entretanto, no momento da análise de execução e acabamento, parte destacada na figura
7, da metodologia projetual sugeria por Carvalho (2011), percebeu-se que, para a interface
atingir os objetivo, é necessário verificar os modelos de estruturas da arquitetura da informação
apresentadas por Kalbach (2009), de legibilidade propostos por Nielsen e Loranger (2007).
Além disso, também é preciso averiguar o escopo da produção do desenho exposta pelo Projeto
E, que apresenta itens que podem facilitar a finalização e análise heurística da interface final.
Assim, é possível analisar algumas mudanças na estrutura projetual, a partir da estrutura
básica da infografia apresentada por Carvalho (2011), que utiliza o mesmo embasamento da
metodologia impressa. Ou seja, no meio impresso precisa-se de um briefing e a apuração é
comumente utilizada, mas ao mudar a plataforma de publicação, a execução é necessária uma
adaptação dos métodos de execução e acabamento.
4.1 Briefing/Pauta
Caio Maia, presidente e fundador da Chilli Beans, em entrevista ao professor José
Dornelas, afirma que para que um bom projeto dê certo “é necessário ter uma base sólida”.
Alberto Cairo sempre comenta, em palestras e workshops, que um bom infográfico começa por
uma boa pergunta.
Portanto, se a internet tem a capacidade de armazenar, atualizar e recuperar dados, por
qual razão não arquivar e utilizar essa capacidade? Este valor que a internet pode trazer para a
interpretação de dados lembra o questionamento original desta pesquisa. Como criar uma
interface gráfica que atenda aos requisitos de infografia online e que interprete os dados
disponibilizados pela Fatma, mostrando o índice de poluição das praias do litoral de Santa
Catarina?
Durante o verão, os dados sobre a balneabilidade são divulgados toda sexta-feira e são
disponibilizados em tabelas no meio impresso, conforme o anexo 4. Com este trabalho, busca-
se transformar tais dados tabelados em gráficos, oferecendo à população catarinense uma forma
de visualizar o índice de poluição da praia que cada usuário frequenta. São dados que podem
gerar gráficos semestrais e anuais.
Ou seja, o trabalho em questão pretende adaptar os dados fornecidos pela Fatma sobre a
balneabilidade do Litoral Catarinense, localizando cada praia e gerando gráficos semanais,
durante o verão, sobre os índices de poluição nas praias analisadas.
81
4.2 Apuração e levantamento de dados
O objetivo da apuração de dados é disponibilizar visualmente os dados apresentados pela
Fatma durante o verão em um relatório semanal sobre as condições das praias no litoral
catarinense - durante o inverno, o relatório é quinzenal.
Durante a produção serão utilizados recursos de software de diagramação, ilustração e
arte final. As informações necessárias para compor a interface do infográfico são apresentadas
na figura 65, em que são apontados os balneários pertencentes a cada município do litoral
catarinense e a condição das praias é destacada como própria ou imprópria - estes dados são os
geradores dos gráficos. Abaixo da lista apresenta-se um pequeno gráfico mostrando o índice do
município escolhido.
Figura 65: Relatório online da balneabilidade.
Fonte: Fatma. Disponível em http://bit.ly/LebCXu. Acesso em 26/06/2012.
82
Esta interface é disponibilizada para todos que tenham interesse em saber como está a
saúde do balneário que tem interesse de conhecer ou onde possuam residência de veraneio.
No desenvolvimento do projeto, será necessário um período para analisar os dados,
converter os dados em sistema de linguagem visual e analisar quais são importantes para a
população, além de concepção de busca, navegabilidade e implantação. Por fim, será publicado
no ambiente web.
4.3. Arquitetura de informação
O modelo, apresentado por Kalbach (2011), de informação líquida, possibilita ir de um
estado a qualquer outro, e isto proporciona acesso ágil ao usuário experiente, que vai estabelecer
o trajeto de navegação com a interface. (Figura 66)
Figura 66. Informação líquida
Fonte: Kalbach (2008, p.25)
Desta forma, a arquitetura da informação líquida parece responder às necessidades do
projeto. Esta escolha pode ser embasada segundo o projeto GapMinder do professor Hans
Rosling, em que o usuário acessa todas as informações em uma plataforma, e pode navegar por
conforme a necessidade.
Percebe-se, por meio da arquitetura da informação, que alguns itens serão utilizados na
interface, como mapas, gráficos, gráficos de comparação, linha do tempo, compartilhamentos e
um relato projetual.
Principal
Mapas
Visualização de dados
Período do arquivo dos
dados
Compartilhamento dos
dados
Histórico
do projeto
83
4.4 Interface
Após verificar a arquitetura da informação, é possível perceber que, para levar a
informação ao usuário, podem ser necessários mapas, gráficos e linha do tempo. Portanto,
analisa-se que, por meio da ferramenta apresentada pelo Google Maps, pode-se usar um mapa já
existente, modificando as configurações. Na figura 67, é apresentado um showcase de quatro
configurações do Google Maps. Nota-se que cores, estradas, vegetação, entre outras
configurações, podem ser manipuladas, conforme critérios do projeto.
Figura 67. Showcase de quatro tipos de configurações do Gmaps.
Fonte: Google Maps Develpment.
Os gráficos comparativos podem utilizar bolhas com índice de porcentagem, apresentadas
por outra ferramenta disponível - a FusionCharts, apresentada na figura 68. Os gráficos podem
também ser aplicados como uma camada superior do mapa, como é possível notar em um
modelo real apresentado pelo NYT nos referenciais de projeto.
Figura 68. Showcase de gráficos de bolhas.
84
Fonte: Fusioncharts. Disponível em http://bit.ly/MW7Gg2. Acesso em 28/06/2012.
De acordo o relatório de balneabilidade da Fatma, pode-se perceber que existem duas
variáveis - própria e imprópria. Desta forma, a ferramenta Fusion oferece a visualização
diferenciando por cor ou símbolo, e, neste caso, opta-se pela diferenciação de cor, pois além das
duas variáveis, o gráfico terá uma terceira, que analisa o maior índice de ocorrência dos termos
própria e imprópria em determinado balneário.
Nesta terceira variável pode ser utilizado o mesmo conceito que o NYT utiliza no gráfico
Map of New York City Police Stops: Interactive Feature, em que, conforme a incidência das
bolhas, aumenta ou diminui. Outra forma de analisar este dado é por saturação de cor: quanto
maior a incidência do impróprio, o vermelho fica mais evidente, ou quanto mais próprio para
banho é o balneário, a cor tende a ficar verde.
Figura 69. Bubble Chart com diferenciação de cores.
Fonte: Fusioncharts. Disponível em http://bit.ly/MW7Gg2. Acesso em 28/06/2012.
A análise dos dados pode também ser apresentada por período, conforme é apresentado
pela base do gráfico do GapMinder. Para este trabalho, foi feita uma comparação entre a linha
do tempo apresentada pelo Gapminder e pela equipe Magel, no aniversário dos 50 anos de
Brasília. Observou-se que o Gapminder é mais sucinto, abstrai a informação e apresenta com
uma sensação visual mais simples e informativa.
85
4.5 Legibilidade
Após a explanação sobre a arquitetura da informação, segundo metodologia apresentada,
parte-se para arte final. Como referência, será considerado o método da equipe da Magel e do
Projeto E, estruturando o layout conforme a hierarquia da informação. Na figura 70, evidencia-
se como será a página, a partir da definição de cores, tipografia e ícones, e da construção do
layout além do esboço do papel, partindo efetivamente para o desenvolvimento.
Figura 70. Esboço e finalização de layout.
Fonte: Magel Estudio.
4.5.1 Estudo de cores.
A escolha das cores utilizadas no projeto foi feita com a ajuda da ferramenta Kuller, da
Adobe, exposta na figura 71, que faz analogias com outros recursos dentro do círculo
cromático, facilitando e agilizando a escolha cromática do projeto.
Conforme os conceitos da psicodinâmica das cores, é possível evidenciar que cores
quentes podem ser usadas em sinais de navegação ou de itens que precisam de mais atenção.
Também podem ser utilizadas puras ou saturadas, com matiz maior ou menor.
Figura 71. Ferramenta Kuller.
86
Fonte: Adobe. Disponível em http://www.kuler.com. Acesso em 28/06/2012
4.5.2 Estudo de tipografia
A interface do relatório de balneabilidade busca ter a mesma coerência textual utilizada
pela infografia impressa, em que se observa título, subtítulo e texto explicativo.
Segundo Lupton (2006, p. 68), a internet tem forçado um trabalho inventivo com novas
modalidades de “microconteúdo” (títulos de página, palavras-chave), que permitem
visualização da busca, marcação e conversão de dados, o que cria um espaço informacional,
mais do que simplesmente uma sequência linear (como em livros e revistas, por exemplo).
O início da leitura no ambiente virtual é diferente do que em um livro, pois no
computador a superfície de leitura é escura e com tipos de cores diferentes. Em 1980, com
estudos de HCI, percebeu-se que se a superfície da tela fosse branca, e o tipo preto, a leitura
seria facilitada.
Entretanto, Lupton (2006, p.74) afirma que a “impaciência do leitor digital vem da
cultura, não da natureza da tela. Os usuários de sites têm expectativas diferentes dos usuários de
impressos. Eles querem sentir-se “produtivos”, não contemplativos; não querem processar,
querem buscar; esperam ser desapontados, distraídos e atrasados por pistas falsas.” O autor
conclui afirmando que “a tipografia é uma interface com o alfabeto”.
Na figura 72, é possível observar que os testes de tipografia podem ser realizados
com diagramas, pois se pode analisar juntamente título, subtítulo e blocos de textos.
Figura 72. Diagrama de estudo tipográfico.
Fonte: Anexo 4.
Nielsen e Loranger (2007) sugerem que a interface pode oferecer controle que permita o
redimensionamento do texto para se adequar à necessidade visual do usuário e garanta o
contraste, também sugerido por Lupton. Os autores analisam que textos curtos e explicativos
ajudam na leitura.
87
4.5.3 Estudo iconográfico
Para o uso de ícones no mapa e no site, pode-se usufruir da ferramenta de ícones do
Google. Como será utilizado o visual do Google Maps, os ícones internos podem ser utilizados
na mesma plataforma de construção, como se verifica na figura 73.
Figura 73. Ícones do Google.
Fonte: Google. Disponível em http://code.google.com/p/google-maps-icons/. Acesso em 10/09/2012
4.6 Análise Heurística
A avaliação heurística foi um termo criado por Jakob Nielsen e Molich, e, segundo
Moraes e Rosa (2010), identifica pontos problemáticos em uma interface. Esta análise também é
apresentada por diversos autores, como Krug (2008), Agner (2009) e Cairo (2008). Um bom
projeto de interface, que tenha a interação como foco, precisa ter, basicamente, alguns critérios:
Visibilidade: funções e objetos importantes bem visíveis;
Retroalimentação: cada ação pede uma reação, rápida e concisa;
Restrições: guiar a navegação com funções visíveis, ou seja, links e botões bem
posicionados que indicam a direção correta, mas sem restringir o clique livre do usuário
experiente;
88
Consistência: linguagem visual padronizada para que o usuário se sinta na mesma
plataforma;
Atalhos: atalhos e comandos para diminuir o tempo de resposta;
Retroalimentação: agilidade na ação e reação do sistema;
Diálogos precisos: mensagens de finalização a uma sequência de cliques, que deixam o
usuário satisfeito e pronto para a próxima etapa;
Prevenção de erros: comunicar ao usuário uma ação inapropriada;
Reversão: o usuário poder voltar ao estado inicial;
Autocontrole: o usuário deve ter sempre a sensação de controlar o sistema e reconhecer
as respostas;
Memória humana: deixar sempre visíveis os itens importantes para a navegação;
Design centrado no usuário (UCD): saber como o usuário do sistema se comporta, o
que espera e quais são os métodos de navegação.
Como avaliação final, a metodologia pode facilitar e agilizar o desenvolvimento de um
projeto de interface para visualização de dados da balneabilidade em Santa Catarina. Mostra-se
interessante a pesquisa e descoberta de ferramentas já disponíveis para construção de mapas e
gráficos. Portanto, percebe-se que, com os elementos construídos, a analise heurística pode
validar os conceitos e mostrar quais poderão ser úteis.
89
5. CONSIDERAÇÕES FINAIS
Neste trabalho, buscou-se percorrer os caminhos que a infografia trilhou, além de
compreender a função desta na internet e os estilos utilizados, como gráficos de comparação,
que contam fatos históricos, linha do tempo, entre outros. Foi possível perceber que a
construção da infografia impressa e digital têm elementos em comum, e a estrutura de
construção podem ter analogias, como ocorre em um mapa, que é elemento de construção tanto
para o meio impresso quanto para o digital.
Com a exploração da transição da infografia do meio impresso para o digital, percebeu-se
que o contato do usuário com a informação e com os dados acontece por meio da interface
gráfica, em que usuário busca, cruza e compartilha informação.
Também aprofundadas neste trabalho as peculiaridades da informação na infografia,
independentemente de ser publicada em papel ou na internet, o que foi possível por meio da
história da comunicação visual, estudando a origem e o sentido das imagens. Na transição da
infografia para a internet, percebeu-se que nas duas plataformas a finalidade é comunicar algum
fato, dado, ou contar cronologicamente uma historia. Com os estudos, observou-se que a forma
de enviar a informação na internet necessita de outros mecanismos motores, como tato, audição
e visão.
A infografia na internet possibilita a utilização de recursos audiovisuais e explora muito
mais a cognição, aumentando a leitura e a movimentação visual. Ao percorrer o caminho
trilhado pela infografia, foi possível notar os estágios de evolução e o comportamento que a
informação gráfica pode alcançar.
Também se observam outras possibilidades de infográficos que podem usufruir de
ferramentas já disponíveis e desenvolvidas para a construção de interface. Portanto, o desafio de
desenvolver uma interface para mostrar o índice de poluição das praias de Santa Catarina,
utilizando o relatório de balneabilidade fornecido pela Fatma, mostrou-se uma maneira bastante
interessante de explorar as novas ferramentas que a internet oferece e de comunicar algo
importante para as pessoas que vivem e gostam das praias.
90
REFERÊNCIAS
AGNER, Luiz. Ergodesign e arquitetura da informação: trabalhando com o usuário. Rio
de Janeiro: Quartet, 2ª ed.2009.
BAITELLO JR, Norval. A era da iconofagia: ensaios de comunicação e cultura. São Paulo:
Hacker, 2005.
BARBOSA, Suzana. Banco de Dados como metáfora para o jornalismo digital de terceira
geração. In: Ciências da Comunicação em Congresso na Covilha. III Sopcom, VI Lusocom, II
Ibérico, UBI (CD-ROM), 2004.
BELL, Gavin. Criando aplicações para redes sociais; tradução Thaís Cristina Casson. São
Paulo: Novatec; Sebastopol, O’Reilly, 2010.
BELÉM, Alexandre. Eadweard Muybridge. Disponível em http://bit.ly/MHqCit. Acesso em
20/01/2012.
BUARQUE de Holanda Ferreira, Aurélio. Dicionário Aurélio básico da língua portuguesa.
São Paulo: Folha de São Paulo/Nova Fronteira, 1994-95.
CAIRO, Alberto. Infografia 2.0: Visualización interactiva de información em prensa.
Madrid: Alamut, 2008.
CAIRO, Alberto. Information Graphics Workshop in Spain. Disponível em:
http://www.thefunctionalart.com/2012/03/information-graphics-workshop-in-spain.html.
Acesso em 26/04/2012.
CAMPOS, Jorge L. SILVA, Wallace V. O design e a representabilidade dos signos dentro
da world wide web. Disponível em http://bit.ly/Ljm3gO. Acesso em 21/06/2012.
91
CARDOSO. Rafael. Uma introdução à história do designer. São Paulo: Edgard Blüeher,
2004.
CARVALHO, José O. F., DIAS, Mateus Pereira. A Visualização da Informação e a sua
contribuição para a Ciência da Informação. DataGramaZero: Revista de Ciência da
Informação: v.8, n.5, out/07.
CLARK, Kenneth. Leonardo da Vinci, Rio de Janeiro, Ediouro,2003.
COSTELLA, Antônio F. Comunicação – do grito ao satélite. 5a. ed. São Paulo: Mantiqueira,
2002.
DONDIS, Donis A. Sintaxe da linguagem visual. Traduação Jeferson Luis Camargo. São
Paulo: Martins Fontes, 1997.
FILHO, João G. Gestalt do Objeto: sistema de leitura visual da forma. São Paulo: 2000.
FRIENDLY, Michael e DENIS, Daniel J. Milestones in the History of Thematic Cartog-
raphy, Statistical Graphics, and Data Visualization. Disponível em
http://datavis.ca/milestones/. Acesso em 23/04/2012.
JENKINS, Henry, Cultura da Convergência. São Paulo :Aleph, 2008.
HOFFMANN, Carol. Infográficos - Da essência ao clichê na era da informação digital,
2010. Disponível em http://bit.ly/JGB9Mp. Acesso em 24/6/2012
KANNO, M., Marcos na História da Visualização de Dados, 2008. Disponível em
http://bit.ly/NrOQhG. Acesso em 15/02/2012.
KALBACH, James. Design de Navegação Web: Otimizando a experiência do usuário. Por-
to Alegre: Bookman, 2009.
92
KIRSH, David. Metacognition, Distributed Cognition and Visual Design, em Cognition,
Education and Communication Technology. Peter Gärdinfors & Petter Johansson, Lawrence
Erlbaum (eds.), 2004.
KOTLER, Philip. Marketing 3.0: as forças que estão definindo o novo marketing centrado
no ser humano. Tradução H. de Barros. Rio de Janeiro: Elsevier, 2010.
KRUG, Steve. Não me faça pensar! Uma abordagem de bom senso à usabilidade na web.
Rio de Janeiro: Alta Books, 2008.
LÉVY, Pierre. Cibercultura. Tradução Carlos Irineu da Costa. São Paulo: Ed 34, 1999.
NIELSEN, Jacob; LORANGER, Hoa. Usabilidade na Web: Projetando Websites com
Qualidade. Rio de Janeiro: Campus, 2007. NIEMEYER, Lucy. Elementos da semiótica aplicados ao design. Rio de Janeiro: OAB, 2007.
MARTINEZ, Maria L. Um método de web design baseado em usabilidade. Disponível em
http://www.swlivre.org/site/cpweb/martinez03a.pdf. Acesso em 29/09/2010.
MEGGS, Philip B. História do design gráfico. São Paulo: Cosac Naify, 2009.
MUNARI, Bruno. Das coisas nascem coisas. Apontamentos por uma metodologia
projetual. Barcelona: Editorial Gustavo Gili, 1983.
MUNARI, Bruno. Design e Comunicação visual. Tradução Daniel Santana, São Paulo:
Martins Fontes, 1982 (©1968).
PANIZZA, Janaína Fuentes. Metodologia e processo criativo em projetos de comunicação
visual. São Paulo: ECA/USP, 2004.
PABLOS, José Manuel de. El Nuevo periódico Del Plomo a la luz. Tenerife, Ediciones Idea,
1993.
93
PABLOS, José Manuel de. Infoperiodismo. El periodista como creador de infografía, Santa
Cruz de Tenerife, Ed. Idea, 1999.
PABLOS, José Manuel de. La infografía, el nuevo género periodístico. Editorial Sanz y
Torres, 1991.
PELTZER, Gonzalo. Jornalismo iconográfico. Lisboa, Planeta Editora Ltda., 1992.
PHILLIPS, Peter L. Briefing: a gestão do projeto de design; tradução. Revisão técnica:
Whang Pontes Teixeira. São Paulo: Edüora Blucher, 2007.
QUÉAU, Philippe. Imagem Máquina: A era das tecnologias do virtual. Trad. Henri
Gervaiseau. In: PARENTE, André (org.). Rio de Janeiro: Ed. 34, 1993. 304 p. 91-99p.
RODRIGUES, Adriana A. Infografia em base de dados no jornalismo digital, 2008.
Disponível em http://bit.ly/pQ5gQz. Acesso em 20/9/2010.
SANTAELLA, Lúcia. O que é semiótica. São Paulo: Brasiliense, 1985.
SILVA, William Robson Cordeiro. O Desenho da Notícia: Uma Análise Semiótica da
Infografia do Jornal de Fato. 2010. Disponível em http://bit.ly/tN0dIa. Acesso em
14/09/2011.
SUNAGAWA, Walkiria K. Análise das relações entre as representações gráficas da
cartografia temática e o design gráfico.São Paulo, 2010.
Tim, BROWN. Design Thinking: uma metodologia poderosa para decretar o fim das
velhas ideias. Tradução Cristina Yamagami. Rio de Janeiro: Elsevier, 2010.
WONG, Wucius. Princípios de forma e desenho. Tradução: Alvamar Helena Lamparelli. São
Paulo: Martins Fontes, 1998.
95
ANEXO1
http://kanno-infografia.blogspot.com/
Marcos na História daVisualização
de Dados
BASEADO EM ”Milestones in the History of Thematic Cartography,
Statistical Graphics, and Data Visualization”
An illustrated chronology of innovations Tradução autorizada pelos autores
Michael Friendly and Daniel J. Denis, York University, Canada
TRADUÇÃO E ORGANIZAÇÃO: MÁRIO KANNO
http://kanno-infografia.blogspot.com/
http://kanno-infografia.blogspot.com/
Marcos na História da Visualização de Dados• Até o séc. 17: Primeiros Mapas e diagramasAs origens da visualização estão nos diagramas geométricos, nas tabelas de posição das estrelas e nos mapas. Noséculo 16, com expansão marítima da Europa, novas técnicas e instrumentos foram desenvolvidos e, com eles, novas,e mais precisas, formas de apresentação visual do conhecimento. Em 1436, Johannes Gutenberg inventa a imprensa
c. 6200 a.C. O mapa mais antigo?(Representação de uma cidadeda Babilônia encontrado naregião de Kirkuk, Iraque. Ooriginal era escavado em pedra)
c. 550 a.C. O primeiro mapa-múndi? Não há cópias, apenasdescrições nos livros de Heródoto. Anaximandro deMileto (c.610 a.C.- 546 d.C.), Grécia
c. 950 Primeiro registro conhecido amostrar variáveisgraficamente (posição do sol,lua e planetas durante o ano)
c. 1500 O italiano Leonardo da Vinci(1452-1519) transpõe seuconhecimento em ilustraçõesdetalhadas para retratar aanatomia, máquinas emovimentos
c. 1350 O bispo francês Nicole Oresme (1323-1382) propõe o uso de gráficos debarras para demonstrar uma variávelque depende de outro valor
1375 Livro Catalão reúne, emvisual deslumbrante,cosmografia, calendárioperpétuo erepresentações temáticasdo mundo conhecido.Abraham Cresques (1325-1387), Mallorca, Espanha
1569 Invenção da projeção cilíndricapara retratar o globo terrestre.Obelga Gerardus Mercator (1512-1594), também dividiu seu mapa-múndi em páginas para facilitar ouso e estampou a imagem dodeus Atlas na capa
1595Rumold Mercator (1545-1599),filho de Gerardus continua seutrabalho e publica este mapa-múndi em 1595, um ano após amorte do pai
c. 150 Projeção esférica da Terra usando latitudes e longitudesfeita por Ptlomeu (c. 85-c. 165), Alexandria, Egito. O mapaacima é uma reprodução do mapa-múndi de Ptlolomeufeita por Johan Scotus em 1505
http://kanno-infografia.blogspot.com/
• 1600 a 1699: Medições e teoriasOs maiores problemas do século se referiam a medição física - do tempo, distância e espaço-para astronomia, navegação e expansão territorial. Avançam as estimativas, as probabilidades, a demografia e todo o campo de estatísticas. No fim do século os elementos para iniciar um “pensamento visual” estão prontos
• 1700 a 1799: Novas fórmulas gráficasCartógrafos começam a mostrar mais do que a posição geográfica. Até o fim do século aparecem tentativas de mapearinformações de geologia, economia, demografia e saúde. A medida que o volume de dados avança, novas formas de visualização aparecem. Inovações tecnológicas como a cor, litografia e imprensa abrem novos caminhos
1644 Descrição feita por Michael van Langren's das12 referências delongitude de Toledo a Roma
1686 Primeiro mapameteorológico conhecidomostra a prevalecência dosventos em um mapageográfico. Edmond Halley(1656-1742), Inglaterra
1765 Linha do tempo: vida de 2.000 pessoasfamosas de 1200 a.C. até1750. O tempo de vida foirepresentado por barras.Joseph Priestley (1733-1804), Inglaterra
1782 Uso da geometria, figuras proporcionais (quadrados)para comparar dados demográficos em superposição.Charles de Fourcroy, França
1669Gráfico de função mostra comoencontrar os anos de vida restantes deacordo com a idade atual, de ChristiaanHuygens (1629-1695)
1779 Análise gráficade variaçãoperiódica natemperatura dosolo. JohannHeinrich Lambert(1728-1777),Alemanha
1782 O primeiro mapatopográfico.Marcellin du Carla-Boniface, França
1786 Gráfico debarras e delinhas comdadoseconômicos.William Playfair(1759-1823),Inglaterra
http://kanno-infografia.blogspot.com/
• 1800-1849: O início da infografia modernaA primeira metade do século 19 foi responsável por uma explosão no crescimento de gráficos estatísticos e de mapeamento temático,graças às inovações obtidas no século anterior.Todas as formas de gráficos estatísticos conhecidos hoje foram desenvolvidos nestaépoca; na cartografia, mapas simples foram transformados em atlas complexos baseados em grande variedade de dados
1801 O primeiro mapa geológico da Inglaterra e do País de Galesdesenvolveu um padrão para a cartografia geológica. Tambémconhecido como o “mapa que mudou o mundo” (para os geólogos, pelomenos). Desenhado em 1801, versão final de 1815. William Smith(1769-1839), Inglaterra
1801 Gráfico de pizza circular, de WilliamPlayfair (1759-1823), Inglaterra
1820 Um grande número de de publicaçõescientíficas começam a contar comgráficos e diagramas paradescrever, e não analisar, fenômenosnaturais (variação magnética, clima,etc.). Michael Faraday (1791-1867),Inglaterra
1836 Mapeamento das prostitutasem Paris. Alexandre JeanBaptiste Parent-Duchatelet (1790-1836), França
1843 O uso de coordenadas polares em umgráfico (direção da freqüência dos ventos).Léon Lalanne (1811-1892), França
1844 “Tableau-graphique” mostrando o transporte comercialcom as variáveis distância (horizontal),quantidade (barras divididas) e custo por área.Charles Joseph Minard (1781-1870), França
1838Atlas físico com adistribuição de plantas,animais, clima, etc. , umdos mais extensivos edetalhados atlastemáticos. Inclui tabelase gráficos ilustrados.Heinrich Berghaus (1797-1884), Alemanha
1819 Cartograma, mapa comsombras em preto ebranco, mostrando adistribuição doanalfabetismo na França.Talvez o primeiro mapaestatístico. Baron PierreCharles Dupin (1784-1873), França
http://kanno-infografia.blogspot.com/
• 1850 a 1900: Era de Ouro das EstatísticasPor volta de 1850 todas as condições para um rápido crescimento da visualização estavam estabelecidos. Escritórios de análise seespalhavam pela Europa com o aumento da importância das informacões numéricas para planejamento social, indústria, comércioe transportes. A teoria estatística iniciada por Gauss e Laplace deu os meios para fazer sentido a um grande número de dados
1855Mapeando os casos da epidemiade cólera em Londres, Dr. JohnSnow concluiu que eles seconcentravam próximos a um únicolocal de abastecimento público deágua, que foi fechado
1857 Os mortos por doença eram mais numerososque os mortos devido a ferimentos emcombate. Este gráfico foi usado emcampanha para melhoria das condiçõessanitárias no exército. Florence Nightingale(1820-1910), Inglaterra
1861 Mapa do tempo mostrando áreas depressão através de ícones que seassemelham ao atuais. Francis Galton(1822-1911), Reino Unido
1879 Estereograma tridimensional dapopulação em forma de pirâmide,baseado em dados do Censo Sueco(1750-1875). Luigi Perozzo, Itália
1869O melhor gráfico estatístico já feito? O engenheiro francês, Charles Minard (1781-1870), ilustrou graficamente a desastrosa campanhade Napoleão contra a Rússia em 1812. A largura do trajeto é proporcional ao número de soldadossobreviventes na campanha de guerra. Em cinza o caminho de ida e, em preto, a volta
1872 Gravação do movimento de uma corrida decavalo por meio de de câmeras acionadas por
fios. Eadweard Muybridge (1830-1904), EUA
1896 Uso de retângulos em mapa para representarduas variáveis e o produto delas (população dos
arredores de Paris, porgentagem de estrangeiros;área do retângulo = nº absoluto de estrangeiros).
Jacques Bertillon (1851-1922), França
http://kanno-infografia.blogspot.com/
• 1900 a 1949: Período Negro dos Gráficos de EstatísticaAconteceram poucas inovações gráficas e o entusiasmo vivido no século passado foi suplantado pelo crescimento da quantifi-cação e modelos formais. Durante esse período, no entanto, tudo que foi alcançado consegue se popularizar, seja no governo,no comércio e nas ciências. A visualização gráfica é consagrada para explicar novas descobertas e teorias
• 1950 a 1974: Esboço de renascimento da visualizaçãoA visualização de dados começa a sair da dormência por volta de 1960. Nos EUA, John W. Tukey reconhece a importância da análise gráfica dosdados e lançam novos padrões e inovações. Na França, Jacques Bertin publica sua Semiologia Gráfica, organizando visão e percepção dos ele-mentos gráficos. Por último, os computadores começam a mostrar seu potencial
1911 A primeira exposição deHigiene em Dresdenreúne 259 figurasgráficas estatísticas de35 expositores nacionais einternacionais. Emil EugenRoesle (organizador) (1875-1962), Alemanha
1920 Invenção do diagrama em setas paramostrar a relação entre variáveis,formando um sistema estrutural.Sewall Wright (1889-1988), EUA
1933Mapa do metrô deLondres se tornou umsímbolo reconhecidomundialmente por suasimplicidade e clareza.Harry Beck baseou omapa em um diagramade circuitos que eleusava no dia-a-dia
1924 Otto Neurath (1882-1945)organiza o Museu Socialde Gráficos Estatísticosem Viena, Áustria eintroduz o Isotype(International System ofTypographic PictureEducation)
1965Evolução nos histogramas de análisesde contas, novas propostas decomparação visual. John W. Tukey(1915-2000), EUA
1967Teoria de símbolos e modelosde representação gráfica. JacquesBertin, França
1971Polígono irregular para representar a multivariedade dedados (com vértices de iguais intervalos, distânciados docentro proporcionalmente ao valor da variável). J. H.Siegel, R. M. Goldwyn and Herman P. Friedman, EUA
http://kanno-infografia.blogspot.com/
1981Vista do olho de peixe: permite focar edetalhar mais uma área de interesse de umtodo, deixando as imagens secundárias emvolta, mas com bem menos detalhes. GeorgeW. Furnas, EUA
1993Estabelecida nos EUA a Xplane, empresaespecializada em visualização de dadosaplicado ao comércio e administraçãode empresas.
1996Software de dados cartográficos, comferramentas que permitem vários tiposde mapeamento simultâneos.Jason Dykes, Reino Unido
1999Explosão da internet e novas tecnologiaspermitem que a visualização passa a serinterativa e/ou animada. Os jornal espanhóis “El Pais” e “El Mundo” se tornamreferências internacionais no segmento
1999Alguns dos melhores artistasgráficos dos EUA sãoreunidos por Richard SaulWurman no livro“Understandig USA”, umcompêndio visual de dadossocio-econômicos do país. Acima, páginas de NigelHolmes
1999Leland Wilkinson escreve “A Gramática dosGráficos” neste ano, uma espécie de dicionáriosistemático e de fácil compreensão com regrasgramaticais para dados e gráficos. Acima, mapacontornado em 3D em estrutura computadorizada.Leland Wilkinson (1944-), EUA
• De 1975 até hoje: O computador como nova fronteiraAs inovações ocorridas nesta época foram muitas e em diversas áreas: o desenvolvimento de softwares e sistemas de computador,altamente interativos e de fácil manipulação, foram a alavanca para tudo. Os novos paradigmas de manipulação de dados, ainvenção de técnicas gráficas e os métodos de vizualização multidimensional deixaram suas marcas também
1982Página da previsãodo tempo do jornalnorte-americano USAToday, desenvolvidopor George Rorick. Odiário inaugura umaera de impressãocolorida nos jornaisque se espalha pelomundo. Logo, osinfográficos setornam parte do dia-a-dia da imprensa.
http://kanno-infografia.blogspot.com/
96
ANEXO2
Proposta de metodologia para produção de infográficos Parte integrante da Monografia “Infografia: conceito e prática”
Pauta
Elaboraçãode conteúdo
Arquitetura da informação
PropósitoConteúdo
InformacionalRecursos
Meios deprodução
Circunstânciade uso
Usuário
Análise desimilares
Apuração de dados
Arte-Final RevisãoAcabamento Publicação Análise crítica
O infográfico tem início com a sugestão de uma tema a ser discutido e publicado. Pode
ser um tema de estudo, um fato ou uma notícia. Tal tema deve ser relavante para
determinada publicação ou público.
Definido o tema, parte-se para a pesquisa do que é relevante ser exposto, e como o conteúdo deve ser exposto. Propõe-se aqui, o uso da classificação de Twyman (1985), editada da seguinte maneira:
Nesta fase, buscam-se referências do que já foi feito com o tema em questão, além de
inspirações estéticas.
Após avaliação daquilo que deve ser transmitido, elabora-se o conteúdo
informacional: o texto.
Início do processo de organizar as informações no espaço disponível. São esboços que podem ser feitos manual ou digitalmente.
O esboço é convertido para peça finalizada. Ilustrações ganham cores, estilos. Fotografia são produzidas. Textos e formas ganham propriedades.
Realização de ajustes da integração entre texto, imagens e/ou formas. Tamanho de legendas, e demais ajustes são realizados.
Revisão final do artefato. Se necessário, realizam-se novos ajustes.
Envia-se o infográfico para a produção, onde será publicado na mídia: internet, jornal, revista, livro, etc.
Após publicado, é recomendado fazer uma análise dos pontos positivos e negativos do processo, no intuito de gerar aprendizagem.
Propósito: Qual o objetivo do infográfico? O que se deseja transmitir
ao leitor?
Meio de produção: Como será desenvolvido? Ilustração? Fotografia?
Em quais softwares?
Conteúdo informacional: Quais informações são necessárias para
realizar o objetivo?
Usuário: Para quem é destinado o infográfico?
Recursos: Avaliação de tempo, verba, profissionais disponíveis, além de outras limitações, como mídia, cores, etc.
Circunstâncias de uso: Em qual mídia será vista, e como será vista a publicação?
Arquitetura da informação
Descrição detalhada sobre a fase de Arquitetura da informação
Se trata da organização espacial e definição dos elementos gráficos que estarão no infográfico. A abordagem sintática dos elementos do infográfico busca enfatizar a descrição estrutural deles. Aqui, são tratados como elementos sintáticos:
Ao combinar todos os elementos da linguagem visual, geram-se peças com algum sentido. Para Horn (1998), a função semântica é o estudo da função de cada unidade de comunicação, o que ela pretende dizer para o leitor. No quinto capítulo do livro “Visual Language” o autor mostra quais funções cada unidade pode assumir.Aqui, há alguns exemplos baseados nestas funções, como sugestão de representação.
Mostrar “quem”: Indicar pessoas envolvidas e as informações que forem relevantes sobre ela, como emoções, atitutes, identidade, etc. A figura acima exemplifica esta função com três possibilidades: através da representação física da personalidade em questão, através da representação de algo que seja do interesse desta pessoa e da representação da profissão exercida por ela. As três representações são feitas com imagens.
Mostrar “o que”: Indicar objeto ou local e descrever a aparência de objetos físicos. Acima, há três sugestões de uso. Primeiro, associar a imagem de um objeto com a sua descrição verbal. Depois, mostra-se a aparência de algo através da exposição de suas perspectivas, utilizando imagem e forma. Por fim, aponta-se uma parte do objeto, para indicar sua representação completa, fazendo uso de imagem e formas.
Mostrar “o que há dentro”: Permitir visualização do interior de objetos. Pode ser feita, por exemplo, com uma representação em perspectiva do objeto, que permita uma abertura no mesmo; com a visualização do interior através de cortes laterais, longitudinais,etc; e através da transparência de sua camada externa, representada por traços (wireframe).
Mostrar “onde”: Dizer a localização espacial das pessoas ou objetos. Sugere-se indicar diretamente a localização, através de um mapa, por exemplo; através da posicão relativa entre dois objetos, representada na figura por imagem, forma e texto; ou pela localização dentro de um sistema.
Mostrar “quando”: Indicar tempo. Pode ser um horário, época ou a duração de um evento. É possível representar esta função através de objetos conhecidos por determinado grupo, como o relógio; através da representação das estações; ou pela contextualização em uma linha do tempo, composta aqui por texto e forma.
Mostrar “como funciona”: Dizer o funcionamento de um sistema natural ou não. A figura ilustra o funcionamento de peças dentro de um conjunto.
Texto- Título, abertura, subtítulo, legenda e texto.
Imagem – representação de pessoas, lugares ou objetos.
Forma – Quais formas são importantes para a integração de texto e imagem? Ponto, linha, formas abstratas, espaço entre formas.
Representaçãofísica
Interessespessoais
Profissão
Quem?
Abertura Cortes Wireframes
O que há dentro?
Descriçãoverbal
Perspectivas Partes
O que?
Flor
Mapa Distância Parte de umsistema
Onde?
Relógio Estação Linha dotempo
Quando?
Diagrama processualde um sistema
Como funciona?
x2011
Text
o1998 Palavra não leva a nada.
Form
aIm
ag
em
Mostrar “onde”: Dizer a localização espacial das pessoas ou objetos. Sugere-se indicar diretamente a localização, através de um mapa, por exemplo; através da posicão relativa entre dois objetos, representada na figura por imagem, forma e texto; ou pela localização dentro de um sistema.
Mostrar “quando”: Indicar tempo. Pode ser um horário, época ou a duração de um evento. É possível representar esta função através de objetos conhecidos por determinado grupo, como o relógio; através da representação das estações; ou pela contextualização em uma linha do tempo, composta aqui por texto e forma.
Mostrar “como funciona”: Dizer o funcionamento de um sistema natural ou não. A figura ilustra o funcionamento de peças dentro de um conjunto.
Mostrar “como fazer”: Indicar as etapas para a realização de uma tarefa. Utiliza-se a demonstração de partes da tarefa, além de passagem de etapas através de formas.
Mostrar “movimento”: Revelar mudança da localização física, que é percebida como um movimento. Sugere-se três formas de representação: através de demarcação da trajetória (com o uso de formas); através da posição física do personagem ou de formas indicativas, como setas.
Mostrar “qual”: Demonstrar, indicar ou definir caracteristicas de alguma coisa. Os usos ilustrados mostram possibilidades como nomear, ressaltar um objeto através da diferença cromática ou através de sua marcação.
Mostrar “exemplos”: Mostrar particularidades de uma idéia geral, apontando aquilo que deseja mostrar ou ressaltar, dentro de um contexto.
Mostrar “conceitos”: Indicar forças, relações, ondas ou qualquer outro influência que não podem ser percebidas a olho nu. Nas três situações sugeridas na figura, formas foram utilizadas para representar os conceitos.
Mostrar “comparações”: Dizer semelhanças e diferenças entre as coisas. O uso de tabelas pode mostrar um ou mais parâmetros de comparação. Comparações através de tamanhos também são indicadas.
Mostrar “comparações quantitativas”: Comparar visualmente dados, proporções, etc. Podem ser diversos tipos de gráficos, como os de barra e comparação através dos tamanhos de círculos.
A metodologia proposta nesta pesquisa é resultado da compilação de etapas encontradas em entrevistas com profissionais da área, acrescida de algumas informações obtidas através do estudo da linguagem visual. É uma sugestão de como proceder ao desenvolver infográficos, podendo ser editada de acordo com a necessidade de cada projeto.
Mapa Distância Parte de umsistema
Onde?
Relógio Estação Linha dotempo
Quando?
Diagrama processualde um sistema
Como funciona?
x2011
Instruções de uma tarefa
Como fazer?
Trajetória Posição Seta
Movimento
Nomear Diferençacromática
Apontar
Qual?
Essa!
Apontar
Exemplo
Temperatura Campo devisão
OndasSonoras
Conceito
Tabela Tamanho
Comparação
TítuloTexto
Barras Círculos
Comparação quantitativa
Parte integrante da Monografia “Infografia: conceito e prática”
97
ANEXO3
The
Elem
ents
of
Use
r Ex
perie
nce
A ba
sic
dual
ity: T
he W
eb w
as o
rigin
ally
con
ceiv
ed a
s a
hype
rtex
tual
info
rmat
ion
spac
e;bu
t th
e de
velo
pmen
t of
incr
easi
ngly
sop
hist
icat
ed f
ront
- an
d ba
ck-e
nd t
echn
olog
ies
has
fost
ered
its
use
as a
rem
ote
soft
war
e in
terf
ace.
Thi
s du
al n
atur
e ha
s le
d to
muc
h co
nfus
ion,
as u
ser
expe
rienc
e pr
actit
ione
rs h
ave
atte
mpt
ed t
o ad
apt
thei
r te
rmin
olog
y to
cas
es b
eyon
dth
e sc
ope
of it
s or
igin
al a
pplic
atio
n. T
he g
oal o
f th
is d
ocum
ent
is t
o de
fine
som
e of
the
sete
rms
with
in t
heir
appr
opria
te c
onte
xts,
and
to
clar
ify t
he u
nder
lyin
g re
latio
nshi
ps a
mon
gth
ese
vario
us e
lem
ents
.
Jess
e Ja
mes
Gar
rett
jjg@
jjg.n
et
Visu
al D
esig
n: g
raph
ic t
reat
men
t of
inte
rfac
eel
emen
ts (
the
"look
" in
"lo
ok-a
nd-f
eel")
Info
rmat
ion
Arch
itect
ure:
str
uctu
ral d
esig
nof
the
info
rmat
ion
spac
e to
fac
ilita
tein
tuiti
ve a
cces
s to
con
tent
Inte
ract
ion
Des
ign:
dev
elop
men
t of
appl
icat
ion
flow
s to
fac
ilita
te u
ser
task
s,de
finin
g ho
w t
he u
ser
inte
ract
s w
ithsi
te f
unct
iona
lity
Nav
igat
ion
Des
ign:
des
ign
of in
terf
ace
elem
ents
to
faci
litat
e th
e us
er's
mov
emen
tth
roug
h th
e in
form
atio
n ar
chite
ctur
eIn
form
atio
n D
esig
n: in
the
Tuf
tean
sen
se:
desi
gnin
g th
e pr
esen
tatio
n of
info
rmat
ion
to f
acili
tate
und
erst
andi
ng
Func
tiona
l Spe
cific
atio
ns: "
feat
ure
set"
:de
taile
d de
scrip
tions
of
func
tiona
lity
the
site
mus
t in
clud
e in
ord
er t
o m
eet
user
nee
ds
Use
r N
eeds
: ext
erna
lly d
eriv
ed g
oals
for
the
site
; ide
ntifi
ed t
hrou
gh u
ser
rese
arch
,et
hno/
tech
no/p
sych
ogra
phic
s, e
tc.
Site
Obj
ectiv
es: b
usin
ess,
cre
ativ
e, o
r ot
her
inte
rnal
ly d
eriv
ed g
oals
for
the
site
Cont
ent
Req
uire
men
ts: d
efin
ition
of
cont
ent
elem
ents
req
uire
d in
the
site
in o
rder
to
mee
t us
er n
eeds
Inte
rfac
e D
esig
n: a
s in
tra
ditio
nal H
CI:
desi
gn o
f in
terf
ace
elem
ents
to
faci
litat
eus
er in
tera
ctio
n w
ith f
unct
iona
lity
Info
rmat
ion
Des
ign:
in t
he T
ufte
an s
ense
:de
sign
ing
the
pres
enta
tion
of in
form
atio
nto
fac
ilita
te u
nder
stan
ding
Web
as
soft
war
e in
terf
ace
Web
as
hype
rtex
t sy
stem
Visu
al D
esig
n: v
isua
l tre
atm
ent
of t
ext,
grap
hic
page
ele
men
ts a
nd n
avig
atio
nal
com
pone
nts
Conc
rete
Abst
ract
timeCo
ncep
tion
Com
plet
ion
Functional
Specifications
Content
Requirements
Interaction
Design
Information
Architecture
Visual Design
Information Design
Interface DesignNavigation Design
Site Objectives
User Needs
Use
r N
eeds
: ext
erna
lly d
eriv
ed g
oals
for
the
site
; ide
ntifi
ed t
hrou
gh u
ser
rese
arch
,et
hno/
tech
no/p
sych
ogra
phic
s, e
tc.
Site
Obj
ectiv
es: b
usin
ess,
cre
ativ
e, o
r ot
her
inte
rnal
ly d
eriv
ed g
oals
for
the
site
This
pic
ture
is in
com
plet
e: T
he m
odel
out
lined
her
e do
es n
ot a
ccou
nt f
or s
econ
dary
con
side
ratio
ns (
such
as
thos
e ar
isin
g du
ring
tech
nica
l or
cont
ent
deve
lopm
ent)
that
may
influ
ence
dec
isio
ns d
urin
g us
er e
xper
ienc
e de
velo
pmen
t. A
lso,
thi
s m
odel
doe
s no
t de
scrib
e a
deve
lopm
ent
proc
ess,
nor
doe
s it
defin
e ro
les
with
in a
user
exp
erie
nce
deve
lopm
ent
team
. Rat
her,
it se
eks
to d
efin
e th
e ke
y co
nsid
erat
ions
tha
t go
into
the
dev
elop
men
t of
use
r ex
perie
nce
on t
he W
eb t
oday
.
task
-orie
nted
info
rmat
ion-
orie
nted
30 M
arch
200
0
© 2
000
Jess
e Ja
mes
Gar
rett
http
://w
ww.
jjg.n
et/ia
/
98
ANEXO4
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
ARARANGUA PRAIA DO MORRO DOS CONVENTOS (Ponto 01) 17/05/2012 FRENTE AO POSTO DE SALVA VIDAS CENTRAL
BALN. GAIVOTAS ARROIO DA PRAIA DAS GAIVOTAS (Ponto 02) 17/05/2012 SOB PTE CONCRETO AV. BEIRA MAR, ENTR. PRAIA
BALN. GAIVOTAS PRAIA DAS GAIVOTAS (Ponto 01) 17/05/2012 FRENTE À PRAÇA DE ESPORTES
BALN. ARROIO DO SILVA PRAIA DO ARROIO DO SILVA (Ponto 01) 17/05/2012 À ESQUERDA DO ARROIO
BALN. ARROIO DO SILVA PRAIA DO ARROIO DO SILVA (Ponto 02) 17/05/2012 À DIREITA DO ARROIO
BALN. ARROIO DO SILVA PRAIA DO ARROIO DO SILVA (Ponto 03) 17/05/2012 NA FOZ DO ARROIO DO SILVA
BALN. ARROIO DO SILVA PRAIA DO ARROIO DO SILVA (Ponto 17) 17/05/2012 AV. FLORIANÓPOLIS - FINAL DO BALNEÁRIO
BALNEÁRIO CAMBORIÚ PRAIA DE LARANJEIRAS (Ponto 06) 07/05/2012 NO MEIO DA PRAIA
BALNEÁRIO CAMBORIÚ PRAIA DE TAQUARAS (Ponto 08) 07/05/2012 EM FRENTE A ESCOLA MUNICIPAL
BALNEÁRIO CAMBORIÚ PRAIA DE TAQUARAS (Ponto 09) 07/05/2012 LAGOA DE TAQUARAS
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 01) 12/06/2012 PONTAL NORTE
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 02) 12/06/2012 FRENTE À RUA 1001
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 03) 12/06/2012 FRENTE À RUA 2000
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 04) 12/06/2012 FRENTE À RUA 3000
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 05) 12/06/2012 PONTAL SUL - FRENTE À RUA 4900
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 10) 12/06/2012 FRENTE À RUA 4000
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 11) 12/06/2012 FRENTE À RUA 3500
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 12) 12/06/2012 FRENTE À RUA 2500
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 13) 12/06/2012 FRENTE À RUA 1400
BALNEÁRIO CAMBORIÚ PRAIA DO BALN. CAMBORIÚ (Ponto 14) 12/06/2012 FRENTE À RUA 51
Página 1
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
BALNEÁRIO CAMBORIÚ PRAIA DO ESTALEIRO (Ponto 07) 07/05/2012 ENTRE R. DOMINGOS FONSECA E NAPOLEÃO VIEIRA
BALNEÁRIO DA BARRA DO SUL CANAL DO LINGUADO (Ponto 02) 17/05/2012 PRAINHA DA FOZ DO CANAL DO LINGUADO
BALNEÁRIO DA BARRA DO SUL PRAIA DA BARRA DO SUL (Ponto 01) 17/05/2012 PRAIA DO BISPO, FRENTE A CAPELA DOS NAVEGANTES
BARRA VELHA LAGOA DE BARRA VELHA (Ponto 05) 17/05/2012 RUA DR. PLACIDO GOMES DE OLIVEIRA, ALTURA Nº336
BARRA VELHA PRAIA DA BARRA VELHA (Ponto 01) 17/05/2012 AV. ARMANDO PETRELI, NA ALTURA DO Nº555
BARRA VELHA PRAIA DA BARRA VELHA (Ponto 02) 17/05/2012 FRENTE À RUA HUMBERTO PIMENTEL
BARRA VELHA PRAIA DA BARRA VELHA (Ponto 03) 17/05/2012 RUA ANTONIO R. DA G. MOURA
BIGUAÇÚ PRAIA DE SÃO MIGUEL (Ponto 01) 11/06/2012 FRENTE AO AQUEDUTO
BOMBINHAS PRAIA DE BOMBAS (Ponto 02) 05/06/2012 FRENTE À RUA MARTIN PESCADOR
BOMBINHAS PRAIA DE BOMBAS (Ponto 04) 05/06/2012 EXTREMA DIREITA DA PRAIA
BOMBINHAS PRAIA DE BOMBAS (Ponto 05) 05/06/2012 RUA ARIRAMBA. À ESQUERDA DO RIACHO
BOMBINHAS PRAIA DE BOMBINHAS (Ponto 01) 05/06/2012 RUA VEREADOR MANOEL DOS SANTOS, 1149
BOMBINHAS PRAIA DE BOMBINHAS (Ponto 06) 05/06/2012 CANTO DIREITO DA PRAIA
BOMBINHAS PRAIA DE BOMBINHAS (Ponto 07) 05/06/2012 FRENTE À RUA CASTANHETA
BOMBINHAS PRAIA DO CANTO GRANDE (Ponto 08) 05/06/2012 CANTO ESQUERDO (BAIA DE ZIMBROS)
BOMBINHAS PRAIA DO MARISCAL (Ponto 03) 05/06/2012 AV ÁGUA MARINHA, ALTURA DO Nº 3244
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 37) 15/05/2012 FRENTE À SERVIDÃO PEDRO MANUEL FERNANDES
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 38) 15/05/2012 NOS TRAPICHES DOS SERVIÇOS DE TRANSPORTES
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 39) 15/05/2012 FRENTE À RUA DE ACESSO À PRAIA DA JOAQUINA
Página 2
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 41) 15/05/2012 CANTO DA LAGOA - AO LADO DO POSTO DE SAÚDE
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 43) 15/05/2012 FRENTE AO ACESSO PARA O RIO TAVARES
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 61) 15/05/2012 ALTURA Nº 1480 DA AV. DAS RENDEIRAS
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 62) 15/05/2012 FRENTE A RUA MANUEL ISIDORO DA SILVEIRA
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 66) 15/05/2012 ALTURA DO Nº 2267 DA AV. OSNI ORTIGA
FLORIANÓPOLIS LAGOA DA CONCEIÇÃO (Ponto 72) 15/05/2012 FRENTE À RUA CANTO DA AMIZADE
FLORIANÓPOLIS PRAIA BRAVA (Ponto 24) 15/05/2012 PRÓXIMO À FOZ DO RIACHO (COSTÃO SUL, NO MAR)
FLORIANÓPOLIS PRAIA BRAVA (Ponto 25) 15/05/2012 EM FRENTE AO POSTO SALVA VIDAS
FLORIANÓPOLIS PRAIA BRAVA (Ponto 69) 15/05/2012 NO RIACHO
FLORIANÓPOLIS PRAIA DA ARMAÇÃO DO PÂNTANO DO SUL (Ponto 44) 15/05/2012 EM FRENTE A IGREJA DA VILA
FLORIANÓPOLIS PRAIA DA ARMAÇÃO DO PÂNTANO DO SUL (Ponto 64) 15/05/2012 FOZ RIO SANGRADOURO(NO RIO)
FLORIANÓPOLIS PRAIA DA BARRA DA LAGOA (Ponto 32) 15/05/2012 APROXIMADAMENTE 50 METROS À ESQ. DOS MOLHES
FLORIANÓPOLIS PRAIA DA BASE AÉREA (Ponto 49) 15/05/2012 AO LADO DO TRAPICHE
FLORIANÓPOLIS PRAIA DA BEIRA MAR NORTE (Ponto 11) 15/05/2012 EM FRENTE AO MONUMENTO DA POLÍCIA MILITAR
FLORIANÓPOLIS PRAIA DA CACHOEIRA DO BOM JESUS (Ponto 56) 15/05/2012 FRENTE AO TREVO DOS INGLÊSES
FLORIANÓPOLIS PRAIA DA CAIACANGAÇÚ (Ponto 63) 15/05/2012 ALTURA Nº 12.820 DA ESTRADA GERAL DO RIBEIRÃO
FLORIANÓPOLIS PRAIA DA DANIELA (Ponto 16) 15/05/2012 FRENTE À RUA DOS CACTOS
FLORIANÓPOLIS PRAIA DA JOAQUINA (Ponto 33) 15/05/2012 EM FRENTE AO POSTO SALVA VIDAS
FLORIANÓPOLIS PRAIA DA LAGOINHA (Ponto 26) 15/05/2012 ESQUERDA DA SAIDA DA LAGOA
FLORIANÓPOLIS PRAIA DA SAUDADE (Ponto 04) 15/05/2012 CANTO ESQUERDO DA PRAIA
FLORIANÓPOLIS PRAIA DA SOLIDÃO (Ponto 65) 15/05/2012 FOZ DO RIO DAS PACAS
Página 3
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
FLORIANÓPOLIS PRAIA DA TAPERA (Ponto 48) 15/05/2012 NO MEIO DA PRAIA
FLORIANÓPOLIS PRAIA DAS PALMEIRAS (Ponto 07) 15/05/2012 NO MEIO DA PRAIA
FLORIANÓPOLIS PRAIA DE CANASVIEIRAS (Ponto 20) 15/05/2012 EM FRENTE À RUA DAS FLÔRES
FLORIANÓPOLIS PRAIA DE CANASVIEIRAS (Ponto 21) 15/05/2012 EM FRENTE A AVENIDA DAS NAÇÕES
FLORIANÓPOLIS PRAIA DE CANASVIEIRAS (Ponto 22) 15/05/2012 LADO ESQUERDO DO TRAPICHE
FLORIANÓPOLIS PRAIA DE CANASVIEIRAS (Ponto 55) 15/05/2012 FRENTE A RUA HEITOR BITENCOURT
FLORIANÓPOLIS PRAIA DE CANASVIEIRAS (Ponto 59) 15/05/2012 FRENTE A RUA ACARí MARGARIDA
FLORIANÓPOLIS PRAIA DE CANASVIEIRAS (Ponto 60) 15/05/2012 CANTO ESQUERDO DA PRAIA PRÓX. AS PEDRAS
FLORIANÓPOLIS PRAIA DE JURERÊ (Ponto 18) 15/05/2012 FRENTE À RUA DAS MORÉIAS
FLORIANÓPOLIS PRAIA DE JURERÊ (Ponto 19) 15/05/2012 FRENTE À RUA MAURÍCIO SIROTSKY SOBRINHO
FLORIANÓPOLIS PRAIA DE JURERÊ (Ponto 54) 15/05/2012 FRENTE À RUA LUIS RAMPA
FLORIANÓPOLIS PRAIA DE JURERÊ (Ponto 68) 15/05/2012 FRENTE À RUA VALDEMAR MEDEIROS
FLORIANÓPOLIS PRAIA DE JURERÊ INTERNACIONAL (Ponto 53) 15/05/2012 FRENTE À AV. DOS SALMÕES
FLORIANÓPOLIS PRAIA DE PONTA DAS CANAS (Ponto 23) 15/05/2012 100 METROS À ESQUERDA DA IGREJA
FLORIANÓPOLIS PRAIA DE PONTA DAS CANAS (Ponto 67) 15/05/2012 ALTURA DO Nº5.281 DA ESTRADA GERAL (NA LAGOA)
FLORIANÓPOLIS PRAIA DE PONTA DAS CANAS (Ponto 70) 15/05/2012 FRENTE À RUA ALCINA JANNIS
FLORIANÓPOLIS PRAIA DE SAMBAQUI (Ponto 14) 15/05/2012 FRENTE À RUA SERVIDÃO PARAÍSO DAS FLORES
FLORIANÓPOLIS PRAIA DE SAMBAQUI (Ponto 15) 15/05/2012 PONTA DO SAMBAQUI
FLORIANÓPOLIS PRAIA DE SANTO ANTÔNIO DE LISBOA (Ponto 12) 15/05/2012 EM FTE A PÇ ROLDÃO DA ROCHA PIRES
FLORIANÓPOLIS PRAIA DE SANTO ANTÔNIO DE LISBOA (Ponto 13) 15/05/2012 FRENTE À SERVIDÃO HIPÓLITO MACHADO
FLORIANÓPOLIS PRAIA DO BALNEÁRIO (Ponto 02) 15/05/2012 EM FRENTE À RUA JOSÉ CÂNDIDO DA SILVA
Página 4
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
FLORIANÓPOLIS PRAIA DO BOM ABRIGO (Ponto 08) 15/05/2012 FRENTE À RUA TEÓFILO ALMEIDA
FLORIANÓPOLIS PRAIA DO CACUPÉ (Ponto 09) 15/05/2012 PRÓXIMO AO Nº 4000 DA ROD. HAROLDO S. GLAVAN
FLORIANÓPOLIS PRAIA DO CACUPÉ (Ponto 10) 15/05/2012 NO MEIO DA PRAIA
FLORIANÓPOLIS PRAIA DO CAMPECHE (Ponto 35) 15/05/2012 FRENTE À AVENIDA PEQUENO PRINCIPE
FLORIANÓPOLIS PRAIA DO CAMPECHE (Ponto 73) 04/04/2012 RIOZINHO ( NO RIO ) FTE A SERV. FAMÍLIA NUNES
FLORIANÓPOLIS PRAIA DO FORTE (Ponto 17) 15/05/2012 NA ENTRADA DA PRAIA
FLORIANÓPOLIS PRAIA DO ITAGUAÇU (Ponto 06) 15/05/2012 ENTRE O TRÊVO E A RUA EUCLIDES DA CUNHA
FLORIANÓPOLIS PRAIA DO JARDIM ATLÂNTICO (Ponto 01) 15/05/2012 FRENTE À RUA ELESBÃO PINTO DA LUZ
FLORIANÓPOLIS PRAIA DO JOSÉ MENDES (Ponto 52) 15/05/2012 NO MEIO DA PRAIA
FLORIANÓPOLIS PRAIA DO MATADOURO (Ponto 03) 20/06/2007 BELMIRA ISABEL MARTINS
FLORIANÓPOLIS PRAIA DO MEIO (Ponto 05) 15/05/2012 NO MEIO DA PRAIA
FLORIANÓPOLIS PRAIA DO PÂNTANO DO SUL (Ponto 45) 15/05/2012 A 100 METROS DA ENTRADA DA PRAIA
FLORIANÓPOLIS PRAIA DO RIBEIRÃO DA ILHA (Ponto 47) 15/05/2012 FRENTE À PRAÇA
FLORIANÓPOLIS PRAIA DO SANTINHO (Ponto 31) 15/05/2012 200 METROS À ESQUERDA DO COSTÃO SUL
FLORIANÓPOLIS PRAIA DOS INGLESES (Ponto 27) 15/05/2012 FRENTE DO RIO CAPIVARI
FLORIANÓPOLIS PRAIA DOS INGLESES (Ponto 28) 15/05/2012 FRENTE AO POSTO SALVA VIDAS
FLORIANÓPOLIS PRAIA DOS INGLESES (Ponto 29) 15/05/2012 EM FRENTE À RUA DA IGREJA
FLORIANÓPOLIS PRAIA DOS INGLESES (Ponto 57) 15/05/2012 FRENTE À RUA DO SIRI
FLORIANÓPOLIS PRAIA DOS INGLESES (Ponto 58) 15/05/2012 FRENTE À RUA DANTE DE PATA
FLORIANÓPOLIS PRAIA MOLE (Ponto 71) 04/04/2012 ACESSO PRINCIPAL
GAROPABA PRAIA DE GAROPABA (Ponto 01) 05/06/2012 EM FRENTE À PRAÇA
Página 5
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
GAROPABA PRAIA DE GAROPABA (Ponto 02) 05/06/2012 FRENTE À RUA LAURO S. MULLER
GAROPABA PRAIA DO SIRIÚ (Ponto 03) 05/06/2012 PRÓXIMO À FOZ DO RIO SIRIÚ
GOVERNADOR CELSO RAMOS PRAIA DA ARMAÇÃO DA PIEDADE (Ponto 01) 11/06/2012 NO MEIO DA PRAIA
GOVERNADOR CELSO RAMOS PRAIA DA BAIA DOS GOLFINHOS (Ponto 03) 11/06/2012 À DIREITA DO TRAPICHE
GOVERNADOR CELSO RAMOS PRAIA DA FAZENDA DA ARMAÇÃO (Ponto 07) 11/06/2012 FTE À R. GREGÓRIO MONTEIRO
GOVERNADOR CELSO RAMOS PRAIA DA FAZENDA DA ARMAÇÃO (Ponto 08) 11/06/2012 FTE À R.GERINO BELMIRO DOS SANTOS-LADO RIACHO
GOVERNADOR CELSO RAMOS PRAIA DA GAMBOA (Ponto 09) 11/06/2012 R.FLAMBOIAN-1ª R.À DIR. APÓS AV. CARAVELAS
GOVERNADOR CELSO RAMOS PRAIA DE PALMAS (Ponto 02) 11/06/2012 FRENTE AO POSTO SALVA VIDAS
GOVERNADOR CELSO RAMOS PRAIA DE PALMAS (Ponto 11) 11/06/2012 CANTO DIR. DA PRAIA-FTE AO RIO ÁGUAS NEGRAS
GOVERNADOR CELSO RAMOS PRAIA DO ANTENOR (Ponto 04) 11/06/2012 NO MEIO DA PRAIA
GOVERNADOR CELSO RAMOS PRAIA DO ANTENOR (Ponto 05) 11/06/2012 NA EXT. ESQ. DA PRAIA-FTE À PTE DE CONCRETO
GOVERNADOR CELSO RAMOS PRAIA DO MAGALHÃES (Ponto 06) 11/06/2012 R. BEIJA FLOR-FTE À RAMPA DE ACESSO À PRAIA
GOVERNADOR CELSO RAMOS PRAIA GRANDE (Ponto 10) 11/06/2012 FRENTE À AVENIDA CARAVELAS
IÇARA LAGOA DO FAXINAL (Ponto 03) 17/05/2012 PARQ. AQUÁTICO PARQ. VERDE, PRÓX. AO TRAPICHE
IÇARA LAGOA DOS ESTEVES (Ponto 02) 17/05/2012 PRÓXIMO AO TRAPICHE
IÇARA LAGOA DOS FREITAS (Ponto 01) 17/05/2012 PRÓXIMO AO TRAPICHE
IÇARA PRAIA DO RINCÃO (Ponto 04) 17/05/2012 FRENTE AO POSTO SALVA VIDAS 2
IÇARA PRAIA DO RINCÃO (Ponto 05) 17/05/2012 ARROIO DA PRAIA DO RINCÃO
IÇARA PRAIA DO RINCÃO (Ponto 06) 17/05/2012 FRENTE AO POSTO SALVA VIDAS 3
IÇARA PRAIA DO RINCÃO (Ponto 07) 17/05/2012 FRENTE AO POSTO SALVA VIDAS 4
Página 6
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
IÇARA PRAIA DO RINCÃO (Ponto 08) 17/05/2012 100 M À ESQ. DO ARROIO DA P. DO RINCÃO
IÇARA PRAIA DO RINCÃO (Ponto 18) 17/05/2012 LAGOA DO JACARÉ(ACESSO PRINCIPAL)
IMBITUBA LAGOA DE IBIRAQUERA (Ponto 02) 12/06/2012 PRÓXIMO A BOCA DA BARRA
IMBITUBA PRAIA DA RIBANCEIRA (Ponto 04) 12/06/2012 EM FRENTE A PARADA DE ÔNIBUS
IMBITUBA PRAIA DA VILA NOVA (Ponto 06) 12/06/2012 AO LADO DO POSTO SALVA VIDAS
IMBITUBA PRAIA DA VILA NOVA (Ponto 07) 12/06/2012 FRENTE À RUA HANS D. SCHIMIDT
IMBITUBA PRAIA DE IBIRAQUERA (Ponto 03) 12/06/2012 APROX.100 METROS AO SUL DA BOCA DA BARRA
IMBITUBA PRAIA DO PORTO (Ponto 05) 12/06/2012 NO FINAL DA ESTRADA PRÓX. AO NAVIO ENCALHADO
IMBITUBA PRAIA DO ROSA (Ponto 01) 05/06/2012 NO CANTO SUL
ITAJAÍ PRAIA BRAVA (Ponto 03) 11/06/2012 AV. JOSÉ M. VIEIRA EM FRENTE A RUA DOCA REBELLO
ITAJAÍ PRAIA BRAVA (Ponto 04) 11/06/2012 FTE À SAÍDA DA LAGOA, R. JOSÉ MANOEL C. SILVA
ITAJAÍ PRAIA DE CABEÇUDAS (Ponto 01) 11/06/2012 FRENTE A RUA QUINTINO BOCAIÚVA
ITAJAÍ PRAIA DO ATALAIA (Ponto 02) 11/06/2012 FRENTE AO POSTO SALVA VIDAS
ITAPEMA PRAIA DE ITAPEMA (Ponto 01) 13/06/2012 FRENTE À RUA 113
ITAPEMA PRAIA DE ITAPEMA (Ponto 02) 13/06/2012 FRENTE À RUA 149
ITAPEMA PRAIA DE ITAPEMA (Ponto 03) 13/06/2012 FRENTE À RUA 227
ITAPEMA PRAIA DE ITAPEMA (Ponto 04) 13/06/2012 FRENTE À RUA 319
ITAPEMA PRAIA DE ITAPEMA (Ponto 05) 13/06/2012 FRENTE À RUA 205
ITAPEMA PRAIA DE ITAPEMA (Ponto 07) 13/06/2012 À DIREITA DO RIO BELA CRUZ
ITAPEMA PRAIA DE ITAPEMA (Ponto 08) 13/06/2012 FRENTE À RUA 261
Página 7
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
ITAPEMA PRAIA DE ITAPEMA (Ponto 09) 13/06/2012 FRENTE À RUA 163
ITAPOÁ PRAIA DE ITAPOÁ (Ponto 01) 17/05/2012 BAL. BRASÍLIA - FINAL DA AVENIDA 650
ITAPOÁ PRAIA DE ITAPOÁ (Ponto 02) 17/05/2012 BAL. PAESE - ENTRE A RUA 1020 E 1030
ITAPOÁ PRAIA DE ITAPOÁ (Ponto 03) 17/05/2012 BAL. PALMEIRAS - RUA 1970
ITAPOÁ PRAIA DE ITAPOÁ (Ponto 04) 17/05/2012 BAL. BARRA DO SAÍ - RUA 20
JAGUARUNA CANAL DO CAMACHO (Ponto 03) 11/06/2012 NA FOZ
JAGUARUNA LAGOA DO ARROIO CORRENTE (Ponto 02) 11/06/2012 NA PARTE SUPERIOR DO "CHUVEIRÃO"
JAGUARUNA PRAIA DO ARROIO CORRENTE (Ponto 01) 11/06/2012 300 METROS AO SUL DA FOZ DO ARROIO
JOINVILLE PRAIA DE VIGORELLI (Ponto 01) 17/05/2012 50 METROS À ESQUERDA DO TRAPICHE
LAGUNA LAGOA DE CABEÇUDAS (Ponto 04) 12/06/2012 FRENTE AO KM 313 DA BR 101
LAGUNA PRAIA DA TERESA (Ponto 05) 11/06/2012 NO MEIO DA PRAIA
LAGUNA PRAIA DE ITAPIRUBÁ (Ponto 01) 12/06/2012 A 100 METROS DO COSTÃO SUL
LAGUNA PRAIA DO CARDOSO (Ponto 06) 11/06/2012 EXTREMA ESQUERDA DA PRAIA
LAGUNA PRAIA DO GI (Ponto 02) 12/06/2012 EM FRENTE AO POSTO SALVA VIDAS
LAGUNA PRAIA DO MAR GROSSO (Ponto 03) 12/06/2012 EM FRENTE AO EMISSÁRIO DA CASAN
LAGUNA PRAINHA DO FAROL (Ponto 07) 11/06/2012 NA ENTRADA DA PRAIA
NAVEGANTES PRAIA DE NAVEGANTES (Ponto 02) 11/06/2012 FRENTE À RUA 8150-POSTO 7 SALVA VIDAS
NAVEGANTES PRAIA DE NAVEGANTES (Ponto 03) 11/06/2012 FRENTE À RUA 7000- POSTO 6 SALVA VIDAS
NAVEGANTES PRAIA DE NAVEGANTES (Ponto 04) 11/06/2012 FOZ DO RIO GRAVATÁ
Página 8
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
PALHOÇA GUARDA DO EMBAÚ (Ponto 03) 05/06/2012 NO RIO, EM FRENTE À VILA
PALHOÇA PRAIA DA PINHEIRA (Ponto 02) 05/06/2012 FRENTE À ENTRADA DA PRAIA
PALHOÇA PRAIA DE FORA (Ponto 04) 05/06/2012 FRENTE À RUA ANTÔNIO JÚLIO FAGUNDES
PALHOÇA PRAIA DO SONHO (Ponto 01) 05/06/2012 EM FRENTE POSTO SALVA VIDAS
PASSO DE TORRES BRAÇO MORTO DO RIO MAMPITUBA (Ponto 02) 17/05/2012 FRENTE AO SALVA VIDAS PRÓXIMO À PONTE
PASSO DE TORRES PRAIA DE PASSO DE TORRES (Ponto 01) 17/05/2012 FRENTE AO SALVA VIDAS
PENHA PRAIA ALEGRE (Ponto 01) 16/05/2012 FRENTE À TRAV. PARTICULAR MARCELO DOS SANTOS
PENHA PRAIA ALEGRE (Ponto 02) 16/05/2012 FOZ DO RIO PIÇARRAS
PENHA PRAIA DA ARMAÇÃO DO ITAPOCORÓI (Ponto 03) 16/05/2012 FTE R. INÊS DE SOUZA - PRAIA DO QUILOMBO
PENHA PRAIA DA ARMAÇÃO DO ITAPOCORÓI (Ponto 04) 16/05/2012 FTE R. BLUMENAU, 5450 - PRAIA DA FORTALEZA
PENHA PRAIA DA ARMAÇÃO DO ITAPOCORÓI (Ponto 05) 16/05/2012 EM FRENTE À RUA MARIA EMÍLIA COSTA
PENHA PRAIA DA ARMAÇÃO DO ITAPOCORÓI (Ponto 11) 16/05/2012 EM FRENTE À RUA ANTONIO ANICETO DA COSTA
PENHA PRAIA DA SAUDADE (Ponto 06) 16/05/2012 NA ENTRADA DA PRAIA
PENHA PRAIA DE SÃO MIGUEL (Ponto 10) 16/05/2012 EM FRENTE À RUA ARNO BECKER
PENHA PRAIA GRANDE (Ponto 08) 16/05/2012 PRÓXIMO AS PEDRAS
PENHA PRAIA VERMELHA (Ponto 09) 16/05/2012 FRENTE À RUA PRINCIPAL DE ACESSO
PENHA PRAINHA DA PENHA (Ponto 07) 16/05/2012 FRENTE À RÓTULA DE RETORNO (BACIA DA VOVÓ)
PIÇARRAS PRAIA DE PIÇARRAS (Ponto 01) 16/05/2012 FRENTE A TRAVESSA LAURO PINTO FERREIRA
PIÇARRAS PRAIA DE PIÇARRAS (Ponto 02) 16/05/2012 FRENTE À AVENIDA GETÚLIO VARGAS
PORTO BELO PRAIA DE PEREQUÊ (Ponto 03) 05/06/2012 PRÓXIMO À FOZ DO RIO PEREQUEZINHO
Página 9
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
PORTO BELO PRAIA DE PEREQUÊ (Ponto 04) 05/06/2012 FRENTE À RUA RUBENS ALVES
PORTO BELO PRAIA DE PEREQUÊ (Ponto 05) 05/06/2012 FRENTE À RUA ALMIRANTE FONSECA NEVES
PORTO BELO PRAIA DE PORTO BELO (Ponto 01) 05/06/2012 FRENTE À RUA JOÃO CLIMACO AO LADO DO TRAPICHE
PORTO BELO PRAIA DE PORTO BELO (Ponto 02) 05/06/2012 EM FRENTE À RUA JOÃO B. GUERREIRO
PORTO BELO PRAIA DE PORTO BELO (Ponto 06) 05/06/2012 FRENTE À RUA CAPITÃO GUALBERTO LEAL NUNES
SÃO FRANCISCO DO SUL PRAIA DA ENSEADA (Ponto 01) 17/05/2012 EM FRENTE AO POSTO SALVA VIDAS
SÃO FRANCISCO DO SUL PRAIA DA ENSEADA (Ponto 02) 17/05/2012 FRENTE À RUA MINAS GERAIS
SÃO FRANCISCO DO SUL PRAIA DA ENSEADA (Ponto 08) 17/05/2012 FRENTE À RUA ACRE
SÃO FRANCISCO DO SUL PRAIA DE ITAGUAÇÚ (Ponto 03) 17/05/2012 FRENTE À RUA MANILA
SÃO FRANCISCO DO SUL PRAIA DE UBATUBA (Ponto 04) 17/05/2012 FRENTE AO POSTO SALVA VIDAS
SÃO FRANCISCO DO SUL PRAIA DO CAPRI (Ponto 05) 17/05/2012 FRENTE À RUA INGLATERRA
SÃO FRANCISCO DO SUL PRAIA DOS PAULAS (Ponto 06) 17/05/2012 FRENTE A PRAÇA DA FIGUEIRA
SÃO FRANCISCO DO SUL PRAIA DOS PAULAS (Ponto 07) 17/05/2012 FRENTE A PRAÇA DO INGLÊS
SÃO JOSÉ PRAIA DE GUARAREMA (Ponto 01) 05/06/2012 CANTO ESQUERDO DA PRAIA
CLASSIFICAÇÃO DO PONTO CONFORME RESOLUÇÃO CONAMA nº 274/2000:
Próprio: quando em 80% ou mais de um conjunto de amostras coletadas nas últimas 5 semanas anteriores, no mesmo localhouver no máximo 800 Escherichia coli por 100 mililitros.
Impróprio: quando em mais de 20% de um conjunto de amostras coletadas nas últimas 5 semanas anteriores, no mesmo local, for superior a 800 Escherichia coli por 100 mililitros ou quando, na última coleta, o resultado for superior a 2000 Escherichia coli por 100 mililitros.
Página 10
Governo do Estado de Santa Catarina
Fundação do Meio Ambiente - FATMA
BALNEABILIDADE DO LITORAL CATARINENSE Relatório nº 26 Data: 15/06/2012
Município Balneário Data da Coleta Situação
CLASSIFICAÇÃO DO PONTO CONFORME RESOLUÇÃO CONAMA nº 274/2000:
Próprio: quando em 80% ou mais de um conjunto de amostras coletadas nas últimas 5 semanas anteriores, no mesmo localhouver no máximo 800 Escherichia coli por 100 mililitros.
Impróprio: quando em mais de 20% de um conjunto de amostras coletadas nas últimas 5 semanas anteriores, no mesmo local, for superior a 800 Escherichia coli por 100 mililitros ou quando, na última coleta, o resultado for superior a 2000 Escherichia coli por 100 mililitros.
Página 11