ESP32-S3 RGB LED 매트릭스 프로젝트 1- 기본 점

ESP32-S3 RGB LED 매트릭스 프로젝트 1- 기본 점

프로젝트 1 – ESP32-S3 RGB LED 매트릭스에서 움직이는 점과 하트 애니메이션

이 프로젝트에서는 ESP32-S3 RGB LED 매트릭스에서 가능한 가장 간단한 애니메이션, 즉 8×8 RGB 디스플레이를 가로질러 움직이는 단일 점으로 시작합니다. 그 위에 작은 하트 애니메이션을 추가하여 전원이 켜졌을 때 보드를 작은 장식용 디스플레이로 바꿀 수 있습니다. 이는 매트릭스에서 개별 픽셀, 색상 및 애니메이션 속도를 제어하는 데 익숙해지기 위한 훌륭한 첫 단계입니다.

이 시리즈의 모든 6개 프로젝트는 단일 비디오에서 시연되고 설명됩니다. 동일한 비디오가 이 페이지에 포함되어 있으므로 움직이는 점과 하트 애니메이션의 전체 단계별 설명과 실시간 시연을 시청할 수 있습니다. 이 프로젝트의 전체 코드는 기사 아래에 자동으로 로드되며, 코드 섹션 아래에 나열된 제휴 스토어에서 ESP32-S3 RGB LED 매트릭스 모듈을 구매할 수 있습니다.

이 보드를 처음 시작하는 경우, 이 프로젝트는 다음과 같은 작업에 완벽한 방법입니다:

• ESP32-S3 보드와 USB 연결이 작동하는지 확인합니다.
• 8×8 RGB 매트릭스가 올바른 핀에 연결되었는지 확인합니다.
• 기본 애니메이션 타이밍, 색상 및 밝기를 실험합니다.

ESP32-S3 RGB LED 매트릭스 모듈 개요

이 프로젝트에 사용된 보드는 ESP32-S3 마이크로컨트롤러를 기반으로 하며, 8×8 RGB LED 매트릭스(64개의 개별 주소 지정 가능한 RGB LED), 뒷면의 QMI8658C 모션 센서, 전원 및 프로그래밍용 USB 포트가 결합되어 있습니다.:contentReference[oaicite:0]{index=0}

이 모듈의 주요 기능:

• ESP32-S3 Wi-Fi 및 Bluetooth를 지원하는 듀얼 코어 마이크로컨트롤러.
• 8×8 RGB LED 매트릭스 보드 전면의 (64개 RGB LED)로 아이콘, 텍스트 및 작은 게임에 이상적입니다.
• QMI8658C 가속도계 / 모션 센서 뒷면에 있어 기울기, 움직임 및 방향을 감지하여 인터랙티브 프로젝트에 활용할 수 있습니다.
• USB 포트 프로그래밍과 전원 공급 모두에 사용됩니다.
• 접근 가능한 핀 가장자리 주변에 있어 다른 IO 프로젝트에서도 일반 ESP32처럼 보드를 사용할 수 있습니다.
• 부트 및 리셋 버튼 프로그래밍 모드 진입 및 스케치 재시작에 사용됩니다.

이 첫 번째 프로젝트에서는 보드의 LED 매트릭스 부분만 사용하지만, 동일한 하드웨어는 텍스트 디스플레이, 웹 제어 메시지, 모션 제어 게임 등을 실행할 수 있을 만큼 강력하며, 이는 이 시리즈의 다른 프로젝트에서 다룹니다.

비디오에서 다루는 프로젝트 (타임스탬프)

6개 프로젝트 모두 동일한 YouTube 비디오를 공유합니다. 대략적인 타임스탬프는 다음과 같습니다:

• 00:00 – 소개
• 02:01 – ESP32 보드 설치
• 03:32 – 라이브러리 설치
• 05:32 – 프로젝트 1: 움직이는 점 (및 기본 색상 / 속도 설정)
• 11:11 – 프로젝트 2: 텍스트 스크롤
• 12:59 – 프로젝트 3: HTTP 텍스트
• 16:41 – 프로젝트 4: 기울기 점
• 18:55 – 프로젝트 5: 위쪽 화살표
• 20:02 – 프로젝트 6: 타겟 게임

