O cara da informática

Ele entende de computadores mas não é nenhum robô!

Arquivos Mensais: abril 2011

Criando uma imagem de cabeçalho para o blog – Parte 1

Hoje, começo um projeto de design digital para dar ao blog uma imagem de cabeçalho. Vou descrever e mostrar todo o processo de criação até chegar à arte-final, toda editada com o Adobe Photoshop CS4.

Seguindo as configurações do tema escolhido, criei uma matriz com exatos 960 x 200* pixels e, então, criei uma camada com cor azul chapada (código hexadecimal 007dc5) para referência visual. Essa será a camada de fundo (não-visível na arte-final):

Edição de imagem de cabeçalho

Com a camada de fundo em posição, criei uma segunda camada para posicionar a primeira imagem da arte, uma imagem com racks de rede estruturada, a qual vou chamar de imagem1:

Edição de imagem de cabeçalho

Feito isso, criei uma terceira camada, com uma shape retangular branca, a qual vou usar para fazer um efeito de divisão entre as várias imagens que vão compor a arte-final. Observe que esta camada está ajustada com opacidade de 50%, para que seja possível ver as camadas inferiores durante a edição (é possível ver a camada branca pelo efeito de translucência causado nas camadas de fundo e na imagem1):

Edição de imagem de cabeçalho

Em seguida, crio mais duas camadas, a camada 4 com uma shape curva verde, a qual vou chamar de shape curva 1…

Edição de imagem de cabeçalho

e a camada 5 com uma shape curva vermelha, a qual vou chamar de shape curva 2:

Edição de imagem de cabeçalho

Ambas as shapes coloridas são, de fato, dois círculos perfeitos bem grandes posicionados estrategicamente, de forma que só parte deles fiquem expostos. A borda curva é a parte que nos interessa no momento, então não há problema. Embora haja outras maneiras de realizar o que vem em seguida, o uso de grandes círculos bem posicionados se mostrou o método mais prático para mim.

Com todos os elementos em posição, iniciaremos os “cortes”. Quero cortar a imagem1 com o formato da shape vermelha. Para isso, vou selecionar os pixels da shape vermelha que estão visíveis dentro dos limites da matriz, clicando com o botão direito do mouse sobre a camada da mesma e selecionando a função “select pixels” (selecionar pixels) no menu de contexto, como na imagem abaixo:

Edição de imagem de cabeçalho

Os pixels da shape vermelha foram selecionados. Porém, eu quero que a imagem1 tenha exatamente a forma da shape vermelha, portanto quero cortar a parte que está além da mesma. Para isso, eu inverto a seleção com o comando ctrl+shift+i no teclado. Quando a seleção se inverter, seleciono a camada da imagem1 e aperto a tecla delete. O resultado será o seguinte (escondi as outras camadas para que o resultado ficasse visível):

Edição de imagem de cabeçalho

A imagem1 ficou com a mesma forma da shape vermelha. Meu desejo agora é remover a forma da shape vermelha da shape branca. Como ainda tenho uma seleção ativa, é só invertê-la novamente aplicando o comando ctrl+shift+i. Com a seleção invertida, seleciono agora a camada da shape branca e aperto a tecla delete. Observe o resultado:

Edição de imagem de cabeçalho

A shape branca foi “cortada” com o formato da shape vermelha.

Para finalizar esta primeira parte, vamos fazer a divisória branca entre a imagem1 e a imagem2 (a imagem2 será introduzida no próximo artigo, junto com as outras imagens). Antes de começar com os cortes, vou fazer uma cópia da shape branca e dar-lhe o nome divisória1. Faço isso selecionando sua camada e acessando o menu Layer/Duplicate layer (Camada/Duplicar camada), como na imagem abaixo:

Edição de imagem de cabeçalho

Com a camada duplicada e renomeada, vou agora esconder a camada da shape branca original. Em seguida, vou selecionar os pixels da shape verde da mesma forma que fiz para selecionar os pixels da shape vermelha e então inverter a seleção. Feito isso, vou selecionar a camada da divisória1 e apertar a tecla delete. O resultado será o seguinte (escondi as outras camadas para que o resultado ficasse visível):

