Gün 2: Yetenek Kartları (Skills)
Day 2: Skill Cards
Bu derste neler öğreneceksin
- Yetenek kartının (skill) ne olduğunu ve nasıl çalıştığını anlamayı
- /skills komutuyla kart listesini görmeyi ve bir tasarım kartı kurmayı
- Bıdık'a hazır bir tasarım kartı uygulatıp oyunun görünümünü yenilemeyi
- Kendi yetenek kartını yazıp başka projelerde de kullanmayı
A — Beceri Ekle Başlıyor
Bıdık artık kuralları biliyor (R bitti). Şimdi RAMP’ın ikinci harfine geçiyoruz: A — Augment (Beceri Ekle). Bıdık’a yeni güçler vereceğiz. İlk güç: yetenek kartları (skills).
Yetenek Kartı Nedir?
Bir kart oyunu oynadın mı hiç? O oyunlarda her karakterin özel güçleri vardır — ateş topu atan, kalkan kuran, hızla uçan. Her güç bir kartta yazılıdır. O kartı eline aldığında o güç sende olur.
Bıdık’ın yetenek kartları (İngilizcesi: skill) tam böyle çalışır. Bıdık’a yeni bir kart verdiğinde, o karttaki güç Bıdık’a geçer. Bıdık o güce sahip olur.
Yetenek kartı = yeniden kullanılabilir bir talimat kâğıdı. Bıdık her seferinde aynı şeyi okumak zorunda kalmaz; doğru anda kartı kendisi açar ve gücü kullanır.
Neden Yetenek Kartı?
Düşün: bir arkadaşın her oyunda sana “kartlarına dikkat et, hızlı oyna, takım arkadaşınla konuş” derse sıkılırsın. Ama bir kere eline bir kural kitabı verip “şu kurallara uy” dese harika olur.
Bıdık de öyle. Her seferinde “lütfen şöyle tasarla, şu renkleri kullan” demek yerine, bir kere bir tasarım kartı kurarsın. Bıdık o kartı her gerektiğinde otomatik açar.
Kartları Yönet: /skills
Bıdık’ın hangi kartları var, görmek için şu komutu yaz:
/skills
Bıdık sana kurulu kartların listesini gösterir. Yeni başladığında bu liste kısa olabilir — biz şimdi ona kart ekleyeceğiz.
● Yetenek kartların:
(henüz özel kart yok)
Yeni kart kurmak için bir kart mağazası kullanabilirsin.
/skills= “Bıdık, hangi kartların var göster.” Buradan kart açıp kapatabilir, yenilerini ekleyebilirsin.
Hazır Kart Kur: Tasarım Kartı
Oyunumuz çalışıyor ama görünümü hâlâ biraz sade. Şimdi Bıdık’a bir tasarım yetenek kartı kuracağız. Bu kart, Bıdık’a “uygulamayı güzel, modern ve düzenli yap” güçlerini verir.
Hazır kartlar internette herkese açık mağazalarda (marketplace) durur. En bilinenlerden biri skills.sh adresinde. Bıdık’a şunu söyle:
Bana bir tasarım yetenek kartı kur. "frontend-design" ve
"web-design-guidelines" kartlarını kullan. Bunları skills.sh
mağazasından alabilirsin. Kurulduktan sonra bana haber ver.
Bıdık sana kurulum komutunu gösterecek. Genelde şuna benzer:
● Bu kartı kurmak için şu komutu çalıştır:
npx skills add frontend-design web-design-guidelines
Komutu terminale yapıştır, ben kurulumu tamamlayayım.
npx skills add ...ne demek? “İnternetteki kart mağazasından şu kartları indir ve Bıdık’ın kasasına koy” demek. Komut biraz garip görünür ama sadece “şunu indir” demenin kısa yoludur.
Komutu birebir kopyala, yeni bir terminale yapıştır, Enter’a bas. Kurulum bitince Bıdık “kartlar hazır” diyecek. Bazen Bıdık’ı kapat-aç demek de gerekir (/exit sonra claude), kartları görsün diye.
Şimdi Dene: Oyunu Şıklaştır
Kartlar kurulu. Şimdi Bıdık’a gücü kullandır. Şu komutu ver:
Tasarım yetenek kartlarını kullanarak Sanal Evcil Hayvan oyunumun
görünümünü baştan aşağı yenile. Şunları yap:
- Butonlar yuvarlak, renkli ve büyük olsun (parmakla basılabilsin).
- Açlık ve Mutluluk çubukları renkli ve yumuşak köşeli olsun.
- Butona basınca hafif bir büyüme animasyonu olsun.
- Her şey ortalı, ferah ve neşeli dursun.
Bittiğinde ne değiştirdiğini bana kısaca anlat.
Bıdık tasarım kartlarındaki kuralları okuyacak ve style.css’i baştan yazacak:
● Tasarım kartlarını uyguluyorum...
style.css güncellendi:
- Butonlar: yuvarlak köşeli, mor/sarı, büyük dokunma alanı
- Çubuklar: renkli, yumuşak köşeli, geçiş animasyonlu
- Butona basınca hafif "pop" animasyonu
✓ Hazır! Tarayıcıyı yenile — oyun artık profesyonel görünüyor.
Tarayıcıyı yenile. Oyun birden çok daha güzel görünecek — sanki bir tasarımcı yapmış gibi. Aynı oyun, çok daha şık. Kart o farkı yarattı.
Kendi Yetenek Kartını Yaz
En eğlenceli kısım: kendi kartını yazmak. Bu kartı başka projelerde de kullanabilir, hatta arkadaşlarına verebilirsin.
Bıdık’a şu fikri tarif et:
Bana yeni bir yetenek kartı yaz. Adı "oyunu-kontrol-et" olsun. Bu kart
şunu yapsın: oyunumu kontrol etsin — kırık butonlar, görünmeyen yazılar
(beyaz üstüne beyaz), ekrandan taşan öğeler, çalışmayan çubuklar var mı
diye baksın. Bulduklarını bir liste halinde bana yazsın. Kartı oluştur.
Bıdık senin tarif ettiğin yeni kartı oluşturacak ve kasasına koyacak. Artık istediğin zaman şunu diyebilirsin:
"oyunu-kontrol-et" kartıyla oyunumu kontrol et.
Bıdık o kartı otomatik açacak, kuralları okuyacak, oyununu tarayacak ve sana bir rapor verecek.
Önemli fikir: Tekrarladığın her iş için bir kart yaz. Böylece her seferinde aynı şeyleri tekrar tekrar söylemezsin. Bir kere yaz, sonsuza kadar kullan.
Kontrol Noktası ✅
-
/skillsyazıp kart listesini gördüm. - Bir tasarım kartı kurdum (
npx skills add ...). - Bıdık’a tasarım kartını uygulattım; oyun şıklaştı.
- Kendi kartımı (“oyunu-kontrol-et”) yazdırdım ve çağırdım.
Bugün Ne Öğrendin?
- Yetenek kartı (skill), Bıdık’a verilen yeniden kullanılabilir bir talimat paketidir.
/skillsile kartları yönetirsin; mağazadannpx skills add ...ile kart kurarsın.- Bir tasarım kartı, oyunun görünümünü profesyonel hale getirdi.
- Kendi kartını yazıp her projede tekrar kullanabilirsin.
Ebeveyn Notu
Skill (yetenek kartı), Claude Code’un yeniden kullanılabilir uzmanlık paketleridir — bir kez tanımlanır, doğru bağlamda otomatik devreye girer. Çocuğunuz “tekrarladığın işi bir kez yaz, hep kullan” prensibini öğrenir; bu, bilgisayar biliminde “soyutlama” denen güçlü bir fikirdir. npx komutları yalnızca paket indirir; çocuğunuzun bunları anlaması gerekmez, kopyala-yapıştırda yardımcı olun. Kendi kartını yazma adımı, çocuğunuzun pasif kullanıcıdan üretici konumuna geçmesini sağlar.
Etkinlik (Elle Yapılacak)
Bir A4 kağıda kendi süper kahraman yetenek kartını çizin:
- Üst: Kahramanın adı (örn. “Renk Ustası”, “Hata Avcısı”)
- Orta: Kahramanın 3 gücü (örn. “renk değiştirir, hızla kod yazar, hatayı bulur”)
- Alt: Kahramanın bir zayıf noktası (her kahramanın bir tane vardır!)
- Arka: Kartı kullanan Bıdık’ın küçük bir çizimi
Bu kart, Bıdık’ın kasasındaki gerçek bir yetenek kartının “kâğıt versiyonu”. Hem eğleneceksin hem de kavramı içselleştireceksin.
Yarın
Yarın Bıdık’a bir alet çantası (MCP) vereceğiz. Bu sefer sadece bilgi değil, gerçek bir alet kazanacak: Bıdık’ın gözleri olacak. Yani tarayıcıyı açıp oyununu kendi gözüyle test edebilecek!