Magazine brain 01

1º season - chapter one 1

1º season - chapter one2


Henrique BaltazarDesigner

Marcelo Kubatr Web Designer

Lindomar PalmaDesigner e Ilustrador

EXPEDIENTE


Neste tutorial Photoshop, vamos usar não somente o Photoshop mais também o poder de renderização 3D do Adobe Illustrator. Não se preocupe noobs, você não precisa saber nada sobre Illustrator, como de costume eu vou treiná-lo durante todo o processo, mas você precisa ter instalado em seu computador. (* Nota: Se você não tem Illustrator, você pode pular para Adobe.com e baixar uma versão trial de 30 dias para brincar.)

Vamos começar abrindo um novo documento do Photoshop, escolha Arquivo> Novo a partir do menu principal ou usando o atalho de teclado Command-N (PC: Ctrl-N). Eu estou usando o meu 8cm largura, por 4cm de altura com 300 dpi (pixels / pol) e uma cor de fundo branco. Quando o novo documento é aberto, mude para a ferramenta de texto pressionando a tecla T e digite o texto para a tela (isso vai criar uma nova camada acima da camada de fundo). Eu estou usando a fonte (dSegoe Script) que pode ser baixado em qualquer site de fontes gratuitamente. Neste ponto cor não faz diferença, e o tamanho da fonte de acordo com espaço de trabalho do documento.

Configurando o arquivo Photoshop

Henrique Baltazar

Passo 1



Como a ferramenta de texto ainda está ativa, de um clique com o botão direito na camada da mesma e escolha a opção, Criar Demacador de Trabalho (Create Work Path). Você pode notar uma pequena mudança no cenário.

Agora vamor ter certeza de que a nossa palavra permanece com as letras todas juntas como uma única unidade, indo até a barra de ferramentas e selecionando a Ferramenta Seleção de Demarcador e depois selecionando toda a palavra, ficando como na figura abaixo.Agora na parte superior do Photoshop e clicando no botão Combinar (se você não vê um botão de combinar, as chances são boas que você não tem a ferramenta Path Selection ativa). Com os caminhos combinado, agora você pode copiar os caminhos selecionados pressionando Command-C (PC: Ctrl-C). Isto irá efetivamente copiar os caminhos vetoriais em memória do seu computador para que possamos passar para Illustrator e usá-los lá. Agora, eu sei que alguns espertinho vai me deixar uma nota arrogante sobre como você poderia ter criado este texto no Illustrator e salvo alguns problemas, mas então você não teria acabado de aprender como converter seu texto a um caminho que você ?... E este é, afinal, principalmente um site Photoshop, então só sei que poderia ter escrito seu texto no Illustrator também. Ambas as formas são igualmente correta.

Portanto, agora que temos que beliscou no botão, permite seguir em frente e abrir o Adobe Illustrator.

Com Illustrator aberto, vamos usar o mesmo atalho de teclado para criar um novo documento por lá: Command-N (PC: Ctrl-N). Neste caso o nosso tamanho da tela não importa nem um pouco, por isso vou deixá- -la em seu tamanho padrão Letter e clique em OK.

Converter o texto em caminhos Hop Skip e salte para IllustratorPasso 2 Passo 3



Lembre-se daqueles caminhos que copiou para a nossa área de transferência invisível? Vamos ir em frente e cole os direto para o nosso documento Illustrator, pressionando Command-V(PC: Ctrl-V). Se a caixa de diálogo Opções de colar aparece, escolha forma composta e clique em OK. Nós não estamos preocupados com onde eles estão no documento ou qualquer coisa, mas se você é obsessivo compulsivo sente-se livre para movê-los para onde quer que faz você se sentir morno e distorcido.

Por padrão seus caminhos não serão preenchidos com qualquer cor, o que não é bom, já que não será capaz de vê-los se eles se tornam desmarcada, então vamos usar a paleta de cores para alterar a cor de preenchimento de laranja claro agradável. Se você não ver a paleta de cores, escolha Janela> Cor no Menu Principal. Clique duas vezes na amostra de cor de primeiro plano e digite o código desejável de cores na caixa e clique em OK para definir a cor.

Cole os caminhos para o IllustratorPasso 4

Agora vem a parte divertida! Com o caminho ainda selecionado no palco, escolha Efeito> 3D> Extrusão e bisel...no menu principal para abrir a janela Extrusão e bisel... Opções 3D. Se o botão Mais opções está visível na barra lateral direita, clique nela para expandir a caixa de diálogo completamente e alterar as configurações para coincidir com o meu ao lado. Repare que eu estou usando um zero (0) a configuração nas configurações Y e Z, porque eu só quero empurrar as letras um pouco para trás, mantendo todos os outros aspectos da mesma. Também é importante notar que eu mudei a minha fonte de luz para o canto inferior esquerdo da bola sombreamento na área de sombreamento da superfície. Verifique se a caixa de visualização está ativada, se você quiser ver o que está acontecendo com seu texto enquanto você trabalha. Quando todas as configurações estiverem concluídas, clique em OK para confirmar a sua transformação 3D.

