Calesthio

Configure images and videos as surface textures in Three.js, and use environment images for backgrounds and reflections. Adjust placement, color settings, repetition, and filtering, then manage texture memory through compression, reuse, and disposal.

• Adjust image placement and tiling on 3D surfaces
• Use HDR images for backgrounds and reflections
• Apply video or Canvas content to a 3D surface

Create AI video clips from text or reference images, choosing among providers to match the task and budget. Supports vertical social videos, product photo animation, and conversational editing of existing clips with Gemini Omni Flash.

• Create vertical video clips for social media
• Animate product photos
• Choose a video provider for a budget and visual style

Translate and dub existing videos with HeyGen to create versions in multiple languages. Preserve the speaker’s voice characteristics, match lip movements to translated speech, or choose audio-only translation without adjusting the video’s lip movements.

• Create multilingual versions of a product demo
• Dub videos with matching lip movements
• Translate audio without changing lip movements

Create a reusable design guide covering colors, typography, layout, and motion. Extract styles from existing sources or start from scratch, then turn the guide into instructions or code for supported video, slide, and design tools.

• Creating a design guide from a desired mood
• Extracting visual rules from a website or brand PDF
• Applying one style to videos, slides, and designs

Write, review, and refactor React and Next.js code using performance guidelines from Vercel. Prioritized rules help identify sequential data requests, oversized JavaScript bundles, unnecessary re-renders, and other opportunities to improve loading and responsiveness.

• Reviewing React components for performance issues
• Improving data fetching in Next.js pages
• Reducing JavaScript bundle size

Create Three.js shapes, custom meshes, 3D text, and point clouds. Explains vertex editing and geometry utilities, plus instancing, a technique for efficiently drawing many copies of the same shape with different positions, sizes, or colors.

• Creating basic solids and path-based 3D shapes
• Building and modifying custom meshes
• Displaying 3D text, point clouds, and wireframes

Set up lighting and shadows in Three.js scenes. Choose light types, create outdoor or studio lighting, use environment images to illuminate materials, and tune shadow settings to balance appearance with rendering performance.

• Create sunlight and sky lighting outdoors
• Set up studio or three-point lighting
• Use HDR images for environment lighting

Refactor React components with too many true-or-false options into reusable parts. Provides guidance on component composition, shared state, and flexible interfaces, with examples of good and problematic implementations and specific guidance for React 19.

• Refactoring components with too many boolean options
• Designing reusable component libraries
• Reviewing shared state and component architecture

Process video and audio with FFmpeg for editing and publishing. Convert formats, resize and compress files, extract audio, trim clips, and change playback speed. Includes recipes for preparing Remotion assets and exporting videos for social platforms and websites.

• Convert GIF files to MP4
• Resize and compress videos for publishing
• Extract audio and convert audio formats

Create short video clips from text or still images with LTX-2.3 22B. Generate supporting footage, animated backgrounds, or moving portraits while specifying camera motion, lighting, dimensions, and duration, with clips around five seconds by default.

• Generate supporting footage for narrated videos
• Add subtle motion to slide backgrounds
• Animate still portraits

Add mouse, touch, and keyboard interaction to Three.js scenes. Implement object picking, camera navigation, dragging, and transform handles, with examples for selection feedback, coordinate conversion, and limiting the cost of interaction checks.

• Select 3D objects with clicks or touch
• Add camera rotation and zoom controls
• Drag, rotate, and scale objects

Guides agents working on Remotion videos built with React to relevant rules and code examples. It covers animation, captions, audio, scene transitions, charts, asset handling, and other common tasks involved in composing and adjusting a video.

• Add captions and animated text to a Remotion video
• Adjust audio timing, volume, and scene transitions
• Build animated charts or audio visualizations

Turn a math or science video idea into a detailed scene plan. Research the topic, clarify the audience, and outline visuals, narration, transitions, and implementation notes for Manim, an animation tool.

• Turn a rough explainer idea into a scene plan
• Plan intuitive math and science visuals
• Adapt video depth to the audience

Edit local video files with ffmpeg, a command-line media tool. Trim and join clips, resize for social platforms, adjust playback speed, extract or replace audio, add image overlays, and export compressed or converted files.

• Trimming and joining video clips
• Resizing videos for social platforms
• Extracting or replacing audio

Build reusable interface components with Tailwind CSS v4, using shared design values for colors, corners, and themes. Covers buttons, forms, responsive layouts, accessibility, and dark mode to help standardize interfaces across a project.

• Build a reusable UI component library
• Standardize colors and component styles
• Add responsive layouts and dark mode

Generate narration, dialogue, sound effects, and music with ElevenLabs APIs for videos, podcasts, and games. The skill covers voice settings, pronunciation, pauses, voice cloning, and using measured audio lengths to synchronize scenes in Remotion, a video creation framework.

• Creating narration for videos or podcasts
• Generating sound effects from written descriptions
• Composing instrumental background music

Create mathematical and geometric animations in Python with Manim Community Edition. Use guidance, examples, and scene templates to structure animations, display equations, plot graphs, control cameras, and render two-dimensional or three-dimensional scenes.

• Animating equations and derivations
• Creating function graphs and area visualizations
• Building 3D surfaces with camera movement

Turn written descriptions or Mermaid code into diagrams showing processes, interactions, and data relationships. Choose a color theme and save both SVG files, which stay sharp when enlarged, and high-resolution PNG images.

• Illustrating workflows and decision trees
• Diagramming API interactions
• Visualizing database relationships

Turn a written brief into an explainer video by generating narration, images, music, and optional talking presenters. Assemble scenes with Remotion, adjust their timing to the generated audio, review still frames, and render an MP4.

• Creating a narrated product introduction
• Turning a sprint review into a video
• Adding an animated presenter to a scene

Turn text into standalone speech audio with HeyGen's Starfish model for narration, voiceovers, or podcasts. Choose voices by language or gender, adjust speed and pitch, and add pauses when the selected voice supports them.

• Generate narration from a script
• Create speech audio for podcasts
• Find voices by language or gender

Replace a face in a video using a source photo and the HeyGen API. The skill covers submitting image and video URLs, checking processing status, and retrieving the finished video, including workflows that personalize generated avatar videos.

• Replace a face in a recorded video
• Personalize an avatar video with a face photo
• Track processing and retrieve the finished video

Helps agents build the foundations of a Three.js scene, including cameras, rendering settings, object grouping, and movement. Code examples cover coordinate systems, resizing, animation timing, resource cleanup, and basic performance improvements for browser-based 3D projects.

• Set up a browser-based 3D scene
• Choose between perspective and orthographic cameras
• Move or rotate several objects as a group

Transcribe audio with Azure AI Speech and obtain word timestamps, speaker labels, and language identification. Use the resulting transcript in OpenMontage subtitle workflows, with a compatible local transcription fallback when Azure is unavailable.

• Transcribing recorded audio
• Preparing timestamps for video subtitles
• Labeling speakers in interviews

Build voice assistants and conversational characters with ElevenLabs. Configure voices, language models, and external tools, then connect conversations to a website widget or use Twilio integration for outbound phone calls.

• Creating a voice bot for customer support
• Embedding a voice assistant on a website
• Building an interactive voice character