O original:

O que dá pra visualizar:

Cada uma, hein?

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Re-design do logo da NASA
• Quando usar logo, logotipo ou logomarca?
• Mais um entre os demais
• Nove sugestões para criar logos apresentáveis
• O melhor tutorial de como se fazer um logo

Qual animal você acha que o Design Blog seria? Deixe um comentário abaixo explicando por que!

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Logo infeliz
• Como lidar com projetos web? Parte 2
• Como lidar com projetos web? Parte 1
• Você poderia ser um web designer?
• Tipografia na web – parte 1

Durante o dia 31 de agosto (31.08 – que se assemelha a palavra “blog”), bloggers de todo o mundo fazem um post recomendando a visita a novos blogs, de preferência, blogs de cultura, pontos de vista ou atitude diferentes do seu próprio blog. Nesse dia, os leitores de blogs poderão navegar e descobrir blogs desconhecidos, celebrando a descoberta de novas pessoas e novos bloggers.

Minha lista de 3 blogs que recomendo a leitura são:

Choco la Design

Criado pelo Filipe, o Choco la Design é um blog muito bacana com artigos inéditos, criativos e interessantes escritos por uma equipe bem variada. Além disto, o design do blog é bem gostoso e bem bolado.

Caligraffiti

Mais um blog com uma equipe grande, com vários artigos interessantes (embora menores). Com muitos vídeos, o Caligraffiti não trata apenas de design, mas como outras vertentes das artes gráficas.

Dicas de Fotografia

Sei que sou suspeito a falar do Dicas de Fotografia (afinal de contas, sou casado com a blogueira que mantém o blog). No entanto, ela sobre assuntos de fotografia em uma linguagem que qualquer leigo em fotografia (como eu) entende facilmente. E não é só assunto noob: você encontra muito conteúdo avançado, mas sempre com uma linguagem leve e altamente explicativo. Quer comprar um livro sobre fotografia para iniciantes? Não faça. Ela até oferece download gratuíto de uma apostila para beginners.

Taí três blogs cuja leitura eu recomendo. Quais blogs você recomenda?

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Novidades no Design Blog
• Sobre a falta de atualizações
• Boas festas!
• Kmisetas.com.br – minha péssima experiência com o serviço deles
• Novo Design.Blog!

Briefing e contrato em mãos!

Com o briefing em mãos, está na hora de criar o mapa do site e fazer um brainstorming. É importante manter seu cliente a par do que você está fazendo para que ele saiba o que está sendo feito. Se você desaparecer durante as primeiras semanas, seu cliente vai começar a enviar e-mails ou ligar para o seu telefone para saber como que as coisas estão indo. Caso você atualize-o constantemente, ele se sentirá mais seguro em relação ao seu trabalho.

Cobrando o cliente nas datas certas

É importante que você lembre as datas de cobrança. Para isto, utilize lembretes como os disponíveis no iCal (para Mac) ou até mesmo configure o Google Calendar para lhe enviar um lembrete três dias antes do vencimento de cada parcela. Dois dias antes, envie o e-mail de cobrança ao seu cliente para que ele lembre de pagar no dia.

Peça para que confirme o pagamento, assim você pode deixar anotado em seu calendário que ele efetuou o pagamento. Aproveite e agradeça toda vez que ele pagar ;)

A metade do projeto

Chega um ponto do projeto onde você já tem tudo quase pronto: o design foi aprovado e codificado em CSS/HTML e agora basta acertar os detalhes finais. Essa é uma das partes mais demoradas.

Os detalhes são os mais demorados

É importante fazer o seu cliente parte deste processo final para que ele possa verificar se está tudo como planejado.

Comece a fase do beta-testing, onde você analisa se o site funciona em todos os navegadores mais atuais, assim como sistemas operacionais diferentes. O Adobe Browser Lab é uma ótima ferramenta que permite que você teste em navegadores e SOs diferentes sem ter que instalar nada.

Lance o “Release Candidate”

Assim que o site estiver pronto e você acha que já dá pra deixá-lo visível ao público, vá fazendo testes variados com seu cliente. Acesse todas as páginas, reveja todo o conteúdo. Peça para que seu cliente tire um tempo para navegar pelo site todo quando ele tiver um tempo livre – evite de fazer isto durante uma reunião com ele, para que ele possa focar melhor.

Revendo o site durante seu tempo livre, o cliente pode se focar inteiramente no site e verificar tudo com calma. Assim não ocorre do cliente olhar tudo rapidamente e aprovar, pedindo para fazer alterações mais tarde, quando o contrato já expirou.

Colocando no ar e última cobrança

