Hint once, then stop nudging

Peek the next card on hover, then stop once people have used it.

Rauno Freiberg@raunofreiberg
happy friday! i did some interaction work https://rauno.me/notes/5
Sep 11, 2026View on X ↗
Rauno Freibergrauno.me
Hovering the main card subtly pulls up the next card as a hint. This makes it more obvious that yes, this area is also interactive.
Field Notes #5Read article ↗
Rauno Freibergrauno.me
Notice how the hovered card doesn’t return to its "hint state" where it was subtly pulled up? You’ve already understood this area to be interactive, so there’s no need to nudge you with it anymore.
Field Notes #5Read article ↗

1 · A stack of announcements

Hover each stack, advance twice, then hover again.

Tiny arrows, naggingBad
Advances0Hint plays0
Card is the controlGood
Advances0Hint plays0
.stack::after { content: ""; position: absolute; inset: -14px; }  /* generous hit area */
.card[data-pos="1"] { transform: translateY(-8px) scale(0.95); }
@media (hover: hover) and (pointer: fine) {
  /* the hint: only until someone has advanced once */
  .stack:not([data-used]):hover .card[data-pos="1"] { transform: translateY(-14px) scale(0.95); }
}

Why it matters, pros and cons

Why it matters

A hint teaches that an area is interactive. After it has done that, repeating it is just noise.

Pros

  • The whole stack is the target, not a corner.
  • New people discover it without a tooltip.
  • Experienced people get a calm, still stack.

Cons

  • Hover hints do nothing on touch.
  • Needs a flag once the hint has been learned.
  • Peeking cards can hide content behind them.