📅 Haftalık Ders Programı Panosu — Akıllı Tahta & Yazdırma Stüdyosu

Haftalık Ders Programı Panosu, ilkokul ve ortaokul sınıflarında haftalık ders, etüt ve mola saatlerini modern, renk kodlu ve etkileşimli bir dijital pano olarak sunan; akıllı tahtada gün/ders vurgusu sağlayan, veliler için tek tıkla şık A4 PDF/Yazdırma ve yüksek çözünürlüklü PNG çıktısı üreten bağımsız bir eğitim aracıdır.

🚀 Canlı Deneyim ve İndirme Bağlantıları

Haftalık Ders Programı Panosu (Canlı Uygulama)

Tek tıkla tarayıcınızda açın. Derslerin üzerine tıklayarak haftalık dağılımı vurgulayın veya mobil/tahta gün seçiciyi deneyin.

Tarayıcıda Canlı Aç HTML Olarak İndir
Örnek CSV Şablonu

Ders saatlerini, etütleri ve ders isimlerini kendi sınıfınıza göre saniyeler içinde özelleştirmenizi sağlayan şablon dosya.

Örnek CSV Şablonunu İndir

💡 Neden Geliştirildi? (Problem & Çözüm)

Geleneksel Ders Programlarındaki Kronik Sorunlar

Karmaşık ve Okunaksız Kâğıt Çizelgeler: Sınıf panolarına veya veli WhatsApp gruplarına atılan siyah-beyaz karmaşık Excel tabloları; özellikle küçük yaş gruplarında hangi gün hangi dersin olduğunu takip etmeyi zorlaştırır.
Akıllı Tahta Uyumsuzluğu: Ders esnasında akıllı tahtada programı açık tutmak istediğinizde, klasik PDF veya resim formatları ekrana tam sığmaz, dokunmatik etkileşim sunmaz ve günün derslerini öne çıkaramaz.
Program Değişikliklerinin Çilesi: Dönem içinde veya etüt saatlerinde en ufak bir ders değişikliği olduğunda tüm tablonun baştan tasarlanması ve yeniden yazdırılması gerekir.
Bulanık Ekran Görüntüleri: Velilere program paylaşılırken çekilen ekran fotoğrafları telefon ekranlarında pikselleşir, yazıcıdan alındığında kenarlardan taşar veya okunaksızlaşır.

Pedagojik ve Tasarımsal Çözüm

🎨 Renk Kodlu Ders Blokları: Her ders (Türkçe, Matematik, Fen, Görsel Sanatlar, Beden Eğitimi vb.) kendine has pastel renk tonuyla görsel olarak ayrışır. Çocuklar yazıyı okumadan dahi dersin türünü renginden tanır.
👆 Akıllı Tahta İnteraktif Vurgu Modu: Tahtada herhangi bir "Türkçe" hücresine dokunulduğunda tüm hafta boyunca o derse ait bloklar parlar, diğer dersler şık bir saydamlığa bürünür. Haftalık ders yükü anında görselleştirilir.
📱 Mobil Uyumlu Gün Seçici (Tabs): Cep telefonundan veya dar ekranlardan bakıldığında tabloyu sağa sola kaydırmaya gerek kalmadan tek tıkla "Pazartesi", "Salı" gibi sadece o günün programı görüntülenebilir.
🖨️ Kusursuz A4 Çıktı & Tek Tıkla Ultra HD PNG: Tarayıcının yazdırma (Ctrl+P) komutuyla kenar boşlukları ayarlanmış A4 çıktısı alınabilir ya da "PNG Olarak Kaydet" butonuyla arka planda HTML5 Canvas çizimi yapılarak 1680px çözünürlüğünde kristal netliğinde veli bilgilendirme afişi indirilir.
⚡ CSV ile Kolay Entegrasyon: Karmaşık veritabanlarına veya web sunucularına ihtiyaç duymadan, CSV tablosu üzerinden tüm program dakikalar içinde güncellenebilir.

🌟 Öne Çıkan Özellikler & Ekran/Kullanım Rehberi

flowchart LR
    A[📊 Haftalık Tablo Görünümü] --> B[🎯 Tek Tıkla Ders Vurgulama]
    A --> C[📱 Mobil Tek Gün Modu]
    A --> D[🖨️ A4 Yatay Yazdırma]
    A --> E[🖼️ 1680px Canvas PNG Üretici]

