Introduction
Project Overview
Travel E Smart is a comprehensive travel technology platform built to connect a modern customer-facing booking and enquiry experience with the operational workflows used by travel agents behind the scenes.
The customer-facing website has been completely revamped using Next.js, providing a modern, responsive experience for customers searching for flights, exploring destinations, submitting Hajj & Umrah requirements, requesting visa assistance, and contacting the Travel E Smart team. The frontend communicates with dedicated PHP APIs and backend services, allowing the new interface to integrate with the company's existing travel infrastructure without requiring the operational backend to be rebuilt.
Behind the website is the Travel E Smart Agent Panel, an established PHP/CodeIgniter-based operational platform that we have extensively enhanced. It centralizes incoming enquiries, categorizes leads, manages agent ownership, supports self-picking and administrative assignment, tracks enquiry activity, handles unattended and recycled enquiries, and provides dedicated outbound workflows.
The system also integrates additional acquisition channels such as Meta lead campaigns, allowing enquiries from multiple sources to enter a common operational workflow.
Rather than replacing a working business system simply to modernize the frontend, the architecture separates the customer experience from internal operations. Travel E Smart can therefore continue evolving its Next.js website independently while retaining the mature workflows, historical data, and business rules already supporting its agents.
Mechanism
Project Description
Travel E Smart required modernization on two fronts: improving how customers interact with the company online, and strengthening how enquiries are handled after they enter the business.
The problem it solves
Travel enquiries arrive from different channels and represent very different customer needs. A flight enquiry, Hajj or Umrah request, and visa enquiry cannot always follow exactly the same workflow.
At the operational level, enquiries also move through multiple stages and users. Agents pick leads, add feedback, update statuses and follow up with customers. Administrators need broader visibility and control, while outbound teams require access to eligible enquiries without interfering with leads already being actively handled.
At the same time, the public website needed a significant technology and UX upgrade without putting the existing operational platform at risk.
The solution
We separated the platform into a modern customer-facing layer and a dedicated operational layer.
- The new Next.js frontend handles the public customer journey and communicates with PHP APIs responsible for processing enquiries and connecting with existing backend infrastructure.
- The Agent Panel continues to handle internal operations using the existing CodeIgniter/PHP architecture, enhanced with new enquiry categories, permissions, agent workflows, Meta lead processing, unattended enquiry management and outbound distribution.
Customer journey
A typical enquiry moves through the platform like this:
Customer visits Travel E Smart
│
▼
Selects a service → Submits enquiry
│
▼
PHP API validates and processes the request
│
▼
Enquiry enters the operational system
│
▼
Appropriate agents access and manage the lead
│
▼
Activity and status tracked through the Agent PanelThis creates continuity between marketing, customer acquisition and actual sales operations.
Primary Industry
Travel & Tourism. More specifically, the platform supports:
Travel E Smart operates as both a customer-facing travel platform and an internal operational system for travel professionals.
Roles
Who the End Users Are
Travellers & customers
Customers use the public Next.js website to explore Travel E Smart services, search and enquire about flights, submit Hajj & Umrah requirements, request visa assistance and contact the travel team.
Travel agents
Agents use the internal Agent Panel to access available enquiries, pick leads, manage assigned customers, add feedback, update enquiry statuses and maintain their daily follow-up workflow.
Administrators
Administrators have broader operational visibility and can oversee enquiries, agent activity, categories, assignments, statuses and other management workflows.
Outbound agents
Outbound users work with enquiries specifically allocated to outbound operations, while assignment safeguards help prevent conflicts with leads already being handled elsewhere.
Marketing & lead generation teams
Marketing-generated enquiries, including leads originating from Meta campaigns, are processed into the centralized enquiry-management workflow for agent follow-up.
Core Features
Modern Next.js Customer Website
A completely revamped customer-facing experience built with Next.js, providing responsive navigation, service pages, enquiry journeys and optimized mobile interactions.
Flight Enquiry Experience
Customers submit flight-related requirements through purpose-built forms connected to PHP backend APIs for processing and operational handoff.
Hajj & Umrah Enquiries
Dedicated customer journeys collect requirements relevant to Hajj and Umrah travel rather than forcing these customers through generic flight enquiry forms.
Visa Enquiry Management
Dedicated visa enquiry functionality supports visa type, customer information and additional visa-specific requirements throughout the enquiry workflow.
Centralized Agent Panel
A dedicated operational dashboard gives Travel E Smart staff a central location for managing incoming and existing enquiries.
Enquiry Categorization
Enquiries are categorized as Flight, Hajj & Umrah, or Visa, while acquisition source is tracked independently — enabling category-specific workflows without losing lead origin.
Multi-Channel Lead Management
The system handles enquiries originating from the website and operational channels such as calls, WhatsApp, Meta and other existing sources.
Agent Self-Pick Workflow
Authorized agents can select available enquiries themselves while existing business rules control availability and daily self-pick limits.
Role-Based Access
Administrators and regular agents receive different capabilities and visibility without granting unnecessary administrative privileges.
Enquiry Ownership Tracking
The system records who picked an enquiry and when, allowing ownership to be maintained throughout the follow-up process.
Enquiry Status Management
Operational statuses help teams distinguish active opportunities from completed, mature, unmature, duplicate, dummy and other workflow states.
Agent Feedback & Activity Tracking
Agents record customer interactions and feedback, creating an operational history for each enquiry.
Unattended Enquiry Detection
The system identifies assigned enquiries that have remained without qualifying activity for a configured period.
Controlled Enquiry Recycling
Eligible unattended enquiries can be released through controlled logic instead of remaining permanently assigned to inactive owners.
Outbound Enquiry Distribution
Dedicated outbound functionality assigns eligible enquiries to outbound agents while checking ownership and other eligibility conditions.
Assignment Conflict Protection
Existing ownership and active outbound assignments are checked to reduce the possibility of multiple agents unintentionally working the same enquiry.
Wrong-Number Handling
Wrong-number enquiries can be flagged and excluded from workflows where they should no longer participate.
Meta Lead Integration
Leads generated through Meta campaigns enter the enquiry ecosystem and are processed alongside enquiries from other acquisition channels.
Responsive Mobile Experience
The revamped frontend includes mobile-specific improvements to forms, cards, destination browsing, date selection, sliders and other customer interactions.
Search & Operational Filtering
Agent-facing enquiry tables support searching, filtering, pagination and category-specific operational views for working efficiently with larger datasets.
Technologies Used
Customer-facing frontend
| Technology | Purpose |
|---|---|
| Next.js | Public-facing application framework |
| React | Component-based customer interface |
| TypeScript | Type-safe frontend development |
| Responsive CSS | Responsive layouts and mobile experiences |
| JavaScript | Interactive customer-side functionality |
Backend & APIs
| Technology | Purpose |
|---|---|
| PHP | Backend APIs and server-side processing |
| REST-style APIs | Communication between Next.js and backend services |
| MySQL | Operational enquiry and application data |
Agent Panel
| Technology | Purpose |
|---|---|
| CodeIgniter | Existing Agent Panel application framework |
| PHP | Business logic and server-side operations |
| MySQL | Enquiries, assignments, feedback and operational records |
| JavaScript / jQuery | Interactive administrative functionality |
| DataTables | Searchable and paginated enquiry-management tables |
Integrations & infrastructure
| Technology | Purpose |
|---|---|
| Meta Lead Integration | Marketing lead ingestion |
| Git / GitHub | Source control and release management |
| GitHub Actions | Automated deployment workflow |
| cPanel / Linux Hosting | Application hosting and server management |
Architecture Overview
Travel E Smart uses a hybrid architecture that separates the modern public website from the established internal operational platform.
High-level flow
CUSTOMER CHANNELS
│
┌──────────────┼──────────────┐
│ │ │
Flights Hajj/Umrah Visa
│ │ │
└──────────────┼──────────────┘
▼
Next.js Frontend
│
▼
PHP API Layer
│
▼
Travel E Smart Backend
│
MySQL Data Layer
│
▼
Agent Panel
(PHP / CodeIgniter)
│
┌────────────────┼─────────────────┐
▼ ▼ ▼
Agents Admins Outbound TeamAdditional acquisition channels such as Meta feed into the enquiry ecosystem so that leads can ultimately be managed through the same operational environment.
Separation of concerns
- The Next.js application is responsible for the modern customer experience
- The PHP API layer handles backend communication and enquiry processing
- The CodeIgniter Agent Panel manages internal operational workflows
- The MySQL data layer stores enquiries and associated operational information
This architecture avoids coupling the new website tightly to the Agent Panel's user interface and allows each part of the platform to evolve independently.
Security & Access
Travel E Smart handles customer contact and travel enquiry information, so security and controlled access are important throughout the platform. Key safeguards include:
Development has also prioritized minimal, controlled changes to established Agent Panel functionality, reducing the risk of regressions in workflows already used by the business.
Deployment & Infrastructure
The revamped Travel E Smart frontend uses separate staging and production environments, allowing changes to be tested before reaching customers.
Staging
staging.travelesmart.co.uk
Used for development validation, responsive testing, API integration testing and approval of frontend changes.
Production
travelesmart.co.uk
Hosts the customer-facing production website.
Release workflow
Development
│
▼
staging branch
│
▼
GitHub
│
▼
Staging Deployment
│
▼
staging.travelesmart.co.uk
│
▼
Testing / Approval
│
▼
main branch
│
▼
Production Deployment
│
▼
travelesmart.co.ukThe frontend deployment lifecycle is kept separate from the Agent Panel so that customer-facing releases can be managed without unnecessarily affecting internal operations. The project uses Git/GitHub for version control, with deployment automation incorporated into the staging workflow and production deployment structured around controlled promotion to the main branch.
Platform Scale
The breadth of the system across customer and operational surfaces:
Enquiry lifecycle
Lead Acquisition → API Processing → Categorization → Agent Allocation
→ Customer Follow-Up → Status Management
→ Recycling / Outbound Operations → ConversionThis profile covers both halves of the platform: a non-technical reader gets the customer journey and operational workflow — how an enquiry travels from a marketing channel through to an agent and a conversion; a technical reader gets the hybrid architecture, stack, and deployment model that let a modern Next.js frontend evolve independently of a mature CodeIgniter operations platform.
