SlideShare uma empresa Scribd logo
Mouse+Teclado x Toque+Caneta
as modalidades de interação em
contextos educacionais
Prof. Dr. André Constantino da Silva
• Minha história
• Modalidade
– Teclado
– Mouse
– Caneta
– Toque
• Multimodalidade
• Projetos de Pesquisa em Andamento
– Editor Multimodal
Agenda
• Ingresso no NIED em 2005
– Projeto TIDIA-Ae
– Aluno especial IC/UNICAMP, primeiramente
na disciplina de projeto de interfaces de usuário
• Caderno Interativo de Lógica (Néris et al, 2006)
• Uso para apoiar as atividades de aprendizagem (da
Silva; da Rocha, 2011)
– Acompanhamento dos estudos do grupo
• Uso de palmtop e desenvolvimento de sistemas
Interativos
– Multiplataforma
Minha História
• Participação no projeto de investigação do uso de
Tablet PCs na Educação Superior
– Rodolfo J. Azevedo (coordenador), Heloísa V. da Rocha,
André C. da Silva, Ricardo E. Caceffo e Pedro Almeida
– Laboratório com 20 Tablet PCs com suporte interação a
caneta e a multitoque
– Impressionado: muitos alunos preferiram não usar o
dispositivo
Minha História
• Popularização dos dispositivos móveis e investigações
sobre m-Learning
– Equipados com tela
Multitoque
- Equipados com tela multitoque e a caneta
Minha História
Minha História
Multiplataforma e multidispositivos
• “Como dar conta da rápida evolução tecnológica? Como
garantir que os design ofereçam uma boa IHC ao mesmo
tempo que exploram o potencial e funcionalidade da
nova tecnologia?” (Preece et al., 1994)
• “As novas tecnologias da informática incluiriam displays
do tamanho de uma parede, aplicados para palmtops,
minis sensores médicos parecidos com joias e
computadores sensíveis ao tato que mudam
experiências sensoriais e formas de pensar.”
(Shneiderman, 2006, p. 21)
Motivação
• O modo como uma entrada do usuário ou uma saída do
sistema são expressas
• O modo de comunicação se refere ao canal usado por
duas entidades diferentes que interagem (Alty e
McCartney, 1991)
• “um método de interação que um agente pode usar
para alcançar uma meta ressaltando que uma
modalidade pode ser especificada em termos gerais
como ‘usando fala’ ou em termos mais específicos como
‘usando microfone’” (Nigay e Coutaz, 1995).
Modalidade de Interação
• Periférico de entrada utilizado para a entrada manual de
dados e comandos
• Formado por um arranjo de teclas representando letras,
números, símbolos e outras funções
Teclado
• Utilizado como dispositivo para movimentar o ponteiro
em interfaces WIMP
• quatro tipos de operações: movimento, clique, duplo
clique e "arrastar e largar“
Mouse
• Dois dos principais dispositivos de entrada de dados no
computador desktop
• “O mouse e a interface GUI foram umas das principais
razões para a grande penetração dos computadores na
sociedade.” (Teiche et al., 2009)
Teclado + Mouse
• Periférico semelhante à caneta,
chamado de stylus
– Pen-based computing
• As interfaces de usuário para computação baseada em
caneta podem ser implementadas de vários modos,
destacam-se:
(i) periférico de apontamento: as ações da caneta são
mapeadas para ações das interfaces gráficas, como mover
o ponteiro, acionar elemento de interface, selecionar e
arrastar;
(ii) manipulação direta e reconhecimento de escrita
manuscrita ou gestos.
Caneta
• “… a caneta pode remover a exigência de habilidade
para digitar quando se opera um computador. Ao invés
de digitar, o usuário simplesmente poderia escrever ou
desenhar, e o computador poderia reconhecer e agir
após receber esta entrada. ”
Kurtenbach (2010, p. 14, tradução nossa)
• “a caneta continuará essencial para algumas tarefas,
como rascunhar e entrar com uma ideia livre de forma,
e será nessas aplicações que ela encontrará sucesso”
Kurtenbach (2010, p. 20, tradução nossa)
Caneta
• Modalidade do tipo tátil que emprega sensores para
identificar uma ou mais regiões de uma superfície na
qual um ou mais dedos entraram em contato
• Várias tecnologias para possibilitar a interação por
toque, com características de tempo de resposta
diferentes ou possibilidade de entrada de apenas um ou
vários toques simultâneos (multitoque)
Toque
• É possível empregar a movimentação da caneta ou do
dedo na tela e atribuir-lhe um significado: a interação
por gestos
• “um expressivo, significante movimento do corpo, isto é,
movimento físico dos dedos, mãos, braços, cabeça, face
ou corpo que possui a intenção de passar informação ou
interagir com o ambiente” (Karpov et al., 2008, p. 156,
tradução nossa)
Gestos
• Gestos podem ser gerados a partir de qualquer
movimento do corpo, embora comumente relacionados
com as mãos e a face.
– pen-based gestures: a partir de movimentos da caneta
– touch gestures: a partir de movimentos de um dedo
– multi touch gesture: a partir do movimento de mais de um
dedo
Gestos
• Bernsen (2008) afirma que duas modalidades não são
equivalentes, pois as modalidades diferem uma da outra
em relação aos pontos fortes e fracos de expressividade
e também em sua relação aos sistemas perceptual,
cognitivo e emocional do ser humano.
Não Equivalência de Modalidades
• O teclado possibilita rápida digitação e possibilita a
elaboração de textos estruturados em tópicos, por outro
lado:
“o uso da caneta eletrônica é importante pois permite registrar e
organizar pensamentos, ideias, problemas e soluções de forma clara
e precisa, tornando o ensino e o aprendizado mais flexíveis. Além
disso, a caneta eletrônica possibilita o registro natural do processo
de desenvolvimento do pensamento e raciocínio em todas as suas
etapas. Por exemplo, na resolução de cálculos grandes e complexos,
é possível que sejam registrados os passos feitos e também
desenhados diagramas que explicam a resolução do problema.”
(Backon, 2006, p. 10, tradução nossa)
Caneta x Teclado
• “Pesquisadores e projetistas têm realizado a observação
chave que as interações usando a caneta são
distintamente diferentes das interações a toque e
podem ser exploradas em diferentes e interessantes
formas”(Kurtenbach, 2010, p. 20, tradução nossa)
Caneta x Toque
• “Entretanto a técnica de interação [com o mouse] é
indireta e baseada em reconhecimento. A Interface de
Usuário Natural com as telas multitoque é intuitiva,
contextualizada e evocativa. A mudança da GUI para
interface baseada em Gestos continuará a tornar os
computadores parte integrante, mas discreta, do nosso
estilo de vida.” (Teiche et al., 2009, p. 30, tradução
nossa)
Interface de Usuário Natural
Problemas de Interação
• Mudança de plataforma pode causar problemas
de interação chamados problemas mudança de
plataforma
• Mudança de modalidade pode causar
problemas de interação chamados problemas
mudança de modalidade
(da Silva et al, 2013)
Metodologia
Tablet PCDesktop
Celular
Dispositivos sensíveis
A toque
Windows Vista OS
Problema do Fat Finger na
Seleção de um Item do Menu
Problema de Consistência
Problemas Identificados
Problema
Identificado
Celular
sensível ao
toque
Tablet PC Desktop
1 Problema do dedo
gordo
Sim Sim Não
2 Uso de Mouseover Sim Sim Não
3 Integração com
gestos
Sim Sim* Não
4 Gap entre as
funcionalidades do
dispositivo
Sim Não Não
5 editor de texto rico Sim Não Não
6 Ativação do Menu Sim Sim Sim
*navegador usado é para desktop
Relação entre os Problemas e
Dispositivos
Tablet PCDesktop
Smartphone
1
2
45
6
3
Relação entre os Problemas e
Dispositivos
1
2
45
6
3
• Visa projetar e implementar interfaces de usuário para a
Web de forma a ter uma ótima experiência de
visualização a partir de adaptações para o dispositivo
que irá renderizar a página (Marcotte, 2011)
• Acredito que as técnicas do DR não solucionam todos os
problemas de mudança de modalidade
– Projeto de Iniciação Científica fomento pelo IFSP
Design Responsivo
• “O software não deveria ser projetado de forma que os
usuários pudessem operar o mesmo programa de
calendário em um palmtop, laptop ou computador do
tamanho de uma parede?” (Shneiderman, 2006, p. 58)
• Como operar da mesma forma e utilizando modalidades
diferentes?
Problemática
Ambientes de EaD e Dispositivos Móveis
• Aplicação específica para
dispositivo:
– Interface de usuário própria para o
dispositivo
– Obter vantagens das características
do dispositivo móvel
– Uma aplicação para cada plataforma
• Time de desenvolvimento com
conhecimento específico
• Aumento do número de linhas de
código a manter
Ambientes de EaD e Dispositivos Móveis
• Um Web site específico para
dispositivos móveis:
– Interface de usuário própria para o
dispositivo
– Não obtém todas as vantagens das
características do dispositivo
móvel
– Uma aplicação para os dispositivos
móveis e outra para desktops
• Aumento do número de linhas de
código a manter
Ambientes de EaD e Dispositivos Móveis
• A mesma interface para qualquer
dispositivo:
– Número de linhas de código não
aumenta significadamente
– Não obtém todas as vantagens das
características do dispositivo
móvel
– Dificuldade em considerar tantos
estilos de interação
– Necessidade de realizar testes de
usabilidade para identificar
barreiras
• Como o usuário utiliza o dispositivo e suas
modalidades?
“O desafio dos projetistas é compreender com mais
profundidade o que o usuário deseja.” (Shneiderman,
2006)
Adicionando Nova Modalidade
• InkBlog: permite escrever mensagens
manuscritas e desenhar esboços
– Incrementamos a ferramenta Weblog do ambiente
Ae com componentes para gerar e manipular tinta
eletrônica
– Tecnologias usadas na implementação: InkML da
W3C, HTML5, JavaScript, jQuery
A Ferramenta InkBlog
A Ferramenta InkBlog
InkEditor
A Ferramenta InkBlog
Mouse+Teclado x Toque+Caneta: as modalidades de interação em contextos educacionais
Safari/iPhone
InkBlog
Android
A Arquitetura da ferramenta Weblog
id Weblog Architecture
Client
Browser
Server
presentation layer
system layer
IWeblogSystem
POST - HTML
A Arquitetura da ferramenta InkBlog
id InkBlog Architecture
Client
Browser
InkEditor
InkRenderer
Server
presentation layer
system layer
InkController
InkML parts
InkML / POST -
HTTP
IWeblogSystem
Muitas modalidades de interação... Como
fazer para usá-las juntas?
Sistemas de Interação
Multimodal
• Possibilita os usuários interagir com computadores
por meio de várias modalidades de entrada e saída
Sistemas de Interação Multimodal
• Interação mais natural e transparente
• Aumento da acessibilidade
• Aumento da flexibilidade
• Aumento da conveniência
• Usuários preferem a interação multimodal
– Oviatt (1997) descreve que cerca de 95% dos
usuários
Modalidades
• Fala e gestos (Bolt, 1980)
• Fala e movimento de lábios (Petajan, 1984)
• Fala e gestos (Neal e Shapiro, 1991)
• Fala e rastreamento de olho (Koons et al., 1993)
• Fala e mouse (Cohen et al., 1997)
• Fala e tinta eletrônica + reconhecimento de
gestos (Bangalore e Johnston, 2006)
Arquitetura para Sistemas Multimodais
• Os dados das modalidades podem (Nigay & Coutaz,
1993) ser:
– Equivalentes
– Complementares
– Divergentes
Multimodalidade
• pensando na tecnologia dos computadores desktop e na
dos dispositivos móveis, acredito em uma
complementação de uso dessas tecnologias
• Dependendo da tarefa a ser realizada, utilizar um
determinado hardware será mais rápido, eficiente e/ou
oferecerá uma experiência mais gratificante aos
usuários
Minha Experiência...
• Membros: André Constantino da Silva (Coordenador) e
Daniela Marques
• Investigar o potencial da mobilidade de dispositivos
computacionais portáteis e das novas tecnologias de
interação em diferentes contextos (como educacional e
entretenimento) aplicando conceitos das disciplinas de
Engenharia de Software, Interação Humano-
Computador e Informática Aplicada a Educação.
Grupo de Pesquisa
Mobilidade e Novas
Tecnologias de Interação
Projetos em 2015
• Título: Montagem de Laboratório de Investigação de Modalidade
Multitoque em Contextos Educacionais
• Fomento: IFSP (Edital Pró-Equipamentos)
• Duração: 1 ano
• Objetivo geral: Aquirir equipamentos para investigar a modalidade
de interação multitoque em contextos educacionais, e como esses
equipamentos, que se diferem dos computadores desktops, pode
(i) tornar a aula mais interessante aos alunos, motivando-os a
participarem da aula, e (ii) identificar aplicações que apoiem as
atividades de ensino-aprendizagem.
• Equipamentos em aquisição:
• 3 comp. híbridos HP Split 13-M100
• 1 comp. híbrido Dell XPS 12
• 2 smartphones Samsung Galaxy Note III
Projetos em 2015
• Título: Investigação da Interação Multimodal e de
Mobilidade em Contextos Educacionais em Cursos Técnicos
e Tecnológicos
• Fomento: CNPq (chamada 14/2014)
• Duração: 3 anos
• Objetivo: Investigar e desenvolver aplicações que explorem
as modalidades de interação multitoque, caneta e gestos
em contextos educacionais.
• Equipamentos adquiridos:
• 2 computadores híbridos Inspiron 13” Dell
• 2 smatphones Samsung Note 4
Editor Multimodal
Equipe
André Constantino da Silva
Fernanda Maria Pereira Freire
Flávia Linhalis Arantes
Jan Breuer (Universidade de Siegen, Alemanha)
Renato César Alves de Oliveira (bolsista BAEF)
• Espaço para escrever, desenhar, colar fotos, acrescentar links
– registrar e produzir informações com diferentes tipos de mídias
• Multimodal:
– Texto
– Imagem
– Desenho com caneta
– Links (áudio, vídeo)
• Multiplataforma:
– Celular  toque
– Tablet  caneta
– Desktop / laptop  mouse e teclado
Editor multimodal
 Textos produzidos atualmente são semelhantes aos que
