개요

　

디즈니와 픽사의 합작 애니메이션 영화인 '인사이드 아웃'을 아시나요?

　

 

시놉시스
　
모든 사람의 머릿속에 존재하는 감정 컨트롤 본부 
그곳에서 불철주야 열심히 일하는 기쁨, 슬픔, 버럭, 까칠, 소심 다섯 감정들. 
이사 후 새로운 환경에 적응해야 하는 ‘라일리’를 위해 
그 어느 때 보다 바쁘게 감정의 신호를 보내지만 
우연한 실수로 ‘기쁨’과 ‘슬픔’이 본부를 이탈하게 되자 
'라일리’의 마음 속에 큰 변화가 찾아온다. 
'라일리'가 예전의 모습을 되찾기 위해서는 ‘기쁨’과 ‘슬픔’이 본부로 돌아가야만 한다! 
그러나 엄청난 기억들이 저장되어 있는 머릿속 세계에서 본부까지 가는 길은 험난하기만 한데… 
과연, ‘라일리’는 다시 행복해질 수 있을까? 

　

　

이곳에서는 라일리라는 11살의 꼬마아이가 존재합니다. 마냥 귀엽기만 한 이 꼬마아이를 이젠 프로그래밍으로 만날 수 있습니다~!!

　

　

　

　

바로 구글과 픽사가 합작하여 만든 프로그래밍 툴인 인사이드 HQ를 통해서 말이죠~!

위의 라일리가 아니더라도 여러가지 주인공들과 함께 다양한 문제를 코딩으로 풀어가며 쉽게 코딩을 익힐 수 있습니다.

이번 글에서는 사용 방법과 간단히 라일리를 움직여서 LEVEL1의 문제를 해결해 보겠습니다.

　

　

　

START CODING!

 

사용하는 방법은 매우 간단합니다~!! 별 다른 회원가입도 필요없습니다.

먼저 사이트인 https://www.madewithcode.com/에 접속합니다.

그 다음 사이트의 중앙에 있는 START CODING을 클릭하면 사용이 가능합니다.

(인사이드HQ는 madewithcode에 존재하는 프로젝트 중 하나입니다.)

　

　

　

　

다음 화면에서는 아래와 같은 화면을 볼 수 있는데요.

다만 아쉬운점이 있다면 한글지원이 안되기 때문에 영어로 모든 문제를 해결해야 합니다.

하지만 코딩툴이 저학년의 학생을 위해 만들어진 만큼 크게 어려운 영어가 없어서 중고등학생 정도라면 큰 어려움 없이 읽고 해결할 수 있으리라 생각됩니다.

LEVEL1의 목표는 RAIL을 타고 계단을 내려가는 것(SLIDE DOWN THE RAIL)이 목표입니다.

역시나 주인공은 라일리(RILEY)입니다.

 

 

　

　

　

이제 본격적인 프로그래밍 툴의 화면을 보면 

왼쪽 상단에 있는 LEVEL 1은 단계를 의미합니다. LEVEL1이므로 1단계를 의미합니다.

 

오른쪽 상단에 있는 YOU HAVE 5 BLOCKS LEFT는 사용할 수 있는 블록의 개수를 의미합니다. 지금은 5개의 블록을 사용할 수 있군요 ; )

블록을 하나씩 사용할 때마다 1씩 줄어들며, 0이 될 경우 더 이상 블록을 사용할 수 없습니다.

　

　

　

　

CHARACTER에 있는 블록은 움직일 캐릭터의 이름을 나타냅니다.

아래의 스크린샷에서는 라일리(RILEY) 블록이 존재하는데 이 블록을 중앙의 코드창으로 드래그앤드롭(Drag&Drop)한 다음 그 블록안에 여러가지 블록을 넣게 되면

오른쪽에 계단위 길에 서있는 라일리가 그 블록 순서대로 행동하게 됩니다.

　

여러가지 블록을 조합하여 제한된 블록의 숫자로 처음에 알려준 미션을 실행시키는 것이 이 코딩의 목표입니다.

　

