Tecnologia Marketing Design de Internet

Tecnologia Marketing Design de Internet Tecnologia Marketing Design Thalis Valle é formado em Publicidade e Propaganda, e exerce nas áreas de Design e Gestão de Marketing/Comunicação Digitais como Freelancer.

Contato

Receba os artigos
no seu E-mail
:

Arquivado em ‘Web Design e CSS’


10 anúncios interessantes feitos em fachadas de prédios

Quinta, jan 14th, 2010

Repassando 10 anúncios interessantes feitos em fachadas de prédios, publicado no IG Colunistas:

http://colunistas.ig.com.br/obutecodanet/2010/01/06/10-anuncios-extremamente-interessantes-feitos-em-fachadas-de-predios/

Logotipo grande, mentalidade pequena

Quinta, set 17th, 2009

Siga-me no Twitter.

Destrua a moda web 2.0

Terça, set 15th, 2009

O melhor emprego do mundo

Sexta, jul 24th, 2009

Você se lembra daquele concurso para escolher o zelador de uma ilha paradisíaca na Austrália? Pensou em se candidatar à vaga? Se a sua resposta for positiva, você foi mais um dos que foram seduzidos pela melhor campanha publicitária da história.

Este ano, pela primeira vez nos 50 anos do festival de Cannes, o mais importante e tradicional do mundo, a campanha intitulada “O melhor emprego do mundo” qu elevou o grand prix.

A campanha da secretaria do turismo do estado australiano Queensland conseguiu respeitável repercussão mundial. O site obteve 500 mil votos, 7 milhões de visitantes e o Youtube recebeu 34 mil vídeos de candidatos.

Rohit Bhargava, colaborador da revista Fast Company e vice-presidente de estratégia online da agência Ogilvy, afirma que ao contrário do que parece, a razão do sucesso da campanha não está no produto divulgado, mas na forma como as redes sociais foram usadas.

Após analisar a estratégia, Bhargava fez uma lista com seis lições que as pequenas e médias empresas podem aprender:

Faça parecer factível

Muitos publicitários nunca divulgariam algo que não possa ser provado. Será que a secretaria do turismo de Queensland pode provar que se tratava do melhor emprego do mundo? Não, eles não podem. Mas tornaram factível porque estavam divulgando um lugar maravilhoso e que se encaixa na definição de emprego dos sonhos de muita gente.

O quanto você gasta é irrelevante

Um dos benefícios das mídias sociais é que a repercussão ocorre em uma escala diferente da publicidade tradicional. O mais importante é ter algo relevante a dizer. Você precisa apenas de uma boa história para repercutir na internet.

O mais importante é focar no conteúdo, não na quantidade

7 milhões de visitantes é um número interessante, mas o mais importante da campanha vencedora foram os 34 mil vídeos de pessoas dizendo coisas boas sobre Queensland. Se somarmos os espectadores desses vídeos a longo prazo, o impacto da campanha é impressionante.

Crie uma razão para as pessoas interagirem

Outro elemento que deu certo foi o fato das pessoas poderem votar nos vídeos. Isso significou que após a gravação, os candidatos precisavam trabalhar na divulgação.

O poder de criação dos internautas

Pesquisas indicam que entre 1% e 10% dos usuários das redes sociais criam conteúdo. No entanto, esse índice tem potencial de atingir um número de pessoas enorme. A criação de conteúdo pelos usuários pode ser uma arma secreta da sua próxima campanha.

Faça campanha duradoura

Uma das funções do escolhido para o cargo de zelador da ilha é atualizar um blog com notícias sobre o dia a dia das atividades. O vencedor postará também vídeos e imagens do local. Ou seja, a campanha ainda tem potencial. Isso pode ser chamado de calda longa.

Siga-me no Twitter.

WordCamp WordPress

Quarta, jun 10th, 2009

Dia 21 de junho em São Paulo, acontece o WordCamp Brasil, conferência sobre WordPress organizada pela Comunidade WordPress-BR onde desenvolvedores, designers, blogueiros e usuários casuais poderão assistir palestras e apresentações, trocar idéias e se conhecer num ambiente informal.

Siga-me no Twitter.

Como transformar o seu Web Site em uma Máquina de Geração de Demanda

