Apresentação de Fireworks

Macromedia Fireworks 8

Coordenação de Ensino - Duque de Caxias

O que é o Fireworks?

O Macromedia Fireworks é uma ferramenta profissional de edição
gráfica para a criação, edição e animação de imagens para usos diversos.


Iniciando uma projeto
Quando você abrir o Fireworks, verá a seguinte janela

Caso você já tenha iniciado algum projeto eles estarão listados em Open
Recent Item. Se desejar iniciar um novo projeto novo, clique e Create New na
opção Fireworks File.

Obs.: Se não quiser que essa tela apreça de novo selecione a opção Don't show Again

Iniciando um projeto
Ao clicar em Fireworks File, Abrirá
a seguinte janela:

Canvas Size ( Tamanho da janela )

Width: Largura da janela
Height: Altura da janela
Resolution: Resolução (Qualidade )
da imagem

Canvas Color ( Cor da janela)

White: Branca.
Transparent: Transparente
Custom Personalizada


Área de trabalho do Fireworks

2 1
3

4 5

6

1- Barra de Título: Exibe o título do documento que está sendo editado.
2- Barra de Menu: Possui todos os comandos possíveis do programa.
3- Barra de Ferramentas: Possui atalho para comandos mais usados do
programa.
4- Palco : Área de edição dos objetos.
5- Painéis de Edição: Exibe ferramentas mais complexas do programa.
6- Inspetor de Propriedades: Exibe as propriedades do(s) Elemento(s)
selecionado(s).

Guias de Visualização
O Fireworks possui 4 modos de visualização do projeto (em Vermelho)

Original: Mostra o projeto em sua forma original do formato .png (Documento só
Fireworks). Como está sendo editado.
Preview : Mostra o objeto como será visualizado em um navegador, Internet
Explorer, por exemplo.
2-UP: Mostra o objeto com as características de exportação do arquivo png para
jpg e gif.
4-UP: Mostra o objeto com as características de exportação do arquivo png para
jpg e gif .


Painéis de Edição

São painéis que permitem alterar
diversas propriedades dos objetos que estão
sendo editados.

Para exibí-los, bastar clicar sobre o
Nome do painel. Você verá funções
detalhadas de cada painel adiante


Painel de Ferramentas

O painel de Ferramentas está dividido em 6 categorias:
Manipulação de objetos (seleção), Bitmap, Vetores, Site, Cores e
as Ferramentas de Visualização.


Ferramenta Retângulo

Esta ferramenta permite a criação de varis formas geométricas.

Obs.: Para exibi as suas variações selecione a ferramenta e continue pressionando
com o botão até elas serem exibidas.

Inspetor de Propriedades
No inspetor de propriedades é possível alterar as características da formas
geométricas.

É possível alterar o preenchimento , o contorno e adicionar efeitos como a
transparência da forma, Inversão de cores.

Cor e estilo de preenchimento


Exemplos de efeitos
Obs.: Para deixar a forma sem preenchimento, na caixa de cores a opção
Transparent.

Suavização das extremidades

Hard

Anti-Alias

Feather


Exemplos de efeitos

Estilo e frequência da textura

Quando estiver trabalhando com imagens Bitmap, essa opção não
pintará áreas transparentes de uma figura, quer dizer, só serão
pintadas as áreas que contêm pixels

Cor, espessura e estilo do contorno

Obs.: Para deixar a forma sem contorno,
na caixa de cores escolha a opção
Transparent.


Exemplos de efeitos

Suavização do contorno

0%

100%

Estilo e frequência da textura, respectivamente


Ferramenta Linha

Com a ferramenta linha é possível criar traços no documento. Para fazer uma linha
perfeita basta pressionar o CTRL.

Obs.: É possível alterar suas características no Inspetor de Propriedades

Por ser tratar de uma linha, só possível alterar o contornos e os efeitos .


Ferramenta Lápis

Com a Ferramenta Lápis é possível fazer traçados a mão livre. As linha podem ter
apenas os efeitos alterados no Inspetor de Propriedades.


Ferramenta Pincel

A ferramenta Pincel é outra opção para desenhar a mão livre no Fireworks

Obs.: Ela possui mas recursos gráficos que o lápis como tipo de ponta
e espessura. É possível adicionar texturas como “cor” da Linha.


Ferramenta Caneta
Permite a criação de retas e curvas através da ligação de pontos. Os pontos são
interligados dando origem à forma.

Linhas Retas – Para criar uma forma com linhas retas, selecione a ferramenta
e clique no documento. Depois clique em outra região do documento, onde sera
traçada em reta entre esses pontos para formar os pontos de ligação. Para fechar a
forma, clique na ponto inicial da mesma.


