Quem nunca ficou preso em algum layout porque a inspiração não aparece ou não consegue achar alguma referência? Nem a playlist das músicas ajuda.

Não podemos descartar no processo criativo que antes de qualquer coisa, é primordial fazer um rascunho e colocar no papel tudo o que você lembra sobre o assunto. Nem sempre o prazo do job nos permite fazer isso com alguns detalhes para o projeto ser bem estruturado. Pra ajudar nessa fase, procuro em alguns sites, imagens para ilustrar a ideia e também tenho nos meus favoritos alguns sites que vejo quase diariamente. Sempre tem alguma técnica diferente ou alguma imagem que pode ajudar a surgir uma ideia.

Brasileiros:
Design On The Rocks
Idea Fixa – Além de inspiração tem comuidade e também projetos coletivos para designers.

Os gringos:
Vandalay – Site que reune coleções de o que há melhor por aí.
Abduzeedo – Fotografia, ilustrações, web design e outros assuntos
Fubiz – Em francês, com tradutor pra inglês – Posts sobre design de produto e arquitetura
Art-Spire – Reune também o que há de melhor por aí
Art Skills – Mostra inspirações mais lúdicas
Design n Flavr – as pessoas submetem suas criações para votação do público
The FWA – os melhores sites (geralmente em flash) encontrados pela web
Pattern Tap – Dica da Kika. Separou por categorias tudo o que precisamos para criar um site
CSS3 Gallery – Galeria de CSS 3

Tem muitos, mas muitos que poderiam entrar nessa lista, mas esses são os que eu recomendo.
Se souberem de algum outro bacana, é só postar aí no comentário ou então manda pra gente no twitter. :)

Você pode gostar também:

• Photoshop Online
• Multicolr Search Lab
• Gruda em Mim
• Design de apresentação

Você pode gostar também:

• Animação The Big Bang Theory
• Ilusão de ótica

Somando o aprendizado do Workshop e meu conhecimento no assunto como profissional da área, listo alguns itens básicos para vocês se guiarem. É lógico que o assunto é bem mais complexo e é preciso ter muita atenção para discutir. Mas algumas dicas técnicas são fundamentais para que seu e-mail caia direto na Caixa de Entrada do webmail. :D

1. Quando o e-mail é caracterizado como spam pelo cliente de e-mail?

Existe uma série de pontuações antispam estabelecidas pelos clientes de e-mails. Somadas elas não podem ultrapassar o valor de 5.0, ou então seu e-mail irá para o Lixo Eletrônico, Caixa de Spam, ou se for muito alta, nem chega ao destinatário.

2. O que não devo usar?

Cada regra tem uma pontuação, existem coisas que não devemos usar  num e-mail marketing para que não sejamos pontuados, e são elas:

• não use palavras como: clique aqui, promoção, cursos, empresa (existem muitas outras);
• textos com cor igual ao background ou tamanho de 0px;
• utilizar links para e-mails no corpo da mensagem;
• usar a expressão “não responda este e-mail”;
• formulários nunca chegam corretos para todos os destinatários.

3. O que devo evitar?

• o uso de CSS, muitos clientes de e-mails não reconhecem estilos;
• muitas imagens e texto para pouco html e vice-versa, o código precisa ser equilibrado;
• usar DIVs, de preferência para as tabelas.

4. O que seria legal eu fazer?

• no assunto do e-mail, utilize mensagens com menos de 30 caracteres;
• valide o seu html pelas normas da W3C, para ver se as tags estão corretas, todas fechadas e na semantica certa;
• sempre coloque a tag alt nas imagens, assim se o destinatário não carregar as imagens do e-mail, pelo menos ele verá do que se trata, melhor ainda no caso de botões;
• seu e-mail deve ter a opção opt-out, que nada mais é que um link (geralmente no rodapé) onde o usuário tem a opção de não receber mais o e-mail marketing;

Para saber mais sobre o assunto acesse a biblioteca da Virtual Target.

Não esqueçam do mais importante: o destinatário precisa entender a mensagem. Seja breve e objetivo, na internet é raro alguém ler.

Você pode gostar também:

• No Related Post

