14讓相片 " 動 " 起來

CINEMAGRAPH 教學14.1 準備連續相片素材及參考資料 14.2 建立影格動畫14.3 預覽播放影格動畫14.4 儲存及瀏覽 GIF 檔案

讓相片 " 動 " 起來． Cinemagraph

Cinemagraph 由 Kevin Burg 及 Jamie Beck 攝影雙人組開始製作並有註冊的名稱，是一種介於相片與影片之間的藝術作品形態，細緻的動態常會讓人眼睛為之一亮，現在用 Photoshop CS6 也可以輕鬆做出 Cinemagraph 。

14.1 準備連續相片素材及參考資料

想要做出理想中的 Cinemagraph 會動的相片，一定要先準備穩定而且數量足夠連續性相片，才能做出相對流暢或是具有影格特色的作品，以下介紹要如何準備素材：

拍攝時不能晃動：光線來源及亮度要一致主題周圍的背景主題與背景的對比

素材準備需知

14.2 建立影格動畫想好主題、準備好素材後，接著我們要將所有素材匯入並建立影格動畫，一步步的建立起會動的 Cinemagraph 。

匯入準備好的素材

01 開啟 Mini Bridge

由於製作 Cinemagraph 需要多張的相片素材，而一一的置入的確是要花很多時間，現在我們透過 Mini Bridge 將同一個資料夾中的素材快速讀入。

02 匯入所有相片素材至圖層開啟 Mini Bridge 後接著要將素材匯入至 Photoshop 圖層中。

將相片轉換為影格動畫

01 建立影格首先要將素材直接轉為影格動畫。

02 設定影格畫面影格 1 畫面預計只要顯示 01.jpg 與 background.jpg 二個圖層，所以要將其他圖層隱藏起來。

03 複製影格以影格 1 為樣本，接著要複製並設定影格 2 與其他影格的圖層顯示模式。以相同的方式複製並設定其他 31 個影格，例如：影格 3 就是顯示 03.jpg 、 background.jpg 二個圖層，其他影格以此類推。

設計相片中動、靜態物件的表現Cinemagraph 中需設計出動與靜態的部分，此份作品預計有二位主角，分別是由相片左下角開出的 " 白色小貨車 " 與右上角開出的 " 銀色轎車 " ，這二台車是動態的，其他景物均呈靜態畫面。

01 編輯影格 1 - 將多餘的景物刪除於影格 1 首先看到的是 01.jpg 圖層的影像，先將作品中要呈現動態的二位主角選取並保留，而其他景物則需刪除，這樣一來就僅留下主角與指定的 background.jpg 畫面內容。

02 編輯影格 2 - 將多餘的景物刪除影格 2 中銀色轎車出場了，所以這次須先選取白色小貨車與對向的銀色轎車，再去除多餘的景物。

03 看看影格 1 、 2 的效果完成前面影格 1 、 2 的編輯動作後，來看看目前呈現的動、靜效果：

04 編輯影格 3 至影格 33

接著以相同的方法編輯影格 3 至影格 33 ，選取並保留白色小貨車與銀色轎車，刪除相片中不需要的景物。

05 修整重疊部分的細節當各影格中的影像僅保留二台車子而擦去多餘的景物後，會與最下層的 background.jpg 圖層影像重疊。這時會有部分影格中的畫面 " 怪怪 " 的，或是因前面去背動作沒有做的很仔細而使得重疊後效果較不自然，現在就使用 橡皮擦工具 來修整這個問題。

以此類推，由影格 1 開始檢查，到影格 33 ，凡是動、靜態景物重疊時，不自然的細節部分一一進行擦除修整。

修補去背後不完整的相片影格 26 之後，移動中的銀色轎車會一部分被對向來車遮到，所以在去除多餘景物處理後產生了缺角的問題，在這裡要利用其他圖層的相片來進行修復。

01 置入相片在此範例中以 <24.jpg> 相片來修補因重疊讓銀色轎車有缺角的部分，首先選取影格 26 及 26.jpg 圖層。

02 取得完整的銀色轎車影像置入要進行修補的相片後，首先要將不需要的景物刪除只剩下銀色轎車的部分，再將其複製到需要的圖層下方，以調整缺角的問題。

03 修補影格 26 銀色轎車缺角將上步驟中取得的完整銀色轎車影像進行移動及修補，同時也要調整顯示正確的圖層。

04 修補影格 27 至影格 31 缺角的問題接著以相同的方式修補其他影格，此處的修補工作愈仔細會讓作品愈自然，特別是車子與樹重疊的地方。

14.3 預覽播放影格動畫完成了各影格與圖層中相片修補及動畫安排設計後，現在就趕快來看看完成的影格動畫設計效果，若有不順暢的地方可以再進行修改。

預覽之前要先調整播放次數的設定，這樣才能看出實際播放的效果。

調整播放設定

預覽完成的 Cinemagraph

接著就來看看完成作品的效果！

14.4 儲存及瀏覽 GIF 檔案

預覽作品編修都沒有問題後，接著要將作品儲存為 GIF 檔 案 ，方便於網路或其他平台上分享。

儲存為 GIF 檔案

瀏覽完成作品轉存為 GIF 檔案後，可以開啟網頁瀏覽器來預覽 Cinemagraph 效

果。