Há um degrau!

Ninguém fala isto para os iniciantes ao design, criação, web design e afins. Eu gostaria que alguém tivesse me falado.
Nós que trabalhamos com criação, entramos nessa porque temos essencialmente bom gosto.

MAS HÁ UM DEGRAU!

Nos primeiros anos você faz trabalhos muito ruins. Estão tentando ser bons, tem potencial, mas não são. Porém seu bom gosto, o que te colocou no jogo, ainda é matador! E é por isso que o seu trabalho desaponta você.

Um monte de pessoas nunca passam desta fase, elas DESISTEM.

Muitas das pessoas que eu conheço, que fazem trabalhos incríveis, interessantes, criativos, ficaram anos nessa. Enxergamos que nosso trabalho não tem aquela coisa especial, aquele brilho! Todos nós passamos por isso.

Se você está começando, ou ainda esta nesta fase, você precisa saber que isto é normal e a coisa mais importante que você pode fazer é TRABALHAR MUITO.

Coloque-se em um “dead-line” toda semana e ao final desta, veja o fim de uma história. É só trabalhando em muitos projetos que você subirá este degrau, e então…

Seu trabalho será tão bom quanto sua ambição.

Eu demorei muito para entender isso, mas todos que encontrei disseram:
- Isso vai durar pouco tempo, é normal levar um certo tempo. Você apenas precisa lutar para trilhar o seu próprio caminho!

Adaptação livre do texto da imagem. Autor: [carece de fontes]*

 

Minha Empresa no Facebook: Perfil ou Fan Page?

No Facebook, o perfil de minha empresa lotou. Cheguei ao limite de 5000 amigos e estou em dúvida quanto a criar um segundo perfil… Cuidado! você pode estar cometendo um grande erro!

Está na hora de rever seus conceitos e aceitar uma política do Facebook que faz todo o sentido: Com mais de 5000 contatos você deixou de ser um simples mortal e tornou-se uma entidade.

Está preparado para criar um segundo perfil, então prepare-se para o terceiro ou talvez, de uma hora para outra, nenhum.

O que aconteceu é que muitas empresas entraram com o pé esquerdo na mais popular rede social do mundo. Acredito que a “cultura” que o já quase falecido Orkut criou em nossa maneira de se relacionar pela internet, cristalizou. Isso fica fácil de constatar: quanto tempo você levou para migrar de rede? Vai dizer que não achava o Facebook chato no começo?

A regra é clara: Pessoas tem perfis, empresas tem páginas. O Facebook reserva-se ao direito de deletar um perfil que seja associado à uma marca ou represente uma, e você pode perder definitivamente seus contatos:

A conta que criei para promover meus negócios, banda ou outra organização foi desativada.

De acordo com a nossa Declaração de direitos e responsabilidades, os perfis do Facebook devem representar um indivíduo. Não é permitido que os usuários mantenham uma conta sob o nome de uma organização ou usem contas pessoais para fazer propaganda ou promovê-los profissionalmente. Se o seu perfil foi listado sob um nome de um indivíduo ou usado primeiramente para promoção profissional, esse é provavelmente o motivo pelo qual ele foi removido.

/help/?faq=188258584554690

Fonte: http://www.facebook.com/help/?faq=188258584554690

Isto porque o Facebook foi feito para conectar pessoas, com nomes reais e que de preferência, se conheçam realmente. A sua empresa pode ter mais do que amigos, pode ter fãs!  Interagir com um espaço cheio de recursos que o perfil não disponibiliza.

Se você está em uma situação dessas, use as ferramentas que o próprio Facebook criou para ajudar nesta adaptação/migração.

Básico: Como criar uma página no Facebook

Se você já tem um perfil lotado, siga para o próximo tópico.

Para criar uma página, abra o link: https://www.facebook.com/pages/create.php

Quando você é dono ou administrador de uma página, é possível fazer uma troca de perfil sem precisar logar novamente. Clique em “Conta” na barra superior e em “Usar Facebook como Página”. Você pode acessar uma ou mais páginas com este procedimento.

Convertendo um perfil em página (fan page)

Faça um backup!

Seus posts, fotos e aplicativos não serão migrados! É altamente recomendável fazer um backup de seu perfil no Facebook antes da migração: Clique em “Conta” no canto superior direito, depois “Configurações” e em “Baixe suas informações”. Após alguns minutos você receberá um e-mail com o link para baixar o perfil.

Convertendo seu perfil em “fan page”

Se você tem um perfil mas ainda não tem a página e quer migrar, é fácil, crie sua página através deste link:

