UNIVERSIDADE PRESIDENTE ANTNIO CARLOS UNIPAC FACULDADE DE TECNOLOGIA E CINCIAS DE CONSELHEIRO LAFAIETE CURSO DE ENGENHARIA DA COMPUTAO

LEONARDO PEREIRA SANTOS

DEMONSTRADOR VIRTUAL DE AMBIENTES VIA WEB COM RECURSOS DE REALIDADE AUMENTADA

CONSELHEIRO LAFAIETE 2011

UNIVERSIDADE PRESIDENTE ANTNIO CARLOS UNIPAC FACULDADE DE TECNOLOGIA E CINCIAS DE CONSELHEIRO LAFAIETE CURSO DE ENGENHARIA DA COMPUTAO

LEONARDO PEREIRA SANTOS

DEMONSTRADOR VIRTUAL DE AMBIENTES VIA WEB COM RECURSOS DE REALIDADE AUMENTADA

Monografia

apresentada

ao

curso

de

Engenharia da Computao da Universidade Presidente Antnio Carlos UNIPAC, como requisito parcial para obteno do ttulo de Bacharel em Engenharia da Computao. Orientador: Jean Carlo Mendes

CONSELHEIRO LAFAIETE 2011

Leonardo Pereira Santos

DEMONSTRADOR VIRTUAL DE AMBIENTES VIA WEB COM RECURSOS DE REALIDADE AUMENTADA

Monografia apresentada Universidade Presidente Antnio Carlos UNIPAC, como requisito parcial para obteno do ttulo de Bacharel em Engenharia da Computao.

BANCA EXAMINADORA

Prof. Jean Carlo Mendes (Orientador) Universidade Presidente Antnio Carlos UNIPAC

Prof. Klber Netto Fonseca Universidade Presidente Antnio Carlos UNIPAC

Aprovada em: ___/___/___

Dedico esse trabalho minha me Judith, e minha irm Jssica, meus exemplos, e minha fonte de apoio incondicional em todos os momentos.

AGRADECIMENTOS
Agradeo primeiramente a Deus pela oportunidade a mim concedida de poder estar concluindo a graduao. minha me por ser a principal responsvel pela minha escolha da rea de computao e estar hoje consciente de que fiz a escolha mais feliz e certa para a minha carreira profissional e realizao pessoal. Agradeo tambm a ela pelo grande apoio, estando sempre presente aconselhando-me e incentivando-me a realizar o me ideal. minha querida irm, Jssica, pela sincronia de pensamentos e palavras positivas, sempre me motivando a avanar em busca da realizao do meu ideal, fazendo-me acreditar que seria capaz de realizar os meus sonhos. Ao meu pai, pelas oraes e apoio. De maneira especial, aos meus tios Hlio e Maria Amlia e minha querida prima Daniela pelo apoio, conselhos e oraes ao meu favor e pelo presente do meu primeiro computador, que foi meu fiel companheiro de estudo nos perodos iniciais do curso. Ao meu amigo Gil, pelo companheirismo durante o curso e pela nossa parceria na ideia e no desenvolvimento deste trabalho. Ao Rodrigo, pela importante ajuda no desenvolvimento do cdigo da minha aplicao e concretizao do meu trabalho. Aos demais familiares e amigos que foram marcantes com o apoio e oraes ao meu favor, e que tenho certeza de que compartilham comigo mais essa minha vitria. Ao meu orientador Jean Carlo pela orientao e incentivo a mim dedicados, sempre com uma pitada de humor (NaN), motivando-me para a concretizao de mais este objetivo. equipe TI da CSN: Mrcio, Rogrio, Marcelino, Lucas, Andr, Cezanne, Marcus, Maykon, Leonardo, Luciano, Felipe, Fernando e Vtor, pelo exemplo tcnico e profissional, pelo companheirismo e contribuio para o meu crescimento profissional. Agradeo aos professores Rone Ildio, Luciana Carla, Emerson Tavares, Daniella Barros, Klber Fonseca, Alfredo Ganime e Wesley Luciano, pelo conhecimento transmitido, e exemplo profissional, que me foram de grande valia no desenvolvimento deste trabalho. Agradeo aos demais colegas de classe, especialmente ao Wesley Polidoro, Shirley Baslio e Antnio Jos, pela parceria e os bons momentos compartilhados em classe.

The product is no longer the basis of value. The experience is. Venkat Ramaswamy

Ns estamos vivendo na economia da experincia e o cliente a estrela do show. Se eu vou gastar milhares de dlares em alguma coisa, quero ter a experincia de isso ser um conto de fadas. Milton Pedraza

RESUMO
A monografia trata da implementao de um sistema de um Demonstrador virtual de ambientes via web com recursos de Realidade Aumentada. O sistema visa suprir a necessidade de exibio de algum ambiente em aplicaes web, como por exemplo, a demonstrao de um imvel ou um projeto arquitetnico. Para isso, o usurio visualiza e interage com um ambiente virtual 3-D. Como forma de aumentar a interao com o usurio, o sistema possui recursos de reconhecimento angular e rotacional do marcador da Realidade Aumentada.

Palavras-chave: Realidade Aumentada, 3-D, Interatividade

ABSTRACT
The monograph consists in implementing a system of a virtual web Demonstrator of environments with Augmented Reality resources. The system aims to fill a need to display some web application environment, such as the demonstration of a building or an architectural design. For this, the user sees and interacts with a 3-D virtual environment. The system simulates a building in 3-D with which the user interacts through Augmented Reality. In order to increase the user interaction, the system has features of angular and rotational recognition of the Augmented Reality marker.

Keywords: Augmented Reality, 3-D, Interactivity

LISTA DE FIGURAS

Figura 1 Sensorama ............................................................................................................... 18 Figura 2- Diagrama de realidade/virtualidade contnua. .......................................................... 20 Figura 3 - Exemplos de uso da Realidade Aumentada na publicidade .................................... 21 Figura 4 - Diagrama de funcionamento do ARToolkit............................................................. 27 Figura 5 Imagem capturada pela cmera ............................................................................... 29 Figura 6 - Imagem limiarizada ................................................................................................. 29 Figura 7 - Imagem binarizada ................................................................................................... 30 Figura 8 - Marcadores encontrados pelo FLARToolKit .......................................................... 30 Figura 9 - rea do marcador utilizada para comparao .......................................................... 31 Figura 10 - Tabela de comparao dos marcadores identificados ............................................ 32 Figura 11 - Destaque para o marcador reconhecido pelo FLARToolkit .................................. 32 Figura 12 - Relacionamento entre as coordenadas do marcador e da cmera .......................... 33 Figura 13 - Objeto virtual integrado ao ambiente real ............................................................. 33 Figura 14 Exemplo de cdigo de barras ................................................................................ 36 Figura 15 Exemplo de um QR Code contendo um texto....................................................... 37 Figura 16 Direes das informaes dos cdigos ................................................................. 37 Figura 17 Leitura de um QR Code por um Celular ............................................................... 38 Figura 18 - Exemplos de marcadores fiduciais ........................................................................ 39 Figura 19 - Marker Generator em funcionamento .................................................................... 40 Figura 20 Exemplos de marcadores corretos e incorretos ..................................................... 40 Figura 21 Coordenadas do marcador ..................................................................................... 41 Figura 22 - Cubo montvel com marcadores representando os diversos ambientes ................ 43 Figura 23 - Cubo montado ........................................................................................................ 44

Figura 24 Tela de confirmao de acesso cmera .............................................................. 44 Figura 25 - Diagrama do fluxo de funcionamento do sistema ................................................. 45 Figura 26 - Estrutura das pastas do projeto no FlashDevelop .................................................. 47 Figura 27 - Funo FLARCode com parmetros padres ........................................................ 48 Figura 28 - Funo onFrameCapturado .................................................................................... 49 Figura 29 - Funo onFrameCapturado .................................................................................... 50 Figura 30 - Funo MovimentoXYZ ........................................................................................ 51 Figura 31 - Funo verificarAcoes ........................................................................................... 52 Figura 32 Tela com os valores de posio e a ao a ser realizada ....................................... 53 Figura 33 - QRCode para acesso aplicao Web ................................................................... 54 Figura 34 - Aplicao Web ....................................................................................................... 54 Figura 35 - Aplicao Web ativa exibindo o estdio Mineiro ................................................ 55

