4 부 모바일 멀티미디어 데이터 제작하기

38
무무 무무무 무무무무무 4 부 부부부 부부부부부 부부부 부부부부 4-1. 부부부부부 부부 부부부부 4-2 부부부부 부부 부부 부부 4-3 부부 SIS 부부부부부 부부부 4-4 [SIS 부부부부부 ] 부 부부부부 부부 부부부부부부부부 4-5 부부부부부 부부부부 부부부

description

4 부 모바일 멀티미디어 데이터 제작하기. 4-1. 폰페이지용 그림 제작하기 4-2 모바일용 그림 변환 하기 4-3 컬러 SIS 애니메이션 만들기 4-4 [SIS 애니메이터 ] 를 이용해서 컬러 애니매이션만들기 4-5 폰페이지에 배경음악 만들기. 4-1. 폰페이지용 그림 제작하기. 사진을 모바일 환경에 맞도록 예쁘게 자르기. ● 사진 포커스에 맞춰 크롭하자 ! - PowerPoint PPT Presentation

Transcript of 4 부 모바일 멀티미디어 데이터 제작하기

Page 1: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

4 부 모바일 멀티미디어 데이터 제작하기4 부 모바일 멀티미디어 데이터 제작하기

4-1. 폰페이지용 그림 제작하기

4-2 모바일용 그림 변환 하기

4-3 컬러 SIS 애니메이션 만들기

4-4 [SIS 애니메이터 ] 를 이용해서 컬러 애니매이션만들기

4-5 폰페이지에 배경음악 만들기

Page 2: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

4-1. 폰페이지용 그림 제작하기4-1. 폰페이지용 그림 제작하기

Page 3: 4 부 모바일 멀티미디어 데이터 제작하기

3 무선 인터넷 프로그래밍

사진을 모바일 환경에 맞도록 예쁘게 자르기사진을 모바일 환경에 맞도록 예쁘게 자르기

● 사진 포커스에 맞춰 크롭하자 ! 아주 멋진 사진이라도 눈에 잘 보이지 않으면 무용지물이겠죠 . 휴대폰의

액정은 작기 때문에 보여줄 사진도 휴대폰의 액정 환경에 알맞은 사진을 사용해야 합니다 . 예를 들어 인물의 전신사진을 휴대폰에 넣었을 경우 휴대폰으로 제대로 보일까요 . 만일 얼굴을 잘 보여 주기 위한 목적이라면 얼굴 부분을 잘라서 사용하고 동작을 보여주는 사진이라면 상반신만 담아서 꾸미는 것이 좋습니다 . 이처럼 사진에서 일부를 잘라내는 것을 크롭 (Crop) 이라고 합니다 . 포토샵과 같은 그래픽 프로그램을 이용해서 사진을 휴대폰에 알맞게 잘라서 사용하는 작업이 모바일에서는 필요합니다 .

- 전신 사진을 넣은 경우 - 상반신만 넣은 경우 - 얼굴을 클로즈업한 경우

Page 4: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

사진을 모바일 환경에 맞도록 예쁘게 자르기사진을 모바일 환경에 맞도록 예쁘게 자르기

● 휴대폰 액정 크기를 생각하자 ! 폰페이지에 사진을 넣을 경우에 항상 휴대폰의 액정 크기를 생각하도록 합니다 . 휴대폰의 액정 크기가 크다고 크기가 큰 사진을 넣을 수 있는 것은 아닙니다 . 액정이 지원하는 픽셀 수에 따라 액정 크기가 작더라도 고화질의 사진을 넓게 보여 줄 수 있습니다 . 휴대폰의 액정 크기는 컬러별 , 기종별에 따라 가지각색입니다 . 기술 발전함에 따라 화질도 선명해지고 액정의 픽셀수도 커지고 있기 때문에 신기종의 휴대폰은 더 넓은 사진을 액정에 담을 수 있습니다 . 하지만 폰페이지를 접속하는 사람들이 모두 신기종의 휴대폰으로만 접속하는 것은 아니므로 접속자의 환경을 생각해야 합니다 . 접속자의 환경을 감안할 때 보통 사진의 가로와 세로 길이를 120×50 픽셀 이내로 담는 것이 좋습니다 . 만일 좀 큰 사진이 들어가야 할 경우에는 120×90 픽셀 이내로 담습니다 . 꼭 이 수치에 맞추어야 할 필요는 없지만 대략 이정도의 수치로 만들면 대부분의 휴대폰 환경에서 문제없이 사진을 보여 줄 수 있습니다 .