circulam em redes sociais  com diferentes tipos de
mídias
• Ampliar o alcance das atividades em sala de aula e dar
suporte para a elaboração de textos multimodais,
compatíveis com práticas atuais
• Alunos poderão enviar textos multimodais feitos em sala
de aula para o TelEduc e vice-versa
Motivação
Desenvolver um editor multimodal (com suporte à escrita,
desenho, imagem, links) em HTML5 para elaboração de
textos multimodais, visando integrar funcionalidades de
dispositivos móveis ao ambiente TelEduc, tendo em vista
o desenvolvimento de uma nova aplicação educacional.
Objetivo geral do projeto
• Permitir múltiplas possibilidades de registro e contribuir:
– com a inserção contextualizada de dispositivos móveis nas
práticas educacionais;
– com a integração de uma ferramenta inovadora, compatível
com as demandas atuais de utilização da web, na plataforma
TelEduc;
– para estreitar as maneiras como alunos e professores
interagem com conteúdos educacionais.
Contribuições esperadas
• Decisões de implementação
– Canvas com XML vs. SVG (Scalable Vector Graphics)
• Dinâmica para levantamento de requisitos e avaliação
de viabilidade
Ações realizadas
• Participantes: 13 estudantes de ensino médio, graduação e pós-
graduação
• Cada participante tinha um dispositivo móvel em mãos: 3 laptops, 4
tablets, 3 celulares.
• Fase 1: apresentação de uma aula com lousa, projetor e voz.
– Participantes assistiram à aula e tomaram nota com seus dispositivos
– Discussão e questionário sobre as anotações realizadas
• Fase 2: Elaboração de um documento no Power Point usando os
dados capturados
– Grupos formados por um estudante de cada dispositivo
– Discussão e questionário sobre e elaboração de um texto multimodal
Dinâmica
• Avaliação de viabilidade
– Análise dos dados da dinâmica
• Documento de requisitos
– Análise dos dados da dinâmica
• Implementação multiplataforma
– SVG
– HTML 5
Estado atual
• Acessar o editor multimodal
– Logar no teleduc e ter uma ferramenta
• Limitações no tamanho da tela
– Criar um app
• Dependente de plataforma
• Como integrar o editor multimodal no TelEduc
– Criar uma ferramenta
– Usar como um editor comum (como CK Editor)
Desafios
• Pesquisa sobre os dispositivos móveis em sala de aula,
na visão do professor
• Estudo sobre os tipos de dispositivos e editores
disponíveis
Desdobramentos / Demandas
Obrigado!

