01 50 VANTAGENS DO FIREWORKS

Tamanho: px
Começar a partir da página:

Download "01 50 VANTAGENS DO FIREWORKS"

Transcrição

1 FIREWORKS CS5

2 ÍNDICE ÍNDICE... 2 INTRODUÇÃO... 4 A série VANTAGENS DO FIREWORKS Alinhamento Preciso com Pixels Quick Infos Retângulos arredondados Largura de linha e cor de preenchimento Gradientes Dithering gradients Layer Styles e modos de mistura Escala sem distorção Funções Alinhar Objetos Ocultos Alinhar texto ao redor de uma imagem Uso de caracteres especiais Modelos para o Layout Grades, banners Painel Camadas (Layers) States-Panel (para MouseOver e Interatividade) Camadas de compartilhamento entre os estados e as páginas Painel Páginas Master Page (alterações em todas as sub-páginas) Usando estilos Elementos de interface do usuário Symbols Propriedades do Símbolo Menus Pop-Up Behavior Wireframes Criar fatias Criar elementos interativos Parte Criar elementos interativos Parte Otimize gráficos web Compressão JPEG e compressão seletiva (também especialmente para o texto) Ferramenta Slice Ferramenta Hotspot URL Library

3 34. Preview ao vivo Visualizar no navegador Criando PDF s interativos Storyboard Slideshow Criar Mockups HTML AIR Prototype Exportar gráficos para todas as páginas de uma só vez Exportação CSS Favicon Gerenciamento de Cores Exportar para a biblioteca do Dreamweaver Flex Skinning Exportação MXML Integração Flash Flash Copiar e Colar com transparências Trabalho em equipe Extensões PNG: Suporte & Exportação Localizar e Substituir BOTÕES NO ESTILO IPHONE BOTAO NO ESTILO NINTENDO WII TEXTO EM 3D SELO DE DESTAQUE INTEGRAÇÃO ILLUSTRATOR BOTÃO ESTILO JEWEL GOTA D ÁGUA CRIANDO SEU ÍCONE RSS ÍCONE DE CONTATO CONCLUSÃO

4 INTRODUÇÃO O Fireworks é um editor de imagens de bitmap e desenho vetorial desenvolvido pela Macromedia, posteriormente adquirido pela Adobe. Suas funcionalidades focam a publicação gráfica na Internet, por isso inclui suporte a GIF animado, PNG e imagens fatiadas, além de possuir ótima compressão de imagens. A partir da versão MX, ganhou integração com outros produtos da mesma linha, Dreamweaver, Flash e Freehand. Com a aquisição da Macromedia em 2005 pela Adobe, houve um choque entre os seus programas, Fireworks e ImageReady, Dreamweaver e GoLive, Freehand e Illustrator. Assim, o objetivo da Adobe foi em criar um conjunto mais poderoso de soluções para a criação, gerenciamento e entrega de conteúdo e experiências atraentes em múltiplos sistemas operacionais, dispositivos e mídias. O desenvolvimento do ImageReady foi cancelado prevalecendo o Fireworks como editor gráfico para Internet. 4

5 01 50 VANTAGENS DO FIREWORKS O Adobe Fireworks é hoje a melhor ferramenta de crição para a Internet. Muitos Web designers opta pelo Photoshop para esta finalidade. Alguns por costume, outros por comodidade e alguns por não conhecerem a ferramenta. O especialista Adobe em Web Designer o alemão André Reinegger listou 50 comparações entre Fireworks e Photoshop e porque usar o Fireworks. Importante, em nenhum momento ele diz que o Photoshop não serve para WEB, ele apenas lista o porquê o Fireworks é melhor para esta função. O texto a seguir foi traduzido por Bruno Ávila, um dos mais respeitados Web Designers do Brasil. 1. Alinhamento Preciso com Pixels Em Propriedades, tanto a posição X e Y, bem como a largura e a altura de um objeto são mostrados. Isso permite a fácil edição de qualquer objeto na página com precisão de pixel. Primeiro, as mudanças podem ser feitas rapidamente e com precisão até 1 pixel. Esses valores podem ser lidos facilmente na hora da montagem e criação do CSS e HTML Tempo estimado: alguns segundos Os valores no painel de propriedades só podem ser vistos, mas não editados diretamente. As mudanças podem ser imprecisas utilizando apenas o mouse movimentando o objeto. Tempo estimado: segundos até minutos 5

6 2. Quick Infos Uma dica com informações é exibido quando passamos o cursor sobre o objeto. Ao trabalhar com guias, mantenha pressionada a tecla shift para mostrar as distâncias entre as guias. Muito conveniente! Não está disponível. 3. Retângulos arredondados Afora o fato de que os retângulos são vetores reais que podem ser modificadas precisamente sobre as propriedades, há a possibilidade de mais tarde, alterar facilmente o arredondamento das bordas a qualquer momento. Tempo estimado: alguns segundos Há uma ferramenta retângulo arredondado, onde o valor do raio deve ser definido primeiro. Você só vê o resultado depois de desenhar o retângulo. Uma vez estabelecida, as curvas só podem ser modificadas de forma muito demorada e imprecisa com o Direct-Selection-Tool. Tempo estimado: segundos até minutos 6

7 4. Largura de linha e cor de preenchimento A cor de preenchimento, traçado e largura de linha do contorno pode ser ajustada rapidamente no painel de propriedades. O mesmo se aplica texturas / padrões. Tempo estimado: alguns segundos Todas as mudanças para a cor de preenchimento, cor de contorno, peso da linha, textura, etc., devem ser adicionados e alterados em caixas de diálogo adicionais. Essas caixas de diálogo são confusas, não são tão eficientes, requerem mais cliques do mouse e cada seleção complica ainda mais a paleta de camadas. Tempo estimado: segundos até minutos 5. Gradientes Gradientes é simples e preciso facilmente editados de uma maneira confortável e intuitiva. Há também vários tipos de gradiente disponíveis. Tempo estimado: alguns segundos A ferramenta Gradiente não é muito intuitiva e tem um longo processo para produzir a inclinação desejada.. 7

8 Tempo estimado: segundos até minutos 6. Dithering gradients No Fireworks é possível ativar a função dithering para gradientes. Isso aumenta a qualidade do JPG, PNG e GIF de forma significativa. Muito conveniente! Somente disponível para a ferramenta de gradiente, o que não é intuitivo. Não disponível para o layer effects gradient. Não está disponível 7. Layer Styles e modos de mistura O Fireworks tem uma camada de estilos e modos de mistura. O Fireworks oferece quase o dobro de modos de mistura comparado ao Photoshop. Os modos de mistura e os efeitos também são bastante fáceis de selecionar assim como a mudança na paleta de propriedades. Tempo estimado: alguns segundos Estilos de camada devem ser selecionados na paleta camadas. Um ajuste das configurações só pode ser feito com uma caixa de diálogo extra. Você deve usar o painel Camadas para acessar essas configurações, o que torna 8

9 mais demorado. Tempo estimado: segundos até minutos 8. Escala sem distorção O Fireworks oferece a ferramenta de dimensionamento de 9 fatias em escala, sem a distorção de objetos. Você também pode dimensionar objetos com bordas arredondada, ou áreas protegidas usando a ferramenta de dimensionamento. Tempo estimado: alguns segundos Para dimensionar objetos, sem distorção, eles devem primeiro ser cortados em vários pedaços, em seguida, a parte do meio é escalonado e em seguida as camadas individuais são empilhadas. Tempo estimado: segundos até minutos 9. Funções Alinhar A paleta de alinhamento no Fireworks é muito extensa Os objetos podem ser alinhados em relação ao outro ou em relação à tela. Você também pode 9

10 facilmente redimensionar, combinar altura e largura entre objetos, organizar os objetos horizontalmente e verticalmente com base em percentual ou valor de pixel. Tempo estimado: alguns segundos Não disponível Photoshop oferece apenas as opções padrão para alinhar e organizar. Tempo estimado: segundos até minutos 10. Objetos Ocultos Se você passar o cursor sobre um objeto selecionado é destacado em vermelho. Depois que um objeto é selecionado, é exibido em azul. O mesmo vale para a ferramenta de subseção. Graças à ferramenta de seleção de fundo, ainda é possível selecionar os objetos que são completamente obscurecidos por outros elementos. Tempo estimado: alguns segundos A seleção não é tão intuitiva como no Fireworks. Mais uma vez, você deve procurar a paleta de camadas, a fim de encontrar objetos escondidos. Não há nenhuma maneira de selecionar objetos ocultos, sem realmente olhar para a paleta de layers. Tempo estimado: segundos até minutos 10

11 11. Alinhar texto ao redor de uma imagem É muito fácil anexar texto em um vetor alinhando o texto em torno de uma imagem. Tempo estimado: alguns segundos Para colocar o texto ao redor uma imagem são necessárias várias caixas de texto. É um processo muito mais complicado. Tempo estimado: segundos até minutos 12. Uso de caracteres especiais Fireworks contém um recurso especial para criar textos. Fireworks contém uma paleta de caracteres especiais que pode ser facilmente utilizado para inserir caracteres especiais. Muito conveniente! Não disponível 11

