Kandy Trekking Tours
The Narrative
The client needed a way to showcase high-end trekking experiences that felt as immersive as the treks themselves. Existing solutions were too static and failed to capture the dynamic beauty of the Sri Lankan highlands.
I developed a high-performance frontend using Next.js 16 and Tailwind CSS v4. The site features a "Trek Finder" tool, immersive route showcases with topographic-inspired UI elements, and a seamless inquiry system using Resend.
Key Features
Immersive Trail Discovery
Interactive UI for exploring trek routes, including difficulty levels, duration, and elevation profiles.
Ultra-Performance
Optimized using Next.js App Router and server components for lightning-fast load times even with high-res imagery.
Guide Integration
Dedicated profiles for local guides, building trust and personal connection with potential travelers.
Engineering
// SYSTEM_OVERVIEW
Component-driven Next.js App Router architecture with a focus on SEO optimization, performance, and modular UI composition.
01_MODULE: MODERN RENDERING PATTERNS
Leveraging Next.js 16 Server Components to minimize the client-side JavaScript bundle, resulting in near-instantaneous page loads even on slower 3G connections often found in remote trekking areas.
02_MODULE: TOPOGRAPHIC UI DESIGN
Implemented a custom design system that uses SVG-based topographic patterns and CSS masks to create a layered, organic feel that mirrors the Sri Lankan landscape.