Esse blog deveria se centrar em apenas duas grandes categorias, tendo em vista o título criado em 2005( na época do primeiro Arte e Vício, um blog de contos).

Arte: todos os posts sobre criação, seja  ilustrações, esculturas, pinturas, desenhos ou até mesmo criação de sites, blogs etc. Vício: todos as curiosidades que o blog traz, daí uma abrangência maior como música, cinema, jogos, tecnologia, testes, etc. Isso daria um certo trabalho pois eu teria que editar cada post ou até mesmo deletar alguns que não se encaixam nas categorias principais. Decidi deixar como está, mas agora quem lê o blog sabe a intenção por trás do nome dele. Considerações à parte, vamos ao que interessa.

Hoje eu trouxe centenas de tutoriais e ferramentas. Juro que não li todos, mas fiz uma leitura dinâmica em muitos. Vários sites e blogs reuniram verdadeiras aulas de design, cada um com uma temática diferente. Eu organizei esses vários sites, separei por tema e assunto e fiz um pacotão. Se o seu inglês não anda lá essas coisas, é simples, joga no tradutor clicando aqui que já é uma boa ajuda.

Se você é designer, se precisa ter idéias ou uma inspiração para criar, se você é blogueiro e quer encontrar a melhor “cara” para o seu blog, se você precisa terminar um site urgente, calma! O AV tem a solução *música de suspense”: A solução para a sua falta de inspiração.

Lembre-se que o tutorial não está nesse post, apenas o link para que você acesse. Além dos tutoriais, pincéis, texturas, ferramentas online, muita coisa boa e útil!

Códigos e aplicações para web.

50 excellentes tutoriais em AJAX – Nessa lista dá para aprender a fazer sistema de login, calendários, menus, entre outras coisas.

13 menus em javascript com mesmo efeito que em flash – Todos os códigos usando os clássicos jQuery, Scriptaculous e Mootools. Além de ensinar a fazer menus incríveis, disponibiliza o download dos códigos.

CSS Menu Generator – Crie menus em CSS facilmente.

Listamatic – Coleção de menus em CSS.

List-O-Matic – Crie seus próprios menus em CSS.

List-U-Like – Outra ferramenta para criar suas próprias barras de navegação.

Tabs Generator – Crie imagem de abas para navegação.

Flash Buttons – Crie menus de navegação com botões em flash.

CSS Play – Mais uma coleção de menus em CSS.

Exploding Boy – Coleção de menus com abas em várias cores.

CSS Navigation Menu Generator - Uma ferramenta para ajuda você a criar seu próprio menu

Inspiração: webmasters

400 arquivos, tutoriais e inspirações para a design baseados na natureza.

60 templates e layouts grátis em alta qualidade - eu disse em alta qualidade!

50 incríveis menus de navegação – se você consegue aplicar exatamente aquilo que vê, então essa é uma boa fonte de inspiração para menus.

50 incríveis menus de navegação parte 2 – a continuação.

37 exemplos de design para o formulário nos comentários – eu sinceramente achei bem inovador, nunca tinha pensado que a página de comentários também precisa ser atrativa. O que custa deixar o formulário bonitinho, não acha?

35 websites com o mínimo de cores – existem temas que não precisam de absolutamente nada e mesmo assim continuam incríveis. O Arte e Vício nunca seria um deles.

30 headers bem criativos – o que vocês acham do meu, hein?

25 footers impressionantes – para quem não sabe, footer é a o final do blog.

15 design de menus bem originais.

13 características de um design excepcional para blogs.

12 blogs que podem expandir o seu repertório de web design

12 maneiras eficazes para um design de blog – O Guia do Iniciante.

Inspiração: trabalho de Designer

45 incríveis cartões de natal.

10 dicas para evitar o bloqueio de inspiração.

Design: Botões

Adam Kalsey’s Button Maker - Ferramenta simples para fazer seus próprios botões.

Button Maker from Blog Flux – Crie o seu próprio botão personalizado.

Brilliant Button Maker - Um criador de botão semelhante ao anterior.

Button Boost - Um pouco diferente de alguns dos outros geradores botão.

ButtonGenerator.com - Criar botões de navegação nos menus.

Crystal Button. Chicklet Creator - Criar botões que permitem que os visitantes subscrevam o seu leitor de feeds.

CSS Buttons - Escolha o texto, borda, o fundo e faça seu botão.

RSS Button Maker - O nome diz tudo, muito bonito.

My Cool Button – Uma bela ferramenta online que irá ajudá-lo a criar rapidamente o botão que você quer.

Design: Logos

50 exemplos de remodelação de logos.

Web 2.0 Logo Creator

Web 2.0 Logo Creator Web 2.0 Logo Creatr – o nome é Creatr mesmo.

Web 2.0 Stylr

Design: Ícones

Um site web 2.0 não pode ignorar ícones. Aqui estão algumas coleções dos ícones livres para utilizar em seus próprios projetos

