slideshowyazan HeyGen

Slideshow Skill.

PPT ve slayt desteler için bir Claude Code ve Codex skill'i: fragmanlar, dallanma ve sunum modu ile etkileşimli HyperFrames slayt gösterileri.

Presentations
HTML slaytları

OpenDesign İndir Kullanım kılavuzunu görüntüle

heygen-com/hyperframes · skills/slideshow/SKILL.mdSKILL.md

--- name: slideshow description: Author a HyperFrames slideshow — a presentation, pitch deck, or interactive deck with discrete slides, fragment reveals, branching, hotspot navigation, and built-in presenter mode with speaker notes; also converts an existing page into a deck. Output is a navigable deck, not a rendered MP4. If the user didn't explicitly ask for a slideshow, confirm before authoring. Unclear → /hyperframes. --- ## Output — a navigable deck, not a linear MP4 ## Intent confirmation ## The two pieces ## Schema ## Slide writing rules ## Porting source pages

Ön bilgi ve bölüm başlıkları kaynak dosyadan 2026-09-14 tarihinde okundu · Toplamda 33.631 karakter

01 Ne yapar

Claude Code ve Codex'te slideshow Skill Ne Yapar

Özet, iş akışı ve çıktılar; hepsi skill'in SKILL.md dosyasından okundu.

SKILL.md'den14-09-2026 tarihinde okundu · kayıtlı bir çalıştırma değil

Skill'in Kendi İfadeleriyle

Ayrık slaytlar, fragment gösterimleri, dallanma, hotspot navigasyonu ve konuşmacı notlarıyla birlikte yerleşik sunum modu içeren HyperFrames slayt gösterileri — sunumlar, yatırımcı sunumları veya etkileşimli deckler — hazırlar. Ayrıca mevcut sayfaları decklere dönüştürür. Çıktı, hyperframes ile sunulan gezilebilir bir decktir, render edilmiş bir MP4 değildir. Slaytları ve bağlantıları tanımlamak için bir JSON island script bloğu kullanır. Fragmentleri (bir slayt içindeki gösterim durma noktaları), hotspot'lar üzerinden çevrimdışı sıralara dallanmayı ve BroadcastChannel üzerinden senkronize edilen düzenlenebilir notlarla sunum modunu destekler.

Açıkça talep edilmedikçe hazırlamadan önce onay ister. Katı slayt yazım kurallarını uygular: başlıklar tam cümle iddiaları olarak, slayt başına bir fikir, aşağıdan yukarıya pazar büyüklüğü hesaplaması, en az 30pt yazı tipi. Adı belirtilen herhangi bir görseli elle oluşturmadan önce canlı kataloğu arar. Kaynak sayfaları aktarırken, sayfa hareketini slayttan slayta geçişlere dönüştürürken orijinal tasarımı, hareketi, etkileşimleri ve medya davranışını korur.

Neler üretir

Sahneler, klipler, GSAP zaman çizelgeleri ve bir JSON island manifest içeren bir HyperFrames kompozisyonu
Konuşmacı notlarıyla sunum modu dahil, hyperframes ile sunulan gezilebilir bir deck

Örnek istemi görün ↗

Nasıl Çalışır

01
Amacı Doğrulayın
Kullanıcı açıkça bir slayt gösterisi isterse ilerleyin; aksi halde durun ve onay istemeden önce bir HyperFrames slayt gösterisinin ne anlama geldiğini (çalıştırılabilir deck, navigasyon, sunum modu) açıklayın.
02
Zamanlama Özellikleriyle Sahneleri Tanımlayın
Her slayt bir sahne tarafından desteklenir. Her birini data-composition-id, data-start, data-duration ve data-label ile tanımlayın.
03
JSON Island Ekleyin
Kompozisyon HTML'sine type application/hyperframes-slideshow+json olan tam olarak bir script bloğu ekleyin.
04
Slaytları Katı Kurallara Göre Yazın
Başlıklar tam cümle iddiaları olmalıdır. Slayt başına bir fikir ve bir görsel. Vurguyla başlayın. Sadece aşağıdan yukarıya pazar büyüklüğü hesaplaması. Yazı tipi en az 30pt eşdeğeri.
05
Görselleri Oluşturmadan Önce Kataloğu Arayın
Bir slaytın gerektirdiği her görünüm, efekt, grafik veya geçiş için sade İngilizce ile npx hyperframes catalog --query komutunu çalıştırın ve yazmaya başlamadan önce en üstteki sonuçları okuyun.

02 Uyumunuzu bulun

slideshow Skill'ini Ne Zaman Kullanmalı

Claude Code veya Codex'te iş PPT ve bu tür slayt sunumları olduğunda slideshow skill'ini kullanın. Uygunluk ve sınırlar aşağıda skill'in kendi dosyasından alınmıştır.

İyi Uyum

Ayrık slaytlara sahip sunumlar, yatırımcı sunumları veya etkileşimli sunumlar
Fragman gösterimleri, dallanma, sıcak nokta navigasyonu ve sunum modu içeren sunumlar
Mevcut bir sayfayı sunuma dönüştürme

