Starvard University · Game Gaya Super Mario Pertamamu

Game Gaya Super Mario Pertamamu

Platformer kecil yang kamu cintai sejak kecil, dibangun olehmu, hari ini: AI menulis kodenya, kamu memilih wajahnya, dan game yang selesai itu hidup di web tempat teman-temanmu bisa memainkannya. Semua aset termasuk.

Seluruh kursus secara ringkas

  1. Kamu sedang membangun platformer sungguhan yang bisa dimainkan: lari, lompat, injak, koin, bendera. Punya kami bernama Super E2, dan kamu bisa memainkannya sebelum membangunnya.
  2. Ada lima cara yang jujur untuk membuat game seperti ini, dari jendela obrolan sampai mesin game sungguhan. Pilih berdasarkan seberapa besar kendali yang kamu inginkan.
  3. Jalur tercepat: Claude membangun seluruh game dalam sekali duduk, langsung di obrolan, dan menghostingnya secara gratis.
  4. Game terbuat dari aset: sprite untuk karakter, tile untuk dunia, suara untuk kegembiraan. Paket lengkap Super E2 menjadi milikmu untuk disimpan.
  5. Memodifikasi adalah keahlian yang sebenarnya: permintaan kecil dan jelas kepada Claude mengubah game starter menjadi gamemu.
  6. ChatGPT melukis wajah baru: teman-temanmu, anjingmu, pahlawanmu sendiri, dalam gaya piksel yang sama dengan para pemerannya.
  7. Game yang tidak bisa dibuka siapa pun adalah buku harian. Hosting secara gratis, sematkan di situsmu, dan kirimkan satu tautan.
  8. Rilis, biarkan teman bermain, lalu remix: level baru, pelari baru, namamu di layar judul.

Pelajaran 1

Game yang Sebentar Lagi Menjadi Milikmu

Platformer adalah jenis video game paling ramah yang pernah dibuat: lari, lompat, mendarat di sesuatu, ambil benda yang berkilau, capai bendera. Jika kamu tumbuh besar dalam empat puluh tahun terakhir, tanganmu sudah tahu cara memainkannya. Yang mungkin belum kamu tahu adalah bahwa di tahun 2026, satu orang dengan AI bisa membangunnya dalam satu sore, dan kursus ini memandumu melakukan persis itu, dengan aset yang termasuk.

Game contoh kami adalah Super E2. Game ini dibangun dengan Claude oleh pendiri Starvard, Dave, sebagai salah satu game pertamanya, lalu dibagikan ke seluruh komunitas kami beserta kodenya, dengan satu instruksi: modifikasi, masukkan dirimu dan teman-temanmu ke dalamnya. Delapan pelari (Dave, Marty, Jen, Sally, Jah Vibez, Dinesh, Chadwick dan Mike), makhluk untuk diinjak, koin untuk diambil, bendera untuk dicapai. Semangat itulah kursus ini: mulai dari game yang sudah bekerja, lalu jadikan milikmu.

Game starternya, bisa dimainkan langsung di sini. Di keyboard: panah untuk bergerak, Spasi untuk melompat. Buka layar penuh.

Pada akhirnya kamu akan memiliki: game yang bisa dimainkan dengan namamu di atasnya, karakter yang kamu pilih atau lukis, tautan yang bisa kamu kirim ke siapa saja, dan satu keahlian yang paling penting di zaman AI, yang bukan menulis kode. Keahlian itu adalah menjelaskan apa yang kamu inginkan dengan cukup jelas sampai mesin membangunnya, lalu menilai apa yang kembali. Game hanyalah cara paling menyenangkan untuk mempelajarinya.

Layar judul Super E2: delapan pelari untuk dipilih

Super E2, game yang menjadi pusat kursus ini. Salah satu game pertama Dave, dibuat dengan Claude dan dibagikan beserta kodenya.

Main dulu, bangun kemudian. Lima menit di dalam game mengajarkan lebih banyak daripada teori satu jam.

Pelajaran 2

Lima Cara Membuat Game Seperti Ini

Sebelum membangun, petanya dulu. Ada lima cara yang jujur untuk membuat platformer di tahun 2026, dan semuanya berbeda dalam satu pertukaran: kendali melawan kemudahan. Jendela obrolan adalah yang paling mudah dan paling tidak bertenaga; mesin game adalah kebalikannya. Tidak satu pun yang curang dan tidak satu pun yang merupakan satu-satunya cara yang benar; perancang game yang bekerja berpindah di antara semuanya terus-menerus.

