Utilizador:Ocean voice

Da Lab. Multimédia 1
(Diferença entre edições)
Ir para: navegação, pesquisa
Linha 23: Linha 23:
 
'''1.Apresentação Projeto'''
 
'''1.Apresentação Projeto'''
  
No âmbito das unidades curriculares de Laboratório Multimédia 1 e Imagem Digital Estática, realizamos um projeto, onde o nosso tema de enfoque é o Oceanário, e através do qual desenvolvemos um Quiosque Multimédia.
+
No âmbito das unidades curriculares de Laboratório Multimédia 1 e Imagem Digital Estática, realizou-se um projeto, onde o nosso tema de enfoque é o Oceanário, e através do qual desenvolvemos um Quiosque Multimédia.
Esta aplicação é destinada a crianças de uma faixa étaria dos 3 aos 8 anos, como tal todo o nosso projeto foi pensado e estruturado tendo em conta as necessidades especiais deste público alvo.
+
Esta aplicação é destinada a crianças de uma faixa étaria dos 3 aos 8 anos, como tal todo o nosso projeto foi pensado e estruturado tendo em conta as necessidades, as limitações e os interesses deste mesmo público.
  
Desenvolvemos uma aplicação que possibilita uma fácil interação, que incorpora sons, elemento que é um factor extremamente importante para a orientação das crianças mais novas.
+
Desenvolveu-se uma aplicação baseada na cor e na sobriedade acompanhada de sons e narrações.
  
 
'''2.Análise e Planeamento'''
 
'''2.Análise e Planeamento'''
  
A aplicação foi desenvolvida como sendo um quiosque interativo a ser integrado num oceanário de forma a permitir uma exploração interativa aos visitantes, sendo o público infantil de faixa etária compreendida entre os 3 e os 8 anos de idade o nosso público alvo. Esta aplicação tem como objectivo permitir aos utilizadores adquirirem conhecimentos sobre os seres que habitam o fundo do mar, focando-se nas águas temperadas do pacífico, sendo assim esta uma aplicação lúdica e divertida.  
+
A aplicação foi desenvolvida enquanto quiosque interativo a ser integrado no 'Oceanário' de forma a permitir uma exploração interativa aos visitantes, sendo o público infantil de faixa etária compreendida entre os 3 e os 8 anos de idade o nosso público alvo. Esta aplicação tem como objectivo permitir aos utilizadores adquirirem conhecimentos sobre os seres que habitam o fundo do mar, focando-se nas águas temperadas do pacífico.  
  
 
Aqui apresentamos alguns dos sites e aplicações que nos serviram de base para a elaboração e estruturação do quiosque de multimédia:
 
Aqui apresentamos alguns dos sites e aplicações que nos serviram de base para a elaboração e estruturação do quiosque de multimédia:
Linha 91: Linha 91:
 
[[Ficheiro:Jogo.PNG]][[Ficheiro:Jogo_1.PNG]]
 
[[Ficheiro:Jogo.PNG]][[Ficheiro:Jogo_1.PNG]]
  
Desta forma e tendo em conta a investigação  por nós efetuada, foram escolhidas cores que despertassem a atenção do público alvo, tal como uma linguagem adequada à faixa etária que pretendemos atingir, tendo em conta as suas necessidades.
+
Desta forma e tendo em conta a investigação  por nós efetuada, foram escolhidas cores que despertassem a atenção do público alvo, tal como uma linguagem adequada à faixa etária que pretendemos atingir.
A criação de figuras dinâmicas e expressivas foi o nosso principal objetivo, de forma a despertar a curiosidade e o interesse visual das crianças, levando a que as mesmas interagissem.
+
A criação de figuras dinâmicas e expressivas foi o nosso principal objetivo, de forma a despertar a curiosidade e o interesse visual das crianças, conduzindo-as à interacção.
Para isto, foi criada a personagem Matias que interpreta o papel de um guia que acompanha o visitante na viagem ao oceanário. A personagem fornece informações sobre os seres vivos presentes nos diferentes habitats criados nos aquários do oceanário.  
+
Para isto, foi criada uma personagem de seu nome Matias que interpreta o papel de guia que acompanha o visitante na viagem ao 'Oceanário'. A personagem fornece informações sobre os seres vivos presentes nos diferentes habitats criados nos aquários do oceanário.  
Apesar de todos os animais presentes no stage serem selecionaveis, apenas o cavalo-marinho é portador de diversas informações, que serão explicitadas mais á frente. Já todos os outros seres vivos apresentarão apenas uma imagem sua real quando selecionados. Esta decisão foi tomada em conjunto com o professor Mário Vairinhos responsável pela disciplina de Imagem Digital Estática, pois após uma análise percebemos que seria mais viável focarmo-nos apenas num ser vivo.
+
Apesar de todos os animais presentes no stage serem selecionáveis, apenas o cavalo-marinho (Gugas) é susceptível de ser explorado e dissecado. Já todos os outros seres vivos apresentarão apenas a sua imagem quando selecionados. Esta decisão foi tomada em conjunto com o professor Mário Vairinhos responsável pela disciplina de Imagem Digital Estática, que sugeriu que se explorasse apenas um ser vivo.
  
  
Linha 100: Linha 100:
 
<br>
 
<br>
 
<br>
 
<br>
*Mostrar aos mais novos que aprender pode ser divertido
+
*Mostrar aos mais novos que aprender pode ter um carácter lúdico;
*Dar a conhecer as características do cavalo marinho
+
*Dar a conhecer as características do cavalo marinho;
*Despertar interesse sobre os oceanos
+
*Despertar interesse sobre os oceanos;
*Dinamizar o espaço onde a aplicação estaria inserida
+
*Dinamizar o espaço onde a aplicação estaria inserida;
*Instruir os mais novos acerca da cultura dos oceanos
+
*Instruir os mais novos acerca da cultura dos oceanos;
  
 
== Estudo para a estrutura da aplicação ==
 
== Estudo para a estrutura da aplicação ==
Linha 123: Linha 123:
 
'''a. Requisitos Funcionais:'''  
 
'''a. Requisitos Funcionais:'''  
  
Neste ponto tentamos ao máximo ter em conta o público alvo e o objetivo para o qual a aplicação foi concebida, tentando torna-la o mais funcional e prática possivel.
+
Neste ponto tentámos ao máximo ter em conta o público alvo e o objetivo para o qual a aplicação foi concebida, tentando torná-la o mais funcional e prática possivel.
O primeiro contacto com a aplicação é proporcionado através de um genérico que procura despertar de imediato o interesse dos mais novos, aparecendo assim dois pequenos peixes que trazem com eles as boas vindas ao oceanário.Nestes peixes iniciais procuramos utilizar cores alegres, que despertassem o interesse por parte dos mais novos.
+
O primeiro contacto com a aplicação é feito através de um genérico que procura despertar o interesse dos mais novos, aparecendo assim dois pequenos peixes que trazem com eles as boas vindas ao oceanário. Com estes peixes procuramos utilizar cores alegres, que despertassem o interesse por parte dos mais novos.
Assim, neste cenário não temos disponivel nenhum botão específico. Porém, é importante referir o facto de todo o cenário ser selecionável, possibilitando assim o avanço para o cenário seguinte.
+
Assim, neste cenário não temos disponivel nenhum botão específico. Porém, é importante referir que todo o cenário é selecionável, possibilitando assim o avanço para o cenário seguinte.
  
  
Em seguida, somos presenteados com uma breve apresentação do guia desta pequena viagem pelo Oceanário, guia este que se chama Matias  que estara presente em toda a aplicação, guiando assim as crianças, auxiliando assim nos casos em que as crianças não sabem ler, pois todos os textos estão acompanhados pela sua voz.Neste cenário existe apenas um botão de "saltar intro" representado por uma seta.
+
Em seguida, surge uma breve apresentação do guia desta pequena viagem pelo Oceanário, que estará presente em toda a aplicação, guiando assim as crianças, auxiliando-as assim com narrações das informações/indicações que vão surgindo escritas, pois todos os textos estão acompanhados pela sua voz. Neste cenário existe apenas um botão de "saltar intro" representado por uma seta.
  
