사이트에서 플래시 다운로드~할 수 있다 다른 방법들. 그러나 그 중 일부는 상당히 번거롭고 일부는 플러그인, 프로그램 및 사이트를 사용해야 합니다. 한편, 구현에 많은 시간이 걸리지 않는 매우 우아하고 간단한 방법이 있습니다.

우선 플래시가 필요한 이유와 플래시가 무엇인지 결정합시다. 플래시- 이것은 멀티미디어 프레젠테이션프로그램으로 만든 어도비 플래시 또는 . 이러한 파일을 플래시 동영상이라고 하지만 동영상 이상의 의미를 가질 수 있습니다.

방문자의 마우스 움직임에 반응하는 배너, 작은 게임, 소위 말하는 전체 미니 프로그램이 될 수 있습니다. 플래시 게임, 결과 발행과 함께 테스트 등.

그리고 실제로는 비디오나 오디오 클립일 수도 있습니다.

플래시 파일의 표준 확장자는 SWF. 그리고 사이트에서 이러한 비디오를 발견하면 마우스 오른쪽 버튼으로 사진처럼 간단히 다운로드할 수 없습니다. 약간의 노력을 기울여야 합니다.

웹사이트에서 플래시 다운로드

필요한 플래시 파일이 있는 사이트의 페이지로 이동합니다. 그후에:

페이지 코드 열기

페이지를 마우스 오른쪽 버튼으로 클릭하고 선택 페이지 코드 보기 . 페이지 코드를 여는 두 가지 추가 옵션: 클릭 Ctrl+U, 또는 페이지 주소 앞에 쓰기 소스보기:

코드에서 SWF 동영상의 주소 찾기

이렇게 하려면 단축키를 사용하여 검색을 활성화하십시오. Ctrl+F, 검색 필드에 입력 .swf. 그런 다음 입력하다 .

다음과 같은 주소 자체를 찾습니다.

http: //site.ru/papki/rolik.swf
또는 이런 종류:

/폴더/rolik.swf

두 번째 옵션이 있는 경우 주소는 절대적인 것이 아니라 상대적인 것입니다. 주소 왼쪽에 부착해야 합니다. 홈페이지대지.

주소 확인

플래시 동영상의 URL을 주소 표시 줄새 탭에서 모든 브라우저. 비디오가 나타나야 합니다.

주소를 링크로 만드세요

비디오가 나타나면 주소를 메모장에 복사하고 링크로 만드십시오. 즉, 적절한 코드를 추가하십시오.

결과적으로 메모장의 비문은 다음과 같이 표시됩니다.

링크

컴퓨터에 플래시 비디오 다운로드

저장된 파일을 브라우저에서 엽니다. 내부에 링크가 있을 것입니다. 마우스 오른쪽 버튼으로 클릭하고 다른 이름으로 링크 저장... 또는 링크를 통해 저장...을 선택한 다음 컴퓨터에 플래시 동영상을 저장합니다.

보려면 브라우저에서 열거나 예를 들어 플래시 플레이어를 사용하십시오. 매크로미디어 플래시 플레이어 .

다른 옵션

위에서 설명한 옵션이 가장 흥미로운 것처럼 보이지만 여전히 컴퓨터에 플래시를 저장하는 다른 방법을 알려 드리겠습니다.

  • 웹사이트를 통해 http://save2go.ru. 플래시 비디오가 있는 페이지의 주소를 입력하고 사이트에서 저장 . 아래는 동영상 링크입니다. 마우스 오른쪽 버튼을 클릭하고 선택 링크를 다른 이름으로 저장... 또는 링크 저장... .
  • 예를 들어 브라우저 플러그인을 사용하면 다운로드 도우미~을 위한 파이어폭스 .
  • 예를 들어 다운로더의 도움으로 다운로드 마스터.먼저 플래시 영화의 주소를 찾은 다음 부트로더에 삽입해야 합니다.

"모든 과정" 및 "유틸리티" 섹션에서 더 자세한 정보를 얻을 수 있습니다. 상위 메뉴대지. 이 섹션에서 기사는 다양한 주제에 대한 가장 상세한(가능한 한) 정보를 포함하는 블록으로 주제별로 그룹화됩니다.

블로그를 구독하고 모든 새 기사에 대해 알아볼 수도 있습니다.
시간이 많이 걸리지 않습니다. 아래 링크를 클릭하세요.


여러 레이어의 프레임 작업
프레임 섹션 설정

작업 시작


레이어의 첫 번째 프레임은 빈 원으로 표시됩니다. 이는 프레임 1과 "레이어 1"이 모두 비어 있음을 의미합니다. 레이어에 붙여넣은 개체가 없습니다.

레이어 "레이어 1"에 개체를 붙여넣습니다.
예를 들어, 우리는 수입 비트맵(가져오기 참조) "레이어 1" 레이어에 붙여넣습니다.
이미지는 왼쪽에 표시됩니다.

Enter 키를 누르면 생성된 애니메이션을 볼 수 있습니다.

일반적으로 배경 레이어는 변경되지 않도록 잠겨 있습니다. 자물쇠 아이콘이 배치됩니다.




예 4:

