DVD Screensaver Makerの使い方
DVD Screensaver Maker は、跳ねるDVDロゴをブラウザ上で再現するシミュレーターです。色・速度・大きさ・跳ねるものそのものまで自由に変えられ、仕上がりは単体の HTML ファイル、GIF、MP4 または WebM の動画として書き出せます。登録不要、透かしなし、完全無料です。
説明書がなくても使えるように作ってあります。開けば、もうロゴが動いています。ただし最初の画面の奥には見えているより多くの機能があり、いくつかの操作は、あとから振り返って初めて腑に落ちる挙動をします。このページでは、そのすべてを順に見ていきます。
出発点は画面そのものです。触れるものはすべて4つの領域のどれかに収まっているので、名前を覚えておくと、以降の説明がぐっと追いやすくなります。
アプリの画面構成
- Navbar — どのページでも右上にあります。ガイド、テーマ、言語、そしてファイルを作る Export ボタン。
- Setting Group — 左端に並ぶアイコンの列。Background、Asset、Animation、Presets の4グループ。どれかを押すと、隣に表示される内容が変わります。
- Setting Options — パネル本体で、選んだグループの操作項目が並びます。グループを切り替えたときに中身が入れ替わるのは、画面のここだけです。
- Live Preview Canvas — 動いているスクリーンセーバーそのもの。変更した瞬間にここへ反映されるので、プレビューボタンも確定操作もありません。
ナビゲーションバーの操作
どのページでも右上、キャンバスの上に4つの操作が並びます。2つは見た目を変え、1つは言語を切り替え、1つはファイルを受け取るための入り口です。
| ボタン | 説明 | 画面 |
|---|---|---|
| Guides | 電球のアイコンを押すとガイドの短いメニューが開きます。一番下の More から一覧全体へ進めます。 |  |
| Theme | 太陽と月のボタンで、ダークテーマとライトテーマを切り替えます。アイコンは今の状態ではなく、押したあとに切り替わる先を示します。つまり月が出ていれば、押すとダークになります。D キーでも同じです。 |   |
| Language | 言語ボタンでサイト全体を 14言語 の間で切り替えられ、読んでいたページにそのまま留まります。言語ごとに専用のアドレスがあるので、/fr/ のようなリンクはそのまま共有できます。 |  |
| Export | Export ボタンで書き出しメニューが開きます。Save as HTML、Download GIF、Download WebM、Download MP4 の4つです。 |  |
キャンバスの操作
キャンバス上には5つのボタンがあります。左上に3つ、右上に2つ。それぞれにショートカットキーがあり、文字入力欄にカーソルがある間はすべて無効になります。
| ボタン | 説明 | キー |
|---|---|---|
| Play / Pause | アニメーションをその場で止めます。 | Space |
| Reset | 各ロゴを新しい位置と向きから出し直します。 | R |
| Sound | 初期状態ではオフ。壁に当たるたびにカチッと鳴ります。 | M |
| Aspect Ratio | 16:9、9:16、1:1 を順に切り替えます。全画面中は働きません。 | A |
| Full Screen | ブラウザウィンドウいっぱいに広げます。 | F · Esc |
アスペクト比は書き出すファイルの形を決めます。 ディスプレイなら16:9、スマートフォンなら9:16、フィードへの投稿なら1:1。書き出す前に選んでください。あとから変えるとファイルを作り直すことになります。どの書き出しダイアログでも、現在の比率は YOUR SETTINGS の一覧に表示されます。
サウンドの状態が、書き出しに音が入るかどうかを決めます。 オンなら MP4 と WebM には跳ね返りの音が実際の音声トラックとして入り、単体の HTML ファイルも同じ電子音を鳴らします。GIFは音声をまったく持てないため、GIFはどう設定しても無音です。
背景の設定
最初の Setting Group です。3つの項目があり、それぞれ独自のスイッチを持ち、オンにして初めて操作項目が現れます。
| 画面 | 説明 |
|---|---|
 | Color — 背景色を決めます。上から順に:
|
 | Image — 単色の代わりに、自分の画像をアニメーションの背後に敷きます。オンにするとドロップ枠が現れます:
|
 | CRT Scanlines — キャンバス全体に細い横線を重ね、昔のテレビらしい質感を出します。初期状態ではオフ。懐かしさを狙うなら効きますが、かっちりしたビジネス寄りの見た目とは相性がよくありません。 |
2つのスイッチはこの順番で重なって働きます。 まず色が塗られ、その上に画像が乗ります。ここから2つのことが導けます。
- 本当に透明な背景がほしいなら、両方をオフに。 何も塗られないので、スクリーンセーバーの背後にあるものがそのまま透けます。オーバーレイに必要なのは、まさにこれです。
- 画像に色味をのせたいなら、両方をオンに。 色が下に敷かれているので、画像の透明度スライダーを下げると、その色が透けて見えてきます。
オブジェクトの設定
この Setting Group は、何が 跳ねるかを決めます。上部で3つのモードから1つを選び、その下の操作で大きさと色を決めます。下の操作は、どのモードでも共通です。
| Default | Text | Image |
|---|---|---|
 |  |  |
