ferramentas, etapas e dicas · o que é perfil de cor srgb? como o assunto desse e-book é focado...

FERRAMENTAS,ETAPAS E DICASQUE TODO DESIGNER DE BANNERSE MÍDIAS SOCIAIS PRECISA CONHECER

O GUIA DEFINITIVO


O GUIA DEFINITIVO

thiagochristo.com.br 2

>SEJA BEM-VINDO! .........................................................................................3

>OS PROGRAMAS MAIS USADOS PELOS DESIGNERS....................................4

>PERFIL DE COR ..............................................................................................5

>RESOLUÇÃO ..................................................................................................6

>FORMATOS WEB............................................................................................ 7

>BANCOS DE IMAGEM ....................................................................................8

>GRID E GUIDES ..............................................................................................9

>FORMATOS DE ARQUIVO ............................................................................. 10

>REFERÊNCIAS PINTEREST/BEHANCE ......................................................... 11

>BÔNUS PARA VOCÊ: ................................................................................... 12

>QUEM É THIAGO CHRISTO? ......................................................................... 13

ÍNDICE

https://thiagochristo.com.br/


O GUIA DEFINITIVO


Olá, eu sou Thiago Christo, instrutor, arte-finalista e especialista em tratamento de imagem, desde 2000. E aqui, separei um conteúdo bem bacana, fácil e muito útil para você, que já trabalha ou pretende trabalhar com design para banners de internet e posts ou stories para redes sociais.

Aqui eu vou trazer dicas de programas, ferramentas, formatos de layouts e muito mais para você ganhar tempo e adicionar ainda mais qualidade aos seus trabalhos.

Agora, se você quiser aprender mais a fundo sobre como criar layouts incríveis para internet, com aulas 100% online, é só clicar aqui para se inscrever no meu Curso de Photoshop para Banners de Internet e Mídias Sociais.

>SEJA BEM-VINDO!

QUERO ME INSCREVER AGORAUSE CUPOM COM DESCONTO ESPECIAL PARA VOCÊ.

CÓDIGO: EBOOK2020


https://thiagochristo.com.br/cursos/ebook-photoshop-midias-sociais/




O GUIA DEFINITIVO


>OS PROGRAMAS MAIS USADOS PELOS DESIGNERS

Adobe Photoshop• O programa de edição mais conhecido e utilizado no

mundo, principalmente no mercado publicitário, de design e fotográfico

• Possui uma infinidade de recursos profissionais que podem ser aplicados nos seus trabalhos

• Compatível com PC, Mac e iPad• A escolha ideal para quem já está trabalhando no mercado há

mais tempo e precisa de uma ferramenta mais profissional • Para adquirir, você precisa pagar uma assinatura mensal, com

diversas modalidades de assinatura. Você pode assinar apenas o Photoshop, ou pode incluir também outros programas e ferramentas da Adobe no pacote, como Indesign e Illustrator

Quer fazer um curso completo de Photoshop? Clique aqui para se inscrever no meu curso Photoshop (LINK CURSO PHOTOSHOP)

Gimp • Compatível com

PC, Mac e Linux• Uma ótima pedida

para quem está começando no mundo de edição de imagens ou não tem recursos financeiros para iniciar essa nova habilidade na carreira

• Tem recursos interessantes de edição, mas com algumas limitações, em relação ao Photoshop e o próprio Affinity Photo também

• Programa gratuito

Quer aprender a fundo todos o recursos do Gimp? Eu tenho um curso especial para isso. Clique aqui para se inscrever no Curso Gimp para Iniciantes (LINK PARA CURSO DE GIMP)

O ambiente de trabalho e menus dos três programas são bem parecidos entre si. Por isso, você não terá dificuldades caso queira começar por um deles e migrar para o outro.

Como designer há 20 anos, pude conhecer durante esses anos, muitos programas e ferramentas para realizar o meu trabalho em diversas áreas, seja para os meios impressos e gráficos, seja para os meios digitais. Para encurtar esse caminho de descobertas para você, selecionei as 3 principais ferramentas e suas vantagens. Confira e escolha a que for mais adequada para você:

