UrbanShop
From LABMM1_IDE
(→Relatório) |
|||
| (34 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 == | ||
<ul> | <ul> | ||
<li>Fábio Lemos 61199</li> | <li>Fábio Lemos 61199</li> | ||
| - | <li>Filipe Almeida | + | <li>Filipe Almeida 60759</li> |
<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 == | ||
| + | === 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; <br /> | ||
| + | Definição de esquema de cores;<br /> | ||
| + | Definição de áreas chave da aplicação<br /> | ||
| + | |||
| + | === 26 de Novembro === | ||
| + | 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:
- DCShoes - www.dcshoes.com
- Vans - www.vans.com
- Nike - www.nike.com
- Billabong - www.billabong.com
- QuikSilver - global.quiksilver.com
- Ecko - www.shopecko.com
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
- Fábio Lemos 61199
- Filipe Almeida 60759
- Tiago Roque 38803
- Valério Vaz 40554
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:
- Logotipo { }
- Aplicação do animal [ ]
- Palete de cores [X]
Aplicação
- Layout da Aplicação { ]
- 4 Fases da aplicação { }
- Botões de navegação { ]
Palete de Cores
Fontes
ZERO & ZERO IS http://www.fontsquirrel.com/fonts/Zero-Zero-Is
Logótipos
Arborescência
Ecras
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:
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/












