Aseprite

도트 애니메이션 만들기 기본 공격 패턴 내려찍기 분석 및 만들기

일등하이 2022. 2. 9. 12:10
반응형

Aseprite 사용법을 조금더 공부해야 할듯 싶다
아직 단축키나 모르는 기능들이 너무 많은것 같다

참고 강좌를 통해 연습 해보았다
정말 친절하게 알려주는듯 하다
어떻게 학습 해야 하는지 방향성에 대해 알려줌과 동시에 스킬도 알려준다
꿀팁이 많다

먼저 구글에서 asset pixel gif 라고 검색해 다운받아 Aseprite에서 연다

play 버튼을 눌러 실행해볼수도 있다 





컨트롤 + E 를눌러 스프라이트 시트로도 내보내기 할수 있다 

sheet type을 선택 하면 여러가지 옵션이 보인다 


ByRows를 선택 하면 행으로 보여준다
(preview가 체크 되어 있어야 한다)



sheet type을 packed로 변경하면 다음과 같이 볼수 있는데 여백을 줄이고 싶다면 borders에 trim을 체크 한다


trim이 적용된 모습



어찌댔거나 강좌에서는 이러한 꿀팁도 알려준다
결론적으로는 기본으로 import한 gif파일을 가지고 진행한다

분석에 필요 하지 않은 프레임들을 지우면서 시작 한다

나는 대략 10프레임부터 22프레임까지를 선택해 지웠다

이때 드레그한후 델리트 키를 눌러 지워야 한다 

만약 시프트로 10프레임과 22프레임을 눌러 지우게 되면  다 안지워지고  10, 22만 지워진다 



3,4,5도 지워줬다 
5, 6도 지워줬다 


이때 지우기 전에 프레임별로 테그로 묶어서 테스트로 볼수 있는 기능이 있다

선택후 우클릭 
태그를 만들고 
실행버튼을 누르면 태그로 묶인 프레임만 실행된다 

이때 태그를 무시 하고 실행 하고 싶다면 실행 버튼에서 우클릭해서

Play All Frames를 선택해주면 된다 (토글이다)

태그를 지우거나 속성을 변경하고 싶다면 Tag에 우클릭해서 변경하면 된다

스프트 + C를 눌르면 박스를 그릴수 있다 (영역인듯)

박스를 잘 선택 하면 다음과 같이 하이라이팅 되며 크기를 조절할수 있다


이때 영상에는 나오지 않지만 Pixel Grid 를 선택 하면 다음과 같이 그리드를 볼수 있다


어찌댔건 다음과 같이 3군데를 마춰주고 분석을 시작 한다


키보드 좌우키를 눌러 각 프레임에 모션을 분석 한다
박스를 얼마나 어떻게 벗어났나를 체크 한다 (이게 핵심인듯)


B키를 눌러 주고 - 또는 + 를 눌러 크기를 조절하고 색을 선택한후 마킹을 한다

(2번째 프레임이 첫번째 프레임과 어떻게 달라졌는지..)

시프트 + N 을 눌러 새 레이어를 만들고 마킹 해본다

굉장히 좋은 방법 같다 



머리는 하나 올라가고
왼발은 미세하게 안쪽으로 이동
무릎도 안쪽으로 살짝 이동
허리는 뒤로 젖혀지며 쭉 펴진다
팔도 약간 뒤로 기울려진 모양
가슴도 올라간다

전체적으로 뒤로 젖혀지는 이미지란걸 표시 해준다



칼날은 위로 향하다가 내려 찍으면 아래를 향한다

2프레임 

3프레임 

낮은 자세
내려 찍으면서 등이 살짝 보이는 상체가 된다


팔은 대각선으로 쫙 뻗은 모양이다
사실 이런 모양이라면 칼의 방향이 달라져야 하지만
애니메이션으로 재생 시키면 순식간에 지나가서 티가 안난다



그리고 왼발이 살짝 앞으로 나간다
그리고 오른발은 옆으로 벌어진다







칼은 내려치는 모양으로 크게 이펙트를 줬다




4번 프레임

내려치면서 올라갔던 옷이 내려오고
발은 고정한체 전체적으로 한칸 올린 느낌







새파일을 만들고

분석한것을 토대로 찍으면 된다는데...
이게 제일 어려운듯

레퍼런스를 오른쪽에 끌어다 놓으면 작업 하기 편리함


더블클릭

투명도를 줄여 주고

캔버스 사이즈를 width로 조금 늘렸다 

영상이 너무 빨라 정확한 수치를 확인 할수 없다



막히거나 이상한건 다시 뜯어본걸 본다

오른쪽에 있는걸 지워주고 
2번 프레임을 복사해서 3번 프레임을 만든다 

M키를 눌러 선택 해서 오른쪽으로 띠어 낸다


마지막 프레임 만들기

마지막 프레임에서 체력을 다 소진 대충만듬...

으...힘들구나

ex_01.aseprite
0.00MB





참고
https://www.youtube.com/watch?v=umCdX5QbHzE&t=6

https://gall.dcinside.com/mgallery/board/view/?id=pixelart&no=4839

Aseprite팁] 4. 단축키에 관한 팁! - 도트 갤러리

- 이전 팁 - Aseprite팁] 1. 이미지 리사이즈방법! : http://gall.dcinside.com/m/pixelart/4729Aseprite팁] 2. 팔레트의 모든것! : http://gall.dcinsi

gall.dcinside.com

반응형