Web Booking (IBE)

Internet Booking Engine for airline.com flight search, booking, and trip management.

Scope

Booking Flow

Search: O&D, dates, passengers, cabin class
Results: Flight options, fare families
Select: Outbound and return selection
Passengers: Details, documents, contacts
Ancillaries: Seats, bags, meals, extras
Payment: Multiple payment methods
Confirmation: Itinerary and receipt

Manage My Booking

Retrieve by PNR + surname
View itinerary details
Add/change seats
Add baggage
Request special services
Change flights (if permitted)
Cancel booking
Add passengers (open booking)

Web Check-in

Online check-in (24-48h before)
Seat selection/change
Boarding pass delivery (email, wallet)
APIS collection
Dangerous goods declaration

Ancillary Shopping

Seat selection with seat map
Baggage purchase
Meal pre-order
Priority boarding
Lounge access
Travel insurance
Car rental, hotels (partner)

Research Topics

Architecture Considerations

Component Structure

src/
├── components/
│   ├── search/
│   │   ├── SearchForm.tsx
│   │   ├── DatePicker.tsx
│   │   └── PassengerSelector.tsx
│   ├── results/
│   │   ├── FlightList.tsx
│   │   ├── FlightCard.tsx
│   │   └── FareFamily.tsx
│   ├── booking/
│   │   ├── PassengerForm.tsx
│   │   ├── SeatMap.tsx
│   │   └── AncillaryGrid.tsx
│   └── payment/
│       ├── PaymentForm.tsx
│       └── CardInput.tsx
├── pages/
├── hooks/
├── services/
└── store/

State Management

interface BookingState {
  search: {
    origin: Airport;
    destination: Airport;
    dates: DateRange;
    passengers: PassengerCount;
    cabinClass: CabinClass;
  };
  selectedFlights: Flight[];
  passengers: Passenger[];
  ancillaries: Ancillary[];
  pricing: PriceSummary;
  payment: PaymentInfo;
}

API Integration

Endpoint	Purpose
`/api/shopping/flights`	Flight search
`/api/offers/price`	Price verification
`/api/orders`	Create booking
`/api/orders/{id}`	Retrieve/modify booking
`/api/seatmaps/{flight}`	Seat availability
`/api/ancillaries`	Available services

Integration Points

System	Direction	Purpose
Offer Engine	Outbound	Flight search
Order Service	Bidirectional	Booking CRUD
Seat Service	Outbound	Seat maps
Payment Gateway	Outbound	Payments
Loyalty	Bidirectional	FFP integration
Analytics	Outbound	Tracking

UX Best Practices

Search

Flexible date display
Recent searches
Autocomplete airports
Cabin class filter

Results

Clear price comparison
Fare family benefits
Flight time display
Connection warnings

Booking

Progress indicator
Form validation
Save and continue
Session timeout warning

Payment

Multiple methods
Saved cards
Price breakdown
Security assurance

Performance Optimization

Strategies

Code splitting by route
Image lazy loading
API response caching
Seat map virtualization
Critical CSS inlining

Caching

Data	TTL	Strategy
Airport list	24h	Local storage
Search results	15 min	Memory
Seat maps	5 min	Memory
User profile	Session	Memory

Accessibility

Requirements (WCAG 2.1 AA)

Keyboard navigation
Screen reader support
Color contrast ratios
Focus indicators
Error identification
Form labels

Testing

Automated (axe-core)
Screen reader testing
Keyboard-only testing
Color blindness simulation