LISTA DE TABELAS

Tabela 1 Interfaces de interao computacionais .................................................................. 24 Tabela 2 Comparao entre as bibliotecas de Realidade Aumentada ................................... 28 Tabela 3 - Classes e formatos suportados pelo Papervision3D ................................................ 34 Tabela 4 Capacidades de armazenamento de um QR Code .................................................. 37 Tabela 5 Ferramentas instaladas ............................................................................................ 46 Tabela 6 Classes bsicas do FLARToolkit ............................................................................ 48 Tabela 7 Padro de atribuio de movimento ....................................................................... 50

LISTA DE ABREVIATURAS E SIGLAS

3D Trs dimenses API - Application Programming Interface (Interface de Programao de Aplicativos) AS3 ActionScript 3 CS5 Creative Suite 5 iOS iPhone OS (Sistema Operacional para iPhone) PDF Portable Document Format QRCode Quick Response code ( Cdigo de Resposta Rpida) RA Realidade Aumentada RF Requisito Funcional RIA Rich Internet Application (Aplicao Rica de Internet) RNF Requisito no-Funcional RV Realidade Virtual RVA Realidade Virtual e Aumentada SO Sistema Operacional TV Televiso

SUMRIO

1.

INTRODUO ........................................................................................................ 14
1.1. Justificativa ............................................................................................................................................ 15 1.2. Objetivos ............................................................................................................................................... 16 1.2.1. Objetivo Geral ............................................................................................................................... 16 1.2.2. Objetivos Especficos .................................................................................................................... 16 1.3. Estrutura da Monografia ........................................................................................................................ 16 1.4. Metodologia ........................................................................................................................................... 17

2.

REFERENCIAL TERICO ................................................................................... 18

2.1. Realidade Virtual ................................................................................................................................... 18 2.2. Ambiente Virtual ................................................................................................................................... 19 2.3. Realidade Misturada .............................................................................................................................. 19 2.4. Realidade Aumentada ............................................................................................................................ 20 2.5. Diferenas entre Realidade Virtual e Realidade Aumentada ................................................................. 22 2.6. RIA Rich Internet Application............................................................................................................ 23 2.7. Interatividade ......................................................................................................................................... 23 2.7.1. Interface ......................................................................................................................................... 23 2.7.2. Interao Humano Computador (IHC) ....................................................................................... 24 2.8. Adobe Flash ........................................................................................................................................... 25 2.9. FlashDevelop ......................................................................................................................................... 25 2.10. ActionScript3 ..................................................................................................................................... 25 2.11. ARToolkit .......................................................................................................................................... 26 2.12. FLARToolkit ..................................................................................................................................... 27 2.13. Ferramentas 3D ................................................................................................................................. 34 2.13.1. Papervision3D ............................................................................................................................... 34 2.13.2. Google SketchUp ........................................................................................................................... 35 2.13.3. Blender3D...................................................................................................................................... 35 2.14. Cdigos Interativos ............................................................................................................................ 35 2.14.1. Cdigos de barras .......................................................................................................................... 36 2.14.2. QR Code ........................................................................................................................................ 36 2.15. Marcador ........................................................................................................................................... 38

3.
3.1. 3.2. 3.3. 3.4. 3.5. 3.6. 3.7. 3.8.

Desenvolvimento ....................................................................................................... 42
Interface de interao............................................................................................................................. 42 Ferramentas utilizadas ........................................................................................................................... 46 Classes ................................................................................................................................................... 47 Padres Utilizados ................................................................................................................................. 48 Funes criadas ..................................................................................................................................... 49 Testes ..................................................................................................................................................... 52 Aplicao Web ...................................................................................................................................... 53 Testes finais ........................................................................................................................................... 55

4.
4.1. 4.2.

CONSIDERAES FINAIS ................................................................................... 56

Concluso .............................................................................................................................................. 56 Trabalhos futuros ................................................................................................................................... 56

5.

REFERENCIAS ....................................................................................................... 58

APNDICE A Engenharia de Software do sistema ..................................................... 60

1. 2. 3. 4. 5.

Requisitos funcionais................................................................................................................................. 60 Requisitos No funcionais ......................................................................................................................... 61 Limitaes do sistema ............................................................................................................................... 61 Requisitos de desempenho: ....................................................................................................................... 61 Diagrama de Casos de Uso ........................................................................................................................ 62

14

1.

INTRODUO

Desde a antiguidade o homem busca formas de interao com as pessoas, objetos e ferramentas de trabalho. At a idade mdia, tal interao era obtida atravs de mtodos artesanais, tais como pintura e outros mtodos como a escrita e a fala. Aps a Revoluo industrial, o homem foi obrigado a interagir com mquinas, abstraindo funes de botes e alavancas. Aps o advento da computao, foi introduzido um novo modelo de interao, mais abstrato, onde se tornou necessrio um treinamento mais completo, pois passava a deixar de lado o mundo real para tratar do mundo virtual. Tal modelo, apesar dos benefcios, se tornou restrito a um grupo seleto de pessoas, pois necessitava grande conhecimento e capacidade elevada de adaptao com o sistema. Vrias tentativas foram feitas para mudar este quadro. Os pesquisadores passaram a buscar meios para o sistema se adaptar ao usurio. Algumas interfaces interativas foram surgindo, tais como: interfaces de voz, telas sensveis ao toque, reconhecimento de movimentos, entre vrios outros. Observa-se tambm que tais inovaes somente foram possveis graas evoluo dos computadores. O modelo ideal de interatividade quando o usurio no mais percebe a presena da tecnologia, que estar trabalhando a seu favor de uma forma invisvel e por toda a parte. Com base nisto, temos a Realidade Aumentada e a Realidade Virtual, que so tratadas como interfaces computacionais avanadas. Este trabalho busca mostrar mais um exemplo para a introduo de tal tecnologia na sociedade. Passando pelos comandos de chaves e lmpadas dos primeiros computadores, at os sistemas operacionais (SO) modernos, vemos cada vez mais o advento de novas tcnicas para tornar mais fcil tal interao. Apesar das vrias funes dos SO modernos, ainda ficamos presos a uma tela e a representaes de cones e menus. A integrao da tecnologia no nosso dia-a-dia trouxe uma busca por uma relao mais natural e amigvel do sistema com o

15

usurio. Essa busca levou ao desenvolvimento de diversos sistemas interativos, entre estes, a Realidade Virtual. Atualmente podemos ver o propsito dessa tecnologia em prtica em vrios lugares, muitas vezes sem perceb-la: ao assistir um jogo de futebol, quando a TV mostra um tirateima de um impedimento, traando uma linha para confirmar um impedimento ou utilizando computao grfica para reproduzir a posio dos jogadores; em vrios programas com interao entre cenrio e apresentadores como jornais (apresentando resumos virtuais no cenrio enquanto o jornalista d a notcia) e num caso mais famoso, no programa Fantstico da Rede Globo, onde os apresentadores interagem com o cenrio; vemos tambm seu uso em campanhas publicitrias como as do Ita e do Vectra que foram amplamente divulgadas em comerciais na TV.

1.1.

Justificativa
A forma mais comum de se conhecer um local visit-lo. Partindo desse princpio,

buscou-se aplicar as funcionalidades de Realidade Virtual e Aumentada para criar uma nova maneira de se conhecer um local. Pensando na praticidade e funcionalidade para realizar as tarefas dirias, minimizando dificuldades e tempo, foi criado utilizando mtodos de Realidade Aumentada (RA) a visualizao ampla de ambientes imobilirios tornando mais objetiva, por exemplo, a escolha de um imvel antes de ir ao seu local para visita-lo, tendo uma perfeita visualizao atravs de um ambiente virtual disponvel na web. Ou ainda aos pais e filhos, conhecer ambientes escolares, hotis, pontos tursticos, enfim, qualquer objeto de pesquisa que se tenham interesses especficos. Foi buscado um meio simples e inovador para a exibio de diversos ambientes, de forma que o usurio da aplicao pudesse acessar de qualquer local, e dispondo de poucos recursos. Tal forma de exibio de ambientes foca a usabilidade por meio do usurio, e a riqueza de detalhes possveis de serem exibidos em um clipe 3D. Objetiva-se proporcionar ao usurio uma sensao nova, atravs de recursos simples: uma webcam, um cubo montvel e acesso internet. Essa simplicidade dos recursos necessrios torna a aplicao acessvel uma parcela maior da populao, tornando este um meio mais eficiente de marketing.

