Community코딩 & 개발github.com

bruceyoung3306-lgtm/image2-ui-asset-slicer

Codex 스킬로, AI로 생성된 UI 스크린샷을 Unity에서 바로 사용할 수 있는 PNG 에셋으로 변환합니다.

image2-ui-asset-slicer란 무엇인가요?

이 스킬은 AI로 생성된 UI 디자인 스크린샷을 Unity 게임 엔진에서 사용할 수 있도록 분할된 PNG 에셋으로 변환하는 Codex 기반 도구입니다. 특히 이미지 생성 AI(예: Midjourney, Stable Diffusion 등)로 만든 UI 목업이나 와이어프레임을 실제 게임 리소스로 빠르게 전환해야 하는 게임 개발자에게 유용합니다. 이 스킬은 주로 디자인-개발 워크플로우에서 발생하는 수동 에셋 분할 작업을 자동화하여 생산성을 높여줍니다. 스크린샷에서 UI 요소(버튼, 패널, 아이콘 등)를 식별하고 각각을 독립적인 PNG 파일로 추출한 후, Unity에서 임포트하기 적합한 형식(투명 배경, 적절한 해상도, 파일명 규칙 등)으로 저장합니다. 지원 플랫폼은 Codex CLI 환경이며, 입력으로는 UI 스크린샷 이미지 파일을 받고 출력으로는 여러 개의 개별 PNG 파일을 생성합니다.

지원 대상~Claude Code✓Codex CLI~Cursor
npx skills add bruceyoung3306-lgtm/image2-ui-asset-slicer

Installed? Explore more 코딩 & 개발 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

image2-ui-asset-slicer은(는) 무엇을 하나요?

Codex 스킬로, AI로 생성된 UI 스크린샷을 Unity에서 바로 사용할 수 있는 PNG 에셋으로 변환합니다.

설명

이 스킬은 이미지 생성 AI로 만든 UI 디자인 스크린샷을 입력받아, 각 UI 요소(버튼, 패널, 아이콘, 텍스트 상자 등)를 개별 PNG 파일로 분할합니다. 분할된 에셋은 Unity 프로젝트에 바로 임포트할 수 있도록 최적화되어 있으며, 투명 배경, 적절한 해상도, 일관된 파일명 규칙을 따릅니다.

사용 방법

  1. 스킬을 호출하고 변환할 UI 스크린샷 이미지 경로를 제공합니다.
  2. 스킬이 이미지를 분석하여 UI 구성 요소를 식별합니다.
  3. 각 구성 요소가 개별 PNG 파일로 저장됩니다.
  4. 출력 폴더에서 Unity용 에셋을 가져와 사용합니다.

요구 사항

  • Codex CLI 환경
  • 입력 이미지 (PNG, JPG, WebP 지원)
  • 출력 디렉토리 쓰기 권한

출력 예시

output/
  button_play.png
  button_settings.png
  panel_background.png
  icon_star.png
  text_title.png

참고

이 스킬은 이미지 분석 및 분할을 위해 Codex의 파일 처리 기능을 활용합니다. 복잡한 레이아웃의 경우 결과가 다를 수 있으며, 필요에 따라 수동 조정이 필요할 수 있습니다.

관련 스킬