Arquivo da tag: Retro

Retro + Tipo + Justice = DVNO

De final de semana eu costumo ficar na sala de estar com a TV ligada na MTV, o PS3 baixando demos e trabalhando e navegando com o MacBook. Fiquei MALUCO quando vi o clipe de Justice – DVNO, pela aplicação pesada, se não integralmente, de referências retrô e inteligente uso tipográfico.

A música é legalzinha mas, esse clip… é espetacular! Veja você.

Comentário inútil, ou não: Pronuncie DVNO em inglês. Os fonemas proporcionam “DIVINO” quando falado!!! hueheuhehehueheue 🙁

Inspiração #3: Omni

Omni magazine cover
Omni Magazine Cover

Omni foi uma revista americana sobre ficção científica, que continha artigos sobre fatos científicos e amostra de trabalhos sobre ficção científica. A primeira edição foi lançada antes mesmo de meu pai pensar em ter um filho. Em 1978, nasce a primeira edição de uma revista que prometia explodir a cabeça de fãs sobre ficção científica, nerds, ufologistas e, por ultimo mas não menos importante – e não menos diferente hehe – designers! Isso mesmo!

Veja a capa da primeira edição a seguir.

Omni Magazine Cover #1
Omni Magazine Cover #1

Quero deixar bem claro que NUNCA li uma revista dessas se quer. Na verdade, eu soube da existência dela até alguns minutos atrás, quando navegava pelo blog do artista Scott Hansen, onde li um post sobre capas da revista Omni. E tudo o que sei é devido à algumas pesquisas rápidas que fiz sobre a Omni. Entra no time o Wikipedia e este site com um acervo incrível de capas.

O que chama a atenção é a qualidade das capas. Os diretores de arte não estavam pra brincadeira nessa época e mostraram muito talento no desenvolvimento.

Omni Magazine Cover
Omni Magazine Cover
Omni Magazine Cover
Omni Magazine Cover

Fica um sério ar retrô ao ver estas capas. É bem gostoso de se ver. Uma inveja boa quero dizer. Bah! São lindas pra cara*%#!

O mais legal é que capas antigas tem um ruído natural criado pelo próprio tempo. Isso dá mais personalidade a revista hoje.

Omni Magazine Cover
Omni Magazine Cover
Omni Magazine Cover
Omni Magazine Cover

É uma explosão de miolos estes trabalhos. Terrific!

Ilustração e diagramação de primeira, combinadas a uma direção de arte precisamente fod*. Isso é mais um daqueles exemplos para mostrar pra galera que tá começando que não importa se você tem a versão 47 do Photoshop com filtros mega blaster master plus plus+ para criar. O que importa é o talento. Pense nisso e inspire-se no velho – evite o novo.

A revista teve sua ultima edição em 1995. O que não é muito triste pois mesmo não estando viva, a revista e a equipe que fazia a direção de arte das capas acabam de ganhar um fã que se inspira ao ver obras depois de pouco mais de 10 anos de existência.

Omni Magazine Cover
Omni Magazine Cover
Omni Magazine Cover
Omni Magazine Cover

E você? O que te faz inspirar? O novo ou o velho? Só não vale responder “tudo me inspira” pois, apesar de ser verdade, tudo pode ser nada. 😉

Tutorial #1: Who’s Bad?

He's Bad!

Uma coisa que minha professora do curso de concept de personagens ensinou é buscar muitas referências. Muitas mesmo! Depois de descobrir onde estão essas maleditas, é hora de filtrar e selecionar as que são realmente interessantes para o job. Mas não fique triste achando que você perdeu tempo lendo sobre o mercado de ações explodindo, com o divino encostando em você, sendo que seu objetivo é criar algo relacionado a música, por exemplo. TUDO o que você vê, lê e ouve fica registrado no seu cérebro e isso acaba refletindo no momento de criação.

A referência fundamental deste trabalho foi quando encontrei conteúdo artístico de primeira no blog Signal Noise, do artista James White, que me inspirou pelas cores que ele usa e estilo retrô.

Então vamos lá:

Passo 1: Criando novo quadro

tutorial-mj-1

Esse é um passo muito pessoal, o quadro pode ser de qualquer formato. Como não achei que renderia um tutorial esta experiência com o Michael, criei em resolução 72dpi, sendo que o ideal é planejar sua aplicação inicialmente e então decidir se será um impresso (300dpi) ou um trabalho web (72 dpi).

turorial-mj-2

Fiz um degrade utilizando as cores #aebaa4 e #b3bfab, dois tons próximos de verde claro. Não precisa ser exatamente essas cores. A ideia é gerar meios-tons ao fundo que é o que darão naturalidade ao trabalho no final.

tutorial-mj-3

Passo 2: Colocando o Michael Jackson na arte


Recortei esta foto de Michael e posicionei no canto superior direito no quadro, planejando uma manipulação na foto dele “despedançando” em um movimento da esquerda para a direita.

