GAME 024
doodle.io — 노트 속 작은 생태계는 노트 위에 생물과 자연물을 직접 그려 작은 생태계를 만드는 창작형 웹게임입니다. 선으로 생물을 만들고, 먹이와 도구를 놓은 뒤 움직임과 상호작용을 관찰할 수 있습니다. 정해진 승리 조건 없이 서식지와 낙서를 자유롭게 꾸미는 것이 핵심입니다.
게임 기본 정보
- 게임 번호: 024
- 게임명: doodle.io — 노트 속 작은 생태계
- 장르: 창작·샌드박스·생태계 시뮬레이션
- 난이도: 자유 창작형 — 별도의 난이도 선택이나 정해진 승리 조건은 없습니다.
- 예상 플레이 시간: 제한 없음
- 플레이 인원: 1명
- 지원 환경: 데스크톱·태블릿 권장, 모바일 플레이 가능
- 조작 방식: 마우스·터치 드래그, 화면 버튼, 일부 키보드 단축키
- 저장 방식: 노트와 설정을 현재 브라우저의 로컬 저장소에 수동·자동 저장
- 네트워크 연결: 게임 페이지를 불러올 때 인터넷 연결이 필요합니다. 제공된 HTML에서는 게임 실행 중 외부 API 호출을 확인하지 못했습니다.
- 현재 버전: v1.0.3
게임 플레이
게임 화면에서 선을 그려 생물과 자연물을 만들고, 서식지를 꾸며 보세요. 처음에는 ‘그리는 법’ 안내를 확인하거나, 아래 게임 화면에서 바로 시작할 수 있습니다.
실제 테스트 화면
아래 이미지는 제공된 게임 화면 캡처입니다. PC 화면은 게임 내부 보기 배율 100%이며, 모바일 화면은 iPhone 12 mini 세로 화면입니다.