Ferramenta Caneta

Linhas Curvas – Para criar uma forma com linhas curvas, selecione a ferramenta
e clique no documento para defini o ponto inicial da curva. Clique em outro ponto, mas não
solte o botão do mouse e mova o curso do mouse para definir a curvatura.

Alça
Curva


Ponteiro

Com a ferramenta ponteiro pode
selecionar todos os elementos existentes no
documento. Para selecionar um elemento,
clique sobre ele ou fora do mesmo e arraste até
o quadrado selecionar o objeto por completo


Selecionar Atrás

Para selecionar essa ferramenta, selecione a
ferramenta ponteiro e continue pressionando até serem
exibidas as variações dela.

Com essa ferramenta é possível selecionar objetos que estejam atrás de
gráficos que os encobrem

Há uma circunferência atras do quadrado.


Seleção Secundária
Assim como a ferramenta ponteiro, essa também seleciona objetos no documento,
de maneiras que você clica sobre eles ou clica e arraste até que englobe o objeto.
Alem da seleção, é possível fazer modificações nos gráficos através da manipulação
de pontos. Você pode selecionar, vem como arrastar os pontos do gráfico. É utilizada
também para trabalhar com as alças das linhas curvas.

Manipulação de pontos do gráfico

Manipulação das alças da linha curva

OBS: Quando há um grupo de objetos, essa ferramenta é usada para selecionar
um ou mais objetos do grupo


Moldura da Caixa de Seleção

Permite a seleção de áreas de
pixeis de uma imagem Bitmap. É
possível escolher ente o modo de seleção
retangular ou elíptica. Para isso,
selecione a ferramenta e continue
pressionando com o botão do mouse ate
serem exibidas as duas opções de seleção

Obs.: Para aumentar a área de seleção, mantenha a tecla SHIFT e selecione
o objeto que deseja incluir. Para retirar uma area da seleção, mantenha a tecla ALT e
selecine a área que deseja retirar.
No Inspetor de Propriedades, Você pode escolher as caracteristicas da
seleção.


Moldura da Caixa de Seleção

- Estilo da seleção

Normal – A seleção é feita à mão livre.
Fixed Ratio – Define a proporção do tamanho da caixa de seleção nos
campos de redimensionamento abaixo desta opção.
Fixed Size – Define o tamanho da caixa de seleção nos campos de
redimensionamento abaixo desta opção.

- Suavização da Seleção

Hard – Cria a borda da seleção bem definida.
Anti-Alias – Impede a criação de bordas dentadas na seleção.
Feather – A borda da seleção de pixels é suavizada. Ao lado desta opção
existe um campo, onde será preciso especificar o valos da intensidade da
visualização

Ferramenta Laço
Essa ferramenta seleciona áreas do documento a mão livre, podendo assim,
contornar certas figuras deixando a seleção bem definida. Existem dois modos de seleção
do laço: a do Laço e a do Laço Polígono. Para selecionar uma desta opção, selecione a
ferramenta e continue pressionando até aparecerem as duas opções

Com o Laço Polígono a seleção e feita
através de ligações de pontos. A cada
clique no documento são criadas linhas
que serão interligadas entre si.

Obs.: Para finalizar a seleção,
clique no ponto inicial.


Ferramenta Varinha Mágica

Essa ferramenta seleciona áreas do documento que possuem as mesmas
tonalidades de cores.

No inspetor pode aumentar a Tolerance aumentar a quantidade de
cores semelhantes

Obs.: No campo de Tolerance o valor pode variar de 0 a 255.

Ferramenta Cortar

Essa ferramenta exclui áreas do documento que consideramos desnecessárias.
Para, selecione a área que deseja Manter no documento e dê um clique Duplo dentro da
área de seleção

Após o clique duplo.

Ferramenta Texto
A ferramenta texto permite a inserção de textos nos documentos. Com ela
selecionada, clique a arraste no documento até atingir o tamanho da caixa de texto
desejada.

No Inspetor de Propriedades poderá ser alterada a fonte, cor,
tamanho, estilo, alinhamento, entre outras coisas. Na opção em destaque, é
possível definir a suavização das extremidades do texto.


Transformar

Com essas ferramentas é possível manipular gráficos vetoriais e imagens Bitmap através
de pontos


Ferramenta Dimensionar

A ferramenta Dimensionar permite o redimensionamento do tamanho do objeto.
Quando o objeto é selecionado por esta ferramenta, suas extremidades passam a exibir
pontos quadrados.


Ferramenta Inclinar

