La Marie Vampire Facial — Test Case

Overview

The Vampire Facial service page was selected as a proof-of-concept for implementing variant-style service pages on the La Marie Connect WordPress site. The goal is to present multiple service variants (e.g., different treatment options under one umbrella) through a unified UI, while routing each variant's booking flow to a separate Bookly service behind the scenes.

This test case was assigned to Ishaq following a team discussion on service page tab design. See the parent context in ^[1] and the broader service page design discussion in ^[2].

Problem Statement

La Marie Connect wanted parent umbrella service pages where a visitor lands on, say, a "Neurotoxins" page, selects a specific variant (e.g., lip fill, first-time tox), and sees the page content update dynamically — then books that specific variant.

The core technical constraint: Bookly does not natively support service variations. Each bookable option must be a separate Bookly service.

Proposed Solution

Treat each variant as a separate Bookly service, but present a unified single-page interface on the website:

1. A parent service page loads with shared content (general service description, imagery, FAQs).
2. A variant selector (tabs or dropdown) allows the user to choose a specific option.
3. Selecting a variant dynamically updates the page content (images, descriptions, pricing) relevant to that variant.
4. The "Book Now" button updates its target URL to point to the specific Bookly flow for the selected variant.

This means the site may have many Bookly service flows (one per variant), but the visitor experience is consolidated into a single page per service category.

Test Case: Vampire Facial

The Vampire Facial was chosen because it is a smaller, more contained service with fewer variants than something like Neurotoxins/ToxJuvo — making it a lower-risk first implementation.

Assigned to: Ishaq
Scope: Build a working single-page implementation with variant selector and dynamic Bookly button routing.

Acceptance Criteria

• [ ] Single WordPress page for Vampire Facial loads correctly
• [ ] Variant selector is present and functional
• [ ] Selecting a variant updates visible page content (images, description, details)
• [ ] "Book Now" button routes to the correct individual Bookly service for the selected variant
• [ ] No separate page load/redirect occurs when switching variants

Related Decisions

• Bookly workaround confirmed: Each variant = a separate Bookly service. The unified UI is a front-end concern only.
• No designer review needed for this test case — Ishaq is working from existing page assets already built.
• Homepage "Book Now" interim state: Until the Bookly variant system is live, the homepage Book Now button may redirect to a Square page listing all products. Melissa to confirm with client. See ^[1].
• Booking button filtering: Existing service page booking button filtering system (set up by Ishaq) is to remain in place — no changes needed per Chris.

Action Items

Notes

• The client (Roxanna's team) provided a reference document/sitemap showing how they envision the variant UI. Melissa to attach this to the ClickUp task for Ishaq's reference.
• This pattern, if successful, will likely be applied across other service categories (e.g., Neurotoxins/ToxJuvo, Microneedling).
• Scalability consideration: with many variants across many service categories, the number of Bookly services will grow significantly. Worth documenting the naming convention used so Bookly services remain manageable.