Mostrando postagens com marcador interface. Mostrar todas as postagens
Mostrando postagens com marcador interface. Mostrar todas as postagens

quinta-feira, 9 de dezembro de 2010

Look Site para Lançamento da Nova Coleção dos Relógios da marca Ferrari no Brasil

LookSite
O que diferencia a criação deste site dos demais, é um conceito. Mais do que um site de produtos, trata-se de um "LookSite". O termo foi cunhado a partir do seu similar mais conhecido, usualmente impresso em papel - trata-se dos "LookBooks" de lançamento das coleções de grifes de moda, onde tendências, estilo e design são apresentados.
O "LookSite" de lançamento da nova coleção dos Relógios da marca Ferrari no Brasil, segue o conceito de apresentação das novas tendências, estilo e design para relógios de pulso.
Totalmente desenvolvido utilizando o CMS (Content Management System) - Sistema de Gerenciamento de Conteúdos de código aberto - Joomla!
Estruturada sobre o "framework" para plataformas web Gantry, a construção do site seguiu um padrão modular, onde todas as peças se encaixam com precisão. A utilização deste "framework" serviu para facilitar e controlar a integração dos vários componentes e extensões necessários à produção do website.

Identificação imediata
Nós da w3maker, temos por princípio que um site deve "dizer logo de cara" de que se trata o seu conteúdo e por isso, estampamos no primeiro slide da animação em Flash um relógio esportivo, juntamente com o slogan da campanha de lançamento. O Flash utilizado é um módulo localizado e não interfere no fornecimento de informações para posicionamento do site em mecanismos de busca.

Impacto visual
O pedido único e principal do briefing de criação do site, feito pelo diretor e representante exclusivo da marca de Relógios Ferrari no Brasil, Sr. Gabriel Schwatrz foi: "Quero um site de impacto, dinâmico e com a cor vermelha de fundo".
Briefing melhor impossível! Ou seja, quase nenhuma limitação para a criação - o sonho de todo designer!

O processo criativo
A crição de um site na w3maker normalmente começa de trás para frente ou seja, pensamos e desenvolvemos primeiro a imagem de background para depois passar às camadas superiores da interface. Desta forma os estudos e formas são mais livres e podemos exercitar um layout mais abrangente.
Com uma câmera digital de 3.2 Megapixels do celular Sony 510a, registramos imagens dentro de um carro em movimento na Rua Voluntários da Pátria e nos corredores do metrô, na estação Botafogo no Rio.
As imagens foram selecionadas, levando em conta o critério de sugestão de movimento e dinâmica da composição. Definição e foco pouco importaram, uma vez que aplicamos efeitos de desfoque e filtragem com a cor vermelha em camadas no modo multiply no editor de imagens Gimp. O resultado passo a passo pode ser visto nas imagens abaixo:


As três imagens resultantes foram suficientes para a criação de fundos para o site, banners, slides para o Flash e outros detalhes do layout. 
Para que o site não tivesse apenas a cor vermelha, empregamos elementos na cor grafite para as áreas de textos corridos e ainda utilizamos um padrão de fundo modular (azulejo) de estilo "grunge" que foi baixado da seção de texturas grátis do site Photoshop Roadmap.
A seguir o resultado da combinação de dois elementos de background dispostos em camadas e contorlados pela CSS (Cascading Style Sheet) - Folha de Estilos em Cascata.
A tecnologia embarcada
Para o catálogo dos relógios, as galerias de imagens foram instaladas utilizando o módulo RokBox compatível com o Joomla!, que é baseado na biblioteca MooTools em Javascript - este recurso propicia a criação de uma camada virtual intermediária entre o servidor do site e a máquina do usuário, para onde as imagens são previamente carregadas, agilizando e diminuindo drasticamente o tempo de exibição das fotografias dos produtos.
Muito além das fontes de sistema
Em um passado recente, a grande limitação de layout tipográfico à qual o web designer estava "amarrado" era a de utilizar apenas as fontes de sistema ou aquelas que vinham com a instalação padrão do sistema operacional - em outras palavras, uma fonte que não estivesse na máquina da pessoa que visitava um site seria imediatamente substituída por uma fonte padrão, comprometendo toda a estética do site.
Foi-se o tempo em que para exibir fontes de letras especiais em um site, era necessário transformá-las em imagens.
A w3maker utilizou o recurso @font-face que permite instalar no servidor de hospedagem, junto com as páginas do site, uma coleção de fontes nos formatos True Type (TTF), Embedded Open Type (EOT) e Scalable Vectorial Graphics (SVG) - desta forma, a partir de declarações na folha de estilos é possível enviar informações ao browser (navegador) de internet do usuário, para que utilize a fonte que o web designer escolheu.
O resultado prático disto é que os títulos e textos passam a responder por detalhes importantos do estilo e design do site.
Para o LookSite dos Relógios Ferrari a w3maker optou pela família de fonte Aller nas versões Light e Regular. A fonte Aller foi obtida e empregada respeitando a sua licença de uso em http://www.fontsquirrel.com/license/Aller




