As one of the top engineering firms in the country, KPFF’s website and overall marketing strategy was leaving a lot to be desired.
As one of the most purposeful and intentional engineering firms we have ever talked to, their website was doing a poor job of translating who they were as a firm to both potential clients looking for their services and recruits.
Extensive conversations with them allowed us to hone in on the need for a deep discovery process to figure out how to bridge the gap between where their engineering website was, and where they wanted it to be. Our team was dedicated to building them one of the best engineering websites out there, and we dove into this challenge enthusiastically.
One of the biggest things we uncovered during our initial conversations was the need to deliver a personalized user experience and website design for engineers in 3 very different audience groups. These 3 website audiences were potential clients interested in vetting their engineering capabilities, engineer recruits looking for career opportunities, and current KPFF employees working in 27+ different offices who wanted to stay in the loop with the innovative engineering solutions KPFF was creating day in and day out.
Once we had this solid foundation in place, we jumped into other activities to help us outline the best UX strategy. A competitive analysis allowed us to gauge the state of the competition and pull inspiration from website design patterns used on other engineering firm websites. We pulled successful UX patterns and design interactions into a moodboard that we would later use to drive the look and feel to ensure KPFF’s new site becomes one of the best engineering websites out there.
Perhaps the most important UX planning activity we did was build an extremely detailed sitemap. Laying out the page structure and information architecture was crucial in planning out the user pathways for each of their 3 engineering website audience groups. We went super in depth with the sitemap to make sure we knew what information was important to include before jumping into wireframes or website designs.
During the website design phase, we intentionally combined the brand typography, color palette, spacing, and imagery styles to tell the brand story in a visual way that would resonate with the 3 different audience groups.
KPFF wanted a website design that would stand out from the crowd of other engineering firm websites, so we introduced a unique scrolling pattern to the site. Instead of using the standard up and down (or vertical) scrolling design pattern, we laid things out so the site would move horizontally from right to left when scrolled. This fresh and modern design pattern symbolically embodies the innovative ideas KPFF brings to the table and makes their online presence different from all other engineering firm websites.
Once the design was locked in, we moved into development. Developing a horizontally scrolling website is easier said than done, but our programmers were up to the challenge and knocked it out of the park. Keeping in mind the website visitor’s experience on mobile devices, everything was programmed using responsive design. Clean custom code was written to follow best practices and in a way that makes it easy for search engines to read and index the content across the site for search engine optimization (SEO).
Everything was custom coded and integrated on top of the WordPress content management system (CMS), which is an extremely popular platform and completely secure when set up the right way. We programmed everything in the CMS to be easy for the KPFF marketing team to manage moving forward, and made pages with dynamic sections to allow for future flexibility as content was added to or removed from the site.
We ran the site through intense testing to make sure everything was working exactly as intended. We tested on all of the most popular browsers and devices so that it didn’t matter which one website visitors were using when they landed on the site – they would have an optimized experience and be able to form a great impression of KPFF. Once our internal testing was complete, we trained the team at KPFF how to update content through the CMS and started putting together a thorough launch plan.
With a comprehensive launch plan in place, we were ready to unveil KPFF’s beautiful new engineering website to the world. On launch day, our team delivered a white glove launch experience and the site was live!