動くロゴ（ロゴアニメーション）を頼むとき｜使う場所と費用

会社紹介の動画の最後にロゴがふわっと現れる、ホームページを開いたときにロゴが一筆書きのように描かれる。こうした「動くロゴ」は、ロゴアニメーション、ロゴモーションとも呼ばれます。展示会の画面や採用説明会のスライド、SNS の動画など、使える場所が増えたことで、ロゴと一緒に作りたいと考える会社も増えています。

一方で、どこで使うかを決めないまま頼むと、受け取った形式がホームページに載せられなかったり、音付きの動画が無音の場所で使いにくかったりと、手戻りが起こりがちです。この記事では、動くロゴを頼む前に決めておくこと、使う場所ごとの形式の選び方、見積もりの内訳の見方、ホームページで動かすときの配慮、権利の確かめ方を順に整理します。

動くロゴを使う主な場所

最初に、どこで使うかを書き出します。使う場所によって、ちょうどよい長さ、音の有無、形式が変わるためです。

使う場所	長さの目安	音	背景	向いている形式
会社紹介・商品紹介の動画の最初や最後	数秒	付けることが多い	動画の背景に合わせる	MP4 などの動画
展示会や店頭のモニターでのくり返し再生	数秒〜十数秒をくり返す	付けないことが多い	単色や写真	MP4 などの動画
SNS の動画の最初や最後	短め	場合による	投稿の形（縦長・正方形）に合わせる	縦横比ごとの動画
ホームページの読み込み画面・ヘッダー	ごく短い	付けない	透過（背景なし）	Lottie、SVG、アニメーション対応の画像
メールの署名・簡単な画面の挿し絵	短いくり返し	付けられない	単色	GIF など
オンライン会議やセミナーの開始画面	数秒	場合による	単色や写真	MP4 などの動画

使う場所が1つだけなら、その場所に合わせた1本で足ります。複数の場所で使うなら、長さや縦横比の違う版をまとめて頼むほうが、あとから1本ずつ頼むより手間がかかりません。

頼む前に決めておくこと

制作者に相談する前に、次の項目を社内で決めておくと、見積もりが正確になり、やり取りも短くなります。

1. 使う場所：上の表のどれで使うか。複数あれば優先順位も
2. 長さ：全体の秒数。動画の最初や最後に入れるなら短めが基本です
3. 音の有無：効果音や短い音楽を付けるか。付ける場合、音を作ってもらうのか、市販の音源を使うのか
4. 背景：単色の背景を入れるか、背景なし（透過）にするか
5. 縦横比：横長（16:9）、正方形（1:1）、縦長（9:16）のどれが必要か
6. くり返し：1回だけ再生して止めるか、くり返し再生するか
7. 動きの印象：落ち着いた、軽快な、力強いなど、会社の印象に合う言葉を2〜3個
8. 元のロゴデータ：ベクター形式（AI・SVG など）のデータが手元にあるか

動きの印象は、言葉だけでは伝わりにくいものです。参考にしたい動きの例があれば、「この部分の動き方が近い」と具体的に伝えます。ただし、他社の動くロゴをそのまま真似るよう頼むのは避けます。

形式の違いと選び方

動くロゴの形式は、大きく「動画」「アニメーション画像」「ホームページで動かすためのデータ」の3つに分かれます。

形式	どんなものか	透過（背景なし）	向いている場所	気をつけること
MP4 などの動画	いちばん一般的な動画のファイル	基本は背景あり	動画編集、展示会のモニター、SNS	透過が必要なら、透過に対応した形式を別に頼む
GIF	昔からあるアニメーション画像	一部のみ（半透明は不可）	メールの署名、簡単な画面	使える色が少なく、グラデーションは荒れやすい
APNG・WebP	PNG や WebP を動かせるようにした画像	対応	ホームページの挿し絵	使う環境で表示できるかを確かめる
Lottie	動きを数値のデータ（JSON）として持つ形式	対応	ホームページやアプリ	表示用の仕組みを組み込む必要がある
SVG と CSS	ロゴの図形をホームページの部品として動かす方法	対応	ホームページのヘッダーなど	複雑な動きには向かない。組み込みは制作会社の作業

GIF は1つの画像で使える色が限られるため、色数の多いロゴやグラデーションのあるロゴでは、仕上がりが荒く見えることがあります。透過や色の再現を重視するなら、APNG や WebP、Lottie などを検討します。Lottie は、動画編集ソフト（Adobe After Effects）で作った動きを数値のデータとして書き出し、ホームページやアプリで再生する仕組みです。動画のファイルより軽く済むことが多い一方で、表示するための仕組みをホームページに組み込む作業が要ります。

どの形式が合うか分からないときは、使う場所を伝えて制作者に提案してもらうのが確実です。少なくとも、編集の元になるデータ（制作に使ったソフトのファイル）を受け取るかどうかは、最初に決めておきます。元データがあれば、あとから長さや色を変えるときに作り直しにならずに済みます。静止画のロゴで受け取るデータの種類はロゴのデータ形式にまとめています。

費用の考え方と見積もりの内訳

動くロゴの費用は、秒数、動かす要素の数、音の有無、書き出す形式の数、修正の回数で大きく変わります。依頼先も、フリーランスの制作者、映像の制作会社、デザイン会社と幅があり、同じ「数秒のロゴアニメーション」でも、何が含まれているかで金額が変わります。この記事では一律の相場の金額は示さず、見積もりを比べるときに見るべき内訳を整理します。

