O bom design: como fazer?

Posted novembro 24th, 2008 by Fabiano Pereira

Bom design significa design de qualidade, que comunica, agrega valor ao produto e cumpre com primazia o seu papel.
Porém, para se chegar a um resultado de alto nível, é necessário muito mais que o domínio técnico das ferramentas, recursos e linguagens. Enquanto o designer não se conscientizar disso, corre o risco de ficar à deriva num mar de tendências, recursos clichês e falta de profundidade.

Referências

O designer, além de dominar todo o processo inerente ao meio para o qual está criando, deve possuir diversas referências culturais, estéticas e artísticas.

Vejamos os exemplos dos grandes escritores. Além de serem dotados de grande talento, são verdadeiros “ratos de biblioteca”, lendo tudo o que lhes é oferecido compulsivamente, de clássicos da literatura às bulas de medicamentos.

Com isso, dominam cada vez mais a linguagem, aprimoram as possibilidades de expresssão e, finalmente, se carregam de referências literárias e textuais. As referências serão condensadas, “mixadas” pelo cérebro e oferecerão, ao escritor, possibilidades expandidas de expressão.Na verdade, só fala e escreve bem quem lê muito, só se fica atualizado acompanhando as notícias, so se é um bom músico dormindo e acordando com música, todos os dias. Em todos os meios citados, a “tara” ou “objeto de desejo” é a produção daquilo ao que cada um se propõe, de forma natural e não forçada.

Quais são as referências para o designer?

O design possui características interessantes, que tornam essa profissão tão fascinante e complicada, ao mesmo tempo, dando margem a diversos embates filosóficos-existenciais-profissionais, como em quase nenhuma outra ocupação conhecida.

Design não é arte, porém, com frequência, esbarra em conceitos e soluções advindas da produção artística. Assim, referências artísticas são uma constante no trabalho do designer, que deve se alimentar de exposições de pinturas-gravuras-xilogravuras-esculturas; enfim, de todo tipo de arte. Há, ainda, a possibilidade de mergulhar em livros e observar o quão magistral a expressão humana pode ser e a maneira como isso pode ser abordado em uma publicação.

O aprimoramento e o bom design saem de uma bagagem cultural ampla, completa. Não há outro meio. A vivência da profissão, a seriedade aplicada ao fazer técnico, o perfeccionismo, o prazer de se fazer o que gosta mesmo em cenários complicados e muito rotineiros de extrema pressão, de dead-lines criminosos. Tudo isso faz parte do grande e complexo todo da profissão.

Não há dependência direta da mídia para a qual se cria no sentido das boas referências, pois, como se sabe, design é, dentro de sua magistral amplitude, uma coisa só. É claro que nossos olhos são imediatamente atraídos para o lado cujo qual nos interessamos. O designer que faz web (também conhecido como webdesigner) fatalmente irá observar mais atentamente os trabalhos feitos para essa mídia, acompanhando os prêmios e os desdobramentos do mercado. Da mesma forma, que faz design off-line estará sempre de olho em material impresso, assim sucessivamente.

As boas referências estéticas e culturais são comuns para todos os desdobramentos da profissão, não acredito haver uma diferença clara e pronunciada. Creio que todo designer deveria ser um amante das artes visuais, um atento observador anônimo do mundo e de suas vertentes, observando todos os aspectos visuais em tudo o que o cerca: carros, ônibus, apartamentos, roupas, cartazes, fachadas, arquitetura, tv, internet… Um grande catalisador de tendências, idéias e conceitos.

Conclusão

O design de qualidade não está ligado diretamente à idéia de bons recursos tecnológicos. Apesar dos grandes talentos nacionais, existem diversos aspectos de diversas áreas que ainda não chegaram numa qualidade compatível com o design feito nos países de primeiro mundo. Se a questão fosse somente o equipamento, já estaria resolvida há tempos. Temos as mesmas máquinas, os mesmos softwares, acesso a boa informação técnica e bons livros (mesmo que importados); porém, muito de nossa produção está ainda engatinhando, o que mostra que a questão é totalmente cultural. Para se fazer o bom design, é necessário ter uma boa cultura.

