Clean4ME — Website Redesign
Replacing a template with zero brand identity
Clean4ME was using a generic template with stock imagery, a mismatched colour scheme, and no clear service hierarchy — making them indistinguishable from competitors.
Designed and built a bespoke multi-page website using real photography, a brand-aligned palette, and clear service-focused information architecture.
From a template with no brand presence to a professional, SEO-optimised, mobile-responsive site that builds trust and clearly communicates services.
End-to-end ownership — research, Figma design, front-end build, animations, responsive implementation, SEO, and deployment.
Overview
This project started personally. My dad runs Clean4ME, a cleaning and property management business across the Highlands and Islands of Scotland — and I could see his website wasn't doing him justice. I offered to redesign it.
The original site was a generic Squarespace template with a burgundy colour scheme, stock photography, and a shopping cart feature they didn't need. Nothing about it said this is Clean4ME — no real photos, no personality, no trust. For a service business where customers are inviting strangers into their home, that's a real conversion problem.
“Nothing about the original site said 'this is Clean4ME' — no real photos, no personality, no trust. For a service business, that's a conversion problem.
Discovery & Research
I started by understanding the business properly — their services, their area, and what actually makes them different: a small, responsive local team that landlords trust to keep properties ready between tenants.
I then audited six competitor cleaning websites across Scotland. Most fell into two camps: overly corporate sites with generic stock photos, or bare-minimum single-page sites with no structure. The opportunity was to sit in the middle — professional but personal, structured but not sterile.
Three user personas emerged, each shaping different parts of the design:
Busy mum of two in Elgin. Works part-time and wants her home cleaned regularly without having to think about it.
- +Find a cleaner she can trust with a house key
- +Consistent quality without having to check up
- +Easy booking, no back-and-forth
- –Previous cleaners were unreliable
- –Can't tell from most websites if they're professional
- –Stock photos make every company look the same
“I just want someone I can rely on to show up and do a proper job.”
Owns three rental properties across the Highlands. Needs someone to handle changeovers and keep properties ready between tenants.
- +Fast turnaround between tenants
- +One point of contact for cleans and checks
- +Responsive when something comes up last minute
- –Current cleaners don't answer out of hours
- –No way to see if a job's been done properly
- –Tired of coordinating multiple contractors
“I need someone who treats my properties like I would — and picks up the phone.”
Manages a small accountancy firm in Inverness. Needs reliable office cleaning that works around business hours.
- +Clean workspace for client meetings
- +Evening or weekend cleaning so it doesn't disrupt work
- +Professional appearance for the office
- –Last cleaner left supplies out during client visits
- –Hard to find commercial cleaners outside the central belt
- –Most websites don't clearly list commercial services
“Clients walk in and the office needs to look sharp. That's non-negotiable.”
Design
I designed the full site in Figma before writing a line of code. The information architecture split into three focused pages — a homepage establishing trust, a dedicated cleaning services page, and a property support page targeting landlords specifically.
The colour palette was pulled directly from the Clean4ME brand — the blue from their van livery became the primary colour, with navy for depth. Every stock image was replaced with real photographs of their vehicles, completed jobs, and service locations. That single decision transformed how trustworthy the site felt more than any amount of styling could.
I also used Claude as a creative tool during the design process — generating a base to react to and push against, then directing and refining the design myself. This is increasingly how modern designers work, and it let me move faster without compromising quality.
Build
The final site was hand-coded using semantic HTML, custom CSS with design tokens, and vanilla JavaScript — no frameworks. GSAP with ScrollTrigger powers scroll-based animations, with all motion respecting prefers-reduced-motion for accessibility. The site was built mobile-first and deployed on Cloudflare Pages.
Full SEO implementation was included from the start: Open Graph tags, JSON-LD structured data, canonical URLs, lazy loading, and descriptive alt text throughout.
The site was coded using Claude, with me directing the output and making decisions about structure, content, and detail throughout.
Outcome
Clean4ME went from a template site with no brand presence to a professional, mobile-responsive website that accurately represents who they are. It now works as a genuine business asset — building trust with new customers and clearly communicating services at a glance.
Reflection
Working with a real business rather than a hypothetical brief forced sharper decisions — I couldn't hide behind lorem ipsum. If I revisited this, I'd push for user testing with real customers before finalising the IA, and explore a CMS so my dad can update content himself. The biggest takeaway: authentic photography transforms a design more than any amount of styling ever could.