Utilizador:TimeView
(→Relatório final Laboratório Multimédia) |
(→Relatório final Laboratório Multimédia) |
||
| (6 edições intermédias de um utilizador não apresentadas) | |||
| Linha 184: | Linha 184: | ||
== '''Diário de Bordo''' == | == '''Diário de Bordo''' == | ||
| − | |||
| − | |||
'''6 de Dezembro''' | '''6 de Dezembro''' | ||
| Linha 344: | Linha 342: | ||
<br> | <br> | ||
- Escrita do Relatório Final. | - Escrita do Relatório Final. | ||
| + | |||
| + | ---- | ||
| + | '''14 de Janeiro''' | ||
| + | <br> | ||
| + | -Correção de erros na animação | ||
| + | <br> | ||
| + | -Relatório Final | ||
| + | <br> | ||
| + | ---- | ||
| + | '''15 de Janeiro''' | ||
| + | <br> | ||
| + | -Correção de erros na animação | ||
<br> | <br> | ||
| + | -Conclusão do trabalho em Flash | ||
<br> | <br> | ||
| + | -Finalização do Relatório | ||
== '''Divisão de Tarefas''' == | == '''Divisão de Tarefas''' == | ||
| Linha 573: | Linha 585: | ||
<br> | <br> | ||
<br> | <br> | ||
| − | Década 90 | + | '''Década 90''' |
<br> | <br> | ||
'''1990''' | '''1990''' | ||
| Linha 678: | Linha 690: | ||
<br> | <br> | ||
No que toca às soluções técnicas utilizadas, surgiram essencialmente problemas ao nível da fluidez da aplicação. Isto é, pretendia-se que a aplicação e, nomeadamente, a visão da linha cronológica geral (cujas décadas são apresentadas em síntese), conferisse ao utilizador a sensação de que podia rodar a aplicação, explorando em linhas gerais cada década exposta. No entanto e após alguma pesquisa, o grupo concluiu que essa fluidez e sensação de seguimento da barra só seria possível através de recurso a action script 3.0. Posto isto e tendo em conta que a aplicação teria de ser desenvolvida em action script 2.0, recorremos à execução de movie clips capazes de proporcionar ao utilizador a sensação de que a barra realmente se deslocava, utilizando dois botões: “avançar” e “voltar”. Estes mesmos botões, comandados para que ao clique enviem a cabeça de leitura para o movie clip respetivo, foram pensados de forma a se tornarem funcionais para o utilizador e, graficamente, coerentes com a aplicação. | No que toca às soluções técnicas utilizadas, surgiram essencialmente problemas ao nível da fluidez da aplicação. Isto é, pretendia-se que a aplicação e, nomeadamente, a visão da linha cronológica geral (cujas décadas são apresentadas em síntese), conferisse ao utilizador a sensação de que podia rodar a aplicação, explorando em linhas gerais cada década exposta. No entanto e após alguma pesquisa, o grupo concluiu que essa fluidez e sensação de seguimento da barra só seria possível através de recurso a action script 3.0. Posto isto e tendo em conta que a aplicação teria de ser desenvolvida em action script 2.0, recorremos à execução de movie clips capazes de proporcionar ao utilizador a sensação de que a barra realmente se deslocava, utilizando dois botões: “avançar” e “voltar”. Estes mesmos botões, comandados para que ao clique enviem a cabeça de leitura para o movie clip respetivo, foram pensados de forma a se tornarem funcionais para o utilizador e, graficamente, coerentes com a aplicação. | ||
| + | <br> | ||
| + | <br> | ||
| + | '''6. Conclusões''' | ||
| + | <br> | ||
| + | '''6.1. Reflexão crítica''' | ||
| + | <br> | ||
| + | Após a conclusão da TimeView foi-nos possível perceber o quão trabalhoso é desenvolver uma aplicação de raiz. | ||
| + | Desde a criação de um Design coerente à execução de uma aplicação cuja interatividade e animação pudessem ser aplicadas, a criação da TimeView envolveu grande dedicação, pesquisa, tentativa e trabalho. | ||
| + | No entanto e tendo em conta o resultado final, o grupo mostra-se satisfeito com o trabalho desenvolvido, sentindo-se realmente com maior capacidade de aplicar as competências desenvolvidas nas Unidades Curriculares em questão, uma vez que num Projeto desta dimensão todos os elementos são, de certo modo, obrigados a testar conhecimento, servindo uma vez mais como ponto positivo a execução do trabalho em grupo, que desempenha um papel fundamental no sentido em que as competências de cada um podem ser complementadas e, certamente, proporcionarem um resultado melhor. | ||
| + | <br> | ||
| + | <br> | ||
| + | '''6.2 Sugestões para o aperfeiçoamento e/ou desenvolvimento futuro do projeto''' | ||
| + | <br> | ||
| + | odo e qualquer trabalho, seja de carácter teórico ou de carácter prático, pode ser, geralmente, aperfeiçoado. | ||
| + | Como possíveis sugestões de aperfeiçoamento o grupo pensou em tornar a aplicação mais interativa e, como inovação, algo mais pessoal. Desta maneira, uma das ideias discutidas partia da opção que o utilizador tinha de, ele próprio, inserir os seus acontecimentos, datas importantes, fotos marcantes, vídeos pessoais, entre outros, na TimeView. Assim, este poderia fazer parte da aplicação, contribuindo para que a TimeView fosse de algum modo um pouco sua. | ||
| + | <br> | ||
| + | <br> | ||
| + | '''7.Referências Web e Bibliográficas''' | ||
| + | <br> | ||
| + | http://vector.tutsplus.com/tutorials/illustration/how-to-create-a-web-site-mascot/ http://www.hongkiat.com/blog/adobe-illustrator-cartoon-tutorials-best-of/ http://humanorigins.si.edu/evidence/human-evolution-timeline-interactive <br>http://www.guardian.co.uk/world/interactive/2012/mar/23/china-decade-change-interactive-timeline <br>http://timeline.national911memorial.org/#/Explore/2 http://www.suapesquisa.com/musicacultura/anos_50.htm http://designhistorytimeline.com/ <br>http://www.bbc.co.uk/history/interactive/ | ||
| + | <br>http://pt.wikipedia.org/wiki/D%C3%A9cada | ||
| + | <br> | ||
Edição actual desde as 00h31min de 16 de Janeiro de 2013
Índice |
Memória Descritiva
O projeto final de Laboratório Multimédia 1 e Imagem Digital Estática passa por combinar a animação e interatividade com as técnicas gráficas desenvolvidas ao longo das aulas de IDE, no sentido de enquadrar tudo isto, numa só aplicação.
A aplicação em desenvolvimento é uma aplicação off-line, destinada aos jovens entre os 14 e os 18 anos, e visa integrar cinco décadas de história, numa barra cronológica interativa.
Posto isto, a aplicação basear-se-á na existência de uma barra cronológica que integra informação desde os anos 50, aos anos 90. Entre esta informação, estarão disponíveis os principais acontecimentos culturais de cada década. A moda - parâmetro que define, de forma simples, o estilo de determinada época - será representada através de conteúdos animados, passando a ter representação gráfica animada e não textual.
A aplicação visa a existência de uma mascote que apresentará as diferentes décadas, comportando-se ao estilo das mesmas e sendo que o grupo aplicará, nestas apresentações, os seus conhecimentos relativos à parte de animação.
A aplicação em questão permitirá ao utilizador fazer uma rápida pesquisa acerca dos anos referidos, tendo, em alguns casos, apontamentos históricos relevantes ao longo da barra do tempo. Estes apontamentos permitirão que o utilizador se situe no contexto da época, e que compreenda determinadas mudanças no que toca ao estilo e à música.
Em suma, esta é uma aplicação que visa conferir ao utilizador uma ideia do que foi a história destas cinco décadas, utilizando a interatividade e a animação para captar a sua atenção.
Estruturas Arborescentes
Levantamento do estado de arte
Os anos 50 foram marcados por grandes avanços científicos, tecnológicos e mudanças culturais e comportamentais. Foi a década em que começaram as transmissões de televisão, provocando uma grande mudança nos meios de comunicação. No campo da política internacional, os conflitos entre os blocos capitalista e socialista (Guerra Fria) ganhavam cada vez mais força. A década de 1950 é conhecida como o período dos "anos dourados".
-1950 - A FIA (Federação Internacional de Automobilismo) organiza o primeiro Campeonato Mundial de Formula 1.
-1950 - Realização da Copa do Mundo de Futebol no Brasil
-25 de Junho de 1950 - Guerra da Coreia
-27 de Julho de 1953. - Termina
-6 de Fevereiro de 1952 - Elizabeth II torna-se rainha da Inglaterra.
-1956 - Elvis Presley começa a fazer sucesso
Os anos 60 representaram uma conclusão da realização dos projetos apresentados na década de 50.
A década de 60 foi, por assim dizer, a exposição de duas décadas.
A primeira ( 1960 a 1965) foi assinalada pelo entusiasmo das manifestações sócio-culturais e no espírito de luta do povo relacionado com a política.
A segunda (1966 a 1968) representa a perda de inocência, associado a drogas, a revolução sexual e o protesto da comunidade jovem contra a obstinação dos governos.
O último ano, 1969, já se apresentava como uma entrada para os anos 70.
Outubro de 1968 - ocorrem as Olimpíadas do México.
Lançamento do primeiro computador eletrónico, o RAMAC 305, pela empresa IBM.
-12 de Abril de 1961 - o russo Yuri Gagarin torna-se o primeiro homem a entrar no espaço.
-20 de Julho de 1969 - O homem chega à Lua através da missão Apollo 11.
-25 de Junho de 1967 - ocorre a primeira transmissão de televisão via satélite.
-Abril de 1969 - Criação da ArpaNet, o embrião da Internet.
-Agosto de 1961 - ocorre a construção do Muro de Berlim
O movimento hippie ganha força nesta década.
-22 de Novembro de 1963 - Homicídio do presidente J. F. Kennedy.
-4 de Abril de 1968 - é assassinado o ativista pelos direitos civis Martin Luther King.
-Novembro de 1962 - gravação do primeiro disco dos Beatles intitulado Please, Please, Me. O lançamento ocorre em março de 1963.
Nesta época surgiu a crise na área do ramo petrolífero, que levou à queda dos Estados Unidos ao mesmo tempo que a economia Japonesa apresentava crescimentos significativos para a sua história.
A defesa do ambiente foi um marco na história que se apresentou também nesta década.
Considerada a "era do individualismo", foi nesta época concreta em que os movimentos músicos das discotecas e da experiência na música erudita surgiram.
Uma marca significativa a níveis tecnológicos nos meios de comunicação de massas foi o surgimento da televisão a cores nos finais da década.
-18 de Setembro 1970 - Morte de Jimi Hendrix, um dos maiores guitarristas de todos os tempos
-10 de Abril 1970 - Paul McCartney anuncia o fim dos Beatles.
-25 de Abril de 1974 – Revolução dos cravos, "Dia da Independência".
-4 de Abril de 1975- Bill Gates e Paul Allen fundam a Microsoft.
-16 de Agosto de 1977 - morre o cantor Elvis Presley
-18 de Fevereiro de 1979 - Nevou pela única vez no Deserto do Saara.
A década dos anos 80 foi um período que marcou o século XX em termos de acontecimentos políticos e sociais, uma vez que é considerada como o fim da idade industrial e início da idade de informação.
Esta década é marcada por acontecimentos como o desenvolvimento do CD, na ciência e tecnologia, no casamento do Príncipe de Gales com Lady Diana e a queda do muro de Berlim, na política mundial, e na saúde deu-se a propagação do HIV, surgindo também avanços ao nível da tecnologia, do mundo dos videojogos e da música.
-13 de Maio de 1981 – Atentado ao Papa João Paulo II
-1982 – Lançamento do CD-Rom
-1984 – Apple Macintosh lança o primeiro computador pessoal
-1 de Janeiro de 1986 – Entrada de Portugal na CEE
-9 de Novembro de 1989 – Queda do Muro de Berlim
A década de 90 é marcada pelo colapso do Comunismo e com o final da Guerra Fria. Foi considerada por muitos países, instituições, companhias e organizações como os "tempos prósperos". Representou um dos maiores desenvolvimentos tecnológicos uma vez que se popularizou o computador pessoal e a Internet. Politicamente, os anos 90 foram de democracia expansiva. Mas também existiu um "lado maléfico" pois, na África, o aumento dos casos de AIDS e inúmeras guerras levaram à diminuição da expetativa de vida e nada de crescimento económico.
-24 de Abril de 1990 - Telescópio espacial Hubble
-24 de Novembro de 1991 - Morte do Freddy Mercury
-1 de Maio de 1994 - Morte de Ayrton Senna
-9 de Fevereiro de 1994 - Nelson Mandela 1º presidente negro da África de Sul
-5 de Julho de 1995 - Ovelha Dolly (clonagem)
-Durante a Década - Dot-Com Boom
-Durante a Década - Grunge (Nirvana)
-21 de Julho de 1997 - 1º livro do Harry Potter
-27 de Setembro de 1998 - Google
(final da década) - Supremacia dos video-jogos
Relatório ID-E- Multimédia:Dossier do Projeto.pdf
Modelos de Timeline
Desenvolvimento visual do projeto
Diário de Bordo
6 de Dezembro
- Brainstorming;
-Troca de ideias para o projeto;
-Início do estudo para a nossa aplicação multimédia.
10 de Dezembro
- Criação da página wiki;
- Elaboração do logótipo da aplicação;
- Investigação de aplicações multimédia e suportes para o desenvolvimento do nosso conteúdo.
13 de Dezembro
- Investigação de conteúdo relativo a cada uma das décadas;
- Inicio do estudo relativo ao design da barra cronológica;
14/15/16 de Dezembro
Reunião
- Estudo da cor e design da barra cronológica;
- Estudo relativo ao surgimento da informação na aplicação;
- Realização do estudo da estrutura arborescente da aplicação;
- Estudo do programa Illustrator, através de tutoriais, para a elaboração do apresentador.
17 de Dezembro
- Discussão de novas ideias para a barra cronológica;
- Conclusão do estudo relativo ao conteúdo das décadas;
- Continuação do estudo da estrutura arborescente da aplicação;
- Estudo sobre a mascote da aplicação;
- Experiências relativas à mesma.
18 de Dezembro
Reunião
- Estudo sobre a mascote da aplicação;
- Experiências relativas à mesma;
- Definição do género de mascote pretendida;
- Conclusão do design da linha de tempo.
19 de Dezembro
Reunião
- Estudo sobre a mascote da aplicação;
- Experiências relativas à mesma;
- Início do design da mascote;
- Organização do relatório.
20 de Dezembro
- Estudo da cor da mascote;
- Continuação do design da mascote;
- Investigação de conteúdos multimédia a serem aplicados;
- Organização do relatório.
21 de Dezembro
- Elementos do grupo regressam às suas cidades (Bragança, Açores e Mangualde)
- Finalização do design da mascote;
- Investigação de conteúdos multimédia a serem aplicados;
- Organização do relatório.
22 de Dezembro
-Organização do relatório de ID-E.
23 de Dezembro
-Conclusão e entrega do relatório de ID-E.
24/25 de Dezembro
-Pausa Natalícia.
26 de Dezembro
-Início do estudo relativo à animação a ser aplicada.
27/28 de Dezembro
- Estudos relativos ao stage e reestruturação dos layouts.
- Correção de detalhes nos layouts.
29/30 de Dezembro
- Reestruturação dos layouts;
- Início da animação.
31 de Dezembro e 1 de Janeiro
- Pausa de passagem de ano.
2/3/4/5/6 de Janeiro
- Trabalho em Flash - Animação.
7/8/9/10/11/12/13 de Janeiro
- Correção de elementos necessários na aplicação;
- Trabalho em Flash - Animação;
- Escrita do Relatório Final.
14 de Janeiro
-Correção de erros na animação
-Relatório Final
15 de Janeiro
-Correção de erros na animação
-Conclusão do trabalho em Flash
-Finalização do Relatório
Divisão de Tarefas
Ana Catarina Padrão
-Arborescências;
-Investigação década 70;
-Investigação de aplicações multimédia sobre os conteúdos de cada década.
-Relatório e dossier de projeto.
Ana Monteiro
-Responsável pela Wiki;
-Design Mascote;
-Investigação década 50;
-Relatório e dossier de projeto.
Joana Beja
-Design Mascote;
-Investigação década 80;
-Relatório e dossier de projeto.
João Aguiar
-Design timeline/logótipo/layouts;
-Investigação década 60;
-Relatório e dossier de projeto.
Ricardo Mendes
-Investigação década 90
-Layouts
-Investigação/elaboração do modo de apresentação de certos conteúdos culturais;
-Relatório e dossier de projeto.
Relatório final Laboratório Multimédia
1.Apresentação do projeto
No âmbito da Unidade Curricular de Laboratório Multimédia 1 em conjunto com a disciplina de Imagem Digital Estática, foi-nos proposto o desenvolvimento de um Projeto Final de autoria multimédia. Este Projeto, permitir-nos-ia aliar a aprendizagem de ambas as disciplinas e aplicar os conteúdos programáticos desenvolvidos durante o semestre.
A aplicação em questão procura possibilitar a abordagem e combinação de conteúdos de animação e interatividade e técnicas gráficas desenvolvidas nas Unidades Curriculares acima citadas.
Processualmente e no que toca à seleção da temática a abordar, surgiram várias questões, nomeadamente relativas ao público alvo e às áreas de interesse do mesmo.
Após troca de ideias e, consequentemente, seleção das mesmas, o grupo concluiu que a aplicação consistiria numa aplicação de tipo off-line, destinada a jovens entre os 14 e 18 anos, e que visava a integração de cinco décadas de história numa barra cronológica interativa.
Sendo assim, a interface desenvolvida baseia-se na existência de uma linha cronológica que integra acontecimentos históricos desde os anos 50 até aos anos 90.
À priori, esta mesma linha encontra-se dividida em décadas, de modo a apresentar uma visão geral do que o utilizador pode descobrir na fase seguinte, onde essa linha se subdivide em anos das respetivas décadas de modo a possibilitar a exploração, livre e pormenorizada, de toda a história que a aplicação descreve.
Esta aplicação, idealizada e desenvolvida pelo grupo, denomina-se de "TimeView - (Re)Visiting Generations". A mesma, disponibiliza informação necessária relativamente aos acontecimentos históricos mais marcantes de cada década, bem como a conteúdos relativos ao estilo musical e também, moda dominantes.
Em síntese, a aplicação desenvolvida permite que o utilizador consuma conhecimentos com facilidade relativamente às cinco décadas disponibilizadas, podendo acompanhar a evolução, comparar estilos, compreender mudanças e assumir preferências. Desta forma, a TimeView visa conferir a todos os que a pretendam explorar, uma viagem única pelas gerações onde a interatividade, a animação e a apresentação cuidada captem a atenção do utilizador e, desta forma, o levem a querer consultar mais frequentemente a aplicação.
Caraterísticas da aplicação multimédia
Área de conteúdos
Educação
Plataforma de suporte:
CD-ROM
Forma de distribuição:
Off-line
Paradigma de interação:
Ambiente - Os botões e menus, encontram-se embebidos na interface;
Tutorial - Sequencialidade do fluxo de informação;
Filiação:
Revista Visão Junior
Autoria:
Ana Catarina Padrão,Ana Monteiro,Joana Beja,João Aguiar,Ricardo Mendes
2. Análise e planeamento
A conclusão sobre o tipo de aplicação a desenvolver envolveu-nos numa vasta pesquisa, análise e planeamento de temas e, consequentemente, a um estudo do público alvo de modo a que, desta forma, pudéssemos avançar na escolha do tipo de aplicação a desenvolver.
Desde o início do desenvolvimento deste Projeto que o grupo se centrou na ideia de desenvolver uma aplicação destinada à comunidade jovem, mais especificamente dos 14 aos 18 anos de idade. A TimeView procura despertar facilmente a atenção do utilizador através da sua simplicidade e facilidade no acesso à informação.
A aplicação desenvolve-se através de uma interface leve e apelativa, onde a aprendizagem sobre as temáticas históricas é feita através de conteúdos interativos numa barra cronológica. Após uma investigação individual de cada elemento do grupo, foi atribuída supremacia aos acontecimentos mais relevantes acerca das épocas em questão, limitando assim a informação, de modo a não se perder a organização do conteúdo em geral.
Investigação temática
Para a investigação dos temas necessários ao desenvolvimento da parte teórica da nossa aplicação era indispensável a aquisição de conhecimentos relacionados com a História Mundial. Desta forma, o grupo partiu da investigação junto de pessoas próximas e cujas vidas passaram, de certo modo, por algumas das décadas abordadas na TimeView. Assim, deparámo-nos com uma maior facilidade de seleção relativamente ao tipo de acontecimentos a ter em conta na década em investigação.
A fase seguinte focou-se na escolha dos acontecimentos mais relevantes para a nossa aplicação. Para isso e em simultâneo, recorremos à pesquisa de informação presente em livros e na Web.
De forma a facilitar a recolha de informação relativa a cada uma das décadas, foi distribuída, de forma aleatória, uma década por cada elemento do grupo. Esta divisão veio permitir que cada elemento se focasse na perceção do espírito, estilo e contexto em que a aplicação se ia encontrar na apresentação das diferentes décadas.
Também como elemento essencial destacamos a aprofundada investigação de barras cronológicas e timelines, que nos ajudaram a compreender como conceber a nossa interface, e qual o tipo de timeline adequada para o efeito.
Após a pesquisa relativa a barras cronológicas procedemos, em conjunto com a opinião de cada professor, à análise das mesmas. Esta análise levou-nos à conclusão e ao assumo de preferências pelas interfaces mais atraentes e funcionais, de fácil compreensão e graficamente apelativas.
Tendo como princípio a simplicidade, o grupo experienciou várias soluções consoante as ideias que iam surgindo e, claramente, atribuindo um toque de gosto pessoal por parte de cada elemento. Em reunião e como consenso geral, o grupo concluiu que a interface a desenvolver deveria apresentar-se como uma barra cronológica visualmente simples, de aspeto curvo e cuja interatividade é passível de ser implementada.
Ultrapassando a fase de análise do tipo de linha cronológica a aplicar, o grupo decidiu que em cada uma das décadas seria apresentada apenas a informação fundamental para uma primeira visão geral, de modo a não preencher a TimeView com conteúdos supérfluos.
Dados relativos aos acontecimentos apresentados nas décadas
Década 50
1950
Primeiro Campeonato de Fórmula 1, organizado pela FIA.
Campeonato Mundial no Brasil
Início da Guerra da Coreia.
1953
Fim da Guerra da Coreia
1956
Sucesso de Elvis Presley
Moda da época
Os anos 50 esbanjavam glamour e sedução, principalmente no publico feminino. O lado masculino, inspirado em filmes como “Juventude Transviada”, procurava que as roupas determinassem rebeldia e atitude, dominando as jaquetas de couro e os clássicos jeans.
Década 60
1961
Yuri Gagarin faz a primeira viagem ao espaço.
Construção do Muro de Berlim~
1963
Morte de J.F. Kennedy
Beatles lançam o albúm "Please, Please Me".
1967
Primeira transmissão de televisão via satélite.
1968
Morte de Martin Luther King
1969
Viagem do Homem à Lua
Surgimento da ARPANet (Advanced Research Projectis Agency Network), considerada a "mãe" da Internet.
Moda da época
Os anos 60 viveram uma explosão de juventude. Influenciados pelas ideias do livro “On the Road” da chamada geração beat, os anos 60 vêm alterar o modo de vestir de uma população que deixava agora de apostar numa moda única, passando a ter várias propostas, cada vez mais ligadas ao comportamento desta nova sociedade. Agora, “a moda não era seguir a moda”, mas sim contrariá-la, numa clara atitude de liberdade.
Década 70
1970
Morte do guitarrista Jimi Hendrix.
Fim dos Beatles
1974
Revolução dos Cravos
1975
Bill Gates e Paul Allen fundam a Microsoft Corporation.
1977
Morte de Elvis Presley
Moda da época
Nos anos 70, anti-moda era a palavra-chave. Dominaram as calças boca de sino e os trajes de algodão e as túnicas largas que se relacionaram com o movimento hippie. Tudo era permitido, desde que não tivesse um aspeto normal. Esta escolha aleatória de indumentaria estava ligada ao movimento hippie e apostava no amor livre e libertação sexual. Foi um movimento que gritou pela “paz e amor”.
Década 80
1981
Atentado ao Papa João Paulo II
1982
Lançamento do CD-ROM
1984
Apple lança o primeiro computador pessoal multimédia.
1986
Entrada de Portugal na CEE
1989
Queda do Muro de Berlim
Moda da época
Na moda, os anos 80 ficaram marcados pela alegria, versatilidade, sensualidade, ousadia e sofisticação. Surgem visuais extravagantes, dominam as calças justas, cores fortes e vibrantes e penteados extravagantes.
As roupas tinham um ar futurista e os cortes de cabelo eram assimétricos, mostrando um look “despenteado”.
Década 90
1990
Telescópio Espacial Hubble entra em funcionamento.
1991
Morte de Freddie Mercury
1994
Nelson Mandela torna-se presidente da África do Sul.
1996
Ovelha Dolly - Clonagem
1998
Aparecimento do Google
Moda da época
Na moda, realça-se o Grunge, que, impulsionado pelo rock, veio afetar o comportamento e o modo de vestir, trazendo um estilo despojado de calças, camisas de xadrez e jaquetas estilo rock.
3.Desenho Funcional
O design aplicado na nossa interface foi o resultado de vários estudos, que partiram de um princípio de simplicidade.
Dado que o público alvo é a comunidade jovem não tencionámos preencher a aplicação com um design de aspeto pouco alusivo mas também não pretendíamos que a interface apresentasse um aspeto demasiado denso. Desta forma, ficou decidido que o design teria um aspeto fresco, simples e jovem.
Não fugindo à temática da TimeView, que se centra numa visita guiada ao passado, não quisemos que o aspeto gráfico da aplicação se tornasse exageradamente moderno.
Partindo do início, o grupo começou por desenvolver um layout com um aspeto antigo, apostando num contraste com a modernidade apenas através do grafismo da barra cronológica. Por motivos estéticos, essas tentativas não foram de encontro ao que procurávamos, levando a uma mudança radical no fundo do layout para um gradiente que varia de tons de cinzento para branco.
A nível de interatividade, a TimeView, apresenta um nível básico, uma vez que permite ao utilizador o controlo do fluxo da informação e navegação de uma forma simples e rápida.
O layout elaborado caracteriza-se pela sua frescura e simplicidade. Desta forma, facilita o acesso à informação dentro da aplicação, compreendendo intuitivamente como interagir e permitindo que não haja a possibilidade de confusão devido a elementos desnecessários.
A aplicação permite que o utilizador se foque na informação que decidiu explorar, sem que existam quaisquer tipo de fatores supérfluos que façam abstrair a sua atenção do essencial, uma vez que o grafismo é básico e descomplicado.
Tipograficamente, pretendemos que a aplicação apresenta-se um estilo minimalista, de fácil compreensão e agradável.
A fonte a utilizar é um fator importante em qualquer trabalho gráfico, uma vez que esta assume, em grande parte, se o utilizador compreende ou não a mensagem que se pretende passar.
Após testarmos várias fontes tipográficas, ficou acordado que a fonte que mais se adequa é, sem dúvida Helvética-light, uma vez que apresenta um design simples e de fácil legibilidade. Esta fonte distingue-se pela neutralidade, apresentando linhas que podem facilmente ser utilizadas em conteúdo clássico, moderno, conservador ou descontraído.
Uma vez que a nossa aplicação percorre cinquenta anos de História e, consequentemente, cinquenta anos de mudança, decidimos que a fonte a utilizar teria de assumir um carácter clássico, passível de se enquadrar em qualquer época a analisar.
3.1 Requisitos funcionais
A TimeView visa da existência de uma introdução que permite ao utilizador perceber alguns dos grandes conteúdos históricos que podem ser encontrados na exploração da interface. A mesma introdução integra imagens e sons referentes a alguns dos conteúdos históricos a serem encontrados nas fases seguinte da aplicação, e é apresentada de modo a dar a entender que se trata do início de uma viagem ao tempo.
Nesta etapa inicial da aplicação encontra-se um botão, "saltar intro", que nos permite sair da introdução e avançar para a fase seguinte da TimeView.
Na fase seguinte ao clique no botão "saltar intro" vamos deparar-nos com uma animação relativamente ao nosso apresentador da TimeView. A mascote irá surgir e vai apresentar a aplicação para que o utilizador, de uma forma divertida e rápida, perceba o que é que se vai retratar a seguir.
Imediatamente a partir da animação do apresentador, o utilizador vai perceber o aspeto da linha cronológica e o modo como se desenvolve. Nesta etapa, o utilizador tem a credibilidade para tomar decisões dentro da interface, nomeadamente para que década se pretende dirigir, sem que para avançar para a mesma tenha de passar pelas décadas antecedentes.
A partir desta fase, e em cada uma das janelas das décadas, o apresentador vai surgir através de voz, onde fará uma introdução divertida à década escolhida pelo utilizador.
Logo após a sua escolha, e clicando na década pretendida, o utilizador tem a possibilidade de visualizar a década expandida, onde irá encontrar alguns acontecimentos marcantes da época. Para visualizar a década expandida terá de fazer uso do botão "saber mais" que está presente na janela.
À passagem do rato pela década o utilizador irá encontrar pequenas janelas que dão a possibilidade de perceber que acontecimento se sucedeu num determinado ano. Ao clique do mesmo, o utilizador irá encontrar informação mais detalhada do acontecimento em questão através de uma janela que se irá expandir. A mesma janela possui um botão de saída que permite regressar à barra cronológica.
Nesta fase da aplicação, o utilizador irá também encontrar um botão "cabide" que representa a moda. Ao clique do mesmo o utilizador vai encontrar uma janela pop up com a descrição da moda que marcou a época e ainda com uma representação da nossa mascote vestida de acordo com as caraterísticas correspondentes.
Também nesta etapa há a oportunidade de selecionar uma opção representada por um CD que corresponde a uma playlist que apresenta cinco músicas que fizeram parte dos grandes sucessos da época descrita.
Durante toda a aplicação o utilizador irá encontrar um botão "sobre" que apresenta uma definição da TimeView, de forma a dar a perceber em que consiste a aplicação. O botão "Sair", também representado ao longo da aplicação, permite que o utilizador possa abandonar a mesma quando pretender.
3.2 Estrutura Arborescente
A estrutura arborescente é do tipo não-linear, e foi pensada e desenvolvida de forma a representar simplicidade e fluidez no decorrer da aplicação. Desta forma facilita o acesso do utilizador aos diferentes conteúdos.
3.3 Desenho de interação e usabilidade
Tendo em conta que a usabilidade é um atributo qualitativo relacionado com a facilidade de utilização das interfaces, elaboramos o nosso projeto de modo a que, logo a partir da primeira interação com a aplicação, o utilizador encontre facilidades a nível da aprendizagem, a nível da eficácia e eficiência apresentada, na facilidade de memorização dos conteúdos, na satisfação quanto ao que se apresenta e facilidade na correção de erros que possam surgir.
O primeiro princípio a ter em conta por parte do grupo foi o perfil do público a quem se dirige a aplicação. Desta forma, uma vez que o público alvo é a comunidade jovem, optamos pelo design simples e moderno e pela interatividade fácil e divertida, sem conteúdos excessivos.
Quanto à estrutura e orientação da interface o utilizador vai saber sempre a que ponto da estrutura se encontra, como e para onde pode navegar pois decidimos incorporar na interface, um mapa de orientação. Além disso, utilizamos mecanismos de retorno através do botão "voltar".
A simplicidade, como princípio chave do design, foi o aspeto principal no desenvolvimento de todo o projeto, pois toda a complexidade desnecessária deve ser evitada a todos os níveis, tanto nos procedimentos como no acesso a conteúdos e na linguagem utilizada pela aplicação para comunicar com o utilizador.
Todo o desenho de interação e usabilidade foi executado tendo em conta que não pretendemos sobrecarregar o utilizador com alternativas, informações ou opções desnecessárias.
A linguagem utilizada é clara, concisa, não ambígua e familiar. Assim, o conteúdo apresentado é captado com maior facilidade e o utilizador sente-se satisfeito.
4. Desenho Técnico
A TimeView é uma aplicação de formato Projecter, capaz de ser reproduzida em qualquer sistema operativo e cujos requisitos técnicos passam pela necessidade do flash player ao nível do software, e ao nível do hardware esta é uma aplicação que deve ser executada com acesso a colunas e rato, uma vez que contém som e interatividade.
A TimeView, cuja filiação se integra numa revista juvenil, tem como forma de distribuição o CD-ROM e está preparada para ser executada em qualquer monitor.
5. Produção do projeto
5.1 Estrutura e meios de navegação/interação
O utilizador fará uso da interatividade da aplicação através de botões que funcionam em rollOver e rollOut, como por exemplo na navegação na barra cronológica, e ainda botões on (release), que se apresentam também ao longo de toda a aplicação, como por exemplo na fase inicial, "saltar intro".
Esta forma de navegação está estruturada de modo a que o utilizador consiga aceder a toda a informação de forma simples.
5.2 Integração e controlo de som
No projeto é apresentado um som de fundo que foi selecionado após de uma pesquisa e estudo de alguns sons que se pudessem adequar ao resto do conteúdo da TimeView. Este som ambiente pode ser controlado através do botão on/off apresentado na interface.
Na introdução podemos verificar que é constituída por uma colectânea de sons associados aos acontecimentos tratados na aplicação, e surgem de forma autónoma, acompanhados por uma pequena animação.
A TimeView inclui várias listas de reprodução, uma por cada década, onde estão incluídos cinco excertos das músicas mais representativas da época. Estes excertos são controlados pelo uso dos botões "play" e "stop", para o utilizador reproduza a música que deseja e possa pará-la conforme a sua vontade.
5.3 Animação
Após a conclusão da TimeView foi-nos possível perceber o quão trabalhoso é desenvolver uma aplicação de raiz.
Desde a criação de um Design coerente à execução de uma aplicação cuja interatividade e animação pudessem ser aplicadas, a criação da TimeView envolveu grande dedicação, pesquisa, tentativa e trabalho.
No entanto e tendo em conta o resultado final, o grupo mostra-se satisfeito com o trabalho desenvolvido, sentindo-se realmente com maior capacidade de aplicar as competências desenvolvidas nas Unidades Curriculares em questão, uma vez que num Projeto desta dimensão todos os elementos são, de certo modo, obrigados a testar conhecimento, servindo uma vez mais como ponto positivo a execução do trabalho em grupo, que desempenha um papel fundamental no sentido em que as competências de cada um podem ser complementadas e, certamente, proporcionarem um resultado melhor.
5.4 Soluções técnicas adotadas para a resolução de problemas
No que toca às soluções técnicas utilizadas, surgiram essencialmente problemas ao nível da fluidez da aplicação. Isto é, pretendia-se que a aplicação e, nomeadamente, a visão da linha cronológica geral (cujas décadas são apresentadas em síntese), conferisse ao utilizador a sensação de que podia rodar a aplicação, explorando em linhas gerais cada década exposta. No entanto e após alguma pesquisa, o grupo concluiu que essa fluidez e sensação de seguimento da barra só seria possível através de recurso a action script 3.0. Posto isto e tendo em conta que a aplicação teria de ser desenvolvida em action script 2.0, recorremos à execução de movie clips capazes de proporcionar ao utilizador a sensação de que a barra realmente se deslocava, utilizando dois botões: “avançar” e “voltar”. Estes mesmos botões, comandados para que ao clique enviem a cabeça de leitura para o movie clip respetivo, foram pensados de forma a se tornarem funcionais para o utilizador e, graficamente, coerentes com a aplicação.
6. Conclusões
6.1. Reflexão crítica
Após a conclusão da TimeView foi-nos possível perceber o quão trabalhoso é desenvolver uma aplicação de raiz.
Desde a criação de um Design coerente à execução de uma aplicação cuja interatividade e animação pudessem ser aplicadas, a criação da TimeView envolveu grande dedicação, pesquisa, tentativa e trabalho.
No entanto e tendo em conta o resultado final, o grupo mostra-se satisfeito com o trabalho desenvolvido, sentindo-se realmente com maior capacidade de aplicar as competências desenvolvidas nas Unidades Curriculares em questão, uma vez que num Projeto desta dimensão todos os elementos são, de certo modo, obrigados a testar conhecimento, servindo uma vez mais como ponto positivo a execução do trabalho em grupo, que desempenha um papel fundamental no sentido em que as competências de cada um podem ser complementadas e, certamente, proporcionarem um resultado melhor.
6.2 Sugestões para o aperfeiçoamento e/ou desenvolvimento futuro do projeto
odo e qualquer trabalho, seja de carácter teórico ou de carácter prático, pode ser, geralmente, aperfeiçoado.
Como possíveis sugestões de aperfeiçoamento o grupo pensou em tornar a aplicação mais interativa e, como inovação, algo mais pessoal. Desta maneira, uma das ideias discutidas partia da opção que o utilizador tinha de, ele próprio, inserir os seus acontecimentos, datas importantes, fotos marcantes, vídeos pessoais, entre outros, na TimeView. Assim, este poderia fazer parte da aplicação, contribuindo para que a TimeView fosse de algum modo um pouco sua.
7.Referências Web e Bibliográficas
http://vector.tutsplus.com/tutorials/illustration/how-to-create-a-web-site-mascot/ http://www.hongkiat.com/blog/adobe-illustrator-cartoon-tutorials-best-of/ http://humanorigins.si.edu/evidence/human-evolution-timeline-interactive
http://www.guardian.co.uk/world/interactive/2012/mar/23/china-decade-change-interactive-timeline
http://timeline.national911memorial.org/#/Explore/2 http://www.suapesquisa.com/musicacultura/anos_50.htm http://designhistorytimeline.com/
http://www.bbc.co.uk/history/interactive/
http://pt.wikipedia.org/wiki/D%C3%A9cada





















