Instituto Politécnico de Setúbal Escola Superior de Educação de Setúbal. Formação Contínua 1999/2000. Filomena Izidro

Transcrição

1 Instituto Politécnico de Setúbal Formação Contínua 1999/2000 Filomena Izidro Setúbal 2000

2 1. APRESENTAÇÃO DO PROGRAMA PAINT SHOP PRO 5 O PSP 5 é um programa que permite o tratamento de imagens. Nome do ficheiro de desenho Barra de ferramentas básicas do Windows e do PSP Barra dos menus Barra que permite alterar atributos das ferramentas Paleta de cores Barra de ferramentas básicas de desenho Barra que permite utilizar os layers (folhas transparentes) Barra que permite visualizar a distribuição de cores e luminosidade 1

3 2. PREPARAR UMA NOVA IMAGEM Na barra principal, faça um clique no ícone NEW. Em seguida, aparecerá uma caixa de diálogo: Especifique a largura (Width) e a altura (Height), a cor de fundo (Background Color), e o tipo de imagem (Image Type). Na maioria das vezes, o tipo de imagem será de 16,7 Million Colors (24 bit). 3. ESCREVER UM TÍTULO 3.1. Para desenhar um título, é necessário utilizar a ferramenta de texto. Faça um clique na letra A - text - da ferramenta básica de desenho Antes de escrever, seleccione a cor do texto (por exemplo em azul). Mova o rato para a paleta de cor (à direita) e faça um clique sobre cor pretendida ou no quadrado superior, junto à paleta de cor, faça um clique e seleccione a cor desejada Com já seleccionou o ícone de texto na barra de ferramentas de desenho, bastará fazer um clique sobre o local onde quer colocar o texto. Aparecerá uma caixa de diálogo Add Text. Escreva o texto desejado, escolhendo a fonte, o tamanho da letra, o alinhamento e os efeitos de texto (deixe ficar activada a opção Anti-Alias, pois a qualidade do texto fica melhor). Depois faça Ok. 2

4 Se o texto não ficou no local pretendido, posicione o rato sobre o título e quando o ícone passa a ter a forma de setas cruzadas, então poderá mover o texto para o local desejado, bastando, para isso, mover o rato pressionado o botão. Enquanto o texto aparecer com um contorno ponteado, significa que está seleccionado Se não gostar da letra, cor ou tamanho que escolheu basta apagar o texto. Apague com a tecla Delete ( 1 ) do teclado e recomece tudo novamente (a partir do item 3.3). 4. COLOCAR UMA SOMBRA NO TÍTULO Se o texto ficou sem o contorno ponteado é necessário seleccioná-lo. Para isso basta fazer um clique sobre o ícone Undo (desfazer) da barra principal Escolha então o efeito sombra. Seleccione a opção Image na barra de menu, seguido de Special, e por último em Drop Shadow. Aparecerá uma caixa de diálogo, que permite alterar alguns parâmetros: Color: define a cor da sombra; preto (black), azul (blue), vermelho (red), verde (green), branca (white), como cor de traço (foreground color) ou como cor de fundo ( 1 ) Ao carregar na tecla Delete apaga tudo o que estiver seleccionado. 3

5 (background color); de entrar na caixa de diálogo podia ter seleccionado outras cores para a cor de traço e de fundo. Opacity: dependendo do valor (entre 0 e 100), a sombra fica mais clara ou mais escura; Blur: pode conter valores de 0 a 100. Os valores mais altos fazem uma sombra mais suave; Offset Vertical e Horizontal: define a posição da sombra, com valores de -100 a 100. Depois de configurar tudo, basta fazer um clique em OK. O efeito da sombra poderá dar a noção de alto relevo. Se o resultado não lhe agradou, basta usar o ícone Undo e começar de novo. 5. REDUZIR O TAMANHO DA IMAGEM Quando da preparação da imagem, o tamanho indicado foi de 300x300 pixels, agora poderá reduzir o espaço que se encontra em excesso Faça um clique no ícone de selection (quadrado a ponteado) da barra de ferramentas de desenho e marque a região pretendida. Assim pressione o botão esquerdo do rato e, mantendo-o pressionado, arraste-o para fazer um rectângulo em torno da imagem. Se o tamanho não ficar correcto, pode sempre iniciar de novo até chegar ao resultado que deseja. 4

