Remote Native  /  AI Layer Explorations
Design explorations · internal

AI Conversation
Layer Patterns.

Six design patterns for integrating an AI conversation surface into the website. Same brand vocabulary, different entry points and interaction models. Each pattern is evaluated for fit against the Remote Native positioning.

01 / Patterns

Seven patterns. Two categories.

Overlay patterns sit on top of every page. In-page patterns rebuild part of the page itself.

00
No AI layer — current stateReference
For
  • +All weight on the diagnostic + book CTAs
  • +Clean, deliberate — no widgets
Against
  • No way to ask a question without committing to the form
  • Doesn't reinforce the 'AI-native' promise visually
01
Floating bubble (default overlay)Overlay
For
  • +Persistent but unobtrusive
  • +Activates on demand without page navigation
  • +Works across all pages without redesign
Against
  • Competes with primary CTAs if styled poorly
  • Risk of feeling like a chatbot widget
02
Edge tab + side panelOverlay
For
  • +Clear visual affordance at rest
  • +Large surface area when open
  • +Doesn't occlude page content
Against
  • Unusual interaction pattern on desktop
  • Requires significant panel design work
03
Command bar (⌘K ask-bar)Overlay
For
  • +Keyboard-native — matches power-user expectation
  • +Brand-consistent with "operator" aesthetic
  • +Fast to invoke from any context
Against
  • Discoverable only if user knows the shortcut
  • Needs hint text or trigger button for non-technical visitors
04
Bottom dockOverlay
For
  • +Mobile-friendly interaction zone
  • +Keeps page content fully visible
  • +Familiar pattern from mobile apps
Against
  • Occupies fixed screen real estate permanently
  • Can conflict with browser navigation gestures
05
Hero-native conversationIn-page
For
  • +AI surface is the first impression
  • +Signals the "AI-native" positioning immediately
  • +No secondary widget needed
Against
  • Replaces proven book/diagnostic CTA in hero
  • Requires full hero redesign
  • Higher implementation complexity
06
Diagnostic-as-conversationIn-page
For
  • +Diagnostic becomes a guided conversation — lower friction
  • +Natural result delivery and follow-up in one flow
  • +Feels like the product is eating its own dogfood
Against
  • Complex state management
  • Must preserve all 12 scored questions and DSGVO consent
  • A/B test needed — may reduce completions
The real thing

The diagnostic is live.
5 minutes, scored result.

While the AI conversation layer is being evaluated, the 8-step diagnostic is already live. 12 questions, 6 dimensions, personalised result.

Take the diagnostic