Membuat Game dengan AI Gratis: Gemini Menggambar, Claude Membangun (Tanpa Coding)

Kamu bisa membuat game yang bisa dimainkan dengan AI tanpa menulis satu baris kode pun: Gemini menggambar gambarnya, kamu serahkan ke Claude untuk dijadikan game, lalu dimainkan di browser. Versi pertama game di bawah yang bisa dimainkan sudah jadi dalam waktu kurang dari 10 menit. Game seperti ini dulu butuh beberapa minggu.

Ini game yang saya maksud. Klik sekali, lalu main: klik kiri menembak, klik kanan melempar granat. Ada tombol layar penuh di bilah atas.

Idenya: satu AI menggambar, AI lain membangun

AI obrolan sangat jago menulis kode game kecil, tetapi tidak bisa menggambar kota reruntuhan yang suram, kawanan zombie, dan menara laser dengan gaya yang sama. AI gambar bisa menggambar semuanya, tetapi tidak bisa membuat gambarnya bergerak. Jadi saya memakai dua alat dan memberi masing-masing tugas yang paling cocok.

• Gemini menggambar gambarnya: latar belakang, zombie, dan senjata.
• Claude mengambil gambar-gambar itu, memotongnya menjadi potongan terpisah, menyusun adegannya, dan membuat level-levelnya.

Kamu tidak terikat pada kedua alat ini. AI apa pun yang membuat gambar bisa menggambar, dan AI obrolan apa pun yang menulis kode bisa membangun. ChatGPT dan Gemini juga bisa menulis bagian kodenya, dan cukup untuk game yang lebih sederhana dari bentuk dan warna polos. Gambarlah yang membuat sebuah game terlihat seperti game sungguhan.

Yang kamu butuhkan

• AI yang membuat gambar. Saya memakai Gemini.
• AI obrolan yang menulis kode. Saya memakai Claude, dan ChatGPT atau Gemini juga bisa.
• Browser Chrome. Kamu tidak perlu memasang program apa pun.

Kamu bisa mulai gratis, tetapi paket gratis punya batas harian untuk gambar dan pesan, dan aturannya berbeda dari paket ke paket. Banyak alat gambar hanya mengizinkan penggunaan komersial gambarnya di paket berbayar, jadi baca apa kata paketmu kalau kamu berencana membagikan atau menjual game-nya. Tulisan ini tentang cara membuat game dengan cepat memakai AI, bukan nasihat hukum.

Untuk hosting, yaitu tempat di internet tempat game disimpan agar siapa pun bisa membukanya, saya memakai situs web saya sendiri, situs yang sedang kamu baca ini. Kamu bisa melakukan hal yang sama dengan situsmu, dan ada pilihan lain yang saya jelaskan di bawah.

Kalau kamu belum punya situs web, kamu butuh hosting dulu. Salah satu cara yang mudah adalah Bluehost. Itu perusahaan hosting yang pembuat situs berbasis AI-nya menggabungkan hosting dengan situs awal, jadi kamu tidak mulai dari halaman kosong, dan sebagian besar paket hosting memungkinkan kamu mengunggah file sendiri, misalnya satu file game. Lihat halaman mereka untuk paket dan harga terbaru sebelum memutuskan, karena penawaran bisa berubah.

Langkah 1: Tentukan gamenya, lalu minta gambar ke AI gambar

Sebelum menggambar apa pun, pikirkan game seperti apa yang kamu mau. Game pertahanan di mana kamu menjaga tembok dari musuh, game tembak-menembak di luar angkasa, labirin, game kartu? Dan bagaimana tampilannya: kota reruntuhan yang gelap, hutan yang terang, luar angkasa? Karakter apa yang kamu perlukan: satu pahlawan, beberapa musuh, satu bos? Kamu tidak harus memutuskan semuanya sendirian. Minta ide dulu ke AI, dan dalam hitungan detik kamu akan dapat beberapa.

