Mindmap ke Logika Pemrograman Ren'Py
Menjembatani ide visual (mindmap) ke dalam instruksi kode yang bisa dipahami komputer. Ini adalah pertemuan krusial di mana desain cerita bertemu dengan pemrograman.
Target Kompetensi
Mahasiswa mampu mengonversi struktur mindmap cerita menjadi label-label Ren'Py yang terhubung dengan perintah jump dan call, serta memahami aturan indentasi sebagai fondasi sintaks Ren'Py.
Membaca Mindmap sebagai Peta Kode
Setiap elemen dalam mindmap ceritamu bisa dipetakan langsung ke elemen dalam kode Ren'Py. Ini adalah "kamus terjemahan" dari bahasa visual ke bahasa pemrograman.
| Elemen Mindmap | Padanan di Ren'Py | Contoh Kode |
|---|---|---|
| Node/Kotak Scene | label nama_scene: |
label kampus_pagi: |
| Panah (alur ke scene lain) | jump nama_scene |
jump kampus_siang |
| Titik Keputusan (diamond) | menu: |
menu: "Pilih A" atau "Pilih B" |
| Dialog/Teks di scene | Pernyataan say | n "Hai, ini dialog Nabilah." |
| Akhir/Ending | return |
return (di akhir label) |
Label dan Jump: Tulang Punggung Alur Ren'Py
Label: Titik Bernama dalam Cerita
Anggap label sebagai halaman dalam buku. Setiap label punya nama unik dan berisi konten. Ren'Py membaca dari atas ke bawah, dan bisa "melompat" ke label mana pun.
label nama_label: # Nama label (huruf kecil, underscore, no spasi)
# Semua konten di sini HARUS diindentasi 4 spasi
n "Ini dialog dalam label ini."
n "Ini dialog berikutnya."
jump label_berikutnya # Pindah ke label lain
Jump vs Call: Apa Bedanya?
Pindah ke label lain secara permanen. Seperti merobek halaman dan memulai dari halaman baru. Tidak bisa kembali ke titik semula.
Pergi ke label lain, lalu kembali ke titik asal setelah label tersebut selesai (dengan return). Seperti menelepon seseorang dan kembali melanjutkan pekerjaan.
label start:
n "Perjalanan dimulai."
call scene_kilas_balik # Pergi ke kilas_balik, lalu KEMBALI ke sini
n "Setelah kilas balik, cerita lanjut dari sini." # Ini dieksekusi setelah return
jump ending # Pergi ke ending, tidak kembali
label scene_kilas_balik:
n "[Kilas balik dua tahun lalu...]"
n "Saat itu saya masih mahasiswa baru."
return # Kembali ke titik call di atas
label ending:
n "Dan cerita berakhir di sini."
return
Aturan Indentasi: Aturan Emas Ren'Py
Di Ren'Py (seperti Python), indentasi menentukan hierarki kode. Salah indentasi = error. Selalu gunakan 4 spasi (bukan tab) untuk setiap level.
label start:
n "Ini akan error karena tidak diindentasi!" # ERROR
n "Ini juga error karena hanya 2 spasi." # ERROR
label start:
n "Ini benar, 4 spasi indentasi." # Level 1
menu:
"Pilihan A": # Level 2 (8 spasi)
n "Kamu memilih A!" # Level 3 (12 spasi)
jump ending_a
"Pilihan B": # Level 2 (8 spasi)
n "Kamu memilih B!" # Level 3 (12 spasi)
jump ending_b
Install ekstensi "Ren'Py Language" di VS Code. Ekstensi ini akan otomatis mem-format indentasi dan mewarnai sintaks Ren'Py sehingga lebih mudah dibaca.
Konversi Mindmap ke Kode: Studi Kasus
Mari kita praktikkan konversi nyata dari mindmap ke kode Ren'Py lengkap.
Mindmap Cerita: "Pilihan di Persimpangan"
START
|
v
[Scene Awal: Ahmad dapat email panggilan magang]
|
v
[Dialog dengan Nabilah: "Kamu harus ambil!""]
|
v
[PILIHAN] --- "Ambil magang" ---------> [Scene Magang] --> ENDING A
| "Ahmad berhasil tapi jauh dari keluarga"
|
\-------> "Tolak, prioritas keluarga" -> [Scene Rumah] --> ENDING B
"Ahmad tetap di rumah, merawat ibu"
Hasil Konversi ke Kode Ren'Py
# Definisi Karakter
define a = Character("Ahmad", color="#ffc8c8")
define n = Character("Nabilah", color="#c8ffc8")
define narasi = Character("", color="#ffffff")
# ============================================
# SCENE AWAL
# ============================================
label start:
narasi "Senin pagi. Ahmad duduk di kamarnya membaca email."
a "(Membaca) 'Selamat, Anda terpilih untuk program magang di Jakarta...'"
a "Magang impian... tapi ini artinya harus meninggalkan ibu."
jump scene_konsultasi
label scene_konsultasi:
n "Ahmad, ini kesempatan emas! Kapan lagi bisa magang di perusahaan sebesar itu?"
a "Tapi ibu masih sakit, Nabilah. Aku tidak bisa meninggalkan beliau begitu saja."
n "Kamu harus memikirkan masa depanmu juga."
menu:
"Ambil magang. Ini kesempatan yang tidak boleh dilewatkan.":
jump scene_ambil_magang
"Tolak. Keluarga adalah prioritas utama.":
jump scene_tolak_magang
# ============================================
# JALUR A: Ambil Magang
# ============================================
label scene_ambil_magang:
narasi "Tiga bulan kemudian, di Jakarta."
a "Terima kasih Bu, materi presentasinya sudah siap."
narasi "Ahmad sukses di kantor, tapi setiap malam ia membuka foto ibunya."
a "(Berbisik) Ibu, Ahmad janji, ini semua untuk keluarga kita."
jump ending_a
label ending_a:
narasi "Karier Ahmad berkembang pesat. Ia belajar bahwa terkadang,"
narasi "mencintai keluarga berarti mempersiapkan masa depan yang lebih baik untuk mereka."
return
# ============================================
# JALUR B: Tolak Magang
# ============================================
label scene_tolak_magang:
narasi "Satu bulan kemudian."
a "Bu, ini sup favoritmu. Dimakan dulu ya, biar cepat sembuh."
narasi "Ahmad tidak menyesal. Ada kebahagiaan lain yang tidak bisa diukur dengan karier."
jump ending_b
label ending_b:
narasi "Setahun kemudian, Ahmad melamar di perusahaan lokal dan diterima."
narasi "Ibunya pulih. Keluarga itu kuat bukan karena jabatan, tapi karena saling ada."
return
Mendesain Karakter dengan Bantuan AI
Pada pertemuan ini (bersamaan dengan P3.1), kamu akan mulai mendesain karakter visual menggunakan AI sebagai alat bantu.
Langkah Membuat Sprite Karakter dengan Gemini AI
Buka Google Gemini
Kunjungi gemini.google.com dan login dengan akun Google kamu. Pastikan menggunakan versi terbaru (Gemini 2.0 atau lebih baru) yang bisa generate gambar.
Aktifkan Mode Generate Gambar
Di Gemini, pilih model yang mendukung image generation. Kalau Gemini tidak bisa, coba Genspark.ai dengan memilih model "Nano Banana 2".
Tulis Prompt yang Spesifik
Gunakan template prompt di bawah ini. Semakin spesifik promptnya, semakin bagus hasilnya.
Iterasi dan Sempurnakan
Hasil pertama mungkin belum sempurna. Minta AI untuk menyempurnakan dengan kalimat follow-up seperti "Buat ekspresi yang lebih natural" atau "Ubah warna bajunya menjadi hijau".
Template Prompt Karakter Visual Novel
Untuk menjaga karakter terlihat konsisten di berbagai ekspresi, selalu gunakan kata "Same character as before" di prompt lanjutan. Deskripsi pakaian dan ciri fisik harus sama persis di setiap prompt.
Spesifikasi Gambar untuk Ren'Py
| Jenis Gambar | Ukuran Ideal | Format | Keterangan |
|---|---|---|---|
| Sprite Karakter | 400x600 s/d 800x1200 | PNG (transparan) | Background transparan agar bisa di-layer di atas scene |
| Background Scene | 1280x720 | JPG atau PNG | Sesuai resolusi game standar |
| CG (Event Art) | 1280x720 | PNG atau JPG | Gambar full scene untuk momen penting |
Ren'Py Console: Alat Debug Terbaik
Saat game sedang berjalan, kamu bisa membuka console untuk menginspeksi dan mengubah variabel secara real-time.
Tekan Shift + O (huruf O, bukan angka 0) saat game sedang berjalan dalam mode developer. Console hanya tersedia saat game dijalankan dari Launcher, bukan dari file .exe final.
Perintah Console yang Berguna
# Cek nilai variabel
print(variabel_saya)
# Ubah nilai variabel langsung
variabel_saya = 10
# Lompat ke label tertentu untuk testing
renpy.jump("ending_a")
# Reload skrip tanpa restart game
# (di luar console, tekan Shift+R)
Tugas Pertemuan 3
Tugas 3: Implementasi Mindmap ke Kode
- Ambil mindmap cerita dari Tugas 2 dan konversikan ke kode Ren'Py.
- Minimal harus ada: 3 label berbeda, 1 perintah menu dengan 2 pilihan, 2 perintah jump, dan minimal 1 return.
- Jalankan game dan pastikan tidak ada error. Screenshot game yang berjalan.
- (Bonus) Generate sprite karakter pertama kamu menggunakan Gemini AI dan tempatkan di folder
game/images/.
Kuis Pemahaman Pertemuan 3
Uji Pemahamanmu!
1. Apa perbedaan utama antara jump dan call?
2. Berapa jumlah spasi indentasi standar yang benar di Ren'Py?
3. Bagaimana cara membuka Ren'Py Console saat game sedang berjalan?