Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
Aula 03
1. CRIAÇÃO DO EFEITO DE PARALAXE
COMPOSIÇÃO DIGITAL
Curso de Mestrado em Ciências da Comunicação - 1º Ano | 2º Semestre
• Bibliografia aconselhada:
Christiansen, M. (2009) Adobe After Effects CS4: Visual Effects and Compositing. Studio Techniques.
Adobe Press. Berkeley, CA
Professor Doutor
Leonardo Pereira
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
01
O que é o efeito de Paralaxe?
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
O que é
o Paralaxe?
Mas o que é o efeito de Paralaxe?
O efeito de Paralaxe assenta num mecanismo visual em que, quando o observador se
desloca em relação ao mundo, tudo o que está mais longe do observador é percecio-
nado como tendo um movimento aparente mais lento do que o movimento aparente de
tudo o que está mais próximo do observador.
A melhor forma de se perceber ou compreender este mecanismo da percepção visual é
observando-se o típico exemplo da janela de comboio em movimento.
• Visualizar exemplo em:
http://www.youtube.com/watch?v=u5_sFyI-lcI
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Como
funciona o
Paralaxe?
E porque é que percecionamos desta forma?
Porque o nosso campo visual é cónico. Repare-se, por exemplo, no seguinte esquema
onde se percebe que um objecto que se encontra a uma maior distância do observador
do que outro, está mais tempo dentro do cone visual do que o segundo. Como demora
mais a sair do cone parece deslocar-se mais devagar. Os que demoram menos a sair do
cone aparentam deslocar-se mais rápido.
01 seg.
Observador
03 seg.
05 seg.
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Exemplos de
Paralaxe
Bottom line...
Compreendendo-se este mecanismo da nossa perceção podemos tirar partido dele para
criar a ilusão de profundidade e de tridimensionalidade pelo movimento de uma câmara
em relação a imagens e vídeos tridimensionalmente dispostos num espaço 3D.
E é precisamente deste mecanismo que as técnicas de recriação de Paralaxe se
aproveitam.
• Visualizar exemplos em:
http://www.youtube.com/watch?v=Omv3qB5ppBk&feature=related
http://www.youtube.com/watch?v=FKBdsybaFRI&NR=1&feature=fvwp
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
02
Técnicas e métodos de criação de Paralaxe
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
Há 3 tipos de técnicas e métodos de criação de Paralaxe
1.	Do 2D para o 2.5D (Photoshop + AE)
2.	Projeção de Câmaras ou Camera mapping (Photoshop + AE)
3. Displacement Map (Photoshop + AE)
Vamos ver em que consistem.
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Do 2D para o 2.5D
(Photoshop + AE)
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
Do 2D para o 2.5D
Técnica baseada na separação dos elementos constituintes de uma imagem em várias
layers separadas para depois as compor num espaço 3D no AE e animar a composição
com movimentos da câmara.
Geralmente este tipo de método implica que a imagem seja sub-dividída em Photoshop
e depois re-composta em layers, ou no After Effects ou em aplicações de compositing
como o Toxic, Nuke, Flame, entre outras.
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
Do 2D para o 2.5D
Um exemplo do uso desta técnica de criação de Paralaxe é o genérico da Série Norte
Americana “How I met your mother“.
• Visualizar em:
https://www.youtube.com/watch?v=BjALKhHIitQ
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
Com esta técnica podemos, a partir do uso de imagens inicialmente estáticas,
criar ilusões de profundidade tridimensional e literalmente entrar dentro de uma fotogra-
fia, por exemplo.
É o que acontece no genérico da série norte americana “Carnivale” da HBO...
Carta 2D Mundo da carta 3D
• Visualizar em:
http://www.youtube.com/watch?v=0CYMXoX-b0o&feature=related
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
A partir de fotografias estáticas podemos recriar a ilusão de tridimensionalidade
e profundidade.
Como nestes casos:
• Visualizar em:
https://vimeo.com/125587423
https://vimeo.com/125572912
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Camera Projection
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
A projeção de câmaras ou o camera mapping, é uma técnica de criação de paralaxe que
assenta na ideia de digitalmente utilizar, numa cena 3D, uma câmara como um proje-
tor que projeta sobre uma geometria tridimensional uma imagem e que, assim, quando
outra câmara filma a cena, cria a ilusão de tridimensionalidade espacial.
• Visualizar exemplo em:
https://www.youtube.com/watch?v=zS7TheOr9oU
https://www.youtube.com/watch?v=Jr7JEitJTZQ
http://www.youtube.com/watch?v=cNhII-Gh2_M
https://www.youtube.com/watch?v=SdO-mMnMxFk
https://www.youtube.com/watch?v=YQw58-AfZws
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Displacement Map
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
Displacement Maps
Os Displacement Maps são uma técnica de criação de Paralaxe assente na ideia
de mapear, através de escalas de cinzas no Photoshop, a distância a que um ponto ou
superfície, se encontra, de forma relativa, do observador.
Mais escuro
O que está mais afastado do observador é progressivamente mais escuro
Mais claro
O que está mais próximo do observador é progressivamente mais claro.
A ideia é primeiro fazer esse mapa de distâncias no Photoshop e, depois, usar esse
mapa para fazer no After Effects um displacement animado que sugere ou cria uma
pequena ilusão de Paralaxe e tridimensionalidade dos elementos mapeados da imagem.
+ escuro
Mais longe do
observador
+ claro
Mais longe do
observador
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Métodos de
criação de
Paralaxe
Displacement Maps
Vejamos alguns exemplos...
• Visualizar exemplo em:
https://vimeo.com/45730595
• Visualizar exemplo em:
https://vimeo.com/88899588
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
03
A Puppet Pin Tool
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Puppet Pin Tool
Tal como o nome diz a Puppet Pin Tool é uma ferramenta do After Effects que nos
permite animar pequenos movimentos de partes individuais de uma figura recortada,
como se de um fantoche se tratasse.
Esta ferramenta é excelente para se usar combinadamente com técnicas de criação de
paralaxe, uma vez que nos permite adicionar ligeiros movimentos às figuras que adicio-
nam credibilidade ao efeito visual.
Ferramenta
extra
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Puppet Pin Tool
Vejamos exemplos do que esta poderosa ferramenta nos permite, combinadamente com
técnicas de criação de paralaxe, fazer a uma imagem inicialmente estática e inanimada
Nota:
Esta técnica não é aplicável, de forma combinada, com Camera Projection e
Displacement Maps. Só é aplicável com a técnica de conversão de imagens 2D em
2.5D.
Exemplos
• Visualizar exemplo em:
https://vimeo.com/50672419
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Puppet Pin Tool
Outro excelente exemplo:
Nota:
Esta técnica não é aplicável, de forma combinada, com Camera Projection e
Displacement Maps. Só é aplicável com a técnica de conversão de imagens 2D em
2.5D.
Exemplos
• Visualizar exemplo em:
https://vimeo.com/83910533
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
04
Tutoriais disponíveis online
Universidade do Minho
Instituto de Ciências Sociais
Departamento de Ciências da Comunicação
COMPOSIÇÃO DIGITAL
Professor Doutor Leonardo Pereira
Tutoriais
disponíveis
Há uma série de tutoriais disponíveis na net, nomeadamente no Youtube e Vimeo.
Do 2D para o 2.5D:
http://www.videocopilot.net/tutorials/virtual_3d_photos/
https://www.youtube.com/watch?v=Du5duGPEsP0
https://www.youtube.com/watch?v=FYEDXfuu0HM
https://www.youtube.com/watch?v=ghWOIo1oODU
Displacement Maps:
https://www.youtube.com/watch?v=BGmALu0m2sA
https://www.youtube.com/watch?v=qO5rNUmqFO8
https://www.youtube.com/watch?v=ztj3JsYQ5Og&t=34s
https://www.youtube.com/watch?v=JzJohgzY4S0&t=4s
Camera Projection:
http://www.youtube.com/watch?v=Oauu2kF7SXA
http://www.youtube.com/watch?v=UfLMnJTspvM&feature=related
http://www.videocopilot.net/tutorials/submerged/
http://www.videocopilot.net/tutorials/3d_camera_projection/
http://www.videocopilot.net/tutorials/3d_camera_projection_2/
https://www.youtube.com/watch?v=ldfYFsDUspU
https://www.youtube.com/watch?v=oSko7F9vQ6Q
https://www.youtube.com/watch?v=3xDI6D5GW_k
Do 2D para o 2.5D (com Puppet Pin):
https://www.youtube.com/watch?v=GZimVBFSGm0
https://www.youtube.com/watch?v=k1Kerq8XSWQ&t=295s

