01 — Overview
The Challenge
Nepal's trekking industry is one of the most important parts of its economy, yet the digital experience for trekkers remains fragmented and frustrating. Permits are applied for at different government offices. Route information is scattered across dozens of blogs and outdated PDF guides. Guide bookings happen over WhatsApp. There is no single trusted platform that handles everything end-to-end.
I designed and built HimalTrek Nepal as a self-initiated portfolio project to solve this — a comprehensive trekking platform that covers the entire journey from discovery to safe return. No existing Nepali trekking platform came close to this scope.
🗺️
Fragmented Information
Route details, altitude profiles, gear lists and weather data spread across dozens of unreliable sources with no authoritative single platform.
📄
Manual Permit Process
TIMS cards and national park entry permits require physical queuing at government offices, often taking a full day and causing trekker delays.
🏔️
Safety Gaps
Altitude sickness is a real danger above 3,500m. No existing platform offered daily AMS symptom monitoring or one-tap emergency SOS.
🛏️
Teahouse Uncertainty
Peak season (Oct–Nov, Mar–May) teahouses fill completely. Trekkers arrive exhausted at altitude to find no beds — a genuine safety risk.
02 — Scope
What I Built
This is one of the most comprehensive UI/UX portfolio projects I've built. The platform covers 8 distinct pages, 24 fully populated trek routes each with complete itineraries, a multi-step permit application flow, a guide booking system, a trek planner, and a full modal system for 6 different user actions.
01
Home — Route Discovery
Full trek grid with search, destination dropdown, date picker, difficulty filter and season strip. 24 routes rendered from a data array with dynamic cards.
02
Trek Detail Page
Per-trek page with tabbed itinerary, gear list, FAQ, reviews, booking widget with live price calculator, and "what's included" breakdown.
03
Permits & TIMS
5-step online permit application — permit type selection, personal details, trek details, payment, and digital confirmation. No queuing required.
04
Certified Guides
Guide directory with TAAN certification, first-aid status, languages, specialties and rating. Guide matching request form.
05
Trek Journal (Blog)
5 articles covering safety, route guides, gear and culture — with read time estimates and featured image cards.
06
Trek Planner
Personalised trek recommendation form — experience level, fitness, duration preference, budget. Returns matched routes.
07
Wishlist
Save treks across sessions using localStorage. Compare saved routes, see total cost estimate and book directly from the wishlist.
08
About, Careers, Contact
Company story, team stats, 4 open job listings with application flow, and a full contact form with 2-hour response promise.
03 — Key Features
Platform Highlights
Beyond the core booking flow, six features set HimalTrek apart from anything currently available in the Nepali trekking market.
🗺️Offline Trail Maps
Downloadable GPS maps work above 4,000m where signal dies. Built as a UX concept showing the app download flow.
📋5-Step Permit Wizard
TIMS, national park and restricted area permits applied in one flow. Digital issue within 2 hours — no government office visit.
⛰️AMS Altitude Checker
Daily symptom logging with personalised acclimatisation advice based on current altitude and trek day progress.
🆘Emergency SOS
One-tap alert sends GPS coordinates to the guide, emergency contacts and Nepal Police simultaneously.
🛏️Teahouse Pre-Booking
All teahouses confirmed before departure. No arriving at altitude to find no beds — a real problem in peak season.
❤️Wishlist & Compare
Save treks, compare duration/price/altitude side by side, and book directly. State persisted in localStorage.
04 — Design System
Colour & Typography
The visual language is built around trust, nature and adventure. Deep navy as the primary communicates professionalism and the night sky above the Himalayas. Gold as the accent reflects warmth, quality and the sunrise light that trekkers wake up for. Cream backgrounds give a natural, earthy feel without being cold.
Display / Headings — DM Serif Display
Trek Nepal with confidence & care
Body / UI — DM Sans Regular
Expert-guided routes across the Himalayas. Permits, teahouse bookings, real-time weather and emergency SOS — all in one place.
Labels / Nav — DM Sans Medium
Explore treks · Permits · Guides · Blog · About · Wishlist
05 — Design Decisions
Why I Designed It This Way
Every major UX decision in HimalTrek was made with one user in mind — an international trekker (most likely European, Australian or American) arriving in Nepal for the first time, excited but nervous about permits, altitude and safety. Here are the six decisions that shaped the experience.
01
Sticky search bar above the fold
The search — destination, dates, difficulty — is the first interaction. Making it sticky means a trekker can refine without scrolling back up. Reduces friction on the primary job-to-be-done.
02
Season strip as a trust builder
Displaying the 12-month trek season calendar immediately after the hero tells trekkers they are in the right place and shows expertise at a glance — no scrolling required.
03
Live price calculator in the sidebar
The booking widget updates the total in real time as trekker count changes. Seeing the exact cost removes the #1 reason users abandon bookings — price anxiety.
04
5-step permit wizard not a form
A 20-field permit form is overwhelming. Breaking it into 5 named steps (Permit Type → Details → Trek → Payment → Confirmed) makes each step feel small and manageable.
05
Emergency SOS in the nav concept
Safety is the biggest concern for trekkers' families and trip planners. Making SOS a first-class feature — not buried in settings — builds trust and differentiates from every competitor.
06
Gold on navy colour system
Every competitor uses green-and-white outdoor clichés. The navy-and-gold palette feels premium, trustworthy and unique — more like a luxury travel brand than a budget trekking directory.
06 — Reflections
What I Learned
HimalTrek was the most ambitious self-initiated project I've taken on. Building a platform this complex from scratch taught me several things I couldn't have learned any other way.
01
Data-driven UX scales better than hardcoded layouts. All 24 treks, their itineraries, gear lists and FAQs are stored in JavaScript arrays and rendered dynamically. Adding a new trek takes 10 lines of data — no HTML changes needed.02
Multi-step flows need progress indicators at every step. The permit wizard originally had no visual progress bar. Testing revealed users abandoned at step 3 without it. Adding the 5-dot progress bar reduced perceived complexity immediately.03
Real content reveals design problems that placeholder text hides. Using actual Nepali trek names, real altitudes and accurate pricing exposed layout breaks that Lorem Ipsum would never have caught — especially in the trek cards grid.04
Modal systems need careful state management. Six different modals (app download, contact guide, write review, booking, sign in, plan) all sharing one root element required careful open/close logic to prevent stacking and z-index issues.05
Tourism UX must address fear, not just desire. Most travel platforms sell the adventure. HimalTrek's competitive edge is addressing the fear — altitude sickness, permit confusion, no teahouse beds. Leading with safety features converts anxious trekkers better than beautiful photos alone.
If This Goes Live — Next Steps
HimalTrek is ready to be developed into a real product. Here's the roadmap if this were taken forward as a live business.
📱Native Mobile App
The offline GPS maps and SOS features need a React Native app to work properly. This is the most critical next step for safety.
🤝Guide & Teahouse Partnerships
Partner with 50+ TAAN-certified guides and 200+ teahouses across all major routes to make the booking backend real.
🏛️Government API Integration
Connect to Nepal's tourism department to issue TIMS cards and national park permits digitally — the product's biggest value proposition.
🏔️ Explore the Full Platform