UrbanShop

From LABMM1_IDE

(Difference between revisions)
Jump to: navigation, search
(→Relatório)
 
(32 intermediate revisions not shown)
Line 1: Line 1:
 +
== Entregas e Prazos ==
 +
 +
'''26 de Novembro:''' Publicação da constituição dos grupos e do Tema Visual a desenvolver, numa página criada para o efeito no Wiki da disciplina. Envio do link por email para os docentes (pamado@ua.pt; ivodaniel@ua.pt; lelis@ua.pt) e actualização da lista na página: http://wikis.ua.pt/lab1ide/index.php/IDE#Grupos_do_Projecto_Final '''--> DONE'''<br /><br />
 +
'''03 de Dezembro:''' Publicação da Identidade Visual da Aplicação e da Lista de Requisitos Funcionais a desenvolver na página do projecto no Wiki da disciplina.<br /><br />
 +
'''10 de Dezembo:''' Publicação dos Ecrãs Tipo e/ou Assets desenvolvidos na página do projecto no Wiki da disciplina.<br /><br />
 +
'''13 de Dezembro:''' Apresentação Final (AF) do trabalho em progresso. Devem preparar uma apresentação de 10 minutos onde explicam o Tema Visual, os Requisitos Funcionais e Os principais elementos do Guião da aplicação como os Ecrãs Tipo e a Identidade Visual desenvolvida. Devem recorrer ao apoio de uma apresentação desenvolvida para o efeito (PDF, PPT, SWF,...). Podem fazer uma demonstração da aplicação<br /><br />
 +
'''12 de Janeiro:''' Entrega Final (EF) do Projecto (ficheiro ZIP) no link de entregas do Moodle criado para o efeito. Entrega da FAHAV no link de entregas do Moodle criado para o efeito.
 +
== Introdução ==
== Introdução ==
Line 15: Line 23:
<ul>
<ul>
-
<li>DCShoes - www.dcshoes.com</li>
+
<li>'''DCShoes''' - www.dcshoes.com</li>
-
<li>Vans - www.vans.com</li>
+
<li>'''Vans''' - www.vans.com</li>
-
<li>Nike - www.nike.com</li>
+
<li>'''Nike''' - www.nike.com</li>
-
<li>Billabong - www.billabong.com</li>
+
<li>'''Billabong''' - www.billabong.com</li>
-
<li>QuikSilver - global.quiksilver.com</li>
+
<li>'''QuikSilver''' - global.quiksilver.com</li>
-
<li>Ecko - www.shopecko.com</li>
+
<li>'''Ecko''' - www.shopecko.com</li>
</ul>
</ul>
 +
 +
Paradigma de interacção index. Além da loja contêm conteúdos como imagens e vídeos ligados ao tema. Imagem bastante forte. Informação relativa a eventos que funcionam como publicidade. Loja sempre separada do site de conteúdos multimédia.
== Elementos do grupo ==
== Elementos do grupo ==
Line 29: Line 39:
<li>Tiago Roque 38803</li>
<li>Tiago Roque 38803</li>
<li>Valério Vaz 40554</li>
<li>Valério Vaz 40554</li>
 +
</ul>
== Daily Updates ==
== Daily Updates ==
 +
=== 9 de Dezembro ===
 +
Conclusão da arborescência da aplicação
 +
 +
=== 7 de Dezembro ===
 +
Tiramos as fotografias para fazer uma animação stop motion, de uma pessoa a trocar de t-shirt.
 +
Esta animação irá ser incorporada na aplicação quando se estiver na área de vestuário.
 +
 +
=== 6 de Dezembro ===
 +
Definição da arborescência da aplicação na aula de Laboratório Multimédia;
 +
Re-estruturação da palete de cores cromáticas - adição de códigos RGB e HEX, eliminação de cores desnecessárias;
 +
Vectorização da mascote Chimera;
 +
 +
=== 3 de Dezembro ===
 +
Chegamos a um conceito do design da plataforma.
 +
Paletes de cores definidas
 +
=== 29 de Novembro ===
=== 29 de Novembro ===
Concepção de logótipos para a aplicação; <br />
Concepção de logótipos para a aplicação; <br />
Line 38: Line 65:
=== 26 de Novembro ===
=== 26 de Novembro ===
Definição do tema da nossa aplicação - Urban SHop
Definição do tema da nossa aplicação - Urban SHop
 +
 +
== Workflow ==
 +
