PPT'em All (Figma to PPT)

Figma에서 디자인한 프레임을 macOS의 PPT(PPT'em All)로 실시간 전송해 주는 완벽한 브릿지 플러그인입니다.

✨ 주요 기능

• ⚡️ 실시간 슬라이드 변환: Figma에서 선택한 프레임을 클릭 한 번으로 PPT의 새 슬라이드로 보냅니다.
• 🎨 높은 시각적 일치도(Fidelity): 도형, 텍스트, 이미지 레이어의 적절한 속성을 최대한 유지하며, 복잡한 벡터는 자동으로 변환합니다.
• 📐 반응형 레이아웃 대응: 첫 번째로 선택한 프레임을 '기준 프레임'으로 삼아 일괄적으로 슬라이드 크기를 똑똑하게 맞춥니다.
• 🤖 AI 다듬기 (AI 보정): OpenAI 호환 API를 연결하여 UI와 변환 오차를 AI가 스스로 분석하고 텍스트 박스 위치 등을 미세 조정합니다.

🚀 빠른 시작

이 플러그인은 로컬 기기(macOS)에 켜져 있는 PPT를 제어하기 위해 로컬 에이전트가 필요합니다. 터미널에서 아래 명령어 하나만 실행하면 준비가 끝납니다.

npx pptem-all

Note: 에이전트가 실행되면 기본적으로 http://127.0.0.1:54123 주소에서 Figma 플러그인과 통신을 대기합니다.

🍎 대안: macOS 네이티브 메뉴바 앱 사용하기

매번 터미널을 열기 번거롭다면, 백그라운드에서 조용히 실행되는 메뉴바 앱을 사용할 수 있습니다.

• GitHub Releases에서 최신 .app 버전을 다운로드할 수 있습니다.
• 상단 메뉴바에서 손쉽게 에이전트를 시작/종료하고 로그를 확인할 수 있습니다.

🛠️ 설치 및 개발 가이드

직접 코드를 수정하고 플러그인을 빌드하려면 다음 단계를 따르세요.

1) 저장소 클론 및 패키지 설치

git clone https://github.com/hiteq/FigmaPlugin-Frame2PPTX.git
cd FigmaPlugin-Frame2PPTX
yarn install
# 또는 npm install

2) 플러그인 빌드

# 개발 모드 (변경 사항 자동 감지)
yarn dev

# 프로덕션 빌드
yarn build

3) Figma에 플러그인 로드

1. Figma 데스크톱 앱 실행
2. 상단 메뉴에서 Plugins > Development > Import plugin from manifest... 선택
3. 클론한 프로젝트 폴더 내의 manifest.json 파일 열기

4) 에이전트 실행 명령어 모음

• yarn agent: 개발용 로컬 에이전트를 바로 실행합니다.
• yarn native:run: macOS 네이티브 메뉴바 앱을 개발 모드로 실행합니다.
• yarn native:bundle: macOS용 배포 가능한 .app 번들을 생성합니다.

⚙️ 상세 설정 및 팁

변환 옵션

• Shape / Text Mode:
  • Editable: PPT에서 텍스트와 도형을 직접 수정할 수 있도록 네이티브 객체로 넘깁니다.
  • Raster / Pixel: 복잡한 그래픽이나 깨지기 쉬운 텍스트를 이미지 형태로 안전하게 변환하여 깨짐을 방지합니다.
• 기준 프레임 지정: 여러 프레임을 동시에 선택할 경우, 가장 먼저 선택된 프레임(1번 칩)의 크기가 전체 슬라이드의 해상도 기준이 됩니다.

AI 보정 (AI Polish) 기능 활성화

UI 하단의 AI 보정 (Sparkles ✨ 아이콘) 옵션을 켜면, 로컬 에이전트가 렌더링된 결과를 Figma 원본과 비교해 차이가 나는 부분을 스스로 교정합니다.

• API Base URL, Model명, API Key (OpenAI 호환)는 이 기기의 Figma 플러그인 저장소(figma.clientStorage)에 로컬로 저장됩니다.
• API Key는 AI 다듬기를 실제로 실행할 때만 사용자가 입력한 Base URL로 전송됩니다. 별도 분석/텔레메트리는 보내지 않습니다.
• 원하면 언제든 값을 지우거나 다른 엔드포인트로 바꿀 수 있습니다.

💡 문제 해결 (Troubleshooting)

• 에이전트 연결 실패 (연결 필요 메시지):
  • 터미널에서 npx pptem-all가 정상적으로 동작 중인지 확인해 주세요.
  • 브라우저 기반의 Figma가 아닌 Figma 데스크톱 앱 사용을 권장합니다. (웹 브라우저는 보안 정책상 로컬 포트 연결을 차단할 수 있습니다.)
• 권한 요청 팝업: macOS 환경에서 제어를 위해 "System Events" 또는 "PPT" 제어 권한을 묻는 팝업이 나타나면 **허용(OK)**해 주어야 정상 동작합니다.
• 포트 충돌: 만약 54123 포트를 이미 다른 앱이 점유 중이라면, 플러그인 UI 우측 하단의 포트 번호를 변경하고 에이전트도 포트를 맞추어 실행하세요 (PORT=54321 npx pptem-all).

📂 프로젝트 구조

repo-root/
├── src/                  # Figma 플러그인 프론트엔드 (React, TailwindCSS)
│   ├── App.tsx           # 메인 UI 컴포넌트
│   ├── code.ts           # Figma 캔버스 조작 스크립트 (메인 스레드)
│   └── logic/            # Figma ↔ UI ↔ Agent 통신 로직
├── ppt-local-agent/      # 로컬 변환 에이전트 (Express, AppleScript)
│   └── lib/              # PPT 제어 및 렌더링 코어 로직
├── macos-native-app/     # macOS 네이티브 메뉴바 앱 소스 (Swift)
├── manifest.json         # 플러그인 설정 및 권한 제어 정보
└── vite.config.ts        # 프론트엔드 빌드 설정

⚖️ License & Disclaimer

This project is an independent third-party tool and is not affiliated with, endorsed by, or sponsored by Microsoft Corporation. 'PPT' and 'PowerPoint' are registered trademarks of Microsoft Corporation.

🤝 Support

• 이슈/버그 리포트: GitHub Issues
• 개인정보 처리 방침: Privacy Policy
• 지원 페이지: Support
• 메뉴바 앱 다운로드: GitHub Releases
• 개인정보 처리 방침 초안: PRIVACY.md
• 커뮤니티 제출 초안: COMMUNITY_SUBMISSION.md