간단한 프레임을 추가하거나 제거할 수 있습니다.

프레임 삭제:
프레임을 삭제하려면 프레임을 선택하십시오. 컨텍스트 메뉴프레임 제거 를 선택합니다.
여러 프레임을 선택하려면 Ctrl 키를 누르고 있습니다.
예를 들어 배경의 프레임 수를 5프레임으로 줄여야 합니다. 5개 프레임을 선택하고 삭제합니다. 30개 프레임 대신 25개 프레임이 남습니다.

프레임 추가:
예를 들어 "배경" 레이어에 여러 프레임을 추가해야 합니다. 이렇게 하려면 프레임 30을 클릭하고 커서 옆에 작은 사각형이 나타나면 프레임 30을 타임라인의 오른쪽으로 드래그하면 됩니다.

또는 1번째에서 30번째 사이의 프레임을 클릭하고 컨텍스트 메뉴에서 프레임 삽입을 선택할 수 있습니다.

최종 업데이트: 2014년 12월

지금까지 우리는 처음부터 끝까지 시청자의 개입 없이 재생되는 Flash 영화를 살펴보았습니다. 그러나 Flash를 사용하면 사용자가 내용 표시를 제어할 수 있는 대화형 응용 프로그램을 만들 수도 있습니다. 이 단원에서는 Action Script 스크립팅 언어의 요소에 대해 알아보기 시작하고 대화형 응용 프로그램을 만드는 데 사용할 수 있는 방법을 살펴봅니다. 예를 들어 대화형 인터페이스 요소가 있는 사진 앨범을 만들어 보겠습니다. 그러나 Action Script에 대한 설명을 진행하기 전에 지금까지 무시해 왔던 한 가지 유형의 심볼을 더 이야기해야 합니다. 바로 버튼 심볼입니다. 대화형 인터페이스를 구축하려면 단순히 필요합니다.

버튼 만들기

버튼은 4프레임 대화형 동영상 클립입니다. 버튼 유형을 심볼에 할당하면 Flash는 새 심볼에 대해 4프레임 타임라인을 만듭니다.

Up-state는 버튼을 누르지 않고 마우스 포인터가 버튼 위에 있지 않은 상황에 해당하는 프레임입니다.

마우스 포인터가 버튼 위에 있지만 버튼을 누르지 않았을 때 버튼의 모양을 나타내는 프레임을 과장합니다.

다운 상태 이 프레임은 눌렀을 때 버튼의 모양을 보여줍니다.

적중 상태는 버튼이 마우스 클릭에 반응하는 영역을 정의합니다. 이 영역은 클립에 표시되지 않습니다.

버튼을 생성하려면 Insert => New Symbol 명령을 실행하십시오(키보드 단축키 Control + F8을 입력할 수 있음). 새 심볼 만들기 대화 상자가 나타나면 버튼 심볼의 이름(예: but1)을 입력하고 버튼 심볼 유형을 선택합니다.

Flash는 Up, Over, Down 및 Hit 프레임을 제공하는 문자 편집 모드로 전환됩니다. 첫 번째 프레임인 Up은 빈 키프레임이 됩니다. 이 프레임에 있는 버튼의 눌리지 않은 모습을 그려봅시다(그림 1).

쌀. 1. UP 프레임 버튼

Over로 표시되고 커서가 버튼 위에 있을 때의 상태에 해당하는 두 번째 프레임을 선택하겠습니다. 이 프레임에 키 프레임을 삽입해 보겠습니다(Insert => Keyframe 명령 사용). 그 결과 Up 프레임의 내용을 완전히 반복하는 키 프레임이 나타납니다. 그림과 같이 버튼의 색상을 변경해 보겠습니다. 2.

그림 2. 버튼 오버 프레임

마찬가지로 다음 프레임(Down-frame)을 추가하고 버튼이 눌린 상태를 그려봅시다(그림 3).

쌀. 3. 다운 프레임 버튼

지금은 Hit 프레임에 아무 것도 그리지 않겠지만 잠시 후에 이 프레임으로 돌아갑니다.

메인 장면으로 이동하여 Window => Library 명령을 사용하여 라이브러리를 호출하고 스테이지로 드래그하여 버튼 심볼의 인스턴스를 만듭니다(그림 4).

쌀. 4. 라이브러리에서 버튼을 드래그하여 인스턴스 생성

결과는 다음 영화입니다. 이 동영상에서 알 수 있듯이 버튼의 중앙(작업) 영역을 클릭할 때뿐만 아니라 그 주변의 프레임을 클릭할 때도 버튼이 눌려집니다. Hit 프레임이 그려지지 않으면 버튼의 작업 영역이 Up 프레임에 해당하기 때문입니다.

버튼이 작업영역에서만 눌리도록 하려면 이 영역을 Hit-frame에서 정의해야 한다. 즉, 프레임이 없는 버튼을 그려야 한다(Fig. 5 참조).

쌀. 5. 히트 프레임 버튼

필요한 히트 프레임을 추가한 후 다음 동영상이 표시됩니다. 이 동영상에서는 프레임을 클릭할 때 버튼이 눌러지지 않습니다.

