스크래치 : Ball sumulation

만유인력의 법칙이 적용되는 지구상에서 공이 떨어지거나, 차거나, 던지거나 할 때 그 움직임을 적용한 공 시뮬레이션을 만들어 봅시다. 우리가 만들 빨간색 공이 화면에 나오면  왼쪽 화살표키 또는 오른쪽화살표키로 공을 좌우로 움직일 수 있으며 위쪽화살표키를 눌러 하늘쪽으로 던질 수 도 있게 할 것입니다.  또한 벽이나 바닥에 닿으면 튀겨지기도 할 것 입니다.

제일 먼저 스크래치를 열고 고양이 스프라이트를 지운 후 이라는 이름으로 스프라이트를 생성합니다. 그리고 모양창에서 벡터모드로 전환 한 후 1600%로 확대한 화면에서 작업합니다.

위의 그림처럼 빨간공을 그려줍니다. 가로로 4칸, 세로로 4칸 크기로 원을 그립니다. 이때 유의할 것은 반드시 공이 정 가운데 위치하도록 그려주어야 합니다. 모양중심설정하기를 이용하면 도움이 됩니다.
이것으로 공의 모양이 완성되었습니다.

이제 스크립트창으로 가서 가장먼저 데이터를 생성합니다. 모든스프라이트에서 사용 옵션을 체크합니다.  생성할 데이터는 다음과 같습니다.

  • 속도x
  •  속도y
  •  마찰계수
  •  중력가속도
  •  킥가속도x
  •  킥가속도y

생성한 데이터의 초기값을 설정합니다.  공이 움직일 때 가로방향 속도와 세로방향 속도를 따로 따로 고려할 것이므로, 속도x 와 속도y를 두어  공의 현재 속도값을 저장하도록 하겠습니다. 마찰계수는 공기저항을 의미하는 값으로  1 보다 작은 값으로 설정합니다. 중력가속도는 공중에 있는 공이 땅에 떨어지는 빠르기를 설정하는 값입니다. 값은 음수 이어야 하며 절대값이 클 수로 빠르게 떨어집니다. 킥가속도x는 좌우화살표키를 눌러 공을 움직일 때 추가되는 속도입니다. 킥가속도y는 위쪽화살표키를 눌러 위로 쏘아 올릴 때 공의 속도 입니다.

변수 초기값을 설정하고 위와 같이 코드블럭을 완성합니다. 무한 반복하기 안에 삽입될 코드 블럭은 아래와 같습니다.

첫번째 만약블럭은 공이 스크린 왼쪽과 오른쪽 벽에 부딛히면 튕겨지도록 하기 위함입니다.  두번째 만약블럭은 천장과 바닥 벽에 부딛히며 튕겨지도록 하기 위함입니다.

세번째 만약블럭은 공을 오른쪽으로 움직이게 하기 위한 코드이고 네번째 만약블럭은 왼쪽으로 움직이게 하기 위함 입니다.

그 밑의 두개의 블럭은 속도x 속도y가 공기중 마찰계수로 속도가 느려짐을 계산하는 블럭입니다.

마지막 두개의 블럭은 지금까지 계산된 속도로 공을 움직이는 코드입니다.  이렇게 완성된 코드블럭을 무한 반복하기 안에 삽입합니다.

여기까지 완성한 다음 깃발을 클릭하여 코드를 실행해 봅니다. 만약 제대로 되었다면 좌우화살표키를 이용하여 공을 움직일 수 있을 것입니다.  이제 공을 위로 던지기 위한 코드를 아래와 같이 완성합시다. 위 그림과 같이 완성한 후 추가되어짐을 유의하세요.

공이 파란색에 닿거나 바닥에 닿으면 튕겨져야 하고 그렇지 않으면 중력가속도의 영향을 받아 아래로 떨어져야합니다.  여기서 파란색은 배경안에 그려넣을 땅의 색입니다. (물론 파란색이 아니어도 됩니다.)

