픽셀 게임기 PIXEL GAME

픽셀 게임기 코드 작업실

하드웨어 살펴보기

그림에서 부품을 눌러 역할을 살펴보세요.

NeoPixel 화면

16×16, 총 256개의 RGB LED가 한 픽셀씩 색을 표시해요. 게임 캐릭터, 점수, 남은 시간을 그릴 수 있어요.

ESP32로 만들 수 있는 프로젝트

  • 기본 픽셀 미로, 반응 속도 게임, 수업 타이머
  • Wi-Fi 교실 점수판, 웹에서 보내는 픽셀 전광판
  • Bluetooth 휴대폰으로 조작하는 게임, 게임기를 무선 컨트롤러로 사용하기

Wi-Fi와 Bluetooth 기능은 USB로 업로드한 뒤 실제 게임기에서 확인하세요.

ESP32 사진과 GPIO 배선 보기 ↓
1

하드웨어 점검 및 픽셀게임기 연결

데이터 USB 케이블로 게임기를 연결하고 포트를 선택하세요. 이 탭에서 이후 컴파일이 끝나면 선택한 게임기에 자동으로 업로드합니다.

Chrome 포트 선택 예시 목록에서 CP210x 또는 ESP32가 들어간 포트를 찾아 선택한 뒤 연결을 누르세요. 포트 이름과 COM 번호는 컴퓨터마다 조금씩 다를 수 있어요.

Windows에서 게임기 포트가 안 보이면 CP210x 드라이버 설치 파일 받기 (Windows 10·11 x64)를 이용하세요. 받은 파일을 실행하고 관리자 권한을 승인한 뒤, USB 케이블을 다시 꽂고 포트를 선택하세요.

USB 포트 안내 ↓

테스트를 설치하면 게임기의 현재 프로그램이 화면·조이스틱·버튼·부저 점검용 프로그램으로 바뀝니다.

기본 코드를 설치하면 현재 게임을 덮어쓰고 화면과 소리를 끕니다. 작업실의 코드는 그대로 남습니다.

USB 자동 업로드 연결 대기 중

3

프롬프트 복사하기

픽셀게임기 구동을 위한 프롬프트입니다. 자신이 사용하는 인공지능창에 붙여넣기 해주세요.

4

인공지능 열기

Gemini ChatGPT
5

AI에 프롬프트 붙여넣고 게임 코드 작성

AI에 프롬프트를 붙여넣고 만들고 싶은 게임을 요청하세요.

  1. 프롬프트 붙여넣기복사한 프롬프트를 AI 채팅창에 붙여넣어요.
  2. 게임 기획하고 코드 요청하기게임 규칙과 조작 방법을 설명하고 Arduino 코드 전체를 요청해요.
  3. 코드 복사하기 AI 답변의 코드창에서 복사하기 아이콘을 눌러요.
6

작업실에 코드 붙여넣기

AI에서 복사한 Arduino 코드 전체를 이 코드창에 붙여넣으세요.

켜 두면 AI에서 코드를 복사하고 이 탭으로 돌아올 때 자동으로 붙여넣습니다.

0 B / 512 KB
7

실행 파일 만들기

8

실행 파일 제작 진행 상황

만드는 중 —대기 —작업자 —
요청을 보내면 대기 순서가 여기에 표시됩니다.

Arduino 코드를 붙여넣어 주세요.

파일 만들기 · 업로드 기록
아직 실행한 작업이 없습니다.
9

2D 시뮬레이터

실행 파일을 만들면 붙여넣은 코드가 여기서 실행됩니다. 지금은 내장 데모입니다.

조이스틱 이동
끌기 또는 방향키
조이스틱 누르기
클릭 또는 스페이스
빨간 버튼 A
클릭 또는 Z
초록 버튼 B
클릭 또는 X
x 8 · y 8 · LED 136
가상 시리얼 로그

      

    



    

      
10
픽셀 게임기에 USB 업로드
실행 파일이 준비되면 여기에서 수동으로 연결해 올릴 수 있어요.

      
      