Já no terceiro cenário, e cena de repouso temos uma barra oculta, que apenas se torna selecionavel quando se toca na setinha que esta sempre visivel ao centro do ecrã em cima,esta barra contem diversas palavras selecionavais, que nos direcionam para páginas que associadas aos seres vivos presentes no stage.
+
Já no terceiro cenário, e cena de repouso existe uma barra oculta. Esta barra contém diversas palavras selecionáveis, que nos direcionam para páginas associadas aos seres vivos presentes no stage.
Contudo estão ainda presentes no ecrã no canto superior direito três botões segundo a ordem de cima para baixo, o botão de "sair" representado com um botão de desligar e que permite sair da aplicação.O botão de "ligar/desligar" o som, representado por um altifalante,em seguida encontra-se o botão de "ajuda" representado por um ponto de interrogação.
+
Contudo estão ainda presentes no ecrã no canto superior direito três botões (de cima para baixo): o botão de "sair" representado com um botão de desligar e que permite sair da aplicação; o botão de "ligar/desligar" o som, representado por um altifalante; e o botão de "ajuda" representado por um ponto de interrogação.
  
 
No ultimo cenário, continuamos a ter "presente" a barra oculta, que funciona como no cenário anterior, aqui conforme as escolhas tomadas no cenário antecedente teremos no caso do cavalo marinho, seis botões selecionaveis, sendo eles "Alimentação", "Família", "Anatomia", "Habitat", "Jogos", e "Videos".
 
No ultimo cenário, continuamos a ter "presente" a barra oculta, que funciona como no cenário anterior, aqui conforme as escolhas tomadas no cenário antecedente teremos no caso do cavalo marinho, seis botões selecionaveis, sendo eles "Alimentação", "Família", "Anatomia", "Habitat", "Jogos", e "Videos".
Já no caso de todos os outros seres vivos terão apenas associado ao seu botão uma página com a sua imagem real.
 
 
Temos ainda presentes no lado superior direito o botão de "sair", o botão de "ligar/desligar" o som, o botão de "voltar" ao cenário anterior e ainda o botão de "ajuda".
 
Temos ainda presentes no lado superior direito o botão de "sair", o botão de "ligar/desligar" o som, o botão de "voltar" ao cenário anterior e ainda o botão de "ajuda".
  
Linha 147: Linha 146:
  
  
Apartir do primeiro cenário após a introdução temos a possibilidade de selecionar qual o ser vivo que pretendemos explorar, depois aberta a página do animal selecionada, podemos regressar ao cenário de repouso.
+
Apartir do primeiro cenário após a introdução temos a possibilidade de selecionar qual o ser vivo que pretendemos explorar, depois de aberta a página do animal selecionada, podemos regressar ao cenário de repouso.
 
Se escolhermos o cavalo marinho podemos então selecionar os botões ja especificados, ou então regressar ao cenário de repouso.
 
Se escolhermos o cavalo marinho podemos então selecionar os botões ja especificados, ou então regressar ao cenário de repouso.
  
Linha 153: Linha 152:
 
'''c.Desenho de interação e usabilidade'''
 
'''c.Desenho de interação e usabilidade'''
  
Antes procedermos a elaboração do projeto passamos por diversas etapas, entre as quais a discussão e analise das melhores soluções gráficas, estéticas, e funcionais para esta aplicação.
+
Antes de procedermos à elaboração do projeto passámos por diversas etapas, entre as quais a discussão e analise das melhores soluções gráficas, estéticas, e funcionais para esta aplicação.
Assim, após a escolha de um tema podémos então perceber quais seriam os parâmetros a ter em consideração, desta forma a usabilidade e funcionalidade deste projeto.
+
Assim, após a escolha de um tema foi-nos possível perceber os parâmetros a ter em conta. Fatores como o público alvo, problemas que podem existir pelo facto de esta aplicação ser destinada a crianças, e ainda a facilidade de interação, e interpretação dos elementos constituintes da aplicação.  
Fatores como o público alvo,problemas que podem existir pelo facto de esta aplicação ser destinada a crianças, e ainda a facilidade de interação, e interpretação dos elementos constituintes da aplicação.  
+
  
Numa fase inicial do desenho funcional, revelou-se pertinente a existência de botões, janelas, caixas de diálogo, e menus, por forma a facilitar a interação, e a navegação ao longo de toda a aplicação.
+
Numa fase inicial do desenho funcional, revelou-se pertinente a existência de botões, janelas, caixas de diálogo, e menus, de forma a facilitar a interação, e a navegação ao longo de toda a aplicação.
Foram muitos os pontos que tivemos de ter em consideração, e o facto de o nosso publico alvo ser crianças, isso significa que estão na fase mais propicia para aprenderem, e interiorizarem aquilo que lhes é transmitido, desta forma tentamos utilizar linguagem facil de perceber para as crianças com ideade acima dos 7 anos, e implementou-se audio com o objetivo de possibilitar a mesma compreensão daquilo que é apresentado a crinças com idade abaixo dos 6 anos.  
+
O facto de o nosso publico alvo serem crianças, sugeriu-nos que utilizassemos linguagem acessível para a parte do público capaz de ler e implementou-se, ainda, audio para os que não são ainda capazes de o fazer.
 +
Procurámos assim criar um ambiente rico em cores, utilizando ilustrações expressivas, que despertassem nas crianças o desejo de lhes 'tocar' e de interagir.
 +
Para este efeito tentámos pereceber quais seriam as necessidades não só das crianças mas também dos acompanhantes destas na visita ao 'Oceanário', disponobilizando assim botões como o "saltar intro" que possibilita isso mesmo, e que se destina a esses mesmos acompanhantes que, hipoteticamente, poderiam já ter utilizado a aplicação anteriormente não tendo então a necessidade de ver a introdução novamente.
 +
Outro botão criado foi ainda o de "ajuda" pronto a esclarecer dúvidas que podem surgir.
 +
Procuramos ainda criar uma dinâmica no cenário, através de elementos como uma moreia que surge de entre as rochas, e uma concha que se abre com auxílio de um 'rollover'.
  
