---
title: La Marie Vampire Facial — Test Case
type: article
created: '2026-04-05'
updated: '2026-04-05'
source_docs:
- raw/2025-10-15-la-marie-connect-service-page-tabs-94306503.md
tags:
- wordpress
- bookly
- la-marie-connect
- service-pages
- variants
- booking-integration
- test-case
layer: 2
client_source: null
industry_context: null
transferable: true
---

# 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 [[wiki/clients/la-marie-connect/index]] and the broader service page design discussion in [[wiki/meetings/2026-04-05-la-marie-connect-service-page-tabs]].

---

## 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 [[wiki/clients/la-marie-connect/index]].
- **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

| Owner   | Task                                                                                  | Status  |
|---------|---------------------------------------------------------------------------------------|---------|
| Ishaq   | Build Vampire Facial test case page with variant selector and per-variant Bookly routing | Open    |
| Melissa | Update ClickUp task with variant implementation details and client reference document | Open    |
| Melissa | Confirm with client: homepage "Book Now" → Square product listing page redirect       | Open    |

---

## 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.