Calendários de eventos na web são interfaces que indicam dias, semanas ou meses do ano para a realização de eventos. São utilizados por pessoas ou instituições que precisam registrar e/ou divulgar as datas de atividades realizadas ou a realizar.

Interfaces de calendários online são comuns em sites de museus, centros culturais, galerias e instituições com intensa programação de eventos, e em sites como os das companhias aéreas, em que o usuário dá entrada de data de começo e final de uma atividade.

Priorizam a localização de informações a partir de datas definidas, e partem do princípio que o usuário seleciona a data do evento para saber a atividade relacionada, ou seleciona a atividade para conhecer o momento em que se realiza.

No projeto de calendários online

interface8la_calendariosOnl

Opções de navegação no calendário

No exemplo acima, há uma lista de eventos que acontecem em cada dia na instituição. Há também, no submenu, grande número de opções de filtros para navegação entre os eventos, em categorias genéricas, como filme e vídeo, ou específicas para tipos de eventos, como Get Weird (acesso em 9.5.2013)

Oferecer opções de navegação alternativas à interface do calendário. Desta maneira, o usuário pode encontrar o evento de seu interesse através de listas organizadas por assuntos ou em ordem cronológica, se preferir não usar o calendário.

Prover opções de navegação diferentes da interface do calendário

Ao selecionar o link “Calendar” (Calendário) na página Principal no antigo site da Tate Gallery, encontrava-se uma tela semelhante à reproduzida abaixo. Nesta tela, os eventos eram localizados de três maneiras: 1) Selecionando uma data no Calendário mensal. 2) Selecionando uma data de início e uma data de final do evento na ferramenta ao lado do calendário, de acordo com atividade, galeria, ou hora da realização do evento. 3) Lendo a lista de eventos do dia de acesso, publicada abaixo do calendário, discriminados por galeria. A lista podia ser consultada no “modo ilustrado” (abaixo, tela de cima) ou no “modo conciso” (abaixo, tela de baixo).
Neste caso, o calendário não é a única ferramenta de localização de eventos, mas uma das ferramentas disponíveis.

As listas de itens facilitam a navegação de pessoas com deficiência, que não ficam confortáveis com a disposição tabulada dos elementos dos calendários convencionais e precisam se deslocar entre itens para encontrar o que procuram.

No caso da programação de eventos, os mais recentes, ou atuais, devem ficar localizados no alto. E eventos em continuidade (exposições em cartaz por longo tempo, por exemplo) podem ficar localizados mais abaixo, ordenados de acordo com a importância do evento.

Adaptar o calendário ao conteúdo a ser divulgado. O reaproveitamento de interfaces criadas para atender a necessidades diferentes das de um projeto em execução pode não atender as expectativas dos usuários.

Adaptar o calendário ao conteúdo a ser divulgado

O exemplo destaca os eventos da programação através de imagens, do fundo colorido e das molduras brancas que envolvem o texto de cada evento. No caso de instituições culturais, a publicação de fotos e imagens relacionadas à programação ajuda a contextualizar o site na sua área de atuação. No calendário, os dois pequenos menus abaixo do quadro habilitam a navegação não só pelos dias do mês como também por área de atividade e estado onde se realiza o evento.

Adaptar o calendário às condições de acesso dos usuários. Embora seja difícil atender a todas as configurações de browsers e dispositivos, é importante garantir as condições de acesso da maioria dos usuários com o mínimo esforço possível. → Exemplo

Apresentar um formato original e atraente. A consistência no alinhamento dos elementos, no uso de tipologias e estilos, bem como nas cores dos elementos reforça a confiança dos usuários nas fonte de informação.

O usuário deve encontrar sempre as mesmas cores na seleção do dia atual, por exemplo. Ou, nos calendários de companhias aéreas, os dias de partida e de chegada devem estar assinalados de modo uniforme.

As cores que selecionam os elementos devem mostrar bom contraste em relação aos outros itens, para evidenciar seu destaque

O calendário acima, localizado ao lado da figura do alto da página, mostra claramente, pela cor cinza, o dia do acesso, ou o dia da programação apresentada na página. Pode-se também verificar que os dias cuja programação não está disponível estão sinalizados pelo fundo cinza ligeiramente mais claro. Neste caso, a programação dos dias do mês anteriores ao da visita não está mais disponível, bem como a programação das terças-feiras, dia em que o museu está fechado. Também as cores dos links para os eventos, na área de conteúdo, mantém um destaque claro em relação ao texto, para facilitar sua identificação rápida e seleção.

As cores de seleção de itens contrastadas em relação às de outros itens, aumentam sua visibilidade. → Exemplo

Mostrar uma tela sem elementos demais, muitas cores, ou fundos saturados, para não dificultar a localização dos itens e sua seleção.

A publicação de anúncios nas proximidades do calendário também dificulta a discriminação dos elementos do calendário.

Diferenciar a cor dos links visitados dos não visitados, para facilitar a navegação entre eventos que acontecem em diferentes datas. Esta recomendação vale para a configuração de links na web de maneira geral, mas neste caso a proximidade entre os elementos faz com que a diferença de cor seja especialmente útil para a identificação das ações realizadas.

Atualizar automaticamente a interface quando novos eventos forem acrescentados, valorizando os mais atuais, ou os que acontecerão em futuro mais próximo, normalmente as que mais interessam aos usuários.

Em caso de provimento de horários de serviços, estes devem se adaptar ao fuso horário de quem os acessa. Este item é especialmente importante para o agendamento de viagens e compromissos, na medida em que nem sempre o usuário sabe a localização do sistema que gera a informação.

Oferecer a opção de envio de email para avisar sobre o evento/compromisso. Para cada evento, o usuário provê seu email e um lembrete com o dia e a hora são enviados para sua caixa postal.

Oferecer ao usuário a opção de envio de email para lembrá-lo do evento/ compromisso

Possibilidade de envio de mensagem por email para lembrança de um evento de interesse, com nome e a descrição de um evento e, abaixo, um formulário com campos de nome e email para preenchimento.

Facilitar o compartilhamento com sites de comunidades e atividades relacionadas.

Permitir a personalização da interface, no caso desta funcionalidade realmente contribuir para enriquecer a experiência dos usuários.

Permitir que pessoas com deficiência e acesso por browsers especiais cheguem ao calendário em modo texto, sem passar por tabelas com links.

(Atualizado em 30.9.2014)

Referências

Coleção de calendários, Chris Coyier (Codepen.io, acesso em 30.9.2014)

Bad usability calendar 2008, PDF,1.8MB (BadUsability, acesso em 13.4.2008)

Bad usability calendar 2007, PDF,1.2MB (BadUsability, acesso em 13.4.2008)