한편 공이 땅에 닿아 있는 상황에서만 위로 쏘아 올릴 수 있도록 하였습니다. (만약 위쪽 화살표 키가 눌려지면 속도y의 값을 킥가속도y로 정하기)

여기까지 작성한 후 깃발을 클릭하여 코드를 실행하면 이제 바닥에 공이 닿아 있을 때 위쪽화살표키를 눌러 위로 쏘아 올리 수 있습니다. 쏘아진 공의 최대 속도는 10 입니다.

이 코드를 작성할 때 정하기와 바꾸기를 혼돈하는 경우가 많습니다. 각별히 유의하여 작성하영여야 합니다.

스크레치 – 바이러스 게임

현미경을 보고 있노라면 혹시 미생물들이 꿈틀거리는 광경을 보게 될 지도 모릅니다. 만일 바이러스를 볼 수 있는 현미경으로 관찰 할 수 있다면 어쩌면 우리가 이제 만들 게임처럼 보일 지도 모를 일입니다. 우리가 만들 '바이러스 게임'은 바이러스들 만 참여합니다. 3종류의 바이러스가 제한된 공간 안에서 서로의 생존 게임을 펼치게 됩니다. 게임을 실행할 때 마다 승리하는 바이러스가 달라 지겠지요. 바이러스는 모두 3종류입니다. 각각, 바이러스R, 바이러스B, 바이러스G 으로 명명된 바이러스들이 모두 다음과 같은 규칙으로 살아갑니다.

  • 같은 바이러스끼리 만나면 각자 2세를 생산한다.
  • 상급 바이러스를 만나면 죽는다. 그런데 바이러스R 의 상급은 바이러스B, 바이러스B의 상급은 바이러스G, 바이러스G의 상급은 바이러스R 이다.

게임의환경은 다음과 같은 규칙에 따릅니다.

  • 게임의 시작에서는 바이러스 종류마다 각 10마리씩 채워진다.
  • 어떤 한 종류의 바이러스 개체수가 5마리 보다 적어지면 10마리를 추가로 채운다.
  • 어떤 한 종류의 바이러스 개체수가 50마리 보다 많아지면 2세를 생산한 바이러스는 죽는다.

과연 어떤 바이러스가 생존게임에서 승리할 까요? 이제부터 흥미 진진한 이 게임을 만들어 보겠습니다.

가장 먼저 할 일은 스프라이트를 생성하는 일 입니다. 고양이 아이콘에 마우스를 올려 놓으면 그리기메뉴를 선택할 수 있습니다.

스프라이트의 이름을 각각 '바이러스R',  '바이러스B',  '바이러스G'로 모두 3개의 스프라이트를 만들어 주세요.

스프라이트 모양은 그림 처럼 작은 동그라미입니다. 그런데 동그라미의 색깔이 각각 달라야 합니다. 바이러스R을 빨간색으로 바이러스B는 파란색으로 바이러스G는 초록색으로 만듭니다.

이제 스프라이트의 모양 완료되었으면 코드를 편집합시다. 먼저 바이러스R의 코드를 만들겠습니다.

가장먼저 변수만들기를 클릭하여 그림처럼 3개의 변수를 만들어야 합니다. 각각은 해당 바이러스 개체수를 저장합니다.

변수를 만들 때는 '모든 스프라이트에서 사용' 옵션을 선택해 주세요.

깃발을 클릭하면 바이러스의 모양은 보이지 않게 됩니다.  변수 red를 0으로 초기화 합니다.  아직 바이러스가 존재하지 않기 때문입니다. 그리고 바로 10개의 나자신(바이러스R)을 복제하게 됩니다. 비로소 10개의 바이러스가 화면에 보여지게 될 것입니다. 나 자신은 위치를 바꾸어 가며 복제하는데, 그 순간 복제된 바이러스R이 모습을 드러내기 때문입니다.  10개의 나 자신 복제 조건으로 개체수가 5개 보다 적어야 합니다. 게임을 시작하는 순간에는 개체수가 0개 이므로 당연히 나 자신을 복제하겠지요.

