[TUTORIAL] Favicon no Pixlr

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

  • 0

[TUTORIAL] Favicon no Pixlr Empty [TUTORIAL] Favicon no Pixlr

Mensagem por APOllO 21.08.16 6:25

[TUTORIAL] Favicon no Pixlr Theme
Criando Favicon no Pixlr

O editor online Pixlr é muito útil no quesito gráfico, e será utilizado neste tutorial com a finalidade de promover uma base para aqueles que não tem conhecimento algum, iremos trabalhar a elaboração de um Favicon, e qualquer pessoa poderá fazer isso, veja nosso tutorial e aprenda de uma maneira bem tranquila.

[TUTORIAL] Favicon no Pixlr S1BHU8w

--> Tutorias gráficos <--
Criando Favicon no Pixlr


[TUTORIAL] Favicon no Pixlr 2tYNykM Requerimentos
Neste tutorial você não precisa ter nenhum conhecimento, nem mesmo o programa instalado, basta apenas acessar o link do Pixlr para iniciar os trabalhos.
A finalidade deste tutorial é ajudar os administradores a se familiarizarem com uma ferramenta util na elaboração de trabalhos simples, como por exemplo a Favicon de seu fórum!

- Introdução:
Caso você não sabe o que é o Favicon, irei presenta-lo para você!
Favicon é imagem que representará seu fórum na aba do navegador, veja o exemplo do forumeiros:

[TUTORIAL] Favicon no Pixlr R6xwIwS

Como podem ver, o Favicon é a imagem que fica ao lado do nome do fórum, que neste caso está escrito "Novo Tópico"!

Para alterar a Favicon de seu fórum acesse no painel de controle de seu fórum:
Geral Fórum Configurações Geral

[TUTORIAL] Favicon no Pixlr PLaowvL

- Elaboração:
A intenção deste tutorial é apresentar aos usuários do fórum a como elaborar um Favicon, no entanto, primeiro ambos deveram saber como redirecionar uma imagem pronta para que depois possam se desenvolver completamente, então pensando nisso, iremos primeiros redirecionar a imagem, de seu tamanho original para as condições de Favicon que é 16x16.

Então vamos lá, apos ter acessado o site do Pixlr, altere primeiro a língua para a Português:

[TUTORIAL] Favicon no Pixlr KmzFjUn

A opção de idioma está escrito languagem, para achar está opção basta acessar a penúltima opção do menu central do lado direito, como ilustrado na imagem à cima!

Depois de alterada crie um novo arquivo de tamanho 16 x 16:

[TUTORIAL] Favicon no Pixlr 8rFEttu

[TUTORIAL] Favicon no Pixlr 6o3DeyPSeta Nome: Fique a vontade para nomear como quizer
[TUTORIAL] Favicon no Pixlr NhOA5Z4Seta Predefinidos: Deixe em 800 x 600 px
[TUTORIAL] Favicon no Pixlr LJ9DeVgSeta Largura e Altura: Deixe em 16 x 16 px
[TUTORIAL] Favicon no Pixlr DI22cVWSeta Transparente: Marque está opção
O resultado será este:

[TUTORIAL] Favicon no Pixlr 4n3g32o

Já temos o ficheiro do Favicon pronto, agora falta preenche-lo adequadamente!
Agora, salve a imagem em seu computador para que possamos redireciona-la corretamente ao tamanho do Favicon:

[TUTORIAL] Favicon no Pixlr Group-128

No Pixlr, vá na opção:
Artmeiros Ficheiro Artmeiros Abrir Imagem... (Crt+O):

[TUTORIAL] Favicon no Pixlr UXxjxp4

Agora, iremos utilizar as ferramentas de seleção para que o mesmo seja redirecionando ao tamanho que queremos!
Para isso, basta selecionar Ferramento Letreiro (M):

[TUTORIAL] Favicon no Pixlr 2SUspK8

Selecione a imagem por inteiro:

[TUTORIAL] Favicon no Pixlr WpDYWQD

Depois de selecionado, dê um Crt+C (Copiar), e volte na camada do Favcon (16x16) e dê um Crt+V (Colar):

[TUTORIAL] Favicon no Pixlr 4n3g32o


Após ter colado a imagem, vá no menu principal e selecione:
Artmeiros Editar Artmeiros Transformação Livre... ou dê um Crt+T:

[TUTORIAL] Favicon no Pixlr EOsru0k

Agora iremos fazer a parte principal do trabalho, redirecionar a imagem em um tamanho de Favicon 16x16!

Após ter feito o passo anterior (Transformação livre...), o resultado será este:

[TUTORIAL] Favicon no Pixlr ZL9gIAN

Mas para que tenhamos um bom resultado, no canto inferior direito, deixo em 800%

[TUTORIAL] Favicon no Pixlr Kir20qw

Após esse passo, volte na camada da imagem que iremos redirecionar, e com a tecla Shift apertada redirecione a imagem até caber dentro do espaço do Favicon:

[TUTORIAL] Favicon no Pixlr HsAUWoj

Este é o resultado visto com 800%, para ver se deu certo, deixe em 100% (na aba de navegação, passo anterior)

[TUTORIAL] Favicon no Pixlr 1TuWUdw

Pronto, Favicon feita com sucesso:

[TUTORIAL] Favicon no Pixlr 1TuWUdw

- Salvando o Arquivo:
Após ter feito completamente todos os passos, teremos que salvar a imagem para depois implementa-la no fórum, e para isso basta ir:
Artmeiros Ficheiro Artmeiros Guardar... (Crt+O);

[TUTORIAL] Favicon no Pixlr AjOcDO9

[TUTORIAL] Favicon no Pixlr 6o3DeyPSeta Nome: Deixe como quiser

[TUTORIAL] Favicon no Pixlr NhOA5Z4Seta Formato: Selecione PNG

[TUTORIAL] Favicon no Pixlr LJ9DeVgSeta Selecione: Ok


[TUTORIAL] Favicon no Pixlr 2tYNykM Resultado Final:

[TUTORIAL] Favicon no Pixlr KYkRphw

[TUTORIAL] Favicon no Pixlr QGUygmL



© Fórum dos Fóruns & @mocci



[TUTORIAL] Favicon no Pixlr Act_bottom Se surgir alguma dúvida relacionada com este tutorial, crie um tópico na categoria 'Outras questões' com o seguinte título: Criando Favicon no Pixlr.
APOllO

APOllO
Super Membro

Membro desde : 08/12/2014
Mensagens : 1104
Pontos : 1529

http://suportedesign.forumeiros.com

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos