Menyalin 'Angry Birds' hanya dengan AI

 (twitter.com/javilopen)
3 poin oleh GN⁺ 2023-11-01 | 1 komentar | Bagikan ke WhatsApp
  • Javi Lopez membuat Angry Pumpkins, game fisika 2D bergaya Angry Birds, dengan menghasilkan kode lewat GPT-4 dan membuat grafis lewat Midjourney·DALL·E 3
  • Hasilnya bisa dimainkan di web, tetapi tidak berjalan di perangkat mobile, dan dengan mengikuti penjelasan di bawah layar game, pemain juga bisa membuat level mereka sendiri
  • Sebagian besar grafis dibuat dengan generator gambar AI, lalu beberapa sprite dirapikan agar sesuai untuk game melalui penghapusan latar belakang dan crop di Photoshop/Photopea
  • Kode dimulai berbasis matter.js dan p5.js, lalu diperluas melalui revisi berulang bersama GPT-4 untuk mekanisme peluncuran, tabrakan, partikel, bentuk monster, dan penilaian dampak tidak langsung
  • Total kode sekitar 600 baris; ia memang tidak menulis kode secara langsung, tetapi alih-alih mendapatkan game jadi dari satu prompt, tetap diperlukan proses berulang untuk menjelaskan error dan memperbaikinya

Hasil Angry Pumpkins

  • Angry Pumpkins adalah game fisika 2D yang bekerja mirip Angry Birds, dibuat dengan memanfaatkan GPT-4, Midjourney, dan DALL·E 3
  • Game yang bisa dimainkan dapat dilihat di Angry Pumpkins
    • Saat ini tidak berjalan di mobile
    • Jika membaca penjelasan di bawah layar game, Anda bisa mengetahui cara membuat dan memainkan level sendiri
  • Javi Lopez melihat bahwa cara kerja baru untuk membuat sesuatu hanya dengan bahasa alami kini mulai memungkinkan, dan ia menyebutnya sebagai “momen bersejarah”

Alur pembuatan grafis dan kode

  • Pembuatan gambar dan pekerjaan sprite

    • DALL·E 3 digunakan untuk membuat layar beranda bernuansa Halloween, logo “Angry Pumpkins”, dan layar judul dengan tombol Play
    • Midjourney dipakai untuk membuat latar kuburan, medan 2D, karakter labu, monster hijau, peti kayu, tulang, batu, dan objek game seperti papan kayu
    • Objek dibuat dalam bentuk “sprite stylesheets”, lalu di-crop dan latar belakangnya dihapus dengan Photoshop/Photopea
    • Detail-detail kecil dilengkapi dengan inpainting dari Midjourney

  • Logika game yang dibuat dengan GPT-4

    • Seluruh source code dibuka di sketch.js
    • Kode game sekitar 600 baris, dan Javi Lopez menyatakan tidak ada kode yang ia tulis sendiri
    • Prompt awalnya adalah membuat game sederhana dengan matter.js dan p5.js, di mana bola ditembakkan dengan mengatur sudut dan kekuatan lewat mouse untuk mengenai kotak-kotak yang ditumpuk dengan fisika 2D
    • Setelah itu, ia berulang kali meminta mekanisme peluncuran mouse ala Angry Birds, perbaikan error Uncaught ReferenceError: Constraint is not defined, efek partikel obor, penanganan monster berbentuk lingkaran, dan penilaian dampak tidak langsung

Iterasi berulang lebih penting daripada satu prompt tunggal

  • Intinya bukan meminta game selesai dalam sekali jalan, melainkan memulai dari perilaku sederhana lalu terus memperluas dan memperbaikinya
  • Setiap kali muncul masalah, ia menjelaskan error dengan jelas lalu meminta GPT-4 memperbaikinya
  • Saat ini GPT-4 memang belum sampai pada tahap menghasilkan seluruh game hanya dari satu prompt, tetapi ada harapan bahwa ke depannya game video kelas AAA bisa dibuat hanya lewat permintaan

Bacaan terkait

