Blog Cristiano WebRelatos da vida de um Webdoméstico!

Olá pessoal, depois de um hiato de uma semana, estou de volta ao blog e hoje eu vou fazer um post contando como foi o processo de redesign do website ZJ Construções, desde o briefing, passando pelo wireframe, identidade visual, layout e HTML e como isso dá trabalho!

E para entender o “quanto de trabalho” eu estou falando, segue alguns screenshots do layout antigo para vocês terem um noção básica sobre o projeto.

Website Antigo - Página inicial

Deu pra sentir o tamanho do problema que tínhamos pela frente né? Eu disse “tínhamos” porque nesse projeto eu contei com Keith Rodrigues, um dos meus parceiros web, na direção de arte dos layouts, além de dividir o atendimento junto ao cliente comigo.

E tudo começa com uma reunião de briefing que apontou alguns concorrentes como referências. Dentre eles a Osborne e a Sousa Camargo, ambos da construção civil (Vide Delicious do projeto).

Eis alguns pontos importantes levantados no briefing:

Vantagens sobre os concorrentes:

• Custos mais competitivo
• Relação estreita com a Diretoria
• Agilidade nos projetos

Desvantagens sobre os concorrentes:

• A falta da percepção da marca

Principais problemas no site atual:

• Layout envelhecido
• Conteúdo desatualizado
• Estrutura de navegação inconstante

Enfim, saímos da reunião com muitas ideias na cabeça e uma única certeza: teríamos pela frente um trabalho muito delicado. Sim, porque teríamos que criar uma interface que fosse mais moderna, mas que pudesse ser assimilada pelo cliente de uma forma natural. Alguém que possuía um site naquele estado por tantos anos não conseguiria conceber um novo layout “muito moderninho” com muita facilidade.

De início levantamos três pontos fundamentais para o sucesso do projeto:

O primeiro era que o epicentro do website seriam os trabalhos realizados pela empresa. Esse era o grande diferencial. Eles tinham preços competitivos e acessíveis e mesmo assim o produto final era de qualidade. Isso precisava ser exaltado. Todo o website precisava girar em torno desses projetos.

O segundo ponto era a relação com os parceiros de projetos: os arquitetos. São eles que dão a identidade de cada projeto. A relação é muito boa, e os clientes adoravam essa sinergia entre eles. Dessa parceria surgiam bons projetos, e isso também precisava ser destacado no website.

E o terceiro e último ponto fundamental, e sem dúvida o que deu mais trabalho e definitivamente mudou o rumo da criação, foi a logo da empresa.

Logo antiga

Desde o início eu olhava para o Keith e dizíamos um para o outro: “que diabos vamos fazer com essa logo?” Já havíamos feito os wireframes, já estávamos no layout e a logo sempre incomodava. Não dava para ignorá-la deixando-a de fora do desenho e quando fosse aprovado apenas a colaríamos lá, por cima do website colada com Durex! Não é assim que funciona!

Pensamos bastante e depois de muito conversar, resolvemos oferecer o serviço de redesign da logo ao cliente. Reajustamos o projeto e ele aceitou a propostas com a ressalva de que seria “apenas uma modernização”. Nada de criar uma “nova logo” hein gente! Falou o cliente!

E depois de algum tempo, chegamos à 3 modelos e a logo escolhida caiu com uma luva no layout que já estávamos trabalhando e finalmente o projeto avançou. Seguem as propostas criadas.

Proposta #001 clique para visualizá-la

Proposta #002 clique para visualizá-la

Proposta #003 clique para visualizá-la

A gente gostou muito do resultado. A ideia visual sempre foi ligada à perspectiva e os pontos de fuga, que podem ser identificadas no fundo de cada página, além das fontes cortadas, e claro, na logo também. A navegação é bem simples auxiliada pelas URLs amigáveis. Também usamos uma pequena animação em JQuery na página inicial do website para convidar o usuário a conhecer o portifólio. Enfim, o cliente ficou bastante satisfeito e nós também. A evolução ficou bem clara, porém não agride, e isso é fundamental num projeto: respeito ao usuário, mas ao nosso cliente também!

Layout - Página inicial

Layout - Página empresa

Layout - Página portifólio

Segue uma imagem com o layout finalizado da página portifólio já com a nova logo inserida. O projeto ficou pronto no dia 27 de setembro e vocês podem visualizá-lo completo no endereço www.zjconstrucoes.com.br.

ZJ Construções - layout finalizado

É isso pessoal, espero que tenham gostado. Em breve farei mais outros posts “desconstruindo os meus projetos”! E não se esqueçam, estou participando do Prêmio Peixe Grande promovido pela Arteccom na categoria melhor site de freelancer / autônomo e melhor blog! Vota lá e ajuda o amigo aqui, ok!?

Abraços e até a próxima!