Encomende seu layout: Steph Design

Ha tempos venho pensando se faço ou não esse post, mas por fim decidi logo fazer, pois afinal, o que custa? Enfim, desde que fiz algumas mudanças no layout do blog (em agosto) abri um espaço para encomendas de layouts. Desde o ano passado venho fazendo layouts de graça para alguns blogs, pois nunca fiz nenhum tipo de curso e achava ser injusto cobrar determinado preço por algo relativamente ruim e que possa dar problemas futuramente, mas por fim, para quem fazia os tais layouts, grande maioria estava satisfeito com o resultado e desde o começo desse ano vinha recebendo conselhos para que eu passasse a valorizar mais o meu trabalho e meu tempo gasto. Fiquei pensando muito a respeito, pois não sabia direito como faria, quanto cobrar, como me organizar... Pesquisando muito sobre o assunto, acompanhando o trabalho de outras pessoas, descobri como afinal pudesse ganhar um "trocado" fazendo o que mais gosto. 

Comecei divulgando meu trabalho e aos poucos estou montando meu portfólio. Desde então bastante gente vem atras de mim para encomendar, muitos perguntam como funciona, como irão efetuar o pagamento e etc. Para tirar as duvidas e divulgar esse trabalho, venho fazer esse post para mais esclarecimentos. 

O blog está com diversos cantinhos interessantes, e um deles é o menu "Encomende seu layout", aonde encontrará meu portfólio, termos e o formulário de preenchimento. Atualmente trabalho somente com o Blogspot e venho tentando aprender algo mais para trabalhar também na plataforma do Wordpress futuramente. 

Mas afinal, quanto custa um layout? Dos mais simples de 30 aos mais trabalhados de 50.
Mas tão barato? Sim, é aonde me sinto mais confortável a cobrar, pois como dito no principio, nunca fiz nenhum tipo de curso, então seria injusto cobrar 100 ou até 500 reais por algo inseguro.
Como faço para efetuar o pagamento? Algumas pessoas desistem de encomendar por acharem que talvez a forma de pagamento seja complicada, mas não, é a coisa mais simples do mundo. Para saber como funciona, como ocorrerá o processo de criação e etc é só ler nossos termos e tirar todas suas duvidas.

Meu e-mail de contato em relação a encomendas e duvidas de acordo com os layouts é: stephdesign@live.com. Então corra e tenha seu layout dos sonhos por um preço lá em baixo :D

Tenha aulas de Photoshop com o Estúdio Pirata

A tempos pretendo vir indicar o Estudio Pirata aqui no blog, mas estava sempre adiando a ideia, pois, quem não conhece o Estudo Pirata? Enfim, como conheço bastante gente que tem vontade de aprender a mexer no tão poderoso Photoshop, mas não faz ideia de como começar, venho mostrar como foi que iniciei essa minha jornada pelo principal software da Adobe, o Photoshop, especificamente o CS5.

Não, eu não venho dar uma aula sobre o Photoshop, nada teórico, e sim pratico. Tudo começou através de uma vontade inexplicável de saber também mexer no programa, coisa que jamais imaginei ser capaz de fazer um dia. Curiando aqui e ali, encontrei o canal Estúdio Pirata. Um canal aonde você encontra tudo o que precisa a respeito do programa Photoshop. Lá eles ensinam a como fazer, disponibilizam materiais, fontes e etc. Você encontra vídeo aulas de programas de edição de videos como o Sony Vegas, mas sempre priorizando o Photoshop como assunto principal do canal.

Videos em alta qualidade, muito bem explicados, rápidos, fáceis de entender com um excelente áudio e sempre nos atualizando a respeito das novas versões Photoshop como CS6 e CC. Enfim, separei algumas vídeo aulas excelentes para você poder fazer "mágica":

É iniciante? Então siga as aulas básicas do Photoshop aqui.

E vocês, o que acharam do Estúdio Pirata?

Tutorial: Como dividir as postagens em caixas