Edição de imagem de cabeçalho

Agora só falta aplicar as sombras para criar o efeito visual desejado, mas antes devemos tornar a divisória branca totalmente opaca (ela está translúcida pois herdou a configuração de opacidade de 50% da camada da shape branca original). Para isso, é só ajustar a opacidade desta camada para 100%.

Antes de aplicar os efeitos de sombra, preciso reposicionar as camadas. Quero que a sombra da imagem1 cubra parte da divisória1; para isso, preciso posicionar a camada da imagem1 sobre a camada da divisória1. Feito isso, vou clicar com o botão direito do mouse na camada da imagem1 e selecionar a opção “blending options” (opções de mesclagem) no menu de contexto, como na imagem abaixo:

Edição de imagem de cabeçalho

No painel aberto, vou selecionar a função “Drop shadow” (sombra projetada) e fazer os seguintes ajustes no quadro de configurações:

Edição de imagem de cabeçalho

Observe que, como resultado, surgiu uma sombra da imagem1 projetada sobre a divisória1:

Edição de imagem de cabeçalho

Quero que uma sombra de divisória1 seja projetada sobre o plano de fundo; para isso, vou repetir o processo acima na camada da divisória1. O resultado:

Edição de imagem de cabeçalho

No próximo artigo, darei continuidade à confecção da imagem de cabeçalho do blog. Gostaria de saber suas opiniões e sugestões sobre que tipo de efeitos ou imagens eu devo usar nas etapas seguintes (mesmo que seja pra dizer que a etapa seguinte deve ser jogar tudo fora – tá tudo horrível – e começar do zero). Até lá!

*As imagens publicadas neste artigo possuem as medidas 480 x 100 pixels, metade das medidas da imagem real.

Anúncios

O cara da informática dorme – Parte 1

“O CARA DA INFORMÁTICA dorme. Pode parecer mentira, mas O CARA DA INFORMÁTICA precisa dormir como qualquer outra pessoa. Esqueça que ele tem celular e telefone em casa, ligue só para o escritório”

E quando é o próprio pessoal do escritório que não te dá sossego?

Há cerca de dois meses atrás, foi iniciada uma reforma na matriz de uma empresa de engenharia da qual eu era o gerente de TI. Como o pessoal reclamava demais da rede wireless, eu propus um projeto para aproveitar a reforma e implantar uma rede estruturada, o que melhoraria o tráfego de dados e acabaria com as interrupções constantes no sinal.

O projeto não serviu de nada. Todo dia havia alterações por parte do patrão, no número de pontos, posicionamento dos mesmos, infra-estrutura de suporte, etc. Por fim, joguei o projeto no lixo e improvisei, me adaptando às constantes mudanças (que me irritavam por demais, pois não levavam em conta as viabilidades técnicas e a sua utilidade prática). Muitas delas serviam somente pra tornar a estrutura mais complexa e menos flexível, mas o patrão não estava muito preocupado com isso. Eu tinha de me virar.

A implantação dessa rede foi tão problemática que me perseguia nos meus sonhos (ou pesadelos) nas poucas horas que conseguia dormir. Meu tempo era muito curto e, pra piorar, tinha de dividi-lo com outros profissionais trabalhando na reforma, o que atrasava ainda mais o processo. Constantemente saía de lá já na madrugada do dia seguinte. Até que, em um determinado dia, eu tive de virar a noite e ficar o outro dia todo, até a madrugada outra vez, completando 44 horas seguidas trabalhando. Tudo para me adequar ao cronograma da obra. Morto de cansado, louco por um banho e com fome, fui pra casa. No começo da manhã do dia seguinte, o patrão liga do escritório cobrando a minha presença e dizendo que não importava quando tempo eu estive acordado e trabalhando sem parar, eu teria muito tempo pra dormir depois…

Gif’s animadas e fotografias no tempo perfeito!