23 conjunto de ícones natalinos.

31 fonte de ícones gratúitos e com qualidade.

Feed Icons.

Perishable Press - Uma bela coleção de Ícones RSS.

RSS ícones estilizados de vidro. Snap2Objects - Ícones RSS em vetor.

UtomBox – Uma bela coleção de Ícones RSS web 2.0.

Photoshop

50 texturas em alta resolução – alguns tutoriais a mais e outros recursos.

45 sites para baixar shapes para o photoshop.

42 pincéis grátis para photoshop em alta resolução.

40 tutoriais para criar wallpappers no photoshop.

35 tutoriais para photoshop inspirados na Apple.

35 tutoariais para criar layouts no photoshop.

28 poderosos efeitos de luz no photoshop.

Brusheezy – Pincéis grátis.

PSBrushes.net - Mais pincéis.

Ferramentas

7 ferramentas grátis para identificar fontes.

20 excelentes editores de texto grátis.

6 Add-ons do Firefox essenciais para designers – extenções e complementos para o navegador.

10 plugins essenciais para quem vai começar um blog wordpress (e o por quê).

BlogPoll – Crie enquetes para seu blog.

.htacces generator – Gere um arquivo .htacces facilmente.

PsycHo – Gerador de template para blogs.

RSSxl – Converta uma página HTML em RSS.

Templatr – Crie um layout.

VectorMagic – Conversor de imagem bitmap em vetor.

Web 2.0 Generator – Crie layouts.

Ferramentas: Criadores de Badges

Os badges são formas como essas:

adClustr - Starburst de badges.

BittBox – Badges em vetor.

Deziner Folio – Uma coleção de diferentes badges.

Fresh Badge - Gerar rapidamente o seu próprio badges.

Fresh Badge - Gerar rapidamente o seu próprio badges.

Glossy Photoshop Tutorial - Crie um badge com este tutorial brilhante.

Official Seal Generator -Uma alternativa para o badge típico.

Photoshop Tutorial – Uma rápida lição sobre como fazer o seu próprio badge.

Web 2.0 Badges – Um conjunto de badges livres para fazer o download e utilizar em seus próprios desenhos.

Avatares

Avatar Maker -Crie avatares.

Shrink Pictures – Crie uma avatar com sua foto

Cantos arredondados

Cantos arredondados são avanço na web 2.0. Eu não sei quem teve a idéia, mas hoje é essencial para um blog com visual bonito. O AV possui muitos cantinhos arredondados. Aqui estão alguns scripts e ferramentas que ajudarão você a criar rapidamente seus próprios cantos arredondados.

Canvas Corner

News List

RoundedCornr

Spiffy Box

Spanky Corners

Sliding Doors Text Box

Smart Rounded Corners

Rounded Corners in CSS

Gradientes

Outro elemento comum da web 2.0 é as imagens em gradiente. Aqui estão algumas ferramentas para ajudar você.

Gradient Image Maker

Gradient Generator

Online Gradient Image Maker (OGIM)

Speech Bubbles

Speech bubbles são aqueles balõezinhos da fala do personagem nos quadrinhos. Na web 2.0 são normalmente usados para definir observações ou citações. Muitos blogs usam nos blockquotes. Achei interessante, esses sites vão te ajudar a gerar essa caixa de diálogo.

Bubblesnaps

CSS Play

Fluid CSS Speech Bubbles

Gerador de Speech Bubble para o MySpace.

WigFlip

Will Mayo

XHTML Speech Bubbles

Backgrounds

All Free Backgrounds.

Background Image Maker - Crie imagens com opções como transparência e gradientes.

Stripe Generator 2.0.

Stripe Designer.

Tartan Maker.

Texture Generator.

Cores

Color Schemer Gallery - Com problemas em escolher um esquema de cores? Encontre o que deseja nesta galeria.

COLOURlovers – Mais combinações de cores.

I Like Your Colors - Saiba as cores usadas por um determinado site.

The Colors of Web 2.0 – Você está procurando inspiração para cores no seu blog?

Web 2.0 Color Pallete – As cores mais populares na web.

Website Color Picker – Teste rapidamente as combinações de cor.

I Like Your Colors - Saiba as cores usadas por um determinado site.

Favicons

Favicons são aqueles símbolos (mini-logo) na aba dos navegadores para cada site/blog.

Favicon Generator – Crie o seu próprio favicon a partir de uma imagem em seu computador.

Favicon from Pics – Crie um favicon com sua foto.

Favicon Editor – Upload a photo, create a favicon.

Favicon.cc – Another option for favicons.

Photoshop Tutorial – Criando favicon no photoshop.

Gráficos

Você me pergunta até um gerador de gráfico o filho da mãe trouxe? Sim. :shh:

amCharts – Gráficos em flash.

PHP/SWF Charts – Crie incríveis gráficos.

A galeria é maior do que você imaginava hein? Ok, não precisa agradecer. Mas se alguém quiser, claro… estamos aí.