1 komentar

 
GN⁺ 2023-11-01
Komentar Hacker News

  • Saya pernah bekerja sebagai PM di Angry Birds, dan ini benar-benar demo yang luar biasa
    Gim aslinya menggunakan Box2D dan scripting Lua, dan tentu saja musuh serta level juga harus dibuat sendiri
    Dengan kondisi teknologi saat ini, saya tidak berharap ini akan menghasilkan gim hit; kemungkinan besar akan lebih terikat oleh batasan teknologi daripada kemampuan sendiri
    Meski begitu, untuk validasi ide cepat, prototipe, dan game jam, ini adalah alat yang mengubah permainan, dan juga terlihat bagus sebagai alternatif Scratch agar anak-anak bisa bermain-main dengan ide mereka

  • Belakangan saya melakukan eksperimen serupa karena harus membuat REST API dasar dan frontend CRUD dengan dua framework yang belum begitu saya kenal, dan saya meminta GPT-4 membuat semua kode
    Kemungkinan besar lebih lambat daripada menulis sendiri sambil membaca dokumentasi, dan sepertinya orang yang familier dengan framework tersebut akan jauh lebih cepat
    Bagian yang rumit membutuhkan prompt yang sangat spesifik dan panjang; seluruh aplikasi memakan waktu sekitar 5 jam, dan cukup banyak waktu dihabiskan menunggu output ChatGPT yang lambat
    Kalau framework-nya sudah saya kenal, rasanya bisa selesai dalam kurang dari 2 jam
    Ini jelas berguna untuk memastikan apakah saya melakukannya dengan cara yang benar, rasanya seperti ada pakar yang siap ditanyai
    Ini juga bagus untuk menghasilkan kode boilerplate yang formatnya rapi, tetapi saya rasa saya tidak akan memakainya lebih banyak daripada sekarang untuk pengembangan sehari-hari
    Dalam kebanyakan kasus, lebih cepat memahami framework dengan baik lalu menulisnya sendiri

    • Untuk memastikan apakah caranya benar, ini ternyata sangat bagus
      Saya jadi sering bertanya hal seperti “apa struktur direktori yang baik untuk proyek platform {foo}?” atau “bagaimana cara idiomatis melakukan {x} di {language y}?”
      Karena punya keunggulan sudah melihat banyak proyek dalam berbagai bahasa, untuk pertanyaan tertentu hal itu sendiri menghasilkan jawaban yang cukup bagus
    • Pengalaman saya juga mirip
      Tetap harus memahami pemrograman, hanya saja seperti mengetik kode dalam bahasa Inggris alami
    • Yang sering terlewat adalah bahwa kebanyakan orang hanya punya beberapa jam dalam sehari untuk coding intens pada produktivitas puncak
      Kalaupun Anda mengawasi GPT-4 selama 3 jam agar menulis kode, pada hari itu Anda mungkin masih punya 3 jam produktivitas coding puncak yang belum “terpakai”
    • Saya penasaran apakah Anda memakai GPT-4 lewat ChatGPT Plus atau lewat API
      Kalau lewat API, saya juga penasaran biasanya Anda mengaksesnya dengan alat apa
    • Sebaiknya jangan menebak waktu yang dibutuhkan untuk menulis sendiri; ukur saja secara nyata
      Hasilnya bisa mengejutkan

  • Ini lebih menarik daripada banjir tulisan seperti “Membuat aplikasi iOS dengan ChatGPT dalam 30 menit!”
    Tulisan seperti itu bisa saja hanya membuat Hello World sederhana, jadi tidak terlalu bermakna, tetapi yang ini setidaknya menunjukkan hasil jadi dan memang cukup mengesankan
    Namun detail yang perlu diketahui adalah waktu yang dibutuhkan, jumlah prompt, berapa kali perlu koreksi arah, dan seberapa mahir pembuatnya dalam teknologi terkait
    Secara pribadi, saya merasa ChatGPT sangat membantu dalam banyak situasi, tetapi pembuatan kode bukan salah satunya

    • https://twitter.com/javilopen/status/1719363669685916095 relevan
      Isinya kira-kira “gamenya hanya 600 baris dan saya tidak menulis satu baris pun, tetapi [coding game] adalah bagian tersulit”
      Ini bukan Hello World, tetapi sulit juga untuk menyebutnya jauh lebih rumit daripada daftar belanja
      Meski begitu, hal paling mengesankan adalah Angry Birds bisa dibuat dengan 600 baris dan beberapa library
    • Saya pernah mencoba membuat satu situs penuh berbasis Flask, Python, HTML+JS+CSS, dan SQLite dengan pembuatan kode ChatGPT, dan hasilnya mengejutkan
      Ada sekitar 5 ribu baris kode yang berjalan di produksi, dan semuanya berfungsi. Trafiknya tidak besar, tetapi tetap lingkungan produksi
      Mengetahui batasannya, menulis prompt dengan lebih baik, mengenali kemungkinan halusinasi, dan menanyakan risikonya adalah faktor yang sangat besar
      Ini paling bagus terutama untuk teknologi yang tidak terlalu saya kuasai. Saya developer Android, dan saya memakainya untuk membuat situs web yang sudah sekitar 15 tahun tidak saya kerjakan langsung
      Bagian paling keren adalah bantuan administrasi sistem dan operasi server, dan kemampuannya men-debug error gunicorn bagus
      Saat proyek membesar dan konteks hilang, kode keluaran harus diperbaiki, tetapi hambatan terbesar pada proyek yang lebih besar adalah batas panjang konteks, dan sepertinya ini akan segera berkurang
      Situs yang baru-baru ini saya buat adalah https://cosmictrip.space/, sekitar 95% kodenya ditulis oleh ChatGPT; saya membuat prompt dengan GPT-4 lalu membuat gambar luar angkasa dengan DALL-E
      Itu situs sederhana, tetapi sekarang saya juga sedang membuat game petualangan AI terbuka berbasis GPT+DALL-E untuk gambar+teks
      Jika API DALL-E 3 keluar, saya berharap bisa merilisnya sebelum 6 November, dan untuk game petualangan ini juga lebih dari 95% kodenya ditulis oleh ChatGPT
      Pembuatan kodenya berjalan sangat baik sampai saya memakai API GPT-4 untuk agen yang saya buat sendiri
      Saya membuat subtugas terstruktur dengan function calling, membiarkan agen menulis kodenya, lalu menambahkan kemampuan untuk menyertakan file sebagai konteks atau bercakap-cakap dengan kode
      Belum pada level untuk dipublikasikan, tetapi kemampuan GPT-4 dalam menghasilkan kode benar-benar hebat, hanya saja perlu pengalaman membuat prompt
      Prompt pertama yang ditulis kecil kemungkinan bagus, jadi saya berharap agen yang saya buat bisa mengatasi bagian itu dengan baik
      Idenya adalah menugaskan AI coder ke pekerjaan di board bergaya Jira/Kanban, manusia menyetujui dan memperbaiki, lalu tiket otomatis berpindah kolom ketika AI memeriksa pekerjaannya
    • Ada banyak clone Angry Birds open source, jadi ini tidak semengesankan kelihatannya
      Memprogram game baru yang tidak punya puluhan template yang sudah ada akan menjadi uji lakmus yang lebih baik
    • Pertanyaan menarik lainnya adalah “bagaimana perilakunya pada semua kasus lain yang tidak muncul di video”
    • Jujur saja, ini agak sulit dipercaya
      GPT-4 memang bagus untuk pekerjaan seperti ini, tetapi berdasarkan pengalaman saya, perbaikan iteratif tidak berjalan dengan baik
      Semakin panjang percakapan, semakin ia kehilangan konteks sebelumnya dan kode yang dihasilkan menyimpang dari perilaku sebelumnya
      Misalnya, “tolong perbaiki bug ini” bisa dengan mudah berujung pada solusi yang merusak fitur lain
      Kode di thread (1) tampaknya ada di hasil akhir (2), dan karena letaknya di bagian paling atas kode, ini bisa berarti ChatGPT diminta membuat ulang dalam satuan lebih dari 600 baris secara berulang
      Ini cukup mencurigakan
      Membuat Slingshot baru di baris 20 setelah didefinisikan di baris 500 sangat kecil kemungkinannya kecuali secara spesifik diperintahkan begitu
      loadImage('stone2.png'); juga apakah kebetulan memilih nama file dan ukuran sprite yang benar? Apakah semua itu diberikan di prompt lalu kodenya ditulis? Prompt yang benar-benar dipakai perlu diperlihatkan
      Skenario yang jauh lebih masuk akal adalah objek-objek class dibuat relatif independen, lalu manusia merakitnya menjadi file besar, menyalin semuanya sebagai input, kemudian membuat prompt kode seperti “tuliskan fungsi seperti ini”
      Bukan mustahil hanya prompt yang dipakai seperti klaimnya, tetapi rasanya bagian “semua coding diserahkan ke AI” sangat dilebih-lebihkan demi like dan reputasi
      Tampaknya lebih mungkin sebagian kode ditulis atau dirakit secara manual, lalu dimasukkan sebagai input dan diprompt seperti “tolong kerjakan ini juga”
      Jadi output-nya bisa saja “100% dihasilkan”, tetapi mungkin bukan dengan cara yang diasumsikan orang-orang
      Pendekatan seperti ini membuat GPT-4 menulis ulang kode yang sudah ada, tetapi jika tidak secara eksplisit meminta atau menambahkan komentar yang menjelaskan maksud di seluruh kode, fungsionalitas sebelumnya akan perlahan bergeser
      Tanpa kumpulan tes, penyimpangan halus seperti ini tidak akan terdeteksi dan fitur akan rusak
      Tidak ada juga penyebutan bahwa penulis melakukan hal seperti itu
      Selain itu, orang ini punya kepentingan (4) karena menjual materi edukasi AI, jadi ia diuntungkan jika terlihat seperti pakar di bidang ini, dan ketika ditanya di X pun ia tidak memberikan detail tambahan, riwayat Git bertahap, atau prompt yang benar-benar dipakai
      Melihat kurangnya detail dan hasil yang sulit dipercaya, masuk akal untuk bersikap skeptis dalam kasus ini
      Model seperti CodeLlama 34B atau GPT-3.5 mungkin bisa membuat hasil semacam ini, tetapi bukan dengan cara yang dijelaskan
      Saya juga tidak yakin apakah GPT-4 bisa melakukannya. Prompt-nya tampak terlalu asal sampai tidak terlihat seperti prompt sungguhan (5)
      Namun saya akan senang jika ini dibantah dengan detail yang lebih banyak, dan GPT-4 memang alat yang bagus
      [1] - https://nitter.net/pic/orig/media%2FF9xoI8mXgAAn7v9.jpg
      [2] - https://bestaiprompts.art/angry-pumpkins/sketch.js