Procuramos assim criar um ambiente rico em cores, utilizando seres vivos muito desenhados, e com expressões amigaveis, que despertassem nas crianças um certo desejo de lhes "tocar", de interagir, de brincar.
+
Posto isto e tendo em conta os factores psicológicos, emocionais e cognitivos do público alvo em questão e os princípios básicos do desenho de interacção e interfaces para a promoção e avaliação da usabilidade, foi possível o desenvolvimento de adequadas concepções, desenhos, implementações e avaliações da estrutura, os percursos, as formas e os  meios de navegação ou de interacção.
Para este efeito tentamos pereceber quais seriam as necessidades não só das crianças mas também dos pais, disponobilizando assim botões como o "saltar intro" que possibilita isso mesmo, e que se destina aos pais que já viram a aplicação diversas vezes ao se deslocarem ao Oceanário, e já não tem necessidade de ver a introdução novamente.
+
Outro botão pensado para auxiliar os pais nesta viagem com os seus filhos é o de "ajuda" pronto a esclarecer dúvidas que podem surgir.
+
Procuramos ainda criar uma dinâmica no cenário, através de elementos como a moreia que sai das rochas, e a concha que se abre ao ser clicada.
+
 
+
Posto isto e tendo em conta os factores psicológicos, emocionais e cognitivos do público alvo em questão e os princípios básicos do desenho de interacção e interfaces para a promoção e avaliação da usabilidade, foi possível o desenvolvimento de adequadas concepções, desenhos, implementações e avaliações da estrutura, os percursos, as formas e os  meios de navegação ou de interacção
+
  
  
Linha 189: Linha 186:
 
'''a. Estrutura e meios de navegação/Interacção'''
 
'''a. Estrutura e meios de navegação/Interacção'''
  
A navegação e interaçãi na nossa aplicação é realizada através botões, caixas de diálogo,janelas, e icones selecionaveis, desta forma o utilizador pode selecionar o percurso que quer realizar.
+
A navegação e interação na nossa aplicação é realizada através botões, caixas de diálogo,janelas, e icones selecionaveis, desta forma o utilizador pode selecionar o percurso que quer realizar.
  
 
'''b.Integração e controlo de som'''
 
'''b.Integração e controlo de som'''
Linha 207: Linha 204:
  
  
- A nível de organização do projeto tivemos algumas dificuldades na organização da library, pois chegou a um ponto em que era demasiada informação existente, contudo conseguimos solucionar esse problema ao organizarmos tudo por pastas.
+
- A nível de organização do projeto tivemos algumas dificuldades na organização da library devido à grande quantidade de pastas existentes;
  
- O facto de termos optado por trabalharmos todos num único .fla para uma utilização correta, e uma organização necessária dificultou o trabalho na medida em que assim apenas poderia estar a trabalhar um membro do grupo de cada vez, caso contrário perderiamos informação se trabalhassemos todos ao mesmo tempo.
+
- O que suscitou mais dificuldade foram os jogos, na medida em que não temos formação suficiente em AS2 para os desenvolvermos da forma que seria desejada. Contudo conseguimos contornar este problema através da consulta de informação à disposição em fórums, páginas web genéricas ou no youtube. O principal objectivo deste jogo 'pergunta-resposta' com contabilização de pontos é de carácter formativo, avaliando os conhecimentos adquiridos ao longo da exploração da aplicação. As perguntas debruçam-se um pouco por todos as áreas abordadas acerca do Cavalo Marinho. Ao utilizador é dirigida uma pergunta e 3 opções de resposta (com apenas uma opção correcta). Por cada resposta correcta, o utilizador ganha 1 ponto. A pontuação máxima será de 4 pontos (uma vez que existem 4 perguntas ao longo do Quiz). Consoante a pontuação é atribuído no final (a juntar à pontuação um comentário sobre a prestação do utilizador.
 
+
 
+
- O que suscitou mais dificuldade foram os jogos, na medida em que não temos formação suficiente em AS2 para criarmos um jogo, contudo conseguimos resolver o problema através da consulta de informação à disposição em fórums, páginas web genéricas ou no youtube. O principal objectivo deste jogo 'pergunta-resposta' com contabilização de pontos é de carácter formativo, avaliando os conhecimentos adquiridos ao longo da exploração da aplicação. As perguntas debruçam-se um pouco por todos as áreas abordadas acerca do Cavalo Marinho. Ao utilizador é dirigida uma pergunta e 3 opções de resposta (com apenas uma opção correcta). Por cada resposta correcta, o utilizador ganha 1 ponto. A pontuação máxima será de 4 pontos (uma vez que existem 4 perguntas ao longo do Quiz). Consoante a pontuação é atribuído no final (a juntar à pontuação um comentário sobre a prestação do utilizador.
+
 
Para o desenvolvimento deste jogo em particular, e no que diz respeito ao emprego de código AS2 foi necessário declarar uma variável que permitisse contabilizar os pontos; utilizar «goto's» para que o utilizador progrida dentro do Quiz e ainda a associação de uma segunda variável ao texto para que as mensagens surjam de acordo com os pontos adquiridos (bem como a utilização de if's para que se associe a uma determinada pontuação, uma mensagem específica).
 
Para o desenvolvimento deste jogo em particular, e no que diz respeito ao emprego de código AS2 foi necessário declarar uma variável que permitisse contabilizar os pontos; utilizar «goto's» para que o utilizador progrida dentro do Quiz e ainda a associação de uma segunda variável ao texto para que as mensagens surjam de acordo com os pontos adquiridos (bem como a utilização de if's para que se associe a uma determinada pontuação, uma mensagem específica).
  
Linha 219: Linha 213:
  
  
- O inico da aplicação é apresentado por um modo de repouso desenvolvido em movieclip que apresenta através uma frase de boas vindas (“Bem-vindos ao Oceanário”) que é introduzida no ecrã pela entrada de dois peixes, ambos os seus movimentos foram criados através de guides que determinam o percurso das mesmas no ecrã até ao ponto final onde param e permanecem no mesmo sítio, permitindo uma melhor leitura ao utilizador. Este movimento de entrada da nota de boas-vindas irá repetir-se até que o utilizador interaja com a aplicação.  
+
- O inico da aplicação é apresentado por um modo de repouso desenvolvido em movieclip que apresenta através uma frase de boas vindas (“Bem-vindos ao Oceanário”) que é introduzida no ecrã pela entrada de dois peixes, ambos os seus movimentos foram criados através de guide-layers que determinam o percurso das mesmas no ecrã até ao ponto final onde param e permanecem no mesmo sítio, permitindo uma melhor leitura ao utilizador. Este movimento de entrada da nota de boas-vindas irá repetir-se até que o utilizador interaja com a aplicação.  
 
Para a personagem Matias foram criados Motion Tweens que permitiram aproximar a sua cara no momento da sua apresentação e a criação do movimento dos lábios correspondentes aos sons que reproduz na explicação das informações. Para além de explicar as diferentes informações do cavalo-marinho, Matias, ajuda o visitante a explorar a plataforma de multimédia, como por exemplo, a navegar nas diferentes opções disponíveis para o utilizador.
 
Para a personagem Matias foram criados Motion Tweens que permitiram aproximar a sua cara no momento da sua apresentação e a criação do movimento dos lábios correspondentes aos sons que reproduz na explicação das informações. Para além de explicar as diferentes informações do cavalo-marinho, Matias, ajuda o visitante a explorar a plataforma de multimédia, como por exemplo, a navegar nas diferentes opções disponíveis para o utilizador.
 