12 13. Modelos para o Layout Grades, banners Há todos os tipos de modelos úteis para documentos, tais como banners em todos os formatos, ícones de aplicativos, layouts, grades, etc. Muito conveniente! Não há modelos. Todos os modelos devem ser criados ou baixados através de pesquisa na internet. 14. Painel Camadas (Layers) O painel Layers no Fireworks não é uma parte central de trabalho. É muito raro que o trabalho deva ser feito utilizando apenas o painel de camadas. Os itens selecionados na tela são mostrados em azul, mudando para vermelho 12

13 quando selecionado. Tempo estimado: alguns segundos No Photoshop, trabalhar com camadas é essencial. Sem o painel de camadas você não pode fazer praticamente nada. Para cada mudança, precisamos de um estilo de camada ou uma camada de ajuste. Com o tempo, o painel de camadas vai ficando cada vez mais inflado e é difícil acompanhar. Muito tempo é gasto quando se trabalha com este painel, não sendo a maneira mais eficiente de trabalhar. Também é difícil obter uma visão geral do documento a partir deste painel já que a cada mudança faz crescer em tamanho. Tempo estimado: segundos até minutos 15. States-Panel (para MouseOver e Interatividade) Isto é especialmente importante para os elementos de navegação com diferentes estados. O Fireworks oferece o painel States que permite visualizar os diversos estados em uma paleta única. Desta forma, muitos estados podem ser definidos e vistos em uma área e são posteriormente exportados, ao mesmo tempo. Tempo estimado: alguns segundos Não disponível Photoshop não é uma ferramenta de layout, por isso esse recurso está completamente ausente. Para isso é feito uma gambiarra pelo usuário, criando o estado em diferente camadas e alterando a visibilidade das camadas. Tempo estimado: segundos até minutos 13

14 16. Camadas de compartilhamento entre os estados e as páginas Outra característica legal do Fireworks é a capacidade de compartilhar camadas entre os estados ou páginas. Isso permite que você transfira uma nova camada criada com alguns cliques do mouse em páginas selecionadas ou estados. Se o elemento é alterado depois, ele é automaticamente ajustado em todas as páginas ou estados. Tempo estimado: alguns segundos Não disponível Tempo estimado: segundos até minutos 17. Painel Páginas Como os sites são constituídos por várias subpáginas, é obviamente importante pensar em páginas na hora da criação também. Fireworks oferece um painel de páginas para fazer isso. Isto torna muito fácil alternar entre as páginas durante o processo de design além de criar links entre as páginas. 14

15 Usando Fn + seta você pode mover-se rapidamente entre as páginas também. Tempo estimado: alguns segundos Não disponível Photoshop não é uma ferramenta de layout, por isso esse recurso está completamente ausente. Usuários tentam resolver isso criando e alterando a visibilidade da camada ou criando vários arquivos. Tempo estimado: segundos até minutos 18. Master Page (alterações em todas as subpáginas) No Fireworks há uma página principal como no InDesign. É possível levar todos os elementos de design que se repetem em cada página. Assim, as mudanças entre páginas é fácil de fazer. Tempo estimado: alguns segundos Não disponível Photoshop não é uma ferramenta de layout, por isso esse recurso está completamente ausente. É cansativo ter que fazer todas as alterações para cada simples subpágina. Tempo estimado: segundos até minutos 15

16 19. Usando estilos Para repetidos elementos de layout você pode definir estilos. Semelhante a CSS, é possível alterar a aparência de um estilo alterando diversos elementos repetidos de uma vez só. Além disso, já existe uma ampla gama de bonitos estilos pré-definidos que você pode adaptar e usar. Tempo estimado: alguns segundos Há também uma variedade de estilos, mas as funções são muito rudimentares. Para resolver esse problema Smart-objects pode ser usado. Os objetos inteligentes são semelhantes aos símbolos do Fireworks. Tempo estimado: segundos até minutos 20.Elementos de interface do usuário Todos os elementos de interface padrão que aparecem em web design estão na biblioteca comum do Fireworks. Alguns podem até mesmo ser exportados 16

17 como verdadeiros elementos HTML para serem usados no navegador. Com o arrastar e soltar eles podem ser movidos a partir da biblioteca e colocado sobre a tela. Usando a ferramenta de 9 fatias podem ser facilmente dimensionados para o tamanho desejado. Há muitos outros elementos úteis na biblioteca comum como ícones, barras de menu, flex-componentes, etc. Além disso, seus próprios itens podem ser armazenados permanentemente na biblioteca para ser usado em vários projetos. Tempo estimado: alguns segundos No Photoshop, o uso de elementos da interface do usuário é muito complicado. Você deve copiá-los de outros sites ao tirar screenshots e colar. Então você tem que cortá-los e trazê-los de volta para o tamanho necessário, tendo que dividir em várias partes, escalonar e posicionar. Tempo estimado: segundos até minutos 21. Symbols Symbols (Símbolos) no Fireworks são como o Symbols do Flash. Elas são criadas através de F8, há opção de escolher entre gráficos, animação e símbolos de botão, e eles também acabam na biblioteca de documentos. Os símbolos são bem adaptados para o uso de ícones e elementos da interface do usuário. Além disso, estes símbolos podem ser levados facilmente com copiar e colar para o Flash. Muito conveniente! O recurso comparável de símbolos em PS se chama Smart Objects. Em termos de screendesign, os Symbols têm uma gama muito maior de recursos 17

18 que o Smart Objects. Não está disponível 22. Propriedades do Símbolo Graças às propriedades do símbolo, todos os atributos de um símbolo, como símbolo de valores, o status de ícones e elementos da interface do usuário pode ser facilmente alterado. Tempo estimado: alguns segundos Não disponível Tempo estimado: segundos até minutos 23. Menus Pop-Up Ambos os menus horizontal e vertical do tipo drop-down podem ser criados no Fireworks com poucos cliques. Estes são baseados em CSS e Javascript. Muito conveniente! Não está disponível 18

19 24. Behavior O behavior do painel funciona de forma semelhante ao Dreamweaver. Com ele, eventos de Javascript, tais como o rollover, troca de imagens, barras de navegação podem ser criados. Very convenient! Muito conveniente! Não está disponível 25. Wireframes No Fireworks é possível criar wireframes. O Fireworks oferece modelos para wireframes, podendo adicionar à biblioteca comum manualmente para poder usar em documentos. Muito conveniente! Não está disponível 19

20 26. Criar fatias Usando a ferramenta Slice pode-se dividir o projeto em elementos individuais. O painel de propriedades permite posicionar, dimensionar com exatidão de pixel e nomear cada slice (fatia). Ë possível definir estados mouseover para os slices. Você também pode definir os atributos da fatia na transferência em html, tais como a fixação de metas para o texto alternativo. Antes de exportar você pode definir cada fatia como imagem em primeiro plano, imagem de fundo ou HTML. Tempo estimado: alguns segundos O projeto pode ser dividido em segmentos que utilizam a ferramenta slice (fatia). As propriedades só podem ser ajustados em uma janela separada com poucas opções. Tempo estimado: segundos até minutos 27. Criar elementos interativos Parte 1 Utilizando cortes, estados e páginas é facilmente possível definir áreas como elementos interativos com mouseover, Javascript e hiperlinks. Assim, é 20

21 possível criar o protótipo perfeito de um site para o cliente. Muito conveniente! Não está disponível 28. Criar elementos interativos Parte 2 Fatias pode ser definidas como HTML, que permite que elementos interativos sejam inseridos. Isto permite criar protótipos totalmente funcionais, websites completos com animações em Flash, vídeo, Google Maps e assim por diante. Muito conveniente! Não está disponível 29. Otimize gráficos web É muito prático otimizar utilizando o seu painel. Dentro deste painel, você tem acesso rápido a todas as opções de otimização para cada fatia individual. 21

22 Além disso você pode ver imediatamente os resultados na visualização. Tempo estimado: alguns segundos. "Save for Web & Devices"tem que ser usado um de cada vez. Tempo estimado: segundos até minutos. 30. Compressão JPEG e compressão seletiva (também especialmente para o texto) É sabido que o Fireworks gera uma melhor qualidade de JPG em relação a compressão do arquivo. Além disso, é possível criar compressões selecionadas para JPG em Fireworks. Existe ainda uma opção especial especificamente para o texto que permite que o texto seja excluído da compressão. Muito conveniente! Não está disponível 31. Ferramenta Slice É possível exportar fatias individuais ou apenas áreas específicas dentro de um documento do Fireworks. Muito conveniente! Não está disponível 22

23 32. Ferramenta Hotspot A ferramenta Hotspot permite ao usuário criar vários links em uma única imagem, desenhando áreas de hotspot retangular, circular ou poligonal. Muito conveniente! Não está disponível 33. URL Library Hyperlinks usados dentro de um documento do Fireworks podem ser armazenados em uma biblioteca de URL para acessar rapidamente em caso de reutilização. Muito conveniente! Não está disponível 34. Preview ao vivo 23

24 Fireworks contém um "preview" onde você pode visualizar sua página web com elementos interativos, incluindo estados, gráficos otimizados e mouseovers. Você não tem que exportá-los e abrir no navegador para visualizar esses elementos. Muito conveniente! Não está disponível 35. Visualizar no navegador F12 (Alt + F12 no Mac) irá gerar uma versão HTML da página e apresentálo com todos os gráficos otimizados no Browser. A combinação de teclas Shift + Alt + F12 vai além e cria um preview de todas as páginas no navegador. Assim, você pode clicar em links, testar MouseOver e verificar todas as características de suas páginas web. Muito conveniente! Não está disponível 24