De forma simples o objetiva, foi publicado pela w3maker, o LookSite da marca de Relógios Ferrari no Brasil, onde mais de 100 modelos podem ser vistos em detalhes.

Para saber mais sobre criação de sites e desnvolvimento de LookSites visite w3maker.com.br

sábado, 12 de dezembro de 2009

Campanha de Comunicação para Hidromec

A w3maker acaba de entregar uma campanha de comunicação integrada para a Hidromec, empresa que fabrica e comercializa equipamentos hidrométricos, sedimentométricos e meteorológicos, além de prestar serviços de monitoramento ambiental via satélite.

A campanha foi composta de:
- criação do novo site,
- fotografia de produtos,
- produção de catálogos de produtos,
- banners para feiras e exposições.

O briefing e o acompanhamento das etapas de criação e produção ficaram a cargo dos diretores da Hidromec Marcio Oliveira e Bruno Pires.

Para a criação do site a w3maker trabalhou com os elementos da natureza - água e ar - que são o foco da Hidromec tanto nos produtos quanto nos serviços. O resultado foi uma ilustração, com montagem fotográfica de imagens adquiridas no Dreamstime, que aparece no topo de todas as páginas.

A combinação dos elementos partindo da cor azul da logomarca, utilizando transparências e uma escala de medição, serviu para criar os elementos de identificação do segmento de atuação da Hidromec, não deixando dúvidas para quem entrar no site, que se trata de uma empresa que trabalha com produtos voltados para hidrometria e meteorologia.

Seguindo a linha da simplicidade, foi criado um "framework" para o desenvolvimento do site em Joomla. Por se tratar de uma estrutura com muitas páginas de conteúdo, foi necessário criar um menu de navegação com vários níveis para a apresentação dos produtos da Hidromec.

A escolha do Joomla como sistema de gerenciamento de conteúdo se deu pelo fato de que a Hidromec promove constantes atualizações na sua linha de produtos.
Tendo em vista a necessidade de facilitar o acesso dos usuários ao conteúdo do site, a w3maker optou por instalar um componente de geração automática de Mapa do Site, o xMap, que se encarrega de montar dinamicamente, a cada nova seção ou página criada, a página de Mapa - sem necessidade de atualizações manuais.

Para a exibição de produtos, distribuidos por diversas seções do site, foi instalado um compontente em Ajax, o "slimbox" que trabalha com uma camada virtual entre o servidor e o computador do usuário, agilizando o tempo de carregamento das imagens, a partir do clique nas miniaturas para ampliá-las.



A w3maker responde também pela fotografia dos produtos; por se tratar de itens pesados e de difícil manipulação, um estúdio fotográfico foi montado na Hidromec para registrar em alta definição, mais de trinta produtos. Em seguida as fotografias receberam um tratamento para correções de cores e recorte de fundos. Alguns resultados deste trabalho podem ser vistos a seguir.





A administração dos recursos de gerenciamento de conteúdo do site é personalizada e atende aos requisitos de agilidade e praticidade na manutenção.

Para a produção gráfica dos catálogos a w3maker desenvolveu layouts e artes finais para os produtos automáticos de sedimentometria em formato A4 e impressos frente e verso.





Complementando a comunicação da empresa, foram produzidos três modelos de banners no formato 0,80 x 1,20 m impressos em lona, para utilização em feiras e exposições que a Hidromec participa.




A campanha para a Hidromec não se encerra por aqui, estão programados e contratados com a w3maker a reformulação da interface do site Teleaneel que a Hidromec mantém, com exibição de relatórios de telemetria via satélite para seus clientes e o redesenho da logomarca da empresa.

Saiba mais sobre soluções completas para comunicação integrada:
w3maker.com.br