O habitat correspondente ao cenário 2, onde estão presentes as enumeras espécies, que corresponde a um ambiente de um aquário do oceanário. Este ambiente foi preenchido e animado por diferentes movimentos associados aos elementos presentes no habitat. Como por exemplo, o movimento de deslocamento dos peixes, produzido através de motiontweens, o movimento das barbatanas, criado nos respectivos movieclips associados ao peixe em questão e o rollover associado à pérola e à moreia a sair da gruta.
 
O habitat correspondente ao cenário 2, onde estão presentes as enumeras espécies, que corresponde a um ambiente de um aquário do oceanário. Este ambiente foi preenchido e animado por diferentes movimentos associados aos elementos presentes no habitat. Como por exemplo, o movimento de deslocamento dos peixes, produzido através de motiontweens, o movimento das barbatanas, criado nos respectivos movieclips associados ao peixe em questão e o rollover associado à pérola e à moreia a sair da gruta.
Linha 226: Linha 220:
  
 
- Para uma mais fácil e cómoda navegação entre as partes do nosso movie, pensámos em criar uma barra que estaria oculta e que poderíamos utilizada a todo o momento com um simples rollOver num puxador que estaria disposto no topo do stage.
 
- Para uma mais fácil e cómoda navegação entre as partes do nosso movie, pensámos em criar uma barra que estaria oculta e que poderíamos utilizada a todo o momento com um simples rollOver num puxador que estaria disposto no topo do stage.
Como era uma tarefa que ainda não dominávamos, procurámos informação sobre esse tema em diversas fontes, no caso Youtube e Google. Também consultámos o professor Hélder Caixinha para nos poder facultar algumas ideias. O professor indicou-nos dois sites com diferentes formas de fazer essa barra oculta.
+
Como era uma tarefa que ainda não dominávamos, procurámos informação sobre esse tema em diversas fontes, no caso Youtube e Google. Também consultámos o professor Hélder Caixinha para que nos orientasse. O professor indicou-nos dois sites com diferentes formas de fazer essa barra oculta.
 
Depois de avaliadas as formas de execução e experimentadas, concluiu-se que poderia ser feito de uma forma mais fácil sem termos de recorrer a acções de script que ainda não dominávamos. Foi então que pensámos em realizar essa barra através das funcionalidades do Adobe Flash: buttons e movieclips.
 
Depois de avaliadas as formas de execução e experimentadas, concluiu-se que poderia ser feito de uma forma mais fácil sem termos de recorrer a acções de script que ainda não dominávamos. Foi então que pensámos em realizar essa barra através das funcionalidades do Adobe Flash: buttons e movieclips.
Efectuámos diversas operações de testes de actividade, mas foi mesmo com os movieclips que surgiu a nossa barra oculta.
+
Efectuámos diversas operações de testes de actividade, mas foi mesmo com recurso a movieclips que surgiu a nossa barra oculta.
Através do rollOver num botão, a que chamámos Puxador, ativávamos a funcionalidade de fazer descer uma barra com a integração de motion tweens. Quando aberta, esta barra teria à disponibilidade do utilizador onze diferentes botões, cada um corresponderia a um dos seres vivos que escolhemos para a aplicação.
+
Através do rollOver num botão, a que chamámos 'Puxador', ativávamos a funcionalidade de fazer descer uma barra com a integração de motion tweens. Quando aberta, esta barra teria à disponibilidade do utilizador onze diferentes botões, cada um corresponderia a um dos seres vivos que escolhemos para a aplicação.
 
Foi então que começaram a surgir os primeiros erros nesta actividade, entre eles os rollOvers ou os rollOuts que não estavam sincronizados ou então a existência indevida dos mesmos. Um exemplo disto, era fazermos rollOut de um botão, a barra deveria fechar se o ponteiro do rato, saísse de cima da barra. Isto por vezes não acontecia e portanto, sentimos a necessidade de criar como que um botão invisível que obrigasse a barra a fechar quando o utilizador saísse das opções da mesma e se decidisse por navegar de outra forma.
 
Foi então que começaram a surgir os primeiros erros nesta actividade, entre eles os rollOvers ou os rollOuts que não estavam sincronizados ou então a existência indevida dos mesmos. Um exemplo disto, era fazermos rollOut de um botão, a barra deveria fechar se o ponteiro do rato, saísse de cima da barra. Isto por vezes não acontecia e portanto, sentimos a necessidade de criar como que um botão invisível que obrigasse a barra a fechar quando o utilizador saísse das opções da mesma e se decidisse por navegar de outra forma.
Com o primeiro problema resolvido, surgem outros como é recorrente em qualquer trabalho. Neste momento, tínhamos o movimento da barra bem construído e foi então que detectámos que os botões quando seleccionados deveriam perder a sua funcionalidade para não causar deficiências ao nível da navegação. Foi então que decidimos criar uma barra para cada uma das espécies transformando os botões em símbolos, fazendo com que estes não sejam clicáveis, mantendo o utilizador no local onde pretende estar.
+
Com o primeiro problema resolvido, surgem outros como é recorrente em qualquer trabalho. Neste momento, tínhamos o movimento da barra bem construído e foi então que detectámos que os botões quando seleccionados deveriam perder a sua funcionalidade para não causar complicações ao nível da navegação. Foi então que decidimos criar uma barra para cada uma das espécies transformando os botões em símbolos, fazendo com que estes não sejam clicáveis, mantendo o utilizador no local onde pretende estar.
Com estes erros aprendemos que não devemos dar imensa liberdade ao utilizador pois poderá levar a que este se perca entre funcionalidades. Como o público alvo ainda é muito novo ao nível do à vontade com a aplicação, fizemos com que fosse fácil navegar.
+
Com estes erros aprendemos que não devemos dar imensa liberdade ao utilizador pois poderá levar a que este se perca entre funcionalidades.  
  
 
Programação de barras e menus
 
Programação de barras e menus
Linha 252: Linha 246:
 
'''a.Reflexão Critica'''
 
'''a.Reflexão Critica'''
  
Após a finalização do projeto, consideramos importante efetuar uma análise critica da aplicação que criamos, e posto isto consideramos que valeu a pena todas as horas passadas de volta deste projeto nos últimos tempos.
+
Após a finalização do projeto, procedeu-se à análise critica da aplicação que criámos.
 
+
Assim podemos concluir que apesar de terem surgido algumas dificuldades ao longo do desenvolvimento da criação da aplicação, especialmente com a programação dos jogos, foi possível solucionar esses problemas, e obter um resultado que va de encontro ao que inicialmente se estipulou como o pretendido.
Assim podemos concluir que apesar de terem surgido algumas dificuldades ao longo do desenvolvimento da criação da aplicação, especialmente com a programação dos jogos, conseguimos solucionar esses problemas, e obter um resultado que nos agrada.
+
Tendo em conta que este foi o nosso primeiro projeto de animação multimédia a este nível, conseguimos obter um produto final que vai de acordo com as expectativas que criamos.
+
 
+
A entre-ajuda e o espirito de companheirismo foi algo extremamente essencial no nosso trabalho, pois assim conseguimos esclarecer dúvidas uns aos outros, auxiliar-nos, e obter um resultado que cumpre os parâmetros por nós estabele
+
cidos.
+
+
Consideramos que a nossa aplicação se podia enquadrar perfeitamente no meio para a qual foi desenvolvida, e gostariamos de a ver a ter sucesso.
+
  
 +
