실감 기본편 움직이는 2D 그래픽 만들기: 레이어와 키프레임
GCC 사관학교
여러분 안녕하세요, 강의자 최지원입니다
이번 시간에는 움직이는 2D 그래픽 만들기
레이어와 키프레임을 주제로 다루어 보도록 하겠습니다
오늘의 학습 내용으로 먼저 셰이프 레이어를 활용한
벡터 그래픽 만들기 실습을 통해
애프터 이펙트에서 레이어에 대한 이해를 해 보도록 합니다
두 번째로 키프레임을 활용해
애니메이션을 적용해 보는 실습을 통해
키프레임과 그래프 에디터를 통한
가속과 감속에 대해 알아보도록 합니다
셰이프 레이어를 활용한 벡터 그래픽
네 여러분 이번 시간에는 타임라인이 제일 중요합니다
타임라인 패널
저번 시간에 인터페이스에 대해서 알아보면서
많은 인터페이스들 중에 하나였죠
컴포지션 패널, 프로젝트 패널
그리고 효과들이 나타나 있는 패널
그리고 타임라인 패널까지 있었어요
이 많은 패널 중에서 타임라인 패널이 왜 중요하냐 하면
실질적인 업무가 진행되는 곳이기 때문인데요
먼저 타임라인은 미디어 파일을
레이어 형태로 관리하는 곳입니다
레이어라는 개념도 참 중요한데
이 타임라인에서 이 각각의 레이어들을 배열하고
또 가지고 작업을 하면서 많은 작업들이 이루어집니다
또 이 타임라인에서는 레이어의 재생시간을 설정하거나
키프레임을 생성해서 실질적인 작업이
이루어지는 곳이기도 합니다
이 시간이 되게 중요한데요
어떤 효과를 넣든 모션이 생기려면
시간 설정이 중요하겠죠
어떤 시간에서 시작을 해서 어떤 시간에서 끝나느냐
그러니까 속도를 조절할 수도 있고
또 모션의 여러 이야기를 다양하게 담을 수도 있기 때문에
시간이라는 개념이 중요합니다
그래서 타임라인이겠죠
이 타임라인은 어떤 것들이 있냐
어떤 것들을 가지고 있냐 하면 이렇게나 기능이 많은데요
하나하나 좀 이거는 짚어드리고 가면 좋을 것 같아요
일단 타임라인을 제가 이렇게 확대해 왔는데
왼쪽 위쪽에 현재 시간이 이렇게 설정되어 있어요
이 타임 인디케이터가 있는 현재 시간을 알 수가 있어요
이 친구를 Ctrl 누른 채 클릭하시면
이 타임코드 프레임 형식으로
이 디스플레이 스타일을 변경할 수가 있는 곳입니다
바로 옆에 이제 검색창이 하나 있죠
얘는 이제 빠르게 찾기라는 곳인데
Ctrl+F를 눌러서 활성화 시키시면
레이어나 속성 등에 이름을 검색해서 찾으실 수가 있습니다
이 컴포지션 차트가 그 옆에 있어요, 옆에 있는데
이 친구는 이제 컴포지션을 작은 플로우 차트 형태로
보여주는 곳이고요
하나씩 다 이따가 눌러 보시면 좋겠습니다
그 다음에 이제 네 번째로 타임라인 패널에서 숨기기
동영상의 부드러운 움직임 설정
레이어의 모션 블러 표시, 그래프 에디터 이렇게 있고요
그 옆에 타임 내비게이터가 있고 작업 영역이 있습니다
이 위쪽만 해도 굉장히 많은 기능들이 있죠
여기에서 일단은 저희에게 중요한 것은 현재 시간이고요
그 다음에 또 하나 중요한 것은 타임 내비게이터겠죠
시간이 가장 중요하죠
그리고 작업 영역, 이 작업 영역은 왜 중요하냐면
이 작업 영역을 저희가 드래그해서
설정을 할 수가 있거든요
만약에 작업 영역이 내 의도와는 달리 좁아져 있고
너무 많아져 있고 그러면 추출할 때 영상이 잘리거나
영상이 투 머치하게 많이 뽑힐 수가 있어요
그래서 이 작업 영역이 항상 제대로
되어 있는지 확인하는 것이 중요합니다
그리고 또 한 가지 중요한 것은 그래프 에디터가 중요해요
그래프 에디터는 왜 중요하냐면 역시나 시간에 관한 건데
이 친구는 속도를 세밀하게 조절을 할 수가 있거든요
그래서 중요합니다
윗줄에서 기억할 것은 현재시간, 그래프 에디터,
타임 내비게이터, 작업영역입니다
그 다음에 밑에 쪽에
제가 화살표로 표시해 놓은 것들을 보시면
기능들은 많지만 바로 다 사용하지는 않을 거니까
너무 싫어하지 마시고요
왼쪽 보시면 보이기 감추기 있어요
이건 뭐냐면 눈 모양으로 되어 있죠?
이거 클릭하시면 눈이 꺼지거든요
이 레이어 안 보겠다 뜻이에요
그리고 다시 켜주시면 이렇게 눈 모양이 보이는데
보겠다 이런 뜻이에요
그 다음 옆에는 오디오 On/Off 역시
이 레이어의 오디오를 듣겠다, 안 듣겠다는 것이고요
레이어가 이제 작업할 때 많아지다 보면 헷갈려요
그래서 필요 없는 거를 잠시 이걸 꺼놓으면 어떻게 들릴까
이걸 켜면 같이 켜면 어떻게 들릴까
이렇게 확인할 때 많이 필요하겠죠 둘 다
그 다음에 이제 solo 부분이 있는데요
이 solo는 뭐냐면 이 선택한 레이어만 화면에 표시되고
나머지 레이어는 감추겠다 이런 뜻입니다
그 다음에 lock이 있죠, 열쇠 자물쇠 모양이 있는데
이건 뭐냐면 하도 레이어가 많으니까
그 중에서 이 레이어는 중요하니까 절대로 변동하지 않겠다
나는 이 레이어는 수정하지 않겠다고 생각했을 때
얘를 활성화 해주시면 얘는 수정되지 않습니다
그렇게 해놓는 것이고요
이 앞에 4개는 보는 것과 잠그는 것
얘만 보겠다, 안 보겠다, 안 듣겠다, 듣겠다
이런 것들을 표시해주는 부분이겠죠
그렇게 알아주시면 될 것 같고요
그 옆에도 마찬가지로 태그가 모양이 되어 있죠
이 태그 모양이 되어 있는데 이건 왜 그러냐면
라벨을 표시해요
뭐냐면 이렇게 레이어의 이름이 있긴 하지만
이름으로 다 찾을 수는 없겠죠, 레이어가 많아졌을 때
그때를 대비해서 아 얘네는 비슷한 류야
얘네는 같이 묶일 수 있어 이런 레이어들을
같은 색깔로 라벨을 매겨주는 겁니다
그렇게 하면 작업할 때 혼란이 적어지겠죠
그렇기 때문에 라벨이 있고요
그다음 레이어의 이름이 있어요
이 레이어의 이름도 잘 지어주셔야 돼요
왜냐면 나중에 헷갈립니다
그래서 레이어 이름까지 보았고요
조금 복잡하게 영어로 써놨는데
Shy 기능은 뭐냐면
레이어 숨기기를 활성화하거나 비활성화하는 기능입니다
두 번째는 Collapse transformation인데요
이거는 3D 레이어를 포함해서
컴포지션 레이어의 3D 성질을 유지하게 하거나
벡터 레이어의 경우에 래스터라이즈를
유지하게 하는 겁니다
어렵죠, 기억 안 하셔도 돼요 지금은
그 다음에 Quality and sampling 이거는
미리 보기 화질을 조절해 주는 것이고요
그 다음에 Effect, 이펙트를 보여주거나 감추는 거
이펙트를 내가 적용했을 때 아
안 했을 땐 어떻게 됐었지? 라고
보고 싶을 때 얘를 적용해 주면 됩니다
얘를 사용하실 게 많을 것입니다
그 다음엔 Frame blending,
이제 프레임을 혼합해서 설정하겠다는 것인데 자주 씁니다
그 다음에 이제 Motion blur
Motion blur는 어떤 거냐면
블러 기능을 활성화하거나 비활성화할 때 사용을 합니다
그 다음에 Adjustment Layer
이거는 이펙트 적용할 때 쓰는데요, 많이 씁니다
Layer 중에 하나 있는데 새로운 이펙트를
하위 레이어에 적용하고 싶을 때
이 레이어를 사용을 하고요
그 다음에 이제 3d layer는 이것을 활성화하면
레이어가 3D로 변환돼요
그것도 나중에 쓸 것입니다
그렇게 이해해 주시면 될 것 같고
CTI, 이거는 뭐냐면 중요하죠
CTI는 Current Time Indicator예요
현재 화면에 표시되는 부분의 시간 위치를 알려주는 것이죠
얘가 서 있는 곳이 내가 컴포지션에서 보고 있는 화면입니다
그렇게 알아주시면 될 것 같아요
처음에는 사실 이 기능을 다 쓰지는 않습니다
보통 현재시간, 다음에 CTI,
그다음에 레이어 정도만 알고 계셔도
실습할 때는 무리가 없을 테니까 걱정 마세요
그다음, 오늘 외울 개념 중에 또 중요한 것은 레이어예요
레이어 너무 중요합니다
가장 기본적인 것들이기 때문인데요
이 레이어는 애프터 이펙트에서
중요하게 사용되는 개념이에요
이 레이어를 배열하면서
그래픽의 공간들이 만들어지는 거예요
배열을 통해서
그 다음에 이제 배경과 오브젝트를 분리해서
개별적이고 세부적인 작업을
만들 수 있게 하는 것이 바로 레이어입니다
모든 것은 레이어로 이루어져 있고
레이어가 분류되어 있기 때문에
다양한 그래픽이 만들어질 수 있는 것입니다
이렇게 이해해 주시고
레이어의 종류에는 여러 가지가 있는데
그 중에서도 가장 대표적으로는 셰이프 레이어예요
셰이프 레이어는 말 그대로 형태가
셰이프, 여러 가지 모양을 만드는 레이어고요
두 번째는 텍스트 레이어가 있어요
텍스트는 문자죠
문자를 쓸 수 있는 레이어가 있고요
그 다음에 솔리드 레이어가 있어요
이 솔리드 레이어는 단면이에요
단면, 면
보통 배경에 알파값을 없애기 위해서 깔 때
그렇게 사용을 하고요
아까 짚고 넘어간 것이 있는데 뭐였죠?
Adjustment Layer도 있죠
그렇게 이해해 주시면 되겠고요
그 다음 또 중요한 개념은 키프레임 개념이에요
키프레임 개념은 뭐냐면
애니메이션을 만드는데 되게 필수적인 요소예요
키프레임과 레이어 중요합니다
측정 시간에 원하는 값을 입력하면
스톱워치를 활용해서 원하는 키프레임을
만드실 수가 있어요
시간에 관련된 것이죠
최소 두 개의 키프레임이 있으면 움직임이 만들어진다
이거는 실습해보시면 바로 이해하실 겁니다
동작이 생기게 되기 때문인데요
이 키프레임은 굉장히 많이 사용될 개념이니까
잘 숙지를 해두시고 실습을 들어가 볼 텐데요
레이어와 키프레임에 대한 실습을 하도록 하겠습니다
레이어와 키프레임 실습
먼저 컴포지션을 한번씩 둘러볼게요, 컴포지션
컴포지션이 미로게임 완성, 농구공튀기기 완성,
캐릭터 만들기 실습, 미로게임 키프레임 실습,
농구공 튀기기, 그래프 에디터 실습
이렇게 나와 있는데요
한번 컴포지션 여러 개를 제가 만들어 놨는데
인디케이터를 이렇게 미로게임 완성에 두고
한번 스페이스바를 눌러볼게요
이 구름 캐릭터가 네잎클로버한테 가고 있죠
미로를 잘 풀어서 네잎클로버한테 가고 있는
그런 영상을 만들어 볼 거예요
키프레임 연습을 위해서 한번 만들어 봤는데
이런 식의 영상을 만들어 볼 겁니다
그러면 캐릭터 만들기 레이어 실습 이 세 번째 거 있죠?
얘를 띡 눌러주세요
그러면 아무것도 없습니다
아무것도 없습니다
우리가 다 만들어야 돼요
우리는 근데 여기에서
네잎클로버 캐릭터만 한번 만들어 볼게요
셰이프 레이어를 활용을 할 텐데요
어디 있냐 하면 도구바에서 쭉쭉쭉쭉쭉 가보시면 이렇게
Rectangle Tool이라고 나와요
얘를 좀 오랫동안 클릭하시면
옆에 셰이프 레이어 뭐뭐뭐 만들 수 있는지 나와 있어요
사각형, 라운디드 사각형, 타원, 별
뭐 이런 것들이 있는데요
저희는 일단은 가장 기본적으로 사각형 만들어 볼 거예요
자유롭게 이 도화지라고 생각하시고
클릭하신 채로 쫙 드래그를 이렇게 해주세요
드래그 해주셨나요? 다시 한 번
드래그 해주실 텐데요
이상하다? 아까는 제가 드래그 했을 때
직사각형으로 이렇게 떨어졌는데
이번에는 정사각형으로 떨어졌죠
어떻게 하냐면 Shift를 누른 채로
Ctrl+Z에서 다시 해드릴게요
Shift를 누른 채로 드래그를 쭉 해주시면
얘가 정사각형으로 나오게 됩니다
정사각형으로 나오게 합니다
여러분들 크게 보시라고 저는 아주 크게 만들었어요
연습하는 거니까 크게 만들어 주시면 됩니다
여기에서 빨간색은 네잎클로버가 아니죠
한번 색깔을 바꿔 볼게요
여기 Fill, Stroke 이렇게 있어요
칠과 획인데요
얘를 이용하면 됩니다
일단 Fill 한번 눌러볼까요?
눌러보시면 옵션이 나오는데
안 칠하겠다, 칠하겠다,
약간 효과를 주겠다 이렇게 나오거든요
저는 얘는 칠하겠다 라고 할 거고
여기 Opacity도 조절할 수 있어요
커서를 갖다 대시면 이렇게 화살표가 나오는데
왼쪽으로 가시면 투명하게
배까지 오른쪽으로 가면 불투명하게
이렇게 나오실 수가 있습니다
일단 나는 단색으로 칠할 거야
옵션 OK 했어요
그 다음에 색깔은
이 Fill 옆에 있는 네모를 눌러 주셔야 돼요
네모를 누르시는 순간 이렇게 색깔이 나오는데
여기에서 저는 이렇게 초록과
초록초록한 가까운 색깔을 만들어 볼게요
이렇게 본인이 원하는 색깔을
직관적으로 만들어 주시면 되고요
저는 이 색깔이 적당한 것 같아서
넘버는 4FD9EF 색깔로 설정을 했고요
OK 눌렀습니다
그러면 우리 연두 색깔 정사각형 만들었어요
여기에서 칠했으니까 획도 봐야겠죠?
Stroke 한번 글씨 눌러 주시면
아 획 없을 거야 있을 거야
획에도 효과를 줄 거야
이렇게 4개의 옵션이 있어요
저는 단색으로 할 거고요
얘도 Opacity를 마찬가지로 조절할 수가 있는데
잘 보이게 하기 위해서
그냥 100으로 두고 OK 하겠습니다
OK 하고요
마찬가지로 Stroke 옆에 있는 면을 누르시면
이 Stroke의 색깔을 바꿀 수가 있어요
색깔을 바꿀 수가 있는데
저 같은 경우는 그냥 FFFFFF
그냥 흰색으로 두도록 하겠습니다
OK 하시고요
그 옆에 보면 Stroke 넓이가 있어요
얘도 마찬가지로 커서를 올리면
이렇게 화살표가 생기는데
넓게 해줄수록 넓어지고
적게 해줄수록 없어지고 하는데요
저는 여러분들이 잘 보일 수 있도록 하기 위해서
한 13으로 하면 잘 보이려나요
네 깔끔하게 15로 하겠습니다
15로 해주시고요
V 눌러주세요
그리고 다른 데다 띡 누르시면
이렇게 네모 만들어졌습니다
그럼 이 네모에서 어떻게 하면
이 네모가 클로버 방향이 될까
라고 생각이 되시겠죠
바꿔볼 건데요
이번에는 여기 컴포지션 패널 말고요
타임라인 패널에서 볼 거예요
타임라인 패널을 더 잘 보여드리기 위해서
제가 조금만 올릴게요
올릴 때 패널을 내가 더 크게 보고 싶거나
축소하고 싶다 하면 저처럼 패널과 패널 사이를
이렇게 클릭하셔서 드래그 해주시면 돼요
마찬가지로, 옆에도 마찬가지로
이렇게 조절할 수가 있고요
여기도 조절할 수가 있습니다
이 정도로 이해하시면 될 것 같고요
저희는 이제 세 번째 컴포지션에 위치해 있는
이 셰이프 레이어 작업을 할 건데
작업을 할 레이어를 항상 선택을 해주셔야 돼요
그래야지 효과가 적용이 됩니다
내용의 옆에 보시면 Add 있어요
뭘 Add 할 거냐
한번 화살표 눌러볼까요
여러 가지 효과들이 있습니다
효과를 여기 중에서 하나를
한번 선택해서 활용해 볼 건데요
어떤 거 누를 거냐 하면
Pucker & Bloat라고 있죠
여기 Offset Paths 밑에 Pucker & Bloat이라고 있어요
이 친구를 띡 눌러 주시면
어? 어떻게 됐죠?
왜곡이 생겼죠
여기 왜곡이 생기면서
밑에 Pucker & Bloat라고 이렇게 내용이 생기는데
얘를 열어보실 거예요
열어보시면 Amount라고 나와요
이 왜곡의 양을 얼만큼 할 거냐
이 뜻인데요
얼만큼 할까요?
한번 잘 모르겠을 때는
꼭 이 숫자 위에다 커서를 두시면
항상 조절을 할 수가 있거든요
한번 조절해 볼게요
마이너스로 갈수록 오목해지고
플러스로 갈수록 블록해지죠
거의 네잎클로버 비슷한 느낌으로 한번
멈춰보시면 75 정도 됩니다
75 정도 됩니다
이렇게 만들어 주시면 되겠습니다
이렇게 만드셨으면
이제 줄기를 한번 만들어 볼 텐데요
같은 이 셰이프 레이어 선택해 주시고
펜툴로 한번 만들어 볼게요
펜툴로 만들어 볼 텐데
도구바에 펜툴 드래그 해보시면
굉장히 많은 효과들이 있는데
일단 저희는 Pen Tool로 하겠습니다
여기에서 이제 그려줄 텐데
잘 따라 하셔야 돼요
한번 찍고
그 다음에 찍은 채로 드래그 하시고
그 다음에 한번 찍어 주시면 곡선이 돼요
일단 당황하지 마시고
이렇게 곡선 찍으시면 됩니다
근데 나는 이 모양을 만든 것이 아닌데
아까와 똑같은 Pucker & Bloat Amount 양이
여기에 같이 적용이 됐죠
이 경우에는 이 셰이프, 새로 만들어진 셰이프를
쭉쭉쭉 해서 이 Pucker 밑으로 드래그 해 주셔서
놓아 주셔야지 해결이 됩니다
이렇게 파란 줄이 생기죠
여기에다가 띡 놔주시면
효과가 적용되지 않습니다
모든 것은 위에 있는 레이어 기준이기 때문이에요
그런데도 이 채움이 형성이 되어있기 때문에
이 채움을 없앨게요
Fill로 가셔서 눌러 주시고
나 안 채울래, 빼주세요
되셨고
여기에서 이 Shape 1 친구는
조금 위치를 맞춰 줘야겠죠
그러려면 변형 가셔서
저희가 포지션 위치를 조금 오른쪽, 왼쪽이 다르게 있는데
이렇게 밀어 가지고
이 안쪽으로 넣어 주시면 되겠습니다
이렇게 맞으면 얼추 맞죠
얼추 맞고요
맞게 해 주셨고요
여기에서
이제 우리가 펜툴이랑
사각형 그리기 툴로 만들었으니까
V를 누르셔서 선택으로 바꿔 주시고
하나로 만들기, 합치기 위해서는
이렇게 드래그 해주셔서, 다 드래그 해주셔서
선택된 채로 Add 가셔서
뭘 하면 좋을까요?
Merge Paths를 눌러 주시면
아 어떻게 되나요?
하나가 됩니다
하나가 돼요
하나가 되는 순간 색이 없어지는 분들은
아 Merge Path를 맨 위로 올려 주시면 해결이 됩니다
네 이런 식으로 만들어 주시면 되겠고요
만들어 주시면 되겠고요
컨텐츠 자체를 살짝 이렇게 저는 회전 시키려고 해요
어떻게 하냐면 변형 가셔서
Rotation, 회전 눌러 주신 채로 끌어 주시면 되겠습니다
이렇게 이렇게 하셔서
너무 좀 부담스러우니까
좀 크게 줄일게요
이 정도 해주세요
아 움직일 때 저희 두 가지가 있죠
Scale도 두 가지
Position도 두 가지 이렇게 되어 있는데
여기 보시면 열쇠고리처럼
이렇게 걸려있는 모양이 있거든요
얘는 이제 같은 비율로 움직이겠다는 뜻이에요
만약에 따로따로 움직이시고 싶으면
얘를 풀어 주시면 돼요
클릭하시면 풀어집니다
되셨죠
여기까지 되셨으면
우리는 셰이프 레이어로
뭔가를 만들 수 있다
그래픽을 만들 수 있다
셰이프 레이어 중에서도
사각형 툴이랑 펜툴로 만들었다
이렇게 이해하시면 되겠습니다
미러게임 다 들어오셨죠
다시 한번 볼게요
이 움직임을 어떻게 줄까요
바로 키프레임을 이용해서 줄 건데요
보시면 X축, Y축 이렇게
가로, 세로 방향으로만 움직이죠
이렇게 움직여서 길을 찾아가는 애니메이션을
한번 키프레임을 활용해서 만들어 보도록 하겠습니다
이건 완성본이니까
우리는 1, 2, 3, 4, 5개
아 네 번째, 네 번째로 가보시면
네 번째 컴포지션을 클릭해 주시면
아무 애니메이션이 없는 채로 이 친구가 있습니다
네잎클로버는 가만히 있으니까
있을 거니까 가만히 둘 거고요
구름 이 친구가 움직일 건데
일단 제가 미러는 만들어놨고요
중간 주황 단색, 바탕도 제가 만들어 놨어요
구름만 움직이시면 돼요
구름을 열어볼까요
구름에는 여러 가지 저희가 만든 흔적들
내용들이 컨텐츠가 들어있고요
우리는 이 밑에 변형, 얘만 이용할 거예요
네 아주 쉬워요
얘만 이용할 건데
일단 구름 변형을 눌러보시면
이렇게 Position, 위치값이 활성화되어 있어요
이 다이아몬드는 시간을 콕콕 찍는 키프레임인데
얘를 지금 제가 -181.4와 132.1로 찍어 놨어요
그 위치값을 찍어 놨어요
근데 우리가 이렇게 계속 숫자로
거리를 다 이해할 수는 없잖아요
그래서 숫자로 하지는 않을 거고요
한번 1초씩 옮겨 볼게요
이 인디케이터를 드래그 하셔서
1초에, 2초에 딱 옮기실 거예요
2초 쯤에 옮겨 주신 다음에
이 친구를 움직일 건데
컴포지션에서 쭉 여기까지만 움직일게요
여기까지 움직이셔서 콕 놓아주세요
놓아주시는 순간 타임라인 패널에서 다이아몬드가 생겼어요
이 위치에 이 시간과 거리를 여기로 지정하겠다라는 거고요
한번 인디케이터를 처음으로 옮겨서
스페이스바를 한번 눌러볼게요
오! 갔죠 여기까지?
또 한번 해볼게요
이번에는 4초, 아니 좀 짧으니까
3초 지점 비슷한 어느 언저리에 인디케이터를 두시고
이 친구를 이렇게 내릴게요
대각선으로 내릴게요
한번 다시 볼게요
갔다가 내려왔어요
네 내려왔어요
느낌 오시죠 이제?
한번 더
저 앞길로 좀 멀리 가야 되니까
5초 쯤에서 인디케이터를 멈춰 놓고 한번 갈게요
쭉 갑니다
여기까지 갈게요
가고 또 밑으로 가야 되니까
인디케이터를 살짝 옮기시고 쭉 가주세요
또 인디케이터 옮기시고 쭉 가고
인디케이터 옮기시고 좀 멀다 싶으면 좀 오랫동안
지금 저 11초까지 왔어요
갔다가 쭉 끝까지 옮기시고
그 다음에 중간 점검 한번 해봅시다
숫자 값을 입력하지 않아도 컴포지션 패널에서
충분히 이 친구의 자리값을 움직일 수가 있죠
타임라인 패널에서는 시간 값을 위치시키고
컴포지션에서 거리 위치를 이동해 줍니다
이렇게 이동해 주셨고요
그 다음에 쭉 더 가셔서
이번에는 좀 오랫동안 가볼까요
쭉 네잎클로버까지 갑니다
저는 18초에 끝냈어요
한번 봐볼게요
인디케이터 앞으로 옮기셔서 스페이스바
잘 도착했죠
이렇게 하시면 됩니다
생각했던 것보다
제가 만들어 놓은 시간대보다 빨리 끝났어요
빨리 끝나면 여기서 끝내고 싶으면
이 작업 영역을 옮기시면 되는데요
그것은 나중에 하겠습니다
이 작업 에어리어를 이렇게 옮기실 수가 있어요
작업 영역을 한 18까지만 옮겨서
이만큼만 이제 추출하실 수 있는 것입니다
네, 이해하셨죠
저희는 이렇게 점을 찍고
위치값을 컴포지션에서 변경을 했어요
그렇게 했는데
이제 여기에서 바로 움직여주셔도 되고
우리 숫자값 위에다가 이렇게 커서를 올려 놓으면
숫자값이 변하죠
그거를 이용하셔서 만드셔도 됩니다
충분히
그러면 한 가지 아쉬운 점이 있어요
뭐냐면 이 속도를 좀 자연스럽게
조금 더 자연스럽게 줄 수 없을까?
라는 의문이 들죠
그래서 우리가 속도를 조금 더 연습해 볼 건데
이번에는 두 번째 컴포지션 농구공 튀기기 완성
얘를 한번 선택해 보시고
인디케이터를 0으로, 영점에다 두시고
한번 재생을 시켜 볼게요
재생은 백스페이스
농구공이 어떻게 가죠?
농구공이 튕겼다가 튕겼다가 튕겼다가
이렇게 뭔가 감속과 가속이 있죠 농구공에
이 감속과 가속은 어떻게 만들지
그것을 한번 연습을 해 보도록 할 거예요
이것은 그래프 에디터를 활용해서 해 볼 건데
상당히 세밀하게 속도를 조절할 수가 있어요
그래서 이 기능을 한번 사용을 해 보도록 하겠습니다
얘는 또 완성된 컴포지션 예제니까
저희는 다섯 번째 농구공 튀기기 그래프 에디터 실습
얘를 컴포지션 활성화 해주세요
아무것도 없죠
저희가 채워 나갈 것입니다
어떻게 할 거냐면 프로젝트 패널에 들어 있어요
농구공 PNG가 들어 있는데
얘를 드래그 하셔서 쭉 해주시면
변형해서, Scale을 변형시켜 주셔야 됩니다
키프레임을 매겨 주시고
15프레임에서 860 정도로 해주시면
얘가 수직 낙하합니다
낙하가 되죠
낙하가 되는데
이 860 지점의 점을 Ctrl+C 하셔서
일정한 간격으로 복사, 붙여넣기를 해주시면 됩니다
복사, 붙여넣기를 해주세요
이렇게 저는
몇 개를 만들었냐 3, 4, 5, 6, 7, 8,
9개의 다이아몬드를 찍어 줬어요
지금은 그냥 아무 변화가 일어나지 않죠
일어나지 않습니다
이제 변화를 줄 건데
어떻게 줄 거냐면 Graph Editor
Graph Editor를 눌러 주세요
Graph Editor를 눌러 주시면
직선이 생기면서 직선적으로 그래프가 나오게 되는데
얘를 곡선적으로 만들고 조절하기 위해서
전체를 선택해 주신 다음에
이 Easy Ease를 선택을 해주시면 점이 생겨요
점이 생기고
이 Easy Ease는 F9 단축키로도 가능합니다
다른 곳을 틱 눌러 주시고
우리는 아까 점 생긴 거 보셨죠
그것들로 조절을 할 건데
곡선을 한번 만들어 볼게요
드래그 해주셔서 곡선 만들어 주시고
여기 중간점에서 곡선으로 내려 주세요
많이 내려 주세요
점차적으로 올라가도록 곡선을 만들어 주시면 되겠습니다
이렇게 만들어 주시면
한번 볼까요
스페이스바 콩콩콩콩콩콩콩콩
속도가 이렇게 변하게 되죠
그러면 이렇게 제자리에서 만들 수는 없겠죠
그래서 우리 X축도 한번 볼 거예요
X Position을 인디케이터를 맨 앞에 둔 채로
왼쪽으로 쭉쭉 끌어 줄게요
쭉쭉 끌어 주셔서 거의 안 보이는 상태로 두시고요
두시고
맨 끝 지점으로 인디케이터를 놓은 채로
X Position을 쭉 끌어 주세요
쭉 밖에 나가게 할까요
거의 나가게 할게요
194.3 정도로 저는 했습니다
194.3 정도로 했습니다
볼까요
인디케이터를 맨 앞에다가 두고
두고
콩콩콩콩콩콩콩
넘어가죠
다시 한번 볼게요
이렇게 바운스를 주시고
이 친구 X Position도 똑같이 Graph Editor를 줘서
조금 선택을 두 개를 해주시고
Easy Ease를 줄게요
그럼 조금 더 자연스러워 질 거예요
쿵쿵쿵쿵쿵쿵
어떻게 하면 더 자연스러워질지
한번 스스로 이동을 해 보시기 바랍니다
어떻게 하면 더 자연스러워질까
이렇게 하면 더 자연스러워질까
그렇죠, 이 바운스가 더 자연스러워지도록
수정을 해 주시고요
마지막으로 그래프 에디터 창을 닫으시고
옆에 있는 Motion Blur를 활성화 해 주세요
활성화 해 주시면 한번 다시 스페이스바 누르셔서 보면
살짝 모션 블러가 생기는 것을 볼 수가 있습니다
이렇게 해서 저희가 가속과 감속까지
한번 세밀한 속도 조절까지 해 봤는데요
오늘 굉장히 기본적이고도
중요한 개념들을 많이 다룬 것 같아요
키프레임이랑 그래프 에디터를 잘 사용하면
속도를 조절할 수가 있고
그런 속도를 활용한 애니메이션을 만들 수 있다
라는 점까지 배워 보았습니다
이번 시간에는 셰이프 레이어를 활용하여
그래픽을 만들어 보았고
키프레임을 활용해서 애니메이션을 적용해 보았습니다
애프터 이펙트에서 사용하는
다양한 레이어들에 대해서 숙지하고
키프레임과 그래프 에디터를 활용하여
가속과 감속에 대해 알아보는 시간이었습니다
도화지에 그림을 그리듯 레이어를 만들어
그 위에 그림을 그려 움직이는 그림을 그려 보셨다고
생각해 보면 좋을 것 같습니다
그럼 이번 시간 학습한 내용을
정리하면서 마무리하겠습니다
감사합니다
셰이프 레이어를 활용한 벡터 그래픽 타임라인 미디어 파일을 레이어 형태로 관리하는 패널 레이어의 재생 시간을 설정하거나 키프레임을 생성하여 실질적인 작업이 이루어짐
타임라인의 구성 현재 시간 타임 내비게이터 작업 영역: 드래그로 설정함 그래프 에디터: 속도를 세밀하게 조절함 Solo: 선택한 레이어만 화면에 표시하는 기능
Label: 레이어 양이 많을 때 같은 색깔로 그룹화하는 기능 Quality and Sampling: 미리 보기 화질을 조정하는 기능
Effect: 이펙트를 적용 또는 미적용하는 기능 Motion Blur: 블러를 활성화 또는 비활성화하는 기능
Adjustment Layer: 새로운 이펙트를 하위 레이어에 적용할 때 사용하는 레이어 Current Time Indicator: 현재 화면에 표시된 부분의 시간 위치를 알려줌
레이어와 키프레임 실습 레이어 레이어의 분류와 배열로 다양한 그래픽을 만들 수 있음 배경과 오브젝트를 분리하여 개별적이고 세부적인 작업을 만들 수 있음
키프레임 애니메이션을 만드는 데 필수적인 요소
특정 시간에 원하는 값을 입력하면 스톱워치를 활용하여 원하는 키프레임을 만들 수 있음 최소 두 개의 키프레임이 있으면 움직임이 만들어짐
애니메이션 적용 키프레임으로 가속과 감속을 적용함 그래프 에디터로 세밀한 속도를 조절함