25 36. Criando PDF s interativos Com um único clique do mouse todas as páginas vinculadas podem ser exportadas como um PDF interativo. Você pode fornecer a seus clientes um PDF interativo, com navegação completa. Isso permite um rápido feedback dos clientes ao desenvolver um projeto. Tempo estimado: alguns segundos Como não é possível trabalhar com várias páginas no Photoshop, cada página deve ser exportada individualmente e combinadas em um arquivo PDF como um processo separado. Em seguida, as ligações entre as páginas devem ser criadas manualmente, o que é muito demorado. Tempo estimado: segundos até minutos 37. Storyboard Slideshow Imagens de páginas web podem ser convertidos para serem mostrados como uma apresentação em Flash. Isto torna mais fácil criar uma apresentação do site. Muito conveniente! Não está disponível 25

26 38. Criar Mockups HTML O Fireworks pode criar páginas HTML usando o recurso de exportação de HTML. Ele cria páginas web com base em tabelas que podem ser enviados para um servidor. Você pode, então, enviar ao cliente um hiperlink, para visualizar o site durante o processo de desenvolvimento. Este processo funciona tão bem, que você vai ter que lembrar o cliente que este é simplesmente um protótipo, não é o site concluído. Muito conveniente! Não está disponível 39. AIR Prototype Protótipos AIR (Adobe Integrated Runtime) podem ser gerados facilmente. Eles podem se comportar como widgets já incluindo livre flutuação no desktop com elementos interativos. Muito conveniente! Não está disponível 26

27 40. Exportar gráficos para todas as páginas de uma só vez Usando as várias opções, como "Somente imagens", "Camada de arquivos", "Estados de arquivos" e "Páginas de arquivos", você pode exportar todos os gráficos que você precisa para o seu site ao mesmo tempo. Tempo estimado: alguns segundos Não está disponível 41. Exportação CSS Usando a exportação, é possível exportar HTML e completar arquivos CSS para seu site. Esta função é um pouco complicada e deve ser otimizada pela Adobe. Muito conveniente! Não está disponível 27

28 42. Favicon É possível salvar um gráfico diretamente no formato favicon, que pode ser usado como ícone de favoritos no seu site. Muito conveniente! Não está disponível 43. Gerenciamento de Cores Não disponível, pois não é necessário. No Fireworks você cria gráficos no monitor para o monitor e não para impressos. Não Disponível Ao usar o Photoshop é preciso ter cuidado para usar o perfil de cor correto para o documento. 28

29 44. Exportar para a biblioteca do Dreamweaver Frequentemente usado para edição de websites, os componentes podem ser exportados para uso no Dreamweaver como itens da Biblioteca-DW. Muito conveniente! Não está disponível 45. Flex Skinning O Fireworks oferece uma categoria de "flex-componentes" em sua biblioteca geral. Esta biblioteca contém componentes padrão do Flex adequado para Flex Skinning. Muito conveniente! Não está disponível 29

30 46. Exportação MXML Nas configurações de exportação, existe a opção de exportar MXML. Juntamente com a capacidade de criar componentes Flex, você pode exportar diretamente do código MXML, facilitando a transformação para Rich Internet Applications em Flex. Muito conveniente! Não está disponível 47. Integração Flash É possível trazer gráficos, animações e botões criados no Fireworks, através do copiar e colar ou arrastar e soltar diretamente para o Flash. Isto também se aplica a qualquer outro elemento gráfico. Fireworks também pode armazenar arquivos nativos SWF. Muito conveniente! Não está disponível 30

31 48. Flash Copiar e Colar com transparências Os gráficos criados no Fireworks pode ser facilmente copiados, colados ou arrastados do Fireworks para o Flash. Todas as transparências e efeitos são preservados. Muito conveniente! Não disponível. As imagens podem ser copiadas e coladas para o Flash, mas toda a transparência é perdida. 49. Trabalho em equipe Quando se trabalha em projetos de equipe você pode substituir a biblioteca de documentos, símbolos e cores facilmente uns com os outros para que todos os membros da equipe sejam capazes de trabalhar com os mesmos elementos e estilos. Muito conveniente! Não está disponível 31

32 50. Extensões Para o Fireworks, existem inúmeras extensões que ampliam o programa permitindo funções adicionais Apenas algumas extensões disponíveis na Web 51. PNG: Suporte & Exportação Fireworks suporta 8, 24 e 32 Bit PNG com transparência alfa. Conveniente Photoshop suporta apenas PNG 8 e 24 bits. 52. Localizar e Substituir 32

33 No Fireworks, existe um recurso muito poderoso chamado "Localizar e substituir". O painel correspondente permite pesquisar a página atual, uma seleção especial ou vários arquivos e substituir o texto, a fonte, uma cor, uma URL e assim por diante. Isto torna possível pesquisar um monte de arquivos de uma só vez e fazer alterações ou substituir os elementos. Muito conveniente economiza muito tempo! Não está disponível Como pode ser visto acima, a análise foi feita por um profissional gabaritado e com experiência para falar sobre o assunto. Nas próximas páginas vamos explorar um pouco mais sobre esta fantástica ferramenta. 02 BOTÕES NO ESTILO IPHONE Inicie um novo arquivo com dimensão de 550x398 px e preencha-o com uma cor # Depois desenhe um retângulo com 100px de altura e com a mesma largura do palco de seu projeto. 33

34 Preencha-o com o seguinte gradiente. 34

35 Crie agora um retângulo de cantos arredondados com90x40 pixels e 6 de arredondamento. Aplique ao seu botão o seguinte gradiente. 35

36 Vamos agora aplicar os seguintes efeitos Photoshop Live effects. 36

37 Colocar a cor do stroke como #

38 Adicione sue texto. Aplique o seguinte efeito. 38

39 03 BOTAO NO ESTILO NINTENDO WII Uma das formas de se chamar atenção na Internet é de forma visual sem parecer tão diferente. Vamos neste exemplo aprender a criar um botão como o do console de vídeo game Nintendo WII. Inicie um novo arquivo no Fireworks e desenhe uma elipse. Preencha-a com branco Aplique um stroke na cor # e 1 px de largura. 39

40 Copie e cole sua circunferência, a cópia ficara por cima da branca. Clique no menu Modify, Transform, Numeric Transform e defina o valor em 95%. 40

41 Preenha com um gradiente radia de #FFFFFF para # Deixe com um Fetaher 2 Posicione a barra de seu gradiente da seguinte forma. Selecione a esfera modificada e a duplique, depois a diminua. Preencha com seguinte gradiente de #FFFFFF para #FFFFFF mas com o da direita em 0% de opacidade. 41

42 Selecione novamente a esfera que foi diminuída para 95%. Duplique-o novamente e deixe-o no topo da pilha. Diminua ele para 90%. Preencha-o de branco. 42

43 Usando a ferramenta elipse desenhe uma elipse muito grande para que ela forme um arco sobre o objeto duplicado. Selecione ambas as circunferências e clique no menu Modify, Combine Paths, Punch. 43

44 Aplique um gradiente no objeto de branco com 50% de opacidade na esquerda e 25% de opacidade na direita. Mantenha a régua de gradiente conforma a imagem abaixo. Acrescente um texto e aplique um sombra nele. 44

45 04 TEXTO EM 3D Crie um novo arquivo, desenhe um retângulo e preencha-o com um gradiente linear de cinza para branco. Adicione um texto. 45

46 Com a ferramenta de distorção deixe seu texto semelhante a imagem. Adicione 2 px de contorno na cor branca. Como estamos como texto é preciso utilizar um efeito. Use o Photoshop Live Effects. 46

47 Clique sobre seu texto com o botão direito do mouse e escolha Convert to Paths. Selecione todo seu texto e com botão direito escolha a opção Ungroup. 47

48 Clique no botão para escolha de estilos, escolha Shadows e depois Solid Shadow. Configure conforme a imagem. Será necessário acertar a ordem das letras pelo painel de Layers. 48

49 Deixe da seguinte forma. 49

50 Selecione todas as letras, clique na galeria de filtros Shadow and Glow, escolha Inner Shadow. 50

51 Duplique o texto, Aplique um efeito de brilho de -50% e diminua a opacidade para 10%. 51

52 Pela paleta Layers arraste a copia selecionada para baixo do primeiro texto e posicione conforma a imagem. Crie mais uma copia do texto retire os efeitos e preencha de preto. 52

53 Aplique nele um Gaussian Blur com valor 5. Diminua sua opacidade para 50% 53

54 Agrupe as letras e posicione entre os as outras duas copias. 05 SELO DE DESTAQUE Inicie um arquivo no Fireworks e importe uma imagem para dentro dele. Clique na ferramenta estrela e desenhe em sua tela. 54

55 Mude os pontos de sua imagem conforme a imagem. Agora preencha a sua forma com seguinte gradiente linear de #DDA600 para #FFEB77. Mantenha a régua da seguinte forma. Aplique um efeito Drop Shadow com as seguintes configurações. Escreva o texto principal no centro de sua forma, preencha com a cor #DDA

