브라우저에서 바로 · 설치 없음 · 무료
픽셀을 찍으면
물방울처럼 뭉칩니다
도트를 그대로 두면 각진 사각형이지만, 이 에디터는 픽셀 모서리를 둥글리고 옆 픽셀과 만나는 자리에 표면장력 같은 이음새를 만들어줍니다. 화면에 보이는 그 상태 그대로 PNG로 저장됩니다.
혼자 있으면 방울, 붙으면 하나
픽셀 하나만 찍으면 완전한 원이 되고, 옆에 하나 더 찍으면 두 방울이 합쳐진 것처럼 이어집니다. ㄱ자로 꺾이는 안쪽 모서리에는 오목한 이음새가 생겨요.
보이는 대로 저장
효과를 미리보기로만 쓰고 저장하면 각진 도트가 나오는 툴이 많습니다. 여기서는 화면에 렌더된 그 모양 그대로 최대 32배 확대해서 PNG로 나갑니다.
있을 건 다 있음
연필, 지우개, 페인트통, 스포이드, 영역 선택과 이동, 레이어(순서·불투명도·병합), 되돌리기 60단계. 작업 파일은 JSON으로 저장하고 다시 불러올 수 있습니다.
이걸 왜 만들었냐면
게임에 쓸 물 이펙트를 찍다가 막혔습니다. 도트로 물방울을 표현하려면 결국 안티에일리어싱을 손으로 찍어야 하는데, 32×32 안에서 그걸 하면 물이 아니라 그냥 얼룩처럼 보이더라고요. 반대로 벡터 툴로 그리면 매끈하긴 한데 픽셀아트 특유의 절제된 느낌이 사라집니다.
그래서 찍는 건 도트로, 보이는 건 액체로 하면 되지 않나 싶었습니다. 격자 위에 픽셀을 찍되, 화면에 그릴 때 각 픽셀의 이웃을 보고 모서리를 둥글릴지 말지 결정하는 방식이요. 검색해보니 이미 있는 툴들은 대부분 후처리 필터(블러 + 대비)로 비슷한 걸 흉내내는데, 그건 확대하면 경계가 흐물흐물해집니다. 벡터 곡선으로 직접 그리면 몇 배로 키워도 깨끗하고요.
만드는 과정에서 제일 오래 붙잡은 건 대각선으로만 닿은 픽셀 처리였습니다. 자세한 건 개발기에 적어뒀습니다.
읽어볼 만한 글
자주 묻는 것
무료인가요?
네. 로그인도 없습니다. 그림 데이터는 브라우저 안에서만 처리되고 서버로 올라가지 않습니다.
휴대폰에서도 되나요?
됩니다. 다만 화면이 좁으면 오른쪽 패널이 눌려서 태블릿이나 데스크톱을 권합니다.
작업하던 걸 이어서 하려면?
오른쪽 아래 '프로젝트 저장'을 누르면 JSON 파일이 내려받아집니다. 다음에 '불러오기'로 그 파일을 열면 레이어와 슬라이더 설정까지 그대로 복구됩니다. 자동 저장은 없으니 자리 뜨기 전에 한 번씩 눌러주세요.
상업적으로 써도 되나요?
여기서 그린 그림은 그린 사람 것입니다. 게임에 넣든 굿즈로 팔든 상관없습니다.