Apostila Comunicação Visual para Web
81 pág.

Apostila Comunicação Visual para Web


DisciplinaWeb para Comunicação2 materiais12 seguidores
Pré-visualização12 páginas
WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
62
 Observe na figura 37, a visualização do Painel Inspetor de Propriedades quan-
do a ferramenta Texto está selecionada na Caixa de Ferramentas:
 Figura 37 - Painel Inspetor de Propriedade exibindo opções da Ferramenta Texto
 O Painel Inspetor de Propriedade é um modo rápido e eficiente para aplicar 
efeitos e filtros aos objetos suportados. No lado esquerdo superior é exibido o forma-
to de edição do objeto.
5.3 Alinhando objetos
 Os comandos de alinhamento disponibilizam diversas opções prontas, permi-
tindo alinhar objetos ao longo de uma linha central, horizontal ou vertical, entre ou-
tras opções. Para acessar os comandos de alinhamento, selecione a opção mais 
adequada em Modify > Align:
\u2022 Left: Alinha o objeto à esquerda;
\u2022 Center Vertical: Alinha o objeto no centro ao logo de uma linha vertical;
\u2022 Right: Alinha o objeto à esquerda;
\u2022 Top: Alinha o objeto ao topo;
\u2022 Center Horizontal: Alinha o objeto no centro ao logo de uma linha horizontal;
\u2022 Bottom: Alinha o objeto à base;
\u2022 Distribute Widths: Distribui uniformemente a largura dos objetos selecionados;
\u2022 Distribute Heights: Distribui uniformemente a altura dos objetos selecionados.
5.4 Girar, inverter e transformar objetos
 O Fireworks disponibiliza várias opções para transformar objetos. Além da 
transformação livre, é possível gira um objeto e invertê-lo conforme for necessário.
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
63
Para acessar este recurso, selecione Modify > Transform:
\u2022 Free Transform: Permite transformar livremente as dimensões do objeto;
\u2022 Rotate 180º: Gira o objeto 180º; 
\u2022 Rotate 90º CW: Gira o objeto 90º no sentido horário;
\u2022 Rotate 90º CCW: Gira o objeto 90º no sentido anti-horário;
\u2022 Flip Horizontal: Inverte o objeto na horizontal; 
\u2022 Flip Vertical: Inverte o objeto na vertical.
 Observe na Figura 38 o uso da Ferramenta Free Transform, que possibilita edi-
tar livremente os pontos de dimensão do objeto. Em seguida, a ferramenta de rotação, 
Rotate 180º, gira o objeto em um intervalo específico. Também é possível aplicar rota-
ções diferentes usando as variações da ferramenta no sentido horário ou anti-horário, 
dentro do intervalo de 90º.
 A Ferramenta Flip Vertical altera a perspectiva da imagem, invertendo sua o-
rientação na posição horizontal. Também é possível realizar a inversão na posição 
vertical, usando a ferramenta Flip Vertical. 
 Esse recurso deve ser aplicado com cautela a imagens ou objetos que conte-
nham texto, pois, ao inverter uma frase na horizontal, por exemplo, ela se apresenta-
rá semelhante ao texto visto por meio de um espelho.
Figura 38 - Edição utilizando Free Transform, Rotate 180º e Flip Horizontal
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
64
5.5 Redimensionar área de desenho, dimensão e cor da de fundo
 Comumente, é necessário alterar as dimensões do documento, liberar mais 
espaço de edição ou realizar o contrário, diminuir a área de desenho para somente o 
espaço utilizado. O Firewoks permite configurar facilmente essas e outras proprieda-
des, selecionando Modify > Calvas:
\u2022 Emane Size: Altera a dimensão original da imagem;
\u2022 Calvas Size: Altera a dimensão da área de desenho;
\u2022 Canvas Color: Define uma cor de fundo ou transparência para imagem;
\u2022 Trim Canvas: Elimina a área de desenho não utilizada na edição;
\u2022 Fit Canvas: Ajusta a área de desenho para o tamanho da imagem.
 É possível acompanhar, na Figura 39, a imagem original na área de desenho 
