詳細検索

Colorkrew의 CI 갱신에 대하여 - 모션 로고는 하루아침에 이루어지지 않습니다-

아바타
글쓴이 Hiroko Suzuki

Colorkrew의 CI 갱신에 대하여 - 모션 로고는 하루아침에 이루어지지 않습니다-
日本語에서 번역 • 원문 보기

안녕하세요. 디자이너 스즈키입니다.

저는 주로 제 서비스 Goalous의 UI를 디자인하며, 오랜 회사 경력에 맞게 종이, 부스, 티셔츠 등 다양한 작업을 할 수 있습니다.

이번에는 모션 애니메이션 제작의 비밀스러운 이야기를 들려드리고자 합니다. 당신이라면 이 분야의 전문가라면 "뭐 하는 거야?"라는 질문을 받을 것입니다???

갑자기 애니메이션을 만들라는 지시를 받았어

motion-logo

이 일을 잊지 않을 거예요(사실 잊어버려서 Teams 로그를 다시 확인했어요) 4월 10일이었어요.

이것이 벨소리와 함께 온 메시지입니다, 폴론.

 

수석 디자이너인 이즈미다 군은 제 이전 직장의 동료이자 당시 제 동료였으며, 제가 그를 Colorkrew에 초대했습니다.

비록 꽤 편하게 대화하지만, 지금은 이 요청이 너무 솔직하다고 생각합니다.

 

motion-logo

 

아웃소싱을 위한 대략적인 지침을 만들어 달라는 요청인 것 같아요.

 

…… 생각해 보세요.

매일 원자, 컴포넌트를 만들고 Sketch의 오버라이드 설정을 하는 제가 갑자기 애니메이션 제작 요청을 받는 이유가 뭔지 아시나요?

그럴 줄 알았어.

게다가 당시에는 모든 CI 갱신 관련 제품이 자체 생산된다는 소식을 듣지 못했습니다.

 

motion-logo

드디어 진지하게 애니메이션 제작 요청을 받은 것 같네요??? 대화가 불가능하다는 걸 거의 이해할 뻔했어요.

전화 통화로 바꿔서 만화 같은 대화를 보여드릴 수는 없지만, 대략적인 이야기는 이렇습니다.

 

우리 디자이너 팀이 무너졌어

  • 영화 애호가 수석 디자이너 (이즈미다 군)
  • 고양이를 사랑하는 하이퍼코더이자 설계도 할 수 있는 사람
  • 스티커를 좋아하는 독일 여성
  • 별이 빛나는 하늘을 찍는 취미를 가진 잘생긴 2학년 신입생

구조에 관해서는,

  • 전 오타쿠 (나)

 

스즈키가 애니메이션 제작에 가장 능숙해 보이지 않나요???

가끔 삽화를 그리기도 하는데, 그게 잘 될 것 같지 않아요???

…… 그게 흐름이야.

영상 채팅에서는 사진과 애니메이션이 다르💢💢💢게 깜빡입니다

motion-logo

 

저는 침착하게 요청을 받아들였습니다.

먼저 뭘 했어

하지만 어디서부터 시작해야 할지 모르겠어서, 당분간은,

motion-logo**구글링해봤어요. **

저는 'ggrks'라는 단어가 등장하기 전부터 인터넷을 사용해 왔습니다.

당분간은 모든 걸 구글링해요. 구글링하면 알게 될 거예요.

최근에 구글 선생님이라는 단어를 들어본 적이 없네요.

 

하지만 아무리 많이 봐도 소녀가 움직이는 애니메이션을 만드는 유일한 방법은

음, 그럴 것 같아, 순백 막대기보다 더 귀여운 여자를 움직이고 싶어. 나도 그렇게 생각해.

그렇다면 이건 어떨까요?

motion-logo<

 

しかしなかなか有用といえるハウツーにたどり着けない。

……とはいえ、学びはそれなりにありました。

運動曲線と予備動作。

 

·모션 커브

A에서 C로 바꾸면 그 사이에 B가 있습니다.

변화 과정에서 같은 지점들(손과 손, 머리 꼭대기)이 서로 부드럽게 연결되어야 합니다. 그게 바로 그 의미입니다.

motion-logo

처음부터 전혀 부드럽지 않은 모션 곡선을 본 점 양해 부탁드립니다.

 