-120×50 픽셀의 그림을 흑백 , 4 그레이 , 컬러폰으로 열어 본 경우

Page 5: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

사진을 모바일 환경에 맞도록 예쁘게 자르기사진을 모바일 환경에 맞도록 예쁘게 자르기● 프레임에 하나 사진이 모두 나타나게 하자 !

휴대폰의 액정은 보통 가로보다 세로 길이가 길게 제작되어 있습니다 . 그러므로 사진을 넣을 경우에도 이 점을 유의해서 제작해야 합니다 . 만일 사진의 세로 길이가 너무 길어 한 프레임에 사진을 모두 담지 못한다면 폰페이지 접속자는 방향키를 움직여서 화면을 스크롤해서 봐야 합니다 . 이러한 불편함을 줄이기 위해서 한 프레임에 사진이 모두 담기도록 제작하도록 합니다 .

- 사진이 잘려 보이는 경우 - 한 프레임에 사진 전체가 보이는 경우

Page 6: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

사진을 모바일 환경에 맞도록 예쁘게 자르기사진을 모바일 환경에 맞도록 예쁘게 자르기● 한 프레임에 하나의 사진만 넣자 !

사진 갤러리 페이지를 만들기 위해 한 페이지에 여러 장의 사진을 나열하는 경우가 있는데 이 방법은 무척 좋지 않은 방법입니다 . 앞으로 더욱 좋아지겠지만 현재 휴대폰의 전송 속도는 좋기 않기 때문에 여러 장의 사진을 담은 페이지를 불러 오려면 많은 부하가 발생하여 속도가 더디거나 접속 오류를 발생할 수 있습니다 . 그러므로 사진은 최대한 작고 한 페이지에 사진은 하나만 담도록 합니다 . 만일 여러 장의 사진을 보여주게 만들고

싶다면 한 장의 사진을 담은 페이지를 서로 링크해서 보여 주도록 합니다 .

- 그림을 넣은 페이지를 링크시켜서 꾸민 경우 - 한 페이지에 여러 장의 그림을 나열한 경우

Page 7: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

사진을 모바일 환경에 맞도록 예쁘게 자르기사진을 모바일 환경에 맞도록 예쁘게 자르기[ 예제 4-1-1] 사진 예쁘게 크롭하기 디지털카메라나 캠 등의 촬영 장비를 이용해서 촬영한 사진을 포토샵을 사용해서 폰페이지에 어울리는

크기로 조절한 다음 애니빌더에 삽입해 보겠습니다 .

다음과 같은 결과가 나옴니다 .

Page 8: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

캐릭터 그림 그리기캐릭터 그림 그리기폰페이지에 사진이 아니라 자신이 직접 그린 캐릭터를 넣으면 좀 더 재미있게 폰페이지를 꾸밀 수 있을

것입니다 . 그림을 그리는 방법에는 다음과 같은 방법이 있습니다 .

● 포토샵에서 드로잉하기 포토샵 프로그램에서 직접 그림을 그리는 방법이 있습니다 . 두께가 1 픽셀로 설정한 pen-icon.tif [Pencil Tool] 도구로 스케치합니다 . 마우스로 그리기가 여간 쉽지 않으므로 타블렛과 같은 입력장치를 이용하면 보다 편리하고 정교하게 그림을 그릴 수 있습니다 . 라인을 그릴 때는 얇은 선으로 그리고 곡선 부분에는 선 [Pencil Tool] 도구로 스케치합니다 . 마우스로 그리기가 여간 쉽지 않으므로 타블렛과 같은 입력장치를 이용하면 보다 편리하고 정교하게 그림을 그릴 수 있습니다 . 라인을 그릴 때는 가급적 터진 곳이 없도록 그리도록 합시다 .

Page 9: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

