SlideShare uma empresa Scribd logo
1 de 23
Baixar para ler offline
Design de Interfaces Gráficas
       Prof. Msc. Eduardo Novais
       Curso de Sistemas e Mídias Digitais - UFC




quinta-feira, 8 de março de 2012
O que é Interface Gráfica?




quinta-feira, 8 de março de 2012
A ferramenta desempenha
       um papel essencial na
       evolução dos signos e dos
       símbolos gráficos criados pelo
       homem.

       Pedras manipuladas pelo
       homem, encontradas perto do
       lago Turkana (Quênia)



quinta-feira, 8 de março de 2012
Quando utilizamos uma
         ferramenta existe
         sempre um espaço para
         que entremos em contato
         com ela. A mesma coisa
         acontece em um projeto
         de design.




quinta-feira, 8 de março de 2012
“Em qualquer tipo de comunicação entre um
       homem e uma máquina está implícito o conceito
       da interface”
                                            (Joyo, 2008, p. 49)




quinta-feira, 8 de março de 2012
Alan Kay desenvolveu a
       ideia de representar a
       mesa de trabalho para
       interagir com o usuário.
       Nascia aí, a metáfora de
       Desktop.




       GUI e a Metáfora do Desktop
       (Alan Kay, 1973)

quinta-feira, 8 de março de 2012
Xerox Alto
                                   (Xerox , 1973)


quinta-feira, 8 de março de 2012
A interface do Xerox
           Alto apresentava
           altíssimo custo e não
           chegou a ser
           comercializada.

                                   Xerox Alto
                                   (Xerox , 1973)


quinta-feira, 8 de março de 2012
Ainda hoje trabalhamos com um ambiente gráfico
       baseado no Desktop e em WIMP.




quinta-feira, 8 de março de 2012
Apple Lisa OS
                                       (Apple, 1983)


quinta-feira, 8 de março de 2012
MacOS X Snow Leopard
                                               (Apple, 2010)


quinta-feira, 8 de março de 2012
Paramos no tempo?




quinta-feira, 8 de março de 2012
Profissão do Designer:
          Olhar adiante e enxergar
          o futuro.




quinta-feira, 8 de março de 2012
E como será o futuro?




quinta-feira, 8 de março de 2012
quinta-feira, 8 de março de 2012
Windows Live Messenger (IOS)
       (Microsoft, 2011)

quinta-feira, 8 de março de 2012
Apple Siri (IOS)
       (Apple, 2011)

quinta-feira, 8 de março de 2012
“O futuro é
   exatamente igual ao
   presente, tirado dele
   coisas que não fazem
   sentido”




       Luli Radfahrer, 2008

quinta-feira, 8 de março de 2012
O que esperar do futuro imediato?




quinta-feira, 8 de março de 2012
Mac OSX Mountain Lion
                                                (Apple, 2012)


quinta-feira, 8 de março de 2012
Família Galaxy da Samsung e a divergência de dispositivos.

quinta-feira, 8 de março de 2012
Obrigado!




quinta-feira, 8 de março de 2012
Design de Interfaces Gráficas
       Prof. Msc. Eduardo Novais
       eduardonovais@virtual.ufc.br




quinta-feira, 8 de março de 2012

Mais conteúdo relacionado

Destaque

Slides ProporçãO áUrea
Slides ProporçãO áUreaSlides ProporçãO áUrea
Slides ProporçãO áUrearednhut
 
Totvs guia template_v8_azul
Totvs guia template_v8_azulTotvs guia template_v8_azul
Totvs guia template_v8_azulArmando Souza
 
Desafios do Profissional de Comunicação Visual
Desafios do Profissional de Comunicação VisualDesafios do Profissional de Comunicação Visual
Desafios do Profissional de Comunicação VisualAlessandro Dias
 
Logos e Simbolos
Logos e SimbolosLogos e Simbolos
Logos e SimbolosRenato Melo
 
Leonardo da Vinci & Proporção Áurea
Leonardo da Vinci & Proporção ÁureaLeonardo da Vinci & Proporção Áurea
Leonardo da Vinci & Proporção Áureapedrotecmid
 
Raizes do design editorial
Raizes do design editorialRaizes do design editorial
Raizes do design editorialHelena Jacob
 
O Numero De Ouro
O Numero De OuroO Numero De Ouro
O Numero De Ourofragoso7
 