Claude in the chat (Artifacts)
Gratis untuk memulai
Jelaskan gamenya, Claude menulisnya dalam satu berkas, dan tautan artifact-nya adalah hostingnya. Tanpa penyiapan, tanpa instalasi. Batasnya: satu berkas, dan game yang sangat besar akan melampauinya.
Game pertama terbaik, titik.
Claude Code on your computer
Claude Pro, $20/mo
Otak yang sama, bekerja di berkas aslimu. Ia bisa membagi game menjadi beberapa bagian, menambahkan berkas suara dan folder sprite, dan terus membangun selama berjam-jam.
Saat game pertama berhasil dan game kedua menjadi ambisius.
Web app builders (Lovable, Bolt)
Tingkatan gratis, lalu ~$20/mo
Ketik idenya, dapatkan aplikasi web yang berjalan lengkap dengan hosting. Cepat dan cantik; kodenya nyata, tetapi alatnya ditujukan untuk aplikasi dulu, game kemudian.
Cocok jika kamu berpikir dalam halaman, bukan kode.
No-code game makers (GDevelop, Construct)
Tingkatan gratis
Seret adegan menjadi satu, pasang perilaku (lompat, patroli, kumpulkan) dari menu, ekspor ke web. Tidak ada yang menulis kode; seseorang tetap merancang gamenya.
Untuk pemikir visual dan ruang kelas.
A real engine (Godot)
Gratis selamanya, sumber terbuka
Jalur profesional: editor sungguhan, adegan sungguhan, ekspor ke mana saja termasuk ponsel dan konsol. Minggu pertama lebih curam, langit-langitnya tanpa batas.
Game kedua atau ketiga, saat kamu sudah ketagihan.

Kursus ini mengambil Cara 1 sebagai jalan utama (Claude di obrolan), karena cara ini menghadirkan game yang bisa dimainkan di hadapanmu hari ini, dan semua yang kamu pelajari di sana (menjelaskan, mengiterasi, aset, hosting) berlaku juga untuk empat cara lainnya. Jika kamu sudah bisa menulis kode, lewati ke depan: Cara 2 dengan berkas starter di Pelajaran 4 adalah jalan masukmu.

Baru di sini? Cara 1. Sudah teknis? Cara 2 atau 5. Setiap cara mengajarkan keahlian inti yang sama: menjelaskan game dengan jelas.

Pelajaran 3

Bangun di Claude dalam Sekali Duduk

Buka Claude (tingkatan gratis sudah cukup untuk game pertama) dan tempel prompt ini. Ini bukan sihir; ini spesifik. Ia menyebutkan kontrolnya, kata kerjanya (injak, kumpulkan), syarat kemenangannya, gayanya, dan satu fitur yang dilupakan pemula, layar judul yang berisi pilihan.

“Buatkan saya platformer gaya Super Mario dalam satu berkas HTML. Seorang karakter yang berlari dengan tombol panah, melompat dengan Spasi, menginjak musuh untuk mendapatkan poin, mengumpulkan koin, dan menang dengan mencapai bendera. Gaya seni piksel, langit biru, bukit hijau. Biarkan saya memilih di antara beberapa karakter berbeda di layar judul.”

Yang kembali adalah sebuah game dalam satu berkas, hidup di dalam sebuah artifact: halaman yang Claude hosting untukmu, gratis, dengan tautannya sendiri. Mainkan segera, sampai ke bendera atau layar game over. Lalu iterasi, satu perubahan per pesan: 'buat bukitnya lebih bulat', 'tambahkan tiga koin lagi sebelum bendera', 'lompatannya terasa melayang, buat lebih responsif'. Setiap perubahan adalah versi baru, dan yang lama tetap tersimpan, jadi bereksperimen bebas dari rasa takut.

Perhatikan apa yang sedang kamu latih: permintaan singkat yang bisa diamati, diuji begitu sampai. Putaran itu, jelaskan, mainkan, sesuaikan, bukan trik Claude. Begitulah setiap game yang pernah kamu cintai sebenarnya dibuat, hanya saja timnya seper seratus ukurannya. Pelajaran 5 mengubah putaran itu menjadi sebuah sistem; pertama, kenali potongan-potongan pembentuk game.

Satu perubahan per pesan. Mainkan setelah setiap perubahan. Putaran itulah yang namanya pengembangan game.

Pelajaran 4

Kenali Asetnya: Sprite, Tile, dan Suara

Game terlihat seperti buatan tangan karena game disusun dari benda-benda kecil yang dibuat dan disebut aset. Sprite adalah gambar seorang karakter. Sprite sheet adalah banyak sprite dalam satu berkas gambar, diiris oleh kode: strip pelari kami memuat delapan potret dalam satu baris, dan game memotong yang kamu pilih. Tile adalah blok-blok berulang yang menjadi bahan pembangunan dunia (rumput, tanah, bata). Suara adalah lompatan, koin, dan injakan yang membuat game terasa hidup. Kode hanyalah panggungnya; aset adalah aktor dan pemandangannya.