Sexta, jun 5th, 2009

A BizRevolution promoveu hoje o web seminário “Como transformar o seu Web Site em uma Máquina de Geração de Demanda“, que em resumo, ajudou a abrir a mente das pessoas (empresas) que buscam se mexer no mercado, e usar a tecnologia web para benefício à presença comercial do Web Site da empresa.

Resumindo: transformar um site ultrapassado e sem visitas em uma plataforma moderna e otimizada para ser encontrado, e vender!

Nove em cada dez profissionais não estão felizes com os seus web sites atuais.

A BizRevolution está pronta e capacitada para ajudar você a revolucionar o seu web site para ter resultados imediatos para os seus negócios.

Siga-me no Twitter.

Renderização de E-mail Marketing

Sexta, mai 29th, 2009

Mesmo com a tecnologia avançando tanto na área web, usuários e desenvolvedores ainda se deparam com diferenças de renderização entre os navegadores web. Não poderia ser diferente com os clientes de e-mails que não entendem certas tags HTML e seletores ou propriedades CSS.

Segue regrinhas básicas acerca dos softwares/clientes web de e-mails como: Gmail, Hotmail, Yahoo!, IG, Terra, UOL, BOL, Outlook Express, Windows Mail e Live Mail:

1. O CSS deve ser inline: escritos junto as tags HTML;

2. Evitar propriedades como float, clear, position, list-style-image e background-image;

3. Evitar tableless (<div>). Dê preferência pelo método tradicional de tabelas (<table>);

4. Não usar as tags HTML strong, em e del, para e-mails a serem disparados no Terra Mail. Todos os demais aceitam, com exceção a tag ol;

