Ferramentas Web, Web 2.0 e Software Livre em EVT

Transcrição

1 E s t u d o s o b r e a i n t e g r a ç ã o d e f e r r a m e n t a s d i g i t a i s n o c u r r í c u l o d a d i s c i p l i n a d e E d u c a ç ã o V i s u a l e T e c n o l ó g i c a COLOURlovers M a n u a l e G u i a d e e x p l o r a ç ã o d o C O L O U R l o v e r s p a r a u t i l i z a ç ã o e m c o n t e x t o d e E d u c a ç ã o V i s u a l e T e c n o l ó g i c a Elisa Cidade Este recurso foi produzido no âmbito da formação contínua de professores e faz parte integrante da investigação do trabalho de doutoramento em Multimédia em Educação, pela Universidade de Aveiro do professor José Alberto Rodrigues, com o mesmo nome desta oficina de formação. A identificação do autor deste documento é a constante desta página e constituí recurso educativo em EVT.

2 Caracterização e Ficha Técnica do COLOURlovers Nome COLOURlovers Tipo de ferramenta Web 2.0 Autores e/ou Criadores CHROMAom, Inc. Versão Versão 2 Tipo de versão URL s Língua(s) Tipo de funções Recursos necessários Online e gratuita (com necessidade de registo) Inglês Ferramenta para composição de cores e criação de paletas e padrões. Computador com ligação à Internet e browser Breve descrição O COLOURlovers é uma comunidade online e oferece um conjunto de ferramentas de criação de cores, paletas e outras aplicações, muito interessante para exploração em contexto educativo (e não só). Podemos criar e partilhar Cores, Paletas e Padrões, muitos deles criados a partir de imagens/fotografias. 1

3 Manual e Guia de Utilização e Exploração do COLOURlovers 1. Para acedermos a esta ferramenta, devemos, no browser da Internet digitar o seguinte endereço 2. Iremos visualizar a página inicial (Figura 1). Figura 1 Página inicial do COLOURlovers 3. Nesta primeira página, existe uma barra de menus com as opções Browse (Procurar), Creat (Criar), Search (Pesquisar), Comunity (Comunidade), Chanells (Negócios), Trends (Tendências), Tools (Ferramentas) e Store (Figura 2). Figura 2 Barra de menus do Colourlovers 4. Ao clicarmos na primeira ferramenta desta barra Browse (Procurar), temos acesso a um infinito número Paletas, Padrões, Cores e amigos de COLOURlolovers. 5. A segunda opção da Barra de Ferramentas Creat (Criar), permite criar uma Paleta de cores, criar um padrão e o nome de uma cor (Figura 3). 2

4 Figura 3 - Barra de ferramentas : 5.1. Clicando em Pallette (Paleta), aparece-nos uma janela (Figura 4), que nos explica o que podemos criar, e nos dá acesso a três menus de criação: Basic (Básico), Advanced (Avançado) e From a Photo (a aplicar a partir de uma fotografia). Figura 4 Criação de uma paleta de cores Básica: para guardar esta Paleta de cores, exige o registo. Figura 5 Exemplo de paleta de cores 3

5 Avançada: remete-nos para a ferramenta COPASO (Figura 6). Figura 6 - Página de visualização do COPASO A partir de uma foto- Remete-nos para a ferramenta PHOTOCOPA (Figura 7). Figura 7 - Página de visualização PHOTOCOPA 5.2. Clicando em Pattern (Padrões), aparece-nos uma janela (Figura 8), que nos explica o que podemos criar, e nos dá acesso a dois menus de criação: Color a Pattern (Padrão de cor única) e Design a Pattern (Padrão de Design). Figura 8 - Criação de uma Pattern 4

6 Padrão de cor única. Para guardar exige registo (Figura 9). Figura 9 Padrão de cor única Padrão de Design. Remete-nos para a ferramenta SEAMLESS (Figura 10). Figura 10 Página de visualização SEAMLESS 5.3. Clicando em Color (Cor), aparece-nos uma janela (Figura 11), que nos explica o que podemos criar, e nos dá acesso a um menu de criação: Creat a Color (Criar a cor) (Figura 12). 5

7 Figura 11 Nomear uma cor Figura 12 Criar uma cor 6. A terceira opção da Barra de Ferramentas, Search (Pesquisar) permite encontrar muitas Paletas, Padrões e Cores, para nos inspirar. 7. A quarta opção da Barra de Ferramentas, Comunity (Comunidade) permite a partilha de informações sobre os trabalhos realizados. 8. A quinta opção da Barra de Ferramentas, Chanells (Negócios) permite o acesso a negócios, moda, etc. 9. A sexta opção da Barra de Ferramentas, Trends (Tendências) permite o acesso a uma variada informação relacionada com o COLOURlovers. 10. A sexta opção da Barra de Ferramentas Tools (Ferramentas) permite o acesso a algumas ferramentas de criação: SEAMLESS, PHOTOCOPA e COPASO Ao clicar em SEAMLESS visualizamos a seguinte figura (Figura 13). 6

