SlideShare une entreprise Scribd logo
1  sur  12
Télécharger pour lire hors ligne
Modelo simples 

para descrição do
funcionamento de
interfaces
eletrônicas/digitais
"Mix de Interações”
para disciplina de Design de Moda
Interação e Interface
• Interação 

como a relação recíproca de ação humana mediada por artefatos
• Interface 

como aquilo que vemos/sentimos/tocamos/experienciamos

do artefato, quando interagimos



Exemplos de interfaces:
Modelo

Descrição formal
Objeto
(lâmpada com bateria)
Modelo

(Descrição formal)
Lâmpadas e
Interruptor
Descrição formal
das interfaces
e do funcionamento
das interações
Modelo de exemplo
Interface Funcionamento Interface
Vestuário VestuárioParte eletrônica/digital
Modelo de exemplo
Interface

status inicial

(o que a pessoa

vê/sente/toca?)
Funcionamento

(como vai funcionar)
Interface

status final

(o que a pessoa

vê/sente/toca?)
Vestuário VestuárioParte eletrônica/digital
Modelo de exemplo
Interface

status inicial

(o que a pessoa

vê/sente/toca?)
Funcionamento

(como vai funcionar)
Sensor

(Entrada)
Atuador

(Saída)
Lógica

(Programação)
Interface

status final

(o que a pessoa

vê/sente/toca?)
Vestuário VestuárioParte eletrônica/digital
Exemplo: acender luz
Sensor:

On/Off
Atuador

Luz
Lógica:

Quando apertar o
botão, o Celular recebe
informação da
localização (GPS)
Publica localização no
Facebok e acende luz
na manga
Aperta o
botão
pequeno
na manga

interna do
casaco
Acende

o led na
parte
externa
do
casaco
Exemplo: tocar música
Sensor:

Proximidade
Atuador

Som
Quando uma camiseta
com sensor de
proximidade chega
perto de outra com o
mesmo sensor, é
tocado um som
Se

aproxima

de outra

pessoa

que possui

o mesmo

casaco
Toca uma

música
Exemplo: + som = + som
Sensor:

Som
Atuador

Som
Quando o sensor captar
um som, toca um som
de sirene.



Quanto mais alto o som

captado pelo sensor,
mais alto o volume.
Se
aproximar

de um

lugar com 

som/
barulho/

música/voz

ambiente
Toca uma

