Hotsite Brasília 50 anos

imagem-topo-hotsite-brasilia-50-anos
O planejamento, conteúdo, arquitetura de informação, design, animação e desenvolvimento foram feitos pela TV1. Eu cuidei da parte de Arquitetura de Informação, começando pela infoestrutura: Infoestrutura Minisite Brasilia 50 anos

O especial fala da história de Brasília, e além de textos, contém vídeos, áudios e galerias de imagens. A proposta foi fazer uma linha do tempo diferenciada, um pouco fora do padrão de linha do tempo que estamos habituados a ver, então parti para a segunda etapa como de costume: os benchmarks e em seguida os Rafes:

Sketches do projeto

Para que todo o conteúdo não ficasse dentro de menus tradicionais, a ideia é que a navegação fosse feita através de três principais áreas (A cidade, O povo e A história) e a partir daí filtros que o usuário pudesse selecionar conforme o seu interesse.

Enquanto os rafes passavam pela aprovação, passei para a arte ir adiantando, pois como não tínhamos muito prazo as etapas tiveram que ser feitas no mínimo de tempo.

Conceito aprovado, iniciei então o desenho dos wireframes.

Não costumo colorizar os protótipos que faço, justamente para que a cor não influencie nas decisões do cliente, mas desta vez fiz questão de colorir algumas áreas, pois a presença da cor neste caso foi essencial para mostrar o funcionamento da navegação do site.

E como não se trata de uma navegação comum, criamos também mais de uma opção de navegação: Através das setas do teclado, pela roda do mouse, clicando nos conteúdos e finalmente pela própria timeline padrão que fica localizada abaixo do conteúdo central.

Hotsite Brasilia 50 anos - Wireframe da timeline Hotsite Brasilia 50 anos - Wireframe dos filtros Hotsite Brasilia 50 anos - Wireframe Brasília hoje

E para que não precisasse desenhar todas as telas, fiz uma página só de templates prevendo comportamentos diversos, como texto+imagem, texto+vídeo, texto+áudio e etc. Assim o editorial poderia escolher o template de acordo com a característica de cada conteúdo.

Hotsite Brasilia 50 anos - Wireframe dos templates

Enfim algumas telas do layout que o Caio Andreolli, Diretor de Arte aqui da agência desenhou:

Hotsite Brasília 50 anos - Layout da home Hotsite Brasília 50 anos - Layout dos filtros

O trabalho de motion e programação foi feito pelo Alessandro Luz

Acesse o hotsite

Fonte: Magel Studio

Postagens Relacionadas