예비 작전

점프하기 전에 쭈그려 앉거나, 공이 튀기 전에 땅을 밟는 동작과 같은 동작입니다.

이게 어렵지 않아 보였는데, 생각해보니 어떤 예비 조치가 적절한지 모르겠어요.

게다가 순백의 실루엣 인간으로, 형태로 식별할 수 있는 움직임이 아니면 보이지 않는다.

 

이거 어려운 ...... 아니야? 다시 알아차렸어,

motion-logo

그런 낙서를 그렸을 때 약간 절망했어요...... 며**칠간 이 문제를 그냥 내버려 뒀어요. **

(솔직히 말해, 그는 그 일을 끝냈다.) )

일단 시작하려고 했어.

내가 그를 재웠다고 해서 아침에 일어났을 때 내 오른손이 하나님의 손이라는 뜻은 아니야.

갑자기 조언해줄 애니메이터 친구가 생기지도 않았어요.

먼저 손을 움직일 수밖에 없었지만, 앞에 많은 어려움이 남아 있었다.

 

…… IT에 몰입한 모든 사람들.

마지막으로 종이에 '그림'을 그린 게 언제인가요?

기억이 안 나.

 

맞아. 집에 제대로 된 종이 한 장도 없어.

게다가 지금 내가 원하는 건 초등학교 때는 다 쓰지 못했을 것 같은 플립업 만화를 넘길 수 있는 노트패드야.

이렇게 많았는데 다 썼던 기억은 없는데, 왜 지금은 필요 없는 걸까요?

절망에 빠져 사람이 적은 시부야를 걸으며 100장짜리 노트패드(330엔)를 사러 갔습니다

집에 돌아와서 의자에 앉아 중학교 때부터 사용해온 연필기를 두드렸습니다.

안개 속에서, 당분간 이 작업을 시작할 수 있을까요......

그럴 땐 여전히 다정했어.

 

이번 일에는 원을 그리며 오르고 점프하는 실루엣 남자를 원해! 그게 명령이야.

먼저 그림 밑에는 표준 캔버스 대신 원이 필요합니다.

그게 내 말이야.

같은 크기의 원이 메모장에서 같은 위치에 있지 않으면 대략적인 스케치조차 그릴 수 없습니다.

컴퓨터라면 위에 원형 레이어만 있으면 됩니다......

 

컴퓨터의 감사함을 곱씹으며,

(1) 노트패드와 같은 크기로 골판지를 잘라내고, (2) 완벽한 원을 그리기 위해 골판지를 속을 비워 패턴을 만들고, (3) 노트패드 위에 골판지를 쌓아 원을 따라 계속 그립니다

나는 세기의 단순한 일을 할 수 있었다.

 

노트에 그려진 마루의 수는 약 50개입니다.

끝날 때쯤 제 얼굴은 티베트 여우 모양이었고, 본격적인 작업이 시작되기 전부터 정신적으로는 조금 피곤했어요.

하지만 마침내 그는 출발 위치에 도달했다고 할 수 있다.

드디어 그림을 그리기 시작했어

이즈미다 군의 요청은 다음과 같습니다.

 

·올라가서 나타나

·점프하고 벌려

‧마지막으로 상징 실루엣을 연상시키는 포즈로 바뀝니다.

‧약 30장으로 표현해 주세요.

 

어떻게 계획을 세울지 고민했고, 먼저 애니메이션의 스토리를 분석했습니다.

 

·올라가기

·중앙으로 걸어가세요

·점프

·로고 확장하기(Expand)

 

이 모든 것을 30장의 시트에 넣기 위해, 각 장에 대략적인 수의 시트를 할당하고(매우 적절하게) 그리고 그 간극을 메우는 핵심이 될 사진을 만들 계획이었습니다.

 

일정

·15장 올라가세요

·중앙으로 걸어가 5장

·점프 5

·확장(로고로) 5장

 

최종 결과

·12 계단 등반

·중앙으로 걸어가 7장

·점프 6

·확장(로고로) 3장 시트

 

마지막 로고의 실루엣 포즈에서 그리기 시작하자마자, 사진 5장이 필요 없어서 바로 실패했어요.

**그만해!! **

거기서부터 무작위로 그리면서 점점 줄여가자!

