DVD Screensaver Maker 使用教學

Name: DVD Screensaver Maker
Author: DVD Screensaver Maker

發表於 2026 年 8 月 1 日

DVD Screensaver Maker 是一套在瀏覽器裡執行的彈跳 DVD 標誌模擬器。顏色、速度、大小、彈跳的對象都能自由調整，成果可以匯出成單一檔案的 HTML、GIF，或 MP4、WebM 影片。不用註冊、沒有浮水印，完全免費。

它本來就是設計成不用看說明也能上手：打開，標誌已經在動了。不過第一個畫面背後藏著比表面更多的功能，而且有幾項操作的行為，要事後回頭看才會恍然大悟。這篇就把它們一項一項走過一遍。

起點是畫面本身。你會碰到的每一樣東西都落在四個區域之一，先記住名稱，後面的說明會好懂許多。

應用程式的畫面配置

標示並命名四個區域的介面：右上是 Navbar，左側邊緣是 Setting Group，旁邊的面板是 Setting Options，其餘是 Live Preview Canvas

Navbar — 每一頁的右上角。指南、主題、語言，以及會做出檔案的 Export 按鈕。
Setting Group — 左側邊緣的圖示列，共四組：Background、Asset、Animation 與 Presets。按下其中一個，旁邊顯示的內容就會換掉。
Setting Options — 面板本體，放的是所選那一組的操作項目。切換群組時，畫面上唯一會換內容的就是這裡。
Live Preview Canvas — 正在跑的螢幕保護程式本身。每一項更動在你調整的當下就反映在這裡，所以沒有預覽按鈕，也沒有什麼要確認。

導覽列的操作

每一頁的右上角、畫布上方有四項操作。兩項改變你看到的樣子，一項切換語言，一項是拿到檔案的入口。

按鈕	說明	畫面
Guides	燈泡圖示會打開一份簡短的指南選單，最下面的 More 通往完整清單。
Theme	太陽與月亮的按鈕在深色與淺色主題之間切換。圖示顯示的是按下後會變成的主題，不是目前的狀態，所以看到月亮就表示按下去會變深色。按 `D` 也一樣。
Language	語言按鈕讓整個網站在 14 種語言之間切換，而且會留在你正在讀的那一頁。每種語言有自己的網址，所以像 `/fr/` 這樣的連結可以直接分享。
Export	Export 按鈕會打開匯出選單：Save as HTML、Download GIF、Download WebM 與 Download MP4。

畫布上的操作

畫布上有五個按鈕：左上角三個，右上角兩個。每一個都有快捷鍵，而且只要游標停在文字輸入框裡，所有快捷鍵都會被忽略。

按鈕	說明	按鍵
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。三個項目，各有自己的開關，而且要開啟之後才會顯示對應的操作。

畫面	說明
	Color — 設定背景顏色，由上到下：顏色區域與色相滑桿 — 用眼睛挑顏色。透明度滑桿 — 有多透明。歸零時背景會完全消失。格式按鈕 — 在 Hex、RGB、HSL 之間切換數值的寫法。 Hex 欄位 — 直接輸入精確的值，例如品牌色。滴管 — 從螢幕上任何地方吸取顏色。隨機 — 幫你挑一個。色票 — 七個現成的顏色，各按一下即可。把 Color 開關關掉，就等於把透明度拉到零，一次點擊即可讓背景變透明。當螢幕保護程式要疊在別的東西上頭——例如直播的覆蓋層——透明背景才派得上用場。
	Image — 用你自己的圖片鋪在動畫後面，取代單色背景。開啟後拖放區就會出現：拖放區 — 把檔案拖進來，或按 browse 挑一個。PNG、JPG、WebP、GIF、SVG 都可以。網址欄位 — 不上傳，改用貼連結的方式。透明度滑桿 — 圖片載入後就會出現。把圖片壓淡，讓標誌不會被吃掉。
	CRT Scanlines — 在整個畫布上疊一層細細的水平線，做出老電視的質感。預設關閉。走懷舊路線很搭，但和乾淨的商務風格相衝。

兩個開關是依這個順序疊起來運作的： 先塗顏色，再把圖片疊上去。由此可以推出兩件事。

想要真正透明的背景，就把兩個都關掉。 什麼都不會被塗上，螢幕保護程式後面的東西會直接透出來——覆蓋層要的正是這個。
想幫圖片染上色調，就把兩個都打開。 因為顏色鋪在下層，把圖片的透明度滑桿調低，那個顏色就會透出來。

物件設定

這一組 Setting Group 決定什麼在彈跳。先在上方三種模式裡挑一個，再用下面的操作設定大小與顏色。下面那些操作在三種模式中都一樣。

Default	Text	Image

經典的 DVD 標記。沒有什麼要設定的：選了它就開始彈。	你自己的文字，最多 30 個字元。欄位旁的按鈕會開啟表情符號選擇器，所以單一個表情符號也行。	你自己準備的圖。拖進檔案、挑一個，或貼上網址。PNG、JPG、WebP、GIF 與 SVG 都可以。JPG 沒有透明的部分，所以會連著底色以方形彈跳。PNG、WebP、GIF 與 SVG 可以是透明的，那樣就只有標誌本身在彈。