버튼을 대화형으로 만들려면 버튼을 누르는 사실을 특정 명령의 실행, 즉 특정 시나리오를 설명하는 것과 연관시켜야 합니다. Flash에서 스크립트를 설정하기 위한 특별한 Action Script 언어가 있습니다. 이 단원에서는 이 언어의 기능 중 일부만 다룰 것이며, 앞으로 Flash에서 대화형 동영상을 만드는 예제가 더 복잡해짐에 따라 Action Script의 구조와 구문으로 돌아갈 것입니다.

액션 스크립트 이해하기

Action Script는 Flash 무비의 요소를 제어하는 ​​일련의 지침인 스크립팅 언어입니다. 액션 스크립트는 동영상에 포함하거나 외부 파일에 저장할 수 있습니다. 텍스트 파일 AS 확장으로.

동영상에 스크립트를 포함할 때 동영상의 다른 부분에 스크립트를 포함할 수 있습니다. 보다 구체적으로 말하면 Action Script는 키프레임, 버튼 인스턴스 및 무비 클립 인스턴스를 포함할 수 있습니다. 따라서 스크립트를 프레임 스크립트(Frame Action), 버튼 스크립트(Button Action), 클립 스크립트(MovieClip Action)라고 합니다.

액션 스크립트는 특정 사용자 또는 시스템 트리거 이벤트 발생 시 실행됩니다. 나타내는 메커니즘 플래시 프로그램이벤트가 발생했을 때 어떤 문장을 실행해야 하는지를 이벤트 핸들러라고 합니다.

Action Script에는 JavaScript 구문과 마찬가지로 고유한 구문이 있습니다. Flash MX 2004는 모든 액션 스크립트를 지원합니다. 이전 버전플래시.

Action Script의 주요 개념 중 하나는 Actions - SWF 파일을 실행하는 동안 명령을 실행하는 명령입니다. 예를 들어 gotoAndStop()은 재생 헤드를 특정 프레임이나 큐로 보냅니다. Actions라는 단어에서 언어 이름인 Action Script(말 그대로 - action 스크립트)가 나옵니다. 우리는 이 언어의 대부분의 개념에 대해 알게 될 것입니다. 구체적인 예.

인터랙티브 사진 앨범

버튼을 사용하여 사진 앨범을 제어하는 ​​방법을 살펴보겠습니다. 사진 세트를 만들고 사진을 앞뒤로 스크롤하는 두 개의 버튼을 추가합니다.

기본 타임라인에 첫 번째 사진을 배치하고 표준 세트에서 버튼을 추가해 보겠습니다. 액세스 원하는 폴더해야한다 윈도우 명령어=> 제어판 공통 라이브러리 => 버튼(그림 6).

쌀. 6. 표준 라이브러리에서 버튼 추가

이 명령을 실행하면 미리 그려진 많은 버튼이 포함된 패널이 나타납니다. 다양한 방식. 예를 들어 Key Buttons(키보드 키와 유사한 버튼)를 선택하고 해당 폴더를 열고 key-left 버튼(그림 7)을 선택하고 이 버튼의 인스턴스를 만듭니다(스테이지 위로 드래그하여).

쌀. 7. 키 버튼 폴더 항목

스테이지에 두 번째 버튼(오른쪽 키)을 놓고 첫 번째 버튼과 정렬되도록 이동하면 프로그램에서 버튼을 정확하게 배치할 수 있는 힌트(점선)를 제공합니다(그림 8).

쌀. 8. 같은 레벨의 버튼 자동 정렬

스크립트를 추가하려면 Window => Development Panels => Actions 명령을 사용하거나 F9 키를 눌러 Action Script 편집기를 호출해야 합니다. 스크립트를 자주 작성하려는 경우 이 키보드 명령을 기억할 가치가 있습니다. 결과적으로 Action Script 편집기가 나타납니다(그림 9).

쌀. 9. 액션 스크립트 편집기 패널

강조 표시를 실험하면 다양한 요소스테이지에서 Action Script 편집기 패널의 메시지를 모니터링하는 동안 프로그램에서 코드를 "매달" 수 있는 요소를 제안한다는 것을 알 수 있습니다. 스테이지에서 프레임을 선택하면 편집기 패널의 왼쪽 상단 모서리에 비문 Actions - Frame이 표시되고 버튼을 클릭하면 비문 Actions - Button이 나타납니다. 입력하면 버튼 스크립트를 참조합니다. 사진을 선택하면 스크립트를 입력할 필드에 다음 메시지가 나타납니다. 현재 선택 항목에 작업을 적용할 수 없습니다(스크립트를 선택한 개체에 적용할 수 없음).

버튼에 스크립트를 할당합니다. 에 최신 버전 ActionScript에는 중앙 집중식 코드, 즉 한 곳에 있는 코드를 작성할 수 있는 기능이 있으며 이 기능을 사용하면 대규모 프로그램을 더 잘 이해할 수 있습니다. 그러나 간단한 예(우리가 고려하고 있는) 버튼에 스크립트를 할당하는 것은 완벽하게 허용됩니다.