Deixe a foto de Michael mais esverdeada colocando um Color Overlay na camada de Michael com a cor #b0bba6, Blend Mode Color e 75% de opacidade.

tutorial-mj-7

Escureça os meio-tons pelos Levels (CTRL+L ou CMD+L) para aumentar o contraste.

tutorial-mj-6

Veja como ficou:

tutorial-mj-4

Passo 3: Fazendo Michael virar tinta

tutorial-mj-brushes

Utilizei um excelente seleção de brushes gratuitos que simulam respingos de tinta no bittbox.com. Clique aqui para baixar os brushes.

Com uma camada em cima e outra abaixo da camada de Michael, pintei de forma que pudesse criar uma composição interessante com a foto, tambem proporcionando uma maneira de esconder o notável recorte da pélvis e aquelas mãos difusas.

As cores utilizadas foram selecionadas da própria foto, usando a ferramenta Eyedropper. Note que há o branco da camisa e o preto do paletó na tinta.

tutorial-mj-8

Veja como ficaram as camadas:

tutorial-mj-10

Eu costumo usar máscaras para trabalhar com brushes. Normalmente, eu pinto uma camada por inteiro, habilito a Layer Mask, inverto de branco para preto para fazer sumir a camada e então, clicando no quadro Layer Mask, seleciono a cor branca para pintar com brushes. No caso do Michael, não fiz isso (rs). Pois iniciei com brushes diretamente na layer e, para retocar, habilitei a Layer Mask para “apagar”, ou melhor, mascarar as partes que não me interessavam.

Em um próximo tutorial explicarei melhor o uso das Layer Mask que é de extrema utilidade, principalmente para manter a integridade da layer.

Passo 4: Mais detalhes, contraste e a cor de interferência

tutorial-mj-11

Decidi colocar tinta branca do lado direito de Michael, para aumentar o contraste de seu rosto. Aumentei os níveis de detalhes colocando pequenos brushes com a cor #ff7c00, que eu chamo de cor de interferência pois ela é a cor que se destaca da paleta habitual do quadro.

Passo 5: Destruindo Michael, no bom sentido

tutorial-mj-13

Dupliquei a foto de Michael, aumentei a saturação das cores e depois habilitei a Layer Mask. Na máscara, com o Polygonal Lasso, fiz seleções de pequenos pedaços, escolhendo entre a parte branca e preta da camisa, gravata e paletó. Pinte com a cor preta a seleção e deselecione. Inverta as cores da máscara com o atalho CTRL+I/Command+I. Agora, com os pedaços prontos, basta movê-los para o lado esquerdo, respeitando sempre o “ritmo” da arte.

Utilizei uma Layer Mask e fiz um trabalho usando os mesmos brushes para detonar o lado esquerdo da foto.

Passo 6: Mais detalhes e aplicação da segunda foto


Atrás da camada da foto de Michael, coloque esta foto. Tire a saturação de cores com o atalho CTRL+SFHIT+U/Command+Alt+U e selecione o blend mode Screen. Habilite uma Layer Mask para que você possa limpar as áreas que rodeiam o rosto.

tutorial-mj-14

Adicionei mais brushes usando a uma cor clara que capturei dessa nova foto.

Criei um vetor no Illustrator com linhas curvas, na maioria delas bem finas e algumas poucas bem grossas (entre 1pt e 3pt) e pode ser baixado aqui. Dei um Place no Photoshop e repeti esse vetor ao lado direito de Michael diversas vezes. Coloque o Blend Mode em Luminosity. Eu não ajustei a opacidade neste caso pois como os riscos são bem finas, parecem quase transparentes. Vejam ele sozinho:

tutorial-mj-15

Passo 7: Volume e UAU!

tutorial-mj-16

Essa é fácil e faz uma baita difereeeença no trabalho em geral: Volume. Coloque um degrade com foreground #e4eddb e background transparent, de cima para baixo. Duplique a layer para dar mais volume e voilá.

Passo 8: Fatlove loves Michael Jackson

tutorial-mj-18

Baixe aqui a fonte Fatlove e monte o texto nessa diagramação. Usei tracking de -90 e coloquei um stroke de 2px através do Layer Style. Coloque Fill 0% para deixar o corpo da camada transparente. Apenas no “Jackson” coloquei uma linha a mais.

tutorial-mj-17

Para criar o ruído no texto é fácil e divertido de fazer. Habilite uma Layer Mask na Type Layer e use um brush para “destruir” o texto. Depois de terminado, vá em Filters > Noise e selecione 3,5%.

Passo 9: Voilá

Bom, ficou muito massa assim. Ficou? Não ficou?? Quer mais???

Então tá bom, vamos alterar toda a paleta das cores usando o poderoso Gradient Map.

tutorial-mj-19

Crie um Adjustment Layer, selecione Gradient Map, escolha o gradiente roxo para laranja e a mantenha no topo de suas camadas.

tutorial-mj-20

Mude eu Blend Mode para Screen e altere o valor de opacidade para 30%.

Eita, olha que legal que ficou! Deixou a arte com um aspecto lavado.

