[선택자 1]

[선택자 2]


[선택자 3]

[선택자 4]


[인접관계자 선택, siblings]

[prev(), prevAll(), prevUntil('한정요소선택') / next(), nextAll(), nextUntil('한정요소선택')]

[parent() -> 부모 요소]

  • parents() -> 상위요소 모두
  • parents('div') -> 상위요소 div로 제한

[근접 선택자, closest]

[배열 추가 메소드]

[String]

[String_예제1]

[String_예제2]

[String_예제3]


[Number 객체 메소드]

[씬 05, sc 05 디자인]

  • 씬05 컴포지션 만들고, 카드 6개 배치 스케일값 조정해서, 3D모드로 바꾸고 나서 위치값 원본 영상이랑 (카드 사이 거리 체크한뒤에),
  • 가운데 Null 만들고 Null z축 0 기준점을 잡고 -50 , -150, -250 / 50, 150, 250 으로 배열! (카드사이 거리 넓히고 싶으면, 카드 스케일조정!)

[원근감 만들기 위해 카메라 설치, 널 설치하고 3D만들고, 페어런츠 하기!]

[카드 애니메이션 추가]

  • 1.카드 여섯개 선택후 포지션값 열고 10프레임 정도 뒤에 초시계 눌러주고, 다시 0프레임으로 가서 카드 전체 위치 위(z축)로 올려주기 (위에서 떨어지는 카드 연출 위해)
  • 2.모션 코드 넣고 (freq, decay, w=freq*MathPI*뒤에수치 --> 이렇게 3개 바꿔주기!!)

[하나하나 떨어지는 카드 만들기]

  • 애니메이션 만든 카드 레이어 우측 마우스 클릭, 'copy expression only' 선택후 다른 레이어, alt 누르고 포지션값 눌러서 하나씩 복붙 진행!
  • 페어런츠 해놓은 null 6번으로 로테이션값 조절 해서 카드 위치 변경하고, 스케일 값도 조정!!
  • 시간차 주기 위해 레이어 위치 조정!!


[카드가 끝나는 지점에 모든 카드가 정면에서 모아서 보이도록]

  • 카메라 널 (Null 7)의 orientation값 0,0,0으로 (조정한값 키프레임, 0/0/0 키프레임)
  • 카드 조절 널 (Null6)의 값 Z값 (조정한값 키프레임, 0키프레임)

[2D 디자인]

  • 카드를 하나씩 선택해서 복제해주고 위로 올리고, 3D값, 포지션값 끄기!!
  • 6개카드가 전체 보이도록 x축 기준으로 배열!
  • (등간격으로 나열하기위해서) 위에 카드 레이어 기준점으로 아래 카드 X축 기존수치
  • -60씩 빼기 / 그다음 카드 기존수치
  • -60*2 / 그다음 카드 기존수치-60*3 (이렇게 6장 카드 모두 진행!)

[일자 배치]

  • 위에 2D로 배열 맞춘값 (X랑 Z값을 밑에 카드에 그대로 적용!!)

회전이 끝나는 키프레임 (Null 7)에 맞춰서 밑에 값 그대로 적용!!

[카드 깜빡임 현상 없애기]

- 카드 애니메이션 끝나는 구간에 플레이 헤드 위치시켜놓고 위에 Edit - split layer 한뒤 나뉘어진 레이어들 위로 올리고 적용된 모든 애니메이션 끄기!!


[2D 카드로 등간격 조정해서 수치 만들고, 밑에 나눈 카드에 그대로 x,y축 값 적용]

 

  • 2D 등간격 조정할때, 그때만 Null 잠깐 풀어주고 (align 적용하기 위해), 맨 첫번째 카드랑 뒷카드로 간격 조절 한다음에 align버튼 눌러서 카드 나열 하고, 다시 Null 연결
  • 밑에 seperate했던 카드에 위에 2D x,y축 값 그대로 적용해주기!

[그래프로 애니메이션 속도 조절]

  • 카드레이어 전체 선택후 그래프 클릭, 드래그후 한번에 내려서 위에 사진처럼 그래프 모양 만들기!

[카메라로 연결된 널로 뒤로 빠지는 애니메이션 만들고, 그래프로 속도 조절하기!]

[카드 넘어갈때 다른 뒷면 보이는 애니메이션]

  • 위에 edit - split layer 하고 새로 생긴 레이어 중심점 옮기기
  • 위에 edit - split layer 하고 새로 생긴 레이어에 alt 누르고 원하는 사진으로 덮어쓰기!

[카메라 옆으로 무빙 후 카드 넘어가는 애니메이션]

  • Null7 카메라 무빙 옆으로 움직여서 키프레임 찍기
  • 찍은 키프레임에 맞춰서 뒤로 넘어가고 사진 바뀌는 레이어 위치 조정!!

[카메라 확대 애니메이션]


[트랜지션 컴포지션 추가]

  • 앞면 디자인한 카드 모두 가져오고 -> 맨 앞, 뒤 카드로 위치랑 간격 조정후 -> align으로 등간격, 중앙정렬 배치하기(모든카드선택후)!!

[카메라 복제후 확대 컷 하고 뒷부분 잘라주기:alt + [ ]

[가위,바위,보 게임]

[랜덤하게 이미지 바꾸기]

[랜덤하게 배경색 변경]


[Array 객체]

코딩

결과

[카드 1,3,5장 보이는 애니메이션]

  • 카메라 만들어주고, 카메라를 Null에 페어런츠 해주기
  • 그래프에서 속도감 주기

[X축 값 조정해서, 마드 포지션 애니메이션 주기!]

  • 카드들이 밑으로 숨는거기 때문에 Z값 조정도 필요!! (Z축 0, 0.5, 1.0)

숨겨질 카드 X 값에 맞춰서 숨겨지는 애니메이션 주기 (X축 포지션 값으로)


  • total 컴포지션에서 sc 03이랑 sc 02 합쳐주기
  • 마스크 패스로 애니메이션 주기 (레이어 전체를 마스크 씌우고 Ctrl 누른 상태에서 오른쪽 마스크 영역 지정하면 왼쪽 부분 대칭되서 마스크 영역 지정됨)
  • effects - transition - venetian blinds: 블라인드 효과

[Rolling images]


[객체 리터럴]


[속성 추가]

[객체 생성자 함수]

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

[Date 객체 함수]

코딩

결과


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

+ Recent posts