따라서 왼쪽 화살표가 있는 버튼의 경우 다음 시나리오를 공식화해야 합니다. "특정 프레임에서 버튼을 놓으면 이 프레임에서 이전 프레임으로 이동해야 합니다." Action Script 언어의 구문(그림 10)에 따르면 다음과 같습니다.

첫 번째 줄에는 다음 형식의 on() 버튼 이벤트 핸들러가 포함되어 있습니다.

이제 첫 번째 프레임에서 만든 버튼이 복사되도록 몇 개의 키프레임을 추가하고 새로 만든 프레임에 필요한 사진을 배치합니다.

생성된 동영상을 실행하여 실행하면 프레임이 차례로 계속 재생되므로 우선 첫 번째 프레임에 "중지" 명령을 내려야 합니다. 이렇게 하려면 첫 번째 프레임에 해당 명령을 추가합니다(그림 11).

쌀. 11. 첫 번째 프레임에 할당된 시나리오

참고: 명령은 더 이상 버튼에 할당되지 않고 프레임에 할당됩니다. 장면에 스크립트가 할당되었다는 사실이 메인 타임라인에 표시됩니다. 소문자 "a"는 프레임 지정의 굵은 점 위에 나타납니다.

그 결과 다음과 같은 영화를 얻었다.

사진 앨범에 몇 개의 프레임만 있는 경우 "앞으로"와 "뒤로"라는 두 개의 버튼으로 충분하지만 사진 세트가 큰 경우 처음으로 보내는 버튼이 있는 것이 바람직합니다. 영화의 끝. 다음 예에서는 "첫 번째 프레임으로" 및 "마지막 프레임으로"에 해당하는 버튼을 추가합니다. Circle Buttons 폴더의 표준 버튼 라이브러리에서 적절한 니모닉의 버튼을 선택할 수 있습니다(그림 12).

제안된 예에서는 원하는 프레임으로 이동한 다음 중지할 수 있는 또 다른 gotoAndStop() 명령에 대해 알게 됩니다.

쌀. 12. Circle Buttons 폴더의 버튼

첫 번째 프레임으로 전환하는 버튼(그림 13의 왼쪽에서 세 번째)에 그림 1과 같이 코드를 걸 것입니다. 13.

쌀. 13. "첫 번째 프레임에서" 버튼 시나리오

5개 프레임의 사진 앨범의 경우 마지막 버튼에 "마지막 프레임으로" 전환 스크립트를 추가합니다.

자동화된 스크립팅

지금까지 모든 명령을 수동으로 입력했지만 ActionScript 편집기 패널은 전선자동화된 스크립트 작성을 위한 서비스. 이러한 가능성을 고려해 봅시다.

쌀. 14. 자동화된 스크립팅 도구

Action Script 편집기 패널을 사용하면 명령을 선택, 드래그, 재정렬 및 ​​삭제할 수 있습니다.

자동화 모드에서 "앞으로" 버튼에 대해 동일한 스크립트를 작성하는 방법을 보여 드리겠습니다. Movie Clip Control 폴더(그림 14의 왼쪽 상단 창)를 선택하여 on 이벤트 핸들러에 액세스한 다음 해당 항목을 두 번 클릭하거나 모드에서 표현식을 스크립트 작성 필드로 드래그할 수 있습니다. 드래그하고하락.

쌀. 15. 표현식을 완성하기 위한 힌트

결과적으로 필요한 표현과 양식의 힌트가 작업 필드에 나타납니다(그림 15). 메뉴에서 필요한 명령을 선택하면 표현이 자동으로 완성됩니다. 메뉴에서 볼 수 있듯이, 화면상의 버튼과 관련된 조건을 선택할 수 있을 뿐만 아니라 그림 1의 메뉴에서도 선택할 수 있습니다. 15포인트 키누름 “ ", 또는 keyPress " "는 키보드 키(왼쪽 화살표, 오른쪽 화살표)를 누르는 것에 해당합니다. 즉, 키보드 키를 사용하여 "페이징"될 사진 앨범을 만들 수 있습니다.

쌀. 16. 키패드 버튼 호출

keyPress 명령을 사용합시다. "(그림 16), Timeline Control 폴더로 이동하여 nextFrame 명령을 선택하고 작업 필드로 드래그합니다(그림 17).

쌀. 17. nextFrame 명령은 Timeline Control 폴더에서 찾을 수 있습니다.

동영상을 사진 앨범의 시작 부분으로 이동하는 버튼의 경우 메뉴에서 홈 키를 이벤트로 누름을 선택한 다음(그림 18) gotoAndStop 명령을 필드로 끌어다 놓을 수 있습니다. 이 명령의 가능한 구문에 대한 추가 힌트가 표시됩니다.

도구 설명의 화살표를 사용하면 다양한 구문 옵션을 볼 수 있습니다. 이 프로그램은 두 가지 옵션(그림 18 및 19)을 제공합니다. 즉, 장면과 프레임 또는 프레임만 설정하도록 제안합니다. 우리의 경우 프레임(Frame)만 지정하면 됩니다. 장면 이름을 생략하면 현재 장면의 프레임이 기본값으로 사용됩니다.

쌀. 18. 가능한 명령 구문에 대한 팁

쌀. 19. 화살표-삼각형을 사용하면 구문 옵션을 볼 수 있습니다.