Inilah paket lengkap Super E2, gratis untuk setiap siswa di kursus ini: strip pelarinya, setiap pelari sebagai kartu, seni judulnya, dan berkas game starternya sendiri. Unduh semuanya. Ini milikmu untuk di-remix, dan saat set sprite lengkap dari Dave dirilis, halaman inilah tempatnya mendarat.

runners-strip.png
Strip pelarinya: semua 8 karakter Super E2 dalam satu sprite sheet (768 x 96). Ganti satu gambar ini dan seluruh pemerannya berubah.
runner-dave.png
Kartu pelari: Dave
runner-marty.png
Kartu pelari: Marty
runner-jen.png
Kartu pelari: Jen
runner-sally.png
Kartu pelari: Sally
runner-jahvibez.png
Kartu pelari: Jah Vibez
runner-dinesh.png
Kartu pelari: Dinesh
runner-chadwick.png
Kartu pelari: Chadwick
runner-mike.png
Kartu pelari: Mike
super-e2-title.png
Seni layar judul Super E2, untuk layar judul atau postermu sendiri.
starter-game.html
Game starternya sendiri: berkas yang persis berjalan di demo di atas. Unduh, buka, lalu serahkan ke Claude.

Dua kebiasaan membuat aset tidak menyusahkan. Pertama, simpan yang asli: jangan pernah mengedit satu-satunya salinan spritemu. Kedua, hormati lisensi di luar kursus ini: web penuh dengan paket gratis yang murah hati (cari 'free platformer assets'), masing-masing dengan ketentuannya; satu baris kredit di gamemu adalah standar yang sopan. Paket kami tidak membawa pekerjaan rumah seperti itu: ini hadiah, gunakan di mana saja.

Strip pelari Super E2: delapan potret karakter dalam satu baris

Strip pelarinya: delapan potret, satu berkas gambar. Kode memotong pelari mana pun yang kamu pilih.

Aset adalah gamenya. Kode hanyalah panggung tempat mereka tampil. Simpan yang asli, beri kredit kepada orang lain, remix dengan bebas.

Pelajaran 5

Jadikan Milikmu dengan Claude

Memodifikasi adalah titik di mana game starter menjadi gamemu, dan ini adalah rumus yang bisa dipelajari: sebutkan bendanya, sebutkan perubahannya, sebutkan jumlahnya. 'Gravitasi' ditambah 'lebih lemah' ditambah 'sekitar setengahnya' memberimu lompatan bulan yang melayang dalam satu pesan. Berkas starter diberi komentar persis untuk ini: cari GRAVITY, JUMP, CRITTER SPEED dan LEVEL di dalamnya, dan kamu sedang membaca panel kendali gamenya.

Sebuah menu remix pertama, diurutkan berdasarkan kegembiraan per menit: ganti dengan pelari favoritmu (Pelajaran 6 melukis yang baru). Buat lompatan lebih melayang atau lebih responsif. Tambahkan lompatan ganda. Lukis level malam dengan kode yang sama dan warna yang lebih gelap. Tambahkan pengatur waktu dan balapan dengan teman-temanmu. Buat satu makhluk menjadi raksasa dan sebut ia bos. Masing-masing adalah satu kalimat jelas kepada Claude, dan bersama-sama mereka adalah sebuah portofolio.

Bekerjalah seperti perancang: simpan daftar kecil perubahan yang kamu inginkan, lakukan satu per satu, dan mainkan setelah masing-masing. Saat sebuah perubahan merusak sesuatu (pasti terjadi), katakan apa yang kamu lihat, bukan apa yang menurutmu dilakukan kode: 'setelah lompatan ganda, saya jatuh menembus platform kedua' memperbaiki lebih banyak bug daripada teori apa pun. Rusak, dijelaskan dengan baik, diperbaiki: itulah seluruh keahliannya.

Simpan salinan sebelum setiap perubahan besar. Versi 1 adalah mesin waktumu, dan penjelasan yang jelas adalah kunci inggrismu.

Pelajaran 6

Wajah Baru dengan ChatGPT

Pemeran Super E2 adalah delapan teman. Pemeranmu harus milikmu, dan ChatGPT adalah studio potretnya. Alur kerjanya: ambil foto yang jelas dan menghadap ke depan (milikmu, milik teman, dengan restu mereka), dan minta ChatGPT menggambarnya ulang sebagai sprite game dengan satu resep yang konsisten, supaya setiap potret cocok: kata gaya yang sama, ukuran yang sama, latar sederhana yang sama.