가장 잘 이해하려면 이 기사를 따라가면서 비디오를 시청하는 것을 적극 권장합니다. 비디오는 매트릭스에서 점과 하트의 실시간 동작과 Arduino IDE 내부의 모든 단계를 보여줍니다.

Arduino IDE에 ESP32 보드 설치

ESP32-S3에 코드를 업로드하기 전에 Arduino IDE에 ESP32 보드 지원 패키지를 설치해야 합니다. 비디오에서는 “보드 설치” 섹션에서 이를 시연합니다.

일반적인 단계:

1. Arduino IDE를 열고 파일 > 기본 설정으로 이동합니다.
2. “추가 보드 매니저 URLs” 필드에 공식 ESP32 보드 URL을 추가합니다.
3. 도구 > 보드 > 보드 매니저…를 열고 ESP32를 검색한 후 ESP32 보드 패키지를 설치합니다.
4. 설치 후 도구 > 보드로 이동하여 ESP32-S3 RGB 매트릭스 모듈에 맞는 올바른 보드 항목을 선택합니다.
5. USB로 보드를 연결하고 도구 > 포트에서 해당 시리얼 포트를 선택합니다.

올바른 보드와 포트가 선택되지 않으면 코드가 정확하더라도 스케치가 업로드되지 않습니다.

NeoMatrix 및 필수 라이브러리 설치

LED 매트릭스는 내부적으로 Adafruit NeoPixel 드라이버를 사용하며, 더 쉬운 2D 드로잉을 위해 Adafruit NeoMatrix 라이브러리를 사용합니다. NeoMatrix를 설치하면 종속성이 자동으로 함께 설치됩니다.

NeoMatrix 및 종속성

라이브러리 매니저에서 다음을 설치합니다:

• Adafruit NeoMatrix
• Adafruit NeoPixel
• Adafruit GFX Library

라이브러리 매니저에서:

1. 스케치 > 라이브러리 포함 > 라이브러리 관리…를 엽니다.
2. Adafruit NeoMatrix를 검색하고 설치를 클릭합니다.
3. IDE가 제안된 모든 종속성(Adafruit GFX 및 Adafruit NeoPixel)을 설치하도록 허용합니다.

QMI8658C 모션 센서 라이브러리 (후속 프로젝트용)

프로젝트 1에서는 가속도계를 직접 사용하지 않지만, 프로젝트 4, 5, 6에서 필요하므로 지금 모션 센서 라이브러리를 설치해 두는 것이 좋습니다.

라이브러리 매니저에서:

1. 작성자 이름으로 QMI8658 라이브러리를 검색합니다.
2. 라이브러리를 설치하여 빠른 테스트를 위해 파일 > 예제 아래에 나타나도록 합니다.

프로젝트 1 – 코드 설정 (움직이는 점 및 하트)

프로젝트 1을 실행하는 전체 스케치는 이 웹사이트의 이 문서 아래에 자동으로 로드됩니다. 여기서는 변경할 가능성이 높은 주요 설정(핀, 픽셀 수, 밝기, 색상, 애니메이션 속도)에만 초점을 맞춥니다. 하트 애니메이션의 경우 색상 제어 방법과 하트가 채워진 형태인지 윤곽선만 있는 형태인지도 보여드립니다.

LED 핀 및 픽셀 수

이 모듈에서 8×8 RGB 매트릭스는 ESP32-S3의 GPIO 14에 연결됩니다. 총 픽셀 수는 64개(8 × 8)입니다. 코드에서 다음과 유사한 내용을 볼 수 있을 것입니다:

 
// 8×8 RGB 매트릭스에 연결된 핀 
const int MATRIX_PIN = 14;
 // 이 모듈에서는 반드시 14여야 함 