복제가 된 순간 변수 red를 1증가 시켜 개체수를 기록합니다. 복제된 바이러스는 화면에 나타나고 게임에 참가하게 됩니다. 처음 1초 동안에는 화면에 임의의 위치로 이동하여 갓 태어난 바이러스임을 알립니다. 그리고 자신의 일생을 살아가게 됩니다. (무한 반복하기 내부. 이후 이 부분에 코드가 추가 됩니다.)

여기까지 작성하고 깃발을 클릭하여 코드를 실행해 보면 빨간 바이러스 10마리가 화면에 나타나 꼬물꼬물 거리는 것을 볼 수가 있습니다.

바이러스B(파란색 바이러스)는 상위 바이러스이므로 만나면 죽습니다.  죽는다는 것은 해당 복제본을 삭제하는 것으로 구현할 수 있습니다. 다만 삭제하기 전에 개체수가 하나 감소했다는 사실을 기록하기 위해 변수 red 의 값을 하나 줄여주어야 합니다.

같은 종류의 바이러스(바이러스R)을 만나면 2세를 생산(나 자신 복제)해야 합니다.  복제후 임의의 방향으로 20만큼 옮겨 방금 2세를 생산했음을 알리도록 합니다. 

그런데 단 조건이 하나 있습니다. 만일 개체수가 50 초과 상태일 때는 2세를 생산 후 자신은 죽게되어 있습니다.  동일 개체수 과잉일 경우, 일종의 자동 개체수 조정 매커니즘인 것입니다.

 

결국 복제본이 살아가게 되는 일생의 코드는 그림과 같이 무한 반복 루프 내부가 됩니다.

이제 완성된 바이러스R 코드를 그대로 바이러스 B 로 복사합니다. 이를 위해 코드블럭을 바이러스B 스프라이트로 드래그 합니다.  이 경우에서는 두개의 코드블럭 덩어리만 드래그 하면 됩니다.  복사된 코드 가운데 수정할 부분이 있는데 단지, 변수 red는 변수 blue로 빨간색은 파란색으로 그리고 파란색은 초록색으로 바꾸어 주기만 하면됩니다.

같은 방법으로 바이러스 B의 코드를 바이러스G로 드래그 복사 한 후 코드를 수정합니다. 이 때도 변수 blue는 변수 green 으로 바꾸고, 파란색은 초록색으로 초록색은 빨간색으로 수정하면 됩니다.

코드가 에러없이 수정되었으면 깃발을 클릭하여 게임을 시작합니다.

스크래치 – 랜덤나무 만들기

나무기둥에서 두개의 가지가 생기고 각각의 가지에서 또 다시 두개의 가지가 생기는 프로그램을 만들어 봅시다. 새로생기는 가지의 길이, 가지가 벌어지는 각도 등을 무작위로 바꾸어 가면 프로그램을 실행 할 때 마다 만들어지는 나무의 모양이 달라질 것입니다.

[siteorigin_widget class="SiteOrigin_Widget_Image_Widget"][/siteorigin_widget]

가장 먼저 할 일은 배경을 만드는 일 입니다. 초록 대지에서 푸른 하늘까지 그라데이션으로 화면을 가득 채웁시다. 이것은 비트맵모드에서 시작하는 것이 좋겠습니다.

[siteorigin_widget class="SiteOrigin_Widget_Image_Widget"][/siteorigin_widget]
이제 벡터모드로 변경한다음,

동그란 노란 불빛을 그립니다. 원을 그리되 가운데 노란색이 투명색으로 퍼져나가는 그라데인션을 채워 주세요.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

동그란 불빛은 하늘에서 온 해빛이 공기에 산란하면서 퍼지는 빛 덩어리 입니다. 그러므로 그림처럼 크기를 크게하여 배치하세요.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

이제 드로잉펜 이라는 이름을 가진 스프라이트를 생성합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

드로잉펜 스프라이트는 모양이 없습니다.