| おなじみのDVDマーク。設定するものは何もなく、選べばそのまま跳ねます。 | 好きな文字を 30文字 まで。欄の隣のボタンから絵文字を選べるので、絵文字ひとつだけでも使えます。 | 自分で用意した画像。ファイルをドロップするか、選ぶか、URLを貼り付けます。PNG、JPG、WebP、GIF、SVG のいずれも使えます。JPGには透明部分がないので、背景ごと四角いまま跳ねます。PNG、WebP、GIF、SVG は透明にできるので、その場合はロゴだけが跳ねます。 |
モードの選択欄の下には、3つすべてに共通する操作が並びます。
| 画面 | 説明 |
|---|---|
 | 大きさと数
|
 | 色
|
Colorizeの挙動はモードによって変わります。
- Default と Text — Colorize は固定されていて、オフにはできません。どちらも単色の平らな図形として描かれるため、塗る色がなければ何も見えなくなってしまうからです。それでも選べるのは、その色をどこから取るか——Randomize on Impact か Custom Color か——という点です。
- Image — Colorize は自由に切り替えられます。オフなら画像には何も重ならず、元の色がそのまま残ります。オンなら、上と同じく Randomize on Impact と Custom Color から選びます。
Randomize on Impact と Custom Color は、独立した2つではなく1つの二者択一です。 一方をオンにすると他方が切れ、カラーピッカーは Custom Color 側でだけ現れます。
アニメーションの設定
この Setting Group は、オブジェクトが どう 動くかを決めます。操作は3つで、最初のひとつはプレビューだけでなく、書き出すファイルにも同じだけ効きます。
| 画面 | 説明 |
|---|---|
 |
|
プリセットの設定
最後の Setting Group であり、他のすべてを書き換える唯一のグループです。プリセットはワンクリックで Background、Asset、Animation のすべての項目を設定するため、近道であると同時に、ある見た目がどう組み立てられているかを知る手段にもなります。
| 画面 | 説明 |
|---|---|
 |
|
どれも完成された一式です。うち2つは見た目ではなく、作られる画面の形にちなんだ名前になっています。特定のプラットフォーム向けに選ぶときは、覚えておくと役に立ちます。
| プリセット | 設定される内容 |
|---|---|
| 1999 Classic | 16:9、CRT線オン、フルサイズのDVDロゴ1つ、速度1.5x。このツールで再現できるかぎり忠実な、元祖の姿です。 |
| Corp Snooze | 黒地に16:9、SYNERGY の文字をサイズ0.8で4つ、当たり判定の枠を表示、相互衝突オン、速度は0.8xに落としてあります。 |
| Short Scroll | 9:16の縦長 — スマートフォンとストーリーの形。画像モード、サイズ1.4のオブジェクトを2つ、速度1.8x。 |
| Post Perfect | 1:1の正方形 — 投稿の形。サイズ0.65のDVDロゴを3つ、相互衝突オン、速度1.8x。 |
| Ghastly Graveyard | 黒地に16:9、CRTオン、どくろの絵文字をサイズ1.65で5つ、速度1.8x。 |
プリセットは、読み込ませた画像をすべて消します。 読み込むと、オブジェクトの画像、背景の画像、すべての色設定が初期化されてから、プリセット自身の値が入ります。ですからロゴを読み込ませるのは、プリセットを選んだ あと にしてください。先ではいけません。
とくに引っかかりやすいのが Short Scroll です。画像モードを選びながら、同じ動作で画像を消してしまうため、最初は既定のDVDロゴが跳ねている状態から始まります。これは不具合ではなく、画像モードで画像が読み込まれていないときの既定の動きです。自分の画像を入れれば、そちらに置き換わります。
どの書き出しを選ぶべきか
形式は4つあり、Code、Animation、Video に分かれています。どれが正解かは、そのファイルをどこへ持っていくかで決まります。
| 画面 | 説明 |
|---|---|
 |
|
どれを選んでも、開いたダイアログの上部にはその形式の設定があり、下には設定内容の一覧が読み取り専用で表示されます。
書き出し形式：Save As HTML
| 画面 | 説明 |
|---|---|
 |
|
書き出し形式：Download GIF
| 画面 | 説明 |
|---|---|
 |
|
3つの画質は2点で違い、フレームレートはそこに含まれません:
| 画質 | 長辺 | 長さ | フレームレート |
|---|---|---|---|
| Low | 480 px | 15秒 | 24 fps |
| Mid | 720 px | 20秒 | 24 fps |
| High | 1280 px | 30秒 | 24 fps |
3つとも毎秒24フレームで録画します。 ですから画質を上げてもなめらかにはならず、画面が大きくなり、ループが長くなるだけです。16:9なら順に 480 × 270、720 × 405、1280 × 720 になります。GIFは各コマを丸ごと保存するため、Highは幅1280pxのコマが720枚となり、ファイルは一気に膨らみます。アップロード容量に制限のある場所へ載せるなら、Lowから始めてください。
書き出し形式：Download WebM と MP4
2つの動画形式は同じダイアログを共有します。違うのは見出しとボタン、そして拡張子だけです。
| 画面 | 説明 |
|---|---|
 |