56 Copie e cole. Preencha de preto, com as setas direcionais mude para cima duas vezes e depois através no menu Modify Arrange o posicione um para trás ou mude através do painel Layers. Selecione o texto colorido copie e cole, depois preencha de branco e mova dois para baixo. Depois mova para trás. Coloque opacidade em 50% para os textos em preto e branco, para facilitar clique sobre eles no painel layers. 56

57 Desenhe uma elipse em sua forma. Se necessário aumente a forma ou diminua o texto. Selecione ambos os objetos e alinhe-os. Copie e cole a circunferencia. Diminua o tamanho da copia Selecione o primeiro texto e a circunferência menor. Clique no menu Texto Atach to path 57

58 Rotacione e mova para que ele fique melhor posicionado. Repita o processo para o texto de baixo. Clique no menu Text, Reverse Direction e o posicione na tela. Para o texto de cima coloque um kerning de 20 e a cor #CA9800. Para o de baixo um Kerning de 30 a cor #FFF2AA. 58

59 Selecione agrupe tudo. 06 INTEGRAÇÃO ILLUSTRATOR Primeiramente copie para seu computador o arquivo do mapa em vetor, você pode baixa-lo no endereço: Inicie um novo arquivo e importe o mapa. 59

60 Serão importados quatro mapas mundi e mais a tarja. Mantenha apenas o mapa laranja os demais podem ser apagados bem como a tarja. Pinte de preto e você verá que ele possui uam textura de fundo. Desagrupe de delete todas as camadas até ficar somente a do mapa. Ainda no preenchimento mude o Edge para HARD. 60

61 Aplique também uma textura Grid 4 com 100%. Clique em efeitos, Adjust Color, Invert. 61

62 Novamente na caixa de estilos, Others, Convert to Alpha. Crie um retângulo e preencha-o com o seguinte gradiente. Posicione atrás do mapa. Selecione o mapa e aplique os seguinte. Mude o Blend Mode para Luminosity. Aplique um filtro Adjust Color, Color Fill como a imagem. Um Drop Shadow como a imagem. 62

63 Experimente mudar a textura do mapa e mudar os blend modes. 63

64 07 BOTÃO ESTILO JEWEL Crie um retângulo com cantos arredondados. Aplique um gradiente radial de #85C2E8 para #6666FF. Posicione a régua de gradiente da seguinte forma. 64

65 Aplique um efeito de Inner Shadow com as seguintes configurações. Copie e cole. Clique no menu Modify, Transform, Numeric Transform. Coloque em resize e diminua 2 pixels em relação ao valor atual. Retire o preenchimento e adicione um contorno de 1 px na cor branca. Deixe a opacidade do objeto em 35%. Copie e cole o objeto que possui apenas o contorno. Preencha a copia de branco e diminua a opacidade para 15%. 65

66 Com a ferramenta Direct Selection, selecione três pontos do retângulo Use a tecla SHIFT. Pressione DELETE e confirme a caixa. 66

67 08 GOTA D ÁGUA Em um novo arquivo importe uma imagem para ficar de background da gora. No exemplo usei uma folha. Desenhe uma elipse e com a ferramenta Direct Selection clique nos pontos e deixe a sua forma como a imagem. Preencha com a cor #CCCCCC e contorno #B1B1B1. Mude o preenchimento para um gradiente radial de branco para o cinza já aplicado. Depois mude a régua conforme a imagem. 67

68 Aplique um Inner Shadow com as seguintes configurações. Copie e cole a gota e preencha de branco sem contorno e depois diminua o tamanho. Remova também o efeito. Desenhe um oval grande. Selecione a gota branca menor e o oval e clique no menu Modify, Combine Paths Punch. 68

69 Com a ferramenta Direct Selection, altere um pouco a forma. Preencha com um gradiente linear de branco para branco pra cinza #CCCCCC mas com 25% de opacidade. Deixe a régua conforme a imagem. 69

70 Desenhe uma elipse e preencha com preto. Mantenha a sua layer abaixo da gota. Preencha com um gradiente radia de preto para branco com um Feather de valor 4. Agrupe todos os objetos com exceção do fundo e coloque opacidade de 25%. 70

71 9 CRIANDO SEU ÍCONE RSS Inicie um arquivo de 300x300 com fundo branco e desenhe dentro dele um retângulo de cantos arredondados de 250x250px. Preencha-o com seguinte gradiente radial de #FFCD57 para #FCA

72 Selecione agora a ferramenta Donut e desenhe ela dentro do quadrado. Ela cria um círculo vazado, ou seja, com um vão, um buraco no meio. Clique no losango amarelo dentro do circulo e mova-o para deixar a largura da rosquinha mais curta. 72

73 Deixe seu circulo com 220 px. Gere uma copia dele e deixe com 150px. Clique no menu View Rulers para exibir as réguas e trace as seguintes linhas guias. 73

74 Desenhe o seguinte retângulo cobrindo o seu objeto. Selecione o retângulo e as duas formas Donut. Clique no menu modify, Combine Path Punch. 74

75 Repita o processo para o lado esquerdo dos semicírculos. 75

76 Desenhe um pequeno circulo branco. Aplique um efeito de Drop Shadow com as seguintes configurações. 76

77 10 ÍCONE DE CONTATO Em um novo arquivo do Fireworks, desenhe uma circunferência e preencha-a com um gradiente radia azul. 77

78 Crie um novo circulo menor que o primeiro. Preencha-o com um gradiente de branco para escuro e o escuro com opacidade em 0%. Crie agora um sinal de arroba e posicione-o conforme a imagem. 78

[CURSO DE FÉRIAS FIREWORKS] JULHO / 2011

[CURSO DE FÉRIAS FIREWORKS] JULHO / 2011 Conteúdo 1. OBJETIVO DO FIREWORKS... 2 1.1 - Diferença entre imagem Vetorial e Bitmap... 2 1.2 - Formato de Arquivos... 3 2. AMBIENTE DO FIREWORKS... 3 2.1 - INICIANDO UM PROJETO... 4 3. DESENHANDO NO

Leia mais

Plano de Aula - Fireworks CS5 - cód. 4084 16 Horas/Aula

Plano de Aula - Fireworks CS5 - cód. 4084 16 Horas/Aula Aula 1 Capítulo 1 - Introdução ao Fireworks CS5 Plano de Aula - Fireworks CS5 - cód. 4084 16 Horas/Aula 1.1. Novidades do Fireworks CS5...23 1.2. Área de Trabalho...24 1.2.1. Painel Ferramentas...25 1.2.2.

Leia mais

Introdução ao Fireworks CS4

Introdução ao Fireworks CS4 Introdução ao Fireworks CS4 Profa. Flávia Pereira de Carvalho Fontes: Adobe Fireworks CS4 Design para Web Processor Alfamídia Criação de Sites: Layout e Projetos - Processor Alfamídia Crie, Anime e Publique

Leia mais

Introdução ao Fireworks CS4

Introdução ao Fireworks CS4 Introdução ao Fireworks CS4 Profa. Flávia Pereira de Carvalho Fontes: Adobe Fireworks CS4 Design para Web Processor Alfamídia Criação de Sites: Layout e Projetos - Processor Alfamídia Crie, Anime e Publique

Leia mais

COREL DRAW Material exclusivo do Apostilando.com

COREL DRAW Material exclusivo do Apostilando.com COREL DRAW Material exclusivo do Apostilando.com ÍNDICE ÍNDICE... 2 INTRODUÇÃO... 3 A série... 3 01 - REFLEXOS... 4 02 DISCO VOADOR... 10 03 - LUPA... 13 04 RELÓGIO... 18 05 PIÃO... 22 06 BOTÃO MACINTOSH...

Leia mais

Altere o modo de mesclagem do círculo com o efeito para Multiply na paleta Transparency, em seguida, reduza a opacidade para cerca de 15%.

Altere o modo de mesclagem do círculo com o efeito para Multiply na paleta Transparency, em seguida, reduza a opacidade para cerca de 15%. CRIANDO UM RELÓGIO O principal ingrediente que nós vamos adicionar a este projeto, além de um monte de círculos para construir a forma geral, é uma gama de preenchimentos de gradiente. Estes gradientes

Leia mais

Prática 2 Características do Flash

Prática 2 Características do Flash Prática 2 Características do Flash 1. Objetivos Se familiarizar com os Painéis, Frames e Timelines. Desenvolver uma animação simples. 2. Recursos Necessários Computador com o programa Macromedia Flash

Leia mais

Corel Draw 12. Enviado por: Jair Marcolino Felix. Rua Dr. Osvaldo Assunção nº 72 Tucano BA Próximo a Escola de Artes e Ofícios (antigo CESG)

Corel Draw 12. Enviado por: Jair Marcolino Felix. Rua Dr. Osvaldo Assunção nº 72 Tucano BA Próximo a Escola de Artes e Ofícios (antigo CESG) Corel Draw 12 Enviado por: Jair Marcolino Felix Corel Draw 12 O Corel Draw é um programa de design gráfico pertencente à Corel.O Corel Draw é um aplicativo de ilustração e layout de página que possibilita

Leia mais

Desenhando no Flash. Comece um novo arquivo novo, de tamanho 500 X 300 pixels.

Desenhando no Flash. Comece um novo arquivo novo, de tamanho 500 X 300 pixels. Desenhando no Flash Os arquivos criados no Flash guardam e apresentam as informações gráficas vetorialmente. Isto significa que as imagens são entendidas como formas e preenchimentos e o que é armazenado