16

Partindo da motivao pelo fascnio da interatividade proporcionada pelo uso da RA, pretende-se tambm despertar o interesse de novos usurios pela informtica.

1.2.

Objetivos Objetivo Geral

1.2.1.

Criar um moderno e objetivo sistema de marketing imobilirio motivado pela eficincia e objetividade proporcionadas por um sistema de Realidade Aumentada. O sistema ir contribuir simplificando e popularizando a visualizao de diversos ambientes e lugares.

1.2.2.

Objetivos Especficos

Estudar a os seguintes temas: Teoria da Realidade Aumentada; Desenvolvimento Flash; Design 3-D; A biblioteca de Realidade Aumentada FLARToolKit; Interatividade.

Analisar trabalhos afins, buscando os melhores meios de desenvolvimento.

1.3.

Estrutura da Monografia
O trabalho est divido em quatro captulos, sendo o captulo um a introduo, que

contm a apresentao dos objetivos gerais e especficos, alm da justificativa e metodologia do trabalho. O captulo dois apresenta o referencial terico, onde so expostos os conceitos bsicos para o entendimento do trabalho. No captulo trs so apresentados os resultados dos

17

testes e a implementao do trabalho. O captulo quatro apresenta as consideraes finais por meio da concluso e sugesto para trabalhos futuros.

1.4.

Metodologia
O desenvolvimento do sistema proposto foi fundamentado no uso da biblioteca Flash de

Realidade Aumentada FLARToolkit combinada biblioteca de renderizao 3D Papervision3D. O uso dessa biblioteca possibilita a execuo da aplicao diretamente do navegador de internet. tambm porttil quanto plataforma, sendo possvel a sua execuo em diversas arquiteturas e sistemas operacionais, desde que este possua instalado o plugin do FlashPlayer.

18

2. REFERENCIAL TERICO

2.1.

Realidade Virtual
A Realidade Aumentada faz parte dos estudos de Realidade Virtual, portanto, este

projeto explicar primeiro o que Realidade Virtual para depois tratar de Realidade Aumentada. Realidade Virtual uma simulao do mundo real gerada por computador que propicia ao usurio do sistema uma interface avanada para execuo de tarefas em tempo real no computador, oferecendo ao usurio a possibilidade de interagir com o sistema com vrios recursos como visualizao e movimentao, e tambm utilizando os sentidos, como viso, tato, audio e olfato. De acordo com Pimentel (1995), a Realidade Virtual (RV) o uso de alta tecnologia para convencer o usurio de que ele est em outra realidade, promovendo completamente o seu envolvimento. Os primeiros relatos de seu uso datam do perodo ps 2 Guerra Mundial, com o desenvolvimento dos primeiros simuladores de voo da Fora Area dos Estados Unidos. Anos depois, em 1948, o cientista Morton Heilig desenvolveu uma mquina chamada Sensorama, que simulava a pilotagem de uma motocicleta. O Sensorama teve seu primeiro prottipo construdo em 1962.

Figura 1 Sensorama Fonte: http://thirddimensionknowledge.blogspot.com/2011/01/father-of-virtual-reality.html

19

Devido ao desenvolvimento dos computadores e popularizao da tecnologia e, o estudo da Realidade Virtual foi ampliado, possibilitando seu uso em diversas reas, tais como: Sade; Entretenimento; Publicidade; Arquitetura; Educao; Treinamentos; Militar.

2.2.

Ambiente Virtual
Ambiente virtual a representao virtual de um determinado espao fsico

reproduzindo fielmente as suas mexidas de altura, largura e profundidade. Tem como princpio proporcionar ao usurio a sensao de fazer parte deste, utilizando os elementos disponveis para sua interao. Segundo Kirner (2003) a informao pode facilmente ser representada em mundos virtuais, principalmente porque seu formato visual do modo coloquial, com o qual o usurio est acostumado no seu dia a dia. Atravs dos elementos existentes dentro do mundo virtual, e a sua representao no mundo real, o usurio sente-se vontade em interagir com o ambiente.

2.3.

Realidade Misturada
De acordo com Kirner (2003) a definio mais comum de Realidade Aumentada a

sobreposio de objetos virtuais tridimensionais, gerados por computador, com um ambiente real, por meio de algum dispositivo tecnolgico. Porm esta uma definio bastante genrica que s esclarecida ao estudar a Realidade Misturada. A Realidade Misturada apresenta duas modalidades: Realidade Aumentada e Virtualidade Aumentada. [KIRNER, C.; TORI, R. (2004)], de acordo com a imagem abaixo.

20

Figura 2- Diagrama de realidade/virtualidade contnua. Fonte: (Kato, 2000)

2.4.

Realidade Aumentada
Qual a metfora para o computador do futuro? O agente inteligente? A televiso multimdia? Um mundo grfico tridimensional? O computador ubquo, comandado por voz, da srie Jornada nas Estrelas? A interface do Desktop remodelada? A mquina que magicamente realiza os desejos? Eu penso que a resposta certa seria nenhuma das opes acima, porque na minha opinio todos esses conceitos compartilham uma mesma falha bsica: eles tornam o computador visvel. Uma boa ferramenta aquela invisvel. Por invisvel, quero dizer que a ferramenta no interfere na nossa conscincia: voc foca na tarefa e no na ferramenta. 1 (Mark Weiser , 1991)

De acordo com Azuma (1997), Realidade Aumentada uma linha de pesquisa da computao que visa integrar o mundo real com elementos virtuais ou dados gerados pelo computador. Os exemplos de sua aplicao mais vistos na atualidade so em jogos e campanhas publicitrias. A figura 3 mostra uma das primeiras campanhas a ter visibilidade: um jogo onde ao mostrar o marcador para a cmera, o usurio faz um test drive online, dirigindo o Vectra GT por uma pista virtual, e outra, mais recente, que exibe os novos produtos e servios do banco Ita.

Mark Weiser, ex-chefe cientista da Xerox PARC, considerado o pai da Computao Ubqua e da Tecnologia Calma. (1991)

21

Figura 3 - Exemplos de uso da Realidade Aumentada na publicidade Fontes: http://www.messa.com.br/eric/ecode/uploaded_images/vectra-760460.jpg e http://cricketdesign.com.br/blog/wp-content/uploads/2010/07/AFC-12021-011-Rv.jpg

As pesquisas atuais buscam formas para seu uso na transmisso ao vivo de vdeos, onde so processados e adicionados grficos do computador, e tambm seu uso em rastreamento de dados em movimento, reconhecimento mais avanado de marcadores e a construo de ambientes controlados que possuam qualquer nmero de controladores e atuadores. A definio de Azuma (1997) a mais aceita pelos pesquisadores: Realidade Aumentada um ambiente que envolve tanto realidade virtual como elementos do mundo

22

real, criando um ambiente misto em tempo real. Por exemplo, um usurio da RA pode utilizar culos translcidos, e atravs destes, ele poderia ver o mundo real, bem como imagens geradas por computador projetadas no mundo. Tambm de acordo com Azuma(1997), um sistema de Realidade Aumentada seria aquele sistema capaz de: Combinar elementos reais com o ambiente real; Fornecer interatividade e processamento em tempo real; desenvolvida em 3-D.

Considerando o sentido da viso, alm de permitir que objetos visuais possam ser introduzidos em ambientes reais, a Realidade Aumentada tambm proporciona ao usurio o manuseio desses objetos com as prprias mos, possibilitando uma interao natural e atrativa com o ambiente (Zorzal, 2009 apud Billinghurst, 2001; Santin,2004;Zhou,2004). Atualmente vemos aplicaes de Realidade Aumentada em vrias reas: jogos, publicidade, educao, bioengenharia, fsica, geologia, entre outras.

2.5.

Diferenas entre Realidade Virtual e Realidade Aumentada

O surgimento da realidade virtual trouxe vrios avanos com relao interatividade