모든 버튼을 적절하게 할당한 후 키보드 버튼, 우리는 다음 영화를 얻습니다. 여기서 사진을 통한 페이징은 키보드에서 발생하고 마우스로 화면 버튼을 클릭해도 결과가 발생하지 않습니다.

서로 다른 이벤트가 동일한 작업으로 이어지는 시나리오를 제공할 수 있습니까? 가능한 것으로 밝혀졌습니다. 이를 위해 on 이벤트 핸들러에서 이벤트 이름 목록을 열거해야 합니다. 첫 번째 이벤트 다음에 이벤트 목록에 쉼표를 넣으면 프로그램 자체에서 메뉴를 제공합니다(그림 20).

쌀. 20. 이벤트 목록에 쉼표를 입력하면 추가 명령 메뉴가 자동으로 나타납니다.

첫 번째 이벤트(키보드 버튼 누름)에 두 번째 이벤트(화면 버튼 해제)를 추가해 보겠습니다.

on(키 누르기" ", 풀어 주다)

나머지 버튼에 대해 절차를 반복하면 결과적으로 사진 페이지가 마우스와 키보드로 스크롤되는 사진 앨범을 얻을 수 있습니다(원본 FLA 파일은 링크에서 얻을 수 있음).

고려한 예에서는 프레임 번호로 전환을 사용했지만 이 방법이 항상 편리한 것은 아닙니다. 필름을 편집하는 동안 프레임 번호가 변경되면 논리가 위반될 수 있습니다. 프레임 마크에 의한 트랜지션을 사용하면 더욱 편리합니다. 앨범을 넘기는 것뿐만 아니라 다른 섹션으로의 전환, 즉 더 복잡한 탐색이 필요한 예를 살펴보겠습니다.

앨범이 그림으로 구성되게하십시오. 컴퓨터 그래픽그리고 사진.

다른 섹션의 첫 번째 프레임과 유사하게 "그림" 섹션의 첫 번째 프레임에 그림으로 레이블을 지정하고 그래픽 및 사진에 레이블을 지정합니다.

레이블을 배치하기 위한 레이어를 만들고 이름을 레이블로 지정해 보겠습니다. 프레임에 레이블을 지정하려면 속성 패널에서 레이블 유형 이름을 선택하고 이름을 기록해 둡니다. 우리의 경우 사진(그림 21). 같은 방식으로 프레임 5와 10에 표시를 합니다(그림 22).

쌀. 21. 프레임에 레이블을 지정하는 예

이제 새 레이어를 추가하고 이름을 Actions로 지정하겠습니다. Actions 레이어의 첫 번째 키 프레임에서 Actions Frame 패널을 호출하고(F9 버튼을 눌러) stop() 명령을 입력합니다(그림 22 참조).

쌀. 22. 첫 번째 프레임의 시나리오

주제(주제)라는 또 다른 레이어를 추가하여 해당 프레임에 제목을 지정합니다: "사진"(그림 23), "그래픽" 및 "사진".

쌀. 23. "사진" 섹션의 프레임 제목

이제 측면에 유사한 이름을 가진 메뉴 버튼을 추가하여 Menu라는 새 레이어에 배치하겠습니다.

왼쪽 가장자리에서 첫 번째 메뉴 항목 "Pictures"를 인쇄하고 버튼 기호로 변환해 보겠습니다. 화살표 도구를 사용하여 "그림" 텍스트 블록을 선택하고 수정 => 기호로 변환 명령을 실행합니다(이 명령은 F8 키를 사용하여 실행할 수도 있음). 기호로 변환 패널에서 단추 기호 유형을 설정하고 해당 기호를 정의합니다. 이름을 pictureButton으로 지정합니다(그림 24).

쌀. 24. 사진 섹션으로 이동하는 버튼의 이름을 pictureButton으로 지정