Pronto! Basta publicar o site a todos e fazer a cobrança final (se houver). Mas não pense que acabou! Se você quiser ter um serviço diferente, ainda existem mais coisas que podem serem feitas.

Manutenção e serviços adicionais

Ofereça serviços de manutenção ao seu cliente. Estes serviços podem variar de atualizar o código do site quando necessário até atualizar fotos dos produtos. Você pode oferecer um valor mensal fixo ou um preço especial por atualização. No entanto, lembre ao cliente que após o site ser publicado, alterações maiores no design e no conteúdo devem ser orçados a parte como um novo projeto.

Serviços adicionais podem incluir um acompanhamento de visitas e SEO (seu site já deve ter SEO, mas lembre-se que estas otimizações devem ter um acompanhamento constante para melhores resultados).

Agora sim, acabou. Seu projeto web foi entregue, o cliente adorou seu trabalho e você está feliz. Parabéns!

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Como lidar com projetos web? Parte 1
• Como estragar seu site – parte 2
• Como estragar seu site – parte 1
• Regras implícitas no web design
• 13 dicas para newsletters em HTML

O contrato: definindo tudo antes do início

Contrato: peça fundamental

O contrato é de extrema importância e muitas vezes é ignorado pelos web designers (e até mesmo os outros designers das outras áreas). Ele serve para proteger o seu interesse como profissional e os interesses do seu cliente. Eis algumas coisas que devem ser explícitas no contrato:

Descrição do projeto, revisões e layout

O que seu cliente está contratando? Explique todo o processo, desde o briefing até a geração de alternativas e finalmente o formato de entrega do projeto. É muito importante que você deixe claro em relação as revisões. Quantas revisões que seu cliente terá direito de fazer pelo preço acertado?

No xCakeBlogs, oferecemos até duas revisões pelo preço acertado. Por que? Pois alguns clientes abusam e não aprovam a primeira versão do layout, não aprovam a segunda e ainda pedem mais alternativas. É por isto que, se não for aprovado da primeira vez, revemos o briefing com o cliente para ver o que nós entendemos errado. Pedimos que o cliente faça uma crítica construtiva e compare com o briefing que ele enviou. É importante para sabermos o que foi feito de errado por nossa parte (ou se o cliente estava indeciso na hora que escreveu o briefing). Caso passe das duas revisões sem sucesso, informamos que novo pagamento e novo briefing deverão serem feitos. Isto fica explícito no contrato.

Pagamentos

No contrato deve estar escrito se a forma de pagamento é à vista ou parcelado (que é combinado previamente). Independente de qual for, deixe claro quando cada pagamento é feito. Se for a vista, peça para que seja pago no início do projeto para evitar que o cliente desista no final e não te entregue nada, e se você quiser ofereça algum tipo de remuneração em caso de desistência (por exemplo, 50% do valor pago ou a porcentagem de acordo com quanto do projeto já foi feito). Se o pagamento escolhido foi parcelado, informe as datas de pagamento de cada parcela e o valor delas.

É importante que você sempre peça um valor adiantado, independente de quem for o cliente. Até mesmo parentes podem tentar te passar a perna!

Direitos autorais e copyright

Quem terá o direito autoral sobre o que foi criado? E quem terá a responsabilidade sobre o uso de fontes, fotos, arquivos vetoriais, etc? É ideal que, caso o cliente fornecer as fotos e fontes para serem usadas no layout, você deixe claro que o direito autoral é de responsabilidade dele. Já vi acontecer designers serem ameaçados de processo por terceiros pois seu cliente usou uma imagem deles como fundo para o site sem o consentimento do autor.

Prazos

Defina os prazos para cada etapa e data para entrega final. Lembre-se de dar uma margem de segurança, pois raramente o projeto é entregue exatamente na data prevista. Algumas vezes o cliente demora para preencher o briefing ou para aprovar uma das revisões, atrasando todo o processo. Deixe claro que, se o cliente não obedecer o cronograma (você deve definir a data limite para ele enviar o briefing, enviar o material para ser usado, aprovar as revisões, etc), você não deverá ser culpado pelo atraso na entrega.

Aprovação final

Consiga uma assinatura ou assinatura digital na versão final antes de ir ao vivo. Isto vai te salvar muita dor de cabeça se algo estiver escrito errado ou existe algum problema no código. Além do mais, isto dá ao seu cliente a confiança que ele precisa. Caso algo estiver errado após a aprovação final, você poderá cobrar adicional.

Cancelamento de projeto