Pra quem gosta de gif’s animadas, blinks, cards e temas pra MSN que sigam um estilo mais infantil, romântico, meigo (as meninas vão adorar), o blog certo é o blog da Menina Hortelã – http://meninahortela.blogspot.com/ – As artes são muito bem feitas e a designer Thalita Tammy (a Menina Hortelã) também oferece um diferencial: faz artes sob medida, como essa gif animada que fez especialmente para uma amiga:

Menina Hortelã

Mudando da arte digital para a fotografia, recomendo este ótimo site intitulado Perfectly Timed photos (em uma tradução livre, “Fotos no momento perfeito”) – http://perfectlytimedphotos.com/ – É óbvio que algumas das fotos exibidas são resultado de manipulação digital, fotos “photoshopadas”, como dizem alguns, mas há muitas fotos reais impressionantes. Os fotógrafos souberam (ou tiveram a sorte) de apertar o botão no “momento perfeito”, como o título do site sugere. Essas duas fotos são uma amostra desse “timing” acurado (ou manipulado no editor de imagens):

Perfectly timed photos
Perfectly timed photos

Em breve, mais novidades sobre design digital. Aguardem!

O cara da informática – Introdução

‘A área de TI é realmente uma ótima área para se trabalhar, porém tem seus prós e contras como qualquer outra profissão. Dependendo da empresa em que esse profissional trabalha, o mesmo é comumente chamado de “O CARA DA INFORMÁTICA”. Saibam que apesar desse “cara” trabalhar com tecnologia, entender de computadores e estar conectado no universo digital ele é de carne e osso, ou seja, possui necessidades como qualquer outra pessoa de qualquer outra profissão.’

Isso me faz lembrar de minha mãe. Quando eu era mais jovem, ouvia ela repetir “Estude, garoto, vá fazer uma faculdade, vire um engenheiro, um médico!” e respondia “Mãe, eu vou estudar informática, vou ser um técnico, um cientista da computação, é uma ótima área para trabalhar!”, ou seja, repetia para ela exatamente o que a primeira frase dessa introdução diz. Eu acreditava nisso e ainda acredito. Realmente é uma excelente área (pra quem gosta), muito abrangente, com muitas opções. Realmente tem seus prós e contras, como qualquer outra profissão.

O problema é que, às vezes, os contras parecem ser maiores e mais fortes que os prós e isso pode gerar períodos de desgaste, desânimo. Pra citar um exemplo, quando “o cara” vai trabalhar em uma empresa para administrar sua infra-estrutura de TI e as pessoas com quem “ele” trabalha acham que, só pelo fato de “ele” ser “o cara”, “ele” sabe tudo e resolve tudo, como se informática fosse somente uma questão de digitar alguns códigos na tela, uns “cliques” de mouse e tudo ficasse lindo e perfeito, como num passe de mágica. Não só acham que é assim como exigem que assim seja! Ai “dele” se não atingir essa expectativa, pois então não saberá de nada e não resolverá nada… do “tudo” para o “nada”, na cabeça de muitos, é um pulo.

Há muitos outros problemas com os quais “o cara” tem de lutar na sua jornada. Vou falar sobre eles nos próximos artigos. Aguardem!

Inspiração!

Faz algum tempo que quero criar um blog para falar sobre informática e design digital/web design, mas não conseguia pensar em um tema para começar. Então me lembrei de um e-mail que recebi de um amigo faz algum tempo, intitulado “O cara da informática”, que fala sobre as dificuldades que o profissional da área enfrenta no dia-a-dia e que, ao contrário do que muitos pensam, não é nenhum robô, mágico, vidente ou milagreiro.

Me lembro que meu amigo incluiu o seguinte comentário: “Você deve mostrar isso ao seu chefe!”. Isso porque ele sabia das dificuldades que eu enfrentava todos os dias, pois as pessoas achavam que eu podia resolver tudo só estalando os dedos (ou com algum tipo de feitiçaria).

Ao reler o texto, resolvi falar sobre esse assunto, analisar mais detalhadamente as questões, falar sobre experiências que vivi e que se encaixam muito bem nos tópicos citados. Sei que muitos vão se identificar com o que vou escrever nos próximos artigos. Espero que gostem!

%d blogueiros gostam disto: