manual para redimensionamento de imagens - prefeitura · 7.1 - veja a imagem que usaremos como...

14
Manual PAINT.NET de imagens 1. Instalação 1.1 - Para instalar o programa paint.net, o primeiro passo é baixá-lo do endereço a seguir e salvá-lo em seu computador. http://ww2.prefeitura.sp.gov.br/paint_net/Paint.NET.3.36.exe 1.2 - Após o arquivo salvo, clique duas vezes no ícone “Paint.NET.3.36.exe” conforme figura abaixo: Será carregado o executável e aparecerá a seguinte janela: Recomenda-se deixar selecionada a opção “Rápida” e logo abaixo selecionar a opção “Português (Brasil)”; Clique em “avançar”.

Upload: truongthu

Post on 30-Nov-2018

217 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

Manual PAINT.NET de imagens

1. Instalação

1.1 - Para instalar o programa paint.net, o primeiro passo é baixá-lo do endereço a seguir e salvá-lo em seu computador.

http://ww2.prefeitura.sp.gov.br/paint_net/Paint.NET.3.36.exe

1.2 - Após o arquivo salvo, clique duas vezes no ícone “Paint.NET.3.36.exe” conforme figura abaixo:

Será carregado o executável e aparecerá a seguinte janela: Recomenda-se deixar selecionada a opção “Rápida” e logo abaixo selecionar a opção “Português (Brasil)”; Clique em “avançar”.

Page 2: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

1.3 - Na próxima janela selecione o segundo item “Concordo”; Clique em avançar novamente.

Espere o programa carregar e começar a instalação automaticamente conforme as seguintes janelas

Page 3: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

1.4 - Por fim, clique em concluir para finalizar a instalação. Será criado um ícone (atalho) em sua “área de trabalho” e outro em “iniciar / programas / Paint.NET” Ícone na área de trabalho

Ícone no menu iniciar O processo de instalação está concluído.

Page 4: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

2. Inserção de Imagens As imagens dos sites, tanto dentro de notícias como nas capas, seguem um padrão de tamanho; este padrão deverá ser respeitado em todos os locais.

2.1 - HOME: OBS.: Na página inicial há uma diferença do número de chamadas entre subprefeituras e secretarias, mas o tamanho das imagens são os mesmos. Podemos observar, nos seguintes exemplos, que as subprefeituras possuem imagens nas chamadas 01, 02 e 06, enquanto nas secretarias são as chamadas 01, 03 e 10. Exemplo da página inicial das Subprefeituras: Exemplo da página inicial das Secretarias:

Chamadas 01 - Chamadas 02 - Chamadas 03 - Chamadas 04 - Chamadas 05 - Chamadas 06 -

05

01

03

0602 04

Chamadas 01 - Chamadas 02 - Chamadas 03 - Chamadas 04 - Chamadas 05 - Chamadas 06 - Chamadas 07 - Chamadas 08 - Chamadas 10 -

01 08

0402

05 10

0603

07

Page 5: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

Além das imagens da Home (capa), já citadas, também há imagens dentro de matérias, Quem é quem (no caso das subprefeituras) e Equipe de governo (fotos dos secretários). Exemplo de imagens dentro das matérias do canal notícias: Exemplo de imagens dentro do Quem é quem (para subprefeituras) e da Equipe de governo (para secretarias):

Page 6: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

3. Tamanho das Imagens Abaixo seguem os tamanhos: Obs.: Todas as imagens serão calculadas em px (pixels) e terão a resolução de 72 DPI’s Home:

• Destaque 01 – 180px X 170px (L X A)

• Destaque 02 (sub) e 03 (sec) – 70px X 90px (L X A)

• Destaque 06 (sub) e 10 (sec) – 120px X 60px (L X A) - As medidas são lidas sempre Largura X Altura e sua unidade de medida são pixels. Notícias:

• As imagens a serem enviadas para notícias, ou seja para o [email protected], deverão ter o tamanho de 220 X 165px quando for horizontal e 165 X 220px quando for vertical.

Quem é quem (no caso das subprefeituras) e Equipe de governo (fotos dos secretários).

• As dimensões de imagens para essas páginas deverão ser de 180 X 250px, que deverão, também, ser enviadas para o [email protected] .

Page 7: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

