Desenvolvimento de uma aplicao de Realidade Aumentada

utilizando a ferramenta FLARAS

Glaucio Werlley de Souza Andrade1 , Luana Priscilla Rodrigues da C. Lima1

1

Faculdade de Cincias e Tecnologia Mater Christi

Rua Ferreira Itajub, 745Q

- Santo Antnio

Mossor - RN, 59619-140

glauciowerlley@gmail.com,

Abstract. The Augmented Reality (AR) has enabled combine real environment
with virtual objects, allowing the user to interact with imaginary situations,
fictional scenarios and aligning the real and virtual objects, faithfully
producing real environments. The objective of this work is to elucidate the
Authoring System Augmented Reality in Flash, FLARAS (Flash Augmented
Reality Authoring System), and it develop educational application, showing a
map of the Northeast Region of Brazil with their states, so that every
interaction with their hymns in audio are produced.
Resumo. A Realidade Aumentada (RA) vem possibilitando combinar ambiente
real com objetos virtuais, permitindo ao usurio interagir com situaes
imaginrias, cenrios fictcios e alinhando a objetos reais e virtuais,
produzindo fielmente os ambientes reais. O objetivo deste trabalho elucidar
o Sistema de Autoria de Realidade Aumentada em Flash, o FLARAS (Flash
Augmented Reality Authoring System), e nela desenvolver uma aplicao
educacional, mostrando um mapa da Regio Nordeste do Brasil com seus
estados, de modo que a cada interao com os respectivos hinos em udio
sejam produzidos.

1. Introduo
A Realidade Aumentada (RA) oferece a possibilidade de colocar objetos virtuais, por
meio de uma webcam no mundo real, dando a impresso que o objeto est no local
projetado. Ultimamente empregada em campanhas publicitrias, como exemplo a
marca Lnyx/Axe, que projeta um anjo caindo do cu (Axe, 2012), outros exemplos de
utilizao da RA, so as transmisses de TV, as interaes com livros e brinquedos,
como por exemplo, o wanderbook, que traz histrias interativas utilizando a RA
(Wanderbook, 2012) . O grande problema entre os interessados na Realidade
Aumentada era a dificuldade para criar uma aplicao, pois o principal obstculo das
pessoas era o conhecimento em algumas linguagens de programao, tornando invivel
para os leigos.

A Realidade Aumentada (RA) vem possibilitando combinar ambiente real com

objetos virtuais, permitindo ao usurio interagir com situaes imaginrias, cenrios
fictcios e alinhando a objetos reais e virtuais, estticos e dinmicos, produzindo
fielmente os ambientes reais.
Este trabalho tem o intuito de inicialmente explanar conceitos de realidade
aumentada, mostrando suas definies, caracterizaes, tipo, requisitos de aplicaes.
Em seguida, realizar uma comparao em trs ferramentas de RA e mostrar o motivo do
qual escolheu a ferramenta de autoria FLARAS, para desenvolver uma aplicao
educacional que tem o intuito de mostrar e ensinar os mapas da regio nordeste do
Brasil, e os respectivos mapas dos estados que a compem, ensinando as letras dos
hinos, em forma de udio, que produzido a cada interao.

2. Realidade Aumentada
Realidade Aumentada (RA) a insero de objetos virtuais no ambiente fsico,
mostrada ao usurio, em tempo real, com o apoio de algum dispositivo tecnolgico,
usando a interface do ambiente real, adaptada para visualizar e manipular os objetos
reais e virtuais. (Kirner, Siscoutto, 2007.).
Na Figura 01, ilustra a captura de uma tela, que baseia no exemplo de aplicao
de educao de trnsito com realidade aumentada.

Figura 01. Exemplos de aplicaes de RA. Fonte: KIRNER, 2008.

A Realidade Aumentada possibilita visualizar um objeto em 3D, utilizando a
webcam, como se estivesse no ambiente real. Com um marcador impresso,
determinado o local que o objeto 3D ser projetado, esses objetos podem ser estticos
ou com animao.

2.1. Tipos de Sistemas de Realidade Aumentada

