スキル gsap

📦

gsap

Name: gsap
Author: heygen-com

コンテンツリビジョン r1 安全 🌐 ネットワークアクセス📁 ファイルシステムへのアクセス⚙️ 外部コマンド

為 HyperFrames 建置 GSAP 動畫

HyperFrames 動畫工作需要精準的 GSAP 時序、效果與效能選擇。此技能提供針對 tweens、timelines、打字機文字與音訊反應式視覺效果的聚焦參考。

対応: Claude Codex Code(CC)

🥈 80 シルバー

Maintain this Skill? Claim it 🥈 80 シルバー

自分のエージェントでインストール

このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。

エージェントリクエスト

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

エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。

エージェントが読めるリソース

AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。

Markdown詳細 GET /skills/heygen-com-gsap.md 署名済み manifest GET /api/skills/heygen-com-gsap/manifest 署名済み lockfile GET /api/skills/heygen-com-gsap/lockfile

テストする

「gsap」を使用しています。將三張產品卡片以易讀的時序動畫帶入視野。

期待される結果:

一個精簡的 timeline 計畫，使用以 transform 為基礎的移動、opacity、交錯開始，以及供後續控制使用的 labels。

「gsap」を使用しています。建立會輸入並替換多個字詞的標題。

期待される結果:

一個定義游標狀態、輸入速度、停留時序與安全退格行為的打字機序列。

「gsap」を使用しています。讓視覺效果在 HyperFrames 中回應音軌。

期待される結果:

一種音訊視覺化方法，包含擷取出的影格資料、由 RMS 驅動的全域動態，以及由頻段驅動的細節變化。

セキュリティ監査

安全

v6 • 2026/7/9 バージョン別レポートを開く

No prompt injection or malicious intent was found in the reviewed files. Most static findings are false positives from Markdown formatting and GSAP examples; the real issues are documented CDN script references plus a helper script that runs ffmpeg and writes an output JSON file.

スキャンされたファイル

699

解析済み行数

レビュー項目

誤検知を無視

機能レビュー項目 (4)

これらは、このスキルに期待される可能性のある実際のローカル機能であるため、レビューが必要ですが、確認済みの悪意ある動作としてはカウントされません。

高

scripts/extract-audio-data.py:52

Python subprocess.run

result = subprocess.run(cmd, capture_output=True)

The helper script invokes the local ffmpeg binary on a caller-supplied media path. It uses argument-list execution without a shell, but it is still an external command side effect.

中

scripts/extract-audio-data.py:181

Python file write/append

with open(args.output, "w") as f:

The helper writes JSON to args.output, which is controlled by the command line. This is expected behavior, but it can overwrite a selected local path if run carelessly.

低

references/effects.md:21

Hardcoded URL

The documentation tells users to load GSAP from a jsdelivr CDN URL. This is legitimate, but copied examples would fetch third-party JavaScript at runtime.

低

references/effects.md:22

Hardcoded URL

The documentation tells users to load TextPlugin from a jsdelivr CDN URL. This is legitimate, but copied examples would fetch third-party JavaScript at runtime.

リスク要因

🌐 ネットワークアクセス (3)

references/effects.md:218 references/effects.md:21 references/effects.md:22

📁 ファイルシステムへのアクセス (2)

references/effects.md:219 scripts/extract-audio-data.py:181

⚙️ 外部コマンド (50)

監査者: codex 監査履歴を表示 →

このレポートを共有・引用

バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。

バージョン別レポートを開く

レポートリンクをコピー

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

Markdownバッジ

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

HTMLバッジ

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

埋め込みカード

<iframe src="https://skillstore.io/embed/skills/heygen-com-gsap.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). gsap security audit report (audit version 6) [Author version unspecified]. Skillstore. https://skillstore.io/skills/heygen-com-gsap/audits/6

BibTeX形式の引用