4. Selecionando a Imagem 4.1 - Clique no ícone do programa “Paint.NET” para iniciá-lo

Será aberta a seguinte tela:

Barra de ferramentas “padrão” Barra de ferramentas “topo” Barra de ferramentas “lateral”

4.2 - Selecione, na barra menu, em “Arquivo” – “Abrir”. Conforme exemplo ao lado

Page 8: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

4.3 - Selecione a imagem e clique em abrir. Sua tela deverá exibir a imagem escolhida da seguinte forma:

Page 9: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

5. Ajustando a Barra de ferramentas

5.1 - Certifique-se de que a unidade de medida no campo Unidades, na barra de ferramentas padrão, está em Pixels. Caso não esteja, clique na seta para selecionar esta medida. Esta unidade de medida é a primeira que aparece na caixa de Seleção.

5.2 - Após este processo selecione a ferramenta “Selecionar com Retângulo”

Esta opção pode ser encontrada na coluna de ferramentas ou

na barra de

ferramenta no topo da tela

Clique na seta

próxima do ícone para aparecer as opções de ferramentas e selecione a primeira.

Page 10: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

Quando a ferramenta “Selecionar com Retângulo” for selecionada, a barra de ferramentas topo deverá ficar da seguinte forma:

6. Barra de ferramentas “topo”

6.1 - No campo “Modo de seleção”, escolha a primeira opção “substituir”

6.2 - No campo ao lado, escolha a segunda opção: “índice fixo”.

O ícone da barra ferramentas muda para um quadrado pontilhado

Aparece uma caixa: Modo de seleção

Aparece outra caixa com a opção Normal Ativada

Page 11: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

6.3 - Quando a opção índice fixo for selecionada, irão aparecer mais dois campos ao lado: Largura e Altura. Sua barra ficará da seguinte forma:

Estes são os campos que deverão ser preenchidos com as medidas citadas no item “Tamanho das Imagens”. Neste caso, vamos colocar a medida do destaque 01 da home como exemplo que é 180px X 170px. - Lembre-se que as medidas são lidas sempre Largura X Altura e sua unidade de medida são pixels. Depois de tudo selecionado, sua barra de ferramentas deverá ficar da seguinte forma:

7. Redimensionando Imagens

7.1 - Veja a imagem que usaremos como exemplo:

Page 12: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

Podemos observar que a proporção do tamanho que escolhemos (180 X 170px) não está de acordo com a proporção da imagem escolhida. Para que a imagem fique na dimensão desejada, selecione o melhor foco da imagem, assim:

7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da foto desejada, veja o exemplo abaixo:

Perceba que se formou uma seleção com fundo azul e bordas pontilhadas em volta da área escolhida. Caso queira selecionar uma nova área, é só repetir o último passo.

7.3 - Agora selecione a ferramenta “Cortar a área selecionada” na barra de ferramentas padrão para cortar a área que selecionamos no passo anterior.

A imagem ficará da seguinte forma:

Page 13: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

7.4 - Selecione, na barra menu, a opção “Imagem” – “Redimensionar”.

onforme exemplo abaixo:

Irá aparecer a seguinte janela:

dicações abaixo, a imagem acima também

ustra como deverá ficar a caixa “Redimensionar”:

r qualidade”;

;

lução da imagem será 72 e ao lado escolha a opção pixel/polegada e

C

7.5 - Preencha os campos de acordo com as inil - Redimensionamento: escolha a opção “Melho- Selecione a opção: “Por tamanho absoluto” ; - Logo abaixo, selecione a opção: “Manter a taxa de proporção”; - Largura: digite o tamanho da imagem correspondente, neste caso será 180px- Altura: digite o tamanho da imagem correspondente, neste caso será 170px; - Resolução: A reso

Page 14: Manual para redimensionamento de imagens - Prefeitura · 7.1 - Veja a imagem que usaremos como exemplo: ... 7.2 - Pegue o mouse e arraste dentro da imagem, selecionando a área da

- Clique em: OK.

7.6 - Selecione, na barra menu, a opção: “Arquivo” – “Salvar como”.

7.7 - Escolha uma pasta ou diretório de sua preferência e clique em salvar.

aso de imagens para notícias, envie para o [email protected]

A partir daqui, você já poderá inserir as imagens na home, seguindo o “manual do página 1” . Noc com o link da notícia.

FIM