A entre-ajuda e o espirito de companheirismo foiessencial no nosso trabalho, pois assim se esclareceram dúvidas, se teceram críticas e se contornaram dificuldades.
  
 +
Crêmos que apesar das divirgências incontornáveis de qualquer grupo de trabalho, funcionámos de forma coesa e equilibrada o que facilitou o desenrolar do projeto.
  
 
'''b.Sugestões para o aperfeiçõamento e/ou desenvolvimento do futuro projeto'''
 
'''b.Sugestões para o aperfeiçõamento e/ou desenvolvimento do futuro projeto'''
  
 +
- O aperfeiçoamento que julgamos necessário prende-se com jogo drag'and'drop que se mostra limitado em alguns aspectos devido ao nosso conhecimento algo escasso para a sua concretização.
  
 
+
- No que toca ao resto da aplicação, efetuámos diversas alterações ao longo do seu desenvolvimento, nomeadamente na substituição de diversos motion tweens por movie clips para a criar a sensação de movimento e, também, de guide-layers para a definição do percurso que os seres vivos iriam tomar.
- O aperfeiçoamneto que nos achamos que seria pertinente efetuar desde ja, seria o jogo drag'an'drop tendo em conta que tivemos de realizar pesquisas para conseguirmos realizar o jogo, concerteza que haveria aperfeiçoamentos que poderiam ser efetuados.
+
 
+
- Em elação a todo o resto da aplicação, efetuamos diversas alteraçõesao longo do seu desenvolvimento, pois achamos pertinente, algumas das alterações foram, ao invés de utilizarmos motion twwen para criar a sensação de movimento, utilizamos movie clips para, e guides para definir o percurso que os seres vivos iriam tomar.
+
  
 
== Diário de Bordo ==
 
== Diário de Bordo ==

Revisão das 03h30min de 13 de Janeiro de 2012

Índice

O grupo


Untitled-7.png
Logotipo.jpg




O Projecto


Neste projeto de desenvolvimento de uma aplicação multimédia interactiva iremos conjugar as temáticas estudadas em Labmm1 e ID-E, direccionando-as para o tema "Oceanário". Pretendemos criar uma aplicação tipo "Quiosque Multimédia" direccionado para crianças. Desta forma, os usuários poderão obter informações acerca da espécie peixe palhaço. Para isto, contam também com a ajuda da personagem Mergulhador Matias, desenvolvida a pensar numa forma de ajudar as crianças na navegação pelos conteúdos.


Alteração de personagem principal



Após uma troca de ideias com o professor de Imagem Digital Estática, chegamos a conclusão que seria benefico para o grupo não utilizarmos uma personagem que ja existia previamente, optando então por não utilizar o "Nemo" como personagem principal, passando a ser o cavalo marinho "Guga" a personagem de maior enfoque neste quiosque - interactivo.

Relatório Final

1.Apresentação Projeto

No âmbito das unidades curriculares de Laboratório Multimédia 1 e Imagem Digital Estática, realizou-se um projeto, onde o nosso tema de enfoque é o Oceanário, e através do qual desenvolvemos um Quiosque Multimédia. Esta aplicação é destinada a crianças de uma faixa étaria dos 3 aos 8 anos, como tal todo o nosso projeto foi pensado e estruturado tendo em conta as necessidades, as limitações e os interesses deste mesmo público.

Desenvolveu-se uma aplicação baseada na cor e na sobriedade acompanhada de sons e narrações.

2.Análise e Planeamento

A aplicação foi desenvolvida enquanto quiosque interativo a ser integrado no 'Oceanário' de forma a permitir uma exploração interativa aos visitantes, sendo o público infantil de faixa etária compreendida entre os 3 e os 8 anos de idade o nosso público alvo. Esta aplicação tem como objectivo permitir aos utilizadores adquirirem conhecimentos sobre os seres que habitam o fundo do mar, focando-se nas águas temperadas do pacífico.

Aqui apresentamos alguns dos sites e aplicações que nos serviram de base para a elaboração e estruturação do quiosque de multimédia:

Link’s :

Oceanários


- http://www.partteams.com/store/index_2010_v2.php

- http://http://www.visitsealife.com/


Quiosques Multimédia


- http://www.youtube.com/watch?v=a_ZDYCrlIhk

- http://www.youtube.com/watch?v=EBzt4s4GfzE&feature=related


Jogo Quiz

- http://stackoverflow.com/questions/1748711/flash-as2-quiz-with- individual-points-for-each-answer

- http://www.actionscript.org/forums/showthread.php3?t=200118

- http://www.actionscript.org/forums/showthread.php3?t=262691

- http://www.youtube.com/watch?v=FTo5ol78jmg

- http://www.youtube.com/watch?v=0v8PIawLCNc

- http://www.youtube.com/watch?v=fSDSa7oCdhs

- http://www.youtube.com/watch?v=nOJDIjsRyZc


Jogo Drag’n’Drop

- http://www.swinburne.edu.au/design/tutorials/P-flash/T-How-to-drag-and-drop-in-Flash/ID-37/

- http://www.flashvalley.com/fv_tutorials/advanced_drag_and_drop_in_Flash/

- http://fcontheweb.com/articles/drag_and_drop/

- http://www.actionscript.org/forums/showthread.php3?t=262489

- http://www.ozzu.com/flash-forum/as2-flash-game-drag-and-drop-t106752.html

- http://www.youtube.com/watch?v=ALqGYMsRWxw

- http://www.youtube.com/watch?v=n1d49YWNzvM

- http://www.youtube.com/watch?v=roGubzaSl8s

Jogos

Jogo.PNGJogo 1.PNG

Desta forma e tendo em conta a investigação por nós efetuada, foram escolhidas cores que despertassem a atenção do público alvo, tal como uma linguagem adequada à faixa etária que pretendemos atingir. A criação de figuras dinâmicas e expressivas foi o nosso principal objetivo, de forma a despertar a curiosidade e o interesse visual das crianças, conduzindo-as à interacção. Para isto, foi criada uma personagem de seu nome Matias que interpreta o papel de guia que acompanha o visitante na viagem ao 'Oceanário'. A personagem fornece informações sobre os seres vivos presentes nos diferentes habitats criados nos aquários do oceanário. Apesar de todos os animais presentes no stage serem selecionáveis, apenas o cavalo-marinho (Gugas) é susceptível de ser explorado e dissecado. Já todos os outros seres vivos apresentarão apenas a sua imagem quando selecionados. Esta decisão foi tomada em conjunto com o professor Mário Vairinhos responsável pela disciplina de Imagem Digital Estática, que sugeriu que se explorasse apenas um ser vivo.


Os objectivos específicos do projecto são:

Estudo para a estrutura da aplicação

Estes esquemas são uma planificação da nossa aplicação, de forma a nos organizarmos, e elaborarmos uma aplicação funcional. Assim utilizamos os três paradigmas de interação que foram estudados, o index nos cenários principal e secundário, na medida em que existe informação indexada. Já no Quiz podemos considerar que existe tutorial pois quando nos encontramos na primeira questão não conseguimos avançar para a última sem ter que passar obrigatoriamente por todas as outras questões que se encontram entre a primeira e a última. No que diz respeito ao paradigma de interação ambiente também se encontra presente na medida em que existem botões e ícones embebidos/esondidos na interface.