Outra forma de se assegurar caso o projeto seja cancelado. Afinal de contas, você não pode ser lesado pelo tempo gasto com algo que foi cancelado antes de você receber uma compensação decente.

Os contratos não precisam ser sempre assinados e enviados via correios. Hoje em dia, a justiça já permite o uso e-mails como documento legal, então se seu cliente aprovar o contrato via e-mail já é válido (só não vale mensagens instantâneas como MSN ou “aceitação verbal”).

Existem muitos modelos de contratos disponíveis na web, basta dar uma procurada.

O briefing

Muitos designers pulam a parte do briefing por ser algo que as vezes o cliente demora a respoder, então eles fazem tudo às cegas. E isto só pode resultar em desastre.

Nem sempre é fácil entrar na cabeça do cliente, e isto será o seu salva-vidas. Pode até ser um briefing pequeno, mas com as perguntas certas você vai poupar muito tempo ao seu cliente e a você mesmo. O bom que briefings curtos podem até ser feitos via telefone (lembre-se de anotar tudo que ele falar!). Eis algumas coisas que você pode incluir em seu briefing, mas lembre de adaptá-lo aos projetos específicos que você faz.

Especificações técnicas

Dimensões, alinhamento e tipo de largura. Geralmente o cliente não vai ter idéia do que ele quer nesta parte, então nós no xCakeBlogs não colocamos este tipo de pergunta no briefing. Caso o cliente queira especificar que ele quer um layout com largura fluída, por exemplo, ele irá especificar isto de qualquer forma.

Pergunte também sobre domínio e hospedagem (seu cliente já possui? Caso não tenha, ele aceita sugestões?). Você irá fazer o upload da versão final do site, ou isto fica a encargo do cliente?

Conteúdo

Um mapa do site é bom. Peça que seu cliente defina quais páginas que serão criadas e o que ele terá de conteúdo. Se você ver que a estrutura não é das melhores, ofereça alternativas antes de começar o projeto.

Peça para que ele informe todo o conteúdo neste momento. Textos, logo, fotos, etc. Caso não esteja no contrato, informe-o que o texto precisa estar revisto e corrigido, e que as imagens já devem vir tratadas – tudo em formato digital! Já tive clientes me enviando texto escrito a mão (caneta e papel!) e fotos impressas. Quando falei que teria que cobrar para digitalizar tudo, o cliente ficou pasmo – afinal de contas, ele tinha escrito todo o texto no computador e, como não tinha impressora, passou tudo para o papel. As fotos? Ele também tinha em formato digital mas mandou revelar só para me entregar. Acho que ele nunca ouviu falar de “e-mail”.

Outra coisa que você pode pedir é todo o material de marketing prévio da empresa para você ter uma idéia de como eles administravam a comunicação empresarial no passado.

Dados de marketing

Público-alvo, percepção atual da empresa e percepção desejável, estilo, cores e formalidade do design. Além disto, a diferença entre eles e as empresas concorrentes.

Esta parte da diferença entre eles e as empresas concorrentes nem sempre pode ser algo claro. Muitas vezes o cliente procura defender sua empresa como se você fosse um comprador em potencial. É necessário lembrar ele que você precisa das informações reais. Se o preço do produto do seu cliente é maior do que do concorrente, por que é assim? Informe seu cliente que ele não precisa defender as diferenças, pois isto não vai lhe ajudar muito. A questão do preço por exemplo, pode ser por que a qualidade é maior (neste caso, você pode deixar o site com cara mais de “exclusivo”).

Peça por referências também. De preferência, referências do gosto do cliente. Em seguida, você vai analisar se as preferências pessoais do seu cliente são similares às preferências do público-alvo dele. Se notar uma diferença muito grande, informe isto. É importante ele saber que o site não é para agradar ao gosto pessoal do dono, mas sim ao gosto do público-alvo.

Amanhã continua o artigo. Fique ligado! Assine o feed RSS para não perder!

Inspiração: Onextrapixel

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Como lidar com projetos web? Parte 2
• Como estragar seu site – parte 2
• Como estragar seu site – parte 1
• Regras implícitas no web design
• 13 dicas para newsletters em HTML

Use estilos CSS inline

Pode esquecer usar páginas CSS externas ao enviar e-mails personalizados. A melhor solução é declarar o CSS dentro dos seus tags HTML. Como por exemplo: <p style=”color:#000;”>. Se você declarar a folha de estilos no cabeçalho, aplicativos online (como o Gmail) não vão conseguir fazer aquilo que você pediu.

Limite a largura do seu template

