Chat on the Side UI Pattern

Type: User interface pattern

Definition

"Chat on the Side" is the emerging standard UI for integrating LLMs into existing applications. The pattern places the application's normal interface on one side and an LLM-powered chat panel on the other. The user interacts with the LLM through natural language, and the LLM can read and act on the application's data and functionality.

Cursor popularized this with VS Code on the left and chat on the right. App builders (v0, Replit, Lovable) flipped it: chat on the left, built application on the right. Google Apps are adding suggestion panels. Enterprise tools (Marin Software / Gauntlet AI) are adopting the same pattern.

How It Works

  • Left side: The application's existing UI (code editor, spreadsheet, marketing dashboard, etc.)
  • Right side (or left): A chat panel with a text input connected to an LLM
  • LLM has tool access: Can read application state and take actions via exposed APIs
  • Bidirectional: User asks questions (read) and gives commands (write)

The pattern is intuitive because it mirrors how humans already work — main task on one side, assistant conversation on the other.

Key Properties

  • Familiar — no new UI to learn; AI appears alongside existing tools
  • Progressive — can start with read-only Q&A, gradually add write capabilities
  • Universal — works for IDEs, spreadsheets, dashboards, CRMs, any application
  • Low friction — chat is the most natural interface for LLM interaction
  • Trust-building — visibility into what the LLM does (via diffs, previews) builds confidence

Variants

  • Code editors (Cursor): chat on right, code on left, diff view for changes
  • App builders (v0, Replit): chat on left, live preview on right
  • Enterprise tools (Marin Software): existing UI on left, LLM assistant on right
  • Google Apps: suggestion panel integrated into existing interface

Source