캐릭터 그림 그리기캐릭터 그림 그리기● 스캔해서 그리기

포토샵으로 펜슬 도구를 이용해서 직접 그리는 것이 어렵다면 종이에 스케치한 후 스케치한 종이를 스캐너를 이용해서 스캔하는 방법을 이용합니다 . 스캔한 이미지는 라인이 거칠므로 위에 라인을 다시 그리는 것이 좋습니다 . 레이어를 하나 만든 후 펜슬 도구를 이용해서 라인 위에 새롭게 라인을 그립니다 . 그런 다음 스캔 이미지가 있는 레이어를 삭제하면 새로운 스케치가 만들어 집니다 . 라인이 그려진 영역에 색을 채웁니다 . 이 방법은 실제로 디자이너들이 많이 이용합니다 . 라인을

새롭게 그리는 것이 어려울 경우에는 스캔 이미지를 깔끔하도록 보정한 다음 색을 덧칠해줍니다 .

- 스캔하기 - 종이에 스케치하기 - 보정하기

Page 10: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

캐릭터 그림 그리기캐릭터 그림 그리기 [ 예제 4-1-2] 캐릭터 그리기

폰페이지에 넣을 그림을 종이에 스케치한 다음 스캐너를 이용해서 그림을 스캔하여 그림을 만들어 보겠습니다 . 스캐너가 없다면 포토샵에서 바로 라인을 그린 후 작업하도록 합니다 .

Page 11: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

4-2. 모바일용 그림 변환하기4-2. 모바일용 그림 변환하기

Page 12: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

그림 변환에 대해서그림 변환에 대해서

애니빌더는 문서에 삽입된 그림을 [소스생성하기 ] 를 통해 2 컬러의 모바일 이미지 형식으로 변환해주고 [ 이미지 변환 ] 을 통해 256색의 모바일 형식으로 이미지를 변환하여 [imagees] 폴더에 색상별 , 이미지 형식별로 변환해서 만들어 줍니다 . 그러나 4 컬러의 nbmp 과 sis 그림 형식은 변환이 안되므로 그림 변환 프로그램을 이용해서 하나하나 작업을 해주어야 합니다 . [images] 폴더에는 문서에 삽입한 원본 그림들이 저장되어 있는데 이곳에 있는 그림을 변환 프로그램을 사용해서 변환한 후 변환된 그림을 해당 폴더에 넣어 주어야 합니다 . 만일 4 컬러의 nbmp 그림을 제작했다면 변환된 그림 파일을 [images>4c>nbmp] 폴더에 넣어주면 됩니다 . 단 파일 이름으로 원본 그림 파일의 이름과 동일하게 설정해주어야만 문서에서 그림을 불러 올 때 그림을 찾을 수 있습니다 .

Page 13: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

[nbmp converter1.1] 프로그램 살펴보기[nbmp converter1.1] 프로그램 살펴보기[nbmp converter1.1] 는 bmp, gif 그림을 흑백 또는 2 컬러 또는 4 컬러의 nbmp 그림 형식으로 변환해주는

프로그램입니다 . ???에서 프로그램을 다운로드받은 후 [nbmp4gray.exe] 파일을 더블클릭하면 프로그램이 실행됩니다 . 변환할 그림을 불러 온 후 화질을 조절하고 저장을 하면 원본 그림이 있는 폴더에 nbmp 그림이 저장됩니다 . 변환된 그림 파일은 4 컬러 폴더인 [images>4c>nbmp] 폴더에 넣어줍니다 . 만일 원본 그림 파일이 bmp 또는 gif 형식이 아니어서 그림을 불러 올 수 없다면 [ 이미지 변환 ] 을 통해 만들어진 [images>256c>bmp] 폴더에서 bmp 그림을 불러와서 작업해줍니다 .

불러 온 그림의 정보를 보여줍니다 .

그림의 너비와 높이를 설정

그림의 너비와 높이 비율을 유지

그림 색상을 선택 . 흑백은 [B/W], 4grey는 [4grey]을 선택

그림의 압축율을 보여줌

수정된 그림의 정보를 보여줍니다 .

그림을 nbmp 그림형식으로 변환

그림 삽입 소스를 복사