Portanto, o mundo a sua volta é a sua principal fonte de inspiração e matéria-prima. Não deixe de apreciar, obviamente, todas as formas de arte, além das visuais. Ouça uma música que lhe toque, ligue sua parabólica e prepare-se para absorver toda e qualquer referência e pode acreditar: na hora em que for necessário, seu cérebro saberá justamente onde buscar a informação e solução para determinada peça e você, só depois de algum tempo, vai entender o processo louco e fascinante da criação e seu referencial estético.

Intercon 2008: Cris Dias e Marco Gomes

Posted novembro 20th, 2008 by Fabiano Pereira

Neste momento começou o FF 08, com seu modelo revolucionário de palestras simultâneas ocorrendo de forma conjunta no mesmo palco, separadas por canais de aúdio via headphones. O aparato tecnológico oferecia ao público o poder de zappear entre as palestras, algo que fiz diversas vezes durante o evento. As palestras foram de Gil Giardelli e Cris Dias.

Apesar de zappear de vez em quando, acabei me prendendo mais à palestra de Cris Dias ( vilago e enxame.tv).

Cris falou da moeda de troca social chamada whuffie, que, quando conquistada de maneira efetiva, colabora para a monetização de sites e redes sociais. Curioso é notar como a web, em sua atual vertente, favorece incrivelmente as “pessoas” mais populares, quem conhece o padrão do Page Rank sabe bem do que estou falando.

Apesar de concordar com tal modelo, fico me perguntando se não existem toneladas de bom material espalhados pela web, que não são conhecidos por não serem populares. O conceito do gênio incompreendido e recluso, nos dias atuais, não existe mais.

Veja os slides de Cris Dias aqui.

Atualizando, confira o vídeo da palestra aqui (obrigado pelo toque, Cris Dias!).

Intercon 2008: Inovação no Comércio Eletrônico

Posted novembro 18th, 2008 by Fabiano Pereira

O comércio eletrônico, dentro de suas diferentes vertentes, foi, por um certo ponto de vista, o motor que impulsionou (e ainda impulsiona) a grande expansão do mercado web, justificando, em grande parte, o aumento na procura de profissionais preparados para este emergente mercado.

É provável que o Mercado Livre, aqui no Brasil, seja um ícone da cultura do comércio eletrônico, sendo por suas agressivas estratégias de expansão ou pelo grande volume de negócios que impulsiona, oferecendo ao pequeno negociador (aquele, que “antigamente” anunciava gratuitamente no Jornal Primeira Mão) um conjunto de ferramentas de negócios que o coloca em paridade com os grandes sites de comércio eletrônico.

Stelleo Tolda, presidente do Mercado Livre, possui, sem dúvidas, excelentes credenciais para tratar sobre o tema Inovação do Comércio Digital. A organização do Intercon 2008 escolheu a pessoa certa para tal empreitada.

Comércio Eletrônico no Brasil

A evolução na maneira de fazer e conduzir as transações financeiras, segundo Stelleo, é proporcional ao aumento da confiabilidade do consumidor com o meio web, trazendo benefícios reais, na medida em que oferece mais tranquilidade aos usuários.

A necessidade do profundo entendimento do cliente típico do comércio eletrônico foi apresentada como condição vital para o amadurecimento do mercado e aumento da confiabilidade de quem compra. Pontos como o poder de expressão do usuário, o marketing negativo que pode ser gerado pelo boca-a-boca do cliente insatisfeito e a constante necessidade de mudanças de conceitos foram devidamente debatidos e apresentados com propriedade.

O recado, em síntese, foi para que o comércio eletrônico siga no processo evolutivo de aumento de confiança, tratando o cliente da melhos maneira possível, com soluções personalizadas e com um pós-venda cada dia mais eficiente.

Intercon 2008 - Primeiras Impressões

Posted outubro 30th, 2008 by Fabiano Pereira

Já foram escritos artigos sobre o Intercon 2008 de várias formas: representando o ponto de vista do palestrante (como este , este e este também), do apresentador (como este, do Fabio Seixas) e do mentor do evento (como este, este e mais este, no blog de Luli Radfahrer). Porém, agora, você irá ler um artigo escrito por um simples mortal da platéia (apesar deste “simples mortal” ser colunista do iMasters, lá estava na condição confortável de mero espectador), com certeza uma condição compartilhada por cerca de 800 pessoas que lotaram o auditório no dia do evento.

Modelo Único no Mundo

