Transforming a Boring Engineering Website into an Innovative Destination Built for Engagement
KPFF Website Redesign & Development
Overview
KPFF is a multi-discipline engineering firm that offers Civil, Mechanical, and Structural engineering services and consulting to their clients. They are known for their innovative engineering solutions, many which are leading the way in environmental friendliness and sustainability. Equally important, they foster an engaging culture and exciting growth opportunities for engineers at all stages of their careers.
As one of the top engineering firms in the country, KPFF’s website and overall marketing strategy was leaving a lot to be desired.
Discovery
KPFF came to us with a lackluster website design that was confusing to navigate and didn’t spark any excitement about the incredible work they were doing across the United States.
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.
before
UX Strategy
By conducting a comprehensive website design requirements gathering meeting, interviewing key stakeholders, and participating in their Boot Camp orientation program for new hires, we gained a profound understanding of KPFF as a firm and how their brand story integrates into their engineering firm marketing strategy, particularly on their website.
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.
Build
With our page structure in place and content planned, it was time to jump into the fun part – the design phase.
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.
Test & Launch
When the coding was done, it was time to put the site to the test.
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!
Closing Thoughts
Delivering a one-of-a-kind experience, we successfully strategized, designed, developed, and launched one of the best engineering websites on the world wide web. A fresh, modern design with a unique scrolling pattern brings the site to life and embodies the innovative solutions and vibrant culture found at KPFF. With a site that now shows off who they are as a firm, KPFF can know that their transformed online presence is working hard to deliver exactly what’s needed to the potential clients, recruits, and KPFF employees that browse their website everyday.
View Site
Next up
