技能 lottie

📦

lottie

Name: lottie
Author: heygen-com

內容修訂 r1 安全 ⚙️ 外部命令🌐 網路存取

在 HyperFrames 中嵌入 Lottie 動畫

HyperFrames 專案需要確定性的 Lottie 播放，而不是時間軸漂移。此技能展示 lottie-web 和 dotLottie 的本機素材載入、播放器註冊和驗證模式。

支援: Claude Codex Code(CC)

🥉 78 銅級

Maintain this Skill? Claim it 🥉 78 銅級

使用我的智慧代理安裝

將此請求複製給你的智慧代理，其中包含權威 Skill 頁面和清單。

智能體請求

Review the Skillstore skill "lottie" from https://skillstore.io/skills/heygen-com-lottie.md and its manifest at https://skillstore.io/api/skills/heygen-com-lottie/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

你的智慧代理仍應顯示其計畫，並依安全政策請求必要確認。

Agent 可讀資源

當 AI Agent、爬蟲或腳本需要乾淨脈絡、而不是讀取完整頁面時，請使用這些連結。

Markdown 詳情 GET /skills/heygen-com-lottie.md 已簽名 manifest GET /api/skills/heygen-com-lottie/manifest 已簽名 lockfile GET /api/skills/heygen-com-lottie/lockfile

測試它

正在使用「lottie」。 Add a logo reveal animation to a HyperFrames composition.

預期結果:

本機 lottie-web 素材會以停用 autoplay、停用 loop、穩定尺寸和 HyperFrames 播放器註冊的方式載入。

正在使用「lottie」。 Check why a dotLottie animation does not sync with the render timeline.

預期結果:

審查會找出缺少播放器註冊、延遲載入風險，以及可能破壞確定性定位的容器尺寸變更。

正在使用「lottie」。 Prepare multiple animated accents for one scene.

預期結果:

每個動畫都會加入共用的 HyperFrames Lottie 登錄中，讓構圖可以同步定位每個播放器。

安全審計

安全

v6 • 2026/7/9 開啟版本化報告

Static external-command findings are false positives caused by Markdown inline code, fenced examples, and documented HyperFrames validation commands. Two runtime CDN script examples are confirmed low supply-chain risks, while reference links are documentation only. No prompt injection, credential handling, or data exfiltration intent was found.

已掃描檔案

113

分析行數

複核項目

已忽略的誤報

能力複核項目 (2)

這些是真實的本機能力，對此技能而言可能是預期行為，因此需要複核，但不會按已確認的惡意行為計分。

低

SKILL.md:24

Hardcoded URL

The sample HTML loads lottie-web from cdnjs at runtime, which creates a third-party script supply-chain dependency. It appears legitimate for Lottie playback, so the risk is low.

低

SKILL.md:50

Hardcoded URL

The sample HTML loads dotLottie from unpkg at runtime, which creates a third-party script supply-chain dependency. It appears legitimate for Lottie playback, so the risk is low.

風險因素

審計單位: codex 檢視審計紀錄 →

分享與引用此報告

分享版本化評估報告、中性徽章、嵌入卡片與引用。Skillstore 只報告證據，不判斷該 Skill 是否安全。

開啟版本化報告

複製報告連結

https://skillstore.io/skills/heygen-com-lottie/audits/6?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown 徽章

[![Skillstore security assessment](https://skillstore.io/badges/skills/heygen-com-lottie/security.svg)](https://skillstore.io/skills/heygen-com-lottie?utm_source=security_passport_badge)

HTML 徽章

<a href="https://skillstore.io/skills/heygen-com-lottie?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/heygen-com-lottie/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

嵌入卡片

<iframe src="https://skillstore.io/embed/skills/heygen-com-lottie.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

學術引用 (APA · BibTeX · CFF)

APA 引用

heygen-com. (2026). lottie security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/heygen-com-lottie/audits/6

BibTeX 引用

@techreport{heygen-com-heygen-com-lottie-2026,
  author = {heygen-com},
  title = {lottie security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/heygen-com-lottie/audits/6},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "lottie security audit report (audit version 6)"
version: "unspecified"
type: report
authors:
  - name: "heygen-com"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/heygen-com-lottie/audits/6"
identifiers:
  - type: other
    value: "skillstore:heygen-com-lottie:audit:6"
    description: "Skillstore immutable audit report identifier"

Skillstore 評分

評分依據證據置信度: 高

架構

可維護性

內容

社群

規範符合度

你可以打造什麼

為 HyperFrames 頁面加入產品動態效果

使用 lottie-web 模式載入本機 JSON 動畫，並註冊它以進行時間軸控制。

將 dotLottie 素材移植到渲染工作流程

使用 dotLottie canvas 模式，在 HyperFrames 驗證與渲染期間保持播放的確定性。

發布前審查動畫整合

檢查素材是否為本機、autoplay 是否停用、容器是否穩定，以及是否執行驗證命令。

試試這些提示

建立基本 Lottie 嵌入

Use this skill to add a local lottie-web animation to my HyperFrames page. Keep autoplay disabled and register the player.

調整 dotLottie 檔案

Use this skill to embed my .lottie asset with dotLottie in HyperFrames. Include stable canvas sizing and timeline registration.

稽核現有動畫頁面

Review my HyperFrames Lottie integration using this skill. Find remote asset paths, autoplay, late registration, and unstable containers.

設計多動畫時間軸

Use this skill to coordinate multiple Lottie and dotLottie players in one HyperFrames composition. Ensure every player seeks together.

最佳實務

盡可能使用本機動畫素材，以保持渲染的確定性。
在 HyperFrames 驗證執行前停用 autoplay 並註冊每個播放器。
將匯出的 Lottie 檔案加入構圖前，先在瀏覽器中測試。

避免

不要在渲染期間依賴遠端動畫路徑。
當 HyperFrames 應控制定位時，不要手動開始播放。
不要假設每個 After Effects 功能都能在 Lottie 匯出後保留下來。

常見問題

這個技能能幫我建置什麼？

它可協助你在 HyperFrames 中嵌入 lottie-web 和 dotLottie 動畫，並具備確定性的時間軸控制。

它會建立 Lottie 動畫檔案嗎？

不會。它假設你已經有來自其他設計工具的 JSON 或 .lottie 素材。

我可以使用遠端動畫素材嗎？

此技能建議使用本機素材，因為遠端路徑可能會降低渲染輸出的可靠性。

為什麼應該停用 autoplay？

HyperFrames 需要直接定位動畫時間軸，因此自動播放可能會造成時間漂移。

它支援多個動畫嗎？

可以。此技能展示如何將多個播放器放在同一個 window.__hfLottie 登錄中。

哪些工具可以使用這個技能？

報告列出支援 Claude、Codex 和 Claude Code。

開發者詳細資訊

作者

heygen-com

授權

MIT

Skillstore 修訂

版本提示

作者未聲明版本。

儲存庫

https://github.com/heygen-com/hyperframes/tree/main/skills/lottie/

引用

0519034dad657fb1f7706e0550e962beeda73fdf

維護新鮮度

2026/7/18

使用量

1 次下載 · 50 次瀏覽

檔案結構

📄 SKILL.md