Kamu bisa mulai dengan permintaan seperti ini: “Saya ingin membuat game sederhana yang berjalan di browser, dalam satu file HTML. Beri saya lima ide game yang mudah dibuat. Untuk masing-masing, katakan dalam satu kalimat apa yang dilakukan pemain, seperti apa latar belakangnya, dan karakter atau objek apa yang gambarnya saya butuhkan.”

Pilih ide yang paling kamu suka, ubah apa saja yang kamu mau, dan sekarang kamu tahu persis gambar apa yang harus diminta. Game sederhana butuh tiga jenis: latar belakang, musuh, dan senjata. Minta masing-masing secara terpisah, dan selalu minta gaya yang sama agar semuanya terlihat serasi. Inilah jenis permintaan yang berhasil.

Untuk latar belakang, saya meminta sesuatu seperti ini: “Gambar latar belakang game dari sudut pandang atas untuk game pertahanan markas: jalan retak yang hancur di bagian atas dan tembok logam kuat dengan gerbang di bagian bawah. Gaya pixel art gelap dan kusam, gambar lebar 16:9, tanpa teks dan tanpa karakter.”

Untuk musuh: “Gambar lembar sprite satu cyber-zombie hijau dalam enam pose: dua sedang berjalan, satu mengulurkan tangan, satu menyerang, dan dua lagi. Karakter yang sama dan ukuran yang sama di setiap pose, dilihat dari depan, dengan jarak yang jelas antar pose, di atas latar abu-abu polos. Gaya pixel art yang sama dengan latar belakang.”

Dan untuk senjata dan efek: “Gambar menara senjata fiksi ilmiah dalam enam frame, diam dan sedang menembak, gerbang laser yang bersinar, ledakan dalam empat frame, dan sambaran energi biru. Gaya pixel art yang sama, di atas latar abu-abu polos.”

Satu hal yang saya pelajari: kalau kamu meminta “latar belakang transparan”, banyak alat gambar melukiskan papan catur abu-abu dan putih palsu ke dalam gambar, seolah itu bagian dari gambarnya. Warna polos bekerja lebih baik. Claude bisa menghapusnya setelah itu.

Langkah 2: Serahkan gambar ke AI obrolan

Buka Claude, lampirkan gambarnya, dan jelaskan game dengan kata-kata sederhana. Kamu tidak perlu tahu cara kerja sebuah game. Katakan apa yang ingin kamu lihat dan lakukan, dan serahkan kodenya ke AI. Misalnya:

“Ini tiga gambar: latar belakang, lembar sprite zombie, dan lembar menara. Potong sendiri lembar-lembar itu menjadi gambar terpisah dan buat game browser dalam satu file. Sebuah menara di bawah menjaga tembok dari zombie yang datang dalam 10 gelombang. Menara membidik dengan mouse dan menembak dengan tombol kiri, tombol kanan melempar granat. Setiap zombie memberi kredit untuk membeli peningkatan. Tambahkan efek suara dan bos di gelombang 5 dan 10. Buat layar awal dan layar menang atau game over.”

Dalam kasus saya, Claude memotong lembar-lembar itu menjadi potongan, menaruh latar belakang, menyusun adegan, dan menulis level-levelnya. Beberapa menit kemudian versi pertamanya sudah bisa dimainkan. Setelah itu saya menghabiskan lebih banyak waktu untuk tambahan, yaitu langkah 4.

Langkah 3: Mainkan tanpa menyimpan apa pun

Claude menampilkan banyak jawaban dalam pratinjau langsung di dalam obrolan. Kalau kodemu berasal dari ChatGPT atau Gemini, ada cara yang lebih cepat lagi: AI Code Harvester, ekstensi Chrome gratis kami, menemukan kode di dalam jawaban, dan tombol Tampilkan menjalankannya langsung di tab baru. Kamu tidak menyimpan file dan tidak menyalin-tempel apa pun.

Karena itu Harvester menjadi tambahan yang ampuh untuk semua yang bisa berjalan di browser tanpa menyimpan file: game, alat kecil, desain halaman. Kamu bertanya, tekan Tampilkan, lihat hasilnya, minta perubahan, lalu lihat lagi. Ini bekerja di halaman ChatGPT dan Gemini, dan panduan kami Cara menjalankan kode HTML dari ChatGPT atau Gemini dan melihat halamannya langsung menjelaskannya langkah demi langkah.