https://www.facebook.com/pages/create.php?migrate

Seus “amigos” serão convertidos em fãs (como se tivessem clicado em “Curtir” em sua página)  dentro de alguns minutos!

Em relação à estratégia de marketing, agora recomenda-se focar na página, oferecendo um ótimo conteúdo a seus fãs, fixando sua marca. Para facilitar as coisas, crie um endereço personalizado – isto está melhor detalhado mais adiante – e divulgue algo como “facebook.com/minha.empresa”.

Vantagens de uma página em relação ao perfil

Além de ter uma gama de possibilidades em relação à aplicativos que podem ser disponibilizados a seus fãs e ter permissão para fazer propaganda, promoções, integrar com outras redes sociais você tem algumas vantagens:

Estatísticas

Poder visualizar como está a popularidade de sua empresa através de gráficos detalhadíssimos como estes:

Sua equipe administrando a página

Várias pessoas habilitam promoções, editam e acompanham o que está acontecendo na página da empresa logando-se com seu próprio perfil do Facebook, basta adicioná-los como administradores.

• Não existe um login e senha para acessar as configurações e edição de uma página oficial, portanto, teoricamente, não pode ser hackeada.
• Com a própria conta, todos os administradores podem acompanhar, adicionar fotos, editar textos e iniciar ações.

Como fazer: Peça ao colaborador para curtir a página. Abra a página e clique em “pessoas que curtiram”. Encontre o perfil e clique em “Tornar Administrador”.

Endereço personalizado no Facebook

Pense nas vantagens de ter um endereço como facebook.com/minha.empresa. A credibilidade das informações e a identidade de sua empresa na rede social podem aumentar muito. E este endereço é totalmente gratuito.

Além disso, se for constatado que alguém está utilizando de modo indevido seu nome ou marca, pode-se fazer uma denúncia que é rapidamente analisada e cumprida pela equipe do Facebook. O perfil ou página falso é deletado.

Como fazer: Sua página precisa ter no mínimo 25 fãs, peça a ajuda de amigos. Se já tem, troque para página (Conta > Usar Facebook como página). Clique no botão “Editar página”,  Siga: Informações Básicas > Nome de usuário: > Se o link estiver liberado, clique nele e coloque o nome que deseja em uma caixa branca. Após 100 fãs não é possível trocar este nome.

Integração com aplicativos

É possível, como nos perfils, integrar os milhares de aplicativos disponíveis  no Facebook e outras redes sociais como o Twitter, publicações via celular e até ferramentas específicas como um aplicativo que sorteia usuários em promoções. Depende de sua necessidade e criatividade!

Customização da página

Que tal dar a seus fãs um player para escutar música, um jogo exclusivo valendo prêmios, um vídeo institucional ou promocional ou um formulário de contato direto?

O Facebook disponibiliza uma linguagem própria para os casos em que o empresa deseja adicionar conteúdo personalizado às páginas. O FBML (Facebook Markup Language), uma linguagem de diagramação como o HTML, de semântica simples possibilita e potencializa o conteúdo mostrado no perfil da empresa.

Além de utilizar o HTML normalmente, CSS e JavaScript, conheça  as tags próprias da linguagem e o que você pode fazer com elas:

http://developers.facebook.com/docs/reference/fbml/

Alimente seus fãs com conteúdo diferenciado e de qualidade, atraia mais fãs e acompanhe o resultado destas ações!

Qual é a melhor opção afinal?

A utilização de uma página oficial  (fan page) no Facebook ao invés de um perfil de usuário oferece mais vantagens do que desvantagens e abre um universo de possibilidades de divulgação e interação com seu público.

Ainda duvida? Dê uma olhada nas 50 páginas mais visitadas do Facebook.

Web Design: Metodologia (parte IV)

Montar um layout pode trazer muita dor de cabeça, que pode se agravar caso não sejam conhecidos alguns “macetes”. No caso estou falando do CSS, uma grande ferramenta!

Fatiar o layout, utilizando por exemplo os “slices” do Photoshop é algo que deve-se abandonar. O pensamento lógico utilizando CSS vai levar em conta os blocos de conteúdo. São regiões do layout, como por exemplo: logotipo, cabeçalho, navegação, menu, rodapé.

Nesta fase do projeto, quando layout, ou seja, a parte visual, já está definida, entraremos em uma esfera bastante técnica onde é preciso ter um ótimo conhecimento principalmente de HTML, que é a base de qualquer produção voltada para internet. Recomenda-se conhecer a fundo esta “linguagem”.