<라일리 블록안에 들어가는 블록대로 라일리는 움직이게 된다>

　

　

　

그럼 한번 LEVEL1의 미션을 완성해 볼까요?

첫 단계인 만큼 제한 블록의 개수의 적고 사용할 수 있는 블록의 개수도 적습니다. 

오른쪽의 라일리가 서있는 화면에는 작은 정사각형을 볼 수 있는데 이 정사각형 하나는 1칸을 의미합니다.

 

아래와 같이 RALEY블록을 옮기고 그 안에 WALK 1 SPACE블록을 옮긴다음 실행시키면 라일리는 앞으로 한칸 움직이게 됩니다.

이렇게 움직여서 우리는 블록의 조합을 통해 라일리를 계단 밑으로 옮겨야 합니다.

　

<빨간 사각형 하나는 한칸을 의미한다>

　

　

　

만약 아래와 같이 블록을 만들고 실행시킬 경우 앞으로 2칸 걸어가는 라일리를 볼 수 있습니다.

하지만 2칸 걸어간 다음의 명령 블록이 없기 때문에 라일리는 계단밑으로 내려갈 수 없습니다.

그렇기 때문에 이 블록은 미션 실패입니다ㅜㅡㅜ

　

<앞으로 두칸 이동하는 라일리>

　

　

　

미션 실패했을 때 뜨는 화면 입니다.

TURN THAT FROWN UPSIDE DOWN~ 얼굴 찡그리지 말고 긍정적으로 생각해 보라고 하네요ㅎㅎ

　

 

　

　

　

다시 처음으로 돌아와서 생각해 봅시다~!! 

라일리가 계단 밑으로 내려가기 위해서는 먼저 앞으로 두칸을 걸어간 다음 레일위로 걸터 앉아야 합니다. 

그 다음 레일을 타고 쭉 미끄러져 내려간 다음 레일에서 내려와야 하겠죠?

 

여기서는 코딩에 어려워 할 친구들을 위해 친절하게 레일로 뛰어 오를 수 있는 각도를 알려주네요! 45도로 뛰어오르면 레일에 걸터 앉을 수 있을거 같습니다.

　

　

　

　

머릿속으로 차근차근 생각하고 블록을 완성시킨 다음 라일리를 움직여 보았습니다!

귀여운 라일리가 씩씩하게 레일을 타고 밑으로 내려가네요~!!

코드는 공개하지 않겠습니다! 직접 해보시는게 100배는 더 뿌듯할테니까요.

　

　

　

　

madewithcode에서는 인사이드아웃을 활용한 프로젝트인 인사이드HQ뿐만 아니라 다양한 프로젝트를 이용할 수 있습니다.

 

　

　

　

구글이 픽사와 손잡고 코딩교육툴을 만든것을 보면 코딩 교육 열풍이 한국에만 국한되지 않은 듯 합니다.

　

madewithcode를 사용해본 소감을 한마디로 정의하면 '친근하다(Friendly)' 입니다.

디즈니와 픽사의 특유의 캐릭터와 익숙한 애니메이션으로 인해 논리적이고 딱딱한 코딩이 정말로 재밌게만 느껴집니다.

그리고 목표를 정해 이 목표를 달성하게 함으로써 성취감을 얻을 수 있고 게임과 같이 단계를 정해놨기 때문에 정말로 누구나 쉽게 접근할 수 있게 제작되었습니다.

사이트도 디즈니스러운 색상으로 구성되어 있어 자칫하면 여성을 위한 사이트라고 오해할 수도 있습니다 :)

　

비록 사이트가 영어만 지원하기 때문에 한국에서는 사용하기 어려운 점이 있는것도 사실입니다.

하지만 사용되는 영어가 그다지 어렵지 않기 때문에 역으로 생각한다면 코딩을 공부하면서 영어까지 배울 수 있는 일석이조의 기회가 될 수도 있습니다. 

 

madewithcode에 방문해 보세요~!