Generico.png Esquema1.jpg Matias.PNGEsquema3.jpgEsquema4.jpg



3.Desenho Funcional

a. Requisitos Funcionais:

Neste ponto tentámos ao máximo ter em conta o público alvo e o objetivo para o qual a aplicação foi concebida, tentando torná-la o mais funcional e prática possivel. O primeiro contacto com a aplicação é feito através de um genérico que procura despertar o interesse dos mais novos, aparecendo assim dois pequenos peixes que trazem com eles as boas vindas ao oceanário. Com estes peixes procuramos utilizar cores alegres, que despertassem o interesse por parte dos mais novos. Assim, neste cenário não temos disponivel nenhum botão específico. Porém, é importante referir que todo o cenário é selecionável, possibilitando assim o avanço para o cenário seguinte.


Em seguida, surge uma breve apresentação do guia desta pequena viagem pelo Oceanário, que estará presente em toda a aplicação, guiando assim as crianças, auxiliando-as assim com narrações das informações/indicações que vão surgindo escritas, pois todos os textos estão acompanhados pela sua voz. Neste cenário existe apenas um botão de "saltar intro" representado por uma seta.

Já no terceiro cenário, e cena de repouso existe uma barra oculta. Esta barra contém diversas palavras selecionáveis, que nos direcionam para páginas associadas aos seres vivos presentes no stage. Contudo estão ainda presentes no ecrã no canto superior direito três botões (de cima para baixo): o botão de "sair" representado com um botão de desligar e que permite sair da aplicação; o botão de "ligar/desligar" o som, representado por um altifalante; e o botão de "ajuda" representado por um ponto de interrogação.

No ultimo cenário, continuamos a ter "presente" a barra oculta, que funciona como no cenário anterior, aqui conforme as escolhas tomadas no cenário antecedente teremos no caso do cavalo marinho, seis botões selecionaveis, sendo eles "Alimentação", "Família", "Anatomia", "Habitat", "Jogos", e "Videos". Temos ainda presentes no lado superior direito o botão de "sair", o botão de "ligar/desligar" o som, o botão de "voltar" ao cenário anterior e ainda o botão de "ajuda".


Ligações.PNG


b.Estrutura Arborescente

Árvore.jpg


Apartir do primeiro cenário após a introdução temos a possibilidade de selecionar qual o ser vivo que pretendemos explorar, depois de aberta a página do animal selecionada, podemos regressar ao cenário de repouso. Se escolhermos o cavalo marinho podemos então selecionar os botões ja especificados, ou então regressar ao cenário de repouso.


c.Desenho de interação e usabilidade

Antes de procedermos à elaboração do projeto passámos por diversas etapas, entre as quais a discussão e analise das melhores soluções gráficas, estéticas, e funcionais para esta aplicação. Assim, após a escolha de um tema foi-nos possível perceber os parâmetros a ter em conta. Fatores como o público alvo, problemas que podem existir pelo facto de esta aplicação ser destinada a crianças, e ainda a facilidade de interação, e interpretação dos elementos constituintes da aplicação.

Numa fase inicial do desenho funcional, revelou-se pertinente a existência de botões, janelas, caixas de diálogo, e menus, de forma a facilitar a interação, e a navegação ao longo de toda a aplicação. O facto de o nosso publico alvo serem crianças, sugeriu-nos que utilizassemos linguagem acessível para a parte do público capaz de ler e implementou-se, ainda, audio para os que não são ainda capazes de o fazer. Procurámos assim criar um ambiente rico em cores, utilizando ilustrações expressivas, que despertassem nas crianças o desejo de lhes 'tocar' e de interagir. Para este efeito tentámos pereceber quais seriam as necessidades não só das crianças mas também dos acompanhantes destas na visita ao 'Oceanário', disponobilizando assim botões como o "saltar intro" que possibilita isso mesmo, e que se destina a esses mesmos acompanhantes que, hipoteticamente, poderiam já ter utilizado a aplicação anteriormente não tendo então a necessidade de ver a introdução novamente. Outro botão criado foi ainda o de "ajuda" pronto a esclarecer dúvidas que podem surgir. Procuramos ainda criar uma dinâmica no cenário, através de elementos como uma moreia que surge de entre as rochas, e uma concha que se abre com auxílio de um 'rollover'.

Posto isto e tendo em conta os factores psicológicos, emocionais e cognitivos do público alvo em questão e os princípios básicos do desenho de interacção e interfaces para a promoção e avaliação da usabilidade, foi possível o desenvolvimento de adequadas concepções, desenhos, implementações e avaliações da estrutura, os percursos, as formas e os meios de navegação ou de interacção.


4.Desenho Técnico

Nesta fase, foi utilizado o Adobe Illustrator CS3, CS4 e CS5, como ferramenta para a elaboração de todos os elementos visuais, todos os cenários, personagens, animais, algas e rochas foram illustrados pelo grupo. Recorremos ainda ao tratamento de fotografias através do Adobe Photoshop CS3, CS4 e CS5, fotografias estas que estão integradas na aplicação. Usamos ainda o Audacity 2.0 para tratamento audio, e o Adobe Premiere para tratamento de vídeo.


5.Produção do Projeto

Codigo botoes flash.jpg

Codigo flash dragndrop.jpg

Codigo quiz.jpg


a. Estrutura e meios de navegação/Interacção

A navegação e interação na nossa aplicação é realizada através botões, caixas de diálogo,janelas, e icones selecionaveis, desta forma o utilizador pode selecionar o percurso que quer realizar.

b.Integração e controlo de som

Para a integração e controlo de som utilizamos essencialmente o Audacity 2.0, a nossa aplicação incopora som de fundo, e essencialmente falas, que tiveram de ter o devido tratamento para que ficassem com a melhor qualidade possivel.

c.Integração de vídeo

Para a integração de vídeo utilizamos o Adobe Premiere CS5, editando assim o único vídeo presente em toda a aplicação, por forma a ter o audio que pretendiamos, e ainda o nome do nosso grupo, o ficheiro foi exportado em .flv, e assim importado para o flash sem problemas.


Premiere.jpg


e. Soluções técnicas adoptadas para a resolução de problemas.


- A nível de organização do projeto tivemos algumas dificuldades na organização da library devido à grande quantidade de pastas existentes;

- O que suscitou mais dificuldade foram os jogos, na medida em que não temos formação suficiente em AS2 para os desenvolvermos da forma que seria desejada. Contudo conseguimos contornar este problema através da consulta de informação à disposição em fórums, páginas web genéricas ou no youtube. O principal objectivo deste jogo 'pergunta-resposta' com contabilização de pontos é de carácter formativo, avaliando os conhecimentos adquiridos ao longo da exploração da aplicação. As perguntas debruçam-se um pouco por todos as áreas abordadas acerca do Cavalo Marinho. Ao utilizador é dirigida uma pergunta e 3 opções de resposta (com apenas uma opção correcta). Por cada resposta correcta, o utilizador ganha 1 ponto. A pontuação máxima será de 4 pontos (uma vez que existem 4 perguntas ao longo do Quiz). Consoante a pontuação é atribuído no final (a juntar à pontuação um comentário sobre a prestação do utilizador. Para o desenvolvimento deste jogo em particular, e no que diz respeito ao emprego de código AS2 foi necessário declarar uma variável que permitisse contabilizar os pontos; utilizar «goto's» para que o utilizador progrida dentro do Quiz e ainda a associação de uma segunda variável ao texto para que as mensagens surjam de acordo com os pontos adquiridos (bem como a utilização de if's para que se associe a uma determinada pontuação, uma mensagem específica).