Page 14: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

[nbmp converter1.1] 프로그램 살펴보기[nbmp converter1.1] 프로그램 살펴보기[Output Image] 폴더에서 그림 하단에 있는 게이지를 조절하면 화질이 바뀝니다 . 게이지를 오른쪽으로

움직이면 그림이 밝아지고 그림이 흐리게 표시되고 왼쪽으로 이동될수록 그림이 어두워집니다 . 그러므로 가장 적당한 화질을 선택합니다 .

B/W 화질 조절

4Grey 화질 조절

Page 15: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

[nbmp converter1.1] 프로그램 살펴보기[nbmp converter1.1] 프로그램 살펴보기[ 예제 4-2-1] 4 가지색 nbmp 그림 변환하기 여기서는 [nbmp converter1.1] 을 사용해서 폰페이지에 사용된 그림들을 nbmp 그림 형식으로

변환해보도록 하겠습니다 . [generate] 를 실행하면 폰페이지에 사용된 그림들은 [images] 폴더에 안에 색상과 종류별로 구분된 위치로 저장됩니다 . 4grey 그림들이 저장되는 [images\4c] 폴더에는 그림들이 없으므로 [images] 폴더에 있는 원본 그림들을 변환해서 [images\4c\nbmp] 폴더에 저장해보도록 하겠습니다 .

Page 16: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

GIF 애니메이터 GIF 애니메이터

● 폰페이지에서 GIF 애니메이션의 특징

▶ GIF는 파일크기가 크다 !

GIF는 017, 018 휴대폰에서 사용되는 이미지 형식 중 하나로서 흑백 뿐만 아니라 컬러를 지원할 뿐만 아니라 움직이는 애니메이션을 만들 수 있다는 특징을 가지고 있습니다 . 이 기능을 이용하면 SIS 그림 형식과 함께 폰페이지에 움직이는 이미지 효과를 줄 수 있습니다 . 단점이 있다면 SIS 는 모바일용 그림 형식으로 파일 크기가 작지만 GIF는 무척 크기 때문에 프레임의 수를 많이 사용하여 그림 파일 크기가 커지며 휴대폰에서 제대로 동작되지 않을 수 있습니다 . 그러므로 GIF 애니메이션을 사용할 경우에는 가급적 그림 크기는 최대한 작게 프레임 수는 적게 사용해서 그림 파일 크기를 최대한 줄이도록 합니다 .

Page 17: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

GIF 애니메이터GIF 애니메이터

▶[ 이미지 변환 ] 작업 이후에 GIF 애니메이션으로 대체해라 !

GIF 애니메이션으로 제작한 그림을 폰페이지에 삽입한 후 [소스생성하기 ] 와 [ 이미지 변환 ] 작업을 하면 GIF 애니메이션에서 첫 프레임의 정지 화상으로 변환됩니다 . 그러므로 애니빌더에서 GIF 애니메이션으로 사용할 첫 프레임의 그림을 불러와서 [소스생성하기 ] 와 [ 이미지 변환 ] 작업을 하여 작업한 후 GFI 애니메이션 파일을 [images>256c>gif] 폴더에 첫 프레임 그림과 같은 파일이름으로 복사해서 넣어 주도록 합니다 . 4 가지 색으로 제작한 애니메이션은 [images>4c>gif] 폴더에 넣어 줍니다 .

Page 18: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

GIF 애니메이터GIF 애니메이터

●GIF 애니메이션 프로그램

