Claude Skill MartKhám phá skillCâu dùng ngayHọc qua videoDùng terminalSkill là gì?
 
← Về danh sách

Biểu đồ động (Animated Chart)

Tạo biểu đồ động lặp vô hạn cho LinkedIn hoặc newsletter dưới dạng một file HTML duy nhất, giữ nguyên tuyệt đối mọi con số.

Ảnh · VideoNhập môn★ 205⑂ 36Điểm AI 8/10Cập nhật lần cuối: 11 thg 10, 2026

Làm được gì

  • Từ tiêu đề, nhãn và giá trị bạn cung cấp, tạo một file HTML duy nhất chứa biểu đồ động 8 giây lặp liền mạch.
  • Chuyển động chia thành 4 giai đoạn: bắt đầu → biến đổi → giữ → quay về, đảm bảo khung hình cuối trùng khớp khung hình đầu.
  • Tự chụp ảnh tại giây 0, 1, 2, 4 và 7 để kiểm tra chữ chồng lấn hoặc bị cắt, rồi sửa.
  • Xuất ra MP4 (1080×1350) và GIF lặp vô hạn.
  • Không bao giờ làm tròn hay đổi định dạng số; nếu là dữ liệu mẫu thì giữ nhãn "Illustrative data" ở mọi khung hình.

Phù hợp với ai

  • Marketer, founder, người làm nội dung cần đồ họa dữ liệu cho LinkedIn hoặc bản tin
  • Người muốn làm motion graphics bằng code thay vì phần mềm thiết kế
  • Đội ngũ cần hình ảnh báo cáo nhất quán với màu sắc và font thương hiệu

Ví dụ sử dụng

  1. "Biến biểu đồ cột doanh thu theo quý thành đường xu hướng trong vòng lặp 8 giây" → HTML động theo màu thương hiệu kèm MP4/GIF
  2. "Animation trước/sau: tỷ lệ chuyển đổi 2,1% → 5,4%" → con số đếm tăng rồi dừng, lặp mượt
  3. "5 hạng mục kết quả khảo sát, đánh dấu là dữ liệu mẫu" → mọi khung hình đều hiển thị 'Illustrative data'

· · · Hướng dẫn cài đặt · · ·

Dùng thử ngay, không cần cài

Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.

Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình:
https://raw.githubusercontent.com/charlie947/motion-graphics-skills/HEAD/skills/animated-chart/SKILL.md

Mình muốn: (viết việc bạn cần ở đây)

Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.

↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.

Cài vào ứng dụng Claude (không cần terminal)
  1. Tải tệp ZIP bằng nút bên dưới.
  2. Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
  3. Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
↓ Tải ZIP
Cài vào Claude Code

Để Claude làm — dán câu dưới đây vào Claude Code

Hãy cài skill mình tìm thấy trên Claude Skill Mart.
Copy thư mục skills/animated-chart từ repo GitHub charlie947/motion-graphics-skills vào ~/.claude/skills/animated-chart/ của mình.
Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.

Cài bằng lệnh thủ công

git clone https://github.com/charlie947/motion-graphics-skills.git && mkdir -p ~/.claude/skills && cp -r motion-graphics-skills/skills/animated-chart ~/.claude/skills/

⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.

  1. Mở Terminal.
  2. Tải kho mã: git clone https://github.com/charlie947/motion-graphics-skills.git
  3. Tạo thư mục skill: mkdir -p ~/.claude/skills
  4. Sao chép skill: cp -r motion-graphics-skills/skills/animated-chart ~/.claude/skills/
  5. (Khuyến nghị) Sao chép thêm skill brand-intake trong cùng kho để tự động áp dụng màu và font thương hiệu.
  6. Kiểm tra ffmpeg đã cài chưa để xuất video/GIF: ffmpeg -version
  7. Khởi động lại Claude Code và nói "animate my chart" để kích hoạt skill.
Xem mã nguồn trên GitHub ↗Giấy phép: MIT