Mais conteúdo relacionado

Mais procurados

Design de Interfaces
Design de InterfacesDesign de Interfaces
Design de Interfaces
Juliana Padron
 
Boas Práticas em Design de Interfaces
Boas Práticas em Design de InterfacesBoas Práticas em Design de Interfaces
Boas Práticas em Design de Interfaces
Felipe Almeida
 
Campus Mobile 2013 - Design e usabilidade
Campus Mobile 2013 - Design e usabilidadeCampus Mobile 2013 - Design e usabilidade
Campus Mobile 2013 - Design e usabilidade
Leandro Biazon
 
Aula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHCAula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHC
Silvia Dotta
 
Conceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidadeConceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidade
Nécio de Lima Veras
 
Princípios de Design de Interação
Princípios de Design de InteraçãoPrincípios de Design de Interação
Princípios de Design de Interação
Felipe Dal Molin
 
Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010
Mourylise Heymer
 
Aula Teste sobre IHC, usabilidade e affordance
Aula Teste sobre IHC, usabilidade e affordanceAula Teste sobre IHC, usabilidade e affordance
Aula Teste sobre IHC, usabilidade e affordance
Christopher Cerqueira
 
Modelagem de usuários
Modelagem de usuáriosModelagem de usuários
Modelagem de usuários
Luciana Nunes
 
Interface Homem Computador - Aula02 - Principios de design em IHC
Interface Homem Computador - Aula02 - Principios de design em IHCInterface Homem Computador - Aula02 - Principios de design em IHC
Interface Homem Computador - Aula02 - Principios de design em IHC
CEULJI/ULBRA Centro Universitário Luterano de Ji-Paraná
 
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHCAula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
André Constantino da Silva
 
Design De Interfaces
Design De InterfacesDesign De Interfaces
Design De Interfaces
Bruno Brant
 
O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)
O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)
O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)
Rodrigo Freese Gonzatto
 
Pensamento projetual no desenvolvimento de software
Pensamento projetual no desenvolvimento de softwarePensamento projetual no desenvolvimento de software
Pensamento projetual no desenvolvimento de software
UTFPR
 
Palestra - Design de interação
Palestra - Design de interaçãoPalestra - Design de interação
Palestra - Design de interação
Luiz Agner
 
O processo de design de interação
O processo de design de interaçãoO processo de design de interação
O processo de design de interação
Robson Santos
 
Design de Interação: O que você tem a ver com isso?!
Design de Interação: O que você tem a ver com isso?!Design de Interação: O que você tem a ver com isso?!
Design de Interação: O que você tem a ver com isso?!
Monica Possel
 
Introducao ihm
Introducao ihmIntroducao ihm
Introducao ihm
Marcos Oliveira
 
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Impacta Eventos
 
CRP-5215-0420-2014-08
CRP-5215-0420-2014-08CRP-5215-0420-2014-08

Mais procurados (20)

Design de Interfaces
Design de InterfacesDesign de Interfaces
Design de Interfaces
 
Boas Práticas em Design de Interfaces
Boas Práticas em Design de InterfacesBoas Práticas em Design de Interfaces
Boas Práticas em Design de Interfaces
 
Campus Mobile 2013 - Design e usabilidade
Campus Mobile 2013 - Design e usabilidadeCampus Mobile 2013 - Design e usabilidade
Campus Mobile 2013 - Design e usabilidade
 
Aula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHCAula 2. Fatores Humanos em IHC
Aula 2. Fatores Humanos em IHC
 
Conceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidadeConceitos básicos de usabilidade e acessibilidade
Conceitos básicos de usabilidade e acessibilidade
 
Princípios de Design de Interação
Princípios de Design de InteraçãoPrincípios de Design de Interação
Princípios de Design de Interação
 
Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010Design de Interação, Experiência do Usuário e Usabilidade - 2010
Design de Interação, Experiência do Usuário e Usabilidade - 2010
 
Aula Teste sobre IHC, usabilidade e affordance
Aula Teste sobre IHC, usabilidade e affordanceAula Teste sobre IHC, usabilidade e affordance
Aula Teste sobre IHC, usabilidade e affordance
 
Modelagem de usuários
Modelagem de usuáriosModelagem de usuários
Modelagem de usuários
 
Interface Homem Computador - Aula02 - Principios de design em IHC
Interface Homem Computador - Aula02 - Principios de design em IHCInterface Homem Computador - Aula02 - Principios de design em IHC
Interface Homem Computador - Aula02 - Principios de design em IHC
 
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHCAula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
 
Design De Interfaces
Design De InterfacesDesign De Interfaces
Design De Interfaces
 
O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)
O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)
O que é isto, a Interação? (Design de Interação e Interação Humano-Computador)
 
Pensamento projetual no desenvolvimento de software
Pensamento projetual no desenvolvimento de softwarePensamento projetual no desenvolvimento de software
Pensamento projetual no desenvolvimento de software
 
Palestra - Design de interação
Palestra - Design de interaçãoPalestra - Design de interação
Palestra - Design de interação
 
O processo de design de interação
O processo de design de interaçãoO processo de design de interação
O processo de design de interação
 
Design de Interação: O que você tem a ver com isso?!
Design de Interação: O que você tem a ver com isso?!Design de Interação: O que você tem a ver com isso?!
Design de Interação: O que você tem a ver com isso?!
 