Sınırları Bilin

Sunum niyetinin belirsiz olduğu istekler — yazmadan önce onay gerektirir
İzleyicinin okuması gereken 40px'ten küçük metin

Ne Sağlamalısınız

Figma kaynak URL'si (isteğe bağlı)Sunumun içeriği veya senaryo panosu bir figma.com URL'sinden geliyorsa, oluşturmadan önce varlık dışa aktarımı, marka token'ları ve senaryo panosu yeniden inşası için önce /figma komutunu çalıştırın.

03 Skill'in içinde

slayt gösterisi Skill'inin Claude Code ve Codex'e Verdiği Kurallar

SKILL.md'nin ajan için belirlediği 7 somut talimat, varsayılan ve sınır — dosyanın sonucu değiştiren kısmı.

Slayt Başına Bir Fikir ve Bir Görsel
İkinci bir madde işareti kümesi veya ikinci bir grafik eklemek istiyorsanız, slaydı bölün.
Yazı Tipi En Az 30pt Eşdeğeri
1920×1080'de bir başlık 72–96px; gövde metni 48px'tir. İzleyicinin okuması gereken hiçbir metin için 40px'in altına inmeyin.
Sadece Aşağıdan Yukarıya Pazar Büyüklüğü Hesaplaması
Hesaplamayı göstermeden asla 50 milyar dolarlık bir TAM yazmayın. Birim ekonomisinden yukarı doğru inşa edin: hesap sayısı × ACV veya işlem sayısı × komisyon oranı.
Elle Oluşturmadan Önce Kataloğu Arayın
Bir slaytın gerektirdiği her adlandırılmış görsel için npx hyperframes catalog --query komutunu çalıştırın ve yazmaya başlamadan önce en üstteki sonuçları okuyun. Gerçek bir blok, basitleştirilmiş bir yaklaşımdan daha iyidir.
Slayt Gösterilerini MP4'e Render Etmeyin
Bir sunum, ana kök kompozisyonu olmadan birkaç üst düzey sahne kompozisyonu olarak yazıldığında, render işlemi yalnızca ilk kompozisyonu çözer ve sessizce kesilmiş bir MP4 üretir.
Fragman Zamanları composition-timeline'da Mutlak Konumlardır
Fragment zamanları, sahnenin başlangıcına göre ofset değil, data-start ile aynı koordinat alanını kullanır. Bu zamanlar, slaytın start, end aralığının içinde (dahil) olmalıdır.
Taşıma Sırasında Kaynak Sayfa Sadakatini Koruyun
Orijinal sayfanın görsel tasarımını, hareket dilini, etkileşimli davranışını, medya davranışını ve sunum olanaklarını mümkün olduğunca yakın şekilde koruyun.

04 İşe koyun

Claude Code veya Codex'e slideshow'u Yükleyin

Bir npx skills add komutu, ardından ajanınızda ilk görev ve sonuç için bir kontrol listesi.

Claude Code, Codex veya Ajanınıza slideshow Ekleyin

Projenizde çalıştırın; kurulum aracı, bunun hangi ajana ekleneceğini sorar.

Terminal

npx skills add https://github.com/heygen-com/hyperframes --skill slideshow

skills/slideshow/SKILL.md için genel skills CLI biçimi; depo kendi yolunu belgeleyebilir.

Beceriye İlk PPT ve Slayt Sunumu Görevini Verin

Skill'in kendi terimleriyle yazıldı; köşeli parantezli bölümleri kendi malzemenizle değiştirin.

Starter prompt

Build a HyperFrames slideshow for a Series A pitch deck. Start with a hook slide showing SMBs lose $40B/year to manual scheduling. Add a problem slide with three pain points that reveal as fragments: no-shows cost 23% of revenue, manual reminders take 4h/week per staff, and rescheduling friction drives 40% churn. Include a hotspot on the $40B figure that branches to a market-sizing slide showing the bottom-up math: 2.3M SMBs × $17k ACV. End with a solution slide: [product name] automates scheduling for service SMBs, cutting no-shows by 80% in 90 days. Include speaker notes for each slide.

Kaynak: SKILL.md'den, skill'in kendi terimleriyle yazıldı.

İlk Sonucu Kontrol Edin

SKILL.md'nin doğru bir sonucun nasıl göründüğüne dair söyledikleri:

Lint 0 hata bildirene ve doğrulama çalışma zamanı hatası bildirmeyene kadar dosyayı düzeltin ve yeniden çalıştırın
Her slide.sceneId değerinin data-composition-id ile mevcut bir sahneye çözümlendiğini doğrulayın
Her hotspot.target değerinin tanımlı bir slideSequence id'sine referans verdiğini doğrulayın
Fragment zamanlarının her slaytın start, end aralığının içinde olduğunu doğrulayın

OpenDesign'da slideshow'u SKILL.md bağlantısından içe aktarın: Plugins → Add → Skill → Import from link, ardından üst çubukta seçin.

OpenDesign İndir Hızlı başlangıcı okuyun

05 Açık kaynak, izlenebilir

Kaynak, Lisans ve Doğrulama