do usurio com o sistema. Com a evoluo da tecnologia, foi possvel o uso de computao grfica em tempo real. Apesar destas vantagens, a Realidade Virtual se tornou um pouco incmoda, por ser necessrio o uso de equipamentos como capacete, luvas, culos 3-D, e muitas vezes tambm treinamento. Fatos que afastaram a tecnologia do pblico comum. A evoluo que permitiu o avano dos estudos da Realidade Virtual tambm permitiu o surgimento da Realidade Aumentada, que implementou um novo conceito, onde o ambiente real aumentado com objetos virtuais, utilizando algum dispositivo tecnolgico. No incio dos anos 2000, houve uma maior busca pelo desenvolvimento de aplicaes que oferecessem um melhor custo-benefcio. Foi ento que o interesse pela Realidade Aumentada comeou a ganhar fora, o que a torna a tecnologia mais atraente para o desenvolvimento de interfaces para o pblico geral.

23

Diferente da Realidade Virtual, no h a necessidade de equipamentos caros e complexos, flexvel quanto s plataformas, oferece grande mobilidade, e oferece uma interface mais intuitiva ao usurio, se tornando mais abrangente.

2.6.

RIA Rich Internet Application

Os sistemas de Realidade aumentada so considerados como aplicaes RIA. De

acordo com a Adobe, aplicaes RIA, Aplicaes Ricas para Internet, so aplicaes que oferecem algum tipo de interao com o usurio e so executadas diretamente do navegador de Internet. So exemplos: animaes, vdeos, jogos, entre outros. Sua execuo independe do sistema operacional, sendo assim de grande flexibilidade de uso. A maior parte das aplicaes RIA so desenvolvidas em Flash, Silverlight, e JavaScript. As aplicaes RIA possuem foco no usurio, utilizando conceitos da web 2.0, com maior enfoque na interatividade com o usurio.

2.7.

Interatividade
Sistemas so considerados interativos quando oferecem ao usurio a possibilidade de

responder s vrias entradas possveis, modificando em tempo real o ambiente ou o objeto virtual apresentado, proporcionando a sensao de imerso no sistema. Sistemas interativos so bastante utilizados em aplicaes educacionais (ensino a distncia, jogos educativos), jogos e em aes de marketing (vdeos, jogos, banners).

2.7.1.

Interface

Interface qualquer dispositivo real ou virtual que oferece interao entre dois ou mais itens. So exemplos de interface: a tela de um computador, uma maaneta, entre outros.

24

Ao focar apenas em sistemas de computao, percebe-se uma grande evoluo quanto s interfaces de acordo com a tabela 1. Houve uma adaptao das interfaces para se adequarem conforme a demanda dos usurios. Gerao 1945 Tipo de Uso Clculos de Mecnica e Eltrica Mquina de calcular, 1955 Processador de informaes. Mecanizao de atividades repetitivas e no criativas. Computador como uma ferramenta. Computador como um aparelho eletrnico Computador como Atualmente uma central multimdia Todas as pessoas, todas as classes sociais. Usurios Os prprios inventores Grupos especializados sem conhecimento computacional. Grupos especializados sem conhecimento computacional Profissionais e curiosos Menus hierrquicos e preenchimento de formulrios Mouse, cones e janelas. Equipamentos multimdia Telas sensveis, reconhecimento de imagens, voz e gestos. Linhas de comando Interface de interao Movimentos de chaves e cabos

1965

1985

1995

Todas as pessoas

Tabela 1 Interfaces de interao computacionais Fonte: Adaptado de (VIEIRA DA ROCHA; BARANAUSKAS, 2003).

2.7.2.

Interao Humano Computador (IHC)

A Interao Humano-Computador (IHC) pode ser definida como a disciplina relativa ao design, avaliao e implementao de sistemas computacionais interativos para uso humano e aos fenmenos que os cercam, (VIEIRA DA ROCHA; BARANAUSKAS, 2003). De acordo com Norman (1998, apud VIEIRA DA ROCHA; BARANAUSKAS, 2003), um sistema ideal deve esconder a tecnologia do usurio, para que o usurio no perceba sua presena no SO. O objetivo permitir que as pessoas faam suas atividades, com

25

a tecnologia aumentando a sua produtividade por ser algo invisvel ao usurio. O usurio deve ser capaz apenas de aprender a tarefa, no a tecnologia. As atividades do usurio devem ser simples, versteis e prazerosas.

2.8.

Adobe Flash
O Adobe Flash uma ferramenta para o desenvolvimento de animaes interativas. As animaes por ele geradas so executadas pelo navegador Web (Google Chrome,

Mozilla Firefox, Internet Explorer, entre outros) atravs do Adobe Flash Player, uma mquina virtual capaz de executar as aplicaes em Flash. Percebe-se seu uso em: Banners de sites, Charges animadas, Jogos via Web, entre outros. Atualmente est na verso CS5.5.

2.9.

FlashDevelop
O FlashDevelop uma ferramenta de desenvolvimento livre e de cdigo aberto que

oferece suporte para o ActionScript verses 2 e 3. Apesar de ser uma ferramenta de desenvolvimento Flash, no possui uma interface para desenvolvimento grfico, sendo seus aplicativos desenvolvidos apenas por meio de cdigo. Para o desenvolvimento deste projeto, foi utilizada a verso 3.3.1.

2.10.

ActionScript3

uma linguagem de programao orientada a objetos. Foi desenvolvida com base em ECMAScript e seu uso direcionado para o desenvolvimentos de RIAs (Rich Internet Applications - Aplicaes Ricas de Internet). Suas aplicaes podem ser executadas em qualquer Sistema Operacional, por meio de uma Mquina Virtual.

26

2.11.

ARToolkit

uma biblioteca desenvolvida em C++ para o desenvolvimento de aplicaes de Realidade Aumentada. O ARToolkit uma biblioteca livre para usar em propsitos no comerciais e distribudo com cdigo aberto sob licena GPL. capaz de executar em diversas plataformas, entre elas: SGI Irix, PC Linux, PC Windows 95/98/NT/2000/XP/Vista e Mac OS X. O ARToolKit foi desenvolvido pelo Dr. Hirozaku Kato da Universidade de Osaka, no Japo e apoiado pelo Human Interface Technology Laboratory da Universidade de Washington e de Canterbury, na Nova Zelndia e tambm pelo laboratrio de multimdia do MIT. Usa tcnicas de viso computacional para calcular a posio no espao real da cmera e sua orientao em relao aos cartes marcadores, o que permite ao desenvolvedor a sobreposio dos objetos virtuais pelos cartes. O pacote inclui bibliotecas de rastreamento e disponibiliza o cdigo fonte completo, tornando possvel o transporte do cdigo para diversas plataformas ou adapt-los para resolver as especificidades de suas aplicaes. O ARToolkit usa tcnicas de viso computacional para o clculo da posio real da cmera e a orientao dos marcadores. Para isso, o marcador capturado pela cmera e transformado em binrio, a partir do valor do limiar; procura-se ento nesta imagem por regies quadradas ou retangulares, e as compara com um padro existente na base de dados. Caso a imagem relativa regio quadrada seja reconhecida como um marcador, a posio da imagem calculada. Uma matriz 3X4 preenchida com as coordenadas relativas ao marcador. Com base nessa matriz, definese o conjunto das coordenadas virtuais correspondentes ao objeto virtual a ser posicionado no marcador. Para calcular as coordenadas virtuais da cmera e desenhar as imagens virtuais utilizada a API OpenGL. A imagem a seguir ilustra o funcionamento da biblioteca:

27

Figura 4 - Diagrama de funcionamento do ARToolkit Fonte: (Kirner, 2004)

2.12.

FLARToolkit

O FLARToolkit [Koyama, 2010] uma biblioteca de Realidade Aumentada em ActionScript traduzida por Saquoosha em 2008 a partir do NyARToolkit, que escrita em Java. Esta linguagem pode ser executada por qualquer browser com o plugin do Adobe Flash Player. tambm uma plataforma bastante flexvel, possibilitando o desenvolvimento de aplicaes para diversas plataformas, como demonstra a Tabela 1. Basicamente, possvel desenvolver aplicaes com o FLARToolKit para qualquer computador ou dispositivo mvel que oferea suporte ao Flash. Seus aplicativos podem ser executados localmente ou como cliente/servidor.