Introducao ihm
Introducao ihmIntroducao ihm
Introducao ihm
 
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)Palestra Experiência do Usuário no contexto do negócio (UX Expert)
Palestra Experiência do Usuário no contexto do negócio (UX Expert)
 
CRP-5215-0420-2014-08
CRP-5215-0420-2014-08CRP-5215-0420-2014-08
CRP-5215-0420-2014-08
 

Destaque

Introdução ao TelEduc
Introdução ao TelEducIntrodução ao TelEduc
Introdução ao TelEduc
André Constantino da Silva
 
Aula 8 - Lógica de Programação - Variáveis, Tipos de dados e Operadores
Aula 8 - Lógica de Programação - Variáveis, Tipos de dados e OperadoresAula 8 - Lógica de Programação - Variáveis, Tipos de dados e Operadores
Aula 8 - Lógica de Programação - Variáveis, Tipos de dados e Operadores
André Constantino da Silva
 
Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...
Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...
Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...
Elizabete Munzlinger
 
Interface de linha de comando - CLI
Interface de linha de comando - CLIInterface de linha de comando - CLI
Interface de linha de comando - CLI
Benedilosn
 
Aula 1 final
Aula 1 finalAula 1 final
Aula 10 - Comando de Decisão Múltipla e Comandos de Repetição
Aula 10 - Comando de Decisão Múltipla e Comandos de RepetiçãoAula 10 - Comando de Decisão Múltipla e Comandos de Repetição
Aula 10 - Comando de Decisão Múltipla e Comandos de Repetição
André Constantino da Silva
 
7Masters Usabilidade - Design-driven Innovation, com Érico Fileno
7Masters Usabilidade - Design-driven Innovation, com Érico Fileno7Masters Usabilidade - Design-driven Innovation, com Érico Fileno
7Masters Usabilidade - Design-driven Innovation, com Érico Fileno
iMasters
 
Usabilidade de Interfaces - Parte 3
Usabilidade de Interfaces - Parte 3Usabilidade de Interfaces - Parte 3
Usabilidade de Interfaces - Parte 3
Oziel Moreira Neto
 
Usabilidade de Interfaces - Parte 1
Usabilidade de Interfaces - Parte 1Usabilidade de Interfaces - Parte 1
Usabilidade de Interfaces - Parte 1
Oziel Moreira Neto
 
Como fazer citações e referências bibliográficas
Como fazer citações e referências bibliográficasComo fazer citações e referências bibliográficas
Como fazer citações e referências bibliográficas
André Constantino da Silva
 
Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...
Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...
Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...
André Constantino da Silva
 
Aula sobre texto academico - elaboração do desenvolvimento
Aula sobre texto academico - elaboração do desenvolvimentoAula sobre texto academico - elaboração do desenvolvimento
Aula sobre texto academico - elaboração do desenvolvimento
André Constantino da Silva
 
Resultados pesquisa interna ix da campinas
Resultados pesquisa interna ix da campinasResultados pesquisa interna ix da campinas
Resultados pesquisa interna ix da campinas
ixdacampinas
 
Marina Proni - Reflexões sobre Hábito e Usabilidade
Marina Proni - Reflexões sobre Hábito e UsabilidadeMarina Proni - Reflexões sobre Hábito e Usabilidade
Marina Proni - Reflexões sobre Hábito e Usabilidade
ixdacampinas
 
Aula: Tipos de Interface
Aula: Tipos de InterfaceAula: Tipos de Interface
Aula: Tipos de Interface
Janynne Gomes
 
Aula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de InteraçãoAula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de Interação
Fabio Moura Pereira
 
Usabilidade - Metas, Principios e Heuristicas
Usabilidade -  Metas, Principios e HeuristicasUsabilidade -  Metas, Principios e Heuristicas
Usabilidade - Metas, Principios e Heuristicas
Lidiane Dos Santos Carvalho
 
Palestra - 113 Diretrizes de Nielsen para Homepages.
Palestra - 113 Diretrizes de Nielsen para Homepages.Palestra - 113 Diretrizes de Nielsen para Homepages.
Palestra - 113 Diretrizes de Nielsen para Homepages.
Luiz Agner
 
Design thinking
Design thinkingDesign thinking
Design thinking
Alessandra Rosa
 
Aula 5 -Avaliação de interfaces de usuário - testes com usuários
Aula 5 -Avaliação de interfaces de usuário - testes com usuáriosAula 5 -Avaliação de interfaces de usuário - testes com usuários
Aula 5 -Avaliação de interfaces de usuário - testes com usuários
André Constantino da Silva
 

Destaque (20)

Introdução ao TelEduc
Introdução ao TelEducIntrodução ao TelEduc
Introdução ao TelEduc
 
Aula 8 - Lógica de Programação - Variáveis, Tipos de dados e Operadores
Aula 8 - Lógica de Programação - Variáveis, Tipos de dados e OperadoresAula 8 - Lógica de Programação - Variáveis, Tipos de dados e Operadores
Aula 8 - Lógica de Programação - Variáveis, Tipos de dados e Operadores
 
Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...
Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...
Desenvolvimento e Avaliação de um Sistema Multimodal e Multiusuário de Navega...
 
Interface de linha de comando - CLI
Interface de linha de comando - CLIInterface de linha de comando - CLI
Interface de linha de comando - CLI
 
Aula 1 final
Aula 1 finalAula 1 final
Aula 1 final
 
Aula 10 - Comando de Decisão Múltipla e Comandos de Repetição
Aula 10 - Comando de Decisão Múltipla e Comandos de RepetiçãoAula 10 - Comando de Decisão Múltipla e Comandos de Repetição
Aula 10 - Comando de Decisão Múltipla e Comandos de Repetição
 
7Masters Usabilidade - Design-driven Innovation, com Érico Fileno
7Masters Usabilidade - Design-driven Innovation, com Érico Fileno7Masters Usabilidade - Design-driven Innovation, com Érico Fileno
7Masters Usabilidade - Design-driven Innovation, com Érico Fileno
 
Usabilidade de Interfaces - Parte 3
Usabilidade de Interfaces - Parte 3Usabilidade de Interfaces - Parte 3
Usabilidade de Interfaces - Parte 3
 
Usabilidade de Interfaces - Parte 1
Usabilidade de Interfaces - Parte 1Usabilidade de Interfaces - Parte 1
Usabilidade de Interfaces - Parte 1
 
Como fazer citações e referências bibliográficas
Como fazer citações e referências bibliográficasComo fazer citações e referências bibliográficas
Como fazer citações e referências bibliográficas
 
Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...
Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...
Aula 9 - Resultado Operandos Matemáticos, Operadores Aritmeticos, Relacionais...
 
Aula sobre texto academico - elaboração do desenvolvimento
Aula sobre texto academico - elaboração do desenvolvimentoAula sobre texto academico - elaboração do desenvolvimento
Aula sobre texto academico - elaboração do desenvolvimento
 
Resultados pesquisa interna ix da campinas
Resultados pesquisa interna ix da campinasResultados pesquisa interna ix da campinas
Resultados pesquisa interna ix da campinas
 
Marina Proni - Reflexões sobre Hábito e Usabilidade
Marina Proni - Reflexões sobre Hábito e UsabilidadeMarina Proni - Reflexões sobre Hábito e Usabilidade
Marina Proni - Reflexões sobre Hábito e Usabilidade
 
