Transform Hakea
A polished, purpose-built website for a Christian prayer movement focused on the transformation of Hakea Prison, Perth.
A big thank you to Caleb for creating the Transform Hakea website for me. The website is clear, engaging and easy to navigate. He really understood what I was looking for and turned it into something that looks professional and polished. I am also amazed at how quickly it was completed without sacrificing quality. I'm extremely grateful and would happily recommend him to anyone needing a great website!
Liz
Founder of Transform Hakea
Overview
Transform Hakea is a single-page website built for a community of Christians who gather weekly to pray for the transformation of Hakea Prison in Western Australia. The site communicates the movement's vision, provides practical details about the weekly prayer gathering, and offers multiple ways to connect — all wrapped in a clean, branded design built for fast performance and search-engine readiness from day one.
Screenshots
What I Delivered
- Logo design — crimson and copper emblem with cross motif, optimised for web and social use
- Full website — design, development, and deployment from scratch
- Custom brand colour system (crimson, maroon, copper palette)
- Responsive layout for mobile, tablet, and desktop
- Hero section with automatic image slideshow and cross-fade transitions
- Animated FAQ accordion with smooth expand/collapse
- Sticky navigation with scroll-aware active-section highlighting
- SEO configuration — meta tags, Open Graph, Twitter cards, structured data, sitemap, robots.txt
- Static export deployment pipeline for Cloudflare Pages
- Calendar .ics file download for recurring prayer gathering
- Google Maps integration for venue directions
- Custom 404 error page
- Iterative content updates across multiple client revision rounds
Key Features
- Hero image slideshow with cross-fade transitions, dot indicators, and reduced-motion support
- Sticky frosted-glass header with IntersectionObserver-driven section highlighting
- Animated FAQ accordion with chevron rotation and CSS grid expand/collapse
- One-click .ics calendar download for a recurring weekly event
- JSON-LD structured data for SEO (Organisation and FAQPage schemas)
- Dynamic sitemap and robots.txt generated via Next.js metadata routes
- Open Graph and Twitter Card metadata for full social sharing support
- Partnership section with Prison Fellowship Australia branding
- Cross-promotion with Transform Fremantle sister movement
- Custom branded 404 page
Stack & Tooling
- Next.js 15 (App Router, static export)
- TypeScript (strict mode)
- Tailwind CSS 3 with custom design tokens
- Lucide React
- Cloudflare Pages (hosting)
- ESLint + Prettier
Integrations & Backend
- Google Maps — external directions link to Hakea Prison Visitor's Centre
- Calendar — client-side .ics file generation and download
- External links to Transform Fremantle and Prison Fellowship Australia
- Email (mailto) and phone (tel) contact links
Performance / SEO / Accessibility
- Fully static export with no server-side rendering dependency
- TypeScript strict mode with ESLint and Prettier enforcement
- Skip-to-content link, ARIA attributes, and focus-visible ring styles
- Prefers-reduced-motion handling for all animations
- Priority loading for above-fold hero images, lazy loading for the rest
- JSON-LD structured data, Open Graph, and Twitter Card metadata
- All images served locally — no external CDN dependency
Challenges & Constraints
- Static-only deployment with no server-side capabilities — all interactivity built client-side
- Multiple rounds of client content revisions requiring clean Git workflow and rapid turnaround
- SEO groundwork for a brand-new domain with no existing authority
- Balancing a premium feel with a simple, accessible experience for a non-technical audience
- Cross-referencing the Transform Fremantle sister movement without creating confusion
What I'd Improve Next
- Add a headless CMS so the client can update content without code commits
- Implement scroll-triggered entrance animations for section reveals
- Add privacy-respecting analytics to track visitor engagement