5. Não usar tags de formulários como form, input, textarea, etc. Prefira links (a href=”") para um URL externo, para que o formulário possa ser processado via HTTP;

6. Gmail, BOL e UOL suportam videos e animações em Flash, mas não é recomendado usar esse tipo de midia em e-mail marketing;

7. Não ultrapassar 23 caracteres, no campo de Assunto;

8. Não usar somente imagens no corpo do e-mail (<img>). É preciso ter pelo menos alguma frase em texto;

9. Não ultrapassar 600px de largura para não comprometer a área de visualização.

Siga-me no Twitter.

Professional Frontend Engineering

Quarta, abr 8th, 2009

Wall tatoo, tatuagem de parede

Terça, fev 17th, 2009

Monty Python vende 23.000% mais DVDs na Amazon depois de abrir canal no YouTube

Segunda, jan 26th, 2009

O Monty Python abriu um canal no YouTube com vários sketches e links para seus DVDs na Amazon. O resultado foi um aumento de 23.000% nas vendas. Isso serve para empresários que vivem no século XX.

Calibragem de cor e monitor

Terça, jan 6th, 2009

Havia comentado sobre calibragem do monitor no post Série Photoshop | Acabamento, e então, pra cumprir com a promessa:

Quem é que não se viu frente ao problema: a imagem do monitor não tem nada a ver com a impressa.

Embora esse seja um grande problema para quem trabalha com impresso, para digitais (web) não é, e poucos profissionais o fazem para estar sempre mais próximo possível das cores exatas, que são definidas pelo ICC (International Color Consortium) quem criou o sistema de gerenciamento de cores que independente de qualquer marca ou fabricante. Mas, não se pode estar muito fora do padrão.

Pelo Mac é o ColorSync, e pelo Windows é o Adobe Gamma.

Qualquer tipo de impressora, scanner e monitor pode ser calibrado, sendo que a precisão das cores será definida pela qualidade dos periféricos. A maioria das impressoras de modelos mais utilizados em DTP permite a calibragem. Os modelos mais utilizados para prova, como Epson e HP, podem ser calibrados desde que utilizem um RIP PostScript. Impressoras que não possuam método de impressão CMYK são um pouco mais difíceis de controlar.

Caracterização do monitor

Monitores são caracterizados utilizando-se um colorímetro, aparelho capaz de medir as características colorimétricas do monitor e criar profiles de cor no sistema operacional, contendo informações sobre a capacidade de cor de cada monitor.

Calibragem da impressora

Impressoras são calibradas utilizando-se um espectrofotômetro. Imprimi-se um um arquivo Tiff com vários quadradinhos de cor, depois o impresso é lido pelo espectrofotômetro e então é gerado um profile de cor da impressora. As impressoras possuem um desvio de cor para ciano, magenta e amarelo (CMY).

Calibragem do scanner

Na calibragem de scanner tiliza-se um IT8, que é uma foto ou cromo, com uma série de quadrados de cor que é lidos pelo scanner. Depois o software de calibragem irá analisar a imagem e gerar o profile de scanner. Posteriormente, o profile será aplicado corrigindo a imagem. A aplicação do profile pode ser feita no Photoshop ou no próprio software do scanner.

Uma das maiores dificuldades na implantação de sistemas que utilizem gerenciamento de cor baseado em perfis ICC (principalmente para nós, simples mortais, que não possuímos nem um colorímetro) é a calibração simples dos monitores e programas.

Calibração simples

  1. Antes de iniciar a calibração, o monitor deve estar ligado por 30 minutos.
  2. No controle de configuração do monitor, acesse “COR” e diminua a temperatura para 5000K (ideal) ou 6500K. (Se o seu monitor não possuir esta opção, pule esta etapa).
  3. Vá em PAINEL DE CONTROLE e clique em ADOBE GAMMA (instalado a partir do Photoshop), STEP BY STEP (Wizard).
  4. Nesta etapa o Adobe Gamma irá pedir o profile ICC do seu monitor (exemplo: Sony_D50.ICC).
  5. Nesta outra etapa você vai ajustar o Brilho e Contraste. O Contraste deixe no máximo. Agora vá ajustando o Brilho até que o quadrado cinza dentro do quadrado Preto no Adobe Gamma fique quase preto (QUASE, não preto!).
  6. Agora especifique o PHOSPHORS do seu monitor: Sony usa Trinitron. Em outros modelos utilizo SMPTE-C.
  7. Habilite a opção VIEW SINGLE GAMMA ONLY. Olhando de um modo desfocado a uma distância de 50cm. mova o cursor abaixo da janela Gamma até que o quadrado central fique no mesmo tom da borda com risquinhos. Agora na opção GAMMA selecione a opção de acordo com o seu sistema operacional.
  8. Em HARDWARE WHITE POINT escolha a temperatura de 5000K. Se 5000K ficar muito amarelado, suba para 6500K.
  9. EM ADJUSTED WHITE POINT selecione a mesma temperatura da opção anterior.
  10. Agora o Adobe Gamma permite que você faça uma comparação com as configurações anteriores e a que você acabou de configurar.

Nesta última etapa, o Adobe Gamma pedirá para salvar o novo profile com as suas configurações. Dê um novo nome ou acrescente a palavra COPY no final do arquivo para diferenciar do arquivo original.

O Adobe Gamma salvou este profile ICC com as suas novas configurações na pasta Windows/System/Color do seu sistema operacional, e irá activá-lo toda vez que você inicia o computador.

Configurando menu Color Settings

A conversão para CMYK é definida pela configuração da opção Color Settings do menu EDIT no Photoshop.

RGB

Define o espaço de cor RGB. Exemplo: AdobeRGB. Existem vários outros padrões possíveis como sRGB, AppleRGB, ColorMatch etc. O importante é que todas as máquinas tenham a mesma configuração para garantir que as imagens RGB possuam o mesmo espaço de cor e as mesmas cores.

CMYK

Define o perfil de cor CMYK, responsável pela geração das quatro cores durante a conversão RGB/CMYK. O Photoshop possui alguns perfis CMYK pré estabelecidos, como: Euroscale, SWOP, Eurostandard, etc. É nesta opção que além de escolher o perfil você poderá determinar ganho de ponto, carga máxima de tinta, total de preto, em que tipo de papel (coated/uncoated/newsprint), GCR, etc. Uma boa gráfica poderá te orientar sobre estes parâmetros, e algumas até possuem o seu próprio perfil CMYK para ser fornecido a clientes. O Photoshop permite que você salve mais de um perfil CMYK com diferentes configurações


Gray

Define o ganho de ponto para imagens grayscale.

Spot

Define o ganho de ponto para imagens com cor spot.

Color Management Policies

Deixe as opções em Off para não alterar o perfil da imagem. A opção Ask When Opening deve ficar marcada, pois o Photoshop irá perguntar o que fazer cada vez que o perfil da imagem não for o mesmo definido no programa.

Engine

Especifique o sistema e o método de correspondência de cores utilizados para converter cores entre os espaços de cor. Apesar de existirem inúmeros fabricantes que disponibilizam seus algorítimos de conversão, podemos utilizar o da Adobe.

Intent

Define o tipo de conversão que será feita entre dois espaços de cor. Existem quatro tipos de conversões de espaço de cor: Perceptual, Saturation, Relative Colorimetric e Absolute Colorimetric. A opção mais utilizada é Relative Colorimetric.

Black Point Compensation

Controle o ajuste do ponto preto na conversão de espaços de cor. De acordo com a Adobe, esta opção deve ficar marcada.

Desaturate Monitor Colors by

Esta opção pode ser utilizada para reduzir a saturação do monitor e deve ser regulada baseada em testes visuais. Seria bom deixar desmarcada.

Blend RGB Colors Using Gamma

Deixe desmarcada.

Depois que estas configurações estiverem pronta, salve o perfil. Feche e abra novamente o Photoshop para que ele assuma o novo perfil com as suas configurações. Agora, basta converter as imagens em RGB para CMYK.

O que fazer quando o Photoshop apresenta a mensagem Profile Mismatch?

Muitas vezes a imagem que precisamos tratar já está em CMYK, pois já foi convertida diretamente no escaneamento ou foi gravada neste modo. Quando abrimos uma imagem CMYK no Photoshop, aparece uma mensagem indicando que o perfil original da imagem é diferente do que está definido no Color Settings do Photoshop. Em geral é melhor optar por descartar o perfil “embedded” na imagem para depois utilizar o comando Assign Profile para associar o perfil desejado à imagem. Assim, depois que a imagem for salva, o Photoshop não indicará mais a diferença entre os perfis já que o que foi definido no Color Settings será o mesmo da imagem.

Como associar um perfil à imagem?

Para concluir, o comando Assign Profile permite que possamos associar um perfil à imagem, indicando ao Photoshop e outros programas como devem exibir a imagem. Este comando não altera as cargas de cor da imagem e, além disso, podemos associar outros perfis que não sejam os que estão definidos no Color Settings. Isto permite que, mesmo que o Photoshop esteja configurado com um perfil de Off Set/papel revestido, possamos associar um perfil, por exemplo, de jornal. Desta forma simularemos outras mídias sem alterar as preferências dos programas. As configurações mostradas acima não são únicas e podem ser alteradas de acordo com as necessidades do usuário.

Comprimir Cascading Style Sheets

Sexta, nov 28th, 2008

Para comprimir o CSS, depois de claro, seguir boas práticas de escrita e organização, escolha uma das duas técnicas abaixo:

Comprimir Cascading Style Sheets

BIC lança novo site Expressões Digitais

Terça, nov 25th, 2008

A BIC lançou seu novo site Expressões Digitais, criado e desenvolvido pela Parangolés, agência digital da W/Brasil.

bic

bic

A idéia principal é convidar os jovens a expressar suas idéias. Eles podem pichar, desenhar, escrever e enviar fotos no muro virtual.

O usuário pode também enviar um e-mail personalizado, convidando os amigos a conhecer o site e visualizar sua expressão.

Idéia legal, mas particularmente não gosto de sites carregados de firulas em flash. Meu notebook ficou lento. Hotsites não têm a mesma preocupação de sites permanentes, em termos de acessibilidade e usabilidade.

Photoshop original

Quinta, nov 20th, 2008

Photoshop Original

Renderização do CSS no Google Chrome

Domingo, nov 9th, 2008

Aos designers de interface web que encontram problema de renderização do CSS no Google Chrome, evitem usar:

[CSS]

[/CSS]

Seguindo recomendação do própria equipe de desenvolvimento do Chrome, deve-se retirar o charset=”", e preferir usá-lo na primeira linha do arquivo .css. Ex:

[CSS]
@charset “utf-8″;
/* Comentários */
seletor { propriedade: valor; }
[/CSS]

Quebrei a cabeça por 10 minutos, pra descobrir isso. Tá aí a dica.