AI Export Tool

Illustrator 없이 .ai 파일을 열어 원본을 보고, 오브젝트를 클릭해 위치·크기·색·폰트를 확인하고, 필요한 오브젝트를 PNG/SVG로 뽑는 Windows 데스크톱 툴입니다. 개발자와 기획자가 디자이너에게 "이거 뽑아주세요" 하지 않아도 되게 만들었습니다.

기능

• 보기: 아트보드 원본 렌더, 오브젝트 트리, 캔버스 클릭 선택, 휠 줌 / 가운데버튼 이동
• 속성: 위치·크기(px), 채우기·선 색(hex), 불투명도, 텍스트 문자열·폰트·크기, 이미지 원본 해상도, 둥근 모서리 반경, 선 두께. 값마다 복사 버튼
• 거리 재기: 오브젝트를 선택하고 Alt를 누른 채 다른 오브젝트에 마우스를 올리면 간격 또는 안쪽 여백을 px로 표시
• 텍스트 탭: 화면의 모든 문자열·폰트·크기·색을 표로. 전체 복사(TSV)
• Export: 체크한 오브젝트 / 드래그로 지정한 영역 / 아트보드 전체를 PNG(투명 배경, 1·2·3x) 또는 SVG로. 오브젝트는 자기 크기로 잘라냅니다. 이미지는 원본 비트맵도 _source.png로 같이 저장. 파일명 직접 지정 가능
• JSON: 아트보드 구조(위치·크기·색·폰트·그룹·에셋 파일명)를 layout.json으로. AI 코딩 에이전트에게 "이 폴더의 layout.json대로 배치해줘"라고 넘길 수 있습니다
• 눈 아이콘으로 오브젝트 숨기기(미리보기·Export·JSON에서 제외), 최근 파일, 라이트/다크 테마
• 저장 위치는 항상 다운로드\<ai 파일명>\

사용

1. aiexporttool.exe 실행 후 .ai 파일을 열거나 끌어다 놓습니다. (aiexporttool.exe 파일.ai로도 열립니다)
2. 캔버스나 트리에서 오브젝트를 고르거나, 캔버스를 드래그해 영역을 잡습니다.
3. 뽑을 것을 체크하고 Export. 구조가 필요하면 JSON.

.ai는 Illustrator에서 "PDF 호환 파일 만들기"(기본값)로 저장된 것이어야 합니다. 텍스트를 윤곽선으로 변환한 파일은 폰트 정보가 없어 도형으로만 보입니다. 서브레이어 이름은 파일 형식상 복원할 수 없습니다.

빌드

npm install
npm start                 # 개발 실행
npm run package           # out/aiexporttool-win32-x64/aiexporttool.exe
npm run make              # out/make/squirrel.windows/x64/ 설치 파일
AI_SMOKE_FILE=some.ai npm start   # UI 없이 열기→트리→PNG/SVG 저장 자기 검증

구조

• Electron + React + TypeScript. Panel-Section-Controller 구조 (AgentWorks/docs/project-rules/)
• .ai는 PDF 컨테이너입니다. mupdf.js로 PDF 부분을 열고, JS Device로 모든 드로잉 op를 가로채 오브젝트 트리를 만들고, 서브트리만 골라 다시 그려 잘라냅니다. 설계와 판단 근거는 AgentWorks/docs/architecture/AI_LAYER_EXPORT_DESIGN_V1.md
• mupdf는 AGPL입니다. 개인/사내 사용 기준으로 만들었습니다.