Hoje vim trazer um tutorial de como dividir as postagens em caixas separadas, é um tutorial bem rapidinho e fácil. Esse tutorial funciona somente no modelo minima, e recomendo que o usem pois é menos complicado de mexer:

• Primeiramente procure por .post na css e apague. Em seguida cole o seguinte código:

.post {
background: #FFF; /* fundo do post */
padding: 4px; /* distancia do conteúdo a borda da caixa */
margin-bottom: 10px; /* distancia entre caixas */
text-align: justify; /* alinhamento do texto*/
}

• Logo, você irá procurar por #main-wrapper. Veja se dentro da id contém o background (background:#fff/background:url(link);), se houver apague, mas apenas a propriedade background.

Funciona tanto para modelos atuais, tanto para o minima como dito acima. Não é necessário fazer alteração no código, apenas no background (fundo) e no margin-bottom caso você queira uma distancia maior ou menor entre as caixas.

Qualquer dúvida, ou sugestão de tutorial só deixar ai nos comentários.

Tutorial: Efeito Pixels

Hoje irei ensinar o efeito pixels, igual ao da foto acima. Bem simples e rápido de se fazer, usei o photoshop cs5 e essa foto da Jennifer Lawrence.

Editei a foto, deixei-a em preto e branco e dei alguns ajustes no contraste. Também usei o Topaz clean. Não é obrigatório deixar a foto em preto e branco, porém o efeito fica com mais realce com a foto preta e branca. 

♥ Abra a foto (ctrl + o), edite se quiser, e clique em Eclipse Tool (U). 

♥ Defina a cor do que quer, não coloque cores muito escuras. E em seguida faça bolinhas, quadrados, ou triângulos pela foto, sabendo que essas formas virarão os pixels.

 Outra coisa importante é que o modo de mesclagem tem que estar no Multiplicação (multiply)

♥ Depois de feitas as formas, variando as cores caso queira  fazer um degradê. Vá na sua imagem principal e deixe-a "invisível" (clicando no olho do lado esquerdo) da camada. Depois que a imagem desaparecer aperte ctrl + e para juntar as camadas das bolinhas, apenas.

♥ Quando suas camadas estiverem juntas, ative a visibilidade da camada principal, novamente apertando aonde deveria estar o olho. Agora as formas ficaram feias não é ? Então, primeiro vá em Filtro > Desfoque > Desfoque Gaussiano. Ajuste o desfoque como quiser, mas as formas tem de ficar totalmente desfocadas e somente a cor ser vista.

♥ Depois de desfocado, vá em Filtro > Pixelização > Mosaico. Assim surgirá os pixels, mude como quiser deixando eles maiores ou menores.

♥ Para ficar com essa "transparência" mudo o modo de mesclagem para Divisão.Lembrando, que não é obrigatório e esse efeito vária de cor para cor, de foto para foto.

Espero que tenham gostado, esse efeito não se aplica somente a fotos. Você pode usa-lo para montar algum layout. Qualquer pedido ou dúvida, estou ai !

Baixando actions para seu Photoshop

E mais uma vez venho disponibilizar algumas actions legais para suas edições. Admito que com o tempo fui pegando a pratica e criando efeitos bem legais e uteis, que dão super certo em qualquer foto. Com um clique você muda a visão de uma foto, e foi isso que vi nas seguintes actions que criei:

Como sou uma boa pessoa estarei disponibilizando essas actions aqui em baixo. Então é só clicar em "download" e carrega-las no seu photoshop. Caso não saiba como aplicar, leia esse post. 

DOWNLOAD

clique aqui para baixar

50 drawings free para download

Estava dando uma organizada no meu computador e olhando alguns drawings que tinha baixado a um bom tempo, pensando em; "Porque não disponibilizar um pacote?" Constantemente muitas pessoas me pedem para fazer ilustrações, como ainda estou me organizando para começar a fazer encomendas fica difícil ter que atender todo mundo. Fazer uma ilustração personalizada não é nada fácil, requer tempo e capricho. Então para aqueles que não podem encomendar uma ilustração personalizada com algum profissional, separei alguns desenhos uteis, de diferentes estilos para você poder criar seu header e diversas outras coisinhas para seu blog, tumblr e etc. 