// 총 LED 수 (8 × 8 매트릭스) 
const int NUMPIXELS = 64; // 다른 매트릭스 크기를 사용하는 경우에만 변경 

실수로 NUMPIXELS를 16(원래 NeoPixel 예제에서 가져온 값)으로 남겨두면 매트릭스의 1/4만 사용되며 애니메이션이 8×8 화면 전체를 채우지 못합니다.

색상 순서 및 LED 유형

LED 스트립과 매트릭스에 따라 색상 순서가 다를 수 있습니다(예: RGB 대신 GRB). 이 보드의 매트릭스는 RGB 순서를 사용합니다. NeoPixel 또는 NeoMatrix 생성자에서 색상 유형이 올바르게 설정되었는지 확인하세요:

 // NeoPixel 스타일 객체 예시: 
Adafruit_NeoPixel pixels( NUMPIXELS, MATRIX_PIN, NEO_RGB + NEO_KHZ800 // 매트릭스 색상 순서와 일치하는지 확인 ); 

디스플레이에서 빨간색과 초록색이 바뀌어 보이면 이 줄을 먼저 확인하고 색상 순서를 수정하세요.

애니메이션 속도(단계 사이의 지연)

움직이는 점의 속도는 일반적으로 밀리초 단위의 간단한 지연 값으로 제어됩니다. 지연이 작을수록 이동이 빠르고, 지연이 클수록 이동이 느립니다. 다음과 유사한 변수를 찾으세요:

 
// 점 이동 사이의 지연(밀리초)
 int dotDelayMs = 50; // 50ms는 상당히 빠름 

일반적인 조정:

• 매우 빠른 점 이동을 위해 dotDelayMs = 20;으로 설정.
• 느리고 차분한 애니메이션을 위해 dotDelayMs = 100; 이상으로 설정.

loop() 함수에서 이 값은 일반적으로 각 프레임 업데이트 후 delay(dotDelayMs);에 전달됩니다.

점 색상 및 밝기

움직이는 점의 RGB 색상은 0–255 범위의 세 값(빨강, 초록, 파랑)으로 제어됩니다. 예를 들어:

 
// 점 색상 (R, G, B) 0–255 uint8_t dotRed = 255; // 완전한 빨강 
uint8_t dotGreen = 0; // 초록 없음 
uint8_t dotBlue = 0; // 파랑 없음 

이렇게 하면 밝은 빨간 점이 생성됩니다. 유용한 조합 몇 가지:

• 순수 빨강: (255, 0, 0)
• 순수 초록: (0, 255, 0)
• 순수 파랑: (0, 0, 255)
• 노랑: (255, 255, 0)
• 흰색: (255, 255, 255)

전체 밝기는 종종 별도의 밝기 함수로 제어됩니다:

 
// 전체 매트릭스 밝기 (0–255) 
uint8_t matrixBrightness = 40; // 눈부심을 줄이기 위해 낮게 유지 // setup()에서: matrix.setBrightness(matrixBrightness); 

30–60 정도의 값이 실내 사용에 일반적으로 적합합니다.

하트 모양 설정

움직이는 점 외에도 보드가 처음 켜질 때 매트릭스에 작은 하트를 표시할 수 있습니다. 문서의 샘플 코드(아래에 로드됨)에는 다음과 유사한 설정이 포함되어 있습니다:

 
// 하트 색상 (채워진 하트) 
uint8_t heartRed = 255; 
uint8_t heartGreen = 0; 
uint8_t heartBlue = 0; 
// 선택 사항: 무지개 또는 윤곽선 모드 
bool showOutlinedHeart = false; 
// true = 윤곽선만 
bool useRainbowHeart = false; 
// true = 시간에 따라 색상 순환 

일반적인 사용법:

• 채워진 빨간 하트를 위해 showOutlinedHeart = false; 및 useRainbowHeart = false;로 설정.
• 하트 윤곽선만 표시하려면 showOutlinedHeart = true;로 설정.
• 하트 색상을 무지개 효과로 계속 순환하려면 useRainbowHeart = true;로 설정.

하트는 문서 아래 코드에서 NeoMatrix 좌표 함수를 사용하여 그려집니다. 모양을 사용자 지정하려면 위 변수만 변경하면 됩니다.

요약

프로젝트 1은 ESP32-S3 RGB LED 매트릭스로 시작하는 간단하지만 강력한 출발점을 제공합니다: 64개 픽셀 모두를 주소 지정하는 방법, 색상 제어, 밝기 조정, 애니메이션 속도 설정을 배울 수 있습니다. 또한 동일한 하드웨어에서 움직이는 점에서 정적 또는 애니메이션 하트로 전환하는 것이 얼마나 쉬운지도 확인할 수 있습니다.

움직이는 점과 하트 애니메이션의 완전한 단계별 시연과 나머지 다섯 개 프로젝트를 보려면 이 페이지에 포함된 전체 비디오를 시청하세요. 전체 소스 코드는 이 문서 아래에서 제공되며, 코드 섹션 아래에 나열된 제휴 링크를 통해 모듈을 구매하여 향후 프로젝트를 지원할 수 있습니다.

이미지

ESP32 S3 Matrix pin out

ESP32 S3 Matrix displaying green heart

ESP32 S3 Matrix displaying rainbow heart

ESP32-S3 RGB Matrix- Mobile Phone Text

ESP32-S3-Mtrix - Alway Up

ESP32 S3 Matrix pin out

ESP32 S3 Matrix displaying green heart

ESP32 S3 Matrix displaying rainbow heart

ESP32-S3 RGB Matrix- Mobile Phone Text

ESP32-S3-Mtrix - Alway Up

/* 
  Project 1: the Dot – ESP32-S3 RGB LED Matrix (Waveshare)

  dialysis a dot on scree and moves it
  
  ▶️ Video Tutorial:
  https://youtu.be/JKLuYrRcLMI

  📚⬇️ Resources & Code Page:
  https://robojax.com/RJT829

  QMI8658_RGB_2
*/

#include <Adafruit_NeoPixel.h>
#ifdef __AVR__
 #include <avr/power.h> // Required for 16 MHz Adafruit Trinket
#endif

// Which pin on the Arduino is connected to the NeoPixels?
#define PIN        14 // On Trinket or Gemma, suggest changing this to 1

// How many NeoPixels are attached to the Arduino?
#define NUMPIXELS 64 // Popular NeoPixel ring size

// When setting up the NeoPixel library, we tell it how many pixels,
// and which pin to use to send signals. Note that for older NeoPixel
// strips you might need to change the third parameter -- see the
// strandtest example for more information on possible values.
Adafruit_NeoPixel pixels(NUMPIXELS, PIN, NEO_RGB + NEO_KHZ800);

#define DELAYVAL 50 // Time (in milliseconds) to pause between pixels

void setup() {
  // These lines are specifically to support the Adafruit Trinket 5V 16 MHz.
  // Any other board, you can remove this part (but no harm leaving it):
#if defined(__AVR_ATtiny85__) && (F_CPU == 16000000)
  clock_prescale_set(clock_div_1);
#endif
  // END of Trinket-specific code.

  pixels.begin(); // INITIALIZE NeoPixel strip object (REQUIRED)
}

void loop() {
  pixels.clear(); // Set all pixel colors to 'off'

  // The first NeoPixel in a strand is #0, second is 1, all the way up
  // to the count of pixels minus one.
  for(int i=0; i<NUMPIXELS; i++) { // For each pixel...

    // pixels.Color() takes RGB values, from 0,0,0 up to 255,255,255
    // Here we're using a moderately bright green color:
    pixels.setPixelColor(i, pixels.Color(255, 255, 0));

    pixels.show();   // Send the updated pixel colors to the hardware.

    delay(DELAYVAL); // Pause before next pass through loop
    pixels.clear();
  }



}