Utilizador:Oceanario
Olá, somos um grupo de trabalho constituído pela Andreia Nascimento, Marguerita Silva, Cláudia Falcão e Joana Amorim.
O objectivo do mesmo é criar uma estrutura interactiva no âmbito de Laboratório de Multimédia 1 e Imagem Digital - Estática.
Memória Descritiva
Como já referimos, o objectivo do trabalho é criar toda uma estrutura interactiva para responder a uma dada necessidade. A nossa escolha incidiu sobre o Oceanário de Lisboa, nomeadamente o tanque principal, onde iremos referir algumas espécies que lá habitam (de momento queremos referir 8 espécies, mas pode ser necessário fazer ajustes neste aspecto posteriormente). A estrutura interactiva terá lugar numa aplicação offline.
Para o desenvolvimento será necessária a confecção de vários elementos como todos os cenários a utilizar, caixas de texto, o próprio texto, as espécies a referir, elementos decorativos e botões. Este projecto estará direccionado para todos os visitantes do Oceanário de Lisboa que queiram aprender, de uma forma divertida, sobre (algumas) espécies que lá habitam.
Calendarização:
12 Dezembro (Segunda-Feira): Desenvolvimento, durante o período da aula (Laboratório de Multimédia), da arborescência da aplicação. Divisão de tarefas entre os elementos do grupo.
Até 15 Dezembro (Quinta-Feira): Realização de toda a parte do projecto que diz respeito a Imagem Digital - Estática. Isto é, a versão ALPHA do projecto conjunto - um cenário totalmente desenvolvido e a maioria dos conteúdos e restantes cenários finalizados, organizados em ficheiros de edição de imagem (Photoshop ou Illustrator) e um relatório constituído pelos documentos de planificação complementam a entrega do projecto.
Até 13 Janeiro (Sexta-Feira): Realização de toda a estrutura interactiva implementando todos os ficheiros realizados em ID-E em Flash.
Divisão de Tarefas:
Andreia: Organização dos conteúdos na biblioteca, recolha de todos os sons a utilizar e integração dos mesmos no projecto e todo o trabalho de ActionScript.
Cláudia: Animações integrantes do projecto.
Marguerita: Organização dos conteúdos na biblioteca, no stage e respectiva distribuição pelas layers.
Joana: Organização dos conteúdos a biblioteca, no stage e respectiva distribuição pelas layers.
Impacto Desejado:
É sem dúvida do nosso interesse criar uma estrutura interactiva de qualidade, que possa oferecer ao utilizador lazer e educação ao mesmo tempo. Todo o nosso esforço remeterá para que este objectivo final seja cumprido.
Arborescência
Relatório
1. Apresentação do Projeto
O projeto realizado por nós, tem como tema principal o Oceanário de Lisboa, mas centralizando-se em quatro especíes localizadas no tanque central do mesmo. Concebemos uma aplicação off-line para crianças de idade compreendida entre os 7-9 anos, isto pela concepção visual que quisemos que o nosso projecto adquirisse.
É um projeto interativo em que a criança irá navegar pelo ambiente principal, que tenciona retratar o fundo do Oceanário, com peixes que se movem. Encontram-se ainda pequenas animações interactivas, como o passar do rato no baú que faz mover a chave.
Ao clicar num peixe, somos direccionados para um menu onde podemos encontrar, de imediato, informações gerais sobre o mesmo. Nesse menu, são fornecidas outras informações que surgem ao clique do rato num botão tais como informação sobre a alimentação, localização a nível mundial, e algumas curiosidades.
2. Analise e Planeamento
A aplicação por nós criada tem como objectivo a exploração de conteúdos informativos sem que seja necessária uma conexão à Internet.
Quanto ao tema, tínhamos duas opções: Oceanário de Lisboa ou Sea Life, no Porto. Devido à falta de informação no site do Sea Life quanto às espécies existentes, optamos então pelo Oceanário. Escolhemos o tanque principal e quatro especíes que achamos mais interessantes para fazer a nossa aplicação multimédia.
O visual desta foi inspirado no site oficial e nalguns jogos interactivos, para os mais novos, sobre o mundo animal. Assim conseguimos ter uma ideia do que investigar e do material a utilizar para o efeito.
3. Desenho Funcional
3.1. Requisitos Funcionais O nosso projecto, baseado no tema do Oceanário retrata quatro das espécies que habitam no tanque principal e o seu objectivo é oferecer aos utilizadores algum conhecimento acerca delas sem ser necessária conexão à internet.
A estrutura interactiva oferece ainda alguma liberdade de navegação, o utilizador pode escolher quando quer aceder a determinada informação.
Contém botões clicáveis, os mais abundantes de toda a estrutura, representados pela espécie que a informação a que é possível aceder retrata. Existe ainda um botão que responde à passagem do rato que faz surgir uma pequena animação com o objectivo de chamar atenção de determinado objecto, que devido às suas dimensões reduzidas e caracter pouco evidente em relação a todo o ambiente envolvente pode passar despercebido e no entanto é também um botão.
3.2. Estrutura Arborescente
A estrutura arborescente da nossa aplicação (acima representada) é de tipologia composta. Em certos momentos apresenta uma tipologia hierárquica linear, pois não é possível seleccionar outro ícone do menu principal após ter seleccionado algum (se seleccionei o Bodião Limpador, não posso de imediato seleccionar a Moreia Pintada, tenho de regressar ao menu principal para o fazer). Por outro lado, quando estou perante um submenu (Moreia Pintada, por exemplo), a estrutura assume uma tipologia hierárquica não-linear com paradigma de interacção índex bastante explicito onde tenho liberdade total de navegação entre os diversos menus apresentados.
Por último, o menu que corresponde aos créditos foi eliminado por sugestão de um professor. É algo que não iria enriquecer em nada o trabalho e uma vez que este é direccionado ao público mais infantil, não teria grande interesse.
3.3. Desenho de interacção e usabilidade
Estão destacados no menu principal elementos cuja passagem do rato indica um link. Temos assim um paradigma ambiente, no qual o utilizador terá que descobrir por si mesmo os vários botões e finalidades dos objectos lá colocados, sendo que os únicos claramente visíveis serão os mais funcionais (como o botão de som on/off e o botão de sair).
No menu informativo de cada peixe, optamos por botões simples e claros, mas sem que estes perdessem o efeito de animação pretendido.
4. Desenho Técnico
Para tornar o nosso projecto mais cativante, decidimos colocar não só os peixes escolhidos e as suas várias informações, como também alguma parte interativa e divertida que aliasse a aprendizagem ao lazer. Decidimos então colocar um pequeno baú, que à passagem do rato anima uma chave que o irá abrir com um simples clique.
Aliado a isto podemos referir todo o trabalho que tivemos ao simplificar as formas e imagens, para que estas pudessem chamar mais a atenção do público-alvo, as crianças.
5. Produção do Projeto
5.1. Estrutura e meios de navegação/interacção
O nosso projecto está, na sua maioria, desenvolvido dentro de movie clips.
Cada menu que apresentamos é um movie clip que integra determinada informação. Assim, permite-nos apresentar um ficheiro mais organizado nas camadas e ao mesmo tempo fácil de controlar.
Deste modo evitamos também confusões ao trabalhar determinado elemento e minimizamos a possibilidade de erro, sendo também mais fácil, no caso de ocorrência do mesmo, corrigi-lo.
5.2. Integração e controlo de Som
A integração e controlo de som foi, na sua totalidade, desenvolvida através de ActionScript.
Após declaradas as variáveis este é controlado nos botões através de release, rollOver e rollOut e ainda em frames, quando a cabeça de leitura passa nelas.
O evento release foi utilizado nos botões expostos no menu principal destinados ao play e stop do som. À passagem do rato no baú o som de bolhas que se ouve pára e dá lugar ao som das chaves e quando se remove o rato de cima do baú, o som das chaves pára e retoma o som das bolhas. Por último, à entrada de cada um dos submenus há uma ordem na respectiva frame para que o som das bolhas pare, com excepção do submenu do baú, que pára o som das bolhas de fundo mas no seu lugar inicia outro som de bolhas.
5.3. Animação
A animação integrante do nosso trabalho está presente logo desde o primeiro segundo.
Optámos por uma entrada dos elementos de fundo em tela animada, passando estes de um estado de alpha de 0% a 100%.
Após concluída esta animação surgem outras, como a entrada dos peixes que se efectua de fora da tela – porém, esta é uma animação que se repete constantemente para transmitir dinamismo no ambiente marinho que se pretende representar, exceptuando os peixes que representam os botões, estes ficam estáticos para se realçarem dos outros. Nesta fase, também alguns elementos de fundo ganham dinamismo, tal como as algas que se mexem. Tudo isto para conseguir transmitir um fundo de oceano próximo da realidade.
Verificam-se ainda outros elementos de animação, como as bolhas a simular a respiração dos peixes, para que a presença destes em tela seja um pouco mais dinâmica - visto que após a sua entrada estes ficam estáticos. À entrada do submenu do baú também surgem algumas bolhas.
Os submenus com informações dos peixes carecem bastante de animação, esta apenas surge quando se clica no botão que remete para a localização mundial do respectivo peixe, em que o mapa do mundo surge de fora da tela e a sinalização da localização surge com um alpha de 0% passando progressivamente para 100%.
Há também alguns motions tween ao longo de toda a estrutura.
5.4. Soluções técnicas adoptadas para a resolução de problemas
Surgiram vários problemas ao longo da realização do projecto, alguns relativos à animação e outros ao controlo de som através de ActionScript.
Em relação à animação os problemas surgiram devido à forma como estavam apresentados os nossos elementos. Isto é, todos os elementos que integram o nosso projecto foram realizados em Illustrator e pequenos pormenores (como uma linha) ficavam separados do resto da cauda do peixe por exemplo. Assim, para animar a mesma era necessário dividi-la do próprio peixe e criar imensos símbolos. Portanto, neste caso optámos por fazer os peixes “passear” no ambiente marinho que constituía o fundo. Quanto às algas integrantes do mesmo, o problema foi semelhante, assim, foram criadas as sequencias à parte para que depois implementassem um movie clip que daria lugar à animação das mesmas.
No que diz respeito ao controlo de som via ActionScript o problema estava relacionado com o mau funcionamento do mesmo. Após declaradas as variáveis e todos os comandos que eram necessários para o controlo de som este funcionava mal, parava quando não devia parar e não parava quando devia parar, etc. A resolução deste problema passou por várias experiências como declarar as variáveis dentro dos movie clips e até ordenar acções de stop em frames.
6.Conclusão
6.1. Reflexão critica
Com este trabalho foi possível para nós desenvolver mais competências das matérias abordadas nas aulas práticas de LABMMM1. Usamos o que aprendemos nas primeiras aulas de flash, e que viemos aperfeiçoar com a curta de animação 2D; conseguimos usar esses conhecimentos em algumas partes da nossa aplicação final do primeiro semestre. Mais tarde, a implementação de toda a estrutura interactiva através de ActionScipt 2.0, que nos permite a navegação entre os diversos menus integrantes do trabalho, bem como a informação neles contida.
O projeto contribuiu muito para o melhor a nossa aprendizagem e aperfeiçoar algumas competências já adquiridas. Tornou, ainda, a pesquisa de novas vertentes necessárias para a realização do mesmo, essencial, o que nos possibilitou alargar o conhecimento para futuros projetos ou trabalhos dentro e fora do percurso escolar. O nosso objetivo principal foi a criação de uma estrutura interativa de qualidade que permitisse simultaneamente a educação e lazer. Chegando ao fim pensamos que este foi atingido.
6.2. Sugestões para o aperfeiçoamento e/ou desenvolvimento futuro do projeto
Apesar de pensarmos que as nossas espectativas iniciais para com o projeto tenham sido alcançadas, nunca é de mais pensar que ainda pode ser melhorado. Um projeto tem sempre algo que possa ser melhorado, não sendo este, exceção. Tornar a informação apresentada sobre os peixes mais e abrangente e referir mais espécies habitantes no tanque central do oceanário.
Em relação à animação, contemplando também o desenho do fundo, podia tornar-se mais cativante tendo a água a mover-se como acontece de facto, num aquário.
7. Referências Web e Bibliográficas
Como foi dito em alguns pontos anteriores, as principais referências web que tivemos foram o site do Oceanário de Lisboa e o do Sea Life, incidindo mais sobre o primeiro. Quanto à concepção gráfica inspiramo-nos em algo que cativasse os mais novos e gráficos bastante simples.
