The objective was to elevate the visual appeal and user experience of the McClurg Electrical website by developing a suite of custom animated illustrations and icons for various sections. McClurg Electrical is a full-service contractor in South East Queensland, specializing in residential, commercial, and specialized rural electrical maintenance.
Context
The client needed a significant visual boost to their online presence to convey professionalism and modernity across their diverse service offerings (e.g., switchboard upgrades, rural pump maintenance). The core challenge was achieving this aesthetic upgrade—which traditionally involves high-bandwidth files—without compromising crucial website load speed and performance, which is a major factor for SEO and user retention.
Date Completed:
Jul 2024
Role:
Graphic Designer / Animator
Involvement:
Icon/Illustration Animation, Lottie Conversion, Performance Optimization, Vector Art Development
Website:
Overview
The strategic solution focused on leveraging Lottie animation technology. Lottie uses vector-based JSON files to play complex animations with the lowest file size possible, directly solving the performance conflict. The plan involved designing a suite of clean, vector-style icons that communicated the core service areas (power, lighting, rural equipment) and then rigorously optimizing the animation output for the lightest possible footprint.
Challenge
The main challenge was achieving a consistent, simple, and professional visual aesthetic across the full range of electrical services, from technical commercial solutions to specialized agricultural work, ensuring the iconography was immediately understandable in each context. Concurrently, the Lottie files required meticulous optimization to guarantee flawless playback across all devices and browsers while preserving the fast load speeds critical for positive SEO performance.
Solution
I developed a focused suite of vector illustrations, covering key areas like power poles, residential lighting, and switchboards, using a consistent brand color palette. The animations were designed with minimalist, smooth movement to ensure efficiency, and then expertly exported as Lottie files (.json). This resourceful technical deployment allowed the animations to function with minimal bandwidth consumption across the website, successfully delivering the desired aesthetic quality without sacrificing the site’s technical performance.
Results
The implementation of the animated Lottie illustrations successfully provided a significant aesthetic boost to the McClurg Electrical website. By utilizing the ultra-light Lottie format, the animations played smoothly and responsively across all site sections, effectively enhancing user engagement while preserving excellent load speed. This achievement reinforced the company’s professional image and directly contributed to supporting the overall SEO performance by prioritizing website speed.
Got something in mind?
Let’s build something remarkable together. Drop me a message and let’s chat.
