스크랩 애니메이션 자료제작과 활용

[최명천]

 

애니메이션  자료제작과 활용		1. 스위시와의 만남  2. 텍스트 애니메이션  3. 이미지 애니메이션  4. 텍스트+이미지 애니메이션  5. 버튼 만들기  6. 스프라이트 만들기  7. 사운드(Sound) 활용  8. 액션 시작하기  9. 레이블(Label)액션 10. Tell Target 11. Load Movie 12. 스크롤 창 만들기 13. 스위시와 플래시 14. 교수-학습 자료제작
이  상  봉 신양초등학교 교사 http://swish.ineasy.net  eduman@hitel.net

제1강	강의제목	스위시와의 만남
	학습목표	스위시를 설치하고 메뉴의 특징 및 화면구성을 알 수 있다.
	학습내용	▶ 스위시 소개 ▶ 스위시 설치 ▶ 스위시 메뉴구성

제 1단계	스위시 소개

1. SWiSH 란 어떤 프로그램인가?

     플래시를 필두로 하여 바야흐로 웹 애니메이션의 시대가 도래하였습니다. 플래시 웹 애니메이션을 이용하면 웹을 보다 화려하고 인터렉티브한 공간으로 만들 수 있지만 사용 방법이 어렵고 복잡하며 실제 웹에서 사용할 만한 작품을 만들려면 오랜 작업 시간이 걸린다는 단점이 있습니다. 그러한 고민을 해결해주는 것이 바로 스위시(SWiSH)란 프로그램입니다. 플래시에서 만들기 힘든 복잡한 텍스트 애니메이션을 마우스 클릭 몇 번으로 금방 만들 수 있고, 이미지나 사운드는 물론 마우스 이벤트와 액션을 활용한 다이내믹한 웹 애니메이션을 매우 빠르게 제작할 수 있습니다. 현재 많은 웹사이트에서 배너 광고나 인트로 무비 등으로 보여지고 있는 플래시 애니메이션의 상당수는 스위시를 이용해 만든 것이 많습니다. 스위시가 세상에 나온 지는 불과 얼마 안됐지만 그 놀라운 기능과 편리함으로 벌써 많은 웹 디자이너들의 사랑을 듬뿍 받고 있습니다.

 2. SWiSH의 특징은?

  ①스위시는 기본적으로 SWI란 작업 파일형식으로 만들어지지만, 웹에서 사용 가능한 SWF 파일형식을 만들 수 있습니다. 특히, 만든 SWF를 플래시에서 불러들여 보다 큰 플래시 무비의 일부분 또는 무비클립으로도 사용할 수 있는 특징이 있습니다.

  ②스위시는 텍스트 애니메이션을 만드는데 매우 뛰어난 기능을 가지고 있습니다. 폭발 효과(Explode effect), 회오리 효과(Vortex effect) 등의 복잡한 텍스트 애니메이션 효과를 간단한 조작으로 불과 몇 초만에 만들 수 있습니다.

  ③스위시는 텍스트 애니메이션뿐만 아니라 이미지, 사운드, 액션, 스크립트 등도 사할 수 있기 때문에 복잡한 웹 애니메이션도 만들 수 있습니다. 또한 150 가지 이상의 내장된 effects를 포함하고 있으며 로고 애니메이션, Rollover 버튼, 인트로 무비, 검색 바, 상호 작용하는 프레젠테이션 등 활용범위가 무궁무진합니다.

제 2단계	스위시 설치

 1. 스위시 다운받기

   스위시 2.01 트라이얼 버전은 기능상의 아무런 제한 없이 15일 동안 정품과 동일하게 사용할 수 있습니다. 15일 이후에도 계속 사용하려면 정식 라이센스를 구입해야 합니다. 트라이얼 버전을 다운받을 수 있는 곳은 스위시 교사커뮤니티 사이트인 http://swish.ineasy.net 과 국내 유명 사이트의 자료실에서 다운받을 수 있습니다.

 ①Http://swish.ineasy.net 에 접속하여 DOWNLOAD free trial version」버튼을 클릭 합니다.

  ②컴퓨터에 [스위시]란 새 폴   더를 만들고 다운로드 받습   니다.

2. 스위시 설치하기

  ①다운받은 실행파일을 더블 클릭하여 [Next]를 클릭 합니다.

②프로그램 저작권에 관련된   라이센    스 화면에서 [Yes] 클릭하고, 설치할    위치를 설정하는 화면이 나타나면     기본 경로로 설치합니다.

③스위시2가 설치되는 진행 과정이      나타나면서 설치가 완료됩니다. 이    제, 바탕화면의 단축아이콘을 이용    해 스위시를 실행할 수 있습니다.

  ④바탕화면의 스위시 아이콘을 더블 클릭 합니다. 스위시 프로그램은 고유 번호인 Site Code가 있어 이에 맞는 Site Key를 찾아서 입력해야 사용할 수 있습니다. [Try] 버튼을 클릭합니다.

  ⑤자동으로 스위시 홈에 접속이 되면서 해당 Site Code에 맞는 Site Key 정보가 표시됩니다. 웹에 있는 [Select Key and Copy to Clipboard]를 클릭 하면 [Try] 버튼이 [Paste Key]키로 바뀌게 되며 이때 [Paste Key]버튼을 클릭하면 정상적으로 스위시 프로그램을 15일 동안 정상적으로 사용할 수 있습니다.

  ⑥스위시 2 Trial 버전은 15일 동안만 사용할 수 있기 때문에, Trial 버전으로 학습한 이후에는 정식 라이센스(License) 구입을 권장합니다. 구입은 http://school.ineasy.net 에서 구입할 수 있으며 결제는 인터넷상에서 비자카드나 마스터 카드로 하며, 결제 후 메일로 보낸 준 라이센스를 스위시 Trial 버전에 입력하면 정품이 됩니다.

   스위시 설치

 스위시 트라이얼 버전은 최초 설치 후 15일 이후엔 사용이 불가능합니다. 연수 전에 미리 설치하지 마시고 연수시작과 함께 설치하여주시기 바랍니다.

   꼭 알아둡시다.

①스위시는 텍스트 애니메이션을 만드는데 매우 뛰어난 기능을 가지고 있습니다.

  ②Timeline Panel은 시간의 흐름에 따라 애니메이션의 속도와 내용을 조절하는 곳입니다.

  ③스위시는 기본적으로 SWI란 포맷의 작업(소스) 파일형식으로 만들어지지만, 웹에서 사용 가능한 SWF 파일형식을 만들 수 있습니다.

제 3단계

 1. 스위시 인터페이스

  스위시의 인터페이스는 메인 메뉴(Main Menu), 툴박스(Toolbox), 그리고 타임라임(Timeline), 아웃라인(Outline), 레이아웃(Layout), 텍스트(Text)등의 각종 패널(Panel)로 이루어져 있습니다. 여기에서는 스위시의 사용자 인터페이스 각각의 구성과 주요 기능을 대략적으로 살펴보도록 하겠습니다.

  ①Main menu - 스위시의 모든 기능을 포함하는 메뉴들로 구성되어있습니다.

  ②Standard Toolbar - 많이 활용하는 메뉴들을 아이콘으로 제시하고있습니다.

  ③Insert Toolbar - 각종 객체들을 삽입하는 기능을 포함하고있습니다.

  ④Control Toolbar - 무비를 미리 보고 정지하는 등의 조절기능을 포함합니다.

  ⑤Timeline Panel - 시간의 흐름에 따라 애니메이션의 속도와 내용을 조절한 곳으로 각각의 오브젝트마다 레이어가 하나씩 생성됩니다. 프레임(Frame)은 영상을 구성한 공간을 말하며, 애니메이션의 경우 그 무비에 사용되는 여러 장의 화면 중 한 하면이 한 프레임이 됩니다.

  ⑥Outline Panel - 무비에 삽입된 장면과 오브젝트의 목록을 트리(Tree) 형식으로 보여주는 곳으로 오브젝트를 폴더 형태로 관리 할 수 있는 곳입니다.

  ⑦Layout Panel - 드로잉 작업을 할 수 있는 Toolbox 및 무비 및 텍스트, Transform, Actions 패널 등을 포함하는 작업공간입니다.

 *메뉴에 대한 자세한 설명은 생략하고 예제를 실습하면서 다루어봅시다.

♣ 실습과제 - 1	①스위시 2.0 버전을 설치 후 Insert Panel을 활용하여 각종 객체를 자유롭게 삽입하여보시기 바랍니다. ②각종 패널의 기능을 확인해보시기 바랍니다.

제2강	강의제목	텍스트 애니메이션
	학습목표	무비를 설정하여 다양한 텍스트 애니메이션을 구현할 수 있다.
	학습내용	▶ 무비설정 ▶ 움직이는 텍스트효과 ▶ 다양한 텍스트 애니메이션

제 1단계	무비 설정

 1. 무비의 크기설정

 ①애니메이션을 제작하기 전에 가장 먼저 해야 할 일은 제작할 무비의 크기 및 배경 색, 초당 프레임 수 등의 속성을 설정해야합니다.

 ②무비의 크기는 700*450으로 지정합니다.

 ③스위시는 가장 최후의 설정 값을 기억하는 특징을 가     지고 있습니다.

 ④레이아웃 패널의 %를 지정해서 보여지는 옵션을 지정     할 수 있습니다.

 2. 무비의 배경지정

  ①무비패널의 Bgnd Color를 클릭하여 무비의 배경 색을 지정할 수 있습니다.

  ②현재 무비에서는 기본 값인 흰색으로 지정합니다.

  ③메인 메뉴의 File-Import를 이용해서 그림파일을 배경으로 지정할 수 있습니다.

  ④Outline-Insert-Image를 이용해서 그림파일을 배경으로 지정할 수도 있습니다.

  ⑤파렛트의 스포이드를 이용하면 화면의 특정 색상을 배경 색으로 지정할 수 있습니다.

 3. 프레임 속도 지정

  ①스위시의 기본 프레임 속도는 15로 되어있습니다.

  ②본 무비에서는 좀더 느린 움직임으로 제작하기 위해 12로 지정합니다.

  ③무비를 제작한 후에도 무비 패널에서 프레임 속도를 조절함으로서 전체무비의 속도를 변경할 수 있습니다.

  ④그밖에도 사용자의 작업의 편의를 위해서 Grid와 Ruler를 지정할 수 있습니다.

