Gardens Website and Mobile Site

Showcasing a Canadian Treasure

The Butchart Gardens is one of the world’s premier show gardens and a designated National Historic Site of Canada. When The Gardens came to us, their team was struggling with an out-of-date website that was difficult to use and update. Overgrown text areas and innumerable links cluttered the site, hampering visitors from even finding the most basic information. The site also failed to reflect the beauty of The Gardens, which we found notably unfortunate, given the organization’s long history and banks of luscious imagery. This combination of unnecessary shortcomings made for an ineffective online presentation and generally frustrating user experience. more

Creating an Enduring Property

We worked closely with The Butchart Gardens to understand the needs and desires of their target audience. This lead to our goal of appealing to travelers, locals, and industry partners by showcasing The Gardens as a place of beauty, exploration, and inspiration. We wanted to thrill visitors through well-edited stories and stunning photographs that highlight the experiences to be found at The Gardens. The site needed to hold the audience’s attention by introducing prospective visitors to the physical space through maps, tours, and historical information.

Meanwhile, a blog would help Butchart make announcements and provide updates. A separate mobile site was also employed to meet the needs of audiences on the move. All of these additions and updates were informed with a timeless visual style, establishing The Gardens as an important institution, as well as a unique web property.

Take a Journey Down the Garden Path

The result is a presentation that feels almost like a window into The Gardens. In spite of the vast amount of content displayed, images take center-stage, showing macro-photography, experiential images, and garden vistas. The site also presents The Gardens’ unique offerings, ranging from first-class dining to their revered fireworks, concerts, and many other special events. An easy-to-use content management system, and a number of other automated functions, allow Gardens’ staff to take control of their website and tell their story. The Butchart Gardens site is intended to feel like a voyage, leading visitors down a path of discovery and guiding them through lush images and engaging information. Take a stroll through The Gardens yourself, at


The main Butchart Gardens homepage opens to an expansive vista, introducing The Gardens, and giving viewers an opportunity to (virtually) take a journey through it. Navigation is subtle and unobtrusive, while messaging is made central and updated seasonally.

Full screen treatments are used heavily throughout The Butchart Gardens’ website. In subsections like the one featured, users encounter a large image and can then click to advance to the next section—or use the side navigation to jump to specific sections.

A wide-variety of photographic treatments are found throughout the site. From experiential images of people within The Gardens, to vistas of the space, and even macro-photography, the visitor is rewarded for exploring the site.

The Butchart Gardens’ website features a number of details that make the site come alive. For example, custom ornaments have been designed for the feature pages, helping make a lavish and contextually appropriate welcome for the site.


A number of deep content pages help to introduce The Gardens to newcomers, and amalgamate a large amount of information into more easily digestible groupings. These pages feature a number of visually stunning collages that show the variety of experience to be had at The Gardens.


Custom templates used in The Butchart Gardens’ website help the organization present varying types of information in a suitable fashion. Pictured, from left to right: The Media section; an Events Calendar; a Photo and Video library.

Given traveling visitors’ specific needs, The Butchart Gardens utilizes a standalone mobile website that presents only the most relevant information to those prospective visitors who are on-the-go.


  • Research, discovery, and planning
  • Information architecture and user experience
  • Creative concept, visual direction, and design
  • Content strategy, creation, refinement
  • Website and mobile site development

Key Benefits

  • Rich imagery and visual elements grab attention
  • Simplified navigation improves user experience
  • Emphasis on history better tells The Gardens’ story
  • Mobile site gives essentials for those on-the-go
  • Intuitive tools ease site management


  • concrete5 CMS for main site
  • Integrated blogging platform
  • Tailored experience for mobile devices
  • Integration with a variety of third-party APIs
  • Select content provided in a wide variety of languages


“The people at smashLAB were very understanding of our unique business and at no point did we feel we were being pushed to templated designs. Their communications with us throughout the whole process were exemplary. They came as close as possible to making the creation of a new website fun.”