메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의

입문자를 위한 강좌입니다. 기본적인 개념을 모아보았습니다.

1. 플래쉬란?

오늘날 플래쉬는 멀티미디어 부분에서 해당분야 표준으로 인정받고 있습니다. '매크로미디어플래쉬플래이어'가 웹브라우저의 표준으로 인정받고 있는 것이 그 단적인 예입니다.

-마우스로 swf파일을 웹브라우저에 드래그해놓으면 플래쉬플레이어가 설치안된 컴퓨터에서도 플래쉬를 볼 수 있는 것이 그 이유입니다.

플래쉬는 그 후 액션기능이 부가 되면서 단순히 그래픽디자이너들 뿐아니라 프로그램 개발자들 사이에서도 사용되는 툴로 발전했습니다. 이러한 플래쉬의 발전과정은 플래쉬의 다양한 활동영역에 반영되었습니다.
웹사이트 뿐아니라, 카드, 애니메이션, 프리젠테이션, 영화제작('마리이야기'),게임(플레이스테이션게임의인터페이스에도 플래쉬가 사용됩니다.)등 다양한 영역에서 플래쉬를 찾을 수 있습니다.
PDA등에도 플래쉬를 볼 수 있는데 앞으로도 플래쉬는 차세대 멀티미디어로 자리를 지켜나갈 것입니다.



2.벡터이미지  VS   비트맵이미지
컴퓨터로 볼 수 있는 이미지는 벡터방식과 비트맵방식으로 표현됩니다.
벡터이미지는 플래쉬, 일러스트, 코렐드로우 등에서 사용되고 있습니다. 확장자가 EPS,DXF,SWF등인 파일입니다.
벡터방식은 확대시에도 이미지가 선명하게 보이고 용량도 작습니다. 이러한 장점으로 플래쉬 애니메이션은 더욱 작은 용량으로 압축될 수 있어서 많이 사용되게 되었습니다.



비트맵이미지는 픽셀단위로 이미지를 표현하기때문에 확대시, 격자 무늬가 나타나 이미지가 손상됩니다. 축소시 픽셀수가 모자라 상대적으로 해상도가 떨어지기 때문에 이미지가 흐리게 보입니다. 이런 단점에도 불구하고 벡터방식으로 표현하지 못하는 사진등과 같은 이미지 등은 비트맵방식이 사용되고 있습니다. 또한 벡터이미지는 웹에 바로 나타낼 수 없기 때문에 비트맵이미지로 바꾼후에 나타내야 합니다. (img 태그로 AL,EPS등의 파일을 불러올 수 없습니다.)

플래쉬에서는 기본적으로 벡터이미지를 그릴수 있으며, 외부에서 비트맵이미지도 임포트할 수 있습니다. MX에서는 디지털무비(AVI,MPEG)도 지원합니다.
ex4.gif
벡터이미지와비트맵이미지의 단적인 비교입니다.


3. 심벌
심벌은 플래쉬를 이해하기 위해서 꼭 알아두셔야 할 개념입니다.
심벌은 자주쓰는 것을 저장했다가 필요할때 불러들여서 사용하는 것을 말합니다.
심벌의 사용으로 반복적인 것을 줄일 수 있으므로 작업시간을 단축시킬 수 있으며, 용량도 줄일 수 있습니다.

예를 들어 걷는 동작을 만들 때, 팔, 다리, 몸통, 얼굴 등을 심벌로 등록시킨후에 각각의 프레임에 이 심벌들만 위치만 살짝 바꾸거나 모션을 줄 경우 gif 애니메이션보다 경이적으로 작은 용량으로 애니메이션을 만들어 낼 수 있습니다.



4. 인스턴스

오브젝트를 심벌로 등록하면 라이브러리패널에 등록이 됩니다. 이렇게 등록된 심벌은 언제든지 스테이지에 사용이 가능하고 스테이지에 배치하면 해당 심벌에 대한 인스턴스(instance)가 되며, 심벌을 수정하게 되면 인스턴스도 바뀌게 됩니다.


5. 액션스크립트란?

액션스크립트는 플래쉬의 중요한 기능중 하나로 애니메이션으로 구현하지 못하는 인터렉티브한 기능을 구현할 수 있게 해주며, 간단하게 작업을 진행시킬 수 있도록 합니다.
예를 들어 마우스의 움직임에 따라 반응하는 애니메이션등은 액션스크립트를 사용하지 않으면 만들 수 없고, 'rotate' 와 같은 명령으로 프레임을 주지 않고도 동작을 만들어 낼 수 있습니다.


