 |
Examples of Work
|
|
When Wave Hill - a world renowned public garden
in the Bronx -
came to Alder, their website was limited and rather dated looking.
They wanted to create a website that would
represent Wave Hill as a unique aesthetic experience, showcase their
phenomenal garden photographs, publicize their many events, and provide
useful visitor's information. Alder created a beautiful, friendly,
and easily updateable Wave Hill website with all these features –
all on a limited budget. |
Defining the Website
|
|
We started the process with a set of workshops
geared to define the features that would meet Wave Hill's goals
and budget while supporting their audiences. In the first workshop,
we talked through Wave Hill's goals for the website – foremost,
to encourage website visitors to visit the gardens in person – and
developed a set of imaginary people to represent Wave Hill's diverse
target audiences (this is a traditional technique called “persona
development”).
In
our second and third workshops, we brainstormed and defined features
that would serve these goals and audiences. We decided to augment
the core visitor information with a robust and easily editable section
that allows visitors to explore the garden in all seasons, a detailed
calendar of events, a e-newsletter functionality, and several features
that allow seasonal site text and pictures to change automatically
according to the current month.
Alder
created detail diagrams of each feature and presented a specific
“Chinese menu” of prices to allow Wave Hill to decide precisely
what they wanted to build and spend. |
|
|
| Graphic
Design |
| One
Wave Hill's primary goals was to present visitors with a “visual wow”
experience which showcased their garden photographs. As the graphic
design was such a critical part of the site, we went through a detailed
design process. We started by talking through an “idea book” of other
websites and print designs in order to understand the general direction
that Wave Hill was hoping to go. We then presented five separate potential
graphic directions for the site. |
|
|
| Wave
Hill loved the second direction - with the tulips, above- but wanted
a cleaner look without as much text. We updated the homepage – to
create the current version – and moved on to designs for secondary
pages. Through an iterative process, we defined the layout for each
section, how the sub-navigation should work, and considered the detailed
graphic design for every page in the site. The result is a site that
is visually stunning – but that draws attention to the Wave Hill gorgeous
photos instead of to the graphic design itself. |
|
|
Functional Design
|
|
At the same time we were working on the graphic
design, we were also thinking though the structure and content of
the site in detail. Working closely with the client, we put together
a sitemap showing how each page fits into the site, and created
a prototype of the site to show the information and organization
of each page. We also created a detailed outline of the text and
images needed for the site to aid the Wave Hill staff in putting
together this content.
To
ensure that we were going in the right direction, we asked a set
of potential users of the Wave Hill site to work through a set of
tasks in this prototype – for instance, to find out what gardens
they should make sure to see for their visit in June. When users
were able to find their way around with ease, we knew the site design
was successful – and the user feedback gave us a chance to refine
the site further. |
|
|
Building the
Final Site |
With
the design complete, we created all of the actual webpages and the
code needed to make it all work. We spent more than two weeks testing
the site in detail – to perfect all the details, make sure everything
was working as specified, and ensure that each page looked its best
in all the common browsers. We had completed a site that included:
- A
sophisticated and updateable library of garden photos that allows
visitors to virtually experience each of Wave Hill's gardens in
each season
- An
easily maintainable event calendar that supports browsing by interest
or program and then displays detailed information and photos for
each event
- A
e-newsletter setup which allows visitors to sign-up on the website,
and Wave Hill to easily create and send out beautiful and timely
monthly newsletters
- Photos
and text which automatically update themselves according to the
month of the year
- More
than seventy pages of text and photos introducing users to Wave
Hill
View
the Wave Hill site now  |
|
Maintaining
the Site |
|
Any website will quickly become out of date unless
there is a plan to maintain it. The Wave Hill site was designed
to be updated in three different ways:
- Key
photos and text, particularly on the homepage, update automatically
according to the month of the year
- The
garden and events section, as well as one section on the homepage,
can be easily updated through a set of online tools. These tools,
available by logging into a particular website with a username
and password, allow Wave Hill staff to update the garden sections
and add new events by typing information into simple forms.
- Most
of the site is comprised of simple text and images pages. These
pages can be updated with a tool called Contribute. This tool
allows non-technical users to update or create new text, images,
and links like they would in an application like Word - even on
a complex site like Wave Hill's.
|
|
|
| |
| |
|
|
|