가장 먼저 3개의 데이터를 생성해 주세요. 바로 스크립트 창에서 그림과 같이 각도, 길이, 축소비율 이라는 이름의 데이터를 만듭니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

그리고 그에 따른 코딩블럭을 그림과 같이 만들어 주세요.  각각의 코딩 블럭들은 같은 색깔의 주제를 따라 가면 찾을 수 있습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

앞에서 만든 코딩블럭을 시작으로 블럭들을 추가하여 그림처럼 완성합니다. 펜내리기 이후 스프라이트가 움직이면 그대로 그림이 됩니다. 길이만큼 움직이기 명령으로 인해 나무기둥이 그려집니다. 이 코드블럭을 해석해 보고 어떻게 나무 기둥이 그려졌는지 이해하길 바랍니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

그려진 나무기둥은 그림과 같습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

나무기둥에서 두개의 가지가 뻗어 가고 또 각각의 가지에서 두개씩의 새로운 가지가 뻗어가는 과정을 여러번 반복 할 수 있도록 하기위해 길이만큼 움직이기 라는 코딩블럭을 빼고 가지치기 방송하고 기다리기 로 대치합니다. 방송 문자열은 마음대로 정할 수 있습니다. 가지치기 라는 문자열 대신 가지만들기 로 정해도 됩니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

그리고 그림과 같은 코딩을 새로 추가합니다. 이 코딩은 가지치기 방송이 나오면 실행하는 것으로, 가지를 일단 그린 후 그 끝에 새로운 가지 두개를 그릴 준비를 하는 것입니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

완성된 코드는 그림과 같습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

실행한 화면입니다. 예쁜 나무가 만들어 졌습니다. 실행 할 때 마다 새로운 나무가 생성되니 마음에 들지 않는 나무가 나타났어도 걱정 마세요. 새로 실행하면 됩니다. 만일 실행결과 의 화면이 그림과 너무 다르다면 코딩블럭이 잘못 만들어 진것입니다. 특히 .. 만큼 정하기 인데 ..만큼 바꾸기 로 되어있지 않나 확인하세요.

스크레치3.0 슬라이드쇼 만들기

슬라이드쇼는 여러장의 사진이 스스로 나타났다 사라지면서 보여지는 일종의 영상물같은 것 입니다. 사진이 서서히 나타나거나 또는 움직이면서 나타나거나 하는 등 특수효과들이 사용되기도 하고,  배경음악을 사용하여 분위기를 돋구기도 합니다.  스크레치로 슬라이드쇼를 만들어 봅시다.

먼저, 보여줄 사진을 준비합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

좀더 자세히 보여줄 사진이 있으면 그 사진의 일부를 잘라 새로운 사진으로 만듭니다. 사진을 자를 때는 스크레치가 아닌 다른 프로그램을 사용해야 합니다. 그림판이라는 프로그램을 사용해도 됩니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

스크레치에서 처음 시작할 때 기본적으로 존재하는 스프라이트를 삭제하고 새로운 스프라이트를 만듭니다. 이때 스프라이트의 이름을 사진으로 합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

모양편집창에서 사진을 모양으로 대체하기 위해 모양 업로드하기를 선택합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

창이 열리면 사진이 있는 폴더로 이동하여 한장의 사진을 선택합니다. 그러면 그 사진이 모양으로 대체됩니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

위와 같은 과정을 반복하여 준비된 사진을 모두 모양으로 업로드합니다. 모양이름은 자동적으로 사진이름으로 정해집니다. 이 예제에서는 모두 36장의 사진이 사용되었습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

이제 배경음악을 선택하기 위해 소리편집창으로 이동합니다. 기본으로 존재하는 pop이라는 소리는 삭제하고 소리고르기를 선택합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

많은 소리가 저장되어 있습니다만, Loops로 분류된 소리중 Danse Sna…를 선택합니다. 물론, 직접 들어보고 마음에 드는 다른 소리를 선택해도 됩니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