GIF 애니메이션 프로그램이란 GIF 애니메이션을 제작해주는 프로그램으로 움직임에 사용되는 각각의 이미지를 프레임별로 설정한 후 하나의 파일로 만들어 줍니다 . 대표적인 GFI 애니메이션 프로그램으로는 [ 알 GIF], [AniGIF], [Photoshop] 에 포함되어 있는 [ImageReady], [Paintshop pro] 에 포함되어 있는 [Animation Shop] 등이 있습니다 . 여기서는 알집으로 유명한 [ 이스트 소프트 ] 에서 제작한 [ 알 GIF] 를 사용해보도록 하겠습니다 . 이 프로그램은 ALTOOLS 홈페이지 (http://www.altools.com) 에 접속해서 [ 알 GIF] 프로그램을 무료로 다운로드 받을 수 있습니다 .

Page 19: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

GIF 애니메이터GIF 애니메이터

이전단계로 돌리기

새문서열기

그림파일열기

작업한 GIF 애니메이션을 저장합니다 .

작업한 GIF 애니메이션을 웹브라우저로 실행합니다 .애니메이션창 :작업한 GIF애니메이션을 미리보여줍니다 .

도구창 :외부 프로그램을 등록하고 실행하게 해줍니다 .

작업화면 :문서에 추가한 그림을 프레임별로 보여줍니다 .

Page 20: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

GIF 애니메이터GIF 애니메이터[ 예제 4-2-2]GIF 애니메이션 만들기 알 GIF 프로그램을 사용해서 두 개의 프레임으로 움직이는 애니메이션을 만들어 보고 제작한 GIF

애니메이션을 애니빌더에 삽입해서 꾸며 보겠습니다 .

Page 21: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

흑백 SIS 애니메이션 만들기 흑백 SIS 애니메이션 만들기

● 흑백 SIS 애니메이션에 대해서

SIS 는 모든 휴대폰에서 지원되는 대표적인 애니메이션을 지원해주는 형식입니다 . SIS 형식은 PC 에서 지원되는 형식이 아니므로 SIS 저작툴을 이용해서 제작해주어야 하는데 SIS 저작툴은 사업자에게만 제공되는 프로그램으로 일반 사용자는 접하기 어렵습니다 . 대신 3 개의 흑백 이미지로 애니메이션을 만들 수 있는 흑백 SIS 저작툴은 일반 사용자도 이용할 수 있습니다 .

애니빌더에서 흑백 SIS 파일을 등록하려면 [ 그림 ] 등록정보에 있는 [ 캐릭터 ] 모드를 이용해야만 사용이 가능합니다 . [ 캐릭터 ] 모드는 컬러별 , 그림 형식별로 그림을 각각 선택해서 설정해줍니다 . [ 캐릭터 ] 모드를 사용하지 않으려면 애니메이션에 사용한 하나의 프레임의 그림을 이용해서 폰페이지에 등록한 다음 폰페이지 제작을 완료해서 [소스생성하기 ] 와 [ 이미지 변환 ] 을 실행한 다음 윈도우 탐색기를 열고 SIS 애니메이션 원본파일을 [images>2c>sis] 폴더에 복사해서 넣어 줍니다 . 단 SIS 애니메이션의 파일 이름은 애니빌더에 삽입한 파일의 이름과 같은 이름으로 복사해주어야 합니다 .

Page 22: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

흑백 SIS 애니메이션 만들기흑백 SIS 애니메이션 만들기[ 흑백 SIS 저작툴 ] 프로그램의 3 개의 그림을 불러와서 SIS 그림 형식으로 만들어 주는

프로그램입니다 . 이 프로그램은 흑백의 비트맵 그림 (*.bmp) 만 사용이 가능하므로 애니메이션에 사용할 그림을 포토샵과 같은 그래픽 프로그램을 사용해서 bitmap 모드로 변경해서 저장해야 사용이 가능합니다 .

저장 :제작한 애니메이션을 SIS그림형식으로저장

Start:애니메이션 실행

Stop:애니메이션을 정지

선택한 프레임을 보여줍니다 .

열기 :애니메이션에 사용할 그림을 불러오기

프레임편집 :그림을 오른쪽클릭하면 편집메뉴가 나타남 .

Insert:그림을 추가

Delete:선택한 그림 삭제

Copy:선택한 그림 클립보드에저장

Cut:선택한 그림을 클립보드에서 저장한후 잘라내기

Paste:클립보드에 저장한 그림을 붙여넣기

Page 23: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

4-3. 컬러 SIS 애니메이션 만들기4-3. 컬러 SIS 애니메이션 만들기

Page 24: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 에 대하여SIS 에 대하여

SIS(Simple Image Service)란 네오엠텔에서 개발한 모바일 애니메이션 이미지 포맷 기술입니다 . 국내 3 사 및 해외에서 많은 업체들이 SIS 를 기본 이미지 포맷으로 채택되어 사용하고 있을 정도로 많은 사용자를 가지고 있습니다 . SIS의 특징은 GIF 애니메이션보다 파일 크기가 작으며 빠른 속도로 로딩 해주어 모바일 환경에 최적화되어 있다는 점입니다 . 포토샵과 같은 레이어 기술을 이용하여 작은 파일 크기를 작게 줄일 수 있으므로 전송속도가 느린 모바일 환경에서 최적의 효과를 발휘합니다 . 여러분의 휴대폰 첫 화면에 보이는 움직이는 애니메이션의 대부분이 바로 SIS 로 제작된 이미지입니다 . SIS 의 종류 SIS 는 흑백과 4 가지색 및 256 가지 색을 표현할 수 있습니다 . SIS 는 이외에 몇 가지 다른 파일 형식 이름을 제공합니다 .

- RLA : 초기 컬러 핸드폰에서 쓰이던 SIS 포맷으로 , 핸드폰 LCD의 256 Color 만 표현이 가능합니다 . - MLZ : RLA의 느린 속도를 개선하고 압축률을 높인 방식으로 고화질의 컬러를 제공합니다 .

Page 25: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 에 대하여SIS 에 대하여

Page 26: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

애니빌더 WX 스페셜 버전에 탑재되어 있는 SIS 애니메이터 프로그램인 [AnySIS] 프로그램에 대해서 살펴 보겠습니다 .

● [AnySIS] 란

SIS 애니메이션을 제작해주는 프로그램은 네오엠텔사의 [SIS Animator] 프로그램이 있습니다 . 그러나 이 프로그램은 개발자에게 배포되는 프로그램으로 일반인들은 접하기 어렵습니다 . 대신 애니빌더 WX 스페셜 버전에는 손쉽게 SIS 애니메이션을 만들어 주는 [AnySIS] 프로그램을 탑재하여 일반인들도 SIS 제작을 접할 수 있도록 했습니다 . 네오엠텔의 SIS Animator 의 기능을 축약해놓은 프로그램으로 레이어를 이용한 다양한 편집은 불가능하지만 최대 128×128 픽셀 크기의 그림들을 이용한 애니메이션 및 간단한 이미지 효과를 연출할 수 있습니다 .

SIS 를 손쉽게 만들어 주는 [AnySIS] SIS 를 손쉽게 만들어 주는 [AnySIS]

Page 27: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]불러온 그림 정보 불러 온 그림의 색상 정보를

