Troose Tours
Tour company website
A website for a small travel company that runs private trips from India to Japan. Instead of a photo slider, the homepage is a little journey: a goose walks across the globe from Delhi to Tokyo as you scroll, then hands you the trip.
Visit Live Site
Most tour websites look the same: a photo slider, a price table and a form. A new company with no reviews yet needs people to remember it, and to trust it with a trip that costs more than a month’s salary.
Top highlights
A trip you take by scrolling
Troose the goose stands on a 3D globe with a map over India. Scroll and it folds the map, tucks it under a wing and walks east. The globe turns under its feet, a dashed trail follows it, and a counter ticks down the kilometres to Tokyo. Scroll back and everything rewinds.
Landmarks that pop up like a book
India Gate, Qutub Minar and the Taj Mahal rise out of the globe, then fold away behind the horizon. Mount Fuji, Tokyo Tower and Skytree pop up as Japan comes into view. The sky turns from a Delhi morning to a Tokyo dusk, and paper lanterns light up on arrival.
Nine days, one dashed line
The itinerary is a timeline drawn in the same dashed style as the map in the logo. Each day shows the city, what you will see, where you sleep and a photo. All of it comes from one data file, so adding a new trip means adding data, not rebuilding pages.
Two clear packages and a booking form
Flock includes the return flight; Waddle is the same trip for people who book their own. Prices are in rupees, extras like a SIM card are a tick box, and small question marks explain what each inclusion means. The booking form saves every request before it emails the team.
Questions answered by the goose
Ask the goose about what is included, vegetarian food, visas or the days of the trip. It only uses the trip details on the site, so it never makes up a price or a date, and when someone is ready it shows a Book now button.
Behind the site, for the team
Bookings and messages in one place
Every booking request and contact message lands in the admin, where the team marks each one as handled.
Email settings without a developer
The team sets the email account in the admin and sends a test email, so notifications keep working without touching code.
Search for everything
Press ⌘K (or Ctrl K) to jump to a tour, a city, a page or the booking form from anywhere on the site.
Project overview
- Client
- Troose Tours, a small travel company running private trips from India to Japan, with a team in India and Japan.
- My role
- Design and development of the whole website: the scroll story and globe, the goose animation, the tour pages, booking, the chat assistant and the admin.
- Deliverables
- Scroll-driven homepage with a 3D globe and an animated goose
- Itinerary, packages, gallery, reviews and FAQ for the Tokyo trip
- Booking form and contact page
- Chat with Troose the goose, an AI assistant
- Site-wide search (⌘K)
- Admin for bookings, messages and email settings
- Status
- Live at troosetours.com.
Want a site in English and Japanese for visitors from abroad? See my bilingual website design.
Technical details for developers
Stack, architecture and how it is built.
Stack
Architecture
One progress value drives the hero
The pinned hero turns scroll into a single smoothed progress value from 0 (India) to 1 (Japan). The globe, the goose, the landmarks, the sky, the stamps and the distance counter all read that one value through a small React context, and every threshold lives in one timeline file. Because everything is a pure function of progress, scrolling back rewinds the walk exactly.
A hand-drawn look in 3D
The globe is three.js through React Three Fiber, with land drawn from world-atlas data and toon shading. Trees and clouds are instanced meshes with an ink outline hull, two draw calls each, so the 3D matches the flat, thick-outlined style of the goose logo. The goose itself animates the original logo paths rather than a redrawn copy.
The goose chat
A route handler calls Claude Haiku with a system prompt built from the same tour data file as the pages, so the assistant can’t drift from what the site says. Conversations are capped in length and rate-limited per IP. When it suggests booking it ends with a token that the site turns into a Book now button.
Highlights
Saved Before Emailed
Bookings and messages are written to Cloudflare D1 first, then emailed, so a mail outage never loses a request. The site runs on Cloudflare Workers through OpenNext.
Locked-Down Admin
The admin password is stored only as a scrypt hash, sessions are signed, and forms and sign-in are rate-limited by the visitor’s real IP.
Want something like this?
I build websites people remember, with the booking and enquiry tools a small business needs behind them.