이제 본격적으로 슬라이드쇼를 만들기 위해  코드편집창으로 이동합니다.  그리고 그림과 같은 블록들을 찾아 서로 연결하여 줍니다. 농촌풍경은 이 예제에서 첫번째 올린 사진의 모양이름입니다. 이 코드를 해석하자면, 1초마다 사진을 바꾸기를 무한히 반복하라는 뜻입니다.  코드를 실행하기 위해서는 코드를 클릭하세요

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

크기가 서서히 확대되어지는 기능을 추가하기 위해 코드를 바꿉니다. 여기서 크기를 1만큼 바꾸기는 크기를 1%더 증가하라는 뜻입니다.  이 코드에서 한 장의 사진이 보여지는 시간은 몇초일까요? 2초입니다. 한장의 사진이 보여지면서 최대 몇%의 크기로 바뀔까요? 120%입니다. 2초동안 120%로 서서히 확대되어집니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

다른 사진으로 바뀔 때 서서히 나타났다가 사라지는 (fade in, fade out)효과를 추가해 봅시다. 투명도효과를 100으로 정하면 완전히 사라지는 것을 의미하고, 50으로 정하면 반투명을 의미하고, 0으로 정하면 완전히 잘 보이는 것을 의미합니다.  다른 모양으로 바꾸기 전에  투명효과를 10만큼 바꾸기10번 반복한다면 서서히 투명해 지면서 결국 사라짐을 의미합니다.  사진이 바뀔 때 새로 보여지는 사진은 투명효과를 -10으로 바꾸어 가면서 서서히 나타나게 합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

만들어진 코드가 초록색 깃발을 클릭했을 때 실행하도록 합니다. 그러기 위해서는 코드블럭 상단에 깃발을 클릭했을 때 를 추가합니다.   그런데 깃발을 클릭했을 때 실행할 거시 하나 더 있습니다. 바로 배경음악입니다. 배경음악이 중간에 끝나지 않도록 무한히 반복해 줍니다.

이제 깃발을 클릭하면 멋진 슬라이드쇼가 펼쳐집니다.

스크래치3.0 스프라이트 모양만들기 – 레이어와 그룹화

백터모드에서 그려진 모든 오브젝트들 즉, 직선, 곡선, 원, 다각형들은 그려질 때 마다 각각 가상의 투명 필름 위에 그려집니다. 우리는 이것을 레이어 라고 부릅니다. 오브젝트들이 그려질 때 마다 레이어가 쌓이므로 가장 마지막메 그려진 오브젝트가 최상위 레이어에 존재합니다. 이것을 우리는 맨 앞에 있다라고 합니다. 오브젝트를 선택한 다름 이것을 한 단계 앞 으로 보내거나 뒤로 보낼 수 있고, 맨 잎으로 보내거나 맨 뒤로 보낼 수도 있습니다. 그러므로 그림 그리는 순서를 바꾸어도 된다는 거죠.

이렇게 앞 뒤로 존재하는 여러개의 오브젝트들이 모여 하나의 물체를 형상화 합니다. 여기서 보여줄 예는 여러개의 타원들이 모여 하나의 눈동자를 형상화 하도록 하겠습니다. 보통 이렇게 형상화 된 오브젝트들을 모두 묶어 하나의 그룹으로 만들어 두는데 그렇게하는 이유는 오브젝트를 실수로 잘 못 건드려 형상화가 흐트러짐을 방지 할 수 있기 때문입니다. 그룹화 된 여러 오브젝트들은 마치 하나의 오브젝트처럼 동작됩니다. 그러므로 우리는 눈동자를 옮기거나 복사하거나 하는 행위가 쉬워집니다.  여기서 눈동자를 그려봄으로써 그 예를 배워 봅니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

눈동자가 될 원을 하나 그려 봅니다. 원을 그릴 때 Shift키를 누르고 그리면 동그란 원이 되고 그냥 그리면 타원이 될 수 있습니다. 우리는 Shift키를 누르고 그리겠습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