Composição e Diagramação
Composição e DiagramaçãoComposição e Diagramação
Composição e DiagramaçãoEd Marcos
 
Princípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não DesignersPrincípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não DesignersLeonardo Pereira
 
Elementos da linguagem visual.
Elementos da linguagem visual.Elementos da linguagem visual.
Elementos da linguagem visual.Renata_Vasconcelos
 

Destaque (20)

Construcao de Sites
Construcao de SitesConstrucao de Sites
Construcao de Sites
 
Le a02-mancha grafica
Le a02-mancha graficaLe a02-mancha grafica
Le a02-mancha grafica
 
Design
DesignDesign
Design
 
Slides ProporçãO áUrea
Slides ProporçãO áUreaSlides ProporçãO áUrea
Slides ProporçãO áUrea
 
Totvs guia template_v8_azul
Totvs guia template_v8_azulTotvs guia template_v8_azul
Totvs guia template_v8_azul
 
Web Design Responsivo
Web Design ResponsivoWeb Design Responsivo
Web Design Responsivo
 
Desafios do Profissional de Comunicação Visual
Desafios do Profissional de Comunicação VisualDesafios do Profissional de Comunicação Visual
Desafios do Profissional de Comunicação Visual
 
Logos e Simbolos
Logos e SimbolosLogos e Simbolos
Logos e Simbolos
 
O Layout
O LayoutO Layout
O Layout
 
Leonardo da Vinci & Proporção Áurea
Leonardo da Vinci & Proporção ÁureaLeonardo da Vinci & Proporção Áurea
Leonardo da Vinci & Proporção Áurea
 
Raizes do design editorial
Raizes do design editorialRaizes do design editorial
Raizes do design editorial
 
O Numero De Ouro
O Numero De OuroO Numero De Ouro
O Numero De Ouro
 
Proporção Áurea
Proporção ÁureaProporção Áurea
Proporção Áurea
 
A geometria sagrada
A geometria sagradaA geometria sagrada
A geometria sagrada
 
Grid
GridGrid
Grid
 
Composição gráfica
Composição gráficaComposição gráfica
Composição gráfica
 
Composição e Diagramação
Composição e DiagramaçãoComposição e Diagramação
Composição e Diagramação
 
Projeto de WEB Site
Projeto de WEB SiteProjeto de WEB Site
Projeto de WEB Site
 
Princípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não DesignersPrincípios clássicos de composição visual e Gráfica para não Designers
Princípios clássicos de composição visual e Gráfica para não Designers
 
Elementos da linguagem visual.
Elementos da linguagem visual.Elementos da linguagem visual.
Elementos da linguagem visual.
 

Mais de Eduardo Novais

[DIG2012] Criando um grid
[DIG2012] Criando um grid[DIG2012] Criando um grid
[DIG2012] Criando um gridEduardo Novais
 
[HAD2012] 13 - construtivismo
[HAD2012] 13 - construtivismo[HAD2012] 13 - construtivismo
[HAD2012] 13 - construtivismoEduardo Novais
 
[dig2012] 11 - interfaces online
[dig2012] 11 - interfaces online[dig2012] 11 - interfaces online
[dig2012] 11 - interfaces onlineEduardo Novais
 
[dig2012] 12 - Interfaces mobile
[dig2012] 12 - Interfaces mobile[dig2012] 12 - Interfaces mobile
[dig2012] 12 - Interfaces mobileEduardo Novais
 
[HAD2012] 11 - Dadaismo
[HAD2012] 11 - Dadaismo[HAD2012] 11 - Dadaismo
[HAD2012] 11 - DadaismoEduardo Novais
 
[HA2012] 03 - Raízes da arte e do design - 02
[HA2012] 03 - Raízes da arte e do design - 02[HA2012] 03 - Raízes da arte e do design - 02
[HA2012] 03 - Raízes da arte e do design - 02Eduardo Novais
 
[HA2012] 02 - Raízes da arte e do design - 01
[HA2012] 02 - Raízes da arte e do design - 01[HA2012] 02 - Raízes da arte e do design - 01
[HA2012] 02 - Raízes da arte e do design - 01Eduardo Novais
 
[ha2012] 01 - Apresentação da disciplina
[ha2012] 01 - Apresentação da disciplina[ha2012] 01 - Apresentação da disciplina
[ha2012] 01 - Apresentação da disciplinaEduardo Novais
 
