Kalem skill

A Claude Code skill for code-made video: it splits a clip into scenes and picks an engine for each, from Paper.js to Manim.

  • 115 ★ on the repository
  • Last commit
Skill

Extended access

Why this level

  • The skill runs scripts and Chrome on your machine and writes project files into the repository folder.
All reasons and checks

leodavincs/kalem

Install

In your terminal, with SkillFoxx CLI

npx skillfoxx add skills/kalem

Detects the agents on your machine, shows the access level and pins the version.

Other ways to install

Access and checks

How we review

Extended accessThe tool runs code or makes network calls and only reads external data.

  • The skill runs scripts and Chrome on your machine and writes project files into the repository folder.

This is third-party code. Review the repository files before installing.

What it does

Kalem, Turkish for pen, solves the problem of identical clips: if one engine draws every scene they look alike. The skill splits a video into scenes, looks at what happens inside each and picks a suitable engine: Paper.js for self-drawing lines, plain canvas for characters, PixiJS for particles, HyperFrames with HTML and GSAP for text and info cards, Three.js for 3D, Manim for formulas and charts. For mechanical machines there is the levha engine, which draws them as a Leonardo notebook sheet. Before work Claude shows a scene, engine and reason table and waits for approval. Time comes from the frame number, browser scenes are captured in Chrome frame by frame, and sound is built from an event list, so it never drifts from the picture. The final file lands in projeler/<name>/cikti.mp4. An extra referans skill splits someone else's clip into scenes and writes a video-model prompt for each without producing the video.

Who it is for. Creators of educational and explainer videos assembled in code who want different visual techniques inside one clip.

Good fit when

  • A fifty-second clip about Leonardo's flying machine needs six scenes in different techniques.
  • Formula and chart animation is needed next to a live illustration.
  • A mechanism such as a lever or crank must be shown as a technical drawing with a narrated lecture.
  • A liked clip is split into scenes to get prompts for generation.

Not a fit when

  • You need a quick clip from one template without choosing engines.
  • Google Chrome, ffmpeg or Node 20 is missing: scenes will not render.
  • You want the skill to download a video from a link: downloading is not included and you must supply the video.

Example request

/kalem Make a 50-second horizontal video about Leonardo da Vinci's flying machine and show the scene table before rendering.

Limitations

macOS or Linux, Node 20 or newer, Python 3, ffmpeg and Google Chrome are required, with Manim optional. The skill runs from the repository root because all paths are relative. The engine table reflects the author's taste after comparing 20 tools on one scene, and you can change it. The referans skill sees three frames per scene, so sound, speech and very fast motion do not reach the prompts. Do not copy other people's videos for commercial use, and ask for rights before reusing them.

How to disable. Delete the cloned kalem folder together with the projeler projects. The skill lives in this repository, so there are no other traces in the system apart from installed dependencies.

FAQ

How do I install Kalem?

Clone the repository, run `./kurulum.sh` and open Claude Code in the repository root.

How do I run the skill?

Enter `/kalem` and describe the video. Claude shows a table of scenes and engines and waits for your approval.

How do I assemble scenes by hand?

Run `python3 birlestir.py projeler/<name> --gecis BookFlip --etiket`, where `--etiket` labels each scene engine.

What does the referans skill do?

`/referans ~/Desktop/video.mp4` splits a clip into scenes and creates `istemler.html` and `istemler.md` with a prompt for each scene.

What language is the documentation in?

The main README is Turkish, and an English version is in `README.en.md`.

Discussion

No questions or reviews yet.

Skills

Two Claude Code skills for videos made entirely in code: hand-painted watercolour animation and kinetic typography reels

SkillExtended access493Repository stars

A Claude Code skill for hand-painted animation and lyric videos: frames drawn in code with p5.js, no image models

PluginExtended access219Repository stars

A skill for Claude Code and Codex: the agent writes animation scenes, a browser player shows them, export to MP4 and Lottie.

SkillExtended access56Repository stars

A Claude Code skill that builds motion graphics in code: 21 ready looks, five questions, three approval stills and an MP4 render.

SkillExtended access166Repository stars

A Claude Code skill that records a product in the browser, composes a video with chapters and captions and masters the MP4 locally

SkillExtended access396Repository stars

Eight Claude Code skills for Remotion video: hand-drawn and pixel-art explainers built in code, with sound and subtitles

SkillExtended access254Repository stars

README in short

The project is a Claude Code skill with a set of engines in the motorlar folder. The six-scene example shows one engine per scene. The author advises changing the engine table to your taste.

README badge

Original SKILL.md