tutorial-mj-21

Passo 10: Toques finais

Aumentar o contraste pois o nosso olho não consegue fixar muito bem para os pontos principais do trabalho. Isso é muito importate. Para isso, criaremos mais um Gradient Map e selecionaremos o gradiente laranja/amarelo/laranja. Mude Blend Mode para Soft Light.

Para finalizar, salve este PSD depois gere um PNG, utilizando o Save for Web (CTRL+SHIFT+ALT+S ou Command+ALT+SHIFT+S), com o propósito de manter a arte toda em uma só camada. Agora faça o seguinte para finalizzzh… eita… ouviu alguma coisa?! Parece uma sirene…

Killer tip alert! Killer tip alert! Killer tip alert!

Dica Matadora #1

tutorial-mj-sharp

Uma coisa que muitos designers esquecem é da utilidade do Sharpen, nosso querido filtro de de nitidez. Quando você finaliza um trabalho, NUNCA se esqueça de mandar pelo menos um Sharpen. Caso seu trabalho tenha que ficar em um tamanho final reduzido, por exemplo um banner publicitário com 20k, mande mais de 2 sharpens. O JPG, responsável por comprimir a imagem e, naturalmente, a compressão deixa imagem difusa, com ruído e padrões. A imagem com sharpen deixa seu trabalho, mesmo compactado, muito mais nítido e bonito. Ainda mais quando trabalhamos com ruído e artes com pequenos detalhes.

Pelo menos na versão CS3, você pode ajustar a intensidade do filtro. Após aplicar o filtro Sharpen, aperte CTRL+Z ou CMD+Z e acesse Edit > Fade Sharpen…

Conclusão

tutorial-mj-23

Como esse é o primeiro tutorial que escrevo, gostaria que saber se vocês gostaram, odiaram ou se ficou legalzinho… não importando o que achou, deixe um comentário para fazer o final de semana do autor mais feliz. :o)

É isso aí galera. O PSD (4MB) está aqui para vocês baixarem e consultarem. Este que é uma versão com quadro reduzido para estudos.

Divirtam-se.

Creative Commons License
A obra de Sergio Almeida é licenciado sob Creative Commons Atribuição 2.5 Brasil License.

Who’s Bad?

He's Bad!
He's Bad!

Michael Jackson é uma inspiração para qualquer ser que habita este planeta – caso você não saiba de quem estou falando, provavelmente você não pertence a Terra e, portanto, avise seus líderes que este planeta possui astros e por isso nunca nos renderemos! Ou colocaremos Axl Rose para apitar no ouvido da enorme cabeça cinza de vocês, lixos galáticos.

Bem, dado o recado aos alienígenas, enquanto pesquisava por Michael Jackson no Google, encontrei um site com uma coletânea gigante de fotos do nosso astro. Elas estão aqui. Aparentemente, são fotos de uma mesma época… selecionei duas que gostei e fiz um trabalho ao estilo retro e grunge – apesar de se tratar de um artista pop e a arte não “colar” muito com o universo musical dele.

Não sei se as fotos são da fase do “Sou Mau”de Michael mas tentei transmitir esse lado bandidão do Michael, pendendo mais para “Sou Mau Fod*” do que “Sou Maléfico Sanguinário”. Entendeu? E ele fica malandro com o chapeuzinho. Aliás, Master System tinha um jogo bem legal com ele; acho que se chamava Moonwalker.

Estou escrevendo o tutorial deste trabalho para ajudar toda comunidade de designers. Aguardem! :o)

Coloquei um lembrete para não esquecer…

tutorial-michael

Creative Commons License
A obra de Sergio Almeida é licenciado sob Creative Commons Atribuição 2.5 Brasil License.

Retrotape

Um pouco de anos 70-80 faz muito bem! Navegando por blogs e sites de fotos, encontrei três que me chamaram a atenção:

embalagem-cassete
Embalagem de alguma fita cassete compacta

Depois achei uma belíssima capa de algum jogo whatever de Atari. Excelente ilustração!

Capa de algum jogo de Atari
Capa de algum jogo de Atari

Com as duas fotos acima me inspirando, inquietado por criar algo, procurei por uma foto de fita cassete pois começou a surgir uma idéia. Achei uma foto, muito bonita inclusive, no Flickr.

Uma autêntica fita K7
Uma autêntica fita K7

Uau! Com toda essa velharia na minha cabeça, logo veio a idéia de criar um logo chamado “Retrotape”. Confiram:

retrotape-logo

Juntei tudo isso e veja no que deu:

retrotape-thumb
Clique na imagem para vê-la maior

Adorei brincar com arte retro. É muito interessante ter a sensação de desenterrar algo e usá-lo do seu jeito. Apesar de que, trabalhando em projetos da BlogTV me ajuda muito como influenciador de granulados e ruídos na criação de texturas.

Creative Commons License
A obra de Sergio Almeida é licenciado sob Creative Commons Atribuição 2.5 Brasil License.