당분간은 처음부터 끝까지 뽑고 생각하지 말자! 그리고 정책을 바꾸자.

정확히 계획이 무엇이었나요?

이로써 총 43개의 플립업이 만들어졌습니다.

 

출근할 때 종이 뭉치를 들고 "한번 봐"라고 말할 수 있습니다.

세상은 코로나다. 2월 중순부터 7월 말까지 나는 **단 3일만 출근했다. **

오랫동안 원격 근무를 해온 Colorkrew는 매우 좋았습니다.

…… 회사들의 자랑 말고는,

러프 플립 만화를 확인하는 유일한 방법은 영상을 찍는 것입니다.

 

스마트폰을 책상 서랍에 넣고 사진을 찍고 각도에 신경 쓰면서 보냈어요......

나는 일곱 번의 번거로운 절차를 거쳤고, 이즈미다 군이 나를 바라보는 동안 나는 상의를 벗고 동작을 바꿨다.

여러 차례 작은 수정 끝에 거친 연필이 마침내 완성되었습니다.

motion-logo

도구 이야기

지금. 원고는 준비됐어. 이제 디지털로 만드는 것만 남았어.

 

 

………。

 

…………………。

 

어떻게 해야 하<<<

 

 

당분간은 "의심스러우면 벡터 데이터로 판단하라"는 것이 하나님의 가르침이니 저는 따를 것입니다.

짜증나나요? 짜증나요? 정말로요???

어도비는 분명히 애니메이션 제작 소프트웨어를 가지고 있어요. (똑딱거리는 소리)

그랬어, 저 사람들이 있었지. 애니메이트는 있는 그대로야.

오타쿠 가게 이름은 제쳐두고 그걸로 쓰자.

저는 단체 라이선스가 있어서 사용하지 않으면 아깝습니다.

새로운 앱에 노출되는 건 좋은 일이에요, 비록 잠깐이라도요.

 

 

…… 설치 ......

 

알겠어? (도움을 보며 가지고 놀고 있음)

알겠어? (공을 터뜨리며)

하하하? (양파 껍질 자동 배는 정말 좋아요)

 

「 ……………………。」

 

 

도구로 노는 게 재미있었어요

이번에는 내가 만들려는 것에 적합하지 않다는 결론에 도달했다.

그 이유는 다음과 같습니다.

 

‧손글씨 '율루' 원해

이것이 바로 최대치를 포기할 수 없는 이유입니다.

애니메이트는 원이나 정사각형과 같은 이른바 도형을 묘사할 수 있었는데, 이는 실루엣 인물을 그리기에 적합하지 않았습니다.

 

・플립북 같지 않아

벡터 데이터의 장점을 활용해 부드럽게 진행하는 것은 좋지만, 지금 만들고 싶었던 것과는 맞지 않았습니다.

 

・키프레임 반짝이

이건 과거에 플래시에게 심어진 제 개인적인 트라우마라서 애니멀은 나쁘지 않아요. 죄송합니다.

 

그리고 결국에는......... 짜증 섞인 마음으로 그랬어요. (결국......)

패배감이 정말 좋아요.

하지만 어쩔 수 없어. **마감일까지 작업을 끝내야 해. **

 

중앙의 기준점(등반, 서기, 걷기, 점프, 마지막)에서 베이스에 거칠게 그리기 시작하는 원시적인 작업, 레이어의 투명도를 조절하고 페인트 브러시 도구로 중간 구분을 늘리는 작업**입니다. **

마지막으로 만든 레이어는 35장이었습니다.

motion-logo

더 나은 방법은 없나요?????

분명 있을 거야.

분명 있을 거예요, 하지만 제가 처음부터 시작하면서 할 수 있었던 일은 이게 끝이었어요.

이렇게 했더라면 좋았을 텐데...... 조언이 있다면 회사 조사에서 알려주세요.

정말 왔다면, 해냈어요!! 또 블로그를 쓸게요.

드디어

결국 애니메이션을 만들었지만, 그것이 그림 그리기 실력과는 완전히 다르다는 것을 깨달았습니다.

다양한 머리 색깔의 요소를 스타일리시한 영상에 섞을 수 있었던 게 좋았던 것 같아요.

 

제가 만든 재료를 잘 요리해 주신 이즈미다 씨께 정말 감사드립니다!

motion-logo

Related Articles