Texto translúcido em alto-relevo

Texto translucido em alto-relevo

Bom galera vamos a mais um tutorial sobre textos (não é sobre a imagem inicial do nosso post "Photoshop POWER", mas chegaremos lá)
Vou mostrar um efeito bem interessante que pode ser aplicado de varias maneiras (principalmente como marca d'água :P)

1- Iniciaremos o nosso tutorial criando um documento novo, com tamanho a sua escolha
Tamanho escolhido por mim: 500x300

Escreva um texto qualquer.
Escolha uma font de preferência "grossa" como a "Impact", de qualquer cor, tamanho de no mínimo 40pt e com espaçamento entre letras de 100 (mostrado no exemplo abaixo)

2- Vamos editar os "Blending Options"
2-1 Primeiramente em "Drop Shadow", com as seguintes configurações:

Opacity: 60%
Angle: 120°
Size: 8px

2-2 Agora vamos editar o "Bevel and Emboss"

Style: Outer Bevel
Size: 3

3- Agora reduziremos o "Fill" para 0%, e aplicaremos um efeito de degradê no fundo para observamos o efeito translúcido

4- Efeito alcançado para mim:

Bom galera, por hoje é isso, espero que tenham conseguido alcançar seus resultados, qualquer dúvida sobre o post (ou sobre qualquer outro assunto relativo a Photoshop) é só entrar em contato

Grande abraço a todos e fiquem com Deus!

Renan Lopes (Web'er)

Dicas (corelDraw)

Quando você for vetorizar uma imagem no corelDraw, crie dois Layer(camada),uma para sua imagem e outra onde você vai trabalhar o seu vetor. E se sua imagem for muito colorida clique na barra de menu selecione View (visualizar) e clique na opção wireframe (rascunho) assim você terá uma visão quase que em tons de cinza, e não vai cansar a sua visão.

Até a próxima....

Top 10 para Design!!

Bom dia pessoal,

Estou preparando um tutorial de como fazer (site básico) uma galeria de fotos usando o Photoshop CS3. A proposta é que se você quiser fazer um site para colocar fotos de casamento, festa de rua qualquer outra coisa, para ser feito com certa rapidez.

Mas nesse momento vou deixar para vocês uma lista com dez sites de referência de design, tanto para gráfico quanto para web. Vejamos então a lista:

1° - ICONFINDER.NET - Excelente site para downloads de ícones para site, nesse você tem duas opções de arquivo, o .ico , que é um ícone propriamente dito e o .png que é uma imagem.
[ Para ver o site ];

2° - TEMPLATE MONSTER.COM – É um site de templates para você buscar referência de um determinado seguimento para montar um site. Nesse, tem opção de escolher por categoria, estilo e preço.
[ Para ver o site ];

3° - CGTEXTURES.COM – Site de texturas, imagens e patterns. A exemplo dos outros também é distribuído por categorias.
[Para ver o site];

4° - STONEWASHED.NET – Site com uma relação de links para web sites que disponibiliza Free Sound Effects
[Para ver o site];
 
 5° - W3SCHOOLS.COM – Site de Tutoriais de HTML, CSS, XML, JAVA SCRIPT , ASP, PHP, SQL e muito mais coisas em programação e tudo grátis.
[Para ver o site];
 
6° - STOCK.XCHNG.HU – Banco de imagens grátis, dividido por categorias.
[para ver o site];
 
7° -  DAFONT.COM – Melhor site de downloads de fontes
[Para ver o site] ;
 
8° - PSD.TUTS.COM - site com vários tutoriais de Photoshop.
[Para ver o site] ;
 
9° - LOREM-IPSUM.PERBANG.DK – Site gerador de textos para layouts.
 [Para ver o site]
 
10° - COLORSCHEMEDESIGNER.COM – Site que te ajuda a escolher a paleta certa de cores combinado as cores por análogas, complementares, mono....etc.
[para ver o site]
 
Obs: como a maioria dos sites são em inglês, a minha dica se você não domina o idioma é usar o Google Tradutor. É só copiar a URL e colar no local indicado.

Até a próxima!

Criando efeito 3D em textos - Photoshop

Esse mini-tutorial mostrará como reproduzir um “falso 3D” em textos. Que dependendo da sua criatividade, pode-se estender aos mais variados objetos e formas

Mãos à massa!

1- Crie um documento de tamanho a sua escolha, para esse tutorial, criei um no seguinte tamanho:

2- Digite um texto qualquer, escolha sua fonte com tamanho e cor a seu gosto (de preferência clara, pelo menos de ínicio, para facilitar a compreensão)

Fonte escolhida por mim: “Stencil Std”

Cor: #8ea7ae

Tamanho: 100px

3- Agora para podermos continuar, vamos “rasterizar” (Rasterize Type) a

camada correspondente ao nosso texto:

Normal 0 21 false false false MicrosoftInternetExplorer4

4- Entre no modo de “Free Transform” e em seguida em “Distort”, distorça o texto até chegar em um resultado parecido com o mostrado abaixo:

5- Duplique (CTRL+J) a camada contendo o texto:

6- Agora pressione “CTRL+U”, na regulagem “Lightness” leve o regulador a escala para “-100”, isso fará com que a camada fique totalmente negra:

Regulagem

Texto escurecido

7- Envie a camada que está escura para trás da camada orignal, na paleta de camadas:

8- Movimente a camada escura da seguinte forma, selecione a camada, e pela seta do teclado, (com apenas um toque) movimente-a uma vez para baixo e uma vez para a esquerda, duplique novamente a camada escura, movimente-a uma vez para a esquerda, repita esses passos algumas vezes, até obter um resultado parecido com o mostrado abaixo (pessoalmente eu não gostei muito do meu resultado, espero que vocês tenham mais sorte! :P)

9- Agora edite a seu gosto, abaixo mostrarei a minha edição:

Espero que tenham gostado desse mini-tutorial, na minha próxima postagem explicarei como conseguir o efeito

da imagem inicial do post "Photoshop Power"

Abraço a todos

Renan Lopes

Profissão Signmaker

Esta matéria tem como objetivo focar as ferramentas utilizadas por profissionais da comunicação visual e também serve como referência para profissionais das áreas de arquitetura, design gráfico, markteing e publicidade, que diretamente trabalham com profissionais chamados “signmaker” e muitas vezes desconhecem esta profissão. Todo signmaker trabalha sempre com pessoas ligadas à criação, e muitas vezes a função do signmaker é apenas finalizar um trabalho já criado. Mas nem sempre o trabalho que vem para ser finalizado pode ser executado sem o conhecimento de certos equipamentos e materiais a serem utilizado. É aí que entra o bom signmaker, criando alternativas para atingir o objetivo do cliente. “Ser signmaker é ter todos os dias um novo desafio; é ter a certeza que a rotina não existe; é ter orgulho de encontrar em cada esquina um trabalho desenvolvido por você. Ser signmaker é desafiar sua mente constantemente e descobrir a cada dia que o limite da criação está longe de existir.”

Linguagem do designer

O design é uma linguagem, e como toda linguagem possui, basicamente, duas possibilidades de articulação: uma que se realiza no sentido horizontal e que tem propriedades combinatórias, e outra que se realiza no sentido vertical, em profundidade, que tem propriedades associativas. A cor é um elemento que junto coma fotografia, a tipografia, a ilustração, textura e formas podem ser utilizadas pelo designer para conjugar estas articulações, gerando uma comunicação. Assim, definimos o design sendo formado por linguagem de informação, ou seja, ferramentas de informação que compõe uma peça de design.
Tanto no sentido vertical, quanto no horizontal, a cor tem grande importância. Podendo ser usada desde elemento organizador e hierárquico de informação, até elemento associativo evidenciando códigos culturais.
A definição de cor é simples e conhecida por muitos: cor é luz. Mas cor é muito mais que apenas luz. Cor é informação. Estudando as cores é possível compreender um pouco mais sobre as nossas atitudes, fraquezas, medos, desejos etc.

Nos nossos próximos encontros veremos a sinestesia das cores.

Até a mais...

Drica Designer

Usando METATAG para indexação de sites

         Quando colocamos um site na web, ele é indexado automaticamente pelos sites de buscas por seu conteúdo, porém, pode haver algum tipo de problema e seu site ser ignorado por esses sites de busca (Google, Yahoo, Bing, etc.).
         Para resolver esse problema ou até mesmo melhorar o ranking do seu site nos busca-dores utilizamos as METATAGS. A metatag é suportada por todos os principais navegadores.
         Metatags são linhas de código HTML, ou etiquetas, que ajudam a descrevem o conteúdo do site para os buscadores. Nas metatags será inserido as palavras chaves que facilitarão o seu site de ser achado na hora em que o usuário digitar o que procura em um buscador. Através delas podemos fornecer detalhes sobre o site para os sistemas de buscas ou até mesmo assi-nar seu site. Essas etiquetas NÃO aparecem para o usuário.
Elas não são as únicas metas existem outras, só estou colocando as mais importantes. Para saber mais sobre as metatags entre em W3CSchools.

No exemplo abaixo vou mostrar como colocar e onde colocar as metatags.
Exemplo:

<HTML>
 <HEAD>
  <TITLE> Guru do Design </TITLE>
<META NAME='description' ‘CONTENT’=' blog de dicas sobre webdesign, design e suas derivações '>
<META NAME='author' ‘CONTENT’='sallug gomes'>
<META NAME='copyright' ‘CONTENT’='guru do design'>
<META NAME='language' ‘CONTENT’='Portuguese'>
<META NAME='keywords' ‘CONTENT’='design,webdesign,sites,web,ucb'>
<META NAME='ROBOTS' ‘CONTENT’='index,follow'>
 </HEAD>
 <BODY>
 </BODY>
</HTML>

         As metatags são identificadas entre, META NAME, que é o nome da tag e 'CONTENT' os atributos, elas devem ser colocadas sempre dentro das tags de cabeçalho (<head></head>).
        A principal metatag que deve ser incluída é a "robots" por que é ela, que informa ao buscador se seu site e todos os links podem ser indexados, no nosso exemplo foi colocado "index,follow", assim todos serão indexados.
        Outra metatag muito importante é a ‘description’ que serve para descrever seu site, o texto que será escrito dentro de ‘CONTENT’ aparecerá nos resultados de busca abaixo do título, faça uma descrição do site em poucas palavras, mais ou menos 120 caracteres.
        A terceira metatag mais importante do nosso exemplo é a ‘keywords’ que são as palavras-chave relacionadas ao site. As palavras-chave devem, como no exemplo, ficar dentro de ‘‘CONTENT’’.

             *Dica: Elas devem ser escritas em minúsculo e separadas por vírgulas   e se o conteúdo do seu site for abrangente seja específico nas palavras.

         Também usamos outras três metatags que são as ‘language’ , ‘author’ e ‘copyright’. 'Language' declara a(s) linguagem(ns) natural(is) do documento. Pode ser usada pelos motores de busca para categorizar por idioma. Já a 'author' é para colocar o nome do autor da página e 'copyright' indica os direitos autorais do dono da página.

Obrigado gente,
até a próxima semana.

Dicas e feramentas para Comunicação Visual

Olá galera!! em breve estarei compartilhando com vocês dicas de ferramentas, equipamentos e mídias, para se fazer uma boa comunicação visual.

CRIANDO UM PROFILE NO TWITTER

Boa tarde a todos.


Logo na minha primeira postagem resolvi da uma força para que esta querendo fazer um perfil no Twitter , por isso vou colocar um link para uma vídeo aula sobre como criar, gerenciar, procurar pessoas, seguir pessoas entre outras coisas que são permitidas no Twitter.

Para isso basta fazer o download do arquivo Video Aula de Twitter


Depois disso você vai colocar no seu site [FOLLOW-ME] e fazer propaganda instantanea  ... rsrs

Até a próxima.