312 Truck & Body Repair Website
Introduction
312 Truck Body Repair & Painting is a trusted name in commercial truck, van, and fleet repair on Chicago’s South Side. Despite their strong reputation, they had no digital presence—a significant gap in an industry where customers increasingly search online for auto repair services, price estimates, and reviews before making a decision.
Their challenge was clear:
- Attract new B2B clients by making their services easily searchable and visible online.
- Showcase their craftsmanship through high-quality visuals and client testimonials.
- Streamline the inquiry and service request process to reduce user friction and cognitive load.
A Digital Presence & Lead Generation System
Unlike businesses migrating from an outdated website, 312 Truck had no online footprint or credibility on platforms like Facebook, TikTok, and LinkedIn. This meant that potential customers landing on their site for the first time:
- Needed immediate reassurance that this was a legitimate, professional business.
- Would expect a modern, well-structured website like competitors already had.
- Would likely hesitate to call or request a quote if the site felt incomplete or outdated.
Since no prior website analytics or user behavior data existed, I turned to competitor analysis, UX heuristics, and conversion best practices to craft an experience optimized for trust, clarity, and customer action.
My Solution
The solution was to create a high-impact, conversion-optimized website that:
- Quickly establishes credibility through testimonials and past work.
- Encourages easy contact & inquiries via intuitive contact options and a dynamic lead form.
- Scales for future marketing efforts (SEO-friendly pages, HubSpot integration).
Key Functional Enhancements
- A mobile-friendly, yet desktop-optimized UI tailored to a B2B audience.
- SEO-optimized content strategy to promote visibility in competitive search queries.
- Automated lead capture & CRM integration via HubSpot.
Discovery
Understanding the Market & User Needs
To ensure the website met customer expectations, I analyzed industry leaders, partners, and competitors to identify pain points for B2B clients of auto-related websites.
Key Insights
- Customers expect transparency—unclear pricing or descriptions drives abandonment.
- The desktop experience is most important. Being a B2B provider, the client's mobile traffic could be as low as 16% (average for B2B) to around 40% (commercial automotive).
- Reputation matters more than aggressive marketing. Clients book services when they see real images of past work rather than stock photos or overly promotional language.
- Users need immediate, actionable contact options—the fewer clicks to request service, the better.
- Professional design influences client trust—clean layouts, high-quality imagery, and structured content contribute to credibility.
UX Strategy & Design Research
Trust Through Hierarchy & Brand Positioning
Scalable, Frictionless Lead Generation
Desktop-First Accessibility & SEO Optimization
Key Features & Execution
Wireframes & Prototyping
Notes
- Hero section includes a direct CTA ("Request a Quote") for immediate lead generation.
- Clear service categories help users quickly find relevant options.
- Step-by-step fields to reduce cognitive load.
- Photo upload option allows customers to attach images of vehicle damage.
- Ensured a thumb-friendly design with clickable elements for mobile users.
- Navigation simplified for one-handed browsing.
Wireframes
Results & Impact
Since 312 Truck Body Repair had no prior online presence, the primary success metric was establishing a solid foundation for discoverability and customer engagement. The new website is already serving as a central hub for inbound inquiries and brand visibility.
Early Indicators of Success
- 3m 25s average engagement time per session for the first 60 days, which is 72% higher than the industry norm. (Internal traffic was excluded from data.)
- Organic search impressions are increasing steadily, which indicates search engines are recognizing the site’s relevance.
Ad Campaigns In Motion
- Google and Facebook Ads are active and already generating leads.
- Email marketing campaigns are actively being set up to reactivate existing customers and warm new leads.
- As data accumulates, campaign performance will be optimized for conversion and lead quality.
Showcase
Check out the finished design below.
Lessons & Next Steps
What Worked Well
- Competitor research enabled a strong UX & conversion strategy.
- Automated CRM integration reduced the manual workload for the business owner.
- Balancing credibility with conversion-focused design improved customer engagement.
Opportunities & Next Steps
- Direct HubSpot-CCCIS Integration: The client is looking to move forward with "phase two" of this project, which includes deeper integration between HubSpot and CCCIS (a leading collision repair management system). This will allow seamless lead management, automated job tracking, and improved workflow efficiency—reducing administrative bottlenecks and improving customer communication.
- Expanding Content Strategy: Implementing blog content on fleet maintenance, common repair issues, and industry trends will further improve SEO and organic lead generation.
- Enhanced Customer Review System: Directly integrating customer testimonials into the homepage will further strengthen social proof and trust-building.
- A/B test form length to further optimize conversion rates.
- A/B Testing CTA Optimizations: Further testing CTA wording, form field arrangements, and microinteractions could refine conversion rates even further.
Project Schedule
I worked in close partnership with the client through each phase of the project, from initial discovery to final approval.
December 4, 2024
Discovery
Attended a number of meetings with the client to define goals, target audience, and market positioning. Analyzed competitors, industry trends, and key insights to inform strategic direction.
December 13, 2024
Prototyping
Developed mood boards, high-fidelity wireframes, and interactive prototypes in Figma to visualize design concepts. Collaborated with the client to refine and finalize their preferred concept.
December 28, 2024
Design
Built the sitemap, configured the tech stack, and implemented SEO-optimized copy for landing pages. Developed custom scripts, integrated plugins, and optimized site functionality for seamless performance.
January 15, 2025
Approval
Led final client review to ensure all project elements aligned with expectations and objectives. Secured approval, marking the project's official point of completion and the initiation of an ongoing design, marketing, and social media retainer.