파란 눈을 가진 한국사람은 거의 없지만 우리의 상상력 속엔 모든 색이 가능하죠. 파란색 눈동자가 되도록 색을 칠해 봅니다. 색 칠할 때 방사형 그라데이션을 선택하고 파란 색에서 점점 검은 색으로 퍼져 나가도록 합니다. 검은 색을 선택할 때는 완전 검은색 말고 검은색에 가까운 파란색을 선택하세요.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

이제 눈동자 안에 동공을 그립니다. 동공은 완전 검정색입니다.  동공이 눈동자의 가운데 오도록 잘 배치하세요. 우리는 눈동자와 동공을 모두 원으로 그립니다만 좀 만화스럽게 그리려면 타원으로 하셔도 됩니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

선택툴로 그려진 모든것을 선택하고 그룹화적용 버튼을 눌러 하나의 그룹으로 만듭니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

선택툴로 눈동자를 선택하고 크기를 줄여주세요. 이제 눈알을 그려야 하니까요.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

눈알이 되도록 눈동자 보다 훨씬 크게 타원을 그려줍니다. 눈알은 원(구)이지만 실제로 얼굴에서 보여지는 눈이 구로 보여지지 않기 때문에 원으로 그릴 필요 없습니다. 오히려 옆으로 길죽한 타원이 좋습니다. 이 단계에서 색은 뭐가 되든 상관 없습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

실제 눈알의 색은 훨 씬 복잡하지만 대충 희끼무리합니다. 색칠하기에서 상하 그라데이션을 선택합니다. 상부색으로는 파란색이 조금 깃든 밝은 회색을 선택하고 하부색으로는 그것보다 훨씬 더 밝은 회색을 선택합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

눈알을 나중에 그렸기 때문에 눈동자가 가려졌습니다.  방금 그린 눈알을 선택하고 맨뒤로 버튼을 눌러 눈동자가 보이도록 합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

살아있는 생명체의 눈은 눈물로 늘 젖어있기 때문에 외부의 빛이 눈동자에서 반사됩니다. 빛반사가 될 타원을 눈의 크기와 동일하게 일단 만들고 윗 부분으 조금 작게 합니다.  상부에는 눈커플때문에 빛이 안 들어오기 때문입니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

색채우기에서 방사형 그라데인션을 선택합니다. 밝은색(흰색에 가깝지만 완전 흰색으로는 하지 마세요.)에서 투명색으로 퍼져나가도록 합니다.  대신 밝은색의 포인트를 정 중앙으로 놓지 말고 아래나 옆으로 비껴 놓습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

등불이나 태양 또는 창문 같은 것들이 눈동자에서 반사되면 강하게 밝은 망울이 생깁니다. 이것을 표현하기 위해 타원을 그려주고  위의 과정과 동일한 방사형 그라데이션으로 칠합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

그것의 크기와 형태를 임으로 바꿉니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

빛망울을 복사와 붙여넣기 하여 형태를 변형한 다음 크기를 훨씬 작게 줄여 또하나의 빛망울을 만듭니다. 이렇게 3개 정도 그려 넣습니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

완성된 눈동자(눈알포함) 전체를 선택한 다음 그룹화 합니다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

예쁜 눈이 완성되었습니다.

스크래치3.0 스프라이트 모양만들기 – 형태고치기

형태고치기툴을 클릭하고 어떤 오브젝트를 클릭하여 형태고치기 모드로 들어가면 컨트롤포인트들이 보인다. 이 컨트롤포인트들은 굽은 모양이거나 꺽인모양이다. 컨트롤포인트가 굽은모양인지 꺽인모양인지 알 수 있으려면 해당 컨트롤포인트를 클릭해 보면 된다. 굽은 모양의 컨트롤포인트들은 옆에 보조점이 나타날 것이다. 이 보조점을 이동시켜 곡선의 모양을 바꿀 수 있다.  꺽인 모양의 컨트롤포인트들은 옆에 보조점이 없다.  그래서 꺽인 모양의 컨트롤포인트 근처에서 직선으로 나타난다.  컨트롤포인트를 꺽인 모양으로 또는 굽은 모양으로 상호 변환이 가능하다.  그 예를 보자.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