플레이 방법
- 그리기 도구에서 ‘한 번에 그리기’, ‘이어 그리기’, ‘도구 그리기’, ‘자연물 그리기’ 중 원하는 모드를 선택합니다.
- 캔버스에 마우스나 손가락으로 선을 그립니다. 한 번에 그리기에서는 손을 떼면 생물이 만들어집니다.
- 이어 그리기에서는 여러 획으로 몸과 장식을 그린 뒤 ‘생명 불어넣기’를 누릅니다.
- 자연물 그리기에서는 나무·풀·돌·물·꽃·자유 낙서를 선택해 배치할 수 있습니다.
- 먹이를 뿌리거나 자동 먹이 설정을 조절하고, 생물과 자연물의 상호작용을 관찰합니다.
- 노트를 보관하려면 상단의 ‘저장’을 누릅니다. 저장된 노트는 ‘불러오기’로 다시 열 수 있습니다.
조작과 화면 안내
- 그리기: 캔버스를 누른 채 드래그합니다. 두 손가락 제스처로 화면을 확대·축소할 수 있습니다.
- 화면 보기: 보기 버튼이나 마우스 휠로 확대·축소하고, ‘화면 이동’을 선택해 캔버스를 드래그할 수 있습니다. 보기 배율은 60~300% 범위입니다.
- 서식지: 맵 확장 버튼으로 최대 8단계까지 확장하고, ‘− 맵’으로 한 단계씩 줄일 수 있습니다.
- UI 가리기: ‘UI 가리기’를 누르면 메뉴를 숨길 수 있습니다. 키보드 H로 전환하고, Esc 또는 ‘UI 보기’로 돌아옵니다.
- 키보드 단축키: E 맵 확장, F 먹이 뿌리기, X 지우개, Space 날개형 생물 점프, P 일시정지, R 다시 시작
기록과 저장
- 저장 항목: 생물, 도구, 자연물, 먹이, 그리기 초안, 서식지 단계와 일부 보기·그리기 설정
- 저장 위치와 시점: 브라우저 로컬 저장소에 저장됩니다. 상단 ‘저장’을 누르거나 자동 저장 시점에 기록됩니다.
- 재접속·다른 기기: 같은 브라우저에서 불러올 수 있으며, 다른 기기나 브라우저와 동기화되지는 않습니다.
- 데이터 삭제 시: 브라우저의 사이트 저장 데이터를 삭제하면 저장된 노트를 불러오지 못할 수 있습니다.
이 게임의 핵심 규칙과 특징
그린 형태에 따라 생물의 모습과 특성이 달라집니다
게임 안내에는 가시형·날개형·탑형·둥근형·거대형·기본형의 여섯 생물 유형이 소개되어 있습니다. 선의 형태를 바꾸어 생물을 만들고, 각 유형의 움직임과 상호작용을 관찰할 수 있습니다.
도구와 자연물을 직접 배치할 수 있습니다
도구 그리기에서는 선이나 모양으로 창·방패·곤봉을 만들 수 있고, 생물이 가까이 다가가면 집어 듭니다. 자연물 그리기에서는 나무·풀·돌·물·꽃·자유 낙서를 배치할 수 있습니다. 닫힌 선으로 물웅덩이를 만들면 안쪽이 채워지고, 생물의 이동 속도가 느려집니다.
경쟁 모드와 평화 모드를 바꿀 수 있습니다
평화 모드를 켜면 생물끼리 싸우지 않도록 전환할 수 있습니다. 자동 먹이 설정도 별도로 켜고 끌 수 있어, 생태계를 관찰하거나 직접 먹이를 뿌리는 방식으로 플레이할 수 있습니다.
캡처와 HTML에서 확인한 점
PC 캡처에는 서식지 2/8 단계와 게임 보기 배율 100%, 여러 생물과 자연물이 표시되어 있습니다. iPhone 12 mini 캡처에는 세로 화면의 캔버스와 맵·보기 조절 UI가 담겨 있습니다. 모바일 캡처에서는 일부 생물 상태 글자가 서로 겹쳐 보이므로, 작은 화면에서는 세부 상태를 확인하기 어려울 수 있습니다.
- 확인 자료: 제공된 v1.0.3 HTML·JavaScript·CSS 파일 및 PC·iPhone 12 mini 화면 캡처
- 화면 캡처에서 확인한 상태: PC 게임 보기 배율 100%, 모바일 세로 화면, 서식지 2/8
- 확인 범위: 제공된 코드와 캡처에서 확인 가능한 UI·기능 설명에 한정합니다. 캡처에 없는 기기별 조작 결과나 브라우저 호환성은 별도로 단정하지 않습니다.
초보자 플레이 팁
처음에는 ‘한 번에 그리기’로 생물 형태를 익혀 보세요
한 번에 그리기 모드에서는 선을 완성하고 손을 떼면 생물이 만들어집니다. 모양을 바꿔 가며 유형이 어떻게 달라지는지 살펴본 뒤, 여러 획을 조합하는 이어 그리기에 도전해 보세요.
추가 플레이 팁 보기
생물을 만들기 전에 평화 모드를 활용하세요
생물의 형태나 이동을 관찰하는 동안 서로 싸우는 상황을 피하고 싶다면 평화 모드를 켜 보세요.
서식지를 줄이기 전에 노트를 저장하세요
맵을 축소하면 새 경계 밖의 생물은 제거되고, 바깥의 먹이와 놓인 도구도 정리됩니다. 축소 결과는 즉시 저장되며 다시 확장해도 제거된 요소는 복구되지 않으므로, 줄이기 전에 저장된 노트를 따로 보관해 두는 편이 안전합니다.
넓은 화면이 필요하면 보기 배율과 UI 숨기기를 이용하세요
보기 배율을 낮추면 서식지 주변을 더 넓게 볼 수 있습니다. 메뉴가 시야를 가릴 때는 UI 가리기를 사용하고, 필요하면 UI 보기로 다시 표시하세요.
자주 묻는 질문
게임에 정해진 목표나 엔딩이 있나요?
제공된 게임 화면과 코드에는 점수 경쟁이나 정해진 승리 조건이 없습니다. 생물과 자연물을 그리고 서식지를 꾸미며 관찰하는 자유 창작형 게임입니다.
맵을 축소하면 바깥에 있던 생물은 어떻게 되나요?
새 서식지 경계 밖의 생물은 제거됩니다. 바깥의 먹이와 도구도 정리되고, 축소된 상태가 바로 저장됩니다. 이후 맵을 다시 확장해도 제거된 요소는 복구되지 않습니다.
저장한 노트를 다른 기기에서도 불러올 수 있나요?
아니요. 노트는 현재 브라우저의 로컬 저장소에 저장되므로 다른 기기나 브라우저와 자동으로 공유되지 않습니다.
모바일에서도 플레이할 수 있나요?
모바일 화면에서 캔버스와 조작 UI를 확인할 수 있고, 게임은 터치 입력을 처리하도록 구성되어 있습니다. 다만 제공된 iPhone 12 mini 캡처에서는 생물 상태 글자가 일부 겹쳐 보여 세부 정보가 작게 표시될 수 있습니다.
노트를 초기화하면 저장된 내용도 바뀌나요?
‘다시 시작’을 누르면 새 노트가 열리고 그 상태가 저장됩니다. 기존 노트를 남겨 두려면 초기화 전에 ‘저장’을 눌러 별도로 보관하세요.
업데이트 내역
현재 소개 버전은 v1.0.3이며, 최근 업데이트 날짜는 2026년 10월 6일입니다.
v1.0.3 — 2026년 10월 6일
- 서식지 단계를 4단계에서 8단계로 늘렸습니다.
- ‘− 맵’ 버튼으로 확장한 서식지를 한 단계씩 축소할 수 있습니다.
- 맵을 축소하면 새 경계 밖의 낙서 생물은 제거되고, 바깥의 먹이와 놓인 도구도 정리됩니다. 축소 결과는 즉시 저장되며 다시 확장해도 제거된 요소는 복구되지 않습니다.
- 보기 배율을 60~300%로 조절할 수 있으며, 100% 아래에서는 서식지 주변 여백도 볼 수 있습니다.
- UI 가리기를 누르면 메뉴를 숨겨 노트와 낙서 생태계를 넓게 볼 수 있습니다. UI 보기 버튼으로 돌아오며, PC에서는 H 키로 전환하거나 Esc 키로 복귀할 수 있습니다.
- UI를 가린 동안에도 화면 이동과 확대·축소가 가능합니다.
- 그리기 도구 창과 생물 정보창에 닫기 버튼을 추가했습니다. 도구 창은 그리기 모드 버튼으로 다시 열고, 생물 정보창은 생물을 다시 선택해 열 수 있습니다.
이전 업데이트 내역 보기
v1.0.2 — 2026년 10월 6일
- 작은 화면에서 그리기 도구 창을 접고 펼칠 수 있도록 변경했습니다.
- 모드를 선택하면 도구 창이 접히며, 창 내부는 화면 높이에 맞춰 스크롤할 수 있습니다.
- 상단·하단 메뉴를 정리하고, 하단 버튼을 좌우로 밀어 접근할 수 있도록 조정했습니다.
- 게임을 새 창에서 여는 ‘크게 보기’와 맵 단계 안내를 추가했습니다.
v1.0.1 — 2026년 10월 6일
- 중력 기반 측면 이동을 상하좌우 자유 이동 방식의 2D 필드로 개편했습니다.
- 물·꽃·자유 낙서와 물웅덩이의 이동 속도 감소 효과를 추가했습니다.
- 기본 12색 잉크와 직접 색상 선택, 자연물 선 굵기 조절을 지원했습니다.
- 자동 먹이 켜기·끄기와 카메라 보기·이동 기능을 개선했습니다.
v1.0.0 — 2026년 10월 6일
- 한 줄 바닥 위를 움직이는 낙서 생태계를 처음 공개했습니다.
- 그린 형태에 따른 생물 분류와 도구·먹이·지우개·자연물 기능을 구현했습니다.
- 브라우저 로컬 저장소를 이용한 노트 저장·불러오기를 추가했습니다.
알려진 제한
- 제공된 iPhone 12 mini 캡처에서는 생물 상태 글자가 일부 겹쳐 보입니다. 작은 화면에서는 개체별 상태 정보를 읽기 어려울 수 있습니다.
제작 및 기술 정보
- 게임 기획·편집·검수: 상 스튜디오
- 게임 구현: 생성형 AI 도구를 활용해 제작
- 반응형 구성 및 테스트: PC 화면 및 iPhone 12 mini 세로 화면 캡처 확인
- 글 작성·검수: 상 스튜디오
- 대표 이미지: 생성형 AI 도구를 활용해 제작
- 음악·효과음: 제공된 게임 파일에서 별도 음악·효과음 기능을 확인하지 못했습니다.
- 외부 구성 요소: 제공된 HTML은 별도 외부 라이브러리 호출 없이 로컬 CSS·JavaScript 파일을 불러옵니다.
- 게임 처리·저장: 게임 진행은 브라우저에서 처리하며, 노트는 브라우저 로컬 저장소에 저장됩니다.
게임 공유하기
재미있게 플레이했다면 친구에게 이 게임을 공유해 보세요.
본 게임은 생성형 AI 도구를 활용해 제작했으며, 운영자가 기획·편집·테스트 및 최종 검수를 진행했습니다.