"그림" 버튼을 위한 4개의 프레임을 만들어 보겠습니다. 첫 번째는 단순히 원본 텍스트를 나타내고(그림 25), 두 번째는 파란색으로만 표시된 동일한 텍스트이고 세 번째 프레임은 건너뜁니다(이 경우 아래쪽 프레임 Over-frame 과 동일하며 Hit-frame에서 버튼이 눌려지는 영역을 결정할 직사각형 영역을 그립니다(그림 26).

쌀. 25. 업프레임 버튼 pictureButton

쌀. 26. pictureButton의 히트 프레임

이제 새로 생성된 버튼에 스크립트를 첨부해야 합니다. 이렇게 하려면 Scene 1에서 버튼을 선택하고 F9를 눌러 Actions 패널을 호출한 다음 그림 1과 같은 코드를 입력합니다. 27.

쌀. 27. 레이블이 있는 프레임으로 전환하는 시나리오

뒤에 무엇이 있는지 궁금해 한 적이 있습니까? 아름다운 애니메이션인터넷 배너? 또는 컴퓨터 기술? 가장 자주 그들은 "육체"를 기반으로합니다. 더 정확하게는 이름이 영어에서 번역되는 방식입니다. 플래시 기술. 오늘 우리는 사이트의 플래시 애니메이션에 대해 이야기 할 것입니다.

플래시 기술

멀티미디어 프레임워크는 Macromedia에서 개발했습니다. 그러나 인수(합병) 후 기술에 대한 모든 권리는 새로운 소유자인 Adobe Systems에게 이전되었습니다.

현대의 영역 어도비 애플리케이션플래시:

  • 웹 애플리케이션을 만드는 것은 상당히 새로운 방향입니다. 웹 사이트를 만들기 위해 Flash를 전체 또는 부분적으로 사용하는 것을 의미합니다. 부분 적용을 통해 이 기술은 다양한 인터랙티브 메뉴, 애니메이션 버튼 등 별도의 디자인 요소를 생성합니다.

기존 자원에 비해 HTML 기반플래시 사이트에는 사용을 제한하는 몇 가지 기능이 있습니다. 여기에는 높은 개발 비용, 요구되는 서버 리소스, 오랫동안다운로드 느린 연결인터넷 및 기타 측면:

  • 멀티미디어 기능 구현 - 사이트에서 오디오를 듣고 비디오를 재생하기 위해 Flash 기반 미디어 플레이어가 자주 사용됩니다. 그들의 개발에는 스크립팅 언어 중 하나(자주 자바스크립트) 사용이 포함됩니다.
  • 인터넷 광고에서 가장 자주 기술은 애니메이션 배너를 만드는 데 사용됩니다. 그들은 멀티미디어 광고의 재생뿐만 아니라 게임 기반의 사용자와의 일종의 상호 작용을 의미합니다.

플래시 개발을 위한 기초 및 도구

플래시 애니메이션을 만들기 위해 Adobe의 기존 도구가 가장 자주 사용됩니다.

  • 어도비 벽돌 플래시 프로페셔널- 인터랙티브 애니메이션 제작 프로그램(애니메이터)
  • Adobe Flash Builder - 웹 응용 프로그램용 인터페이스를 만들기 위한 환경.
  • Adobe Flash Player는 Flash를 재생하기 위한 브라우저 통합 플레이어입니다.

그 외에도 여러 타사 애플리케이션. 그 중 가장 인기 있는 것은 Gnash, QuickTime 및 기타입니다.

이 기술을 사용하면 모든 유형의 그래픽( 래스터, 벡터, 3D). 또한 오디오 및 비디오 데이터의 스트리밍 중계를 지원합니다. 특별히 모바일 기기경량으로 개발되었습니다 플래시 버전라이트.

플래시 파일의 주요 표준은 SWF 확장자입니다. Small Web Format의 약자입니다. Flash로 녹화된 동영상은 파일 확장자가 FLV, F4V입니다.

Flash의 인터랙티브 애니메이션 개발은 다음을 기반으로 합니다. 벡터 그래픽. 덕분에 멀티미디어 플랫폼에 대한 지원과 화면 해상도에 따른 애니메이션 품질의 독립성을 구현할 수 있었다.

Flash 응용 프로그램의 파일 크기는 관계없이 모든 사용자에게 동일합니다. 명세서화면 해상도).

Flash의 대화형 애니메이션은 키프레임 간에 천천히 혼합되는 모핑(벡터 유형)을 기반으로 합니다. 데이터를 재생하기 위해 플래시 플레이어가 사용되며 그 작동은 여러면에서 작업과 유사합니다. 가상 기기자바스크립트. 이 기술의 소프트웨어 구성 요소는 ActionScript 언어를 사용하여 구현됩니다.

이 기술의 단점은 다음과 같은 점을 포함합니다.

  • 무거운 짐 CPU클라이언트 머신. 이는 사용자 브라우저의 플레이어와 함께 내장된 플래시 가상 머신의 효율성이 낮기 때문입니다.
  • 높은 오류 가능성 – Flash 애니메이션을 재생하면 오류가 발생하기 쉽습니다. 또한 Flash 재생 실패는 전체 클라이언트 응용 프로그램(브라우저)의 작동에 부정적인 영향을 미칩니다. 이는 내결함성 제어가 불충분하기 때문입니다. 프로그램 코드플래시 응용 프로그램을 만들 때
  • 인덱싱할 수 없음 - 모두 텍스트 내용 Flash 컨텐츠에 표시되는 것은 인덱싱 프로세스에 참여하지 않습니다. 이 제한은 이 기술을 기반으로 하는 리소스에 특히 문제가 됩니다.

타사 플래시 생성 소프트웨어 개요

기본 사항을 시연할 프로토타입 애플리케이션으로 플래시 생성, Sothink가 가져갔습니다. SWF 더 빠르게. 많은 전문가들에 따르면 이 프로그램은 가장 이해하기 쉽고 배우기 쉽습니다.

생성 및 편집 외에도 플래시 편집기는 다른 모든 유형의 웹 애니메이션(GIF, HTML 및 기타 표준)으로 작업하는 방법을 "알고 있습니다":

설치 후 프로그램의 사용자 친화적 인 인터페이스로 이동합니다. 불행히도 인터페이스 언어 스위처의 구석구석을 헤매다가 찾지 못했습니다.