28

Tecnologias de Realidade Aumentada ARSTudio ARTag ARToolKit ARToolKitPlus DART FLARTolKit JARToolKit Desktop Sim Sim Sim No Sim Sim Sim

Plataformas Web No No No No No Sim No Dispositivos Mveis No No No Sim No Sim No

Tabela 2 Comparao entre as bibliotecas de Realidade Aumentada

Segundo Kirner, 2011, sua plataforma livre, aliada ao fato de vrios profissionais de publicidade utilizarem o Flash em seus trabalhos, o fez ganhar visibilidade e popularidade em aplicaes de Realidade Aumentada. A biblioteca FLARToolKit possui diversas funes interativas, possibilitando seu uso em aplicaes com aes variadas. Como exemplos: comandos de voz, coliso entre objetos virtuais, ocluso de marcadores, clculo de distncia entre diversos marcadores, orientao espacial dos marcadores, entre outras funcionalidades. Segundo Koyama (2010) seu funcionamento segue etapas bem parecidas com as do ARToolkit: Captura da imagem da cmera realizada durante toda a aplicao,

I.

considerando os parmetros de cmera e marcadores j definidos.

29

Figura 5 Imagem capturada pela cmera Fonte: (Siscoutto e Filho apud KATO, 2011)

II.

Criao do mapa de bits da imagem limiarizada A partir da imagem

capturada, a imagem binarizada, para facilitar a deteco de possveis marcadores.

Figura 6 - Imagem limiarizada Fonte: (Siscoutto e Filho apud KATO, 2011)

30

Figura 7 - Imagem binarizada Fonte: (Siscoutto e Filho apud KATO, 2011)

III.

Deteco dos quadrados feita uma busca por quadrados (possveis

marcadores) rastreando a imagem capturada.

Figura 8 - Marcadores encontrados pelo FLARToolKit Fonte: (Siscoutto e Filho apud KATO, 2011)

Na imagem acima, foram encontrados quatro possveis marcadores. Como forma de otimizao do desempenho, tomado como padro para a anlise de identificao, o FLARToolKit utilizar apenas 50% da rea do possvel marcador para analis-lo com os marcadores j cadastrados. Dependendo da complexidade entre marcadores exigida pela aplicao, o desenvolvedor pode alterar a porcentagem da rea a ser rastreada alterando os valores dos parmetros i_markerPercentWidth e i_markerPercentHeight na funo FLARCode() em

org.libspark.flartoolkit.core.FLARCode.

31

Figura 9 - rea do marcador utilizada para comparao Fonte: (Siscoutto e Filho apud KATO, 2011)

IV.

Identificao e comparao dos marcadores Aps o reconhecimento

de possveis marcadores pelo sistema, estes so comparados com os marcadores j registrados. Para esta comparao, cada marcador registrado comparado com cada marcador identificado, de forma que a comparao se realize atravs da tcnica de homografia, onde se faz uma comparao a cada rotao de 90 do marcador registrado com um marcador identificado, gerando um resultado de 0 a 1 (Siscoutto e Filho, 2011). A proximidade do valor encontrado a 1 ir definir se o marcador encontrado o mesmo cadastrado pela aplicao. Como um segundo parmetro de comparao, tambm definido um grau de confiana, onde o valor encontrado deve sempre ser superior a este. Como definio geral, costuma-se utilizar o grau de confiana superior a 0,7, ou seja, o marcador encontrado tem que possuir no mnimo 70% de semelhana com o marcador cadastrado. Este grau de confiana importante, pois a imagem captada pela cmera pode sofrer deformaes de acordo com a luminosidade, ngulo de captura, tamanho, entre outros fatores. Portanto, o grau de confiana deve ser um valor suficiente para desprezar pequenas deformidades do marcador correto, e no reconhecer marcadores incorretos.

32

Figura 10 - Tabela de comparao dos marcadores identificados Fonte: (Siscoutto e Filho apud KATO, 2011)

O aplicativo reconhece como marcador a imagem cujo valor encontrado seja o maior valor maior que o grau de confiana.

Figura 11 - Destaque para o marcador reconhecido pelo FLARToolkit Fonte: (Siscoutto e Filho apud KATO, 2011)

V.

Calculo da matriz de transformao Aps a identificao dos

marcadores, o aplicativo determina o posicionamento do objeto virtual a ser inserido. calculada uma matriz de transformao a partir de um sistema de coordenadas da cmera. O FLARToolkit utiliza para realizar o clculo com um ponto 3D no marcador identificado, uma matriz 3X4, denominada Matriz Transformao. O resultado deste clculo determina o ponto no sistema de coordenadas da cmera em que o objeto virtual ser situado (Siscouto e Filho apud Kirner, 2011).

33

Figura 12 - Relacionamento entre as coordenadas do marcador e da cmera Fonte: (Siscoutto e Filho apud KATO, 2011)

O FLARToolKit utiliza os parmetros de cmera para realizar a correo de distores, assim como no ARToolKit. Segundo Cabana (2010), O arquivo cmera_para.dat encontrado na biblioteca do FLARToolkit representa estes parmetros, sendo considerado o cerne do FLARToolKit, que muito provavelmente no precisar ser alterado, a no ser em casos especficos e em projetos mais avanados. Renderizao dos objetos virtuais Com o auxlio de uma engine 3D

VI.

(neste projeto ser utilizado o Papervision3D), os objetos sero renderizados na tela a partir das informaes de posicionamento e qual foi o objeto selecionado.

Figura 13 - Objeto virtual integrado ao ambiente real Fonte: (Siscoutto e Filho apud KATO, 2011)

34

2.13.

Ferramentas 3D

necessrio o uso de ferramentas 3D para a criao e a renderizao dos modelos a serem exibidos. No projeto foi dada nfase no uso de ferramentas gratuitas, como o Google Sketchup e o Blender3D para a edio dos modelos, e o Papervision3D para a renderizao dos objetos 3D na cena.

2.13.1.

Papervision3D

Segundo Saqoosha (2010), o FLARToolKit apenas calcula a orientao dos marcadores, definindo a posio dos objetos virtuais e outras aes como movimentao e escala, mas no renderiza os objetos 3D da cena. Sendo assim, se faz necessrio o uso de uma biblioteca especfica para objetos 3D. Uma das bibliotecas disponveis o Papervision3D, que uma biblioteca em ActionScript 3.0, e faz uso da API 3D do Flash. para gerar animaes e interaes em 3D. O FLARToolKit utiliza o Papervision3D para a renderizao dos objetos 3D de diversos formatos. A tabela abaixo detalha as classes e formatos suportados pelo Papervision3D.

Classe Ase Collada DAE KMZ Max3DS MD2 Sketchup Sketchup Collada

Descrio Permite carregar objetos exportados do 3DSMax Permite carregar cenas Collada Arquivo convertido para o formato COLLADA 1.4.1 Modelo para o Google Earth Arquivo 3DS Carrega um arquivo do Quake 2 MD2 com animao Modelo do Google Sketchup Modelo do Google Sketchup para Collada
Tabela 3 - Classes e formatos suportados pelo Papervision3D

35

2.13.2.

Google SketchUp

uma ferramenta de desenvolvimento e modelagem em 3-D. um produto do Google e pode ser baixado gratuitamente em sua verso mais simples. amplamente utilizado em projetos de Arquitetura, design, engenharia, construo, educao e entretenimento digital.

2.13.3.

Blender3D

uma ferramenta de cdigo aberto e multiplataforma usada para o desenvolvimento e modelagem em 3-D. Com esta ferramenta possvel tambm a criao de aplicaes 3D interativas, como apresentaes e jogos. uma ferramenta que vem ganhando bastante projeo na comunidade de desenvolvedores 3D. J foi recomendada como ferramenta oficial do Peugeot Design Contest, concurso de design de carros da montadora Peugeot. Atualmente est na verso 2.60a

2.14.

Cdigos Interativos

