SlideShare uma empresa Scribd logo
MATERIAIS E PROCESSOS III
ELEMENTOS BÁSICOS DO DESIGN DIGITAL




Professor: Alan Vasconcelos
PROTOTIPAÇÃO EM PAPEL


Exercício em sala
PROTOTIPAÇÃO EM PAPEL




             Prototipação em papel
                              =
               Prototipação rápida
• É um método que permite delinear de forma ágil e barata, a
   interface de um sistema (web, app, game, etc...).
PROTOTIPAÇÃO EM PAPEL




             Prototipação em papel
                              =
               Prototipação rápida
• É um método que permite delinear de forma ágil e barata, a
   interface de um sistema (web, app, game, etc...).

• É bem barato! (gasta-se, basicamente, papel, lápis e tempo)
PROTOTIPAÇÃO EM PAPEL




             Prototipação em papel
                              =
               Prototipação rápida
• É um método que permite delinear de forma ágil e barata, a
   interface de um sistema (web, app, game, etc...).

• É bem barato! (gasta-se, basicamente, papel, lápis e tempo)

• É mais legal! (envolve mais pessoas. Além de engajar a equipe,
   rabiscar é sempre bom!)
PROTOTIPAÇÃO EM PAPEL




              Prototipação em papel
                               =
                Prototipação rápida
• É um método que permite delinear de forma ágil e barata, a
   interface de um sistema (web, app, game, etc...).

• É bem barato! (gasta-se, basicamente, papel, lápis e tempo)

• É mais legal! (envolve mais pessoas. Além de engajar a equipe,
   rabiscar é sempre bom!).

• Não precisa ser bonito! (Aliás, a proposta é ser ágil. O foco é na
   experiência de uso)
PROTOTIPAÇÃO EM PAPEL




  Prototipação é uma disciplina de UX