6 Depois, seleccione Image seguido de Crop to selection e verá que a imagem irá ajustar-se ao tamanho escolhido. Se não gostar do resultado, bastará desfazer a acção anterior e refazer tudo de novo. 6. GRAVAR A IMAGEM Seleccione Save as do menu File, escreva o nome do ficheiro no directório (pasta) apres_mult em Tic1 Alunos (H:). O programa permite gravar em diversos formatos, assim poderá decidir consoante a utilização a dar à imagem Pode optar por uma imagem do tipo JPEG ( 2 ): Então no campo Tipo da caixa de diálogo Save As, ainda pode optar por dois padrões: Standard Encoding ou Progressive Encoding. A opção Progressive Encoding em Encoding de Options faz com que a imagem seja mostrada por inteiro e vá-se definindo, melhorando a focagem, conforme é carregada. No outro caso é mostrada por inteiro Se optar por uma imagem do tipo GIF: Em Options pode escolher: Version 87a Interlaced, Version 87a Noninterlaced, Version 89a Interlaced e Version 89a Noninterlaced. A diferença entre Interlaced (entrelaçada) e Noninterlaced (não-entrelaçada) é a mesma que no caso do JPEG (Progressive e Standart Encoding): numa, a imagem vai sendo mostrada enquanto é carregada, e na outra é mostrada por inteiro, e vai se definindo conforme é carregada. ( 2 ) Este formato (extensão JPG) é recente e nem todos os browsers o aceitam (as últimas versões do Netscape e do Internet Explorer já o entendem). 5

7 A diferença maior entre as versões 87a e 89a é que a última permite criar as imagens de fundo transparente (a cor de fundo - background color - escolhida deve ser branca e activada antes de gravar). As imagens de tamanho GIF são 10 a 12 vezes (em bytes) superiores às JPG. 7. CRIAR BOTÕES 7.1. Prepare uma nova imagem e escolha uma cor de fundo Na barra principal, faça um clique no ícone NEW como no item 2 e continue como no item Escolha uma forma para desenhar o botão. Seleccione o ícone Shapes na barra de ferramentas de desenho. Em View/ Toolbars escolha Control Pallete e verifique que poderá desenhar rectângulos (Rectangle), quadrados (Square), elipses (Ellipse) e círculos (Circle) em Shape. E ainda apresenta outros dois campos: Line: especifica a grossura do traço; Style: pode conter os valores Outlined (somente o traço é desenhado) e Filled (todo o interior também é pintado). Utilize, por exemplo, Rectangle e Filled. Para traçar um rectângulo, faça como foi feito no item 5.1. Faça um clique e arraste o rato com o botão pressionado até o rectângulo ficar do tamanho desejado Agora escreva um título dentro do rectângulo. Escolha uma cor, diferente da usada para o fundo do botão; seleccione o ícone Text e faça um clique no local onde deseja colocar o texto como no item 3. 6

8 7.4. Execute o botão Escolha o tamanho desejado para o botão, fazendo um clique no ícone Seletion e faça como no item 5. Depois, seleccione Image/Effects/Buttonize para ter acesso à caixa de diálogo que lhe permitirá criar um botão. Seleccione os valores de 1 a 42 para definir as bordas (Height e Width). Escolha ainda Transparent edge para ficar ligeiramente melhor. Pela janela vai observando o efeito até encontrar o efeito desejado, depois faça um clique OK Redimensionar o tamanho do botão Repare que a área do botão continua seleccionada, pelo que só é necessário ajustar o tamanho. Seleccione Image/ Crop to seletion Guardar o botão Para guardar deve executar as operações do item CRIAR UMA IMAGEM Com os exemplos anteriores e as novas ferramentas de desenho apresentadas construa uma imagem simples Comece por prepara a nova imagem (item 2.). 7

