Can I use this for horizontal scrolling sections?

Yes, it contains specific code patterns for pinned horizontal scroll containers, ideal for galleries and step-by-step walkthroughs.

How does this skill handle mobile performance?

It includes best practices for mobile-safe parallax and performance optimization to prevent animation stutter (jank) on touch devices.

Does it prevent scroll hijacking?

Yes, the skill explicitly treats scroll hijacking as an anti-pattern and teaches how to enhance natural scrolling rather than replacing it.

Which animation libraries does this skill support?

The skill provides implementation patterns for GSAP (ScrollTrigger), Framer Motion, Locomotive Scroll, Lenis, and native modern CSS scroll-timeline.

Immersive Scroll Experiences

Name: Immersive Scroll Experiences
Author: claudiodearaujo

byclaudiodearaujo

0•

Design Tools

Builds cinematic, scroll-driven web experiences using parallax storytelling, interactive narratives, and advanced animation techniques.

Immersive Scroll Experiences is a specialized skill for Claude Code designed to transform static websites into engaging digital narratives. It provides expert guidance on implementing scroll-driven animations, sticky sections, and parallax effects using industry-standard tools like GSAP, Framer Motion, and modern CSS. Whether you are building an Apple-style product page or a New York Times-style interactive story, this skill helps you balance visual impact with performance and accessibility, ensuring a smooth experience across both desktop and mobile devices while avoiding common pitfalls like scroll hijacking.

Key Features

01Advanced sticky section management and horizontal scroll layouts

020 GitHub stars

03Integration with GSAP, Framer Motion, and native CSS scroll-timeline

04Multi-layered parallax storytelling techniques for visual depth

05Implementation of complex scroll-driven animations and triggers

06Performance optimization for smooth, jank-free scrolling

Use Cases

01Building immersive product walkthroughs with pinned content sections

02Developing interactive data journalism and long-form digital storytelling

03Creating high-end marketing landing pages with cinematic product reveals

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add claudiodearaujo/sistema-de-narra-o-de-livro-front scroll-experience

For use in Claude.ai and ChatGPT

Download Skill