[dig2012] 02 - História do design de interfaces
[dig2012] 02 - História do design de interfaces[dig2012] 02 - História do design de interfaces
[dig2012] 02 - História do design de interfacesEduardo Novais
 
[dig2012] 04 - Hierarquia visual
[dig2012] 04 - Hierarquia visual[dig2012] 04 - Hierarquia visual
[dig2012] 04 - Hierarquia visualEduardo Novais
 
[dig2012] All type e tipografia na web
[dig2012] All type e tipografia na web[dig2012] All type e tipografia na web
[dig2012] All type e tipografia na webEduardo Novais
 
[DIG2012_1] Apresentação da disciplina
[DIG2012_1] Apresentação da disciplina[DIG2012_1] Apresentação da disciplina
[DIG2012_1] Apresentação da disciplinaEduardo Novais
 
[cv - 2011.2] 17 - cores
[cv - 2011.2] 17 - cores[cv - 2011.2] 17 - cores
[cv - 2011.2] 17 - coresEduardo Novais
 
[cv - 2011.2] Orientações - trabalho final de Com Visual
[cv - 2011.2] Orientações - trabalho final de Com Visual[cv - 2011.2] Orientações - trabalho final de Com Visual
[cv - 2011.2] Orientações - trabalho final de Com VisualEduardo Novais
 
[cv - 2011.2] 16 - dicas finais sobre grids
[cv - 2011.2] 16 - dicas finais sobre grids[cv - 2011.2] 16 - dicas finais sobre grids
[cv - 2011.2] 16 - dicas finais sobre gridsEduardo Novais
 
[cv - 2011.2] 14 - grids
[cv - 2011.2] 14 - grids[cv - 2011.2] 14 - grids
[cv - 2011.2] 14 - gridsEduardo Novais
 
[cv - 2011.2] 10 - Plano negativo
[cv - 2011.2] 10 - Plano negativo[cv - 2011.2] 10 - Plano negativo
[cv - 2011.2] 10 - Plano negativoEduardo Novais
 

Mais de Eduardo Novais (20)

16 - design de marcas
16 - design de marcas16 - design de marcas
16 - design de marcas
 
15 - escolha de tipos
15 - escolha de tipos15 - escolha de tipos
15 - escolha de tipos
 
[DIG2012] Criando um grid
[DIG2012] Criando um grid[DIG2012] Criando um grid
[DIG2012] Criando um grid
 
[HAD2012] 13 - construtivismo
[HAD2012] 13 - construtivismo[HAD2012] 13 - construtivismo
[HAD2012] 13 - construtivismo
 
[dig2012] 11 - interfaces online
[dig2012] 11 - interfaces online[dig2012] 11 - interfaces online
[dig2012] 11 - interfaces online
 
[dig2012] 12 - Interfaces mobile
[dig2012] 12 - Interfaces mobile[dig2012] 12 - Interfaces mobile
[dig2012] 12 - Interfaces mobile
 
[HAD2012] 11 - Dadaismo
[HAD2012] 11 - Dadaismo[HAD2012] 11 - Dadaismo
[HAD2012] 11 - Dadaismo
 
[HA2012] 06 - Cubismo
[HA2012] 06 - Cubismo[HA2012] 06 - Cubismo
[HA2012] 06 - Cubismo
 
[HA2012] 03 - Raízes da arte e do design - 02
[HA2012] 03 - Raízes da arte e do design - 02[HA2012] 03 - Raízes da arte e do design - 02
[HA2012] 03 - Raízes da arte e do design - 02
 
[HA2012] 02 - Raízes da arte e do design - 01
[HA2012] 02 - Raízes da arte e do design - 01[HA2012] 02 - Raízes da arte e do design - 01
[HA2012] 02 - Raízes da arte e do design - 01
 
[ha2012] 01 - Apresentação da disciplina
[ha2012] 01 - Apresentação da disciplina[ha2012] 01 - Apresentação da disciplina
[ha2012] 01 - Apresentação da disciplina
 
[dig2012] 02 - História do design de interfaces
[dig2012] 02 - História do design de interfaces[dig2012] 02 - História do design de interfaces
[dig2012] 02 - História do design de interfaces
 
[dig2012] 04 - Hierarquia visual
[dig2012] 04 - Hierarquia visual[dig2012] 04 - Hierarquia visual
[dig2012] 04 - Hierarquia visual
 
[dig2012] All type e tipografia na web
[dig2012] All type e tipografia na web[dig2012] All type e tipografia na web
[dig2012] All type e tipografia na web
 
