Web Design

Establishing an Online Presence for Chicago-Based Auto Repair Shop

312 Truck Body Repair & Painting, a trusted name in commercial truck, van, bus, and fleet repair in Chicago’s South Side, contact us for a brand-new website. As a growing business, they needed a site that could (a) attract new customers, (b) showcase their impeccable work, and (c) create opportunities for ongoing customer engagement.

Over six weeks, we used WordPress and Bricks Builder to create a sleek, functional website tailored to their needs. With a focus on flexibility, conversion, and long-term marketing potential, the new site became a valuable asset for their business.

Website Build for 312 Truck Body Repair & Painting | Dane O'Leary Media
Project

A High-Impact Web Presence for 312 Truck Body Repair & Painting

Built a conversion-focused website for 312 Truck Body Repair, combining modern design with tools with dynamic flexibility, lead-gen forms, and HubSpot integration alongside implementation of industry-standard tools. This user-friendly platform simplifies customer contact, generates leads, and scales with their growing business.
Details
Role

Lead Designer

Industry

Automotive

Timeline

6 Weeks

Toolkit
Figma.logoCreated using Figma
Results

Boosted customer inquiries with intuitive design and prominent contact options.

Streamlined lead generation with a detailed intake form and HubSpot integration.

Created a professional, scalable website reflecting the brand’s expertise.

A Foundation for Growth

Strategic Approach

Homepage hero section, 312 Truck Body Repair & Painting | Dane O'Leary Media

With no prior website, 312 Truck Body Repair needed a platform that prioritized customer acquisition and showcased their professionalism. Our goal was to craft a user-friendly site that seamlessly connected visitors with the business while setting the stage for long-term growth.

How It Was Achieved

Easy Customer Contact
Key features like call and email buttons, along with a dynamic open/closed indicator, eliminated barriers to reaching the shop.
Optimized Lead-Gen
A comprehensive lead-gen form captured critical details—contact info, service type, vehicle data, and photos—helping qualify leads and reduce back-and-forth communication.
Marketing Enablement
By integrating HubSpot, we equipped the client to build an email list and execute remarketing campaigns, enhancing customer retention.
Modern, Scalable Design
Drawing inspiration from Tesla and Maaco, the site combined clean visuals with functional layouts that adapt to future needs. Responsive design ensured accessibility across devices.
Designing for Results

Preparation & Process

To build a site that was both visually engaging and strategically effective, I followed a multi-phase process:

1: Strategy & Planning
After building mood boards to define the visual tone, I completed a sitemap for intuitive navigation and began outlining a lead-gen funnel strategy to guide prospective clients toward action.
2: Concepting & Design
Wireframes mapped the structure and user flow, while high-fidelity mockups brought the brand to life with clean layouts, bold visuals, and strategic CTAs.
3: Feature Development
  • Dynamic Open/Closed Indicator: Scripted a real-time open/closed indicator (see image) so clients can more conveniently initiate contact with the shop; dynamically compares the user's time/date against the shop's business hours. (It even takes holidays into account!)
  • Comprehensive Lead-Gen Form: Designed to capture detailed, actionable information with minimal back-and-forth.
  • HubSpot Integration: Set the stage for email list-building and remarketing.
  • Responsive Design: Ensured accessibility across all devices.
312 Truck Body Repair & Painting website homepage, full page screenshot | Dane O'Leary Media
Blending Creativity + Strategy

Inspirations & Influences

The design drew inspiration from industry leaders like Tesla and Maaco, combining sleek visuals with practical layouts. Sites like Ford Commercial Vehicles influenced the commercial focus, while HubSpot and ServiceKing offered guidance on lead-generation and user engagement tools. This synthesis resulted in a modern, conversion-driven site tailored to 312’s audience.
Homepage

Tesla website, January 2025

MAACO website, Janaury 2025 | Dane O'Leary Media

MAACO website, January 2025

Ford website, January 2025

See More Projects