Aula: Tipos de Interface
Aula: Tipos de InterfaceAula: Tipos de Interface
Aula: Tipos de Interface
 
Aula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de InteraçãoAula - Interfaces e Estilos de Interação
Aula - Interfaces e Estilos de Interação
 
Usabilidade - Metas, Principios e Heuristicas
Usabilidade -  Metas, Principios e HeuristicasUsabilidade -  Metas, Principios e Heuristicas
Usabilidade - Metas, Principios e Heuristicas
 
Palestra - 113 Diretrizes de Nielsen para Homepages.
Palestra - 113 Diretrizes de Nielsen para Homepages.Palestra - 113 Diretrizes de Nielsen para Homepages.
Palestra - 113 Diretrizes de Nielsen para Homepages.
 
Design thinking
Design thinkingDesign thinking
Design thinking
 
Aula 5 -Avaliação de interfaces de usuário - testes com usuários
Aula 5 -Avaliação de interfaces de usuário - testes com usuáriosAula 5 -Avaliação de interfaces de usuário - testes com usuários
Aula 5 -Avaliação de interfaces de usuário - testes com usuários
 

Semelhante a Mouse+Teclado x Toque+Caneta: as modalidades de interação em contextos educacionais

Estilos de interacao_em_interfaces_para_dispositivos_moveis
Estilos de interacao_em_interfaces_para_dispositivos_moveisEstilos de interacao_em_interfaces_para_dispositivos_moveis
Estilos de interacao_em_interfaces_para_dispositivos_moveis
Fran Maciel
 
Pesquisa
PesquisaPesquisa
Interação humano computador (introdução )
Interação humano computador (introdução )Interação humano computador (introdução )
Interação humano computador (introdução )
Jesse Teixeira
 
Interfaces Naturais
Interfaces NaturaisInterfaces Naturais
Interfaces Naturais
Edu Agni
 
Introdução do curso adm 40 h
Introdução do curso adm 40 hIntrodução do curso adm 40 h
Introdução do curso adm 40 h
marciaorion
 
Comunicação aumentativa
Comunicação aumentativaComunicação aumentativa
Comunicação aumentativa
Ana Paula Santos
 
Natural User Interface Design
Natural User Interface DesignNatural User Interface Design
Natural User Interface Design
Edu Agni
 
Novas formas de interação Homem-máquina
Novas formas de interação Homem-máquinaNovas formas de interação Homem-máquina
Novas formas de interação Homem-máquina
Joana Moura Ferreira
 
Apostila aula1ª Proinfo Integrado
Apostila   aula1ª Proinfo IntegradoApostila   aula1ª Proinfo Integrado
Apostila aula1ª Proinfo Integrado
Maxxsuel
 
Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...
Mauro Pinheiro
 
O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...
O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...
O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...
Pedro Tavares
 
Interface e Usabilidade: Como levar o usuário onde queremos!
Interface e Usabilidade: Como levar o usuário onde queremos!Interface e Usabilidade: Como levar o usuário onde queremos!
Interface e Usabilidade: Como levar o usuário onde queremos!
Marcelo Prudente
 
Interface com o usuário
Interface com o usuárioInterface com o usuário
Interface com o usuário
irlss
 
Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)
Wellington Oliveira
 
Interface web
Interface webInterface web
Interface web
Armando Rivarola
 
Indo além do Design Centrado no Usuário
Indo além do Design Centrado no UsuárioIndo além do Design Centrado no Usuário
Indo além do Design Centrado no Usuário
UTFPR
 
Unidade i
Unidade iUnidade i
Unidade i
Danuza Rodrigues
 
Agner Abciber 2011
Agner Abciber 2011Agner Abciber 2011
Agner Abciber 2011
Luiz Agner
 
Usabilidade na tv digital
Usabilidade na tv digitalUsabilidade na tv digital
Usabilidade na tv digital
Patricia Cressoni Gomes
 
Design e produção multimídia
Design e produção multimídiaDesign e produção multimídia
Design e produção multimídia
Darwin Mota
 

Semelhante a Mouse+Teclado x Toque+Caneta: as modalidades de interação em contextos educacionais (20)

Estilos de interacao_em_interfaces_para_dispositivos_moveis
Estilos de interacao_em_interfaces_para_dispositivos_moveisEstilos de interacao_em_interfaces_para_dispositivos_moveis
Estilos de interacao_em_interfaces_para_dispositivos_moveis
 
Pesquisa
PesquisaPesquisa
Pesquisa
 
Interação humano computador (introdução )
Interação humano computador (introdução )Interação humano computador (introdução )
Interação humano computador (introdução )
 
Interfaces Naturais
Interfaces NaturaisInterfaces Naturais
Interfaces Naturais
 
Introdução do curso adm 40 h
Introdução do curso adm 40 hIntrodução do curso adm 40 h
Introdução do curso adm 40 h
 
Comunicação aumentativa
Comunicação aumentativaComunicação aumentativa
Comunicação aumentativa
 
Natural User Interface Design
Natural User Interface DesignNatural User Interface Design
Natural User Interface Design
 
Novas formas de interação Homem-máquina
Novas formas de interação Homem-máquinaNovas formas de interação Homem-máquina
Novas formas de interação Homem-máquina
 
Apostila aula1ª Proinfo Integrado
Apostila   aula1ª Proinfo IntegradoApostila   aula1ª Proinfo Integrado
Apostila aula1ª Proinfo Integrado
 
Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...Design da interação / Design da experiência: considerações sobre um campo de ...
Design da interação / Design da experiência: considerações sobre um campo de ...
 
O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...
O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...
O Contexto da Mobilidade na Utilização da Web - As Redes Sociais Facebook e T...
 
Interface e Usabilidade: Como levar o usuário onde queremos!
Interface e Usabilidade: Como levar o usuário onde queremos!Interface e Usabilidade: Como levar o usuário onde queremos!
Interface e Usabilidade: Como levar o usuário onde queremos!
 
Interface com o usuário
Interface com o usuárioInterface com o usuário
Interface com o usuário
 
Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)Interface Humano-Computador (IHC)
Interface Humano-Computador (IHC)
 
Interface web
Interface webInterface web
Interface web
 
Indo além do Design Centrado no Usuário
Indo além do Design Centrado no UsuárioIndo além do Design Centrado no Usuário
Indo além do Design Centrado no Usuário
 
Unidade i
Unidade iUnidade i
Unidade i
 
Agner Abciber 2011
Agner Abciber 2011Agner Abciber 2011
Agner Abciber 2011
 
Usabilidade na tv digital
Usabilidade na tv digitalUsabilidade na tv digital
Usabilidade na tv digital
 
Design e produção multimídia
Design e produção multimídiaDesign e produção multimídia
Design e produção multimídia
 

Mais de André Constantino da Silva

Aula 4 - Avaliação de Interface - Parte 1
Aula 4 -  Avaliação de Interface - Parte 1Aula 4 -  Avaliação de Interface - Parte 1
Aula 4 - Avaliação de Interface - Parte 1
André Constantino da Silva
 
Introdução ao ambiente virtual de aprendizagem TelEduc
Introdução ao ambiente virtual de aprendizagem TelEducIntrodução ao ambiente virtual de aprendizagem TelEduc
Introdução ao ambiente virtual de aprendizagem TelEduc
André Constantino da Silva
 
