Synergy Construction

Project Description

Professional Service Website Design and Development for Bellevue-Based Construction Company

Since 1990, Synergy Construction has been delivering results on general contracting projects. The Synergy team is all about quality, innovation, transparency, and nurturing long-term relationships with its clients through peerless customer care. Specializing in sustainable, multi-unit, modular, and commercial construction projects, the Synergy team has built thousands of spaces over the past few decades and has strong relationships with clients and subcontractors alike.

Project Objectives

Synergy Construction was looking for a sophisticated website design to boast their penchant for high-quality work. They wanted their website to help them stand out from the competition and operate not only as a vessel for showcasing their stunning projects, but also as a tool to further their talent recruitment efforts.

Website Design and Development Successes

Our design is clean, bold, and lively. We worked with the Synergy team and some of our video-editing partners to create a homepage masthead video that shows off past Synergy projects; the Synergy logo fades in on the center of the page before retreating to the top left corner as hi-res project images cycle through. Our team developed the left-hand main navigation menu to briefly open so as to indicate to users where they can find site content; it then collapses into a three-lined hamburger icon at the side of the page. Additionally, the homepage masthead is overlaid with a subtle but unique and fun geometric animation that follows the cursor as it hovers over the space.

Scrolling down, animations highlight section headings and content areas while a subtle gray logo parallax scrolls in the background. White space is featured prominently throughout the homepage design, lending structure and balance to the crisp lines and bold gray and blue text content.

A background video adds character to the “Awards” section of the homepage, and a fade-into-black effect adds visual interest to the stats section right below that.

The interior pages are also clean and structured, with the portfolio pages being one particular highlight. The portfolio overview page features a floating grid of Synergy’s projects, with name and subtitle appearing on hover. The project detail pages are particularly eye grabbing, with Synergy’s hi-res imagery filling the entire background space of the screen. Users can toggle between project images either through use of the arrows on the right-hand side of the page or by scrolling up and down. The info block to the left collapses on scroll to showcase more of the image behind it and can be reopened by clicking on the info icon.

Additional design and development items around the site include custom contact forms, high-contrast typography, textured and image-based backgrounds using parallax scrolling, bold and easy-to-read profile pages, and more. Alongside the homepage, portfolio pages, case studies, and profile pages, we also designed and developed an about page template, service overview and detail pages, and a careers/contact page template.