데스크톱 Chrome에서 열고 데이터 USB 케이블을 연결하세요. Arduino IDE의 시리얼 모니터는 닫아 주세요.

    


    

      
작품 공유하기

      
공유하면 작품 소개, 코드, 실행 파일을 누구나 볼 수 있어요. 만든이는 익명 별명으로 표시됩니다. 실명이나 연락처는 적지 마세요.

      

        
        
        
실행 파일을 만든 뒤 공유할 수 있어요.

      

      코딩 작업하기 
    

    

      
문제 해결

      

  USB 연결이나 업로드가 잘 안 되나요?
  

    
데이터 전송용 USB 케이블을 사진의 빨간 원 안에 있는 ESP32 보드의 USB-C 포트에 연결하세요. 이 확장 실드의 USB 포트와 DC 전원 잭은 전원 입력용입니다. 확장 실드에 꽂으면 게임기가 켜져도 Chrome에서 업로드할 포트가 나타나지 않습니다.

    

      빨간 원은 컴퓨터에 연결하는 ESP32 보드의 USB-C 포트이고, 아래 확장 실드의 USB 포트 두 개와 DC 잭은 전원 입력용입니다.
      
사진을 누르면 새 탭에서 크게 볼 수 있어요.

    

  

  
Windows에서 CP210x 포트가 나타나지 않으면 CP210x 드라이버 설치 파일 받기 (Windows 10·11 x64)를 누르세요. 실행 중 인터넷 연결과 관리자 권한이 필요합니다. 설치 후 USB를 다시 연결하세요.

  
    
    
  1. 데스크톱 Chrome에서 페이지를 열고 Arduino IDE의 시리얼 모니터나 같은 포트를 쓰는 프로그램을 닫아 주세요.
    2. 
    
  2. 포트 선택 버튼을 누르고 Chrome 목록에서 게임기 포트를 선택한 뒤 연결을 누르세요.
    3. 
    
  3. 어느 포트인지 모르겠다면 선택 창을 닫고 USB를 뺀 뒤 목록을 다시 열어 보세요. USB를 뺐을 때 목록에서 사라진 포트가 게임기 포트입니다. USB를 다시 꽂고 나타난 포트를 선택하세요.
    4. 
    
  4. 연결에 실패하면 USB를 뺐다가 다시 꽂고 포트를 다시 선택하세요. 목록에 변화가 없다면 다른 데이터 USB 케이블이나 컴퓨터의 다른 USB 포트를 시도하세요.
    5. 
    
  5. 업로드가 끝난 뒤 게임이 시작되지 않으면 USB를 뺐다가 다시 꽂아 게임기를 다시 시작하세요.
    6. 
  




    

    

  

    
라이브러리 · 배선

    

      
보드
ESP32 Dev Module

      
라이브러리
Adafruit NeoPixel 1.15.5

    

  

  

    

      
        ESP32와 조이스틱, NeoPixel 패널, A·B 버튼, 부저를 연결한 Cirkit Designer 배선도
        Cirkit Designer에서 원본 배선도 열기 ↗
      
      
배선도에는 8×8 NeoPixel 패널이 그려져 있고, 픽셀게임기는 16×16 패널을 사용해요.

    

    

      

        
GPIO 연결 요약

        
ESP32와 부품의 핀 이름을 연결선으로 확인하세요.

      

      

        
        
    
          
  • 
            GPIO 5NeoPixel 16×16 DIN
          
    • 
          
  • 
            GPIO 32조이스틱 X
          
    • 
          
  • 
            GPIO 33조이스틱 Y
          
    • 
          
  • 
            GPIO 27조이스틱 SW
          
    • 
          
  • 
            GPIO 16버튼 A
          
    • 
          
  • 
            GPIO 4버튼 B
          
    • 
          
  • 
            GPIO 25수동 부저
          
    • 
          
  • 
            GND부품 공통 GND
          
    • 
        

      

      
조이스틱 SW와 버튼 A·B는 누르면 LOW로 읽습니다.

      
NeoPixel은 왼쪽 위부터 한 줄씩 왼쪽에서 오른쪽으로 매핑합니다. USB 전원으로 사용할 때는 많은 픽셀을 높은 밝기로 동시에 켜지 마세요.

    

  

   하드웨어 살펴보기로 돌아가기