제 2단계	움직이는 텍스트 효과

 1. 텍스트 입력

  ①Outline-Insert-Text를 이용하여 텍스트를 입력합니다.(아이콘 메뉴도 가능)

  ②텍스트는 “컨텐츠 제작연수” 와 “충청남도교육연수원”로 입력합니다.

  ③우측의 텍스트 패널에서 텍스트의 글꼴과 크기, 색상 등을 지정합니다.

 

2. 텍스트에 효과주기

①Add Effect의 패널에서 다양한 효과를         지정할 수 있습니다.

②우선, 효과를 지정할 대상 텍스트를 마우      스로 선택합니다.

③Add Effect의 단순 효과로 Fade In효과를      지정해봅시다.

④Fx미리 보기로 미리 봅니다.

3. 효과 없애고 다른 효과 지정하기

①지정한 효과를 없앨 때는 Del Effect를 이용합니다.

②원하는 객체를 선택하여 효과를 삭제합니다.

③새로운 효과를 지정하기 위해서 Add Effect를 선택합니다.

  ④단순 효과 중에서 Slide In의 From Top

    을 지정하여 미리 봅니다.

  ⑤그 밖의 다른 효과도 지정해봅시다.

   무비의 실행속도 조절

스위시에서 제작된 무비의 속도를 조절하는 방법은 무비 설정 패널의 초당 프레임 수를 조절하는 방법이 있습니다. 초당 프레임 수의 수치를 크게 하면 무비의 속도가 그만큼 빨라지게 되며, 반대로 초당 프레임수의 수치를 작게 하면 전체 무비의 실행속도가 느려지는 효과를 볼 수 있습니다.

제 3단계	다양한 텍스트 애니메이션

 1. 단순효과 (Simple Effects) : 글자와 그림 등 모든 오브젝트에 적용

2. 복합 효과 (Complex Effects) : 글자에만 적용

  ①Transform - 구성 요소의 형태 변화를 이용한 효과입니다.

  ②Squeeze - 오브젝트의 구성 요소간 간격을 변화시켜 스퀴즈 되는 애니메이션을 만듭니다.

  ③Alternate - 오브젝트의 구성 요소가 번갈아 교대로 진행되는 애니메이션 효과를 만듭니다.

  ④Snake - 텍스트를 뱀처럼 자유곡선으로 움직이게 하는 효과를 설정합니다. 이 효과로 긴 문장의 텍스트를 원형으로 움직이게 지정할 수 있습니다.

⑤Explode - 폭발 효과를 설정합니다.

⑥3D Spin - 객체의 3차원 회전 효과를 설정합니다.

⑦Vortex - 회오리 효과를 설정합니다.

⑧Wave - 텍스트에 물결 효과를 설정합니다.

⑨Typewriter - 텍스트를 타자치는 효과로 설정합니다.

⑩Revert - 모든 효과를 삭제하고 본래 상태로 되돌립니다.

   꼭 알아둡시다.

①스위시의 기본 프레임 속도는 15로 되어있습니다.

  ②무비를 제작한 후에도 무비 패널에서 프레임 속도를 조절함으로서 전체무비의 속도를 변경할 수 있습니다.

  ③단순효과 애니메이션은 글자 및 이미지에 모두 적용할 수 있습니다.

  ④복합효과 애니메이션은 글자에만 적용할 수 있습니다.

♣ 실습과제 - 2	①Add Effect 와 Del Effect 메뉴를 이용하여 다양한 텍스트 애니메이션을 구현해봅시다. ②Snake 효과를 이용하여 긴 문장이 원형으로 돌아가는 텍스트 애니메이션을 구현해봅시다.

제3강	강의제목	이미지 애니메이션
	학습목표	이미지를 그려서 간단한 움직임을 구현할 수 있다.
	학습내용	▶ 이미지 도구 활용하기 ▶ 움직이는 Move 효과 활용하기 ▶ Motion Path 활용하기

제 1단계	이미지 도구 활용하기

 1. Toolbox의 기능(상단 4개)

①Select - 스테이지의 각종 객체를 선택하는 기능을              가집니다.

②Rotate or Skew - 선택된 객체를 회전시키거나 각              도를 조절할 때 사용합니다.

③Reshape - 객체의 모양을 변형합니다.

④Motion Path - 객체에 움직임을 부여합니다.

2. Toolbox의 기능(중단 4개)

①Fill Transform - 객체의 면 색을 바꿉니다.

②Line - 직선을 그립니다.

③Pencel - 곡선을 그립니다.

④Bezier - 베지어 곡선을 그립니다.

 3. Toolbox의 기능(하단 4개)

①Rectangle - 사각형 객체를 그릴 때 사용합니다.

②Eclipse - 원형 객체를 그릴 때 사용합니다.

③Zoom - 객체의 크기를 변화시키는 것이 아니라 객             체의 보이는 크기를 확대합니다.

④Pan - 작업 스테이지를 쉽게 이동시킵니다.

 위의 드로잉 도구 모음(툴박스)은 레이아웃 패널에서 작업하는 데 사용하는 도구를 모아 놓은 곳입니다. 레이아웃 패널의 좌측 하단이 있는 줌 콘트롤(Zoom Controls)을 이용하면 작업 공간(workspace)의 보기 비율을 손쉽게 조절할 수 있습니다. 작업 공간(Workspace)은 실제 작업이 이루어지는 공간이며 웹에서 보여 지는 부분으로 스테이지라고 하기도 합니다.

제 2단계	움직이는 Move 효과

 1. 그림 Import 하기

①우선 움직임을 구현할 객체(예:자동차)를 구합니다.

②File-Import를 활용하여 객체를 삽입합니다.

③Insert-Image를 이용해서 삽입할 수도 있습니다.

  2. Move 효과 지정하기

①삽입한 그림을 선택합니다.

②Add Effect에서 Move를 선택합니다.

③등장하는 Move Setting 창에서 X 축으로 이동하도록    설정합니다.

④X축으로 550픽셀(무비의 가로크기가 700인 것을 감안)    이동하도록 합니다.

  3. X와 Y축으로 동시 이동

①툴박스의 라인 도구를 선택합니다.

②라인을 경사지게 그립니다.

③Transform 패널을 엽니다.

④자동차를 선택하고 -10도 회전합니다.

⑤자동차를 선택하고 마지막 위치로 이동시켜보면      Transform 패널에 X축 및 Y축 좌표 값을 확인할     수 있습니다. 변경한 위치로 움직임은 구현됩니다.

  이와 같이, Move는 단순효과로서 텍스트 및 이미지 객체를 X 및 Y축 좌표 값만큼 직선 이동하는 움직임을 구현하는 효과를 가집니다.

제 3단계

 1. 직선 움직임

①Motion Path를 지정할 객체(예:비행기)를 웹이나 클립으    로 구합니다.

②File-Import나 Insert-Image를 이용하여 스테이지에 객체    를 삽입합니다.

③Toolbox의 Motion Path를 선택하고, 스테이지의 객체를    끝 위치로 드래그하면 간단하게 직선 움직임을 구현할     수 있습니다.

2. 곡선 움직임

①앞의 과정의 2번 과정과는 동일한 작업으로 진행합니다.

②Motion Path를 선택하여 움직이되, 드래그를 여러 번    작업하여 원하는 곡선의 모양이 되도록 합니다. 작업     을 취소하기 위해서는 Edit-Undo를 하거나 Ctrl+Z를     눌러서 되돌리기 합니다.

 3. 움직임 경로와 설정

①지정한 움직임의 속성을 변경하기 위해서는 타임라인    상에서 마우스 오른쪽 버튼을 누른 후 Properties를      선택하여 그림과 같은 속성 창을 엽니다.

②Orient to Path나 Alpha 값 등의 값을 지정하여 다양    한 움직임 효과를 구현해봅시다.

Orient to path 체크

Override angle settings 체크

Orient to path을 체크함

Orient to path을 체크 안함

♣ 실습과제 - 3	①앞서 제작한 비행기 작품을 Orient to path 옵션을 적용하여 다양한 움직임의 애니메이션 작품을 만들어봅시다.

제4강	강의제목	텍스트+이미지 애니메이션
	학습목표	이미지 배경 위에 텍스트 애니메이션을 구현할 수 있다.
	학습내용	▶ 이미지 배경처리 ▶ 배경 위에 움직이는 텍스트 ▶ 여러 포맷으로 파일 저장하기

제 1단계	이미지 배경처리

 최근 제작되는 웹페이지를 보면 스위시로 애니메이션 처리된 부분을 많이 볼 수 있습니다. 특히, 상단 배너와 같은 부분은 이미지에 텍스트를 가미하여 방문자에게 중요한 정보를 제공하는데, 이 시간에는 그러한 작품을 제작하는 방법을 알아보기로 합니다.

 1. 무비의 크기 설정

①무비패널을 열고 무비의 사이즈를 600*200으로    지정합니다.

②Frame Rate를 기본 값인 15로 설정합니다.

 2. 그림 편집하기

①인터넷을 통해서 배경으로 사용할 이미지를     구합니다.

②무비와 어울리게 편집하기 위해 그래픽 프로    그램(포토샵)을 실행하여 크기 및 이미지 편집    작업을 합니다.

  ③이미지의 크기는 무비의 전체 배경이 될 것이므로, 600*200의 크기로 조절합니다. 기타        제작자의 의도에 따라서 이미지를 꾸며봅니다.

 3. 무비의 배경으로 지정하기

①스위시를 실행하고 Outline 패널의  Insert -    Image를 선택하여 포토샵에서 편집된 그림    을 무비의 전체배경으로 지정합니다.

②무비의 전체 스테이지에 이미지가 잘 안배     되도록 조절합니다.

제 2단계	배경 위에 움직이는 텍스트

배경 위에 움직이는 텍스트를 구현하기 위해서 배경을 이미지로 지정하였습니다. 이제 텍스트를 이미지 위에서 움직이도록 만들어보고 그 위에서 이미지도 움직이는 작품을 제작하여 봅시다.

 1. 텍스트 삽입하기

①Insert-Text를 이용해서 “애니메    이션 제작과 활용”이란 텍스트를    입력합니다.

②글자의 속성을 지정합니다.

2. 애니메이션 효과 지정하기

①필요한 만큼의 텍스트를 삽입한 후에       Vortex, 3D Spin, Wave 등의 복합 효과    를 지정합니다.

②이미지 및 텍스트 등의 객체의 수만큼      레이어의 숫자도 증가하였음을 타임라인    을 통해 확인할 수 있습니다.

3. 배경 위에서 텍스트와 이미지 움직이기

①자료실에 제공된 배경이 투명한 이미     지 "비행기.Gif"를 삽입합니다.

