에이전트 활용 사례
Views —

에이전트 활용 사례

오늘 등록된 사례

10전체 241건

241개 중 1–20개

개발·코딩

Claude Code 창 안에서 쓰는 픽셀 그림판을 구현하는 에이전트

터미널 픽셀 그림을 손으로 입력하기 번거로워 Claude Code로 마우스로 그리는 그림판 모드를 만들었어요.

Claude Code

사용법

  1. 작성자는 Claude Code용 미니 게임 모드를 만들다가 픽셀 그림을 문자로 일일이 입력하는 게 힘들어서 그림판 모드를 만들기로 했어요.
  2. Claude Code와 함께 화면 쪽 모듈과 저장·클립보드를 맡는 모듈을 나누고, 한 글자에 픽셀 2개를 담는 반쪽 블록 그리기와 4방향 대칭 그리기를 구현했어요.
  3. 테스트 코드와 README 미리보기 이미지를 그려 주는 스크립트도 Claude Code와 같이 썼대요.

결과

9색 팔레트, 붓 크기 1~4, 직선, 채우기, 20단계 되돌리기를 지원하고, 그림을 JS 배열·ASCII·SVG로 내보낼 수 있어요. 작성자는 사용자 반응 같은 수치는 밝히지 않았어요.

참고사항

MIT 라이선스로 공개했고 네트워크 요청을 하지 않는다고 했어요. 마우스 세밀 좌표는 kitty, Ghostty, iTerm2, WezTerm에서 된다고 적었어요.

출처

Reddit 원문 ↗

예시 프롬프트 · Claude Code

터미널 안에서 마우스로 픽셀 그림을 그리고 코드로 내보내는 작은 그림판 도구를 만들어 주세요.

입력: 실행할 환경 [예: Claude Code 플러그인, 일반 터미널 앱], 지원할 터미널 [목록], 캔버스 크기 범위 [가로x세로], 내보낼 형식 [JS 배열, ASCII, SVG 중 선택]. 먼저 그 환경에서 마우스 드래그와 글자보다 작은 단위의 좌표를 받을 수 있는지, 플러그인이라면 어떤 확장 API가 있는지 확인해 주세요.

구현 순서: 1) 반쪽 블록 문자로 한 칸에 위아래 픽셀 2개를 그리는 화면부터 만든다. 2) 왼쪽 드래그는 그리기, 오른쪽 드래그는 지우기, 붓 크기와 색 선택을 붙인다. 3) 직선, 채우기, 되돌리기·다시 하기, 좌우·상하 대칭을 차례로 넣는다. 4) 화면 그리기와 파일 저장·클립보드 처리를 분리해 드래그가 끊기지 않게 한다. 5) 그림을 잘라 내보내는 기능을 만든다. 외부 프로그램 실행이나 네트워크 요청은 넣지 마세요.

결과물: 소스 코드, 설치 방법, 테스트. 먼저 24x12 캔버스에서 그리기·되돌리기·대칭이 픽셀 단위로 맞는지 테스트로 확인한 뒤 기능을 늘려 주세요.