Sunumlar için yeni nesil araç: RevealJS tabanlı YAML slayt sistemi

Teknoloji dünyasında sunumlar sürekli hazırlanır, ancak çoğu zaman bu içerikler geçici hale gelir. Keynote ya da PowerPoint'te harcadığınız dakikalar, konuşma bittikten sonra bir anda kaybolur. Peki ya sunumlarınızı kod olarak yönetebilseydiniz? Dinghy'nin Slide Builder aracı, slaytlarınızı tamamen değiştirecek bir yaklaşım sunuyor: onları Git deposu gibi yönetilebilir, gözden geçirilebilir ve yeniden kullanılabilir dosyalar haline getiriyor.

Dinghy Slide Builder, RevealJS'e dayanan ve mevcut Dinghy CLI aracına entegre edilmiş bir sunum oluşturma sistemi olarak öne çıkıyor. Bu araç, slaytları sadece görsel unsurlar olarak değil, aynı zamanda yazılım geliştirme sürecinin bir parçası gibi ele almayı sağlıyor. İşte sistemin sunduğu temel özellikler:

• YAML tabanlı yapılandırma: Anahtarlar semantik bloklara dönüştürülürken, diğer tüm unsurlar doğrudan HTML etiketlerine eşlenir. Böylece sunumlarınızı hiyerarşik ve okunabilir bir şekilde tanımlayabilirsiniz.

• Markdown ve HTML desteği: Sunum klasörüne eklediğiniz .md veya .html dosyaları otomatik olarak slayt bölümlerine dönüşür.

• Tek dosyalı çıktı: Tüm varlıkları içeren tek bir HTML dosyası oluşturur. Bu dosya herhangi bir yerde paylaşılabilir ya da barındırılabilir.

• Canlı yükleme modu: dinghy slide start komutuyla çalışan yerel sunucu, düzenlemelerinizi anında yansıtır.

• Prezi benzeri yakınlaştırma efektleri: Dinghy'ye özel olan bu özellik, mimari diyagramlar gibi karmaşık görsellerin bölge bölge incelenmesini kolaylaştırıyor.

YAML ile slayt tasarımı

Dinghy'nin YAML tabanlı yaklaşımı, slaytları HTML hiyerarşisinin bir ağacı olarak görmeyi temel alıyor. Bu sayede, düzgün girintili bir YAML dosyasıyla karmaşık slaytlar bile kolayca oluşturulabiliyor. Örneğin:

sections:
  - badge: Gösteri
    title: Slide Builder
    subtitle: author
    ul:
      - YAML DSL, anahtarları HTML unsurlarına eşler
      - Kendinden bağımsız HTML çıktısı sunar
      - Canlı yükleme geliştirme sunucusu

Bu yapıda badge, title ve subtitle gibi özel anahtarlar otomatik olarak ilgili HTML etiketlerine (<span class="badge">, <h1>, <h2>) dönüştürülür. Diğer tüm unsurlar (örneğin p, h3, ul, li) doğrudan HTML etiketleri olarak tanımlanabilir. Çoklu dosyalı sunumlar ise aynı klasördeki farklı YAML dosyalarının sıralı olarak okunmasıyla oluşturulur.

Markdown entegrasyonu

Hızlıca bir bölüm eklemek istediğinizde, standart Markdown kullanabilirsiniz:

## Slide Builder

- YAML DSL, anahtarları HTML unsurlarına eşler
- Kendinden bağımsız HTML çıktısı sunar
- Canlı yükleme geliştirme sunucusu

Dinghy, YAML, Markdown ve hatta ham HTML'in aynı sunumda karışık şekilde kullanılmasına izin veriyor. Her bölüm için en uygun formatı seçebilirsiniz.

Tek dosyalı çıktı avantajı

dinghy slide build komutuyla çalışan derleme işlemi, tüm görselleri, fontları ve bağımlılıkları tek bir HTML dosyasına inline eder. Bu sayede:

• Dosyayı doğrudan bir sohbete bırakabilirsiniz.
• Çevrimdışı olarak açabilirsiniz.
• E-posta yoluyla paylaşabilirsiniz.

WiFi bağlantısının güvenilir olmadığı mekanlarda yapılan sunumlar için bu özellik özellikle değerlidir. Sunumunuz yalnızca bir tarayıcı gerektirir ve hiçbir dış kaynağa bağlı değildir.

Prezi tarzı yakınlaştırma efektleri

Dinghy'nin sunduğu en dikkat çekici özelliklerden biri, Prezi benzeri yakınlaştırma ve kaydırma efektleridir. Bu özellik sayesinde, bir mimari diyagramın farklı bölümlerini sırayla büyüterek sunabilirsiniz. Örnek olarak:

id: dinghy-proxy-project
img: imgs/dinghy-proxy-project.png
width: 1562
height: 1398
sections:
  - id: dinghy-proxy-title
    x1: 71
    y1: 842
    x2: 954
    y2: 1132
  - id: dinghy-proxy-ruby
    title: ❤️
    x1: 1052
    y1: 119
    x2: 1550
    y2: 293

Bu yapılandırma, diyagramın belirli bölgelerine sırayla yakınlaşarak sunumunuzu daha dinamik hale getirir. Arka planda RevealJS'in data-auto-animate özelliğinden faydalanan sistem, koordinat tabanlı syntax'ıyla öne çıkıyor. Standart RevealJS kullanıcıları ise CSS dönüşümlerini elle hesaplamak zorunda kalıyor.

Neden Dinghy Slide Builder kullanmalısınız?

Bu aracın sunduğu avantajlar, diğer tüm yazılım geliştirme süreçlerinde olduğu gibi, kaynak koduna dayanan yaklaşımın getirdiği faydalardan kaynaklanıyor:

• Sunumunuzu Git deposunda saklayabilir, gözden geçirebilir ve değişiklikleri karşılaştırabilirsiniz.

• Ortak bir bölümdeki değişiklikler, tüm sunumlarda otomatik olarak güncellenir.

• Çıktınız bir Keynote paketi ya da Google Slides bağlantısı değil, doğrudan paylaşılabilir bir dosyadır.

Yılda birkaç sunum yaptıysanız, YAML tabanlı bu yaklaşımın maliyeti, yedinci ya da sekizinci slayttan itibaren kendini amorti etmeye başlar.

Uygulamalı örnekler

Dinghy Slide Builder'ın nasıl çalıştığını görmek için Dinghy'ye Giriş sunumunu inceleyebilirsiniz. Bu örnek, YAML DSL kullanımını, çoklu dosya düzenini ve Prezi benzeri efektleri bir arada gösteriyor. Sunumun kaynak koduna GitHub deposundan ulaşabilirsiniz.

Gelecekte, sunum hazırlama sürecinin kodla bütünleşmesi giderek yaygınlaşacak. Dinghy Slide Builder, bu dönüşümde önemli bir adım olarak karşımıza çıkıyor. Eğer sunumlarınızı daha verimli ve profesyonel hale getirmek istiyorsanız, bu aracı denemenizde fayda var.