From Disconnected Tools to One Integrated Clinic — Privatklinik Kreuzlingen

Privatklinik Kreuzlingen is a private clinic for plastic, reconstructive and aesthetic surgery at Gaissbergstrasse 45, Kreuzlingen. When we analyzed the situation in spring 2025, the picture was clear: a competent clinic with well-trained staff, operating on digital infrastructure that was never built for them.

This article documents what we found, how we solved it, and how the same setup can be reproduced — step by step, technically complete.

The Starting Point

What we found was not an isolated case. It is the typical picture of a clinic that grew over years with whatever was available — never with a system designed for it from the start.

Website

The website ran on WIX. Sporadically maintained, barely optimized for search engines, with partially outdated content and no possibility for programmatic integration whatsoever. No API, no webhook, no technical foundation. Online booking was handled via an embedded third-party widget that communicated with neither the calendar nor the practice management system.

Booking & Reception

The booking system lived in its own world. It knew neither the surgery plan nor the PMS. The result: reception staff spent a significant portion of their working hours manually transferring information between systems — duplicate entries, missed follow-ups, chronic overload. The team worked hard, but against their own infrastructure.

Surgery Planning

The surgery plan existed in Excel. No real-time updates. No connection to inventory or material availability. No structured handoff to anaesthesiology. Every change required manual communication across multiple parties.

Practice Management

An older, proprietary PMS with no API interface, no export capabilities and no update roadmap. Classic vendor lock-in: the data was there but not usable.

Anaesthesia Documentation

A proprietary PDMS that digitized the paper process one-to-one — and stopped there. No discernible benefit over paper except the paper was gone. No integration with the surgery plan, no connection to clinical or administrative data.

Marketing & Tracking

Zero funnel tracking. No UTM parameters. No conversion attribution. The marketing budget was being spent without knowing whether it achieved anything. Which channel brought patients who actually had surgery and paid? Nobody knew.

The overall picture: a clinic running on human effort, not technical infrastructure. Dedicated staff spending a significant share of their energy manually bridging information gaps.

What We Built

We implemented Viali as a unified platform connecting every layer: marketing, appointment booking, surgery planning, anaesthesia, inventory management and management reporting. This article documents the first and most fundamental steps: the clinic's new digital infrastructure.

Step 1 — The New Clinic Website

From WIX to Next.js

The old WIX website was an endpoint, not a platform. It could neither receive nor send data, and every update required a technically confident person with CMS access.

We rebuilt the website entirely — with Next.js 15 and Static Site Generation (SSG). Developed on Replit with AI assistance, fully SEO-optimized, with automated Google Lighthouse tests as a fixed part of the development loop.

The result: 99 Performance / 100 Accessibility / 100 Best Practices / 100 SEO on Google Lighthouse — on the live production domain.

Technical Setup

The following configuration is used for both the viali.app marketing website and Privatklinik Kreuzlingen. It is explicitly optimized for AI agents — structured and commented so agents can read, apply and extend it without needing manual context.

import type { NextConfig } from "next";

const replitDomain = process.env.REPLIT_DEV_DOMAIN ?? "";

const nextConfig: NextConfig = {
  // lucide-react requires explicit transpiling (ESM compatibility in Next.js)
  transpilePackages: ["lucide-react"],

  // Replit proxy domains for CORS in dev mode
  allowedDevOrigins: [
    "*.replit.dev",
    "*.repl.co",
    "*.replit.app",
    "*.picard.replit.dev",
    ...(replitDomain ? [replitDomain] : []),
  ],

  experimental: {
    // Uses .browserslistrc for the SWC compiler → smaller polyfill bundles
    browsersListForSwc: true,
  },

  images: {
    // Modern formats: AVIF and WebP for better compression
    formats: ["image/avif", "image/webp"],
  },
};

export default nextConfig;

> 1%
last 2 versions
not dead
not ie 11

# --- DEVELOPMENT (default Replit workflow) ---
# Turbopack: hot-reload under 2 seconds, no CSP conflicts with Replit's proxy.
# Important: "next dev" with webpack fails in Replit's preview —
# Replit's CSP proxy blocks eval(), which webpack HMR strictly requires.
# Turbopack bypasses this entirely.
next dev --turbopack --port 5000

