skills/diffusionstudio__lottie

mirror of https://github.com/diffusionstudio/lottie.git synced 2026-09-14 13:40:33 +08:00

T

Doruk Kavcioglu ab2ed3fa73 Add banner to README

2026-06-10 02:22:21 +03:00

Enhance controls.json and lottie.json by adding ballSize control and updating animation properties. Modify Scrubber component styles for improved visual consistency.

2026-06-04 16:35:11 +02:00

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

skills/text-to-lottie

Add LICENSE file and update project metadata

2026-06-08 16:48:24 +02:00

Refactor Lottie player initialization to support URL-based frame and playback control. Remove remote control functionality and update documentation to reflect new methods for inspecting animations via URL parameters. This enhances usability for automated testing and debugging.

2026-06-05 22:59:58 +02:00

.gitignore

Update .gitignore to remove the create-lottie-experiments/template entry and replace it with .claude for better project organization.

2026-06-04 23:42:48 +02:00

bun.lock

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

components.json

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

index.html

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

LICENSE

Add LICENSE file and update project metadata

2026-06-08 16:48:24 +02:00

package-lock.json

Update PropertiesPanel to replace Slider with Scrubber for enhanced value control and add motion library dependency in package.json.

2026-06-03 19:16:59 +02:00

package.json

Add LICENSE file and update project metadata

2026-06-08 16:48:24 +02:00

README.md

Add banner to README

2026-06-10 02:22:21 +03:00

text-to-lottie.gif

Add banner to README

2026-06-10 02:22:21 +03:00

tsconfig.app.json

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

tsconfig.json

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

tsconfig.node.json

Initialize lottie-experiments project with Vite, React, and TypeScript setup. Add essential files including package.json, tsconfig, and README. Implement Lottie animation player using CanvasKit, along with UI components for playback controls. Include styles with Tailwind CSS and setup build configurations.

2026-06-03 16:01:43 +02:00

vite.config.ts

Implement live properties panel for Lottie animations, allowing real-time editing of slottable properties. Update LottiePlayer to support slot management and integrate controls metadata. Enhance App component to fetch and display properties panel, improving user interaction with animations. Update README to reflect new features and file structure changes.

2026-06-03 17:21:35 +02:00

README.md

Text-To-Lottie

This project includes a full-screen Lottie player built on Skia CanvasKit (Skottie), with a React + shadcn/ui + TypeScript control surface. Built to generate a Lottie animation with an LLM and watch it play live: the agent writes public/lottie.json, the dev server hot-reloads it.

Usage

Run

npx skills add diffusionstudio/lottie

Then ask claude code/codex or any other agent supporting skills to generate an animation using text-to-lottie

Getting started

Alternatively you can set up the repository manually

npm install   # also copies the CanvasKit wasm into /public (postinstall)
npm run dev

Then open the printed local URL.

CanvasKit wasm

The wasm binary is not committed; it is copied from node_modules/canvaskit-wasm/bin/full/canvaskit.wasm into public/ by scripts/copy-canvaskit.mjs on postinstall. Run it manually any time with node scripts/copy-canvaskit.mjs.