ProjectoFinal CGLM

From LABMM1_IDE

Latest revision as of 00:16, 14 January 2011

Constituição do grupo

• Gabriela Barreira 50746
• Mariana Oliveira 46498
• Luís Ferreira 60382
• Cayna Amadeu 51873

Sobre o Projecto

Vamos desenvolver uma aplicação online de promoção da sério televisiva, "Modern Family".

Foi atribuído o nome "Modern Family WebSite" ao nosso projecto.

O registo de imagem que usaremos será uma mistura de vectorial e bitmap. A escolha pelo vectorial deveu-se principalmente a problemas como direitos de autor das imagens ou a dificuldade de encontrá-las.

A aplicação conjugará várias cores, sendo que as principais são as que se seguem.

Identidade Visual Modern Family Website

O tipo de letra a usar será Helvetica Neue estilo Regular para os textos longos ou etiquetas simples, e estilo Condensed Bold para títulos.

Exemplo de um título, usando Helvetica Neue Condensed Bold

Exemplo de um texto simples, neste caso uma etiqueta, usando Helvetica Neue Regular.

O modo de interacção com a aplicação consistirá num paradigma ambiente, onde botões estão embebidos no cenário e o utilizador pode interagir com alguns elementos.

Diário de bordo

25 de Novembro

Formação do grupo e escolha do tema do projecto, através da consulta de outros websites como meio de inspiração.

29 de Novembro

O grupo juntou-se para discutir ideias, foi elaborado um esboço do que, em princípio, será a nossa aplicação. Definição de objectivos para cumprir até ao final da semana.

Esboço da aplicação.

2 de Dezembro

No dia de hoje, fizemos recolha de imagens das personagens que vão ser usadas na aplicação. Os cenários que servirão de base para a ilustração vectorial são os que se seguem:

Esta é a imagem a ser usada como base para a introdução da aplicação. A ideia é aparecer inicialmente a casa, e depois alterar a perspectiva para dentro dela.

Imagem original da sala.

No Photoshop, através da ferramenta Crop, activámos a opção perspective, de forma a obter uma imagem com outra perspectiva da imagem original. Isto facilita a ilustração vectorial e a interacção do utilizador com a aplicação.

3 de Dezembro

Elabaroção de uma base da sala onde acontecerão a maior parte das interacções utilizador-aplicação.

Através da imagem original que tínhamos conseguido no dia anterior, foram criadas as principais linhas que definem a sala, e foram feitas algumas alterações.

7 de Dezembro

Elaboração da arborescência da aplicação.

File:Arborescência modernf.pdf

9 de Dezembro

Continuação da ilustração e preenchimento do cenário interior da casa. Os padrões, encontrados no google images, foram aplicados no Illustrator. De seguida, cada um dos objectos foi isoladamente tratado no Photoshop, com a atribuição da textura canvas (para dar um aspecto de cartão à imagem) e alteração das tonalidades. Os objectos foram também importados para um ficheiro do Flash, e foram feitas as primeiras animações. O resultado está esquematizado nas imagens que se seguem.

Ecrã

Início da animação. Sala sem quaisquer objectos.

Os objectos começam a surgir de todas as direcções, arrastados ou caídos de cima. As setas a vermelho representam alguns desses movimentos.

Aparência final da animação inicial. Aqui, já os objectos necessários se encontram sob a forma de botões.

Este será o ecrã principal, onde estarão embutidas todas as opções da aplicação.

13 de Dezembro

O grupo fez a apresentação final do projecto na disciplina de Imagem Digital Estática, em que foram apresentados aspectos como o tema visual, requisitos funcionais, arborescência da aplicação e os principais elementos do guião da aplicação como os ecrãs tipo e a identidade visual.

Este será o momento inicial da aplicação. Será criado um botão que levará o utilizador ao ecrã_principal, onde decorrerão a maior parte das interacções. A vectorização do cenário encontra-se parcialmente concluída, faltando ainda a inclusão de alguns elementos estéticos.

14 de Dezembro

Mudança das cores do ecrã principal.

A barra beje será o local onde estarão dispostos os botões de controlo de som e o logo da série.

15 de Dezembro O grupo tomou a decisão de iniciar a aplicação toda desde o princípio. O tamanho insuficiente do stage, a textura aplicada no cenário foram umas das principais razões que nos levaram começar tudo do início. Então assim foi. Foram retiradas texturas e padrões ao cenário interior e as imagens foram importadas para o flash com um stage de maiores dimensões (930x520) Este é o aspecto actual do cenário interior da casa.

Neste mesmo dia, as animações iniciais foram também feitas no flash.

16 de Dezembro Elaboração e configuração dos botões.

Estes objectos estarão dispostos em cima da mesa de centro. Os restantes botões são a televisão e a moldura na parede. Estes foram feitos aquando o cenário.

Ainda no mesmo dia, foram elaborados e configurados os botões de controlo do som. Foi com este vídeo disponível no Youtube que aprendemos a usar os códigos ationscript necessários para o controlo do volume.

Estes botões vão ser dispostos no canto inferior direito do stage, sobre uma barra com transparência que será colocada na zona inferior.

29 de Dezembro

A aplicação já se encontra quase concluída. O grupo reuniu-se para dar início ao relatório.

Ecrã concluído

Até 14 de Janeiro

A aplicação foi melhorada. Algumas animações foram adicionadas ao cenário e a qualidade da imagem e som ajustada.

O relatório foi completado e encontra-se em PDF no seguinte link:

Relatório do Projecto

O resultado final do ficheiro swf pode ser visualizado neste link: Modern Family Website