模式選擇的下方，是三種模式共用的操作。

畫面	說明
	大小與數量 Scale — 物件的大小，以百分比表示。 Count — 同時彈跳的數量。只要這個值是 1，下一組的 Mutual Collision 就完全不會有作用。 Bounding Box — 把實際用來判定碰撞的矩形畫出來。要弄清楚某個東西為什麼在那裡反彈，這是最快的方法。
	顏色 Colorize — 究竟要不要在物件上疊一層顏色。 Randomize on Impact — 每次撞到邊緣就換一個新顏色，和最早的螢幕保護程式一樣。 Custom Color — 改成固定一個顏色，用下方的選色器指定。

Colorize 的行為會隨模式而不同。

Default 與 Text — Colorize 被鎖住，關不掉。這兩者都是以單一色塊繪製，沒有顏色填進去就什麼都看不見。你仍然能決定的是這個顏色從哪裡來：Randomize on Impact 或 Custom Color。
Image — Colorize 由你決定。關閉時不會在圖片上疊任何東西，原本的顏色會完整保留。開啟時就和上面一樣，在 Randomize on Impact 與 Custom Color 之間選一個。

Randomize on Impact 與 Custom Color 是同一個二選一的開關，不是兩個各自獨立的選項：打開其中一個，另一個就會關掉，而選色器只會在 Custom Color 這一側出現。

動畫設定

這一組 Setting Group 決定物件怎麼動。三項操作，其中第一項對匯出的檔案和對預覽的影響一樣大。

畫面	說明
	Speed — 從 0.1x 到 10x 的倍率，預設是 1.5x。它決定的不只是預覽的快慢，匯出檔案的節奏也由它決定。 Mutual Collision — 讓標誌彼此反彈，而不是互相穿過去。只要前一組的 Count 是 1，它就不會有任何作用。 Cursor Attractor — 標誌會被滑鼠游標吸引，跟著它走而不是直線前進。無論被拉得多用力，速度都有上限，所以不會失控。

畫面

說明

Animation 面板，Speed 滑桿在 1.5x，Mutual Collision 與 Cursor Attractor 都是關閉的

Speed — 從 0.1x 到 10x 的倍率，預設是 1.5x。它決定的不只是預覽的快慢，匯出檔案的節奏也由它決定。
Mutual Collision — 讓標誌彼此反彈，而不是互相穿過去。只要前一組的 Count 是 1，它就不會有任何作用。
Cursor Attractor — 標誌會被滑鼠游標吸引，跟著它走而不是直線前進。無論被拉得多用力，速度都有上限，所以不會失控。

預設設定

最後一組 Setting Group，也是唯一會改動其他全部設定的一組。一個預設只要一次點擊，就會把 Background、Asset 與 Animation 裡的每一項都設定好，因此它既是捷徑，也是看清某種風格如何組成的方法。

畫面	說明
	Search presets — 依名稱過濾清單。五個預設 — 各按一下即可。載入一個會一次換掉所有設定，所以常見的做法是先載入最接近的那一個，再從那裡微調。

每一個都是完整的一整套。其中兩個的命名取自它做出的畫面形狀而非風格，替特定平台挑選時值得先知道。

預設	會設定的內容
1999 Classic	16:9、開啟 CRT 掃描線、一個原尺寸的 DVD 標誌、速度 1.5x。在這套工具能做到的範圍內，最忠實的原版模樣。
Corp Snooze	黑底 16:9，SYNERGY 這個字以 0.8 的大小放四個，顯示碰撞框，開啟相互碰撞，速度放慢到 0.8x。
Short Scroll	9:16 直式 — 手機與限時動態的形狀。圖片模式，兩個 1.4 大小的物件，速度 1.8x。
Post Perfect	1:1 正方形 — 貼文的形狀。三個 0.65 大小的 DVD 標誌，開啟相互碰撞，速度 1.8x。
Ghastly Graveyard	黑底 16:9，開啟 CRT，五個 1.65 大小的骷髏表情符號，速度 1.8x。

預設會清掉你放進去的每一張圖片。 載入一個預設時，它會先重設物件圖片、背景圖片與所有顏色設定，才套上自己的值——所以請在挑好預設之後再放你的標誌，絕對不要在之前。

這一點在 Short Scroll 上最容易讓人踩到。它會選擇圖片模式，卻在同一個動作裡把圖片清掉，所以一開始是預設的 DVD 標誌在彈。這不是錯誤，而是圖片模式下沒有載入圖片時的預設行為：放上你自己的圖，它就會接手。

該選哪一種匯出？

四種格式，分成 Code、Animation 與 Video 三類。哪一種才對，完全取決於這個檔案要放到哪裡去。