Existem quatro tipos de sistemas de realidade aumentada, que podemos classificar
conforme o tipo de display que utiliza, so: sistema de viso tica direta, sistema de
viso direta por vdeo, sistema de viso por vdeo baseada em monitor e sistema de
viso tica por projeo [AZUMA, 2001].
Sistema de Viso tica Direta
O sistema de viso tica direta utiliza o uso direto de culos ou capacete de projeo.
Abaixo dois exemplos de utilizao da RA com viso tica direta. Na Figura 2,
mostrado um capacete e um culos de RA que funcionam no sistema de viso tica
direta.

Figura 2. Capacete e culos que utilizam o sistema de viso tica direta Fonte: AZUMA,
2001; OSHIMA, 1998.

Esse sistema consegue passar para usurio diretamente nas lentes o objeto
projetado de maneira que fique ajustada com a cena real, dando a sensao que o objeto
realmente est naquele local. A empresa google vem trabalhando em um culos que
utiliza-se dessa tecnologia, aonde deve ser lanado no ano de 2013, que chama-se
Google Glass. Na Figura 2, um exemplo do projeto da Google para expandir as
possibilidades da RA. (Azuma, 2001)

Figura 3. Imagem do Projeto Google Glass, que utiliza o sistema de viso tica direta.
Fonte: http://www.criatives.com.br/wp-content/uploads/2012/04/Project-glass-google.jpg

Existem alguns tipos de sistemas de viso, que so:

Viso direta por vdeo: Com a viso direta por vdeo, a imagem capturada
atravs de um capacete, que vem com microcmeras acopladas. A imagem
misturada com imagens virtuais que so mostrados nos olhos do usurio.
(Azuma, 2001)

Sistema de viso por vdeo baseada em monitor: No sistema de viso por

vdeo baseada em monitor utiliza a webcam para capturar a imagem e misturar
com o objeto virtual criado pelo computador, que projetado sobre um
marcador. (Azuma, 2001)

Sistema de Viso tica por Projeo: O sistema de viso tica por projeo
no utiliza nenhum equipamento externo e faz a projeo em ambiente real, que
projeta objetos virtuais diretamente em uma superfcie, sendo visualizada a olho
nu. (Azuma, 2001)

2.2. Desenvolvimento de aplicaes de realidade aumentada

Para desenvolver e executar aplicaes em realidade aumentada necessrio utilizar-se
de alguns requisitos bsicos, como:
Um computador com sistema operacional (Windows, Linux, entre outros),
devidamente instalado, uma webcam com seus drives devidamente
instalados, um programa desenvolvido utilizando uma biblioteca de
programao de RA como ARToolKit ou o FLARToolKit e uma placa de
papelo com um smbolo no interior, denominado marcador. [SOUZA, R.C.;
MOREIRA, H.D.F.; KIRNER, 2012].

Podemos desenvolver uma aplicao de duas maneiras: Atravs de programao

ou atravs de uma ferramenta de autoria.

Programao: Para se criar uma aplicao em RA utilizando programao,

necessrio a utilizao da biblioteca ARToolkit, Disponvel gratuitamente no
site do laboratrio HITL da Universidade de Washington, que j foi portada para
vrias linguagens, como C/C++ (ARToolkit), Java
(NyARToolkit),
ActionScript 3.0
(FLARToolKit), Python
(PyARTK), Silverlight
(SLARToolKit) [SOUZA; MOREIRA ; KIRNER, 2012.]

Ferramentas de Autoria: As ferramentas de autoria so de grande utilidade

para pessoas que querem utilizar a tecnologia mais no tem conhecimento ou
afinidade com programao, com isso, podemos criar uma aplicao utilizando
uma interface mais amigvel podendo assim importar objetos, imagens e sons,
criando uma aplicao.

3. Ferramentas
As ferramentas so necessrias para a criao de aplicaes, sejam as que utilizam
programao ou as ferramentas de autoria, que utilizam uma interface grfica para
facilitar o uso.
Dentre tantas ferramentas, escolheram-se trs para realizar um comparativo e
vislumbrar a que melhor aplica-se no estudo de caso. As escolhidas para serem
abordadas so:

 EZFlar
