Corporate & TMCs Pages
Relevant source files
The following files were used as context for generating this wiki page:Introduction
The Corporate (/corporate) and TMCs (/tmcs) pages are dedicated landing pages within the Grapevine website, designed to address the specific needs and value propositions for the two primary customer segments: corporate clients and Travel Management Companies (TMCs). These pages serve as key marketing entry points, detailing the benefits of the Grapevine platform tailored to each audience. Their primary goal is to educate potential clients and guide them towards booking a discovery call via the Contact page.
Both pages are built using a modular component-based architecture in Next.js and leverage a centralized SEO utility to generate structured data for search engines. While they share a similar structure and some components, the content, messaging, and specific components used are customized to resonate with their target audience.
Sources: app/corporate/page.tsx, app/tmcs/page.tsx, app/page.tsx:28-60
Page Architecture and Component Usage
The /corporate and /tmcs pages are constructed from a series of reusable React components. This approach ensures a consistent look and feel while allowing for content customization for each target audience.
Sources: app/corporate/page.tsx:4-11, app/tmcs/page.tsx:4-11
Component Composition
The following diagram illustrates the typical component structure for these pages, using the Corporate page as an example.
This diagram shows how the CorporatePage function assembles various UI components and uses JsonLd to inject SEO schemas generated by functions from lib/seo.ts.
Sources: app/corporate/page.tsx:29-158, app/tmcs/page.tsx:31-163
Component Comparison
While the pages share a common structure, they use slightly different components to best present information to their respective audiences.
| Component | app/corporate/page.tsx | app/tmcs/page.tsx | Description |
|---|---|---|---|
Hero | ✓ | ✓ | Main heading and call-to-action banner. |
AlternatingContent | ✓ | ✓ | Sections with text and images that alternate alignment. |
Usp | ✓ | 𐄂 | Highlights unique selling propositions with icons and descriptions. |
StatsHighlight | 𐄂 | ✓ | Displays key performance metrics and statistics. |
Features | ✓ | ✓ | Describes the "How it works" process with steps and pillars. |
TrustBuilder | ✓ | ✓ | Combines a feature highlight with customer testimonials. |
CtaSection | ✓ | ✓ | A final call-to-action section at the bottom of the page. |
JsonLd | ✓ | ✓ | Injects JSON-LD structured data into the page's <head>. |
Sources: app/corporate/page.tsx:35-158, app/tmcs/page.tsx:37-163
SEO and Metadata
Both pages implement a robust SEO strategy using Next.js's built-in Metadata object and a custom SEO utility for generating JSON-LD structured data.
Sources: lib/seo.ts, app/corporate/page.tsx:13-22, app/tmcs/page.tsx:13-23
Static Metadata
Each page exports a metadata object that defines the page's title, description, keywords, and canonical URL.
Corporate Page Metadata
// app/corporate/page.tsx:13-22
export const metadata: Metadata = {
title: "Corporate",
description:
"Keep travellers compliant, supported, and in-policy with Grapevine. Reduce leakage, improve compliance, and deliver a better employee travel experience.",
keywords: [
"corporate travel management",
"travel policy compliance",
"duty of care",
"business travel",
"travel programme",
],
alternates: {
canonical: "/corporate",
}
};
TMCs Page Metadata
// app/tmcs/page.tsx:13-23
export const metadata: Metadata = {
title: "TMCs",
description:
"Grow hotel and ancillary revenue with Grapevine. Our AI-native platform helps TMCs capture missed bookings, automate post-booking follow-up, and deliver modern traveller experiences.",
keywords: [
"TMC software",
"travel management company",
"hotel attachment",
"ancillary revenue",
"travel technology",
],
alternates: {
canonical: "/tmcs",
}
};
Dynamic JSON-LD Schema Generation
The pages dynamically generate and inject two types of JSON-LD schemas using helper functions from lib/seo.ts: Service and BreadcrumbList.
The following sequence diagram shows the schema generation and injection process.
This process enriches the page with machine-readable data, improving how search engines understand the content. For example, the Corporate page generates a Service schema describing "Grapevine for Corporates".
Sources: app/corporate/page.tsx:25-34, app/tmcs/page.tsx:26-36, lib/seo.ts:163-187
Audience-Specific Content
The core of these pages is the tailored content that speaks directly to the challenges and goals of each audience.
For Corporates (/corporate)
The messaging for corporate clients focuses on compliance, cost reduction, and employee support.
| Feature/Benefit | Description | Source Component |
|---|---|---|
| Reduce Leakage | Keep travellers compliant and in-policy to reduce out-of-policy spend. | Hero, AlternatingContent |
| Improve Compliance | Guide travellers to approved channels without restricting choice. | AlternatingContent, Usp |
| Support Travellers | Deliver a better, 24/7 supported employee experience. | AlternatingContent |
| Strengthen Duty of Care | Gain visibility across every trip to enhance traveller safety. | AlternatingContent |
| Secure Automation | Protect program data and maintain visibility with secure AI. | Usp |
Sources: app/corporate/page.tsx:36-111
For TMCs (/tmcs)
The messaging for TMCs focuses on revenue growth, operational efficiency, and competitive differentiation.
| Feature/Benefit | Description | Source Component |
|---|---|---|
| Grow Revenue | Capture missed hotel and ancillary revenue as airline margins shrink. | Hero, AlternatingContent |
| Automate Follow-up | Reduce consultant workload with automated post-booking engagement. | AlternatingContent |
| Enhance Brand | Offer a white-label AI assistant to deliver a modern experience. | AlternatingContent |
| Fast Go-Live | Activate the platform in under 4 hours of team time. | StatsHighlight, TrustBuilder |
| Measurable Uplift | Proven uplift in revenue per-trip (+31%) and profit per-trip (+110%). | StatsHighlight |
Sources: app/tmcs/page.tsx:38-103
User Flow and Call to Action
Both pages are designed to funnel users towards a single, primary action: contacting Grapevine. This is achieved through consistent "Book a demo" or "Partner with us" buttons that all link to the /contact page.
This diagram shows that users arrive at the TMC or Corporate pages either from the homepage or external sources. The CTAs on these pages then direct the user to the /contact page, which contains the ContactForm for lead generation.
Sources: app/corporate/page.tsx:40, app/tmcs/page.tsx:42, app/contact/page.tsx:29
Summary
The /corporate and /tmcs pages are critical, audience-specific marketing assets for the Grapevine website. They effectively use a shared, component-based architecture to present tailored messaging that highlights distinct value propositions for corporate clients and TMCs. By integrating a sophisticated SEO strategy and a clear, consistent call to action, these pages are optimized to attract their target segments and convert them into qualified leads through the central contact form.
Sources: app/corporate/page.tsx, app/tmcs/page.tsx