🖌️코딩으로 그림 그리기

• 무엇: 코드로 블록 그림 그리기. ① 에이전트가 무작위로 움직이며 그리는 추상화 ② 도안의 줄별 좌표를 배열에 담아 그리는 한반도 ③ 모양 블록과 반복을 겹쳐 만드는 태극기
• 누구: 추상화는 랜덤·조건문을 처음 배우는 초등 중·고학년(초급), 한반도·태극기는 반복·변수·배열을 써 본 학생(고급)
• 몇 분: 추상화 1차시, 도안 그리기 + 한반도 코딩 2차시, 태극기는 3·1절·광복절 계기 교육 1~2차시 (제안)
• 결과물: 색 블록 추상화 작품, 흰 바탕 위 한반도 그림과 글자, 블록 태극기
• 영상은 2018~2020년 화면입니다. 2018년 추상화 영상은 코드 커넥션 시절 화면이고, 지금은 게임 안에서 C키로 코드작성기를 엽니다(코드작성기 열기 참고). 블록 이름이 조금 다를 수 있습니다

• 채팅에 랜덤블록 → 에이전트가 와서 슬롯의 블록을 무작위로 골라 놓으며 움직임
• 준비: 에이전트를 마우스 오른쪽 버튼으로 클릭 → 인벤토리 슬롯 1~5번에 블록을 넣어 둠(영상: 빨강·파랑·초록·흰색·노랑)
• 슬롯 활성화 = 그 번호 슬롯의 블록을 쓰겠다는 뜻. 1~5 랜덤 → 다섯 블록 중 하나
• 거리 -5~5 랜덤: 음수는 앞의 반대, 즉 뒤로. 매번 왼쪽 회전해야 한 줄에서 벗어남

채팅 명령 "랜덤블록"
  에이전트가 플레이어에게 텔레포트
  에이전트가 이동한 곳에 블록 놓기: 참(true)
  에이전트가 장애물을 파괴하기: 참(true)
  반복(repeat) 30 회
    에이전트가 랜덤 선택(정수) 1 ~ 5 슬롯을 활성화
    에이전트가 이동 방향 앞으로 거리 랜덤 선택(정수) -5 ~ 5
    에이전트가 회전 왼쪽

• 무따기 15장: 채팅에 시작 → 100번 반복하며 변수 item에 1~7 랜덤을 뽑아 행동을 고름
• 만약-아니면 만약-아니면: 논리의 만약 블록에서 ⊕를 눌러 3갈래로 늘림
• item = 1 → 왼쪽 회전, 2 → 오른쪽 회전, 나머지(3~7) → 앞으로 1칸 → 앞으로 갈 때가 가장 많음
• 슬롯도 1~5 랜덤 → 색이 무작위로 바뀜. 실행 전 에이전트 인벤토리에 블록을 채워야 함(결과 화면: 주황·노랑·빨강·흰색·검정)

채팅 명령 "시작"
  에이전트가 플레이어에게 텔레포트
  에이전트가 이동한 곳에 블록 놓기: 참(true)
  에이전트가 장애물을 파괴하기: 참(true)
  반복(repeat) 100 회
    item 값 랜덤 선택(정수) 1 ~ 7 저장
    에이전트가 랜덤 선택(정수) 1 ~ 5 슬롯을 활성화
    만약(if) item = 1 이면: 에이전트가 회전 왼쪽
    아니면서 만약(else if) item = 2 이면: 에이전트가 회전 오른쪽
    아니면(else): 에이전트가 이동 방향 앞으로 거리 1

바꿀 것	영상에서 바꾼 값	달라지는 점
앞으로 가는 거리	1 → 3	그림이 더 넓게 퍼짐
슬롯 랜덤 범위	1~5 → 1~3	색이 단순해짐
오른쪽 회전 자리	위쪽으로 이동	하늘로 올라가는 입체 작품