이 응용 프로그램에서 플래시 애니메이션을 만드는 방법을 이해하기 위해 기본 제공 템플릿을 사용합니다. 프로그램을 시작한 직후 템플릿에서 새로 만들기 대화 상자가 나타납니다. 또한 주 메뉴 항목 "파일"을 통해 호출할 수 있습니다. 제안된 옵션 중에서 배너 생성을 선택했습니다.

마법사의 다음 창에서 드롭다운 목록에서 애니메이션이 생성될 템플릿을 선택해야 합니다. 그 아래에는 선택한 템플릿이 재생되는 작은 프레임이 있습니다.

다음 단계에서는 배너의 크기를 설정하고 애니메이션에서 재생할 5개의 텍스트 문구를 입력해야 합니다. 또한 배너를 클릭하여 사용자를 안내할 리소스의 주소를 지정해야 합니다.

프로젝트를 컴파일하고 마법사 창을 닫으면 내장 플레이어에서 결과 비디오를 볼 수 있습니다. 이렇게 하려면 상단의 녹색 화살표를 클릭하십시오.

플레이어를 닫은 후 애플리케이션의 인터페이스를 자세히 살펴보겠습니다. 이것은 두 개의 기본 창으로 구성되어 있습니다. 상단은 비디오의 시간 간격을 편집하기 위한 것이고 하단은 일반적인 창입니다. 그래픽 편집기. 각 요소는 별도의 레이어에 있으며 사이드바에 있는 표준 도구를 사용하여 편집할 수 있습니다.

모두를 환영합니다!
그래서 요청에 따라 플래시에서 가장 간단한 애니메이션에 대한 수업을 작성하고 있습니다. 그들이 말하는 것처럼 작게 시작합시다. 그러면 더 추가할 것을 약속합니다(안쓰면 팝업으로).

플래시 MX를 엽니다.
우리 앞에는 작업 장면, 메뉴, 도구 모음 등이 있습니다. 하단에는 속성(속성)이라는 창이 있습니다. 만화에 대한 기본 설정이 있습니다(그림 1).
FRAME RATE - 만화의 스크롤 속도에 관심이 있습니다. 그렇지 않으면 12fps는 만화의 12프레임(프레임)이 1초에 재생됨을 의미합니다. 이 속도는 표준이며 원칙적으로 필요한 것입니다. 만화의 속도를 줄여야 하는 경우 감소하고 더 ​​빠르게 만들어야 하는 경우 이 수치를 높이십시오.

이제 애니메이션 자체로 넘어 갑시다.
플래시에는 모양 트위닝과 모션 트위닝의 두 가지 주요 방법이 있습니다.
첫 번째 것을 생각해 봅시다. 모양 - (영어) 모양. 여기에서 양식 변경에 대해 이야기할 것임을 이미 이해하고 있습니다. 예를 들어 파란색 사각형과 같은 특정 모양을 만듭니다. 맨 위에 첫 번째 프레임의 타임라인(타임라인)에 원이 나타납니다. 회색 배경- 키프레임(keyframe)을 생성했습니다. 이제 10번째 프레임에 동일한 프레임을 생성해 보겠습니다. 이것은 두 가지 방법으로 수행할 수 있습니다. 마우스를 10번째 프레임 위로 이동하고 클릭(프레임이 파란색으로 변함)하고 메뉴에서 선택합니다. 삽입->키프레임; 그렇지 않으면 프레임 10을 가리키고 클릭하고 F6을 누릅니다. 타임라인에서 10개의 프레임은 모두 회색입니다. 빨간 선은 우리가 어느 프레임에 있는지 보여줍니다. (그림 2)

프레임 10으로 가자. 우리는 사각형을 선택합니다(마우스를 사용하거나 ctrl + A를 눌러 - 이 키 조합은 작업 공간에 있는 모든 것을 선택합니다). 사각형을 옆으로 옮기고(10번째 프레임에 있는지 확인하세요!) 색상을 노란색으로 변경합니다. 이제 첫 번째 프레임으로 돌아가 보겠습니다. 속성 줄에는 기본 속성이 "없음"인 트윈 선택 항목이 있습니다. 즉, 애니메이션이 없습니다. "모양"으로 변경합니다. 타임라인에서 프레임은 화살표와 함께 밝은 녹색이 됩니다. 모든 것이 완료되면 "Enter"를 누르십시오. 뷰티! 사각형이 움직이고 색상도 바뀝니다! 프레임 10으로 돌아가 보겠습니다. 모두 선택(ctrl+A). 그리고 삭제 키(즉, 삭제)를 누릅니다. 사각형 대신 빨간색 원의 실을 그립니다. 첫 번째 프레임으로 돌아가 Enter 키를 누릅니다. 사각형은 이제 원과 빨간색입니다. 당신은 이미 모든 프레임을 그릴 필요가 없다는 것을 이해했습니다 - 플래시가 당신을 위해 그것을 할 것입니다! 특별한 정확성이나 무언가가 필요한 경우 그릴 수 있습니다. 그러면 파일의 크기가 커집니다. 더 필요한 경우 부드러운 전환예를 들어 원과 같이 정사각형에서 동일하게 - 10개가 아니라 25개 프레임에 대해 이 프로세스를 수행하십시오. 더 복잡한 움직임과 움직임이 필요한 경우 이를 위한 레이어 마스크가 있지만 다음 시간에는 이에 대해 설명합니다. 그림 3은 타임라인에서 애니메이션이 어떻게 보이는지 보여줍니다. 이제 간단한 모양 변경 동영상을 그릴 수 있습니다!

