Communitygithub.com

JMathAnim 스킬

JMathAnim (Java) 애니메이션 장면을 작성, 수정 및 검토합니다. 코드가 `com.jmathanim`을 임포트하거나 `Scene2D`를 확장할 때, 또는 사용자가 Java 기반의 JMathAnim으로 수학/다이어그램 영상 애니메이션을 원할 때 사용하세요.

JMathAnim 스킬란 무엇인가요?

이 스킬은 Java 기반의 오픈소스 애니메이션 라이브러리인 JMathAnim(버전 1.5.1)을 사용하여 수학, 과학, 다이어그램 애니메이션 장면을 작성하고 디버깅하는 개발자와 AI 에이전트(Claude Code, Cursor, Codex 등)를 위해 설계되었습니다. 주요 기능은 코드 작성, 버그 수정, 렌더링 검토를 지원하며, `Scene2D` 확장, `play.*` 명령어, 텍스트/LaTeX 조판, 모션 디자인, 비트 동기화 등 라이브러리의 핵심 API를 다룹니다. 이 스킬은 각 규칙이 실제 렌더링을 통해 검증된 10가지 핵심 규칙과 함께, 레이아웃, 애니메이션, 타이밍, 알려진 버그(조용히 실패하는 오류 등)를 포함한 여러 주제별 규칙 파일을 제공합니다. 사용자는 이 스킬을 통해 더 일관되고 깔끔한 애니메이션을 제작하고, 렌더링 오류를 빠르게 찾아 수정할 수 있습니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/shwemahendran/jmathanim-skill/tree/HEAD/skills/jmathanim

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

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

문서

JMathAnim

JMathAnim은 Java 코드(Scene2D, play.*)로 MP4 애니메이션을 렌더링합니다. 이 스킬은 1.5.1 버전을 대상으로 합니다. 모든 규칙은 실제 렌더링을 통해 검증되었으며, examples/ 디렉토리의 예제는 각 규칙을 입증합니다.

장면 작성 전

  1. 장면에서 사용할 규칙 파일을 읽으세요 (아래 표 참조). 항상 rules/known-bugs.md를 먼저 읽으세요.
  2. starter/StarterScene.java를 프로젝트에 복사하여 확장하고, setupSketch() 안에서 configure(dark)를 호출하세요.
  3. 비트 단위로 계획하세요: 비트당 하나의 아이디어, 각각 고유한 나레이션 라인을 가집니다. rules/motion-design.md를 읽어 비트를 시청하기 좋게 만드는 방법을 확인하세요.

사용자의 편집을 유지하세요. 장면 파일이 이전에 읽었을 때와 달라졌다면, 그 변경은 의도적인 것으로 간주하고 다시 읽은 후 그 위에 작업하세요. 이전 버전으로 덮어쓰지 마세요. 변경이 실수처럼 보이면 질문하세요.

가장 중요한 10가지 규칙

  1. 비트당 하나의 초점을 나레이션 순서대로 드러내세요. 언급되기 전에는 아무것도 나타나지 않습니다. 더 이상 논의되지 않는 것은 흐리게 처리하거나 제거하세요.
  2. 콘텐츠를 안전 영역 안에 유지하세요: x는 ±1.96 이내, y는 −0.97 ~ 1.075 사이. 뷰는 4 × 2.25입니다. -Daudit=true로 실행하여 위반 사항을 확인하세요.
  3. 객체에 상대적으로 배치하세요: stack().toObject(), align(), setLayout()을 사용한 그룹. 절대 좌표로 배치하지 마세요.
  4. 일반 텍스트는 실제 글꼴("Arial")이 적용된 TextMathObject를 사용하세요. LaTeX는 수식에만 사용하세요. 본문 높이는 0.058, 절대 0.050 미만이어서는 안 됩니다. 너비를 예측하고(chars × height × 0.45), 줄이지 말고 줄바꿈하세요.
  5. 모든 비트는 beat(clipSeconds) 다음에 endBeat()로 끝내세요. 실행 시간을 직접 합산하지 마세요. 프레임 단위로 내림 처리됩니다.
  6. 여러 요소를 함께 표시하려면 하나의 play.run(...) 안에 넣으세요. 별도의 호출은 순차적으로 실행됩니다.
  7. 모든 화살표와 연결선에 setArrowThickness(5)를 설정하세요. 기본 화살촉은 너무 큽니다.
  8. 둥근 상자는 roundedRectangle()으로 만드세요. OvalBox.make를 사용하지 마세요.
  9. 이미지는 fadeIn으로 진입시키고, showCreation은 사용하지 마세요. 후자는 조용히 아무것도 추가하지 않습니다.
  10. 렌더 로그에서 ERROR를 확인하세요. 여러 실패는 충돌하지 않고 단지 일부를 생략합니다.

규칙 파일

주제파일
Maven, 장면 생명주기, 설정, 해상도rules/setup.md
좌표, 뷰 크기, 안전 영역rules/coordinates-and-safe-area.md
텍스트, LaTeX, 크기, 너비 추정, 줄바꿈rules/text.md
도형, 색상, setXxx API, 채우기, 레이어, 그림자rules/shapes-and-styling.md
스택, 정렬, 그룹, 테이블rules/layout.md
play.*, Command, 병렬, 지연(stagger), 변형(morph)rules/animation.md
비트, 나레이션 동기화, 템포rules/timing-and-beats.md
디자인 규칙, 이징, 초점, 주석, 카메라 줌, 장면 전환rules/motion-design.md
화살표, 연결선, 엘보, 브레이스rules/arrows-and-connectors.md
비트맵, SVGrules/images-and-svg.md
조용한 실패 및 해결 방법rules/known-bugs.md

장면 작성 후

  1. -Xlint:deprecation,rawtypes로 컴파일하고 모든 경고를 수정하세요.
  2. 미리보기 크기(-Dpreview=true -Daudit=true)로 렌더링하고, AUDIT 또는 ERROR 라인을 수정하세요.
  3. 비디오를 확인하거나 ffmpeg로 프레임을 캡처하세요(ffmpeg -sseof -0.3 -i media/X_360.mp4 -frames:v 1 last.png). 겹침, 잘린 텍스트, 누락된 부분이 없는지 확인하세요.
  4. 미리보기가 완료된 경우에만 프로덕션 크기로 렌더링하세요.

관련 스킬