===Elementos a vectorizar: ===
 +
'''Stationary:'''<br />
 +
<ul>
 +
<li>Logotipo { } </li>
 +
<li>Aplicação do animal [ ]</li>
 +
<li>Palete de cores [X]</li>
 +
</ul>
 +
<br />
 +
'''Aplicação'''
 +
<ul>
 +
<li>Layout da Aplicação { ]</li>
 +
<li>4 Fases da aplicação { }</li>
 +
<li>Botões de navegação { ]</li>
 +
</ul>
 +
 +
===Palete de Cores===
 +
[[File:Palete-de-cores.png]]
 +
 +
===Fontes===
 +
'''ZERO & ZERO IS''' http://www.fontsquirrel.com/fonts/Zero-Zero-Is<br />
 +
 +
[[File:Zeroandzerois.png]]<br /><br />
 +
'''Verdana'' <br />'
 +
 +
[[File:Verdana.png]]
 +
 +
===Logótipos===
 +
 +
'''Escolhido:''' [[File:Logo_black.png]]<br /><br />[[File:Logo_color.png]]
 +
 +
===Arborescência===
 +
[[File:Chimera_-_Arborescencia.jpg]]
 +
 +
===Ecras===
 +
'''Loading:''' <br />
 +
[[File:001_loading.jpg]]<br /><br />
 +
 +
'''Homepage:''' <br />
 +
[[File:002_homepage.jpg]]<br /><br />
 +
 +
'''Entrada Loja:''' <br />
 +
[[File:003_loja01.jpg]]<br /><br />
 +
 +
'''Vestuário:''' <br />
 +
[[File:004_vestuario.jpg]]<br /><br />
 +
 +
'''Skateboards:''' <br />
 +
[[File:005_skateboards.jpg]]<br /><br />
 +
 +
'''Calçado:''' <br />
 +
[[File:006_calcado.jpg]]<br /><br />
 +
 +
'''Áreas de Conteúdos:''' <br />
 +
[[File:007_texto.jpg]]<br /><br />
 +
 +
O ficheiro onde estamos a trabalhar, está em Fireworks PNG, e os vários ecras estão contidos em vários estados. (normalmente na mesma janela dos layers, consegue-se navegar pelos estados). Podes aceder ao ficheiro por aqui:<br />
 +
[[File:chimera.png]]
 +
 +
== Apresentação ==
 +
Por favor, façam download do ficheiro em http://dl.dropbox.com/u/761602/chimera.pptx
 +
 +
== Versões Online ==
 +
===Alpha===
 +
http://valeriovaz.com/ua/UrbanShop-Alpha/
 +
===Beta===
 +
http://valeriovaz.com/ua/UrbanShop-Beta/
 +
===Final===
 +
http://valeriovaz.com/ua/final/
 +
 +
===Relatório===
 +
[[File:Relatorio.pdf]]

Latest revision as of 19:56, 14 January 2011

Contents

Entregas e Prazos

26 de Novembro: Publicação da constituição dos grupos e do Tema Visual a desenvolver, numa página criada para o efeito no Wiki da disciplina. Envio do link por email para os docentes (pamado@ua.pt; ivodaniel@ua.pt; lelis@ua.pt) e actualização da lista na página: http://wikis.ua.pt/lab1ide/index.php/IDE#Grupos_do_Projecto_Final --> DONE

03 de Dezembro: Publicação da Identidade Visual da Aplicação e da Lista de Requisitos Funcionais a desenvolver na página do projecto no Wiki da disciplina.

10 de Dezembo: Publicação dos Ecrãs Tipo e/ou Assets desenvolvidos na página do projecto no Wiki da disciplina.

13 de Dezembro: Apresentação Final (AF) do trabalho em progresso. Devem preparar uma apresentação de 10 minutos onde explicam o Tema Visual, os Requisitos Funcionais e Os principais elementos do Guião da aplicação como os Ecrãs Tipo e a Identidade Visual desenvolvida. Devem recorrer ao apoio de uma apresentação desenvolvida para o efeito (PDF, PPT, SWF,...). Podem fazer uma demonstração da aplicação

12 de Janeiro: Entrega Final (EF) do Projecto (ficheiro ZIP) no link de entregas do Moodle criado para o efeito. Entrega da FAHAV no link de entregas do Moodle criado para o efeito.

Introdução

A aplicação multimédia que o nosso grupo irá apresentar, tem como conceito uma loja on-line de e-commerce com o tema de Urban Shop. A loja terá a world wide web como meio de distribuição, e futuramente irá ser alojada numa empresa de hosting.

Pretende, apresentar de uma forma dinâmica, os produtos disponíveis que a marca poderá ter para venda, e também dar uma pequena, não muito extensa, informação sobre a cultura urbana existente nos tempos correntes. A loja on-line terá 2 momentos chave de interacção. O primeiro, é a personalização das tábuas de um skate - skateboards - em que o utilizador poderá escolher o design que a skateboard que ele encomendará, irá ter. Estas escolhas são feitas por arrasto de opções de um menu para um "canvas". As opções que existem no menu, são limitadas, mas a sua posição e quantidade na skateboard é livre. O utilizador também poderá escolher a cor base, e se o elemento que escolher do menu, assim o permitir, também poderá escolher essa cor. Exemplo: um gráfico vectorial que poderá ter várias tonalidades.

O segundo momento de interacção, é a escolha da roupa. Nesta área, irá conter um manequim vestido inicialmente com um conjunto, que ao ser clicado nas diferentes áreas do corpo (exemplo: pernas, pés, tronco e cabeça), as roupas ou acessórios são automaticamente mudados. Com esta ferramenta, o utilizador poderá ver como é que o conjunto se conjugará entre os elementos seleccionados.

Em relação aos conteúdos da cultura, a aplicação multimédia terá secções de texto, vídeo e fotografias.

A aplicação terá um leitor de música, que inicialmente a tocar poderá ser controlado pelo utilizador. Com play, pause, próxima música e música anterior.

Investigação

As empresas que ou possuem uma aplicação semelhante, ou que estão inseridas no mesmo ramo de mercado que foram alvo de uma pesquisa foram:

Paradigma de interacção index. Além da loja contêm conteúdos como imagens e vídeos ligados ao tema. Imagem bastante forte. Informação relativa a eventos que funcionam como publicidade. Loja sempre separada do site de conteúdos multimédia.

Elementos do grupo

Daily Updates

9 de Dezembro

Conclusão da arborescência da aplicação

7 de Dezembro

Tiramos as fotografias para fazer uma animação stop motion, de uma pessoa a trocar de t-shirt. Esta animação irá ser incorporada na aplicação quando se estiver na área de vestuário.

6 de Dezembro

Definição da arborescência da aplicação na aula de Laboratório Multimédia; Re-estruturação da palete de cores cromáticas - adição de códigos RGB e HEX, eliminação de cores desnecessárias; Vectorização da mascote Chimera;

3 de Dezembro

Chegamos a um conceito do design da plataforma. Paletes de cores definidas

29 de Novembro

Concepção de logótipos para a aplicação;
Definição de esquema de cores;
Definição de áreas chave da aplicação

26 de Novembro

Definição do tema da nossa aplicação - Urban SHop

Workflow

Elementos a vectorizar:

Stationary:


Aplicação

Palete de Cores

Palete-de-cores.png

Fontes

ZERO & ZERO IS http://www.fontsquirrel.com/fonts/Zero-Zero-Is

Zeroandzerois.png

'Verdana
'

Verdana.png

Logótipos

Escolhido: Logo black.png

Logo color.png

Arborescência

Chimera - Arborescencia.jpg

Ecras

Loading:
001 loading.jpg

Homepage:
002 homepage.jpg

Entrada Loja:
003 loja01.jpg

Vestuário:
004 vestuario.jpg

Skateboards:
005 skateboards.jpg

Calçado:
006 calcado.jpg

Áreas de Conteúdos:
007 texto.jpg

O ficheiro onde estamos a trabalhar, está em Fireworks PNG, e os vários ecras estão contidos em vários estados. (normalmente na mesma janela dos layers, consegue-se navegar pelos estados). Podes aceder ao ficheiro por aqui:
Chimera.png

Apresentação

Por favor, façam download do ficheiro em http://dl.dropbox.com/u/761602/chimera.pptx

Versões Online

Alpha

http://valeriovaz.com/ua/UrbanShop-Alpha/

Beta

http://valeriovaz.com/ua/UrbanShop-Beta/

Final

http://valeriovaz.com/ua/final/

Relatório

File:Relatorio.pdf

Retrieved from "http://wikis.ua.pt/lab1ide/index.php?title=UrbanShop"
Personal tools
Namespaces
Variants
Actions
Navigation
Toolbox