畫面	說明
	Save as HTML — 單一檔案，不用網路就能無止盡循環播放。最適合整天開著的螢幕，例如接待櫃檯或閒置的顯示器。 Download GIF — 不需要影片播放器就能到處播，適合聊天室、文件與投影片。同樣長度下它是最大的檔案，所以請盡量短。 Download WebM — 和 MP4 同樣畫質但檔案更小，是網頁上的最佳選擇。部分較舊的軟體開不起來。 Download MP4 — 要在別人的裝置上確實播得出來時最穩的選擇。最高 1080p，最長一小時。

畫面

說明

匯出選單，CODE 底下是 Save as HTML，ANIMATION 底下是 Download GIF，VIDEO 底下是 Download WebM 與 Download MP4

Save as HTML — 單一檔案，不用網路就能無止盡循環播放。最適合整天開著的螢幕，例如接待櫃檯或閒置的顯示器。
Download GIF — 不需要影片播放器就能到處播，適合聊天室、文件與投影片。同樣長度下它是最大的檔案，所以請盡量短。
Download WebM — 和 MP4 同樣畫質但檔案更小，是網頁上的最佳選擇。部分較舊的軟體開不起來。
Download MP4 — 要在別人的裝置上確實播得出來時最穩的選擇。最高 1080p，最長一小時。

不管選哪一個，打開的對話框上方都會有該格式自己的選項，下方則是唯讀的設定摘要。

匯出格式：Save As HTML

畫面	說明
	Full Screen Export — 讓存下來的網頁在任何開啟它的螢幕上都填滿畫面。這會蓋過你設定的長寬比，所以若你就是要 9:16 或 1:1，請維持關閉。 Download .html — 一次點擊就建立檔案並存檔，處理過程中會顯示 Building your file…。 YOUR SETTINGS — 把所有會寫進檔案的設定整理成唯讀摘要。

匯出格式：Download GIF

畫面	說明
	Quality — Low、Mid 或 High。它決定的是畫面尺寸與錄製的秒數，而不是動作的流暢度。 Generate GIF — 建立檔案，之後按鈕會變成 Download GIF。每一種畫質做過一次就會保留下來，所以回到已經做好的那一種是立即完成的。 YOUR SETTINGS — 把所有會被錄進去的設定整理成唯讀摘要。

三個畫質等級的差別在兩個地方，而影格率不在其中：

畫質	長邊	長度	影格率
Low	480 px	15 秒	24 fps
Mid	720 px	20 秒	24 fps
High	1280 px	30 秒	24 fps

三種都是以每秒 24 影格錄製，所以往上調一級不會讓動畫更流暢，只會讓畫面更大、循環更長。在 16:9 之下依序是 480 × 270、720 × 405 與 1280 × 720。GIF 會把每一格完整存下來，所以 High 等於 720 格寬 1280px 的畫面，檔案膨脹得很快。如果要放到有上傳大小限制的地方，請從 Low 開始。

匯出格式：Download WebM 與 MP4

兩種影片格式共用同一個對話框，差別只有標題、按鈕與副檔名。

畫面	說明
	Resolution — 480p、720p 或 1080p。實際的像素尺寸取決於你的長寬比：1080p 在 16:9 之下是 1920 × 1080，在 9:16 之下則是 1080 × 1920。 Duration — 從 1 分鐘到 1 小時，以一分鐘為單位。不論你上次用的是多少，它每次都從 5 分鐘開始。 Download MP4 / Download WebM — 建立影片並存檔，編碼過程中會顯示進度。 YOUR SETTINGS — 把所有會被錄進去的設定整理成唯讀摘要。

畫面

說明

Download MP4 對話框，含 480p、720p、1080p 解析度、設在一小時的長度滑桿、Download MP4 按鈕與下方的 YOUR SETTINGS 摘要

Resolution — 480p、720p 或 1080p。實際的像素尺寸取決於你的長寬比：1080p 在 16:9 之下是 1920 × 1080，在 9:16 之下則是 1080 × 1920。
Duration — 從 1 分鐘到 1 小時，以一分鐘為單位。不論你上次用的是多少，它每次都從 5 分鐘開始。
Download MP4 / Download WebM — 建立影片並存檔，編碼過程中會顯示進度。
YOUR SETTINGS — 把所有會被錄進去的設定整理成唯讀摘要。

解析度指的是短邊，所以實際畫面取決於你在畫布上設定的比例：

解析度	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

影片同樣以每秒 24 影格錄製，和 GIF 一樣。這兩項操作改變的只有解析度和長度。

在每一個等級上，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 Screensaver Maker

常見問題

要怎麼做出彈跳的 DVD 標誌？

打開網頁時它就已經在跑了，沒有什麼要啟動的。想一鍵完成就到 Presets 分頁挑一個預設；想自己決定，就在另外三個分頁裡改標誌、顏色和速度。滿意之後，按右上角的 Export，選擇 GIF、MP4、WebM 或單一檔案的 HTML。全程不需要帳號，也不用註冊。

要怎麼用自己的標誌取代 DVD 標誌？

打開 Asset 分頁，選 Image，然後把檔案拖進方框、從電腦裡挑一個，或貼上圖片網址。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——這個選項會蓋過你先前選的長寬比。