@techreport{heygen-com-heygen-com-gsap-2026,
  author = {heygen-com},
  title = {gsap security audit report (audit version 6)},
  institution = {Skillstore},
  year = {2026},
  number = {6},
  url = {https://skillstore.io/skills/heygen-com-gsap/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: "gsap 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-gsap/audits/6"
identifiers:
  - type: other
    value: "skillstore:heygen-com-gsap:audit:6"
    description: "Skillstore immutable audit report identifier"

Skillstore スコア

このスコアの理由証拠の信頼度: 高

アーキテクチャ

保守性

コンテンツ

コミュニティ

仕様準拠

作成できるもの

建置動態序列

建立具有清楚 labels、預設值與協調元素進場的 GSAP timeline。

加入文字揭示效果

使用包含游標狀態、退格、文字輪替與多行交接時序的打字機模式。

準備音訊反應式視覺效果

擷取以影格為基礎的音訊資料，並將 RMS 或頻段對應到視覺動畫屬性。

これらのプロンプトを試す

建立基本 Tween

使用 GSAP 技能將此元素從隱藏動畫化為可見。優先使用 transform 與 opacity 屬性。

設計 Timeline

使用 GSAP 技能建置包含預設值、labels、交錯進場與播放控制的 timeline 計畫。

建置打字機效果

使用 GSAP 效果參考建立包含游標閃爍、停留與退格行為的打字機序列。

規劃音訊視覺化工具

使用 GSAP 技能規劃音訊資料擷取，並將頻段對應到確定性的視覺化 timeline。

ベストプラクティス

在會改變版面的屬性之前，優先使用 transforms、opacity 與 autoAlpha。
使用 timelines、labels 與 position parameters 讓序列更易讀。
尊重 reduced-motion 偏好，並清理未使用的 tweens 或 timelines。

回避

當 timeline 更適合時，不要用手動 delays 串接大量動畫。
當 transforms 可以建立相同結果時，不要動畫化 width、height、top 或 left。
不要在非同步 callbacks 內建置 HyperFrames timelines。

よくある質問

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

它可協助為 HyperFrames 建置 GSAP tweens、timelines、打字機效果與音訊反應式視覺模式。

它包含可執行的程式碼嗎？

它包含參考 snippets，以及一個用於擷取音訊視覺化資料的 Python 輔助 script。

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

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

音訊輔助工具需要額外軟體嗎？

是。此輔助工具需要在本機系統安裝 Python、numpy 與 ffmpeg。

這是一般性的 GSAP 手冊嗎？

不是。它專注於符合 HyperFrames 構圖規則的實用 GSAP 模式。

它能處理無障礙需求嗎？

它包含一個會考量 reduced-motion 偏好的 gsap.matchMedia 範例。

開発者情報

作成者

heygen-com

ライセンス

MIT

Skillstore リビジョン

バージョンに関する注意

作者はバージョンを宣言していません。

リポジトリ

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

参照

0519034dad657fb1f7706e0550e962beeda73fdf

メンテナンスの新しさ

2026/7/18

利用状況

10 ダウンロード · 88 閲覧

ファイル構成

📁 references/

📄 effects.md

📁 scripts/

📄 extract-audio-data.py

將 CloudBase AI 模型新增到 Web 應用程式

作成者 tencentcloudbase

當模型群組、驗證或 Token Credits 尚未準備就緒時，瀏覽器 AI 整合可能會失敗。此技能會引導 Web 應用程式完成 CloudBase 預檢、模型啟用和 SDK 呼叫。

コーディング＆開発表示

gsap

自分のエージェントでインストール

エージェントが読めるリソース

テストする

セキュリティ監査

リスク要因

レポートリンクをコピー

Markdownバッジ

HTMLバッジ

埋め込みカード

APA形式の引用

BibTeX形式の引用

CITATION.cff

Skillstore スコア

作成できるもの

建置動態序列

加入文字揭示效果

準備音訊反應式視覺效果

これらのプロンプトを試す

ベストプラクティス

回避

よくある質問

開発者情報

heygen-com のその他のスキル

hyperframes-audio

tailwind

waapi

animejs

general-video

css-animations

関連スキル

threejs-webgl

vercel-react-view-transitions

wp-block-development

typescript-expert

building-logseq-plugins

ai-model-web