som de
sirene
Sensores
➡Som / Áudio
➡Imagem / Foto
➡Proximidade / Distância
➡Temperatura
➡Movimento (aceleração)
➡Gás
➡Internet (Dados)
➡Posicionamento (GPS)
➡On/Off (botão liga/desliga)
➡Pressão
➡Potenciômetro (girar)
Atuadores
➡Som
➡Motor
➡Vibração
➡Internet (Dados)
➡Luz / Led (+Cores +
Vários leds)
➡Temperatura (esquenta)
!
➡ OUTROS (tirar foto, ligar
gravador do celular, ativar
GPS, etc etc

Contenu connexe

Plus de Rodrigo Freese Gonzatto

Plus de Rodrigo Freese Gonzatto (20)

Consciência ingênua e crítica em Vieira Pinto e Paulo Freire [atualizado]
Consciência ingênua e crítica em Vieira Pinto e Paulo Freire [atualizado]Consciência ingênua e crítica em Vieira Pinto e Paulo Freire [atualizado]
Consciência ingênua e crítica em Vieira Pinto e Paulo Freire [atualizado]
 
Porque "usuários" prospectam futuros?
Porque "usuários" prospectam futuros?Porque "usuários" prospectam futuros?
Porque "usuários" prospectam futuros?
 
Fluxogramas
FluxogramasFluxogramas
Fluxogramas
 
Usuários e designers: quem é quem no codesign?
Usuários e designers: quem é quem no codesign?Usuários e designers: quem é quem no codesign?
Usuários e designers: quem é quem no codesign?
 
Ler imagens (Gestalt e composição para Design de Interfaces)
Ler imagens (Gestalt e composição para Design de Interfaces)Ler imagens (Gestalt e composição para Design de Interfaces)
Ler imagens (Gestalt e composição para Design de Interfaces)
 
Brainstorming: técnicas e abordagens em grupos
Brainstorming: técnicas e abordagens em gruposBrainstorming: técnicas e abordagens em grupos
Brainstorming: técnicas e abordagens em grupos
 
Guidelines - Design de apps (Apple iOS e Google Material Design) 2019
Guidelines - Design de apps (Apple iOS e Google Material Design) 2019Guidelines - Design de apps (Apple iOS e Google Material Design) 2019
Guidelines - Design de apps (Apple iOS e Google Material Design) 2019
 
Paulo Freire em diálogo com Álvaro Vieira Pinto: a conscientização frente à q...
Paulo Freire em diálogo com Álvaro Vieira Pinto: a conscientização frente à q...Paulo Freire em diálogo com Álvaro Vieira Pinto: a conscientização frente à q...
Paulo Freire em diálogo com Álvaro Vieira Pinto: a conscientização frente à q...
 
Diagrama de afinidades
Diagrama de afinidadesDiagrama de afinidades
Diagrama de afinidades
 
Produzir nossa própria existência: Reflexões para a produção em/sobre Álvaro ...
Produzir nossa própria existência: Reflexões para a produção em/sobre Álvaro ...Produzir nossa própria existência: Reflexões para a produção em/sobre Álvaro ...
Produzir nossa própria existência: Reflexões para a produção em/sobre Álvaro ...
 
Desenvolvimento de coleção de REA sobre o conceito de amanualidade em Design ...
Desenvolvimento de coleção de REA sobre o conceito de amanualidade em Design ...Desenvolvimento de coleção de REA sobre o conceito de amanualidade em Design ...
Desenvolvimento de coleção de REA sobre o conceito de amanualidade em Design ...
 
Usuários e Produção da Existência: contribuições de Álvaro Vieira Pinto e Pau...
Usuários e Produção da Existência: contribuições de Álvaro Vieira Pinto e Pau...Usuários e Produção da Existência: contribuições de Álvaro Vieira Pinto e Pau...
Usuários e Produção da Existência: contribuições de Álvaro Vieira Pinto e Pau...
 
Design de Moda e Design Digital: o corpo como fulcro do projeto
Design de Moda e Design Digital: o corpo como fulcro do projetoDesign de Moda e Design Digital: o corpo como fulcro do projeto
Design de Moda e Design Digital: o corpo como fulcro do projeto
 
Interação, tecnologia e produção da existência em álvaro vieira pinto
Interação, tecnologia e produção da existência em álvaro vieira pintoInteração, tecnologia e produção da existência em álvaro vieira pinto
Interação, tecnologia e produção da existência em álvaro vieira pinto
 
Sobre o conceito de amanualidade em Simone de Beauvoir e Vieira Pinto a parti...
Sobre o conceito de amanualidade em Simone de Beauvoir e Vieira Pinto a parti...Sobre o conceito de amanualidade em Simone de Beauvoir e Vieira Pinto a parti...
Sobre o conceito de amanualidade em Simone de Beauvoir e Vieira Pinto a parti...
 
Projetando interações opressivas e libertárias com o corpo inteiro
Projetando interações opressivas e libertárias com o corpo inteiroProjetando interações opressivas e libertárias com o corpo inteiro
Projetando interações opressivas e libertárias com o corpo inteiro
 
Projetando interações com vídeo
Projetando interações com vídeoProjetando interações com vídeo
Projetando interações com vídeo
 
Conceito de Técnica e Tecnologia [em Álvaro Vieira Pinto]
Conceito de Técnica e Tecnologia [em Álvaro Vieira Pinto]Conceito de Técnica e Tecnologia [em Álvaro Vieira Pinto]
Conceito de Técnica e Tecnologia [em Álvaro Vieira Pinto]
 
Música e Tecnologia
Música e TecnologiaMúsica e Tecnologia
Música e Tecnologia
 
Comida e Tecnologia
Comida e TecnologiaComida e Tecnologia
Comida e Tecnologia
 

Dernier

Assessement Boas Praticas em Kubernetes.pdf
Assessement Boas Praticas em Kubernetes.pdfAssessement Boas Praticas em Kubernetes.pdf
Assessement Boas Praticas em Kubernetes.pdf
Natalia Granato
 

Dernier (6)

Assessement Boas Praticas em Kubernetes.pdf
Assessement Boas Praticas em Kubernetes.pdfAssessement Boas Praticas em Kubernetes.pdf
Assessement Boas Praticas em Kubernetes.pdf
 
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docxATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
ATIVIDADE 1 - GCOM - GESTÃO DA INFORMAÇÃO - 54_2024.docx
 
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docxATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
ATIVIDADE 1 - LOGÍSTICA EMPRESARIAL - 52_2024.docx
 
Boas práticas de programação com Object Calisthenics
Boas práticas de programação com Object CalisthenicsBoas práticas de programação com Object Calisthenics
Boas práticas de programação com Object Calisthenics
 
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docxATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
ATIVIDADE 1 - CUSTOS DE PRODUÇÃO - 52_2024.docx
 
Padrões de Projeto: Proxy e Command com exemplo
Padrões de Projeto: Proxy e Command com exemploPadrões de Projeto: Proxy e Command com exemplo
Padrões de Projeto: Proxy e Command com exemplo
 

Modelo simples para descrição do funcionamento de interfaces eletrônicas/digitais (Design de Moda)

  • 1. Modelo simples 
 para descrição do funcionamento de interfaces eletrônicas/digitais "Mix de Interações” para disciplina de Design de Moda
  • 2. Interação e Interface • Interação 
 como a relação recíproca de ação humana mediada por artefatos • Interface 
 como aquilo que vemos/sentimos/tocamos/experienciamos
 do artefato, quando interagimos
 
 Exemplos de interfaces:
  • 5. Descrição formal das interfaces e do funcionamento das interações
  • 6. Modelo de exemplo Interface Funcionamento Interface Vestuário VestuárioParte eletrônica/digital
  • 7. Modelo de exemplo Interface
 status inicial
 (o que a pessoa
 vê/sente/toca?) Funcionamento
 (como vai funcionar) Interface
 status final
 (o que a pessoa
 vê/sente/toca?) Vestuário VestuárioParte eletrônica/digital
  • 8. Modelo de exemplo Interface
 status inicial
 (o que a pessoa
 vê/sente/toca?) Funcionamento
 (como vai funcionar) Sensor
 (Entrada) Atuador
 (Saída) Lógica
 (Programação) Interface
 status final
 (o que a pessoa
 vê/sente/toca?) Vestuário VestuárioParte eletrônica/digital
  • 9. Exemplo: acender luz Sensor:
 On/Off Atuador
 Luz Lógica:
 Quando apertar o botão, o Celular recebe informação da localização (GPS) Publica localização no Facebok e acende luz na manga Aperta o botão pequeno na manga
 interna do casaco Acende
 o led na parte externa do casaco
  • 10. Exemplo: tocar música Sensor:
 Proximidade Atuador
 Som Quando uma camiseta com sensor de proximidade chega perto de outra com o mesmo sensor, é tocado um som Se
 aproxima
 de outra
 pessoa
 que possui
 o mesmo
 casaco Toca uma
 música
  • 11. Exemplo: + som = + som Sensor:
 Som Atuador
 Som Quando o sensor captar um som, toca um som de sirene.
 
 Quanto mais alto o som
 captado pelo sensor, mais alto o volume. Se aproximar
 de um
 lugar com 
 som/ barulho/
 música/voz
 ambiente Toca uma
 som de sirene
  • 12. Sensores ➡Som / Áudio ➡Imagem / Foto ➡Proximidade / Distância ➡Temperatura ➡Movimento (aceleração) ➡Gás ➡Internet (Dados) ➡Posicionamento (GPS) ➡On/Off (botão liga/desliga) ➡Pressão ➡Potenciômetro (girar) Atuadores ➡Som ➡Motor ➡Vibração ➡Internet (Dados) ➡Luz / Led (+Cores + Vários leds) ➡Temperatura (esquenta) ! ➡ OUTROS (tirar foto, ligar gravador do celular, ativar GPS, etc etc