📌 참고: 이 문서는 공식 Claude Code 문서의 원문 + 레퍼런스입니다.

• 원문 링크를 직접 사용하셔도 됩니다
• 이 파일을 .claude/skills/ 하위에 복사하여 스킬로 등록할 수도 있습니다

(2026.03.15 기준)

Slack GIF 생성기

Slack에 최적화된 애니메이션 GIF를 생성하기 위한 유틸리티와 지식을 제공하는 툴킷입니다.

Slack 요구사항

크기:

• 이모지 GIF: 128x128 (권장)
• 메시지 GIF: 480x480

파라미터:

• FPS: 10-30 (낮을수록 파일 크기가 작음)
• 색상: 48-128 (적을수록 파일 크기가 작음)
• 재생 시간: 이모지 GIF의 경우 3초 미만 유지

핵심 워크플로우

from core.gif_builder import GIFBuilder
from PIL import Image, ImageDraw

# 1. 빌더 생성
builder = GIFBuilder(width=128, height=128, fps=10)

# 2. 프레임 생성
for i in range(12):
    frame = Image.new('RGB', (128, 128), (240, 248, 255))
    draw = ImageDraw.Draw(frame)

    # PIL 기본 도형으로 애니메이션 그리기
    # (원, 다각형, 선 등)

    builder.add_frame(frame)

# 3. 최적화와 함께 저장
builder.save('output.gif', num_colors=48, optimize_for_emoji=True)

그래픽 그리기

사용자 업로드 이미지 작업

사용자가 이미지를 업로드한 경우, 다음 중 어떤 의도인지 파악하세요:

• 직접 사용 (예: "이것을 애니메이션으로 만들어줘", "이것을 프레임으로 분할해줘")
• 영감으로 사용 (예: "이것과 비슷한 것을 만들어줘")

PIL을 사용하여 이미지를 로드하고 작업하세요:

from PIL import Image

uploaded = Image.open('file.png')
# 직접 사용하거나, 색상/스타일 참고용으로만 사용

처음부터 그리기

처음부터 그래픽을 그릴 때는 PIL ImageDraw 기본 도형을 사용하세요:

from PIL import ImageDraw

draw = ImageDraw.Draw(frame)

# 원/타원
draw.ellipse([x1, y1, x2, y2], fill=(r, g, b), outline=(r, g, b), width=3)

# 별, 삼각형, 모든 다각형
points = [(x1, y1), (x2, y2), (x3, y3), ...]
draw.polygon(points, fill=(r, g, b), outline=(r, g, b), width=3)

# 선
draw.line([(x1, y1), (x2, y2)], fill=(r, g, b), width=5)

# 직사각형
draw.rectangle([x1, y1, x2, y2], fill=(r, g, b), outline=(r, g, b), width=3)

사용하지 마세요: 이모지 폰트(플랫폼마다 동작이 다름) 또는 이 스킬에 미리 패키징된 그래픽이 있다고 가정하는 것.

그래픽을 보기 좋게 만들기

그래픽은 기본적인 것이 아니라 세련되고 창의적으로 보여야 합니다. 방법은 다음과 같습니다:

두꺼운 선 사용 - 윤곽선과 선에 항상 width=2 이상을 설정하세요. 얇은 선(width=1)은 거칠고 아마추어적으로 보입니다.

시각적 깊이 추가:

• 배경에 그라데이션 사용 (create_gradient_background)
• 복잡한 느낌을 위해 여러 도형 겹치기 (예: 큰 별 안에 작은 별)

도형을 더 흥미롭게 만들기:

• 단순한 원만 그리지 말고 - 하이라이트, 링, 패턴을 추가하세요
• 별에 발광 효과를 줄 수 있습니다 (뒤에 더 크고 반투명한 버전을 그리기)
• 여러 도형을 조합하세요 (별 + 반짝임, 원 + 링)

색상에 주의:

• 생동감 있고 보색 관계의 색상 사용
• 대비 추가 (밝은 도형에 어두운 윤곽선, 어두운 도형에 밝은 윤곽선)
• 전체 구성 고려

복잡한 도형 (하트, 눈꽃 등)의 경우:

• 다각형과 타원의 조합 사용
• 대칭을 위해 포인트를 신중하게 계산
• 세부 사항 추가 (하트에는 하이라이트 곡선, 눈꽃에는 정교한 가지)

창의적이고 디테일하게 만드세요! 좋은 Slack GIF는 임시 그래픽이 아니라 세련되게 보여야 합니다.

사용 가능한 유틸리티

GIFBuilder (core.gif_builder)

프레임을 조립하고 Slack에 최적화합니다:

builder = GIFBuilder(width=128, height=128, fps=10)
builder.add_frame(frame)  # PIL Image 추가
builder.add_frames(frames)  # 프레임 목록 추가
builder.save('out.gif', num_colors=48, optimize_for_emoji=True, remove_duplicates=True)

Validators (core.validators)

GIF가 Slack 요구사항을 충족하는지 확인합니다:

