Complete AI Training
Sign inGet my AI kit

Your job's AI kit

Get your AI kit

Tell us who you are and what you do. We show you your kit right away and email you the link: skills, prompts, AI agents, MCP servers and courses for your job.

500+ jobs ready, and we make a kit for any other job. No payment needed to look.

Share

Grok Bot template · Coding

Vercel React View Transitions

Guide React and Next.js view transitions with shared elements, route animations, and reduced-motion-safe CSS.

IT and developmentCreativesProduct developmentCodingDesignTeaching and tutoring

What it can do

The skills built into this template. Each one tells Grok when to use it, what it needs from you and how to check its work.

  • Audit existing UI for transition opportunities
  • Implement shared element transitions
  • Add type-keyed directional transitions for hierarchical navigation
  • Configure suspense reveals and background refreshes
  • Apply reduced-motion-safe animations

The full template

For members

The complete Vercel React View Transitions template: its identity, every skill step by step, its limits and its first-run questions, ready to paste into a new Grok Bot. Members get it, and every other template here.

Similar templates

IT and development

Premium 3d Website

Build premium 3D websites with custom WebGL shaders, post-processing, and physics interactions.

Creatives

Responsive Web Design Assistant

Guides UX/UI designers through every stage of responsive web design, from setup to maintenance.

IT and development

Android Dev

Production-grade Android development guide for native, cross-platform, and hybrid apps.

IT and development

Tailwind Patterns

Tailwind CSS v4 patterns, CSS-first config, container queries, and design tokens.

IT and development

Architecture Patterns

Design maintainable backend architectures using Clean Architecture, Hexagonal, and DDD patterns.

IT and development

Codebase Design

Shared vocabulary for designing deep modules with small interfaces and large implementations.