vibe-coding-课程-干货集训

02 【实战】用Claude Skills做PPT

2026年2月28日1. 和AI描述清楚你的需求/问题

学前必看：大家先关注公众号，添加小助手微信，课程和内容都会第一时间同步~（还有更多彩蛋福利等待解锁哦）

重要原则

和AI描述清楚你的需求/问题
把你的成熟经验传授给它
把AI当合作伙伴，和它共创Skill

行动指南

Step 1：安装Skill-Creator

用Claude官方提供的Skill-Creator，它能帮你梳理结构和逻辑，事半功倍

https://github.com/anthropics/skills/tree/main/skills/skill-creator

Step 2：描述你的问题/需求

在Claude Code里描述你的需求，让Claude通过询问，完全理解你的需求细节

我想创建一个大师级的Claude Skill，帮我解决问题提高效率请先问我几个问题，帮我理清思路：1. 我想解决什么问题？2. 这个Skill需要完成哪些具体任务？3. 有没有参考示例或现有的工具？在充分了解我的需求后，请帮我：1. 规划Skill的整体架构（包含哪些文件、目录结构）2. 设计Skill的工作流程（从用户输入到最终输出的完整步骤）

Step 3：让AI设计Skill的结构和流程

明确需求后，Claude会使用Skill-Creator帮你设计Skill的架构和流程

Step 4：和AI讨论调整，确认最终的结构和流程

AI会考虑不周到，你需要给它一些个人经验和建议，优化它的工作流
确认结构和工作流程后，继续下一步

Step 5：AI开始完善Skill

让AI完善各部分文档，包括SKILL.md，各种Python脚本等等

Step 6：讨论并完善Skill细节

随时打开Thinking流，看看它的想法有没有劈叉
‼️AI写完的SKILL.md，要仔细看一遍

Step 7：测试生成效果，优化Skill

跑测试，每次测试发现问题，都截图给Claude，让它优化
优化N轮后，最终你的SKILL就会变成一个稳定输出的、大师级别的作品

实操方法

新建项目

打开VS code，新建项目

确定需求

在Claude Code中输入这段提示词，让Claude和你明确问题/痛点

我想创建一个新的PPT Skill，帮我自动生成PPT我想解决的问题1. PPT文字编排很费时间2. 我做不出好看的PPT请先跟我确认需求细节：1. 我想解决什么问题？2. 这个Skill需要完成哪些具体任务？在充分了解我的需求后，请帮我：1. 规划Skill的整体架构（包含哪些文件、目录结构）2. 设计Skill的工作流程（从用户输入到最终输出的完整步骤）

确定Skill结构和工作流程

Claude确认需求后，开始调用Skill-Creator设计Skill的结构和工作流程
要注意看Skill给你生成的工作流程
确定工作流程后，Claude开始完善Skill

配置生图API

须知
如果你能稳定Gemini，那就直接用Gemini API。通过这里获得API Key
如果你不能稳定使用Gemini，使用以下方法
中转平台：https://api.apicore.ai/login
打开首页，进入控制台
新增令牌
进入「API令牌面板」，点击「添加令牌」
设置一个令牌名称
模型可以选择gemini-2.5-flash-image-hd 或 gemini-3-pro-image-preview-4k
点击保存，令牌生成
充值
点击个人设置 - 「钱包」
可以预充值10元（大概能生成40-50张照片）
配置API Key
完成充值后，回到VS code，让Claude帮你配置好API Key

这是我的生图API Keyxxxx（替换为你的密钥）这是服务接入的文档https://doc.apicore.ai/api-314031054

增加风格文档

点击项目中的「Style」文件夹，点击新增文件的按钮
命名文件，必须是.py后缀，点击回车保存
把这段提示词复制粘贴进去。保存