- Após uma pesquisa a fundo conseguimos reunir, compilar e compreender o código necessário para desenvolver um jogo do género 'drag'n'drop'. O jogo foi desenvolvido com o objectivo de consolidar os conhecimentos transmitidos acerca da alimentação dos cavalos marinhos. É sugerido aos utilizadores que selecionem dentro dum conjunto de opções, os alimentos que fazem parte do regime alimentar dos cavalos marinhos. Existirão 3 opções incorrectas e 2 correctas. Ao arrastar as 2 opções correctas (seguidas!) o utilizador vence o jogo. Caso arraste (em qualquer altura) uma das opções incorrectas terá de recomeçar o jogo. No que concerne ao código (as2) foi necessário recorrer a informação disponível na web visto que o que foi lecionado durante as aulas de Laboratório Multimédia I não abordavam o necessário para o desenvolvimento do jogo em questão. Foram aplicados linhas de código relacionadas com 'rollovers' (para aumentas a escala dos objectos aquando da sua selecção); if's (para: 'caso' o utilizador larga o objecto aqui surtirá o seguinte efeito...) e else's (ao 'dropar' o objecto em outro local que não o permitido acontecerá o seguinte; neste caso regressará ao local inical de selecção). Foram definidas ainda variáveis para que seja possível fazer a contabilização dos pontos (que se relaciona directamente com o local onde o utilizador larga o objecto).


- O inico da aplicação é apresentado por um modo de repouso desenvolvido em movieclip que apresenta através uma frase de boas vindas (“Bem-vindos ao Oceanário”) que é introduzida no ecrã pela entrada de dois peixes, ambos os seus movimentos foram criados através de guide-layers que determinam o percurso das mesmas no ecrã até ao ponto final onde param e permanecem no mesmo sítio, permitindo uma melhor leitura ao utilizador. Este movimento de entrada da nota de boas-vindas irá repetir-se até que o utilizador interaja com a aplicação. Para a personagem Matias foram criados Motion Tweens que permitiram aproximar a sua cara no momento da sua apresentação e a criação do movimento dos lábios correspondentes aos sons que reproduz na explicação das informações. Para além de explicar as diferentes informações do cavalo-marinho, Matias, ajuda o visitante a explorar a plataforma de multimédia, como por exemplo, a navegar nas diferentes opções disponíveis para o utilizador. O habitat correspondente ao cenário 2, onde estão presentes as enumeras espécies, que corresponde a um ambiente de um aquário do oceanário. Este ambiente foi preenchido e animado por diferentes movimentos associados aos elementos presentes no habitat. Como por exemplo, o movimento de deslocamento dos peixes, produzido através de motiontweens, o movimento das barbatanas, criado nos respectivos movieclips associados ao peixe em questão e o rollover associado à pérola e à moreia a sair da gruta.


- Para uma mais fácil e cómoda navegação entre as partes do nosso movie, pensámos em criar uma barra que estaria oculta e que poderíamos utilizada a todo o momento com um simples rollOver num puxador que estaria disposto no topo do stage. Como era uma tarefa que ainda não dominávamos, procurámos informação sobre esse tema em diversas fontes, no caso Youtube e Google. Também consultámos o professor Hélder Caixinha para que nos orientasse. O professor indicou-nos dois sites com diferentes formas de fazer essa barra oculta. Depois de avaliadas as formas de execução e experimentadas, concluiu-se que poderia ser feito de uma forma mais fácil sem termos de recorrer a acções de script que ainda não dominávamos. Foi então que pensámos em realizar essa barra através das funcionalidades do Adobe Flash: buttons e movieclips. Efectuámos diversas operações de testes de actividade, mas foi mesmo com recurso a movieclips que surgiu a nossa barra oculta. Através do rollOver num botão, a que chamámos 'Puxador', ativávamos a funcionalidade de fazer descer uma barra com a integração de motion tweens. Quando aberta, esta barra teria à disponibilidade do utilizador onze diferentes botões, cada um corresponderia a um dos seres vivos que escolhemos para a aplicação. Foi então que começaram a surgir os primeiros erros nesta actividade, entre eles os rollOvers ou os rollOuts que não estavam sincronizados ou então a existência indevida dos mesmos. Um exemplo disto, era fazermos rollOut de um botão, a barra deveria fechar se o ponteiro do rato, saísse de cima da barra. Isto por vezes não acontecia e portanto, sentimos a necessidade de criar como que um botão invisível que obrigasse a barra a fechar quando o utilizador saísse das opções da mesma e se decidisse por navegar de outra forma. Com o primeiro problema resolvido, surgem outros como é recorrente em qualquer trabalho. Neste momento, tínhamos o movimento da barra bem construído e foi então que detectámos que os botões quando seleccionados deveriam perder a sua funcionalidade para não causar complicações ao nível da navegação. Foi então que decidimos criar uma barra para cada uma das espécies transformando os botões em símbolos, fazendo com que estes não sejam clicáveis, mantendo o utilizador no local onde pretende estar. Com estes erros aprendemos que não devemos dar imensa liberdade ao utilizador pois poderá levar a que este se perca entre funcionalidades.

Programação de barras e menus

- http://www.youtube.com/watch?v=GtTV-yhTFDg

- http://www.developingwebs.net/flash/invisiblebuttons.php

- http://www.free-webmaster-resource.com/tutorials/flash/basics/tutorial003/index.php?tutorial_id=463&tPage=1



6.Conclusões



a.Reflexão Critica

Após a finalização do projeto, procedeu-se à análise critica da aplicação que criámos. Assim podemos concluir que apesar de terem surgido algumas dificuldades ao longo do desenvolvimento da criação da aplicação, especialmente com a programação dos jogos, foi possível solucionar esses problemas, e obter um resultado que va de encontro ao que inicialmente se estipulou como o pretendido.

A entre-ajuda e o espirito de companheirismo foiessencial no nosso trabalho, pois assim se esclareceram dúvidas, se teceram críticas e se contornaram dificuldades.

Crêmos que apesar das divirgências incontornáveis de qualquer grupo de trabalho, funcionámos de forma coesa e equilibrada o que facilitou o desenrolar do projeto.

b.Sugestões para o aperfeiçõamento e/ou desenvolvimento do futuro projeto

- O aperfeiçoamento que julgamos necessário prende-se com jogo drag'and'drop que se mostra limitado em alguns aspectos devido ao nosso conhecimento algo escasso para a sua concretização.

- No que toca ao resto da aplicação, efetuámos diversas alterações ao longo do seu desenvolvimento, nomeadamente na substituição de diversos motion tweens por movie clips para a criar a sensação de movimento e, também, de guide-layers para a definição do percurso que os seres vivos iriam tomar.

Diário de Bordo

13Janeiro O grupo terminou o projecto já o dia ia longo. Organizou-se a biblioteca do ficheiro .fla; criaram-se os créditos; fizeram-se testes à aplicação em si (alterando-se ainda alguns erros que presistiam); gravou-se o ficheiro .fla em cd e criou-se a capa (procedendo-se, também, à sua impressão).