설정

새 애니메이션 만들기

메션

애니메이션에 등록할 그림 불러오기

작업한 내용을 SIS형식으로 저장

작업한 애니메이션 보여주기

미리보기 색상을 선택하거나 애니메이션 동작 제어

애니메이션에 사용된 프레임수와 속도표시

애니메이션에 사용되는 프레임을 보여줌

배율 :불러온그림의 배율을 조절

효과 :불러온 그림에 효과를지정

Page 28: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]

원본 양각 음화 버튼 상하뒤집기

볼록거울 TEXT삽입좌우뒤집기 옛날사진

Page 29: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 옵션 : SIS 저장 환경을 설정합니다 .

․ 컬러별로 그림의 크기를 설정합니다 . ․ 프레임 간의 움직이는 시간을 1/10초 단위로 입력합니다 . ․ 변환위치 : [Anybuiler 2003] 을 선택하면 [ 그림 ] 도구 캐릭터 항목에 그림이 등록되고 [ 사용자지정 ] 을 선택하면

지정된 폴더에 그림을 저장합니다 . ․ 폴더지정 : 원본 이미지 위치와 저장할 이미지 위치를 지정합니다 .

- 프레임 등록 : 불러 온 그림을 프레임에 등록합니다 . - 선택한 프레임을 삭제하거나 모든 프레임을 삭제합니다 .

Page 30: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]●[AnySIS] 로 프레임 관리하기

프레임에 등록한 그림의 위치를 이동하거나 삭제하는 방법에 대해서 알아 보겠습니다 .

▼ 프레임 위치 이동 이동할 프레임을 이동하고 싶은 프레임까지 마우스로 드래그합니다 .

프레임 이동전

