Calendar
From Interaction-Patterns.org
Contents |
[edit] Calendar
also known as Schedule, Event Calendar
[edit] Quick Summary
A user needs to view time information across time. Users want to be informed about future or past events.
UC-Berkleiy, it's more about organizing information, compare, see time across time, let's say for events, even better would be to compare it with google's calendar or iCal, add it to iCal or a similar application.
Users want to be informed about future or past events. Present a list of events starting from the current date and allow users to select/search for other dates.
[edit] Visual Examples
| Found at www.sbb.ch | Found at www.visitmadison.com. This calendar isn't implemented using AJAX. |
[edit] Examples found on the World Wide Web
[edit] Possible Field of Application
- Use when you have date driven events, such as a class schedule, deadlines for paperwork submission, or a schedule of speakers.
- You are designing a site for an institution that organizes many off-line events. Typically these include a Museum Site, concert halls, educational institutes, governmental institutes etc. The number of events may range from just a view up to many per day.
[edit] Possible Solution
- Present a center list of events and allow users to search for or select other dates to see what events are when.
- The list should be central to your presentation. Each event listed should have at least a date and a brief description. Optional elements can include
- A link to a longer description
- A link to a related resource, such as a ticket purchasing site, the email of a person responsible for the event, or a form to download
- A link or button allowing the event to be downloaded in a calendar application format (Such as Outlook or CalAgenda)
- Location information if it is an off-line event
- 5. Restricting the events displayed to match the search scope or calendar control
- Search/Select. Allow the user to search and select based on criteria, preferably having them overlap. This could be accomplished by selecting from the calendar control, or by having them enter information in a form, or some combination. Some criteria to select/search on:
- Date range
- Categories
- Present a calendar control of some kind. This should be recognizable as a calendar, and include some way to select a specific day or date range. Some considerations:
- Consider a scope appropriate both to the space you have and the time frame represented. For instance, for events occuring over a semester, consider having as an option presenting the entire semester on one calendar control. On the other hand, your design may not allow that much space to be taken up.
- Optionally provide different views, allowing users to view a calendar by day, week, month, year, or specified date range.
Present a list of events starting from the current date and allow users to select/search for other dates
The basic concept for the event calendar is to place a central list of event together with controls for scoping/filtering the list of events.
List of events The list of events takes the Center Stage and may be displayed using Alternating Row Colors for increased clarity. Each event is listed with at least a date and basic description. Optionally, an icon or link can be used to add the event to a calendar program such as Outlook (a variation of the Collector pattern). Another optional element may be to include a Send-a-Friend Link so that event may be send to other people. In some cases, it may be possible that users can also add items to the calendar themselves: in that case, add an Action Button for that functionality.
Scoping Usually event calendars present the events per month, but views per day are also used when the number of events is very high. Using a Date Selector users can choose the month and/or date. When the event calendar only has events on some days, it is good to show that fact already in the Date Selector by coloring the days, making them bold or just making days with events linkable and others not. It is also possible to use other mechanisms for selecting dates or periods, for example using a search field or a timeline. Usually the scoping mechanism is placed above the list of events but depending on layout constraints it may also appear on the left or right of the event listing.
Filtering on categories When the events are numerous and can be categorized, it makes a lot of sense to allow users to filter directly on the categories. The categories can be presented as tabs, pull-down, or simply a list.
Searching For agendas with many events it may make sense to search through the how list. Usually, it is a simple version of Advanced Search that has been limited to the period, category and keyword.
The basic concept for the event calendar is to place a central list of event together with controls for scoping/filtering the list of events.
List of events The list of events takes the Center Stage and may be displayed using Alternating Row Colors for increased clarity. Each event is listed with at least a date and basic description. Optionally, an icon or link can be used to add the event to a calendar program such as Outlook (a variation of the Collector pattern). Another optional element may be to include a Send-a-Friend Link so that event may be send to other people. In some cases, it may be possible that users can also add items to the calendar themselves: in that case, add an Action Button for that functionality.
Scoping Usually event calendars present the events per month, but views per day are also used when the number of events is very high. Using a Date Selector users can choose the month and/or date. When the event calendar only has events on some days, it is good to show that fact already in the Date Selector by coloring the days, making them bold or just making days with events linkable and others not. It is also possible to use other mechanisms for selecting dates or periods, for example using a search field or a timeline. Usually the scoping mechanism is placed above the list of events but depending on layout constraints it may also appear on the left or right of the event listing.
Filtering on categories When the events are numerous and can be categorized, it makes a lot of sense to allow users to filter directly on the categories. The categories can be presented as tabs, pull-down, or simply a list.
Searching For agendas with many events it may make sense to search through the how list. Usually, it is a simple version of Advanced Search that has been limited to the period, category and keyword.
[edit] Rationale
- Calendars are familiar ways for the user to access information. Eventing information can be complex and have lots of events related to each other. This allows the user to see events and their relationship to each other in time and space. This can assist the user in planning, and allow them to make connections between events they might not otherwise have found.
- An event calendar is basically a long list of items that must allow filtering. By using the familiar Date Selector users can easily select the dates they are interested in. The additional filtering on categories provides an alternative way of finding the event that interest the users.
An event calendar is basically a long list of items that must allow filtering. By using the familiar Date Selector users can easily select the dates they are interested in. The additional filtering on categories provides an alternative way of finding the event that interest the users.
