종합 겔러리
1. 사람 이미지 불러와 화면을 확대하고 팬툴로 사람 주변을 정교하게 오린다. 지금 이미지는 작업을 벗어나는 큰 이미지이나 미리 줄일 필요가 없다. 다 오리고 나서 조정하면 된다. 1차 펜툴 작업이 끝났으면 필타입=솔리드로 하고 본 이미지와 그룹 에스 세이프 [예]을 하고 필타입=none, 이어 필타입=이미지를 하고 언그룹한다. 이제 이미지가 오려졌을 것이다. 오린 이미지를 확대해서 이번에는 팔 안쪽 부분을 펜툴 작업을 한다. 한 곳이 끝났으면 밑 이미지와 함께 세이프 오퍼레이션-서브트랙으로 오려 낸다. 가운데 한쪽도 같은 작업을 한다.
2. 이미지를 오렸으면 적당한 크기로 조정하고 작업창 적당한 곳에 위치시키고 30/30으로 잘라 타임라인 1-50프레임에 Appear into position-3D Spin in and grow를 주고 81-100 프레임에 Disappear from position-3D Spin out and grow를 주고 무비클립으로 묶는다.
3. 무비클립을 선택하고 필터-베벨을 주고 그림처럼 셋팅한다. 이어 바탕 이미지 불러와 밑으로 내리고 플레이를 해 본다.
4. 그림처럼 적당한 크기를 글자를 입력해서 배치하고 타임라인 35-100프레임에 One off-Cinema_Star wars를 주고 아웃라인의 모든 것을 하나의 무비클립으로 하고 open이라 한다. 이 영상은 프리로더와 같은 기능을 한다. 별도로 프리로더를 만들지 않고 이런 식으로 처리해도 된다. 포토샵 자료실에 이런 이미지들은 무수히 많다. 어떤 식으로 활용하느냐는 각자의 몫이다.
5. 메인 바탕 이미지 불러와 물결판 처리하고 이름을 bg라 한다. 이제 버튼과 버튼 에펙들을 만들어 보자.
6. 150/100으로 동그라미 그려 포지션 포인트 우중으로 하고 카피해 총 3개를 만들어 스케일 자물통 채우고 중간 세이프는 -w=200, 맨 아래 세이프는 -w=250으로 하고 처음 세이프를 제외하고 나머지 둘을 세이프 오퍼레이션-서브트랙으로 오려낸다.
7. 이런 작업을 할 경우 포지션 포인트를 잘 활용해야 한다. 일단 세이프를 그룹을 묶고 포지션 포인트 중하로 주고 350/250으로 주면 작업창 중앙을 중심으로 왼쪽에 위치한다. 이를 카피해 수평뒤집기를 해 그림처럼 위치시키고 이 둘을 블록으로 카피해 이번에는 수직 뒤집기를 한다.
8. 이제 모두를 선택하고 포지션 포인트 중으로 찍고 맨 아래 그룹 선택하고 로테이션 15, 오른쪽 위는 -15, 이렇게 15도로 서로 대칭되게 배치한다. 뒤집기를 한 세이프는 로테이션값이 주어져 있다. 거기에 15를 더하든 빼든 한다.
지금 그림을 보면 동그라미들이 겹쳐져 있다. 하나하나를 선택하고 _y값을 아래 그룹은10을 더 주고 위 그룹은 10을 빼서 간격을 넓힌다. 작업이 끝났으면 모두 언그룹하여 벗겨내고 동그라미는 동그라미대로 오려낸 세이프는 세이프대로 정렬한다.
9. 구별하기 쉽게 동그라미는 a-d로 오린 세이프는 a1-d1로 표시하고 이 모두를 선택해서 콘버트 투 무비클립으로 하고 각각 모두에게 필터-드롭사도우를 주고 a1-d1 4개는 다시 그룹핑 무비클립으로 묶고 btn1이라 한다.
10. a1 무비클립으로 열고 타임라인에 1프레임에 스톱 2-11 프레임에 페이드 인, 11프레임에 스톱, 12-21프레임에 페이드아웃, 나머지 3개도 같은 작업을 한다.
11. 광선 png 불러와 작업창에 맞추고 무비클립으로 한 다음 이름을 btn2라 하고 무비클립을 열고 타임라인 1프레임에 스톱을 주고 2-21 프레임에 Appear into position-Fade_Wipe in을 주고 21프레임에 스톱, 22-31 프레임에 페이드아웃을 준다.
12. 이제 버튼의 마지막 작업으로 글자를 입력해 보자. 화면을 확대해서 적당한 크기로 그림처럼 위치시키고 이를 복사 그림자 효과를 주고 타임라인 1프레임에 스톱을 주고 2-91프레임에 Return to start-Chaos를 주고 오른쪽 하단 에펙창에서 어몬트값을 1로 한다. 이를 복사 아래 그림자 효과 글자에 붙이기 하고 이 둘을 묶어 무비클립으로 하고 이름을 a2라 한다. 이제 a2를 카피해 b2를 만들어 해당 동그라미 위에 배치하고 또 다시 복사해 c2를 이런 식으로 각 동그라미 위에 글자를 수작업으로 배치한다. 이어 해당 글자로 바꾸어 주면 된다. 이 4개의 글자 무비클립을 함께 묶어 btn3라 한다.
13. 스샷이 너무 늘어나네요. 그림을 보고 잘 생각하세요. 이제까지 작업한 버튼의 모두를 하나로 묶고 이름을 button이라 하고 아웃라인에서 순서를 그림처럼 하고 a를 선택하고 타임라인 1-20프레임에 Appear into position-Come in_Mystery in을 주고 b는 21-40, c는 41-60, d는 61-80, 이어 80프레임에 스톱을 주고 btn1-3를 선택하고 80 프레임에 place를 준다.
이어 81프레임에 스톱을 주고 모두를 선택하고 remove를 준다.
14. 이제 버튼 작업은 끝났다. 버튼을 클릭하면 나타날 메인화면을 만들면 된다. 여기서 하나하나의 작업을 설명할 수도 없고 또 고급강좌에서는 그 정도는 누구나 할 수 있으리라 생각된다. 여기 스샷을 보면서 포인트만 말하겠다. 타임 라인의 1프레임이 비워 놓는다. 그래야 버튼으로 제어할 수가 있다. 맨 위 플레이되는 영상을 다시 한 번 보면서 이 글을 읽어보자.
* 무비; 강좌라 짧막한 토막 영상을 로드무비로 주소만 가지고 왔다. png프레임을 활용해 화면을 장식했다. 로드무비는 계산상으로 크기를 정할 수 없다. 플레이해 보면서 조금씩 수정해 나간다. 물론 좌표 역시 수작업으로 한다.
* 시; 시 영상을 아무 생각 없이 보면 미세한 차이를 느끼지 못한다. 깜박이 소스를 눈여겨보라. 꽃봉우리 뒤로 숨었다, 나타났다 한다. 이미지를 있는 그대로 사용하면 그런 효과는 줄 수 없다. 그런 효과를 주려면 이미지를 오려야 한다.
* 뮤직; 단순한 그림을 그대로 이용해 효과를 주어봤다. 최대한 이미지를 살리면서 눈에 보일까 말까 할 정도로 효과를 주었다. 키타선의 움직임은 누구나 볼 수 있겠지만 소리통의 동그라미 부분은 눈여겨보지 않으면 놓치기 쉽다. 우리가 영상에 효과를 줄 때 마구잡이로 소스 가져다 붙이기식으로 장식 할 것이 아니라 본 영상을 방해하지 않고 은근한 멋을 내도록 추구해야 할 것이다.
* 개별 영상의 각 장면에는 반드시 메인으로 돌아오는 버튼을 만들어야 한다. 물론 메인버튼 하나를 본 화면에 고정시키면 편하겠지만 그래도 없어졌다. 개별화면에서 나타나는 것이 보기 좋다. 어렵게 생각할 것 하나도 없다. 하나만 만들어 스크립트까지 적고 해당 영상에 붙여넣기만 하면 된다.
15. 위 스샷이 아웃라인에 최종적으로 배열되는 순서이다. 그림을 잘보고 이해하자. 배열이 끝났으면 open을 선택하고 1프레임에 place를 주고 101프레임에 리무비를 준다. 이어 씬을 선택하고 101에 스톱을 주고 이어 button을 선택하고 101프레임에 place를 준다.
*button/a/a에 들어갈 스크립트(무비클립이 아니라 그 안의 세이프)
on (rollOver) {
_parent.btn1.a1.gotoAndPlay(2);
_parent.btn2.gotoAndPlay(2);
_parent.btn3.a2.gotoAndPlay(2);
}
on (rollOut) {
_parent.btn1.a1.gotoAndPlay(12);
_parent.btn2.gotoAndPlay(22);
_parent.btn3.a2.gotoAndPlay(1);
}
on (release) {
_parent._parent.main.gotoAndPlay(6);
_parent.gotoAndPlay(81);
}
*button/b/b에 들어갈 스크립트
on (rollOver) {
_parent.btn1.b1.gotoAndPlay(2);
_parent.btn2.gotoAndPlay(2);
_parent.btn3.b2.gotoAndPlay(2);
}
on (rollOut) {
_parent.btn1.b1.gotoAndPlay(12);
_parent.btn2.gotoAndPlay(22);
_parent.btn3.b2.gotoAndPlay(1);
}
on (release) {
_parent._parent.main.gotoAndPlay(2);
_parent.gotoAndPlay(81);
}
*button/c/c에 들어갈 스크립트
on (rollOver) {
_parent.btn1.c1.gotoAndPlay(2);
_parent.btn2.gotoAndPlay(2);
_parent.btn3.c2.gotoAndPlay(2);
}
on (rollOut) {
_parent.btn1.c1.gotoAndPlay(12);
_parent.btn2.gotoAndPlay(1);
_parent.btn3.c2.gotoAndPlay(22);
}
on (release) {
_parent._parent.main.gotoAndPlay(4);
_parent.gotoAndPlay(81);
}
*button/d/d에 들어갈 스크립트
on (rollOver) {
_parent.btn1.d1.gotoAndPlay(2);
_parent.btn2.gotoAndPlay(2);
_parent.btn3.d2.gotoAndPlay(2);
}
on (rollOut) {
_parent.btn1.d1.gotoAndPlay(12);
_parent.btn2.gotoAndPlay(22);
_parent.btn3.d2.gotoAndPlay(1);
}
on (release) {
_parent._parent.main.gotoAndPlay(8);
_parent.gotoAndPlay(81);
}
메인버튼에 들어갈 스크립트
on (release) {
_parent._parent.btoun.gotoAndPlay(1);
_parent.gotoAndPlay(1);
}
'스위시세상 > 스위시 고급' 카테고리의 다른 글
슬라이딩 스크립트(마름모무늬) (0) | 2012.06.10 |
---|---|
버튼바 겔러리 (0) | 2012.06.10 |
Breaking Image Gallery (0) | 2012.06.10 |
Morphing Image Gallery 2 (0) | 2012.06.10 |
Fade out, Zoom, 반짝이글씨 Gallery (0) | 2012.06.10 |