# --- BEFORE LIGHTHOUSE TESTS ---
# Step 1: Production build with webpack (not --turbopack)
# Turbopack produces ~45% larger JS bundles → lower performance scores.
# Always use the webpack build for Lighthouse testing.
npx next build

# Step 2: Start the production server
next start --port 5000

# Step 3: Run the Lighthouse test
# Afterwards: switch workflow back to "next dev --turbopack --port 5000"

Content Updates Without Developer Skills

A key advantage of this architecture: clinic staff can update content independently. They point the AI agent at the element they want to change, describe what should be different — the agent makes the edit, rebuilds the page, and it is live. No CMS training, no developer ticket, no waiting.

Step 2 — UTM & Referral Tracking → Viali Booking Integration

The new website is the first step. The second is full attribution: being able to trace every booking back to its original marketing source — and pass that information seamlessly to Viali.

What Gets Captured on First Load

When the page loads, the following data is read and stored:

• UTM parameters: utm_source, utm_medium, utm_campaign, utm_term, utm_content
• Google Ads click IDs: gclid, gbraid, wbraid
• Meta (Facebook / Instagram): fbclid, igshid
• LinkedIn: li_fat_id
• TikTok: ttclid
• Microsoft Ads: msclkid
• Auto-referrer detection: If no UTM parameters are present, document.referrer is checked against a known list (Google, Bing, Facebook, Instagram, TikTok, LinkedIn, etc.) and a synthetic channel is assigned — e.g. google/organic or instagram/social. Unknown external referrers get referral/referral, no referrer becomes direct/none.
• Fallback — manual source question: If auto-detection results in direct/none, the booking flow adds an extra step. A structured question actively asks the patient how they found the clinic. The answer — e.g. Social Media → Instagram — is passed as a manually confirmed value to the tracking object, overwriting the direct/none placeholder. No patient contact is left without source attribution.

Storage

All data is stored as a JSON object under sessionStorage key pkk_tracking. On internal navigation (same domain, no new UTM parameters or click IDs) existing session data is reused. A new external visit with UTM parameters or click IDs overwrites it.

Passing Data to Viali

When the user opens the booking dialog, buildBookingUrl() constructs the iframe URL dynamically with all collected tracking parameters. The full specification is published at use.viali.app/api.

https://use.viali.app/book/eq0E3SKW7kZl9id5Ce3BszaN
  ?embed=true
  &service=liposuction
  &utm_source=google
  &utm_medium=cpc
  &utm_campaign=body_contouring_spring
  &gclid=abc123xyz

Service selection

Patient prefill

UTM tracking

Ad click IDs — captured on the lead and echoed back through the Conversions API so ad platforms can match conversions to clicks.

Misc

Viali receives these parameters, attributes the booking to the original ad click, and makes it available in the CRM and conversion reporting — end-to-end, all the way to the completed and paid surgery.

Step 3 — From Booking to OR: The Patient Journey

Appointments Calendar

The moment a patient completes their booking, the appointment appears directly in Viali's calendar — no manual entry, no copy-paste, no phone call to reception. The day view shows every provider side-by-side with appointment status (Confirmed, Pending), patient name and procedure visible at a glance. Switching to week or month view gives the clinic team an immediate overview of capacity.

Automatic Confirmation and Reminder

The patient receives an automatic SMS and email confirmation immediately after booking — without any action from the clinic team. 24 hours before the appointment, a second automated reminder goes out. Both messages are generated and sent by Viali. Reception handles none of this manually.

Pre-Operative Questionnaire

When the patient arrives at the clinic, they fill out the digital pre-operative questionnaire on their phone or a tablet — before they even reach the front desk. The form is structured across multiple tabs:

• Personal data — name, date of birth, height, weight
• Allergies
• Medical conditions (Erkrankungen)
• Current medications
• Lifestyle — smoking, alcohol, physical activity
• Documents — upload of existing medical records
• Additional notes