ARToolKit
FLARAS
3.1. EZFlar
EZFlar uma ferramenta de autoria de RA online, surgiu na necessidade de melhor
aproveitamento dos espaos no jornal "O Estado de S. Paulo. A primeira aplicao
construda com a ferramenta foi a Torre Eiffel, em seguida, tiveram a idia de
disponibilizar os recursos da ferramenta para a criao de aplicao online, de forma
que os usurios pudessem criar uma aplicao em poucos cliques, sem a necessidade de
instalao de uma ferramenta, apenas acessando o endereo do site
(http://www.ezflar.com), que disponibilizava a ferramenta online.
A ferramenta EZFlar utiliza-se dos cdigos abertos projetados para
desenvolvedores interessados em aplicaes de RA. Utilizam das bibliotecas abertas:
FLARManager, FlarToolkit e Papervision3D, as bibliotecas esto disponveis para
downloads e totalmente disponveis para melhorias e correes.
3.2. ARToolKit
O ARToolkit uma biblioteca de programao opensource, designada para o
desenvolvimento de aplicaes de Realidade Aumentada. Baseada nas linguagens C e
C++, que se utiliza de marcadores de interao. O ARTookit um cdigo aberto que
possibilita alteraes e ajustes para sua aplicao. [TORI, R., KIRNER, C.,
SISCOUTTO, R. , 2006].

A ferramenta utiliza-se de algoritmos de viso computacional, que calculam a

posio e orientao real da cmera em relao a marcadores fsicos reais
[SOUZA; MOREIRA ; KIRNER, 2012.].

3.3. FLARAS
A ferramenta FLARAS (Flash Augmented Reality Authoring System) um
instrumento grtis de autoria para criao de aplicaes interativas em realidade
aumentada.
Com o FLARAS temos a possibilidade de definir aplicaes, utilizando dois
marcadores padres: um de interao e o outro o marcador, que ficar exposto o objeto
virtual. Com os seus pontos e senas devidamente configurados, podem criar inmeras
possibilidades de aplicaes em RA.
A ferramenta utiliza de imagens (texturas), vdeos e objetos 3D, todos com a
possibilidade de insero de udio em cada interao. [SOUZA, R.C.; MOREIRA,
H.D.F.; KIRNER, C. , 2012.]. A Figura 4, mostra uma aplicao desenvolvida na
ferramenta FLARAS, o objeto (logomarca da Faculdade de Cincias e Tecnologia
Mater Christi) foi modelada no Google sketchup e em seguida o objeto 3D foi exportado
para o FLARAS.

Figura 4. Aplicao desenvolvida no FLARAS.

Devido variedade de possibilidades de aplicaes que esta ferramenta

disponibiliza, podem ser citadas aplicaes na rea educacional, na apresentao de
projetos, na realizao de anlise de diversos recursos de insero de objetos 3D, de
imagens e vdeos e na rea de publicitria, entre outros.
4. Desenvolvimento de uma aplicao de Realidade Aumentada utilizando a
ferramenta FLARAS
As pesquisas realizadas sobre Realidade Aumentada foram desenvolvidas com o
objetivo de explorar ferramentas que utilizem desse recurso. E, na busca por uma
maneira simples e intuitiva para a criao de aplicaes em RA, optou em utilizar a
ferramenta FLARAS para desenvolver uma aplicao. Visto que, a escolha dessa
ferramenta deteve-se ao seu uso simplificado, com uma interface amigvel e
compatibilidade com a maioria dos programas de modelagem 3D, arquivos de imagem,
vdeo e udio, tendo a possibilidade de serem criadas aplicaes para uso local e pela
internet.
O objetivo da criao da aplicao que ser mostrada nesse trabalho expe que o
FLARAS traz a possibilidade de uso em diversas reas, entre elas na rea educacional.
A ferramenta FLARAS possibilita aplicaes educacionais, incentivando aos demais
interessados a desenvolver aplicaes ou aprimorar ferramentas, para melhor uso da
Realidade Aumentada.
A seguir sero mostrados os principais comandos do FLARAS, por exemplo,
como importar objetos, como utilizar as coordenadas para deslocamento das imagens,
como criar objetos 3D, como importar imagens ou vdeo, como foi realizada a criao
da aplicao sobre a Regio Nordeste do Brasil, como o marcador foi devidamente
posicionado, como foi importado as bandeiras em formato COLLADA (abreviao do
ingls para collaborative Design Activity), que um padro de exportao e importao
de arquivos criado pela Sony e usado como padro para o console Playstation 3, que
suportado pelos melhores editores 3D do mercado, como Blender (software livre), 3D
Studio Max e Google Sketchup), que foi modelado no Google sketchup e importado para
o FLARAS, ser mostrado uma interao com os estados, aonde ser exibido, a cada
interao, a bandeira em 3D, e seus respectivos hinos.