Affinity Photo • Apesar de ter pouco tempo de mercado, já se

consolidou como um programa de edição de imagens muito bom

• Possui diversos recursos profissionais, até bem parecidos com o Photoshop, mas, claro, é mais simplificado

• Compatível com PC, Mac e iPad• Para adquirir, você precisa apenas pagar um valor único pelo

programa, sem precisar de renovar todos os meses.

Em breve, vou disponibilizar um curso 100% online de Affinity Photo. Acompanhe pelo telegram meus comunicados.



https://thiagochristo.com.br/gimp/

https://thiagochristo.com.br/gimp/

https://thiagochristo.com.br/telegram/


O GUIA DEFINITIVO


O que é perfil de cor sRGB?

Como o assunto desse e-book é focado em criação de layouts para peças de internet, como banners de site e posts de redes sociais, precisamos falar sobre perfil de cor.

Independente do programa de edição utilizado, quando falamos em peças que serão reproduzidas para telas de computador, tablets e celular, o perfil de cor é específico para esses meios, e no nosso caso, estamos falando do Perfil de cor sRGB.

Por que sRGB?

O sRGB é o padrão de cores global, usado por todos os equipamentos que tenham telas, como computadores, celulares ou tablets, Além disso, todos os programas que atuam com edição de imagens trabalham também com esse perfil. Sabe aquele post que você vê na tela do seu celular, ou o banner de internet que está ali, piscando, na tela do seu computador? Quando ele foi criado e finalizado, o perfil de cores usado foi o sRGB!

>PERFIL DE CORO bom do sRGB é que, quaisquer diferenças de cores entre dispositivos são praticamente imperceptíveis. Ou seja, a imagem que você edita no computador, vai ter as mesmas características de cor, se visualizada em outro dispositivo, como o celular, por exemplo. Mas, claro, levando em consideração que a calibragem da tela desses equipamentos esteja correta.

No meu Curso Photoshop para Banners de Internet e Mídias Sociais, eu ensino você a configurar o Photoshop para este perfil.

Isso vai garantir que desde a criação do layout até a finalização dele para publicação online, as cores utilizadas sejam as mais fiéis possíveis.


CÓDIGO: EBOOK2020

sRGB

Adobe RGB CMYK

Adobe RGB sRGB CMYKProPhoto RGB

Espaçode Cor






O GUIA DEFINITIVO


Quando falamos de imagem para impressão, precisamos de trabalhar com uma resolução maior, mas como o caso aqui é falar de imagens para internet, que serão visualizadas em telas, podemos trabalhar com uma resolução menor. E por isso, costuma-se trabalhar com 72 dpis, o que é bem pouco para pensar em impressão, mas é o ideal para imagens de internet. Por que trabalhar com imagens em 72 dpis para internet?

- Para telas de computador e celular, trabalhar com 72 pixels já é o suficiente- Os arquivos gerados não ficam pesados ou demoram a carregar- A maioria das plataformas que hospedam as imagens em seus servidores, como Facebook, Instagram, Google Ads exigem imagens em menor resolução ou, automaticamente já fazem essa redução de qualidade antes de postá-las- Você mesmo economiza espaço na sua máquina de trabalho ou na sua nuvem, com arquivos mais levesNo meu Curso Photoshop para Banners de Internet e Mídias Sociais, você aprende como trabalhar com layouts em 72dpis e, mesmo assim, preservar a qualidade e a eficiência do seu trabalho. Clique aqui para se inscrever e aprender na prática.

O que é resolução? E como isso funciona para peças de internet?

Resolução nada mais é que é a quantidade de pixels por unidade de comprimento de uma imagem. Quando falamos em imagem de boa resolução ou qualidade, estamos falando de uma imagem com maior concentração de pixels. Ou seja, o que determina essa resolução é a quantidade de pixels por polegada, também conhecido como DPI (Dots Per Inch).

Para simplificar: é como se uma foto fosse feita de vários pontinhos, que são esses pixels. Cada pontinho é uma cor e, quando a gente junta, formamos a imagem. Então, se a imagem tem mais pontos, mais qualidade/resolução ela vai ter. E quanto menos pontos, menos resolução. Olha aqui um exemplo:

