Recipe

Thumbs up/down rating design

Binary ratings carry less noise than five-star scales, ship faster to production, and align cleanly with reinforcement signals fed back into Meridian model routing. This recipe captures the design choices we use to keep the control compact, accessible, and statistically useful.

1. Pick the right unit of feedback

Anchor the rating to a single response, not the whole session. A session aggregates too many turns to be useful as a training signal, and customers struggle to pick which turn the rating applies to. Render the thumbs control inline at the foot of every assistant message, never as a floating toolbar. Keep the hit target at 32 by 32 pixels minimum so it survives touch input on a mobile dashboard.

2. Mirror state with neutral defaults

Both icons start unselected. After click, the picked icon fills in with the brand violet and the other dims to thirty percent opacity but stays clickable, allowing the customer to flip the verdict without an undo affordance. Hover state lifts the icon two pixels and adds a soft pink glow. Avoid replacing the pair with a single confirmation message because that hides the change-of-mind path.

3. Persist with an idempotent endpoint

Send a PUT keyed by message id rather than POSTing a new record on every click. The payload carries the rating value and an optional free-text note shown on thumbs-down. This keeps the database normalized to one row per message and makes flips trivially observable in analytics. Surface the chosen verdict back from the server on next paint so multi-device sessions stay consistent.

Reference payload

PUT /api/ratings/:messageId
Content-Type: application/json

{
  "verdict": "up",
  "note": null,
  "model": "azure/model-router",
  "latencyMs": 842
}