6. FLA 파일과 SWF 파일의 차이

플래쉬무비를 저장하면 확장자가 fla가되고, Export Movie 시에 SWF확장자를 가지게 됩니다.

*.fla 파일은 원본파일로 무비에 사용되는 소스와 정보들을 모두 갖고 있는 파일입니다. 따라서 무비를 수정하기 위해서는 이 파일이 필요합니다.
*.swf 파일은 무비로 출력된 파일로 이를 다시 플래쉬로 불러와도 단순히 프레임으로 나열된 무비만을 보여주고 기존의 정보들은 모두 잃게 됩니다.

FlA은 나중에 소스를 수정하기 위해 보관해야하며, SWF는 실제로 웹에 올리거나 재생하는 최종 파일입니다. EXE(프로젝터)파일은 자체재생되는파일로, 플래쉬가 설치되지 않은 컴텨에서 플래쉬무비를 재생시켜줄 수 있는 파일입니다.

7.레이어의 이해

레이어는 셀 애니메이션을 생각하면 이해하기 쉽습니다. 각각의 투명한 비닐중에 물감을 칠한 부분만 빛을 반사하기 때문에 셀을 겹쳐서 한장의 이미지를 만들 수 있습니다.
예를 들어 배경은 가만히 두고 캐릭터만 바꾸면 더욱 효율적으로 동작을 만들 수 있습니다. 그리고 머리카락이나 눈, 코 등을 다른 레이어로 만들면 전체를 바꾸지 않고 그 레이어만 바꾸면 이미지를 수정할 수 있습니다.

아바타도 이런 레이어를 사용하였습니다. 사실 레이어는 플래쉬 이전부터 그래픽툴에서 사용되어진 중요한 개념입니다.


홈페이지 자료넷
번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48031
1495 초보분들을 위한 문자열 그런지스타일로 만들기. [7] file hozz호찌 2003.04.14 10749
1494 금속느낌의 메뉴버튼 만들기(www.dsme.co.kr 상단좌측메뉴) [9] file 정명주 2002.07.26 10748
1493 이미지를 찢어보고, 테이프 붙이기 [6] file 어지니 2005.02.27 10741
1492 [도트]섹쉬한 이뿌니 버젼입니다 ^^;(18금) [22] 미스디쟌 2003.01.20 10734
1491 홈페이지에 필요한 메뉴바,상단그림,배너를 퍼가세요. file 이나래 2006.03.10 10732
1490 패턴을 이용해서 이미지에 타일효과주기. [12] file rombardi 2003.04.24 10730
1489 얼렁뚱땅 돌멩이 프레임 만들기 [11] file hoosh 2003.08.14 10708
1488 포토샵이라고 메트릭스 코드 못따라하냐? 쉽게 따라하자! [18] file 9000㎒ 2003.08.01 10692
1487 아쿠아버튼 만들기 file webajama 2007.04.04 10674
1486 포샵/나모로 홈피 만들기 제 3장 [4] file 태민닷컴 2005.05.02 10665
1485 [포토샵웍스 강좌시리즈] 물방울 이미지만들기 [1] file java 2006.04.25 10654
1484 너무쉽지만 이쁜:) 가우시안 보정;ㅁ; <- 너무 쉬우니 무효! [27] file 케냐씨 2003.08.16 10644
1483 옆으로 책장 넘기기-1편 [2] file 어지니 2005.03.06 10641
1482 ★유리위를 떼구루루루... 이뿐 구슬만들기 !!★ [12] file 스니커즈 2003.03.22 10638
1481 이상한 연기 만들기 [4] file Mr.Rays 2005.02.09 10635
1480 동화같은 가을 숲(밥로스) [20] file scaci 2008.01.19 10626
1479 [Swishmax] 라벨을 이용하여 메뉴 만들기 [7] file 세나맘 2004.03.09 10616
1478 칼로 자른듯한 그림자 텍스트 [1] file 여어자 2003.05.06 10600
1477 No1. 곰돌이그리기 [7] file Wings 2002.03.24 10600
1476 [MN] 포토샵에 자주쓰는 필터 효과 주기 [8] file mewnew 2003.12.25 10577