4.1. Requisitos necessrios para a aplicao

Para que tenhamos resultados mais satisfatrios, precisamos de um computador com
processador com dois ou mais ncleos, com placa de vdeo 3D dedicada com drivers
mais recentes. necessrio tambm uma webcam com resoluo satisfatria instalada e
conFigurada. Sem os requisitos acima citados, pode-se observar que existe uma perda
satisfatria no desempenho. Em relao aos Requisitos de Software, podemos usar o
Sistema Operacional Windows, Linux ou MAC OS e Adobe Flash Player instalado e
atualizado. necessrio a impresso dos marcadores de objeto e de interao. [SOUZA;
MOREIRA; KIRNER, 2012.]
4.2. Tipos de Execuo
Existem dois tipos de execues no FLARAS, a execuo local e online. Depois que
salvamos o projeto, existe a possibilidade de publicar essa aplicao, seja em uma rede
local ou online. Depois que publicamos, ser escolhido um local para salvar, definimos
primeiramente em um local no computador que foi criada a aplicao. Dentro da pasta
que foi salva existiro dois arquivos em formato HTML, index-local-running, que
servir para rodar a aplicao localmente e index-online-running, que servir para rodar
a aplicao online, neste caso, toda a pasta ter que ficar hospedada online.
4.3. Estrutura bsica
Na Figura 4, uma tela inicial do FLARAS, com suas coordenadas dos eixos para
exposio do objeto 3D.

Figura 4. Tela principal do FLARAS.

Na guia Basic, mostrada na Figura 4, no lado direito, existe o espao point, que define o
ponto aonde o objeto ser exibido. Cada ponto corresponde a um local de interao de
objetos.
Para definirmos o posicionamento do objeto, temos as coordenadas dos pontos
x, que corresponde seta vermelha e a mudana dos valores acarretar no deslocamento
do objeto para baixo ou para cima; y que corresponde a seta azul, a mudana dos
valores deslocar o objeto para direita ou esquerda e o eixo z, que corresponde a seta

verde e deslocar o objeto para cima ou para baixo, valores positivos iro deslocar o
objeto para onde a seta aponta. A medida utilizada o milmetro.
4.5. Cena
No comando Scene, exemplificado na Figura 4, definido as cenas de cada ponto.
Quando definimos um ponto ser gerada uma cena. Dentro desta cena podemos definir
outras cenas que iro criar a animao com as interaes desejadas.
Na Figura 5 demonstra o como funciona as interaes utilizando as cenas e os
pontos. Na Figura 5, mostrado um quadro que ilustra bem o funcionamento dos pontos
e das cenas.

Figura 5. Esquema de interaes dos pontos e cenas do objeto projetado no Marcador

de Referncia.

Como mostrado na Figura 5, cada cena pode ser definhada sua translao
(Translation) que est em milmetros, rotao (Roration) em graus e a escala (Scale)
que definir o tamanho do objeto.
A escala deve ser definida inicialmente em 1 nos trs pontos (x, y e z), que seria
equivalente a 100% do objeto, x, y e z devem ser iguais para que no haja distores no
objeto. Se o objeto importado para o FLARAS for muito grande, poderemos diminui-lo,
se diminuirmos, por exemplo, para 0.5 em x, y e z, o objeto diminuir 50%, podendo
assim posiciona-lo melhor no projeto.
4.6. Multimdia e importao.
Para importar um udio para a cena, marca-se a opo Has udio?, em URL,
localizamos o udio desejado. Existem trs opes de importao de objetos:

3D Object, que so os objetos em formato COLLADA, o formato deste arquivo

.DAE, com suporte a objetos animados na extenso kmz;

Vdeos, em formato MP4 ou FLV;

E texturas em formato JPG, PNG ou GIF.