O intercon 2008 foi um divisor de águas no formato de eventos tecnológicos do Brasil (e no mundo). Com um auditório cheio, ansioso com o novo formato, desfilaram diversas palestras simultâneas, podendo, o espectador, ouvir/assistir a que mais lhe interesasse. Zapping em palestras!

A programação estava bem recheada, com foco principal na inovação. O famigerado vídeo da briga de “tias-velhas” da publicidade nacional foi exibido logo no início, recebendo as (merecidas) críticas da ala inovadora e empreendedora da web.


Untitled from fabio x nizan on Vimeo

Na minha (modesta) opinião, as “tias” estão agoniadas com a mudança radical de conceitos e de “modus-operandi” da publicidade face aos novos (e melhores) recursos do meio online. Dizer “não inove” para nós é algo bizarro e descabido, visto que em qualquer curso ou treinamento simples de empreendedorismo a regra é “aproveite os momentos de crise e veja neles possibilidades de crescimento”. Acho que alguém não fez a lição de casa, como deveria.

Tudo ao mesmo tempo agora

A primeira palestra não foi dividida, tendo Stelleo Tolda, Presidente do Mercado Livre, todas as atenções voltadas para ele. Após uma série de pequenos ajustes nos canais de áudio (cada participante recebeu headsets com três canais de rádio cada, o canal 1 apresentava o áudio do lado esquerdo do palco, o 2 do lado direito e o 3 (pouco utilizado) mostrava o áudio das oficinas de photoshop e programação que ocorriam externamente, no saguão do evento) e assim que toda a multidão de cerca de 800(!) pessoas se acomodou, Stelleo tomou a palavra e deu uma verdadeira aula de negócios e comércio eletrônico na web.

Série de Artigos

Conforme fiz no ano passado, vou escrever uma série de posts sobre cada uma das palestras que ouvi/assisti, assim com das que irei ver em vídeo (já que o material completo de todas as palestras será disponibilizado no T!V! e no Videolog, segundo informações da organização do evento). Assim, você que não foi ou que quer saber e conhecer opiniões diferentes das suas, pode assinar meu RSS e acompanhar, um por um, todos os posts sobre esse fantástico evento, verdadeiramente inovador se comparado com os outros eventos tecnológicos do Brasil.

O próximo post irá abordar, em detalhes, a palestra Inovação no Comércio Digital, de Stelleo Tolda, Presidente do Mercado Livre.

Até lá!

Como fazer um site web?

Posted outubro 24th, 2008 by Fabiano Pereira

Este artigo mostra uma das várias maneiras de se dividir o processo produtivo de um site web. Aqui, num primeiro momento, você conhecerá as quatro etapas básicas para depois conhecer, um pouco mais a fundo, o planejamento.

As Etapas

Podemos dividir a produção de um site web em quatro etapas principais, explicadas, abaixo, resumidamente:

a)Planejamento:

Processo que engloba todo levantamento das necessidades do cliente, pesquisas de mercado, linguagens e estratégias de comunicação, objetivos mercadológicos, entre outros.

b)Criação:

Transformação das informações e definições da etapa de planejamento em idéias visuais claras e objetivas. Definição de estruturas de navegação, de condução do usuário da página

c)Estruturação:

Uso das linguagens XHTML/CSS para efetuar a codificação do lay-out do site desenvolvido pela equipe de criação na etapa anterior. Testes de navegabilidade e de UP LOAD do site.

d)Desenvolvimento:

Aplicação das linguagens de servidor para integração do site com um banco de dados para tornar partes do site dinâmicas, com conteúdo atualizado constantemente, muitas vezes permitindo uma grande participação do usuário na página, alterando características diversas.

O Planejamento

Etapa que pode ser dividida da seguinte forma:

Tema

Sobre o que será o site? Descrever de forma sucinta e objetiva o tema geral do site

Briefing

Levantar, junto ao cliente, informações precisas sobre o que se espera do site. Esta reunião deve ser um bate papo, evitando estruturas formais de perguntas e respostas, pois, assim, consegue-se muito mais do cliente do que se espera. Apesar disso, deve-se levantar, minimamente, as seguintes informações:

a)Público-Alvo: a quem se destina o site? Qual a classe social, a faixa etária e o perfil geral das pessoas?