The completed questionnaire is stored in Viali and immediately available to the anaesthesiology team — no paper forms, no re-entry, no information loss between reception and operating room. The anaesthesiologist reads the patient's allergies, medications and pre-existing conditions directly in the system, exactly where they need it, before the patient reaches the OR.

From Appointment to Treatment or OR

Once the questionnaire is complete, the appointment follows one of two paths depending on the procedure.

Direct treatment (e.g. Botox, fillers, minor procedures) — the practitioner opens a new treatment record directly on the patient. The form captures date and time, session notes and treatment lines — each line describing a product or procedure applied. Once documented, the record is signed and locked in the system.

Planned surgery — if the procedure requires the operating room, the appointment feeds into the OP Schedule. The surgical calendar shows all operating rooms side-by-side (OP1, OP2, OP3) with the assigned procedure, patient name and date of birth, and planning status. The schedule can be viewed by day, week or month, and supports request workflows for cases that need approval before they are confirmed on the OR block.

Both paths — direct treatment and planned surgery — are documented in the same patient record. No system switching between consultation, OR and billing.

Intraoperative Clinical Documentation

Once the patient is in the OR, the surgical team and the anaesthesiologist work in Viali simultaneously — each in their own view, both linked to the same surgery record.

Surgical side — the intraoperative record captures everything in real time: patient positioning (supine, lateral, prone, etc.) with free-text notes, disinfection, equipment setup (coagulation mode: monopolar/bipolar, neutral electrode placement, body side), counts and sterile goods, inventory used, and pre-op/post-op checklists. All structured, all timestamped, all stored in the patient record.

Anaesthesia side — the anaesthesiologist has a parallel view showing real-time vitals across the full duration of the procedure: blood pressure (systolic/diastolic), heart rate, SpO2, and monitoring parameters including BIS (brain state index) and TOF (train of four). Drug concentrations are tracked continuously — in this case Propofol Ce 1.7 and Remifentanil Ce 5.7. The timeline updates live and covers the entire duration of anaesthesia.

Automatic Inventory Deduction

Every item consumed during the procedure — medications, disposables, implants — is tracked on the inventory tab as the surgery progresses. At the end of the operation, a single "Commit Used Items" action opens the confirmation dialog with a pre-built list of everything recorded. Regular items (15 in this case, covering breathing filters, masks, antibiotics and other supplies) are committed in one click. Controlled substances — such as Fentanyl 50 µg/ml — are listed separately and require an additional digital signature before the quantity is deducted.

Once confirmed, all quantities are automatically deducted from the unit's inventory — no separate stock management step, no paper count sheet, no post-hoc re-entry.

When the surgery closes, both records are locked together — a complete, legally compliant surgical protocol, without a single sheet of paper.

Step 4 — Full-Funnel Attribution: From Ad Click to Revenue

Because every booking carries the UTM parameters and ad click IDs from Step 2, Viali can attribute every appointment and surgery back to its original source — automatically, without manual tagging. The Marketing module aggregates this into a single reporting view filterable by provider, source and campaign.

How Patients Found Us

For the period June 2025 – April 2026, Privatklinik Kreuzlingen had 109 total booking referrals. The channel breakdown:

• Social Media 60 (55%) — largest single source
• Search Engine 38 (35%) — split 56% organic / 44% paid on Google; Bing and DuckDuckGo account for the remainder
• Personal Recommendation 7 (6%)
• Other 3 (3%) / Marketing 1 (1%)

Conversion Metrics

Filtering by any combination of provider, source and campaign instantly recalculates all downstream metrics:

Funnel Stages by Source

The Funnel Stages chart shows the drop-off at each stage — Referrals, Appointments, Kept, Surgery Planned, Paid — broken down by channel. Social Media generates the most referrals (60) but converts at a lower rate than Search Engine, where organic traffic (Ref→Surgery 27.3%, Appointment→Surgery 54.5%) significantly outperforms paid (12.5% / 16.7%).

Per-Source Conversion Table