Tutorial de criação de paralaxe numa imagem 2D

  • 1.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação Aula 03 1. CRIAÇÃO DO EFEITO DE PARALAXE COMPOSIÇÃO DIGITAL Curso de Mestrado em Ciências da Comunicação - 1º Ano | 2º Semestre • Bibliografia aconselhada: Christiansen, M. (2009) Adobe After Effects CS4: Visual Effects and Compositing. Studio Techniques. Adobe Press. Berkeley, CA Professor Doutor Leonardo Pereira
  • 2.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira 01 O que é o efeito de Paralaxe?
  • 3.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira O que é o Paralaxe? Mas o que é o efeito de Paralaxe? O efeito de Paralaxe assenta num mecanismo visual em que, quando o observador se desloca em relação ao mundo, tudo o que está mais longe do observador é percecio- nado como tendo um movimento aparente mais lento do que o movimento aparente de tudo o que está mais próximo do observador. A melhor forma de se perceber ou compreender este mecanismo da percepção visual é observando-se o típico exemplo da janela de comboio em movimento. • Visualizar exemplo em: http://www.youtube.com/watch?v=u5_sFyI-lcI
  • 4.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Como funciona o Paralaxe? E porque é que percecionamos desta forma? Porque o nosso campo visual é cónico. Repare-se, por exemplo, no seguinte esquema onde se percebe que um objecto que se encontra a uma maior distância do observador do que outro, está mais tempo dentro do cone visual do que o segundo. Como demora mais a sair do cone parece deslocar-se mais devagar. Os que demoram menos a sair do cone aparentam deslocar-se mais rápido. 01 seg. Observador 03 seg. 05 seg.
  • 5.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Exemplos de Paralaxe Bottom line... Compreendendo-se este mecanismo da nossa perceção podemos tirar partido dele para criar a ilusão de profundidade e de tridimensionalidade pelo movimento de uma câmara em relação a imagens e vídeos tridimensionalmente dispostos num espaço 3D. E é precisamente deste mecanismo que as técnicas de recriação de Paralaxe se aproveitam. • Visualizar exemplos em: http://www.youtube.com/watch?v=Omv3qB5ppBk&feature=related http://www.youtube.com/watch?v=FKBdsybaFRI&NR=1&feature=fvwp
  • 6.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira 02 Técnicas e métodos de criação de Paralaxe
  • 7.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe Há 3 tipos de técnicas e métodos de criação de Paralaxe 1. Do 2D para o 2.5D (Photoshop + AE) 2. Projeção de Câmaras ou Camera mapping (Photoshop + AE) 3. Displacement Map (Photoshop + AE) Vamos ver em que consistem.
  • 8.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Do 2D para o 2.5D (Photoshop + AE)
  • 9.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe Do 2D para o 2.5D Técnica baseada na separação dos elementos constituintes de uma imagem em várias layers separadas para depois as compor num espaço 3D no AE e animar a composição com movimentos da câmara. Geralmente este tipo de método implica que a imagem seja sub-dividída em Photoshop e depois re-composta em layers, ou no After Effects ou em aplicações de compositing como o Toxic, Nuke, Flame, entre outras.
  • 10.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe Do 2D para o 2.5D Um exemplo do uso desta técnica de criação de Paralaxe é o genérico da Série Norte Americana “How I met your mother“. • Visualizar em: https://www.youtube.com/watch?v=BjALKhHIitQ
  • 11.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe Com esta técnica podemos, a partir do uso de imagens inicialmente estáticas, criar ilusões de profundidade tridimensional e literalmente entrar dentro de uma fotogra- fia, por exemplo. É o que acontece no genérico da série norte americana “Carnivale” da HBO... Carta 2D Mundo da carta 3D • Visualizar em: http://www.youtube.com/watch?v=0CYMXoX-b0o&feature=related
  • 12.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe A partir de fotografias estáticas podemos recriar a ilusão de tridimensionalidade e profundidade. Como nestes casos: • Visualizar em: https://vimeo.com/125587423 https://vimeo.com/125572912
  • 13.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Camera Projection
  • 14.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe A projeção de câmaras ou o camera mapping, é uma técnica de criação de paralaxe que assenta na ideia de digitalmente utilizar, numa cena 3D, uma câmara como um proje- tor que projeta sobre uma geometria tridimensional uma imagem e que, assim, quando outra câmara filma a cena, cria a ilusão de tridimensionalidade espacial. • Visualizar exemplo em: https://www.youtube.com/watch?v=zS7TheOr9oU https://www.youtube.com/watch?v=Jr7JEitJTZQ http://www.youtube.com/watch?v=cNhII-Gh2_M https://www.youtube.com/watch?v=SdO-mMnMxFk https://www.youtube.com/watch?v=YQw58-AfZws
  • 15.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Displacement Map
  • 16.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe Displacement Maps Os Displacement Maps são uma técnica de criação de Paralaxe assente na ideia de mapear, através de escalas de cinzas no Photoshop, a distância a que um ponto ou superfície, se encontra, de forma relativa, do observador. Mais escuro O que está mais afastado do observador é progressivamente mais escuro Mais claro O que está mais próximo do observador é progressivamente mais claro. A ideia é primeiro fazer esse mapa de distâncias no Photoshop e, depois, usar esse mapa para fazer no After Effects um displacement animado que sugere ou cria uma pequena ilusão de Paralaxe e tridimensionalidade dos elementos mapeados da imagem. + escuro Mais longe do observador + claro Mais longe do observador
  • 17.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Métodos de criação de Paralaxe Displacement Maps Vejamos alguns exemplos... • Visualizar exemplo em: https://vimeo.com/45730595 • Visualizar exemplo em: https://vimeo.com/88899588
  • 18.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira 03 A Puppet Pin Tool
  • 19.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Puppet Pin Tool Tal como o nome diz a Puppet Pin Tool é uma ferramenta do After Effects que nos permite animar pequenos movimentos de partes individuais de uma figura recortada, como se de um fantoche se tratasse. Esta ferramenta é excelente para se usar combinadamente com técnicas de criação de paralaxe, uma vez que nos permite adicionar ligeiros movimentos às figuras que adicio- nam credibilidade ao efeito visual. Ferramenta extra
  • 20.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Puppet Pin Tool Vejamos exemplos do que esta poderosa ferramenta nos permite, combinadamente com técnicas de criação de paralaxe, fazer a uma imagem inicialmente estática e inanimada Nota: Esta técnica não é aplicável, de forma combinada, com Camera Projection e Displacement Maps. Só é aplicável com a técnica de conversão de imagens 2D em 2.5D. Exemplos • Visualizar exemplo em: https://vimeo.com/50672419
  • 21.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Puppet Pin Tool Outro excelente exemplo: Nota: Esta técnica não é aplicável, de forma combinada, com Camera Projection e Displacement Maps. Só é aplicável com a técnica de conversão de imagens 2D em 2.5D. Exemplos • Visualizar exemplo em: https://vimeo.com/83910533
  • 22.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira 04 Tutoriais disponíveis online
  • 23.
    Universidade do Minho Institutode Ciências Sociais Departamento de Ciências da Comunicação COMPOSIÇÃO DIGITAL Professor Doutor Leonardo Pereira Tutoriais disponíveis Há uma série de tutoriais disponíveis na net, nomeadamente no Youtube e Vimeo. Do 2D para o 2.5D: http://www.videocopilot.net/tutorials/virtual_3d_photos/ https://www.youtube.com/watch?v=Du5duGPEsP0 https://www.youtube.com/watch?v=FYEDXfuu0HM https://www.youtube.com/watch?v=ghWOIo1oODU Displacement Maps: https://www.youtube.com/watch?v=BGmALu0m2sA https://www.youtube.com/watch?v=qO5rNUmqFO8 https://www.youtube.com/watch?v=ztj3JsYQ5Og&t=34s https://www.youtube.com/watch?v=JzJohgzY4S0&t=4s Camera Projection: http://www.youtube.com/watch?v=Oauu2kF7SXA http://www.youtube.com/watch?v=UfLMnJTspvM&feature=related http://www.videocopilot.net/tutorials/submerged/ http://www.videocopilot.net/tutorials/3d_camera_projection/ http://www.videocopilot.net/tutorials/3d_camera_projection_2/ https://www.youtube.com/watch?v=ldfYFsDUspU https://www.youtube.com/watch?v=oSko7F9vQ6Q https://www.youtube.com/watch?v=3xDI6D5GW_k Do 2D para o 2.5D (com Puppet Pin): https://www.youtube.com/watch?v=GZimVBFSGm0 https://www.youtube.com/watch?v=k1Kerq8XSWQ&t=295s