By freshtechbro
Rapidly prototype and integrate immersive 3D/VR/AR scenes, smooth parallax scrolling, page transitions, 2D graphics, and lightweight effects into web apps using A-Frame, PlayCanvas, PixiJS, Locomotive Scroll, Barba.js via interactive generators, setup scripts, and specialist agents.
npx claudepluginhub freshtechbro/claudedesignskills --plugin extended-3d-scrollA-Frame WebXR - Component Builder
A-Frame WebXR - Scene Generator
Barba.js - Project Setup
Barba.js - Transition Generator
Lightweight 3D Effects - Generate Zdog
Lightweight 3D Effects - Setup Vanta
Locomotive Scroll - Generate Config
Locomotive Scroll - Integration Helper
PixiJS 2D - Particle Builder
PixiJS 2D - Sprite Generator
PlayCanvas - Component Builder
PlayCanvas - Project Generator
Expert 3D/graphics architect specializing in A-Frame WebXR scene design, optimization, and best practices.
Expert specialist in Barba.js implementation, patterns, and best practices.
Expert integration specialist for combining Extended 3D & Scroll technologies into cohesive applications.
Expert 3D/graphics architect specializing in Lightweight 3D Effects scene design, optimization, and best practices.
Expert specialist in Locomotive Scroll implementation, patterns, and best practices.
Expert 3D/graphics architect specializing in PixiJS 2D scene design, optimization, and best practices.
Expert 3D/graphics architect specializing in PlayCanvas scene design, optimization, and best practices.
Declarative web framework for building browser-based 3D, VR, and AR experiences using HTML and entity-component architecture. Use this skill when creating WebXR applications, VR experiences, AR experiences, 360-degree media viewers, or immersive web content with minimal JavaScript. Triggers on tasks involving A-Frame, WebXR, VR development, AR development, entity-component-system, declarative 3D, or HTML-based 3D scenes. Built on Three.js with accessible HTML-first approach.
Page transitions library for creating fluid, smooth transitions between website pages. Use this skill when implementing page transitions, creating SPA-like experiences, adding animated route changes, or building websites with smooth navigation. Triggers on tasks involving Barba.js, page transitions, routing, view management, transition hooks, GSAP integration, or smooth page navigation. Works with gsap-scrolltrigger for transition animations.
Lightweight 3D effects for decorative elements and micro-interactions using Zdog, Vanta.js, and Vanilla-Tilt.js. Use this skill when adding pseudo-3D illustrations, animated backgrounds, parallax tilt effects, decorative 3D elements, or subtle depth effects without heavy frameworks. Triggers on tasks involving Zdog pseudo-3D, Vanta.js backgrounds, Vanilla-Tilt parallax, card tilt effects, hero section animations, or lightweight landing page visuals. Ideal for performance-focused designs.
Comprehensive skill for Locomotive Scroll smooth scrolling library with parallax effects, viewport detection, and scroll-driven animations. Use this skill when implementing smooth scrolling experiences, creating parallax effects, building scroll-triggered animations, or developing immersive scrolling websites. Triggers on tasks involving Locomotive Scroll, smooth scrolling, parallax, scroll detection, scroll events, sticky elements, horizontal scrolling, or GSAP ScrollTrigger integration. Integrates with GSAP for advanced scroll-driven animations.
Fast, lightweight 2D rendering engine for creating interactive graphics, particle effects, and canvas-based applications using WebGL/WebGPU. Use this skill when building 2D games, particle systems, interactive canvases, sprite animations, or UI overlays on 3D scenes. Triggers on tasks involving PixiJS, 2D rendering, sprite sheets, particle effects, filters, or high-performance canvas graphics. Alternative to Canvas2D with WebGL acceleration for rendering thousands of sprites at 60 FPS.
Lightweight WebGL/WebGPU game engine with entity-component architecture and visual editor integration. Use this skill when building browser-based games, interactive 3D applications, or performance-critical web experiences. Triggers on tasks involving PlayCanvas, entity-component systems, game engine development, WebGL games, 3D browser applications, editor-first workflows, or real-time 3D rendering. Alternative to Three.js with game-specific features and integrated development environment.
Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
Uses power tools
Uses Bash, Write, or Edit tools
Standalone image generation plugin using Nano Banana MCP server. Generates and edits images, icons, diagrams, patterns, and visual assets via Gemini image models. No Gemini CLI dependency required.