Quando estiver criando um template para suas campanhas via e-mail, não esqueça que muitos lêem suas mensagens em apps online (Gmail, Hotmail, YMail, etc). Estes geralmente possuem uma barra lateral que consome um certo espaço. Procure não passar de 600 pixels de largura.

Evite de usar imagens demais

Muitos dos aplicativos de e-mails bloqueiam imagens e dão a opção ao usuário liberar a visualização, então procure não depender demais de imagens para que seus usuários não vejam um e-mail em branco.

Ofereça um link para cancelar a assinatura

Tenha bom senso: não force seus leitores a receberem seus e-mails caso não queiram. Seria como se um vendedor trancasse a porta assim que você entrasse na loja. Além do mais, não oferecer uma opção de cancelar pode ter seu newsletter caracterizado como spam.

Ofereça uma versão web

Algumas vezes o código chega zoado ao usuário. Ofereça um link para visualizar o e-mail online que pode ter mais recursos.

Não use Flash

Quase todos os aplicativos de e-mail não conseguem ler objetos em Flash, então evite a todo custo inserir algo assim na mensagem.

Nossa newsletter - o Exército do Design

Sugira que seus leitores entrem em contato

Fazendo isto, você os convida para que tenham um relacionamento mais próximo com você, além de que ajuda a evitar que suas mensagens vão para a pasta de spam do usuário.

Não use formulários

Como no Flash, a maioria dos aplicativos de e-mail não conseguem renderizar formulários. Prefira utilizar um link para um formulário online.

Configure o tamanho de imagens

Adicionando a configuração de width e height em suas imagens ajuda a manter o layout mesmo quando imagens não são mostradas.

Use texto alternativo nas imagens

Caso as imagens não apareçam, o usuário pode pelo menos saber o que ele não está visualizando. Use a tag alt em suas imagens.

Não use PNGs com transparência

Alguns aplicativos não mostram transparência de PNGs, outros nem sequer mostram PNGs, então por que colocar? Infelizmente, os aplicativos ainda tem muito a evoluir.

Não use imagens em CSS

Imagens de fundo pelo CSS (como background:url(imagem.jpg);) não funciona nos aplicativos, então evite. Se precisar de um fundo, prefira usar uma cor chapada.

Tenha uma versão em texto

Ofereça uma versão em texto simples do seu e-mail para os que não conseguem visualizar HTML.

Uma tabela interessante sobre a compatibilidade de códigos HTML e CSS nos diferentes softwares e aplicativos online de e-mails é este do Campaign Monitor.

E caso você tenha interesse em receber uma newsletter pra servir de inspiração, que tal se cadastrar no nosso, o Exército do Design? Lá temos sorteios, artigos exclusivos e muito mais!

Adaptado de: Designer Daily

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Como lidar com projetos web? Parte 2
• Como lidar com projetos web? Parte 1
• Como estragar seu site – parte 2
• Como estragar seu site – parte 1
• Hierarquia visual de elementos

Este é meu primeiro post como colaboradora do Design Blog. Nada melhor que começar já com algo que seja útil para os designers: texturas!

Às vezes estamos fazendo um trabalho e falta aquele toque especial da textura para finalizar a arte. É aí que entra a sabedoria de escolher a textura perfeita para tudo fique com um ar qualidade superior e o melhor: originalidade. Pode ser mesclada, aplicada transparência, em gradiente, enfim… Mas saber fazer suas próprias texturas também te dão mais crédito como artista.

Vasculhei a internet para encontrar um super pack de texturas para download. Seguem alguns sites interessantes:

63 texturas vintage
300+ vintage e outros estilos
Abduzeedo | Terça textura total – Toda terça são postadas novas texturas
2 Textured – Vários tipos de textura: desde anatomia até de pedras.

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Brushes de arte egípcia para Photoshop
• Photoshop no iPhone
• Brushes de interface futurista
• Palestra gratuita online – Promova-se muito gastando pouco
• Modelos de Planos de Marketing (com downloads)

Antes de mais nada, vou tratar neste post sobre como fazer avaliações heurísticas em sites, mas pode ser também traduzido para qualquer outra área do design, inclusive o de design gráfico e de produto.

O que é uma avaliação heurística?

De acordo com este site,

A avaliação heurística permite uma avaliação contínua do processo, com baixo custo. Envolve especialistas avaliando o design com base em um conjunto de critérios de usabilidade ou heurísticas. O design é examinado em busca de instâncias nas quais esses critérios são violados. Os critérios de usabilidade são relacionados a princípios e guidelines e podem ser selecionados ou derivados deles.

