<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Pixeis.net &#187; Downloads</title>
	<atom:link href="http://pt.pixeis.net/category/downloads/feed/" rel="self" type="application/rss+xml" />
	<link>http://pt.pixeis.net</link>
	<description>a tua revista online de arte digital</description>
	<lastBuildDate>Tue, 04 May 2010 02:01:49 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Sites com Vectores Grátis</title>
		<link>http://pt.pixeis.net/2009/05/sites-com-vectores-gratis/</link>
		<comments>http://pt.pixeis.net/2009/05/sites-com-vectores-gratis/#comments</comments>
		<pubDate>Fri, 29 May 2009 15:56:53 +0000</pubDate>
		<dc:creator>Carlos Silva</dc:creator>
				<category><![CDATA[Artigos]]></category>
		<category><![CDATA[Downloads]]></category>
		<category><![CDATA[arte]]></category>
		<category><![CDATA[desenho]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[download]]></category>
		<category><![CDATA[ilustração]]></category>
		<category><![CDATA[Inkscape]]></category>
		<category><![CDATA[logo]]></category>
		<category><![CDATA[vector]]></category>
		<category><![CDATA[vectores]]></category>

		<guid isPermaLink="false">http://pt.pixeis.net/?p=1208</guid>
		<description><![CDATA[Hoje mostro-vos links para alguns sites com download gratuito de vectores em vários formatos!


Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/08/como-fazer-umwallpaper-estilo-blueprint-no-inkscape/' rel='bookmark' title='Permanent Link: Como fazer um wallpaper estilo blueprint no Inkscape'>Como fazer um wallpaper estilo blueprint no Inkscape</a> <small>Vamos aprender a fazer um wallpaper com um desenho técnico de um carro no Inkscape...</small></li>
</ol>]]></description>
			<content:encoded><![CDATA[<p style="text-align: left;">Hoje mostro-vos links para alguns sites com download gratuito de vectores em vários formatos!</p>
<p><a href="http://vector-images.com/samples_clipart.php" target="_blank">www.vector-images.com</a> &#8211; Alguns vectores gratuitos.. É preciso registar. Formatos CDR e EPS.<br />
<a href="http://www.vectorportal.com/" target="_blank">www.vectorportal.com</a> &#8211; Vários vectores de estilos diversos em formato EPS.<br />
<a href="http://digital-clipart.com/text/links_catalogs_samples.htm" target="_blank">www.digital-clipart.com</a> &#8211; Muitos vectores em formato AI, EPS e CDR, em várias categorias. Há downloads free disponíveis &#8211; cliquem em samples.<br />
<a href="http://www.brandsoftheworld.com/">www.brandsoftheworld.com</a> &#8211; Site com practicamente todos os logos do mundo vectorizados.. Desde empresas a produtos. Em formato EPS.<br />
<a href="http://www.freevectors.net/" target="_blank">www.freevectors.net</a> &#8211; Site com imensos desenhos vectoriais.<br />
<a href="http://vector4free.com/vectors">www.vector4free.com</a> &#8211; Quantidade enorme de vectores grátis.<br />
<a href="http://qvectors.com/">www.qvectors.com</a> &#8211; Site com várias imagens vectoriais, desde simbolos a desenhos completos. Vários formatos.<br />
<a href="http://www.vectorjunky.com/">www.vectorjunky.com</a> &#8211; Site com várias categorias de vectores.<br />
<a href="http://www.vecteezy.com/">www.vecteezy.com</a> &#8211; Mais um site com montes de vectores.</p>
<p>Espero que seja útil para vocês!</p>


<p>Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/08/como-fazer-umwallpaper-estilo-blueprint-no-inkscape/' rel='bookmark' title='Permanent Link: Como fazer um wallpaper estilo blueprint no Inkscape'>Como fazer um wallpaper estilo blueprint no Inkscape</a> <small>Vamos aprender a fazer um wallpaper com um desenho técnico de um carro no Inkscape...</small></li>
</ol></p>]]></content:encoded>
			<wfw:commentRss>http://pt.pixeis.net/2009/05/sites-com-vectores-gratis/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Texturas de Papel Rasgado</title>
		<link>http://pt.pixeis.net/2009/02/texturas-de-papel-rasgado/</link>
		<comments>http://pt.pixeis.net/2009/02/texturas-de-papel-rasgado/#comments</comments>
		<pubDate>Tue, 17 Feb 2009 18:24:54 +0000</pubDate>
		<dc:creator>Ricardo Jorge</dc:creator>
				<category><![CDATA[Downloads]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[Projectos]]></category>
		<category><![CDATA[Tutoriais]]></category>
		<category><![CDATA[montagem]]></category>
		<category><![CDATA[papel]]></category>
		<category><![CDATA[régua]]></category>
		<category><![CDATA[scanner]]></category>
		<category><![CDATA[texturas]]></category>
		<category><![CDATA[Wacom]]></category>
		<category><![CDATA[web-design]]></category>

		<guid isPermaLink="false">http://www.pixeis.net/?p=923</guid>
		<description><![CDATA[Vamos aprender a fazer as nossas próprias texturas de papel rasgado. Quem quiser pode fazer o download das texturas já prontas a usar sem ter que fazer os passos anteriores


Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/01/como-fazer-texturas-impressoes-digitais/' rel='bookmark' title='Permanent Link: Como Fazer Texturas: Impressões Digitais'>Como Fazer Texturas: Impressões Digitais</a> <small>Vamos usar guache para pintarmos impressões digitais numa folha de papel e depois digitalizar e pôr no Photoshop.. Vão ver...</small></li>
</ol>]]></description>
			<content:encoded><![CDATA[<p>Actualmente muitos designers gostam de dar um estilo mais natural e não tão digital aos seus sites, usando elementos relativos à sua profissão &#8211; régua, lápis, borracha, pincel, wacom, bloco de notas e papel.. papel.. E que melhor para dar ao papel a aparência de papel que papel rasgado?</p>
<p>Então decidi fazer este artigo a mostrar como fazer texturas de papel rasgado de boa qualidade em vez das simulações digitais no Photoshop que a maior parte usa..</p>
<p><strong>Se quiserem fazer o download dos ficheiros, </strong><span style="color: #ff9900;"><a href="http://pt.pixeis.net/2009/02/texturas-de-papel-rasgado/#download"><strong>cliquem aqui</strong></a></span><strong> para ir para o fundo do artigo onde está o link para o download</strong></p>
<p>Mas para os que querem ver o que se passa nos bastidores, continuem a ler =D</p>
<h1>Material Necessário:</h1>
<p>- <strong>Papel de embrulho</strong> de uma cor sólida (eu comprei um vermelho por €0,40 e só usei um pouco)<br />
- <strong>Papel A4</strong> de uma cor que tenha muito contraste à do papel de embrulho (eu usei roxo)<br />
- <strong>Régua </strong>e <strong>Tesoura</strong>/<strong>X-acto</strong> (todos facultativos)<br />
- <strong>Scanner</strong></p>
<p>Eu escolhi papel de embrulho por ser barato em relação a muitos tipos de papéis, por ser fácil de encontrar nas mais diversas cores e por ter cada lado da folha de uma cor (uma colorida e uma branca)</p>
<p>Aqui está o que eu usei:</p>
<p><img class="aligncenter size-full wp-image-924" title="papel" src="http://pt.pixeis.net/wp-content/uploads/2009/02/papel.jpg" alt="papel" width="550" height="413" /></p>
<h1>Passo 1</h1>
<p>Então vamos lá começar a rasgar..</p>
<p>Cortei uma fita de papel, dividi-a em quatro e experiementei rasgar os pedaços de 4 formas diferentes: com e sem régua e com a parte colorida virada para cima e para baixo</p>
<p>A técnica que resulta melhor é com a parte colorida virada para cima (sem comparação) e com régua faz uma parte rasgada demasiado perfeita, por isso mais vale rasgar á mão..</p>
<p>Então rasguei depois vários pedaços de vários tamanhos do papel e fui digitalizar tudo.. Para digitalizar, ponham o papel rasgado no meio do scanner com a parte colorida a ser digiralizada e depois coloquem a folha de cor contrastante por cima, para depois vermos a diferença entre a parte rasgada (branca) e o fundo (agora da cor da folha.. sem folha seria também branco)</p>
<p>Eu usei estas características na digitalização:</p>
<p><img class="aligncenter size-full wp-image-925" title="scanner" src="http://pt.pixeis.net/wp-content/uploads/2009/02/scanner.jpg" alt="scanner" width="387" height="355" /></p>
<p>Então depois de digitalizar, obti isto que vou guardar para se poder usar nas imagens que quiser depois..</p>
<p><img class="aligncenter size-full wp-image-926" title="photoshoppy" src="http://pt.pixeis.net/wp-content/uploads/2009/02/photoshoppy.jpg" alt="photoshoppy" width="370" height="465" /></p>
<h1>Passo 2</h1>
<p>Normalmente este estilo é usado para simular papel normal branco  ou pautado de caderno.. Mas nós vamos mais longe e vamos usar uma imagem para parecer que está imprimida e que o papel está rasgado.. Por isso precisamos de uma imagem.. Eu vou usar esta:</p>
<p><img class="aligncenter size-full wp-image-932" title="waterwaves" src="http://pt.pixeis.net/wp-content/uploads/2009/02/waterwaves.png" alt="waterwaves" width="550" height="550" /></p>
<p>Vou criar um novo documento do Photoshop que vai ser a imagem final.. Vamos imaginar que é a header de um site, por isso vou criá-lo com a resolução de 550&#215;200..</p>
<p>Arrastem a imagem que querem usar (eu vou usar a dar ondas) para o novo documento..</p>
<p>Agora vamos ao documento do scanner e com a Rectangular Marquee Tool vou seleccionar uma zona com melhor aspecto e vou pressionar Ctrl+C para copiar..</p>
<p>No novo documento documento, pressiono Ctrl+V para colar e depois redimensionei e posicionei com a Move Tool:</p>
<p><img class="aligncenter size-full wp-image-933" title="colar1" src="http://pt.pixeis.net/wp-content/uploads/2009/02/colar1.jpg" alt="colar1" width="585" height="242" /></p>
<p>Vou ao documento do scanner e copio uma parte para a zona de baixo da imagem e colo na nova imagem..</p>
<p><img class="aligncenter size-full wp-image-934" title="colar2" src="http://pt.pixeis.net/wp-content/uploads/2009/02/colar2.jpg" alt="colar2" width="558" height="208" /></p>
<h1>Passo 3</h1>
<p>Agora vamos usar a Clone Stamp Tool para criar os lados e o centro da imagem =D</p>
<p>Junto as duas layers do papel numa só (seleccionem a de cima e pressionem Ctrl+E)</p>
<p>Então com a Clone Stamp Tool vamos escolher um pincel suave pequeno (cerca de 20px) e vamos escolher uma zona do lado da imagem e colar na parte que falta..  Para escolher o local de origem, Pressionem a tecla Alt e cliquem onde querem.. Depois é só clicar noutro local, e ele vai colar lá o que seleccionaram:</p>
<p><img class="aligncenter size-full wp-image-935" title="clone-stamp" src="http://pt.pixeis.net/wp-content/uploads/2009/02/clone-stamp.jpg" alt="clone-stamp" width="385" height="426" /></p>
<p>Fazemos então isto para os dois lados da imagem, e depois para o centro:</p>
<p><img class="aligncenter size-full wp-image-936" title="clonestamped" src="http://pt.pixeis.net/wp-content/uploads/2009/02/clonestamped.jpg" alt="clonestamped" width="550" height="200" /></p>
<p>Agora temos que substituir a parte roxa pelo nosso fundo e a parte vermelha pela nossa imagem..</p>
<p>Fundo primeiro..</p>
<h1>Passo 4</h1>
<p>Vou criar uma layer com o findo final da imagem.. Vou preenchê-lo com azul, uma mancha de branco no meio, preto dos lados e imenso gaussian blur (Filter&gt;Blur&gt;Gaussian Blur) para ficar com um gradiente =D</p>
<p><img class="aligncenter size-full wp-image-937" title="fundo1" src="http://pt.pixeis.net/wp-content/uploads/2009/02/fundo1.jpg" alt="fundo1" width="550" height="200" /></p>
<p>Agora ponho esta layer abaixo de todas as outras, ponho a da imagem das ondas invisível e vamos tratar da de papel..</p>
<p>Com a Eyedropper Tool, vou seleccionar o roxo que está à volta do papel.. Agora vamos ao menu Select&gt;Color Range e isto vai seleccionar todo o roxo na nossa imagem.. Quanto mais baixo for o valor que escolhermos, mais próximas do nosso roxo vão ser as cores que ele vai &#8220;aceitar&#8221; na selecção criada.. Vamos escolher um valor de forma a que a parte rasgada (branca) fique a cinzento escuro (se ficar branca, não se vai ver depois.. se ficar preta, vai ficar demasiado opaca &#8211; o que também não queremos uma vez que essa parte é apenas algumas fibras de papel e por isso é ligeiramente transparente)..</p>
<p style="text-align: center; "><img class="aligncenter size-full wp-image-938" title="colorrange" src="http://pt.pixeis.net/wp-content/uploads/2009/02/colorrange.jpg" alt="colorrange" width="538" height="292" /></p>
<p style="text-align: center; ">
<p style="text-align: left; ">Aceitamos a selecção e com a layer do papel seleccionada, clicamos no botão de criar uma máscara para a layer:</p>
<p style="text-align: left; "><img class="aligncenter size-full wp-image-939" title="mask1" src="http://pt.pixeis.net/wp-content/uploads/2009/02/mask1.jpg" alt="mask1" width="472" height="336" /></p>
<p style="text-align: left; ">Como seleccionamos a parte roxa, e a máscara depende da selecção, agora só vemos a parte roxa da imagem, por isso vamos clicar na máscara, e com ela seleccionada pressionar Ctrl+I para inverter.. Agora já deve aparecer o inverso.. Só a parte de papel =D</p>
<p style="text-align: left; "><img class="aligncenter size-full wp-image-940" title="masked" src="http://pt.pixeis.net/wp-content/uploads/2009/02/masked.jpg" alt="masked" width="550" height="200" /></p>
<p style="text-align: left; ">Agora a parte vermelha..</p>
<h1>Passo 5</h1>
<p style="text-align: left; ">Mesma coisa: Eyedropper Tool, seleccionar o vermelho, ir ao menu Select&gt;Color Range e seleccionar de forma a ficar todo o vermelho incluído:</p>
<p style="text-align: center; "><img class="aligncenter size-full wp-image-941" title="colorrange2" src="http://pt.pixeis.net/wp-content/uploads/2009/02/colorrange2.jpg" alt="colorrange2" width="531" height="300" /></p>
<p style="text-align: left;">Clicamos em Ok, e desta vez, seleccionamos a imagem que queremos que apareça no papel (a das ondas) e  criamos a máscara lá.. Temos de ter essa layer acima da que tem o papel obviamente, ou não se vai ver =P</p>
<p style="text-align: left;">Na minha imagem ainda se notavam alguns pixeis vermelhos, por isso seleccionei a máscara da imagem das ondas e pressionei Ctrl+L para editar os levels:</p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-942" title="levels" src="http://pt.pixeis.net/wp-content/uploads/2009/02/levels.jpg" alt="levels" width="528" height="462" /></p>
<p style="text-align: left;">Que tal está o resultado final?</p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-943" title="final1" src="http://pt.pixeis.net/wp-content/uploads/2009/02/final1.jpg" alt="final1" width="550" height="200" /></p>
<p style="text-align: left;">Claro que não está muito realista porque não tem sombras..</p>
<h1>Passo 6</h1>
<p style="text-align: left;">Podemos adicionar umas sombras e até algum Warp como no tutorial dos <a href="http://pt.pixeis.net/?p=863" target="_blank">selos</a> =D</p>
<p style="text-align: left;">E o resultado foi este:</p>
<p style="text-align: left;"><img class="aligncenter size-full wp-image-944" title="final2" src="http://pt.pixeis.net/wp-content/uploads/2009/02/final2.jpg" alt="final2" width="550" height="200" /></p>
<p style="text-align: left;">Mm.. Talvez o Blur tenha sido demasiado..</p>
<p style="text-align: left;">De qualquer maneira, agora já sabem fazer imagens destas =D</p>
<p><a name="download"></a></p>
<p style="text-align: left;">Para fazerem o <strong>download </strong>do ficheiro com o papel já pronto a usar e com transparência e tudo, cliquem <a href="http://www.pixeis.net/contador.php?url=http://www.mediafire.com/file/jifygtnyczz/PapelRasgado.zip" target="_blank">aqui</a>.</p>
<p style="text-align: left;">Espero que tenham gostado e até à próxima =D</p>


<p>Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/01/como-fazer-texturas-impressoes-digitais/' rel='bookmark' title='Permanent Link: Como Fazer Texturas: Impressões Digitais'>Como Fazer Texturas: Impressões Digitais</a> <small>Vamos usar guache para pintarmos impressões digitais numa folha de papel e depois digitalizar e pôr no Photoshop.. Vão ver...</small></li>
</ol></p>]]></content:encoded>
			<wfw:commentRss>http://pt.pixeis.net/2009/02/texturas-de-papel-rasgado/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Selo Digital</title>
		<link>http://pt.pixeis.net/2009/02/selo-digital/</link>
		<comments>http://pt.pixeis.net/2009/02/selo-digital/#comments</comments>
		<pubDate>Fri, 13 Feb 2009 22:18:04 +0000</pubDate>
		<dc:creator>Ricardo Jorge</dc:creator>
				<category><![CDATA[Downloads]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[Tutoriais]]></category>
		<category><![CDATA[Adobe]]></category>
		<category><![CDATA[Feed RSS]]></category>
		<category><![CDATA[papel]]></category>
		<category><![CDATA[pen tool]]></category>
		<category><![CDATA[smart objects]]></category>
		<category><![CDATA[texturas]]></category>
		<category><![CDATA[warp]]></category>
		<category><![CDATA[web-design]]></category>

		<guid isPermaLink="false">http://www.pixeis.net/?p=863</guid>
		<description><![CDATA[Vamos usar o Photoshop para criar um selo virtual com aspecto realista para usarmos nas nossas imagens. Quem quiser pode fazer o download do ficheiro já pronto


Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2008/12/tutorial-de-retrato-analogicodigital/' rel='bookmark' title='Permanent Link: Tutorial de Retrato Analógico/Digital'>Tutorial de Retrato Analógico/Digital</a> <small>Um tutorial de 4 passos sobre como aperfeiçoar os nossos desenhos...</small></li>
</ol>]]></description>
			<content:encoded><![CDATA[<p style="text-align: justify;">Já quase ninguém escreve á mão ou manda cartas pelo correio.. Uma vez que os métodos de transferência de informação digitais são sem dúvida muito melhores que o correio caracol, deixa de valer a pena usá-lo..</p>
<p style="text-align: justify;">Mas uma das coisas perdidas com a diminuição do fluxo de cartas são os selos.. Bem, eu não sou nenhum fã de selos, mas sem dúvida que os selos têm um poder simbólico muito forte e nós podemos usá-lo nos nossos projectos..</p>
<p style="text-align: justify;">Para isso, criei este selo no <a href="http://www.adobe.com/products/photoshop/photoshopextended/" target="_blank">Photoshop</a>, do qual vocês podem fazer o <a href="http://pt.pixeis.net/2009/02/selo-digital/#download" target="_self">download aqui</a> e que podem usar livremente em qualquer projecto. A imagem é um <strong>smart-object</strong>, por isso podem substituir a imagem do Feed RSS por qualquer outra imagem (se não souberem o que é alguma destas coisas, eu explico em baixo)..</p>
<h1>Passo 1</h1>
<p style="text-align: justify;">Então vamos lá abrir o Photoshop, criar um novo documento, eu escolhi 550&#215;550 e preencher o fundo com alguma coisa..</p>
<p style="text-align: justify;">Eu com um pincel grande pintei tudo de preto e depois fiz uma mancha branca no meio..</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-864" title="fundo" src="http://pt.pixeis.net/wp-content/uploads/2009/02/fundo.jpg" alt="fundo" width="381" height="382" /></p>
<p style="text-align: justify;">Agora vamos ao menu Filter&gt;Blur&gt;Gaussian Blur e vamos usar um valor perto do máximo.. ainda não gostei muito do resultado, por isso fiz mais umas manchas brancas e voltei a aplicar o Gaussian Blur e obti isto:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-865" title="blur" src="http://pt.pixeis.net/wp-content/uploads/2009/02/blur.jpg" alt="blur" width="377" height="378" /></p>
<p style="text-align: justify;">Agora vamos criar uma nova layer e dentro dela, um rectangulo com a Rectangle Tool no modo de Shape:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-866" title="shape" src="http://pt.pixeis.net/wp-content/uploads/2009/02/shape.jpg" alt="shape" width="130" height="54" /></p>
<p style="text-align: justify;">Eu criei um assim:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-867" title="rectangulo" src="http://pt.pixeis.net/wp-content/uploads/2009/02/rectangulo.jpg" alt="rectangulo" width="381" height="382" /></p>
<h1 style="font-size: 2em;">Passo 2</h1>
<p style="text-align: justify;">Agora precisamos de uma imagem para pôr no centro.. Eu vou usar esta imagem com o logo do Feed RSS  - <a href="http://pt.wikipedia.org/wiki/RSS" target="_blank">Feed RSS</a> é uma tecnologia que vários sites têm actualmente que permite  aos visitantes receber uma notificação quando o site tiver conteúdo novo.. É particularmente útil em sites de notícias e blogs.. Este site tem um Feed RSS, podem subscrever por e-mail <a href="http://www.feedburner.com/fb/a/emailverifySubmit?feedId=2774930&amp;loc=pt_BR" target="_blank">aqui</a> =D</p>
<p style="text-align: justify;">Voltando à imagem, vou colocar esta imagem no nosso documento e redimensionar até o logo caber no selo:</p>
<div class="mceTemp mceIEcenter" style="text-align: justify;">
<dl id="attachment_871" class="wp-caption aligncenter" style="width: 310px;">
<dt class="wp-caption-dt"><img class="size-medium wp-image-871" title="rss" src="http://pt.pixeis.net/wp-content/uploads/2009/02/rss-300x300.png" alt="Cliquem na imagem para ver maior.. Tamanho original 1000x1000px" width="300" height="300" /></dt>
<dd class="wp-caption-dd">Cliquem na imagem para ver maior.. Tamanho original 1000x1000px</dd>
</dl>
</div>
<p style="text-align: justify;">Depois de redimensionar, ficou assim (diminuí um pouco a Opacity da imagem para ver como ia ficar em relação ao rectângulo, mas depois voltei a mudar para 100%):</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-872" title="rss" src="http://pt.pixeis.net/wp-content/uploads/2009/02/rss.jpg" alt="rss" width="309" height="311" /></p>
<p style="text-align: justify;">Agora vamos aplicar a máscara do rectângulo ao logo RSS, para isso, pressionamos a tecla Alt enquanto arrastamos a máscara da layer do rectângulo para a layer do logo..</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-873" title="mask" src="http://pt.pixeis.net/wp-content/uploads/2009/02/mask.jpg" alt="mask" width="223" height="193" /></p>
<p style="text-align: justify;">Se não pressionarmos a tecla Alt, ele vai mover a máscara de uma layer para outra, mas com o Alt, ele duplica a máscara, ficando a mesma nas duas layers =D</p>
<p style="text-align: justify;">Agora vamos escolher a Path Selection Tool e, com a máscara da layer do rectângulo seleccionada, vamos clicar no path que aparece na imagem e pressionar Ctrl+T para editar o path.. E vamos aumentar um pouco o rectângulo para o selo ficar com a &#8220;moldura&#8221; branca à volta, como os selos costumam ter (pressionem a tecla Alt enquanto estiverem a redimensionar para ele redimensionar igual dos dois lados da imagem):</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-874" title="path" src="http://pt.pixeis.net/wp-content/uploads/2009/02/path.jpg" alt="path" width="401" height="294" /></p>
<p style="text-align: justify;">Agora vamos aceitar as alterações e vamos fazer aqueles recortes iguais aos dos selos reais =D</p>
<h1 style="font-size: 2em;">Passo 3</h1>
<p style="text-align: justify;">Vamos duplicar a layer do rectângulo e clicar com o botão direito do rato nela e escolher Rasterize (converter de vector para pixeis)</p>
<p style="text-align: justify;">Agora vamos arrastar a máscara da layer do rectângulo que ainda aí está para a nova layer (sem pressionar Alt) e vamos eliminar a layer que já não tem a máscara.. Agora, com a tecla Shift pressionada, vamos clicar uma vez na máscara, para a desactivar.. e vamos seleccionar a layer (não a máscara)..</p>
<p style="text-align: justify;">Vamos buscar agora a Eraser Tool, pressionar F5 para abrir o menu dos pincéis e vamos escolher um dos pincéis hard e com um tamanho que nos pareça apropriado para os cortes no selo.. Eu escolhi este:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-875" title="13pixeis" src="http://pt.pixeis.net/wp-content/uploads/2009/02/13pixeis.jpg" alt="13pixeis" width="184" height="130" /></p>
<p style="text-align: justify;">Agora, na secção Brush Tip Shape, vamos aumentar o Spacing até os círculos do nosso pincél estarem algo afastados.. Eu pus 120%:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-876" title="spacing" src="http://pt.pixeis.net/wp-content/uploads/2009/02/spacing.jpg" alt="spacing" width="384" height="468" /></p>
<p style="text-align: justify;">Agora, vamos editar a máscara da layer mais um pouco.. Com o Shift pressionado, vamos clicar na máscara para a activar novamente e depois vamos fazer o mesmo que fizemos antes, mas desta vez vamos diminuir o tamanho do rectângulo em apenas dois ou três pixeis de cada lado..</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-877" title="border" src="http://pt.pixeis.net/wp-content/uploads/2009/02/border.jpg" alt="border" width="391" height="282" /></p>
<p style="text-align: justify;">Aceitamos as alterações e vamos desactivar a máscara novamente e com a Pen Tool (P), vamos clicar com o botão direito do rato na imagem e escolher Stroke Path e lá vamos escolher a Eraser Tool e pressionar Ok..</p>
<p style="text-align: justify;">O que é que isto fez? Fez passar a nossa Eraser pelo path que temos seleccionado &#8211; o da máscara.. &#8211; Como a nossa Eraser Tool tinha um pincel com os círculos muito afastados, a nossa imagem ficou com os cortes tipo os dos selos..</p>
<p style="text-align: justify;">Já podemos activar a máscara de novo e clicar nela com o botão direito do rato e escolher Rasterize Vector Mask e depois clicar novamente com o botão direito e escolher Apply Layer Mask..</p>
<p style="text-align: center;"><a href="http://pt.pixeis.net/wp-content/uploads/2009/02/cortes1.jpg" rel="shadowbox[post-863];player=img;"><img class="size-full wp-image-878 aligncenter" title="cortes1" src="http://pt.pixeis.net/wp-content/uploads/2009/02/cortes1.jpg" alt="cortes1" width="373" height="259" /></a></p>
<p style="text-align: justify;">Agora podemos ir já para o passo seguinte.. Mas eu gosto de dar sempre um toque manual nas imagens.. Por isso, vou, com a Eraser tool, apagar um pouco pela imagem toda para os cortes não ficarem tão perfeitos.. Demora, mas vale a pena =D</p>
<p style="text-align: center;"><a href="http://pt.pixeis.net/wp-content/uploads/2009/02/cortes2.jpg" rel="shadowbox[post-863];player=img;"><img class="size-full wp-image-879 aligncenter" title="cortes2" src="http://pt.pixeis.net/wp-content/uploads/2009/02/cortes2.jpg" alt="cortes2" width="371" height="259" /></a></p>
<p style="text-align: justify;">Agora que temos o selo pronto, vamos dar-lhe uma aparência 3D real.. Mas antes, vamos fazer umas alterações à estrutura do nosso documento.. Vamos agrupar as nossas duas layers (seleccionar ambas e arrastá-las até ao botão de New Group)..</p>
<h1 style="font-size: 2em;">Passo 4</h1>
<p style="text-align: justify;">Agora vamos transformar o nosso grupo num Smart Object &#8211; Smart Objects são uma forma da fazer alterações a uma imagem ou layer sem danificar a inicial.. Têm várias aplicações prácticas e uma é a que vamos ver..</p>
<p style="text-align: justify;">Clicamos no nosso grupo com o botão direito do rato e escolhemos Convert to Smart Object e vemos que o nossogrupo se tornou numa única layer com um símbolo.. Se clicarmos duas vezes no símbolo, ele vai abrir um documento temporário que é apenas o nosso grupo.. logo, podemos alterar os conteúdos desse documento, gravar e as alterações aparecem no nosso documento inicial =D</p>
<p style="text-align: justify;">Uma desvantagem dos Smart-Objects é a impossibilidade de usar a ferramenta Warp em algumas situações.. Mas há uma forma de ultrapassar esse problema.. Cliquem novamente com o botão direito do rato no nosso Smart Object e escolham novamente Convert to Smart Object.. Isto vai criar outro Smart Object com o outro dentro&#8230; Não sei porquê, mas agora já é possível fazer Warp</p>
<h1 style="font-size: 2em;">Passo 5</h1>
<p style="text-align: justify;">Por isso, com a Move Tool e com o nosso Smart Object seleccionado, vamos pressionar Ctrl+T para transformar o Smart Object e vamos clicar na imagem com o botão direito do rato e ecolher Warp =D</p>
<p style="text-align: justify;">Se nunca usaram o Warp, vão achar espectacular, podem transformar a imagem de forma espectacular..</p>
<p style="text-align: justify;">Então vamos distorcer o nosso selo até parecer um papel real.. Tentem pôr como o meu:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-881" title="warp" src="http://pt.pixeis.net/wp-content/uploads/2009/02/warp.jpg" alt="warp" width="452" height="284" /></p>
<p style="text-align: justify;">Ok, agora vamos aceitar as alterações.. Que acham? Parece bem? Falta qualquer coisa, não é? Faltam as sombras..</p>
<p style="text-align: justify;">Por isso, vamos duplicar a layer do Smart Object e clicar com o botão direito do rato na layer que estiver em baixo e escolher Rasterize Layer &#8211; Isto converteu o Smart Object numa layer normal..</p>
<p style="text-align: justify;">Agora, com esta layer seleccionada, vamos editar os níveis.. Pressionem Ctrl+L para abrir a janela dos níveis e, na barra de preto e branco, vamos mover o handle branco completamente para o lado do preto &#8211; isto eliminou toda a claridade da imagem..</p>
<p style="text-align: justify;">Agora, vamos fazer Warp também a esta layer.. Vamos fazer a sombra como se a luz viesse da parte superior da imagem..</p>
<p style="text-align: justify;">Tentem pôr como a minha:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-882" title="sombra" src="http://pt.pixeis.net/wp-content/uploads/2009/02/sombra.jpg" alt="sombra" width="421" height="305" /></p>
<p style="text-align: justify;">Enquanto estão a alterar a sombra, a imagem não parece muito mais real? A diferença é espantosa =D</p>
<p style="text-align: justify;">Vamos aceitar as alterações e vamos dar uns retoques na sombra para ficar ainda mais realista..</p>
<p style="text-align: justify;">Vamos buscar a Blur Tool e eecolher um pincel suave de tamanho 90px ou mais pequeno.. e vamos aplicar levemente nos cantos da sombra até ficar ainda mais realista (mantenham sempre o pincel um pouco afastado da imagem, para não ficar demasiado):</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-883" title="blurtool" src="http://pt.pixeis.net/wp-content/uploads/2009/02/blurtool.jpg" alt="blurtool" width="404" height="290" /></p>
<p style="text-align: justify;">Agora temos oficialmente o nosso selo pronto =D</p>
<p style="text-align: justify;">Podem apagar a layer Background e ficam com a imagem transparente para poderem usar onde quiserem.. Então a vantagem do Smart Object neste caso é a facilidade de substituir a imagem do RSS por outra imagem qualquer sem ser preciso fazer o Warp novamente nem nada.. É só clicar duas vezes no ícone do Smart Object, na nova janela, fazer o mesmo até aparecer o nosso grupo com as duas layers.. Agora arrastem a imagem que quiserem usar para dentro do grupo, redimensionem a gosto, depois arrastem a máscara do logo RSS para a nova imagem e apaguem o RSS e está pronto =D</p>
<p style="text-align: justify;">Podem até aplicar uma textura ao selo facilmente desta forma.. É só arrastar a textura para o grupo, aplicar-lhe a máscara, pressionando Alt e já está</p>
<p style="text-align: justify;">Olhem aqui outro exemplo que fiz desta forma:</p>
<p style="text-align: justify;"><img class="aligncenter size-full wp-image-884" title="selo2" src="http://pt.pixeis.net/wp-content/uploads/2009/02/selo2.jpg" alt="selo2" width="396" height="289" /></p>
<p style="text-align: justify;">Vêem? Mesmo simples<br />
<a name="download"></a><br />
Se quiserem, podem fazer <a href="http://www.pixeis.net/contador.php?url=http://www.mediafire.com/file/jgnmmm0izw5/SeloDigital.psd" target="_blank">aqui</a> o download do ficheiro e usar à vontade onde quiserem =D</p>
<p style="text-align: justify;">Espero que tenham gostado do artigo e até à próxima =D</p>


<p>Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2008/12/tutorial-de-retrato-analogicodigital/' rel='bookmark' title='Permanent Link: Tutorial de Retrato Analógico/Digital'>Tutorial de Retrato Analógico/Digital</a> <small>Um tutorial de 4 passos sobre como aperfeiçoar os nossos desenhos...</small></li>
</ol></p>]]></content:encoded>
			<wfw:commentRss>http://pt.pixeis.net/2009/02/selo-digital/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Pack 7 Impressões Digitais</title>
		<link>http://pt.pixeis.net/2009/01/pack-7-impressoes-digitais/</link>
		<comments>http://pt.pixeis.net/2009/01/pack-7-impressoes-digitais/#comments</comments>
		<pubDate>Thu, 22 Jan 2009 17:04:14 +0000</pubDate>
		<dc:creator>Ricardo Jorge</dc:creator>
				<category><![CDATA[Downloads]]></category>
		<category><![CDATA[download]]></category>
		<category><![CDATA[Illustrator]]></category>
		<category><![CDATA[Inkscape]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[texturas]]></category>
		<category><![CDATA[vector]]></category>
		<category><![CDATA[vectores]]></category>

		<guid isPermaLink="false">http://www.pixeis.net/?p=790</guid>
		<description><![CDATA[Temos aqui um pack de 7 impressões digitais para fazerem o download e usarem nos vossos projectos sem restrições


Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/01/como-fazer-texturas-impressoes-digitais/' rel='bookmark' title='Permanent Link: Como Fazer Texturas: Impressões Digitais'>Como Fazer Texturas: Impressões Digitais</a> <small>Vamos usar guache para pintarmos impressões digitais numa folha de papel e depois digitalizar e pôr no Photoshop.. Vão ver...</small></li>
</ol>]]></description>
			<content:encoded><![CDATA[<p style="text-align: left;">Depois de vos termos mostrado <a href="http://pt.pixeis.net/?p=761" target="_blank">como fazerem as vossas próprias impressões digitais</a>, temos aqui um pack de 7 impressões digitais para poderem fazer o download e usarem nos vossos projectos sem restrições =D</p>
<p>Aqui podem ver um <a href="http://www.pixeis.net/contador.php?url=http://www.mediafire.com/file/j1yj21wzm2q/Impressões Digitais.pdf" target="_blank">ficheiro PDF</a> (610KB) com as 7 impressões digitais.. Podem abri-lo no Illustrator para usar os vectores, ou:</p>
<p>Podem fazer aqui o download de um <a href="http://www.pixeis.net/contador.php?url=http://www.mediafire.com/file/i22ij5mwi3n/ImpressõesDigitais.zip" target="_blank">pack</a> com as 7 impressões digitais  (1,46MB) em formato SVG e em PNG e ainda o ficheiro PDF (<span style="text-decoration: underline;">se não sabem qual dos packs tirar, tirem este</span>)..</p>
<p>Ok, espero que gostem e usem nos vossos projectos</p>


<p>Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/01/como-fazer-texturas-impressoes-digitais/' rel='bookmark' title='Permanent Link: Como Fazer Texturas: Impressões Digitais'>Como Fazer Texturas: Impressões Digitais</a> <small>Vamos usar guache para pintarmos impressões digitais numa folha de papel e depois digitalizar e pôr no Photoshop.. Vão ver...</small></li>
</ol></p>]]></content:encoded>
			<wfw:commentRss>http://pt.pixeis.net/2009/01/pack-7-impressoes-digitais/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>10 Espectaculares Fontes Gratuitas</title>
		<link>http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/</link>
		<comments>http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/#comments</comments>
		<pubDate>Sun, 18 Jan 2009 19:16:58 +0000</pubDate>
		<dc:creator>Ricardo Jorge</dc:creator>
				<category><![CDATA[Artigos]]></category>
		<category><![CDATA[Downloads]]></category>
		<category><![CDATA[download]]></category>
		<category><![CDATA[fontes]]></category>
		<category><![CDATA[texto]]></category>
		<category><![CDATA[tipografia]]></category>

		<guid isPermaLink="false">http://www.pixeis.net/?p=702</guid>
		<description><![CDATA[Como a maior parte das fontes famosas são sempre entre 30 e 180€, decidi juntar algumas boas fontes que vão dar um toque especial aos vossos trabalhos e que são gratuitas


Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/05/sites-com-vectores-gratis/' rel='bookmark' title='Permanent Link: Sites com Vectores Grátis'>Sites com Vectores Grátis</a> <small>Hoje mostro-vos links para alguns sites com download gratuito de vectores em vários formatos!...</small></li>
</ol>]]></description>
			<content:encoded><![CDATA[<p>Vamos directamente ao assunto: pelo que se vê por aí, ainda há muita gente que não dá atenção ao tipo de letra que usa.. Alguns usam sempre <strong>Arial/Helvetica</strong> ou <strong>Times New Roman</strong> e outros acham que escolher a <strong>Comic Sans</strong> vai enriquecer o seu trabalho, quando de facto vai fazer o contrário &#8211; a sério, não estou a brincar, perguntem a qualquer designer se gosta da fonte Comic Sans e vão vê-lo(a) a abrir os olhos, virar costas, nunca mais falar convosco e banir-vos do messenger. Até podem assinar <a href="http://www.petitionspot.com/petitions/bancomicsans" target="_blank">aqui a petição para banir a fonte Comic Sans (em inglês)</a> =D</p>
<p style="text-align: justify;">E, visto que várias pessoas dão mais valor à escolha das fontes que ao conteúdo, pode-se dizer que a tipografia é demasiado importante para se sobrevalorizar.</p>
<p style="text-align: justify;">Mas como a maior parte das fontes famosas, tipo a <strong>Century Gothic</strong>, <strong>Futura</strong>, <strong>Frutiger</strong>, <strong>Univers</strong>, <strong>Thesis</strong>, entre outras, são sempre entre <strong>30 </strong>e <strong>180</strong><strong>€</strong>, decidi juntar algumas boas fontes que vão dar um toque especial aos vossos trabalhos e que são gratuitas..</p>
<h3>Cliquem nas imagens para as aumentar</h3>
<p style="text-align: justify;"><img class="aligncenter size-medium wp-image-704" title="Gentium" src="http://pt.pixeis.net/wp-content/uploads/2009/01/gentium-300x91.png" alt="Gentium" width="300" height="91" /></p>
<p style="text-align: justify;">1- <strong>Gentium</strong>- <a href="http://en.wikipedia.org/wiki/Gentium" target="_blank">Wiki</a> &#8211; <a href="http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&amp;item_id=Gentium_basic" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&amp;item_id=Gentium_download" target="_blank"></a><a rel="attachment wp-att-705" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/districtthin/"><img class="aligncenter size-medium wp-image-705" title="DistrictThin" src="http://pt.pixeis.net/wp-content/uploads/2009/01/districtthin-300x87.png" alt="DistrictThin" width="300" height="87" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-705" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/districtthin/"></a>2- <strong>District Thin</strong> &#8211; <a href="http://www.philsfonts.com/freefont.html" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://www.philsfonts.com/freefont.html" target="_blank"></a><a rel="attachment wp-att-708" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/printclearly/"><img class="aligncenter size-medium wp-image-708" title="PrintClearly" src="http://pt.pixeis.net/wp-content/uploads/2009/01/printclearly-300x87.png" alt="PrintClearly" width="300" height="87" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-708" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/printclearly/"></a>3- <strong>Print Clearly</strong> &#8211; <a href="http://www.bvfonts.com/fonts/details.php?id=45" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://www.bvfonts.com/fonts/details.php?id=45" target="_blank"></a><a rel="attachment wp-att-711" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/sophia/"><img class="aligncenter size-medium wp-image-711" title="Sophia" src="http://pt.pixeis.net/wp-content/uploads/2009/01/sophia-300x91.png" alt="Sophia" width="300" height="91" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-711" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/sophia/"></a>4- <strong>Sophia </strong>- <a href="http://www.menschengeist.de/aidfonts.htm" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://www.menschengeist.de/aidfonts.htm" target="_blank"></a><a rel="attachment wp-att-712" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/versasanscon/"><img class="aligncenter size-medium wp-image-712" title="VersaSansCon" src="http://pt.pixeis.net/wp-content/uploads/2009/01/versasanscon-300x76.png" alt="VersaSansCon" width="300" height="76" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-712" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/versasanscon/"></a>5- <strong>Versa Sans Con</strong> &#8211; <a href="http://www.gmkfreefonts.com/fontspc/v/VersaSansCon-Light.html" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://www.gmkfreefonts.com/fontspc/v/VersaSansCon-Light.html" target="_blank"></a><a rel="attachment wp-att-715" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/anivers/"><img class="aligncenter size-medium wp-image-715" title="Anivers" src="http://pt.pixeis.net/wp-content/uploads/2009/01/anivers-300x77.png" alt="Anivers" width="300" height="77" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-715" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/anivers/"></a>6- <strong>Anivers </strong>- <a href="http://new.myfonts.com/fonts/exljbris/anivers/" target="_blank">Download</a> (é preciso registar-se no site)</p>
<p style="text-align: justify;"><a rel="attachment wp-att-716" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/fertigopro/"><img class="aligncenter size-medium wp-image-716" title="FertigoPro" src="http://pt.pixeis.net/wp-content/uploads/2009/01/fertigopro-300x77.png" alt="FertigoPro" width="300" height="77" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-716" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/fertigopro/"></a>7- <strong>Fertigo </strong><strong>Pro </strong>- <a href="http://new.myfonts.com/fonts/exljbris/fertigo-pro/" target="_blank">Download</a> (é preciso registar-se no site)</p>
<p style="text-align: justify;"><a rel="attachment wp-att-719" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/galileo/"><img class="aligncenter size-medium wp-image-719" title="Galileo" src="http://pt.pixeis.net/wp-content/uploads/2009/01/galileo-300x81.png" alt="Galileo" width="300" height="81" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-719" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/galileo/"></a>8- <strong>Galileo </strong>- <a href="http://www.fontspace.com/casady-and-greene/galileoflf" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://www.fontspace.com/casady-and-greene/galileoflf" target="_blank"></a><a rel="attachment wp-att-720" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/covington/"><img class="aligncenter size-medium wp-image-720" title="Covington" src="http://pt.pixeis.net/wp-content/uploads/2009/01/covington-300x87.png" alt="Covington" width="300" height="87" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-720" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/covington/"></a>9- <strong>Covington </strong>- <a href="http://www.dafont.com/covington.font" target="_blank">Download</a></p>
<p style="text-align: justify;"><a href="http://www.dafont.com/covington.font" target="_blank"></a><a rel="attachment wp-att-721" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/kontrapunkt/"><img class="aligncenter size-medium wp-image-721" title="Kontrapunkt" src="http://pt.pixeis.net/wp-content/uploads/2009/01/kontrapunkt-300x62.png" alt="Kontrapunkt" width="300" height="62" /></a></p>
<p style="text-align: justify;"><a rel="attachment wp-att-721" href="http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/kontrapunkt/"></a>10- <strong>Kontrapunkt</strong> &#8211; <a href="http://www.kontrapunkt.dk/news/ddprize_typeface_of_the_year_2004#downloads" target="_blank">Download</a></p>
<p style="text-align: justify;">Agora já não têm desculpa para usar sempre as fontes do costume ;D</p>
<p style="text-align: justify;">Se quiserem, podem fazer o download deste <a href="http://www.mediafire.com/file/mmngcttzzgi/10Fontes.pdf" target="_blank">ficheiro PDF</a> para imprimir e ver as 10 fontes em texto quando quiserem.</p>
<p style="text-align: justify;">Até à próxima =D</p>


<p>Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/05/sites-com-vectores-gratis/' rel='bookmark' title='Permanent Link: Sites com Vectores Grátis'>Sites com Vectores Grátis</a> <small>Hoje mostro-vos links para alguns sites com download gratuito de vectores em vários formatos!...</small></li>
</ol></p>]]></content:encoded>
			<wfw:commentRss>http://pt.pixeis.net/2009/01/10-espectaculares-fontes-gratuitas/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>Como Fazer uma T-Shirt para Geeks no Inkscape</title>
		<link>http://pt.pixeis.net/2008/12/como-fazer-uma-t-shirt-para-geeks-no-inkscape/</link>
		<comments>http://pt.pixeis.net/2008/12/como-fazer-uma-t-shirt-para-geeks-no-inkscape/#comments</comments>
		<pubDate>Wed, 24 Dec 2008 03:53:05 +0000</pubDate>
		<dc:creator>Ricardo Jorge</dc:creator>
				<category><![CDATA[Downloads]]></category>
		<category><![CDATA[Inkscape]]></category>
		<category><![CDATA[Tutoriais]]></category>
		<category><![CDATA[Adobe]]></category>
		<category><![CDATA[Cubo de Rubik]]></category>
		<category><![CDATA[designer]]></category>
		<category><![CDATA[geek]]></category>
		<category><![CDATA[Illustrator]]></category>
		<category><![CDATA[Linux]]></category>
		<category><![CDATA[logo]]></category>
		<category><![CDATA[montagem]]></category>
		<category><![CDATA[nerd]]></category>
		<category><![CDATA[Open-Source]]></category>
		<category><![CDATA[pen drive]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[Segway]]></category>
		<category><![CDATA[Star Trek]]></category>
		<category><![CDATA[Star Wars]]></category>
		<category><![CDATA[t-shirt]]></category>
		<category><![CDATA[texto]]></category>
		<category><![CDATA[vectores]]></category>
		<category><![CDATA[VistaPrint]]></category>
		<category><![CDATA[xadrez]]></category>

		<guid isPermaLink="false">http://www.pixeis.net/?p=371</guid>
		<description><![CDATA[Vamos aprender a criar uma imagem para uma t-shirt do princípio ao fim no Inkscape. Aprendam a vectorizar e a usar a Pen-tool!


Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/08/como-fazer-umwallpaper-estilo-blueprint-no-inkscape/' rel='bookmark' title='Permanent Link: Como fazer um wallpaper estilo blueprint no Inkscape'>Como fazer um wallpaper estilo blueprint no Inkscape</a> <small>Vamos aprender a fazer um wallpaper com um desenho técnico de um carro no Inkscape...</small></li>
</ol>]]></description>
			<content:encoded><![CDATA[<p>Ok, hoje andei a dar uma vista de olhos pelos meus desenhos antigos e encontrei lá um esboço de uma ideia para uma t-shirt que já fiz ao tempo.. A ideia era uma silhueta de uma mão a fazer o cumprimento Vulcano (Star Trek), mas em vez de ser uma silhueta normal, ela seria completamente formada por objectos relacionados aos geek&#8217;s &#8211; daí o nome de &#8220;T-shirt para Geeks&#8221;..</p>
<p style="text-align: justify;">Então decidi fazer um tutorial completo, mostrando todo o workflow.. desde a pesquisa de referências, vectorizar tudo no <strong>Inkscape</strong>, juntar todos os elementos e fazer uma montagem do resultado no <strong>Photoshop</strong>..</p>
<p style="text-align: justify;">Para começar, decidi usar o Inkscape porque estou mais á vontade com ele e porque é gratuito.. Por isso vão lá fazer o download do Inkscape e eu espero aqui&#8230; <a href="http://www.inkscape.org/" target="_blank">Inkscape</a>..</p>
<p style="text-align: justify;">Para quem não sabe, o Inkscape é um software de desenho vectorial.. E para quem não sabe o que é desenho vectorial, bem.. podem sempre ir à <a href="http://pt.wikipedia.org/wiki/Desenho_vetorial" target="_blank">Wiki</a>.. ou eu digo-vos de forma simples:</p>
<p style="text-align: justify;">As imagens normais, são formadas por um certo número de pixeis &#8211; o ponto mais pequeno que constitui a imagem &#8211; por isso, quando se faz zoom á imagem, começam-se a ver os pontos..</p>
<p style="text-align: justify;">Em desenho vectorial isso não acontece porque as imagens não são constituídas por pontos mas sim por formas geométricas.. Essas formas são gravadas através de fórmulas matemáticas e por isso, ao redimensionar, os programas apenas fazem os cálculos necessários e a imagem fica sempre com os traços perfeitos, não importa o tamanho.. Quem disse que a matemática não servia para nada? <img src='http://pt.pixeis.net/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> </p>
<p style="text-align: justify;">O principal programa de desenho vectorial do mercado é o <strong>Illustrator </strong>da Adobe, o qual eu poderia usar neste artigo, se não fosse o facto deste artigo ser para principiantes e ele custar <span class="price">US$599.. Mas se quiserem, podem ir ao site da Adobe e à secção do <a href="http://www.adobe.com/products/illustrator/" target="_blank">Illustrator</a> para fazerem o download da versão de demonstração que dura 30 dias</span></p>
<p style="text-align: justify;">Bem, acho que já chega de conversa, vamos começar.. a primeira coisa que fiz foi encontrar no Google uma imagem de uma mão a fazer o cumprimento vulcano.. assim que encontrei uma que gostei, guardei-a numa pasta no meu pc e fui á procura de outras imagens geek que eu tinha na minha lista para depois converter para vector&#8230;</p>
<h3 style="text-align: center; ">Lista de Coisas Geek (algumas nem tanto) que vou usar na imagem:</h3>
<p style="text-align: justify;">telemóvel, foguetão, café, átomo, pizza, cd, disquete, pen drive, cartão sd, robot, cubo de rubik, segway, portátil, sabre de luz (star wars), calculadora, pacman, pi, logo do klingon (star trek), peça de xadrez, rato pc, tux do linux, peças de tetris, naves do space invaders e talvez mais algumas que me lembre.. consolas e tal..</p>
<p style="text-align: justify;">Ok.. depois de fazer um monte de pesquisas pelo Google para encontrar as imagens de referência para a maior parte das imagens que quero (alguns dos objectos já tenho na minha colecção de vectores e outros são faceis de criar sem imagem (as peças de tetris por exemplo))..</p>
<p style="text-align: justify;">Quanto aos que já tinha, são estes:</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/vectores1.png" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-416" title="vectores1" src="http://pt.pixeis.net/wp-content/uploads/2008/12/vectores1-300x300.png" alt="" width="300" height="300" /></a></span></p>
<p style="text-align: justify;">Quanto aos que faltam, vou usar estas imagens para os criar:</p>
<p style="text-align: center;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/imagensdereferencia.jpg" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-417" title="imagensdereferencia" src="http://pt.pixeis.net/wp-content/uploads/2008/12/imagensdereferencia-300x225.jpg" alt="" width="300" height="225" /></a></p>
<p style="text-align: justify;">Para vectorizar as imagens há dois métodos, o automático e o manual.. O método automético é o mais fácil, põe-se uma imagem no Inkscape, pressiona-se um botão e alteram-se umas opções e voilá.. Está vectorizada a imagem.. mas há uns problemas neste método.. se a imagem tiver mais que 2 cores, o resultado não vai ser agradável e se for uma imagem com baixa resolução também..</p>
<p style="text-align: justify;">Quanto ao método manual, bem, importa-se a imagem para o Inkscape, selecciona-se uma ferramenta e percorre-se a imagem toda a criar todas as formas da imagem manualmente.. demora muito mais.. mas pode ficar tão bem quanto a nossa insistência.. =)</p>
<p style="text-align: justify;">Das imagens que eu encontrei no google, apenas quatro se qualificam para o método automático.. E é a do logotipo do Klingon, a do pc portátil, a das peças de xadrez (apenas as pretas) e a das naves do space invaders.. mas para obtermos os melhores resultados desse método, vou primeiro fazer umas alterações a essas imagens no photoshop&#8230;</p>
<h1 style="text-align: center; ">Vectorizar no Inkscape &#8211; Método Automático:</h1>
<p style="text-align: justify;">Ok, vou começar pela imagem das peças de xadrez, por isso abro o photoshop, e arrasto a imagem para lá&#8230;</p>
<p style="text-align: justify;">Clico duas vezes na layer com a tecla Alt pressionada para desbloquear a layer e com a ferramenta de selecção rectângular, selecciono a parte de baixo da imagem para tirar as peças brancas de lá.. Agora tenho apenas as pretas e o fundo&#8230; Agora, no menu Image, vou a Trim e selecciono Trasparent Pixels. Isto vai eliminar todos os pixeis transparentes da imagem e manter apenas o resto, que é o que queremos.</p>
<p style="text-align: justify;">Quando eu vectorizar a imagem no Inkscape, ele vai criar os vectores pelos níveis de preto.. Todas as partes da imagem abaixo de um certo nível de preto (threshold) vão ficar num vector e as partes da imagem que estiverem acima, vão ficar noutro.. O Inkscape pode fazer isso de acordo com o threshold que inserirmos, mas o Photoshop tem um slider com isso, por isso vou ao menu Image, Ajustments e Threshold.. e lá, arrasto a barra até as peças estarem completamente pretas.. agora a imagem tem apenas 2 cores.. branco e preto, o que vai simplificar o trabalho do Inkscape..</p>
<p style="text-align: justify;">Aproveito e faço a mesma coisa ás outras três imagens..</p>
<p style="text-align: justify;">Abro agora o Inkscape e importo a imagem para lá e vou ao menu Path e Trace Bitmap e pressiono Ok.. podia alterar algumas das definições mas como eu fiz aquelas alterações no Photoshop isto já chega para fazer a vectorização bem..</p>
<p style="text-align: justify;">Aqui estão depois de vectorizados:</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/vectores2.png" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-418" title="vectores2" src="http://pt.pixeis.net/wp-content/uploads/2008/12/vectores2-300x300.png" alt="" width="300" height="300" /></a></span></p>
<p style="text-align: justify;">Ok.. a parte automática já está.. vamos á parte manual.. <img src='http://pt.pixeis.net/wp-includes/images/smilies/icon_biggrin.gif' alt=':D' class='wp-smiley' /> </p>
<h1 style="text-align: center; ">Vectorizar no Inkscape &#8211; Método Manual:</h1>
<p style="text-align: justify;">Bem, este processo é um pouco aborrecido e repetitivo, mas depois de se aprender, pode-se usar para desenhar qualquer coisa em vectores..</p>
<p style="text-align: justify;">Vamos começar.. eu vou escolher uma das imagens mais complicadas para descrever aqui os passos e explicar tudo..</p>
<p style="text-align: justify;">E a imagem escolhida é a do segway.. é um objecto com uma forma complicada e apenas o formato o caracteriza..</p>
<p style="text-align: justify;">Por isso vamos lá abrir o Inkscape, arrastar para o programa a <a href="http://www.segwaytexaswest.com/images/i2_white_high.jpg" rel="shadowbox[post-371];player=img;" target="_blank">imagem do segway</a> e vamos começar a vectorizar até cairmos para o lado (ou não&#8230; vocês escolhem..)..</p>
<p style="text-align: justify;">Ok, um dado importante acerca do Inkscape: O programa ainda não é uma versão final, por isso tem erros, isto significa que o programa pode ir abaixo de um momento para o outro sem razão aparente.. Por isso o primeiro passo é gravar o ficheiro mal se importar a imagem.. escolham uma localização e um nome e pronto.. agora é uma mão no rato e outra com os dedos prontos a pressionar o Ctrl+S (gravar) porque assim, se o programa for abaixo, não ficam com trabalho perdido.. =D.. e vamos começar..</p>
<p style="text-align: justify;">Bem, nós queremos um vector do segway apenas de duas cores (melhor: uma cor e transparência).. por isso vamos começar por fazer um vector com todo o objecto de uma vez e depois adicionamos os detalhes..</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/comecar.jpg" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-419" title="comecar" src="http://pt.pixeis.net/wp-content/uploads/2008/12/comecar-299x167.jpg" alt="" width="299" height="167" /></a></span></p>
<p style="text-align: justify;">Agora vamos bloquear a imagem para não a mudarmos de lugar sem querer.. Para isso vamos ao menu Layer e á opção Layers.. isto vai abrir uma barra lateral á direita do ecrâ que vai conter todos os sub-menus que abrirmos (neste momento só tem o submenu Layers).. Aqui vamos clicar no cadeado ao lado do nome da layer para a bloquear e vamos depois clicar no botão &#8220;+&#8221; para adicionar uma nova layer em cima da que já temos e com o nome &#8220;Vector&#8221;..</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/layers.jpg" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-420" title="layers" src="http://pt.pixeis.net/wp-content/uploads/2008/12/layers-300x212.jpg" alt="" width="300" height="212" /></a></span></p>
<p style="text-align: justify;">ok? Já está? Vamos começar..</p>
<p style="text-align: justify;">Vamos pegar na ferramenta de criação de curvas de bezier (Shift+F6), e vamos começar pela parte de cima do Segway..</p>
<p style="text-align: justify; "><strong>[<span style="text-decoration: underline;">Teoria</span> básica de criação de curvas de bezier: são curvas criadas por pontos que podem ser pontos de curva ou vértices..</strong></p>
<p style="text-align: justify; "><strong><span style="text-decoration: underline;">Técnica</span> básica de criação de curvas de bezier: clicar cria um vértice.. se clicar e manter pressionado o botão do rato e arrastar vai criar um ponto de curva.. se começarmos uma curva, mas queremos mudar de direcção e criar um vértice com curva dos dois lados, faça a curva normalmente e depois, pressione a tecla Shift e continue (se não perceberam, assim que chegarem a uma situação assim, vão perceber).. ok.. também já chega.. =D]</strong></p>
<p style="text-align: justify;">Vamos fazer zoom até á pega esquerda do Segway e seguir sempre no sentido dos ponteiros do relógio.. No vídeo seguinte, mostro como vectorizei o exterior do Segway completamente.. observem o vídeo e vejam como foi feita a vectorização.. (não precisam de ver o vídeo todo..) e depois façam vocês.. Se não ficarem os pontos todos bem á primeira tentativa, podem sempre ir alterá-los depois da forma toda estar completa.. E lembrem-se, a Pen Tool são 20 segundos para aprender e uma vida inteira para aperfeiçoar =D.. Sempre quis dizer qualquer coisa assim =P</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://www.youtube.com/v/AB34dh3vNsI&amp;hl=en&amp;fs=1&amp;rel=0&amp;color1=0x2b405b&amp;color2=0x6b8ab6" /><param name="allowfullscreen" value="true" /><embed type="application/x-shockwave-flash" width="425" height="344" src="http://www.youtube.com/v/AB34dh3vNsI&amp;hl=en&amp;fs=1&amp;rel=0&amp;color1=0x2b405b&amp;color2=0x6b8ab6" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p style="text-align: justify;">Agora vou só criar outros objectos que ache relevante para o Segway e depois subtraio-os ao Segway para ficarem a transparente&#8230; Para isto, nas layers, diminuam a Opacity da layer Vector. Para subtrair um objecto a outro, seleccionem ambos, vão ao menu Path e escolham Subtract e o objecto que estiver em cima vai ser retirado ao de baixo.. Vejam aqui como ficou o Segway depois de algumas alterações..</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/segway.jpg" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-421" title="segway" src="http://pt.pixeis.net/wp-content/uploads/2008/12/segway-284x300.jpg" alt="" width="284" height="300" /></a></span></p>
<p style="text-align: justify;">Agora não esquecer de apagar a layer com a foto do segway e gravar =D</p>
<p style="text-align: justify;">Com umas das shapes originais (quadrados, círculos, texto, etc) fiz as formas mais simples, como os símbolos de tetris e o pacman..</p>
<p style="text-align: justify;">Ok.. Agora já só falta a mão.. por isso fui ao google outra vez e pesquisei uma mão a fazer o cumprimento Vulcano.. Quando encontrei uma, vectorizei-a e gravei..</p>
<p style="text-align: justify;">Agora, com o documento da mão aberto no Inkscape, fui á pasta onde tinha gravados os outros objectos e arrastei-os a todos para a janela do Inkscape.. Gravei o documento e diminuí o tamanho de todos os objectos excepto a mão..</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/geek-shirt-vectores.png" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-422" title="geek-shirt-vectores" src="http://pt.pixeis.net/wp-content/uploads/2008/12/geek-shirt-vectores-300x170.png" alt="" width="300" height="170" /></a></span></p>
<p style="text-align: justify;">Depois fui colocando-os espalhados pelo interior da mão com tamanhos variados de forma a ocupar toda a área disponível..</p>
<p style="text-align: center;"><span style="color: #ff0000;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/geekshirt.jpg" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-423" title="geekshirt" src="http://pt.pixeis.net/wp-content/uploads/2008/12/geekshirt-300x300.jpg" alt="" width="300" height="300" /></a></span></p>
<p style="text-align: justify;">Ok, e pronto.. Já temos uma t-shirt para geeks..</p>
<p style="text-align: justify;">Fiz então uma montagem para visualizarmos melhor como ficaria o resultado:</p>
<p style="text-align: center;"><a href="http://pt.pixeis.net/wp-content/uploads/2008/12/final1.jpg" rel="shadowbox[post-371];player=img;"><img class="aligncenter size-medium wp-image-500" title="final1" src="http://pt.pixeis.net/wp-content/uploads/2008/12/final1-281x300.jpg" alt="" width="281" height="300" /></a>Que tal? Não está impressionante?</p>
<p style="text-align: justify;">Se quiserem aprender a fazer a montagem, vejam este <a href="http://pt.pixeis.net/?p=369" target="_blank">artigo</a>.</p>
<p style="text-align: justify;">Para fazer o download dos ficheiros do Inkscape com todos os vectores e com o final <span style="color: #ff0000;"><a href="http://www.pixeis.net/contador.php?url=http://www.mediafire.com/file/foymomw5mjx/GeekShirt.zip" target="_blank">cliquem aqui</a></span>.</p>
<p style="text-align: justify;">Para imprimirem a t-shirt, recomendo que usem os serviços do site <span style="color: #ff0000;"><a href="http://www.vistaprint.co.uk/" target="_blank">VistaPrint</a></span>, onde podem imprimir a t-shirt de forma muito simples e barata.. e assim, poderão mostrar aos vossos amigos a vossa t-shirt única =D</p>
<p style="text-align: justify;">Nota: Esta imagem usa vários logos e imagens que violam direitos de copyrigth de várias empresas.. por isso, se fizerem uma imagem com estes logos, não podem comercializá-la.. mesmo. Todos os logos e imagens são propriedade das respectivas empresas e foram utilizadas aqui sem autorização mas com todo o respeito pelas empresas e produtos =D</p>
<p style="text-align: justify;">Podem ver esta t-shirt no site <a href="http://emptees.com/tees/11918-geekshirt" target="_blank">Emptees</a> e votar nela =D</p>
<p style="text-align: justify;">Espero que tenham gostado do artigo e  que digam a vossa opinião nos comentários e até á próxima =D</p>


<p>Artigos relacionados:<ol><li><a href='http://pt.pixeis.net/2009/08/como-fazer-umwallpaper-estilo-blueprint-no-inkscape/' rel='bookmark' title='Permanent Link: Como fazer um wallpaper estilo blueprint no Inkscape'>Como fazer um wallpaper estilo blueprint no Inkscape</a> <small>Vamos aprender a fazer um wallpaper com um desenho técnico de um carro no Inkscape...</small></li>
</ol></p>]]></content:encoded>
			<wfw:commentRss>http://pt.pixeis.net/2008/12/como-fazer-uma-t-shirt-para-geeks-no-inkscape/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
	</channel>
</rss>