사각형툴을 이용하여 임의의 사각형을 만들자.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

형태고치기를 클릭하여 형태고치기 상태로 두면 4개의 컨트롤 포인트가 보인다. 모두 꺽인 모양의 컨트롤포인트들이다. 이 가운데 좌상의 한 컨트롤포인트를 클릭한다.  이를 굽은 모양의 컨트롤 포인트로 바꾸고자 한다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

굽은모양툴을 클릭하여 해당 컨트롤포인트를 굽은 모양의 컨트롤포인트로 바꾼다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

같은 방법으로 우하의(오른쪽 아래의) 컨트롤포인트도 굽은 모양으로 바꾸고 두 개의 컨트롤포인트를 더 추가하여 그림처럼 잎새모양이 되도록 적당히 조절한다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

밝기가 다른 두개의 초록색을 선택하여 그라데이션 채우기를 주자. 그리고 윤곽선의 굵기를 0으로하여 윤곽선을 보이지 않게 한다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

오브젝트를 복사 와 붙여넣기를 하여 하나 더 만든다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

새로 복사된 오브젝트에 칠하기를 하되 방사형 그라데이션을 준다. 이 때 흰색과 투명색을 선택한다.  흰색을 앞에 두고 투명색을 뒤에 둔다. 그렇게하여 흰색이 점점 투명색으로 퍼져가는 효과를 만든다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

두개의 오브젝트가 서로 완전히 겹치게 둔다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

형태고치기 툴을 선택하여 그림처럼 컨트롤포인트 한 점을 더블클릭하여 없앤다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

그림 처럼 다른 컨트롤포인트 한점을 조절하여 잎새의 반쪽부분을 형상화 한다. 잎새의 반쪽 부분이 살짝 꺽이어 빛을 받아 빛나는 모습을 형상화 한 것이다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

싱그러운 잎새의 모습이 완성되었다.

스크래치3.0 스프라이트 모양 만들기 – 백터모드에서 그리기

백터모드에서 그림을 그릴 때 처음 선택하는 도구는 붓, 선, 원, 또는 사각형 중에 하나이다.  붓은 펜 또는 타블릿 같은 하드웨어가 있을 때 쓰면 좋다. 하지만 마우스로 그림 그리기에는 적합하지 않다. 펜 또는 타블릿은 전문가들이 많이 활용하는 도구로 펜을 눌렀을 때의 압력에 따라 그려지는 선의 굵기가 바뀌고 실제 붓이나 펜으로 그림을 그리는 효과를 낼 수 있다. 하지만 마우스 만으로도 충분히 멋진 그림을 그릴 수 있다.

선도구는 직선을 그린다.  일단은 그렇다. 하지만 형태고치기 도구를 이용하여 어떠한 곡선으로도 바꿀 수 있다.

 

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

백터모드에서 선을 하나 그려보자.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

그려진 직선의 형태를 바꾸어 보기로 하자. 그러기 위해서는 우선 형태고치기툴을 클릭하고 그려진 직선을 클릭한다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

곡선으로 바꾸기 위하여 직선위 임의의 한 점을 클릭하여 드래그하여 보자. 그 점을 컨트롤포인트라고 한다. 그렇게 컨트롤포인트 하나가 추가되었고 만들어진 컨트롤 포인트 옆으로 보조점 두개가 보이는데 이 점의 위치를 바꾸어 줌으로써 곡선의 모양이 달라진다. 이렇게 만들어진 곡선을 베이지어곡선이라 부른다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

곡선 위의 한 점을 클릭하고 드래그하여 컨트롤포인트 한 점을 더 추가해 보자.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

곡선의 굵기와 색깔을 바꾸어 보자. 굵기를 0으로 하면 곡선이 사라진다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

