Suffolk Construction
Broadening the perception of a construction industry leader.
PROJECT
Responsive Website Redesign
ROLE
Lead Experience Designer
CLIENT
Suffolk Construction
CONTEXT
As the Lead UX Designer for the Suffolk project, I led a dynamic initiative to create a redesigned website that aimed to broaden the perception of Suffolk’s brand and capabilities. Suffolk is a giant in the construction industry, but they do a lot more than build buildings. They are leaders in technology, and have affiliates Suffolk Capital and Suffolk Technologies. The website also needed to serve as a comprehensive showcase of the company's diverse projects, processes, and people.
DESIGN CHALLENGE
Engaging with our internal Brand Strategy team provided valuable insights into Suffolk’s overarching brand architecture and their objective to transcend the perception of being solely a construction company. This involved extensive conversations with stakeholders across their three core divisions, gaining a nuanced understanding of both the business requirements and user needs within each sector.
OUTCOMES
Launched redesigned website in March 2021
(Suffolk elected to return to their original red-blue branding in mid-2022, however all experience aspects of the website remained as designed)
Design Process
The Challenge Spotlight
We were dealing with a broad pool of stakeholders across Suffolk’s three core businesses. This meant balancing multiple client opinions with known goals of the audience coming to the flagship website. This challenge also caused us to think about how to portray a company synonymous with construction, as more than a company that builds.
Stakeholder Goals & Opinions
Other Problems to Solve
This project kicked-off in February 2020, so COVID threw a spanner in the works and test our ability to work remotely.
COVID Workflow
PHASE 1
Discovery & Research
The client came into the project with a lot of preconceived ideas about what they wanted and their audience. The client in particular was a pleasure to work with and very informed, but as always we took this Research phase to better understand the space for ourselves, learn more about the audiences and their needs, and bring a neutral understand of the broad range of stakeholders and their business goals and needs.
Phase Deliverables
Consumer and Dealer audiences needed to be able to efficiently carry out their respective tasks within the same platform.
Site Audit
Consumer and Dealer audiences needed to be able to efficiently carry out their respective tasks within the same platform.
Target Personas
Consumer and Dealer audiences needed to be able to efficiently carry out their respective tasks within the same platform.
Competitive Analysis
Consumer and Dealer audiences needed to be able to efficiently carry out their respective tasks within the same platform.
Affinity Mapping
Competitive Analysis
Suffolk is largest construction company in Boston but is also growing to be one of the largest players nationally. We researched other leaders in the industry, assessing their digital properties and how they tell their story. We made a point to assess how other large players in the industry with multiple affiliates chose to promote these other facets on their flagship websites.
I performed this competitive analysis in tandem with a heuristic evaluation of Suffolk’s existing website, so also brought focus on how competitors followed standard usability principles.
Research
Collected information from 3 different surveys targeting Recent Hires, and working professionals both within and outside the construction industry.
User Research
We spoke with 11 stakeholders across a wide range of Suffolk’s internal teams. These interview were invaluable as it allowed everyone in the company to have a voice. Parties had different views and ideas around core goals of the site which led to great conversations and ultimately pivoting away from initial beliefs/ideas.
Stakeholder Interviews
User Research Findings
Site visitors want to know the people behind the company
Consumer and Dealer audiences needed to be able to efficiently carry out their respective tasks within the same platform.
Innovation is a core differentiator and a compelling selling point to clients
Suffolk’s different arms that support their core Build work should be incorporated into the website to support brand identity, but don’t currently warrant a home within main navigation due to differing audiences and stakeholder interests.
Users should be able to filter through Suffolk’s broad library of project case studies
The client stressed the importance of showcasing the wide range of projects. Job Seekers enjoy browsing Suffolk’s broad collection of works and building developers need to easily find out what a company has built in their associated sector and region.
Who We Designed For
Russell is a young professional eager to embark on a rewarding career journey within the construction industry. In search of a company where he can thrive and contribute meaningfully, he places a high value on collaborative team environments. His approach to career exploration is predominantly digital, browsing platforms like LinkedIn and Glassdoor. Russell takes the extra step of delving into potential employers' websites, aiming to gain insights into their work culture and the unique opportunities they offer.
The Job Seeker
Ted is a web-savvy prospective client seeking a construction company with extensive experience in similar projects and a local presence. He values cost-effectiveness, timely delivery, and technology application. Ted appreciates a positive company culture and existing relationships with subcontractors and government entities. He conducts thorough online and offline research, relying on his personal network for information and references. Ted aims to work with a top-notch team that impresses him and delivers exceptional results.
The Prospective Client
Rebecca is a seasoned professional known for elevating companies to national recognition. With a drive to surpass competition and contribute significantly to an evolving industry, Rebecca seeks a role that challenges and inspires growth. Dissatisfied with her current position, she leverages her extensive network for opportunities, relying less on online platforms. Rebecca prioritizes understanding her potential peers and delves into a company's future vision before committing, ensuring alignment with her aspirations.
The Recruit
PHASE 2
Site Structure
We worked closely with stakeholders to establish a site architecture that would make information easy to find for all audiences and ensure we achieved the right balance in addressing the Invest and Innovate arms of Suffolk.
Phase Deliverables
Conducted internal card sorting with Suffolk employees to help understand how users naturally group information.
Card Sorting Exercise
Site Map
Determined the hierarchy of pages for new and existing content.
Brand Architecture
Our work on the website redesign began after our Brand team concluded their work with Suffolk. This work focused on visual brand identity as well as brand strategy. The output was a new visual identity as well as a stronger understanding of the Brand Architecture. What we kept in the forefront of our minds as we entered the redesign was that Suffolk isn’t just a construction company. As their brand proposition puts it, they are a company with several affiliates, all coming together to drive the brand value proposition of “Invest. Innovate. Build.”
Card Sorting
We conducted 12 card sorting session with internal employees at Suffolk. Because of COVID restrictions we utilized an online tool OptimalSort to conduct the sessions. Insights gleaned from sessions with Suffolk employees illuminated logical content groupings. Notably, Locations and Projects showcased strong associations. Conversely, associations were less robust when it came to information about Suffolk's vision, innovation, and other forward-thinking programs. These findings dictated additional conversations with stakeholders and ultimately informed our site structure.
Site Map
Based on our findings and conversations with stakeholders, we determined the CoLabs would require a presence on the main Suffolk website given its close tie to the Build work and its use as a selling point for Suffolk’s customers. Suffolk Capital and Suffolk Technologies would not live within the main site but instead be featured on contextually relevant pages along with linkoffs to their corresponding microsites. These affiliates would also be accessible via the footer.
PHASE 3
Layout & Design
We worked closely with stakeholders to establish a site architecture that would make information easy to find for all audiences and ensure we achieved the right balance in addressing the Invest and Innovate arms of Suffolk.
Phase Deliverables
Wireframes
Wireframes for both mobile and desktop experiences were delivered. These were broken down into sprints and presented to the client for review.
Wireframes were annotated with content notes for our UX writer and functional specifications for our visual designer and development team.
Annotations
Wireframes
We constructed wireframes in sprints, breaking the site down into sections and compiling a library of components as we progressed through the sprints. I worked closely with our content writer to discuss goals for each page and partnered with our visual designer to discuss how we could creatively present information.
A site requirement was to ensure the website was easy to manage. This meant it was important to create a clear and concise library of components that would allow someone from Suffolk’s marketing team to routinely update content and create new pages if needed.
Functional specifications were shared with our internal development team and we maintained communication throughout the build phase.
Visual Design
Once we were comfortable with the UX and information hierarchy of the wireframes, I worked with our talented designer, Russel Yuan, to move into visual design. Drawing from our component library created during wireframes, and the color palette from the recently completed branding work, Russel crafted a design system that we could use to generate pages.
Project Reflections
Remote Work
Glimpse into the future of remote work and how crucial zoom/teams are as well as the plethora of digital tools are available for remote UX practices.
Importance of Stakeholders
It is always interesting speaking with people within the same company that hold starkly differing opinions.
Creating an Adaptable System
A year after launch, the client decided to revert back to their original branding. While this was tough to see given we all loved the shift in visual identity our brand team had created, this change to the digital property was implemented smoothly given our flexible design system and library of components.