The Hole in the Wall Gang Camp

Founded in 1988 by Paul Newman, The Hole in the Wall Gang Camp brings “a different kind of healing” to seriously ill children and their families.

Case Study:

Services:

Accolades:

  • CT Ad Club Gold: Website Design
  • CADC Silver: Website Design
  • American Graphic Design Award: Website Design
Desktop, tablet and mobile web design for The Hole in the Wall Gang Camp
The Hole in the Wall Gang Camp homepage, story page, landing page, and mobile.

The Challenge

Shortly after celebrating their 25th anniversary, The Hole in the Wall Gang Camp looked to redevelop their web presence to create a consistent user experience across several different audiences, intuitively organize their content, and convey the carefree spirit of camp.

Our Solutions

Site Architecture:

The first step of the process was to develop an intuitive site structure that would organize all content and make the most important information easily accessible. After working together to develop a site architecture that contained clear paths for each audience, Web Solutions provided a series of wireframes to map the new site navigation and to illustrate the user experience in major site sections.

Style boards for The Hole in the Wall Gang Camp web design
Wireframes

Design:

To imbue the website with the spirit of camp, members of the Web Solutions team interviewed key staff and toured the camp facility in Ashford, Connecticut. The result was a website design that captures the joy, playfulness, and sense of possibility experienced at camp.

Homepage 1
Homepage 2
Homepage 3
Homepage sections across desktop and mobile platforms

Utilizing responsive web design, the website is optimized for platforms down to tablet-size. A separate mobile version ensures the site is accessible to users on all devices.

The Story:

To showcase The Hole in the Wall Gang Camp’s unique community and tell the story of how they come together to create the magic of camp, we storyboarded and custom-designed the “Who is the Gang?” page.

The Gang 1
The Gang 2
The Gang 3
The Gang 4
The story page: Who is the Gang?

Accented with imagery, quotes, and animated graphics, the page takes a scrapbook approach to giving each audience a special spotlight.

Landing Pages:

In addition to the “Who is the Gang?” page, five other landing pages were custom-designed. Using clearly defined sections and anchor links for easy navigation, each page also uses high-impact imagery and engaging animations.

Landing Pages
Various landing page designs

Dynamic elements – such as a latest news feed – make it easy to keep these pages up-to-date.

Programs:

Whereas the “Who is the Gang?” page told an overarching story, the “Programs” page had to provide an overview of The Hole in the Wall Gang Camp’s eight programs.

Programs Pages
Programs pages and subs

Each program was introduced in its own section, but the consistent use of camp elements created a cohesive feel overall.

Custom Illustration & Animations:

While The Hole in the Wall Gang Camp provided some initial brand elements, the Web Solutions design team also created their own illustrations and animations inspired by the camp tour.

The wood texture that acts as the “foundation” of the website was custom designed, as were the wooden signposts that serve as links on the landing pages. The team also created several different versions of the bandit from the logo to act as a fun, mischievous presence throughout the site.

Custom Illustrations
Custom illustration elements

From a spinning sheriff badge and a hooting owl on the homepage, to fluffy clouds and kites swaying in the breeze on landing pages, the animations help to create a fun and engaging browsing experience without distracting from the messaging.

Calendar:

Another important goal for the site was to seamlessly integrate a new, robust calendar. Our design and technology teams worked together to build a single calendar that integrates all of The Hole in the Wall Gang Camp’s programs and events. The calendar also includes advanced filtering options, making it easy for users to find opportunities of interest.

Custom calendar module for Hole in the wall Gang
Calendar and list views

The calendar is just as efficient to manage on the back end, so it’s easy to add new events and keep users up-to-date.

Interactive Maps:

Web Solutions built two custom interactive maps for The Hole in the Wall Gang Camp website.

Custom maps for Hole in the wall Gang
Camp grounds map and partner locations map

To give users a sneak peek of the summer camp setting, we created an interactive camp map, complete with pop-overs to learn more about key locations.

Designed with a brightly colored map and corresponding pop-overs, the Partner Locations map gives users an overview of how the Hospital Outreach Program is organized across the Northeast, and lets them see which hospitals participate in the program.

The Results

The Hole in the Wall Gang Camp website launched on January 26, 2015 to coincide with “Founder’s Day,” Paul Newman’s birthday. The new site offers a much-improved user experience as well as a simplified, streamlined experience for back-end users. At almost 200 pages, the site is robust without feeling overwhelming – it is able to address multiple audiences while conveying the spirit of camp to each.

#