신씨드

[Rolling images]

[객체 리터럴]

[속성 추가]

​

[객체 생성자 함수]

객체 생성자 함수는 세미콜론, 콤마 모두 활용 가능!!

[Date 객체 함수]

코딩

결과

• 밀리초(1/1000초) ->(*1000) 초 ->(*60) 분 ->(*60) 시 ->(*24) 일

​

​

[붓 효과]

• 컴포지션 1500 * 200 생성

• 뉴솔리드 레이어 추가 --> 원형 마스크 그려주기 --> 원형 위아래로, 꼭지점 추가 --> mask path 눌러서 늘어나는 애니메이션 주기

• roughen edge 효과: 경계면을 붓으로 칠한거 같은 효과

border값, stretch값, complexity값 조절해서 붓 느낌 디자인해주기!!

• 새로운 컴포지션 만들기

• ink matte컴포지션에 잉크소스 복제해서 디자인

• 씬(sc 02) 컴포지션 만들기

• 인물사진, 글자 디자인

1)사진 마스크 펜툴기능으로 따서 텍스트랑 같이 배치

2)사진위에 ink matte컴포지션, 텍스트위에 ink matte컴포지션 배치

-사진의 position 복사해서 ink matte에 붙여주기 / 텍스트도 동일 (텍스트, 사진에 Alpha inverted 값 적용해주기)

-inkmatte로 각각 사진, 텍스트 페어런츠 해주고 / 3D 선택해준다음에 / Z값을 조정해서 사진과 텍스트 앞뒤 배치 느낌으로 표현

-텍스트 관련 inkmatte 스케일값, 로테이션 조정해서 다른 디자인 처럼 디자인!

​

[sign디자인]

• 뉴 컴포지션 1280*1280

• 글자 입려후 마우스 우클릭 -> create -> create shapes from text 클릭

• OR, 일러스트에서 로고 가져오기
  • 로고 이미지 디자인 다운
  • 일러스트에서 오픈, image trace, 저장, 애팩에 불러오기, 컴포지션으로 따온 로고 디자인 -> 마우스 우클릭 -> create -> create shapes from vector 클릭해서 디자인
  • stroke는 애니메이션 추가해서 적용해주면 됨

• 하나의 쉐이프 레이어에 Trim path 애니메이션 추가, End 값으로 1초 간격, 0 -> 100% 만들어주고 / trim path 만든 애니메이션 ctrl+C 하고 나머지 쉐이프 레이어 동시 선택 후 ctrl+V (시간 맨 앞쪽으로 위치 시킨 상태에서!)
• 쉐이프 레이어들 시간 간격 다르게 배치하기

[뉴컴포지션_total : sc01,02 합치기]

• Ctrl+ Alt +Home : 중심점 조정

​

[화살표함수]

​

[화살표 함수 예제]

• css -> background - color
• js -> backgroundColor

​

[배경화면 바꾸기]

​

[영상사이트 추천]

• Video Copilot

https://www.videocopilot.net/

[카드, 씬1, 2초 _ 3H]

• 레이어 선택 X 컴포지션 선택된 상태에서 위에 라운드 원형 쉐이프 모양 더블 클릭하면 자동으로 생성되고 --> 라운드니스, 사이즈 조정한뒤에 --> 밑에 카드 레이어 'Alpha'값으로 바꾸기!!
• 카드뒷면01 컴포지션 --> 위 Edit - duplicate --> 사진은 지우고 쉐이프 레이어만 남기기 --> 디자인

​

• 뒷면 카드 2장, 앞면 카드 4장 디자인 완료
• 카드 뒷면 컴포지션 duplicate --> 안에 레이어는 지우고 이름 카드합으로 바꿔주기 (카드앞, 뒷면 컴포지션을 합쳐서 하나로 표현)
• 카드합1,2,3,4 만든 후 3D 선택해주기(카드뒷면 포지션 값, z축, -0.5적용해주기)

• 카드합 1,2,3,4 스케일 조정해주고 위치 조정해주고(align) --> 카메라 생성, Null생성 --> 카메라 Null에 페어런츠 연결! --> Null에 3D선택
• 중심축 카드 오른쪽으로 조정, 포지션 값으로 아래에서 위로 올라오는 애니메이션 생성, 그래프로 스무스하게 올라오도록 조정!!
• 전체 R(로테이션값) 찍어주고 --> 1프레임 뒤에 Y축 기준 -180도 애니메이션 만들어주기!