>RESOLUÇÃO


CÓDIGO: EBOOK2020








O GUIA DEFINITIVO


E para ganhar eficiência na criação desses layouts, essas ferramentas disponibilizam em seus sites os formatos das imagens. Ou outros sites ligados ao marketing digital também oferecem templates prontos com esses formatos. Um deles é o Resultados Digitais, que preparou um material completo com esses templates para download. É só clicar aqui para ir direto ao material

Outro site legal para encontrar conteúdos voltados à criação de layouts para marketing digital é o MLabs, que tem uma página totalmente dedicada a vários materiais educativos. Clique aqui para conferir também.

Importante lembrar: algumas plataformas como o Facebook e Instagram, costumam alterar regras e formatos de anúncio ou lançar novos formatos, por isso é importante ficar de olho nessas mudanças. Os sites citados aqui, estão sempre acompanhando essas atualizaçõe, mas é bom ficar sempre de olho!

Formatos de imagem para banners de internet e redes sociais

O mundo do marketing digital permite diversas possibilidades. E para quem quer atuar como designer nessa área vai encontrar centenas de formatos para criação de layouts.

Quando falamos de banners, temos diversos tamanhos, tanto voltado para topos de sites, como também os banners com anúncios em portais de notícias ou outros sites que tenham em seu espaço os banners do Google e outras ferramentas de publicidade. Já nas mídias sociais, também temos outras centenas de formatos de imagens: avatar; imagem de capa; capa de evento; posts do Instagram, Facebook, LinkedIn e outras redes; stories e muito mais.

>FORMATOS WEB


https://rd-marketing-objects.s3.amazonaws.com/templates_redes-sociais-comkt/Templates_para_Redes_Sociais-mLabs-Resultados_Digitais.pdf

https://www.mlabs.com.br/material-educativo


O GUIA DEFINITIVO


Bancos de imagem pagos (geralmente com as melhores opções de fotos e vetores):- GettyImages: https://www.gettyimages.com.br/- ShutterStock: https://www.shutterstock.com/pt/- iStock: https://www.istockphoto.com/br- Adobe Stock: https://stock.adobe.com/br/- 123f: http://br.123rf.com - Dreamstime: http://www.dreamstime.com/- Deposit Photos: https://br.depositphotos.com/- Bigstock: http://www.bigstockphoto.com/pt/

Bancos de imagem grátis ou parcialmente grátis:- Freepik: http://br.freepik.com- Pixabay: http://pixabay.com- Free Images: http://pt.freeimages.com- Unsplash: http://unsplash.com/- Pexels: http://www.pexels.com- StokPic: http://stokpic.com- Negative Space: https://negativespace.co/- Unsplash: https://unsplash.com- SXC: www.sxc.hu

No meu curso eu mostro como escolher a imagem perfeita para usá-la no layout, levando em consideração a composição de camadas e a eficiência no seu trabalho. Clique aqui para se inscrever no meu Curso Photoshop para Banners de Internet e Mídias Sociais do Thiago Christo.

Quem cria layouts para internet precisa ter em mãos uma gama de imagens para trabalhar. E como essas peças estão disponíveis em todo o mundo, é preciso levar em consideração alguns pontos:

1) O direito autoral de imagens: você não pode simplesmente baixar uma imagem do Google, por exemplo, e usar no seu trabalho. Isso pode render violação de direitos autorais e problemas para você ou para o seu cliente;

2) A qualidade da imagem: já sabemos que imagens com resolução de 72dpis são ideais para uso na internet, mas, dependendo do formato da peça usar uma foto ou imagem que tenha uma resolução menor do que essa, pode comprometer a qualidade do seu trabalho;

3) Cada trabalho que você faz é uma peça para o seu portfólio: seja responsável e criterioso com o uso de imagens. O resultado disso pode refletir em indicações de você como profissional.

Para seus trabalhos voltados a banners e peças de redes sociais, o ideal é trabalhar com fotos produzidas pelo seu cliente ou fotos e vetores de bancos de imagem. Mas lembre-se que nesse último caso é bom verificar antes do download se a imagem escolhida é RF (Royalty Free), ou seja, que tem direitos de uso liberados.