②밖에서부터 등장하게 하기 위해서        Work Space가 보이도록 화면보기를      축소합니다.

  ③Motion Path를 지정하여 비행기가 곡선으로 움직이도록 구현합니다.

  ④제작 의도에 따라 다르겠지만 현재 무비에서는 처음부터 비행기가 등장하게 하기 위해서 비행기가 움직이는 타임라인을 선택해서 1번 프레임으로 위치 이동하여 글자와 함께 실행되도록 설정해봅시다.

제 3단계	여러 포맷으로 파일 저장

 스위시에서 파일을 저장하는 방법은 여러 가지가 있습니다. 소스파일로 저장해서 작품 원본을 만들고 추후에 수정보완이 가능하게 하기 위해서는 Swi확장자를 가진 작업(소스)파일로 저장해야 하며, 홈페이지나 플래시 무비로 제작하기 위해서는 Swf 파일로 Export합니다. Avi 동영상 파일로 제작할 수 있으며, 웹페이지 형식의 Html 파일로 출판할 수도 있습니다. 각각의 방법을 알아보기로 합니다.

1. 소스파일(Swi)로 저장하기

①File-Save를 클릭합니다.

②저장을 원하는 폴더를 선택하고 파일 이름을 부여합    니다.(예: 텍스트무비)

③저장을 하면 Swi(예:텍스트무비.Swi) 확장자를 가지며,    작업이 완료된 후에도 스위시에서 이 파일을 불러 수    정하고 보완할 수 있습니다.

 2. 무비파일로 저장하기

①홈페이지를 만든다거나, 파워포인트에서 활용할     무비를 만든다거나, 단독 모듈형식의 무비를 제작    하는 경우에 활용하는 방법으로 File-Export-Swf    를 선택합니다.

②이러한 방법으로 Export하면 Swf확장자를 가지     며, 플래시에서 제작한 무비와 같이 웹이나 기타    모든 프로그램에서 사용할 수 있게됩니다.

   스위시와 플래시

스위시에서 제작된 소스파일 Swi 은 플래시에서 불러서 활용할 수 없으며, 무비파일로 Export 된 Swf 파일은 플래시에서 다양한 방법으로 활용 가능합니다.

 3. Html 파일 및 동영상 파일로 저장하기

  ①그밖에도 위와 같은 방법으로 Avi 포맷을 가진 동영상으로 제작할 수 있습니다. 그러나 간단한 움직임을 포함한 무비는 Avi 포맷으로 저장해도 실행에는 지장 없으나, 추후에 다루어지는 액션이 포함된 경우에는 액션이 구현되지 않는다는 단점이 있습니다.

  ②웹 형식의 Html 파일로 저장할 수 있습니다. Html 파일은 웹 에디터를 사용해서 하나의 홈페이지로 제작할 수 있습니다. 하지만 해당 Swf 파일과 동일한 폴더에 저장되어야 하고, 함께 서버에 출판되어야 한다는 전제를 포함합니다. 

   꼭 알아둡시다.

①스위시에서 제작할 수 있는 파일의 포맷은 다음과 같습니다.

  -Swi(소스파일), Swf(무비파일), html(웹페이지), avi(동영상)

  ②Avi 포맷은 액션이 포함된 경우에는 액션이 구현되지 않는다는 단점이 있습니다.

  ③Swi 포맷은 소스파일로서 작업을 마친 후에도 불러서 수정 보완할 수 있는 스위시 작업파일 형식입니다.

♣ 실습과제 - 4	①앞서 작업한 무비를 위의 4가지 포맷으로 저장해보세요. ②저장된 폴더로 이동하여 각 각의 파일 크기와 특징을 비교해보세요. ③Swi 포맷을 가진 파일을 스위시에서 불러와서 수정해보세요.

제5강	강의제목	버튼 만들기
	학습목표	상호작용을 부여할 버튼을 만들 수 있다.
	학습내용	▶ Insert Button으로 버튼 만들기 ▶ 객체를 버튼으로 지정하기 ▶ Export패널과 Export 툴바의 효율적인 활용

 버튼을 만드는 방법에는 두 가지가 있습니다.  Insert Toolbar의 Insert Button을 클릭 하여 만드는 방법과 오브젝트를 Convert to button 메뉴를 이용하여 버튼화 시키는 방법입니다.

제 1단계	Insert Button

 ①Insert Toolbar에서 Insert Button을 클릭     합니다. [Outline] 패널에서 버튼의 4가지     목록이 나타나고 작업공간에 버튼 이미지     가 생기는 것을 확인합니다.

   ②[Outline] 패널의 Up State를 선택하고 Insert   Text를 클릭하여 그림과 같이 ‘Next'라는 텍스트를 입력합니다. 문자의 색상을 흰색으로 설정합니다.

③Over State를 선택하고 ‘Next' 문자를 입    력한 다음 문자의 색상을 빨간색으로 설    정합니다. 다시 Down State를 선택하고     ’Next'문자를 입력한 다음 문자의 색상       을 노란색으로 설정합니다.

   ④마우스 반응영역 설정으로 [Outline] 패널에서 Hit State의 Hit Rectangle를 선택하고 작업공간에서 입력한 문자보다 좀 더 크게 확대하도록 합니다.

   마우스 이벤트

 마우스는 다음과 같은 4가지 이벤트를 가집니다.

 Up:일반적으로 등장하는 모습          Over:마우스가 올라간 상태

 Down:마우스로 클릭한 상태            Hit:버튼이 작동하는 영역

제 2단계	Convert to Button

 

①[Toolbox]의 사각형 툴을 선택하고 작업공간   하단에 그림과 같이 조그만 직사각형을 그립니  다. Insert Text를 클릭하여 ‘Replay'라는 문자  를 입력하고 직사각형 위에 위치시키도록 합니다.

②텍스트와 직사각형을 마우스 왼쪽 버튼으로    드래그 하여 함께 선택합니다. Modify 메뉴에서 차례대로 [Grouping> Group]를 선택하여 그룹으로 만들도록 합니다.

③그룹으로 만든 오브젝트를 버튼화 시키도록 합니다. Modify메뉴에서 차례로[Convert>    -Convert to Button]을 선택합니다.

 ④[Outline] 패널에서 Over State의 Rectangle을 선택하고 사각형의 색상을 노란색으로 바꾸어 줍니다. 동일한 방법으로 Down State의 Rectangle을 선택하고 사각형을 색상을 빨간색으로 바꾸어 롤 오버 버튼을 만들도록 합니다.

 ⑤버튼에 Action을 설정하도록 합니다. 작업공간의 ‘Replay'버튼을 마우스 오른쪽 버튼으로 선택하고 차례대로 ’Goto Frame'을 선택합니다.

 ⑥그림과 같이 [Action] 패널의 ‘Goto Frame 0 of Scene 1' 부분에서 Frame Number를 0으로 입력하여 버튼을 클릭하면 0번째 프레임부터 다시 애니메이션이 진행되도록 설정합니다.

제 3단계	Export패널과 Export 툴바

 [Export] 패널은 Panels 메뉴에서 Export를 선택하면 나타나게 됩니다.

 [Export] 패널에서는 SWF 및 HTML, Movie, Scene, Object, AVI의 각각의 Export 옵션을 설정할 수 있습니다.

   꼭 알아둡시다.

①마우스는  Up, Over, Down, Hit의 4가지 이벤트를 갖습니다.

  ②버튼을 만드는 방법은 Insert-Button으로 하는 방법과, 객체를 선택하고 Convert to Button으로 객체의 속성을 변환시키는 방법이 있습니다.

  ③[Export] 패널에서는 SWF 및 HTML, Movie, Scene, Object, AVI의 각각의 Export 옵션을 설정할 수 있습니다.

♣ 실습과제 - 5	①Insert-Button을 이용하여 원 모양의 버튼을 만들어보세요. ②드로잉 도구를 이용하여 원을 그리고, 그려진 원을 Convert  to Button을 이용하여 버튼으로 변환시켜보세요.

제6강	강의제목	스프라이트 만들기
	학습목표	움직이는 스프라이트를 만들 수 있다.
	학습내용	▶ 스프라이트란? ▶ 스프라이트 만들기(눈동자) ▶ 스프라이트 활용하기(바퀴가 움직이는 자동차)

제 1단계	스프라이트란?

1. Sprite 란?

  여러 개의 객체를 하나의 객체로 표현하는 플래시에서의 심볼과 유사한 객체로서 타임라인 상에서 움직임을 주지 않아도 스스로 움직임을 갖는 무비클립과 같은 개념의 객체입니다.

2. Sprite 삽입하기

①Insert - Sprite를 선택합니다.

②스프라이트가 삽입되면서 타임라인과 스테이지,     패널이 스프라이트 편집모드로 변하게됩니다.

③현재 작업하는 스프라이트는 무비처럼 움직임을    지정할 수 있으며, 움직이는 객체를 하나의 무비    클립처럼 사용할 수 있습니다.

 3. Sprite 원리 알아보기

①원을 그림과 같이 그립니다.

②움직이는 원으로 만들기 위해 Motion Path를 지정합니다.

③상단의 [Scene]를 클릭하면 스프라이트 편집모드에서 무    비 편집모드로 다시 돌아갑니다.

④우측의 스프라이트 패널에서 이름을 “원”이라고     지정합니다.

⑤[미리 보기]버튼을 눌러서 무비를 미리 봅니다.

⑥현재 제작되고있는 무비가 하나의 프레임으로 되    어 있지만 계속해서 원이 움직이는 효과를 확인할    수 있습니다.

제 2단계	스프라이트 만들기(눈동자)

 1. 하나의 눈동자 그리기

①툴박스의 Eclipse 아이콘을 누릅니다.

②면 색은 “None"으로 지정합니다.

③선 색은 검은색, 굵기를 5포인트로 지정합니다.

④스테이지에 원을 그립니다.

⑤Shape 이름을 “눈”이라 지정합니다.

2. 눈동자를 움직이게 하기

①면 색을 검은색으로 지정하고 다시 눈동자를 그    립니다.

②눈동자를 선택하고 Motion Path를 지정하여 원     운동을 하도록 합니다.

③Shape 이름을 눈동자란 이름으로 지정합니다.

 3. 눈동자를 두 개로 만들기

①앞에서 제작된 스프라이트를 “눈1”이란 이름으로    지정하고 복사합니다.

②스테이지에 Paste Object로 붙여 넣고 “눈2”란 이    름으로 지정합니다.

③원형도구를 클릭하고 면 색을 살색으로 지정합니다.