内訳の項目	何をする作業か	費用が増えやすい条件
企画・絵コンテ	動きの案を考え、流れを絵や文章で示す	案を複数出してもらう
ロゴデータの準備	ロゴを動かせるように部品ごとに分ける	ベクター形式のデータが無く、作り直しが要る
動きの制作	実際にロゴを動かす	秒数が長い、動かす部品が多い、立体的な動き
音	効果音や短い音楽を付ける	音をオリジナルで作る
書き出し	動画や画像のファイルにする	形式や縦横比の数が多い、透過版も必要
修正	確認後の手直し	見積もりに含まれる回数を超える
ホームページへの組み込み	サイトで動くように設定する	既存のサイトの作りに合わせる必要がある

見積もりを受け取ったら、次のことを確かめます。

• 上の表の項目のうち、どれが含まれ、どれが別料金か
• 書き出す形式と縦横比の一覧が書かれているか
• 修正は何回まで含まれるか、どの段階まで直せるか
• 編集の元になるデータを受け取れるか
• 音源を使う場合、その音源の使える範囲（公開する場所や期間）が確かめられているか

合計額が近くても、片方は書き出しが1形式だけ、もう片方は3形式と元データ付き、ということがあります。内訳を揃えてから比べるのが、見積もりを読み違えない方法です。

良い動きと、避けたい動き

動くロゴは、目立たせるほどよいわけではありません。最後に止まったときに、ふだんの静止画のロゴと同じ姿になっていることが大切です。

• 良い例：数秒の短い動きで、最後は静止画のロゴと同じ形・同じ色・同じ比率で止まる。動きの順番が、マークから社名へなど、読ませたい順になっている
• 悪い例：長く派手に動き、最後のロゴが静止画と違う比率で止まる。点滅や激しい色の切り替えがあり、見ていて落ち着かない

最後の形を静止画と揃えておけば、動画の最後の画面を切り出しても、いつものロゴとして使えます。静止画のロゴの余白や色違いの決まりがある場合は、動くロゴもそれに合わせます。決まりの作り方はロゴの使用規定の作り方で説明しています。

ホームページで動かすときの配慮

ホームページで動くロゴを使うときは、見る人への配慮も必要です。ウェブのアクセシビリティ（誰でも使いやすくするための配慮）の国際的な指針である WCAG 2.2 では、次のような基準が示されています。

• 自動で始まり、5秒より長く続き、ほかの内容と並んで表示される動きには、利用者が一時停止・停止・非表示にできる手段を用意する
• 1秒間に3回を超えて点滅するものを置かない（決められた基準値を下回る場合を除く）

また、パソコンやスマートフォンには、画面の動きを減らす設定があります。ホームページの側では、この設定を読み取って動きを止めたり小さくしたりできます（prefers-reduced-motion という仕組みです）。動くロゴをサイトに組み込むときは、次の点を制作会社に伝えておきます。

• 読み込み画面の動きは短くし、何度も見る人の邪魔にならないようにする
• くり返し動く場合は、止められるようにするか、数回で止まるようにする
• 動きを減らす設定の人には、静止画のロゴを表示する
• 動くロゴのファイルが重くなり、ページの表示が遅くならないようにする

画像の重さの考え方はホームページの画像のサイズと形式を参照してください。

権利で確かめること

動くロゴを作るときは、権利の確認も静止画のロゴと同じように必要です。

確かめること	内容
元のロゴの著作権	ロゴを作った会社と別の会社に動きを頼む場合、ロゴを加工して使うことが契約で認められているか
動くロゴの著作権	動きの部分の権利がどちらにあるか。納品後に自社で編集や転用ができるか
音源	市販の音源を使う場合、使える媒体や期間に制限がないか
商標	動きそのものを商標として守りたい場合の手段

ロゴの著作権の扱いはロゴの著作権は誰のものかにまとめています。商標については、特許庁の制度で、文字や図形が時間の経過に伴って変化する「動き商標」や、音の「音商標」も、2015年4月1日から登録の対象になっています。動くロゴそのものを商標として守るかどうかは、使い方と費用を見て弁理士に相談します。

依頼前のチェックリスト

• 使う場所を書き出し、優先順位を付けた
• 長さ、音の有無、背景（透過かどうか）、縦横比、くり返しを決めた
• 動きの印象を2〜3個の言葉で伝えられる
• ベクター形式のロゴデータが手元にある
• 受け取る形式の一覧と、編集の元データを受け取るかを決めた
• 見積もりの内訳（企画、データ準備、制作、音、書き出し、修正、組み込み）を確かめた
• ホームページで使う場合、止める手段と動きを減らす設定への対応を伝えた
• 著作権と音源の使える範囲を確かめた

まとめ

動くロゴは、使う場所によって、ちょうどよい長さ、音、背景、形式が変わります。まず使う場所を書き出し、長さや縦横比、透過の要否を決めてから頼むと、受け取ったあとに使えないという手戻りを防げます。費用は内容によって幅が大きいため、見積もりは合計額ではなく内訳で比べます。ホームページで動かすなら、止める手段や動きを減らす設定への配慮も伝え、権利の扱いも契約の段階で確かめておきましょう。

Lapisデザインラボでは、ロゴを作るときに、使う場所に合わせたデータの形や権利の扱いもあわせてご相談いただけます。内容は料金プランをご覧ください。