9 8.2. Escolha uma parte de uma imagem que observa no écran. Veja as várias imagens que o seu computador possa ter. Escolha Browser no menu File e fazendo um clique sobre uma directoria que contem imagens. Assim do lado esquerdo tem o caminho para aceder às imagens e do lado direito aparecem as imagens com o próprio nome Escolha uma imagem para usá-la. Faça um duplo clique sobre a mesma. Feche o browser. Na janela do browser faça um clique sobre o botão X que se apresenta no canto superior direito (atenção: na janela do browser). Seleccione a imagem toda, activando Selections/ Selecte all. Para copiar seleccione Edit/ Copy e depois de activar a janela da sua imagem, seleccione Edit/ Past/ As new layer. Escolha a posição utilizando o ícone Mover Escolha uma parte das imagens que lhe aparecem no browser. Volte a abrir o browser. Pressione a tecla Print Screen. A imagem é capturada e armazenada na área de transferência (clipboard). Feche o browser (item 8.3). Seleccione a sua imagem. E agora, para colar o conteúdo da área de transferência como uma imagem nova, no menu Edit escolha Past/ As new layer. Escolha a posição utilizando o ícone Mover uma janela, basta utilizar as teclas Alt e Print Screen simultaneamente. Para ter acesso aos ícones da barra de desenho tem de seleccioná-lo fazendo um clique sobre o mesmo: Zoom (lente de aumento): com o botão esquerdo do rato a imagem aumenta e com o botão direito ela diminui, mas a imagem continua do mesmo tamanho em pixels; Move: move a área visualizada (só quando a imagem é maior do que a zona para desenhar); 8

10 Crop: permite cortar o que está em excesso à volta de uma zona que comando permite executar; Selection: permite seleccionar uma área definida por um rectângulo; Freehand: permite seleccionar uma área irregular; Magic Wand: selecciona toda a área que tenha a mesma cor. Dropper: com o botão esquerdo selecciona a cor de traço (da barra de cores), fazendo um clique sobre a cor desejada; com o direito, selecciona a cor de fundo. Paint Brusher: fazendo um clique numa imagem, desenha um ponto. Logo, se você mantiver o botão apertado e arrastá-lo, poderá desenhar com o rato. O botão esquerdo desenha com a cor de traço, o direito com a de fundo. Clone brush: faça um clique com o botão direito do rato na área da imagem que deseja copiar, depois com o esquerdo você reproduz a área desejada em outro local; Color replacer: primeiro é necessário substituir as cores; o botão esquerdo define a cor de fundo é trocada pela cor de traço; com o botão direito, ele faz o contrário, substitui a cor de traço pela cor de fundo; para isso é necessário activar o comando e fazer um clique com o rato, arrastando-o por cima da imagem, as cores são trocas ou então fazendo um duplo clique, substituirá na totalidade da cor; Retouche: fazendo um clique sobre a imagem é possível retocar a imagem, clareando e alterando os locais desejados; Eraser: esta ferramenta funciona tal como uma borracha de verdade; Air brush: tem o efeito de spray (se usar o direito, a cor é a de fundo); Flood fill: serve para pintar uma área com uma cor; Linha: serve para traçar uma linha. Não se esqueça de gravar a imagem construída. 9

11 Imagens de fundo confusas ou berrantes Esta dica também me parece bastante fácil de compreender. Tudo que estiver por trás de um texto, desvia a atenção deste, em casos extremos pode mesmo torna-lo ilegível. Se mesmo assim quiser usar um fundo bastante rebuscado, modifique-o para que não interfira demasiado com o texto. Abra o seu editor de imagens (Paint Shop Pro, Photoshop, etc) e modifique o brilho e o contraste. (brightness/contrast). Pode, com esta ferramenta tornar a imagem mais discreta, com as suas cores e contornos menos definidos. Tenha em atenção também, no caso de o fundo ser liso, ás cores que escolhe para o 'papel de parede' da sua página. Um fundo vermelho com letras azuis claras pode ser um atentado ao seu bom nome e aos olhos de quem aceder ao seu cantinho na Web. Outra situação vulgar que deve ser evitada é o uso de imagens grandes como fundo. Devemo-nos lembrar que estamos a fazer algo que vai ser vista na Internet, que como sabemos ainda está longe de ser rápida como nós a desejariamos. Aliás, lembre-se que ainda existem muitos modems de e até, (imagine-se) pessoas que chegam de propósito de países longínquos para o visitar. Essas pessoas têm que esperar um pouco mais, e digo 'um pouco mais' porque sei que a sua página não tem nem vai ter uma imagem grande como fundo. 10