Nossos bordas 3D não estão atualmente em uma forma que o Photoshop vai entender, então vamos corrigir rapidamente que antes de se mudar de volta para o Photoshop para concluir o processo. No menu principal do Illustrator escolha Objeto> Expandir aparência. Isto irá converter as bordas 3D em seus próprios caminhos, tornando-os compatíveis Photoshop.

Fazer o texto 3DPasso 5


(* nota: Nós vamos estar trocando programas em um segundo, mas não feche esse arquivo Illustrator ainda, vamos precisar mais uma vez)

Com o nosso objeto ainda selecionado no Illustrator, vamos copiá-lo de volta para a área de transferência pressionando Command-C (PC: Ctrl-C) para copiar, e em seguida, clicar sobre o seu documento do Photoshop e pressione Command-V (PC: Ctrl-V) colá-lo para a tela. Você será questionado sobre como você deseja colar e, se você estiver usando o Photoshop CS4 ou superior, escolher Objeto inteligente, para que possamos manter os recursos de edição de nosso objeto deveríamos precisar dele mais tarde e, em seguida, clique em Return (PC: Enter) para colar (não redimensionar quando você cola! Se

Voltando Para PhotoshopPasso 6

você deseja redimensionar, eu vou deixar você saber quando fazê- -lo mais tarde). (* Nota: Se você estiver usando uma versão do Photoshop CS4 mais velho que, selecione Pixels Quando você cola)

Você não pode ir em frente e eliminar a sua camada de texto original e caminhos, se quiser, bem como renomear sua nova camada de texto 3D.


Assim como o título diz, vamos repetir Copiar e Colar a palavra que você separou no AI na atapa anterior, pelo processo Command-C (PC: Ctrl-C), para copiar e Command-V (PC: Ctrl V), para colar. E sim, mais uma vez no CS4 ou mais recente usará Objeto Inteligente enquanto versões mais antigas vão usar a opção Pixels ao colar.

Vai ser difícil de ver esta nova versão colado sobre o original 3D, então vamos mudar a cor usando Estilo de Camada > Sobreposição de Cor sobre a nova camada que deve aparecer na parte superior da paleta de camadas e que eu convenientemente chamei de 2D Texto1. Clique na opção Estilo de Camada > Sobreposição de Cor na lista da esquerda e mudar a cor para uma mais escura, e clique em OK para adicionar o estilo à camada. E agora que você tem a camada 2D da camada 3D, use a ferramenta Mover (ou as teclas de seta) para posicionar a camada 2D sobre a parte superior da camada 3D onde ele pertence. Ela pode ajudar a aumentar o zoom para ficar perfeito usando a Command + e Comando - (PC: Ctrl + e Ctrl -).

Copie e cole Back Into PhotoshopPasso 8

Ok, como eu disse, vamos fazer uma corrida rápida de volta para o Illustrator para obter outro conjunto de caminhos, mas desta vez nós só queremos copiar o texto original plano no topo da nossa renderização em 3D, porque é perspectiva mudou desde que originalmente trouxe para Illustrator e vamos precisar dele isolado para mais tarde.

Agora, para isolar a camada superior do texto, vamos precisar clicar para dentro do objeto, então eu quero que você clique sobre o texto até selecionar a ultima camada, copiando e colcando, como na figura ao lado. Note-se que as áreas de 3D são agora desapareceu porque você é mais fundo no objeto.

!! OPÇÃO B !! Se você está tendo problemas para tentar este método alternativo: Clique duas vezes no palco (fora do objeto) para garantir que você está no topo do seu documento no Illustrator, em seguida, selecione o objeto de texto, clicando e arrastando uma seleção em torno dele com a ferramenta Seleção. Agora, escolha Janela> Aparência do Menu Principal para abrir a paleta Aparência e dentro dessa paleta, clique no link Extrusão e bisel... para reabrir a paleta Extrusão e bisel... Opções 3D. Em seguida basta alterar a profundidade de extrusão para 0pt e clique em OK para confirmar a alteração. Agora você pode continuar para a etapa 8.

Voltar para o Illustrator One More TimePasso 7

(* nota: desligue a camada texto do arquivo, você verá que os pontos de curvas sumiram).


