"Learn about ZoomInfo with AI" chips
A chips component for the Offers pages that turns static product education into tappable prompts for AI assistants.
The chips section, in context on an Offers page
01Context
The Offers pages explained ZoomInfo in static copy. The chips turn that into tappable prompts, one per assistant (Gemini, OpenAI, Claude, Perplexity), so a visitor can ask an AI directly about ZoomInfo instead of reading a paragraph.
02The build
Ren built six placements (Tests A and B across desktop, tablet, and mobile), a paired "About" explainer card, and an engineering dev-notes panel for handoff. All of it bound to the design system on Figtree, no raw hex.
Hover state · lift and warm tint
03Decisions that mattered
Responsive by structure, not patch.
Mobile wraps the chips two-by-two; tablet holds a single row; desktop runs them inline. A real mobile overflow bug was fixed at the structure level with stretch children and centered alignment, not a one-off hack.
No ambient motion.
During animation ideation the entire idle-loop category was killed as off-brand for B2B. Motion is a single scroll-in entrance plus a hover lift-and-tint, and reduced-motion is respected.
Name the system gaps honestly.
Motion tokens don't exist in the design system yet, so the timings are flagged as proposed, not invented as fact. And animating the AI brand marks needs trademark sign-off, surfaced as a gate rather than assumed.
04Where it stands
Shipped, pending final review, with the developer handoff done. Open items are the animation direction to take forward and the trademark sign-off on the AI marks. Honest about what's settled and what still needs a decision.