Leia mais

Banner Flutuante. Dreamweaver

Banner Flutuante. Dreamweaver Banner Flutuante Dreamweaver Começamos com um arquivo em branco no Dreamweaver MX. Para que o banner apareça sobre a página, precisamos inserir uma camada a mais no arquivo HTML. Selecione o menu Inserir

Leia mais

Macromedia Flash MX 1

Macromedia Flash MX 1 Macromedia Flash MX 1 Macromedia Flash MX 2 Universidade José do Rosário Vellano Bacharelado em Ciência da Computação Práticas de Ensino Alunos: Dayana Ribeiro de Castro Ferreira Luiz Ferreira Peçanha

Leia mais

Instrutor Alexandre - CorelDraw

Instrutor Alexandre - CorelDraw Quem não leu o meu primeiro tutorial, corra para ler, pois tem muitas dicas interessantes lá! Quem já leu, preparem-se para mais dicas!! Abra o COREL e coloque a folha na horizontal (paisagem). Feito assim

Leia mais

SUMÁRIO. Introdução 1

SUMÁRIO. Introdução 1 SUMÁRIO Introdução 1 Tela de Apresentação 1 Criando Figuras Simples 2 Linhas Curvas 3 Figuras Geométricas 4 Ferramenta Seleção 4 Desfazer e Repetir 4 Colorindo os Objetos 5 Ferramenta Zoom 5 Gravando,

Leia mais

2.1-Trabalhando com plano de fundo... 7 2.2-Compreendendo o funcionamento do plano de fundo... 8

2.1-Trabalhando com plano de fundo... 7 2.2-Compreendendo o funcionamento do plano de fundo... 8 NRTE CAMPINAS OESTE 2006 Índice 1.Trabalhando com o Publisher... 4 1.1- Iniciando com o catálogo... 4 1.2- Usando um assistente para alterar a publicação... 5 1.3 -Usando molduras... 5 1.4- Ferramentas...

Leia mais

Crie um novo documento de mais ou menos 300x300Selecione a ferramenta Elipse tool (elipse U)

Crie um novo documento de mais ou menos 300x300Selecione a ferramenta Elipse tool (elipse U) Animação Crie um novo documento de mais ou menos 300x300Selecione a ferramenta Elipse tool (elipse U) Crie uma bola segurando a tecla SHIFT com uma cor qualquer Duplique essa bola através do menu Editar

Leia mais

Plano de Aula - Dreamweaver CS6 - cód.5232 24 Horas/Aula

Plano de Aula - Dreamweaver CS6 - cód.5232 24 Horas/Aula Plano de Aula - Dreamweaver CS6 - cód.5232 24 Horas/Aula Aula 1 Capítulo 1 - Introdução ao Dreamweaver CS6 Aula 2 Continuação do Capítulo 1 - Introdução ao Dreamweaver CS6 Aula 3 Capítulo 2 - Site do Dreamweaver

Leia mais

APOSTILA DE DESENHO TÉCNICO NO COREL DRAW PROFESSORA GRAZIELA BRUNHARI KAULING UNIDADE 02: COREL DRAW

APOSTILA DE DESENHO TÉCNICO NO COREL DRAW PROFESSORA GRAZIELA BRUNHARI KAULING UNIDADE 02: COREL DRAW APOSTILA DE DESENHO TÉCNICO NO COREL DRAW PROFESSORA GRAZIELA BRUNHARI KAULING UNIDADE 02: COREL DRAW 1 INTRODUÇÃO ÀS FERRAMENTAS DO PROGRAMA COREL DRAW INTRODUÇÃO O Corel Draw é um programa de design

Leia mais

(Ilustração gerada no Sodipodi, tratada no gimp, Documento gerado no OpenOffice)

(Ilustração gerada no Sodipodi, tratada no gimp, Documento gerado no OpenOffice) (Ilustração gerada no Sodipodi, tratada no gimp, Documento gerado no OpenOffice) Tutorial Sodipoi Autor: Alexandre da silva costa Anakinpendragon (anakinpendragon@yahoo.com.br) Esse tutorial vem para

Leia mais

1 Crie uma pasta (dentro do seu diretório) com o seu nome. 2. Se tiver dúvida pergunte o seu professor

1 Crie uma pasta (dentro do seu diretório) com o seu nome. 2. Se tiver dúvida pergunte o seu professor i.exe FrontPage Criação de Home Page s PPaaggi innaa 1 Sobre FrontPage Parte 1 Front Page é uma ferramenta para criação e gerenciamento de web s.o aluno não necessita de nenhum conhecimento de programação

Leia mais

Índice Apresentando o software Programa aberto Criando nova animação Trabalhando as animações Ferramentas Abrir uma figura como animação

Índice Apresentando o software Programa aberto Criando nova animação Trabalhando as animações Ferramentas Abrir uma figura como animação Apostila Índice Apresentando o software...o que são GIF s animadas Programa aberto 2 Criando nova animação 3 Trabalhando as animações 3 Ferramentas 4 Abrir uma figura como animação 5 Barras de ferramentas

Leia mais

Capítulo 7 O Gerenciador de Arquivos

Capítulo 7 O Gerenciador de Arquivos Capítulo 7 O Gerenciador de Arquivos Neste capítulo nós iremos examinar as características da interface do gerenciador de arquivos Konqueror. Através dele realizaremos as principais operações com arquivos

Leia mais

Pré-requisito Conhecimento básico do sistema operacional Windows ou Mac OS.

Pré-requisito Conhecimento básico do sistema operacional Windows ou Mac OS. 1 e Descrição Este treinamento abortará conceitos essenciais de HTML e CSS para a construção de páginas web através do uso do Adobe, com a mínima necessidade de intervir ou escrever códigos, utilizando

Leia mais

Pág 31. UC Introdução a Informática Docente: André Luiz Silva de Moraes 1º sem Redes de Computadores. 5 Introdução ao uso do BrOffice Impress

Pág 31. UC Introdução a Informática Docente: André Luiz Silva de Moraes 1º sem Redes de Computadores. 5 Introdução ao uso do BrOffice Impress 5 Introdução ao uso do BrOffice Impress O pacote BrOffice é um pacote de escritório muito similar ao já conhecido Microsoft Office e ao longo do tempo vem evoluindo e cada vez mais ampliando as possibilidades

Leia mais

Clique no menu Iniciar > Todos os Programas> Microsoft Office > Publisher 2010.

Clique no menu Iniciar > Todos os Programas> Microsoft Office > Publisher 2010. 1 Publisher 2010 O Publisher 2010 é uma versão atualizada para o desenvolvimento e manipulação de publicações. Juntamente com ele você irá criar desde cartões de convite, de mensagens, cartazes e calendários.

Leia mais

Trabalhar com Layers em Photoshop

Trabalhar com Layers em Photoshop Painel Layers / Camadas Trabalhar com Layers em Photoshop Existem cinco tipos de layers / camadas, que podem estar listados neste painel: - de imagem, contendo pixéis - de texto, com texto editável - de

Leia mais

Para alterar o texto diretamente na página selecione a ferramenta Texto e clique sobre o bloco de texto parágrafo ou artístico.

Para alterar o texto diretamente na página selecione a ferramenta Texto e clique sobre o bloco de texto parágrafo ou artístico. Quando precisarmos utilizar trechos de texto mais longos, como frases inteiras e parágrafos, utilizaremos o recurso Texto Parágrafo. Para iniciarmos um texto parágrafo selecionamos a ferramenta Texto e

Leia mais

BrOffice Impress Módulo 06 ÍNDICE

BrOffice Impress Módulo 06 ÍNDICE ÍNDICE VÍDEO 1 Trabalhando com o BrOffice.org Impress VÍDEO 2 Conhecendo o BrOffice.org Impress VÍDEO 3 Criando uma nova apresentação VÍDEO 4 Estrutura de tópicos VÍDEO 5 Layout VÍDEO 6 Trabalhando com

Leia mais

Prática 3 Princípios da Animação

Prática 3 Princípios da Animação Prática 3 Princípios da Animação As animações em um site são bem discutidas quanto ao seu uso, pois, qualquer coisa que se movimenta na visão periférica ocupa lugar na consciência. Isso faz com que o usuário

Leia mais

Abra um novo documento com tamanho 468x60 e adicione um fundo na cor branca, vamos montar a primeira moldura do nosso banner.

Abra um novo documento com tamanho 468x60 e adicione um fundo na cor branca, vamos montar a primeira moldura do nosso banner. FIREWORKS 1- BANNER ANIMADO - banner tamanho 468 x 60px (full banner). Abra um novo documento com tamanho 468x60 e adicione um fundo na cor branca, vamos montar a primeira moldura do nosso banner. Agora

Leia mais

ÍNDICE... 2 INTRODUÇÃO... 3. A série... 3

ÍNDICE... 2 INTRODUÇÃO... 3. A série... 3 PHOTOSHOP CS5 ÍNDICE ÍNDICE... 2 INTRODUÇÃO... 3 A série... 3 01 - BOTÃO TRABALHADO... 3 02 - MUDANDO A COR DE CABELOS... 8 03 - QUEBRA CABEÇA... 11 04 TRATAMENTOS DE PELE... 16 05 MINI BOTÕES - WEB...

