[스크래치와 함께하는 프로그래밍 첫걸음] Chapter 1_’스크래치’를 소개합니다

특히 주소아에선 미국 매사추세츠공대 미디어융합기술연구소(MIT 미디어랩)이 개발한 사건 기반 프로그래밍 언어 '스크래치'를 활용해 소프트웨어를 가르치고 있는데요. 삼성투모로우에선 '스크래치와 함께하는 프로그래밍 첫걸음' 연재를 통해 주소아 학생들이 배우는 코딩 수업을 독자 여러분과 공유하려고 합니다.

평소 프로그래밍에 관심 있던 분들에겐 간단한 코딩을 배울 수 있는 좋은 기회가 될 텐데요. 수업 첫날인 오늘은 스크래치에 대해 알아보고, 스프라이트(개체)에 동작과 말풍선 적용하는 법을 배워보겠습니다. 그럼 먼저 한 편의 짧은 만화를 감상해볼까요?

스크래치는 평소 소심한 성격 탓에 친구들과 쉽게 어울리지 못하는 깜토를 보며 늘 안타까웠습니다. 이에 스크래치는 깜토에게 더 넓고 재미있는 세상을 보여주기로 결심했답니다. 다름 아닌 프로그래밍을 이용해서!

스크래치가 말했듯 프로그래밍을 이용하면 화면 속 캐릭터들을 움직일 수도 있고 세상 어디로든 데려다 놓을 수도 있는데요. 오늘은 스크래치가 직접 움직이며 말하는 모습을 보여준다고 하네요. 그럼 하나하나 천천히 스크래치를 따라 해봅시다.

여러분의 '스프라이트'를 소개시켜 주세요!

스크래치 프로그램을 실행하면 다음과 같은 화면이 보입니다. 스크래치 화면은 크게 4개로 분할돼 있는데요. 각종 명령 값이 저장돼 있는 '블록’ 영역(맨 왼쪽), 명령을 저장하는 '스크립트’ 영역(가운데), 프로그래밍된 화면을 보여주는 '미리보기’ 영역(오른쪽 위), 배경과 스프라이트 설정을 위한 '스프라이트·무대’ 영역(오른쪽 아래)이 각각 그것이죠.

미리보기 영역을 보면 스크래치가 우두커니 서 있는 게 눈에 띄실 텐데요. 여기서 스크래치, 즉 화면에 등장하는 개체를 '스프라이트'라고 합니다. 오늘은 이 스프라이트를 사막으로 이동시켜 동작과 말풍선을 적용시켜 볼 텐데요. 먼저 스프라이트를 사막으로 이동시켜볼까요?

-배경 설정하기

스프라이트를 사막으로 이동시키려면 흰색 배경을 사막 배경으로 바꿔야겠죠? 우리가 흔히 '배경화면'이라고 부르는 건 스크래치에선 '무대'라고 표현하는데요. 바로 이 무대 탭을 이용해 스프라이트가 서 있는 배경을 마음대로 바꿀 수 있습니다. 배경을 설정하는 방법은 다음과 같습니다.

먼저 오른쪽 하단의 스프라이트·무대 영역에서 무대라고 써 있는 흰 상자를 클릭합니다. 스프라이트 아이콘에 설정돼 있던 커서가 무대 아이콘으로 옮겨지면 무대를 스크립트 영역으로 이동시킬 수 있는데요. 이 단계에서 배경화면을 자유롭게 설정하면 됩니다.

스크립트 영역에서 '배경' 탭을 선택하면 '그림' '가져오기' '카메라' 등 새로운 배경을 설정할 수 있는 세 가지 방법이 제시됩니다. 여기서 '그림' 버튼을 누르면 직접 배경을 그릴 수 있고, '가져오기' 버튼을 누르면 PC에 저장된 사진이나 이미지를 배경으로 불러올 수 있는데요. '카메라' 버튼을 누르면 PC에 연결된 캠코더를 통해 직접 사진을 찍어 배경을 저장할 수 있습니다.

-말풍선 넣기

배경을 바꿨으니 이제 본격적으로 스프라이트에 동작과 말풍선을 적용시켜보겠습니다. 스프라이트에 동작과 말풍선을 적용시키려면 무대 설정에서 다시 스프라이트 설정으로 돌아와야 합니다.

스프라이트 아이콘을 클릭한 후 왼쪽 블럭 영역에서 원하는 명령어를 드래그해 스크립트 영역으로 옮기면 스프라이트에 동작과 말풍선이 적용되는데요. '제어' 버튼을 눌러 '깃발이 클릭되었을 때'를 스크립트 영역으로 드래그하고, '형태' 버튼을 눌러 '안녕 2초 동안 말하기'를 3회 연속 스크립트 영역으로 드래그하면 아래와 같이 명령어가 설정됩니다.

이때 안녕 2초 동안 말하기에서 흰색 영역을 클릭하면 인사 문구와 말하는 속도를 각각 변경할 수 있는데요. "안녕!"이란 문구를 "안녕! 투모로우 친구들~" "난 '스크래치'라고 해!" "앞으로 잘 부탁해~"로 변경해봤습니다.

이 상태에서 화면 오른쪽 상단의 초록색 깃발을 클릭하면 스크래치의 말풍선이 설정값에 따라 변하는 걸 볼 수 있는데요. 어때요, 스크래치가 진짜 말을 거는 것 같죠?

-동작 적용하기

스프라이트를 움직이게 하는 것도 매우 쉽습니다. 말풍선을 적용할 때와 마찬가지로 블록 영역에서 '동작' 버튼을 클릭, 인사 문구 사이사이에 블록을 끼워주면 되는데요. 동작이 너무 빠르다 싶으면 '제어' 버튼을 클릭해 '1초 기다리기' 명령어를 넣어주세요.

지금까지 프로그래밍에 배경을 설정하고 스프라이트에 동작과 말풍선을 적용하는 법에 대해 배웠는데요. 말풍선이나 동작 등의 명령어를 삭제하려면 스크립트 영역으로 가져온 명령어를 다시 블록 영역으로 가져다 놓기만 하면 된답니다.

그럼 완성된 프로그래밍을 한 번 감상해볼까요? 스크래치가 앞으로 걸어가며 투모로우 독자 여러분께 인사말을 전하는데요. 움직임이 무척 자연스럽죠?

다음 편에선 스크래치를 활용해 하나의 스프라이트가 정해진 순서에 따라 여러 동작을 하는 프로그래밍을 알려드릴 예정입니다. 이 코너를 통해 알려드리는 내용을 차근차근 따라가시며 '아마추어 프로그래머'의 꿈을 펼쳐보시는 건 어떨까요?

* 이 콘텐츠는 삼성전자 사회봉사단사무국이 프로그래밍 분야 전문가들과의 협업을 통해 개발했습니다