segunda-feira, 5 de setembro de 2011

Tutorial PixelArt

Tutorial PixelArt (Gil xD)
Bom pra começar, “iai galera tudo beleza com vocês? xD”
Hoje vim aqui para ensinar o básico do básico em PixelArt.
Alguns podem estar se perguntando “que diabos é pix...qualquercoisa?”
Para essa grande maioria eu trouxe uma breve explicação sobre o assunto abordado.
O Que é PixelArt?
Pixel art é uma forma de arte digital na qual as imagens são editadas a nível de pixels. É criada pintando-se individualmente cada pixel em programas de edição de imagens raster(como o Microsoft Paint ou o Photoshop ).
Pixel
Pixel ou Píxel (sendo o plural píxeis) (aglutinação de Picture e Element, ou seja, elemento de imagem, sendo Pix a abreviatura em inglês para Picture) é o menor elemento num dispositivo de exibição (como por exemplo um monitor), ao qual é possivel atribuir-se uma cor. De uma forma mais simples, um pixel é o menor ponto que forma uma imagem digital, sendo que o conjunto de milhares de pixels formam a imagem inteira.
Num monitor colorido cada Pixel é composto por um conjunto de 3 pontos: verde, vermelho e azul. Nos melhores monitores cada um destes pontos é capaz de exibir 256 tonalidades diferentes (o equivalente a 8 bits) e combinando tonalidades dos três pontos é então possível exibir pouco mais de 16.7 milhões de cores diferentes. Em resolução de 640 x 480 temos 307.200 pixels, a 800 x 600 temos 480.000 pixels, a 1024 x 768 temos 786.432 pixels e assim por diante.






Bom chega de enrolação vamos partir para a aula :D
Primeiro vamos Abrir o Paint para o “molde”.






“Mas Gil a minha imagem ta maior que a sua”
Isso é porque as configurações do seu Paint não estão configuradas para este tamanho, sem problemas tudo que você precisa fazer é pressionar CTRL+E e colocar a largura em 45 px e a altura também em 45 px dessa forma:




Agora tudo que precisamos fazer para o “Molde” é fazer um circulo no Paint, para facilitar a visão seu uso na ferramenta de zoom do Paint  e  uso também um atalho bastante útil CTRL+G(mostrar grade). ^^
Bem depois de feito seu circulo deve estar assim.




Agora por maior praticidade vamos levar nosso circulo para o Photoshop.
“Mas Gil como faço isso DDD:”
Simples e prático CTRL+A, CTRL+C, CTRL+V  ^^
Depois de Abrir o Photoshop nós Criamos um “Arquivo Novo” (CTRL+N) com as seguintes informações.



Depois disso somente de “Ok” e cole seu circulo no novo arquivo criado. ^^
Agora vem a parte mais chata vamos dar “vida” a nossa esfera, para isso precisamos utilizar diferentes tons da mesma cor para alcançarmos o efeito 3D nesse exemplo utilizarei cinza para que o entendimento seja melhor.




Primeiramente para não pintar nada fora da esfera fiz uma seleção dentro dela.



Agora vou começar a pinta-la coma a cor mais clara primeiro deixando somente um pequeno circulo com a cor branca dando a aparência de luz.




E depois disso continuamos colocando cores mais escuras com foco em deixar akele ponto branco com uma transição de tons de cinza.




Agora vamos suavizar mais um pouco essa transição usando mais tons de cinza.
















Agora tiramos o Zoom e vemos nossa “Obra de Arte” lembrando que quanto tons da mesma cor usamos melhor fica a transição e melhor fica o efeito. 












“Mas Gil e se depois de ter feito isso tudo eu quizer mudar a cor? ‘-‘ ”
Bom você pode fazer isso através de uma ferramenta do photoshop chamada Hue/Saturation (Matiz/Saturação) o atalho dela é CTRL+U você só precisa ativar uma coisa nessa ferramenta para poder mudar as cores da sua esfera. :D