b)Definir o retorno esperado para o site: um site, como uma peça de comunicação, é uma ferramenta de marketing como qualquer outra, precisa de objetivos claros e bem definidos. O retorno deve ser encarado como uma meta a ser cumprida.

Linguagens

As linguagens de comunicação, quando bem definidas, resultam num bom retorno para o cliente definido como público-alvo. Apesar de haver uma grande quantidade de linguagens que podem ser utilizadas, podemos definir as principais da seguinte forma:

a)Moderna (jovem): possibilita o uso de cores fortes, experimentalismos gráficos diferenciados, linguagem mais cool, solta, livre, informal. O site da MTV é um bom exemplo deste tipo de linguagem visual.

b)Conservadora (madura): não deve causar impacto por recursos visuais ou informalidade na linguagem. Estruturas mais rígidas de navegação, de controle. Recomendado para sites de investimentos, negócios, bancos, de uma maneira geral. O site do Citibank é um bom exemplo.

c)Clean (suave): diz respeito mais ao aspecto visual do que a uma linguagem propriamente dita. As cores são suaves, fluidas. As imagens comunicam tranqüilidade, suavidade, beleza. Tudo é limpo, os espaços não são totalmente preenchidos, permitindo que a página “respire”. Sites de beleza e estética seguem este padrão.

d)Over (forte): também diz respeito aos aspectos visuais. Aqui, ocorre o inverso do “clean”. As cores são fortes, agressivas, pulsantes. Imagens em ângulos e enquadramentos inusitados, uso livre de grafismos fortes, experimentais. Os sentidos são agressivamente tocados, não há espaços para se “respirar”, tudo é muito intenso. Sites de skateshops seguem este padrão.

Tecnologias e ferramentas utilizadas

Com base nas informações levantadas até o momento, pode-se definir as ferramentas e tecnologias que serão utilizadas, até mesmo para se ter uma melhor idéia “orçamentária” do projeto. Abaixo, as principais necessidades de um web site e exemplos de tecnologias e ferramentas para executá-las:

a) Ilustrações, logotipos, símbolos vetoriais:

Corel Illustrator

Inkscape

b) Criação de lay-outs:

Photoshop Fireworks

c) Tratamento de Imagens:

Photoshop Gimp

d) Otimização de Imagens:

FireworksGimp

e) Edição Visual do código:

Dreamweaver Amaya

f) Linguagens de estruturação:

XHTML (estrutura) CSS (formatação visual)

g) Animações vetoriais:

FlashKtoon

h) Linguagens de Scripts:

Javascript Action Script(no flash)

i) Desenvolvimento:

PHP (Linguagem de Servidor Open Source) ASP (Linguagem de Servidor Paga)

Observação: existem diversas outras ferramentas e linguagens no mercado que também efetuam tais trabalhos.

Pesquisas

Etapa destinada a levantar todos os dados necessários afim de fazer um site adequado ao perfil do cliente:

a)Pesquisar concorrência: quem é a concorrência? Qual o seu perfil? Que sites possuem? Que estratégias trabalham em seu sites? Que colocação possuem no mercado? Quais os pontos fortes? E os fracos? Oferecer, por meio de pesquisa, a informação do que ainda não se fez, ter a real noção do mercado em que se está entrando, conhecer a fundo todas as características.

b)Pesquisar o público-alvo: levantar, efetivamente, todos os dados sobre o público-alvo que interessam dentro do contexto do site.

c)Pesquisar estratégias: levantar dados sobre as estratégias que serão abordadas, analisar se já foi utilizada em outro momento (analisar e pesquisar CASES alheios), não “reinventar a roda”, o que já foi feito no passado e deu certo, torna-se modelo a ser seguido, o que deu errado, modelo do que deve ser evitado.

Planejamento Estrutural do site

Com todo o extenuante trabalho acima concluído, pode-se começar a estruturar o site de forma básica, não-visual. As definições abaixo, para a surpresa de muitos estudantes de web design, são atribuições do marketing, de maneira geral:

a)Quantas páginas, links ou seções o site terá?

Isto dependerá do perfil do site, dos assuntos abordados. Um site com poucos links não é necessariamente um site de pouco conteúdo, da mesma forma, um site repleto de links e seções não é, exatamente, um manancial de boas informações sobre aquele tema determinado. Prudência, canja de galinha e bom senso não fazem mal a ninguém.