폐곡선이 아니더라도 채우기가 가능하다. (스크래치2.0에서는 폐곡선에서만 채우기가 가능했었다.) 채우기색이 없다는 것은 투명하다는 것이고 투명색으로 칠해져 있다고 해도 된다. 투명색으로 칠해져 있는 것을 투명하지 않은 다른 색으로 바꾼다고 생각하자. 단색으로 채울 수 도 있고 그라데이션(한 색에서 다른 색으로 서서히 변하면서 채워짐)으로 채울 수 있다. 그라데이션으로 채우기 위해서는 두개의 색이 필요하지만, 그 중 한 색을 투명색으로 지정할 수도 있다. 그라데이션 효과는 3가지가 있는데, 좌우로 그라데이션, 상하로 그라데이션, 그리고 방사형 그라데이션이 준비되어 있다.

[siteorigin_widget class="WP_Widget_Media_Image"][/siteorigin_widget]

채워진 곡선이 완성되었다.

스크래치3.0 스프라이트 모양 만들기 – 백터모드와 비트맵모드

모양탭을 클릭하면 기본적으로 백터모드의 이미지편집창이 보인다.  편집창 하단에 비트맵으로 바꾸기 버튼을 클릭하면 비트맵 모드 화면의로 바뀐다.  다시 백터로 전환하기 버튼을 클릭하면 백터모드로 바뀐다. 그림 그리던 중간에 함부로 모드를 전환하면 곤란한 문제가 생길 수 있다. 만일 백터이미지를 일단 비트맵 이미지로 바꾸면 다시 원래대로의 백터 이미지로 바꿀 수 없다는 것에 주의하라. 그러므로 그림을 그리기 전에 어떤 모드로 그릴지 선택해야만 한다.

백터모드의 화면
비트맵모드의 화면

비트맵모드에서는 비트맵이미지를 그릴 수 있고 백터모드에서는 백터이미지를 그릴 수 있다.  비트맵이미지는 픽셀이라는 점으로 그려진 그림이다. 픽셀은 매우작은 점이라 잘 보이지 않지만 그림 편집창 아래의 돋보기를 계속 클릭해 보면 그 정체가 드러난다. 스크래치에서 하나의 픽셀은 색상, 채도, 밝기의 값을 가질 수 있고 우리는 그 값들을 그 픽셀의 속성이라 부른다. 스크래치에서 그림은 가로로 480개의 픽셀, 세로로 360개의 픽셀이 놓일 수 있다. 총 172800개의 픽셀이 놓일 수 있다. 이것을 해상도[latex]480\times 360[/latex]이라 부른다. 일반적인 디지탈카메라로 찍은 사진 해상도(보통 천만 픽셀)에 비하면 무척 작은 그림인 셈이다. 비트맵그림을 확대해 보면 픽셀들의 정체가 드러나면서 마치 계단같은 형상들이 보인다.  이것은 비트맵그림의 단점으로 어느정도 이상 확대하기가 곤란하다.  이것을 보고 사람들이 말하길 비트맵 이미지는 확대하거나 축소하면 그림이 깨진다 라고 한다.

백터이미지는 픽셀이라는 개념이 없다. 대신 오브젝트라는 개념이 있다. 오브젝트는 선, 원, 다각형, 곡선 따위를 말한다. 그림 그릴 수 있는 화면이 도화지라고 생각해 보면 이 도화지 정 중앙을 (0,0)으로하는 좌표평면이 있어 [latex]x[/latex]축으로는-240부터 240까지,  [latex]y[/latex]축으로는 -180부터 180까지 눈금이 있는 가상의 수직선이 존재한다.  우리는 (-30,50)의 위치에서 반지름 10인 원 따위의 그림을 그릴 수 있다.  이렇게 그려진 선, 원, 다각형들이 모여 하나의 그림을 형성하는 것이다.  이렇게 만들어진 그림은 화면을 확대하거나 축소해도 깨지는 일이 없다. 화면을 확대하거나 축소할 때마다 그상태의 화면에서 그림을 다시 그려주기 때문이다.