12Janeiro Foram terminados os 'últimos retoques' ao ficheiro .fla final: correcção de alguns pequenos bugs ocasionais; acorrecção de coordenadas; correcção de guide layers e de alguma simperfeições do 'ambiente de repouso' da aplicação e foram ainda gravadas novamente (desta feita em estúdio) algumas das vozes que narram os textos presentes na aplicaçã.

11Janeiro

Finalizou-se o jogo do Drag n' Drop e foi introduzido no projecto final. Editou-se também , o vídeo do cavalo-marinho e o seu habitat, para ser também posteriormente introduzido. Continuou-se a progredir de uma forma positiva a elaboração do projecto.

10Janeiro

Elaborámos as gravações dos textos da aplicação. Mais concretamente dos textos de boas vindas, das informações referentes ao Guga e dos jogos. Deu-se , posteriormente continuidade ao desenvolvimento da programação do quiosque multimédia. Continuou-se com o desenvolvimento do jogo para posteriormente ser introduzido.Terminou-se o Quiz, introduzindo o audio que irá acompanhar o utilizador.

09Janeiro

Desenvolvimento da animação, nomeadamente dos componentes da personagem principal do quiosque multimédia. Desta forma as diferentes informações sobre o Guga tornaram-se operacionais e prontas a serem navegadas. Iniciou-se a distribuição dos textos para mais tarde serem gravados em estúdio. Começou-se a programação do jogo Drag n' Drop.

06Janeiro

Iniciou-se a estrutura do relatório final bem como a selecção/compilação da webliografia. Foram também ainda registados avanços ao nível da programação dos diferentes separadores e de alguns movie_clips específicos. Iniciou-se a pesquisa para o jogo Drag n' Drop para se introduzir no quiosque.

04Janeiro

O grupo juntou-se no Departamento de Comunicação e Arte onde, desta feita, presencialmente, se reorganizaram tarefas e se resolveram pequenos obstáculos que foram surgindo nas tarefas individuais de cada um. O dia revelou-se proveitoso visto que se discutiu e criticou construtivamente o trabalho do grupo.

02Janeiro

Mais uma vez, virtualmente, o grupo reuniu-se para reunir os avanços individuais de cada. Foi feito um ponto de situação bem como uma nova atribuição de tarefas. Entrámos neste novo ano com o projecto encaminhado; os avanços são notórios e o grupo revela-se coeso. Já existem duas versões betas de dois jogos ('Guga's drag'n'drop' e 'quiz') e a animação dos menus principais. Fomos ainda forçados a elaborar novas vectorizações devido a ligeiras reformulações feitas a um dos jogos.

26Dezembro

Os elementos do grupo reuniram-se virtualmente para a produção da animação do genérico, do aquário dos peixes e do ambiente de repouso, dando-se inicio ao desenvolvimento do fla relativamente às animações. Iniciou-se a programação do Quiz sobre os cavalos marinhos.

23Dezembro

A programação tem sofrido evoluções: um versão alfa de um jogo tipo 'drag'n'drop' e uma versão beta de um quiz.

22Dezembro

Agora que visualmente o projecto se encontra encaminhado, o grupo avança na estruturação do código que definirá a interactividade da aplicação.

20Dezembro

Embora à distância, o grupo organizou-se de forma a reformular os pontos discutidos com o professor, adaptando o trabalho anteriormente realizado aos comentários feitos na apresentação visual do projecto no passado dia 15 de Dezembro.

15Dezembro

O grupo reuniu-se com o intuito de dar continuidade e terminar a criação dos ambientes da aplicação e respectivos elementos constituintes, dando maior importância aos botões de navegação. Desta forma, foi possível planificar a apresentação para IDE: dos ficheiros de produção, cenários e conteúdos implementados em Illustrator ou Photoshop; organização da apresentação oral, desenvolvimento do ppt.

13Dezembro

A fim de organizar a apresentação para IDE, para o próximo dia 15, o grupo reuniu-se e discutiu assuntos relativos à forma de apresentação. Foram também estruturados e decididos alguns pormenores importantes para a aplicação, como a forma dos menus, os botões e a organização da informação pelo stage no decorrer na animação.

12Dezembro

Durante a aula de Laboratório Multimédia, o grupo desenvolveu a arborescência da aplicação, bem como aspectos relativos ao seu layout. Para além disto, foi ainda dado seguimento à vectorização de elementos para posteriormente serem inseridos na aplicação. Nomeadamente de figuras relativas ao jogo interactivo da aplicação.

09Dezembro

O grupo reuniu-se para a avançar na ilustração/vectorização dos elementos visuais que futuramente serão animados. O balanço a fazer é positivo uma vez que foi possível ilustrar por completo quase todas as 'personagens' bem como o estudo (e a respectiva ilustração) dos cenários. Foram ainda discutidas as grelhas que irão orientar o layout da aplicação.

05Dezembro

No decorrer da aula de IDE, discutimos com o professor da unidade curricular a nossa ideia principal do projeto. Em discussão, decidimos mudar um pouco a vertente do nosso projeto, baseando-se assim apenas num único peixe para que nos possamos focar em mais opções interativas.

02Dezembro

O grupo juntou-se para decidir o subtema do projeto. Em conversa, decidimos fazer um “quiosque virtual” direcionado para as crianças. Assim, concordamos, realizar um mostruário que continha diversos elementos interativos em forma de peixes que permitiria assim, saber informações á cerca de cada espécie. Tivemos ainda a ideia de acrescentar um “guia”. Será um mergulhador, chamado Matias, que vai guiar e acompanhar-nos nesta visita virtual.

30Novembro

Neste dia, o grupo juntou-se para discutir o tema a tratar no projeto final. Em conjunto decidimos elaborar o projeto sobre o “Oceanário” por ser um tema que agrada a todos os elementos e por ser apelativo á facha etária com que queremos trabalhar

Divisão de tarefas/Questões gráficas/visuais

Ana Rita

- Organização e estruturação do projecto.

- Vectorização

- Pequisa Visual.

- Desenvolvimento do relatório.

- Animação.


Joana Pais


- Organização e estruturação do projecto.

- Vectorização.

- Pequisa Visual.

- Animação.

- Escolha sonora, e tratamento de vídeo.


Maria Beatriz

- Organização e estruturação do projecto.

- Vectorização de algumas personagens.

- Pequisa Visual.

- Programação e animação.

- Desenvolvimento do relatório.


Rafael Guedes

- Elaboração do relatório.

- Pequisa Visual.

- Vectorização de algumas personagens.

- Programação dos jogos.

- Desenvolvimento do relatório.


Simão Cruz

- Estruturação do layout.

- Pesquisa Visual.

- Vectorização de algumas imagens.

- Programação geral da aplicação e implementação dos jogos na aplicação.

Nota:A estrutura do relatório foi discutida por todos, dando cada um a sua opinião, contribuindo todos para a sua concretização.


Evolução Visual do Projeto

Fundo2.png Movimento algas.png Coral.PNG Capturar.PNG


Janela e Menu interactivo

Balao.PNG Esquema menu.jpg

Ferramentas pessoais
Espaços nominais
Variantes
Acções
Navegação
Ferramentas