이제 애니메이션을 설정하는 두 번째 방법인 모션 트위닝(중간 모션 애니메이션 구축과 같은 번역)을 고려하십시오. 여기서는 조금 더 어려울 것입니다. 다시 열기 새로운 파일플러시.
모양과 움직임의 차이점은 무엇입니까? 두 번째 경우에는 양식이 아니라 기성품, 즉 기호. 캐릭터는 말하자면 플래시에서 가장 단순한 애니메이션 단위입니다. 이것은 더 일반적인 그리기 방법입니다. 우리는 모든 것을 다시 반복합니다. 첫 번째 프레임에서 작은 파란색 사각형을 그립니다. 그것을 선택하고 F8을 누르십시오(또는 순차적으로 실행: 삽입->기호로 변환). 대화 상자가 우리 앞에 나타납니다(그림 4).

그것은 무엇입니까? 플래시에는 세 가지 유형의 캐릭터가 있습니다. 무비 클립은 캐릭터 안에 있는 일종의 추가 애니메이션입니다. 즉, 이 기호에는 일종의 애니메이션 등이 포함됩니다. 메인 장면과 정확히 같은 시간 문자열을 가집니다. 버튼(버튼) - 누름, 그 위에 마우스가 있을 때 응답하는 요소 요컨대 버튼은 다음과 같습니다. 세 번째 요소인 가장 정적인 요소는 그래픽입니다. 즉, 그래픽, 일종의 이미지입니다. 우리는 후자와 함께 일할 것입니다. 우리는 그것을 무언가라고 부릅니다. "확인"을 누르십시오. 사각형에 원이 나타납니다. 그렇지 않으면 심볼의 중심이 됩니다(중심은 해당 대화 상자에서도 설정할 수 있음). 우리의 모든 기호는 라이브러리에 입력됩니다. 거기에서 우리는 그것들을 편집하고, 필요한 곳에 삽입하고, 그렇지 않은 곳에는 삭제하고, 추가할 수 있습니다. 라이브러리를 보려면 F11 키를 누르거나 창 -> 라이브러리를 수행하십시오. 10번째 프레임에서 키프레임(F6)을 생성합니다. 이제 사각형을 어딘가로 이동할 수 있습니다. 그런 다음 보이지 않게 만듭니다. 이를 위해 10번째 프레임에서 선택합니다. 속성 패널의 색상 섹션에서 알파(투명도)를 설정합니다. 퍼센트로 속성을 지정해 보겠습니다. 0. 첫 번째 프레임으로 돌아가 보겠습니다. 모양 트위닝과 동일한 모든 작업을 수행하지만 모양 대신 움직임에 주목합니다. 타임라인의 프레임이 보라색으로 바뀌고 화살표가 그림 1과 같이 프레임을 통과하여 늘어납니다. 5. 엔터를 누릅니다.

"사각형 파리" 효과를 얻습니다. 축하합니다! 플래시로 기본 그래픽을 만드는 방법을 알고 있습니다!
또 다른 중요한 기능 - 각 애니메이션에 대해 별도의 레이어(레이어)를 선택해야 합니다. 다른 레이어를 추가해야 하는 경우 삽입->레이어 명령을 사용합니다.
그리고 타임 라인에 대해 꽤 많이.
이미 이해했듯이 - 화살표가 있는 연한 녹색 - 모양 트위닝, 화살표가 있는 보라색 - 모션 트위닝. 선이 있는 연한 녹색 또는 자주색 - 애니메이션을 설정했지만 이 애니메이션을 만들 수 없습니다. 회색 - 이러한 음영이 있는 모든 프레임은 이전 키 프레임(키프레임)의 정확한 복사본입니다. 선의 흰색은 이 프레임에 아무것도 없음을 의미합니다. 검은색 원은 키프레임입니다. 흰색 원은 빈 키프레임(빈 키프레임)입니다. 글쎄, 모든 것과 마찬가지로. (그림 6)

지금은 여기까지입니다. 이것은 작업할 수 있는 최소값입니다. 다음으로 소리 추가, 소리 제어 및 Masyanya를 작성하는 방법을 배우십시오. :) 나는 플래시의 고급 애니메이션에 대해 곧 또 다른 수업을 확실히 쓸 것이라고 약속합니다. "깃털이 떨어지는" 방법, 마스크에 대해, 모양 트위닝에서 모양 변경 제어에 대해 "e. 그러면 다른 것을 씁니다.
이것이 누군가에게 도움이 되었다면 전체 FLASHER.RU 사이트에 감사를 표하십시오. 그것은 웹에서 가장 좋은 것입니다.
기쁘고 즐겁게 먹었습니다! 질문이 있는 경우 포럼을 방문하거나: [이메일 보호됨]
(с) St. Dimitryi 일명 Nirva에서 Flasher.ru로
http://flasher.ru