• UX é a sigla que o mercado adota para User Experience.
   Mais detalhes em (http://uxmag.com/)


• Esse assunto será melhor elucidado em Prática Projetual.

• Portanto, não abordaremos questões ligadas à UX em
   profundidade, ok?
ALGUNS EXEMPLOS


Baixando as expectativas! :p
PROTOTIPAÇÃO EM PAPEL




Prototipação ajuda o design da interface


• Em alguns escritórios, Design de interface e UX são realizados por
   profissionais distintos.
Home
Lista de produtos
Página de conteúdo textual
Home
Lista de produtos
Página de conteúdo textual
?
VALEU!




alandbh@gmail.com
Referências
• UX Magazine

• Apple Computer

• MEMÓRIA, Felipe. Design para Web




•alandbh@gmail.com

Mais conteúdo relacionado

Destaque

Aula _Processos_Fabricação_I_02 rev_19_08_13
Aula _Processos_Fabricação_I_02 rev_19_08_13Aula _Processos_Fabricação_I_02 rev_19_08_13
Aula _Processos_Fabricação_I_02 rev_19_08_13
Universidade de Mogi das Cruzes
 
Aula 3 - Projeto de Produto
Aula 3 - Projeto de ProdutoAula 3 - Projeto de Produto
Aula 3 - Projeto de Produto
Tiago Cruz
 
Aula 7 - Projeto de Produto
Aula 7 - Projeto de ProdutoAula 7 - Projeto de Produto
Aula 7 - Projeto de Produto
Tiago Cruz
 
Aula4 - Design de Produto 2
Aula4 - Design de Produto 2Aula4 - Design de Produto 2
Aula4 - Design de Produto 2
Tiago Cruz
 
Aula 10 - Projeto de Produto
Aula 10 - Projeto de ProdutoAula 10 - Projeto de Produto
Aula 10 - Projeto de Produto
Tiago Cruz
 
Aula 9 - Projeto de Produto
Aula 9 - Projeto de ProdutoAula 9 - Projeto de Produto
Aula 9 - Projeto de Produto
Tiago Cruz
 
Aula 2 - Design de Dieter Rams
Aula 2 - Design de Dieter RamsAula 2 - Design de Dieter Rams
Aula 2 - Design de Dieter Rams
Tiago Cruz
 

Destaque (20)

Aula _Processos_Fabricação_I_02 rev_19_08_13
Aula _Processos_Fabricação_I_02 rev_19_08_13Aula _Processos_Fabricação_I_02 rev_19_08_13
Aula _Processos_Fabricação_I_02 rev_19_08_13
 
Aula 3 - Projeto de Produto
Aula 3 - Projeto de ProdutoAula 3 - Projeto de Produto
Aula 3 - Projeto de Produto
 
Aula3
Aula3Aula3
Aula3
 
Aula 7 - Projeto de Produto
Aula 7 - Projeto de ProdutoAula 7 - Projeto de Produto
Aula 7 - Projeto de Produto
 
Aula5
Aula5Aula5
Aula5
 
Aula6
Aula6Aula6
Aula6
 
Aula8
Aula8Aula8
Aula8
 
Aula7
Aula7Aula7
Aula7
 
Aula4 - Design de Produto 2
Aula4 - Design de Produto 2Aula4 - Design de Produto 2
Aula4 - Design de Produto 2
 
Aula1
Aula1Aula1
Aula1
 
Aula11 2011
Aula11 2011Aula11 2011
Aula11 2011
 
Aula2
Aula2Aula2
Aula2
 
Aula9
Aula9Aula9
Aula9
 
Aula 10 - Projeto de Produto
Aula 10 - Projeto de ProdutoAula 10 - Projeto de Produto
Aula 10 - Projeto de Produto
 
Aula10 2011
Aula10 2011Aula10 2011
Aula10 2011
 
Aula 9 - Projeto de Produto
Aula 9 - Projeto de ProdutoAula 9 - Projeto de Produto
Aula 9 - Projeto de Produto
 
Aula13
Aula13Aula13
Aula13
 
Aula 2 - Design de Dieter Rams
Aula 2 - Design de Dieter RamsAula 2 - Design de Dieter Rams
Aula 2 - Design de Dieter Rams
 
Aula3
Aula3Aula3
Aula3
 
Aula4
Aula4Aula4
Aula4
 

Semelhante a Aula 04 - Prototipação

Prototipação
PrototipaçãoPrototipação
Prototipação
Koji Pereira
 
Prototipação de software
Prototipação de softwarePrototipação de software
Prototipação de software
Marcio Costa
 
Processo de Desenvolvimento de Software - Prototipação
Processo de Desenvolvimento de Software - PrototipaçãoProcesso de Desenvolvimento de Software - Prototipação
Processo de Desenvolvimento de Software - Prototipação
Natanael Simões
 
Prototipagem em Papel - Oficina
Prototipagem em Papel - OficinaPrototipagem em Papel - Oficina
Prototipagem em Papel - Oficina
Ltia Unesp
 
Prototipagem Em Papel
Prototipagem Em PapelPrototipagem Em Papel
Prototipagem Em Papel
elliando dias
 
Desenvolvimento de Software: Navegando em Águas Misteriosas
Desenvolvimento de Software: Navegando em Águas MisteriosasDesenvolvimento de Software: Navegando em Águas Misteriosas
Desenvolvimento de Software: Navegando em Águas MisteriosasNícolas Iensen
 
Aula8. Projeto de Interface com o usuário
Aula8. Projeto de Interface com o usuárioAula8. Projeto de Interface com o usuário
Aula8. Projeto de Interface com o usuárioSilvia Dotta
 
Retorno do Investimento em Usabilidade
Retorno do Investimento em UsabilidadeRetorno do Investimento em Usabilidade
Retorno do Investimento em UsabilidadeBernardo Mattos
 
Técnica de prototipação - Aula 2
Técnica de prototipação - Aula 2Técnica de prototipação - Aula 2
Técnica de prototipação - Aula 2
Guilherme Torres
 
O retorno do investimento no projeto adequado de interfaces de usuário
O retorno do investimento no projeto adequado de interfaces de usuárioO retorno do investimento no projeto adequado de interfaces de usuário
O retorno do investimento no projeto adequado de interfaces de usuário
Synergia - Engenharia de Software e Sistemas
 
C poli c definitivo
C poli c definitivoC poli c definitivo
C poli c definitivo
hugovdbarreto
 
Conteudo informatica2013 sirlei
Conteudo informatica2013 sirleiConteudo informatica2013 sirlei
Conteudo informatica2013 sirleiSirlei13
 
Aula 2 - Técnicas de Prototipação I
Aula 2 - Técnicas de Prototipação IAula 2 - Técnicas de Prototipação I
Aula 2 - Técnicas de Prototipação IPaolo Passeri
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front end
andreluizlc
 
Como não ferrar com a user experience - Campus Party 2012
Como não ferrar com a user experience - Campus Party 2012 Como não ferrar com a user experience - Campus Party 2012
Como não ferrar com a user experience - Campus Party 2012
Juliana Gaiba
 
Introducao ihm
Introducao ihmIntroducao ihm
Introducao ihm
Marcos Oliveira
 
ads pra os nigers.pptx
ads pra os nigers.pptxads pra os nigers.pptx
ads pra os nigers.pptx
AmorimRazo
 
Aula 5 - Tecnicas de Prototipação I
Aula 5 - Tecnicas de Prototipação IAula 5 - Tecnicas de Prototipação I
Aula 5 - Tecnicas de Prototipação I
Paolo Passeri
 
Interação Humano Computador Capítulo 8 - Antecipação
Interação Humano Computador Capítulo 8 - AntecipaçãoInteração Humano Computador Capítulo 8 - Antecipação
Interação Humano Computador Capítulo 8 - Antecipação
Wellington Oliveira
 
Usabilidade Simples
Usabilidade SimplesUsabilidade Simples
Usabilidade Simples
Jonathas Scott
 

Semelhante a Aula 04 - Prototipação (20)

Prototipação
PrototipaçãoPrototipação
Prototipação
 
Prototipação de software
Prototipação de softwarePrototipação de software
Prototipação de software
 
Processo de Desenvolvimento de Software - Prototipação
Processo de Desenvolvimento de Software - PrototipaçãoProcesso de Desenvolvimento de Software - Prototipação
Processo de Desenvolvimento de Software - Prototipação
 
Prototipagem em Papel - Oficina
Prototipagem em Papel - OficinaPrototipagem em Papel - Oficina
Prototipagem em Papel - Oficina
 
Prototipagem Em Papel
Prototipagem Em PapelPrototipagem Em Papel
Prototipagem Em Papel
 
Desenvolvimento de Software: Navegando em Águas Misteriosas
Desenvolvimento de Software: Navegando em Águas MisteriosasDesenvolvimento de Software: Navegando em Águas Misteriosas
Desenvolvimento de Software: Navegando em Águas Misteriosas
 
Aula8. Projeto de Interface com o usuário
Aula8. Projeto de Interface com o usuárioAula8. Projeto de Interface com o usuário
Aula8. Projeto de Interface com o usuário
 
Retorno do Investimento em Usabilidade
Retorno do Investimento em UsabilidadeRetorno do Investimento em Usabilidade
Retorno do Investimento em Usabilidade
 
Técnica de prototipação - Aula 2
Técnica de prototipação - Aula 2Técnica de prototipação - Aula 2
Técnica de prototipação - Aula 2
 
O retorno do investimento no projeto adequado de interfaces de usuário
O retorno do investimento no projeto adequado de interfaces de usuárioO retorno do investimento no projeto adequado de interfaces de usuário
O retorno do investimento no projeto adequado de interfaces de usuário
 
C poli c definitivo
C poli c definitivoC poli c definitivo
C poli c definitivo
 
Conteudo informatica2013 sirlei
Conteudo informatica2013 sirleiConteudo informatica2013 sirlei
Conteudo informatica2013 sirlei
 
Aula 2 - Técnicas de Prototipação I
Aula 2 - Técnicas de Prototipação IAula 2 - Técnicas de Prototipação I
Aula 2 - Técnicas de Prototipação I
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front end
 
Como não ferrar com a user experience - Campus Party 2012
Como não ferrar com a user experience - Campus Party 2012 Como não ferrar com a user experience - Campus Party 2012
Como não ferrar com a user experience - Campus Party 2012
 
Introducao ihm
Introducao ihmIntroducao ihm
Introducao ihm
 
ads pra os nigers.pptx
ads pra os nigers.pptxads pra os nigers.pptx
ads pra os nigers.pptx
 
Aula 5 - Tecnicas de Prototipação I
Aula 5 - Tecnicas de Prototipação IAula 5 - Tecnicas de Prototipação I
Aula 5 - Tecnicas de Prototipação I
 
Interação Humano Computador Capítulo 8 - Antecipação
Interação Humano Computador Capítulo 8 - AntecipaçãoInteração Humano Computador Capítulo 8 - Antecipação
Interação Humano Computador Capítulo 8 - Antecipação
 
Usabilidade Simples
Usabilidade SimplesUsabilidade Simples
Usabilidade Simples
 

Mais de Alan Vasconcelos

Design Universal - Os 7 Principios
Design Universal - Os 7 PrincipiosDesign Universal - Os 7 Principios
Design Universal - Os 7 Principios
Alan Vasconcelos
 
Design Universal e arquitetura hostil
Design Universal e arquitetura hostilDesign Universal e arquitetura hostil
Design Universal e arquitetura hostil
Alan Vasconcelos
 
Cibercultura
CiberculturaCibercultura
Cibercultura
Alan Vasconcelos
 
MPP-III - Aula 08 - Usabilidade
MPP-III - Aula 08 - UsabilidadeMPP-III - Aula 08 - Usabilidade
MPP-III - Aula 08 - UsabilidadeAlan Vasconcelos
 
Ergo2 aula-14 Avaliação Heurística
Ergo2 aula-14 Avaliação HeurísticaErgo2 aula-14 Avaliação Heurística
Ergo2 aula-14 Avaliação Heurística
Alan Vasconcelos
 
Mta1 aula-06 - Design Universal
Mta1 aula-06 - Design UniversalMta1 aula-06 - Design Universal
Mta1 aula-06 - Design UniversalAlan Vasconcelos
 
Mta1 aula-05 Avaliação Heurística
Mta1 aula-05 Avaliação HeurísticaMta1 aula-05 Avaliação Heurística
Mta1 aula-05 Avaliação HeurísticaAlan Vasconcelos
 
Mta1 aula-04 Framework DECIDE
Mta1 aula-04 Framework DECIDEMta1 aula-04 Framework DECIDE
Mta1 aula-04 Framework DECIDEAlan Vasconcelos
 
MTA1 Aula-02. Acessibilidade
MTA1 Aula-02. AcessibilidadeMTA1 Aula-02. Acessibilidade
MTA1 Aula-02. AcessibilidadeAlan Vasconcelos
 
MTA1 Aula-01. Introdução
MTA1 Aula-01. IntroduçãoMTA1 Aula-01. Introdução
MTA1 Aula-01. IntroduçãoAlan Vasconcelos
 
Usabilidade Aula-06. Processos: User Stories
Usabilidade Aula-06. Processos: User StoriesUsabilidade Aula-06. Processos: User Stories
Usabilidade Aula-06. Processos: User StoriesAlan Vasconcelos
 
Usabilidade Aula-05. Processos: heuristicas
Usabilidade Aula-05. Processos: heuristicasUsabilidade Aula-05. Processos: heuristicas
Usabilidade Aula-05. Processos: heuristicas
Alan Vasconcelos
 
Usabilidade aula-04. Processos: Personas
Usabilidade aula-04. Processos: PersonasUsabilidade aula-04. Processos: Personas
Usabilidade aula-04. Processos: PersonasAlan Vasconcelos
 
Usabilidade aula-03. Processos: Arquitetura de informação
Usabilidade aula-03. Processos: Arquitetura de informaçãoUsabilidade aula-03. Processos: Arquitetura de informação
Usabilidade aula-03. Processos: Arquitetura de informaçãoAlan Vasconcelos
 
Usabilidade aula-02. Metas e princípios
Usabilidade aula-02. Metas e princípiosUsabilidade aula-02. Metas e princípios
Usabilidade aula-02. Metas e princípiosAlan Vasconcelos
 
Usabilidade aula-01 Introdução
Usabilidade aula-01 IntroduçãoUsabilidade aula-01 Introdução
Usabilidade aula-01 Introdução
Alan Vasconcelos
 
Aula 03 - elementos-basicos
Aula 03 - elementos-basicosAula 03 - elementos-basicos
Aula 03 - elementos-basicosAlan Vasconcelos
 

Mais de Alan Vasconcelos (20)

Design Universal - Os 7 Principios
Design Universal - Os 7 PrincipiosDesign Universal - Os 7 Principios
Design Universal - Os 7 Principios
 
Design Universal e arquitetura hostil
Design Universal e arquitetura hostilDesign Universal e arquitetura hostil
Design Universal e arquitetura hostil
 
Cibercultura
CiberculturaCibercultura
Cibercultura
 
MPP-III - Aula 08 - Usabilidade
MPP-III - Aula 08 - UsabilidadeMPP-III - Aula 08 - Usabilidade
MPP-III - Aula 08 - Usabilidade
 
Ergo2 aula-14 Avaliação Heurística
Ergo2 aula-14 Avaliação HeurísticaErgo2 aula-14 Avaliação Heurística
Ergo2 aula-14 Avaliação Heurística
 
Mta1 aula-06 - Design Universal
Mta1 aula-06 - Design UniversalMta1 aula-06 - Design Universal
Mta1 aula-06 - Design Universal
 
Mta1 aula-05 Avaliação Heurística
Mta1 aula-05 Avaliação HeurísticaMta1 aula-05 Avaliação Heurística
Mta1 aula-05 Avaliação Heurística
 
Mta1 aula-04 Framework DECIDE
Mta1 aula-04 Framework DECIDEMta1 aula-04 Framework DECIDE
Mta1 aula-04 Framework DECIDE
 
MTA1 Aula-02. Acessibilidade
MTA1 Aula-02. AcessibilidadeMTA1 Aula-02. Acessibilidade
MTA1 Aula-02. Acessibilidade
 
MTA1 Aula-01. Introdução
MTA1 Aula-01. IntroduçãoMTA1 Aula-01. Introdução
MTA1 Aula-01. Introdução
 
Usabilidade Aula-06. Processos: User Stories
Usabilidade Aula-06. Processos: User StoriesUsabilidade Aula-06. Processos: User Stories
Usabilidade Aula-06. Processos: User Stories
 
Usabilidade Aula-05. Processos: heuristicas
Usabilidade Aula-05. Processos: heuristicasUsabilidade Aula-05. Processos: heuristicas
Usabilidade Aula-05. Processos: heuristicas
 
Usabilidade aula-04. Processos: Personas
Usabilidade aula-04. Processos: PersonasUsabilidade aula-04. Processos: Personas
Usabilidade aula-04. Processos: Personas
 
Usabilidade aula-03. Processos: Arquitetura de informação
Usabilidade aula-03. Processos: Arquitetura de informaçãoUsabilidade aula-03. Processos: Arquitetura de informação
Usabilidade aula-03. Processos: Arquitetura de informação
 
Usabilidade aula-02. Metas e princípios
Usabilidade aula-02. Metas e princípiosUsabilidade aula-02. Metas e princípios
Usabilidade aula-02. Metas e princípios
 
Usabilidade aula-01 Introdução
Usabilidade aula-01 IntroduçãoUsabilidade aula-01 Introdução
Usabilidade aula-01 Introdução
 
Aula 10--revisao
Aula 10--revisaoAula 10--revisao
Aula 10--revisao
 
Aula 07 - Web
Aula 07 - WebAula 07 - Web
Aula 07 - Web
 
Aula 06 - variabilidade
Aula 06 - variabilidadeAula 06 - variabilidade
Aula 06 - variabilidade
 
Aula 03 - elementos-basicos
Aula 03 - elementos-basicosAula 03 - elementos-basicos
Aula 03 - elementos-basicos
 

Aula 04 - Prototipação

  • 1. MATERIAIS E PROCESSOS III ELEMENTOS BÁSICOS DO DESIGN DIGITAL Professor: Alan Vasconcelos
  • 3. PROTOTIPAÇÃO EM PAPEL Prototipação em papel = Prototipação rápida • É um método que permite delinear de forma ágil e barata, a interface de um sistema (web, app, game, etc...).
  • 4. PROTOTIPAÇÃO EM PAPEL Prototipação em papel = Prototipação rápida • É um método que permite delinear de forma ágil e barata, a interface de um sistema (web, app, game, etc...). • É bem barato! (gasta-se, basicamente, papel, lápis e tempo)
  • 5. PROTOTIPAÇÃO EM PAPEL Prototipação em papel = Prototipação rápida • É um método que permite delinear de forma ágil e barata, a interface de um sistema (web, app, game, etc...). • É bem barato! (gasta-se, basicamente, papel, lápis e tempo) • É mais legal! (envolve mais pessoas. Além de engajar a equipe, rabiscar é sempre bom!)
  • 6. PROTOTIPAÇÃO EM PAPEL Prototipação em papel = Prototipação rápida • É um método que permite delinear de forma ágil e barata, a interface de um sistema (web, app, game, etc...). • É bem barato! (gasta-se, basicamente, papel, lápis e tempo) • É mais legal! (envolve mais pessoas. Além de engajar a equipe, rabiscar é sempre bom!). • Não precisa ser bonito! (Aliás, a proposta é ser ágil. O foco é na experiência de uso)
  • 7. PROTOTIPAÇÃO EM PAPEL Prototipação é uma disciplina de UX • UX é a sigla que o mercado adota para User Experience. Mais detalhes em (http://uxmag.com/) • Esse assunto será melhor elucidado em Prática Projetual. • Portanto, não abordaremos questões ligadas à UX em profundidade, ok?
  • 8. ALGUNS EXEMPLOS Baixando as expectativas! :p
  • 9.
  • 10.
  • 11.
  • 12.
  • 13. PROTOTIPAÇÃO EM PAPEL Prototipação ajuda o design da interface • Em alguns escritórios, Design de interface e UX são realizados por profissionais distintos.
  • 14. Home
  • 17.
  • 18. Home
  • 19.
  • 21.
  • 23. ?
  • 25. Referências • UX Magazine • Apple Computer • MEMÓRIA, Felipe. Design para Web •alandbh@gmail.com