from core.validators import validate_gif, is_slack_ready

# 상세 검증
passes, info = validate_gif('my.gif', is_emoji=True, verbose=True)

# 빠른 확인
if is_slack_ready('my.gif'):
    print("Ready!")

Easing Functions (core.easing)

선형 대신 부드러운 모션:

from core.easing import interpolate

# 0.0에서 1.0까지의 진행도
t = i / (num_frames - 1)

# 이징 적용
y = interpolate(start=0, end=400, t=t, easing='ease_out')

# 사용 가능: linear, ease_in, ease_out, ease_in_out,
#           bounce_out, elastic_out, back_out

Frame Helpers (core.frame_composer)

일반적인 요구사항을 위한 편의 함수:

from core.frame_composer import (
    create_blank_frame,         # 단색 배경
    create_gradient_background,  # 수직 그라데이션
    draw_circle,                # 원 헬퍼
    draw_text,                  # 간단한 텍스트 렌더링
    draw_star                   # 5각 별
)

애니메이션 개념

흔들림/진동

오실레이션으로 객체 위치 오프셋:

• math.sin() 또는 math.cos()를 프레임 인덱스와 함께 사용
• 자연스러운 느낌을 위해 작은 랜덤 변화 추가
• x 및/또는 y 위치에 적용

펄스/하트비트

리듬감 있게 객체 크기 조절:

• math.sin(t * frequency * 2 * math.pi)를 사용하여 부드러운 펄스
• 하트비트의 경우: 두 번의 빠른 펄스 후 멈춤 (사인파 조정)
• 기본 크기의 0.8에서 1.2 사이로 스케일

바운스

객체가 떨어지고 튀어오름:

• 착지에 interpolate()와 easing='bounce_out' 사용
• 낙하(가속)에 easing='ease_in' 사용
• 매 프레임마다 y 속도를 증가시켜 중력 적용

회전/로테이트

중심을 기준으로 객체 회전:

• PIL: image.rotate(angle, resample=Image.BICUBIC)
• 흔들림 효과: 선형 대신 사인파를 각도에 사용

페이드 인/아웃

점진적으로 나타나거나 사라짐:

• RGBA 이미지를 생성하고 알파 채널 조정
• 또는 Image.blend(image1, image2, alpha) 사용
• 페이드 인: 알파 0에서 1
• 페이드 아웃: 알파 1에서 0

슬라이드

객체를 화면 밖에서 위치로 이동:

• 시작 위치: 프레임 경계 밖
• 끝 위치: 목표 위치
• 부드러운 정지를 위해 interpolate()와 easing='ease_out' 사용
• 오버슈트 효과: easing='back_out' 사용

줌

줌 효과를 위한 스케일 및 위치 조정:

• 줌 인: 0.1에서 2.0으로 스케일, 중앙 크롭
• 줌 아웃: 2.0에서 1.0으로 스케일
• 드라마틱한 효과를 위해 모션 블러 추가 가능 (PIL 필터)

폭발/파티클 버스트

바깥쪽으로 방사되는 파티클 생성:

• 랜덤 각도와 속도로 파티클 생성
• 각 파티클 업데이트: x += vx, y += vy
• 중력 추가: vy += gravity_constant
• 시간이 지남에 따라 파티클 페이드 아웃 (알파 감소)

최적화 전략

파일 크기를 줄이라는 요청이 있을 때만, 다음 방법 중 몇 가지를 구현하세요:

1. 프레임 수 줄이기 - FPS 낮추기 (20 대신 10) 또는 재생 시간 단축
2. 색상 수 줄이기 - 128 대신 num_colors=48
3. 크기 줄이기 - 480x480 대신 128x128
4. 중복 제거 - save()에서 remove_duplicates=True
5. 이모지 모드 - optimize_for_emoji=True가 자동 최적화

# 이모지를 위한 최대 최적화
builder.save(
    'emoji.gif',
    num_colors=48,
    optimize_for_emoji=True,
    remove_duplicates=True
)

철학

이 스킬이 제공하는 것:

• 지식: Slack의 요구사항과 애니메이션 개념
• 유틸리티: GIFBuilder, validators, easing functions
• 유연성: PIL 기본 도형을 사용하여 애니메이션 로직 생성

이 스킬이 제공하지 않는 것:

• 고정된 애니메이션 템플릿이나 미리 만들어진 함수
• 이모지 폰트 렌더링 (플랫폼마다 동작이 다름)
• 스킬에 내장된 미리 패키징된 그래픽 라이브러리

사용자 업로드에 대한 참고: 이 스킬은 미리 만들어진 그래픽을 포함하지 않지만, 사용자가 이미지를 업로드하면 PIL을 사용하여 로드하고 작업하세요 - 사용자의 요청에 따라 직접 사용할지 영감으로만 사용할지 판단하세요.

창의적으로 만드세요! 개념을 조합하고 (바운스 + 회전, 펄스 + 슬라이드 등) PIL의 모든 기능을 활용하세요.

의존성

pip install pillow imageio numpy