Bienal Fotografia do Porto 2023 Website

Um website que se estende a toda a experiência de visita e consulta da Bienal no Porto.

Cliente: Ci.CLO: Plataforma de Fotografia

URL: https://bienal23.bienalfotografiaporto.pt

Input: Comunicar a Bienal online e auxiliar os visitantes numa experiência local mais informada e cómoda.

Output: Design e desenvolvimento do website.

A identidade da Bienal encontra no website uma forma de estender o seu potencial. Elementos como o furacão e o logotipo são animados, comunicando de forma mais assertiva os conceitos subjacentes.

Como ferramenta este website foi desenhado para acomodar diferentes tipos de utilização, servindo assim como guia para uma visita às diversas exposições, como planeador de atividades ou como repositório de informação das diversas criações produzidas no contexto Bienal.

Animação de entrada da página principal

Scroll ao longo da página principal

A página principal possui duas versões consoante a data do dispositivo:
uma antes e durante a Bienal, e outra pós-Bienal

A página de exposições funciona como núcleo para a proposta artística da Bienal. Nesta página funciona como arquivo, podendo ser navegada a como galeria (tempo) ou como mapa (espaço).

Exposições visualizadas por espaço

Exposições visualizadas por tempo

Detalhe de Exposições

Esta página tipo sumariza o conteúdo de cada exposição.

Slideshow

Slideshow utilizado para mostrar uma seleção de fotografias associada à exposição.

Projectos relacionados

Existem exposições que aglomeram múltiplos projetos, do mesmo ou de vários artistas. Foi por isso necessário criar uma página de detalhe para cada projeto e dispor ligações para estas numa galeria associada à exposição mãe.

Secção de Espaço

Cada exposição teve um espaço associado. Este espaço tem uma página de detalhe com informação logística que poderá ser acedida através da página de exposições.

Ao clicar numa imagem esta será expandida, atualizando a composição da grelha de galeria

Durante o curso da Bienal múltiplas atividades foram organizadas. Esta página serve como um índice de atividades, sendo possível filtrar por diversos tópicos.

Navegação para a página de índice de atividades

Detalhe de Atividade

Esta página tipo sumariza o conteúdo de cada atividade.

Formulário de Inscrição

Para participar em cada atividade foi necessária uma inscrição por parte do visitante. Um formulário integrado na página permitiu agilizar este processo.

Exposição relacionada

Em grande parte das atividade existiu uma relação com uma ou mais exposições. De maneira a contextualizar o participante criámos ligações para a página de detalhe de cada uma destas.

A página “Sobre” descreve a Bienal de forma mais geral, apresentando o conceito anual bem como conteúdo mais abrangente como a lista de parceiros ou artistas.

Página Sobre com a galeria de artistas

Tipografia: Cambon por General Type Studio
Monument Grotesk por Dinamo Typefaces

Desenvolvimento Backend: Consipere

ssss oooosssss oooooooooo ssssss oooommmssss ssssssss ssss oooommmmmss oommmmoos mmmoooo oooooooosss oommmmoos mmmmmooss ooooooossss oooooooos mmmmmoooos oooooooooos mmmmmooooo ssss mmmmmoooos mmmmmmmmmmm ooosssssss sssssss mmmmmooooos oooooooosss ooommmmooo soosssss mmmmmooooos ooooooossss oooooocccc ssooossss mmmmmmoooo ooooooossss designssss ooooossss mmmmmmooooo ooooommmmmm oooooooddd ooooosssss mmmmmmoooo oooooommmmmms codeoooooo oooooossss mmmmmmmoooo ooooommmmmmms ooooooooooo ooooosssss mmmmmmmoooo ooommmmmmmm ommmmmmmmmo s————————s mmmmmmmooooo ooommmmmssss ommmmmmmmoo soooooosss mmmmmmooooo oooooossssss oosssssssss soooooooos mmmmmmmooooo ooooommmmsss oooosssssss ooosssssss mmmmmmmmmooo oooooommmmss ooooommmmms oooooooosss mmmmmmmoooo oooooommmmmm oooommmmmss oooooooooos mmmmmmmmoooo ooowessssss ooommmmmmms ooooooossss mmmmmmmmoooo oooossssssssssssssmmmmms oooooooosss mmmmmmmmmoooossssssssssssmmssssssssssssooooooooosss mmmmmmmooooooooossssssssoooooosssssssssssmmmmooooo mmmmooooooossssssssooommmmmmsssssmmmmmssssoooooos mmmmmmmmmmmmdesignmmmmmmsssssooooooosssssssssssss mmmmmmmmmmmmmmooooommmmmmmmoooooammmmaaaaaaaaaaas mmmmmmmooooommmmmmmm\mmmmmmoooommmmmmmmmmsssssss mmmmmmmmmmmmmmmmoooooooo\oooooommmmmmmmmmmssssss mmmmmmmmmmmmmmmmm/mmmmmandosssmmmmmmmmoooooosssss mmmmmmmmmsssssoooooosssssssssoooooommmmmmmmmoooos mmmmmmooooossssssssssmmmmmmmmmmmooooooooosssssssss mmmmmmmoooooo mmmmmmmmmoooooosssssssoooooommmmmmmmmssssssoooooos mmmmmmmmmooooommmmmmm mmmmmoooooooooossssssssooooooossmmmmcodeosssssssos mmmmmmmmmssssssooossoooom mmmmmoooooooooossssssoooooooooommmmmooooooooosssoos mmmmmmmmmooooooosssssssoooss mmmmmmmoooooossssssssmssssssmmmmoooommmmmmmssssssss mmmmmmmmoooooosssssoossssssssssoooooooooooossssssssssssssssoooooooosssssmmmmmossss mmmmmm/ooooooooossssoommmmsssssssssswessssssssssssooossssmmmmmmmmoooooooss mmmmmmmoooooooooossssssmmssssssssssssssssssssssssssooossssssssssssmmmmmsss mmmmmmoooooooossssssossssssssssssssssssssssssssssoossssssoooooooommmms mmmmmmmmoooooooosssoooooossssosssssssssssssssssoosssssssssoooooooos mmmmmmmooooooossssssssssdesignssssssssssssssssssossssoooooooooos mmmmmmmmmooooooosssssssssssssoooosssssssssossssossssmmmmmmmms mmmmmmmmmommmmmmmmsssssssssoooooooossssoosssooooooossoooos mmmmmommmmmmmmmmmmmmmmmooooooooosssssssssssooooooooooos mmmmmmmmmmmmmmmmmmmmmoooandmmmmmmoommmssssmmmmmmmmos mmmmmmmmmmmmmmmmmmommmmmmmmommmmmmooooommmmmmssss mmmmmmmmmmmommmmommmmmmommoooooooosssssssoooos mmmmmmmmmmmmmmommmommmmommmommmoooooooooooos mmmmmmmmmmmmmoommmomooomoooooocodeoooooooos mmmmmmmmmmmmmmmmmooooooooommmmmmmmmoooos mmmmmmmmmmmmmmoooooooooooooooommmmmmoos mmmmmmmmmmmmooooooooommmmmmmmoooooooos mmwemmmmmmmmmmmmmmmmmmmmmmooooommmoos mmmmmmmmmmmmmmmooooooooooooooooosssss mmmmmmmmmmmmmmmmooooooooooooooommoos mmmmmmmmmmmmmmmmooooooommmooooooooss desigmmmmmmmmmmmoooooooommoooosssss mmmmmmmmmoooooooommoooooosssssssssss mmmmmmmmmooooooommmmooooossssssssss mmmmmmmmooooandoooossssooooosssssss mmmmmmmmmmmooooooooomssssssssssssss