No nosso dia-a-dia temos contato com alguns cdigos capazes de armazenar diversos tipos de informaes. So eles: os cdigos de barras unidimensionais, utilizados principalmente no comrcio, para armazenar dados dos produtos, e os cdigos bidimensionais, mais poderosos, capazes de armazenar pequenos textos, links de internet, e tambm definir aes tais como realizar uma ligao ou enviar um SMS. Estes cdigos so considerados os precursores da Realidade Aumentada, pois ao serem interpretados so capazes de inserir informaes num plano virtual.

36

2.14.1.

Cdigos de barras

Os Cdigos de barras so definidos por um conjunto de barras paralelas verticais, O cdigo de barra uma representao grfica de barras verticais paralelas, claras ou escuras, que pode ser lida de forma ptica e revela os dados do produto sob o qual est aplicado (FITTIPALDI, 2011 apud ARAUJO, 2009 e SEVERO FILHO, 2006). Os cdigos de barras unidimensionais so capazes de armazenar no mximo 20 dgitos.

Figura 14 Exemplo de cdigo de barras Fonte: http://gostin.com.br/blog/wp-content/uploads/2010/04/codbarra-500por300.jpg

2.14.2.

QR Code

De acordo com o site Oficina da Net, QR Code um cdigo de barras bidimensional criado pela empresa japonesa Denso-Wave em 1994. QR significa "quick response"(resposta rpida), nome dado devido sua capacidade de ser interpretado rapidamente. QR Codes so bastante utilizados no Japo, porm seu uso ainda pouco explorado no Brasil.

37

Figura 15 Exemplo de um QR Code contendo um texto

Os QR Codes podem ser facilmente gerados atravs de diversos sites, entre eles o site http://qrcode.kaywa.com. De acordo com o site qrcode.com, mantido pela DensoWave, o QR Code contm informaes na vertical e horizontal, enquanto um cdigo de barras contm informaes em apenas uma direo. QR Code tem uma capacidade de armazenamento de dados consideravelmente maior do que um cdigo de barras, como exemplificam a figura 16 e a tabela 4.

Figura 16 Direes das informaes dos cdigos

Tipo de dados Numrico Alphanumeric Binrio 8 bits Kanji Alfabeto japons

Capacidade de armazenamento 7089 caracteres 4296 caracteres 2953 bits 1817 caracteres

Tabela 4 Capacidades de armazenamento de um QR Code

38

Atualmente, percebe-se seu uso em campanhas publicitrias, em revistas, para acesso a contedos exclusivos da web, e tambm em informaes de diversos produtos. Tornou-se bastante popular devido grande presena de celulares com recurso de cmera.

Figura 17 Leitura de um QR Code por um Celular Disponvel em: http://info.abril.com.br/professional/img/qr-code17042009.jpg

2.15.

Marcador

A representao do objeto gerado pelo Papervision3D feita por meio do reconhecimento do marcador correto. Neste projeto foi definida a utilizao de marcadores fiduciais. Estes foram um dos primeiros padres a serem utilizados. Consiste de um quadrado de bordas pretas com um padro central capaz de torn-lo nico e distinguvel de outros marcadores. No existem restries quanto sua imagem central, ficando esta a critrio do desenvolvedor. A deteco deste marcador feita pela comparao de trechos da imagem capturada com um banco de dados de marcadores at que seja encontrado um que respeite o grau de confiana definido.

39

Figura 18 - Exemplos de marcadores fiduciais