Ok, mais eu tenho o Dreaweaver e ele faz tudo pra mim, e eu ainda consigo ver o site como fica no browser!

Certo, mas no dia-a-dia você fatalmente perceberá que nem sempre haverá um Dreamweaver disponível para você brincar com o editor WYSWYG (What you see is what you get) e precisará trabalhar diretamente no código. Além disso também é fácil perceber que este editor não resolve todas os problemas durante a montagem do layout, e o pior: Ele pode encher o seu código de tags perdidas, sujeira mesmo, que o deixará uma bagunça e com uma cara nada profissional.

Os posts anteriores (Web Design Metodologia I a III) falavam sobre ações conceituais e comportamentais inerentes ao projeto, e diante do cliente. Concluídas estas fases, o que resta é montar o quebra-cabeça e esta etapa você terá que cumprir por si mesmo. Tudo bem que o cliente não saberá se você fez um “xunxo” ou outro, mas estamos tentando manter um nível profissional aqui, certo?

Um web-site bem construído segue uma série de especificações e seguí-las é uma questão de bom senso. Primeiro porque seu site estará dentro dos padrões mais consistentes e utilizados na internet e também porque você criará, desde o início, o hábito de trabalhar com conceitos como palavras-chave, meta tags, robot tags, web semântica, web standards e SEO.

Devido a esta demanda técnica, iremos abandonar um pouco a metodologia em si e falaremos sobre como, passo a passo, pensar em um web-site bem construído. Fiquem atentos!

Web Design: Metodologia (parte III)

Reuni todo o material, queimei fosfato, pensei, pensei. Fiz um rascunho de como deveriam ser as telas, posições de menus, animações. Nem sabia que não precisava de computador! O cliente assinou a proposta, o contrato. Tudo certo! Agora é a hora, apertem os cintos e vamos lá!

Não sei vocês, mas eu já tentei criar layout de web-site até no Corel… É vício de quem trabalhou em gráfica com arte-final no início de carreira. Logo que você descobre que o Photoshop é a melhor opção, fica mais tranquilo manipular as idéias para construir uma interface.

O web-site não passa disso, uma interface. O usuário quer a informação que está no site e esta informação precisa estar organizada e acessível. É a interface que “conversa” com o nosso amigo usuário. É realmente um desafio prever como esta comunicação acontecerá e se será bem sucedida.

Quando eu crio um layout para web-site, costumo perguntar a amigos, parentes, e qualquer um que esteja por perto o que a pessoa está entendendo, vendo. Por incrível que pareça, são os menos familiarizados que podem nos passar dicas preciosas sobre as falhas do layout. 

Desenhando o Layout

Entenda-se por “layout” uma representação gráfica, não funcional, do projeto, ou seja, é uma imagem estática. É esta peça gráfica que você apresentará ao cliente para aprovação.

Abra o Photoshop, um novo arquivo. Costumo trabalhar com as medidas de 750px de largura por 500px de altura, com resolução de 72dpi. Não adianta trabalhar com resolução maior, pois esta é a resolução que o monitor utiliza.

Estas especificações foram as que escolhi para iniciar um projeto, são escolhas pessoais, nada impede de você formar seu padrão. A largura do layout neste caso é importante para evitarmos o “scrooling“, que faz aparecer uma barra de rolagem horizontal… péssimo para quem está navegando.

Apesar de monitores com resolução de 1024px por 768px serem comuns hoje em dia, eu ainda teimo em projetar sites para o padrão 800px por 600px. É melhor pensar sempre em quem possue os recursos mais limitados de acesso (que são a grande maioria) do que os poucos privilegiados.

Procure trabalhar com as imagens com a melhor qualidade possível, para dar uma aparência profissional ao layout. Caso você tenha reduzido uma foto, utilize o “unsharp mask” no menu de efeitos para dar maior nitidez.

Coisas a pensar durante a execução do layout

Pense em continuidade do layout e posicionamento do bloco na tela. Recomendo que você pense em centralizar o layout e neste caso é bom pensar em como ele vai continuar para os dois lados.

Algo polêmico, mas impossível de deixar de lado. Sites totalmente em Flash perdem muito em velocidade, acessibilidade e o pior: O Google é cego, ou seja, não lê informações em arquivos SWF. Nada contra utilizar o Flash, mas utilizá-lo com cautela e em poucas partes do web-site é a melhor opção.

