Slack Gif Creator

# Slack GIF Creator

A toolkit providing utilities and knowledge for creating animated GIFs optimized for Slack.

## Slack Requirements

**Dimensions:** - Emoji GIFs: 128x128 (recommended) - Message GIFs: 480x480

**Parameters:** - FPS: 10-30 (lower is smaller file size) - Colors: 48-128 (fewer = smaller file size) - Duration: Keep under 3 seconds for emoji GIFs

## Core Workflow

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

# 1. Create builder builder = GIFBuilder(width=128, height=128, fps=10)

# 2. Generate frames for i in range(12): frame = Image.new('RGB', (128, 128), (240, 248, 255)) draw = ImageDraw.Draw(frame)

# Draw your animation using PIL primitives # (circles, polygons, lines, etc.)

builder.add_frame(frame)

# 3. Save with optimization builder.save('output.gif', num_colors=48, optimize_for_emoji=True) ```

## Drawing Graphics

### Working with User-Uploaded Images If a user uploads an image, consider whether they want to: - **Use it directly** (e.g., "animate this", "split this into frames") - **Use it as inspiration** (e.g., "make something like this")

Load and work with images using PIL: ```python from PIL import Image

uploaded = Image.open('file.png') # Use directly, or just as reference for colors/style ```

### Drawing from Scratch When drawing graphics from scratch, use PIL ImageDraw primitives:

```python from PIL import ImageDraw

draw = ImageDraw.Draw(frame)

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

# Stars, triangles, any polygon points = [(x1, y1), (x2, y2), (x3, y3), ...] draw.polygon(points, fill=(r, g, b), outline=(r, g, b), width=3)

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

# Rectangles draw.rectangle([x1, y1, x2, y2], fill=(r, g, b), outline=(r, g, b), width=3) ```

**Don't use:** Emoji fonts (unreliable across platforms) or assume pre-packaged graphics exist in this skill.

### Making Graphics Look Good

Graphics should look polished and creative, not basic. Here's how:

**Use thicker lines** - Always set `width=2` or higher for outlines and lines. Thin lines (width=1) look choppy and amateurish.

**Add visual depth**: - Use gradients for backgrounds (`create_gradient_background`) - Layer multiple shapes for complexity (e.g., a star with a smaller star inside)

**Make shapes more interesting**: - Don't just draw a plain circle - add highlights, rings, or patterns - Stars can have glows (draw larger, semi-transparent versions behind) - Combine multiple shapes (stars + sparkles, circles + rings)

**Pay attention to colors**: - Use vibrant, complementary colors - Add contrast (dark outlines on light shapes, light outlines on dark shapes) - Consider the overall composition

**For complex shapes** (hearts, snowflakes, etc.): - Use combinations of polygons and ellipses - Calculate points carefully for symmetry - Add details (a heart can have a highlight curve, snowflakes have intricate branches)

Be creative and detailed! A good Slack GIF should look polished, not like placeholder graphics.

## Available Utilities

### GIFBuilder (`core.gif_builder`) Assembles frames and optimizes for Slack: ```python builder = GIFBuilder(width=128, height=128, fps=10) builder.add_frame(frame) # Add PIL Image builder.add_frames(frames) # Add list of frames builder.save('out.gif', num_colors=48, optimize_for_emoji=True, remove_duplicates=True) ```

### Validators (`core.validators`) Check if GIF meets Slack requirements: ```python from core.validators import validate_gif, is_slack_ready

# Detailed validation passes, info = validate_gif('my.gif', is_emoji=True, verbose=True)

# Quick check if is_slack_ready('my.gif'): print("Ready!") ```

### Easing Functions (`core.easing`) Smooth motion instead of linear: ```python from core.easing import interpolate

# Progress from 0.0 to 1.0 t = i / (num_frames - 1)

# Apply easing y = interpolate(start=0, end=400, t=t, easing='ease_out')

# Available: linear, ease_in, ease_out, ease_in_out, # bounce_out, elastic_out, back_out ```

### Frame Helpers (`core.frame_composer`) Convenience functions for common needs: ```python from core.frame_composer import ( create_blank_frame, # Solid color background create_gradient_background, # Vertical gradient draw_circle, # Helper for circles draw_text, # Simple text rendering draw_star # 5-pointed star ) ```

## Animation Concepts

### Shake/Vibrate Offset object position with oscillation: - Use `math.sin()` or `math.cos()` with frame index - Add small random variations for natural feel - Apply to x and/or y position

### Pulse/Heartbeat Scale object size rhythmically: - Use `math.sin(t * frequency * 2 * math.pi)` for smooth pulse - For heartbeat: two quick pulses then pause (adjust sine wave) - Scale between 0.8 and 1.2 of base size

### Bounce Object falls and bounces: - Use `interpolate()` wi