④원을 드로잉하고 레이어의 순서를 지정하여 얼굴    보다 눈 레이어가 상단에 위치하도록 조정합니다.

⑤미리 보기를 클릭하여 완성된 작품을 감상합니다.

   레이어 순서

레이어 중에서 가장 상단에 위치한 레이어가 화면의 가장 위에 등장하므로 레이어의 순서를 조절하면 다양한 효과를 구현할 수 있습니다.

제 3단계	스프라이트 활용하기

1. 자동차 바퀴 만들기

①스테이지에 제공된 [자동차.Jpg] 파일을 Import 합    니다.

②라인 도구를 이용해서 선을 그려서 길 위에 자동    차가 있는 모습으로 구현합니다.

2. 바퀴가 움직이는 자동차 만들기

①Motion Path를 이용해서 위의 자동차를 움직일      수 있으나, 바퀴까지 회전하는 모습을 구현하기      위해 회전하는 바퀴 스프라이트를 만듭니다.

②원형 도구와 라인을 이용해서 바퀴를 드로잉하고    완성된 것을 Group 지정합니다. Group as Sprite    나 Shape로 하지 않고 일반적인 Group으로 지정    합니다.

 ③그룹으로 만들어진 바퀴는 Move 효과를 지정하     되, X축이나 Y축으로 정지한 상태에서 회전하는     효과이므로 마지막 객체의 각도만 변화를 줍니다.

 ④Stage의 바퀴가 움직이는 자동차 스프라이트를       선택하고 Add Effect의 Move 효과를 지정합니다.

 ⑤X축으로 700픽셀 정도 이동시켜봅니다.

 ⑥미리 보기 하면 바퀴가 움직이는 자동차가 자연스럽게 구현될 것입니다.

   꼭 알아둡시다.

①스프라이트는 여러 개의 객체를 하나의 객체로 표현하는 것으로서 타임라인 상에서 움직임을 주지 않아도 스스로 움직임을 갖는 무비클립과 같은 개념의 객체입니다.

♣ 실습과제 - 6	①더욱 현실감 있는 움직임을 구현하기 위해서 자동차 가스가 배출되는 장면의 스프라이트를 만들고, 자동차와 함께 Group as Sprite로 지정하여 더욱 재미있는 작품을 만들어 보세요.

제7강	강의제목	사운드(Sound) 활용
	학습목표	스위시에서 사운드 효과를 구현할 수 있다.
	학습내용	▶ 프레임 사운드 ▶ 버튼 사운드 ▶ 사운드 제어하기

제 1단계	프레임 사운드

1. 배경 음악을 삽입하기

①무비에 배경음악을 삽입하기 위     해서는 [Timeline] 패널에서         ‘Scene1' 레이어 0번 프레임에서,    [Play Sound]를 선택합니다.

②다른 방법으로 Add Effect에서      Play Sound를 선택해서 삽입할     수 있습니다.

  ③[Actions] 패널의 ‘Play Sound' 부분에서 [Import]를 클릭하고, 삽입할 사운드를 선택합니다. 사운드는 Mp3나 Wav 등의 포맷을 삽입할 수 있습니다. 큰 용량의 Wav 포맷도 저장 시에 Mp3로 변환되어 작은 용량으로 무비를 제작할 수 있다는 장점이 있습니다.

  ④[Action] 패널에서 [Option]을 클릭하고, [Play Option for "chewable.wav"] 대화상자에서 아래 그림과 같이 설정하여 [OK] 버튼을 클릭합니다.

  ⑤사운드 옵션에서 볼륨조절 및 사운드의 반복설정과 각종 효과를 지정할 수 있습니다.

제 2단계	버튼 사운드

 버튼에 사운드를 삽입하는 방법엔 Roll over, Release, Press 등의 각각의 상태에 서로 다른 사운드를 지정할 수 있습니다. 여기에서는 버튼 위에 마우스가 올라간 상태에서 소리가 실행되도록 제작하여봅시다.

1. 버튼 만들기

①사각형 도구로 스테이지에 드로잉 합니다.

②사각형에 텍스트를 입력합니다.

③두 개의 객체를 동시 선택하여 그룹으로 지정합니다.

④그룹화된 객체를 버튼으로 Convert 합니다.

2. Over State에 사운드 삽입하기

①버튼을 클릭하고 오른쪽 액    션 패널을 엽니다.

②Add Event를 눌러 마우스     이벤트를 지정합니다.

  여기에서는 마우스가 올라간 상태이므로 On Roll Over로 지정하도록 합니다.

  ③Add Action을 클릭하여 Play Sound를 선택합니다.

  ④하단의 사운드 패널에서 Import를 클릭하여 필요한 사운드를 엽니다.

3. 버튼 사운드 확인하기

①제작되고있는 무비를 실제 무비 재생기에서    처럼 확인하기 위해서는 File-Test-In Player    로 재생할 수 있습니다.

②플래시 플레이어가 실행되면서 마우스 이벤    트에 의해서 사운드가 재생되는 모습을 확    인할 수 있습니다.

제 3단계	사운드 제어하기

1. 프레임에 사운드 삽입하기

①그림과 같이 1번 프레임을 선택하고 마우스     오른쪽 버튼을 누릅니다.

②배경음악을 삽입하듯 0번 프레임에서 Play      Sound 액션을 지정합니다.

2. 사운드 제어버튼 만들기

①화면요소를 그림과 같이 배치하고 음재      생과 음소거 글자를 버튼으로 변환합니다.

3. 사운드 제어하기

①[음재생] 버튼을 선택한 후 마우스 이벤트를 On     Release로 선택하고 Play Sound 액션을 지정하여    원하는 배경음악을 재생하도록 지정합니다.

②위와 같은 방법으로 [음소거]버튼을 선택해서 원하    는 마우스 이벤트를 설정합니다. On Release 이외    에도 On Press나 On Rollover도 실습해봅시다.

③ [음소거] 버튼에는 Stop All Sound 액션을 지정    하여 모든 음악이 소거되도록 합니다. 특정한 소    리를 멈추게 하기 위해서는 Stop Sound액션을지    정하고 음소거를 원하는 소리를 지정합니다.

   꼭 알아둡시다.

①무비에 배경음악을 삽입하기 위해서는 [Timeline] 패널에서 0번 프레임에서, [Play Sound]를 선택합니다.

②Add Effect에서 Play Sound를 선택해서 배경음악을 삽입할 수도 있습니다.

③버튼에 사운드를 삽입하는 방법엔 Roll over, Release, Press 등의 각각의 상태에 서로 다른 사운드를 지정할 수 있습니다.

④음소거를 하는 방법에는 Stop All Sound 액션을 지정하여 모든 음악이 소거되도록 할 수 있습니다.  모든 소리가 아닌 특정한 소리를 멈추게 하기 위해서는 Stop Sound액션을 지정하여 음소거를 원하는 소리를 지정합니다.

♣ 실습과제 - 7	①버튼을 누르면 자신이 녹음한 소리가 나오는 작품을 만들어 보세요.(자신의 목소리는 녹음하는 방법은 앞서 GoldWave 과정에서 배우셨지요?)

제8강	강의제목	액션 시작하기
	학습목표	액션의 기본 원리를 이해하고 간단한 액션을 구현할 수 있다.
	학습내용	▶ 액션이란? ▶ Stop, Play 액션 ▶ Goto 액션

제 1단계	액션이란?

  스위시에서 액션은 플래시에서와 마찬가지로 다양한 상호작용과 효과를 줄 수 있는 기능을 가진 명령 스크립트라 볼 수 있습니다. 스위시에서는 플래시에서의 액션 중 활용 빈도가 높은 액션을 제공해준다 볼 수 있는데, 각 각의 액션에 대해서 대략적으로 알아보기로 합시다.

①Set Label-특정한 프레임에 이름표(Label)를 붙여서 버튼객체를      누르면 해당하는 이름의 프레임으로 이동하게 하는 기능을 구현    할 수 있습니다.

②Play, Stop, Goto Frame- 재생 및 정지, 특정한 프레임으로 이동    하게 하는 액션을 구현합니다.

③If Frame Loaded-Pre Loader를 만들어서 웹 상에서 방문자가 무    비의 로딩을 기다리는 시간동안 정보를 제공할 수 있는 기능을      제공합니다.

④Tell Target-제작하는 무비에 포함된 특정 스프라이트를 불러오는    기능으로서, Tell Target 액션을 사용하면 다양한 상호작용 및 효    과를 구현할 수 있습니다.

  ⑤Transform- 객체를 변형하는 액션을 부여합니다.

  ⑥Load, Unload Movie- Tell Target과는 달리 제작하는 무비 속에 포함된 무비가 아닌 다른 무비를 불러와 보여주는 기능을 가집니다.

  ⑦Play, Stop, Stop All Sound- 사운드를 재생, 정지, 모든 소리의 음소거 등의 기능을 가집니다.

  ⑧Goto Url- 온라인상의 웹페이지나 오프라인 상의 Html 파일을 불러오는 기능을 가집니다.

  ⑨Fs Command- 무비를 제어하는 기능을 가지며, 풀화면 재생이나 화면종료하기 등의 기능을 가집니다. Fs Command 는 인터넷 웹브라우저에서 구현이 되는 것이 아니라 플래시 플레이어에서 구현됩니다.

  ⑩Java Script- 웹 브라우저에서 실행되는 자바스크립트를 삽입하여 기능을 구현할 수 있습니다. 이는 반드시 Html 형식으로 지정되어야합니다.

  ⑪Mailto- E-Mail 주소를 가진 사람에게 메일을 보낼 수 있는 프로그램(Outlook Express 등)을 열어서 메일을 발송할 수 있게 해주는 액션입니다.

제 2단계	Stop, Play 액션

 1. 움직이는 자동차 만들기

①앞의 과정에서 있었던 것과 비슷한 과정으로 자동    차를 Import하고 Motion Path를 지정하여 자동차    를 직선운동 시킵니다.

②움직임을 조정하는 버튼을 간단하게 만들기 위해     “재생”,“정지” 텍스트를 삽입합니다.

2. 텍스트를 버튼으로 지정

①“재생”, “정지” 텍스트 객체를 선택하고 마우스 오    른쪽 버튼으로 Convert- Convert to Button 으로      지정합니다.

②액션은 버튼 객체에서만 작동하므로 반드시 버튼     으로 지정해야합니다.

   프레임 액션과 버튼 액션