Todas as ilustrações estão em formato png, prontas para serem aplicadas a um banner. Em breve venho trazer mais variedades de desenhos, dependendo do resultado deste pacote. Em questão das encomendas para ilustrações, pretendo abrir espaço no blog para isso, o que acham? Enfim, para baixar o pacote é só clicar no download abaixo:

DOWNLOAD

Escolhendo as cores do seu blog

Hoje iremos falar sobre cores. Escolher cores para o template é uma coisa super complicada. Sempre surge uma dúvida, então, pensando nisso trouxe umas dicas para vocês que tem dúvidas em relação a que cores usar:

♥ Menos é mais: Limite-se a usar somente duas cores e trabalhe com suas variações. Nada de escolher preto, laranja fluorecente, azul, verde e por ai vai. Fica uma confusão de cores e pode acabar fazendo com que as pessoas percam o interesse. 

♥ Crie uma harmonia: Escolha cores que fiquem harmoniosas, não precisam necessariamente combinar mas elas não podem "brigar" entre si. 

♥ Desperte emoções: Sabia que as cores representam emoções e podem causar sensações? Você pode pensar nisso quando for escolher as cores, pense em que tipo de sensação quer causar aos leitores e procure seus significados. 

♥ Escolha cores que são a sua cara: Obviamente não se pode escolher cores que não goste. Escolha cores que te agradem levando em consideração a primeira dica, menos é mais. 

♥ Ajuda em site: Buscar ajuda em site também é uma ótima ideia, os sites que eu indico são esse: Colour Lovers, Color Scheme e Colrd (tem uma extensão para google chrome)

Abaixo tem umas paletas que fiz:

Espero que as dicas tenha ajudado, e uma outra coisa que é importante que algumas dicas se aplicam em outras situações, como por exemplo, escolher a cor do seu quart, de um look ou da sua nail art. 

Qualquer pedido de tutorial ou duvida estou ai !

Tutorial: Footer do post personalizado

Olá, meu nome é Eduarda e eu sou a nova colaboradora do blog. Estarei atualizando, principalmente, a tag de tutoriais e afins. 

Hoje vim trazer um tutorial sobre footer do post, igual a esse que é usado aqui. Antes de tudo, salve uma copia do seu template. Os códigos usados são do modelo Minima Lefty, que já não é mais encontrado na nova interface do blogger. Mas você pode baixa-lo por aqui. 

♥ Caso seu blog possua apenas 1 autor você deverá seguir as seguintes instruções:

Procure por esse código no seu html, apague-o e substitua por este código.

Agora, vá na css e procure por .post-footer, apague-o e substitua por este código. 

Ajuste de acordo com sua box.O avatar do colaborador tem de ser 65x65. Caso você queira menor ou maior, mude no css (.fotoautor). Lembrando sempre que o css e o avatar tem que ter os mesmo valores. 

♥ Caso seu blog possua mais de 1 autor você deverá seguir as seguintes instruções:

Agora é para o blog que tem mais de um autor, repita o primeiro passo de procurar e apagar o código mas cole esse código em vez do outro. 

Vá aumentando de acordo com a quantidade de quantidade de autores que tem seu blog, no css também.  Agora o css, procure por .post-footer apague-o e cole esse código.

Seu footer deverá ficar igual a esse:

Mude o código conforme for necessário. 
Esse tutorial já foi postado por mim no meu blog e os códigos da css todos feitos por mim. 

Efeito instagram no PhotoScape

Para se ter uma boa foto, é preciso se ter um bom efeito. O instagram tem sido um dos aplicativos mais úteis para nós, rápido, fácil e o final fica incrível. Mas infelizmente nem todos contem esse aplicativo e muito menos um programa de edições como o photoshop para poder criar efeitos lindos com actions e etc. Então pensando nessa possibilidade resolvi juntar o útil ao agradável, e trouxe um tutorial de como criar efeitos semelhantes ao instagram no photoscap. Programa rápido e fácil, com efeitos incrivelmente fáceis pra deixar suas fotos ainda mais legais e bonitas! 