Nestas avaliações, um pesquisador age como o usuário-alvo e tenta completar uma série de tarefas pré-determinadas no site desenvolvido. Por exemplo, tentar comprar um produto, tentar fazer um pagamento de um produto ou até mesmo encontrar informações importantes (como telefone, endereço ou e-mail para contato).

Um conjunto de critérios para análise (neste caso, proposto por Nielsen e Molich (1990)), inclui:

1. Diálogo simples e natural;
2. Fala a língua do usuário;
3. Minimza a carga cognitiva do usuário (“não faça o usuário ter que pensar”);
4. Consistência;
5. Feedback;
6. Saídas marcadas claramente;
7. Atalhos;
8. Mensagens de erro precisas e construtivas;
9. Previne erros;
10. Ajuda e documentação;

Em resumo, avaliações heurísticas são uma forma barata e rápida de analisar se um site serve ao seu propósito.

O bom deste tipo de análise é que qualquer pessoa pode ser a cobaia destes testes e o custo deste tipo de teste é baixíssimo. Estes testes vão servir para analisar o que funciona e o que pode ser melhorado, além de servir como base para quando o designer estiver considerando novos protótipos.

O que preciso para uma avaliação heurística?

Um computador, um checklist e de 3 a 10 avaliadores. Uma câmera ou software que grava a sua tela (como Camtasia ou iShowU) também é recomendado para uma análise posterior mais a fundo.

É preferível que cada avaliador seja único. Procure escolher pessoas diferentes, como por exemplo alguém mais jovem, outra pessoa mais de idade, um designer, um analista, uma secretária, etc. Quanto mais diverso for seu grupo avaliador, melhor! E eles nem precisam ser seu público-alvo.

Estes avaliadores podem ser seus amigos ou familiares, pessoas envolvidas ou não no projeto. Você pode por exemplo pegar colegas de trabalho, levá-los para a sala de conferência, pedir umas pizzas e fazer os testes em grupo, ou ligar para amigos diferentes e convidar para tomar um café por sua conta em algum lugar que tenha wi-fi e de onde você pode usar seu notebook.

Alguns experts recomendam trabalhar com o grupo como um todo, mas o processo também pode ser feito individualmente. Vou relatar como fazer os dois tipos de testes.

O checklist deve conter os critérios que devem ser analisados. Os avaliadores precisam ter a opção de marcar “concluído” ou “não concluído”, dar uma nota de 0 a 5 referente a facilidade de concluir a tarefa, além de um espaço para observações. Vou colocar um checklist abaixo que pode ser usado em qualquer site. No entanto, o seu deve conter os critérios específicos do seu site – os objetivos que os usuários devem atingir; em um site de e-commerce, o objetivo é fazer com que o usuário faça uma compra. Em um site empresaria, é fazer com que o usuário entre em contato para mais informações, etc.

Caso o site não seja um projeto pessoal, lembre-se de perguntar ao cliente a quem você está trabalhando o objetivo dele.

Como fazer uma avaliação heurística individual?

Com sua checklist em mãos, está na hora de chamar um dos seus avaliadores. Explique o que será feito – você estará observando como ele usa o seu site e como completa as tarefas determinadas na lista. Lembre-o de que não está sendo avaliado sua inteligência ou conhecimento técnico e se um erro aparecer ou ele não conseguir efetuar uma tarefa, o avaliador não será culpado de nada. É importante deixar isto claro ao avaliador para que ele não ache que está sendo testado (o objetivo é você testar o site!), assim ele terá mais liberdade e usará o site como usaria normalmente, sem tentar agradar você. Informe também que se ela não conseguir concluir uma tarefa, ela não precisa se debater e deve passar para a próxima.

Se você possuir uma câmera, tente gravar a reação facial da pessoa afim de analisar se ela está com cara pensativa, de perdida ou se ela apenas segue seus instintos. Use um software para gravar o que ela faz no computador – cada click e movimento de mouse.

Assim que o avaliador conseguir concluir uma tarefa, peça para que ela preencha o checklist informando se conseguiu ou não, a dificuldade e qualquer observação que ela tenha.

Como exemplo, vamos supor que você pediu para que o avaliador encontrasse o e-mail para contato no site. Ele conseguiu, mas demorou muito tempo procurando pelo endereço no site apenas para descobrir que o link para a página de contato estava um pouco apagada, sem contraste e com um tamanho de fonte pequeno. No checklist, ele deve dar uma nota de 2 a 4 (já que ele conseguiu fazer a tarefa, mas não foi fácil) e no campo das observações deve notar que “o link foi difícil de ser encontrado”.