É importante também pensar em livrar-se do método de utilizar tabelas para posicionar os itens. Estude HTML e CSS, o conceito de “Tableless” nos permite um controle muito maior sobre usabilidade, acessibilidade, renderização em navegadores diferentes, outras plataformas (como palms e celulares), versões para impressão, etc. O código fica mais leve, os buscadores entendem melhor o conteúdo, isso sem falar na facilidade de fazer alterações no web-site.

Apresentando o layout

Produza uma ou duas variações para a peça gráfica. Apresentar muitas opções pode deixar o cliente confuso e a aprovação indefinida. Ao mostrar os layouts procure explicar de forma fácil e acessível, evitando termos técnicos, sobre quais foram os conceitos utilizados para gerá-lo. Fale sobre suas pesquisas, sobre os concorrentes… tente embasar o projeto para evitar comentários levianos.

Se você tiver um laptop, leve-o e apresente a imagem ao cliente. É importante também levar o layout em um pen-drive, que permita a você mostrar o layout em um monitor da empresa. Aproveite esta chance para explicar que podem haver variações de cores de uma máquina para outra.

O ideal é levar o layout impresso em papel e anotar nesta imagem todas as alterações, itens duvidosos, etc. Caso não hajam alterações, peça para que o cliente assine o papel aprovando a imagem. Esta folha pode servir como um documento atestando a aprovação.

Em caso de alterações serem necessárias, proceda da mesma forma ao reapresentar o layout. É comum também o cliente não aprovar o projeto de primeira. Ele quer conversar com sócios, funcionários, com a mãe e o pai dele e se bobear, irá parar alguém na rua para emitir uma opinião sobre o layout. Dê este tempo ao cliente e se ele não entrar em contato, cobre uma resposta após 4 ou 5 dias.

Durante a reunião de aprovação, não deixe de comentar que o próximo passo é a montagem e é preciso inserir o conteúdo (textos, imagens e fotos). Peça ao cliente para preparar este material pois isto influênciará no prazo de entrega do projeto finalizado.

Na parte IV iremos falar sobre como dar vida ao seu layout discutindo técnicas simples, como o check-list para evitar erros e refações.

Web Design: Metodologia (parte II)

O cliente aprovou a proposta, conferiu todos os detalhes do projeto a ser criado, meu trabalho já começou e eu ainda não recebi nada! Qual é o próximo passo?

Um problema comum que às vezes precisamos enfrentar é o caso em que o cliente está em dúvidas em pagar por um serviço que ainda não foi executado. Além de dar garantias, como um bom contrato, você deve apoiar-se em seu portfolio, ele é sua maior referência. Aqui pode-se chegar a uma conclusão óbvia, mas nem tanto: quem é  seu maior e mais importante cliente? É você mesmo!

Procure deixar seu material de divulgação, portfolio online, logotipo, impressos com aparência profissional e impecável. Não entre nessa de “Em casa de ferreiro, espeto é de pau”. Dedique tempo para formar sua própria imagem.

Depois de aprovada a proposta, iremos formalizar legalmente a prestação de serviços através de um contrato. No meu caso, como ainda não tenho empresa constituída, optei pelo contrato de pessoa física. Este tipo de contrato deve ter firma reconhecida e testemunhas, valendo legalmente em caso de problemas.

Após levar um número sem fim de calotes, resolvi consultar um advogado e construir um contrato que envolvesse todos os pontos do projeto. É importante explicar ao cliente que o contrato é uma segurança, tanto para ele que receberá o trabalho exatamente como pediu, quanto para você que receberá seu pagamento como estipulado.

Baixe aqui o modelo de contrato em Word.

Este contrato disponibilizado aqui é uma verdadeira jóia, pois prevê a maioria dos problemas que poderiam acontecer. Portanto, utilize o bom senso e faça bom uso desta ferramenta.

Contrato assinado, vamos por a mão na massa!

Já sei, agora abro o Photoshop e dá-lhe!

Nada disso! Agora é o momento de reunir todo o material coletado, referências, anotações e pensar em que conceito você vai utilizar no projeto.

Sugiro que você faça uma lista dos conceitos que pretende empregar no layout do web-site, um exemplo:

• Força
• Equilíbrio
• Sobriedade
• Dinamismo
• Cores fortes

É claro que cada projeto irá precisar de uma conceituação diferente, pois cada cliente e área de atuação tem necessidades diferentes, público-alvo diferente. É isso que vai criar o diferencial.

Rough

O rough (diz-se ráfe) é como um rascunho do projeto. Pegue várias folhas de papel e desenhe o layout do web-site, defina as posições de cada elemento, faça uma pré diagramação de como layout será organizado. Onde estarão imagens, menus, textos, animações, etc.