A ferramenta permite Inclinar
os lados do objeto dando uma nova
forma ao mesmo. Seleciona o objeto
com essa ferramenta, pontos
quadrados serão exibidos ao redor do
objeto.


Ferramenta Distorcer

A ferramenta Distorcer permite
modificar totalmente a forma original do
objeto. Com ela selecionada, clique em
qualquer um dos postos ao redor do objeto e
arraste até chegar na forma desejada.


Redesenhar Traçado

Quando fizer traço, independente da ferramenta (caneta, lápis ou pincel) e desejar
alterar a forma do mesmo, você poderá fazer de duas formas; Transformar livremente ou
pela transformação da forma

Para escolher essa ferramenta: Pressione com o botão do mouse na ferramenta Forma
Livre e continue pressionando o botão do mouse até as opções serem exibidas.


Forma Livre
Com essa ferramenta é possível alterar livremente objetos que foram criados com
alguma ferramenta de traço, como Caneta ou Lápis

Como usá-la: Selecione a ferramenta, e clique na linha ou junção do objeto e arraste até
chegar na forma desejada.

Depois da alteração
Antes da Alteração


Ferramenta Transformação da Forma
Com essa ferramenta é possível alterar circularmente objetos que foram criados
com alguma ferramenta de traço, como Caneta ou Lápis.

Como usá-la: Selecione a ferramenta, clique onde deseja fazer a alteração e arraste até
chegar à forma desejada.

Antes da alteração
Depois da alteração


Ferramenta Conta Gotas

Essa ferramenta é utilizada para capturar cores de pixels de imagens Bitmap.
Selecione a ferramenta e clique na área da imagem que contém a cor que deseja capturar.
A cor será selecionada para a utilização no preenchimento de outro objeto.

Obs.: Existem três tamanhos das áreas de pixels a serem capturados.
Para selecionar uma delas, vá ao Inspetor de Propriedades.


Ferramenta Faca e Borracha

A ferramenta Faca corta objetos vetoriais.

Como usá-la: Selecione a ferramenta, clique e arraste traçando uma linha
onde deseja que o ponteiro seja cortado, clique fora do objeto e com a ferramenta ponteiro
separe as partes.


Ferramenta Faca e Borracha

Quando se trabalha com o Bitmap, a ferramenta Faca se transforma na
ferramenta Borracha . No Inspetor de Propriedades você pode escolher o estilo da
borracha e opção para apagar áreas das imagens Bitmap.

Size: Tamanho da borracha
Edge: Suavização da borracha
Shape: Tipo da borracha: Quadrada ou Circular

Obs.: A ferramenta Borracha só funciona em imagens Bitmaps.

Ferramenta Carimbo

A ferramenta Carimbo permite a cópia de uma determinada área de uma imagem
em outra área dessa mesma figura.

Como usá-la: Com a ferramenta selecionada e a tecla ALT pressionada, clique na
região da imagem que será o centro da cópia. Posicione o mouse na região a imagem que
você deseja “colar” a cópia, clique e arraste até que a área da imagem fique como desejar.


Ferramenta Carimbo

Você pode alterar algumas características do carimbo no Inspetor de
Propriedades.

Size: Tamanho do carimbo.

Edge: Suavização das extremidades da imagem “colada”.

Source Alingned: Essa opção permite que o ponteiro de origem fique
móvel, ou seja, que caminhe alinhado com o carimbo. Assim , você poderá
clonar várias partes da imagem.

Use Entire Document : Serão duplicados todos os objetos, sejam eles
imagens Bitmap ou Gráficos Vetoriais.


Ferramenta Balde

Essa ferramenta preenche determinadas áreas de pixels com uma cor pré-definida.

Como usá-la : Com ela selecionada, escolha uma cor na caixa de
cores.


Ferramenta Balde

Podem ser alteradas algumas características dessa ferramenta no Inspetor de
Propriedades.

Balde : Escolhe a cor do preenchimento e ao lado entre diversas cores
compostas, como por exemplo, gradientes.

Edge: Escolhe a configuração da borda acentuada (hard), suavizada
(anti-alias) ou enevoada (feather)

Textura : Escolhe a textura e ao lado da mesma, a intensidade.

Tolerance : Abrangência da área de pixels.

Ferramenta Balde Degrade

Como usá-la : Para utilizar essa ferramenta, selecione a ferramenta BALDE e
continue com o botão do mouse pressionando até a opção Balde Degrade for exibida.

Essa ferramenta têm a mesma função do balde que você
acabou de ver. Ela trabalha com imagem em degrade e não
com cores sólidas.
Para escolher a cor degrade, com a ferramenta
selecionada, clique no BALDE no Inspetor de Propriedades.