Em uma folha que só você pode visualizar, cronometre o tempo que a pessoa demorou para efetuar cada tarefa e note também se ela teve dificuldade (ficou mexendo muito o mouse, clicou em páginas que pareciam ter a informação, usou o sistema de busca, etc) ou se ela fez algo imprevisto para chegar na informação (ex: procurou no Google).

Como fazer uma avaliação heurística em grupo?

Entregue uma checklist a cada pessoa e projete o site na parede com um projetor (ou use uma tela grande para que todos consigam ver nitidamente tudo). Você pode continuar de duas formas:

1. Você pode guiar as ações e pedir para que os avaliadores acompanhem e analisem se parecer ser algo que eles fariam naturalmente;
2. Perguntar o que eles fariam para conseguir completar o ítem da lista deles.

Agora basta escutar o que eles tem a dizer. Lembre-os que não há uma má opinião e nenhuma deve ser sensurada por mais ninguém. Colete todo o feedback pertinente.

Formatando os dados

Depois de fazer todos os testes com todos os analisadores, está na hora de compilar tudo e ver o que precisa ser feito.

Você pode pegar um screenshot da tela e apontar o que gera problemas aos usuários ou fazer uma apresentação em PowerPoint / Keynote para mostrar ao seu chefe. Até mesmo uma planilha com o problema e o grau de dificuldade que os analisadores tiveram pode servir.

Aproveite para incluir o que pode ser feito para mudar os problemas apresentados. A fonte precisa ser aumentada em algum lugar? Alguma informação precisa ser relocada? Um formulário de contato deve pedir menos dados desnecessários?

Resultado de uma avaliação heurística

Faça uma outra checklist destes problemas e categorize a importância de cada problema em “Urgente”, “Importante” e “Implementação futura”. Vá marcando o que for feito e se não foi feito, especificar o por que.

Pronto. Sua avaliação heurística está feita, e agora você pode ter certeza que seu site serve ao propósito. Após as implementações terem sido feitas, você ainda pode efetuar um novo teste (pode ser um grupo misto: algumas pessoas que já participaram do teste antes, e algumas outras novas pessoas).

O importante é você atingir uma porcentagem mínima de sucesso, como por exemplo 90% de sucesso em um objetivo importante do site (comprar algo na loja online) e 70% em objetivos secundários (encontrar um número de telefone para tirar dúvidas).

A forma gratuita de fazer uma análise heurística

Sim, existe uma forma de fazer esta análise onde você não gastará um centavo e não precisa lidar com mais ninguém – basta você mesmo fazer o teste, usando seu bom senso. No entanto, lembre-se sempre de pensar como um usuário pensaria.

Checklist básico de usabilidade

A lista abaixo é o básico que pode (e deve) ser usado em qualquer análise heurística. Existem várias listas similares, no entanto essa lista do Dr. Peter Meyers serve a qualquer propósito.

Acessibilidade

• Tempo de abertura do site é razoável
• Contraste entre texto e fundo é adequado
• Tamanho de fonte / espaçamento facilita a leitura
• Flash e add-ons são usados moderadamente
• Imagens possuem ALT tags
• Site tem uma página de Erro 404

Identidade

• Logo do site está bem posicionado
• Tagline da empresa é clara
• Propósito do site é entendido em 5 segundos
• Acesso rápido a informação da empresa
• Acesso rápido a contato com a empresa

Navegação

• Navegação principal é facilmente identificável
• Itens de navegação são claros e concisos
• Quantidade de botões e links é razoável
• Logo do site é linkado à página inicial
• Links são consistentes e fáceis de serem identificados
• Caixa de busca é de fácil acesso

Conteúdo

• Títulos são claros e descritivos
• Conteúdo crítico está acima da dobra
• Estilos e cores são consistentes
• Ênfase (bold, etc) é usado de forma moderada e adequada
• Anúncios e pop-ups são não obstrutivos
• Texto é conciso e explicativo
• URLs são amigáveis
• Títulos HTML são explicativos

Simples, não?

Existem outras listas mais completas na web, inclusive Jakob Nielsen tem alguns livros interessantes sobre isto – como “Projetando Websites com Usabilidade” e “Usability Engineering“.

Lembre-se sempre de incluir na lista os objetivos do seu site!

Boa análise a todos! ;)

Bibliografia – Qualitative Web Analytics, Avaliação heurística, Jakob Nielsen, Wikipedia

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Como lidar com projetos web? Parte 2
• Como lidar com projetos web? Parte 1
• Análise: Sites de faculdades de design
• Como estragar seu site – parte 2
• Plakker Album – Pegue aqui sua figurinha exclusiva!

Restaurante Koban