|
解像度は短辺の値なので、実際の画面はキャンバスで設定した比率によって変わります:
| 解像度 | 16:9 | 9:16 | 1:1 |
|---|---|---|---|
| 480p | 854 × 480 | 480 × 854 | 480 × 480 |
| 720p | 1280 × 720 | 720 × 1280 | 720 × 720 |
| 1080p | 1920 × 1080 | 1080 × 1920 | 1080 × 1080 |
動画もGIFと同じく毎秒24フレームで録画します。 この2つの操作で変わるのは、解像度と長さだけです。
どの段階でも、WebMのほうがファイルは小さくなります。 同じ映像をMP4より低いビットレートでエンコードするためで、1080pでは 5.2 対 6.4 Mbps です。ファイルサイズを優先するならWebM、互換性を優先するならMP4を選んでください。
書き出しが遅いという警告はMP4でのみ表示されます。 お使いのパソコンにハードウェアのH.264エンコーダーがなく、720pか1080pを選んだときに出ます。WebMでは決して出ませんし、480pでも出ません。不具合ではありません。書き出し自体は動きますが、エンコードをサーバーではなくお使いのパソコンで行うため、時間がかかるというだけです。
つまずきやすいところ
- サウンドはオフ
意図的な初期設定です。キャンバスのスピーカーボタンで、壁に当たるたびのカチッという音が入ります。
- 比率を先に決める
この表示はプレビューだけでなく、書き出すファイルの形も決めます。あとから変えると書き出し直しになります。
- 透明なPNGを使う
JPGは透明にできないので、背景ごと四角いまま跳ねます。
- Colorizeは固定される
DefaultとTextのときだけです。Imageに切り替えれば解除されます。
- Mutual Collisionは相手が要る
Countが1のあいだは、まったく何も起こりません。
- Full Screenは比率に勝つ
HTMLのダイアログでチェックを入れると、選んだ比率は破棄されます。
ひとつだけできないこと
狙って角に当てることは、このツールではできません。
ここでは各ロゴが 25°から65°のあいだのランダムな角度 で動き出します。元祖のDVDプレーヤーのように45°固定ではありません。おかげで軌道は単調にならず、見た目も良くなりますが、その代わり角へのヒットは独自の理屈で起こり、往年のスクリーンセーバーが従っていたきれいな法則からは外れます。角に当てることそのものが目的なら、その背後にある数学——そして、なぜ設定によっては永遠に当たらないのか——は、それだけで一つの話題です。
よくある質問
跳ねるDVDロゴはどう作りますか？
ページを開いた時点ですでに動いています。起動操作はありません。ワンクリックで仕上げたいなら Presets タブからプリセットを選び、自分で決めたいなら他の3つのタブでロゴ・色・速度を変えてください。 納得できたら右上の Export から GIF、MP4、WebM、または単体のHTMLファイルを選びます。 アカウント登録は一切不要です。
DVDロゴの代わりに自分のロゴを使うには？
Asset タブを開いて Image を選び、枠にファイルをドロップするか、パソコンから選ぶか、画像のURLを貼り付けます。PNG、JPG、WebP、GIF、SVG のいずれも使えます。ロゴのまわりに四角い枠を出したくない場合は、背景が透明なPNGかSVGを使ってください。 元の色をそのまま残すには Colorize をオフのままにします。
Colorizeがオフにできないのはなぜですか？
Default か Text を選んでいるからです。どちらも単色の平らな図形として描かれるため、色だけが姿を見せる手がかりであり、スイッチは固定されたままになります。 Image に切り替えれば解除されます。持ち込んだ画像には、すでに自前の色があるからです。
どの書き出し形式を選べばいいですか？
動画が再生されない場所——チャット、文書、スライド——にはGIF。どんな環境でも再生させたいならMP4。 ウェブ上で同じ画質をより小さいファイルに収めたいならWebM。そして、プレーヤーもネット接続もない画面で流すなら、 単体のHTMLファイルです。
DVD Screensaver Makerは無料ですか？
はい。すべての形式、すべての解像度が対象で、透かしもアカウントも書き出し回数の制限もありません。 シミュレーションも書き出しもすべてブラウザ内で動くので、読み込ませた画像はお使いのパソコンで処理され、 どこにも送信されません。
スクリーンセーバーを全画面で表示できますか？
できます。キャンバス右上のボタンでブラウザウィンドウいっぱいに広がります。F キーでも同じです。書き出したファイルのほうを全画面にしたい場合は、Save as HTML のダイアログで Full Screen Export にチェックを入れます。これは選んでいたアスペクト比より優先されます。