Agora é só você mexer no Matiz (Hue) para mudar a cor na saturação para aumentar a “força” dessa cor e a luminosidade para clarear ou escurecer a imagem. ^^
Mas antes de me despedir em todo tutorial que eu faço deixo uma mensagem para as pessoas que me aturaram até o fim.
Engraçado era Charles Chaplin que conseguia fazer multidões rir durante uma guerra e sem falar uma palavra.
Bom Pessoal por hoje é só qualquer duvida ou sugestão ou até mesmo criticas de próximo tutorial eis meu e-mail, onde vossas senhorias podem me contatar.
Hotmail: Gilberto.j2006@hotmail.com
Facebook: Gilberto Costa


segunda-feira, 22 de agosto de 2011

SEVEN !

>Fala ae galera blz? Postando apenas uma pequena montagem simples no PS
descrevendo só um pouco do que a SEVEN oferece para os seus alunos!
vlw galera fui!!!




segunda-feira, 15 de agosto de 2011

Efeito censura - Photoshop


1° Passo : Abra o Photoshop, carregue uma imagem desejada pressionando CRTL+O (ou FILE>OPEN)


2° Passo : Para melhor visualização da imagem amplie o local onde deseja censurar, pressione CRTL +, ou pressionando a letra Z do teclado para selecionar a Zoom Tool.

3° Passo : Pressione a letra L do teclado para selecionar a Lasso Tool, caso a ferramenta não esteja visível clique e segure para que a janela com as outras ferramentas apareça e selecione Lasso Tool , crie uma seleção ao redor do rosto da pessoa.



4° Passo : Vá em Select > Modify > Feather (Shift + F6)  e defina o valor de 2 ou 3 pixels, para que o efeito fique melhor.



5° Passo : Pressione Ctrl+J para duplicar a área selecionada.

6° Passo : Certifiquei que a layer duplicada esteja selecionada, depois de duplicar a área selecionada vá em Filter> Pixelate> Mosaic.



7° Passo : Na janela do Mosaic, caso não apareça a parte da imagem onde você quer censurar não se preocupe apenas diminua o zoom, para um efeito um pouco mais suave o meu ficou com “Cell Size de 16 square”, e pressione OK.


8° Passo : Agora e só salva, para salvar em formato JPG pressione CTRL + SHIFT + S, irá aparecer.
Selecione a pasta que deseja salvar.
Escreva o nome que deseja para a imagem.
Selecione o formato JPEG(*.JPG;*.JPEG;*.JPE), e pressione salvar.
Na próxima janela coloque a Quality 12, e pressione OK.



Postado por Mario Parente










Finalização de cartão de arquivo para gráfica

Pessoal, neste tutorial iremos tratar de como ajustar um trabalho para que ele possa ser impresso como cartão de visita, tamanho, marca de corte e converter em linha

1º Passo: Definir o tamanho do cartão de visitas
“Eu uso sempre  9cm X 5cm”


2º Passo: Depois de construir o Cartão de Visita vamos analizar as marca de corte.A marca de corte usada custuma ser 3 mm,  mas você tem que estudar a gráfica antes de fechar o arquivo para ver a marca de corte


.
3º Passo: Depois de construir e verifica a marca de corte vamos coloca todas as fontes em Create
Outlines, isto ajudará a impedir quaisquer problemas relacionados com a fonte da impressora 
.

4º Passo: Depois de construir e verifica a marca de corte e o Create Outlines vamos salvar em Png.para levar para gráfica o material. ''Eu prefiro salva como png. fica na sua escolha.''

5º Passo: Colocar no formato de .png e clicar em salvar
 




Postado por Matheus Oliveira  




      



       

Superando Metas!

Quando iniciamos o blog, tinhamos a missão de conseguir 250 seguidores em uma semana. Conseguimos superar essa meta em 96 horas! (4 dias)

Agradecemos a todos os que acreditam nesse projeto e prometemos postar sempre assuntos que lhe trarão um aperfeiçoamento considerável se tratando de COmputação Gráfica!

domingo, 14 de agosto de 2011

Como corrigir olhos vermelhos usando Photoshop