• 레스터라이즈(Rasterize) 버튼 눌러주고 (그럼 카드 앞면이 보임) --> 각 카드 합 컴포지션 들어가서 --> 카드앞면만 X 축 기준으로 -100 (좌우반전해주기!)

• 시야가 같이 카드 넘어갈때 오른쪽으로 가는것 처럼 Null position값 X 축 기준으로 설정!!

• Z 축 포지션 뒤로 가도록 값 조정해주고, 'Linear'로 키프레임 변경해주기(Keyframe Interpolation)
• 사라지다가 생겨나는 텍스트 만들기
  • 1.텍스트 작성후 3D클릭 (그래야 카메라가 따라가면서 잡아줌)
  • 2.mask1로 글자 생겨나도록 mask path애니메이션 주기
  • 3.mask2로 글자 지워지도록 mask path애니메이션 주기

​

[Break, Continue문]

[종합문제]

[함수]

• 태그 = 요소 = element
  • --> DOM(Document Object Model)
• 이벤트로 연결!!

onclick 이벤트로 연결

[함수 호이스팅]

​

[함수의 매개변수]

​

함수(데이터)

함수(데이터를 받은 변수=매개변수=파라미터) {

data가지고 연산을....

결과 return

​

}

​

[두익 세팅]

• 로컬C - program files - adobe - adobe after effects 2020 - support files - scripts

경로로 가서 ScriptUP Panels 다운받고, 복사 붙여넣기

​

- 관절디자인은 원형으로 많이 시작함! 로테이션 줄때 각이 있으면 어색하기 때문!!

​

- 위에 window - Duik Bassel.2 - (아래 사진 처럼 체크박스 표시해주고 OK)

​

[Duik 실행]

​

쉐이프 디자인으로 자동 만들어짐! / 로테이션주고 길이 조정 후 페어런츠 해서 사용! / 레이어 하나라도 지워지면 XX

• 각 영역 별 옵션 추가 가능!!(모양, 관절 등등)

[캐릭터]

• 포토샵 파일 다운 -> 임폴트
• 앵커포인트 조정 후 사용!!/ 두익 사용시 레이어 이름 바꾸면 XX

​

[두익에서 Hominoid 생성하고 팔, 다리 별 하나씩 관절 맞춰주기!!]

[Auto-rig & IK]

• 꼭 두익 레이어들 다 선택한 상태에서 'Auto-rig & IK'클릭!!

Auto-rig 하면 두익 레이어 옆에 'S'(뼈대), 'C'(컨트롤러)표시 생김

• 캐릭터랑 두익 레이어랑 페어런츠!

• 페어런츠 연결이후에는 'C'(컨트롤)레이어로 컨트롤!!

뼈대('S') 레이어는 숨김 처리~

레이어 모두 선택하고 'P'눌러서 포지션 열고 포지션 마우스 우클릭해서 'Seperate~~'활성화 --> 초시계 클릭후 마우스로 쭉 아래로 드래그 하면 다 한번에 선택 가능!!

[1프레임 단위로 X 축 기준으로만 왼쪽, 정면, 오른쪽 애니메이션 주기!!]

레이어 shift 누른상태로 Xposition 다 선택해주고 --> Connect to Properties 선택!! (X축 기준)

오른쪽 컨트롤 박스로 얼굴 애니메이션 컨트롤 쉽게 가능!!

[Y축 컨트롤러 만들기]

동일한 방법으로 Y축 기준으로 1프레임 단위로 아래, 정면, 위 애니메이션 만들어주고 --> Y속성만 'shift'누른 상태로 다 선택해주고 --> 축 'Y'로 설정하고 --> Connect to propertiese클릭!!

​

[눈꺼풀 컨트롤러]

• 레이어가 아무것도 선택 안되어 있는 상태에서 슬라이더 생성!! --> 해당 눈커풀 레이어 & 포지션 선택 후 --> 'Connect to properties' 선택

​

​

​

[Mouth 컨트롤러]

• 레이어가 아무것도 선택 안되어 있는 상태에서 슬라이더 생성!! --> 해당 마우스 레이어들 선택 후(페어런츠 되어있는 마우스 레이어의 포지션 키프레임 지운 후) --> 'Connect to opacities' 선택

[캐릭터, 워크 자동 애니메이션]

꼭 컨트롤러 레이어 다 선택후!! --> 위에 톱니바퀴 버튼 누르고 --> Walk cycle 누르기 (걷는 애니메이션 자동적용)

손 등 컨트롤 할때 (IK --> FK --> Individual controls에서 손 컨트롤)

'Walk Cycle'효과 / 캐릭터

​