MUF #04: Metodologia de desenvolvimento do Último Freela

Comecei a “fazer sites” em 1996 e naquela época era assim: faz aí um site do Campeonato Brasileiro de futebol. Eu abria o Photopaint e colocava uma logo no canto esquerdo, inventava umas sessões até que o menu horizontal ficasse preenchido e escolhia umas imagens legais para ilustrar.

Com o passar dos anos, fui estudando mais o assunto e percebendo quer projetar para a web era muito mais do que ter uma página bonita. Itens como usabilidade, acessibilidade, arquitetura de informação, webwriting, otimização para buscadores, código semântico e outros começaram a entrar na receita do bolo e, se não houvesse uma metodologia clara para definir como tudo seria feito, a chance de errar era grande.

Aos poucos fui desenvolvendo uma metodologia e - a cada novo projeto que começava - procurava segui-la. Você provavelmente tem uma, mesmo que não saiba. Se quer uma grande dica, procure escrevê-la e organizar o seu passo-a-passo. Depois que fiz isso, a qualidade e principalmente o cumprimento de prazos dos meus freelas melhoraram consideravelmente.

Metodologia Moebius, um bom ponto de partida

No final de 2005, conheci a Metodologia Moebius, desenvolvida pelo I-Group para gerenciar projetos web, baseada no conceito de melhoria contínua. A complexidade impede-me de explicá-la completamente aqui, mas já a abordei em outro post. Você também pode conhecê-la comprando o livro Mirando Resultados, de Ricardo Almeida, criador da metodologia e meu professor no MBA em Planejamento, Gestão e Marketing Digital.

Não estou dizendo para usar cegamente a Moebius ou qualquer outra metodologia de desenvolvimento de projetos web. Adapte o que já existe de bom às suas necessidades, coloque-as no papel e - o mais importante - siga-as.

Eu particularmente uso uma adaptação da Moebius e é esta a metodologia que está sendo aplicada no desenvolvimento do site do Café Colombo. O planejamento prevê quatro etapas: diagnóstico, prognóstico, desenvolvimento e monitoramento. Cada uma delas tem seus passos específicos e são esses que serão acompanhados aqui no “reality show” Meu Último Freela. Eis a visão geral da metodologia adotada:

Diagnóstico

• Coletar informações sobre a empresa
• Coletar informações sobre o produto
• Coletar informações sobre o mercado
• Coletar informações sobre a concorrência
• Definir os objetivos gerais do projeto
• Definir o público-alvo do projeto
• Mapear demandas do público-alvo
• Definir formas de rentabilização do site
• Definir detalhes técnicos do projeto
• Esclarecer sobre linguagens e ferramentas que serão utilizadas
• Decidir licença para os direitos autorais
• Definir quem será o interlocutor entre cliente e desenvolvedor
• Coletar idéias para a arquitetura de informação
• Definir objetivo principal para escolher destaque da home
• Montar o cronograma detalhado de execução do projeto
• Construir cenário compilando as informações coletadas no documento de diagnóstico

Prognóstico

• Separar e hierarquizar seções do site
• Definir label das seções (taxonomia)
• Construir o Mapa do Site
• Classificar páginas como estáticas ou dinâmicas
• Elaborar Wireframes
• Organizar fluxo de navegação
• Realizar avaliação heurística da interface
• Criar protótipo navegável
• Realizar teste informal de usabilidade da interface
• Planejar conteúdo e definir responsáveis
• Elaborar cronograma com prazo de recebimento do conteúdo
• Adaptar conteúdo enviado com técnicas de webwriting
• Elaborar Documento de Conteúdo, casando com Arquitetura de Informação
• Definir a paleta de cores
• Definir a tipologia
• Definir a iconografia
• Definir padrões gráficos
• Criar layout da home
• Criar layout de uma página interna
• Verificar acessibilidade no contraste das cores
• Submeter layout inicial à aprovação do cliente
• Criar layout das demais páginas
• Revisar layout com arquitetura de informação
• Submeter telas finais à aprovação do cliente
• Definir o time de gestão do projeto
• Definir controle de métricas
• Elaborar o documento de prognóstico

Produção

• Elaborar HTMLs seguindo web standards
• Validar HTMLs junto ao W3C
• Validar HTMLs junto aos avaliadores de acessibilidade
• Elaborar folhas de estilo (CSS) para monitor
• Elaborar folhas de estilo (CSS) para impressora
• Elaborar folhas de estilo (CSS) para dispositivos móveis
• Elaborar folhas de estilo (CSS) para leitores de tela
• Validar folhas de estilo junto ao W3C
• Testar resultados em vários navegadores e plataformas
• Revisar navegação geral
• Realizar avaliação heurística do projeto
• Realizar testes de usabilidade informal
• Submeter resultado das páginas estáticas à aprovação do cliente
• Implementar páginas dinâmicas
• Instalar e configurar o CMS
• Alimentar páginas dinâmicas com o conteúdo coletado
• Submeter resultado final à aprovação do cliente
• Revisar site com sistemas implantado em URL alternativa
• Treinar equipe que vai utilizar o sistema
• Confirmar com cliente a data de lançamento
• Migrar projeto para endereço oficial
• Elaborar Documento de Produção

Monitoramento

• Monitorar diariamente performance da estrutura tecnológica
• Revisar navegação e links mensalmente
• Elaborar Relatório Mensal de Navegação Periódica
• Realizar atendimento das solicitações do cliente
• Verificar satisfação do cliente
• Registrar alterações no Histórico do Atendimento
• Monitorar inovações disponíveis
• Certificar que o cliente tenha a versão mais recente do CMS
• Oferecer e/ou implementar as inovações
• Controlar periodicamente métricas definidas através do Google Analytics
• Elaborar mensalmente Relatórios de Controle de Métricas
• Analisar métricas para sugerir ajustes e melhorias