Abra o Photoshop, carregue uma imagem que necessite desde reparo pressione CRTL+O
(ou FILE>OPEN) (Imagem 001)

 
Imagem 001 (Clique na Imagem para Ampliar)



Pressione Ctrl+J para duplicar a layer.CRTL +, ou pressionando a letra Z do teclado para selecionar a Zoom Tool. Agora selecione a ferramenta Healing Brush Tool e mantenha o botão do mouse pressionado até que as outras ferramentas apareçam, selecione a ferramenta Red Eye Tool. (Imagem 002, 1)(Imagem 002, 2)

Para melhor visualização da imagem amplie o local onde deseja corrigir, pressione
Na minha imagem eu utilizei os valores de 15% para Pupil Size (5) e 50% para Darken Amount, os valores podem variar.

Imagem 002 (Clique na Imagem para Ampliar)



Clique sobre o olho vermelho e o Photoshop irá corrigir automaticamente a cor, caso seja necessário repita o processo no outro olho.

Para que a imagem volte ao zoom normal pressione CTRL + 0.

Para salvar a imagem no formato JPG pressione CTRL + SHIFT + S.
Selecione a pasta que deseja salvar.
Escreva o nome que deseja para a imagem.
Selecione o formato JPEG(*.JPG;*.JPEG;*.JPE), e pressione salvar.
Na próxima janela coloque a Quality 12, e pressione OK.  
    Imagem 003 (Clique na Imagem para Ampliar)  

    Postado por Mario Parente

    quarta-feira, 10 de agosto de 2011

                                                           Pintura digital feita por Arnold Oliveira

    HTML,CSS e TABLELESS: Que monte de siglas sao essas?




    Fala ae galera do Quinto Estágio tudo na paz?
    Pessoal hoje vou ter a missão de explicar o que são essas siglas,apresentar alguns conceitos e também tenho a ideia de no final criarmos um site usando HTML/CSS,ouvimos muito essas siglas mas pouco entendemos sobre eles.Para quem trabalha na parte WEB já tem essas siglas no sangue.Esses comandos estão relacionados na criação de páginas WEB e por mais assustador que possa parecer é bem fácil criar páginas WEB utilizando essas regras,para se ter noção é possivel fazer páginas utilizando apenas o bloco de notas!
    Mas antes de explicar ao pé da letra o significado do HTML/CSS e bombardear vocês com um monte de comandos,tags,códigos e etc,
    eu quero que vocês entedam a função deles na hora de você criar um site,primeiro vamos
    fazer uma pequena comparação entre criar um site usando HTML/CSS e formatar um texto
    no Word.Se você escrever um texto no word ele vai ficar alinhado à esquerda,provavelmente terá a fonte Arial ou Times New Romam , tamanho
    12 e cor preta.O texto só ficará bem diagramado caso voce comece a formatar o texto adicionando borda,dando destaque em alguns títutlos,adicinando
    cabeçalho e rodape e etc.Bom aonde eu quero chegar com isso?Simples .P
    vocês pensem no HTML como se você o Word é nele que você vai inserir suas imagens,seus textos,vai criar links,animações e uma série de outros
    recursos para deixar o seu site o mais atrativo possível para os usuários e possíveis clientes também.E o CSS seria quem nesse exemplo?Ele seria
    a formatação do seu texto/site.Com o CSS você define regras de formatação e pode especificar quais elementos do seu site receberão essa formatação
    ou não.QUando você une o HTML/CSS os limites são desconhecidos (essa frase é de algum lugar não?rs).E vejam que eu não falei nada sobre JAVASCRIPT,
    PHP,MySQL,JQUERY e um monte de outras siglas que quando você conseguir incorporar ao seu site ele ficará cada vez mais poderoso e atrativo!

    Pessoal no momento é só isso e nos próximos post darei continuade e explicarei o conceito de TABLELESS,um pouquinho da história do HTML/CSS e colocarei
    alguns comandos para começarmos a criar um site que pode servir de portifólio para quem quiser!

    VLW Galera espero que com esse primeiro post possa ter sido útil e até a próxima!

    JF Estagiário SEVEN NI - Web Designer