*모든 액션은 프레임 액션과 버튼 액션을 구분됩니다. 프레임 액션(프레임 속에 포함된 액션)은 버튼이 아니라도 작동할 수 있습니다. 기타 객체에 액션을 부여하기 위해서는 반드시 그 객체는 버튼의 속성을 가져야 합니다.

3. Stop Play 액션 지정하기

①[재생] 버튼에 Add Event에서 On Release를      선택하고, Add Action에서 Play를 지정합니다.

②[정지]버튼엔 마찬가지로 마우스 이벤트를 지    정하고 Add Action에서 Stop를 지정합니다.

③그러나 첫 프레임에서 정지 명령을 주지 않으면 사용자의 명령에 관계없이 자동 실행 될 것입니다. 따라서 0번째 프레임을 선택한 후 액션패널에서 “Stop"액션을 지정합니다.

 ④File-Test-Test In Player 하게되면 완성된

   작품을 감상할 수 있습니다.

제 3단계	Goto 액션

 Goto 액션에는 Frame으로 이동하는 Goto Frame 액션과 특정한 Label이 붙은 곳으로 이동하는 Goto Label 액션으로 크게 나눌 수 있습니다. 여기에서는 특정한 프레임으로 이동하는 Goto Frame 액션으로 비행기와 자동차의 움직임을 구현해보겠습니다.

1. 제작할 작품의 화면요소 배치

①제작을 용이하게 하기 위해서 우선 각 요소들    을 화면에 적절하게 배치합니다.

②상단은 사각형 툴과 텍스트로 메뉴 바를 구성    하고 하단엔 객체들의 움직임 공간이 됩니다.

③그림과 같이 비행기와 자동차를 Import 합니다.

2. 객체들의 속성 및 움직임 구성

①“비행기”와 “자동차” 텍스트는 버튼으로 속    성을 지정합니다.

②하단의 비행기는 자유곡선으로 움직이도록     Motion Path를 지정합니다.

③자동차는 직선운동을 하도록 지정합니다.

*타임라인 패널의 비행기 움직임 프레임과 자동차 움직임 프레임이 우측의 그림과 같이 되도록 조절해야 한다. 비행기 레이어의 28번째 프레임에 Remove 액션 지정함

3. Goto Frame 액션 지정

①0번, 28번, 54번 프레임에 각 각 Stop 액션을 지정    하여 명령을 기다리도록 합니다.

②[비행기]버튼은 Goto Frame "1", [자동차]버튼은      Goto Frame “28”로 지정합니다.

③[미리 보기]로 작품을 감상합니다.

   꼭 알아둡시다.

①무비가 처음부터 실행되는 것이 아니라 어떠한 액션을 기다려야 하는 작품의 경우는 첫 번째 프레임에 Stop 액션을 지정하여 자동 실행되는 것을 제어할 수 있습니다.

②특정한 객체에 액션을 부여하기 위해서는 반드시 그 객체는 버튼의 속성을 가져야 합니다.

③Goto 액션에는 Frame으로 이동하는 Goto Frame 액션과 특정한 Label이 붙은 곳으로 이동하는 Goto Label 액션으로 크게 나눌 수 있습니다.

④Remove는 해당 레이어의 객체를 삭제하여 현재 프레임 이후에 보이지 않도록 설정하는 액션입니다.

♣ 실습과제 - 8	①위의 작품을 완성한 상태에서, 화면의 하단에 Stop, Play 버튼을 삽입하여 자동차와 비행기의 움직임을 제어할 수 있는 작품을 만들어보세요. Stop Play 액션 및 Goto 액션을 실습하고 복습할 수 있는 좋은 기회가 될 것입니다.

제9강	강의제목	레이블(Label)액션
	학습목표	레이블 액션을 이용하여 OX 퀴즈를 만들 수 있다.
	학습내용	▶ 레이블(Label)액션이란? ▶ O, X 문제 만들기

제 1단계	레이블(Label)액션이란?

 앞에서 실습한 Goto Frame 액션은 특정한 프레임의 번호를 지정하여 이동하게 하는 액션이었다면, Goto Label 액션은 임의의 프레임에 이름표는 부여하여 그 프레임으로 이동하는 형식을 취합니다. 두 액션의 원리는 비슷하지만 Label 액션은 큰 무비의 경우에 보다 편리하게 활용할 수 있다는 장점을 가집니다.

1. Label 지정하기

①앞에서 실습한 파일을 다시 엽니다.

②1번과 28번 프레임에 이름표를 지정하기       위해서 프레임을 선택하고 마우스 오른쪽      버튼을 눌러 Set Label을 선택합니다.

③1번은 “비행기”란 이름표, 28번은 “자동       차”란 이름표를 부여합니다.

2. Label 액션 구현하기

①현재 [비행기]버튼의 속성은 Goto Frame      Number “1”로 지정되어있는 상황입니다.

②[비행기]버튼을 선택하고 Goto 부분에서       Goto Label로 속성을 변경합니다.

③현재 부여된 Label은 비행기와 자동차 2개이    므로 풀다운 버튼에서 2개가 등장할 것입니    다. [비행기]는 “비행기‘로, [자동차]는 ”자동    차“로 레이블 지정하도록 합니다.

 3. 레이블 액션 확인하기

   제작한 레이블 액션 작품을 확인하면 앞서 제작한 Goto Frame 액션과 별 차이가 없게 느껴집니다. 하지만 작품의 크기가 커서 프레임 수를 일일이 계산하기 어려운 경우에는 효과적으로 활용할 수 있는 액션이라 할 수 있습니다.

제 2단계	OX문제 만들기

1. 작품의 배경과 문항 만들기

①무비의 크기는 800*600으로 지정하고 상단과 하단에는 사각형    툴로 네모 상자를 만듭니다.

②OX 퀴즈가 될 문항을 텍스트 도구를 이용하여 글자를 입력합    니다.

 2. 버튼객체 삽입

①원형 도구를 이용해서 O와 X버튼을 각각 삽입합     니다.

②작업을 쉽게 하기 위해서 드로잉 객체와 텍스트를    그룹화하고 이를 버튼으로 지정한 후에 복사해서    붙여 넣기 합니다.

3. 정답화면과 오답화면 제작

①레이블을 지정해서 분지하기 위해서는 정답    과 오답 각각의 화면이 있어야 합니다.

②각각의 화면을 Insert Text로 간단히 제작하     되, 문항과 버튼의 레이어는 1번과 2번 프레    임에서는 보이지 않도록 Remove 액션을 지    정하고, 정답 화면과 오답화면은 각각 1번과    2번 프레임에 Place액션을 지정해서 위치를     이동시킵니다.

   Place 와 Remove

 Place는 해당 레이어의 객체를 특정한 프레임으로 위치를 이동시켜 이전 프레임에서는 보이지 않도록 설정하는 액션이며, Remove는 해당 레이어의 객체를 삭제하여 현재 프레임 이후에 보이지 않도록 설정하는 액션입니다. Place 및 Remove를 활용하여 객체들의 등장 시점을 조절함으로써 다양한 효과를 구현할 수 있습니다.

  4. 레이블 지정하기

①15번 프레임은 “정답”, 20번 프레임은 “오답”     으로 레이블을 지정합니다.

②각 레이블의 지정은 타임라인의 최 상단에 위     치한 레이어에 지정하는 것이 가장 바람직합      니다.

  5. 버튼에 액션 부여하기

①1번 프레임에 헤드를 이동시키고 [O]버튼과 [X]버    튼에 각각의 Label 액션을 지정합니다.

②[O]버튼은 “정답”, [X]버튼은 “오답”으로 진행하도    록 설정하고 옵션 패널의 우측하단에 “Play"부분    을 선택 해제하여 해당 프레임으로 이동한 후에     진행되지 않고 다음 명령을 기다릴 수 있도록 지    정합니다.

  6. OX퀴즈의 최종 완성

①퀴즈를 미리 보기하면 실행이 잘 되지만, 정답이    나 오답 피드백 화면에서 다시 문제 화면으로     돌아올 수 없다는 문제점을 발견할 수 있습니다.

②그림과 같이 [뒤로]라는 버튼을 삽입하여 문제를    해결할 후에는 다시 문항이 있는 프레임(1번)으    로 이동할 수 있는 Goto Frame 액션을 지정합    니다.

 ③[뒤로]라는 버튼이 하나의 레이어 상에 있기 때문에 정답 및 오답화면에 두 번 삽입할 필요는 없습니다. 그러나 1번째 프레임에도 [뒤로]라는 버튼이 보이기 때문에 버튼이 필요한 15번째 프레임 정도에 Place 액션을 지정해서 옮겨둘 필요가 있습니다. 

 ④작품을 OX퀴즈란 이름으로

   저장하고, OX퀴즈.swf로 Export한 후에, 문제와 답이 원활하     게 작동하는지 살펴봅니다.

   꼭 알아둡시다.

①Goto Frame 액션은 특정한 프레임의 번호를 지정하여 이동하게 하는 액션이며, Goto Label 액션은 임의의 프레임에 이름표는 부여하여 그 프레임으로 이동하는 액션이라는 차이점이 있습니다.

②큰 무비의 경우 Label 액션이 Goto Frame 액션보다 편리하게 활용할 수 있다는 장점을 가집니다.

③Place는 해당 레이어의 객체를 특정한 프레임으로 위치를 이동시켜 이전 프레임에서는 보이지 않도록 설정하는 액션입니다.

♣ 실습과제 - 9	①위의 OX퀴즈 작품을 완성하고 [정답]과 [오답]화면에 등장하면 해당 화면에 어울리는 피드백 소리가 나올 수 있도록 작품을 제작하여 보세요. 사운드 효과를 삽입함으로서 보다 신선한 작품이 될 것입니다.

제10강	강의제목	Tell Target
	학습목표	Tell Target을 이용해서 교수-학습자료를 제작할 수 있다.
	학습내용	▶ Tell Target 이란? ▶ Tell Target으로 교수-학습 자료 만들기

제 1단계	Tell Target 이란?

 1. Tell Target 액션은?

  Goto Frame 액션이나 Goto Label 액션처럼 Scene 상의 어떤 특정한 프레임으로 이동하는 액션이 아닌, 특정한 스프라이트(무비클립)를 불러와서 화면상에 출력하게 하는 액션이라 볼 수 있습니다. Tell Target 액션을 활용하면 좀더 다양한 방식의 분지와 상호작용을 구현할 수 있으며 특히, 여러 개의 스프라이트를 Stage에 불러놓은 상태에서 선택되어지는 것들만 실행하게 하는 방식으로 무비를 제작할 수 있습니다. 

2. Tell Target 액션의 원리