Na guia Animation, pode-se marcar Has animation? se deseja que o objeto da

cena tenha uma animao. Nela definimos a Rotao, que pode ser no eixo x, y ou z. Ao
definir o perodo da rotao, e o raio da rotao segundo o eixo escolhido. Na Figura 6
pode-se ver as opes de animao.

Figura 6. Tela da guia Animation, utilizada para definir uma animao ao objeto.

4.7. Comandos
Alm da utilizao do marcador de interao, o FLARAS tem diversos comandos para a
utilizao dos seus recursos, que podem ser executados diretamente no teclado. Esses
comandos podem ser usados para exibio da imagem, interao de cenas, aumento e
diminuio da esfera de interao, entre outras possibilidades, como mostrado na Figura
7.

Figura 7. Comandos do FLARAS, Fonte: Souza, Moreira, Kirner, 2012.

4.8. Os marcadores
Para determinarmos o local aonde ser projetado o objeto, deve-se usar o marcador de
referncia, que dar as coordenadas ao FLARAS fixar o objeto. O outro marcador
necessrio o de interao, que possibilita a interao com os objetos sem a utilizao
do teclado.
O Marcador de Interao, Figura 8a, (Interaction marker) utilizado para fazer
interaes dos objetos, como mudana de cena e mudana de pontos. O marcador de
referncia, Figura 8b, (Ref marker) utilizado para determinar o local aonde o objeto
ser projetado.

Figura 8a. Marcador de Interao

Figura 8b. Marcador de Interao

4.9. A aplicao
Primeiramente foi criado no programa CorelDEAW X3 o modelo do mapa para ter
referncia junto ao marcador. Esse modelo tem que ser utilizado, pois toda a marcao
de pontos e cenas sero utilizados de acordo com a posio do marcador e a figura. A
Figura 9 mostra o modelo da imagem e marcador que ser utilizado.

Figura 9. Modelo da aplicao

As bandeiras de cada estado aparecem sobre cada estado, sendo necessrio

modelar a bandeira em 3D para ser importado para o FLARAS. Foi utilizado o Google
SketchUp 7 para modelar o objeto, sendo utilizado o mesmo projeto do SketchUp para
as bandeiras de todos os Estados.
Ao concluir a modelagem, exportamos no formato COLLADA (.DAE). A
Figura 10 mostra o projeto da bandeira do RN.

Figura 10. Modelo da aplicao

Depois foi importado o modelo 3D para o FLARAS e definida todas as

coordenadas segundo a situao que foi adicionada o objeto, cada Estado com sua
determinada bandeira e respectivo hino ter seu ponto e cena como mostrado na Figura
11, que mostra o Estado de Sergipe, o ponto nove foi deslocado segundo o mapa, aonde
as coordenadas so para X=25 milmetros, Y=100 milmetros e Z=0.
A rotao do eixo X precisou ser de 90 graus, pois na posio original da
importao, a Figura da bandeira estava inclinada. Foi necessrio diminuir o objeto
original, na opo escala, para a necessidade da aplicao, ser reduzida para 2% do seu
tamanho, que ficou 0.02.

Figura 11. Interaes dos Estados

Foi definido tambm a animao da aplicao, que deve ser feita uma a uma,
para os nove Estados, mostrada na Figura 12, que ir girar no eixo Z e ter 10 segundos.

Figura 12. Configurao de animaes

Ao finalizar todo o posicionamento dos objetos, importao do udio e

configurao da animao, deve salvar o projeto para ser publicado. Na opo
file/save, definimos o nome do projeto e local a ser salvo. Em seguida file/publish
e definimos o local a ser salvo, como mostrado na Figura 13.

Figura 13. Salvando e Publicando a aplicao

O projeto ser salvo e compactado em formato .zip, necessrio descompactar

para publicar a aplicao. Dentro da pasta BANDEIRAS FINAL, ter uma pasta com o
nome flarasApp com todos os arquivos da aplicao. Para utilizar na rede local, deve
executar o arquivo com o nome index-local-running e para uso online utilizamos o
arquivo index-online-running, mostrado na Figura 14.

Figura 14. Pasta com os arquivos na aplicao das Bandeiras dos Estados do Nordeste
Brasileiro