transparente, sem nenhuma cor de fundo presente. Em seguida, após aplicar a Ferra-
menta Trim Canvas, a área de imagem foi recorta, diminuindo para a máxima área da 
imagem utilizada. Logo após, o fundo recebeu uma cor selecionada por meio da fer-
ramenta Canvas Color.
Figura 39 - Fundo de imagem transparente, seguido do afeito da Trim Canvas Canvas 
Color
5.6 Utilizando Camadas (Layers)
 Camada ou Layers é um recurso eficiente para organizar os elementos 
distribuídos na edição de uma imagem. Através desse Painel, é possível seqüenciar
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
65
os objetos em subníveis, semelhante à organização de pasta/subpasta, conforme ilus-
tra a Figura 40.
 Também é possível mover os objetos para cima ou para baixo de outro, con-
forme for necessário, basta selecionar o objeto desejado e aplicar uma das seguintes 
opções no menu Modify > Arranje:
\u2022 Bring to Front: Trazer para frente de todas das camadas;
\u2022 Bring to Forward: Avançar sobre uma camada;
\u2022 Send Backward: Recuar sobre uma camada;
\u2022 Send to back: Enviar para traz de todas as camadas.
 Figura 40 - Painel Gerenciador de Camadas
 O Painel Layer gerencia todas as camadas do documento, possui recursos 
eficientes que permitem ocultar algumas camadas ou simplesmente bloquear tempo-
rariamente sua edição. Também é possível informar um nome para cada camada, de 
forma a facilitar a organização dos objetos.
 É um recurso eficiente na edição de documentos que possuem uma infinidade 
de camadas, no entanto, muitas vezes se torna necessário agrupá-los em estrutura de 
pasta. Dessa forma, se torna fácil selecionar visualmente o objeto desejado.
O Fireworks permite agrupar objetos em uma única camada. Para agrupar duas ou 
mais camadas, selecione Modify > Group, ou faça o processo inverso Modify > 
Ungoup. 
 Perceba, na Figura 41, que a visualização da camada não é alterada mesmo 
depois de agrupadas, quando os objetos passaram a ser editados como apenas um
único objeto.
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
66
 No Painel Layer é possível acompanhar o número de objetos agrupados que 
seguem, após a intitulação Group.
 
 Figura 41 - Painel Gerenciador de Camadas exibindo os objetos agrupados
5.7 Utilizando Mascara (Mask)
 Mascara é um recurso versátil para criar efeitos utilizando mais de dois obje-
tos. Com esse recurso, é possível mesclar duas imagens e manter algumas proprie-
dades entre elas. Para aplicar esse efeito, selecione um grupo de objetos, em segui-
da, selecione Modify > Mask > Group as Mask.
 Veja o exemplo da Figura 42.
 Figura 42 - Antes e depois de ser aplicado mascara aos objetos
5.8 Trabalhando com formas e objetos
 O Fireworks disponibiliza diversas opções para combinar objetos em apenas 
um. É possível conectar os pontos da extremidade de dois objetos abertos para criar
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
67
um único trajeto fechado, ou é possível juntar objetos múltiplos para criar um único 
objeto.
 Podemos observar, na figura 43, à esquerda, dois objetos sobrepostos, um 
quadrado e um circulo. Logo em seguida vemos o resultado, ao aplicar o efeito union 
que descartou toda a área que unia os dois objetos. Ao contrário da union, o efeito 
intersect é excelente para realizar o inverso e manter apenas as áreas comuns entre 
os objetos. Finalmente, o efeito punch remove apenas uma parcela do objeto sele-
cionado, utilizando como orientação o objeto que está imediatamente sobreposto ao 
primeiro.
 Para utilizar esses efeitos, selecione os objetos cuja forma deseja modificar, 
selecione Modify > Combine Paths e aplique o efeito desejado: Union, Intersect ou 
Punch.
Figura 43 - Duas formas (quadrado e circulo) seguidas do efeito union, intersect e 
punch
 Na Figura 44, podemos verificar um exemplo melhor do efeito Punch. Perceba 
que, ao selecionar os três círculos,