Travel & Hospitality
India
Product Development
ReactJS, Google Maps API, Razorpay, TripAdvisor API, REST APIs
Client Overview
Aertrip is a Mumbai-based travel technology platform offering flight and hotel booking across 500,000+ hotels in 15,000 cities — serving individual travellers, travel agents, and corporates across India. Their desktop platform and backend APIs were already fully operational.
They needed a mobile browser-specific frontend for their hotel module built in ReactJS, extending the booking experience to mobile users without any changes to the existing backend or APIs.
The Challenge
- No mobile-specific frontend existed for the hotel module despite a live, scaled desktop platform.
- Partially built UI components from the flights section needed adaptation for hotels.
- Complex map interactions — hotel clustering, price markers, and pin toggling — required custom ReactJS implementation.
- iOS app animations and gestures had to be assessed for feasibility and replicated within browser constraints.
- Six distinct modules needed simultaneous scoping: results, map view, filters, hotel detail, checkout, and payment.
Our Approach
1. Scope defined from designs, not assumptions
Classic Informatics worked directly from Zeplin screen designs and Postman API documentation to define scope module by module — ensuring every screen, component, and API integration was accounted for before development started.
2. Reuse before rebuild
Where the client's existing flights-section ReactJS components could be adapted for hotels, Classic Informatics reused them — reducing build time and maintaining visual and behavioural consistency across the product.
3. Feasibility-first on animations
Rather than committing to full iOS feature parity, Classic Informatics assessed each animation and gesture against ReactJS browser constraints upfront — so the client knew exactly what was achievable before development began.
4. Phased milestone delivery
Development was structured into four milestones — hotel results, detailed view and filters, checkout and payment, and trips — each with a defined completion date and linked payment, building client sign-off directly into the process.
What We Built
Hotel Search & Results
- Mobile hotel listing with distance-based sorting and sticky distance tags
- Skeleton loading state with disabled controls during API fetch
- Hotel cards with Aertrip star rating, TripAdvisor rating, pricing tiers, and favourite toggle
- Image carousel per listing card with optimised lazy loading
Map View
- Google Maps integration with up to six price-marker hotels visible at any time based on sort order
- Cluster icons for hotels sharing coordinates, with favourite state colour indicators
- Full-screen map mode on blank area tap; move-to-centre repositioning icon
- Horizontal card scroll below map with auto-pan to selected hotel pin
Filters & Search
- Sort options: best sellers, price, TripAdvisor rating, Aertrip star rating, distance
- Filter controls: price range, amenities, meal preferences, cancellation policy
- Real-time result count update in header on filter application
- Hotel name and address search with instant suggestions and highlighted search terms
Checkout & Payment
- Guest detail entry with room-wise adult and children breakdown
- Fare increase and fare drop confirmation flows
- Coupon application with live fare recalculation
- Aertrip Wallet toggle and Razorpay payment gateway integration
- Booking confirmation, itinerary email, and trips management screen
Impact Delivered
Aertrip's hotel booking experience — spanning search, map exploration, filtering, room selection, and payment — became fully accessible to mobile browser users across iOS and Android, without requiring a native app download or any backend changes.
Business Impact
- Mobile hotel booking extended to browser users across iOS and Android
- 500,000+ hotels across 15,000 cities accessible through the new mobile frontend
- Six end-to-end modules delivered: search, map, filters, hotel detail, checkout, and payment
- Google Maps integration with custom clustering and live price-marker logic
- Razorpay and Aertrip Wallet payment options live within the mobile web booking flow