Para utilizao online, a pasta com a aplicao foi postada no Dropbox, um disco
virtual com funes de armazenamento e compartilhamento de arquivos e pastas online. Depois de copiado em Copy public link, basta utilizar o link, (no caso desta
aplicao:https://dl.dropbox.com/u/97090306/BANDEIRAS%20FINAL/flarasApp/inde
x-online-running.html) da rea de transferncia e o usurio imprimir o referente
marcador utilizado nessa aplicao, que deve ser tambm disponibilizado, ilustrado na
Figura 15.

Figura 15. Publicao do projeto online

Na Figura 16, a aplicao final rodando no navegador. A interao pode ser feita
de duas maneiras:

Utilizando o marcador de interao ou,

Os comandos do teclado mostrados na legenda.

Figura 16. Aplicao final rodando no navegador

5. Concluso
A Realidade Aumentada pode ser utilizada em reas como publicidade, educao e de
entretenimento. Seja utilizando programao ou ferramentas de autoria, essa tecnologia
vem ganhando muito espao nos ltimos anos.
As ferramentas abordadas neste trabalho podem servir de acordo com sua
necessidade e grau de conhecimento: O EZFlar, como aplicao 100% online, pode
trazer uma soluo rpida para aplicaes simples, utilizando apenas um marcador e
importando os objetos, possvel ter bons resultados; O ARToolKit traz uma
possibilidades mais amplas de criao e aplicao da Realidade Aumentada, desde a
aplicao em marcadores diversos, quanto a diversidade de possibilidades de criao,
podendo ser criado marcadores personalizados, tendo como grande obstculo, para a
grade maioria, conhecimento em programao.
Com o FLARAS, possvel uma pessoa sem grandes conhecimentos consiga
desenvolver uma aplicao e utilizar na rea desejada, como forma alternativa para
desenvolver atividades educativas, seja uma aplicao para uso local, aplicaes como a
do Mapa da Regio Nordeste, como a possibilidade de publicao online de uma
aplicao interativa.

Este trabalho delineia como propostas para trabalhos futuros a realizao de um

estudo mais aprofundado sobre Realidade Aumentada, utilizando a ferramenta de
Autoria FLARAS como recurso no desenvolvimento de aplicaes.
Referncias
Amaral, B. (2012) Sony apresenta Wonderbook, livro de realidade aumentada.
Disponvel em http://www.techtudo.com.br/jogos/noticia/2012/06/sony-apresentawonderbook-livro-de-realidade-aumentada.html. Acessado em 23 setembro de 2012.
Artoolkit homepage (2007) Disponvel m http://www.hitl.washington.edu/artoolkit/.
Acesso em: 20 Setembro 2012.
Azuma, R. T. et al. (2001) Recent Advances in Augmented Reality
Computer Graphics and Applications.

IEEE

Criatives (2012), Project Glass O culos do futuro criado pelo Google. Acessado
em:
<http://www.criatives.com.br/wp-content/uploads/2012/04/Project-glassgoogle.jpg>. Acessado em 20 set. 2012
EZFlar (2012) Disponvel em: http://ezflar.com. Acessado em 20 Setembro 2012.
Kirner, C. and Siscoutto (2007) Realidade Virtual e Aumentada: Conceitos, Projeto e
Aplicaes. Editora SBC Sociedade Brasileira de Computao, Porto Alegre, 2007.
Livro do pr-simpsio, IX Symposium on Virtual and Augmented Reality, Petrpolis
Malpeli, E., Roda, D. e Freitas, A. (2009) Crie voc mesmo sua Realidade Aumentada
neste servio online desenvolvido por brazucas. Disponvel em:
<http://www.baixaki.com.br/download/ezflar.htm> . Acessado em 21 setembro 2012
Merigo,
C.
(2011)
Axe

http://www.brainstorm9.com.br/19230/

The

Fall.

Disponvel

em:

Souza, R.C.; Moreira, H.D.F.; Kirner, C. (2012) - FLARAS 1.0 Flash Augmented
Reality
Authoring
System,
e-book,.
Disponvel
em:
http://www.ckirner.com/flaras/download/documentacao/livro-flaras.pdf. Acesso em:
15 de setembro de 2012.