The challenge
Elevate the aesthetic to reflect the brand’s eerie, elegant identity. Streamline booking via FareHarbor integration. Improve accessibility and mobile usability. Optimize performance and SEO readiness. Provide tools for client independence and simple updates.
Process
Discovery & Planning
I audited the existing site and identified inconsistent branding, navigation issues, unoptimized images, and accessibility gaps. I set priorities around aesthetic cohesion, accessibility compliance, and streamlined bookings.
Design & Development
I implemented a dark, cinematic theme with high-contrast typography and atmospheric imagery. I rebuilt the homepage and tour pages for clarity, embedded FareHarbor booking modals, and applied WCAG-friendly markup and ARIA improvements.
Iteration & Feedback
I delivered updates in stages across July and August: copy/spacing refinements, favicon variants, footer restructuring, and mobile testing. This iterative approach kept the project on time and on budget.
Outcome
- Atmospheric & branded — a polished aesthetic reflecting the company’s identity.
- Accessible & responsive — improved usability across devices.
- Conversion-focused — clear CTAs and seamless booking flow.
- Maintainable — structured for ongoing client updates and maintenance.
Key Metrics & Impact
- Faster load times through optimized assets.
- Improved accessibility: screenreader support and verified contrast.
- Streamlined booking flow with fewer clicks to conversion.
- Elevated SEO readiness for D.C. tourism keywords.
Tools & Tech
React, HTML, CSS, JavaScript; integrations: FareHarbor, Formspree; Hosting: Verio, iPage; Accessibility: WCAG best practices.
Reflection
Designing for a ghost tour business required sensitivity to tone — eerie but elegant. By balancing storytelling with usability, the site better supports bookings and visitor engagement.