Separei aqui alguns links de bancos de imagem. Dê uma navegada e escolha, de acordo com a complexidade do trabalho e a verba do seu cliente qual deles é o ideal para você:

>BANCOS DE IMAGEM


CÓDIGO: EBOOK2020







O GUIA DEFINITIVO


Regras de quantidade de textos em anúncios no Facebook e Instagram

Existem posts de Facebook e Instagram orgânicos e posts promovidos (também chamados de anúncios, posts pagos ou posts impulsionados). A diferença é que os posts orgânicos são os posts que apenas são criados e postados e nenhuma verba é destinada a eles e os posts promovidos são os que recebem um investimento, de acordo com os objetivos e verba disponíveis.

Neste caso, tanto o Facebook como o Instagram exigem que o texto aplicado na imagem desses posts ocupe, no máximo, 20% da área do layout. Essa regra já está em vigor há um tempo, mas como pode ser que essa exigência mude, eu vou deixar aqui para você um link, do próprio Facebook para ser seu guia:

https://www.facebook.com/ads/tools/text_overlay

Ao clicar nesse link e importar a imagem do post que você criou, essa ferramenta vai verificar a quantidade de texto da imagem e calcular para você o percentual de ocupação de texto, informando se está dentro dos 20% ou não.

>GRID E GUIDES

Dicas/Observações:

- O texto contido em imagem de fundo, às vezes é contabilizado como texto. Fique atento a isso.

- O texto contido no logotipo também é, às vezes, contabilizado como texto.

- Você pode fazer esse cálculo de uma forma mais simplificada, é claro, e direto no Photoshop. Basta criar uma grade com 25 quadrados sobre a imagem que você está layoutando e verificar quantos quadros são ocupados inteiramente com textos. Se o limite é de 20% de texto, deve-se ter, no máximo, 5 quadrados preenchidos com texto (não importa se o texto está em pontos diferentes do layout). Neste caso, a dica é evitar que parte do seu texto, por mínimo que seja, invada uma pequena área de um outro quadrado, sem necessidade. Isso vai evitar que esse quadrado seja contabilizado pela ferramenta como uma área parcialmente ou totalmente ocupada por um texto.



O GUIA DEFINITIVO


Formatos de imagem mais usados e suas diferenças: JPG (JPEG) e PNG:

JPG (ou JPEG) e PNG são os dois formatos de imagem mais utilizados para layouts de internet. Devido ao seu “peso” menor, facilidade de carregamento e a preservação da qualidade em muitos casos.

Vou explicar as diferenças e indicações de cada um deles aqui:

DIFERENÇAS BÁSICAS:

PNG:- Arquivos um pouco mais pesados, se comparados à finalização m JPG- Permite transparência - ideal para aplicar logos sobre fundos coloridos, por exemplo- Atende apenas ao padrão RGB (voltado a telas)

JPG (ou JPEG):- Arquivos menos pesados, se comparados à finalização em PNG- Perda de resolução devido à compressão alta, em relação ao PNG- Permite padrões em CMYK (destinados à impressão gráfica) e RGB (destinado à visualização em telas)

USOS E PONTOS IMPORTANTES:

JPG (ou JPEG):- Não é indicado em casos onde a imagem não pode ter sua qualidade reduzida depois de uma compactação;- Não é a melhor escolha também para ícones, textos ou gráficos que precisem de alta definição;

>FORMATOS DE ARQUIVO- Ao comprimir uma imagem no Photoshop para o formato JPG, algumas informações da imagem são eliminadas. E toda vez um arquivo nesse formato é aberto e salvo, ele vai se compactando mais e mais. Isso significa que, a cada vez que você edita algo em um arquivo JPG, ele vai perdendo a sua qualidade.

PNG:- Como já dito, o PNG consegue compactar imagens sem nenhuma perda de qualidade e ainda possibilita níveis de opacidade diferentes para cada pixel. Isso significa muito mais definição para as imagens- Não é o formato mais indicado para fotos, mas quando o assunto são ícones, elementos vetoriais, textos ou logos, o PNG é ideal- Por permitir melhor definição, seu peso é maior, como já dito. E se, por acaso, a sua imagem que você gerou para ser publicada na internet, em formato PNG ultrapassar o limite permitido pela plataforma, a imagem será compactada e a qualidade será reduzida

