Volt & Co. — Electrician Website Design
A Synkronix portfolio project Trade services / local business website design, built on Squarespace
Overview
Volt & Co. is a concept demo built to showcase how a local electrician business can present itself online with the same visual polish, trust signals, and conversion focus as a much larger brand — without losing the straightforward, no-nonsense character trade customers expect.
The goal was to move beyond Squarespace's default block layouts and build a site that feels custom-designed: full-bleed imagery, animated service showcases, and a colour system that reinforces trust and reliability at every scroll.
Results / Outcome
A distinct visual identity — the navy/amber/electric-blue system reads as purpose-built for an electrical trade business rather than a reused template palette
A more immersive first impression — full-bleed hero and service imagery replace flat, boxed-in default blocks, giving the site an agency-built feel
Consistent trust signalling throughout the scroll — reviews, certifications, and response-time stats are reinforced at the hero, mid-page, and testimonial sections rather than appearing once and disappearing
A responsive build that holds its proportions — from full desktop banner to mobile stack, spacing and type scale together rather than breaking down at smaller sizes
A reusable component pattern — the carousel and trust-grid code are modular enough to be re-skinned for future trade-service demos (plumbing, HVAC, landscaping) with a palette and copy swap
The Challenge
Most local trade websites fall into one of two traps: either a bare-bones template that undersells the business, or an overdesigned site that feels disconnected from the practical, get-it-done nature of the trade. Volt & Co. needed to sit precisely in between — professional and premium-feeling, but grounded and credible.
Specific problems to solve:
Squarespace's native blocks (basic image tiles, bullet lists) couldn't deliver the immersive, full-width service showcase the brand needed
Default content containers boxed sections in, working against the full-bleed, editorial feel the design called for
The initial colour palette read as generic "corporate premium" rather than something distinct to the electrical trade
Layout and typography needed to hold up across a compact banner size and full mobile responsiveness without breaking proportion
Interactive elements (carousel, hover states, scroll animations) needed to run reliably within Squarespace's code-block and platform constraints
The Solution
Custom-built sections over default blocks
Replaced static Squarespace blocks with hand-coded HTML/CSS/JS embeds for the two most important sections on the page:
"Our Services" — a full-bleed, auto-rotating image carousel with animated text overlays for each service (Emergency Callouts, Full Rewiring, Fuse Box Upgrades, EV Charger Installation, Lighting, Fault Finding)
"Why Choose Us?" — a 2×2 trust-signal grid with photo-backed cards, circular icon badges, and scroll-triggered fade-up animations
Proportional responsive scaling
Rather than treating desktop and mobile sizing independently, height, padding, and typography were scaled together at each breakpoint — preserving the same visual proportions from full-size banner down to mobile, instead of just shrinking elements arbitrarily.
Designing within platform constraints
Documented Squarespace's plan-level restriction on JavaScript/iframe embeds directly in the code handoff, so the client understands any platform limitation up front rather than mistaking it for a build error.