SlideShare uma empresa Scribd logo
Interface Gráfica do Usuário
para exploração e visualização
de grandes coleções de imagens
Júlia Rabetti Giannella
juliagiannella@gmail.com
4º Simpósio de Pós-Graduação em Design da Esdi
Escola Superior de Desenho Industrial
Universidade Estadual do Rio de Janeiro
Interface Gráfica do Usuário
para exploração e visualização
de grandes coleções de imagens
- interfaces web
- aspectos de visualidade e de funcionalidade

que facilitam a interação do usuário
Julia Rabetti GiannellaSPGD 2018
Interface Gráfica do Usuário
para exploração e visualização
de grandes coleções de imagens
propósito de uso: 

ambiente para descoberta 

e apreciação casual
Julia Rabetti GiannellaSPGD 2018
Interface Gráfica do Usuário
para exploração e visualização
de grandes coleções de imagens
objetos visuais culturais
(fotografias, pinturas, ilustrações, etc.)
Julia Rabetti GiannellaSPGD 2018
Julia Rabetti GiannellaSPGD 2018
COLEÇÕES CULTURAIS
textos e documentos
vestimenta
esculturas
imagens
ferramentas
costumes
linguagem
valores
práticas sociais
música
artes cênicas
crenças
bens
imagem
áudio
video
texto
video
objeto 3D
objetos digitais
tempo
espaço
autor
evento
categoria
outro
METADADO
OBJETO
{
https://uclab.fh-potsdam.de/projects/past-visions/
PAST VISION | Glinka et al. (2017)
http://publicdomain.nypl.org/pd-visualization/
New York Public Library Visualization Tool
ASPECTOS NORTEADORES
Julia Rabetti GiannellaSPGD 2018
vista geral (overview) - visão geral da coleção, normalmente
apresentada a partir de thumbnails;
vista detalhada (preview) - vista ampliada de uma imagem,
normalmente uma versão em alta resolução acompanhada de
informações contextuais;
relações - organização, filtragem e visualização dos objetos a
partir de suas facetas (tempo, espaço, autor, categoria, etc.)
OPORTUNIDADES
Julia Rabetti GiannellaSPGD 2018
metadados temáticos e geográficos
ex: relacionar e visualizar fotografias de um mesmo autor por assunto e local de registro 

layouts sinópticos
ex: comparar fotografias de um mesmo autor tiradas em locais diferentes

granularidade visual
ex: visualizar uma fotografia em diferentes níveis de distância e abstração (da miniatura a
ampliação).

tipo de uso
ex: investigação científica e apreciação casual
Doutorado em
Design e Tecnologia
PPDESDI - UERJ
Assistente
de pesquisa
Visgraf - IMPA
LUGAR DE FALA
Julia Rabetti GiannellaSPGD 2018
Diante de milhares de fotografias, como tornar
esta coleção mais explorável e compreensível?
Como entender os conteúdos semânticos
contidos nas imagens e como comparar ou
encontrar exemplos para um determinado
recorte geográfico ou temporal?
PERGUNTA DE PARTIDA
Julia Rabetti GiannellaSPGD 2018
MOTIVAÇÃO
big
image
data
imagens
criadas
digitalmente
imagens
digitalizadas
Julia Rabetti GiannellaSPGD 2018
ENQUADRAMENTO TEÓRICO
Computação
Data Science
Humanidades
Digitais
metodologias
e tecnologias
digitais
Literatura
Estudos de Mídia
História da Arte
Cultura Visual
Linguística
Música
Ciências
Humanas
Julia Rabetti GiannellaSPGD 2018
IMPLICAÇÕES
refletir
fazer
interfaces
gráfica
do usuário
visualizaçõescódigossoftwares
Julia Rabetti GiannellaSPGD 2018
DOMÍNIOS
HsDs
Design
Computação Humanidades
Julia Rabetti GiannellaSPGD 2018
ABORDAGENS
Métodos Digitais
Interfaces para
coleções culturais
técnicas
de visualização
técnicas
de processamento
de imagem
Julia Rabetti GiannellaSPGD 2018
Analítica Cultural
(Manovich)
ANALÍTICA CULTURAL
"A análise de grandes conjuntos 

de dados culturais e fluxos usando
técnicas computacionais e de
visualização".
Manovich, 2015
Julia Rabetti GiannellaSPGD 2018
ANALÍTICA CULTURAL
"A análise de grandes conjuntos 

de dados culturais e fluxos usando
técnicas computacionais e de
visualização".
combinações de técnicas de
processamento de imagem
e operações estatísticas
Julia Rabetti GiannellaSPGD 2018
ESPAÇO DE CARACTERÍSTICA
BRILHO MÉDIO
SATURAÇÃOMÉDIA
Visualização de mídia (objeto + metadado)
BRILHO MÉDIO
SATURAÇÃOMÉDIA
ex: Comparação de pinturas de Van Gogh em Paris e em Arles (photoplot)
Julia Rabetti GiannellaSPGD 2018
PERSPECTIVAS
Julia Rabetti GiannellaSPGD 2018
foco no campo interfaces para coleções culturais
oportunidades -> diretrizes de design
protótipo conceitual-gráfico
seleção de uma coleção fotográfica existente
OBRIGADA!
juliagiannella@gmail.com
@juliagiannella

Mais conteúdo relacionado

Semelhante a Interface gráfica do usuário para exploração e visualização de grandes coleções de imagens

A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...
A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...
A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...
Priscila Selmo
 
INF-PROF-CP-MI-TIC1-Planificação-22-23.pdf
INF-PROF-CP-MI-TIC1-Planificação-22-23.pdfINF-PROF-CP-MI-TIC1-Planificação-22-23.pdf
INF-PROF-CP-MI-TIC1-Planificação-22-23.pdf
FilipeSarmento4
 
Média-Arte Digital e Ensino a Distância
Média-Arte Digital e Ensino a DistânciaMédia-Arte Digital e Ensino a Distância
Média-Arte Digital e Ensino a Distância
José Bidarra
 
Lipacs Geo Brasil2008
Lipacs Geo Brasil2008Lipacs Geo Brasil2008
Lipacs Geo Brasil2008
Lipacs IA Unicamp
 
Introdução Projeto Grafico - 2 Sem 2013
Introdução Projeto Grafico - 2 Sem 2013Introdução Projeto Grafico - 2 Sem 2013
Introdução Projeto Grafico - 2 Sem 2013profclaubordin
 
Conceito - Ambiente expositivo
Conceito - Ambiente expositivoConceito - Ambiente expositivo
Conceito - Ambiente expositivo
profclaubordin
 
I Semada de educação e artes digitais
I Semada de educação e artes digitaisI Semada de educação e artes digitais
I Semada de educação e artes digitais
Casa da Árvore - Cultura Digital e Aprendizagem Criativa
 
Weihc2015 claudiabordinrodrigues
Weihc2015 claudiabordinrodriguesWeihc2015 claudiabordinrodrigues
Weihc2015 claudiabordinrodrigues
Claudia Bordin Rodrigues
 
Artigo Científico do 3° semestre de Design Digital
Artigo Científico do 3° semestre de Design DigitalArtigo Científico do 3° semestre de Design Digital
Artigo Científico do 3° semestre de Design Digital
amandamiyuki
 
Lipacs Linguagem Virtualidade
Lipacs Linguagem VirtualidadeLipacs Linguagem Virtualidade
Lipacs Linguagem Virtualidade
Lipacs IA Unicamp
 
Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?
Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?
Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?
Universidade Nova de Lisboa
 
Interfaces web como materialização das estratégias de experiência: Análise do...
Interfaces web como materialização das estratégias de experiência: Análise do...Interfaces web como materialização das estratégias de experiência: Análise do...
Interfaces web como materialização das estratégias de experiência: Análise do...
Gabriela Steigleder
 
Apresentação Proposta de Dissertação de Mestrado
Apresentação Proposta de Dissertação de MestradoApresentação Proposta de Dissertação de Mestrado
Apresentação Proposta de Dissertação de MestradoAndre Luiz Abrahão
 
Apresentação leexa
Apresentação leexaApresentação leexa
Apresentação leexaVenise Melo
 
Projeto Gráfico Exposição - Elementos de design ambiental
Projeto Gráfico Exposição - Elementos de design ambientalProjeto Gráfico Exposição - Elementos de design ambiental
Projeto Gráfico Exposição - Elementos de design ambiental
profclaubordin
 
Design Thinking - Aula 01
Design Thinking - Aula 01Design Thinking - Aula 01
Design Thinking - Aula 01
Israel Lessak
 
Apresentação do Workshop Colaborativo com Professores - Felipe Sobral
Apresentação do Workshop Colaborativo com Professores - Felipe SobralApresentação do Workshop Colaborativo com Professores - Felipe Sobral
Apresentação do Workshop Colaborativo com Professores - Felipe Sobral
Erika Marion Robrahn-González
 
Design Customizado
Design CustomizadoDesign Customizado
Design Customizado
bernardolm
 

Semelhante a Interface gráfica do usuário para exploração e visualização de grandes coleções de imagens (20)

Designdigital
DesigndigitalDesigndigital
Designdigital
 
A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...
A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...
A Influencia Das Emocoes e Dos Processos Cognitivos Em Ambientes de Realidade...
 
INF-PROF-CP-MI-TIC1-Planificação-22-23.pdf
INF-PROF-CP-MI-TIC1-Planificação-22-23.pdfINF-PROF-CP-MI-TIC1-Planificação-22-23.pdf
INF-PROF-CP-MI-TIC1-Planificação-22-23.pdf
 
Média-Arte Digital e Ensino a Distância
Média-Arte Digital e Ensino a DistânciaMédia-Arte Digital e Ensino a Distância
Média-Arte Digital e Ensino a Distância
 
Lipacs Geo Brasil2008
Lipacs Geo Brasil2008Lipacs Geo Brasil2008
Lipacs Geo Brasil2008
 
Introdução Projeto Grafico - 2 Sem 2013
Introdução Projeto Grafico - 2 Sem 2013Introdução Projeto Grafico - 2 Sem 2013
Introdução Projeto Grafico - 2 Sem 2013
 
Conceito - Ambiente expositivo
Conceito - Ambiente expositivoConceito - Ambiente expositivo
Conceito - Ambiente expositivo
 
I Semada de educação e artes digitais
I Semada de educação e artes digitaisI Semada de educação e artes digitais
I Semada de educação e artes digitais
 
Weihc2015 claudiabordinrodrigues
Weihc2015 claudiabordinrodriguesWeihc2015 claudiabordinrodrigues
Weihc2015 claudiabordinrodrigues
 
Francis eduardo
Francis eduardoFrancis eduardo
Francis eduardo
 
Artigo Científico do 3° semestre de Design Digital
Artigo Científico do 3° semestre de Design DigitalArtigo Científico do 3° semestre de Design Digital
Artigo Científico do 3° semestre de Design Digital
 
Lipacs Linguagem Virtualidade
Lipacs Linguagem VirtualidadeLipacs Linguagem Virtualidade
Lipacs Linguagem Virtualidade
 
Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?
Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?
Visualização e análise espacial nas humanidades: o que ganhamos, o que perdemos?
 
Interfaces web como materialização das estratégias de experiência: Análise do...
Interfaces web como materialização das estratégias de experiência: Análise do...Interfaces web como materialização das estratégias de experiência: Análise do...
Interfaces web como materialização das estratégias de experiência: Análise do...
 
Apresentação Proposta de Dissertação de Mestrado
Apresentação Proposta de Dissertação de MestradoApresentação Proposta de Dissertação de Mestrado
Apresentação Proposta de Dissertação de Mestrado
 
Apresentação leexa
Apresentação leexaApresentação leexa
Apresentação leexa
 
Projeto Gráfico Exposição - Elementos de design ambiental
Projeto Gráfico Exposição - Elementos de design ambientalProjeto Gráfico Exposição - Elementos de design ambiental
Projeto Gráfico Exposição - Elementos de design ambiental
 
Design Thinking - Aula 01
Design Thinking - Aula 01Design Thinking - Aula 01
Design Thinking - Aula 01
 
Apresentação do Workshop Colaborativo com Professores - Felipe Sobral
Apresentação do Workshop Colaborativo com Professores - Felipe SobralApresentação do Workshop Colaborativo com Professores - Felipe Sobral
Apresentação do Workshop Colaborativo com Professores - Felipe Sobral
 
Design Customizado
Design CustomizadoDesign Customizado
Design Customizado
 

Mais de Júlia Rabetti Giannella

Hands-on activity on Data Visualization
Hands-on activity on Data VisualizationHands-on activity on Data Visualization
Hands-on activity on Data Visualization
Júlia Rabetti Giannella
 
ObsevartóR!O2016 - interseções entre arte e técnicas de Deep Learning
ObsevartóR!O2016 - interseções entre arte e técnicas de Deep LearningObsevartóR!O2016 - interseções entre arte e técnicas de Deep Learning
ObsevartóR!O2016 - interseções entre arte e técnicas de Deep Learning
Júlia Rabetti Giannella
 
Dataviz, Twitter e #Rio2016: percepção dos dados olímpicos
Dataviz, Twitter e #Rio2016: percepção dos dados olímpicosDataviz, Twitter e #Rio2016: percepção dos dados olímpicos
Dataviz, Twitter e #Rio2016: percepção dos dados olímpicos
Júlia Rabetti Giannella
 
Deep Learning applications
Deep Learning applicationsDeep Learning applications
Deep Learning applications
Júlia Rabetti Giannella
 
Rio 2016 Contestation Images: a critical perception from content collected on...
Rio 2016 Contestation Images: a critical perception from content collected on...Rio 2016 Contestation Images: a critical perception from content collected on...
Rio 2016 Contestation Images: a critical perception from content collected on...
Júlia Rabetti Giannella
 
Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...
Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...
Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...
Júlia Rabetti Giannella
 
Data visualization: advances by brazilian researches
Data visualization: advances by brazilian researches Data visualization: advances by brazilian researches
Data visualization: advances by brazilian researches
Júlia Rabetti Giannella
 
Design e interfaces cartográficas: avanços para pesquisa e atuação profissional
Design e interfaces cartográficas: avanços para pesquisa e atuação profissionalDesign e interfaces cartográficas: avanços para pesquisa e atuação profissional
Design e interfaces cartográficas: avanços para pesquisa e atuação profissional
Júlia Rabetti Giannella
 
Dispositivo infovis: interfaces entre visualização da informação, infografia ...
Dispositivo infovis: interfaces entre visualização da informação, infografia ...Dispositivo infovis: interfaces entre visualização da informação, infografia ...
Dispositivo infovis: interfaces entre visualização da informação, infografia ...
Júlia Rabetti Giannella
 

Mais de Júlia Rabetti Giannella (9)

Hands-on activity on Data Visualization
Hands-on activity on Data VisualizationHands-on activity on Data Visualization
Hands-on activity on Data Visualization
 
ObsevartóR!O2016 - interseções entre arte e técnicas de Deep Learning
ObsevartóR!O2016 - interseções entre arte e técnicas de Deep LearningObsevartóR!O2016 - interseções entre arte e técnicas de Deep Learning
ObsevartóR!O2016 - interseções entre arte e técnicas de Deep Learning
 
Dataviz, Twitter e #Rio2016: percepção dos dados olímpicos
Dataviz, Twitter e #Rio2016: percepção dos dados olímpicosDataviz, Twitter e #Rio2016: percepção dos dados olímpicos
Dataviz, Twitter e #Rio2016: percepção dos dados olímpicos
 
Deep Learning applications
Deep Learning applicationsDeep Learning applications
Deep Learning applications
 
Rio 2016 Contestation Images: a critical perception from content collected on...
Rio 2016 Contestation Images: a critical perception from content collected on...Rio 2016 Contestation Images: a critical perception from content collected on...
Rio 2016 Contestation Images: a critical perception from content collected on...
 
Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...
Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...
Campus Party Brasil 2017: OBSERVATÓR!O2016: perceptions of olympics through d...
 
Data visualization: advances by brazilian researches
Data visualization: advances by brazilian researches Data visualization: advances by brazilian researches
Data visualization: advances by brazilian researches
 
Design e interfaces cartográficas: avanços para pesquisa e atuação profissional
Design e interfaces cartográficas: avanços para pesquisa e atuação profissionalDesign e interfaces cartográficas: avanços para pesquisa e atuação profissional
Design e interfaces cartográficas: avanços para pesquisa e atuação profissional
 
Dispositivo infovis: interfaces entre visualização da informação, infografia ...
Dispositivo infovis: interfaces entre visualização da informação, infografia ...Dispositivo infovis: interfaces entre visualização da informação, infografia ...
Dispositivo infovis: interfaces entre visualização da informação, infografia ...
 

Interface gráfica do usuário para exploração e visualização de grandes coleções de imagens