PicoPixel 소개 — 브라우저 기반 LVGL 에디터
PicoPixel이란?
LVGL 기반 임베디드 사용자 인터페이스를 위해 만들어진 브라우저 기반 비주얼 디자인 도구입니다.
위젯을 캔버스에 드래그 앤 드롭해 픽셀 단위로 배치하고 스타일을 조정하세요. 비주얼 이벤트 에디터로 동작을 연결하고 재사용할 에셋을 관리한 뒤, 대상 플랫폼에서 바로 쓸 수 있는 제품용 C 코드를 내보낼 수 있습니다. 임베디드 UI를 위한 Figma라고 생각하면 됩니다.
모든 것이 브라우저에서 실행되며 설치할 것이 없습니다. PicoPixel은 무료로 사용할 수 있습니다.
버튼, 슬라이더, 스위치, 아크, 차트, 드롭다운, 롤러, 체크박스, 텍스트 영역, 탭뷰, 컨테이너, 이미지
C 코드를 작성하지 않고 인터랙션 연결
WebAssembly 기반 픽셀 단위 하드웨어 미리보기
라이브 커서, 주석, 공유 가능한 시뮬레이터 링크
세밀한 세션 기록과 원클릭 롤백
ESP32, STM32, RP2040 등을 위한 깔끔한 LVGL 8.x 코드
거인의 어깨 위에 서서
LVGL과 라이브러리를 완전한 오픈소스로 만들어 온 LVGL 팀의 놀라운 노력이 없었다면 이 모든 것은 존재하지 않았을 것입니다. LVGL을 무료이고 접근 가능한 상태로 유지하기로 한 결정 덕분에 PicoPixel 같은 도구가 만들어질 수 있었습니다.
LVGL 생태계에 기여하는 모든 분들께 깊이 감사드립니다. 핵심 메인테이너, 이슈를 남기고 드라이버를 작성하는 커뮤니티 구성원, 그리고 LVGL로 만들기로 선택한 모든 개발자 여러분, 감사합니다.
PicoPixel의 프런트엔드는 Penpot 포크에서 시작되었습니다. 오픈소스 작업으로 기반을 마련해 준 Penpot 팀과 커뮤니티에 깊이 감사드립니다. PicoPixel이 안정 버전에 도달하는 대로 저희 버전을 공개할 예정입니다.
PicoPixel을 LVGL용으로 만들기 위해 원본 코드베이스를 폭넓게 수정했습니다. 범용 디자인 플랫폼을 LVGL 전용 에디터와 시뮬레이터로 바꾸는 여러 렌더러도 직접 개발했습니다. 이러한 구조적 변화가 있었기에 단순한 LVGL 플러그인을 넘어, 임베디드 UI 제작에 맞춘 플랫폼을 만들 수 있었습니다.
PicoPixel 출시 당시 LVGL 팀은 따뜻한 말과 축하를 전해 주었습니다.
그들은 이 프로젝트를 LVGL 생태계에 도움이 되는 도구로 반겨 주었고, LVGL 을 위한 도구가 더 많아지는 데 진심 어린 기대를 보여 주었습니다.
PicoPixel을 만든 이유
임베디드 기기의 UI를 만들려면 픽셀 좌표를 직접 코드로 지정하고 저수준 그래픽 라이브러리를 다뤄야 했습니다. C 코드를 작성해 보드에 플래시하고, 화면을 확인한 뒤 다시 수정하고 플래시하는 과정의 반복이었습니다.
임베디드 개발자도 웹·모바일 개발자처럼 편리한 시각적 디자인 도구를 사용할 수 있어야 한다고 생각합니다. PicoPixel은 드래그 앤 드롭 에디터, 하드웨어에서 표시될 화면을 정확히 보여 주는 라이브 시뮬레이터, 팀이 실시간으로 함께 디자인할 수 있는 협업 기능을 제공합니다.
작동 방식
캔버스에서 하드웨어까지 여섯 단계로.
디자인
LVGL 위젯을 픽셀 단위로 정확한 캔버스에 배치하고 시각적으로 스타일을 조정합니다.
인터랙션 연결
버튼 누름을 화면 이동에, 슬라이더 변경을 라벨 업데이트에 연결합니다. C 코드는 필요 없습니다.
미리보기
WebAssembly 기반 라이브 LVGL 시뮬레이터에서 UI를 확인합니다. 목업이 아니라 실제 렌더링 엔진입니다.
내보내기
독점 라이브러리 의존성 없는 실제 제품에 바로 사용할 수 있는 LVGL C 코드(.c 및 .h 파일)를 생성합니다.
플래시
내보낸 파일을 ESP-IDF, Arduino 또는 PlatformIO 프로젝트에 추가하고 하드웨어에 플래시합니다.
반복
내장 버전 관리를 사용해 팀과 실시간으로 협업하며 개선합니다.
Ed의 메모
현재 디지털 계기판를 만들고 있으며, 시간의 상당 부분을 도쿄와 선전 사이에서 보내고 있습니다. 하드웨어를 만들고 있거나 두 도시 중 한 곳에 계신다면, 한잔하면서 이야기 나누고 싶습니다.
PicoPixel 전에는 대형 증권사 중 한 곳에서 몇 년간 일했습니다. 또한 Apple에 인수된 스타트업에서 Watch 프로토타입 몇 가지를 작업한 적도 있습니다. 그때 다시 하드웨어를 직접 만들고 싶다는 마음이 생겼고, 결국 이 프로젝트를 만들게 되었습니다.
무엇을 만들고 있는지, PicoPixel에서 어떤 변화를 보고 싶은지 듣고 싶습니다. 편하게 연락 주세요.
오픈 베타
PicoPixel의 현재 개발 상황을 알려드립니다.
PicoPixel은 오픈 베타 상태이며 현재 한 명의 개발자가 만들고 유지 관리하고 있습니다. 위젯 세트는 활발히 확장 중이고, LVGL v9.x 지원도 계획되어 있으며, 최근 출시한 타임라인 기반 키프레임 Animation 모드를 포함해 새 기능이 정기적으로 배포됩니다.
인프라가 확장되는 동안 일시적인 제한이 있을 수 있습니다. 여러분의 인내와 피드백은 정말 큰 힘이 됩니다. 문제가 있으면 언제든지 연락해 주세요.