Website layout featuring three panels. The first highlights community-focused paving services with an image of a paving machine. The second advertises asphalt paving with a large machine on a road. The third discusses apprenticeship opportunities.

Location

Issaquah, WA

Established

Founded in 1952

Website

lakesideindustries.com

Industry

Asphalt Industry

Objective

Our objective was to update and modernize Lakeside Industries’ website, better showcasing their culture, values, and team in order to attract new customers and talent. The old website was outdated and didn’t have the engaging content or cool visuals needed to make a real impact. We wanted to help Lakeside stand out from the crowd and show that they’re different from other large corporations.

1 Capture High-Quality Assets

We first captured high-quality assets that would draw users in and show the Lakeside team in action. The homepage features a full-width hero video of a worksite using drone footage.

2 Custom Animations

We created three custom animated pages featuring a company history timeline, a careers map, and location filtering.

3 Modern and Seamless Design

The new website has a seamless and intuitive user interface enriched with optimized content, compelling visuals, and interactive elements.

Challenge

To meet the unique needs of Lakeside’s extensive network of locations and an array of open career positions, we needed to design custom animations. One of the main challenges of this project was the complexity of the custom animations and figuring out a seamless user pathway that made the most sense.

Our solution

We developed three custom animations: A company history timeline, a careers map, and location filtering. The timeline highlights key milestones in Lakeside’s journey, while the careers map links roles to educational levels and depicts pathways for career progression. Additionally, the location filtering feature streamlines access to location-specific information. These interactive elements enhance user engagement, adding a wow factor to Lakeside’s website and offering a fun, immersive experience for visitors.

Process of Lakeside Industries design

1 Research

We first conducted a comprehensive market and target audience analysis.

2 User Personas

We then created detailed user personas to hone in on Lakeside’s target market.

3 User Flow

Next, we meticulously mapped out the user flow on Lakeside Industries’ website.

4 Wireframe

Our wireframes served as blueprints, outlining the structure and layout of each page.

5 Design System

Implemented design systems ensuring consistency in branding, typography, colors, and UI elements across all pages.

6 Development

Through meticulous coding and testing, we ensure seamless functionality across devices and browsers.

Bar chart titled Age Distribution showing age groups on the x-axis and percentage on the y-axis. Light blue represents males, dark blue represents females. Highest for 18-24, decreasing across older age groups for both genders.

Research

We conducted a thorough analysis of Lakeside’s website to identify areas for improvement. This involved delving into their existing site structure, content, and user experience to pinpoint opportunities for enhancement. Additionally, we extensively researched Lakeside’s target audience to understand their personas, challenges, goals, and needs.

Key Findings

On the homepage, call-to-action buttons were missing along with key information like locations, careers, and latest news.
Missing clear calls to action buttons across the entire website.
Each service needed its own dedicated page.
The careers page did not provide enough information on the culture, testimonials, and benefits.
You could not get a feel for Lakeside’s company culture or values throughout the website.
Key employees were not highlighted.
The website lacked updated and visually compelling assets.
The project page was not accessible from other important pages on the website.

Recommendations

The homepage should be structured to provide key information & have clear calls to action to important pages. Contact us information should be readily available across the site along with the company location details.
Add in compelling calls to action across the site.
The website should have dedicated service pages to provide more information on the offerings.
The careers page must include key information such as benefits, testimonials, FAQs, etc.
Add engaging, high-quality photos and videos to capture users' attention. The website needed to showcase important information such as company history, awards & recognitions, and entry points to additional information on values – Safety, Quality, Community & Environment.
Add in headshots and job titles highlighting key employees.
Take new photos and videos highlighting the Lakeside team in action.
Add links to important pages like the home and services to the project page.

A laptop displaying a construction companys website homepage. The screen shows workers operating heavy machinery on a road with the text Paving the Way to Stronger Communities. The site has a dark blue header with a navigation menu.

UserPersonas

A circular graphic with the text Total Screen at the top and 40+ in large font below, centered against a white background.

Design System

We seamlessly integrated Lakesides fonts and colors to create a cohesive visual identity that resonates with the company's branding.

Helvetica Neue font showcase. Big dark blue letter A at center. Headline, Paragraph, Button styles on left; Regular, Medium, Bold weights on right. Alphabet in uppercase, lowercase, and numbers 0-9 displayed at the bottom. Dark blue background.

A dark blue background with a 12-column grid layout. The columns are labeled with widths: alternating between 78 and 24, repeated across the grid. Text at the top reads 12 Column Grid.

Visual Design

A laptop displaying a website with an image of construction workers operating machinery on a road. The header reads, Paving the Way to Stronger Communities. The laptop is placed on a rocky surface with a sleek, modern design.

A smartphone displaying a website stands on a metallic pedestal, bathed in soft light. The website has a blue header with icons, and text that says Paving the Way to Stronger Communities alongside an image of construction work.

A laptop displaying a construction companys website, featuring an image of an asphalt paver on a road. The website tagline reads, Paving the Way to Stronger Communities. The laptop is positioned on a gray, textured surface.

Smartphone displaying a website with the text Paving the Way to Stronger Communities, featuring construction imagery. The phone is propped on a reflective surface against a minimalist background.

We are very proud of what was accomplished. I would recommend Integrity Marketing and would use them again given the chance.

Integrity redesigned and built our new company website from the ground up. They did a fantastic job and I believe the website showcases our company well. Matt, Dylan, and their team were great to work with. They were very professional and ran organized meetings. They helped us navigate the creative process as well as the practical aspects.