Existem diversas ferramentas para gerao de marcadores fiduciais. Entre estas, no site Marker Generator (http://flash.tarotaro.org/ar/MGO2.swf), onde pode-se criar um marcador atravs de uma imagem j impressa, ao mostr-la para a webcam ou realizando um upload de uma imagem do arquivo. Suas opes de configurao: Mode Select Define se a imagem ser capturada pela cmera (Camera Mode) ou se ser realizado um upload da imagem (load marker image). Marker Size Define a rea a ser utilizada para a identificao do marcador. Como dito antes, toma-se por padro a utilizao de 50% da rea, um valor que pode ser alterado dependendo da complexidade da aplicao. Quanto menor a rea de identificao, menor ser o custo de processamento, e mais difcil ser a identificao correta do posicionamento do marcador. Marker Segments Define o tamanho e a qualidade do marcador. Quanto maior a qualidade, maior o arquivo .pat gerado e maior o custo de processamento, porm, a identificao ser mais confivel. Get Parttern Salva o marcador aps o seu reconhecimento. Possui ainda uma janela com o nome Preview Marker onde possvel a visualizao de como ser o reconhecimento do marcador pelo Flash.

A figura 15 mostra o Marker Generator em funcionamento. Uma borda vermelha traada em volta do marcador reconhecido pelo programa.

40

Figura 19 - Marker Generator em funcionamento

Para a gerao deste marcador, deve-se atentar para a escolha de um marcador que seja de fcil reconhecimento e no possibilite interpretaes ambguas. Um bom modelo de marcador deve apresentar uma diferena a cada rotao de 90 no eixo z, facilitando o trabalho do FLARToolKit na orientao x, y e z do marcador para o posicionamento de um objeto virtual [Cabana, 2010].

Marcador Correto

Marcador incorreto

Figura 20 Exemplos de marcadores corretos e incorretos

necessrio ateno quanto ao modo de interpretao das posies x, y e z representadas pela imagem do marcador em um plano 3D. A coordenada x representada

41

pelo deslocamento em p (de cabea para cima) do marcador. A coordenada y o deslocamento horizontal do marcador e a coordenada z dada pela

aproximao/afastamento do marcador da webcam.

Figura 21 Coordenadas do marcador Fonte: http://saqoosha.net/en/flartoolkit/start-up-guide/

42

3. DESENVOLVIMENTO

No desenvolvimento do projeto foi utilizada a biblioteca Flash para Realidade Aumentada FLARToolKit, e o mtodo de marcadores individuais, Tendo como interface de interao com a aplicao um cubo montvel com marcadores diferentes em cada face, cada um referenciando a um ambiente diferente e com a funo de controlar as aes do ambiente virtual (Rotao, inclinao e zoom).

3.1.

Interface de interao
Visando tornar a manipulao da interface de interao mais fcil e prtica, foi

definida a impresso dos marcadores em um cubo. Tal modelo visa tambm atrair a ateno de crianas para a aplicao. As figuras 21 e 22 exemplificam o cubo, desmontado e aps montado.

43

Figura 22 - Cubo montvel com marcadores representando os diversos ambientes

44

Figura 23 - Cubo montado

Para o controle das aes do ambiente virtual foi utilizada a tcnica do clculo da posio dos marcadores, onde o FLARToolKit executa o processamento das imagens, coletando sua posio e orientao num ambiente 3D. O sistema apresenta uma sequencia lgica bem definida, onde aps a confirmao do usurio a cmera inicializada e o sistema detecta a presena do marcador no frame de vdeo captado, exibindo o ambiente correspondente.

Figura 24 Tela de confirmao de acesso cmera

Aps isso, detecta a presena e a orientao do marcador de controle no frame de vdeo captado e executa as aes de acordo com o posicionamento e orientao do marcador. O fluxo exemplificado na figura abaixo.

45

Figura 25 - Diagrama do fluxo de funcionamento do sistema

46

3.2.

Ferramentas utilizadas
Para o incio do desenvolvimento foi necessrio o download e instalao das

seguintes ferramentas:

Nome FLARToolKit 2.5.4

Descrio Biblioteca do FLARToolKit Kit de

Download http://www.libspark.org/wiki/saqoosha/FLARTool Kit/downloadlist

Flex SDK 4.1

desenvolvimento para compilao dos aplicativos

http://www.adobe.com/cfusion/entitlement/index.c fm?e=flex4sdk

FlashDevelop 3.3.1

IDE para desenvolvimento das aplicaes Java Virtual Machine

http://www.flashdevelop.org/downloads/releases/F lashDevelop-3.3.1-RTM.exe

Java Runtime 6

necessria para execuo do FlashDevelop

http://www.java.com/pt_BR/download/

Tabela 5 Ferramentas instaladas

Aps a instalao das ferramentas, foi criado um novo projeto no FlashDevelop e foi criado em sua pasta lib uma pasta para cada biblioteca necessria para o projeto. Em cada pasta, foi copiada a pasta src das respectivas bibliotecas, conforme a imagem abaixo.

47

Figura 26 - Estrutura das pastas do projeto no FlashDevelop

3.3.

Classes
Para o desenvolvimento da aplicao, necessrio o uso de classes bsicas do Flash,

do FLARToolKit e do Papervision3D, as quais sero representadas por atributos do projeto. So as classes bsicas:

PACOTE Flash URLLoader

CLASSE

Flash Flash Flash Flash Flash FLARToolKit FLARToolKit FLARToolKit FLARToolKit FLARToolKit FLARToolKit FLARToolKit

Stage Camera Bitmap Video Sprite FLARRasterThresholdAnalyzer_ SlidePTile FLARBaseNode FLARCode FLARTransMatResult FLARSingleMarkerDetector FLARParam FLARRgbRaster_BitmapData

DESCRIO Carrega dados binrios ou texto atravs de uma URL informada. Utilizado para carregar os parmetros da cmera e marcador em uma aplicao de RA Palco de exibio principal de contedo grfico Webcam Imagem capturada em mapa de bits Video para exibio do contedo N para exibio de grficos/contedo 3D Analisa o nvel de limiarizao da imagem Container para o modelo 3D Marcador detectado Matriz de transformao Detector de um nico marcador Parmetros da cmera Rasterizador RGB - utilizado para transformar a imagem rgb para mapa de bits

48

Papervision3D Papervision3D Papervision3D Papervision3D Papervision3D

Viewport3D Camera3D Scene3D DAE LazyRenderEngine

Container para todo o contedo (modelo, marcador, camera3D) Cmera virtual Cena virtual Modelo virtual do tipo COLLADA 1.4.1 Renderizador Papervision3D

Tabela 6 Classes bsicas do FLARToolkit

3.4.

Padres Utilizados
Para o desenvolvimento do trabalho, foram definidos alguns parmetros relevantes:

tamanho do vdeo a ser exibido, tamanho, porcentagem de reconhecimento e o nmero de segmentos do padro dos marcadores, e tambm nmero de frames a serem exibidos por segundo. Para a definio do tamanho do vdeo, foram considerados: resoluo mais usual dos monitores, tamanho das barras de ferramentas dos navegadores e do SO, e a capacidade de visualizao tanto em monitores widescreen quanto em monitores comuns. Com isso, o tamanho do vdeo foi definido em 640 pixels de largura por 480 pixels de altura. Para os marcadores, foi definida a porcentagem de reconhecimento em 50%, seu tamanho em 6 (seis) centmetros, e o seu padro dividido em 16 segmentos. Foi tambm definida a sua exibio com 16 frames por segundo. Tais medidas consideram o seu uso na web, exigindo menos processamento, no limitando assim o uso em computadores mais lentos.

Figura 27 - Funo FLARCode com parmetros padres

49

3.5.

Funes criadas
A leitura da posio do marcador a base deste trabalho. A partir dessa leitura, sero

definidas as interaes como modelo 3D. Para o desenvolvimento dessa funo, foi considerada a necessidade de se tratar os valores a cada frame. O FLARToolKit j oferece a funo onFrameCapturado, na classe

ProjetoPapervision3D, que analisa o frame capturado e informa para a aplicao se h a presena de um cdigo vlido, com a varivel booleana isMarcadorDetectado. Caso haja a presena de um marcador no frame, calculada a matriz de transformao do marcador e seus valores so atribudos ao modelo 3D. Para o clculo do posicionamento do marcador, foram aproveitados os valores de X, Y e Z lidos pela funo, e atribudos s variveis do tipo number valorX, valorY e valorZ, conforme a figura 28.

Figura 28 - Funo onFrameCapturado

Como forma de exemplificar o funcionamento do sistema, foi inserida na tela uma caixa de texto contendo os valores atualizados de X, Y e Z. Como tratado anteriormente, as variveis que armazenam estes valores so do tipo number. Por isso, ao serem lidas antes de serem inicializadas com os valores vlidos de posio, retornam NaN, Not a Number, conforme destaque na figura 29.

50

Figura 29 - Funo onFrameCapturado

Para o clculo dos valores de movimentao, foi criada a funo MovimentoXYZ e determinado um intervalo de leitura dos valores de posio. A cada 15 frames a varivel de controle de posio atualizada e seu valor atual comparado ao valor anterior. Foram criadas variveis separadas para as posies X, Y e Z. Para se atribuir o movimento, considera-se a direo em que a diferena entre os valores iniciais e finais tenha sido maior. Caso a maior movimentao reconhecida seja maior que o valor mnimo de movimentao, atribui-se varivel de controle um valor seguindo o padro de acordo da tabela 7. Valor retornado 0 1 2 3 4 5 6 Movimento No movimenta Positivo em X Negativo em X Positivo em Y Negativo em Y Positivo em Z Negativo em Z

Tabela 7 Padro de atribuio de movimento

51

Figura 30 - Funo MovimentoXYZ

Aps a execuo da funo MovimentoXYZ, chamada a funo VerificarAcoes da classe ProjetoPapervision3D para atribuir o movimento ao modelo 3D.

52

Figura 31 - Funo verificarAcoes

3.6.

Testes
Quando exibido um marcador vlido, so exibidos, alm do modelo 3D, os valores

das posies de X,Y e Z no plano tridimensional e o movimento a ser realizado, conforme destaque na figura 32. A varivel mover atualizada de acordo com o movimento realizado pelo marcador. O modelo 3D movimentado de acordo com os valores da varivel mover.

53

Figura 32 Tela com os valores de posio e a ao a ser realizada

3.7.

Aplicao Web
Foi criada uma pgina web para o usurio acessar a aplicao. A pgina pode ser

acessada pelo endereo web www.aumentando.xpg.com.br ou pelo QRCode representado pela figura 33.

54

Figura 33 - QRCode para acesso aplicao Web

Figura 34 - Aplicao Web

Neste site, so disponibilizadas para o usurio algumas informaes sobre Realidade Aumentada, o demonstrador de ambientes e um arquivo PDF com o cubo para ser impresso e montado.

55

3.8.

Testes finais
A imagem abaixo mostra a execuo da aplicao com a exibio do Estdio

Mineiro, de Belo Horizonte.

Figura 35 - Aplicao Web ativa exibindo o estdio Mineiro

56

4. CONSIDERAES FINAIS

4.1.

Concluso
Um Demonstrador Virtual de Ambientes via web capaz de elevar a experincia

final do usurio ao poder interagir com o ambiente sem a necessidade estar presente no mesmo, alm da praticidade e mobilidade de acesso por meio da internet. Apesar das facilidades da virtualidade e o acesso pela internet, a necessidade do uso de teclado e mouse dificultavam a interao do sistema com o usurio. A integrao dos recursos de Realidade Aumentada elevou o nvel de interao do usurio, trazendo o ambiente para perto dele e os controles em suas mos, com movimentos simples e intuitivos. No decorrer do desenvolvimento do projeto, houve algumas dificuldades, como na utilizao de uma biblioteca para Realidade Aumentada em Java, o JARToolKit, que aps vrios erros encontrados, foi descoberto que era uma biblioteca descontinuada, portando, sem suporte disponvel. Aps esta descoberta, foi decidida a troca pela biblioteca Flash FLARToolKit. Outra dificuldade foi pelo uso da linguagem ActionScript3, para programao em Flash, que at ento no a conhecia. Como pontos positivos, podem ser salientados os conhecimentos adquiridos: em uma nova linguagem de programao, em uma nova rea de pesquisa, a de Realidade Virtual, e na participao no SVR2011 XVIII Simpsio de Realidade Virtual e Aumentada, em Uberlndia, onde adquiri grande parte do meu conhecimento atual sobre Realidade Virtual e Aumentada, sendo de grande valia no desenvolvimento final do projeto.

4.2.

Trabalhos futuros
Como trabalhos futuros so propostas a implementao da aplicao para as

plataformas Android e iOS (iPhone e iPad), e tambm o desenvolvimento em outras linguagens de programao.

57

proposto tambm a implementao da funcionalidade de mltiplos marcadores, tornando possvel, assim, realizar a troca dos ambientes 3D conforme o usurio trocar a face do cubo.

58

5. REFERENCIAS

1 up, Blog. Disponvel em: <http://www.1up.net.br/2011/01/flash-flex-ria-sorria/>. Acesso em 15 nov. 2011. Adobe. Disponvel em: < http://www.adobe.com/ >. Acesso em 25 out. 2011. AISA. Disponvel em: <http://www.aisa.com.br/oquee.html>. Acesso em 25 out. 2011. AZUMA, R. T. A Survey of Augmented Reality. Presence: Teleoperators And Virtual Environments, vol.6, n. 4, Aug. 1997. CARDOSO, A.; LAMOUNIER JR, - Realidade Virtual: Uma Abordagem Prtica. Livro dos Minicursos do SVR2004, SBC, So Paulo, 2004. CRICKET DESIGN, Blog. Disponvel em: <http://cricketdesign.com.br/blog/?p=673>. Acesso em 15 nov. 2011. C-LABS Homepage. Disponvel em: <http://www.c-lab.de/jartoolkit/>. Acesso em 15 nov. 2011. Denso-Wave. Disponvel em: <http://www.qrcode.com>. Acesso em 15 nov. 2011. GABRIEL, Martha. QR codes & Realidade Aumentada. 2010. Disponvel em: <http://www.slideshare.net/marthagabriel/qr-codes-realidade-aumentada-por-martha-gabriel>. Acesso em 15 nov. 2011. Google Sketchup. Disponvel em: <http://nyatla.jp/nyartoolkit/wiki/index.php?NyARToolkit%20for%20Java.en>. Acesso em 15 nov. 2011. Guia do Hardware. Disponvel em: <http://www.guiadohardware.net/termos/java>. Acesso em 15 de novembro de 2011. KATO, Hirokazu, et al. - ARToolKit 2.33. Documentation. Seatle, 2000. KIRNER, Claudio. - TORI, R. Introduo Realidade Virtual, Realidade Misturada e Hiper-realidade. In: Claudio Kirner; Romero Tori. (Ed.). Realidade Virtual: Conceitos, Tecnologia e Tendncias. 1ed. So Paulo, 2004, v. 1, p. 3-20. KIRNER, Claudio. Realidade Virtual e Aumentada. Disponvel em: <http://www.ckirner.com/realidadevirtual/?REALIDADE_AUMENTADA>. Acesso em 15 nov. 2011. KIRNER, Claudio. - Realidade Virtual: Dispositivos e Aplicaes. Anais da VII Escola Regional de informtica da SBC Regional Sul - VII ERI, SBC, Londrina, Chapec, Novo Hamburgo, maio de 1999, p. 135-158.

59

LAMB, PHILIP ARToolKit. Washington, 2009. <http://www.hitl.washington.edu/artoolkit/>. Acesso em 15 nov. 2011.

Disponvel

em:

LIMA, J. P. S. do M. UM FRAMEWORK DE REALIDADE AUMENTADA PARA O DESENVOLVIMENTO DE APLICAES PORTVEIS PARA A PLATAFORMA POCKET PC. 2007. 49 F. Trabalho de concluso de curso (graduao em cincia da computao) Universidade Federal de Pernambuco, Recife, 2007. MATOS, Raul Csar do Carmo. Projeto de um Prottipo de Aplicao Web com Realidade aumentada. 2010. 78 f. (Graduao em Informtica para Gesto de Negcios) Faculdade de Tecnologia da Zona Leste, Centro Paula Souza. Disponvel em: < http://fateczl.edu.br/TCC/2010-2/TCC-010.pdf>. Acesso em 15 nov. 2011. Nokia Mobile Codes. Disponvel em: <http://mobilecodes.nokia.com/index.htm>. Acesso em 15 nov. 2011. NyARToolkit- ARToolKit Class Library for Java/C#/Android. Disponvel em: <http://nyatla.jp/nyartoolkit/wiki/index.php?NyARToolkit%20for%20Java.en>. Acesso em 15 nov. 2011. PRESSMAN, R. S. Engenharia de Software. 6. ed. So Paulo: McGraw-Hill, 2006. 720 p. QR CODE, O que . Oficina da Net. Disponvel em: <http://www.oficinadanet.com.br/artigo/celulares_e_telefonia/o_que_e_qr_code>. Acesso em 15 nov. 2011. Realidade Aumentada. Disponvel em: <http://www.realidadeaumentada.com.br>. Acesso em 15 nov. 2011. SILVA, Rryka Rubia P.C.L. Ambiente Colaborativo com Realidade Aumentada. 2006. 93 f. (Mestrado em Cincia da Computao) Faculdade de Cincias Exatas e da Natureza, Universidade Metodista de Piracicaba. Disponvel em: < http://www.unimep.br/phpg/bibdig/pdfs/2006/CDSMFSPRWSTN.pdf >. Acesso em 15 nov. 2011.

60

APNDICE A ENGENHARIA DE SOFTWARE DO SISTEMA

1. Requisitos funcionais
RF #1: Os marcadores devero ser impressos no formato de um cubo, ou outra forma geomtrica que possibilite a impresso de um marcador em cada face e que seja uma pea que oferea a possibilidade de ser montada a partir de uma matriz de papel.

RF #2: Cada face do cubo dever possuir um marcador diferente que represente um ambiente diferente. RF #3: O controle do ambiente virtual dever ser realizado por um marcador especfico para controle.

RF #4: A impresso dever ser feita em papel fosco, para evitar falhas no reconhecimento do marcador.

RF #5: O computador do usurio deve possuir webcam instalada e em perfeito funcionamento para o reconhecimento das imagens.

RF #6: As matrizes de montagem do cubo devero ser disponibilizadas pela divulgadora por meio de folders com a matriz para recortar e montar e as instrues de montagem, e por meio do site, atravs do download de um arquivo PDF (Portable Document Format) contendo a matriz e as instrues de montagem alm do marcador de controle.

RF #7: Durante a simulao o usurio poder definir o ngulo de viso, ampliar a viso (aplicar ou retirar o zoom) e rotacionar a sua viso, por meio de movimentos com o marcador de controle.

RF #8: O sistema deve apresentar a interface e as instrues de uso em portugus.

61

2. Requisitos No funcionais
RNF #1: O sistema deve ser implementado na linguagem FLASH, visando a construo de um sistema flexvel quanto a plataforma a ser utilizada. O sistema pode rodar em diferentes sistemas operacionais, por exemplo: Windows ou Linux, e ter verses para dispositivos mveis.

RNF #2: O sistema deve fornecer ao usurio uma interface amigvel e intuitiva, que obedea aos princpios bsicos da Realidade Aumentada.

3. Limitaes do sistema
LS #1: O sistema requer o sistema Operacional Windows XP ou Linux equivalente, com Adobe Flash Player 9 ou superior instalado e navegadores Microsoft Internet Explorer 8, Mozilla Firefox 3 e Google Chrome 4 ou suas respectivas verses superiores.

LS #2: O sistema requer uma cmera com qualidade VGA (640X480 pixels) ou superior.

LS #3: O sistema requer uma conexo banda larga de no mnimo 256Kbps.

4. Requisitos de desempenho:
RD #1: O sistema dever ser executado em tempo real.

62

5. Diagrama de Casos de Uso

Nas prticas de UML, o desenvolvimento dos diagramas de Caso de uso tem por finalidade a modelagem do comportamento do sistema. No sistema em questo, foi identificado apenas um ator: o Usurio do sistema, que ir interagir com ele.

O usurio escolher o lado correspondente ao ambiente que deseja exibir, ento definir o modo de viso desejado, aplicando movimentos de rotao. composto pelos casos de uso Escolhe_Lado e Define_modo_visao.

Descrio detalhada:

Escolhe_Ambiente

Ator: Usurio Pr-Condies: A aplicao deve ter sido iniciada Curso normal: O usurio acessa o site da aplicao e exibe cmera o lado do cubo correspondente ao ambiente desejado. Curso de exceo: Se no houver um marcador vlido, o ambiente no ser exibido.

63

Define_Modo_Visao

Ator: Usurio Pr-Condies: A aplicao deve ter sido iniciada e o ambiente deve ter sido escolhido. Curso normal: Aps ter escolhido o ambiente, o usurio retira o cubo do ngulo de viso da cmera e define o modo de viso de acordo com a rotao e a inclinao aplicada ao marcador de controle. Curso de exceo: Se no houver um marcador vlido, a rotao no ser aplicada ao ambiente.

64