---id: deep-space-techname: 深空科技风格description: Apple 发布会极简主义 + 棱镜流光玻璃 + 深空神秘氛围tags: [科技, AI, 发布会, 高端, 硬科技]---**# 深空科技风格****## 适用场景**- 科技产品发布会- AI/硬科技公司路演- 技术架构展示- 高端品牌提案- 未来趋势报告---**## SYSTEM_PROMPT**你是一位专家级 UI/UX 演示设计师，请生成高保真的 16:9 演示文稿幻灯片。---**## DESIGN_SYSTEM****### STYLE_OVERVIEW**风格融合 Apple 发布会的极简克制、棱镜流光的优雅科技感和深空的神秘氛围。整体气质需要高端、优雅、深邃且有诗意的浪漫感。画面要极度克制，大量留白，让核心元素成为绝对焦点。3D 元素要有"呼吸感"，像是有生命的能量体。**### COLOR**纯黑 #000000 或极深空灰 #0a0a0a 作为绝对基底，营造深空感。3D 元素使用棱镜色散产生的彩虹光谱：- 主色调：光谱蓝紫 → 青 → 粉的渐变流动- 棱镜折射产生的自然彩虹色（红橙黄绿蓝靛紫的光谱过渡）- 类似肥皂泡或油膜的 iridescent（彩虹光泽）效果文字使用纯白 #ffffff，与深色背景形成强对比。**### LIGHTING**采用柔和的体积光，创造梦幻的光影氛围。关键技法：- 棱镜色散效果（chromatic dispersion）：光线穿过玻璃产生彩虹光谱分离- 柔和的边缘光晕（soft rim glow）而非锐利切割- 从 3D 物体内部向外散射的柔光- 轻微的光雾弥漫（light mist）增加氛围感光照要有诗意和呼吸感，像北极光或星云的柔和流动。**### LAYOUT**采用极简精准的网格系统，大量使用负空间（60%+ 留白）。内容区域使用精准对齐，无装饰性边框。如需容器，使用极细的发光描边（1px, 20% 透明度）或轻微的深色玻璃材质，绝不使用厚重的卡片或阴影。字体层级要有戏剧化对比：超大标题 + 极小正文。**### MATERIAL**渲染优雅的 3D 流光玻璃体作为视觉锚点。核心设计语言：- ****材质****：透明/半透明的棱镜玻璃，光线穿过时产生彩虹色散（chromatic dispersion / prismatic refraction）。表面有液态金属般的流动光纹，类似参考图中的玻璃蝴蝶或玻璃键帽质感。材质要有多层次的透明度和复杂的内部折射。- ****形状****：有机流动的曲面为主——像液态玻璃凝固的瞬间、飘动的丝带、展翅的蝴蝶、流体雕塑。边缘柔和有呼吸感，而非硬边切割。可以有几何感但要融入有机曲线。- ****色彩****：通过棱镜折射产生自然的彩虹光谱流动（红→橙→黄→绿→青→蓝→紫），类似肥皂泡的 iridescent 效果。颜色是光线穿过玻璃自然产生的，而非人工着色。- ****光效****：柔和的内部散射光，边缘有梦幻的光晕而非锐利轮廓。整体像在发光但又很优雅克制。- ****氛围****：物体周围可有轻微的光雾或星尘弥漫，增加诗意和呼吸感。**### BACKGROUND**深邃的黑色基底，可加入极其细微的星云纹理或轻微的径向渐变（从中心的深灰 #111 到边缘的纯黑 #000），营造深空感。可有若隐若现的星云光带增加诗意，但要非常克制，不能抢夺 3D 元素的焦点。**### TYPOGRAPHY**使用干净的无衬线字体（SF Pro、Inter、Helvetica Neue），建立极端的层级对比。标题可超大且加粗，正文保持克制。如有图表，使用发光描边的线性图表、带能量感的环形进度条或悬浮的大数字，图表风格要精密但不花哨。**### RENDER_QUALITY**超高清渲染，真实的玻璃折射和棱镜色散效果，柔和的光影过渡。整体质感要像高端艺术装置或概念设计——优雅、有生命力、科技与艺术的融合。参考：玻璃雕塑、液态金属、北极光的诗意美感。---**## RULES****### [MUST] 中文渲染**Chinese text rendering is CRITICAL. Follow these rules strictly:- All Chinese characters must be perfectly clear, sharp, and 100% legible- Use professional sans-serif Chinese fonts (like PingFang, Noto Sans SC, Source Han Sans)- Each character must have correct strokes - no merged, blurry, or malformed characters- Maintain proper character spacing (not too tight, not too loose)- Text must have strong contrast against background (white text on dark background)- VERIFY: Every Chinese character must be recognizable and correctly formed**### [MUST] 约束**Do NOT add any text, logos, or elements not specified in the content below. Keep the composition extremely minimal.---**## PAGE_TEMPLATES****### cover******构图****：标题为绝对主角，配合一个优雅的 3D 流光玻璃体作为视觉锚点。大量留白，深空背景。****PROMPT****：```请生成封面页。标题：{{TITLE}}副标题：{{SUBTITLE}}标题使用超大粗体白色字，位置居中或偏左下。画面中放置一个优雅的 3D 流光玻璃体作为视觉锚点——形态是有机流动的曲面，像液态玻璃凝固的瞬间、飘动的丝带或展翅的蝴蝶。材质为透明棱镜玻璃，光线穿过时产生彩虹色散效果（chromatic dispersion），表面有液态金属般的流动光纹和 iridescent 彩虹光泽。边缘有柔和的光晕而非锐利轮廓，整体像在呼吸的能量体。背景是纯黑的深空，可有轻微的光雾弥漫。整体画面极度克制，60% 以上为负空间，让标题和 3D 物体成为仅有的焦点。```**### content******构图****：极简网格布局，内容精准对齐，大量留白。可用极细的发光线条分隔区域。****PROMPT****：```请生成内容页。采用极简的网格布局，将以下内容精准排列。标题：{{TITLE}}要点：{{ITEMS}}背景为纯黑。标题使用中等大小的白色粗体字，位于页面上方。要点内容使用较小的白色或浅灰色字体，排列整齐。可使用极细的发光线条（1px, 科技蓝, 20% 透明度）作为视觉分隔。每个要点前可配一个极简的发光图标或光点作为标记。页面保持 50% 以上留白，内容区域精准对齐，体现精密感。不使用卡片、阴影或厚重的容器。```**### data******构图****：数据可视化为主角，使用有科技感的图表样式，配合发光效果。****PROMPT****：```请生成数据页。数据内容：{{CONTENT}}使用有科技感的数据可视化：发光描边的环形进度条、带能量脉冲效果的柱状图、或悬浮的超大关键数字。图表使用科技蓝作为主色，配合发光效果。关键数字可以超大显示，带有轻微的发光光晕。背景纯黑，图表元素像是悬浮在深空中。整体风格精密、克制，数据清晰易读，避免过多装饰。```**### end******构图****：极简收尾，中心放置感谢语或行动号召，配小型 3D 流光装饰物。****PROMPT****：```请生成结束页。画面极简有力。中心展示：{{CONTENT}}文字使用白色大字居中显示。可配一个精致的小型 3D 流光玻璃体——形态优雅流动，材质为透明棱镜玻璃，有彩虹色散和 iridescent 光泽。边缘有柔和光晕，像在轻轻呼吸。背景为纯黑深空，可有轻微的光雾点缀。画面主体是文字，3D 元素作为点睛，整体保持极度克制和诗意美感。```---**## TECH_SPECS**- 推荐模型：gemini-2.0-flash-exp 或 gemini-3-pro-image-preview- 比例：16:9- 分辨率：2K (2752×1536) 或 4K (5504×3072)- 推荐分辨率：2K（平衡质量和生成速度）- 生成时间：2K 约 30 秒/页，4K 约 60 秒/页