Leia mais

INDÍCE. Esta apostila foi baixada do site Geek Brasil http://www.geekbrasil.com.br

INDÍCE. Esta apostila foi baixada do site Geek Brasil http://www.geekbrasil.com.br INDÍCE Visão Geral: Introdução ao Fireworks...2 Ferramentas de desenho...3 Pintar o traço e o preenchimento...3 Botões JavaScript...5 Criar um botão...5 Duplicar o botão...12 Rollovers sofisticados...14

Leia mais

Sumário - Power Point

Sumário - Power Point Power Point Sumário - Power Point 1. INICIANDO O POWERPOINT... 116 2. APRESENTAÇÃO DA JANELA DO POWERPOINT... 117 3. CONCEITOS BÁSICOS DO POWERPOINT... 118 4. INICIANDO UMA APRESENTAÇÃO... 118 4.1 Autolayouts

Leia mais

Barra de Títulos. Barra de Menu. Barra de Ferramentas. Barra de Formatação. Painel de Tarefas. Seleção de Modo. Área de Trabalho.

Barra de Títulos. Barra de Menu. Barra de Ferramentas. Barra de Formatação. Painel de Tarefas. Seleção de Modo. Área de Trabalho. Conceitos básicos e modos de utilização das ferramentas, aplicativos e procedimentos do Sistema Operacional Windows XP; Classificação de softwares; Principais operações no Windows Explorer: criação e organização

Leia mais

Adobe Photoshop CS5. Aula 5

Adobe Photoshop CS5. Aula 5 Adobe Photoshop CS5 Aula 5 Tema da aula: Mudando a cor dos olhos Assuntos tratados nesta aula: Criar nova camada Renomear camada Ferramenta Zoom Ferramenta Pincel Definindo Cor do Primeiro Plano Regulagem

Leia mais

MULTIMÍDIA - GIMP TRABALHANDO COM TEXTOS

MULTIMÍDIA - GIMP TRABALHANDO COM TEXTOS MULTIMÍDIA - GIMP TRABALHANDO COM TEXTOS Utilizando Camadas As camadas representam uma forma efetiva para organização do trabalho. Podemos imaginar as camadas como películas sobrepostas onde podemos desenhar.

Leia mais

Apostila de CmapTools 3.4

Apostila de CmapTools 3.4 Apostila de CmapTools 3.4 Índice Definição do software... 3 Criando um novo mapa... 3 Adicionando um conceito... 3 Alterando a formatação das caixas (Barra de Ferramentas Estilos Paleta Styles)... 7 Guia

Leia mais

1. ACESSO AO SISTEMA. LOGIN E SENHA Para ter acesso ao painel administrativo de seu site, acesse o link: http://atualiza.urldosite.com.

1. ACESSO AO SISTEMA. LOGIN E SENHA Para ter acesso ao painel administrativo de seu site, acesse o link: http://atualiza.urldosite.com. Manual de uso 1. ACESSO AO SISTEMA LOGIN E SENHA Para ter acesso ao painel administrativo de seu site, acesse o link: http://atualiza.urldosite.com.br Após acessar o link acima, favor digitar seu LOGIN

Leia mais

Sobre a Segunda Parte: Sobre a Primeira Parte:

Sobre a Segunda Parte: Sobre a Primeira Parte: Tutorial Sobre Como Criar Sprites 3D Utilizando o Editor Gráfico do Word e Sobre Como Manipular Sprites Criados no Word Utilizando o Programa de Criação de Jogos Game Maker Sobre a Primeira Parte: Esta

Leia mais

Introdução Microsoft PowerPoint 2013 apresentações Office PowerPoint 2013 Microsoft PowerPoint 2013 textos planilhas Excel Word

Introdução Microsoft PowerPoint 2013 apresentações Office PowerPoint 2013 Microsoft PowerPoint 2013 textos planilhas Excel Word PowerPoint 2013 Sumário Introdução... 1 Iniciando o PowerPoint 2013... 2 Criando Nova Apresentação... 10 Inserindo Novo Slide... 13 Formatando Slides... 15 Inserindo Imagem e Clip-art... 16 Inserindo Formas...

Leia mais

TUTORIAL: Criando e animando sprites no Inkscape

TUTORIAL: Criando e animando sprites no Inkscape TUTORIAL: Criando e animando sprites no Inkscape Pra quem não sabe, o Inkscape é um programa de desenho vetorial, assim como o Illustrator da Adobe, porém é software livre. Atualmente encontra-se na versão

Leia mais

Capítulo 12 Criando Páginas Web

Capítulo 12 Criando Páginas Web Guia do Iniciante Capítulo 12 Criando Páginas Web Salvando documentos como arquivos HTML Direitos Autorais Este documento é protegido por Copyright 2010 por seus contribuidores listados abaixo. Você pode

Leia mais

O OpenOffice.org Impress

O OpenOffice.org Impress 1 O OpenOffice.org Impress O OpenOffice.org Impress é uma ferramenta excelente para a criação de apresentações multimídia realmente eficientes. Suas apresentações vão brilhar com figuras, efeitos especiais,

Leia mais

Slice Tool - Ferramenta Fatia

Slice Tool - Ferramenta Fatia Faculdade de Tecnologia da Paraíba CURSO CURSO SUPERIOR DE TECNOLOGIA EM SISTEMAS PARA A INTERNET DISCIPLINA DESENVOLVIMENTO DE APLICAÇÕES WEB ESTÁTICAS PERÍODO: P2 Semestre: 2008.2 PROFESSOR Geraldo Rodrigues

Leia mais

CorelDRAW 11 1. UM PROGRAMA DE DESIGN

CorelDRAW 11 1. UM PROGRAMA DE DESIGN CorelDRAW 11 1. UM PROGRAMA DE DESIGN Com o Corel você vai trabalhar com um dos aplicativos mais usados no campo do design e da auto-edição, já que permite operar com dois tipos de gráficos (vetoriais

Leia mais

BrOffice.org - Impress

BrOffice.org - Impress BrOffice.org Impress 1 BrOffice.org - Impress Programa de apresentação, utilizado para criação e manipulação de slides. Os slides criados para uma eletrônica podem conter texto, gráficos, objetos, formas,

Leia mais

Apostila para uso do Power Point

Apostila para uso do Power Point Apostila para uso do Power Point Introdução O Power Point, é um aplicativo da MicroSoft desenvolvido para a elaboração de apresentações. Possui recursos de hipertexto e multimídia como som, imagem, animação,

Leia mais

Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado.

Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado. , ()! $ Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado. Uma estratégia muito utilizada para organizar visualmente informações numéricas

Leia mais

Montar planilhas de uma forma organizada e clara.

Montar planilhas de uma forma organizada e clara. 1 Treinamento do Office 2007 EXCEL Objetivos Após concluir este curso você poderá: Montar planilhas de uma forma organizada e clara. Layout da planilha Inserir gráficos Realizar operações matemáticas 2

Leia mais

PS02_02-08: Exercícios: Photoshop CS3. Objetivo: FERRAMENTAS DE PINTURA. 1) Abra um novo arquivo e altere os valores para a seguinte configuração:

PS02_02-08: Exercícios: Photoshop CS3. Objetivo: FERRAMENTAS DE PINTURA. 1) Abra um novo arquivo e altere os valores para a seguinte configuração: PS02_02-08: Objetivo: FERRAMENTAS DE PINTURA Exercícios: 1) Abra um novo arquivo e altere os valores para a seguinte configuração: 2) Finalize a configuração. A janela da imagem, também chamada de tela

Leia mais

Aprendendo Corel Draw 2

Aprendendo Corel Draw 2 ÍNDICE Introdução Ferramentas do Trabalhando com cores Trabalhando com objetos Transformando objetos desenhados Clonagem de objetos Formatando objetos Preenchimentos e Contornos Preenchimento Gradiente

Leia mais

Trabalhando com Imagens no Word XP

Trabalhando com Imagens no Word XP Table of Contents Trabalhando com imagens...1 A barra de desenho...2 Tela de desenho...2 Caixa de Texto...3 Linha...4 Seta...4 Retângulo (e quadrado)...5 Elipse (e círculo)...5 AutoFormas...6 Modificação

Leia mais

Sumário. Computação Gráfica Illustrator

Sumário. Computação Gráfica Illustrator 1 Sumário Área de trabalho... 2 Barra de tarefas... 5 Menu ajuda... 6 Menu janela... 7 Menu exibir... 8 Menu efeito... 9 Menu selecionar... 10 Menu tipo... 10 Menu objeto... 12 Menu editar... 13 Menu arquivo...

Leia mais

Seleção Retangular Esta é uma das ferramentas mais usadas. A seleção será indicada pelas linhas tracejadas que fazem a figura de um retângulo.

Seleção Retangular Esta é uma das ferramentas mais usadas. A seleção será indicada pelas linhas tracejadas que fazem a figura de um retângulo. O que é o Gimp? O GIMP é um editor de imagens e fotografias. Seus usos incluem criar gráficos e logotipos, redimensionar fotos, alterar cores, combinar imagens utilizando o paradigma de camadas, remover

Leia mais

Conteúdo Programático do Web Design