①먼저 화면요소를 그림과 같이 배치하고, 축구공과 농구공    글자의 속성은 버튼으로 전환합니다.

②움직이는 축구공과 농구공 스프라이트를 각각 제작하고     “0”번째 프레임과 마지막 프레임엔 Stop 액션을 지정하여    자동실행 및 반복실행이 되지 않도록 설정합니다. 특히      “0”번째 프레임엔 화면 요소가 보이지 않게 설정하는 것    이 Tell Target의 일반적인 활용의 예라 하겠습니다.

③각각의 스프라이트 “0"번째 프레임의 객체를      ”1“번째 프레임으로 옮기기 위해서 Place를 지    정합니다.

④만들어진 스프라이트의 이름을 지정해주어야      합니다. 지정된 이름은 Tell Target 액션을 사     용할 때 불러올 대상으로 인식하게 됩니다.

   Tell Target을 활용할 때 유의할 점

 Tell Target 액션은 특정 스프라이트를 불러와서 활용하는 액션으로서, 화면상에 출력할 스프라이트를 제작하되 스프라이트의 첫 모습인 “0”번째 프레임은 빈 화면이 되어야 합니다. 따라서 “0”번째에 있는 객체를 “1”번째 프레임으로 Place해줍니다.

 3. Tell Target 지정하기

①축구공, 농구공 각 각의 버튼을 선택하고 왼쪽의      그림처럼 On Release 이벤트에 Tell Target 액션      을 지정합니다. 해당 버튼에 해당 스프라이트를       연결하면 되겠습니다.

②다음은 타겟의 몇 번째 프레임으로 이동하라는 명    령을 지정하는데, Goto Frame 액션의 추가로 지      정할 수 있습니다.

③Frame Number는 “1”로 지정하고 하단의 Play 옵    션을 선택합니다.

 ④플레이어로 미리 보면 실행이 잘 되지만, 축구공 다음에 농구공을 선택하면 앞서 보여졌던 축구공의 마지막 모습이 남아있을 것입니다. 이러한 경우를 대비하여 Tell Target 액션을 한번 더 지정하여 보이지 않는 모습으로 전환해야합니다. 위 그림에서는 농구공을 선택했을 때 농구공 스프라이트의 “1”번째 프레임으로 이동하고, 동시에 축구공 스프라이트 “0”번째 프레임으로 이동하여 보이지 않게 하는 액션을 지정하였습니다. 

제 2단계	Tell Target 활용

 Tell Target을 이용하여 컴퓨터 주변기기에 대한 간단한 교수-학습 자료를 제작하여봅시다.

1. 화면 요소 배치

①제작할 무비에 요구되는 화면요소를 그림과 같이      사각형 도구와 텍스트 입력을 통해 제작합니다.       “마우스”“키보드”텍스트는 Tell Target 액션을 지정    할 버튼으로 속성을 지정합니다.

 2. 스프라이트 제작

  ①키보드와 마우스에 해당되는 화면자료를 각 각의 스프라이트로 제작합니다.

  ②이미지와 텍스트를 삽입하여 요소를 제작하고 적당한 애니메이션 효과를 지정합니다.

③스프라이트의 첫 번째 프레임(0번)에서 빈 화면으    로 보여지게 하기 위해 Place 액션을 추가하여 1    번째 프레임으로 객체를 옮겨봅니다.

④스프라이트가 자동 실행되거나 반복 실행되는 것    을 막기 위해 Stop 액션을 지정합니다.

  3. 작품 완성

①Scene로 돌아와서 이제 버튼과 스프라이트를     Tell Target 액션으로 구조화 시켜야하겠습니다.

②[마우스]버튼을 선택하고 좌측의 그림에서 보여    지는 액션스크립트처럼 액션을 지정합니다.

③[키보드]버튼을 선택해서 마찬가지로 좌측의 그    림과 같은 액션을 추가합니다.

④여기에서 주의할 점은 선택된 스프라이트가 실    행되는 것보다, 이전에 실행된 스프라이트를      어떻게 화면에서 제거하는가 하는 문제입니다.

⑤위의 그림과 같이 다른 스프라이트의 “0”번째    프레임으로 동시 이동하여 모습을 감출 수 있    도록 합니다.

  4. 작품 감상

①작품을 저장하고 File-Test In Player로 실행시켜봅니다.

②문제점이 발생되면 액션 스크립트를 다시 확인하고 수정    보완합니다.

③가장 잦은 오류사항이라면 전에 보여진 스프라이트가 사    라지지 않는 경우일 것입니다. 3-④⑤번이 잘 지정되었는    지 확인해보세요.

   꼭 알아둡시다.

①Tell Target 액션은 특정한 스프라이트(무비클립)를 불러와서 화면상에 출력하게 하는 액션이라 볼 수 있습니다.

②Tell Target 액션을 활용하면 좀더 다양한 방식의 분지와 상호작용을 구현할 수 있으며 특히, 여러 개의 스프라이트를 Stage에 불러놓은 상태에서 선택되어지는 것들만 실행하게 하는 방식으로 무비를 제작할 수 있습니다.

③Tell Target 액션은 특정 스프라이트를 불러와서 활용하는 액션으로서, 스프라이트의 첫 모습인 “0”번째 프레임은 빈 화면이 되어야 합니다.

♣ 실습과제 - 10	①위의 교수-학습 자료를 완성하여 저장하고, 마우스와 키보드의 스프라이트를 보다 역동적으로 제작하기 위해서 글자 부분에 다양한 Effect를 지정해보세요. 스프라이트에 간단한 음향효과를 지정해도 보다 훌륭한 작품이 될 것입니다.

제11강	강의제목	Load Movie
	학습목표	Load Movie를 이용해서 플래시 무비를 활용할 수 있다.
	학습내용	▶ Load Movie 란? ▶ Load Movie 활용하기

제 1단계	Load Movie 란?

 여기에서 말하는 Movie란 Swf 포맷을 가진 플래시 무비를 말하는 것으로서, Load Movie 액션을 활용해서 인터넷을 통하여 다운로드받은 무비, 기 제작된  플래시 무비, 스위시나 플래시를 이용해서 새롭게 만든 무비 등의 여러 무비를 Load Movie로 엮어서 하나의 큰 작품으로 연결할 수 있습니다.

 1. Swf 무비 다운로드

  ①배포를 목적으로 하는 플래시무비 제공 사이트에서 다운로드받을 수 있기도 하지만, 그림이나 Gif 애니메이션 파일과는 달리 Swf 플래시 무비는 웹 상에서 마우스 오른쪽 버튼으로 저장할 수 있는 기능을 제공하지 않습니다. 따라서 인터넷 익스플로러에서 제공하는 기능인 임시파일 속에서 무비를 다운받을 수 있습니다.

   플래시 무비(Swf)를 다운받는 방법

 다운로드 기능을 제공하지 않는 플래시 무비는 다음과 같은 과정으로 파일을 얻을 수 있습니다.

①익스플로러-도구-인터넷 옵션-인터넷 임시파일-삭제

②구하려는 무비가 있는 페이지를 열어서 무비를 실행

③익스플로러-두고-인터넷 옵션-설정-파일보기

위와 같이 하면 열어본 무비의 파일이 컴에 저장된 것을 확인할 수 있습니다.

 2. 무비 분석

  ①Load Movie의 기능을 활용하면 여러 모듈형식의 무비를 Stage 속에서 보여지게 할 수 있다는 장점이 있지만 무비의 크기가 다르게 되면 좌 상단의 좌표 값에서부터 제시가 되기 때문에 전체 작품의 인터페이스를 구성하는데 많은 어려움이 있습니다. 따라서 동일한 크기의 무비일수록 가장 적당하고 너무 크게 차이가 나는 작품들일 경우엔 적당하게 조직하는데 발생하는 문제점을 감수해야 할 것입니다.

 3. 무비 조직

  ①수집한 무비를 동일한 폴더에 저장하고 무비를 실행시키고자 하는 스테이지 레이아웃을 조직해야 할 것입니다.

②전체 레이아웃과 메뉴구성 등의 화    면을 구성하고 공간을 적절히 배치    해야 할 것입니다.

③제작하는 무비와 수집한 무비를 같    은 폴더에 위치하게 해야 정상적으    로 실행됩니다.

   무비의 이름지정

 Load Movie에서 위와 같이 무비의 이름이 한글로 지정된 상태에서는 정상적으로 실행되지 않는 경우가 발생되고 있습니다. 가급적이면 무비의 이름을 영문이나 숫자로 지정하도록 합니다.

제 2단계	Load Movie 활용하기

 1. 무비의 전체 레이아웃 설정

①수집한 무비의 크기를 분석하여 전체 무비의      크기를 결정하고 메뉴 바 및 메뉴, 무비들이      보여질 공간 등을 확보합니다.

②안내를 위해서 적절한 클립아트와 텍스트를 입    력합니다.

2. Load Movie 지정하기

①[자동차] 버튼을 선택하고 액션 탭에서 Load     Movie 액션을 추가합니다. Level은 보여질 화    면의 레이어를 뜻하는 것으로서 현재 작업은     0번 레이어이므로, 이 보다 상위인 “1”번으로       지정합니다.

  ③[OX퀴즈]버튼도 마찬가지로 Level 1의 위치에 Load Movie 되도록 지정합니다.

  ④[미리 보기] 하여 작품이 잘 실행되는지 확인합니다.

 3. 무비 완성하기

  제작된 무비를 동일한 폴더에 저장하고 미리 보기 합니다.

  ①무비를 실행하면 각 각의 요소들이 겹쳐지면서 보여질 것입니다. 이는 Load Movie 만 하였고, Unload Movie를 하지 않아서 무비끼리 겹쳐지는 현상이 발생하게 되는 것입니다. Unload Movie 액션을 사용해서 겹쳐지는 현상을 수정할 수 있습니다.

  ②본 작품의 경우 선행작업 되었던 안내문이 무비와 함께 보여지는 현상이 발생합니다. 다음과 같은 수정 작업을 해봅시다.

③타임라인에서 안내문에 해당되는 객체들을 1번    프레임으로 Place 액션을 지정하여 옮겨 놓습니    다.

④1번 프레임에 Stop액션을 추가하여 무비가 반    복되지 않고 1번 프레임에서 정지하도록 설정    합니다.

  ⑤[자동차]와 [OX퀴즈] 버튼에 Load Movie 액션과 함께 Goto Frame 액션을 추가합니다.

  ⑥각 각의 버튼에 Goto Frame Number "0"으로 지정하여 안내문이 보여지지 않는 프레임으로 이동시키고, 액션 패널의 우측 하단에 있는 "Play" 옵션을 체크하지 않아서 “0”번 프레임으로 이동한 후 정지하도록 설정합니다.