Langkah 4: Sempurnakan dengan satu permintaan setiap kali

Versi pertama tidak pernah menjadi versi akhir, dan di situlah serunya. Setelah versi pertama, saya mengubah game dengan permintaan sederhana, satu per satu. Beberapa di antaranya:

• “Tampilkan huruf tombol kecil di tepi layar, dengan teks singkat, supaya pemain tahu tombol mana membeli apa.”
• “Tambahkan prajurit yang melempar granat sendiri ke zombie terdekat.” Untuk dia, saya memberi Claude gambar baru dari Gemini.
• “Tambahkan menara otomatis yang membidik dan menembak sendiri, tetapi lebih lambat dari menara utama.”
• “Zombie hanya boleh kehilangan energi kalau kena di badan atau kepala, bukan di kaki.”
• “Tambahkan tombol jeda di pojok kiri atas dan tombol layar penuh.”
• “Buat gelombang terakhir jauh lebih besar.”

Aturan yang paling menghemat waktu: minta satu perubahan, coba, lalu minta yang berikutnya. Kalau ada yang rusak, katakan “batalkan perubahan terakhir”. AI ingat apa yang sudah dilakukannya dan bisa memperbaikinya.

Coba di komputermu sendiri sebelum menaruhnya online

Sebelum membagikan game, coba dulu di rumah, tempat tidak ada yang melihat kesalahannya. Game seperti ini adalah halaman web, dan komputermu bisa membukanya tanpa server apa pun.

1. Simpan kode sebagai satu file, misalnya game.html. Kalau game memakai gambar dari sebuah folder, taruh folder itu di samping file. Atau minta AI: “Masukkan gambarnya ke dalam file, supaya jadi satu file saja.” Dengan begitu tidak ada yang bisa hilang.
2. Klik dua kali file itu. File akan terbuka di browsermu.
3. Klik game sekali, lalu gunakan tombolnya. Browser butuh klik pertama itu agar game bisa menangkap keyboard.
4. Periksa semuanya: mouse dan tombol, suara, layar penuh, jeda, dan apakah game bisa dimainkan sampai selesai.
5. Perbaiki yang salah dengan memberi tahu AI persis apa yang kamu lihat.

Kalau sudah berjalan, taruh online supaya orang lain bisa main. Untuk itu kamu butuh hosting web, yaitu sekadar tempat di internet yang menyimpan file-mu dan memberinya alamat. Satu file game bisa berjalan di hampir semua hosting, termasuk yang gratis. Panduan kami Di mana mempublikasikan halaman web buatan AI membahas pilihannya dengan kata-kata sederhana. Di situs kami sendiri, kami memakai Firebase Hosting.

Untuk menampilkan game di dalam halaman situsmu sendiri, tambahkan seperti ini:

<iframe src="https://yoursite.com/game.html" width="1024" height="572" allow="fullscreen"></iframe>

Bagian allow="fullscreen" membuat pemain bisa memakai tombol layar penuh. Kalau kamu mengunggah versi baru tetapi masih melihat yang lama, tekan Ctrl+F5 agar browser memuatnya dari awal.

Tidak ada batasnya

Begitu dasarnya jadi, sisanya hanya sejauh satu permintaan: musuh baru, latar belakang baru untuk level berikutnya, bos yang lebih sulit, senjata lain, jenis game yang baru. Untuk tampilan baru, minta AI gambar membuat satu set gambar lagi dan serahkan ke AI obrolan. Yang dulu butuh tim dan berminggu-minggu kerja, sekarang cukup satu malam dan sedikit imajinasi.

Perlu diketahui sebelum mulai

Mau diapakan game itu, kamu yang menentukan

Kalau game sudah jadi, kamu sendiri yang memutuskan apa selanjutnya. Bagikan di media sosial, kirim tautannya ke teman-teman, taruh di situsmu sendiri, atau simpan untuk dirimu sendiri. Tidak ada jawaban yang benar, dan serunya justru karena kamu yang membuatnya.

Pertanyaan Umum