Conteúdo Programático do Web Design Conteúdo Programático do Web Design O Ambiente Macromedia Dreamweaver Instalação do Dreamweaver Arquivos Utilizados na Apostila A Inicialização de Dreamweaver Área de Trabalho Dreamweaver Criação de uma

Leia mais

Noções de Informática

Noções de Informática Noções de Informática 2º Caderno Conteúdo Microsoft Excel 2010 - estrutura básica das planilhas; manipulação de células, linhas e colunas; elaboração de tabelas e gráficos; inserção de objetos; campos

Leia mais

UNIVERSIDADE FEDERAL DO PARÁ INSTITUTO DE CIÊNCIAS EXATAS E NATURAIS ESPECIALIZAÇÃO EM ESTATÍSTICAS EDUCACIONAIS. Prof. M.Sc.

UNIVERSIDADE FEDERAL DO PARÁ INSTITUTO DE CIÊNCIAS EXATAS E NATURAIS ESPECIALIZAÇÃO EM ESTATÍSTICAS EDUCACIONAIS. Prof. M.Sc. UNIVERSIDADE FEDERAL DO PARÁ INSTITUTO DE CIÊNCIAS EXATAS E NATURAIS ESPECIALIZAÇÃO EM ESTATÍSTICAS EDUCACIONAIS Microsoft Office PowerPoint 2007 Prof. M.Sc. Fábio Hipólito Julho / 2009 Visite o site:

Leia mais

Microsoft Office FrontPage 2003

Microsoft Office FrontPage 2003 Instituto Politécnico de Tomar Escola Superior de Gestão Área Interdepartamental de Tecnologias de Informação e Comunicação Microsoft Office FrontPage 2003 1 Microsoft Office FrontPage 2003 O Microsoft

Leia mais

Mozart de Melo Alves Júnior

Mozart de Melo Alves Júnior Mozart de Melo Alves Júnior WORD 2000 INTRODUÇÃO: O Word é um processador de texto com recursos de acentuação, formatação de parágrafo, estilo de letras diferentes, criação de tabelas, corretor ortográfico,

Leia mais

Continuação. 32. Inserir uma imagem da GALERIA CLIP-ART

Continuação. 32. Inserir uma imagem da GALERIA CLIP-ART Continuação 32. Inserir uma imagem da GALERIA CLIP-ART a) Vá para o primeiro slide da apresentação salva no item 31. b) Na guia PÁGINA INICIAL, clique no botão LAYOUT e selecione (clique) na opção TÍTULO

Leia mais

ROBERTO OLIVEIRA CUNHA

ROBERTO OLIVEIRA CUNHA LEIAME Nenhuma informação do TUTORIAL DO PHOTO- SHOP CS 8.0 poderá ser copiada, movida ou modificada sem autorização prévia e escrita do Programador Roberto Oliveira Cunha. Programador: Roberto Oliveira

Leia mais

Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico.

Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico. Trabalhar com layout Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico. Neste tutorial, você criará um pôster para uma cafeteria imaginária.

Leia mais

Fotografia Digital. Aula 1

Fotografia Digital. Aula 1 Fotografia Digital Aula 1 FOTOGRAFIA DIGITAL Tema da aula: A Fotografia 2 A FOTOGRAFIA A palavra Fotografia vem do grego φως [fós] ("luz"), e γραφις [grafis] ("estilo", "pincel") ou γραφη grafê, e significa

Leia mais

Tutorial Paint Brush

Tutorial Paint Brush Tutorial Paint Brush GET da Engenharia Computacional Curso de Mídias Digitais Jan 17, 2011 GET da Engenharia Computacional Tutorial Paint Brush 1/27 O Paint é um programa utilizado para a criação de desenhos

Leia mais

Sumário INTRODUÇÃO 3 DICAS PARA CRIAR UM BOM SITE 4

Sumário INTRODUÇÃO 3 DICAS PARA CRIAR UM BOM SITE 4 Sumário Todos os direitos reservados e protegidos pela Lei 5.988 de 14/12/73. Nenhuma parte deste livro, sem prévia autorização por escrito de Celta Informática, poderá ser reproduzida total ou parcialmente,

Leia mais

Microsoft Office Excel

Microsoft Office Excel 1 Microsoft Office Excel Introdução ao Excel Um dos programas mais úteis em um escritório é, sem dúvida, o Microsoft Excel. Ele é uma planilha eletrônica que permite tabelar dados, organizar formulários,

Leia mais

O Adobe Photoshop é um CAD (Computer Aided Design), cuja principal característica é edição de imagens.

O Adobe Photoshop é um CAD (Computer Aided Design), cuja principal característica é edição de imagens. Introdução O Adobe Photoshop é um CAD (Computer Aided Design), cuja principal característica é edição de imagens. A evolução dos sistemas CAD ocorre com grande velocidade. Hoje temos sistemas específicos

Leia mais

8VDQGR5HSRUW0DQDJHUFRP&ODULRQH3RVWJUH64/ -XOLR&HVDU3HGURVR $,'(GR5HSRUW0DQDJHU