Esse site é bem interessante e o nome BrowserShots já diz tudo: ele tira um screenshot do seu site em um browser da sua escolha. Quer dizer, em vários browsers. É divertido usá-lo para matar a curiosidade.

De uma maneira simples, já na home você digita a url do site e abaixo é só selecionar as checkbox dos navagadores  (O legal é que tem para sistemas diferentes também, como Linux e MAC OS).

Após escolher, ele te redireciona para uma página que em alguns minutos (podem ser muitos se você exagerar na seleção de browsers) mostra os jpgs do seu site, podendo fazer o download deles também.

A dica foi da Talitha.

Você pode gostar também:

• Ícones Grátis
• Multiplas versões do Internet Explorer
• Photoshop Online
• Multicolr Search Lab

• Free Icons Web
• Icon Factory
• PixelGirl Presents
• Fast Icon
• Websiteicons
• FamFamFam
• WinCustomize

Você pode gostar também:

• Veja seu site em diferentes navegadores
• Multiplas versões do Internet Explorer
• Matheus Soares – Tutoriais.org
• Árvore de Natal Web 2.0

Existem sites bem legais por ai, que nós usamos e abusamos dos recursos disponíveis. Mas vocês já pararam para pensar: quem faz esse site?

Pois então, trago para vocês uma entrevista com o Matheus Soares que foi muito gentil em autorizar a sua publicação. Ele é o fundador do Tutoriais.org, excelente site com tutoriais, downloads e artigos para design.

Click abaixo para ler a entrevista completa.

Bio: Matheus Soares é da cidade de Lorena interior de São Paulo onde desde cedo se interessou por web e design. Formado em Engenharia Mecânia pela Universidade Federal de Itajubá, diz que o design surgiu em sua vida como hobby, utilizando de tutoriais disponíveis na internet para se aperfeiçoar.

1) Para iniciarmos, seria possível uma breve descrição de como começou a fazer tutorias de photoshop?
Há cerca de 7 anos, eu e mais 2 amigos iniciamos um portal para webmasters. Como eu gostava dessa parte de design, fiquei encarregado de fazer o layout do site e gerenciar o conteúdo de design. Com o tempo, notei que os tutoriais de
photoshop estavam dando grande parte dos acessos ao site, foi então que fui investindo na área me aperfeiçoando aos poucos.

2) Mudou alguma coisa de 7 anos pra cá, nessa linha de design dos sites?
Bastante. Com a presença da internet banda larga, ficou possível abusar mais de gráficos nos sites. Com isso, a aparência ficou muito mais agradável e arrojada.

3) O Tutoriais.org é um site que requer bastante trabalho, com atualizações frequêntes e um material muito bem elaborado. Por quê decidiu cria-lo?
Sempre gostei de mexer com photoshop e vi que há um grande público na internet em busca desse assunto. Então, em meados de Agosto de 2007 resolvi criar um site com tutoriais de photoshop, utilizando a plataforma do wordpress. O site cresceu rapidamente, e tive que me reestruturar. No início de 2008, troquei o domínio (para o atual tutoriais.org) e o host, para melhor atender as visitas.

4) Você acha que há bons sites brasileiros no seu ramo?
Com certeza! Um que admiro bastante é o abduzeedo. Porém, o site está em inglês, o que é uma pena para os internautas brasileiros.

5) E qual a diferença dos seus tutoriais que você acha que é um diferencial?
Faço os tutorias para todos os níveis de praticantes do photoshop. É claro que um iniciante não irá conseguir fazer um tutorial avançado, porém faço os tutoriais passo a passo, de forma clara e tentando mostrar tudo aquilo que foi feito para conseguir a arte final. Condeno tutoriais que simplesmente pulam etapas cruciais para obtenção de um certo efeito.

Conheça o Blog do Tutoriais.org

Você pode gostar também:

• Ícones Grátis
• Veja seu site em diferentes navegadores
• Taperás Empregos
• Multiplas versões do Internet Explorer

Como geralmente o Internet Explorer é o garoto problema dos desenvolvedores, temos que testar o site em suas diferentes versões. Mas só podemos ter uma versão oficial dele instalada no PC. Então como faz?

Apresento-lhes,