Aula 4 Fatores Humanos - parte 1 - Disciplina de IHC
Aula 4   Fatores Humanos - parte 1 - Disciplina de IHCAula 4   Fatores Humanos - parte 1 - Disciplina de IHC
Aula 4 Fatores Humanos - parte 1 - Disciplina de IHC
André Constantino da Silva
 
InkBlog: A Pen-Based Blog Tool for e-Learning Environments
InkBlog: A Pen-Based Blog Tool for e-Learning EnvironmentsInkBlog: A Pen-Based Blog Tool for e-Learning Environments
InkBlog: A Pen-Based Blog Tool for e-Learning Environments
André Constantino da Silva
 
Aula 3
Aula 3Aula 3
Aula 2 final
Aula 2 finalAula 2 final
Aula 6 – linguagem HTML - Endereço absoluto e relativo
Aula 6 – linguagem HTML - Endereço absoluto e relativoAula 6 – linguagem HTML - Endereço absoluto e relativo
Aula 6 – linguagem HTML - Endereço absoluto e relativo
André Constantino da Silva
 
Aula 7 – linguagem HTML - Frames
Aula 7 – linguagem HTML - FramesAula 7 – linguagem HTML - Frames
Aula 7 – linguagem HTML - Frames
André Constantino da Silva
 
Aula 4 – Linguagem HTML - Imagens e links
Aula 4 – Linguagem HTML - Imagens e linksAula 4 – Linguagem HTML - Imagens e links
Aula 4 – Linguagem HTML - Imagens e links
André Constantino da Silva
 
Aula 3 – Linguagem HTML - formatação de texto
Aula 3 – Linguagem HTML -  formatação de textoAula 3 – Linguagem HTML -  formatação de texto
Aula 3 – Linguagem HTML - formatação de texto
André Constantino da Silva
 
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estruturaAula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
André Constantino da Silva
 
Uml - Exemplos de Modelagem em UML
Uml - Exemplos de Modelagem em UMLUml - Exemplos de Modelagem em UML
Uml - Exemplos de Modelagem em UML
André Constantino da Silva
 
Raciocínio Lógico Aplicado a Resolução de Problemas Matemáticos
Raciocínio Lógico Aplicado a Resolução de Problemas MatemáticosRaciocínio Lógico Aplicado a Resolução de Problemas Matemáticos
Raciocínio Lógico Aplicado a Resolução de Problemas Matemáticos
André Constantino da Silva
 
Introdução ao TelEduc
Introdução ao TelEducIntrodução ao TelEduc
Introdução ao TelEduc
André Constantino da Silva
 
Práticas de Linguagem e Design: algumas questões de usabilidade no contexto ...
Práticas de Linguagem e Design: algumas questões de usabilidade no  contexto ...Práticas de Linguagem e Design: algumas questões de usabilidade no  contexto ...
Práticas de Linguagem e Design: algumas questões de usabilidade no contexto ...
André Constantino da Silva
 

Mais de André Constantino da Silva (15)

Aula 4 - Avaliação de Interface - Parte 1
Aula 4 -  Avaliação de Interface - Parte 1Aula 4 -  Avaliação de Interface - Parte 1
Aula 4 - Avaliação de Interface - Parte 1
 
Introdução ao ambiente virtual de aprendizagem TelEduc
Introdução ao ambiente virtual de aprendizagem TelEducIntrodução ao ambiente virtual de aprendizagem TelEduc
Introdução ao ambiente virtual de aprendizagem TelEduc
 
Aula 4 Fatores Humanos - parte 1 - Disciplina de IHC
Aula 4   Fatores Humanos - parte 1 - Disciplina de IHCAula 4   Fatores Humanos - parte 1 - Disciplina de IHC
Aula 4 Fatores Humanos - parte 1 - Disciplina de IHC
 
InkBlog: A Pen-Based Blog Tool for e-Learning Environments
InkBlog: A Pen-Based Blog Tool for e-Learning EnvironmentsInkBlog: A Pen-Based Blog Tool for e-Learning Environments
InkBlog: A Pen-Based Blog Tool for e-Learning Environments
 
Aula 3
Aula 3Aula 3
Aula 3
 
Aula 2 final
Aula 2 finalAula 2 final
Aula 2 final
 
Aula 6 – linguagem HTML - Endereço absoluto e relativo
Aula 6 – linguagem HTML - Endereço absoluto e relativoAula 6 – linguagem HTML - Endereço absoluto e relativo
Aula 6 – linguagem HTML - Endereço absoluto e relativo
 
Aula 7 – linguagem HTML - Frames
Aula 7 – linguagem HTML - FramesAula 7 – linguagem HTML - Frames
Aula 7 – linguagem HTML - Frames
 
Aula 4 – Linguagem HTML - Imagens e links
Aula 4 – Linguagem HTML - Imagens e linksAula 4 – Linguagem HTML - Imagens e links
Aula 4 – Linguagem HTML - Imagens e links
 
Aula 3 – Linguagem HTML - formatação de texto
Aula 3 – Linguagem HTML -  formatação de textoAula 3 – Linguagem HTML -  formatação de texto
Aula 3 – Linguagem HTML - formatação de texto
 
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estruturaAula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
 
Uml - Exemplos de Modelagem em UML
Uml - Exemplos de Modelagem em UMLUml - Exemplos de Modelagem em UML
Uml - Exemplos de Modelagem em UML
 
Raciocínio Lógico Aplicado a Resolução de Problemas Matemáticos
Raciocínio Lógico Aplicado a Resolução de Problemas MatemáticosRaciocínio Lógico Aplicado a Resolução de Problemas Matemáticos
Raciocínio Lógico Aplicado a Resolução de Problemas Matemáticos
 
Introdução ao TelEduc
Introdução ao TelEducIntrodução ao TelEduc
Introdução ao TelEduc
 
Práticas de Linguagem e Design: algumas questões de usabilidade no contexto ...
Práticas de Linguagem e Design: algumas questões de usabilidade no  contexto ...Práticas de Linguagem e Design: algumas questões de usabilidade no  contexto ...
Práticas de Linguagem e Design: algumas questões de usabilidade no contexto ...
 