8VDQGR5HSRUW0DQDJHUFRP&ODULRQH3RVWJUH64/ -XOLR&HVDU3HGURVR $,'(GR5HSRUW0DQDJHU $,'(GR5HSRUW0DQDJHU Neste capítulo vamos abordar o ambiente de desenvolvimento do Report Manager e como usar os seus recursos. $FHVVDQGRRSURJUDPD Depois de instalado o Report Manager estará no Grupo de

Leia mais

Lição3 Adobe Photoshop CS5. Princípios Básicos de Camadas. Utilize o painel Layers e copie uma camada a partir de um arquivo

Lição3 Adobe Photoshop CS5. Princípios Básicos de Camadas. Utilize o painel Layers e copie uma camada a partir de um arquivo Lição3 Adobe Photoshop CS5 Princípios Básicos de Camadas CENTRO DE ENSINO SUPERIOR DO AMAPÁ O Adobe Photoshop permite isolar diferentes partes de uma imagem em camadas. Cada camada pode ser editada como

Leia mais

Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico.

Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico. Vetorizar imagens Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico. Neste tutorial, você irá vetorizar uma imagem de bitmap para convertê-la

Leia mais

O TUX VAI À ESCOLA: UMA INTRODUÇÃO À EDIÇÃO DE IMAGEM COM O GIMP

O TUX VAI À ESCOLA: UMA INTRODUÇÃO À EDIÇÃO DE IMAGEM COM O GIMP O TUX VAI À ESCOLA: UMA INTRODUÇÃO À EDIÇÃO DE IMAGEM COM O GIMP O GIMP (GNU Image Manipulation Program) (http://www.gimp.org/) é uma aplicação de Software Livre para desenho e edição de imagem digital.

Leia mais

7 Introdução ao uso do LibreOffice Impress

7 Introdução ao uso do LibreOffice Impress Introdução a Informática - 1º semestre AULA 04 Prof. André Moraes Objetivos desta aula: Criar apresentações básicas com uso do LibreOffice Impress; o Manipular a estrutura de tópicos para a digitação de

Leia mais

IMPRESS Trata-se do software pertencente ao pacote BrOffice.org, seu papel é a criação de apresentações

IMPRESS Trata-se do software pertencente ao pacote BrOffice.org, seu papel é a criação de apresentações IMPRESS Trata-se do software pertencente ao pacote BrOffice.org, seu papel é a criação de apresentações O que é uma Apresentação? É um arquivo em que são exibidos textos, gráficos, imagens, sons e animações,

Leia mais

Curso de Adobe Illustrator CS4

Curso de Adobe Illustrator CS4 Curso de Adobe Illustrator CS4 Apresentação do Programa O Adobe Illustrator CS4 é um programa de desenho e ilustração vectorial, que coloca à disposição dos profissionais poderosas ferramentas para a concepção

Leia mais

Tour pela área de trabalho

Tour pela área de trabalho Tour pela área de trabalho Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico. Neste tutorial, você se familiarizará com a terminologia

Leia mais

1. Introdução ao Adobe Illustrator CC. 2.6. Ferramentas de Seleção e Visualização. 1.1. Novidades do Illustrator CC. 3. Desenho. 1.2.

1. Introdução ao Adobe Illustrator CC. 2.6. Ferramentas de Seleção e Visualização. 1.1. Novidades do Illustrator CC. 3. Desenho. 1.2. 1. Introdução ao Adobe Illustrator CC 1.1. Novidades do Illustrator CC 1.2. Abrir o Programa 1.3. Criar um Novo Documento 1.4. Área de Trabalho 1.4.1. Paletas e Painéis 1.4.2. Menus de Contexto 1.4.3.

Leia mais

Guia do Iniciante. Capítulo 11 Gráficos, Galeria e Fontwork

Guia do Iniciante. Capítulo 11 Gráficos, Galeria e Fontwork Guia do Iniciante Capítulo 11 Gráficos, Galeria e Fontwork Direitos Autorais Este documento é protegido por Copyright 2010 por seus contribuidores listados abaixo. Você pode distribuir e/ou modificar este

Leia mais

Guia do Iniciante. Capítulo 11 Gráficos, Galeria e Fontwork

Guia do Iniciante. Capítulo 11 Gráficos, Galeria e Fontwork Guia do Iniciante Capítulo 11 Gráficos, Galeria e Fontwork Direitos Autorais Este documento é protegido por Copyright 2010 por seus contribuidores listados abaixo. Você pode distribuir e/ou modificar este

Leia mais

Linux. Educacional. Tutorial Buzzword

Linux. Educacional. Tutorial Buzzword Linux Educacional Tutorial Buzzword Para trabalhar com o programa Buzzword online, é necessário que crie uma conta no site. Para isso acesse o endereço - https://buzzword.acrobat.com/ Para criar uma conta

Leia mais

Dados contadores de história. Qlik Sense 1.1 Copyright 1993-2015 QlikTech International AB. Todos os direitos reservados.

Dados contadores de história. Qlik Sense 1.1 Copyright 1993-2015 QlikTech International AB. Todos os direitos reservados. Dados contadores de história Qlik Sense 1.1 Copyright 1993-2015 QlikTech International AB. Todos os direitos reservados. Copyright 1993-2015 QlikTech International AB. Todos os direitos reservados. Qlik,

Leia mais

Tour pela área de trabalho

Tour pela área de trabalho Tour pela área de trabalho Bem-vindo ao CorelDRAW, um programa abrangente de desenho e design gráfico baseado em vetor para o profissional gráfico. Neste tutorial, você se familiarizará com a terminologia

Leia mais

Centro de Competência Entre Mar e Serra. Guia

Centro de Competência Entre Mar e Serra. Guia SMART Notebook Software Guia O Software Notebook permite criar, organizar e guardar notas num quadro interactivo SMART Board (em modo projectado e não-projectado), num computador pessoal e, em seguida,

Leia mais

ADOBE MUSE. Criando seu primeiro site

ADOBE MUSE. Criando seu primeiro site ADOBE MUSE Criando seu primeiro site Sumário Capítulo 1 Instalar o software e configurar o projeto de amostra Criar um mapa do site Editar a página A-mestre Definir a paleta de cores e renomear amostras

Leia mais

WINDOWS EXPLORER Pro r f. f. R o R be b rt r o t A n A d n r d a r de d

WINDOWS EXPLORER Pro r f. f. R o R be b rt r o t A n A d n r d a r de d WINDOWS EXPLORER Prof. Roberto Andrade Roteiro desta aula 1. OqueéoWindowsExplorer 2. Acionamento do Windows Explorer 3. Entendendo Unidades, Pastas e Arquivos 4. Ambiente gráfico(janela, Barras e Botões)

Leia mais

CRIAR UMA ANIMAÇÃO BÁSICA NO FLASH MX

CRIAR UMA ANIMAÇÃO BÁSICA NO FLASH MX CRIAR UMA ANIMAÇÃO BÁSICA NO FLASH MX Introdução Este tutorial vai-te ajudar a compreender os princípios básicos do Flash MX - tal como layers, tweens, cores, texto, linhas e formas. No final deste tutorial

Leia mais

Introdução ao Adobe Flash CS4

Introdução ao Adobe Flash CS4 Principais Arquivos do Flash http://tv.adobe.com/show/learn-flash-professional-cs4/ Introdução ao Adobe Flash CS4 Profa. Flávia Pereira de Carvalho Fontes: Adobe Flash CS4 Design para Web Processor Alfamídia

Leia mais

FOXIT READER 6.0 Guia Rápido. Sumário... II Use o Foxit Reader 6.0... 1. Leitura... 5. Trabalhar em PDFs... 8. Comentários... 10. Formulários...

FOXIT READER 6.0 Guia Rápido. Sumário... II Use o Foxit Reader 6.0... 1. Leitura... 5. Trabalhar em PDFs... 8. Comentários... 10. Formulários... Sumário Sumário... II Use o Foxit Reader 6.0... 1 Instalar e desinstalar... 1 Abrir, Criar, Fechar, Salvar e Sair... 1 Definir o estilo da interface e da aparência... 4 Veja todas as diferentes ferramentas...

Leia mais

Utilização do ADOBE FIREWORKS CS5

Utilização do ADOBE FIREWORKS CS5 Utilização do ADOBE FIREWORKS CS5 Avisos legais Avisos legais Para avisos legais, consulte http://help.adobe.com/pt_br/legalnotices/index.html. iii Conteúdo Capítulo 1: O que há de novo O que há de novo.....................................................................................................

Leia mais

XXIV SEMANA MATEMÁTICA

XXIV SEMANA MATEMÁTICA XXIV SEMANA ACADÊMICA DA MATEMÁTICA Minicurso: Produção de Páginas Web para Professores de Matemática Projeto de Extensão: Uma Articulação entre a Matemática e a Informática como Instrumento para a Cidadania

Leia mais

Material desenvolvido por Melissa Lima da Fonseca. melissa.mlf@gmail.com.br - (031) 9401-4041. www.melissalima.com.br Página 1

Material desenvolvido por Melissa Lima da Fonseca. melissa.mlf@gmail.com.br - (031) 9401-4041. www.melissalima.com.br Página 1 EXCEL BÁSICO Material desenvolvido por Melissa Lima da Fonseca melissa.mlf@gmail.com.br - (031) 9401-4041 www.melissalima.com.br Página 1 Índice Introdução ao Excel... 3 Conceitos Básicos do Excel... 6

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft Word 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Barra de Ferramentas de Acesso Rápido

Leia mais

Pré-requisitos para fazer este curso É necessário possuir conhecimentos em informática básica, internet e muita vontade para aprender.

Pré-requisitos para fazer este curso É necessário possuir conhecimentos em informática básica, internet e muita vontade para aprender. Descrição do curso O curso de Edição Profissional de Imagens com o Photoshop CS6 Extended foi desenvolvido para que o aluno obtenha todas as habilidades necessárias para, ao final do mesmo, ser capaz de

Leia mais

Parte I Introdução ActionScript_30_01.indd 1 5/11/2010 08:29:29

Parte I Introdução ActionScript_30_01.indd 1 5/11/2010 08:29:29 Parte I Introdução ActionScript_30_01.indd 1 5/11/2010 08:29:29 ActionScript_30_01.indd 2 5/11/2010 08:29:34 Aprendendo uma nova linguagem... ActionScript é uma linguagem e, como um novo idioma ou a linguagem

Leia mais

Conceitos do Photoshop. Bitmap image Formatos de arquivos Memória Escalas de cores

Conceitos do Photoshop. Bitmap image Formatos de arquivos Memória Escalas de cores Conceitos do Photoshop Bitmap image Formatos de arquivos Memória Escalas de cores Bitmap Image Conceito de pixel Imagem bitmap x imagem vetorial Pixel x bits Resolução de tela e imagem 72 pixel/inch 300

Leia mais

Universidade Federal do Mato Grosso - STI-CAE. Índice

Universidade Federal do Mato Grosso - STI-CAE. Índice CAPA Universidade Federal do Mato Grosso - STI-CAE Índice 1. Página da área administrativa... 1.1 Botões e campo iniciais... 2. Explicar como funcionam as seções... 2.1. Seções dinâmicos... 2.1.1 Como

Leia mais

MÓDULO - I Manual Prático Microsoft Excel 2007

MÓDULO - I Manual Prático Microsoft Excel 2007 MÓDULO - I Manual Prático Microsoft Excel 2007 MÓDULO - I APRESENTAÇÃO... 1 AMBIENTE DE TRABALHO... 2 A folha de cálculo... 2 O ambiente de trabalho do Excel... 3 Faixas de Opções do Excel... 4 - Guia

Leia mais

Microsoft Power Point - Manual de Apoio

Microsoft Power Point - Manual de Apoio Microsoft Power Point - Manual de Apoio Pág. 1 de 26 Apresentação e introdução O ambiente de trabalho do Power Point. Abrir, guardar e iniciar apresentações. Obter ajuda enquanto trabalha. Principais barras

Leia mais

W o r d p r e s s 1- TELA DE LOGIN

W o r d p r e s s 1- TELA DE LOGIN S U M Á R I O 1Tela de Login...2 2 Painel......3 3 Post...4 4 Ferramentas de Post...10 5 Páginas...14 6 Ferramentas de páginas...21 7 Mídias...25 8 Links......30 1 1- TELA DE LOGIN Para ter acesso ao wordpress

Leia mais

6.5. Renomeando Arquivos ou Pastas

6.5. Renomeando Arquivos ou Pastas 50 II. Para mover um arquivo, pasta, objeto dentro do Windows: 1) Clique com o mouse sobre a pasta, arquivo a serem movidos; 2) Mantenha o botão esquerdo do mouse pressionado; 3) Arraste o objeto para

Leia mais

Centro de Competência Entre Mar e Serra. Guia

Centro de Competência Entre Mar e Serra. Guia SMART Notebook Software Guia O Software Notebook permite criar, organizar e guardar notas num quadro interactivo SMART Board (em modo projectado e não-projectado), num computador pessoal e, em seguida,

Leia mais

MICROSOFT PowerPoint 2000 SUMÁRIO

MICROSOFT PowerPoint 2000 SUMÁRIO MICROSOFT PowerPoint 2000 SUMÁRIO 01 - INTRODUÇÃO 02 - INICIANDO O PowerPoint 2000 03 - ASSISTENTE DE AUTOCONTEÚDO 04 - MODELO DE ESTRUTURA 05 - INICIAR COM UM MODELO DE ESTRUTURA 06 - ESCOLHER UM AUTOLAYOUT

Leia mais