Se for necessária fazer uma animação em flash, a melhor opção é desenhar um story board, em que é definido o que acontece em cada cena. Você ainda pode anotar ao lado de cada quadro os sons que serão tocados, se haverá narração, que tipo de imagem será necessária, etc.

Tomando estas medidas iniciais é possível prever rapidamente como o layout irá se comportar na tela e pode-se fazer correções antes mesmo de começar a criação propriamente dita.

Na parte 3 da nossa odisséia, falarei sobre como proceder com a criação do layout e o momento mais temido: a aprovação!

Web Design: Metodologia (parte I)

Eu já tenho um cliente e ele quer um web-site! Ok, o que eu faço agora? Aqui estão idéias para você organizar o projeto de forma a não pular etapas e chegar a um resultado satisfatório.

O termo “design” muitas vezes é confundido com desenho, isto se deve primeiramente à falta de cultura em relação à profissão no Brasil, e em segundo, à nomenclatura do curso nas universidades brasileiras que adotaram “desenho industrial”. Na verdade a tradução que estaria mais próxima na língua portuguesa seria “projeto”!

O projeto de um web-site consiste em várias fases e a metodologia que exponho aqui é a que tenho utilizado para confeccionar os projetos de forma organizada. Portanto não é regra, pois cada designer irá definir sua própria metodologia, a que melhor se adapta à sua maneira de trabalhar.

Pesquisa

Uma das fases que considero mais importantes no desenvolvimento de um projeto é a pesquisa. É nesta fase que serão coletados os dados utilizados para dar uma direção ao trabalho de criação e execução. A primeira pesquisa deve ser feita junto ao cliente, o que usualmente chamamos de “briefing“.

Um briefing detalhado pode salvar você de ter que refazer todo o trabalho e servir como um documento no caso do cliente negar que havia pedido isso ou aquilo.

• Peça ao cliente para lhe fornecer o logotipo (vale lembrar que logomarca não existe), se possível em arquivo digital e em vetor (Corel, Ilustrator) para evitar distorções na utilização.
• Solicite todo o material impresso que o cliente tiver disponível, como folders, cartões, mala-direta, papelaria de escritório, flyers, catálogos de produtos, embalagens dos produtos, fotos da empresa, etc.
• Se puder, leve uma câmera digital e tire algumas fotos do ambiente, dos produtos, da fachada. Isto vai ajudar a criar um repertório visual sobre o projeto.

Você ainda pode levantar alguns questionamentos para saber mais sobre a empresa, abaixo listo alguns tipos de perguntas que podem ser feitas:

• Qual o objetivo do projeto? (divulgação, reforço da marca, recrutamento de pessoal, lançamentos, notícias, etc.)
• Quais são os principais concorrentes?
• A empresa atua localmente ou globalmente?
• Pergunte sobre sites que o cliente acha interessantes e visita freqüentemente. Isto pode ajudar a sentir qual estilo o cliente aprecia.
• Levante questões sobre o que o cliente espera do web-site. Ter uma meta definida pode levar o projeto para direções distintas.

Uma dica: comente com o cliente, da forma mais diplomática possível, que o projeto não destina-se a satisfação pessoal dele. O web-site é para o público da empresa e precisa atender à suas expectativas, não a caprichos ou gostos pessoais.

Respondidas estas questões, você pode formalizar uma proposta ao cliente, relacionando todos os combinados, valores e limitações.

Baixe aqui um modelo de proposta no Word.

Ao assinar a proposta o cliente está concordando que o trabalho será feito exatamente da maneira como você sugeriu. Esta proposta, que servirá como base para o contrato de prestação de serviços, é apenas uma etapa de conferência, onde o cliente tem a chance de observar o projeto como um todo.

Organizando e Continuando a Pesquisa

Com todo este material em mãos, e o que mais você conseguir, a pesquisa agora irá concentrar-se sobre a área de atuação do cliente. Visite inúmeros sites além dos indicados pelo mesmo, observe recursos, estilo visual e linguagem gráfica utilizada. É importante coletar boas idéias e tentar perceber qual o diferencial que cada web-site oferece.

Parta do pressuposto de que o projeto a ser desenvolvido precisa ser, no mínimo, melhor do que o melhor web-site da área. Assim você nivela seu trabalho por cima!

Pronto! Agora você já tem uma idéia do que é importante tanto para o cliente, quanto para o seu nicho de mercado. No próximo post falaremos da fase que antecede a criação, que podemos chamar de rough (ou rafe).