BAB 01
Representasi Gambar sebagai Matriks
Gambar grayscale adalah grid angka. Setiap piksel bernilai 0–255. Di sini kita sederhanakan ke 0/1 agar logikanya mudah ditelusuri tangan.
Pola "X" 9×9
Diagonal kiri-atas ke kanan-bawah + kanan-atas ke kiri-bawah bersilang
Pola "O" 9×9
Batas luar aktif, bagian tengah kosong
Tidak Berpola 9×9
Distribusi piksel acak, tidak ada pola sistematis
Mengapa perlu CNN?
❌ Pendekatan Naif (MLP Biasa)
Ratakan 9×9 = 81 piksel → hubungkan langsung ke outputMasalah: geser X 1 piksel → semua 81 angka berubah total
✅ CNN
Filter kecil geser seluruh gambar → deteksi pola lokalKeuntungan: X di pojok mana pun tetap terdeteksi
BAB 02
Operasi Konvolusi Step-by-Step
Filter 3×3 bergerak dari kiri-atas ke kanan-bawah. Di setiap posisi, kita kalikan elemen-per-elemen lalu jumlahkan → satu nilai di feature map.
Pilih Pola Input & Filter
INPUT (9×9)
⊛
konvolusi
FILTER (3×3)
=
FEATURE MAP (7×7)
Tekan tombol di bawah untuk mulai animasi...
Langkah 0 / 49
Rumus Konvolusi
Feature_Map[i][j] = Σ Σ Input[i+m][j+n] × Filter[m][n]
m=0..2 n=0..2
Output size = (Input - Filter + 2×Padding) / Stride + 1
= (9 - 3 + 0) / 1 + 1 = 7
m=0..2 n=0..2
Output size = (Input - Filter + 2×Padding) / Stride + 1
= (9 - 3 + 0) / 1 + 1 = 7
BAB 03
Jenis-Jenis Operasi Konvolusi
Selain konvolusi standar, ada banyak varian yang dirancang untuk efisiensi atau tujuan tertentu.
Standard Conv Dasar
Filter bergeser dengan stride=1 tanpa padding. Output lebih kecil dari input.
Same Padding Umum
Tambah nol di tepi agar output sama besar dengan input.
Strided Conv Efisien
Filter meloncat stride=2, menggantikan pooling layer.
Depthwise MobileNet
Setiap channel diproses filter terpisah. Jauh lebih hemat parameter.
Dilated Conv Receptive Field
Filter "direnggangkan" dengan dilation rate=2 agar jangkauan lebih luas tanpa parameter tambahan.
Transposed Conv Upsampling
Kebalikan konvolusi — memperbesar ukuran. Dipakai di segmentasi dan generative model.
Standard Convolution
Perbandingan Parameter & Kompleksitas
BAB 04
Fungsi Aktivasi
Tanpa fungsi non-linear, berapapun layer yang ditumpuk hasilnya tetap satu transformasi linear. Aktivasi memberi CNN kemampuan belajar pola non-linear.
Pilih Fungsi Aktivasi
ReLU — Rectified Linear Unit
f(x) = max(0, x)
Kelebihan: Sederhana, gradient tidak menghilang untuk x>0, komputasi cepat.
Kelemahan: "Dying ReLU" — neuron bisa mati permanen jika inputnya selalu negatif.
Kelemahan: "Dying ReLU" — neuron bisa mati permanen jika inputnya selalu negatif.
Demonstrasi ReLU pada Feature Map
Lihat bagaimana nilai negatif dihilangkan
Sebelum ReLU (ada negatif)
→
Setelah ReLU (negatif → 0)
BAB 05
Pooling Layer
Pooling meringkas feature map dengan mengambil nilai representatif dari setiap region. Hasilnya: ukuran lebih kecil, dan tahan terhadap pergeseran kecil (translation invariance).
Jenis Pooling
Max Pooling: Ambil nilai terbesar. Mendeteksi kehadiran fitur — tidak peduli posisi persisnya.
Max Pooling 2×2
Input (6×6) Klik region
→
Output (3×3)
Klik pada salah satu blok 2×2 untuk melihat perhitungan...
BAB 06
Flatten & Fully Connected Layer
Setelah semua konvolusi dan pooling, feature map "dipipihkan" menjadi vektor 1D, lalu diproses oleh layer fully connected untuk pengambilan keputusan akhir.
Proses Flatten → FC → Output
Flatten
Feature map 3×3×4 = 36 nilai digabung menjadi vektor panjang [v₁, v₂, ..., v₃₆].
Operasi ini tidak mengubah nilai, hanya mengubah bentuk (reshape).
Operasi ini tidak mengubah nilai, hanya mengubah bentuk (reshape).
flatten(3×3×4) → [36]
Fully Connected (Dense) Layer
Setiap neuron terhubung ke semua input sebelumnya. Bobot (W) dan bias (b) adalah parameter yang dipelajari.
36 input → 16 hidden → 3 output
36 input → 16 hidden → 3 output
output = W·x + b
kemudian softmax(output) → probabilitas
kemudian softmax(output) → probabilitas
Softmax
Mengubah skor (logit) menjadi probabilitas yang jumlahnya tepat = 1.
σ(zᵢ) = e^zᵢ / Σ e^zⱼ
[3.1, 0.4, 0.2] →
[0.88, 0.07, 0.05]
[3.1, 0.4, 0.2] →
[0.88, 0.07, 0.05]
BAB 07
Klasifikasi Lengkap X / O / Noise
Lihat bagaimana CNN memproses setiap pola dari awal hingga keputusan akhir. Setiap layer menambah abstraksi.
Pilih Pola untuk Diklasifikasi
Input
Conv+ReLU (Filter A, diagonal ↘)
Biru = aktif kuat
Max Pool
Prediksi Akhir
Aktivasi 4 Filter pada Input Terpilih
Setiap filter mendeteksi fitur berbeda
BAB 08
Filter Explorer
Edit nilai filter secara manual dan lihat hasilnya secara real-time pada pola yang dipilih.
Edit Filter 3×3
Klik sel dan ubah nilainya (-2 sampai 2)
Input
Feature Map Hasil
Hijau = nilai tinggi | Merah = negatif
Filter Bawaan Terkenal
BAB 09
Pipeline CNN Lengkap
Klik setiap blok untuk melihat detail layer tersebut.
Arsitektur CNN untuk Klasifikasi X/O/Noise
Klik layer di atas untuk melihat detail
Ukuran Data per Layer
Jumlah Parameter per Layer
BAB 10
Playground — Gambar Sendiri
Gambar pola di grid 9×9, lalu jalankan konvolusi dengan filter pilihan Anda. Lihat feature map hasilnya secara real-time.
Gambar di Grid Klik untuk toggle
Pilih Filter
Filter Preview
Feature Map (7×7)
Setelah ReLU