Na hora de fazer o manual de identidade visual de uma empresa, leva-se em consideração uma série de fatores como o significado das cores ou os ideais que essa empresa pretende passar. Daí são desenvolvidas várias peças que irão compor o catálogo de uso da logo. Porém existe uma peça chave que por muitas vezes é negligenciada: o edifício da empresa.

A arquitetura enquadra-se formalmente no grupo das chamadas artes visuais que incluem também pintura escultura entre outras. E como qualquer arte tem o poder despertar reações sensoriais em seus espectadores tais como atração ou repulsa. Bem como contribuir ou não no processo de venda de um produto. Por isso, necessidade de dar continuidade no processo de merchandising através de sua estrutura física não pode ser deixado de lado.

Bruno Zevi diz que

a arquitetura não provem de um conjunto de alturas, comprimentos e larguras dos elementos. Ela provem mais precisamente do vazio, do espaço encerrado, do espaço interior em que os homens andam e vivem, assim como a poesia é algo mais do que um grupo de belas palavras.

Assim como a embalagem não serve apenas pra guardar o produto a arquitetura também pode influenciar diretamente na comercialização da marca. O Restaurante de comida japonesa Koban, mostra como pode ser benéfico a sintonia entre arquitetura e linguagem visual. Com base na antiga moeda do período feudal japonês, foi construida toda a identidade visual corporativa que deu origem ao mobiliário e a arquitetura:

A comunicação visual através da arquitetura não pode ser esquecida na estratégia de branding pois ela acontece de toda forma, a diferença é se ela é casual ou intencional. Na hora de fazer seus próximos trabalhos comerciais, se possivel faça uma visita a loja. E responda as seguintes perguntas:

• A arquitetura pode ser aproveitada na estratégia de marketing?
• Se sim, como integrar, cores, ícones, elementos e simbolos?
• Se não, como contribuir para a requalificação desta?

Espero ter chamado sua atenção para isto. Até mais!

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• O que você faria se não fosse designer?
• Design Blog Podcast – Episódio 02
• Marcador de páginas automático
• 5 dicas de design que se aprende com a Apple
• Esse mouse parece uma…ahn…

Até certo ponto, design é uma questão de gosto. E muitas vezes, as pessoas para quem trabalhamos não gostam das idéias que implementamos nos projetos que estamos desenvolvendo para eles. O pessoal do Design Instruct perguntou a alguns designers reconhecidos como que eles lidavam com o feedback e quais eram suas estratégias para lidar com as críticas construtivas (e destrutivas) do seu trabalho.

Neste artigo vou focar na crítica como um geral, independente de ser uma crítica construtiva ou destrutiva. Mas, primeiro, vamos aprender…

As diferenças entre as críticas

Antes de começar, devemos saber definir a diferença entre as formas de críticas. Existem as críticas construtivas e críticas destrutivas.

As construtivas oferecem uma crítica juntamente de uma solução ou uma explicação do por que o crítico não gostou do que você fez. Geralmente, fica assim:

Não gostei muito deste azul, pois deu ar formal demais e fugiu do propósito de ser uma imagem descontraída. O mesmo vale para esta fonte serifada, que mais parece algo que escritório jurídico utilizaria e não nós, uma empresa de jogos.

Notou como a pessoa explicou por que não gostou? A opinião não necessariamente é pessoal (por exemplo, a fonte), mas outras vezes o cliente pode apenas não ter gostado do azul por não ser uma cor que ele, pessoalmente, goste. Neste caso em específico, a primeira afirmação está falsa e a segunda verdadeira (pois azul pode ser uma cor descontraída).

Azul descontraído ;)

Já a crítica destrutiva é simples, sem explicação e em 99% dos casos é a opinião pessoal do crítico sem fundamento em nada objetivo. Um belo exemplo:

Não gostei desta imagem que você fez. Refaça.

Uou. Ok então. O que a pessoa não gostou, exatamente? As cores? A diagramação? A fonte utilizada? A foto do cachorrinho sendo devorado por uma águia? (Ahn…). A crítica não serviu de nada. Você apenas sabe que o crítico não gostou pois não vai de acordo com o gosto pessoal dele.

Peça uma crítica construtiva

Quando recebo críticas destrutivas assim dos meus clientes (do tipo, “Tá uma m***” e pronto), faço todo um questionário para saber o que tá errado e por que ele não gostou.

• Você gostou das cores?
• Você gostou da fonte?
• Você gostou da diagramação?
• Você gostou das fotos / imagens utilizadas?

