Baixe o app para aproveitar ainda mais
Prévia do material em texto
e-Book 2 Maria Goretti Menezes Miacci INTERFACE, NAVEGAÇÃO E INTERAÇÃO Sumário INTRODUÇÃO ������������������������������������������������� 3 DESIGN DE INTERAÇÃO ��������������������������������� 5 Feedback de design de interação na gamificação ������������� 6 Prototipação de tecnologias assistivas com robôs e ciborgues no design de interação �������������������������������������� 15 Realidade aumentada com sobreposição de elementos visuais no mundo real ��������������������������������������������������������� 31 Realidade virtual por meio de simuladores digitais ��������� 37 CONSIDERAÇÕES FINAIS ����������������������������42 REFERÊNCIAS BIBLIOGRÁFICAS & CONSULTADAS ��������������������������������������������43 3 INTRODUÇÃO Neste e-book você irá se deparar com a aplicação do design de interação, que envolve profissionais da área de Interação Humano ao Computador (IHC), web designers, especialistas em usabilidade, designers instrucionais e engenheiros de software, entre outros� É necessário que você entenda a pre- ocupação com a forma de interação entre pessoas e tecnologias, com base nas diversas atividades e contextos que atuam� O feedback interativo permite que as respostas dos usuários ajudem a aprimorar cada vez mais os cenários digitais envolvidos na heterogeneidade das informações, para criar, desenvolver, manipular, divulgar ou compartilhar dados� Portanto, diante dos avanços tecnológicos, destaca-se a estrutura da gamificação� Salgado (2020) explica que a cibercultura é a cultura contemporânea, que acompanha as mudanças das atividades humanas, e o ciberespaço é o conjunto de computadores conectados pela internet� Desse modo, temos o desafio de despertar o interesse dos usuários para se manterem permanentemente on-line, deixando de ser apenas espectador e trans- formando-se em usuário ativo e interagente� Isso nos remete, portanto, às tecnologias assistivas 4 no processo de interação, através de softwares e aplicativos, ciborgues e robótica� Nos ambientes virtuais tridimensionais, a intenção é produzir experiências únicas e estimular visual- mente o usuário, assim precisamos conhecer essas diferenças de conceitos� A realidade aumentada tem como finalidade sobrepor a uma imagem da realidade os elementos digitais e a realidade virtual faz uso das simulações, sendo uma abordagem definida pela importância da criação para facilitar a capacitação e treinamentos em ambientes diversos� 55 DESIGN DE INTERAÇÃO Numa perspectiva de design de sistemas intera- tivos centrados no usuário, Benyon (2011) afirma as seguintes preocupações: y Ajudar a acessar, aprender e lembrar do sis- tema – na visibilidade (tornar visível ou observá- vel através de som ou toque), consistência (usar características com base no método padrão), familiaridade (uso de linguagem e símbolos co- nhecidos) e affondance (propriedade das coisas e como devem ser usadas); y Dar a sensação do controle “de como e do que” – navegação (permite a movimentação no sistema), controle (determinar perfis dentro do sistema) e retorno (feedback, resposta interativa recebida do usuário); y Garantir segurança – recuperação (agilizar de forma rápida e eficaz as ações) e restrições (para evitar ações inadequadas); y Satisfazer a execução – flexibilidade (per- mitir personalizar o sistema), estilo (elegantes e atraentes) e sociabilidade (participação e uso de tecnologias interativas)� 66 FEEDBACK DE DESIGN DE INTERAÇÃO NA GAMIFICAÇÃO Entende-se por feedback a retroalimentação ou a devolutiva dos resultados das características interativas das mídias e tecnologias� De acordo com Bates (2017), destaca-se a dimensão de in- teratividade com o controle, ou seja, determina-se até que ponto a interação é controlada com habi- lidade pela tecnologia, pelos criadores ou pelos usuários, sendo: y Interatividade inerente – baseada no processo de aprendizagem adaptativa behaviorista, o usuário precisa reagir, ou seja, para progredir precisa-se realizar um teste para avançar para a próxima fase� y Interatividade projetada – baseada em inserir uma intervenção para projetar interatividade nas atividades ou para coletar feedbacks, exemplo: podcast� y Interatividade gerada pelo usuário – baseada na interação explícita voluntária do usuário ao reagir cognitivamente, porém dificulta monitorar ou avaliar a interação� A interação e o feedback, afirma Bates (2017), são essenciais em relação às atividades on-line por permitirem retorno instantâneo do usuário� Exis- te a necessidade de se automatizar o feedback, conforme as características das interações das 77 mídias e tecnologias, conforme podemos notar na tabela a seguir: Tabela 1: Mídias e interações do usuário – como estudante� Tipos de interação INERENTE PLANEJADA MATERIAIS GERADOS Materiais dos alunos Aprendizagem adaptativa, xMOOCs (usam transmissão de vídeo), simu- lações, mun- dos virtuais e e-books� e-books� AVA – Ambiente Virtual do Alu- no, podcasts Transmis- sões de TV, podcast, vídeos do YouTube Aluno– pro- fessor Seminários presencias, roda de conversas online, lives e webinários Fóruns de discussão online, aulas presenciais, encontros com vídeo chamada e portfólios e-mail, e-portfólio e vídeo cha- mados pelas plataformas: Zoom, Meet, Teams� Professor- -aluno cMOOCs (são exemplo claros de grupos de aprendizagem autogeridas que usam mídias sociais) e Mun- dos Virtuais Trabalho co- laborativo em grupo Mídias so- ciais e wikis Fonte: Adaptado de Bates (2017, p� 351) Assim, segundo Bates (2017), existem três ma- neiras diferentes de manter o usuário “ativo” em sua interação em um ambiente de aprendizagem: interação com materiais de aprendizagem, interação entre alunos e professor e interação aluno-aluno� 88 Filatro e Cairo (2015) afirmam que, quanto mais interativo, maiores as chances de envolver o usuário, com interações significativas para a construção do conhecimento� A seguir, estão listados os níveis de interação: y Interatividade mínima – formato linear: apre- sentações em slides; y Interatividade reativa – formato responsivo e fechado: atividades com questões objetivas; y Interatividade proativa – formato manipulável, com alteração de parâmetros: animações digitais e simulações; y Interatividade mútua – formato trilha ou percur- so personalizado de acordo com o desempenho: jogos educacionais� O processo de design de interação, de acordo com Segurado (2015), acontece em três atividades: entendimento, observação e visualização� Logo, o processo geral do design será dividido em quatro atividades: y Antecipação – etapa de visualização para a escolha da mídia adequada, desde esboços e protótipos a maquetes e cenários� y Avaliação – etapa mais importante, pois consiste em tudo que será avaliado, principalmente quanto à verificação do design e resumo dos requisitos� y Entendimento – etapa para decidir como fazer, ser e encaixar-se entre os usuários e os contextos; 99 determina as oportunidades e restrições, gerados os requisitos funcionais e não funcionais, que defi- nem aquilo que o sistema será capaz de executar� y Design – etapa que cuida do design físico (ideia concreta, como aparência e percepção do produto), e conceitual (ideia abstrata para definir o produto). Segundo Segurado (2015, p� 159), existem três componentes do design físico: “Design operacional – especifica como tudo funcio-na e como o conteúdo é estruturado e armazenado� Design representacional – escolhe cores, formas, tamanhos e layout da informação, ou seja, está preocupado com estilo e estética� Design de interação – está preocupado com a dis- tribuição de funções para as pessoas que usarão ou para a tecnologia, além de se preocupar com a estruturação e sequência de interações�” Outro ponto importante é considerar personas (pessoas que usarão o sistema: os usuários) e ce- nários (descrição narrativa informal, que incorporacontextos, necessidades e requisitos)� Assim, os desafios e abordagens do design baseados em ce- nários, quanto aos requisitos e possibilidades que afetam as tarefas e artefatos, podem considerar: y Ação x reflexão – descrições com base nas experiências do usuário; 1010 y Fluidez do problema – cenários concretos abertos para revisão (interpretação e solução); y Fatores externos restringidos – cenários para a atividade dos artefatos projetados com a parti- cipação dos usuários no ciclo de vida útil; y Modificação e efeitos – cenários com múltiplos níveis, perspectivas e propósitos� y Conhecimento científico sem aplicação – ce- nários categorizados e abstratos� De acordo com Segurado (2015), os cenários podem variar, para ajudar num registro personalizado de uma perspectiva, como em workshops ou entre- vistas� Estão divididos em: y Histórias – são experiências reais das pessoas, como aquelas que estamos acostumados a contar; y Cenários conceituais – são descrições mais abstratas; y Cenários concretos – são gerados a partir dos abstratos, acrescentando decisões de design e tecnologias específicas; y Casos de uso – são cenários concretos que podem ser usados como casos de uso� Segurado (2015, p. 165) afirma que é importante haver organização, sendo crucial desenvolver-se um conjunto ou corpus de cenários para demons- trar diferentes aspectos ao se alinhar as principais funções do sistema e os eventos que englobam as 1111 funções, permitindo assim que, na linguagem de design, as pessoas aprendam um número limitado de elementos de design, para que possam lidar com uma grande variedade de situações� De acordo com Prensky (2012, apud FILATRO; CAI- RO, 2015), dispomos de uma variedade de estilos de jogos, tais como: y Fatos – leis, políticas, especificações de produ- tos: game shows, mnemônicos (frases, palavras e imagens) e jogos de cartas, de esporte e de ação; y Habilidades – entrevistas, vendas, operação de máquina e equipamentos, gerenciamento de projetos: role-playing games, jogos de estado per- sistente, de aventura e de detetive; y Julgamento – decisões gerenciais, timing, ética, contratação: role-playing games, interação multiplayer (compartilhar entre jogadores), jogos de aventura, de detetive e estratégicos; y Comportamentos – supervisão, exercícios de autocontrole, exemplos de cenário: role-playing games; y Teorias – lógica de marketing, como as pes- soas aprendem: simulações abertas e jogos de construção e de realidade; y Raciocínio – pensamento estratégico, tático e análise de qualidade: puzzles; y Processo – auditoria e criação de estratégia: simulações, jogos de aventura e estratégicos; 1212 y Procedimentos – montagem de equipamentos, operações bancárias, procedimentos legais: jogos cronometrados e de reflexo; y Criatividade – invenção e design de produtos: puzzles e jogo de invenção; y Linguagem – acrônimos, línguas estrangeiras, jargão de negócios ou profissional: role-playing games e jogos de reflexo e de cartas; y Sistemas – assistência médica, mercados e refinarias: simulações; y Observação – estados mentais, moral, ineficiên- cias, problemas: jogos de concentração e aventura; y Comunicação – linguagem apropriada, timing, envolvimento: role-playing games e jogos de reflexo. Filatro e Cairo (2015) determinam alguns movi- mentos na busca de jogos com propósitos mais explícitos: y Jogos sérios (serious games): com narrativas e simulação sobre experiência para construir uma compreensão de um tópico; y Jogos baseados em narrativas: com impacto emocional e resgate dos conteúdos� Os Role-Playing Games (RPG), com o uso de um personagem, atra- vés de ações, escolhas e atributos de narrativas, permitem construir uma história; y Jogos persuasivos: com parceria do jogador e suas opiniões, constrói argumentos sobre um sistema funcional do mundo real; 1313 y Jogos de realidade alternativa (ARGs – Alter- native Reality Games): combinam o mundo real com universos ficcionais e virtuais. Na gamificação podemos ter uma exploração clara dos princípios do feedback, afirma Prensky (2012). Através de jogos que envolvem e atraem, essa atra- ção pode ser na forma de diversão e brincadeiras, tais como: regras; metas ou objetivos; resultados e feedback; conflito, competição, desafio e oposição e interação e representação do enredo� Logo, a principal característica do feedback nos jogos digitais é quando há mudanças em respos- ta às ações, enviando-se uma resposta imediata� De acordo com Prensky (2012), determina-se o negativo e o positivo quando ocorrem: y Penalidades – seguindo ou quebrando das regras; y Quente ou frio – aproximando-se ou distan- ciando-se dos objetivos; y Tabelas com pontuação – andamento ou fe- chamento da competição� Prensky (2012) destaca três tipos de feedback nos jogos digitais, quanto à pontuação numérica, comando de voz e vibração do controle (joystick)� Percebe-se que o feedback dos jogos digitais tem por finalidade aprimorar e fazer com que o jogador continue a explorar sua experiência� Na prática, 1414 o jogo funciona da seguinte forma: aprender continuamente, entender o modelo usado pelo desenvolvedor, obter êxito, chegar ao próximo nível para vencer, receber recompensas, controle absoluto de algo, receber mensagens de falhas, permissão de inúmeras tentativas e possibilidade de ativar a ajuda� Portanto, cita Prensky (2015, p� 176), dependendo do jogo digital, podemos obter um feedback es- pecífico, sendo “extremamente dramático (bater ao aterrissar, a explosão de galáxias inteiras, ou ‘pacientes mortos e grande estardalhaço’, criação de Sharon Stansfield), divertido (o marinheiro de Monkey Island que diz ‘Não!’), ou mais sútil (a música em The Sim)”� As principais técnicas de aprendizagem interativa usadas em jogos digitais, segundo Prensky (2015), são: prática e feedback; ou seja, aprender na prá- tica e com os erros; aprendizagem guiada por metas, descobertas, tarefas, perguntas; contextos; construtivistas e acelerada (múltiplos sentidos); role-playing (simulação de situações); inserção de objetos de aprendizagem e instrução inteligente� Filatro e Cairo (2015) destacam os seguintes princípios de aprendizagem com jogos digitais: codesign (cocriam o mundo); ciclos de expertise (específico para o domínio da prática automática); 1515 customização; informação sob demanda e na hora certa; identidade; aquários (prévia do siste- ma); manipulação; tanque de areia (existência de espaços seguros); problemas bem estruturados; habilidades com estratégias; frustração confor- tável; pensamento sistêmico e significado com imagem de ação� Existem três maneiras de realizar jogos digitais desafiadores e que possam contribuir com a aprendizagem educacional: alinhar jogos comer- ciais aos conteúdos escolares; desenvolver jogos totalmente novos, porém paralelos com o currículo escolar multidisciplinar, e procurar gamificar solu- ções existentes� Diante do design de interação na gamificação, percebe-se a arte de fornecer feedbacks aos joga- dores (usuários) e como é importante balancear a frustração ou o sucesso entre os níveis desafia- dores de facilidades ou dificuldades, para, assim, mantê-los em fluxo contínuo quanto ao jogo, numa prática repetitiva� PROTOTIPAÇÃO DE TECNOLOGIAS ASSISTIVAS COM ROBÔS E CIBORGUES NO DESIGN DE INTERAÇÃO A prototipação, de acordo com Segurado (2015), consiste em concretizar um sistema ou produto 1616 através de protótipos, que podem ser maquetes, layouts de telas de software, imagem, simulação em vídeo e storyboard (imagem que retrata uma versão semelhante do produto finalizado). Figura 1: Protótipo de baixa fidelidade: conhecido como storybo- ard, com característica proof-of-concept (demonstração do conceito funcional)� Título: TAXONOMIA DE BLOOM Designer Instrucional: <nome: Nº da tela: 1 Data: dd/mm/aaaa Informações para a equipe de produção: Professor Conteudista:enviar o logotipo, tema e os subtemas, sugeriu-se o uso de pirâmides e lâmpada; Designer Gráfico: elaborar ou obter imagens para incorporar o logotipo ao projeto conforme os elementos sugeridos� Analisar o modelo de pirâmide quanto à navegabilidade e usabilidade, escolher a fonte e as cores e inserir recursos de acessibilidade para aumentar a visibilidade das telas; Editor de som: gravar o texto falado para o usuário ouvir as teorias; Revisor: verificar a gramática e a ortografia da tela depois de pronta; Programador: definir a movimentação para cada tela e ativar a função on mouse quando o mouse passar pela imagem aparece a definição; Designer Instrucional: obter a aprovação do layout proposto� LOGOTIPO DA EMPRESA TEXTO SOBRE A TELA DE ABERTURA DA TAXONOMIA DE BLOOM TAXONOMIA DE BLOOM RECURSOS DE ACESSIBILIDADE FUNÇÃO ON MOUSE SOBRE O TEXTO QUE VAI APARECER QUANDO O MOUSE PASSAR POR CIMA DA PALAVRA TAXONOMIA DE BLOOM Inserir a legenda explicativa da tela CRIAR AVALIAR ANALISAR APLICAR ENTENDER RELEMBRAR Fonte: Adaptado de Segurado (2015)� 1717 Figura 2: Protótipo de alta fidelidade: conhecido como look and feel, para ter uma ideia do produto finalizado; portanto, torna-se interativo quanto ao usuário, navegação, exploração e teste, porém requer tempo num desenvolvimento mais caro e não só coleta os requisitos� No centro da tela tem uma pirâmide central dividide de acordo com a taxonomia de Bloom, assim quando o mouse passar pelas palavras abrirá uma caixa de texto, explicando a função ao formular uma questãoSom RETORNAR AVANÇAR A TAXONOMIA DE BLOOM É APLICADA PARA DETERMINAR O NÍVEL DE DIFICULDADE DE CADA QUESTÃO CRIAR AVALIAR ANALISAR APLICAR ENTENDER RELEMBRAR PRODUÇÃO DE NOVOS SABERES AS QUESTÕES COSTUMAM SER MAIS DIFÍCEIS JULGAMENTO DE SABERES ABORDADOS AS QUESTÕES COSTUMAM SER DIFICULDADE MÉDIA APREENSÃO DE SABERES ABORDADOS AS QUESTÕES COSTUMAM SER MAIS FÁCEIS TAXONOMIA DE BLOOM Fonte: Adaptado de Segurado (2015)� Os stakeholders são a engrenagem do processo� Trata-se das pessoas envolvidas no plano de negó- cio, como gerentes, chefes, clientes, investidores etc. Segurado (2015, p. 159) afirma: “é um termo usado para indicar todas as pessoas (públicos) que se relacionam com a empresa e serão afetadas por qualquer sistema que resulte do processo de design de sistemas interativos”� Também os dispositivos ou periféricos podem usar fichas (composto de: atividade, subatividade, 1818 ação, objeto e comentário), conforme Segurado (2015), sendo necessários para que se documente e acompanhe as análises do objeto/ação e como interagem com o cenário� De acordo com Segurado (2015, p� 169), o modelo conceitual é “uma ferramenta poderosa para ajudar o designer a pensar nos detalhes e ver mais cla- ramente se a lógica do design funciona”� Para um aprofundamento desta teoria, sugere-se a utilização de softwares de modelagem Unified Modeling Lan- guage (UML – Linguagem de Modelagem Unificada), que são ferramentas Computer-Aided Software Engineering (CASE) e encontram-se em versão free community (aberta), como os softwares Astah (https://astah�net/products/free-student-license/) e Visual Paradigma (https://www�visual-paradigm� com/download/), que auxiliam as representações gráficas nos seguintes formatos: diagrama de classe (atributos e operações), diagrama de es- tado (transição comportamental), diagrama de atividades (fluxo de controle) e diagrama de use cases (usuário e a interação com o cenário), entre outros� Tais diagramas, por meio das similaridades e diferenças técnicas a serem implementadas, viabilizam o planejamento e criação de melhores visualizações das futuras interações� 1919 Figura 3: Exemplo de diagrama de máquina de estado sobre imagem� SUSPENSO PRONTO EXECUTANDO SUSPENSO ESPERA COMPLETO Fonte: Adaptado de https://commons�wikimedia�org/ Saffer (2007, apud SEGURADO, 2015, p� 169) apon- ta seis elementos-chaves de design de interação abstrata para o design físico concreto quanto à estruturação e suas sequências lógicas: “1� Movimento – objetos que não se movem, não interagem� 2� Espaço – o movimento acontece no espaço, design de interação implica a combinação dos espaços físico e digital� 3� Tempo – movimento por meio do espaço leva tempo e todas as interações acontecem no decorrer do tempo, o tempo cria o ritmo� 4� Aparência – proporção, estrutura, tamanho, forma, cor� 5� Textura – variáveis como vibração, aspereza, suavidade� 6� Som – grave, agudo, volume, timbre�” 2020 Portanto, afirma Segurado (2015), a linguagem de design consiste em levar o usuário a explorar inconscientemente, lidar com uma lista de instru- ções, ou improvisar para lidar com informações incompletas, destacando-se: y Caracterização – descrever suposições exis- tentes e preexistentes; y Registro – criação de novas suposições com base nas tendências e pesquisas de campo; y Desenvolvimento e demonstração – usar técnicas de antecipação, como storyboards e protótipos, entre outros; y Avaliação – registrar as reações e evoluções� O design de interação é importante para tornar o ambiente computacional adaptável, quanto aos recursos de hardware e software para a educação especial, por meio das tecnologias assistidas, dentro de um processo cognitivo e inclusivo, a fim de explorar o uso do computador� Segundo Costa (2020), possibilita-se maior mobilidade, intera- ção, aprendizagem e autonomia para as pessoas com deficiência (PcD), adaptados para diferentes atendimentos: y Deficiência auditiva – contemplar o processo de disponibilizar e relacionar os recursos e pro- gramas entre a Língua Portuguesa e a Linguagem Brasileira de Sinais (Libras)� 2121 y Deficiência visual – disponibilizar programas com sintetizadores de voz� y Mobilidade reduzida – ampliar, pelo uso do computador, as possibilidades de autonomia pela comunicação, escrita e acesso de informação� y Altas habilidades/superdotação – usar o computador como ferramenta para ampliação e pesquisa aos desafios intelectuais. No design de interação, precisamos entender como as tecnologias estão sendo integradas no software ou no site, para que possam ser padronizadas, juntamente às suas normas de uso� A seguir, destacamos alguns formatos específicos para a pessoa com deficiência auditiva, com o uso de avatares em LIBRAS (apesar de receber críticas da área educa- cional, devido ao avatar não expressar sentimentos em sua face, exigência do intérprete de LIBRAS): VLIBRAS: https://www�vlibras�gov�br/ WIKILIBRAS: https://wiki�vlibras�gov�br/ HANDTALK: https://www�handtalk�me/br/aplicativo RYBENÁ: https://portal�rybena�com�br/site-rybena/ Na prática, o usuário possui acesso às tecnologias assistivas, mas que ainda são desconhecidas e SAIBA MAIS 2222 pouco exploradas� As imagens a seguir exempli- ficam um recurso de digitação automática para se realizar no editor de texto, on-line e off-line, através de um ditado, viabilizando a escrita de textos sem a utilização das mãos� Cabe ao design de interação o desafio de tornar esses recursos mais visíveis para todos� Figura 4: Recurso de ditado por meio do microfone no software Microsoft Word (off-line) 1 - Guia > Página Principal > microfone DITAR Bolinha vermelha – significa que está liberado para falar as palavras – acompanhe o cursor 2 - Clicar no microfone para ativar o modo de captação de voz e conversão em escrita Fonte: Elaboração própria� 1- Menu > Ferramentas > Digitação por voz 2- Aparece do lado esquerdo da sua tela a imagem do microfone� Para iniciar a captação de voz, basta clicar� 3- O microfone, ao captar a sua voz, sinaliza em vermelho, conforme a imagem, e na posição em 2323 que o cursor está no texto realiza a conversão da palavra falada em digitada� Figura 5: Recurso de ditado por meio do microfone no software Google Documents (on-line)� 1 - Menu > Ferramentas > Digitação por voz 2- Aparece do lado esquerdo da sua tela a imagem do microfone� Para iniciar a captação de voz, basta clicar� 3 - O microfone, ao captar a sua voz, sinaliza em vermelho, conforme a imagem, e na posição em que o cursor está no texto realiza a conversão da palavra falada em digitada� Fonte: Elaboração própria� Para um melhor esclarecimento sobre o conceito da tecnologia assistiva, Hogetop e Santarosa (2021, p. 2) afirmam: “No Brasil, vários termos têm sido adotados para denominar os novos artefatos tecnológicos, que visam a potencializar as capacidades das pessoas 2424 com qualquer tipo de “deficiência”, entre os quais, Tecnologia Adaptativa ou Tecnologia Assistiva, conforme a influência da abordagem europeia ou norte-americana� Como a intenção deste trabalho é colocar diante do leitor, profissionais da área de Educação Especial, pais e PNEEs, um quadro ex- plicativo e abrangente dos avanços trazidos pelas Tecnologias às pessoas com deficiência, usaremos os dois termos concomitantemente� Na verdade, embora sejam utilizados os diferentes termos, o objetivo é um só, eliminar barreiras de acesso ao mundo às pessoas com dificuldades, propondo soluções para os mais distintos tipos de necessi- dades especiais, sejam no âmbito das deficiências físicas, mentais ou sensoriais�” Kleina (2012) destaca algumas tecnologias as- sistivas no formato de programas (software) e equipamentos (hardware), tais como: y Hardware: vEye (olho virtual); pulseira que vibra em trajeto denominado pelo PcD; brain computer interface (BCI) – cérebro comunica com o computador; mouse ocular – captura e codifica movimentos e piscadas do globo ocular para comandos; câmera mouse – movimentar o mouse e o teclado por meio da webcam); mouse lupa – serve para ampliar a tela do computador; máquina de relevos táteis – com o tato gera o 2525 material impresso; mousenose – movimentação do mouse com movimentos da cabeça� y Software: Sistema Falibras – captura a fala das pessoas através do microfone e demonstra a interpretação em libras); Voz do Mundo – de- codifica libras para se comunicar; braille falado (permite editar texto)� Segundo Salgado (2020, p� 170), “o modo de dia- logar com a máquina passa por interfaces físicas e gráficas de alta tecnologia”, algumas conexões humano e máquina que podemos citar são: y Câmeras – perceber e distinguir qualquer movimento, captar presença, identificar cores e padrões e reconhecer faces� y Microfones – captar sons e suas qualidades quanto a altura, intensidade e timbre� y Sensores – detectar presença, movimentos e toque, temperatura, umidade e fluxo de captação sonora; como a tecnologia de um display eletrônico touch screen – toque na tela sensível do dispositivo –, entre muitos outros� Ainda segundo o autor, podemos explorar no design de interação o conceito de ciborgue� Con- siderando-se o entrelaço entre o corpo humano e a tecnologia, vivencia-se uma conexão híbrida, incorporando características humanas diferentes, porém ampliada do ponto de vista físico, mental 2626 ou de sentidos; assim, na cibercultura, detecta- mos como as tecnologias assistivas interagem no modo de ver e tratar o corpo, como retratado na imagem a seguir: Figura 6: Tecnologias assistivas – soluções cibernéticas� Dispositivo de mobilidade robótica – possibilita a um cadeirante ficar na posição ereta, para realizar atividades cotidianas� Pé inteligente – desenvolvido pela empresa Ossur, realiza movimentos do tornozelo com levantamento do pé (permite o uso de saltos) Prótese com bluetooth – com ênfase no joelho, para facilitar a caminhada, pulos, subida e descida (escada e rampas)� Cadeira de rodas movida por sopro ou sucção – pesquisa da Universidade Estadual de Londrina (UEL), visa à autonomia� Fonte: Adaptado de Costa (2020, p� 253-256)� 2727 Também é preciso definirmos no design de intera- ção a importância da robótica e compreendermos a definição do robô. Salgado (2020, p. 181) define “o robô como um aparato tecnológico, antropomórfico ou não, capaz de executar tarefas programadas e controladas por computador automaticamente ou por controle externo”� Na Figura 7, temos uma importante plataforma de prototipagem para os projetos robóticos eletrônicos, um hardware e software livre (código aberto) de robótica simples que se chama Arduino, composto de uma placa única e microcontrolador Atmel AVR (chip de 8-bit, entrada/saída, linguagem C/C++)� “Com este hardware, é possível gerenciar diversos sensores, capazes de captar presença, condições do ambiente – como temperatura e umidade, varia- ções de luz, entre muitas outras possibilidades� Por meio do software Arduino, é possível automatizar tarefas e enviar informações para outros softwares (SALGADO, 2020, p� 185)�” 2828 Figura 7: desenho da placa e circuito Arduino� Fonte: Imagens de Seven_au e manseok Kim por Pixabay� É essencial que se esteja plugado a um computa- dor para que se possa fazer o processamento de entrada e saída de informações, que podem ser feitos através dos periféricos com as tecnologias assistivas� Kleina (2012) em sua pesquisa cita alguns equipamentos (hardwares) adaptados para PcD, tais como: “Miniteclados ou palmtops (adequação para distrofia muscular progressiva); colmeia de acríli- co (encaixa-se no teclado padrão para deficiência física grave); mouse óptico formato luva; mouses especiais easyball, TrackBall, roller mouse e joysticks (trackers) formato maior, funcionam como mouses convencionais; dispositivos de acesso imediato (switches) com interruptores para apertar, soprar, neuromuscular, sensor, inclinação e de pressão; switch mouse com acionadores e interruptores); roller mouse (4 teclas) acionados pelas mãos ou pés; Braille falado (escrever, imprimir textos, tem agenda eletrônica e calculadora, conectado ao com- 2929 putador pode ser usado como sintetizador de voz e transferência de arquivos); terminal Braille mostra caracteres em uma ou duas linhas das informações exibidas na tela do computador; impressora Braille; scanner (escaneia um texto para ouvir através do software de sintetizador de voz)�” Por fim, outro ponto importante do design de interação é a consulta obrigatória aos guias de acessibilidade web, pois podemos obter ações de validação, avaliação, verificação e simulação de acessibilidade durante a construção de páginas web para obter bons resultados no uso da padro- nização do HyperText Markup Language (HTML – Linguagem de Marcação de Hipertexto), como: y O primeiro avaliador de acessibilidade foi cha- mado de “DaSilva”; y Avaliador e Simulador de Acessibilidade em Sites (ASES): http://asesweb�governoeletronico� gov�br/ases/; y Avaliador do Avaliador do Movimento Web para todos (MWPT): http://mwpt�com�br/transformacao/ teste-acessibilidade/ y Acessibilidade legal: http://www�acessibilida- delegal�com/13-guia�php A finalidade maior do design de interação é projetar sistemas interativos com qualidade e que melhorem o desempenho humano� Para isso ocorrer, segundo http://asesweb.governoeletronico.gov.br/ases/ http://asesweb.governoeletronico.gov.br/ases/ http://mwpt.com.br/transformacao/teste-acessibilidade/ http://mwpt.com.br/transformacao/teste-acessibilidade/ http://www.acessibilidadelegal.com/13-guia.php http://www.acessibilidadelegal.com/13-guia.php 3030 Shneiderman e Plaisant (2005), determinam-se oito regras essenciais, sendo: 1) Manter a consistência; 2) Inserir atalhos; 3) Oferecer feedbacks informativos; 4) Projetar diálogos; 5) Elaborar estratégias para prevenir e recuperar os erros; 6) Encaixar possibilidades de reversão das ações; 7) Ter uma localização exata do controle; 8) Diminuir a carga de memória a curto prazo� Com o objetivo de melhorar e contribuir para a vida das PcD, “princípios inclusivos tais como autono- mia, independência, equiparação de oportunidades, qualidade de vida, entre outros, vieram fortalecer tais perspectivas e desmistificarpreconceitos de incapacidade ainda existentes” (HOGETOP; SANTA- ROSA, 2021, p� 17), trata-se da abordagem de um bom desenvolvimento de um design de interação para criar programas e equipamentos adequados, de acordo com a constante evolução tecnológica� 3131 REALIDADE AUMENTADA COM SOBREPOSIÇÃO DE ELEMENTOS VISUAIS NO MUNDO REAL De acordo com Filatro e Cairo (2015, p� 264), “realidade aumentada pressupõe visualização, computação de alto desempenho e transmissão de dados em alta velocidade visando à interatividade e à imersão”� Na realidade aumentada (RA) ocorre o enriquecimento do mundo real com elementos virtuais, projetando-se, por exemplo, objetos físicos ou holográficos de personagens 3D. Quanto ao livro 3D, uma das inovações tecnológicas de design de interação em ambientes tridimensionais, com RA e reconhecimento de gestos, conhecido como paradigma holográfico, podemos considerar as seguintes técnicas para um protótipo, conforme Pardinho e Tori (2011): y Técnica estereoscópica – causa uma sensação tridimensional alcançada por meio de óculos este- reoscópicos, ou seja, uma sensação dos objetos saltarem da tela� Logo, esse objeto tem que se apresentar inteiro, sem cortes na tela� Porém, apre- sentam-se problemas no suporte de baixa resolução e tamanho dos monitores entre 15 e 19 polegadas� Para ter mais legibilidade, contraste entre a folha branca do papel e as letras, apresenta-se erros na imagem e na calibração de cor, sombras entre a cor vermelha e azul, por isso recomendam-se as 3232 outras técnicas de estereoscopia, como polarizada passiva (usada nos cinemas 3D) ou polarizada ativa (usada com óculos obturadores, par de lentes de cristal líquido, com controle do computador para ficarem transparentes ou opacos). y Técnica com a linguagem processing – causa a visão estereoscópica e reconhecimento de gestos na leitura e manipulação; para isso, implementa-se cada página do livro real nas folhas do livro digital, em seguida nesse volume de páginas será possível transladar, rotacionar ou escalonar, abrir e fechar o livro 3D, e passar página por página, como se estivesse virando-as, ou pelo mouse ou pelas bordas do livro� Recomenda-se o uso dos óculos anaglifos para esse efeito� y Técnica com a linguagem processing e re- conhecimento de gestos – somente aplicada no momento de leitura; insere-se, portanto, na parte crucial do software e deve-se usar a calibração do sensor (Modelo da ferramenta Sensor Kinect da Microsoft); ocorre a interação do livro tridi- mensional utilizando-se as mãos virtuais, como se estivéssemos folheando suas páginas, com o gesto de virar a página para a esquerda ou para a direita; o software rastreia esse movimento� 3333 Figura 8: Óculos anaglifos utilizados para estereoscopia anaglifa� Fonte: Imagem de OpenClipart-Vectors por Pixabay� Conclui-se que a RA trata da recriação de ambien- tes� Conforme García, Ortega e Zednik (2017), desenvolvem-se aqueles locais distantes, ou com difícil acesso, como o interior de um vulcão, um passeio no espaço, andar na lua, nos desertos, imergir no fundo do mar, entre outras possibilida- des de ambientes para os cenários virtuais, com a importância de evitar expor os usuários aos perigos e impactos econômicos da vida real� Para Salgado (2020, p� 132), podemos obter um efeito nos movimentos que o usuário executa simultaneamente nas duas imagens, para que se tornem apenas uma: “para a experiência visual de uma realidade aumentada, é necessária uma tela em que o usuário possa visualizar as imagens sobrepostas, como a tela de um computador ou de um celular, ou até mesmo óculos especiais”� 3434 Na figura 9 temos um modelo de display de RA que inclui câmera� Figura 9: Display de RA� Fonte: Claus Norgaard por Pixabay� Para compreendermos o uso da RA da forma mais difundida, García, Ortega e Zednik (2017) destacam a explicação da RA a partir de uma imagem obtida através de um smartphone ou webcam focada com um marcador, de acordo com os seguintes passos: 1) Obter a imagem por uma câmera do smartphone ou webcam do computador; 2) Processar a imagem para encontrar um deter- minado marcador; 3) Os marcadores são predefinidos: no aplicativo com um identificador único (exemplo: ID=17) e o 3535 registro do seu tamanho no mundo real (exemplo: quadro 5 cm); 4) Com o marcador localizado, calcula-se onde se encontram as marcas em relação à disposição móvel (deslocamento: x, y e z e a rotação relativa); 5) Com esse ambiente 3D (posição da câmera e um objeto 3D), o programador define o ID 17 com objeto 3D, texto, vídeo, áudio, entre outros, insere-se na posição, escala e rotação desejada; 6) Definido o lugar do objeto, adicionam-se as interações, como pressionar uma tecla ou botão, aproximação de uma marca ou a realização de gesto� Logo, nota-se que o marcador pode ser uma imagem ou marcador típico de quadrados pretos e brancos, que permitirá ver o objeto 3D� São uma referência para unir na dimensão 3D o mundo virtual com o mundo real� O quick response code (QR CODE – código de resposta rápida), apesar da semelhança, não é uma Realidade Aumentada 3D. Eles fazem a função de codificar a informação em dimensão 2D (cadeia de texto) para di- recionar um dispositivo para uma página web (exemplo: usando um smartphone)� SAIBA MAIS 3636 Para Azuma (1997), pesquisador da Nokia Re- search Center Hollywood, destacam-se algumas características que o design de interação deve ter em relação à RA, como: combinar elementos reais e virtuais, ser interativo em tempo real e registrar em 3D� Design de interações nas aplicações t-commerce para tvdi A TV Digital Interativa (TVDi), também conhecida como smart TV, possibilita a interatividade através da cone- xão com a internet, sendo um veículo de comunicação com muitas possibilidades, inclusive nas aplicações comerciais, através de camadas, sem interromper a pro- gramação linear� Destacam-se dois modelos de design de interação nos aplicativos para a TVDi, realizadas por meio do controle remoto: - t-commerce: com base nas lojas on-line de e-commerce, navega-se em diversos produtos, que se permitem adi- cionar ou remover no carrinho de compras� O processo finaliza-se com a escolha da cobrança, através de um formulário ou inserção de dados do cartão� - Program related: propaganda integrada aos dados de vídeo que permanece oculta durante a programação da TV, até ser acionada pelo botão vermelho do controle remoto� A interface se sobrepõe ao vídeo de forma gradual, para exibir informações, por exemplo, sobre a roupa da personagem da novela� Ao clicar, aparece FIQUE ATENTO 3737 uma lista de produtos, detalhes, carrinho de compras e formas de pagamento� REALIDADE VIRTUAL POR MEIO DE SIMULADORES DIGITAIS Entender a criação de um ambiente virtual tridi- mensional computacional permite-nos uma imer- são multissensorial (visão, tato e audição), que proporciona vários potenciais benefícios como: aplicar treinamentos, gerar segurança física e um baixo custo no investimento� Por se tratar de uma simulação da execução de um projeto, o usuário apenas realiza a repetição várias vezes até a as- similação completa� Prensky (2012, p. 292) define o termo simulação das seguintes formas: • Qualquer criação sintética ou falsificada. • A criação de um mundo artificial que se aproxima do real� • Algo que cria a realidade do ambiente de trabalho (ou qualquer outro lugar)� • Um modelo matemático ou de algoritmo, aliado a um conjunto de condições iniciais, que permite a previsão e a visualização com o passar do tempo� 3838 A Figura 10 retrata um simulador de voo, composto de telas de computador de alta resolução (no lugar da janela real de um avião), sistemas estéreos (em alto falantes para a sensação de imersão) e pol- trona constituída de engrenagens como motores hidráulicos (simular turbulências e gravidades de modo parecido com uma situação real de voo)� Figura 10: Simuladorde avião� Fonte: Foto de verticallimit por Pixabay� Para os princípios de manipulação direta, a fim de projetarmos novos sistemas ou refinar sistemas existentes de realidade virtual, devemos levar em conta, conforme Shneiderman e Plaisant (2005), os seguintes pontos: usuários capazes de selecionar ações rápidas, controle incremental nas ações com reversibilidade e sinalizar o estado após uma 3939 ação, através de sons, atualizações das telas ou vibração dos periféricos acoplados� A tendência no mundo corporativo é incorporar tal tecnologia de simulação em treinamentos de gestão, tanto de baixa quanto de alta fidelidade. Segundo Prensky (2012, p� 297), “podem se trans- formar em jogos”� Logo, na função do design de interação, podemos usar bastante o recurso variado de narrativas sobre o contexto, para permitir que se simule planos de negócio e assim assuma-se papeis de proprietário virtual� Destacam-se: y Baixa fidelidade – poucos elementos da re- alidade; determina princípios gerais aplicados a uma variedade de situações e gera confusão nos detalhes em novatos� y Alta fidelidade – grande variedade de objetos virtuais para modelar a realidade; aplica os procedi- mentos reais para retratar os processos de trabalho e cria práticas concretas de uma situação real� Segundo Filatro e Cairo (2015), no design de inte- ração devemos levar em conta a produção multi- modal, pois permite informatizar a maneira com que o usuário realiza a leitura na mídia impressa para as telas do computador� Para isso, viabiliza- -se reconhecer padrões, para compreendermos o significado das suas composições quanto a: 4040 y Composição visual (disposição das imagens e elementos): destaca-se a linha, forma e cores; y Princípio Gestalt: trata-se de um conjunto de elementos para formar o todo, destacam-se a percepção visual (figura-fundo, proximidade, continuidade ou fechamento, alinhamento, simila- ridade, repetição e contraste), valor informacional (margens direita-esquerda, planos superior e inferior e centro-margens e elementos de saliência, para atrair a atenção dos usuários (enquadramento)� Por fim, Filatro e Cairo (2015, p. 269) destacam também a tecnologia API de experiência para aplicar os elementos dos simuladores, conhecida como internet das coisas (IoT): “rede de objetos conectados por meio de chips embutidos, senso- res ou minúsculos processadores, permitindo que informações sobre os objetos sejam transmitidas via internet”� Já Shneiderman e Plaisant (2005) destacam as possíveis adversidades e atenção na arquitetura de ambientes remotos: retardos, feedback incom- pleto, feedback de fonte múltiplas e interferências imprevistas� O MIT Education Arcade explica como funciona o projeto da universidade MIT, com o “Programa de Formação SAIBA MAIS 4141 de Professores MIT Scheller e The Education Arcade”� Tem propostas para crianças em uma aprendizagem baseada em jogos� Acesse: https://education�mit�edu/� O WCAG 2�0 é um site sobre a W3C com as diretrizes internacionais de acessibilidade para conteúdo web� Acesse: https://www�w3�org/Translations/WCAG20-pt-br/ WCAG20-pt-br-20141024/� No site do eMAG 3�1 temos as recomendações de acessibilidade para conteúdo web do governo brasileiro� Acesse: http://emag�governoeletronico�gov�br/� Em EPUB Accessibility 1�0 você encontra dicas para a criação de livros digitais no formato Electronic Publication (EPUB – Publicação Eletrônica)� Acesse: http://www� idpf�org/epub/a11y/accessibility�html/� 42 CONSIDERAÇÕES FINAIS Você entendeu que uma boa combinação de mídias e tecnologias pode garantir uma interatividade de alta qualidade e que afetará a forma de feedback� Portanto, afirma Bates (2017, p. 353), as “decisões de design tendem a ser mais importantes do que a escolha de tecnologia” no que se refere a buscar mais tempo nos desenvolvimentos das tarefas para os usuários e resultados diante da gamificação em jogos digitais� No estudo sobre prototipagem, análises e avaliações, podemos constatar a complexidade de inovação no design de interação, dada a importância de se aplicar constantemente testes e aperfeiçoamentos� Com base em cenários e personas, destacam-se os protótipos de baixa e alta fidelidade, logo o avanço importante quanto às tecnologias assistivas e o seu papel na inclusão de PcD no mundo digital, com o auxílio de softwares e aplicativos mobile, tecnologias ciborgues e robótica� A importância de entender as diferenças nos am- bientes virtuais, a utilização da realidade aumentada, numa visão real dos elementos visuais sobrepostos digitalmente, e a realidade virtual demonstra a par- ceria com as aplicações das simulações digitais, para objetos ou processos para treinamento, pois ambas, RA e RV, proporcionam uma vivência e ex- periência interativa de imersão digital ao usuário� Referências Bibliográficas & Consultadas AZUMA, R� T� A survey of augmented reality� Presence: Teleoperators and Virtual Environments, v� 6, n� 4, ago� 1997� BATES A� W� T� Educar na era digital: design, ensino e aprendizagem� Tradução João Mattar et.al� 1� ed� São Paulo: Editora Artesanato Educacional� 2017� BENYON, D� Interação Humano-Computador� 2� ed� São Paulo: Pearson Prentice Hall, 2011� [Biblioteca Virtual]� COSTA, M� T� de A� Tecnologia assistiva: uma prática para a promoção dos direitos humanos� Curitiba: Intersaberes� 2020� [Biblioteca Virtual] DELL, J� A� Digital Interface Design and Application� Nova York: Wiley, 2015� FALCO, M�; ZUANON, R� Design de interface de aplicativos t-commerce: transações comerciais na televisão digital interativa� 2013� 106 f� Dissertação (Mestrado em Design) – Universidade Anhembi Morumbi, São Paulo, 2013� FILATRO� A�; CAIRO, S� Produção de conteúdos educacionais� São Paulo: Editora Saraiva, 2015� GARCÍA, C� L�; ORTEGA, C� A� C�; ZEDNIK, H� Realidades virtual e aumentada: estratégias de Metodologias Ativas nas aulas sobre Meio Ambiente� Informática na educação: teoria & prática, Porto Alegre, v� 20, n� 1, jan-abr� 2017� GEEST, T� Web Site Design is Communication Design� Amsterdam: John Benjamins Publishing Company, 2001� HOGETOP, L�; SANTAROSA, L� M� C� Tecnologias assistivas/adaptativas: viabilizando a acessibilidade ao potencial individual� Disponível em: http://www�educadores�diaadia�pr�gov�br/ arquivos/File/artigos_edespecial/tecnologias_ assistivas�pdf� Acesso em: 01 fev� 2021� KLEINA, C� Tecnologia Assistiva em Educação Especial e Educação Inclusiva� Curitiba: Intersaberes, 2012� [Biblioteca Virtual]� LEE, V�; SCHNEIDER, H�; SCHELL, R� Aplicações móveis: arquitetura, projetos e desenvolvimento� Trad� Amaury Bentes e Deborah Rudiger� São Paulo: Editora Pearson e Makron Books, 2005� [Biblioteca Virtual]� LEMOS, A� Cibercultura e mobilidade: a era da conexão� Razón y palabra, n� 41� Disponível em: http://www�razonypalabra�org�mx/anteriores/ n41/alemos�html� Acesso em: 16 nov� 2020� LEUNG, L� Digital experience design: ideas, industries, interaction� [s�l�]: Intellect Books, 2008� MURRAY, J� Inventing the Medium: principles of interaction design as a cultural practice� Massachusetts: MIT Press, 2011� PRENSKY, M� Aprendizagem baseada em jogos digitais� São Paulo: Editora SENAC, 2012� PREECE, J� et al� Design de interação: além da interação homem-computador� Porto Alegre: Bookman, 2005� SAFFER, D� Designing for interaction: creating smart applications and clever devices� Indianopolis: New Riders, 2007� SALGADO, L� A� Z� Arte Digital. Curitiba: Intersaberes� 2020� [Biblioteca Virtual]� SEGURADO, V� S� (org�)� Projeto de interface com o usuário� São Paulo: Pearson Education do Brasil, 2015� [Biblioteca Virtual]� SHNEIDERMAN, S� B�; PLAISANT, C� Designing the user interface� 4� ed� Boston: Pearson Addison Wesley, 2005� Introdução Design de interação Feedback de design de interação na gamificação Prototipação de tecnologias assistivas com robôs e ciborgues no design de interação Realidadeaumentada com sobreposição de elementos visuais no mundo real Realidade virtual por meio de simuladores digitais Considerações finais Referências Bibliográficas & Consultadas
Compartilhar