Bu sayfadaki bilgilerin nereden geldiği ve en son ne zaman kontrol edildiği.

Author: HeyGen
Repository: github.com/heygen-com/hyperframes Dal main
Skill dosyası: skills/slideshow/SKILL.md Doğrulama sırasında kaydedilen içerik sağlama toplamı; commit 558c11b
License: Apache-2.0 LICENSE dosyasından.
Repository yıldızları: 49.761 Bu katalogda 9 skill içeren heygen-com/hyperframes deposunun tamamı için 2026-09-14'te alınan GitHub anlık görüntüsü. slideshow için bir değerlendirme veya kullanım sayısı değil.
OpenDesign tarafından doğrulandı: 2026-09-14 Kaynak dosya, yol, lisans metni ve yıldız sayısı kontrol edildi. OpenDesign ana sürümünde dahil değil (2026-08-28 kontrol edildi); bu sayfada canlı bir çalıştırma kaydedilmedi.

SKILL.md içinde

Slideshow oluşturma sözleşmesiBir HyperFrames slideshow, slaytları ve bağlantıları bildiren bir JSON adası içeren normal bir kompozisyondur
Çıktı — gezilebilir bir sunum, doğrusal bir MP4 değilHyperframes mevcutken sunun; MP4'e render etmeyin, çünkü bu ilk kompozisyona kısaltır
Amaç onayıKullanıcı açıkça bir slideshow istemediyse oluşturmadan önce onaylayın; yönlendirilmiş amaç önceden onaylanmıştır
İki parçadata-composition-id ve zamanlama ile tanımlanan sahneler; slides ve slideSequences dizilerini içeren JSON adası
ŞemaSlideshowManifest, SlideRef, SlideHotspot ve SlideSequence alan tanımları ve gereksinimleri
Slayt yazım kurallarıBaşlıklar tam cümleler olarak, slayt başına bir fikir, aşağıdan yukarıya boyutlandırma, 30pt minimum, önce katalog araması
Kaynak sayfaları taşımaOrijinal tasarımı, hareketi, etkileşimleri, medyayı koruyun; sayfa hareketini slayt geçişlerine çevirin; medya olaylarını bağlayın
Fragmentler: bir slayt içinde durma noktalarını açığa çıkarmaSlayt aralığı içinde mutlak zaman çizelgesi zamanları; denetleyici Next'te her fragmente atlar; aralarda oynatma yok
Dallanma: hotspot'lar ve slayt dizileriDal slaytları ana çizgiden hariç tutulur; hotspot tıklaması gezinti yığınına ekler; geri, üst öğeye döner
Uygulamalı örnek: fragment ve dal içeren 3 slaytlı sunumSahneler, JSON adası, GSAP zaman çizelgesi ve bir dal dizisi içeren tam HTML iskeleti
Sarmalayıcı bileşenhyperframes-slideshow içine sarın; gezinme, klavye, dokunma, hotspot sağlar; Present, izleyici sekmesi açar; genel sessize alma
Slideshow'u bağımsız çalıştırma (geçici)Motor barındırmalı önizleme yayınlanana kadar bağımsız demolar geçici çözümler gerektirir; references/standalone-harness.md'ye bakın

Skill'in Kendi Açıklaması

"Bir HyperFrames slayt gösterisi oluşturun — ayrı slaytlar, parça geçişleri, dallanma, tıklama noktası navigasyonu ve konuşmacı notlarıyla yerleşik sunucu moduyla bir sunum, tanıtım sunumu veya etkileşimli sunum; ayrıca mevcut bir sayfayı sunuma dönüştürür. Çıktı, render edilmiş bir MP4 değil, gezinilebilir bir sunumdur. Kullanıcı açıkça bir slayt gösterisi istemediyse, oluşturmadan önce onaylayın. Belirsizlik → /hyperframes."

SKILL.md'den ön bilgi açıklaması. Tam dosya yaklaşık 33.631 karakter. GitHub'da tam dosyayı okuyun.

06 Kurmadan önce

slideshow Skill Hakkında Sorular

Yanıtlar, 2026-09-14 tarihinde okunan SKILL.md üzerinden alınmıştır, kaydedilmiş bir çalıştırmadan değil.

Fragmentler nedir ve nasıl çalışır?

Bir fragment, denetleyicinin bir açığa çıkma durumunu tuttuğu, bir slaytın start, end aralığı içindeki saniye cinsinden mutlak kompozisyon zaman çizelgesi zamanıdır.

Oynatıcı, fragmentlere sahip bir slayta fragments[0]'dan girer, ardından Next'te sonraki her fragmente atlar. Son fragmentten sonra, Next bir sonraki slayta geçer. Gezinme, oynatma odaklı değil, atlama odaklıdır.

Slideshow

Gerçek bir PPT ve Slayt Desteleri Görevi üzerinde slideshow çalıştırın.

OpenDesign'ı indirin, slideshow'u SKILL.md bağlantısından içe aktarın, yukarıdaki promptu yapıştırın ve sonuçtan önce planı okuyun.

OpenDesign'ı İndirin Tüm skill'lere göz atın