Unclecheng-li/AI_Animation

本项目整理了用于生成[炫酷 HTML 动画网页]的 AI Prompts，涵盖动画效果、3D 可视化、PPT 风格演示、UI 美化等多个类别。

What it solves

This project provides a collection of "Agent Skills" that allow AI agents (like Claude Code, Cursor, or WorkBuddy) to automatically generate high-quality, single-file HTML animations. It solves the problem of creating professional-grade visual demonstrations—such as technical explanations, system architecture diagrams, or product UI walkthroughs—without requiring manual coding or complex design software.

How it works

Each skill is a self-contained folder containing instructions (SKILL.md), documentation, and templates. When you describe your needs to an AI agent, it uses these skills to generate a complete, interactive HTML file. These animations are designed for screen recording, allowing you to produce polished video content by simply recording your browser window. Many skills support advanced features like 3D transitions, SVG-based animations, and responsive layouts that adapt to different presentation needs.

Who it’s for

This is for developers, technical writers, educators, and content creators who need to quickly produce visual assets for technical tutorials, system design reviews, security analysis, or product demonstrations. It is ideal for anyone who wants to turn abstract concepts or data into engaging, professional-looking animations with minimal effort.

Highlights

  • Diverse Animation Types: Includes templates for PPT-style presentations, flowcharts, network protocol visualizations, 3D card theaters, and mobile UI simulations.
  • Professional Aesthetics: Offers multiple design themes, such as "dark tech," "warm paper," and "Swiss style" typography, ensuring a polished look.
  • Interactive & Dynamic: Animations feature fluid transitions, data particle effects, and interactive elements like hover-states and click-to-advance navigation.
  • Export-Ready: Many tools support exporting to various formats, including images and video, making it easy to integrate into larger video projects.
  • Zero-Dependency: Animations are generated as single-file HTML documents, making them easy to share, preview, and run offline.

Related

  • Project
    codeaholicguy/ai-devkit

    AI DevKit is a Node‑based, Apache‑2.0‑licensed tool that adds a shared configuration, console UI, SQLite‑backed memory, cross‑agent messaging, and composable engineering “skills” (requirements, design, TDD, verification, security review, etc.) to multiple AI coding assistants (Claude Code, Gemini‑CLI, Codex‑CLI, Cursor, Copilot, etc.). It lets developers run, supervise, and coordinate these agents from a single control plane, reducing scattered setups and enforcing disciplined development workflows.

  • Project
    supermemoryai/opencode-supermemory

    opencode‑supermemory is an OpenCode plugin that gives coding agents persistent, searchable memory via the Supermemory service. It automatically saves conversation turns, injects relevant memories into prompts, supports keyword‑triggered saves, can index an entire codebase, and respects privacy tags. The plugin works with both OpenCode V1 and V2, is installed via `bunx`, and is configurable through a JSONC file or environment variables.

  • Project
    patrickchugh/terravision

    An open-source cloud architecture diagram generator that creates professional AWS, Azure, and GCP diagrams from either plain-English AI prompts or Terraform code.

  • Project
    feiskyer/claude-code-settings

    A set of Claude Code plugins (skills & sub‑agents) that add brainstorming, deep research, GitHub issue/PR automation, image generation, translation, and more, with ready‑made config files for many LLM providers.