8 Figura 13 Página de visualização do SEAMLESS STUDIO Do lado esquerdo da figura (Figura 14), encontramos o menu BASIC com algumas formas a utilizar na criação do padrão desejado. Figura14 Menu Basic Depois de seleccionada a forma desejada, a mesma deverá ser desenhada na área de trabalho (Active Tool Draw), num espaço central destinado a esse fim. Seleccionar formas: Figura 15 Ferramentas Seleccionar Formas 7

9 Desenhar: Figura 16 Àrea de trabalho O menu Layers permite-nos gerir o trabalho efectuado. Para tal dispõe das seguintes ferramentas: Delete Apaga a forma seleccionada. Group Permite agrupar duas ou mais formas para as editar em simultâneo. Clone Permite duplicar uma ou mais formas. Flip horizontally and vertically - Permite girar a forma seleccionada horizontalmente e verticalmente. Move Top e Move Bottom - Permite mover a forma seleccionada, para cima e para baixo Figura 17 Ferramentas básicas de trabalho 8

10 Cada forma fica numa Layer e pode ser editada individualmente, podendo ser colorida em diferentes tonalidades de cinza. A Layer activa fica sinalizada a vermelho. Figura 18 Layers Na parte superior da área de edição existem as seguintes ferramentas (da esquerda para a direita): Figura 19 Barra de ferramentas Draw: Ferramenta de desenho Select: Permite seleccionar uma forma. Undo e Redu: Anula ou refaz uma acção. Zoom: Permite aumentar ou diminuir a área de edição Depois de concluido o padrão o mesmo poderá ser guardado (exige registo) ficando o mesmo disponível na comunidade do Ao clicar em PHOTOCOPA visualizamos a seguinte figura (Figura 20): 9

11 Figura 20 Página de visualização da PHOTOCOPA Do lado direito da figura (Figura 21), encontramos na parte superior uma barra de menus (Figura 21) e um menu básico (Figura 22), com diferentes opções Este menu permite: publicar o trabalho (Publish), guardar o trabalho (Save), abrir o trabalho (Open) e ajuda. Figura 21 Barra de Menus do PHOTOCOPA Clicando em Photos (Fotos), Colors (Cores) ou Gallery (Galeria) abre-se janelas diferentes. Figura 22 Opções Photos, Colors e Gallery Clicando em Photos (fotos), visualizamos a figura 23. Este permite ir buscar fotos de maneiras: digitando a URL dada foto pretendida ou procurar a foto no Flicckr. Figura 23 Carregar fotografias de um URL ou Flickr 10

12 11.5. Clicando em Gallery (Galeria), visualizamos a figura 24. Esta permite escolher uma foto nas existentes na galeria e que depois de seleccionada passa para a area de trabalho. Figura 24 Exemplo de uma imagem da Galeria Clicando em Colors (Cores), visualizamos a figura 25. As cores que aparecem, são as da foto.na parte inferior temos uma serie de opções: Bright, Muted, Analogous, Chance, Dark e Light. (Figura 26), que nos permitem.. Figura 25 Edição e selecção de cores a partir de uma imagem Figura 26 Paleta de cores da imagem 11

13 11.7. A partir daqui começamos a construir a nossa paleta de cores. Pomos o cursor em cima da cor que queremos seleccionar (Figura 27) e a cor aparece no quadrado, na parte inferir (Figura 28). Repetindo os passos anteriores vamos criando a nossa Paleta de Cores, a partir de uma foto. Figura 27 Figura Ao clicar em COPASO visualizamos a seguinte figura (Figura 29). Temos que entrar em Log in, com a nossa senha, para podermos aceder à ferramenta. Figura 29 Ferramenta COPASO 12

14 12.1. Na parte superior da figura, temos um espaço para escrever o nome da paleta. Logo por baixo, temos um espaço para colocarmos a imagem seleccionada. Para seleccionar a imagem, clicamos em Attach New (Figura 30). Figura 30 Selecção de imagem para uma paleta no COPASO Clicando em Attach New, aparece-nos a figura 31, clicar novamente em Procurar e aparece-nos a figura 32. Nesta figura, vamos buscar a imagem, voltamos a clicar em Attach New e a imagem aparece-nos no canto superior esquerdo, na área de trabalho (Figura 33). Figura 31 Adicionar imagem à Livraria Figura 32 Procurar a imagem no nosso computador 13

15 Figura 33 Imagem carregada pronta para a criação de uma paleta Repetindo o processo anterior passo acrescentar novas fotos, que ficam na parte inferior esquerda (Figura 34). Clicando na imagem que quero, ela passa para o quadrado de cima (Figura 35). Figura 34 Figura Para podermos, criar a nossa paleta de cores, temos que clicar em Pixelate e seleccionar a cor pretendida na imagem (Figura 36), clicar duas vezes e ela passa 14

16 para a paleta de cores, no lado direito (Figura 37). E assim sucessivamente, até termos a nossa Paleta de cores (Figura 38). Figura 36 Figura 37 Figura No lado esquerdo, temos a cor seleccionada no momento e três barras de cor (Figura 39). A primeira serve para alterar a cor, a segunda permite mudar o tom (da cor seleccionada até ao branco) e a terceira permite mudar o tom(da cor seleccionada até ao preto). Figura Depois de concluida a Paleta de Cores, poderá ser guardada e partilhada. 15