[DIG2012_1] Apresentação da disciplina
[DIG2012_1] Apresentação da disciplina[DIG2012_1] Apresentação da disciplina
[DIG2012_1] Apresentação da disciplina
 
[cv - 2011.2] 17 - cores
[cv - 2011.2] 17 - cores[cv - 2011.2] 17 - cores
[cv - 2011.2] 17 - cores
 
[cv - 2011.2] Orientações - trabalho final de Com Visual
[cv - 2011.2] Orientações - trabalho final de Com Visual[cv - 2011.2] Orientações - trabalho final de Com Visual
[cv - 2011.2] Orientações - trabalho final de Com Visual
 
[cv - 2011.2] 16 - dicas finais sobre grids
[cv - 2011.2] 16 - dicas finais sobre grids[cv - 2011.2] 16 - dicas finais sobre grids
[cv - 2011.2] 16 - dicas finais sobre grids
 
[cv - 2011.2] 14 - grids
[cv - 2011.2] 14 - grids[cv - 2011.2] 14 - grids
[cv - 2011.2] 14 - grids
 
[cv - 2011.2] 10 - Plano negativo
[cv - 2011.2] 10 - Plano negativo[cv - 2011.2] 10 - Plano negativo
[cv - 2011.2] 10 - Plano negativo
 

[dig20121] 01 - um olhar sobre design de interfaces

  • 1. Design de Interfaces Gráficas Prof. Msc. Eduardo Novais Curso de Sistemas e Mídias Digitais - UFC quinta-feira, 8 de março de 2012
  • 2. O que é Interface Gráfica? quinta-feira, 8 de março de 2012
  • 3. A ferramenta desempenha um papel essencial na evolução dos signos e dos símbolos gráficos criados pelo homem. Pedras manipuladas pelo homem, encontradas perto do lago Turkana (Quênia) quinta-feira, 8 de março de 2012
  • 4. Quando utilizamos uma ferramenta existe sempre um espaço para que entremos em contato com ela. A mesma coisa acontece em um projeto de design. quinta-feira, 8 de março de 2012
  • 5. “Em qualquer tipo de comunicação entre um homem e uma máquina está implícito o conceito da interface” (Joyo, 2008, p. 49) quinta-feira, 8 de março de 2012
  • 6. Alan Kay desenvolveu a ideia de representar a mesa de trabalho para interagir com o usuário. Nascia aí, a metáfora de Desktop. GUI e a Metáfora do Desktop (Alan Kay, 1973) quinta-feira, 8 de março de 2012
  • 7. Xerox Alto (Xerox , 1973) quinta-feira, 8 de março de 2012
  • 8. A interface do Xerox Alto apresentava altíssimo custo e não chegou a ser comercializada. Xerox Alto (Xerox , 1973) quinta-feira, 8 de março de 2012
  • 9. Ainda hoje trabalhamos com um ambiente gráfico baseado no Desktop e em WIMP. quinta-feira, 8 de março de 2012
  • 10. Apple Lisa OS (Apple, 1983) quinta-feira, 8 de março de 2012
  • 11. MacOS X Snow Leopard (Apple, 2010) quinta-feira, 8 de março de 2012
  • 12. Paramos no tempo? quinta-feira, 8 de março de 2012
  • 13. Profissão do Designer: Olhar adiante e enxergar o futuro. quinta-feira, 8 de março de 2012
  • 14. E como será o futuro? quinta-feira, 8 de março de 2012
  • 15. quinta-feira, 8 de março de 2012
  • 16. Windows Live Messenger (IOS) (Microsoft, 2011) quinta-feira, 8 de março de 2012
  • 17. Apple Siri (IOS) (Apple, 2011) quinta-feira, 8 de março de 2012
  • 18. “O futuro é exatamente igual ao presente, tirado dele coisas que não fazem sentido” Luli Radfahrer, 2008 quinta-feira, 8 de março de 2012
  • 19. O que esperar do futuro imediato? quinta-feira, 8 de março de 2012
  • 20. Mac OSX Mountain Lion (Apple, 2012) quinta-feira, 8 de março de 2012
  • 21. Família Galaxy da Samsung e a divergência de dispositivos. quinta-feira, 8 de março de 2012
  • 23. Design de Interfaces Gráficas Prof. Msc. Eduardo Novais eduardonovais@virtual.ufc.br quinta-feira, 8 de março de 2012