Upload
andre-constantino-da-silva
View
515
Download
2
Embed Size (px)
Citation preview
Mouse+Teclado x Toque+Canetaas 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, primeiramentena 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 sistemasInterativos
– 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óriaMultiplataforma 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
CelularDispositivos sensíveisA toque
Windows Vista OS
Problema do Fat Finger na Seleção de um Item do Menu
Problema de Consistência
Problemas Identificados Problema
IdentificadoCelular
sensível ao toque
Tablet PC Desktop
1 Problema do dedo gordo
Sim Sim Não
2 Uso de Mouseover Sim Sim Não3 Integração com
gestosSim Sim* Não
4 Gap entre as funcionalidades do
dispositivo
Sim Não Não
5 editor de texto rico Sim Não Não6 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
12
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 InkBlogInkEditor
A Ferramenta InkBlog
Safari/iPhone
InkBlog
Android
A Arquitetura da ferramenta Weblog
id Weblog Architecture
Client
Browser
Serv er
presentation layer
system layer
IWeblogSystem
POST - HTML
A Arquitetura da ferramenta InkBlog
id InkBlog Architecture
Client
Browser
InkEditor
InkRenderer
Serv er
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 PesquisaMobilidade 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 MultimodalEquipe
André Constantino da SilvaFernanda Maria Pereira Freire
Flávia Linhalis ArantesJan 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!