Nesta etapa vamos fazer algumas coisas para fazer a camada superior ficar fora dos lados em 3D um pouco. Vamos começar duplicando a camada 2D Texto 1, selecionando-o na paleta de camadas e pressione Command-J (PC: Ctrl-J) para duplicar a camada. Renomeie essa nova camada superior 2D Texto 2. Pressione a tecla V para certificar-se de que a Ferramenta Mover é ativo, em seguida, usando as setas do seu teclado, pressione para cima e para a esquerda para que essa camada deslize ligeiramente em comparação com a camada 2D Texto 1.

Agora vamos editar o estilo de camada Estilo de Camada > Sobreposição de Cor do 2D Texto 2. Para fazer isso, basta clicar duas vezes no pequeno ícone FX nessa camada (alternativamente você pode comandar-Click (PC: Right-Click) sobre a camada e escolha Sobreposição de Cor e mude a cor da sobreposição de branco e, em seguida, clique em OK para confirmar a alteração.

Fazendo A Top PopPasso 9

Se você estiver usando CS4 ou mais recente com os objetos inteligentes, este é o ponto onde você deseja redimensionar o seu texto, se necessário. Certifique-se de selecionar todas as camadas de texto 3 e transformá-los em conjunto

Em seguida vamos adicionar uma pequena sombra imediatamente abaixo da nossa camada de texto 3D para torná-la realmente fora o fundo. Clique em Command (PC: Ctrl-clique) sobre a miniatura do 2D Texto 2 (ou 1) camada para carregar a camada como uma seleção. Pressione a tecla D para resetar as cores de primeiro plano e de fundo e retornar o primeiro plano para preto, em seguida, crie uma nova camada abaixo da camada de texto 3D e preencha a seleção com a cor de primeiro plano pressionando Option + Delete (PC: Alt-Backspace). Você não será capaz de ver nada ainda, mas isso é ok, renomeie esta nova camada Shadow 1 e continuar para a próxima etapa.

Adicionando a primeira sombraPasso 10


Agora vamos para entorpecer as bordas da nossa sombra um pouco, por isso a partir do menu principal, escolha Filtro > Desfoque > Desfoque Gaussiano e quando o diálogo aparece definir o raio para 0,5 pixels e clique em OK. E agora pressionar o seta para baixo no teclado até que a sombra se torna visível na parte inferior da camada de texto 3D. Queremos apenas um pixel ou dois mostrando, apenas o suficiente para nos dar uma sombra agradável apertado abaixo do texto. (Eu apenas deixei cair 1px abaixo do texto 3D)

Blur e The Shadow Mova para o localPasso 11


Com a nossa primeira sombra no lugar, criara a segunda vai ser fácil. Duplique a Shadow 1 camada pressionando Command-J (PC: Ctrl-J) e chamá-lo de sombra 2. Volte para o Filtro > Desfoque > Desfoque Gaussiano e desta vez usar um raio de 2px e clique em OK.

Porque a nossa fonte de luz para os nossos objetos 3D estava vindo do canto inferior esquerdo do texto, vamos fazer uma pequena modificação aqui para fazer o efeito um pouco mais convincente. Ainda na camada de sombra 2, pressione Command-T (PC: Ctrl-T) para chamar a ferramenta Transformação, e vamor para puxar a sombra para fora do texto nessas direções como mostrado abaixo. Você não precisa ir muito longe, apenas o suficiente para puxar um pouco a sombra. Clique Return (PC: Enter) para confirmar a sua transformação quando você está feito.

Criar a sombra finalPasso 12

Para a minha imagem final eu puxei a opacidade da sombra 2 da camada para cerca de 60% apenas para amenizar o efeito um pouco e, em seguida, acrescentou uma ligeira inclinação para o fundo. Há um monte de grandes casos em que você vai ser capaz de usar o texto em 3D, você pode usar este mesmo processo com qualquer objeto feito de um caminho ... logotipos, formas personalizadas e todos os tipos de coisas. Então brincar e se divertir um pouco com ele.

Ajustes finaisConclusão


Esta é uma ferramenta útil para quem trabalha com criações gráficas e design. O Adobe Kuler permite que você descubra quais são as cores complementares de uma paleta. Além disso, é possível checar os códigos RGB e HEX de cada uma das cores disponíveis.

Com o gerenciado de fontes wordmark, é só escrever a palavra que você deseja clicar em “load fonts” que ele busca todas as fontes instaladas no seu computador. Ainda sendo possível inverter as cores, deixar em caixa alta e baixa, selecionar as fontes que você mais gostou, etc.

Adobe Kuler

Wordmark1

2kuler.adobe.com

wordmark.it



Quer descobrir qual fonte utilizada naquele no layout cujo o .psd foi perdido. Nesse site é só recortar a imagem de uma palavra, dizer que pedaço desta imagem corresponde a que letra e enviar. Ele te dá possíveis opções de resultado. Geralmente plausíveis, de fontes que se assemelham com a fonte utilizada na arte.

Sabemos o quão difícil é encontrar fontes gratuitas de qualidade que está licenciado para o trabalho comercial. O site Fonts Squirrel, reuni vários tipos de fontes free em grupos. Sendo disponível para dowload, mostrando detalhadamente os formatos com uma ornagização incrível.

Uma mão na roda na hora de converter diversos formatos de arquivos, sem a necessidade de instalar um programa para isso. O mais importante: converte arquivo de Corel para eps, podendo salva-lo na mesma hora, sem precisar esperar o link chegar por email.

3

4

5

What the Font

Font squirrel

Online Convert

myfonts.com/WhatTheFont/

fontsquirrel.com

online-convert.com


1º season - chapter one14 1º season - chapter one14

Neste tutorial abordaremos os efeitos de animação no Flash, que são quadro a quadro, interpolação de forma, interpolação clássica de movimento e interpolação de movimento.Para todas as técnicas apresentadas usaremos o Flash CS5, Action Script 2.0.

Marcelo Kubart

1º season - chapter one 15 1º season - chapter one 15

Crie um desenho de sua escolha, eu fi z um circulo.

Na Timeline insira um quadro- -chave(keyframe) no quadro 2 e movimente seu desenho alguns pixels na direção do movimento.

Repita o passo 2 até que você termine o movimento. Você pode deformar sua fi gura de acordo com o movimento. Como exemplo o quique da bola.

Crie um desenho

Quadro chave

Quadro chave

Passo 1

Passo 2

Passo 3

Técnica Quadro a Quadro


Na Timeline insira um quadro-chave(keyframe) no quadro 15 e desenhe outra forma com outra cor e em outra posição

Volte no frame 1 e clique com o botão direito e vá em Create Shape Tween.

Podemos alterar a aceleração do inicio ou fi m da ação. Isso da um efeito de freio ou aceleração.

Timeline

Create Shape Tween

Create Shape Tween

Passo 2

Passo 3

Passo 4

Crie um desenho de sua escolha

Crie um desenhoPasso 1

Técnica Interpolação de Forma



Clique com o botão direito sobre o desenho e escolha a opção Convert to Symbol... Em type escolha Movie Clipe

Na Timeline insira um quadro- -chave(keyframe) no quadro 15 e arraste seu movie clip para outra posição.

Volte no frame 1 e clique com o botão direito e vá em Create Classic Tween.

Podemos alterar a aceleração do inicio ou fi m da ação e a rotação do movie clip.

Timeline

Timeline

Timeline

Timeline

Passo 2

Passo 3

Passo 4

Passo 5



Técnica Interpolação Clássica de Movimento




Clique com o botão direito sobre o desenho e escolha a opção Convert to Symbol... Em type escolha Movie Clipe

No frame 1 clique com o botão direito e vá em Create Motion Tween.

Crie um desenho

Crie um desenho

Crie um desenho

Passo 1

Passo 2

Passo 3

Técnica Interpolação de Movimento



Na aba Window escolha a opção Motion Presets, na janela que abrir escolha um tipo de animação.




O parasol ou lens hood é aquele acessório que é encaixado na frente das lentes para melhorar a qualidade da imagem quando a luz utilizada (seja do sol ou artificial) está em uma posição que interfira na foto.

O parasol protege a lente de fragmentos de luz desnecessários. O sol ou outra fonte de luz, quando dentro ou quase dentro do quadro fotografado, cria efeitos/defeitos chamados flare ou glare. Qualquer fonte de luz pode criar essas manchinhas (sol, lâmpada dentro de casa, etc.) E as manchinhas podem ter formatos diversos – podem ser redondas, pentágonos, heptágonos, etc. Veja no exemplo:Um flare é uma manchinha mais definida, já o glare é quando a foto inteira fica menos contrastada e um pouco lavada. Mas pouco importa os nomes: o parasol está aí para nos defender de todos eles quando for necessário. E quando a gente achar que deve, né? Afinal o defeito às vezes pode virar efeito.

E, pra completar, o parasol também protege nossas lentes fisicamente. Se você esbarrar sua câmera em algum lugar ou mesmo se ela cair, o parasol estará lá para quebrar no lugar da lente.

O que é e por que usar parasol?

Para que serve?



Lembre-se de comprar o tipo correto de parasol para sua lente! Normalmente as de ângulo mais aberto (como uma lente 18-55mm) precisam de um parasol menor e mais aberto também, para que ele não apareça na foto. Para lentes tele-objetivas (como uma 75-300mm) é comum a utilização de um parasol mais longo. Eles podem vir em formato de flor ou cilíndrico, e normalmente as lentes mais caras já vêm com este acessório.

Essas luzes de formas ovais e redondas nas imagens são “flares”

Flor

Cilíndrico

Tipos de parasol



Lindomar Palma

Magazine brain 01

Documents

Transcript of Magazine brain 01