Carregado porDoris Kosminsky
Visualização de Dados - Pesquisa e Prática - Esperança & Kosminsky
O documento discute visualização de dados, definindo-a como uma forma de representar informações através de imagens geradas por computadores. Apresenta os desafios de visualizar grandes volumes de dados e as vantagens do processamento visual pelo cérebro humano. Também descreve a evolução das ferramentas de visualização e a importância da colaboração multidisciplinar entre designers, cientistas e engenheiros.
Visualização de Dados - Pesquisa e Prática - Esperança & Kosminsky
- 1. Visualização de Dados ClaudioEsperança Doris Kosminsky Universidade Federal do Rio de Janeiro 1 - pesquisa e prática -
- 2.
- 3. 3 “Information visualization”? Imagens apartir de dados? Uso de computadores? Dados concretos? O que é ?VISUALIZAÇÃO
- 4. 4 “Visualização é ummeio” Nathan Yau
- 5.
- 6. Largura de bandado olho humano: 8MB/s 6
- 7. 7 Cérebro humano especializadoem processamento de imagens
- 8.
- 9. 9 Tendências e pontos“fora da curva”
- 10.
- 11. 11 BIG 90% dos dadosdisponíveis foram criados nos últimos 2 anos DATA Todo dia, criamos 2,5 quintilhões de bytes de dados.
- 12.
- 13. • Construído manualmente •Específico para um conjunto de dados • Esteticamente rico • Dados pouco detalhados 13 Infográfico
- 14.
- 15. Visualização de dados •Desenho por algoritmos • Adaptável a novos dados • Pobre esteticamente • Rico em detalhamento de dados 15
- 16.
- 17.
- 18. 18 Infográficos feitos à mão Projeto/ acabamento por computador Gráficos automatizados (ex. Planilhas) Animação/ Multimídia Gráficos Interativos Evolução das ferramentas de visualização
- 19. 19 Infográficos feitos à mão Projeto/ acabamento por computador Gráficos automatizados (ex. Planilhas) Animação/ Multimídia Gráficos Interativos Exploração Visual de Dados Tempo
- 20. Evolução das ferramentasde visualização 20 Infográficos feitos à mão Projeto / acabamento por computador Gráficos automatizados (ex. Planilhas) Animação/ Multimídia Gráficos Interativos Tempo
- 21. 21 Infográficos feitos à mão Projeto/ acabamento por computador Gráficos automatizados (ex. Planilhas) Animação/ Multimídia Gráficos Interativos Exploração Visual de Dados Tempo
- 22. Evolução das ferramentasde visualização 22 Infográficos feitos à mão Projeto / acabamento por computador Gráficos automatizados (ex. Planilhas) Animação/ Multimídia Gráficos Interativos Tempo
- 23. Evolução das ferramentasde visualização 23 Infográficos feitos à mão Projeto / acabamento por computador Gráficos automatizados (ex. Planilhas) Animação/ Multimídia Gráficos Interativos Tempo
- 24.
- 25. Áreas • Representação gráficade dados • Layouts dinâmicos • Esquemas de animação • Design de interação 25
- 26. Concepção • Equipe multidisciplinar -Designers - Artistas - Engenheiros - Cientistas de computação • Ferramentas - Software de autoria - Programação 26 e Realização
- 27.
- 28.
- 29.
- 30. Oportunidades para • Co-orientaçãode alunos – Jogos – Arte generativa/algorítmica – Visualização de dados • Ensino de disciplinas • Palestras 30 Colaboração
- 31. 31 Enfoque humanístico Olhar doconsumidor das ferramentas gráficas Soluções visuais originais Estética COMPUTAÇÃO Design
- 32. 32 Matemática Enfoque algorítmico Olhar docriador de ferramentas gráficas Soluções visuais automáticas e escaláveis Design COMPUTAÇÃO
- 33. Laboratório da Visualidadee Visualização Escola de Belas Artes Universidade Federal do Rio de Janeiro 33
- 34.
- 35.
- 36.
- 37.
- 38.
- 39.
- 40.
- 41.
- 42.
- 43. Contato • Banco temdados compilados a partir de diversas fontes – IEA (International Energy Agency) – Dados fornecidos por países membros – Pesquisas dos economistas do banco • Site do Energy Innovation Center – Visualização de dados 43 com o IDB
- 44.
- 45. Dados sobre • EnergyFlow – 1 resumo por país / período – 7 com outros recortes • Institutional – 1 resumo por país – 3 com outros recortes 45 energia
- 46.
- 47. 47 Resumo: Fluxo Energético Tradicionalmentevisualizado através de um diagrama Sankey
- 48.
- 49.
- 50.
- 51.
- 52.
- 53. 53 Desafios: representação visual:metáforas, esquemas de cores + seleção
- 54.
- 55. 55 Resumo: atuação institucional Desafio:dados não quantificáveis http://www.iadb.org/en/topics/energy/energy-innovation-center/energy-database,8879.html?view=v21
- 56.
- 57.
- 58. Roteiro para VD(Ben Fry) • Aquisição • Decodificação • Filtragem • Mineração • Representação Visual • Refinamento • Interação 58 Modelagem de dados
- 59.
- 60. Roteiro para VD(Ben Fry) • Aquisição • Decodificação • Filtragem • Mineração • Representação Visual • Refinamento • Interação 60 Concepção Implementação
- 61. Do esboço à •Requerimentos – Visualização online – Interação – Compatibilidade com navegadores desktop e móveis • HTML5 – JavaScript+D3 – SVG/CSS 61 implementação
- 62. SVG • Scalable VectorGraphics – Gráfico é um documento HTML – Desenhar = manipular DOM – Pode ser exportado e editado offline • Cascading Style Sheets – Cor / espessura de linhas / alinhamento / etc – Orientado a objetos – Pode ser manipulada separada da geometria 62 +CSS
- 63.
- 64. Layout estático • Layout? –Tamanho, espaçamento, etc – Designer propõe regras gerais • Layout dos desenhos – Realizado manualmente (com ou sem ajuda do computador) – Poucos conjuntos de dados • Layout dinâmico – Implementado por programação – Deve contemplar qualquer conjunto de dados 64 dinâmicovs
- 65. Programando • Difícil satisfazertodas as restrições de layout para todos os dados imagináveis • Um pouco de bom senso ajuda – Ex.: – Consumo não pode ser maior que soma de importação e produção – Faixas conectando caixas alinhadas horizontalmente dão menos problemas – Fontes pequenas dão menos problemas mas podem ser ilegíveis 65 Layouts
- 66. 66 Altura das caixasproporcional à quantidade de energia
- 67. 67 Largura das faixasde fluxo proporcionais à quantidade de energia
- 68. 68 Faixas com tangentesortogonais às caixas porém não intersectantes
- 69. 69 Faixas com largurasuniformes e paralelas
- 70.
- 71.
- 72. Design de interaçãoem 72 trata do design de produtos interativos, com o objetivo de facilitar a realização de atividades, a conexão entre pessoas e a obtenção de informações - na vida pessoal e profissional visualização de dados
- 73.
- 74.
- 75. • Natureza exploratóriada visualização – ações interativas são uma constante – designer propõe regras gerais • Decisões tomadas a priori • Inexistência de boas ferramentas para prototipagem de interações • Desejo do usuário de fazer escolhas em relação ao visual (ex: associação entre cores e países) 75 Design de interação em visualização de dados
- 76. Conclusões • Visualização dedados é desafiadora • Apanhamos aprendemos muito! • Colaboração é fundamental • Universidades não formam profissionais capazes de exercer com competência todos os papéis necessários – Programador-designer – Designer-programador 76
- 77. Claudio Esperança esperanc@cos.ufrj.br Doris Kosminsky doriskos@gmail.com UniversidadeFederal do Rio de Janeiro 77 - pesquisa e prática - Visualização de Dados