Community코딩 & 개발github.com

zhx8702/bigscreen-asset-slicer

스크린샷을 기반으로 대시보드 에셋을 슬라이싱하고 재구축하는 Codex 스킬입니다.

bigscreen-asset-slicer란 무엇인가요?

이 스킬은 개발자가 UI 목업(Mockup)이나 기존 대시보드의 스크린샷을 분석하여 컴포넌트별로 자동 슬라이싱(Slicing)하고, 이를 재구성 가능한 코드로 재구축할 수 있도록 도와줍니다. 주로 대형 스크린(빅스크린) 데이터 시각화 대시보드 환경에서 사용되며, Codex 플랫폼에서 실행됩니다. 사용자는 단순히 스크린샷 이미지를 제공하면, 스킬이 시각적 요소를 식별하고 각각의 위젯이나 그래프 영역을 분할한 뒤, 해당 구조를 HTML/CSS/JavaScript 등으로 변환합니다. 이 과정에서 개발자는 수동으로 스크린샷을 분석하거나 에셋을 일일이 추출할 필요 없이, AI가 자동으로 구조를 파악하고 재사용 가능한 코드 조각을 생성합니다. 결과물은 수정과 확장이 용이하여, 데모 제작, 프로토타이핑, 또는 기존 대시보드 리팩토링 업무에 즉시 활용될 수 있습니다.

지원 대상~Claude Code✓Codex CLI~Cursor
npx skills add zhx8702/bigscreen-asset-slicer

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

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

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

문서

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

스크린샷을 기반으로 대시보드 에셋을 슬라이싱하고 재구축하는 Codex 스킬입니다.

관련 스킬