Escolha as cores que irão
compor o degrade, selecionando
as setas, onde você poderá
escolher uma das cores pré-
definidas.

Ferramenta Mão

Com a ferramenta mão pode enquadrar o documento quando ele não
está sendo exibido por inteiro. Com a ferramenta selecionada, clique no
documento e arraste até chegar ao enquadramento desejado. Com um clique
duplo na ferramenta Mão, a imagem será exibida inteiramente na janela do
documento.


Ferramenta Zoom

Essa ferramenta permite aumentar ou diminuir a visualização do
documento. Para aumentar o zoom , selecione a ferramenta e clique na
região do documento quantas vezes forem necessárias até chegar no
tamanho ideal da visualização. Pode ser aumentado em até 6400% do
tamanho original


Importando Imagens
Para importar uma imagem para o Fireworks, na barra de menu clique na guia
FILE e, em seguida, em Import. Escolha a imagem que deseja e clique em abrir.

O ponteiro do mouse irá se transformar em uma moldura .Clique no
documento onde desejar que o canto superior da imagem seja criado e arraste
até a imagem atingir o tamanho desejado.

Modificar Documentos e Objetos

Você poderá alterar algumas configurações que compõem o layout, bem como as
propriedades do documento. Para realizar essas operações, você irá trabalhar com as
opções presentes na barra de menu na guia Modify, na opção Canvas.


Image Size

Pixel Dimensions:(Dimensões do pixel) : Você altera as dimensões na vertical e
horizontal da imagem.
Print Size:(Tamanho da impressão): Você altera da imagem para a impressão.
Constrain Proportions: Limita proporções e mantém a dimensão horizontal
proporcional a vertical, ou seja, quando alterar um dos valores horizontal ou vertical, o outro
será aumentado proporcionalmente
Resample Image: Dá um novo exemplo de imagem. Quando está selecionada,
adicionada pixels à imagem que tiver seu tamanho alterado.

Canvas Size
Canvas Size -Tamanho da tela: Ao clicar nessa opção abrirá a seguinte janela:

Para alterar o tamanho da tela, coloque os novos valores e especifique se
necessário, a nova unidade de medica.

Na opção Anchor o botão central fica selecionado como padrão, indicando que
todos os lados da tela serão alterados Selecionando outro botão,apenas o lado da tela
correspondente será alterado.Coordenação de Ensino -Size indica o tamanho atual da janela.
A opção Current Duque de Caxias

Canvas Color
Canvas Color - Cor da janela : Ao clicar nessa opção, abrirá a seguinte janela.

White : Branco
Transparent: Transparente
Custom (Personalizada): Quando selecionar essa opção, escolha a cor desejada
no quadrado que aparece abaixo, conforme figura acima

Barra Modificar

Para exibi-la na barra de menu, clique na quia Window, em seguida em Toolbars
e na opção Modify

- Agrupar: Agrupar os elementos que estiverem selecionado. Depois
de agrupado, os elementos estarão na mesma subcamada.

- Desagrupar: Desagrupar os elementos, fazendo com que eles se
tornem independentes novamente, formando cada um a sua própria
subcamada.

Barra Modificar (Continuação)
- Unir: Uni todos os elementos que estiverem selecionados. Se houver uma
sobreposição de elementos, as áreas sobrepostas serão extraídas. O novo objeto terá a cor
de apenas um deles.

- Dividir: Essa botão só será ativado para objetos que o comando Unir for
aplicado. Dividindo os objetos que foram unidos tornando-os independentes novamente.

- Trazer para frente: O objeto selecionado passa a ser posicionado à frente dos
outros.

- Avançar: Objeto selecionado avança um nível, ou seja, ele irá sobrepor o objeto
que estiver acima dele.

- Recuar: O objeto selecionado retrocede um nível, ou seja, ele fica sobreposto por
outros objetos.

- Enviar para Trás: Envia o objeto selecionado para trás de todos os outros do
documento.

- Alinhar: alinha o objeto de diversas formas.

- Alinhar à esquerda

- Alinhar pelo topo

- Distribuir larguras

- Centralizar eixo vertical

- Centralizar eixo horizontal

- Distribuir alturas

- Alinhar à direita

- Alinhar a base.


- Girar 90° SAH: Gira o objeto selecionado 90° no sentido horário.

- Girar 90° SA : Gira o objeto selecionado 90° no sentido horário.

- Virar na Horizontal: Vira o objeto no eixo horizontal, Como se estivesse olhando
o objeto num espelho.