프레임 이동후

Page 31: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]

▼프레임 삭제하기

삭제하고 싶은 프레임을 [ 휴지통 ] 아이콘까지 마우스로 드래그합니다 . [ 휴지통 ] 아이콘만 클릭하면 프레임에 등록되어 있는 사진들로 모두 삭제됩니다 .

드래그 프레임 삭제전

프레임 삭제

Page 32: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]

● 애니빌더에 SIS 추가하기

[AnySIS] 로 제작한 결과는 [anychars] 폴더에 컬러별 , 확장자 별로 구분되어

저장됩니다 . SIS, RLZ, MLZ의 SIS 형식 그림과 WBMP 파일을 함께 만들어

줍니다 . 저장된 파일을 애니빌더를 이용해서 문서에 삽입하려면 크게 두 가지

방법이 있습니다 . [AnySIS] 에서 제작한 그림을 [ 그림 ] 도구 등록정보의 [

캐릭터 ] 항목 리스트에 자동 추가해서 만드는 방법과 [ 캐릭터 ] 항목에 [ 추

가 ] 를 실행하여 해당 그림들을 하나하나 선택해서 등록하는 방법이 있습니다 .

SIS 는 대부분의 휴대폰에서 모두 지원하므로 다른 그림 형식을 이용할 필요는

없지만 SIS 를 지원하지 않는 구형 휴대폰을 위해 BMP 그림 파일과 GIF 그림

파일을 등록하는 것이 좋습니다 .

Page 33: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]

[ 예제 4-3-1] SIS 그림을 애니빌더에 자동추가하기

Page 34: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]

[ 예제 4-3-2] 캐릭터 항목에 SIS 애니메이션 등록하기

Page 35: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

SIS 를 손쉽게 만들어 주는 [AnySIS]SIS 를 손쉽게 만들어 주는 [AnySIS]

[ 예제 4-3-3] 그림 편집해서 재미있는 SIS 애니메이션 만들기

Page 36: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

정지 화상 SIS 만들기 정지 화상 SIS 만들기 SIS 는 애니메이션 뿐만 아니라 정지화상도 만들 수 있습니다 . [AnySIS] 를

이용하면 여러 장의 그림을 컬러 SIS 형식으로 변환할 수 있습니다 .

● 그림 폴더 모두 변환하기

[AnySIS] 프로그램에서 [파일 >다중 선택 변환 ] 메뉴를 실행하면 열리는 [폴더 찾아보기 ] 대화상자에서 변환할 bmp 그림 파일이 있는 폴더를 선택합니다 . [ 다중 선택 변환 ] 대화상자가 열리면 [ 변환시작 ] 단추를 클릭해서 폴더에 있는 그림을 모두 SIS 형식으로 변환합니다 . 이때 그림의 크기는 가로 길이와 세로 길이가 모두 8의 배수가 되어야 합니다 . 만일 8의 배수가 아니면 SIS 그림 파일로 변환되지 않습니다 .

Page 37: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

정지 화상 SIS 만들기정지 화상 SIS 만들기

[ 다중 선택 변환 ] 대화상자

● 그림 선택해서 변환하기 [AnySIS] 프로그램에서 [ 불러오기 ] 단추를 클릭하면 나타나는 [ 열기 ] 대화상자에서 [Ctrl] 키를 누른 상태로 변환할 그림을 다중 선택합니다 . [ 열기 ] 단추를 클릭하면 열리는 [ 다중 선택 변환 ] 대화상자를 이용해서 선택한 그림을 SIS 그림 형식으로 변경할 수 있습니다 .

Page 38: 4 부 모바일 멀티미디어 데이터 제작하기

무선 인터넷 프로그래밍

정지 화상 SIS 만들기정지 화상 SIS 만들기

[ 예제 4-3-4] BMP 그림을 SIS 그림 형식으로 변환하기 [AnySIS] 를 사용해서 정지화상의 그림을 SIS 그림 형식으로 만들어 보겠습니다 . 우리나라 통신사에서는 모두 SIS 그림

형식을 지원하므로 SIS 그림 파일이 있다면 특별하게 다른 그림 형식을 변환하지 않아도 됩니다 .