# HyperFramesのSNSとチャットのアニメーションテンプレート

通知、フォローボタン、XとRedditの投稿カード、コメント、チャットスレッドなど、無料のHyperFrames SNSテンプレート11点。Subclipで編集するか、HTMLを入手できます。

Canonical URL: https://www.subclip.app/ja/motion-graphics-templates/hyperframes/social-media-animations

これらのHyperFramesテンプレートは、誰もがすぐにわかるSNSの場面を再現します。スマートフォンの通知、タップされるフォローボタン、投稿カード、続々と付くコメント、チャットのスレッドなどです。どれもGSAPのタイムラインを持つ1枚のHTMLページで、テキスト、名前、色は変数として公開されています。

## このセットのテンプレート

iOS NotificationとmacOS Notificationはシステム通知を画面にスライドインさせます。Instagram FollowとTikTok Followはフォローボタンを押します。X Post CardとReddit Post Cardは投稿を見せ、Comment Cardsは返信を積み重ね、Instant Carouselはスライドをスワイプし、Thread Message、Chat Thread、Chat Thread 2は会話を吹き出しごとに再生します。

## テキストを編集する

ユーザー名、投稿の文章、数値、色はSubclipでテンプレートの変数から変更するか、HTMLを直接編集できます。クリエイターの動画、SNS広告、リアクション動画の編集、SNSプラットフォームのチュートリアルに使えます。

## 11件のテンプレート

- [iOS Notification](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/notification-cascade) (HyperFrames, SNSとチャット): 4 つの iPhone スタイルのバナーが次々に重なり、最後にヘッドラインとロゴ カードが表示される垂直方向の通知オーバーレイ。
- [Instant Carousel](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/share-sheet-carousel) (HyperFrames, SNSとチャット): 白い丸いカード内で 4 枚の写真を循環させる垂直方向の画像カルーセル。現在の画像の柔らかくぼかしたコピーが背景を埋めます。
- [macOS Notification](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/macos-notification) (HyperFrames, SNSとチャット): macOS スタイルの通知バナーが一度に 1 つずつ右上隅に表示され、列に積み重なるワイドスクリーン オーバーレイ。
- [Instagram Follow](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/instagram-follow) (HyperFrames, SNSとチャット): コンパクトなプロフィール ピルを備えた透明な垂直オーバーレイ。[フォロー] ボタンが [フォロー中] に切り替わり、視聴者にアカウントのフォローを促すために作成されます。
- [TikTok Follow](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/tiktok-follow) (HyperFrames, SNSとチャット): 透明な 9:16 プロファイル オーバーレイ。ローズレッドの [フォロー] ボタンがチェックマーク付きのフォロー状態に切り替わります。
- [X Post Card](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/x-post) (HyperFrames, SNSとチャット): ダークテーマのワイドスクリーンソーシャルポストカード。プロフィール、投稿テキスト、アクション行が表示され、カウントが増加するアニメーションが表示されます。
- [Reddit Post Card](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/reddit-post) (HyperFrames, SNSとチャット): ワイドスクリーンのコミュニティポストカードには、サブレディットの行、太字の見出しと本文があり、最後に賛成票が湧き出てスコアが上がります。
- [Thread Message](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/thread-message-stack) (HyperFrames, SNSとチャット): ワイドスクリーンのテキスト会話。柔らかくぼやけたカラーフィールド上に、灰色の着信バブルと青色の発信バブルが次々と表示されます。
- [Comment Cards](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/yt-comment-card) (HyperFrames, SNSとチャット): 2 つの視聴者のコメントが順番に表示されるワイドスクリーン オーバーレイ。それぞれのコメントにはイニシャルのアバター、ユーザー名、タイム ラベル、入力されたテキスト、および反応行が含まれます。
- [Chat Thread 2](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/chat-thread-2) (HyperFrames, SNSとチャット): タイプされた返信、リンクのプレビュー、絵文字の反応、クロージング カードで終わる開封確認を含む、縦型の電話フレームのテキスト会話。
- [Chat Thread](https://www.subclip.app/ja/motion-graphics-templates/hyperframes/chat-thread) (HyperFrames, SNSとチャット): 9 時 16 分のダークモード テキスト メッセージ スレッド。送受信バブル、ドット入力、リンク プレビュー カード、開封確認が表示されます。