- 랜덤 수, 회전 방향, 반복 횟수를 바꿔 보고 작품을 비교·감상 (제안) - 위쪽 작품 만들기: `아니면서 만약 item = 2` 칸의 ‘회전 오른쪽’을 빼고 ‘에이전트가 이동 방향 (위쪽으로) 거리’ 블록을 넣음 — 영상 [4:51](https://youtu.be/aOph9z07Nto?t=291)

• 그림은 선 모양 만들기를 아래에서 위로 한 줄씩 쌓아서 만듦
• 모눈 도안의 맨 아래 줄부터 줄마다 시작 번호·끝 번호를 적음 (예: 1줄 611, 2줄 614, 3줄 7~14 …)
• 가로축 번호 = x 좌표, 세로축 줄 번호 = 쌓는 높이(y)
• 한 줄에 선은 하나만: 한 줄에 칠한 칸이 두 덩어리로 떨어지면 이 방법으로는 안 됨 → 도안·코드를 몇 개 더 겹치면 가능, 색도 다르게 할 수 있음
• 학생은 모눈종이에 도안을 그리고 줄별 시작·끝 번호를 표로 정리 (제안)

• 선 모양 만들기를 줄마다 복사하면 너무 비효율적 → 반복(for) 사용
• 반복 블록: index 값을 0부터 ~ 까지 1씩 증가시키며. 기본값 4를 도안의 줄 수에 맞춰 20으로 바꿈(화면 값)
• index를 시작·끝의 y 칸에 넣음 → 한 줄 놓고 한 칸 올라가 또 한 줄
• 남은 일: 줄마다 다른 시작·끝 x 좌표 넣기 → 배열

채팅 명령 "1"
  반복(for): index 값을 0 부터 ~ 20 까지 1씩 증가시키며
    선 모양 만들기: (하늘색 블록)
      시작 ~0 ~index ~0
      끝   ~0 ~index ~0

• 새 변수 시작점, 끝점을 만들고 리스트에 저장 블록으로 도안의 번호를 맨 아래 줄부터 차례대로 넣음
• 시작·끝의 x 칸에 리스트에서 (index)번째 위치의 값을 넣고, 리스트는 각각 시작점·끝점
• 배열은 0번째부터, index도 0부터 → 0번째 값부터 차례로 불러옴
• 값 하나만 틀려도 그림이 틀어지므로 정확히 입력. 배열이 길어 한 화면에 다 안 들어옴

시작점 에 [6, 6, 7, 8, 8, 8, 7, 7, 5, 5, 6, 6, 5, 4, 4, 5, 7, 8, 11, 15] 저장
끝점   에 [11, 14, 14, 15, 15, 15, 14, 13, 12, 12, 12, 12, 11, 10, 11, 13, 13, 15, 16, 16] 저장
반복(for): index 값을 0 부터 ~ 20 까지 1씩 증가시키며
  선 모양 만들기: (하늘색 블록)
    시작 ~(시작점에서 index번째 위치의 값) ~index ~0
    끝   ~(끝점에서 index번째 위치의 값)   ~index ~0

• 먼저 블록 채우기로 흰색 배경(도화지)을 깔고 → 선 모양으로 한반도 → 글자 쓰기로 위에 글씨
• 화면 값: 배경 블록 채우기 흰색 블록 시작 ~1 ~25 ~0 끝 ~20 ~-5 ~0 교체하기, 글자 쓰기 위치 ~-2 ~34 ~0 방향 동쪽(+x)
• 쓴 문구는 영상 5:01 화면에서 확인(글자 쓰기 명령 하나로 간단히 넣음)
• 실행 중에는 움직이지 않기: 모든 좌표가 플레이어 기준 상대 좌표(~)라서
• 도안 값은 20줄(0~19번째), 반복 끝값은 화면에서 20 → 끝값을 바꿔 결과를 비교해 보는 것도 활동 (제안)

• 3·1절 건축코딩: 앞쪽 벽(z = ~-20)에 채팅 명령 1·2·3… 으로 부분마다 나눠 그림
• 바탕 흰색 블록 채우기, 원 파란색 원 모양 만들기(반지름 10, 방향 z 좌표)
• 건곤감리(하늘·땅·물·불): 검은색 선 모양 만들기를 반복 3회로 세 줄. 변수 2칸을 0으로 두고 매번 2씩 증가, 좌표 칸에 (수) 더하기(+) 2칸·(수) 빼기(−) 2칸을 넣어 줄마다 비켜 그림
• 마지막에 흰색 블록 놓기로 막대를 끊어 줌 (화면 예: 흰색 블록을 ~15 ~-11 ~-20, ~17 ~-13 ~-20 에 놓기)
• 위치가 여러 번 틀림 → 복잡한 구조는 도면을 그리고 좌표까지 적어 두기. 헷갈리면 실행해 보며 확인

채팅 명령 "1": 블록 채우기 흰색 블록  시작 ~-21 ~-18 ~-20  끝 ~21 ~18 ~-20  교체하기
채팅 명령 "2": 원 모양 만들기 파란색 블록  중심 ~0 ~0 ~-20  반지름 10  방향 z 좌표(남쪽/북쪽)  교체하기
채팅 명령 "3": 2칸 에 0 저장
  반복(repeat) 3 회
    선 모양 만들기 검은색 블록  시작 ~-19 ~10 ~-20  끝 ~-15 ~14 ~-20   (좌표에 ±2칸 계산을 넣어 완성)
    2칸 값 2 증가

• 파란 원 위에 붉은색 부분을 선 모양 만들기로 겹쳐 그림 → 한반도와 같은 방법
• 시작점·끝점 배열 + 반복(for) index 0부터 11까지 + 빨간 선 모양 만들기, y 칸에 index (배열 값은 화면에 일부만 보임)
• “한 번에 성공한 것 같지만 사실 여러 번 했습니다” → 화면 뒤로 실패한 태극기들이 줄지어 있음
• 실패를 거쳐 완성한 경험을 독립을 위한 많은 실패와 노력과 연결해 이야기 나누기

채팅 명령 "9"
  시작점 에 [ … ] 저장
  끝점   에 [ … ] 저장
  반복(for): index 값을 0 부터 ~ 11 까지 1씩 증가시키며
    선 모양 만들기: (빨간색 블록)
      시작 ~(시작점에서 index번째 위치의 값) ~index ~-20
      끝   ~(끝점에서 index번째 위치의 값)   ~index ~-20

• 추상화 먼저: 랜덤·슬롯·조건문만으로 결과가 바로 나와 초급 도입에 좋음. 완성 작품을 돌아보며 ‘컴퓨터가 그린 추상화’ 전시·감상 (제안)
• 확률 이야기: 17 중 37이면 앞으로 → 앞으로 갈 확률 5/7. 숫자를 바꿔 그림 변화를 비교 (제안)
• 에이전트가 블록을 안 놓으면 → 인벤토리에 블록이 있는지, ‘이동한 곳에 블록 놓기’가 참인지 확인. 벽에 막히면 ‘장애물을 파괴하기’
• 도안 → 표 → 코드: 모눈종이 도안을 줄별 시작·끝 표로 옮긴 뒤 배열에 입력. 학교 로고·간단한 픽셀 그림으로 바꿔도 됨 (제안)
• 태극기는 모둠별로 바탕·건곤감리·태극 문양을 나눠 맡아 한 장으로 완성 (제안)
• 상대 좌표 코드는 실행하는 자리에서 그려짐 → 실행 중에는 움직이지 않기