⑦[미리 보기] 하여 수정된 작품을 감상합니다.

⑧작품의 수정이 완료되면 저장하고, 이 작품은 다른         두개의 무비들을 포함한 작품입니다. 따라서

  car.swf와 quiz.swf 파일이 항상 함께 위치해야 한다는 점    에  유의해야합니다.

   꼭 알아둡시다.

①Load Movie를 활용하기 위해서는 수집한 무비를 동일한 폴더에 저장하고, 가급적 동일하거나 비슷한 크기의 무비가 알맞습니다.

♣ 실습과제 - 11	①동일한 크기의 무비를 두 개 만들고, 이를 제어하는 메뉴무비를 만들어서 작품을 제작해보세요.

제12강	강의제목	스크롤 창 만들기
	학습목표	마스크 효과를 이용해서 스크롤 창을 만들 수 있다.
	학습내용	▶ 화면요소 제작 ▶ 마스크 지정 ▶ 액션 지정

 마스크 효과를 이용해서 스크롤 되는 텍스트 상자를 만들어봅시다. 마스크는 두 개의 레이어의 합성으로서 1개의 레이어는 구멍처리가 되고 한 개의 레이어는 내용이 됩니다. 구멍 처리되는 레이어가 밑 부분, 내용이 되는 레이어는 윗 부분이 됩니다.

제 1단계	화면요소 제작

 1. 버튼 만들기

①무비의 크기는 800*600으로 지정합니다.

①텍스트로 [다음] 버튼을 만듭니다.

②텍스트로 [이전] 버튼을 만듭니다.

 2. 사각형 박스 만들기

①먼저 실제로 보여지는 배경이 될 사각형을 회    색으로 만듭니다.

②마스크가 될 영역의 사각형을 그립니다. 마스    크가 될 영역의 도형은 크기와 모양만 영향을    미치고 색깔은 영향을 주지 않습니다.

 3. 글씨 입력하기

①Insert-Text를 선택합니다.

②아래의 Tip과 같은 내용을 입력합니다.

③문단은 좌측정렬을 선택합니다.

   마스크란?

 마스크는 구멍이 뚫린 공간입니다. 마스크는 두 개의 레이어의 합성으로서 1개의 레이어는 구멍처리가 되고 한 개의 레이어는 내용이 됩니다. 구멍 처리되는 레이어가 밑 부분, 내용이 되는 레이어는 윗 부분이됩니다.

  ③문장이 아래에서부터 위로 올라가는 자막효과를 낼 것이므로, 첫 위치는 마스크가 될 사각형의 하단에 위치하도록 이동시켜줍니다.

  ④이러한 과정을 거치면 필요한 화면의 요소는 제작되었으며, 다음단계인 마스크 지정의 과정으로 갑니다.

제 2단계	마스크 지정

1. 마스크 요소를 스프라이트로 지정하기

①텍스트와 마스크 사각형을 동시에 선택하고 이를 그룹    화하면서 Group as Sprite로 변환합니다.

②그룹의 이름을 Scroll로 지정하고 Loop는     해제, Masked에 체크해서 마스크 효과를     갖도록 설정합니다.

 2. 텍스트에 Motion Path 지정

①Scroll 이란 스프라이트로 만든 무비클립의 텍    스트 부분을 Outline에서 선택하여 텍스트에    Motion Path를 지정합니다.

②아래에서 위로 직선운동 스크롤 되는 움직임    으로 지정합니다.

3. 스프라이트 완성하기

①현재 작업과정은 스프라이트 편집모드입니다.    이 스프라이트는 Tell Target를 이용하여         “Scroll 스프라이트” 를 불러와서 활용할 것이    므로, 첫 번째 프레임에서 Stop 액션을 지정     합니다.

②가급적 스프라이트의 첫 화면엔 객체가 보이     지 않도록 조절해줍니다.

제 3단계	액션 지정

 1. [다음] 버튼

①[다음]버튼을 클릭할 때마다 한  계씩 스     크롤 되는 무비를 구현하고자 합니다.

②On Release 마우스 이벤트를 선택하고       Add action을 선택합니다.

③Tell Target을 선택하고 /scroll을 선택합     니다.

  ④Add Action을 선택하고 Goto Frame을 선택합니다.

  ⑤Frame Number를 지정하지 않고 Next를 선택합니다.

  ⑥이렇게 완성되면 [다음]버튼을 한번 클릭할 때마다 글자가 한 칸씩 위로 스크롤 되는 작품을 만들 수 있습니다. 

2. [이전] 버튼

①[이전] 버튼도 [다음]버튼과 같은 방법으로    액션을 지정하되 Next가 아닌 “Prev"로 지    정하도록 합니다.

②Play에 체크되지 않도록 유의합니다.

3. 배경 변경하기

①현재의 회색 배경을 삭제하고 포토샵을 이용하여     이미지로 처리된 배경을 삽입한다면  더욱 화려한    작품을 만들 수 있을 것입니다.

②Scroll 스프라이트를     편집하여 배경을 바꿀    수도 있을 것입니다.

   꼭 알아둡시다.

①마스크는 두 개의 레이어의 합성으로서 1개의 레이어는 구멍처리가 되고 한 개의 레이어는 내용이 됩니다. 구멍 처리되는 레이어가 밑 부분, 내용이 되는 레이어는 윗 부분이 됩니다.

②한칸씩 위로 스크롤 되는 작품을 만들기 위해서는 Add Action을 선택하고 Goto Frame을 선택합니다. 그리고 Frame Number를 지정하지 않고 Next를 선택합니다.

  ③한칸씩 아래로 스크롤 되는 작품을 만들기 위해서는 Add Action을 선택하고 Goto Frame을 선택합니다. 그리고 Frame Number를 지정하지 않고 Prev를 선택합니다.

♣ 실습과제 - 12	①마스크 효과와 스프라이트, 버튼의 상호작용을 이용해서 버튼을 클릭하면 숨겨진 사물이 점점 보여지는 작품을 만들어보세요. 스크롤 효과를 또 다른 마스크 기법을 응용할 수 있을 것입니다.

제13강	강의제목	스위시와 플래시
	학습목표	스위시와 플래시무비를 연동해서 활용할 수 있다.
	학습내용	▶ 프레임에서 활용 ▶ 무비클립으로 활용 ▶ Load Movie로 활용

 플래시에서는 스위시의 작업파일인 Swi 파일을 불러오지 못하고, 실행 파일인 Swf 파일만 불러올 수 있습니다. 스위시에서 만든 Swf 파일을 플래시에서 불러오면 무비 전체가 각 각의 한 프레임씩 나누어지기 때문에 작업하기가 매우 어렵습니다. 그렇기 때문에 플래시에서는 스위시에서 만든 Swf 파일을 무비클립으로 불러와 사용하는 것이 바람직합니다.

제 1단계	프레임에서 활용

 스위시에서 만든 Swf 파일을 플래시에서 무비클립으로 사용하려면 스위시의 Export 패널에서 ‘Export Option'을 'Movie'로 선택하고 ’Offset to suit use as a Movie Clip' 항목을 체크해주고 저장해야 합니다. 이 항목을 체크하지 않고 저장한 파일을 무비클립으로 가져가면 무비의 위치가 오른쪽 하단으로 이동되어 보여집니다. 반대로 무비클립으로 사용하지 않으면서 위의 항목을 체크하고 저장하면 무비에서 오브젝트의 위치가 달라지게 됩니다.

1. 플래시용 포맷으로 저장

①기존에 스위시에서 제작된 파일을 열고, Export    패널을 엽니다.

②Export 패널의 Option에서 Movie로 지정하고,     ‘Offset to suit use as a Movie Clip'항목에 체     크 합니다.

③File-Export-Swf를 선택하여 원하는 폴더 위치에    원하는 이름으로 저장합니다.

 2. 플래시에서 Import 하기

  ①플래시를 실행하고 File-Import를 선택합니다.

  ②스위시에서 작업한 무비를 활용할 수 있으나 수정을 위해서는 각 프레임 모두를 작업해야 하는 불편함이 있어 권장할 만 하지 않습니다.

제 2단계	무비클립으로 활용

 스위시로 제작된 무비를 플래시에서 무비클립으로 활용하면 비교적 객체의 크기 및 위치조절 등의 수정이 간편하지만 액션효과가 실행되지 않는다는 단점이 있습니다.  

 1. 간단한 텍스트효과 제작

①무비의 크기를 600*200으로 지정합니다.

②텍스트를 입력하고 Vortex등의 간단한 Effect    를 지정합니다.

③Export 옵션을 좌측의 그림과 같이 설정하고    Text.swf로 Export 한다.

2. 플래시 무비 설정

①좌측과 같이 플래시를 실행하고 Modify-Movie를       이용해서 무비의 크기를 800*600으로 지정합니다.

②배경 그림을 미리 준비하고, File-Import를 선택        하여 화면 중앙에 있는 스테이지에 배경 그림을        배치합니다.

3. 무비클립 만들기

①무비의 설정과 배경이 완성되었으면 Insert-new         symbol을 선택합니다.

②Movie Clip을 선택하고 이름은 “Text”로 합니다.

③무비클립 편집 창에서 File-Import를 선택합니다.

④스위시에서 저장한 Text.swf를 선택합니다.

⑤Scene 편집 창으로 다시 돌아갑니다.

  ⑥Library 창을 열면 제작된 무비클립이 등록되어있으며 스테이지로 Drag하여 활용합니다. 적당한 위치와 크기를 지정하면 플래시에서 스위시의 텍스트 애니메이션을 효과적으로 적용할 수 있게됩니다.

제 3단계	Load Movie로 활용

 Load Movie를 이용하면 스위시에서 제작된 무비의 모든 효과를 구현할 수 있다는 장점이 있지만,  스위시와 플래시 무비의 크기를 조절해야 한다는 것을 단점으로 볼 수 있습니다. 또한 스위시의 모든 액션이 플래시에서도 충분히 구현되기 때문에 액션의 활용은 스위시에서는 스위시 액션, 플래시에서는 플래시 액션을 활용해서 작품을 제작하는 것이 일반적이라 하겠습니다. 여기에서는 스위시에서 액션이 포함되게 제작된 무비를 플래시에서 불러와 활용하는 간단한 예를 들어보기로 합니다.

 1. 액션이 포함된 무비 제작

  ①제작된 스위시 무비(비행기와 자동차 소스파일- gotoframe.swi)를 열어봅시다.

  ②File-Export를 통해서 실행 무비(gotoframe.swf)로 저장합니다.