Para fazer os seguintes efeitos, siga os passos:

1. Brilho cor > Curva de cor (deixe assim: aqui) Ajuste a iluminação de acordo com sua foto.
2. Avivar > Tipo: Modo Brilho > Nível: 30% > Desfoque: 0.0 > Contraste: 0
3. Filtro > Efeito filme > Efeito filme > Portra - Médio
4. Filtro > Vinheta > Vinheta > Configure assim: aqui

1. Brilho cor > Curva de cor (deixe assim:  aqui) Ajuste a iluminação de acordo com sua foto.
2. Filtro > Efeito atenuar > Cor: 255 > Nível: 100%
3. Filtro > Região fora de foco (posicione o foco aonde preferir e ajuste como preferir)
4. Aplique o Efeito atenuar novamente repetindo o passo 2
5. Filtro > Vinheta > Vinheta > Configure assim: aqui

1. Brilho cor > Curva de cor (deixe assim: aqui) Ajuste a iluminação de acordo com sua foto.
2. Avivar > Tipo: Modo Brilho > Nível: 50% > Desfoque: 0.0 > Contraste: 25
3. Filtro > Efeito filme > Efeito filme > Portra - Baixo
4. Filtro > Vinheta > Vinheta > Configure assim: aqui

1. Brilho cor > Curva de cor (deixe assim: aqui) Ajuste a iluminação de acordo com sua foto. 

2. Filtro > Efeito filme > Efeito filme > Agfa - Baixo

3. Avivar > Tipo: Modo obscurecido > Nível: 30% > Desfoque: 0.0 > Contraste: 0

4. Filtro > Vinheta > Vinheta > Configure assim: aqui

Todos os efeitos tem passos parcialmente parecidos, isso para facilitar a edição, e ser tão rápido e pratico quanto o instagram. Caso não tenha o Photoscap baixe aqui, é inteiramente grátis. E vocês, o que acharam? Irão tentar? 

Download:6 actions

Como prometido, trarei alguns utensílios para edições ao blog, atualizar um pouco a tag de designer. Bom, hoje trouxe algumas actions criadas por mim. São bem praticas e simples, para evitar a perda de tempo, é só clicar e fim, foto de boa qualidade e bem iluminada. Optei criar efeitos de contraste e iluminação, além do preto e branco que tanto amo usar em algumas fotos, um fosco bem fofo e um vintage simples. Ah, e não se preocupem, as testei em diversas fotos, então garanto com 90% de chaces funcionarem perfeitamente em qualquer foto (obviamente evitando aquelas super escuras e com ruídos). 

DOWNLOAD

clique aqui para baixar!

Clique no "download" acima para baixar as actions. Caso não saiba como usa-las fiz um post tutorial de como utiliza-las e instala-las aqui (POST). Praticas e rápidas!

7 Fontes personalizadas para download

Como adoro passar o dia mexendo no Photoshop, códigos HTML e etc, tive a brilhante ideia de trazer um pouco dessa minha paixão para o blog, assim pretendo trazer tutoriais e materiais para edição. Para iniciar a caminhada, hoje resolvi trazer algumas fontes para suas edições: 

DOWLOAD

clique aqui para baixar!

Para baixar as fontes clique no "download" acima e baixe o pacote das 7 fontes. Bom, irei abrir a tag de designer aqui no blog para postar coisinhas do tipo para vocês, como citado no começo do post. Caso encontre algum erro no download favor avisar.

DIY: Como faço minhas ilustrações

Bom, quem acompanha o blog deve ter visto algumas das minhas ilustrações que postei por aqui. Bastante gente me perguntou aonde eu as fazia, e repito que faço tudo no photoshop cs5. Pois é, parece milagre mas vou contar a minha história.