No meu curso eu mostro como finalizar os arquivos nesses formatos e como tirar o máximo de potencial nesse momento para você garantir a qualidade do seu layout, sem perder tempo . Clique aqui para se inscrever no Curso Photoshop para Banners de Internet e Mídias Sociais do Thiago Christo.


CÓDIGO: EBOOK2020







O GUIA DEFINITIVO


Procurando por inspirações para criar seus layouts de banners, posts e stories? Aposte nas referências que estão na própria internet para praticar seu conhecimento ou aprimorar seu trabalho. E, de quebra, ainda conhecer outros profissionais e até fazer networking com eles.

Dois sites que eu sempre indico para isso são:

>REFERÊNCIAS PINTEREST / BEHANCE

- Pinterest https://br.pinterest.com/ que permite que você até favorite imagens que ache interessantes ou que sejam relevantes para o trabalho que está executando.


CÓDIGO: EBOOK2020

- Behance https://www.behance.net/ que reúne trabalhos e portfólios de diversos artistas do segmento de design, artes plásticas, fotógrafos, publicitários. E, claro, você também pode criar o seu cadastro lá e postar os seus trabalhos também.

Quer arrasar na qualidade, criatividade e beleza dos seus layouts para banners posts e stories, assim como as referências que você vê nesses sites? Inscreva-se no meu curso Photoshop para Banners de Internet e Mídias Sociais.







O GUIA DEFINITIVO


>BÔNUS PARA VOCÊ: Preparei aqui dentro desse e-book um bônus para você que fez o download: a minha aula completa sobre Fluxo Digital, com as dicas sobre todas as etapas para tratamento de imagens. Uma boa pedida para você deixar seu trabalho ainda mais profissional, organizado e eficiente.

Clique aqui para ter acesso GRÁTIS

QUERO ME INSCREVER AGORAACESSE GRÁTIS


https://thiagochristo.com.br/cursos/fluxodigital/

https://thiagochristo.com.br/cursos/fluxodigital/

https://mailchi.mp/cf81fc093064/fluxodigital


O GUIA DEFINITIVO


>QUEM É THIAGO CHRISTO?

Aproveite para participar gratuitamente do nosso Grupo no Discord estou sempre por lá com os alunos fazendo lives e tirando dúvidas.https://thiagochristo.com.br/discord/

Grupo do TelegramReceba dicas, novidades de programas, técnicas, ferramentas e cursos.https://thiagochristo.com.br/telegram/

Conte comigo nessa sua jornada. Estou à disposição para ajudar você e tirar todas as suas dúvidas. Se quiser bater um papo e transformar suas ideias em possibilidade, pode entrar em contato.

Um grande abraço,

Thiago [email protected]+55 (27) 99929-2488

Atualização - 05/2020

• Instrutor, Arte-Finalista e Especialista em Tratamento de Imagem desde 2000;

• Mais de 55 mil alunos;• 15 cursos publicados;• Especialista em pós-produção de imagens;• Já atuou como designer gráfico, arte-finalista e

diagramador nas principais empresas de design e comunicação do Espírito Santo;

• Estudou Coaching, Marketing e Design;• Hoje atende clientes de várias partes do

mundo em diversos segmentos, criando imagens 2D e 3D;

• Constantemente convidado por faculdades, empresas e agências de comunicação para ministrar workshops de fluxos de trabalho ensinando as técnicas dos programas utilizados na publicidade, no design e na fotografia como Photoshop, Illustrator e Indesign.

Quer conhecer todos os meus cursos e conferir os trabalhos que já executei? Clique aqui para ir para o meu site. https://thiagochristo.com.br/ Lá você também pode entrar em contato comigo para tirar dúvidas.


https://thiagochristo.com.br/discord/

https://thiagochristo.com.br/discord/





ferramentas, etapas e dicas · o que é perfil de cor srgb? como o assunto desse e-book é focado...

Documents