测试&优化PPT Skill

项目走到这里，Skill基本能正常工作。接下来要做的就是：不断优化
测试
你可以用Claude帮你写一篇测试文章作为输入，比如让它写“Claude Skills新手指南” 1. 这份作为参考
把它放进项目中
让Claude开始生成ppt ``` @article.md 生成这个文章的ppt

3. 优化
  1. 如果发现ppt糊，怎么办？让Claude写个脚本把图片变清晰
    1. 我让Claude Code写的超分脚本，清晰度直接拉到4K
    ```Python
#!/usr/bin/env python3"""AtomSlides - Image Upscaler===========================将图片放大到更高分辨率（2K → 4K）使用方法:    python upscale.py --image slide.png --scale 2 --output slide-4k.png支持多种放大方式：1. Pillow 内置（LANCZOS）- 基础质量，无需额外依赖2. Real-ESRGAN - 高质量 AI 放大（需要安装）"""import argparseimport sysfrom pathlib import Pathtry:    from PIL import Imageexcept ImportError:    print("错误: 请安装 Pillow 库")    print("运行: pip install Pillow")    sys.exit(1)def upscale_pillow(image_path, scale, output_path, method="lanczos"):    """    使用 Pillow 进行图片放大    Args:        image_path: 输入图片路径        scale: 放大倍数（2 = 2倍放大）        output_path: 输出图片路径        method: 放大算法 (lanczos, bicubic, bilinear)    Returns:        bool: 是否成功    """    resample_methods = {        "lanczos": Image.Resampling.LANCZOS,        "bicubic": Image.Resampling.BICUBIC,        "bilinear": Image.Resampling.BILINEAR,    }    resample = resample_methods.get(method.lower(), Image.Resampling.LANCZOS)    try:        img = Image.open(image_path)        original_size = img.size        new_size = (int(img.width * scale), int(img.height * scale))        print(f"放大中...")        print(f"原始尺寸: {original_size[0]}x{original_size[1]}")        print(f"目标尺寸: {new_size[0]}x{new_size[1]}")        print(f"放大算法: {method.upper()}")        # 放大图片        img_upscaled = img.resize(new_size, resample)        # 确保输出目录存在        output_path = Path(output_path)        output_path.parent.mkdir(parents=True, exist_ok=True)        # 保存        img_upscaled.save(str(output_path), quality=95)        print(f"已保存: {output_path}")        return True    except Exception as e:        print(f"错误: {e}")        return Falsedef try_realesrgan(image_path, scale, output_path):    """    尝试使用 Real-ESRGAN 进行 AI 放大    Returns:        bool: 是否成功（如果未安装则返回 False）    """    try:        from basicsr.archs.rrdbnet_arch import RRDBNet        from realesrgan import RealESRGANer        import numpy as np        import cv2        print("使用 Real-ESRGAN 进行 AI 放大...")        # 加载模型        model = RRDBNet(num_in_ch=3, num_out_ch=3, num_feat=64,                       num_block=23, num_grow_ch=32, scale=4)        upsampler = RealESRGANer(            scale=4,            model_path='weights/RealESRGAN_x4plus.pth',            model=model,            tile=0,            tile_pad=10,            pre_pad=0,            half=False        )        # 读取图片        img = cv2.imread(str(image_path), cv2.IMREAD_UNCHANGED)        # 放大        output, _ = upsampler.enhance(img, outscale=scale)        # 保存        cv2.imwrite(str(output_path), output)        print(f"AI 放大完成: {output_path}")        return True    except ImportError:        return False    except Exception as e:        print(f"Real-ESRGAN 错误: {e}")        return Falsedef upscale_image(image_path, scale, output_path, method="auto"):    """    放大图片    Args:        image_path: 输入图片路径        scale: 放大倍数        output_path: 输出图片路径        method: 放大方式 (auto, pillow, realesrgan)    Returns:        bool: 是否成功    """    input_path = Path(image_path)    if not input_path.exists():        print(f"错误: 文件不存在: {image_path}")        return False    if method == "auto":        # 首先尝试 Real-ESRGAN        if try_realesrgan(image_path, scale, output_path):            return True        # 回退到 Pillow        print("Real-ESRGAN 不可用，使用 Pillow LANCZOS 放大")        return upscale_pillow(image_path, scale, output_path, "lanczos")    elif method == "realesrgan":        if try_realesrgan(image_path, scale, output_path):            return True        print("错误: Real-ESRGAN 不可用")        print("安装方法: pip install realesrgan basicsr")        return False    else:        return upscale_pillow(image_path, scale, output_path, method)def batch_upscale(images_dir, output_dir, scale, method="auto"):    """    批量放大目录中的所有图片    Args:        images_dir: 输入图片目录        output_dir: 输出目录        scale: 放大倍数        method: 放大方式    Returns:        tuple: (成功数, 总数)    """    images_path = Path(images_dir)    output_path = Path(output_dir)    if not images_path.exists():        print(f"错误: 目录不存在: {images_dir}")        return 0, 0    # 收集所有图片    image_extensions = {'.png', '.jpg', '.jpeg', '.webp'}    images = sorted([        f for f in images_path.iterdir()        if f.suffix.lower() in image_extensions    ])    if not images:        print(f"错误: 目录中没有图片: {images_dir}")        return 0, 0    output_path.mkdir(parents=True, exist_ok=True)    success_count = 0    for i, img in enumerate(images, 1):        print(f"\n[{i}/{len(images)}] 处理: {img.name}")        output_file = output_path / f"{img.stem}-{scale}x{img.suffix}"        if upscale_image(str(img), scale, str(output_file), method):            success_count += 1    return success_count, len(images)def main():    parser = argparse.ArgumentParser(        description="AtomSlides - 图片放大工具"    )    parser.add_argument(        "--image",        help="输入图片路径（单张图片）"    )    parser.add_argument(        "--images",        help="输入图片目录（批量处理）"    )    parser.add_argument(        "--output",        required=True,        help="输出路径（文件或目录）"    )    parser.add_argument(        "--scale",        type=float,        default=2,        help="放大倍数（默认: 2）"    )    parser.add_argument(        "--method",        choices=["auto", "pillow", "lanczos", "bicubic", "realesrgan"],        default="auto",        help="放大方式（默认: auto）"    )    args = parser.parse_args()    # 验证输入    if not args.image and not args.images:        print("错误: 请指定 --image（单张）或 --images（目录）")        sys.exit(1)    if args.image and args.images:        print("错误: --image 和 --images 不能同时使用")        sys.exit(1)    # 处理方法映射    method = args.method    if method in ["lanczos", "bicubic"]:        method = "pillow"    # 执行放大    if args.image:        # 单张图片        success = upscale_image(args.image, args.scale, args.output, method)        sys.exit(0 if success else 1)    else:        # 批量处理        success, total = batch_upscale(args.images, args.output, args.scale, method)        print(f"\n完成: {success}/{total} 张图片放大成功")        sys.exit(0 if success == total else 1)if __name__ == "__main__":    main()

如果发现文字崩了，完全错乱了，怎么办？让Claude生成图片后Double Check，出现字体问题要重新生成该图片