A muito tempo atrás via alguns desenhos vetoriais, e drawings (ilustrações) no tumblr, em blogs ... Fiquei tão curiosa de como essas pessoas faziam desenhos incríveis no computador, que fui atras para saber como se faz. Descobri vários programas para ilustrar, mas queria algo fácil  e algo que eu pudesse fazer no photoshop mesmo, que é um dos programa que já tenho experiencia. Alem do mais, vários desses programas faziam somente aquelas ilustrações de bonequinhos de linhas, retinhos, ah sei lá. Só sei que queria algo diferente, algo mais realista. Foi ai que fui atrás de videos no youtube (ah meu querido youtube), e encontrei diversos tutoriais que me ajudaram bastante:

Esse vídeo mostra o processo de como fazer um vetorial, que são ilustrações através de fotos, que é gerada a partir de descrições geométricas, como por exemplo: Curvas, elipses, polígonos, texto ... e entre outros. Bom, vendo videos aqui e videos ali descobrir que vetorizar não é nada fácil. Nossa, oh coisinha detalhista e trabalhosa. Eu juro que tentei todos tutoriais que via, e nunca chegava em um resultado agradável. Foi ai que comecei a juntar alguns pedaços de "aulas" que vi, e dei meu jeito para desenhar. Recebi um comentário da Sthephanie Caldas pedindo que eu ensinasse a como eu faço minhas ilustrações, e porque não? Então peço desde já que não critiquem o meu modo "estranho" e "retardado" de fazer minhas ilustrações. Não sou profissional, e só dei o meu jeito para fazer meus desenhos.

Bom, creio que no inicio será bem complicado para você (assim como foi para mim), ter uma certa "cordenação" para fazer os traços, pois todos os traços são feitos a mão livre, uso somente a foto desejada como guia. Então vamos lá:

Primeiramente abra uma foto que queria ilustrar:

Em seguida crie duas novas camadas:

Com o balde de tinta, pinte a primeira camada de branco, para que ao selecionar as cores da ilustração, elas saiam um pouco mais suavizadas e obviamente facilita bastante na hora de desenhar os traços:

Diminua a opacidade da camada branca para 20% ou o numero que preferir:

Com o pincel do tamanho 3px, na segunda camada, faça os traços da foto (isso requer muita paciência  muito ctrl+alt+z, e mais paciência). Você pode tirar, acrescer, o que você quiser. Afinal, é a sua ilustração, e sua imaginação. Então abuseeee!

Apos ter feito todos os traços (e repito que talvez não tenha ficado perfeito, mas isso é questão de pratica), vamos a pinturaaa! Selecione com a ferramenta conta-gotas, a cor de cada parte da foto (por exemplo: cabelo; pele; olhos), e com o balde de tinta, pinte as partes com as cores adequadas (não se esqueça do fundo):

Acrescente detalhes:

Bom, ficou tudo muito "seco" não é? Então vamos as sombras, iluminação e etc ...
Com a ferramenta varinha mágica, selecione cada parte, e com o pincel soft round tamanho 150px (isso depende do tamanho da sua imagem, e do local sombreado), com uma cor mais escura do local selecionado faça as sombras, e com uma mais clara as luzes:

Faça isso em toda imagem e acrescente o que quiser, textos, detalhes ...

Bem melhor não? haha. Agora junte as camadas e já chagamos ao fim, agora o ultimo passo e o meu predileto é colocar alguns efeitos para dar ainda mais aquela sensação de desenhos vetoriais. Clique em "filtro" > "artistico" > "afresco":

Irá abrir uma "quadro" com vários efeitos. Teste cada um e veja qual ficou melhor em sua imagem:

Arrume mais detalhes aqui e ali e fiiiiiiim, ilustração prontinha haha, o que acharam?

Sei que não sou boa com explicações, tutoriais .... e muitos devem não ter entendido. Mas enfim, quando se pega a pratica, e depois de errar muuuuito, tudo fica mais rápido e fácil. E você, ira tentar? Se sim, me mostre sua ilustração no facebook, no twitter, ou até mesmo aqui no menu "contato" do blog! Qualquer duvida é só comentar aqui em baixo, ou falar comigo nas redes sociais!