[3] - https://nitter.net/javilopen/status/1719363669685916095#m
[4] - https://javilopen.substack.com/
[5] - “Sekarang, buat monster-monsternya berbentuk lingkaran, dan hati-hati sekali: terapkan teknik yang sama yang sudah ada untuk yang berbentuk persegi panjang terkait penskalaan dan area tabrakan, dan jangan mengacaukannya seperti sebelumnya.”

  • Saat melihat anak saya terus mengetuk loading spinner seolah kesal, saya dan GPT membuat game ini pada Minggu sore yang santai
    https://spinner.franzai.com/
    Menurut saya game loading spinner interaktif bisa menjadi pola UX yang menarik
    Ia bisa memberi umpan balik bahwa tindakan pengguna tetap berpengaruh meski sedang menunggu sesuatu

    • Ini pendekatan yang menarik untuk layar loading, dan secara pribadi saya mengira akan ada jauh lebih banyak game yang memakai fitur seperti ini
      Tentu saja maksud saya di ranah game indie, bukan game AAA
      Saya jelas ingat pernah membaca berita bahwa paten ini sudah kedaluwarsa, tetapi setelah dicari, ternyata “dulu” itu sudah 8 tahun lalu
      https://www.eff.org/deeplinks/2015/12/loading-screen-game-pa...
    • Fakta menariknya, mini-game saat loading dulu punya paten yang menghambat pengembangan seperti itu
      Setahu saya dimiliki oleh Namco, dan bisa dilihat di Ridge Racer
    • Tes ketukan jari:
      https://psycnet.apa.org/record/2014-37068-023
    • Saya masih ingat memutar-mutar analog stick di layar loading Budokai 3 (PS2) sambil melihat Saibamen tumbuh

  • Bahwa AI mengubah cara pengembangan kini sudah tidak perlu diragukan lagi
    Minggu lalu saja saya bisa membuat 2 layanan berskala menengah, dengan ribuan baris kode Python, padahal Python adalah bahasa yang sudah tidak saya pakai selama lebih dari 10 tahun
    Yang benar-benar mengesankan adalah, secara umum kodenya lebih baik daripada kode yang akan saya tulis sendiri
    Jika butuh README.md yang bagus, berikan saja source code yang berisi route, argumen CLI, dan sebagainya, lalu ia akan membuatkannya
    Tes juga bisa dibuatkan jika diminta. Belum pernah ada masa yang semudah ini bagi developer
    Dalam pembuatan kode, GPT-4 jauh mengungguli GPT-3.5
    GPT-3.5 bisa menyalin dengan cukup baik jika diberi contoh yang sangat rinci, tetapi GPT-4 terasa sampai batas tertentu seperti “berpikir”
    Dari pengalaman saya, konteks GPT-4 32k cukup sering gagal
    Misalnya, jika menghasilkan lebih dari 10 ribu token, kira-kira lebih dari 30 ribu karakter, mungkin perlu mencoba ulang beberapa kali
    Selain itu, ChatGPT bukan antarmuka ideal untuk pekerjaan yang tidak sepele
    Lebih baik memakai API secara langsung, atau sesuatu seperti Azure OpenAI Chat Playground yang bisa memakai konteks 32k
    Sekalian promosi, saya membuat aplikasi open source yang mengotomatiskan pekerjaan repetitif dalam pembuatan prompt: https://github.com/codespin-ai/codespin-cli

  • Selama 10 tahun terakhir ada investasi besar-besaran pada tool no-code, dan menarik bahwa sekarang ChatGPT menulis kode dengan begitu baik sehingga bagi orang yang punya naluri teknis tetapi tidak ngoding, kemungkinan ia menjadi lebih cepat, lebih fleksibel, dan mendekati tingkat kemudahan penggunaan yang serupa
    Baru-baru ini saya harus membuat aplikasi demo di Mendix yang mengonsumsi dan menerbitkan layanan REST, dan butuh beberapa hari untuk memahami detailnya
    Kalau pekerjaan yang sama dilakukan dengan ChatGPT dalam bahasa apa pun, misalnya bash, rasanya bisa selesai dalam hitungan menit
    Deployment dan version control bisa diselesaikan lewat PaaS/IaaS tanpa kemampuan teknis besar, apalagi jika dibandingkan dengan biaya platform no-code untuk perusahaan
    Ini mungkin bias pribadi, tetapi untuk pekerjaan serius saya selalu tidak suka platform no-code karena terasa lebih merepotkan, dan dengan alasan serupa saya juga tidak suka ActiveRecord ORM
    Meski begitu, no-code tampaknya akan segera menjadi ketinggalan zaman
    Siapa yang mau drag-and-drop kalau cukup bertanya lalu copy-paste?

    • Secara konseptual, ini terasa seperti solusi yang hampir sempurna
      No-code itu mudah tetapi kaku, sementara coding fleksibel tetapi membosankan dan rawan kesalahan
      Jika kita bisa menjelaskan apa yang diinginkan dengan kata-kata lalu cepat mendapatkan kode, dan kodenya rapi, kita mendapat fleksibilitas untuk menyesuaikannya sesuai kebutuhan
      Dalam beberapa kasus, seperti contoh ini, mungkin bahkan tidak perlu penyesuaian
      Saya menantikan masa depannya
    • Benarkah hanya beberapa menit? Akan bagus kalau Anda mencobanya langsung dan memberi umpan balik nyata, bukan perkiraan
      Sepertinya tidak akan lama

  • Ini adalah pencucian plagiarisme secara statistik, dan itu cukup keren
    Secara pribadi, menurut saya mencegah gold rush pencucian ini adalah prioritas hukum yang lebih mendesak daripada berpura-pura menghentikan HAL sambil menciptakan parit pasar bagi para penjual beliung besar saat ini

  • Pasti ada freelancer atau pekerja jarak jauh yang meningkatkan produktivitasnya 100x dengan benar-benar memanfaatkan GPT-4 dan tool AI
    Sulit membayangkan trik-trik keren seperti ini hanya ada di ruang hampa
    Kalau memikirkan apa yang akan mungkin dalam 2 tahun, jin sudah keluar dari botol

    • Kalau 100x, mungkin sejak awal memang tidak seproduktif itu
      Kalau tahu tips meningkatkan produktivitas “100x” dengan ChatGPT, saya ingin Anda membagikannya

  • Jujur saja, setiap melihat tulisan seperti ini saya makin khawatir dengan kelayakan kerja saya
    Saya tidak punya rencana cadangan dan sudah menghabiskan terlalu banyak waktu untuk belajar software engineering, sementara situasinya tidak terlihat bagus

    • Saya sungguh tidak khawatir soal itu
      Seperti yang juga dikatakan orang lain, programmer akan bermasalah jika orang awam bisa menulis spesifikasi produk yang cukup rinci agar LLM dapat membuat software yang berjalan sesuai kebutuhan
      Tapi itu terdengar cukup mirip dengan pemrograman
      Menurut saya pekerjaan kita akan berubah. Waktu mengetik kode di keyboard akan berkurang, dan waktu memikirkan apa yang harus dibuat akan bertambah
      Justru kemungkinan besar nilai kita akan meningkat, karena kita akan mampu menyelesaikan jauh lebih banyak pekerjaan

  • Saya mencoba mendapatkan sprite sheet animasi tampak atas untuk paladin, untuk kemungkinan game RPG, dan proses kegagalannya ada di sini: https://imgur.com/a/2uJyUT3
    Urutan sebenarnya: pertama saya mencoba variasi tampak atas, lalu di akhir saya memasukkan sudut pandang samping karena penasaran

    • Dulu saya membuat token TTRPG dengan Midjourney, dan cara yang paling berhasil adalah menulis aerial view
      top down kadang berhasil kadang tidak, jadi sangat tidak stabil
      Saya penasaran apakah DALL-E 3 juga membutuhkan arahan yang sama