스프라이트 시트 생성기
이미지에서 스프라이트 시트 만들기
고급 내보내기스프라이트 시트 생성기
이미지에서 스프라이트 시트 만들기
This tool is part of our Phase 2 implementation. Check back soon!
이 도구 소개
HTTP 요청을 줄이고 로딩 시간을 개선하기 위해 게임 개발과 웹 성능 최적화에 사용되는 기술인 여러 개별 이미지를 단일 스프라이트 시트로 결합합니다. 아이콘, 프레임 또는 UI 요소 컬렉션을 업로드하면 도구가 스프라이트 간에 구성 가능한 패딩과 간격으로 효율적인 그리드 레이아웃으로 배열합니다.
출력에는 코드에서 개별 스프라이트를 참조하는 데 필요한 결합된 이미지와 CSS/JSON 좌표 데이터가 포함됩니다. 다양한 패킹 알고리즘을 사용할 수 있습니다: 균일한 크기의 스프라이트를 위한 간단한 그리드 또는 불규칙한 크기의 자산을 위한 더 공간 효율적인 빈 패킹. 개별 스프라이트 경계를 보여주는 그리드 오버레이로 생성된 시트를 미리 봅니다. 투명도를 위해 PNG 또는 더 작은 파일을 위해 WebP로 내보내며 빌드 파이프라인을 위한 CSS 클래스 또는 JSON 좌표 맵이 함께 제공됩니다.
애니메이션 프레임, 타일 세트 및 캐릭터 상태를 만드는 게임 개발자는 효율적인 로딩을 위해 자산을 통합합니다. 페이지 로드를 느리게 하는 수십 개의 아이콘 요청을 줄이는 웹 개발자는 모든 것을 단일 효율적인 다운로드로 묶습니다. 아이콘 라이브러리를 정리하는 UI 개발자는 좌표 데이터가 있는 관리 가능한 자산 시트를 만듭니다. HTTP/2 또는 HTTP/3 최적화 기술을 구현하는 웹 성능 애호가는 왕복 지연 시간을 줄입니다. 여러 이미지를 정리된 효율적인 스프라이트 시트로 결합하는 모든 사람은 자동화된 생성이 수동 이미지 스티칭보다 훨씬 빠르다는 것을 알게 됩니다.