如何用 FloSync 讓一部影片橫跨兩個螢幕

把並排的兩個螢幕變成一整幅寬畫面。這篇逐步指南從接上顯示器一路教到上線播放。

作者:Daniel Palka 7 分鐘閱讀 為 FloSync 0.5.0 撰寫
目錄
  1. 所需準備
  2. 步驟 1:延伸桌面到兩個螢幕
  3. 步驟 2:開啟 FloSync 並確認螢幕
  4. 步驟 3:新增您的影片
  5. 步驟 4:切換到展開模式
  6. 步驟 5:用全域畫布延伸修正裁切
  7. 步驟 6:預覽並拖曳時間軸
  8. 步驟 7:上線播放
  9. 步驟 8:退後觀察
  10. 這套做法能走多遠

FloSync 是一款免費的 Mac 與 Windows 應用程式,能讓影片橫跨多個螢幕播放。這篇指南要示範最簡單的情況:一台電腦、兩個螢幕,一部影片橫跨兩者,合成一幅連續畫面。

您將完成的效果:一部影片橫跨兩個螢幕播放,合成一幅畫面。

我們會用這段來自 Envato 的芝加哥 L 線列車片段做示範。

看完這篇指南,您就能在自己的螢幕上完成這套配置並上線播放:一台電腦驅動兩個顯示器,不需要網路,也不需要專用的視訊牆控制器。