E por aí vai. Se o crítico não souber responder nada, é por que ele não sabe nem do que ele gosta e tá indeciso. Se este crítico for seu cliente, fuja para as colinas! Será um daqueles jobs problemáticos que o cliente não sabe o que quer, mas quer algo, e acha que a sua função é de ser um médium e adivinhar.

Peça uma crítica construtiva, detalhando o que a pessoa não gostou.

Chris Spooner aconselha:

Evite a frase “O que você acha?”. Como designers, não queremos saber das opiniões pessoais de uma pessoa. Queremos fazer algo que funciona para um público-alvo pré-determinado ou que acerte em resolver um certo problema. Perguntar ao cliente o que ele acha dá margens a respostas como “Não gosto de azul”, sendo que é algo totalmente não relacionado ao propósito do design no qual você está trabalhando.

No lugar disto, ele sugere escolher suas perguntas específicas baseadas nos objetivos do projeto, como “Este azul é relacionado com o público-alvo de homens de 12 a 16 anos?”

Aprenda a ser forte

Sabe aquele design que você passou horas fazendo e seu cliente chegou e disse que não estava bom o suficiente? Os momentos que você apresenta um job para um cliente e ele fica inteiramente satisfeito são raros e na maioria das vezes você terá que aceitar uma crítica negativa.

Eric Vasquez, um designer e artista que teve trabalho publicado no “Advanced Photoshop Magazine” e “The Art of Fashion Art Exhibit” comenta:

“Algumas vezes você fica achando que tudo que você cria está sendo rejeitado ou dilarecado. Eu já trabalhei com algumas pessoas que falavam super mal do meu trabalho mesmo antes de sequer terminar! No fim das contas, eu acho que este tipo de crítica negativa é necessária pois ajuda você a desenvolver uma força maior para lidar com estes problemas. É importante se focar, conseguir o maior número de informações possíveis e realmente escutar o que seu cliente tem a falar para que você possa entregar o que ele quer”

Seja profissional e mantenha o rebolado

Quando estiver solicitando uma crítica, é imperativo que você continue sendo profissional, independente de como o cliente responde. Também ajuda bastante se você não for muito intimamente ligado ao seu trabalho.

Quando apresentar o job pro chefe (ou cliente), seja confiante, dê sua opinião profissional e explique o por que das suas escolhas no design.

Mantenha a calma

Grace Smith, uma designer gráfica e web freelancer, e respeitada designer blogueira compartilhou: “Eu sempre faço a distinção entre pessoal e profissional, o que faz sentir-me melhor como designer e como pessoa.”

“Quando recebo uma crítica negativa, eu fico de olho na minha posição de defesa e lembro que a maneira que eu responder à crítica diz muito sobre minha pessoa. Eu descobri que apresentar um conceito ao cliente com uma explicação detalhado faz com que ele entenda melhor o design como um todo. Isto geralmente me dá um retorno mais construtivo do que negativo”

Não leve pro lado pessoal

Quando recebemos uma crítica negativa sobre nosso trabalho, muitas vezes podemos achar que é uma crítica a nosso gosto pessoal, estilo e visão de design. Mas é importante lembrar que design é subjetivo.

Jav Cavan, uma designer gráfica e web e um das convidadas a falar no Future of Web Design aconselhou: “Nunca leve [a crítica] pro lado pessoal. Não faça isto pois isto não vai fazer nenhum bem a você.”

Cavan compartilhou uma experiência que ela teve com um de seus críticos: “Eu recebia e-mails dizendo que meu design era chamativo demais, citando algo que eles gostavam que não passava de um site com o estilo dos anos 90 – chapado e sem dimensão. Era inevitável ficar frustrada.”

Defenda suas escolhas

Se você vê que a crítica é destrutiva, sem sentido algum, lembre-se que você é um profissional. Você foi contratado devido a sua experiência e perícia.

Justifique seus motivos por fazer algo de uma maneira específica se você acreditar que a parte criticada do seu trabalho não tem motivos a ser criticada. Se a crítica for quanto as cores utilizadas (por exemplo), compartilhe sua lógica que levou a escolher elas. Se você está tendo dificuldades em explicar ou talvez sua escolha tenha sido arbitrária, então talvez seu cliente tenha razão.

“Tento descobrir exatamente o que ele não gosta sobre o design“, diz Simoma Pfreundner, uma designer e ilustradora alemã. “Se eu acredito que a peça está boa, tento explicar o design ao cliente.”

Baseado no artigo de Design Instruct

Ajude o Design Blog! Vote em nós no prêmio Top Blog 2010! Não custa nada e demora menos de dois minutos!

Artigos relacionados

• Design e sustentabilidade na visão de Kazazian
• Coisas para se pensar…