Animate CC Q版照片人物動畫
閱讀時間約 2 分鐘
對於是以相片人物來製作動畫時，當然必需要在Photoshop中事先處裡好每個元件細節，然後再正確匯入Animate中來完成動畫，同樣是需要注意元件變形中心與動畫動作的設定。
目標動畫效果:應用影片片段元件表現以影像為素材的人物動畫，需注意匯入檔案的正確方式，除了元件的準備與安排來表現動作之外，將以傳統補間動畫完成，讓動作更為流暢。
使用動畫技巧:影片片段元件、傳統補間動畫、變形中心、匯入PSD檔。
使用動畫技巧:影片片段元件、傳統補間動畫、變形中心、匯入PSD檔。
Step1.
人物.PSD檔案圖層上可以檢視到所有的元件，均已分解處裡至圖層上，處裡相片元件時請注意元件與元件之間需要有重疊的影像部分，因此除了去背景之外的處裡，還要以Photoshop筆形工具描繪需要部位的路徑，再經由路徑轉為選取範圍並拷貝至其他圖層的方式，來處裡每個部位內容，例如肩膀與手臂之間，先選取拷貝出手臂後，再處裡肩膀處凸出，手與腳的二段元件銜接處均相同。
人物.PSD檔案圖層上可以檢視到所有的元件，均已分解處裡至圖層上，處裡相片元件時請注意元件與元件之間需要有重疊的影像部分，因此除了去背景之外的處裡，還要以Photoshop筆形工具描繪需要部位的路徑，再經由路徑轉為選取範圍並拷貝至其他圖層的方式，來處裡每個部位內容，例如肩膀與手臂之間，先選取拷貝出手臂後，再處裡肩膀處凸出，手與腳的二段元件銜接處均相同。
Step2.
開啟範例檔，新增影騙片段元件『人物』，執行『檔案 > 匯入 > 匯入至舞台』請複選所有圖層並選擇『點陣圖影像含有可編輯的圖層樣式』（確保點陣圖的半透明效果），以及選擇『壓縮：不失真』、『將圖層轉換成：Animate圖層』，按下確定自動完成匯入與元件轉換以及分圖層。
開啟範例檔，新增影騙片段元件『人物』，執行『檔案 > 匯入 > 匯入至舞台』請複選所有圖層並選擇『點陣圖影像含有可編輯的圖層樣式』（確保點陣圖的半透明效果），以及選擇『壓縮：不失真』、『將圖層轉換成：Animate圖層』，按下確定自動完成匯入與元件轉換以及分圖層。
Step3.
使用任意變形工具更改每個元件的變形中心，頭於下巴處、手臂於肩膀處、手與手掌均在元件銜接處，大腿於與身體銜接處、腳與鞋在元件之間銜接處，左右手與腳均相同。
使用任意變形工具更改每個元件的變形中心，頭於下巴處、手臂於肩膀處、手與手掌均在元件銜接處，大腿於與身體銜接處、腳與鞋在元件之間銜接處，左右手與腳均相同。
Step4.
所有圖層於影格7、13、19、24插入關鍵影格，拉入參考倒引線於底下、中央、下巴處，依序使用移動與變形工具旋轉，調整影格1與影格13的姿勢，最後建立傳統補間動畫完成人物元件。
所有圖層於影格7、13、19、24插入關鍵影格，拉入參考倒引線於底下、中央、下巴處，依序使用移動與變形工具旋轉，調整影格1與影格13的姿勢，最後建立傳統補間動畫完成人物元件。
最後回到場景上，新增人物圖層並置入人物元件於舞台上，完成此範例。
相關課程 : 優勢多媒體 - Adobe Animate CC製作HTML5動畫與互動效果
為什麼會看到廣告
29會員
129內容數
多媒體設計的專業能力養成過程，除了有效率學習軟體之外，更重要的是各個軟體間的整合應用!
Photoshop、Illustrator、Dreamweaver、Animate、CSS、Bootstrap響應式網頁等，相關的整合應用有機會皆會與大家分享喔~
留言0
查看全部
你可能也想看
Google News 追蹤
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
插畫和動畫之間有著密切的關係，但並不是說一定要先有插畫才有動畫。插畫通常是靜態的圖像，用來表達一個概念、故事或角色，而動畫則是將這些靜態圖像連續播放，創造出動態效果。
在很多情況下，動畫的製作確實會從插畫開始。插畫可以用來設計角色、場景和故事板，這些都是動畫製作的重要步驟。例如，漫畫或插畫書經
本文介紹瞭如何使用 Photoshop 和 Cinema 4D 創建手繪風格動畫場景。從照片處理到模型建模、材質貼圖、額外元素建模、光線和打光、渲染與後期處理，逐步解說了創建過程。通過這些建議，你將能夠創建一個既細緻又富有動畫效果的手繪風格場景，為你的動畫作品增添獨特的魅力和視覺吸引力。
我們最早就是在做動畫，從一般廣告開始，慢慢去擴展不同的類型，比如說遊戲、角色動畫、電視與電影的特效……等等，但是越做越專業的情況下，我們就想再去做一些延伸，像是虛擬攝影棚跟虛擬製作，我們找到這些工作項目的共通元素去發展，甚至到後面我們還去做互動設計、沉浸式多媒體展覽與現在時下最熱門的AI生成技術。
最近有空時就在看如何使用AI作圖的方式製作出有魄力的動作與構圖，恰巧在Civitai這個AI作圖網站上找到了一些有趣的人物姿態，因此發想了一些構圖，依照這些構想做出來的圖效果還算可以接受，因此在這邊記錄一下過程與步驟。
Ae 小技巧：Adjustment Layer 調整圖層
動態後記系列會記錄一些我在製作中的記錄，可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇，就是補充用的小筆記，沒有前後順序，可跳著閱讀。
Ae 小技巧：製作3D 方塊
動態後記系列會記錄一些我在製作中的記錄，可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇，就是補充用的小筆記，沒有前後順序，可跳著閱讀。
影像和檔案的處理技術已成為設計師的基本功。從精緻的插圖到複雜的版面設計，每一步操作都蘊含著無限的可能性與挑戰。本文將帶領您深入了解如何精準控制影像置入過程中的細節，從而達到既定的設計目標。
精確控制影像置入的技巧
當我們談論將影像或檔案置入Adobe Illustrator或InDesign時，
你正在盯著人設撓頭抓首嗎？
你總是反覆推敲角色行動，思考筆下的劇情是否增加角色魅力？
又或者，你看著檯面上那麼多優秀的作品，優秀的角色，卻不知道怎麼自己寫一個出來？
這全都很正常，因為刻劃人物就是一件那麼困難的事情。
影片剪輯比較複雜
創作者不但要能文能武，還需要會影片剪輯。影片剪輯說起來就比較複雜，因為牽涉到比較多的面向。剛開始入手的時候很難理解，不過了解系統架構以後，其實也就那麼一回事。但是總得來說，耗時相對要多很多，比起一般的文章或繪圖，你也可能要耗時許多，因為他的素材就是比較多。
聲音素材、圖片素材、
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
插畫和動畫之間有著密切的關係，但並不是說一定要先有插畫才有動畫。插畫通常是靜態的圖像，用來表達一個概念、故事或角色，而動畫則是將這些靜態圖像連續播放，創造出動態效果。
在很多情況下，動畫的製作確實會從插畫開始。插畫可以用來設計角色、場景和故事板，這些都是動畫製作的重要步驟。例如，漫畫或插畫書經
本文介紹瞭如何使用 Photoshop 和 Cinema 4D 創建手繪風格動畫場景。從照片處理到模型建模、材質貼圖、額外元素建模、光線和打光、渲染與後期處理，逐步解說了創建過程。通過這些建議，你將能夠創建一個既細緻又富有動畫效果的手繪風格場景，為你的動畫作品增添獨特的魅力和視覺吸引力。
我們最早就是在做動畫，從一般廣告開始，慢慢去擴展不同的類型，比如說遊戲、角色動畫、電視與電影的特效……等等，但是越做越專業的情況下，我們就想再去做一些延伸，像是虛擬攝影棚跟虛擬製作，我們找到這些工作項目的共通元素去發展，甚至到後面我們還去做互動設計、沉浸式多媒體展覽與現在時下最熱門的AI生成技術。
最近有空時就在看如何使用AI作圖的方式製作出有魄力的動作與構圖，恰巧在Civitai這個AI作圖網站上找到了一些有趣的人物姿態，因此發想了一些構圖，依照這些構想做出來的圖效果還算可以接受，因此在這邊記錄一下過程與步驟。
Ae 小技巧：Adjustment Layer 調整圖層
動態後記系列會記錄一些我在製作中的記錄，可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇，就是補充用的小筆記，沒有前後順序，可跳著閱讀。
Ae 小技巧：製作3D 方塊
動態後記系列會記錄一些我在製作中的記錄，可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇，就是補充用的小筆記，沒有前後順序，可跳著閱讀。
影像和檔案的處理技術已成為設計師的基本功。從精緻的插圖到複雜的版面設計，每一步操作都蘊含著無限的可能性與挑戰。本文將帶領您深入了解如何精準控制影像置入過程中的細節，從而達到既定的設計目標。
精確控制影像置入的技巧
當我們談論將影像或檔案置入Adobe Illustrator或InDesign時，
你正在盯著人設撓頭抓首嗎？
你總是反覆推敲角色行動，思考筆下的劇情是否增加角色魅力？
又或者，你看著檯面上那麼多優秀的作品，優秀的角色，卻不知道怎麼自己寫一個出來？
這全都很正常，因為刻劃人物就是一件那麼困難的事情。
影片剪輯比較複雜
創作者不但要能文能武，還需要會影片剪輯。影片剪輯說起來就比較複雜，因為牽涉到比較多的面向。剛開始入手的時候很難理解，不過了解系統架構以後，其實也就那麼一回事。但是總得來說，耗時相對要多很多，比起一般的文章或繪圖，你也可能要耗時許多，因為他的素材就是比較多。
聲音素材、圖片素材、