FLARAS 1.0 Flash Augmented Reality Authoring System

Transcrição

1 FLARAS 1.0 Flash Augmented Reality Authoring System Raryel Costa Souza, Hipólito Douglas França Moreira, Claudio Kirner {raryel.costa, hipolitodouglas,

2 Trabalho desenvolvido na Universidade Federal de Itajubá (UNIFEI), durante as atividades das bolsas de iniciação científica dos alunos Raryel Costa Souza e Hipólito Douglas França Moreira, sob orientação do Prof. Dr. Claudio Kirner. Agradecemos à Fundação de Amparo à Pesquisa do Estado de Minas Gerais (FAPEMIG) pela concessão da bolsa de iniciação científica que possibilitou a realização desse trabalho. 1

3 Sumário 1 Introdução ao FLARAS Realidade Aumentada Requisitos para aplicações de RA Aplicações da Realidade Aumentada Desenvolvimento de aplicações de Realidade Aumentada Desenvolvimento através de programação O ARToolKit O FLARToolKit Desenvolvimento através de ferramenta de autoria SACRA FLARAS Como usar uma aplicação desenvolvida com o FLARAS Requisitos Requisitos de Hardware Requisitos de Software Outros requisitos Execução online Execução online no Linux Execução off-line Execução off-line no Linux Seleção da webcam Estrutura básica das aplicações no FLARAS Cena Ponto Marcador de referência Uso dos marcadores Modos do marcador de interação Modo Inspeção Modo Controle Diagrama de estados para ações de inspeção e controle Propriedades da esfera de interação Comandos de Teclado e Mouse

4 8 Flaras Developer e Flaras Viewer Desenvolvimento de aplicações de RA com o FLARAS Instalação Detalhes da instalação no Linux Visão geral da interface Gerenciamento dos projetos Gerenciamento de pontos Gerenciamento de cenas Objetos Virtuais Codec de vídeo Cuidados especiais com texturas e vídeos Fontes de conteúdo Programas úteis Exemplos de mini aplicações no FLARAS Cadastro de um objeto virtual do armazém 3D do Google Alteração de propriedades da bicicleta do exemplo anterior Múltiplas cenas associadas a um mesmo ponto Trabalhando com múltiplos pontos Trabalhando com múltiplos pontos sonorizados Estrutura básica da aplicação Adicionando a figura-base Configurando o ponto com múltiplas cenas sonorizadas Configurando os demais pontos com apenas uma cena sonorizada Informações técnicas Conclusões Referências Bibliográficas Sobre os autores Raryel Costa Souza Hipólito Douglas França Moreira Claudio Kirner

5 Lista de Ilustrações Figura 1 - Aplicação educacional de lançamento oblíquo com Realidade Aumentada... 7 Figura 2 - Aplicação de educação de trânsito com Realidade Aumentada... 7 Figura 3 - Esquema básico de funcionamento da Realidade Aumentada Fonte:< 8 Figura 4 - Aplicação educacional de xadrez desenvolvida com o SACRA < 11 Figura 5 - Solução alternativa para o bug do Flash no Linux - Passo Figura 6 - Solução alternativa para o bug do Flash no Linux - Passo Figura 7- Solução alternativa para o bug do Flash no Linux - Passo Figura 8 - Alteração da webcam de captura - parte Figura 9 - Alteração da webcam de captura - parte Figura 10 - Esquema resumido da estrutura das aplicações do FLARAS Figura 11 - Relação das cenas com pontos desativados e com pontos ativados Figura 12 - Marcadores do FLARAS: marcador de interação (esq.) e marcador de referência (dir.) Figura 13 - Os marcadores sendo usados em uma aplicação do FLARAS Figura 14 - Usando o marcador de interação em um ponto Figura 15 - Modos de operação do marcador de interação Figura 16 - Diagrama de estados para as ações de inspeção e controle (controle B = controle backward, controle F = controle Forward) Figura 17 - Propriedades da esfera do marcador de interação Figura 18 - Visão geral da interface do FLARAS Developer Figura 19 - Opções de gerenciamento de projetos no FLARAS Figura 20 - Posicionamento relativo das cenas em relação aos pontos Figura 21 - Cadastro de uma cena primeiro parte Figura 22 - Cadastro de uma cena escolha do objeto virtual Figura 23 - Cadastro de uma cena personalização de propriedades Figura 24 - Vídeo MP4 incompatível com o FLARAS: imagens não aparecem Figura 25 - Codec de vídeo utilizado pelo vídeo problemático com o FLARAS Figura 26 - Visibilidade das texturas com ângulo de 90º. No lado esquerdo: textura sendo visualizada por dois ângulos diferentes. No lado direito: os respectivos ângulos do marcador com a webcam Figura 27 - Consultando a resolução da imagem no Windows Explorer Figura 28 - Consultando a resolução da imagem no GIMP. No caso, 500 de largura por 333 de altura Figura 29 - Consultando a resolução de um vídeo no Windows Explorer Figura 30 - Consultando a resolução do vídeo no VLC

6 Lista de Siglas FLARAS Flash Augmented Reality Authoring System RA Realidade Aumentada SACRA Sistema de Autoria Colaborativa com Realidade Aumentada 5

7 1 Introdução ao FLARAS O Flash Augmented Reality Authoring System (FLARAS) é uma ferramenta de autoria para aplicações interativas de Realidade Aumentada que são executadas diretamente do navegador de internet através do Adobe Flash Player, de forma tanto online como local. Assim como seu predecessor, a ferramenta SACRA (Sistema de Autoria Colaborativa com Realidade Aumentada) o FLARAS tem como principal característica, permitir que pessoas leigas da área de computação possam desenvolver aplicações de realidade aumentada, sem qualquer necessidade de conhecimentos de programação de computadores. Como todo o desenvolvimento é feito através de uma interface gráfica simples, o desenvolvimento é mais ágil (menos passível de erros) e acessível quando comparado com o desenvolvimento através do SACRA (no qual não há interface gráfica, desenvolve-se através de edição manual de arquivos de texto simples). 6

8 2 Realidade Aumentada Realidade Aumentada (RA) é a inserção de objetos virtuais no ambiente físico, mostrada ao usuário, em tempo real, com o apoio de algum dispositivo tecnológico, usando a interface do ambiente real, adaptada para visualizar e manipular os objetos reais e virtuais. (KIRNER e KIRNER, 2008). Nas Figura 1 e Figura 2, podem-se visualizar duas capturas de tela de exemplos de aplicações de RA. Figura 1 - Aplicação educacional de lançamento oblíquo com Realidade Aumentada Figura 2 - Aplicação de educação de trânsito com Realidade Aumentada O recurso que permite essa integração entre real e virtual na realidade aumentada é o rastreamento óptico. Esse diferencial permite que a interação seja ainda mais fácil e não exija tanto treinamento e adaptação como na realidade virtual. Outra vantagem é que, comparado com os dispositivos multissensoriais, requeridos na realidade virtual para melhor imersão, para fazer rastreamento óptico bastam webcams comuns, que tem um custo bem mais acessível, permitindo que o uso seja mais difundido. 2.1 Requisitos para aplicações de RA Os requisitos básicos para se executar aplicações de RA são, basicamente, um computador com sistema operacional (Windows, Linux, Macintosh, etc.) devidamente instalado, uma webcam com seus drivers 7

9 devidamente instalados, um programa desenvolvido utilizando uma biblioteca de programação de RA como o ARToolKit ou o FLARToolKit e uma placa de papelão com um símbolo no interior, denominada marcador. Figura 3 - Esquema básico de funcionamento da Realidade Aumentada Fonte:< A ferramenta que aparece na tela do computador da Figura 3 representa um objeto virtual de uma aplicação de RA, exibido quando o marcador é colocado no campo de visão da webcam. 2.2 Aplicações da Realidade Aumentada A Realidade Aumentada tem aplicações nas mais diversas áreas do conhecimento, tais como a área de saúde (PEREIRA, 2000), ensino e pesquisa de ciências (OKAWA, KIRNER e KIRNER, 2010), (OKAWA, KIRNER e KIRNER, 2010), (SOUZA e KIRNER, 2011), (SOUZA e KIRNER, 2012), (SOUZA e KIRNER, 2012), design e arquitetura (FERNANDES e SANCHEZ, 2008), visualização de informações (ZORZAL, SILVA, et al., 2007), entretenimento (SILVA e KIRNER, 2010), entre muitas outras. Outros exemplos de aplicações de RA podem ser encontrados nas páginas a seguir: Aplicações com FLARToolKit Aplicações com o SACRA e basar Livro Interativo de Xadrez Potencializado com Realidade Aumentada Objeto de Aprendizagem de Eletromagnetismo com Realidade Aumentada Objeto de Aprendizagem de Lançamento Oblíquo com Realidade Aumentada RealidadeAumentada.com.br SlideTrix em Realidade Aumentada Sistema Solar com Realidade Aumentada Vídeos de aplicações de Realidade Aumentada 8

10 3 Desenvolvimento de aplicações de Realidade Aumentada Nessa seção pretende-se dar uma visão geral da evolução histórica de como as aplicações de realidade aumentada tem sido desenvolvidas nos últimos anos. Basicamente se tem duas abordagens possíveis para o desenvolvimento de aplicações de Realidade Aumentada: a primeira é fazer uso de programação diretamente e a segunda, fazer uso de uma ferramenta de autoria de RA. 3.1 Desenvolvimento através de programação O primeiro requisito para essa abordagem é justamente os conhecimentos de programação em alguma linguagem de programação para a qual a biblioteca ARToolKit já foi portada, entre elas, C/C++ (ARToolKit), Java (NyARToolkit), ActionScript 3.0 (FLARToolKit), Python (PyARTK), Silverlight (SLARToolKit), o que torna essa abordagem praticamente inacessível para a grande maioria das pessoas. Por outro lado, o uso de programação traz uma vantagem significativa: há muito mais flexibilidade - quase não há limitações para o que pode ser desenvolvido O ARToolKit O ARToolKit é uma biblioteca de programação opensource (licença GPL) para criar aplicações de Realidade Aumentada nas linguagens C/C++, lançada em 1999, desenvolvida por Hirokazu Kato, sob a orientação de Mark Billinghurst (ARTOOLKIT HOMEPAGE, 2007), (WIKIPEDIA, THE FREE ENCYCLOPEDIA, 2007). Ela tem sido uma das bibliotecas de rastreamento mais largamente utilizada no mundo, ultrapassando os downloads no período de agosto de 2004 a fevereiro de 2012 (SOURCEFORGE, 2012). Essa biblioteca é responsável justamente pela tarefa mais complexa do desenvolvimento desse tipo de aplicações (que envolve a integração de elementos virtuais com elementos reais), que é o rastreamento do ponto de vista do usuário, isto é, saber a partir de qual ponto de vista que o objeto virtual deve ser renderizado no mundo real. Para isso, o ARToolKit usa algoritmos de visão computacional, que calculam a posição e orientação real da câmera em relação a marcadores físicos reais (geralmente marcadores fiduciais) (ARTOOLKIT HOMEPAGE, 2007), (WIKIPEDIA, THE FREE ENCYCLOPEDIA, 2007), (SANTIN e KIRNER, 2008) O FLARToolKit O FLARToolKit é uma versão portada do NyARToolKit (ARToolKit portado para Java) portado para a linguagem ActionScript 3.0 (AS3), desenvolvida pelo japonês Saqoosha e lançada no meio do ano de 2009 (SPARK PROJECT, 2009). Essa nova versão portada do ARToolKit teve importante papel na popularização ainda maior das aplicações de realidade aumentada, principalmente em áreas como publicidade (KIRNER, 2010). Isso se deve ao fato das aplicações desenvolvidas com o FLARToolKit, por rodarem sobre o Adobe Flash Player, podem ser integradas numa página da web e usadas a partir de qualquer sistema operacional sem a necessidade de qualquer instalação prévia na máquina do usuário. 3.2 Desenvolvimento através de ferramenta de autoria Por dispensar a necessidade de se ter conhecimentos de programação, essa abordagem é a mais acessível para a maioria das pessoas. O desenvolvedor usa uma ferramenta e monta a estrutura (template) de sua aplicação de acordo com os recursos oferecidos e agrega o conteúdo (animações, os objetos 3D virtuais, as 9

11 texturas, os áudios, os vídeos, entre outros). O desenvolvimento tende a ser mais ágil e fácil do que no caso de usar programação, entretanto, há a contrapartida de se ficar limitado pelos recursos da ferramenta: a flexibilidade é muito menor SACRA O SACRA (Sistema de Autoria Colaborativa de Realidade Aumentada) é uma ferramenta de autoria desenvolvida por Rafael Santin, sob orientação de Claudio Kirner (SANTIN e KIRNER, 2008), (SANTIN, 2008). Essa ferramenta permite a criação de aplicações interativas de RA para uso local na plataforma Windows. É possível criar cenas que consistam de objetos 3D (estáticos ou animados) de sons e texturas. Um diferencial importante do SACRA com relação a outras ferramentas de autoria é a possibilidade de interação: ativando/desativando cenas e a possibilidade de alternar entre elas. A principal motivação para o desenvolvimento do SACRA foram as várias dificuldades de instalar e configurar o ARToolKit por parte de usuários leigos de computação que queriam desenvolver suas aplicações de realidade aumentada. Esta ferramenta oferece muitos recursos para personalização e estruturação da aplicação. É possível alterar a translação, escala e rotação dos objetos virtuais, bem como a posição dos pontos a que eles estarem associados. Em relação às outras ferramentas, as aplicações desenvolvidas no SACRA tem uma estrutura mais complexa, que é a causa de sua maior flexibilidade. Há vários marcadores fiduciais de referência aos quais podem ser associados pontos. Para cada ponto há uma lista encadeada circular de objetos virtuais (cada objeto virtual equivale a uma cena). Cada objeto virtual tem a sua translação (em relação ao ponto a que ele está associado), rotação e escala. Opcionalmente também pode haver um arquivo de áudio.wav associado. Como o FLARAS adota a mesma estrutura básica do SACRA, isso é explicado mais detalhadamente na seção 5. Um diferencial é a possibilidade de copiar, transportar e apagar objetos virtuais usando marcadores específicos para essas tarefas, o que aumenta em muito o potencial das aplicações que podem ser criadas. Outro recurso interessante é a possibilidade de desenvolvimento colaborativo de aplicações através da internet ou rede local. A desvantagem dessa ferramenta é que ela não oferece uma interface gráfica: é necessário editar arquivos de configuração simples e estruturados (arquivos de texto puro) manualmente. Outra desvantagem é que a ferramenta só tem versão para Windows e somente pode ser executada localmente na máquina. Um exemplo de aplicação desenvolvida com o SACRA pode ser visto na Figura 4. 10

12 Figura 4 - Aplicação educacional de xadrez desenvolvida com o SACRA < FLARAS O FLARAS é uma ferramenta de autoria de realidade aumentada desenvolvida por Raryel C. Souza e Hipólito Douglas F. Moreira, sob a orientação de Claudio Kirner. Ele é baseado na mesma estrutura básica de pontos e cenas, entretanto, representa uma evolução principalmente nos aspectos de facilidade de uso (possui uma interface gráfica amigável) e também por permitir que as aplicações desenvolvidas sejam executadas de forma tanto online como local (sem internet) em qualquer sistema operacional para o qual exista o Adobe Flash Player. Este último representa um importante avanço, levando em conta as tendências atuais da tecnologia na direção da Web e da computação em nuvem (cloud computing). Entre outras melhorias pode-se citar a possibilidade de adicionar vídeos nas aplicações, bem como objetos virtuais do armazém 3D do Google e áudios em MP3. 11

13 4 Como usar uma aplicação desenvolvida com o FLARAS 4.1 Requisitos Requisitos de Hardware Webcam devidamente instalada e configurada. Webcams de baixa qualidade implicam em maior instabilidade na detecção dos marcadores e pior desempenho das aplicações do FLARAS. Para melhores resultados de desempenho é recomendável ter uma placa de vídeo 3D recente, bem como processadores de dois ou mais núcleos Requisitos de Software Sistema operacional: Windows, Linux ou Mac OS. Adobe Flash Player Plug-in devidamente instalado Outros requisitos Para usar uma aplicação desenvolvida com o FLARAS, o primeiro passo é a impressão dos marcadores. Para melhores resultados recomenda-se colá-los sobre um tipo papel mais firme como papelão, papel-paraná ou cartolina. Um requisito importante para as aplicações de realidade aumentada de forma geral são condições adequadas de luminosidade do ambiente de execução. Caso o ambiente seja muito escuro, muito luminoso, ou a direção da luz seja muito inadequada pode ser que a aplicação funcione de forma muito ruim e instável (elementos virtuais aparecem e desaparecem de forma quase intermitente). Nesses casos, o que se pode fazer é tentar alterar o posicionamento da webcam com relação à direção da luz, ou alterar as condições de luminosidade até que se obtenha uma estabilidade razoável. Veja mais sobre a utilização dos marcadores na seção Execução online No caso da execução online, basta acessar a página web em que a aplicação foi disponibilizada e autorizar o Adobe Flash Player acessar a webcam e microfone. Em seguida basta colocar o marcador de referência no campo de visão da webcam e aguardar o aparecimento dos pontos cinza (indicativos dos pontos desativados). Ao ativar um dos pontos, dependendo da velocidade da conexão do usuário e do tamanho dos objetos virtuais utilizados, pode ser que os objetos virtuais demorem a aparecer Execução online no Linux Devido a um bug antigo do Adobe Flash Player para Linux, em algumas distribuições pode ser que, ao aparecer a janela de autorização do acesso a webcam, o botão Allow não seja clicável, impossibilitando o uso da aplicação. Entretanto há solução alternativa para esse problema. 1. Clicar com o botão direito sobre a janela de autorização > Global Settings. 12

14 Figura 5 - Solução alternativa para o bug do Flash no Linux - Passo 1 2. Abrir a aba Camera and Mic e clicar no botão Camera and Microphone Settings by Site Figura 6 - Solução alternativa para o bug do Flash no Linux - Passo 2 3. Clicar no Botão Add, digitar o domínio do site em que está a aplicação (Ex: se a aplicação estiver na página o domínio é Selecionar Allow na caixa de opções e clicar em Add. Figura 7- Solução alternativa para o bug do Flash no Linux - Passo 3 13

15 4. Bastará fechar e reabrir a página da aplicação. A webcam será liberada automaticamente, sem o aparecimento da janela de autorização. 4.3 Execução off-line No caso da execução off-line é necessário baixar o pacote compactado da aplicação, extraí-lo em alguma pasta e abrir o arquivo index-local-running.html com seu navegador de internet. Os passos seguintes são os mesmos que para execução online. Ao ativar um dos pontos, ao contrário da execução online, não há problemas com lentidão para aparecimento dos objetos, uma vez que eles já se encontram na máquina do usuário Execução off-line no Linux Pelas mesmas razões explicadas na seção 4.2.1, pode ser que em algumas distribuições, ao ser aberta a janela de autorização de acesso à webcam, o botão Allow não seja clicável. No caso da execução off-line não é possível usar o procedimento descrito na seção O procedimento adequado nesses casos é o seguinte: 1. Acessar o site Adobe Flash Player Support Center e na seção Linux, clicar em Download the Linux Flash Player 11.1 Projector (TAR.GZ) ou versão mais recente disponível. 2. Extrair o arquivo compactado em qualquer pasta que julgue adequada. Marcar a permissão de execução do arquivo flashplayer no terminal: chmod +x flashplayer e executando o arquivo:./flashplayer 3. Ir ao menu File > Open e ir até o local em que está o arquivo flash-viewer-local-running.swf (na pasta em que foi extraído o arquivo compactado com a aplicação publicada do FLARAS). 4.4 Seleção da webcam Em computadores com mais de uma webcam, normalmente, a configuração padrão do Adobe Flash Player é usar a webcam externa (USB). Entretanto, caso nenhuma webcam carregue, ou você queira trocar a webcam usada na captura, basta clicar com o botão direito do mouse sobre a tela de autorização do Adobe Flash Player que aparecerá ao carregar a aplicação e selecionar Settings, tal como na Figura 8. Figura 8 - Alteração da webcam de captura - parte 1 14

16 Após abrir a janela de configurações deve-se ir para a aba com o desenho de uma webcam (seta de baixo), e, na caixa de seleção (seta de cima), selecionar a webcam desejada, tal como na Figura 9 - Alteração da webcam de captura - parte 2Figura 9. Figura 9 - Alteração da webcam de captura - parte 2 15

17 5 Estrutura básica das aplicações no FLARAS As aplicações do FLARAS tem a mesma estrutura básica do SACRA, tal como ilustrado na Figura 10, e explicado de forma detalhada nas seções que se seguem: Ponto 1 Cena 1.1 Cena 1.2 Cena 1.3 Marcador de Referência Ponto 2 Cena Cena 2.X... Ponto Y Figura 10 - Esquema resumido da estrutura das aplicações do FLARAS 5.1 Cena São os elementos mais básicos da estrutura de uma aplicação do FLARAS. Uma cena pode consistir de: Objeto virtual (com ou sem áudio), ou Vídeo (com ou sem áudio), ou Textura sobre um plano (com ou sem áudio); Não é possível, por exemplo, numa mesma cena, haver um objeto virtual e um vídeo, ou um vídeo e uma textura, e assim por diante. A relação das cenas com pontos desativados e com pontos ativados é mostrada na Figura 11. Ponto desativado: nenhuma cena visível Ponto ativado: cena visível Figura 11 - Relação das cenas com pontos desativados e com pontos ativados 16

18 5.2 Ponto Servem para agrupar um conjunto de cenas. Cada ponto contém uma lista de cenas. 5.3 Marcador de referência Agrupa um conjunto de pontos e os posiciona no ambiente real. 17

19 6 Uso dos marcadores A interação do usuário com a aplicação é feita basicamente através dos dois marcadores mostrados na Figura 12. Na Figura 13 esses marcadores são mostrados em uso em uma aplicação do FLARAS: Figura 12 - Marcadores do FLARAS: marcador de interação (esq.) e marcador de referência (dir.) Figura 13 - Os marcadores sendo usados em uma aplicação do FLARAS Marcador de referência (ref. marker): marcador ao qual ficam ancorados os objetos virtuais da aplicação. Marcador de interação (interaction marker): marcador utilizado para interagir com a aplicação. Ele possui dois modos: inspeção e controle, explicados mais adiante. Daqui em diante, entenda-se por usar o marcador de interação por: tocar a esfera verde a ele associada em dos pontos associados ao marcador de referência (esferas cinza quando o ponto está desativado) (ver 18

20 Figura 14). Ao fazer isso o ponto será travado, isto é, só poderá ser executada uma nova ação (inspeção ou controle) no ponto após a esfera amarela do marcador de inspeção se afastar do ponto (um som é tocado quando essa condição é satisfeita). Quando um ponto está ativado não irá aparecer a esfera cinza, o que pode dificultar a interação, nesses casos basta pressionar F1 e será exibida uma esfera azul na posição do ponto. Antes Depois Figura 14 - Usando o marcador de interação em um ponto 6.1 Modos do marcador de interação O marcador de interação pode executar diferentes ações em um ponto, dependendo do modo de operação selecionado. A alternância entre os modos é feito através do teclado, tal como explicado na seção 7. Os modos de operação do marcador de interação são mostrados na Figura

21 Inpeção Controle Forward Controle Backward Figura 15 - Modos de operação do marcador de interação Modo Inspeção Um ponto possui dois estados possíveis: ativado e desativado. Essa distinção é ilustrada na Figura 11. Ponto desativado: nenhuma das cenas é exibida, e, na posição do ponto é exibida uma esfera cinza. Ponto ativado: uma das cenas disponíveis em sua lista está visível, e, não é exibida a esfera cinza na posição do ponto. A alternância entre esses dois estados é feita pelo uso do marcador de interação, no modo inspeção, em um ponto. Isso é definido como fazer uma ação de inspeção num ponto. Ao ativar um ponto pela primeira vez desde a inicialização da aplicação será exibida a primeira cena da lista e, caso ela possua um áudio associado, ele será tocado (e repetido após o término, caso tenha sido assim configurado). Ao fazê-lo a esfera cinza também desaparecerá. Ao desativar um ponto, a cena em exibição é ocultada, e aparece a esfera cinza na posição do ponto. Caso algum áudio associado à cena esteja sendo tocado, ele é interrompido imediatamente. Na próxima vez em que esse ponto for ativado (desde que a aplicação não seja fechada) a cena que aparecerá será justamente a cena que estava sendo exibida antes da desativação do ponto, e o áudio a ela associado também será reproduzido desde o início. 20

22 6.1.2 Modo Controle Fazer uma ação de controle em um ponto, isto é, usar o marcador de interação, no modo de operação controle, em um ponto, permite avançar ou retroceder na lista de cenas associadas ao ponto. Essa ação só funciona em pontos ativados. Para retroceder o marcador tem de estar no modo controle backward, e para avançar, ele deve estar no modo controle forward. Caso se faça uma ação de controle avançando na última cena da lista, automaticamente se retornará para a primeira cena da lista. O mesmo é válido para uma ação de controle retrocedendo na primeira cena da lista Diagrama de estados para ações de inspeção e controle O diagrama de estados da Figura 16 resume o funcionamento das ações de inspeção e controle em uma aplicação do FLARAS. Cada um dos círculos representa um estado da aplicação. O texto nas setas indica a ação que deve ser realizada para ir de um estado ao outro. Por exemplo, para ir da cena 1 para a cena 2, basta fazer uma ação de controle forward (controle f.) no ponto. Para voltar para a cena 1, basta fazer uma ação de controle backward (controle b.) no ponto. Figura 16 - Diagrama de estados para as ações de inspeção e controle (controle B = controle backward, controle F = controle Forward) 6.2 Propriedades da esfera de interação A esfera do marcador de interação tem duas propriedades (ver Figura 17): Distância ao centro do marcador Raio da esfera 21

23 Figura 17 - Propriedades da esfera do marcador de interação Tanto no FLARAS Developer como no FLARAS Viewer é possível alterar essas propriedades, usando as teclas de F4 a F8, tal como mostrado na seção 7. Essas duas propriedades também são salvas no arquivo de projeto do FLARAS, de forma que, nas próximas edições do projeto e também ao usar a aplicação publicada essas propriedades se mantenham ajustadas da forma que o desenvolvedor julgue mais confortável para as finalidades da aplicação. 22

24 7 Comandos de Teclado e Mouse Comandos relacionados com pontos: A Q F1 Ativa todos os pontos (o áudio da primeira cena de cada ponto NÃO é tocado) Desativa todos os pontos Ativa/desativa a exibição da esfera azul auxiliar (apenas válido em pontos ativados) Comandos relacionados ao marcador de interação: M C Alterna entre os modos controle e inspeção Alterna entre os modos de controle backward e controle forward (só funciona se o marcador de interação estiver no modo controle) Comandos relacionados com a esfera de interação: F4 F5 F6 F7 F8 Diminui o tamanho Aumenta o tamanho Diminui a distância ao centro do marcador Aumenta a distância ao centro do marcador Restaura as configurações originais da esfera de interação Outros comandos de teclado: F3 Alterna entre a tela espelhada/não espelhada Comandos com mouse: Girar a roda do mouse (mouse scroll) Clique do mouse na tela do FLARAS Oculta a interface gráfica (apenas no FLARAS Developer) Mostra a interface gráfica (apenas no FLARAS Developer) 23

25 8 Flaras Developer e Flaras Viewer O FLARAS possui duas versões, a versão do desenvolvedor (FLARAS Developer) e a versão de visualização (FLARAS Viewer). No FLARAS Developer estão disponíveis todas as ferramentas para editar ou criar uma nova aplicação de realidade aumentada. É possível adicionar pontos, alterar suas posições, adicionar objetos 3D, áudios, vídeos e texturas e também alterá-los. Além de tudo isso, o desenvolvedor já pode ir acompanhando e testando a aplicação, de forma idêntica ao que ocorrerá quando ela é executada no FLARAS Viewer. Por outro lado, no FLARAS Viewer não é possível editar nenhum parâmetro da aplicação desenvolvida. Ele serve apenas como um interpretador da aplicação desenvolvida, ou seja, só é possível visualizá-la e interagir com ela através dos marcadores de inspeção e controle. Ao publicar (publish) uma aplicação do FLARAS sempre é incluída no pacote uma cópia do FLARAS Viewer. 24

26 9 Desenvolvimento de aplicações de RA com o FLARAS 9.1 Instalação Antes de instalar o FLARAS é necessário instalar a versão mais recente do Adobe Air. Depois de instalado, basta baixar a versão mais recente do pacote de distribuição do FLARAS FLARAS-1.0-r1035.zip (ou mais recente) do site oficial da ferramenta, extraí-lo, e clicar duas vezes sobre o arquivo FLARAS-1.0-r1035.air (ou mais recente)para iniciar a instalação Detalhes da instalação no Linux Após a versão 2.6, a Adobe parou de disponibilizar as novas versões para Linux, entretanto, essa versão já permite o funcionamento correto de todos os recursos do FLARAS. Essa versão pode ser obtida aqui (Adobe Air 2.6 runtime downloads > Adobe Air Linux). Nas distribuições de 32bits a tendência é que funcione diretamente. Por outro lado, nas distribuições de 64bits é necessário instalar previamente as bibliotecas de 32bits. No Ubuntu isso é feito através do seguinte comando no terminal: sudo apt-get install ia32-libs Em outras distribuições de 64bits pode ser útil consultar o Install Adobe Air 2 on 64-bit Linux distributions e também o Packages required to run Adobe AIR 2.6 for Linux. Depois disso basta abrir o arquivo baixado (AdobeAIRInstaller.bin) e prosseguir com a instalação normalmente. 9.2 Visão geral da interface Na Figura 18 são apresentados os componentes da interface gráfica do FLARAS Developer: 25

27 Outros botões na interface: Figura 18 - Visão geral da interface do FLARAS Developer Exclusão de ponto/cena Trocar posição da cena na lista de cenas do ponto 9.3 Gerenciamento dos projetos Assim como editores de texto e planilhas eletrônicas, o FLARAS possui todas as funções básicas de gerenciamento de projetos, isto é: Criar um novo projeto Abrir um projeto Salvar Salvar como Todas essas opções estão disponíveis no menu File, tal como mostrado na Figura

28 Figura 19 - Opções de gerenciamento de projetos no FLARAS Todos os projetos de aplicações do FLARAS são salvos com a extensão de arquivo.flaras. Não há salvamento automático nem a possibilidade de desfazer modificações, logo é altamente recomendável que o usuário salve periodicamente o seu trabalho para evitar a possibilidade de perda de dados. A única ocasião em que acontece o salvamento automático é imediatamente após clicar na opção de publicar uma aplicação. Por outro lado, antes de fechar o FLARAS, abrir um novo projeto, ou até mesmo criar um novo projeto sempre é perguntado ao usuário se ele quer salvar seu projeto atual antes de continuar. Esse arquivo de extensão.flaras já possui todos os dados necessários para aplicação, inclusive as texturas, vídeos, áudios e objetos virtuais. Basta ter esse arquivo em mãos e será possível editar o projeto em qualquer outro computador que possua o FLARAS Developer instalado. Ao terminar o projeto basta salvar e publicar a aplicação. Para isso basta acessar File > Publish. Será gerado um arquivo compactado que contém o FLARAS Viewer e a aplicação desenvolvida. Tendo apenas esse pacote em mãos é possível executar a aplicação em qualquer computador que possua o Adobe Flash Player plug-in devidamente instalado, entretanto, não se tem a liberdade de editar a aplicação. Para editar a aplicação sempre é necessário ter o projeto da aplicação em mãos (arquivo de extensão.flaras ). Isso é análogo a gerar um arquivo PDF a partir de um documento do Microsoft Word. O PDF pode ser visualizado em qualquer computador, entretanto, só pode se editar o documento através do arquivo original do Microsoft Word. 9.4 Gerenciamento de pontos Um ponto no FLARAS é definido através de quatro propriedades: as três coordenadas cartesianas do ponto (x, y e z) e a lista de cenas associada. Passos para cadastrar um ponto: 1. Selecionar a opção New, na caixa de seleção de pontos. 2. Selecionar as coordenadas do ponto (x, y e z) e teclar ENTER. 3. Cadastrar a primeira cena que será associada a ele, tal como explicado na seção 9.5; Em qualquer momento do projeto é possível alterar as coordenadas de qualquer um dos pontos. Como todas as cenas tem seu posicionamento em x, y e z, relativos ao ponto (ver Figura 20), uma vez que ele tenha sua posição alterada, as cenas também terão seu posicionamento absoluto em relação ao marcador de referência alterado. Basta alterar o valor da coordenada e pressionar ENTER. 27

29 Figura 20 - Posicionamento relativo das cenas em relação aos pontos Também é possível remover pontos. Ao fazê-lo, toda a lista de cenas a ele associada, bem como a respectiva configuração de cada uma das cenas será apagada. O procedimento para remover um ponto é o seguinte: 28

30 1. Selecionar um ponto na caixa de seleção de pontos. 2. Clicar no X ao lado da caixa de seleção de pontos e confirmar a remoção. 9.5 Gerenciamento de cenas Os conceitos básicos sobre cenas foram explicados na seção 3.1 deste manual. Os passos para criar uma cena no FLARAS são os seguintes, ilustrados nas Figura 21, Figura 22 e Figura 23: 1. Selecionar o ponto em que a cena será adicionada na caixa de seleção de pontos. 2. Selecionar a opção New na caixa de seleção de cenas. 3. Selecionar se a cena consistirá de um objeto virtual, vídeo ou textura. 4. Fornecer um arquivo válido para a escolha no passo 3. (ver formatos reconhecidos abaixo) 5. Configurar os parâmetros necessários da cena: posição em x, y e z em relação à posição do ponto, rotação em relação aos eixos cartesianos, escala, e as propriedades específicas no caso de vídeos e texturas. 6. Selecionar se haverá ou não um áudio associado, fornecer um arquivo de áudio válido e selecionar se ele deverá ser repetido ou não após o término da reprodução do mesmo. 7. Há a opção de trocar a posição da cena na lista de cenas do ponto. Isso é feito clicando ao lado da caixa de seleção de cenas e fornecer a posição desejada da cena na lista (apenas números). Figura 21 - Cadastro de uma cena primeiro parte 29

31 Figura 22 - Cadastro de uma cena escolha do objeto virtual Figura 23 - Cadastro de uma cena personalização de propriedades Os formatos de arquivo reconhecido são os seguintes: 30

32 Formatos de arquivos reconhecidos: Objetos virtuais: Collada compactado, com suporte a objetos animados (.kmz ou.zip). Mais detalhes na seção Vídeos: MP4 (apenas codec H.264) ou FLV. Mais detalhes na seção Texturas: JPG, PNG ou GIF. Em qualquer momento do projeto também é possível alterar as propriedades da cena, desde as propriedades básicas como a posição, rotação e escala da cena, bem como os arquivos de vídeo, áudio, textura e de objetos virtuais associados à cena. Basta alterar a propriedade e teclar ENTER. Os passos para remover uma cena são: 3. Selecionar uma cena na caixa de seleção de cenas. 4. Clicar no X ao lado da caixa de seleção de cenas e confirmar a remoção Objetos Virtuais O FLARAS suporta objetos virtuais em formato Collada. Além dos objetos Collada compactados, suportados diretamente no FLARAS, também existem os objetos Collada sem compactação, com extensão.dae. Eles geralmente são acompanhados de uma pasta com texturas do objeto. Esse tipo de arquivo.dae pode ser usado também no FLARAS, entretanto, antes de fazê-lo, é necessário compactá-lo juntamente com suas texturas num arquivo.zip. Nem sempre os objetos virtuais aparecem imediatamente após o cadastro da cena. Muitas vezes é necessário diminuir/aumentar a escala do objeto ou alterar a translação ou rotacioná-lo para que ele apareça. Há também alguns casos de objetos que, por problemas de incompatibilidade, não funcionam nem quando isso é feito. Nesses casos o melhor a fazer é buscar outro objeto virtual semelhante. No armazém 3D do Google há milhares de objetos virtuais disponíveis para download gratuito. A maioria deles tem a opção de download em formato Collada (.zip), que é justamente um dos formatos aceitos diretamente pelo FLARAS. Quando não está disponível a opção de Collada (.zip), há a opção de baixar o arquivo de projeto do Google Sketchup. Nesse último caso, basta abrir o arquivo no Sketchup (apenas funciona na versão 7 ou inferior) e usar a opção de exportar KMZ (no SketchUp: File > Export > 3D Model), e, dessa forma, o objeto poderá também ser utilizado no FLARAS. Além do armazém do Google há diversos repositórios de objetos virtuais na internet, muitos deles oferecendo download de objetos no formato Collada. Para o desenvolvimento de objetos virtuais animados são necessários conhecimentos de modelagem tridimensional e animação, bem como o uso de programas complexos como Blender, Autodesk Maya ou Autodesk 3Ds Max, entre outros. Caso se tenha um objeto virtual em outro formato pode-se recorrer a essas ferramentas de modelagem citadas acima, bem como a programas que fazem a conversão entre os formatos, entretanto nem sempre isso funciona bem, principalmente no que diz respeito a objetos animados. Não é recomendável o cadastro de objetos com tamanho muito superior à 1MB, a não ser que o computador e a placa de vídeo do usuário sejam bem potentes, já que isso implica numa grande complexidade de processamento. Isso pode gerar uma lentidão muito grande no sistema FLARAS. Outro 31

33 empecilho de objetos muito grandes é que, no caso do uso online, se a conexão de internet do usuário for muito lenta, o carregamento dos objetos pode ser muito demorado Codec de vídeo No FLARAS, qualquer vídeo no formato FLV deverá ser interpretado sem problemas. Por outro lado, nem todos os vídeos em formato MP4 conseguem ser interpretados. Quando o vídeo não funciona, o principal sintoma é o aparecimento de um retângulo preto na área do vídeo, mas o áudio é ouvido normalmente, tal como mostrado na Figura 24. Figura 24 - Vídeo MP4 incompatível com o FLARAS: imagens não aparecem. A causa desse problema é o a codificação do vídeo. A codificação do vídeo (codec) pode ser consultada usando, por exemplo, o player de vídeo VLC, tal como mostrado na Figura

34 Figura 25 - Codec de vídeo utilizado pelo vídeo problemático com o FLARAS O FLARAS consegue interpretar apenas os vídeos MP4 que usam o codec H.264. Vídeos em outros formatos precisam ser previamente convertidos para serem utilizados no FLARAS. Para converter um vídeo que utiliza outro codec/formato para o codec H.264, basta utilizar um programa como o Hamster Free Video Converter Cuidados especiais com texturas e vídeos Ao cadastrar texturas ou vídeos em uma cena do FLARAS é necessário ter dois cuidados especiais: rotação e resolução Rotação As texturas e vídeos no FLARAS só são visíveis de um lado do plano 3D sobre o qual eles são aplicados (ver Figura 26, superior esquerda). Do outro lado elas são completamente transparentes (Figura 26, inferior esquerda). 33

35 Figura 26 - Visibilidade das texturas com ângulo de 90º. No lado esquerdo: textura sendo visualizada por dois ângulos diferentes. No lado direito: os respectivos ângulos do marcador com a webcam. Dessa forma é necessário ter um cuidado especial com a rotação configurada, pois, caso esteja abaixo de 90º ou acima de 270º eles ficaram voltados para baixo (voltados para o marcador) e, dessa forma, não serão visíveis Resolução A resolução (em pixels) também é um fator importante para os vídeos e texturas. Ela deve ser preenchida nos campos largura (width) e altura (height). Uma das formas de obter a resolução da imagem, no Windows 7, é abrir a pasta em que está o arquivo da imagem e consulta-la no canto inferior da janela, tal como indicado na Figura

36 Figura 27 - Consultando a resolução da imagem no Windows Explorer Uma forma alternativa de obter a resolução, para outros sistemas operacionais, é abrir a imagem num editor de imagens como o GIMP. Ao abrir o arquivo, no canto superior esquerdo da tela já aparecerá a resolução da imagem (ver Figura 28). Figura 28 - Consultando a resolução da imagem no GIMP. No caso, 500 de largura por 333 de altura. Uma forma de obter a resolução dos vídeos, no Windows 7, é abrir a pasta em que se encontra o arquivo com o vídeo e consulta-la no canto inferior da tela, tal como indicado na Figura

37 Figura 29 - Consultando a resolução de um vídeo no Windows Explorer Outra forma é abrir um player de vídeos, como por exemplo, o VLC, tal como mostrado na Figura 30. Figura 30 - Consultando a resolução do vídeo no VLC Após ajustada a resolução, na maioria dos casos, o vídeo/textura fica muito grande. Para reduzir o tamanho, o procedimento mais adequado é alterar somente a escala do objeto e deixar a resolução inalterada. 9.6 Fontes de conteúdo Repositório de objetos virtuais: Armazém 3D do Google Repositórios de sons: JaySound SoundBible FindSounds 36

38 9.7 Programas úteis Modelagem de objetos 3D (objetos virtuais): Google Sketchup Blender Vivaty Studio Autodesk Maya Autodesk 3D Studio Max Edição de imagens - GIMP Edição de sons - Audacity Conversão de arquivos de áudio Hamster Free Audio Converter Conversão de arquivos de vídeo Hamster Free Video Converter 37

39 10 Exemplos de mini aplicações no FLARAS Nessa seção são apresentados alguns exemplos que explicam passo a passo o processo de criação de algumas mini aplicações no FLARAS. As ideias desenvolvidas nesses exemplos servem de base para a construção de aplicações maiores e mais complexas. Os projetos dos exemplos estão disponíveis para download no site do FLARAS. 1. Uma aplicação que consiste unicamente de uma bicicleta associada a um ponto. 2. Alteração de propriedades da bicicleta do exemplo anterior 3. Uma aplicação que consiste de três cenas cadastradas em um único ponto. Em cada uma das cenas é colocado um veículo virtual (bicicleta, carro e avião). 4. Uma aplicação que consiste de três pontos, cada um possuindo uma única cena. Uma delas possui um veículo, a segunda um animal e a terceira um rádio de comunicação. 5. Uma aplicação completa (ArcoIris-RA), que ilustra um caso de múltiplos pontos e cenas sonorizados Cadastro de um objeto virtual do armazém 3D do Google 1. Baixando o objeto virtual Para começar você deve baixar modelos 3D para usar na ferramenta de autoria, recomenda-se fazer o download de modelos do armazém 3D do Google SketchUp. Encontra-se no seguinte endereço: No exemplo acima vamos procurar por uma bicicleta, apenas escreva o nome Bicicleta na barra de pesquisa e aperte Enter. Você receberá o resultado abaixo, clique em bicicleta de montaña, para ir à página do modelo. 38

40 Na página do modelo, representada abaixo, clique em Fazer download do modelo. Ao clicar nele aparecerá para você a seguinte caixa de diálogo, neste exemplo a sugestão é baixar o objeto no formato Collada (.zip), pois é um dos formatos de entrada para objetos 3D no FLARAS. 39

41 Após fazer o download do modelo 3D, não há necessidade de descompactá-lo, agora apenas abra a aplicação FLARAS. 2. Instalando o FLARAS Caso não tenha instalado previamente, baixe a versão mais recente do pacote de distribuição do FLARAS FLARAS-1.0-r1035.zip (ou mais recente) no seguinte endereço: A ferramenta FLARAS requer o Adobe AIR instalado, o mesmo pode ser conseguido no seguinte endereço: 40

42 Após a instalação do Adobe AIR, instale o FLARAS. Ao clicar para instalar o aplicativo, será apresentada a janela abaixo. Selecione Instalar, caso tenha baixado o aplicativo da fonte fornecida não é necessária a preocupação com a Identidade do Editor e as questões de acesso ao sistema são necessárias para a devida execução do aplicativo. 41

43 Ao prosseguir você será guiado a próxima tela, onde você pode selecionar o destino da instalação, apenas selecione Continuar. Após o término da instalação o aplicativo será iniciado, e você poderá começar com as atividades de autoria. 3. Iniciando Autoria A interface carrega uma lista vazia de pontos e cenas, portanto para adicionar o nosso objeto apenas selecionamos Objeto 3D nas últimas opções disponibilizadas na interface do usuário. Agora clicamos no botão... para exibir uma janela de navegação nas pastas do sistema, apenas selecione o arquivo onde você o baixou e selecione OK. 42

44 Pronto agora a bicicleta baixada do armazém 3D está associada ao ponto 1, tornando-se a cena 1, se desejar editar as características, apenas digite os valores nos campos correspondentes e aperte enter para visualizar as mudanças. Desta forma você está apto a adicionar quantos objetos desejar, ou modificar os já existentes, apenas pela seleção dos mesmos nos campos em destaque. Para alterar a posição dos objetos altere nos campos de Translação, para alterar a orientação dos objetos altere os campos Rotação e para alterar o tamanho dos objetos altere os campos Escala, dentro do quadro vermelho em destaque da figura acima. 43

45 10.2 Alteração de propriedades da bicicleta do exemplo anterior Primeiramente deve-se baixar o projeto da bicicleta cadastrada no FLARAS. O projeto está disponível no site do FLARAS com o nome arquivo objeto-virtual-armazem3d.flaras. Após baixar o arquivo basta abrir o FLARAS e abrir o projeto clicando em File > Open e selecionando o arquivo. Após aguardar o término do carregamento do projeto, pode-se partir para a edição das propriedades da bicicleta. Primeiro é preciso selecionar o ponto 1, na caixa de seleção de pontos. Em seguida deve-se selecionar a cena 1, na caixa de seleção de cenas. Ao fazê-lo o objeto virtual da bicicleta será exibido. 44

46 Como exemplo será alterada a escala para 1.5. Basta preencher esse novo valor nos três campos relativos à escala e pressionar ENTER. Também pode-se alterar a rotação, seguindo o mesmo procedimento indicado para alterar a escala. 45

47 10.3 Múltiplas cenas associadas a um mesmo ponto Como já possuímos conhecimento prévio sobre o download de modelos do armazém 3D, vamos a mais um rápido tutorial sobre como adicionar mais cenas a um mesmo ponto. Vamos baixar modelos relacionados a um tema, acredito que meios de transporte seja interessante, pois até mesmo temos a nossa bicicleta para utilizar, portanto baixemos mais dois objetos, talvez um carro, e o outro um avião. Agora que possuímos nossos modelos, vamos abrir o FLARAS, e iniciar o nosso trabalho. 46

48 Abrindo a interface principal, vamos selecionar novamente a bicicleta adicionada no tutorial anterior, clicando no botão.... Para o próximo objeto associado ao mesmo ponto devemos selecionar a caixa de diálogo que contém a lista de cenas associada ao ponto 1 e selecionar novo, para adicionar nova cena. Desta forma o seguinte resultado é obtido na primeira cena: 47

49 Repita o processo de adição exatamente como no item anterior: Prossiga mais uma vez para associar os três objetos, o resultado deve ser este: 48

50 Agora você possui três objetos associados num único ponto. A alternância entre eles é feita através do uso do marcador de interação no modo controle Trabalhando com múltiplos pontos Seguindo com o tutorial anterior onde adicionamos 3 objetos com o tema veículo, num mesmo ponto, vamos agora associar objetos com temas diferentes em pontos distintos, para incrementar a nossa aplicação em realidade aumentada. Primeiro vamos baixar nossos objetos no armazém 3D do Google, minha sugestão no tutorial utilizará além do tema transportes, usado anteriormente, animais e comunicação. 49

51 Um golfinho para o ponto 2 e, um rádio para o ponto 3. Após baixar os modelos, vamos à adição dos modelos, então vamos abrir a ferramenta FLARAS, e abrir o nosso projeto anterior. Após abrir o projeto, vamos executar um passo diferente do manual anterior, vamos selecionar Novo na seleção de pontos, ao invés de selecionar o ponto 1 já criado anteriormente. 50

52 E depois vamos selecionar na parte inferior o botão... para adicionar um objeto 3D diferente a um ponto diferente. Neste caso adicione o objeto Golfinho : 51

53 Repita esta mesma operação para adicionar o objeto rádio, e você terá o seguinte resultado: Três pontos, cada um contendo um tipo de tema diferente. Na figura abaixo são mostrados os três pontos desativados. 52

54 Na figura abaixo são mostrados os mesmos três pontos ativados, mostrando seus respectivos objetos Trabalhando com múltiplos pontos sonorizados Nesse exemplo será mostrada, passo a passo, a construção de uma pequena aplicação multimídia com o FLARAS com o tema arco-íris. São utilizados múltiplos pontos e cenas sonorizadas Estrutura básica da aplicação A aplicação consistirá de uma figura-base (ver abaixo) e, nas proximidades de cada um dos pontos vermelhos será adicionado um ponto do FLARAS contendo apenas uma cena sonorizada. Além disso, será adicionado um outro ponto, fora da região da imagem em que haverão múltiplas cenas sonorizadas. 53

55 O objeto virtual das cenas será apenas uma esfera colorida, que serve para indicar a posição do ponto para o usuário. 54

56 Adicionando a figura-base 1. Selecionar New na caixa de seleção de pontos. 2. Selecionar New na caixa de seleção de cenas. 3. Selecionar Texture. 4. Clicar no botão..., à frente do campo de texto URL. Ao selecionar a imagem, é essencial anotar a resolução da mesma (circulado de vermelho na imagem abaixo), para que ela seja adequadamente carregada no FLARAS. 55