---
name: kalem
description: Kodla video yaparken her sahnenin hangi motorla çizileceğine karar verir, sahneleri o motorlarla üretir, sayfa çevirme gibi geçişlerle birleştirir ve kareye kilitli efekt sesi ekler. "kodla video yap", "animasyon yap", "bu videoyu sahnelere böl", "hangi motorla yapayım", "Reels/YouTube için animasyon" dendiğinde kullan.
---

# Kalem: her sahnenin kendi kalemi var

Bu skill reponun kökünden çalışır (`claude` repo klasöründe açılır). Bütün yollar repo köküne göredir. Yeni video `projeler/<ad>/` altında kurulur.

Tek bir motorla yapılan videolar birbirine benzer. Bu skill videoyu sahnelere böler, her sahnenin İÇİNDE NE OLDUĞUNA bakar ve onu en iyi çizen motoru seçer. Motor bir kalemdir: aynı resmi kurşun kalem ve suluboya farklı çizer.

## Sahnenin içinde ne var → hangi motor

| Sahnenin içinde... | Motor | Neden |
|---|---|---|
| Elle çizilen, kendini çizen çizgi, eskiz, kalem hareketi | **Paper.js** | Çizgiyi en yumuşak ve doğal çizen motor. Yalnız kalem işi için. |
| Karakter, yürüme, el kaldırma, şeklin başka şekle dönüşmesi | **Düz canvas (kendi çizim kodun)** | Hareket ve şekil üzerinde tam kontrol. |
| Patlama, ışık, parlama, toz, binlerce küçük parça | **PixiJS** | Binlerce parçayı kasmadan oynatır. |
| Ekrana yazı, sayı, sayaç, bilgi kartı, haber kurgusu | **HyperFrames** (HTML + GSAP) | Yazı ve bilgi animasyonunda en temizi. |
| Gerçek 3D: kamera dönüyor, ışık, gölge, makine | **Three.js** | Tarayıcıda gerçek 3D. |
| Formül, grafik, şema, matematik | **Manim** (Python) | 3Blue1Brown'un aracı. LaTeX yoksa Text ile yaz. |
| Çalışan bir makine (kaldıraç, palanga, krank-piston, dişli zinciri) defter levhası gibi çizilip ders anlatacak | **Levha** (`motorlar/levha`, Python) | Kodla tasarlanan makineyi kalemle çizer, parçalarını eklemlerinde çalıştırır, ölçüleri denetler. `python3 motorlar/levha/yeni_levha.py <makine>`; ayrıntı motorun README'sinde. |

Yardımcılar sahne çizmez, bir motorun içinde ona yardım eder:

| İş | Yardımcı |
|---|---|
| Hafif şeyler düşüyor, devriliyor, zıplıyor | Matter.js |
| Ağır şeyler kayıyor, üst üste yığılıyor | Rapier |
| Sahneden sahneye geçiş (125 hazır geçiş, sayfa çevirme = BookFlip) | gl-transitions (`ortak/gecis.html`) |
| Bir şey ekrana yay gibi zıplayarak geliyor | Anime.js |
| Konfeti, yıldız, emoji yağmuru | tsParticles |
| 3D modeli küçültmek | glTF-Transform |
| Kareye kilitli efekt sesi (tık, hışırtı, vuruş) | Tone.js (`ses/ses.html`) |

Bu tablo bir kişinin zevkiyle kuruldu: 20 araç aynı sahneyle yarıştırıldı, izlenip puanlandı. **Kendi denemelerini yap ve tabloyu kendi gözüne göre değiştir.**

## Akış

1. **Sahnelere böl.** Kullanıcının anlattığı videoyu 4-8 sahneye ayır. Her sahne için gündelik dille tek cümle yaz ve motoru seç, kullanıcıya tablo olarak göster:
   "1. sahnenin içinde kendi kendine çizilen bir eskiz var → Paper.js ile çizmek lazım."
   Teknik sıkıştırma yok ("sayı koşuyor" değil "sahnenin içinde artan bir sayı var").
   **Bir sahne = bir motor.** Sahnede birden çok iş varsa ekranı kaplayan ana iş motoru belirler, yan işler yardımcı olarak girer.
2. **Ortak dosyaları yaz.** `<proje>/zaman.json` (fps, boyut, geçiş kare sayısı, sahne listesi ve kare sayıları) ve `<proje>/BRIEF.md` (ortak görsel dil, gerçekler, her sahnenin tarifi, teslim sözleşmesi). Örnek: `ornek/ucan-makine/` (varsa).
3. **Sahneleri üret.** Kağıt dokusu, renkler ve yazı tipleri BRIEF'te bir kez tanımlanır, her sahne aynısını kullanır; videonun tek elden çıkmış gibi durması buna bağlı.

Report a problem