Mouse+Teclado x Toque+Caneta: as modalidades de interação em contextos educacionais

  • 1. Mouse+Teclado x Toque+Caneta as modalidades de interação em contextos educacionais Prof. Dr. André Constantino da Silva
  • 2. • Minha história • Modalidade – Teclado – Mouse – Caneta – Toque • Multimodalidade • Projetos de Pesquisa em Andamento – Editor Multimodal Agenda
  • 3. • Ingresso no NIED em 2005 – Projeto TIDIA-Ae – Aluno especial IC/UNICAMP, primeiramente na disciplina de projeto de interfaces de usuário • Caderno Interativo de Lógica (Néris et al, 2006) • Uso para apoiar as atividades de aprendizagem (da Silva; da Rocha, 2011) – Acompanhamento dos estudos do grupo • Uso de palmtop e desenvolvimento de sistemas Interativos – Multiplataforma Minha História
  • 4. • Participação no projeto de investigação do uso de Tablet PCs na Educação Superior – Rodolfo J. Azevedo (coordenador), Heloísa V. da Rocha, André C. da Silva, Ricardo E. Caceffo e Pedro Almeida – Laboratório com 20 Tablet PCs com suporte interação a caneta e a multitoque – Impressionado: muitos alunos preferiram não usar o dispositivo Minha História
  • 5. • Popularização dos dispositivos móveis e investigações sobre m-Learning – Equipados com tela Multitoque - Equipados com tela multitoque e a caneta Minha História
  • 7. • “Como dar conta da rápida evolução tecnológica? Como garantir que os design ofereçam uma boa IHC ao mesmo tempo que exploram o potencial e funcionalidade da nova tecnologia?” (Preece et al., 1994) • “As novas tecnologias da informática incluiriam displays do tamanho de uma parede, aplicados para palmtops, minis sensores médicos parecidos com joias e computadores sensíveis ao tato que mudam experiências sensoriais e formas de pensar.” (Shneiderman, 2006, p. 21) Motivação
  • 8. • O modo como uma entrada do usuário ou uma saída do sistema são expressas • O modo de comunicação se refere ao canal usado por duas entidades diferentes que interagem (Alty e McCartney, 1991) • “um método de interação que um agente pode usar para alcançar uma meta ressaltando que uma modalidade pode ser especificada em termos gerais como ‘usando fala’ ou em termos mais específicos como ‘usando microfone’” (Nigay e Coutaz, 1995). Modalidade de Interação
  • 9. • Periférico de entrada utilizado para a entrada manual de dados e comandos • Formado por um arranjo de teclas representando letras, números, símbolos e outras funções Teclado
  • 10. • Utilizado como dispositivo para movimentar o ponteiro em interfaces WIMP • quatro tipos de operações: movimento, clique, duplo clique e "arrastar e largar“ Mouse
  • 11. • Dois dos principais dispositivos de entrada de dados no computador desktop • “O mouse e a interface GUI foram umas das principais razões para a grande penetração dos computadores na sociedade.” (Teiche et al., 2009) Teclado + Mouse
  • 12. • Periférico semelhante à caneta, chamado de stylus – Pen-based computing • As interfaces de usuário para computação baseada em caneta podem ser implementadas de vários modos, destacam-se: (i) periférico de apontamento: as ações da caneta são mapeadas para ações das interfaces gráficas, como mover o ponteiro, acionar elemento de interface, selecionar e arrastar; (ii) manipulação direta e reconhecimento de escrita manuscrita ou gestos. Caneta
  • 13. • “… a caneta pode remover a exigência de habilidade para digitar quando se opera um computador. Ao invés de digitar, o usuário simplesmente poderia escrever ou desenhar, e o computador poderia reconhecer e agir após receber esta entrada. ” Kurtenbach (2010, p. 14, tradução nossa) • “a caneta continuará essencial para algumas tarefas, como rascunhar e entrar com uma ideia livre de forma, e será nessas aplicações que ela encontrará sucesso” Kurtenbach (2010, p. 20, tradução nossa) Caneta
  • 14. • Modalidade do tipo tátil que emprega sensores para identificar uma ou mais regiões de uma superfície na qual um ou mais dedos entraram em contato • Várias tecnologias para possibilitar a interação por toque, com características de tempo de resposta diferentes ou possibilidade de entrada de apenas um ou vários toques simultâneos (multitoque) Toque
  • 15. • É possível empregar a movimentação da caneta ou do dedo na tela e atribuir-lhe um significado: a interação por gestos • “um expressivo, significante movimento do corpo, isto é, movimento físico dos dedos, mãos, braços, cabeça, face ou corpo que possui a intenção de passar informação ou interagir com o ambiente” (Karpov et al., 2008, p. 156, tradução nossa) Gestos
  • 16. • Gestos podem ser gerados a partir de qualquer movimento do corpo, embora comumente relacionados com as mãos e a face. – pen-based gestures: a partir de movimentos da caneta – touch gestures: a partir de movimentos de um dedo – multi touch gesture: a partir do movimento de mais de um dedo Gestos
  • 17. • Bernsen (2008) afirma que duas modalidades não são equivalentes, pois as modalidades diferem uma da outra em relação aos pontos fortes e fracos de expressividade e também em sua relação aos sistemas perceptual, cognitivo e emocional do ser humano. Não Equivalência de Modalidades
  • 18. • O teclado possibilita rápida digitação e possibilita a elaboração de textos estruturados em tópicos, por outro lado: “o uso da caneta eletrônica é importante pois permite registrar e organizar pensamentos, ideias, problemas e soluções de forma clara e precisa, tornando o ensino e o aprendizado mais flexíveis. Além disso, a caneta eletrônica possibilita o registro natural do processo de desenvolvimento do pensamento e raciocínio em todas as suas etapas. Por exemplo, na resolução de cálculos grandes e complexos, é possível que sejam registrados os passos feitos e também desenhados diagramas que explicam a resolução do problema.” (Backon, 2006, p. 10, tradução nossa) Caneta x Teclado
  • 19. • “Pesquisadores e projetistas têm realizado a observação chave que as interações usando a caneta são distintamente diferentes das interações a toque e podem ser exploradas em diferentes e interessantes formas”(Kurtenbach, 2010, p. 20, tradução nossa) Caneta x Toque
  • 20. • “Entretanto a técnica de interação [com o mouse] é indireta e baseada em reconhecimento. A Interface de Usuário Natural com as telas multitoque é intuitiva, contextualizada e evocativa. A mudança da GUI para interface baseada em Gestos continuará a tornar os computadores parte integrante, mas discreta, do nosso estilo de vida.” (Teiche et al., 2009, p. 30, tradução nossa) Interface de Usuário Natural
  • 21. Problemas de Interação • Mudança de plataforma pode causar problemas de interação chamados problemas mudança de plataforma • Mudança de modalidade pode causar problemas de interação chamados problemas mudança de modalidade (da Silva et al, 2013)
  • 23. Problema do Fat Finger na Seleção de um Item do Menu
  • 25. Problemas Identificados Problema Identificado Celular sensível ao toque Tablet PC Desktop 1 Problema do dedo gordo Sim Sim Não 2 Uso de Mouseover Sim Sim Não 3 Integração com gestos Sim Sim* Não 4 Gap entre as funcionalidades do dispositivo Sim Não Não 5 editor de texto rico Sim Não Não 6 Ativação do Menu Sim Sim Sim *navegador usado é para desktop
  • 26. Relação entre os Problemas e Dispositivos Tablet PCDesktop Smartphone 1 2 45 6 3
  • 27. Relação entre os Problemas e Dispositivos 1 2 45 6 3
  • 28. • Visa projetar e implementar interfaces de usuário para a Web de forma a ter uma ótima experiência de visualização a partir de adaptações para o dispositivo que irá renderizar a página (Marcotte, 2011) • Acredito que as técnicas do DR não solucionam todos os problemas de mudança de modalidade – Projeto de Iniciação Científica fomento pelo IFSP Design Responsivo
  • 29. • “O software não deveria ser projetado de forma que os usuários pudessem operar o mesmo programa de calendário em um palmtop, laptop ou computador do tamanho de uma parede?” (Shneiderman, 2006, p. 58) • Como operar da mesma forma e utilizando modalidades diferentes? Problemática
  • 30. Ambientes de EaD e Dispositivos Móveis • Aplicação específica para dispositivo: – Interface de usuário própria para o dispositivo – Obter vantagens das características do dispositivo móvel – Uma aplicação para cada plataforma • Time de desenvolvimento com conhecimento específico • Aumento do número de linhas de código a manter
  • 31. Ambientes de EaD e Dispositivos Móveis • Um Web site específico para dispositivos móveis: – Interface de usuário própria para o dispositivo – Não obtém todas as vantagens das características do dispositivo móvel – Uma aplicação para os dispositivos móveis e outra para desktops • Aumento do número de linhas de código a manter
  • 32. Ambientes de EaD e Dispositivos Móveis • A mesma interface para qualquer dispositivo: – Número de linhas de código não aumenta significadamente – Não obtém todas as vantagens das características do dispositivo móvel – Dificuldade em considerar tantos estilos de interação – Necessidade de realizar testes de usabilidade para identificar barreiras
  • 33. • Como o usuário utiliza o dispositivo e suas modalidades? “O desafio dos projetistas é compreender com mais profundidade o que o usuário deseja.” (Shneiderman, 2006)
  • 34. Adicionando Nova Modalidade • InkBlog: permite escrever mensagens manuscritas e desenhar esboços – Incrementamos a ferramenta Weblog do ambiente Ae com componentes para gerar e manipular tinta eletrônica – Tecnologias usadas na implementação: InkML da W3C, HTML5, JavaScript, jQuery
  • 40. A Arquitetura da ferramenta Weblog id Weblog Architecture Client Browser Server presentation layer system layer IWeblogSystem POST - HTML
  • 41. A Arquitetura da ferramenta InkBlog id InkBlog Architecture Client Browser InkEditor InkRenderer Server presentation layer system layer InkController InkML parts InkML / POST - HTTP IWeblogSystem
  • 42. Muitas modalidades de interação... Como fazer para usá-las juntas?
  • 43. Sistemas de Interação Multimodal • Possibilita os usuários interagir com computadores por meio de várias modalidades de entrada e saída
  • 44. Sistemas de Interação Multimodal • Interação mais natural e transparente • Aumento da acessibilidade • Aumento da flexibilidade • Aumento da conveniência • Usuários preferem a interação multimodal – Oviatt (1997) descreve que cerca de 95% dos usuários
  • 45. Modalidades • Fala e gestos (Bolt, 1980) • Fala e movimento de lábios (Petajan, 1984) • Fala e gestos (Neal e Shapiro, 1991) • Fala e rastreamento de olho (Koons et al., 1993) • Fala e mouse (Cohen et al., 1997) • Fala e tinta eletrônica + reconhecimento de gestos (Bangalore e Johnston, 2006)
  • 47. • Os dados das modalidades podem (Nigay & Coutaz, 1993) ser: – Equivalentes – Complementares – Divergentes Multimodalidade
  • 48. • pensando na tecnologia dos computadores desktop e na dos dispositivos móveis, acredito em uma complementação de uso dessas tecnologias • Dependendo da tarefa a ser realizada, utilizar um determinado hardware será mais rápido, eficiente e/ou oferecerá uma experiência mais gratificante aos usuários Minha Experiência...
  • 49. • Membros: André Constantino da Silva (Coordenador) e Daniela Marques • Investigar o potencial da mobilidade de dispositivos computacionais portáteis e das novas tecnologias de interação em diferentes contextos (como educacional e entretenimento) aplicando conceitos das disciplinas de Engenharia de Software, Interação Humano- Computador e Informática Aplicada a Educação. Grupo de Pesquisa Mobilidade e Novas Tecnologias de Interação
  • 50. Projetos em 2015 • Título: Montagem de Laboratório de Investigação de Modalidade Multitoque em Contextos Educacionais • Fomento: IFSP (Edital Pró-Equipamentos) • Duração: 1 ano • Objetivo geral: Aquirir equipamentos para investigar a modalidade de interação multitoque em contextos educacionais, e como esses equipamentos, que se diferem dos computadores desktops, pode (i) tornar a aula mais interessante aos alunos, motivando-os a participarem da aula, e (ii) identificar aplicações que apoiem as atividades de ensino-aprendizagem. • Equipamentos em aquisição: • 3 comp. híbridos HP Split 13-M100 • 1 comp. híbrido Dell XPS 12 • 2 smartphones Samsung Galaxy Note III
  • 51. Projetos em 2015 • Título: Investigação da Interação Multimodal e de Mobilidade em Contextos Educacionais em Cursos Técnicos e Tecnológicos • Fomento: CNPq (chamada 14/2014) • Duração: 3 anos • Objetivo: Investigar e desenvolver aplicações que explorem as modalidades de interação multitoque, caneta e gestos em contextos educacionais. • Equipamentos adquiridos: • 2 computadores híbridos Inspiron 13” Dell • 2 smatphones Samsung Note 4
  • 52. Editor Multimodal Equipe André Constantino da Silva Fernanda Maria Pereira Freire Flávia Linhalis Arantes Jan Breuer (Universidade de Siegen, Alemanha) Renato César Alves de Oliveira (bolsista BAEF)
  • 53. • Espaço para escrever, desenhar, colar fotos, acrescentar links – registrar e produzir informações com diferentes tipos de mídias • Multimodal: – Texto – Imagem – Desenho com caneta – Links (áudio, vídeo) • Multiplataforma: – Celular  toque – Tablet  caneta – Desktop / laptop  mouse e teclado Editor multimodal
  • 54.  Textos produzidos atualmente são semelhantes aos que circulam em redes sociais  com diferentes tipos de mídias • Ampliar o alcance das atividades em sala de aula e dar suporte para a elaboração de textos multimodais, compatíveis com práticas atuais • Alunos poderão enviar textos multimodais feitos em sala de aula para o TelEduc e vice-versa Motivação
  • 55. Desenvolver um editor multimodal (com suporte à escrita, desenho, imagem, links) em HTML5 para elaboração de textos multimodais, visando integrar funcionalidades de dispositivos móveis ao ambiente TelEduc, tendo em vista o desenvolvimento de uma nova aplicação educacional. Objetivo geral do projeto
  • 56. • Permitir múltiplas possibilidades de registro e contribuir: – com a inserção contextualizada de dispositivos móveis nas práticas educacionais; – com a integração de uma ferramenta inovadora, compatível com as demandas atuais de utilização da web, na plataforma TelEduc; – para estreitar as maneiras como alunos e professores interagem com conteúdos educacionais. Contribuições esperadas
  • 57. • Decisões de implementação – Canvas com XML vs. SVG (Scalable Vector Graphics) • Dinâmica para levantamento de requisitos e avaliação de viabilidade Ações realizadas
  • 58. • Participantes: 13 estudantes de ensino médio, graduação e pós- graduação • Cada participante tinha um dispositivo móvel em mãos: 3 laptops, 4 tablets, 3 celulares. • Fase 1: apresentação de uma aula com lousa, projetor e voz. – Participantes assistiram à aula e tomaram nota com seus dispositivos – Discussão e questionário sobre as anotações realizadas • Fase 2: Elaboração de um documento no Power Point usando os dados capturados – Grupos formados por um estudante de cada dispositivo – Discussão e questionário sobre e elaboração de um texto multimodal Dinâmica
  • 59. • Avaliação de viabilidade – Análise dos dados da dinâmica • Documento de requisitos – Análise dos dados da dinâmica • Implementação multiplataforma – SVG – HTML 5 Estado atual
  • 60. • Acessar o editor multimodal – Logar no teleduc e ter uma ferramenta • Limitações no tamanho da tela – Criar um app • Dependente de plataforma • Como integrar o editor multimodal no TelEduc – Criar uma ferramenta – Usar como um editor comum (como CK Editor) Desafios
  • 61. • Pesquisa sobre os dispositivos móveis em sala de aula, na visão do professor • Estudo sobre os tipos de dispositivos e editores disponíveis Desdobramentos / Demandas