b)Mapa do site

Estrutura básica da divisão de todos os links, com todas as páginas relacionadas como subdivisões dentro de um contexto maior. Muito mais do que “quadradinhos” com nomes de páginas escritos dentro, um mapa de site permite uma visualização global e visual do que se pretende, tornando fácil e visual os processos de alterações, aprovações e definições genéricas.

c)Arquitetura da Informação:

Este tema daria um novo artigo por si só, de tão amplo e complexo. Definindo sucintamente, a arquitetura da informação passa pelo processo de separação do conteúdo, da condução do cliente pelo site, dos túneis de navegação, estruturas lineares e não-lineares de navegação, visando a criação de um web site intuitivo, que ajude o visitante a encontrar tudo o que deseja da forma mais direta e racional possível. O profissional envolvido com este tópico dedica-se a utilizar o principal conteúdo da web de forma a extrair todo o seu potencial: o hipertexto.

e)Textos principais:

Já ouviu falar em web writing? É, basicamente, o ofício de escrever para web, respeitando suas características (textos curtos, rápidos, sintéticos, utilização do LEAD Definir e escrever todos os textos num bom editor, corrigir possíveis erros (utilizar manuais de estilo e redação )antes de aplica-los nas páginas. Evitar escrever textos diretamente no editor de códigos, separar esta etapa da produção.

f)Cores:

A definição de cores de um site pode vir de vários aspectos, que vão desde as tonalidades padronizadas de uma empresa até o sentido conceitual que cada cor carrega por si própria. Existem teorias das cores genericamente aceitas, porém este é um conceito que muda de povo para povo, até mesmo de público-alvo para público-alvo. Conheça um ótimo artigo de Wellington Carrion, sobre teoria das cores . É possível chegar-se a conjuntos de cores por meio de extenuantes pesquisas de mercado, avaliar como cada cor será aceita ou quais sentimentos provocarão em determinado perfil de público.

g)Linguagens:

Como falar com determinada faixa de público? Que termos devem ser empregados e evitados? O marketing, mais uma vez, deve definir o tipo de linguagem a ser utilizada e a maneira de se abordar o visitante durante a visita à página. O público jovem, por exemplo, pode tolerar gírias, neologismos, termos da moda e tudo mais. Porém, para uma faixa de público conservadora, a linguagem deve ser polida, cuidadosa, sem excessos. De qualquer maneira, os textos devem seguir a regra da simplicidade, da facilidade de entendimento.

h)Tipos de imagens:

Definição de que tipos de imagens serão utilizados, de acordo com a linguagem utilizada. As imagens podem possuir enquadramentos ousados, pouco usuais; bem como podem utilizar ângulos tradicionais, comportados, “corretos”. Esta é uma definição importantíssima para a equipe de criação, já que no design a utilização de imagens é essencial.

i)”Pré-Site” em Programas de apresentação:

Quando necessário, pode-se montar a estrutura básica de navegação, de páginas, de links, utilizando-se uma ferramenta típica de escritórios como o Power Point ou qualquer outra ferramenta voltada para a criação de aplicações em suítes de escritório, ferramentas normalmente de simples utilização, conhecidas por profissionais de todas as áreas. Esta apresentação será um guia na elaboração do processo criativo, tomando importantes decisões sobre a estrutura do site.

Conclusões e Considerações Finais

Este é um tema extenso, que pode ser trabalhado e encarado de maneiras diferentes e distintas pelas empresas e agências de web ao redor do mundo. Porém, trata-se de algo funcional, testado e utilizado em diversas empresas, com resultados positivos.

Não há, de maneira alguma, a intenção de propor a estrutura de planejamento definitiva, acima do bem e do mal, muito pelo contrário. Regras e bolachas nasceram para serem quebradas; sendo assim; a mudança é bem vinda e sempre necessária. O “fazer web” e algo muito novo, muito recente: estamos todos “apanhando”, aprendendo e descobrindo as melhores formas de trabalho.O intuito é o de auxiliar o estudante e o profissional de web iniciante de uma maneira geral, dando a oportunidade de ter algo a seguir como uma bússola de orientação para todos os que precisarem, de alguma forma.

Comentem, mandem suas opiniões e críticas para mim . Terei o maior prazer em responder!