Site of the Month: DIALOG

Silverstripe Professional Partner Evans Hunt recently launched a new site for Canada-based multidisciplinary design practice, DIALOG. The new site needed to provide a platform to communicate DIALOG’s complex service offering and represent their visually exquisite projects.  

Project background

DIALOG is a multidisciplinary design practice that sought an industry-leading website to welcome visitors to their increasingly global organization. With a complex service offering and the need to illustrate their work, culture and collaborative process, the new site needed to support intuitive navigation and provide a flexible canvas to share these stories. 

A crucial UI design consideration was the quality of visual assets depicting the work across DIALOG’s portfolio. From skyscrapers to bridges and urban plans, variable image aspect ratios needed to be front of mind alongside standard considerations for responsive design. 

From a data model perspective, DIALOG wanted to ensure visitors could easily see what projects their team members had contributed to, and enable users to browse related projects by both service and type. This drove much of the backend and administrator requirements definition. Perhaps most importantly, DIALOG needed to share their vision and purpose while inviting others to join them along the way.

Discovery and collaboration

Evans Hunt was able to establish a strong partnership with DIALOG at the outset of the project by conducting a robust discovery phase that laid the groundwork for the project’s strategic approach. Through a series of user and stakeholder interviews, Evans Hunt was able to develop key user personas and journey maps to define where and when primary audiences would reach DIALOG. Building from this shared perspective, Evans Hunt and DIALOG engaged in a multi-day design sprint to strategize the design approach for the new site.

Frequent collaboration, a parallel approach to content strategy and UI design, and robust early and late stage requirement definition ensured a “one team” approach moving from creative concepts to detailed designs. High fidelity prototypes were created prior to initiating frontend development to ensure the broad group of invested stakeholders at DIALOG understood the site’s vision from a visual and interactive perspective. 

Evans Hunt’s solution built on Silverstripe CMS

Evans Hunt began with building out the Silverstripe CMS backend, consisting of all the page types, content blocks, and supporting data structures carefully identified throughout concepting. This allowed the DIALOG team to begin entering in all their rich content as soon as possible. The team then focused on building all the templates that would bring this content to screens everywhere. 

Full page screen transitions, side scrolling sections, and parallax bring the site’s experience to life in new and unexpected ways. To enable this on the front end, the developers used GreenSock, ScrollMagic and fullPage.js as well as a ton of styles, javascript and intensive quality assurance testing across devices. 

The beautiful imagery across the site is handled responsively with lazysizes and picturefill on top of Silverstripe CMS’s templating. Evans Hunt invited DIALOG to upload their largest images and let the CMS do the rest; and while there may have been some regret about that during development when DIALOG’s 70 megapixel (yes, seventy) images broke the web server’s memory – the developer team worked through those issues. 

The result is a site that delivers the highest fidelity photography worthy of depicting DIALOG’s incredible body of work while also respecting performance.

Silverstripe CMS modules used on this project

A sample of some of the modules Evans Hunt used for DIALOG:

• dnadesign/silverstripe-elemental – Elemental allowed Evans Hunt to build rich, responsive, and user-friendly content blocks for use across the site.
• heyday/silverstripe-colorpalette – A nice UI field to allow authors to select from a colour palette.
• littlegiant/silverstripe-catalogmanager – Catalog Manager offered us an alternative to the popular Lumberjack module for handling and cataloging pages that don’t benefit from showing in the site tree interface.
• silverstripe/taxonomy – There were a lot of taxonomies on this site to manage all the types of data. 
• nblum/silverstripe-geocodefield – Geocode field allowed Evans Hunt a quick way to create consisting address information.

The results

The new website more accurately reflects our values and culture as a firm right from the front page. It is more graphically pleasing and provides a great first impression. The layout utilizes the entire screen, is easy to navigate and provides opportunities for us to provide specific featured projects or information that is relevant to our clients and market. This is a huge upgrade and reflects a more modern and current web content framework, far superior to our original website.

— Sara Remocker, Associate, Interior Design 

About Evans Hunt

Evans Hunt specializes in creating meaningful connections between people and brands through digital design. Their experienced team of 81 delivers fully integrated, multi-channel marketing solutions for top national and international organizations, with a specialization in branding, creative design, digital strategy, user experience design, digital advertising, eCommerce, mobile, search, and social media. They’ve been on the front lines of digital marketing for most of their careers, many of them having started back in the late 1990s.

Like what you see here?

If you’re interested in working with Evans Hunt, you can visit their website or contact them directly.