- Virar na Vertical: Vira o objeto no eixo vertical, como se você estivesse olhando
o objeto de cabeça para baixo.


Camadas
As camadas dividem os objetos do documento em vários planos. Você pode separar
os elementos em camadas para modificá-los e manuseá-los mais facilmente com a maior
segurança.

Criar / Duplicar Camada.

Com esse botão você pode cria
novas camadas. As subcamadas são
criadas automaticamente quando novos
objetos são inseridos no documento.
Para duplicar uma
Camada,arraste até o botão Cria /
Duplicar Camada, que uma camada será
criada com as mesmas características
da camada selecionada.


Camadas (Continuação)
- Criar Máscara

Criar uma máscara para o objeto da
camada.

- Nova imagem de Bitmap

Cria uma camada em modo Bitmap.
Todos os objetos que forem inseridos nessa
subcamada, incluindo gráficos vetoriais,
serão automaticamente transformado em
Bitmaps.

- Deletar Camada

Com esse botão você exclui a
camada ou subcamada que estiver
Selecionada.

Bloquear Camadas

Para bloquear camadas, clique no quadro localizado entre o olho e o nome da
camada que um cadeado será exibido neste local. Isso indica que essa camada estará
bloqueada. Quando uma camada é bloqueada, o conteúdo não poderá ser editado nem
alterado. Para desbloqueá-la, basta clicar sobre o cadeado novamente


Ocultar Camada

Para ocultar uma camada clique no olho e para exibi-la clique novamente. Quando
uma camada esta oculta seu conteúdo não e exibido e quando ela não está oculta seu
conteúdo é exibido.


Renomear Camada

Para renomear uma camada, dê um clique duplo sobre o a camada ou subcamada
que desejar renomear e digite o novo nome.

Obs.: A Camada da Web (Web Layer) é uma camada especial e
sempre será exibida como primeira, sem ter seu nome alterado e excluído.
Nela são inseridos objetos para atribuir interatividade ao documento.


Molduras

As molduras são semelhantes ás
camadas. Em cada moldura você irá criar
uma etapa da animação, sendo que cada
Moldura poderá ter quantas Camadas forem
necessárias. Para trabalhar com as
Molduras, selecione no painel Frames and
History e a guia Frames.

- Técnica Onio Skin

- Ciclo de animação (GIF). - Nova / Duplicar camada

- Distribuir em Molduras. - Excluir Moldura

Técnica de Onion Skin

A técnica Onion Skin (Casa de Cebola) permite que os quadros anteriores e
posteriores sejam visualizados com uma certa transparência
Para alterar as configurações: Clique no botão Técnica de Onion Skin ( em
vermelho).

No Onion Skinning – Sem Onion Skin.
Show Next Frame – Mostrar próximo Quadro.
Before and After – Antes e Depois
Show All Frames – Mostrar todos os Quadros.
Custom – Personalizar...
Multi-Frame Editing – Edição de múltiplos Quadros.


Técnica de Onion Skin (Continuação)

Clicando em Custom... A seguinte
será exibida onde você irá alterar as
configurações da ferramenta.

Show

Before Current Frame: Antes do Quadrado atual.
Opacity: Opacidade.
After Current Frame: Depois do Quadrado atual.
Opacity: Opacidade.
Multi-Frame Editing: Edição de múltiplos Quadros.

Exportar

Para Exportar clique na
barra de menu no guia File e na
opção Export.

Ao clicar na opção
Export Aparecerá a esta janela,
escolha o formato que desejar
nesta lista.

Obs.: O Fireworks proporciona
uma ótima manipulação da
imagem para que se possa criar
sites sem maiores problemas.


Fatias e Pontos Ativos

As Fatias e Pontos ativos São elementos da Web, não existindo como imagens,
mas sim como códigos HTML. Os Pontos ativos e Fatias, quando criados, ficam
armazenadas na Camada da Web.

Criação de Fatias

É possível criar fatias
retangulares ou em forma de
polígonos. Para definir com qual forma
você ira trabalhar, selecione a
ferramenta Fatias e continue
pressionando o botão do mouse até as
opções serem exibidas.

Criando Pontos Ativos

É possível criar Pontos Ativos, me
retângulos, círculos ou Polígonos.
Para criar os pontos ativos basta selecionar a
forma desejada. Selecione a ferramenta
Pontos Ativos e continue pressionando o
botão do mouse até as opções serem exibidas.


Apresentação de Fireworks

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie Apresentação de Fireworks

Ähnlich wie Apresentação de Fireworks (20)

Mehr von CDP_Online

Mehr von CDP_Online (10)

Apresentação de Fireworks