1. 🌈 Akıllı Renk ve Vurgu Sistemi

Etkileşimli Ders Odaklama: Fare ile üzerine gelindiğinde (akıllı tahtada dokunulduğunda) seçilen ders parlar ve haftalık toplam saat rozetiyle eşleşir.
Ders Lejantı ve Saat Sayacı: Tablonun altında Türkçe ×8, Matematik ×5, Beden Eğitimi ×5 gibi haftalık ders yükünü gösteren hap rozetler yer alır.
Mola ve Öğle Arası Şeritleri: Teneffüs süreleri ve öğle arası (70 dk) özel gri ayrım şeritleriyle gösterilerek zaman algısı güçlendirilir.

2. 🖨️ Baskı ve Medya Optimizasyonu

Yazdır (Print) Modu: @media print kuralları ile tarayıcı menüleri, butonlar ve gereksiz öğeler gizlenir; tablo tam sayfa A4 genişliğine oturur.
PNG Kaydetme Motoru: Dahili HTML5 Canvas motoru sayesinde; okul adı, sınıf, öğretmen ve eğitim-öğretim yılı başlığıyla birlikte grafiksel olarak işlenir, otomatik kırpılır ve doğrudan galerinize indirilir.

3. 📱 Akıllı Tahta & Mobil Uyum

Ekran genişliği 820px altına düştüğünde otomatik olarak üstte gün butonları (Pzt, Sal, Çar, Per, Cum) belirir.
Akıllı tahta başında sadece o günün derslerine odaklanmak isteyen öğretmen tek tıkla gün görünümüne geçebilir.

🔧 Kurulum ve CSV Düzenleme Rehberi

Panoyu kullanmak için herhangi bir web sunucusuna, kuruluma veya internet bağlantısına ihtiyacınız yoktur.

1. 📥 Hızlı Başlangıç

Yukarıdaki butonlardan HTML Olarak İndir bağlantısına tıklayarak haftalik_ders_programi.html dosyasını bilgisayarınıza kaydedin.
Dosyaya çift tıklayın; Chrome, Edge, Safari veya Firefox gibi herhangi bir tarayıcıda doğrudan açılacaktır.
Sayfa üstündeki Okul Adı, Sınıf, Sınıf Öğretmeni ve Eğitim-Öğretim Yılı kutucuklarını kendi sınıfınıza göre düzenleyin.
Düzenlemenin ardından "Yazdır" veya "PNG Olarak Kaydet" butonuna basarak velilerinizle paylaşın.

2. 📝 CSV Şablonu ile Ders Saatlerini Uyarlama

Kendi okulunuzun ders giriş-çıkış saatlerini ve ders dağılımını güncellemek için program_haftalik_ornek.csv dosyasını kullanabilirsiniz:

Gün;Sıra;Oturum;Başlangıç;Bitiş;Kalem;Tür
Pazartesi;1;1. Ders;08:30;09:10;Fen Bilimleri;Ders
Pazartesi;2;2. Ders;09:25;10:05;Matematik;Ders
Pazartesi;3;3. Ders;10:25;11:05;Türkçe;Ders
Pazartesi;4;4. Ders;11:20;12:00;Türkçe;Ders
Pazartesi;5;5. Ders;13:10;13:50;Beden Eğitimi ve Oyun;Ders
Pazartesi;6;6. Ders;14:05;14:45;Beden Eğitimi ve Oyun;Ders
Pazartesi;7;Etüt 1;15:00;15:40;Etüt;Etüt

Excel veya Google E-Tablolar ile Düzenleme

CSV dosyasını Excel veya Google E-Tablolar ile açın.
Kendi ders ve saatlerinizi girip noktalı virgül (;) ayracıyla CSV olarak kaydedin.
HTML dosyasındaki tablo satırlarını bu şablona göre güncelleyebilir veya tarayıcı konsolundan dinamik olarak içe aktarabilirsiniz.

📁 Proje Dosya Yapısı

Dosya	Tür	Açıklama
haftalik_ders_programi.html	Tek Dosyalı Web Uygulaması	Etkileşimli haftalık ders programı, tahta odak modu, Canvas PNG ve A4 yazdırma motoru.
program_haftalik_ornek.csv	Veri Şablonu	Okul ders ve etüt saatlerini yapılandırmak için örnek CSV veri tablosu.