The Understanding Group (TUG)

View Original

Laying a Digital Foundation for National Expansion

Problem Statement

Progressive Companies (PAE) is a Grand Rapids-founded architecture, design and engineering firm quickly growing in size and market share. The firm sought a new name, brand and website to reflect their depth of expertise and expanding multi-region presence.

Progressive wanted to differentiate itself from competitors with a unique digital presence that was adaptable to changing market strategies and expanding content channels. To achieve this, they knew they needed a different approach, and partners that could help them define a resilient digital architecture and uniquely ownable brand expression.

PAE selected The Understanding Group (TUG) to lead information architecture design and Highland Group to transform the information models into the distinctive digital presence Progressive has today, with a focus on design, usability and content. The initial Program Charter tasked us to:

  • Establish Progressive’s vision for national expansion (answer the Why)

  • Define the scope and boundaries for digital expansion (determine the What)

  • Understand user context via marketing personas (name the Who)

  • Define the anticipated outcomes of the web redesign (define Success)

An Intentional Process Yielded Actionable Insights

A successful website anticipates the intentions and behaviors of its target audience, so TUG began with stakeholder interviews to define what a good website would look like. This work identified three very clear intentions for site visits: Qualify, connect, and explore.

Building on these needs, TUG conducted an In/Tension Modeling© workshop, where stakeholders voted on strategic aims, visualized competing tensions and aligned on a clear vision for the future. This work revealed the desired degree of change, and a content model roadmap to get there.

Additional analysis revealed three key user intentions to inform the new website’s structure: Showcasing Progressive work (stories and full portfolio), people, and values. These needs guided the structural model and sitemap.

Building on this model, TUG conducted additional user research with structural prototypes to validate several structural hypotheses:

  • Site Structure Can Be Different – A simplified structure will be accepted by visitors. 

  • Portfolio Pieces Tell Stories – How you display and talk about your work tells your brand's story. 

  • Context Matters: company values and thought leadership mean more when it shows up in context of projects and people.

  • The Website Represents how Progressive Views its People – Thoughtfully integrating people, and allowing them to be easily found, demonstrates how Progressive values its team members.

The Development/Design Solution

Highland Group took these validated findings and the prototype site map to begin website design and development.

Highland Group uses an agreement staircase approach to build consensus and client approval on technical, content and user experience needs.

technical focus: Selecting the right CMS to Achieve Client Management Goals

Progressive wanted a content management system that was easy to manage, with templates that made it easy to edit and create new pages. 

Highland Group recommended Webflow, an all-in-one visual editor and site builder that provides a high degree of visual control and a simplified tech stack. Webflow eliminates the security concerns related to multiple plugins and themes that are often found in other web content management systems.

content focus: Realizing User Journeys

To begin, Highland Group refined TUG’s site architecture into detailed wireframes that fully developed the user experience across the About, Projects and People pillar pages. Building out this experience also helped determine content direction. 

As a core value, Progressive believes strongly in Universal Design practices, including a high-level of accessibility for website users. So, while building out wireframes, Highland Group began planning for WCAG Level AA (“strong”) accessibility conformance, ensuring good color contrast, logically organized content *H1s, H2s, et cetera), consistent navigation elements, alt text, form field labels and more.

Based on a shared understanding with Progressive for how users might engage with the site, Highland Group designed high-fidelity page concepts to help create an intentional, on-brand experience. This design step required several explorations as Progressive determined how to best express its new brand identity in a digital format.

Design focus: Planning The Progressive Experience

Intertwining visitor site intention with the strategic tensions evaluated in the In/Tension Modeling workshop allowed TUG and Highland Group to re-imagine the relationship between industries, projects, people, geographies and thought leadership. By contextualizing these key pieces of content, visitors can control their user experience, directing the way they want to discover the company, its people and capabilities.

Detailed project pages connect areas of expertise, markets, subject matter experts, related projects and topics together. SEO-optimized content, imagery, graphics and videos narrate the Progressive story.

For example, a simple toggle changes the view of Progressive Experience from Timeline to Collections of projects, insights, news and awards. And every element within the Collections is thoughtfully tied to areas of expertise, markets and subject matter experts and other related projects or topics.

Each project and insight is written and art directed to convey Progressive’s expertise and values while thoughtfully integrating an SEO keyword strategy to help the company be discovered by people not already-familiar with the brand. Imagery, graphics and video support powerful storytelling.

Site Development and Launch

With aligned-on design and copywriting, Highland Group programmed the site — including 8 pillar pages, 272 projects, 166 insights, 66 news articles, 160 awards, 295 staff members and 23 partners — all inter-related to each other along with 10 markets and 21 corporate areas of expertise.

The team conducted QA testing against multiple devices (mobile, tablet, desktop) and browsers, confirming all integrations work as expected, there are no broken links, form submissions are routed correctly, the site meets Level AA  accessibility and pages load quickly.

Pre-launch work included connecting all relevant Google accounts and setting up all Tags and Events, and a final on-page and technical SEO check for page titles, meta descriptions, etc. All redirects are set and confirmed through a document that maps original URLs to all new URLs. 

Immediately post-launch, Highland Group re-confirmed its QA checks, validated schema code, reviewed Domain Authority and fixed any crawl errors to ensure the site performed as expected and can be found and viewed by search engines and people.

Project Results

Since the launch in March 2024, Progressive has delivered a website to the market that’s aligned to the strength and power of their brand in the analog world. Two major outcomes come from the combination of architecture, design, and technical quality of the new site:

Progressive now reaches and engages a broader audience - Traffic to the site from keywords has more than doubled, and 84% of that traffic is non-branded, compared to 55% pre-launch, meaning users are able to discover Progressive based on their areas of expertise, featured projects and other non-branded elements related to their business. 

The site is faster and easier to use - Page Speed scores for the new site are up significantly: Mobile page speeds are 86% faster, and desktop is 48% faster than the old site.

Related Case Studies

See this gallery in the original post