Novo Design do Site: Design para Desenvolvedores

Posted on May 29, 2011

Fazia tempo que eu estava me devendo um redesign do meu blog. O antigo layout foi montado sobre um tema de wordpress que peguei no AskGraphics, mas há tempos que ele já estava ultrapassado. Meu problema é que não sou um bom designer. Um bom desenvolvedor de software sempre é só metade da solução, a outra metade necessariamente é um bom web designer.

Felizmente hoje existem muitas opções para pessoas como eu. Minha nova recomendação é o Dream Template. Hoje mesmo fiz minha assinatura para o plano Lifetime Premium Membership, que custa USD 194. Parece caro? De jeito nenhum. Isso não paga nem o período da manhã de atenção de um grande designer. Com esse plano, posso escolher qualquer um dos mais de 6 mil templates e usar em quaisquer sites pessoais ou comerciais que quiser. Pechincha!

Além disso esse plano dá acesso a outros sites como CSS Hub, IconObjects. Não vai me faltar elementos gráficos! De curiosidade, o template que escolhi foi o redppage

Outro serviço que comecei a usar é o Typekit. Alguns elementos do meu site estão usando a fonte Droid Sans porque é o que o template que escolhi usa. Ele já veio com suporte a Cufón, uma biblioteca Javascript que substitui elementos de texto no seu site por equivalentes com a fonte que você quiser sem precisar usar Flash. Se entendi direito, você faz o upload de sua fonte TTF no site deles e será gerado um Javascript com a representação dos glyphs dessa fonte (transformação binária em texto). Então, dinamicamente, o Cufón fará a troca dos elementos no seu site.

Porém a versão do Droid Sans que veio embutido no template não tinha letras acentuadas. Já que ia ter que mexer nisso resolvi mudar para o Typekit. A idéia é a mesma só que diferente do Cufón ele é um serviço online com mais facilidades. Você começa criando uma conta (tem versão Free) e ele lhe dá uma URL especial de Javascript que você coloca no seu site. A partir daí, no site deles, é possível escolher uma fonte dentre dezenas, especificar quais seletores de CSS usar para as substituições e ele automaticamente fará o que precisa a partir do Javascript especial customizado para seu domínio. É o que estou usando agora.

Finalmente, semana passada literalmente tivemos um grande “hype” sobre o produto chamado Hype. Ele é um editor de animações, uma aplicação nativa para Mac, que emula uma interface semelhante a de um Adobe Flash simplificado, com metáforas conhecidas como Scenes, Timelines, Keyframes. Só que ele exporta em HTML, CSS e Javascript! Desta forma é possível criar animações complexas usando sua interface WYSIWYG para criar animações complexas, substituindo completamente o uso de Flash para coisas desse tipo. Apenas como brincadeira eu animei o banner que tem agora no meu blog usando Hype. Coisa de um minuto.

A maioria dos desenvolvedores de software back-end não gosta muito de lidar com interfaces. Eu sou um deles. Porém evangelizamos que não se pode simplesmente fechar os olhos a isso e se tornar um ignorante. Eu não sou bom designer mas lido tranquilamente com Photoshop, Flash, HTML, CSS, etc. E se você ainda sequer sabe o que é um Profile de cor de imagens, deveria comprar os livros da Smashing Magazine. Eu mesmo quero me atualizar e comprei o maior bundle de 8 eBooks.

Enfim, com sites como a Smashing Magazine e seus associados, ferramentas como Hype, nós não-designers também podemos criar sites que não ferem os olhos. O que quero dizer é que não tem desculpa para fazer site feio. Não importa se seu código por baixo é lindo, todo testado, modularizado. No final, se ele for feio, ninguém vai dar atenção. Essa é a lei número 1 do consumidor: se a embalagem for feita, eu não compro o produto, mesmo que o produto dentro da caixa feia seja a melhor coisa do mundo.