The breakdown table gives the complete picture across every source, including Paid vs Organic sub-rows for Search Engine and Social Media, with columns for referrals, attended, no-show, cancelled, surgeries, Ref→Surgery rate and Appointment→Surgery rate.

Conversions API — Feeding Back Real Results

Knowing which channel generated a booking is only half the loop. The other half is telling Meta and Google which of those clicks actually turned into a paid surgery.

Via the Viali Conversions API (use.viali.app/api), each conversion event — lead, appointment booked, surgery planned, payment received — is sent server-side back to the ad platform that generated the original click, matched by the original click ID (fbclid, gclid, etc.). Meta receives it through CAPI, Google through the Google Ads Conversions API.

The platforms use these signals to retrain their bidding algorithms: instead of optimising for clicks or form fills, they learn the profile of a patient who went through the full funnel and paid for a surgery worth CHF 6'000–30'000. Subsequent campaigns attract more of the same.

This closes the loop opened in Step 2: the UTM parameters and click IDs collected at booking become the conversion data visible here — tied to real surgery revenue, not just clicks or leads.

Conclusion

Before Viali, Privatklinik Kreuzlingen looked like most private clinics in Switzerland: technically operational, but fragile. A WIX website that could not be updated without a developer. A booking system in a separate silo. An OR schedule in Excel, shared by email. Anaesthesia documentation on paper. Inventory tracked in someone's head. Marketing spend with no connection to revenue.

The result was not a clinic that did not work. It was a clinic where every handover introduced risk — where a patient's allergy could sit in a PDF no one opened. Where a Botox campaign costing CHF 3'000 a month could not be traced to a single surgery. Where management had to ask four different people before getting a partial answer to a simple question.

Viali replaced this with a single system where every role in the clinic — reception, practitioner, nurse, anaesthesiologist, management — has access to exactly the information they need, at exactly the right moment:

• Reception sees the full day view with confirmed appointments and patient status.
• The patient fills the pre-operative questionnaire on their phone before they arrive.
• The anaesthesiologist reads the patient history before the patient reaches the OR.
• The surgeon documents positioning, equipment and checklists in real time.
• The anaesthesiologist charts vitals and drug concentrations live, in a linked view.
• Inventory writes itself off as items are consumed and confirmed.
• Management sees which source generated CHF 79'100 in surgery revenue — not clicks, not leads, but actual paid operations.
• Meta and Google receive the conversion signal and send more patients like the ones who actually went through with surgery.

The stored data does not sit in a database. It circulates: from booking form to calendar, from questionnaire to OR, from surgery record to inventory, from payment to ad platform. Every piece of information entered by one role becomes useful input for the next.

That is what a fully integrated clinic system looks like. Not more software — less friction, less risk, less manual work. And a complete, unbroken line from the first ad click to the last paid invoice.

If you want to build the same for your clinic, contact us.

Frequently asked questions

What did Privatklinik Kreuzlingen replace with Viali?

A WIX website, an isolated booking system, an Excel OR schedule, proprietary paper-style anaesthesia documentation and blind ad spend — all consolidated into one integrated platform.

What Lighthouse score did the new website achieve?

99 Performance / 100 Accessibility / 100 Best Practices / 100 SEO on the live production domain, built with Next.js 15 and static site generation.

How is booking attribution captured?

UTM parameters and ad click IDs (gclid, fbclid and others) are captured on first load, stored, and passed to Viali so every booking is traced back to its original marketing source.

How does intraoperative documentation work?

The surgical and anaesthesia teams work in Viali simultaneously in linked views — real-time positioning, equipment and checklists on one side, live vitals and drug concentrations on the other — and both records are locked together at the end.

How does inventory deduction work?

Items used are recorded during surgery and committed in one click; controlled substances require an extra digital signature, then all quantities are automatically deducted from stock.

What did full-funnel attribution reveal?

Across June 2025–April 2026, 109 referrals produced 13 paid surgeries and CHF 79,100 in revenue, with organic search converting better than paid, and conversions were fed back to Meta and Google via the Conversions API.

*More sections to follow: PACU, inventory management and management reporting.*