所需準備

  • 一台能同時驅動兩台顯示器的電腦,不論是靠內建輸出埠,還是搭配合適的擴充基座或轉接器都可以(光看連接埠數量並不能保證這件事,如果不確定,請查看您機型的規格)
  • 兩個橫向螢幕,實體並排放置
  • FloSync:免費下載並使用(安裝方式請見開始使用
  • 一個要橫跨螢幕播放的影片檔案;它的比例不需要和您的螢幕完全一致

本教學的截圖使用兩個規格相同的 1080p 螢幕,只是為了方便示範,並非 FloSync 的硬性要求:任何尺寸的螢幕都能使用。如果螢幕超過兩個,請參考一台電腦能驅動多少台螢幕?

一台電腦直接驅動兩個螢幕的示意圖,未涉及任何網路。展開模式會把一幅畫面分配到兩個螢幕之間,左半部在螢幕 1,右半部在螢幕 2 一台電腦直接驅動兩個螢幕,不涉及任何網路。展開模式下,一幅畫面橫跨兩者:左半部在螢幕 1,右半部在螢幕 2。

步驟 1:延伸桌面到兩個螢幕

把兩個螢幕都接上,並將您的作業系統設定為延伸桌面,而不是重複顯示。

在顯示設定中,把它們排成左右順序,符合實際擺放位置。在 macOS 上,這是「系統設定」>「顯示器」>「排列」。在 Windows 上,於桌面按右鍵選擇「顯示設定」,然後把兩個螢幕圖示拖曳成相同的順序。FloSync 會直接讀取這個排列方式,所以先在這裡設定好,可以省去之後的一個步驟。

步驟 2:開啟 FloSync 並確認螢幕

安裝並開啟 FloSync,然後確認編排器(FloSync 的主視窗)顯示的兩個螢幕方塊,和您的排列方式一致。

FloSync 會自動偵測您的螢幕:您會在配置區域看到兩個方塊,並排顯示,順序和您剛才設定的一致。如果只看到一個方塊,或順序不對,請先檢查作業系統的顯示設定,再繼續下一步。

FloSync 編排器顯示兩個並排的空螢幕方塊,對應兩台實體顯示器,狀態列顯示「未載入任何內容」 兩個並排的空螢幕方塊,對應您的顯示器:目前尚未載入任何內容。

步驟 3:新增您的影片

把您的影片拖曳到標示「主要」的方塊上,或是點選該方塊,在「新增內容」底下選擇「影片/圖片」,然後瀏覽並選取檔案。

把檔案放上去之後,FloSync 只會把它載入到那個螢幕。另一個螢幕方塊暫時還是空的:全新安裝的 FloSync 會以獨立模式啟動,每個螢幕各自顯示自己的內容。下一步切換到展開模式後,這部影片就會橫跨兩個螢幕,並拆分顯示。

FloSync 編排器中,影片已載入顯示器 1 中標示為「主要」的方塊,顯示器 2 的方塊仍是空的 影片已載入顯示器 1 中標示為「主要」的方塊;顯示器 2 在下一步之前保持空白。

步驟 4:切換到展開模式

開啟頂端列的模式下拉選單,選擇「展開」。

編排器處於展開模式,模式下拉選單開啟,顯示獨立、鏡像與展開,展開已勾選,列車正從一個螢幕跨越到另一個螢幕 在展開模式下,同一段影片會拆分到兩個螢幕上,列車正從一個螢幕跨越到另一個。上方的下拉選單顯示了操作方式:開啟模式選單,選擇「展開」。

展開模式會把您的兩個螢幕當成一整片寬畫布,讓單一畫面橫跨兩個螢幕,正是連續場景所需要的效果。(如果想了解完整比較,三種模式的詳細說明都在顯示模式。)

如果您的螢幕看起來像下方這張截圖,兩邊同時顯示相同畫面,代表您還在鏡像模式。開啟模式下拉選單,選擇「展開」即可修正。

編排器處於鏡像模式,兩個螢幕同時顯示相同畫面 螢幕呈現這樣的畫面,代表您在鏡像模式,而不是展開模式。

步驟 5:用全域畫布延伸修正裁切

切換到展開模式之後,您可能會注意到列車的下半部被裁掉了一部分。這是因為這部影片比您兩個螢幕合併起來的畫面更高,所以 FloSync 會填滿寬度,同時裁掉多出來的高度。

如果畫面被裁切,請開啟全域畫布延伸(工具列上的網格圖示),把「上」欄位設為一個螢幕的高度(本教學使用的是 1080p 螢幕,因此填 1080),再點選「套用」;如果您的影片已經完全符合畫面,可以跳過這個步驟。

全域畫布延伸按鈕,位於頂端工具列。

全域畫布延伸會在您的真實螢幕周圍加入虛擬螢幕空間,讓原本會被裁掉的畫面有地方可以顯示。(快速調整中 1080p 那一排的 +T 按鈕,可以直接套用同樣的數值,不必自己輸入。)這樣會在您兩個真實螢幕的上方,新增一列虛擬螢幕空間,高度相當於一個 1080p 螢幕。如果您的兩個螢幕彼此相同,但解析度不是 1080p,請改用該解析度的高度數值,取代 1080。

全域畫布延伸對話框,「上」欄位設為 1080 全域畫布延伸對話框,「上」欄位設為 1080。

點選「套用」之後,FloSync 會自動開啟全域畫布預覽:您的全域畫布現在是 3840x2160,尺寸與影片完全相同,兩個真實螢幕則佔據下半部。(縮放圖示可以切換這個全域檢視和本機檢視。)上方那一段畫面仍然是虛擬的,不會出現在任何螢幕上;等您上線播放時,兩個實體螢幕會顯示下半部,也就是列車行駛的畫面。

全域畫布檢視畫面,兩個真實螢幕上方多了一列虛擬空間,完整畫面正好符合這個更高的畫布 延伸之後,兩個真實螢幕上方會多出一列虛擬空間,完整畫面現在正好符合這個更高的畫布。

同樣的做法適用於任何方向:調大「上」欄位可以看到畫面下方,調大「下」欄位可以看到畫面上方,調大「左」欄位可以看到畫面右側,調大「右」欄位則可以看到畫面左側。

步驟 6:預覽並拖曳時間軸

在編排器中拖曳時間軸滑桿,觀察畫面中的動作如何從一個螢幕方塊跨到另一個。

這是上線播放之前抓出任何問題的好時機。把時間軸拖到列車經過兩個螢幕交界的地方;整段動作應該連貫得像是在同一幅畫面中。

步驟 7:上線播放

在播放控制列中點選「上線播放」,然後選擇「上線播放(目前)」,讓您的影片在兩個顯示器上全螢幕播放。

上線播放 上線播放按鈕,位於編排器視窗的右下角。

FloSync 會在每個螢幕上開啟一個全螢幕視窗,編排器的控制項則會退居幕後。這才是真正的考驗:您在預覽方塊中看到的畫面,現在就是您實際螢幕上呈現的畫面。

步驟 8:退後觀察

退到觀眾會站的位置,看著影片這樣循環播放個幾遍。

看完之後,按下 ESC,或點選任一全螢幕視窗中的任何位置,就能退出並回到編排器。

這套做法能走多遠

這套安裝規模雖小,卻證明了 FloSync 所驅動的每一座更大型展開視訊牆都採用同一個核心概念:一幅畫面,乾淨俐落地分割到您提供的所有螢幕上。更大的視訊牆會帶來額外的硬體、網路與設定考量,後續文章會逐一說明;但您剛才用到的核心概念不會改變。

在明亮的車站大廳裡,兩個幾乎相連的螢幕正播放芝加哥 L 線列車片段,合成一幅連續畫面;前景可見模糊的行人身影 同樣的兩螢幕安裝方式,搬到車站大廳裡。

如果您要架設的是日復一日、無人看管運作的裝置,接下來值得在偏好設定中,設定登入時啟動 FloSync,以及自動上線。

這是一個關於如何使用 FloSync 的短篇系列,本篇是第一篇,也是最簡單的一篇指南。其他文章即將推出。

常見問題

設定好之後,我的影片看起來被拉伸或裁切了,該用哪一種填充模式?

FloSync 預設使用「填滿」:會讓畫面完全填滿兩個螢幕,並裁掉超出的部分。如果想要不同效果,可以開啟影片設定:「適應」會顯示完整畫面,但可能出現黑邊;「拉伸」會精確填滿螢幕,但畫面會變形,並不適合像這樣的連續場景。

為什麼我的影片在兩個螢幕上看起來一模一樣,而不是左右分割?

那是鏡像模式。鏡像模式會在每個螢幕上同步顯示完整畫面;展開模式則會把一幅畫面拆分到兩個螢幕上。請把模式下拉選單切換到「展開」。

我的影片需要是特定尺寸或比例,才能用在兩個螢幕上嗎?

不需要。市面上常見的影片都可以直接使用:FloSync 的「適應」或「填滿」設定會自動處理大多數比例不符的情況;其餘情況可用步驟 5 的全域畫布延伸,在您的螢幕周圍新增虛擬空間來重新取景。

我影片中重要的部分,在上方或下方被裁掉了,可以修正嗎?

可以。這種情況發生在您的影片比例和螢幕合併後的整體比例不一致時,這時「填滿」會裁掉超出的部分。開啟全域畫布延伸(工具列上的網格圖示),在缺少畫面的相反方向新增虛擬空間:調大「上」欄位可以看到影片下方的部分,調大「下」欄位可以看到上方部分,調大「左」欄位可以看到右側部分,調大「右」欄位則可以看到左側部分。上方的步驟 5,示範的就是「上」欄位的例子。

關於作者

Daniel Palka

Daniel Palka

FloSync 創辦人

Daniel 從 2007 年起就一直在打造多螢幕影片軟體,當時 FloSync 還只是一個名為 ArraySync 的學生專案。

我們的故事

相關文章