Multiple IE: ele te dá a opção de instalar desde a versão 4,01 até a versão 6. São janelas diferentes do navegador, como se você tivesse todas as versões instaladas, mais a oficial que você deve ter instalada no PC.

IETester: Em uma única janela ele abre em abas a partir da versão 5.5 do navegador. Lembrando que é preciso ter pelo menos o IE 7 instalado para que a versão beta do IE 8 também esteja disponível.

Só para lembrar, nada melhor do que testar na versão oficial do navegador, esses softwares são apenas para auxiliar no nosso trabalho diário, se você tiver a possibilidade de testar no próprio browser é melhor :) .

Você pode gostar também:

• Veja seu site em diferentes navegadores
• Ícones Grátis
• Internet Explorer Developer Toolbar
• Árvore de Natal Web 2.0

Como falei no post Extensões para Firefox, existe o Firebug, onde você pode editar direto do browser seu html, css etc. Comparar como fica melhor e só depois aplicar no código original. (Essa é a melhor extensão de todas!)

Pois bem, que agora temos algo parecido para o IE. (Vivaaaa \o/)

O Internet Explorer Developer Toolbar funciona quase que igual ao Firebug, só que um pouquinho menos fácil de lidar. Mas a idéia dele é a mesma.

Vale lembrar que ele funciona em apenas uma versão do IE, portanto pense bem em qual você quer instalar. Recomendo que seja no IE 6, nosso garoto problema hehe.

Você pode gostar também:

• Multiplas versões do Internet Explorer
• Extensões para o Firefox

Para quem não sabe do que estou falando, o Firefox nos permite instalar extensões que complementam suas funções. São várias, é só você acessar o site de complementos do Firefox, escolher qual é do seu interesse, clicar e ele é instalado automaticamente no seu browser.

Extensões para Trabalho:

• Firebug: o mais usado, entre várias funções, a principal é a possibilidade de editar html e css de sites direto no browser, ideal para testes e descobrir o porquê dos erros no código.
• Fire FTP: gerenciador FTP direto no browser do firefox.
• Web Developer Toolbar: barra com várias funções para desenvolvedores web.
• Screengrab: Screenshot dos sites, com a possibilidade de ser a tela inteira, inclusive o que não aparece no scroll.
• ColorZilla: possibilita você ver o RGB ou Hexa das cores de determinado site.
• Measure It: régua virtual para medir os pixels na tela.
• IE Tab:  faz uma tab do IE no próprio Firefox, assim você pode ver se o CSS ta quebrado ou não, na mesma janela sem mudar de browser.

Extensões de uso pessoal:

• TwitterFox: posts rápidos no twitter sem precisar logar pelo site. Essa extensão faz uma box aparecer com os últimos updates e também permite que você faça seus updates direto dela.
• DownThemAll!: gerenciador de downloads muito bom. Se um download para na metade você pode continuar a baixar de onde parou.
• Live PageRank: um medidor do PageRank de todos os sites que você visita.
• Cooliris: é um visualizador 3D de imagens muito loco! Em fullscreen você navega pelas imagens de sites como Google Images e Flickr. Pode não usar sempre, mas é uma experiência incrível na primeira vez de uso haha.

E você quer aumentar essa lista? Deixe aí seu comentário com as extensões que você acha mais interessantes.

Você pode gostar também:

• Internet Explorer Developer Toolbar
• Temas personalizados para celulares Sony Ericcsson
• Howpack – Download de facas
• Veja seu site em diferentes navegadores

Ok não é o Photoshop, mas quebra um galho e funciona muito bem. Recebi por email hoje essa dica, e que dica não? Imagina você na casa da sua avó, precisando urgentemente fazer alguma graça numa imagem e ela não tem Photoshop! Você fica na vontade?

Claro que não! É só usar o Editor de imagem Online  Sumo Paint e prontinho. Imagens editadas quase que igual ao Photoshop.

Gostaram da dica hein!?

Update: A Thalita indicou nos comentários mais um site bacana o Photoshop.com, demoradissimo para carregar, mas muito bom! Você pode até ter seu albúm de fotos #chic!

Você pode gostar também:

• Inspiração para criação de layout
• Photoshop Conference 2009
• Veja seu site em diferentes navegadores
• Photoshop Disasters