2. Load Movie

①앞의 작품이 800*600으로 제작되었으므    로 플래시의 무비는 조금 크게(800*650)    설정합니다.

②스테이지 하단에 메뉴 바를 만들고 “비    행기와 자동차‘란 텍스트를 입력하여      Insert- Convert- Convert to Button으로    지정합니다.

   ③버튼을 선택하고 액션패널을 열어 Load Movie 액션을 지정합니다.

  ④로딩될 무비는 Gotoframe.swf로 지정하고, Level은 “1”로 지정합니다. 플래시에서 액션을 지정하는 방법이 스위시와 매우 유사하다는 것을 알 수 있을 것입니다.

  ⑤스위시에서와 마찬가지로 저장되는 무비와 Load Movie로 지정된 무비는 동일한 폴더에 있게 설정해야 합니다.

  ⑥여러 개의 무비를 이러한 방법으로 로딩하려는 경우에는 Load Movie 액션과 더불어, 앞에서 로딩한 무비를 Unload하는 Unload Movie 액션을 지정해야 합니다. 

  ⑦완성된 작품을 [미리 보기]하여 버튼을 누르면 작품이 실행됩니다. 우측의 작품을 완성하기 위해서 [비행기]무비를 로딩하기 위해서는 Unload gotoframe.swf 액션을 지정해야하겠습니다.

   플래시에서 스위시 활용

 플래시와 스위시를 연동하여 활용하는 가장 일반적인 유형은 스위시 무비를 Swf 포맷으로 제작하고, 이를 플래시에서 무비클립으로 가져오는 방식입니다. 단, 이러한 경우에는 스위시 무비의 액션은 구현되지 않으며 이러한 단점을 보완하기 위해서 플래시 액션을 활용합니다.

   꼭 알아둡시다.

①스위시에서 만든 Swf 파일을 플래시에서 무비클립으로 사용하려면 스위시의 Export 패널에서 ‘Export Option'을 'Movie'로 선택하고 ’Offset to suit use as a Movie Clip' 항목을 체크해주고 저장해야 합니다.

②스위시로 제작된 무비를 플래시에서 무비클립으로 활용하면 비교적 객체의 크기 및 위치조절 등의 수정이 간편하지만 액션효과가 실행되지 않는다는 단점이 있습니다. 

  ③Load Movie를 이용하면 스위시에서 제작된 무비의 모든 효과를 구현할 수 있다는 장점이 있지만,  스위시와 플래시 무비의 크기를 조절해야 한다는 것을 단점으로 볼 수 있습니다.

♣ 실습과제 - 13	①스위시의 무비 크기를 500*200으로 지정하여 간단한 글자 애니메이션을 제작하고, 플래시를 실행하여 800*600의 무비 크기에 적당한 배경 그림을 지정하고 그 위에서 스위시에서 제작한 글자 애니메이션이 실행되도록 작품을 만들어보세요. 스위시와 플래시를 활용하여 화려한 작품을 만들 수 있는 좋은 경험이 되실 것입니다.

제14강	강의제목	교수-학습 자료제작
	학습목표	Scene을 활용해서 교수-학습 자료를 제작할 수 있다.
	학습내용	▶ Scene 활용 ▶ 교수-학습자료 제작하기 ▶ 나모 및 파워포인트에서 활용하기

제 1단계	Scene 활용

 1. Scene 삽입

 현재까지의 실습에서는 Scene을 1개만 작업한 내용이었습니다. 교수-학습 자료와 같은 큰 작품을 만들기 위해서는 여러 개의 Scene을 삽입하여 각 Scene의 내용을 각 각 작업함으로서 보다 용이하게 작품을 제작할 수 있을 것입니다.

①Scene 1의 화면을 구성하고 Outline의 Insert    -Scene을 선택합니다.

②위의 과정에서 새롭게 추가된 Scene 2를 작업    하고 Scene3과 4를 추가합니다.

③각 Scene들의 마지막 프레임에는 Stop액션을    지정하여 다음으로 자동진행하지 않도록 합니다.

2. Scene 간의 이동

①메인 화면의 첫 프레임에서 대기할 수 있도록    Stop 액션을 지정합니다.

②메인 화면에서 버튼을 제작하여 Goto Frame    액션을 선택합니다.

③각 버튼에 이동하고자 하는 Scene으로 Goto    Frame 액션을 지정합니다.

   Scene의 이해

 Scene을 활용하는 가장 큰 이유라 한다면, 분지가 많거나 재생 시간이 긴 무비의 경우 하나의 Scene으로 작업을 하면 타임라인의 프레임이 그만큼 커지게 되어 작업하기 어려워집니다. 이러한 경우 여러 개의 Scene으로 나누어 작업함으로서 작업의 효율성을 높일 수 있습니다. 각 Scene은 독립된 객체가 아닌 하나의 무비 속에서 분리된 레이어와 연결된 타임라인의 연결 객체로 이해해야 할 것입니다.

제 2단계	교수-학습자료 제작하기

1. 메인 화면 제작

①그림과 같이 전체 레이아웃을 결정하는 화면 요    소를 배치합니다.

②상단의 제목, 좌측의 메뉴, 내용이 보여지는 컨    텐츠 부분엔 내용을 입력합니다.

③모든 객체는 Ctrl+A를 눌러 모두 선택한 후, 4    개의 Scene을 더 삽입하여 붙여 넣기 합니다.

  2. 각 요소화면 제작

①Scene 1에는 창덕궁에 관한 그림과 텍스트를     입력하여 내용을 구조화시킵니다.

②자료는 에듀넷이나 검색사이트에서 검색하여     필요한 교수-학습자료로 제작합니다.

③Scene 2에는 수원화성에 대한 내용을 구조화하    며, Scene 3과 4도 마찬가지로 제작합니다.

④모든 화면이 제작되면 좌측의 버튼에 액션을     다음 단계에서 지정합니다.

   학습 안내화면 만들기

  각 Scene의 마지막 프레임엔 Stop 액션을 지정하여 다음 화면으로 자동이동하지 않도록 조절하며, Scene 1의 0번째 프레임에는 학습 안내화면을 만들어보세요.

 3. 액션으로 전체 작품 조직하기

①Scene 1로 이동하여 창덕궁엔 Goto Frame          Scene 1의 첫 번째 프레임으로 이동하게 합니다.

②Scene 1의 “0”번째 프레임에 안내화면이 삽    입 되었을 경우를 가정하고 “1”번째 프레임    으로 이동시킨 것입니다.

  ③수원화성엔 Scene 2의 0번째 프레임으로 이동시킵니다.

  ④석굴암과 종묘 버튼에도 각 각 Scene 3, Scene 4의 “0”번째 프레임으로 이동하게 액션을 지정합니다.

  ⑤마지막으로 모두 완성된 버튼을 Scene 1에서 복사해서 모든 Scene에 붙여 넣기 합니다.

  ⑥완성된 작품을 미리 보기하고 발생되는 오류가 있을 시엔 액션 패널의 스크립트를 분석하여 수정합니다.

  ⑦최종 저장하여 Study.swf 무비로 만들어봅시다.

제 3단계	나모, 파워포인트 활용

 1. 나모 웹 에디터에서 활용

  ①나모에서 제작하는 HTML 파일과 Swf 무비파일이 동일 또는 하위 폴더에 파일이 위치하도록 합니다.  출판 후에 나타나는 오류를 방지하기 위함입니다. 

  ②나모 웹 에디터를 실행하고 삽입하고자 하는 Html 파일을 엽니다.

  ③메뉴에서 [삽입]-[플래시]를 선택합니다.(버전마다 다를 수 있음)

  ④플래시 파일이 있는 폴더의 위치를 지정합니다.

  ⑤플래시 무비는 처음 삽입되면 매우 작게 자리잡는데, 크기를 조절하고 웹 브라우저 미리 보기 합니다.

 2. 파워포인트에서 활용

  ①파워포인트에서는 [보기]-[도구모음]-[컨트롤 도구상자]-[Shockwave Flash Object]를 선택하고, 화면에 영역을 드래그하여 그림과 같이 지정합니다.

  ②X 모양의 네모 영역을 더블클릭하면 [속성]창이 그림과 같이 뜨면서 Visual Basic 대화상자가 나타납니다.

  ③(사용자 정의)부분의 ... 버튼을 클릭하면 Flash 속성 창이 나타나면서 플래시 무비가 있는 절대경로는 지정하도록 합니다.

  ④앞서 플래시 무비를 파워포인트에서 활용하기 위해 Export 할 때 이러한 불편함을 해소하기 위해 C:\의 루트 디렉토리에 간단한 이름(예:1.swf)으로 저장하도록 합니다.

  ⑤위와 같은 대화상자에서 [동영상 포함]에 체크하여 파워포인트에 플래시가 포함되도록 제작하면 보다 편리하겠습니다.

  ⑥기타 다른 속성은 제작의 의도에 따라 선택하면 됩니다.

  ⑦좌측 상단의 파워포인트 아이콘을 클릭하여 Visual Basic 창에서 파워포인트 편집 창으로 다시 복귀합니다.

  ⑧슬라이드 쇼를 진행하면 완성된 교수-학습 자료를 감상할 수 있겠습니다. 

   꼭 알아둡시다.

①교수-학습 자료와 같은 큰 작품을 만들기 위해서는 여러 개의 Scene을 삽입하여 각 Scene의 내용을 각 각 작업함으로서 보다 용이하게 작품을 제작할 수 있을 것입니다.

②웹에 출판 한 후 오류를 방지하기 위해서 나모에서 제작하는 HTML 파일과 Swf 무비파일이 동일 또는 하위 폴더에 파일이 위치하도록 합니다.

  ③파워포인트에서는 플래시 무비를 [삽입]메뉴를 활용하는 것이 아니라, [보기]-[도구모음]-[컨트롤 도구상자]-[Shockwave Flash Object]를 선택하여 삽입합니다.

  ④플래시 무비를 파워포인트에서 활용하기 위해 Export 할 때 이러한 불편함을 해소하기 위해 C:\의 루트 디렉토리에 간단한 이름(예:1.swf)으로 저장하도록 합니다.

♣ 실습과제 - 14	①그 동안 제작된 모든 무비들을 파워포인트에 삽입하여 스위시 작품전 프리젠테이션을 만들어 보세요. 아주 좋은 연수 결과물이 될 것입니다. 감사합니다.