Resep yang membangun tampilan pemeran kami: 'Ubah foto ini menjadi potret karakter game seni piksel yang lucu, menghadap ke depan, kepala dan bahu, fitur besar yang mudah dibaca, warna datar, latar biru laut gelap, format persegi, gaya layar pilih karakter video game.' Jalankan setiap wajah melalui prompt yang sama itu, letakkan setiap hasil ke dalam satu sel strip pelari (berkas starter menunjukkan tata letaknya: delapan kotak dalam satu baris), dan teman-temanmu masuk ke dalam game.

ChatGPT juga melukis sisa dunianya: layar judul dengan gaya yang sama, latar matahari terbenam, bendera dengan lambang timmu. Satu peringatan dari pengalaman: mintalah satu aset per gambar, jaga kalimat gaya tetap sama persis di semuanya, dan buat ulang yang terasa janggal daripada menerima pemeran yang tidak serasi. Konsistensi adalah yang membuatnya terlihat seperti game, bukan kolase.

Satu resep, setiap wajah. Konsistensi adalah perbedaan antara game dan kolase.

Pelajaran 7

Taruh di Web

Game yang tidak bisa dibuka siapa pun adalah buku harian. Kabar baiknya: game satu berkas adalah hal termudah di Bumi untuk diterbitkan, dan setiap pintunya gratis. Pintu satu: artifact Claude itu sendiri. Tautan yang Claude berikan untuk gamemu adalah halaman yang sudah diterbitkan; kirimkan ke siapa saja dan mereka bermain dalam hitungan detik. Untuk kebanyakan game pertama, berhenti di sini dan rayakan.

Pintu dua: situsmu sendiri. Unduh berkas gamenya (punya kami dari Pelajaran 4, punyamu dari Claude), unggah ke situs mana pun yang kamu kendalikan, dan ia tayang di alamatmu, di samping namamu, selamanya. Ingin ia berada di dalam halaman yang sudah ada? Satu baris iframe menyematkannya, sama seperti kursus ini menyematkan demo di Pelajaran 1.

Pintu tiga: host statis gratis. Cloudflare Pages, Netlify, dan GitHub Pages semuanya menerbitkan berkas seperti ini dengan nol dolar, dengan tautan sungguhan yang bisa kamu bagikan di mana saja (seret berkasnya ke halaman drop Netlify dan selesai dalam waktu kurang dari satu menit). Pintu mana pun yang kamu pilih, ritualnya sama: buka tautannya di ponselmu, mainkan satu level, lalu kirimkan ke satu teman. Game dengan satu pemain sudah terbit; game dengan nol pemain adalah draf.

Satu tautan, dibuka di ponselmu, dikirim ke satu teman. Itulah seluruh rencana peluncurannya.

Pelajaran 8

Rilis, Bagikan, Remix

Peluncuran Super E2 adalah satu kiriman di Discord kami: gamenya, kodenya, dan undangan untuk me-remix-nya. Tiru peluncuran itu. Kirim tautanmu di tempat orang-orangmu berada, sertakan berkasnya, dan ucapkan kata-kata yang mengubah pemain menjadi pembangun: 'masukkan dirimu ke dalamnya.' Teman pertama yang merilis remix dari gamemu mengajarimu lebih banyak daripada sepuluh tutorial.

Lalu teruskan, dalam urutan apa pun: level kedua dengan set tile baru. Lagu tema (Suno menulis chiptune yang menarik dalam satu prompt, dan ElevenLabs bisa menyuarakan penyiar kecil). Tabel skor tertinggi dengan nama teman-temanmu. Versi musim dingin dengan tile salju dan pendaratan yang licin. Masing-masing sepadan satu pelajaran permintaan, dan berkas starter plus aset kursus ini tumbuh bersamamu.

Dan perhatikan apa yang kini kamu miliki, di luar gamenya: bukti bahwa kamu bisa menjelaskan sesuatu sampai ia wujud, menilai hasilnya, dan merilisnya ke dunia secara gratis. Itulah keahlian paling berharga dalam satu dekade ini, dan kamu mempelajarinya dengan membuat pahlawan kecil melompat menimpa seekor makhluk. Ada cara yang lebih buruk untuk mengubah hidupmu.

Game kecil yang selesai mengalahkan epik yang hanya diimpikan, setiap saat. Rilis yang kecil itu, lalu buat ia tidak sekecil itu.

Terus belajar

Kursus ini adalah bagian dari Starvard University, yang berjuang meraih kehebatan.

Jelajahi Starvard · Semua kursus gratis