mcpField
S
slack-gif-creator

slack-gif-creator

github.com/sickn33创意与媒体48.7k445 次安装今天更新
代码仓库

关于 slack-gif-creator

Slack GIF Creator 是用于制作适配 Slack 表情和消息的动画 GIF 的工具集与技能。它提供 Python 工具来组装并验证帧,可控制动画和文件大小;不会上传文件到 Slack。

主要功能

  1. 01从图像帧构建 GIF
  2. 02验证本地 Slack 目标约束
  3. 03提供缓动与帧合成辅助工具
  4. 04控制尺寸、帧率和颜色
  5. 05优化 GIF 大小并移除重复帧

适用场景

  1. 01制作 Slack 动画表情
  2. 02准备 Slack 消息用 GIF
  3. 03为用户提供的图像制作动画
  4. 04按本地目标约束检查 GIF

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/sickn33/agentic-awesome-skills --skill slack-gif-creator

安装后在 Claude Code 中输入/slack-gif-creator确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

.snyk
requirements.txt
LICENSE.txt
core/
easing.py
gif_builder.py
validators.py
frame_composer.py

详细介绍

Slack GIF 创建工具

这是一套工具包,提供创建适用于 Slack 的动画 GIF 所需的实用工具和知识。

目录修改说明:已明确 Slack 建议和验证器限制,修正 GIF 时长/格式检查和基础构建器的输入处理。随附的 Apache-2.0 许可证文本予以保留;本次审查并未确认是否缺少上游作者信息。

请从解析后的技能根目录运行(或将其添加到 Python 模块路径),使用隔离环境和随附的依赖项。解码不可信图像时,请限制尺寸和帧数,并保留 Pillow 的解压缩炸弹防护。请导出到新的任务专用路径;分享/上传需要获得用户指定的工作区和权限。避免使用闪烁动画,并提供静态预览。

Slack 目标和建议

尺寸:

  • 表情 GIF:128x128(建议)
  • 消息 GIF:480x480

Slack 建议自定义方形图片小于 128 KB,并支持最多 50 帧的 GIF;请参阅 Slack 自定义表情指南。此处的尺寸/FPS/颜色/时长数值属于设计目标,并非完整的平台接受规则。消息 GIF 的尺寸仅供参考。

参数:

  • FPS:10-30(越低,文件越小)
  • 颜色:48-128(越少,文件越小)
  • 时长:表情 GIF 应控制在 3 秒以内

核心工作流

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)

绘制图形

使用用户上传的图像

如果用户上传了图像,请考虑他们想要:

  • 直接使用(例如,“为这张图片制作动画”“将其拆分成多个帧”)
  • 以其为灵感(例如,“制作一个类似这样的图像”)

使用 PIL 加载和处理图像:

from PIL import Image

uploaded = Image.open('file.png')
# Use directly, or just as reference for colors/style
从零开始绘制

从零开始绘制图形时,请使用 PIL ImageDraw 基本图形:

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)

不要使用: Emoji 字体(跨平台表现不可靠),也不要假设此技能中已有预先打包的图形。

让图形更美观

图形应该精致、有创意,而不是平平无奇。以下是一些建议:

使用更粗的线条——始终将 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)  # 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)
验证器(core.validators)

检查 GIF 是否符合 Slack 要求:

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!")
缓动函数(core.easing)

实现平滑而非线性的运动:

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 (these may overshoot the range)
帧辅助工具(core.frame_composer)

提供常见需求的便捷函数:

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
)

动画概念

抖动/振动

通过振荡改变对象位置:

  • 使用 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 图像,并调整 alpha 通道
  • 或使用 Image.blend(image1, image2, alpha)
  • 淡入:alpha 从 0 变为 1
  • 淡出:alpha 从 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
  • 随时间淡化粒子(降低 alpha)

优化策略

仅在用户要求减小文件大小时,才实施以下几种方法:

  1. 减少帧数 - 降低 FPS(例如从 20 降至 10)或缩短时长
  2. 减少颜色数 - 使用 num_colors=48,而非 128
  3. 缩小尺寸 - 使用 128x128,而非 480x480
  4. 移除重复帧 - 在此实现中,remove_duplicates=True 会缩短时长;若必须保留暂停效果或时长,则设为 false
  5. Emoji 模式 - optimize_for_emoji=True 会自动优化
# Maximum optimization for emoji
builder.save(
    'emoji.gif',
    num_colors=48,
    optimize_for_emoji=True,
    remove_duplicates=True
)

设计理念

此技能提供:

  • 知识:Slack 的要求和动画概念
  • 工具:GIFBuilder、验证器、缓动函数
  • 灵活性:使用 PIL 基元创建动画逻辑

此技能不提供:

  • 固定的动画模板或预制函数
  • Emoji 字体渲染(在不同平台上的表现不可靠)
  • 内置于此技能中的预制图形库

关于用户上传内容的说明:此技能不包含预制图形,但如果用户上传了图像,可使用 PIL 加载并处理;应根据用户的请求判断他们是希望直接使用图像,还是仅将其作为灵感来源。

尽情发挥创意!组合不同概念(弹跳 + 旋转、脉动 + 滑动等),并充分利用 PIL 的功能。

依赖项

pip install pillow imageio numpy

适用场景

当需要执行概述中描述的工作流或操作时,可使用此技能。

is_slack_ready 检查的是本地编码和目标约束,而非实际上传是否成功。转换为 RGB 会丢弃透明度。Emoji 优化会修改存储的帧,也可能缩短动画;请检查编码后的文件,不要仅凭标称 FPS 或返回的调色板数量判断。此软件包不会向 Slack 上传任何内容。

限制

  • 仅当任务明确符合上述范围时,才使用此技能。
  • 不要将输出视为针对特定环境进行验证、测试或专家审查的替代品。
  • 如果缺少必要的输入、权限、安全边界或成功标准,请停止并请求澄清。

评论

支持 Markdown