<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/">
    <channel>
        <title>Cinevva Panduan</title>
        <link>https://app.cinevva.com</link>
        <description>Panduan lengkap untuk kreator dan pemain.</description>
        <lastBuildDate>Sat, 15 Aug 2026 21:32:02 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <copyright>Copyright 2024-present Cinevva</copyright>
        <item>
            <title><![CDATA[Strategi Steam Next Fest pada 2026]]></title>
            <link>https://app.cinevva.com/id/guides/steam-next-fest-strategy-gamedeveloper</link>
            <guid>https://app.cinevva.com/id/guides/steam-next-fest-strategy-gamedeveloper</guid>
            <pubDate>Sat, 15 Aug 2026 21:16:53 GMT</pubDate>
            <description><![CDATA[Varian sindikasi dari panduan strategi Steam Next Fest kami. Lihat versi kanonis untuk artikel lengkap dan terkini.]]></description>
            <content:encoded><![CDATA[<h1 id="strategi-steam-next-fest-pada-2026" tabindex="-1">Strategi Steam Next Fest pada 2026 <a class="header-anchor" href="#strategi-steam-next-fest-pada-2026" aria-label="Permalink to &quot;Strategi Steam Next Fest pada 2026&quot;"></a></h1>
<p><em>Apa yang dikatakan data tentang wishlist, demo, dan waktu pelaksanaan. Angka nyata dari 200+ game.</em></p>
<hr>
<p>Jika Anda merencanakan berdasarkan kalender, Steam mengadakan Next Fest tiga kali pada 2026: 23 Februari hingga 2 Maret (sudah selesai), 15 hingga 22 Juni, dan 19 hingga 26 Oktober. Edisi Juni dan Oktober berlangsung dari pukul 10.00 PDT pada hari pembukaan hingga pukul 10.00 PDT pada hari penutupan, tepat sebelum diskon Musim Panas dan Musim Dingin (edisi Februari juga menggunakan waktu Pasifik, sebelum waktu musim panas berlaku). Sebuah game hanya boleh mengikuti satu Next Fest untuk selamanya, jadi pilih edisi yang sesuai dengan jadwal perilisan Anda. Demo Anda harus sudah dapat dimainkan secara publik saat festival dibuka, dan Anda baru boleh merilis game setelah festival berakhir.</p>
<p>Begini kenyataannya tentang Next Fest: semua orang memperlakukannya seperti lotre. Masukkan demo, silangkan jari, lalu berharap algoritma berpihak kepada Anda. Bukan begitu cara kerjanya.</p>
<p>Saya membaca laporan pascarilis secara obsesif. Ratusan laporan dari 2025 saja. Polanya begitu konsisten hingga hampir membosankan: game yang &quot;menang&quot; di Next Fest tidak baru menemukan kesuksesan selama festival. Mereka memperbesar momentum yang sudah dibangun sebelumnya.</p>
<p>Biar saya tunjukkan maksudnya.</p>
<h2 id="rumus-yang-tidak-ingin-didengar-siapa-pun" tabindex="-1">Rumus yang Tidak Ingin Didengar Siapa Pun <a class="header-anchor" href="#rumus-yang-tidak-ingin-didengar-siapa-pun" aria-label="Permalink to &quot;Rumus yang Tidak Ingin Didengar Siapa Pun&quot;"></a></h2>
<p><strong>Wishlist Sebelum Festival × 2 = Wishlist yang Diperoleh</strong></p>
<p>Rasio ini muncul dalam laporan pascarilis demi laporan pascarilis.</p>
<p>Eilean Mor memasuki Oktober 2025 dengan 2.117 wishlist. Mendapatkan 2.082 selama festival. Hampir tepat 2×.</p>
<p>Dice of Kalma masuk dengan 335 wishlist. Mendapatkan 659. Sedikit di bawah 2×. Pengembangnya menulis: &quot;Wishlist kami hampir meningkat tiga kali lipat, dan itu luar biasa, tetapi kami masih punya banyak pekerjaan yang harus dilakukan.&quot;</p>
<p>Itulah kenyataan yang tidak nyaman. Next Fest menggandakan apa yang sudah Anda miliki. Jika Anda tidak punya apa-apa, yang digandakan juga tidak ada.</p>
<h2 id="jurang-2-000-wishlist" tabindex="-1">Jurang 2.000 Wishlist <a class="header-anchor" href="#jurang-2-000-wishlist" aria-label="Permalink to &quot;Jurang 2.000 Wishlist&quot;"></a></h2>
<p>Data dari 208 game pada Februari 2025 menunjukkan titik perubahan tajam di angka 2.000 wishlist.</p>
<table tabindex="0">
<thead>
<tr>
<th>Wishlist Awal</th>
<th>Yang Terjadi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Di bawah 1.000</td>
<td>Anda tidak terlihat setelah hari ke-2. Tidak ada game yang naik tingkat.</td>
</tr>
<tr>
<td>1.000–2.000</td>
<td>Kenaikan sedang. Anda tetap berada di kelas yang sama.</td>
</tr>
<tr>
<td>2.000+</td>
<td>Algoritma mulai membantu Anda. Momentum nyata mungkin tercipta.</td>
</tr>
<tr>
<td>10.000+</td>
<td>Tingkat emas. Kemungkinan besar memperoleh kenaikan tinggi.</td>
</tr>
<tr>
<td>100.000+</td>
<td>Tingkat berlian. Anda bersaing memperebutkan posisi teratas di tangga peringkat.</td>
</tr>
</tbody>
</table>
<p>Inilah yang dikatakan seorang pengembang dalam survei tersebut: &quot;Anda benar-benar mulai melihat bagaimana perolehan wishlist sebuah game melesat pada game yang sudah memiliki 2.000+ wishlist sebelum Steam Next Fest.&quot;</p>
<p>Sebenarnya ini bukan semata-mata soal algoritma. Ini soal validasi. Memiliki 2.000 wishlist berarti Anda sudah memahami sesuatu tentang pemasaran. Anda tahu cara menjangkau orang. Keahlian itu memberikan hasil berlipat selama festival.</p>
<h2 id="_48-jam-pertama-menentukan-segalanya" tabindex="-1">48 Jam Pertama Menentukan Segalanya <a class="header-anchor" href="#_48-jam-pertama-menentukan-segalanya" aria-label="Permalink to &quot;48 Jam Pertama Menentukan Segalanya&quot;"></a></h2>
<p>Valve memberi semua orang kesempatan pada hari ke-1 dan ke-2. Setelah itu, algoritma memutuskan siapa yang layak mendapatkan visibilitas lebih besar berdasarkan performa.</p>
<p>Game tingkat perunggu? Impresi mereka jatuh drastis pada hari ke-3. Game tingkat berlian? Impresi mereka meningkat tiga kali lipat.</p>
<p><strong>Hari ke-1–2:</strong> Kerahkan semuanya. Lakukan streaming. Buat postingan. Berkoordinasilah dengan kreator.
<strong>Hari ke-3 dan seterusnya:</strong> Algoritma sudah mengambil keputusan. Anda tinggal mengikuti arus.</p>
<h2 id="game-yang-benar-benar-menang-pada-2025" tabindex="-1">Game yang Benar-Benar Menang pada 2025 <a class="header-anchor" href="#game-yang-benar-benar-menang-pada-2025" aria-label="Permalink to &quot;Game yang Benar-Benar Menang pada 2025&quot;"></a></h2>
<h3 id="do-no-harm-februari-2025" tabindex="-1">Do No Harm (Februari 2025) <a class="header-anchor" href="#do-no-harm-februari-2025" aria-label="Permalink to &quot;Do No Harm (Februari 2025)&quot;"></a></h3>
<p><strong>Angkanya:</strong> Mendapatkan 45.655 wishlist selama Next Fest. Memulai dengan 52.102.</p>
<p><strong>Yang mereka lakukan:</strong></p>
<ul>
<li>Trailer dirilis di GameTrailers pada 29 Januari (beberapa minggu sebelum Next Fest)</li>
<li>Penjangkauan media dijadwalkan bersamaan dengan trailer</li>
<li>Demo dirilis pada 4 Februari</li>
<li>Iklan berbayar untuk memperbesar momentum organik</li>
</ul>
<p>Inilah pedoman strateginya. Mereka tidak mengandalkan Next Fest agar ditemukan orang. Mereka menggunakan Next Fest untuk melipatgandakan perhatian yang sudah mereka peroleh.</p>
<h3 id="cairn-oktober-2025" tabindex="-1">Cairn (Oktober 2025) <a class="header-anchor" href="#cairn-oktober-2025" aria-label="Permalink to &quot;Cairn (Oktober 2025)&quot;"></a></h3>
<p>Mencapai peringkat ke-5 di Popular Upcoming pada hari ke-1. Masuk Top Demos dan Trending Upcoming pada hari ke-2.</p>
<p><strong>Yang mereka lakukan:</strong></p>
<ul>
<li>Demo dirilis pada Desember 2024 (10 bulan sebelum Next Fest yang mereka ikuti)</li>
<li>Memiliki 32.000 pengikut sebelum festival</li>
<li>Diterima di 18 festival sebelum Next Fest</li>
<li>The Game Bakers (Furi, Haven) — studio mapan dengan rekam jejak terbukti</li>
</ul>
<p>Mereka tidak membutuhkan Next Fest. Namun, mereka tetap memanfaatkannya karena festival ini memberikan amplifikasi gratis setelah Anda menyelesaikan pekerjaan dasarnya.</p>
<h3 id="yapyap-oktober-2025" tabindex="-1">YAPYAP (Oktober 2025) <a class="header-anchor" href="#yapyap-oktober-2025" aria-label="Permalink to &quot;YAPYAP (Oktober 2025)&quot;"></a></h3>
<p>Fenomena &quot;friend slop&quot;. Game horor co-op yang mengajak Anda bermain sebagai penyihir yang merusak sebuah menara. Menjadi viral di media sosial, lalu mendominasi Next Fest.</p>
<p>Trailer mereka dirilis pada 25 Agustus 2025 — satu bulan sebelum Next Fest. Trailer itu meraih 434 ribu penayangan. Itulah titik baliknya. Segala sesuatu setelahnya hanya mengikuti gelombang.</p>
<h2 id="hal-yang-dikonfirmasi-februari-2026" tabindex="-1">Hal yang Dikonfirmasi Februari 2026 <a class="header-anchor" href="#hal-yang-dikonfirmasi-februari-2026" aria-label="Permalink to &quot;Hal yang Dikonfirmasi Februari 2026&quot;"></a></h2>
<p>Edisi Februari 2026 tidak mengubah pedoman strategi ini, melainkan semakin menegaskannya. Festival tersebut menembus 3.500 demo. Setelahnya, How To Market A Game menyurvei 182 pengembang, dan hubungan terkuat dalam data adalah antara jumlah wishlist sebuah game sebelum festival dan wishlist yang diperolehnya selama acara. Berdasarkan analisis independen terhadap data survei, korelasi Spearman-nya mencapai 0,825. Kesenjangannya sangat brutal: median demo mendapatkan 806 wishlist, Anda membutuhkan 13.461 untuk menembus persentil ke-95, dan peraih tertinggi mendapatkan 57.074. Co-op terus mendominasi, dan gagasan untuk &quot;merilis demo secara mendadak tepat sebelum festival&quot; kembali terbantahkan. Dari game yang mendapatkan 15.000+ wishlist, hanya satu yang merilis demo secara mendadak beberapa hari sebelum festival. Sisanya telah menyediakan demo selama sebulan atau lebih. Bangun audiens terlebih dahulu; setiap edisi terus menyampaikan hal yang sama.</p>
<h2 id="genre-yang-terus-menang" tabindex="-1">Genre yang Terus Menang <a class="header-anchor" href="#genre-yang-terus-menang" aria-label="Permalink to &quot;Genre yang Terus Menang&quot;"></a></h2>
<p>Dari tingkat berlian pada Februari 2025:</p>
<ul>
<li><strong>Horor</strong> (×2) — Steam menyukai horor. Selalu begitu.</li>
<li><strong>Strategi/Manajemen</strong> (×4) — nuansanya adalah &quot;merakit-membangun-menyimulasikan&quot;</li>
<li><strong>Co-op &quot;friend slop&quot;</strong> — Lethal Company membuka pintu selebar-lebarnya</li>
<li><strong>Point-and-click</strong> (×2) — tetapi keduanya merupakan sekuel dengan audiens yang sudah ada</li>
</ul>
<p>Kasus point-and-click ini menarik. Beholder: Conductor adalah game ke-4 dalam serinya. Duck Detective adalah sebuah sekuel. Keduanya memiliki audiens bawaan. Pengembang point-and-click pemula tidak memperoleh hasil seperti itu.</p>
<h2 id="apa-kata-game-game-kecil" tabindex="-1">Apa Kata Game-Game Kecil <a class="header-anchor" href="#apa-kata-game-game-kecil" aria-label="Permalink to &quot;Apa Kata Game-Game Kecil&quot;"></a></h2>
<p>Tidak semua orang mengejar tingkat berlian. Berikut laporan para pengembang di segmen yang lebih kecil dari Oktober 2025:</p>
<blockquote>
<p>&quot;Rasio konversi dari kunjungan menjadi wishlist mencapai 62%. Halaman toko itu sendiri tampaknya berfungsi dengan baik. Namun, impresinya tinggi dan orang-orang tidak mengeklik. Gambar kapsul perlu diperbarui.&quot;</p>
</blockquote>
<blockquote>
<p>&quot;Sebanyak 57% pengunjung toko memainkan demo kami. Kedengarannya tinggi? Namun, hanya 15% pemain yang juga memasukkannya ke wishlist. Ada sesuatu yang tidak memenuhi ekspektasi.&quot;</p>
</blockquote>
<blockquote>
<p>&quot;Diblokir permanen dari r/cozygames karena bertanya apakah menurut mereka game kami terasa cozy. Kami selalu berusaha mengikuti aturan, tetapi ini cukup mengejutkan.&quot;</p>
</blockquote>
<p>Perjuangannya nyata. Para pengembang ini menguji gambar kapsul, menyesuaikan tag, dan diblokir dari subreddit. Ini bukan pekerjaan glamor.</p>
<p>Satu pola yang semakin kuat: game co-op &quot;friend slop&quot; mencatat jumlah pemain demo yang sangat besar, tetapi lebih sedikit pemain tersebut yang memasukkan game ke wishlist. Penyebabnya, audiens yang datang cenderung kasual dan hanya ingin bersenang-senang bersama teman, bukan mengikuti jadwal perilisan. Jumlah pemain yang tinggi tidak otomatis berarti jumlah wishlist yang tinggi.</p>
<h2 id="pedoman-strategi-yang-jujur" tabindex="-1">Pedoman Strategi yang Jujur <a class="header-anchor" href="#pedoman-strategi-yang-jujur" aria-label="Permalink to &quot;Pedoman Strategi yang Jujur&quot;"></a></h2>
<p><strong>Beberapa bulan sebelum Next Fest:</strong></p>
<ol>
<li>Rilis demo Anda lebih awal. Maksudnya, jauh lebih awal. Para pemenang telah menyediakan demo selama 6–12 bulan.</li>
<li>Ikuti festival genre yang lebih kecil terlebih dahulu. Gunakan sebagai ajang untuk menyempurnakan game.</li>
<li>Capai 2.000+ wishlist. Itulah ambang batas Anda yang sebenarnya.</li>
</ol>
<p><strong>Selama Next Fest:</strong></p>
<ol>
<li>Hari ke-1–2 adalah penentu keberhasilan atau kegagalan. Kerahkan semuanya.</li>
<li>Lakukan streaming jika bisa. Halaman Anda akan ditandai sebagai &quot;live&quot;.</li>
<li>Berkoordinasilah dengan streamer. Bayar mereka jika perlu.</li>
<li>Tempatkan demo Anda di halaman Steam terpisah agar dapat mengumpulkan ulasan.</li>
</ol>
<p><strong>Setelah Next Fest:</strong></p>
<ol>
<li>Jangan langsung merilis game. Merilisnya beberapa minggu kemudian justru menghasilkan performa yang lebih baik.</li>
<li>Manfaatkan momentum tersebut untuk pemasaran perilisan utama Anda.</li>
</ol>
<h2 id="kapan-sebaiknya-tidak-mengikutinya" tabindex="-1">Kapan Sebaiknya Tidak Mengikutinya <a class="header-anchor" href="#kapan-sebaiknya-tidak-mengikutinya" aria-label="Permalink to &quot;Kapan Sebaiknya Tidak Mengikutinya&quot;"></a></h2>
<p>Terus terang saja: Next Fest bukan untuk semua orang.</p>
<p>Jangan ikuti jika:</p>
<ul>
<li>Anda memiliki kurang dari 1.000 wishlist (Anda tidak akan terlihat lagi pada hari ke-3)</li>
<li>Demo Anda belum matang (Anda hanya punya satu kesempatan untuk menciptakan kesan pertama)</li>
<li>Ini festival pertama Anda (ikuti festival yang lebih kecil terlebih dahulu)</li>
<li>Anda akan langsung merilis game setelahnya (tunggu beberapa minggu)</li>
</ul>
<p>Ada puluhan festival kecil setiap bulan. Audiensnya lebih terfokus. Persaingannya lebih rendah. Lihat howtomarketagame.com/festivals untuk daftarnya.</p>
<p>Next Fest menjadi pilihan standar karena Valve meminta semua orang untuk bergabung. Namun, pemasaran terbaik bukanlah aktivitas yang diminta untuk dilakukan oleh semua orang.</p>
<hr>
<h2 id="tentang-penulis" tabindex="-1">Tentang Penulis <a class="header-anchor" href="#tentang-penulis" aria-label="Permalink to &quot;Tentang Penulis&quot;"></a></h2>
<p>Oleg Sidorkin membuat berbagai alat untuk pengembang game indie. Ia mempelajari data pemasaran game dan laporan pascarilis pengembang untuk memahami apa yang benar-benar berhasil dibandingkan dengan apa yang sekadar dibesar-besarkan.</p>
]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Hubungkan Claude atau Cursor ke Cinevva (Server MCP)]]></title>
            <link>https://app.cinevva.com/id/guides/mcp-server</link>
            <guid>https://app.cinevva.com/id/guides/mcp-server</guid>
            <pubDate>Sat, 01 Aug 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Siapkan server MCP Cinevva Game Creator di Claude, Claude Code, atau Cursor dan edit game aktif Anda dari asisten AI favorit Anda.]]></description>
            <content:encoded><![CDATA[<h1 id="hubungkan-claude-atau-cursor-ke-cinevva-server-mcp" tabindex="-1">Hubungkan Claude atau Cursor ke Cinevva (Server MCP) <a class="header-anchor" href="#hubungkan-claude-atau-cursor-ke-cinevva-server-mcp" aria-label="Permalink to &quot;Hubungkan Claude atau Cursor ke Cinevva (Server MCP)&quot;"></a></h1>
<p>Cinevva menyediakan server MCP terkelola yang memungkinkan Claude, Claude Code, Cursor, atau klien MCP apa pun membuat game Anda. AI yang sudah Anda gunakan menjadi otaknya: AI tersebut membaca dan mengedit file game Anda langsung di server kami, tanpa memerlukan tab browser. Buka juga game Anda di kreator Cinevva dan sesi akan aktif: AI kemudian dapat mengimpor aset dari pustaka CC0 kami, membuat rig dan menganimasikan model 3D, mengambil tangkapan layar, menyimulasikan input untuk menguji game yang sedang berjalan, serta memuat ulang pratinjau sementara setiap perubahan ditampilkan langsung di layar Anda.</p>
<h2 id="yang-anda-perlukan" tabindex="-1">Yang Anda perlukan <a class="header-anchor" href="#yang-anda-perlukan" aria-label="Permalink to &quot;Yang Anda perlukan&quot;"></a></h2>
<p>Akun Cinevva (akun gratis dapat digunakan, tetapi pembuatan rig 3D memakai kredit dari saldo Anda) dan klien MCP yang mendukung server jarak jauh dengan OAuth. URL servernya adalah:</p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>https://api.cinevva.com/create/mcp</span></span></code></pre>
</div><p>Server ini menggunakan Streamable HTTP dan melakukan autentikasi dengan OAuth 2.0. Saat Anda terhubung, klien akan membuka halaman masuk Cinevva di browser. Berikan persetujuan sekali, lalu klien akan tetap terhubung.</p>
<h2 id="edit-dari-mana-saja-aktifkan-sesi-langsung-untuk-melihat-dan-menguji" tabindex="-1">Edit dari mana saja. Aktifkan sesi langsung untuk melihat dan menguji. <a class="header-anchor" href="#edit-dari-mana-saja-aktifkan-sesi-langsung-untuk-melihat-dan-menguji" aria-label="Permalink to &quot;Edit dari mana saja. Aktifkan sesi langsung untuk melihat dan menguji.&quot;"></a></h2>
<p>Untuk mengedit file, Anda hanya memerlukan koneksi. Alat file membaca dan menulis salinan utama game Anda di server kami, sehingga asisten Anda dapat memperbaiki bug atau menambahkan fitur meskipun tidak ada tab Cinevva yang terbuka. Sebutkan game yang Anda inginkan (atau biarkan AI memilih dari game Anda), lalu berikan perintah.</p>
<p>Mengaktifkan sesi langsung adalah peningkatan kemampuan, bukan persyaratan. Buka game di <a href="https://cinevva.com/create" target="_blank" rel="noreferrer">cinevva.com/create</a>, tunggu hingga pratinjau dimuat, lalu klik <strong>Agen eksternal</strong> di bilah alat kreator (ikon colokan, juga tersedia di menu &quot;lainnya&quot; pada layar kecil). Panel akan beralih menjadi &quot;Agen aktif&quot; setelah terhubung. Sesi langsung memberikan mata dan tangan kepada AI di dalam game yang sedang berjalan: tangkapan layar, log konsol, input simulasi, impor aset, dan pembuatan rig 3D. Sesi ini juga menampilkan setiap edit di layar Anda begitu perubahan diterapkan, baik edit tersebut dilakukan melalui tab ini maupun tanpa antarmuka. Tautan langsung akan tetap aktif untuk kunjungan berikutnya sampai Anda mengeklik &quot;Hentikan sesi langsung&quot;.</p>
<p>Alat <code>list_live_sessions</code> menampilkan sesi yang terhubung, dan jika tepat satu game sedang terbuka, game tersebut akan dipilih secara otomatis.</p>
<h2 id="penyiapan-di-claude-claude-ai-dan-desktop" tabindex="-1">Penyiapan di Claude (claude.ai dan desktop) <a class="header-anchor" href="#penyiapan-di-claude-claude-ai-dan-desktop" aria-label="Permalink to &quot;Penyiapan di Claude (claude.ai dan desktop)&quot;"></a></h2>
<ol>
<li>Buka Pengaturan, lalu Konektor, dan pilih &quot;Tambahkan konektor khusus&quot;.</li>
<li>Beri nama Cinevva dan tempel <CopyText text="https://api.cinevva.com/create/mcp" /> sebagai URL. Pastikan tidak ada karakter tambahan; URL harus diakhiri dengan <code>/create/mcp</code>.</li>
<li>Klik Tambahkan, lalu Hubungkan. Masuk dengan akun Cinevva Anda saat halaman otorisasi terbuka (gunakan akun yang sama dengan akun yang digunakan di tab game Anda).</li>
<li>Minta Claude melakukan sesuatu seperti &quot;tampilkan file game Cinevva saya&quot; untuk mengonfirmasi koneksi. Untuk pengujian langsung, buka game Anda di cinevva.com/create pada tab lain, lalu klik Agen eksternal di bilah alat.</li>
</ol>
<h2 id="penyiapan-di-claude-code" tabindex="-1">Penyiapan di Claude Code <a class="header-anchor" href="#penyiapan-di-claude-code" aria-label="Permalink to &quot;Penyiapan di Claude Code&quot;"></a></h2>
<div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">claude</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> mcp</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> --transport</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> http</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> cinevva</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> https://api.cinevva.com/create/mcp</span></span></code></pre>
</div><p>Claude Code akan memandu Anda melalui proses masuk OAuth saat pertama kali digunakan. Setelah itu, minta Claude Code membaca file game Anda atau membuat perubahan. Claude Code dapat digunakan langsung dari terminal tanpa membuka tab browser.</p>
<h2 id="penyiapan-di-cursor" tabindex="-1">Penyiapan di Cursor <a class="header-anchor" href="#penyiapan-di-cursor" aria-label="Permalink to &quot;Penyiapan di Cursor&quot;"></a></h2>
<p>Tambahkan konfigurasi berikut ke <code>.cursor/mcp.json</code> (per proyek) atau <code>~/.cursor/mcp.json</code> (global):</p>
<div class="language-json vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">{</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  "mcpServers"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">    "cinevva"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">      "url"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"https://api.cinevva.com/create/mcp"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Cursor akan mendeteksi server, menjalankan alur OAuth di browser Anda, dan mencantumkan alat-alatnya di pengaturan MCP.</p>
<h2 id="fungsi-alat-alat-tersebut" tabindex="-1">Fungsi alat-alat tersebut <a class="header-anchor" href="#fungsi-alat-alat-tersebut" aria-label="Permalink to &quot;Fungsi alat-alat tersebut&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kelompok</th>
<th>Alat</th>
<th>Memerlukan sesi langsung?</th>
</tr>
</thead>
<tbody>
<tr>
<td>Membaca game</td>
<td><code>list_game_files</code>, <code>read_files</code>, <code>search_game_file</code></td>
<td>Tidak, membaca salinan di server dari game Anda mana pun</td>
</tr>
<tr>
<td>Mengedit game</td>
<td><code>edit_files</code>, <code>write_files</code>, <code>delete_files</code>, <code>rename_files</code></td>
<td>Tidak, edit diterapkan di sisi server dan ditampilkan langsung di tab yang terbuka</td>
</tr>
<tr>
<td>Pratinjau</td>
<td><code>game_ready</code></td>
<td>Memuat ulang pratinjau tab aktif, atau menyimpan tanpa antarmuka jika tidak ada tab aktif</td>
</tr>
<tr>
<td>Memantau game</td>
<td><code>read_console_logs</code>, <code>take_screenshot</code></td>
<td>Ya</td>
</tr>
<tr>
<td>Pengujian</td>
<td><code>execute_js</code>, <code>simulate_input</code>, <code>get_task_status</code></td>
<td>Ya</td>
</tr>
<tr>
<td>Aset</td>
<td><code>search_assets</code>, <code>list_asset_packs</code>, <code>import_asset</code>, <code>search_fonts</code></td>
<td>Ya. Sekitar 7.000 properti, audio, dan HDRI CC0</td>
</tr>
<tr>
<td>Pembuatan rig 3D</td>
<td><code>rig_model</code>, <code>apply_animation</code></td>
<td>Ya, memakai kredit</td>
</tr>
<tr>
<td>Dokumentasi</td>
<td><code>list_library_docs</code>, <code>search_library_docs</code>, <code>read_library_docs</code>, <code>list_animations</code></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p>Pembuatan rig memerlukan jumlah kredit yang sama seperti di Game Creator dalam aplikasi. Semua fitur lainnya gratis. Kreator dalam aplikasi juga dapat menghasilkan gambar, musik, efek suara, dan skybox dengan AI; alat-alat tersebut tersedia di aplikasi Cinevva dan bukan bagian dari konektor MCP.</p>
<h2 id="pemecahan-masalah" tabindex="-1">Pemecahan masalah <a class="header-anchor" href="#pemecahan-masalah" aria-label="Permalink to &quot;Pemecahan masalah&quot;"></a></h2>
<p>&quot;Tidak ada server MCP yang ditemukan di URL yang diberikan&quot; saat penyiapan biasanya berarti URL salah ketik atau memiliki karakter tambahan di bagian akhir. URL harus sama persis dengan <CopyText text="https://api.cinevva.com/create/mcp" />.</p>
<p>&quot;Tidak ada sesi langsung&quot; hanya muncul dari alat runtime (tangkapan layar, konsol, input, aset, dan pembuatan rig). Ini berarti tidak ada tab browser yang membuka game tersebut dengan tautan langsung aktif. Buka game Anda, klik Agen eksternal di bilah alat, lalu coba lagi. Alat file tidak pernah memerlukan sesi ini: tanpa sesi, alat tersebut dapat digunakan pada game Anda mana pun berdasarkan gameId, dan akan menampilkan daftar game Anda jika Anda tidak memberikan gameId.</p>
<p>Jika alat terhenti pada koneksi baru, muat ulang tab game agar tersambung kembali, lalu panggil <code>list_live_sessions</code>.</p>
<p>Pertanyaan atau masalah: <a href="mailto:support@cinevva.com" target="_blank" rel="noreferrer">support@cinevva.com</a>.</p>
]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Game Stan Pameran Dagang yang Benar-Benar Mengumpulkan Prospek (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/trade-show-booth-games</link>
            <guid>https://app.cinevva.com/id/guides/trade-show-booth-games</guid>
            <pubDate>Thu, 30 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Jenis game yang efektif untuk stan pameran dagang, alasan roda hadiah dan arena putting menarik kerumunan tetapi bukan prospek, serta cara game ponsel dengan papan peringkat langsung mengubah lalu lintas lorong menjadi daftar prospek yang dapat diekspor.]]></description>
            <content:encoded><![CDATA[<h1 id="game-stan-pameran-dagang-yang-benar-benar-mengumpulkan-prospek" tabindex="-1">Game Stan Pameran Dagang yang Benar-Benar Mengumpulkan Prospek <a class="header-anchor" href="#game-stan-pameran-dagang-yang-benar-benar-mengumpulkan-prospek" aria-label="Permalink to &quot;Game Stan Pameran Dagang yang Benar-Benar Mengumpulkan Prospek&quot;"></a></h1>
<p>Anda memiliki stan berukuran 10x10 atau 20x20, pemindai tanda pengenal, dan waktu tiga hari untuk membuktikan bahwa biaya stan tersebut sepadan. Di tengah perencanaan, gagasan tentang game muncul karena semua orang tahu bahwa game dapat menarik pengunjung. Pertanyaan yang jarang dijawab dengan baik adalah game mana yang menarik orang-orang yang layak diajak bicara, dan mana yang hanya menciptakan antrean orang asing tanpa tanda pengenal sambil membawa barang gratis.</p>
<p>Saya mencari nafkah dengan membuat game stan khusus, jadi saya telah melihat kedua hasil tersebut. Inilah yang membedakannya.</p>
<h2 id="dua-jenis-game-stan" tabindex="-1">Dua jenis game stan <a class="header-anchor" href="#dua-jenis-game-stan" aria-label="Permalink to &quot;Dua jenis game stan&quot;"></a></h2>
<p>Hampir setiap game stan masuk ke dalam salah satu dari dua kategori, dan keduanya bekerja dengan cara yang sangat berbeda.</p>
<p><strong>Game penarik perhatian</strong> menghentikan orang di lorong. Roda hadiah, arena putting, mesin capit, menara Jenga raksasa. Semuanya efektif: gerakan dan suara dapat memecah ritme langkah seseorang. Namun, game tersebut tidak memberi tahu Anda apa pun tentang siapa yang berhenti. Seseorang memutar roda, mengambil kaus kaki bermerek, lalu pergi. Anda mendapatkan seorang pengunjung, bukan prospek, dan Anda sudah membayar untuk sebuah roda.</p>
<p><strong>Game penyaring prospek</strong> membuat seseorang melakukan sesuatu yang mengungkapkan minat, lalu meminta detail kontak tepat ketika mereka menginginkan sesuatu dari Anda. Game seperti ini lebih jarang, lebih sulit dijalankan dengan baik, dan merupakan satu-satunya jenis yang akhirnya masuk ke CRM Anda.</p>
<p>Kesalahannya bukan memilih game penarik perhatian. Kesalahannya adalah memilih game semacam itu lalu mengharapkan jumlah prospek darinya.</p>
<h2 id="mengapa-game-klasik-kurang-efektif-menghasilkan-prospek" tabindex="-1">Mengapa game klasik kurang efektif menghasilkan prospek <a class="header-anchor" href="#mengapa-game-klasik-kurang-efektif-menghasilkan-prospek" aria-label="Permalink to &quot;Mengapa game klasik kurang efektif menghasilkan prospek&quot;"></a></h2>
<p><strong>Roda hadiah</strong> menghasilkan konversi karena hadiahnya, bukan karena Anda. Orang yang memutar roda berusaha mengoptimalkan peluang mendapatkan hadiah, yang berarti pemain paling antusias justru adalah orang-orang yang paling tidak tertarik pada produk Anda. Lebih buruk lagi, interaksinya hanya berlangsung empat detik—tidak cukup lama bagi staf stan Anda untuk memulai percakapan.</p>
<p><strong>Arena putting dan ring basket</strong> sangat efektif menambah waktu kunjungan, dan waktu kunjungan memang benar-benar bernilai. Namun, keduanya memakan banyak ruang untuk setiap pemain yang bermain secara bersamaan, memerlukan staf untuk mengatur ulang perlengkapan, dan seorang pegolf yang percaya diri dapat menguasai arena selama sepuluh menit sementara antrean orang yang sebenarnya ingin bertanya tentang produk Anda malah pergi.</p>
<p><strong>Bilik foto dan kamera 360 derajat</strong> menghasilkan sesuatu yang ingin disimpan pengunjung, dan naluri dasarnya memang tepat. Masalahnya, alat tersebut meminta email sebagai imbalan atas sebuah foto, sehingga minat yang Anda ukur hanyalah “ingin mendapatkan foto.” Cukup baik untuk meningkatkan kesadaran merek di pameran konsumen. Kurang berarti di acara B2B.</p>
<p><strong>Kuis tablet dan aplikasi putar-untuk-menang</strong> biasanya memiliki format yang tepat, tetapi dikemas dengan cara yang salah. Templat generik mengajukan trivia yang tidak berkaitan dengan produk Anda, sehingga pengunjung tidak mempelajari apa pun tentang Anda dan Anda pun tidak mengetahui apa pun tentang mereka. Seluruh pengalaman terasa seperti gerbang wajib untuk mengambil data prospek, bukan alasan menarik untuk berhenti.</p>
<h2 id="apa-yang-harus-dilakukan-oleh-sebuah-game-stan" tabindex="-1">Apa yang harus dilakukan oleh sebuah game stan <a class="header-anchor" href="#apa-yang-harus-dilakukan-oleh-sebuah-game-stan" aria-label="Permalink to &quot;Apa yang harus dilakukan oleh sebuah game stan&quot;"></a></h2>
<p>Jika disederhanakan, sebuah game stan memiliki empat tugas, dalam urutan berikut.</p>
<p><strong>Menghentikan seseorang di lorong.</strong> Tampilkan sesuatu pada layar setinggi mata yang bergerak dan terlihat dari jarak enam meter. Papan peringkat sangat efektif untuk tujuan ini karena papan skor berisi nama menunjukkan bahwa orang lain sudah bermain, dan bukti sosial itulah yang menarik pengunjung untuk Anda.</p>
<p><strong>Selesai dalam waktu sekitar enam puluh detik.</strong> Inilah angka yang paling penting sekaligus yang paling sering keliru dalam templat. Kurang dari tiga puluh detik tidak memberi cukup waktu untuk merasakan pencapaian. Lebih dari sembilan puluh detik membuat staf stan Anda tidak dapat memulai percakapan tanpa menyela permainan; antrean pun terbentuk dan orang-orang pergi.</p>
<p><strong>Minta email setelah permainan berakhir, jangan pernah sebelumnya.</strong> Gerbang sebelum bermain akan menghilangkan sebagian besar pemain karena Anda meminta orang asing membayar sebelum mereka tahu apakah game tersebut menyenangkan. Mintalah setelahnya, ketika mereka sudah menginvestasikan enam puluh detik dan ingin namanya tercantum di papan peringkat, sehingga memberikan email tidak terasa merugikan mereka. Perubahan urutan ini adalah pembeda terbesar antara game yang memenuhi daftar prospek dan game yang gagal melakukannya.</p>
<p><strong>Ajarkan sesuatu tentang produk yang Anda jual.</strong> Jika game hanya berupa templat yang diganti tampilannya, pengunjung akan mengingat gamenya. Jika mekanismenya menjadikan proposisi nilai produk Anda dapat dimainkan, mereka akan mengingat apa yang Anda lakukan. Perusahaan infrastruktur cloud dapat menjadikan proses perutean lalu lintas saat beban tinggi sebagai sebuah game. Perusahaan dokumen dapat membuat game tentang menyortir hal-hal yang tampaknya mustahil disortir. Versi seperti inilah yang akan diceritakan pengunjung kepada koleganya setelah acara.</p>
<h2 id="struktur-hadiah-yang-benar-benar-mendorong-permainan-berulang" tabindex="-1">Struktur hadiah yang benar-benar mendorong permainan berulang <a class="header-anchor" href="#struktur-hadiah-yang-benar-benar-mendorong-permainan-berulang" aria-label="Permalink to &quot;Struktur hadiah yang benar-benar mendorong permainan berulang&quot;"></a></h2>
<p>Sebagian besar stan memilih satu mekanisme hadiah lalu tanpa sadar merusaknya. Pilihannya biasanya “skor tertinggi menang,” yang berarti semua orang di luar sepuluh besar tidak punya alasan untuk memberikan email, atau “semua peserta masuk undian,” yang berarti tidak ada alasan bagi siapa pun untuk berusaha keras atau kembali bermain.</p>
<p>Gunakan keduanya, lalu nyatakan dengan jelas di layar:</p>
<p><strong>Hadiah terjamin untuk tiga besar pada waktu tetap setiap hari.</strong> Tenggat waktu menciptakan urgensi dan posisi podium memicu persaingan. Atur ulang papan peringkat setiap hari pameran agar hari kedua dan ketiga menjadi kompetisi baru, bukan hasil yang sudah dapat dipastikan. Ini juga memberi staf Anda alasan alami untuk mengundang pemain kemarin agar kembali.</p>
<p><strong>Satu tiket undian untuk setiap permainan yang diselesaikan, berapa pun skornya.</strong> Inilah yang membuat pemain di peringkat ke-200 tetap bernilai. Permainan mereka tidak menjanjikan dan mereka menyadarinya, tetapi satu tiket tetap layak ditukar dengan alamat email. Karena setiap permainan tambahan menghasilkan tiket tambahan, mekanisme inilah yang mendorong permainan berulang dan memperpanjang waktu kunjungan.</p>
<p>Keterampilan memberi hadiah kepada segelintir orang. Undian memberi hadiah kepada semua orang. Keduanya berjalan dari pemindaian yang sama.</p>
<h2 id="ponsel-jauh-mengungguli-kios" tabindex="-1">Ponsel jauh mengungguli kios <a class="header-anchor" href="#ponsel-jauh-mengungguli-kios" aria-label="Permalink to &quot;Ponsel jauh mengungguli kios&quot;"></a></h2>
<p>Naluri pertama biasanya membeli atau menyewa tablet. Namun, pertimbangkan apa yang sudah tersedia melalui ponsel di saku mereka.</p>
<p>Semua orang membawa perangkat sendiri, jadi tidak ada antrean perangkat keras dan tidak ada batas jumlah pemain secara bersamaan. Anda tidak perlu membersihkan atau mengisi daya apa pun, tidak ada barang yang perlu dikirim atau diasuransikan, dan tidak ada yang bisa dicuri pada hari kedua. Kode QR tidak memerlukan biaya untuk diperbanyak, sehingga dapat ditempatkan di meja, banner, sisipan tali tanda pengenal, dan email sebelum acara. Seseorang bahkan dapat mulai bermain sebelum tiba di stan Anda.</p>
<p>Komprominya memang nyata dan perlu dijelaskan: Anda tidak mengendalikan perangkat pemain, jadi game harus dapat berjalan pada Android berusia lima tahun di dalam aula dengan wifi yang penuh sesak. Artinya, Anda memerlukan game browser dengan ukuran unduhan kecil, tanpa instalasi aplikasi, dan tanpa pendaftaran. Jika vendor game stan mengatakan bahwa pengunjung harus menginstal sesuatu, sebagian besar lalu lintas Anda akan hilang di antara tahap “tertarik” dan “mulai bermain.”</p>
<h2 id="membuat-layar-papan-peringkat-bekerja-secara-maksimal" tabindex="-1">Membuat layar papan peringkat bekerja secara maksimal <a class="header-anchor" href="#membuat-layar-papan-peringkat-bekerja-secara-maksimal" aria-label="Permalink to &quot;Membuat layar papan peringkat bekerja secara maksimal&quot;"></a></h2>
<p>Layar yang menghadap lorong bekerja lebih keras daripada gamenya sendiri. Sebagian besar orang yang melihatnya tidak akan pernah bermain, jadi layar tersebut harus mampu mempromosikan stan tanpa bantuan apa pun.</p>
<p>Tampilkan papan peringkat langsung dengan ukuran yang cukup besar agar dapat dibaca dari lorong. Tandai tiga besar dengan jelas sebagai posisi pemenang hadiah, lalu redupkan tujuh posisi lainnya di belakang mereka. Tambahkan kode QR untuk memindai dan bermain dalam ukuran yang dapat dipotret dari jarak dua meter. Nyatakan setiap struktur hadiah dalam satu baris. Sisakan juga ruang untuk video atau cerita produk Anda yang diputar berulang, karena layar tersebut tetap memiliki audiens, baik ada yang sedang bermain maupun tidak.</p>
<p>Satu detail yang tidak memerlukan biaya tetapi mengubah suasana: biarkan game bermain sendiri ketika tidak ada pemain, seperti mesin arkade. Poster statis terlihat seperti papan informasi. Game yang tampak sedang berjalan terasa seperti sesuatu sedang terjadi, dan sesuatu yang sedang terjadilah yang membuat orang di lorong menoleh.</p>
<h2 id="pertanyaan-untuk-vendor-game-stan" tabindex="-1">Pertanyaan untuk vendor game stan <a class="header-anchor" href="#pertanyaan-untuk-vendor-game-stan" aria-label="Permalink to &quot;Pertanyaan untuk vendor game stan&quot;"></a></h2>
<p>Jika Anda membeli alih-alih membuat sendiri, berikut pertanyaan yang benar-benar membedakan satu vendor dari vendor lainnya:</p>
<p>Apakah game tersebut mengajarkan apa yang kami jual, atau hanya templat dengan logo kami? Dapatkah saya memainkan versi persis yang akan Anda buat sebelum membayar? Ke mana data prospek dikirim, dan dapatkah saya mengekspornya sebagai CSV yang bisa diterima CRM kami tanpa perantara? Siapa yang memiliki game tersebut setelahnya? Apakah perlu menginstal aplikasi atau mendaftar sebelum bermain? Apa yang terjadi jika wifi konferensi buruk? Dapatkah Anda menyesuaikannya dengan perangkat merek kami dan melibatkan tim pemasaran kami dalam proses peninjauan, alih-alih sekadar memperkirakan warna merek kami?</p>
<p>Pertanyaan mengenai apakah Anda bisa memainkannya sebelum membayar adalah yang paling tajam. Agensi biasanya menjawabnya dengan presentasi slide. Ini merupakan indikator yang cukup masuk akal untuk mengetahui apakah mereka benar-benar mampu membuatnya.</p>
<h2 id="realitas-anggaran" tabindex="-1">Realitas anggaran <a class="header-anchor" href="#realitas-anggaran" aria-label="Permalink to &quot;Realitas anggaran&quot;"></a></h2>
<p>Sebagai gambaran tentang biaya yang semestinya, game stan HTML5 khusus dari agensi tradisional biasanya dimulai dari kisaran puluhan ribu dolar dan terus naik, terutama karena pekerjaannya dihitung seperti proyek perangkat lunak khusus. Paket sewa roda hadiah, bilik foto, dan game tablet umumnya berharga dua hingga lima ribu dolar per pameran, lalu Anda harus mengembalikan perangkat keras tersebut tanpa memiliki apa pun.</p>
<p>Game browser khusus yang dibuat dengan alat berbantuan AI bisa jauh lebih murah daripada harga agensi, dan Anda tetap memilikinya—hal yang penting jika Anda mengikuti tiga pameran per tahun. Perhitungannya hanya masuk akal jika vendor tidak menagih jam kerja perangkat lunak khusus untuk sesuatu yang menggunakan kembali kerangka yang sudah terbukti. Jadi, tanyakan bagian mana dari pembuatan yang benar-benar baru untuk Anda dan bagian mana yang digunakan kembali.</p>
<h2 id="versi-singkatnya" tabindex="-1">Versi singkatnya <a class="header-anchor" href="#versi-singkatnya" aria-label="Permalink to &quot;Versi singkatnya&quot;"></a></h2>
<p>Game stan layak digunakan jika berdurasi enam puluh detik, dimainkan di ponsel milik pengunjung sendiri, meminta email setelah permainan alih-alih sebelumnya, menampilkan papan peringkat langsung yang terlihat dari lorong, menjamin hadiah bagi tiga besar yang ditampilkan dengan jelas sambil memberi tiket undian kepada semua pemain lainnya, serta dibangun berdasarkan produk yang benar-benar Anda jual, bukan templat sewaan.</p>
<p>Jika semua hal tersebut dilakukan dengan tepat, game tidak lagi sekadar menjadi dekorasi stan, melainkan alasan mengapa ekspor data prospek Anda layak dibaca pada hari Senin.</p>
<h2 id="mainkan-tiga-konsep-ini-sebelum-anda-berkomitmen" tabindex="-1">Mainkan tiga konsep ini sebelum Anda berkomitmen <a class="header-anchor" href="#mainkan-tiga-konsep-ini-sebelum-anda-berkomitmen" aria-label="Permalink to &quot;Mainkan tiga konsep ini sebelum Anda berkomitmen&quot;"></a></h2>
<p>Kami membuat game stan khusus, dan Anda dapat langsung memainkan konsepnya di ponsel sebagaimana pengunjung Anda akan memainkannya: sprint stan pameran dagang dengan papan peringkat langsung, game keynote yang dikendalikan bersama oleh seluruh ruangan, dan produk yang diubah menjadi gamenya sendiri. Sebagian besar proyek berharga antara $500 dan $2,000, Anda mendapatkan penawaran harga tetap dalam satu hari, dan tidak ada biaya yang dikenakan sampai Anda menyetujuinya.</p>
<p><strong><a href="/id/studio.html">Mainkan konsepnya dan dapatkan penawaran →</a></strong></p>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/trade-show-booth-games-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Dari Cinevva ke Cocos: Serah Terima Mini-Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/cinevva-to-cocos-workflow</link>
            <guid>https://app.cinevva.com/id/guides/cinevva-to-cocos-workflow</guid>
            <pubDate>Sun, 19 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara membuat prototipe mini-game di Cinevva, memvalidasinya dengan pemain sungguhan, dan menyerahkan game pemenang ke Cocos untuk produksi. Apa yang dapat digunakan kembali, apa yang harus dibangun ulang, dan alur kerja langkah demi langkah yang apa adanya.]]></description>
            <content:encoded><![CDATA[<h1 id="dari-cinevva-ke-cocos-serah-terima-mini-game-2026" tabindex="-1">Dari Cinevva ke Cocos: Serah Terima Mini-Game (2026) <a class="header-anchor" href="#dari-cinevva-ke-cocos-serah-terima-mini-game-2026" aria-label="Permalink to &quot;Dari Cinevva ke Cocos: Serah Terima Mini-Game (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/cinevva-to-cocos-workflow-hero.jpg?v=1" alt="Dari Cinevva ke Cocos: alur kerja serah terima mini-game pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Cinevva dan Cocos bukanlah pesaing. Keduanya merupakan dua tahap dalam pipeline yang sama. Cinevva adalah tempat Anda mencari tahu ide mana yang layak dibangun. Cocos adalah tempat Anda membangun versi final yang telah dioptimalkan dari ide yang terbukti layak. Panduan ini membahas serah terima di antara keduanya: apa yang benar-benar dapat digunakan kembali, apa yang harus dibangun ulang, dan cara menjalankan alur kerja ini tanpa menipu diri sendiri tentang kemampuan masing-masing.</p>
<p>Mari kita berterus terang tentang satu hal yang diharapkan banyak orang tetapi tidak akan mereka dapatkan: tidak ada tombol sekali klik untuk &quot;mengekspor ke proyek Cocos&quot;. Cinevva tidak menghasilkan scene Cocos. Serah terima ini merupakan proses membangun ulang secara terencana berdasarkan desain yang telah Anda buktikan, sambil menggunakan kembali aset yang telah dibuat. Hal itu terdengar seperti kekurangan sampai Anda melihat apa saja yang dapat dihemat. Untuk perbandingan langsung mengenai kapan sebaiknya memakai masing-masing alat, lihat <a href="/id/guides/cinevva-vs-cocos.html">Cinevva vs Cocos</a>.</p>
<h2 id="mengapa-perlu-melakukan-serah-terima" tabindex="-1">Mengapa perlu melakukan serah terima <a class="header-anchor" href="#mengapa-perlu-melakukan-serah-terima" aria-label="Permalink to &quot;Mengapa perlu melakukan serah terima&quot;"></a></h2>
<p>Bagian-bagian mahal dari mini-game Tiongkok—hak cipta perangkat lunak, pendaftaran ICP, peninjauan platform, dan untuk game yang dimonetisasi, hubungan dengan penerbit—layak dibiayai untuk game yang sudah Anda ketahui menyenangkan. Masalahnya, Anda belum mengetahui hal itu sejak awal. Sebagian besar ide game tidak menyenangkan, dan Anda mengetahuinya dengan memainkan, bukan merencanakannya.</p>
<p>Karena itu, pipeline ini dibuat untuk memindahkan pertanyaan &quot;apakah ini menyenangkan?&quot; sedini dan semurah mungkin. Buat prototipe di Cinevva dalam hitungan menit, tampilkan kepada pemain sungguhan, lalu baca data retensinya. Hentikan prototipe yang tidak berhasil. Hanya prototipe yang bertahan yang mendapatkan pengembangan Cocos dan biaya regulasi. Anda tidak mengerjakan hal yang sama dua kali; Anda menghindari pembangunan game yang salah menggunakan alat yang mahal.</p>
<h2 id="apa-yang-dapat-digunakan-kembali-dan-apa-yang-tidak" tabindex="-1">Apa yang dapat digunakan kembali (dan apa yang tidak) <a class="header-anchor" href="#apa-yang-dapat-digunakan-kembali-dan-apa-yang-tidak" aria-label="Permalink to &quot;Apa yang dapat digunakan kembali (dan apa yang tidak)&quot;"></a></h2>
<p>Pastikan hal ini dipahami dengan tepat, karena pada bagian inilah tim sering menaksir terlalu tinggi atau terlalu rendah upaya serah terima.</p>
<p><strong>Desain yang telah divalidasi dapat digunakan kembali, dan itulah bagian yang paling berharga.</strong> Anda tidak mulai menggunakan Cocos hanya dengan bermodalkan dugaan. Anda memiliki game yang benar-benar telah dimainkan orang, angka retensi, dan spesifikasi konkret: core loop, kurva kesulitan, durasi sesi, serta hal yang membuat penguji membukanya kembali. Bagian tersulit dari desain game itu sudah selesai dan risikonya telah dikurangi.</p>
<p><strong>Aset yang dibuat dapat digunakan kembali.</strong> Model 3D, audio, dan karya visual yang Anda buat di Cinevva menggunakan format web standar, bukan dikunci dalam blob proprieter. Model diekspor sebagai glTF/GLB (<a href="/id/tools/animate.html">alat rigging dan animasi</a> mengunduh GLB dengan animasi yang sudah disematkan), sedangkan audio tersedia sebagai berkas standar. Semuanya dapat diimpor ke Cocos seperti aset lainnya. Anda dapat membuat ulang atau memolesnya sesuai kebutuhan, tetapi tidak perlu memesan karya visual dari nol.</p>
<p><strong>Kode tidak dapat digunakan kembali.</strong> Cinevva membangun runtime berbasis web; Cocos adalah engine tersendiri dengan model komponen dan API TypeScript-nya sendiri. Logika game harus dibangun ulang. Inilah biaya sesungguhnya dari serah terima tersebut, dan biayanya lebih kecil daripada yang terdengar karena Anda menerapkan ulang desain yang sudah dipahami sepenuhnya berdasarkan spesifikasi yang sudah terbukti bekerja, alih-alih mencari-cari desain sambil menulis kode.</p>
<h2 id="alur-kerja-langkah-demi-langkah" tabindex="-1">Alur kerja langkah demi langkah <a class="header-anchor" href="#alur-kerja-langkah-demi-langkah" aria-label="Permalink to &quot;Alur kerja langkah demi langkah&quot;"></a></h2>
<ol>
<li>
<p><strong>Buat prototipe di Cinevva dengan mode mini-game aktif.</strong> Jelaskan game dalam satu kalimat dan lakukan iterasi sampai dapat dimainkan. <a href="/id/news/2026-07-19-wechat-mini-game-mode.html">Mode mini-game WeChat</a> menjaga proyek tetap berada dalam subset portabel (UI canvas, mengutamakan sentuhan, dan aset berukuran kecil), sehingga desain yang Anda validasi sudah berbentuk seperti mini-game, bukan game desktop yang harus dirombak nantinya.</p>
</li>
<li>
<p><strong>Uji dengan pemain sungguhan dan baca data retensinya.</strong> Bagikan tautan browser, idealnya kepada audiens yang Anda targetkan. Metrik yang penting adalah apakah orang kembali bermain, bukan apakah mereka mengatakan menyukainya. Buat beberapa prototipe dan biarkan data menentukan mana yang bertahan.</p>
</li>
<li>
<p><strong>Tulis spesifikasi berdasarkan prototipe.</strong> Sebelum mulai menggunakan Cocos, catat apa yang berhasil: loop, angka, dan nuansa permainannya. Prototipe adalah dokumen desain Anda; jangan sampai pengetahuan tersebut hilang saat diterjemahkan ke implementasi baru.</p>
</li>
<li>
<p><strong>Kumpulkan aset.</strong> Ekspor model 3D serta ambil audio dan karya visual yang akan dipertahankan. Masukkan semuanya ke pipeline aset Anda dalam format yang diharapkan Cocos.</p>
</li>
<li>
<p><strong>Bangun ulang di Cocos untuk memenuhi batas 4 MB.</strong> Pada tahap ini, keunggulan engine mulai berperan: runtime engine sudah tertanam dalam klien WeChat sehingga tidak dihitung sebagai bagian dari ukuran paket Anda, sedangkan sub-paket AssetBundle membantu memuat sisanya. Lihat <a href="/id/guides/wechat-mini-game-engines.html">panduan engine mini-game WeChat</a> untuk detail pengemasan.</p>
</li>
<li>
<p><strong>Urus dokumen secara paralel.</strong> Hak cipta perangkat lunak dan pendaftaran ICP memerlukan waktu berminggu-minggu; mulai prosesnya selagi Anda membangun agar keduanya tidak menghambat peluncuran.</p>
</li>
</ol>
<h2 id="kapan-anda-tidak-perlu-melakukan-serah-terima" tabindex="-1">Kapan Anda tidak perlu melakukan serah terima <a class="header-anchor" href="#kapan-anda-tidak-perlu-melakukan-serah-terima" aria-label="Permalink to &quot;Kapan Anda tidak perlu melakukan serah terima&quot;"></a></h2>
<p>Terkadang langkah yang tepat adalah tidak menggunakan Cocos sama sekali. Jika prototipe Anda kecil, ringan, dan sudah berjalan dengan baik, serta akan dirilis sebagai game gratis dengan iklan alih-alih judul IAP yang sangat dioptimalkan, proses membangun ulang mungkin tidak sepadan. Setelah tersedia, game sederhana yang sudah memenuhi batasan dapat dirilis melalui jalur ekspor Cinevva sendiri tanpa melibatkan engine kedua. Serah terima ditujukan bagi game pemenang yang memerlukan tahap akhir pengoptimalan atau polesan produksi mendalam yang menjadi keunggulan Cocos, bukan untuk setiap prototipe.</p>
<h2 id="realitas-regulasi-tetap-sama-dengan-cara-apa-pun" tabindex="-1">Realitas regulasi (tetap sama dengan cara apa pun) <a class="header-anchor" href="#realitas-regulasi-tetap-sama-dengan-cara-apa-pun" aria-label="Permalink to &quot;Realitas regulasi (tetap sama dengan cara apa pun)&quot;"></a></h2>
<p>Serah terima tidak mengubah aturannya. Mini-game gratis yang didukung iklan memerlukan hak cipta perangkat lunak per judul (软著) atau sertifikasi hak cipta elektronik, ditambah pendaftaran ICP. Semuanya dapat diurus oleh individu yang memiliki ID Tiongkok daratan. Setiap pembelian dalam aplikasi memerlukan banhao, yang hanya dapat dimiliki oleh perusahaan Tiongkok, sehingga studio asing membutuhkan penerbit lokal berlisensi. Baik game tersebut dibuat di Cinevva, Cocos, maupun keduanya, dokumen yang diperlukan tetap sama. Detailnya tersedia dalam <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan di Mini-Game WeChat dan Douyin</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bisakah-cinevva-mengekspor-proyek-cocos" tabindex="-1">Bisakah Cinevva mengekspor proyek Cocos? <a class="header-anchor" href="#bisakah-cinevva-mengekspor-proyek-cocos" aria-label="Permalink to &quot;Bisakah Cinevva mengekspor proyek Cocos?&quot;"></a></h3>
<p>Tidak. Tidak ada ekspor sekali klik ke scene Cocos. Cinevva memvalidasi desain dan menghasilkan aset yang dapat digunakan kembali dalam format standar; game-nya sendiri dibangun ulang di Cocos. Nilainya terletak pada proses membangun ulang game yang sudah terbukti menyenangkan, bukan pada melewatkan tahap pembangunan.</p>
<h3 id="apa-saja-yang-benar-benar-dapat-dipindahkan-dari-cinevva-ke-cocos" tabindex="-1">Apa saja yang benar-benar dapat dipindahkan dari Cinevva ke Cocos? <a class="header-anchor" href="#apa-saja-yang-benar-benar-dapat-dipindahkan-dari-cinevva-ke-cocos" aria-label="Permalink to &quot;Apa saja yang benar-benar dapat dipindahkan dari Cinevva ke Cocos?&quot;"></a></h3>
<p>Tiga hal: desain yang telah divalidasi (loop, tingkat kesulitan, durasi sesi, dan data retensi), aset yang dibuat (model 3D sebagai glTF/GLB, audio, serta karya visual dalam format standar), dan pemahaman Anda tentang alasan game tersebut berhasil. Kodenya tidak dapat dipindahkan; kode harus diterapkan ulang menggunakan API Cocos.</p>
<h3 id="bukankah-membangun-ulang-game-itu-pemborosan" tabindex="-1">Bukankah membangun ulang game itu pemborosan? <a class="header-anchor" href="#bukankah-membangun-ulang-game-itu-pemborosan" aria-label="Permalink to &quot;Bukankah membangun ulang game itu pemborosan?&quot;"></a></h3>
<p>Biayanya lebih murah daripada alternatifnya, yaitu membangun game yang salah menggunakan alat yang mahal. Sebagian besar prototipe gagal. Membangun ulang hanya game pemenang yang sudah terbukti, berdasarkan spesifikasi yang telah bekerja, jauh lebih hemat daripada memproduksi penuh setiap ide hanya untuk mencari tahu mana yang sebenarnya layak.</p>
<h3 id="apakah-saya-harus-menggunakan-cocos-setelah-cinevva" tabindex="-1">Apakah saya harus menggunakan Cocos setelah Cinevva? <a class="header-anchor" href="#apakah-saya-harus-menggunakan-cocos-setelah-cinevva" aria-label="Permalink to &quot;Apakah saya harus menggunakan Cocos setelah Cinevva?&quot;"></a></h3>
<p>Tidak. Jika prototipe sederhana dan sudah memenuhi batasan platform, Anda dapat merilisnya melalui jalur Cinevva sendiri tanpa Cocos. Serah terima ditujukan bagi game yang memerlukan pengoptimalan berat atau polesan produksi mendalam.</p>
<h3 id="bisakah-saya-menggunakan-kembali-model-3d-dan-audio-yang-telah-dibuat" tabindex="-1">Bisakah saya menggunakan kembali model 3D dan audio yang telah dibuat? <a class="header-anchor" href="#bisakah-saya-menggunakan-kembali-model-3d-dan-audio-yang-telah-dibuat" aria-label="Permalink to &quot;Bisakah saya menggunakan kembali model 3D dan audio yang telah dibuat?&quot;"></a></h3>
<p>Ya. Model yang dibuat dapat diekspor sebagai glTF/GLB, sedangkan audio diekspor sebagai berkas standar; keduanya dapat diimpor ke Cocos. Anda mungkin perlu memoles atau membuatnya ulang agar memenuhi batas 4 MB, tetapi tidak perlu memulai pembuatan karya visual dari nol.</p>
<BuildCta
  title="Mulailah dengan prototipe, bukan engine"
  desc="Validasi ide di Cinevva terlebih dahulu. Serahkan game pemenang ke Cocos hanya setelah terbukti layak."
  prompt="Buat game arkade satu ketukan yang sulit untuk berhenti dimainkan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/cinevva-vs-cocos.html">Cinevva vs Cocos untuk Mini-Game</a> — pembagian tahap pembuatan prototipe dan produksi secara mendetail</li>
<li><a href="/id/guides/cocos-alternatives.html">Alternatif Cocos untuk Mini-Game</a> — seluruh pilihan engine</li>
<li><a href="/id/guides/wechat-mini-game-engines.html">Engine Game untuk Mini-Game WeChat</a> — batas 4 MB dan pengemasan</li>
<li><a href="/id/guides/publish-wechat-douyin-mini-games.html">Cara Menerbitkan di Mini-Game WeChat &amp; Douyin</a> — lisensi, peninjauan, dan bagi hasil</li>
<li><a href="/id/news/2026-07-19-wechat-mini-game-mode.html">Mode mini-game WeChat</a> — membangun dalam subset portabel</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang mengutamakan web</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/cinevva-to-cocos-workflow-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cinevva vs Cocos untuk Mini Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/cinevva-vs-cocos</link>
            <guid>https://app.cinevva.com/id/guides/cinevva-vs-cocos</guid>
            <pubDate>Sun, 19 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cinevva vs Cocos Creator untuk membuat mini game pada 2026. Keunggulan Cocos dalam produksi dan plugin WeChat 4 MB, keunggulan alat AI prompt-to-game dalam kecepatan pembuatan prototipe, serta alasan mengapa jawaban paling jujur adalah menggunakan keduanya.]]></description>
            <content:encoded><![CDATA[<h1 id="cinevva-vs-cocos-untuk-mini-game-2026" tabindex="-1">Cinevva vs Cocos untuk Mini Game (2026) <a class="header-anchor" href="#cinevva-vs-cocos-untuk-mini-game-2026" aria-label="Permalink to &quot;Cinevva vs Cocos untuk Mini Game (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/cinevva-vs-cocos-hero.jpg?v=1" alt="Cinevva vs Cocos untuk mini game pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Jika Anda membuat mini game untuk WeChat dan Douyin, Cocos Creator adalah pilihan standar, dan itu bukan tanpa alasan. Jadi, pertanyaannya bukan benar-benar &quot;mana yang menang.&quot; Pertanyaannya adalah &quot;mana yang harus saya gunakan, dan kapan.&quot; Kami membuat alat AI prompt-to-game, jadi jelas kami memiliki bias, dan kami akan berterus terang tentang bagian mana yang lebih cocok ditangani Cocos serta bagian mana yang sama sekali tidak ingin kami saingi.</p>
<p>Versi singkatnya: Cocos menguasai tahap produksi. Kami menguasai tahap sebelum produksi, yaitu mengubah ide menjadi game yang dapat dimainkan dengan cukup cepat sehingga Anda tidak keberatan membuang sebagian besarnya. Keduanya merupakan pekerjaan yang berbeda, dan langkah cerdas biasanya adalah menggunakan keduanya.</p>
<p>Jika Anda masih memilih engine mini game secara umum, mulailah dengan <a href="/id/guides/wechat-mini-game-engines.html">panduan engine mini game WeChat kami</a>, yang membahas Cocos, LayaAir, Egret, SDK transformasi Unity, dan Tuanjie secara mendalam.</p>
<h2 id="kesimpulan-singkat" tabindex="-1">Kesimpulan Singkat <a class="header-anchor" href="#kesimpulan-singkat" aria-label="Permalink to &quot;Kesimpulan Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Cinevva</th>
<th>Cocos Creator</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Kegunaannya</strong></td>
<td>Pembuatan prototipe: ide → game 3D yang dapat dimainkan dalam hitungan menit</td>
<td>Produksi: merilis mini game final yang telah dioptimalkan</td>
</tr>
<tr>
<td><strong>Cara membuatnya</strong></td>
<td>Jelaskan dengan bahasa sehari-hari (Inggris atau Mandarin)</td>
<td>Editor lengkap, TypeScript, serta alur kerja aset visual dan adegan</td>
</tr>
<tr>
<td><strong>Solusi untuk batas 4 MB WeChat</strong></td>
<td>Mode subset portabel; eksportir sedang dikembangkan</td>
<td>Terbaik di kelasnya: engine tertanam dalam klien WeChat, subpaket AssetBundle</td>
</tr>
<tr>
<td><strong>Kematangan</strong></td>
<td>Baru, mengutamakan AI, berkembang pesat</td>
<td>Teruji di lapangan, sebagian besar mini game WeChat berjalan di atasnya</td>
</tr>
<tr>
<td><strong>Kecocokan untuk tim</strong></td>
<td>Developer solo, desainer, validasi ide dengan cepat</td>
<td>Studio dan engineer yang membuat game untuk dirilis</td>
</tr>
<tr>
<td><strong>Biaya</strong></td>
<td>Gratis untuk membuat game di browser</td>
<td>Gratis, sumber terbuka</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Menemukan game yang layak dibuat</td>
<td>Membuat game yang sudah Anda yakini</td>
</tr>
</tbody>
</table>
<p>Satu kalimat yang paling penting: <strong>Cocos adalah tempat Anda membuat game yang sudah diputuskan untuk dibuat. Cinevva adalah tempat Anda mencari tahu game mana yang seharusnya dibuat.</strong></p>
<h2 id="bagian-yang-dimenangkan-cocos-dan-kami-tidak-membantahnya" tabindex="-1">Bagian yang Dimenangkan Cocos (dan Kami Tidak Membantahnya) <a class="header-anchor" href="#bagian-yang-dimenangkan-cocos-dan-kami-tidak-membantahnya" aria-label="Permalink to &quot;Bagian yang Dimenangkan Cocos (dan Kami Tidak Membantahnya)&quot;"></a></h2>
<p>Cocos Creator adalah pilihan standar yang aman dan tepat untuk merilis mini game WeChat, dan tidak ada satu pun di sini yang dimaksudkan untuk membujuk Anda agar tidak menggunakannya.</p>
<p>Keunggulan struktural terbesarnya berkaitan dengan batas ukuran paket 4 MB, satu-satunya masalah engineering tersulit di WeChat. Sejak klien WeChat 7.0.7, runtime engine Cocos tersedia sebagai plugin yang tertanam dalam aplikasi WeChat itu sendiri, sehingga tidak dihitung dalam batas 4 MB Anda. Paket Anda hanya berisi game, bukan game beserta engine. Tidak ada engine lain yang memiliki keunggulan ini, dan itulah alasan sebagian besar mini game dibuat dengan Cocos. Selain itu, sistem AssetBundle miliknya merupakan cara paling rapi untuk membagi aset ke dalam subpaket sesuai permintaan.</p>
<p>Di luar pengemasan, Cocos menguasai semua hal yang berkaitan dengan penyelesaian game: editor matang, framework UI sungguhan, sistem hot-update, alur kerja aset visual dan animasi, serta dokumentasi dan jawaban komunitas berbahasa Mandarin yang telah dihimpun selama bertahun-tahun. Jika Anda memiliki tim, desain yang diyakini, dan rencana untuk merilis game, inilah alatnya. Kami sendiri pun akan merekomendasikannya kepada Anda.</p>
<h2 id="bagian-yang-dimenangkan-alat-prompt-ai" tabindex="-1">Bagian yang Dimenangkan Alat Prompt AI <a class="header-anchor" href="#bagian-yang-dimenangkan-alat-prompt-ai" aria-label="Permalink to &quot;Bagian yang Dimenangkan Alat Prompt AI&quot;"></a></h2>
<p>Hal yang tidak dirancang untuk dilakukan Cocos adalah tahap paling awal, ketika Anda belum tahu apakah idenya benar-benar bagus.</p>
<p>Di Cinevva, Anda menjelaskan sebuah game dalam satu kalimat, dalam bahasa Inggris atau Mandarin, lalu mendapatkan game 3D yang dapat dimainkan di browser dalam hitungan menit. Sembilan model spesialis menangani 3D, animasi, adegan, musik, suara, efek, UI, logika, dan multipemain, sehingga Anda tidak perlu membuka editor kosong dan membangun berbagai sistem sebelum bisa menguji satu mekanik pun. Anda dapat memainkan ide tersebut hampir seketika.</p>
<p>Kecepatan itu mengubah keekonomian dalam mencari game sukses. Kesuksesan mini game semakin menyerupai konten: Anda tidak menemukan pemenang hanya dengan penalaran, tetapi dengan membuat banyak kandidat secara murah dan mempertahankan satu yang angka retensinya tidak berbohong. Ketika prototipe memerlukan hitungan menit, bukan hari, &quot;buat lima minggu ini dan pertahankan satu yang benar-benar seru&quot; menjadi alur kerja nyata, bukan sekadar khayalan. Itulah keunggulan pembukanya, dan ini benar-benar nyata, bukan sekadar mainan.</p>
<p>Ada pula sudut pandang khusus Tiongkok. <a href="/id/news/2026-07-19-wechat-mini-game-mode.html">Mode mini game WeChat</a> Cinevva membuat game di dalam subset portabel sejak prompt pertama: UI yang digambar di canvas, bukan HTML, kontrol yang mengutamakan sentuhan, audio mp3, tanpa kode yang dimuat secara dinamis, serta pemeriksaan awal WebGL2 untuk ponsel lama. Sandbox pratinjau mode ketat menandai segala hal yang akan merusak hasil porting dan mengirimkannya kembali ke AI untuk diperbaiki. Game tersebut sudah dapat berjalan di browser Anda saat ini dan tetap berada di dalam subset yang dapat bertahan saat di-porting ke WeChat, alih-alih mengadopsi pola yang nantinya harus Anda tulis ulang.</p>
<h2 id="keterbatasan-yang-sebenarnya" tabindex="-1">Keterbatasan yang Sebenarnya <a class="header-anchor" href="#keterbatasan-yang-sebenarnya" aria-label="Permalink to &quot;Keterbatasan yang Sebenarnya&quot;"></a></h2>
<p>Kami masih baru. Cocos telah digunakan untuk merilis ribuan mini game; kami masih berada di tahap awal, mengutamakan AI, dan berkembang dengan cepat, tetapi kami belum menyelesaikan kasus-kasus khusus selama satu dekade seperti Cocos. Eksportir kami yang menghasilkan proyek siap dibuka di WeChat DevTools masih dalam pengembangan, belum selesai, sehingga saat ini Cinevva merupakan tahap awal untuk pembuatan prototipe dan generasi, bukan tahap pengemasan akhir. Dan untuk game produksi yang sangat dioptimalkan dan padat aset, ketika setiap kilobita dari batas 4 MB sangat berarti, plugin bawaan dan sistem AssetBundle Cocos merupakan keunggulan yang belum dapat kami tandingi. Kami lebih suka Anda mengetahui hal itu sejak awal.</p>
<h2 id="gunakan-keduanya-alur-kerja-yang-realistis" tabindex="-1">Gunakan Keduanya: Alur Kerja yang Realistis <a class="header-anchor" href="#gunakan-keduanya-alur-kerja-yang-realistis" aria-label="Permalink to &quot;Gunakan Keduanya: Alur Kerja yang Realistis&quot;"></a></h2>
<p>Cara pandang yang benar-benar membantu Anda bukanlah &quot;pilih salah satu.&quot; Ini adalah sebuah alur kerja.</p>
<p>Gunakan Cinevva untuk 立项, tahap pemberian lampu hijau: ubah ide menjadi prototipe yang dapat dimainkan, sajikan kepada pemain sungguhan, lalu temukan prototipe dengan gameplay loop yang layak diinvestasikan. Setelah itu, tentukan apa yang pantas didapatkan oleh pemenang tersebut. Terkadang hasilnya sudah cukup baik untuk langsung dirilis. Terkadang game tersebut layak dibuat ulang di Cocos untuk tahap akhir optimalisasi dan penyempurnaan, atau untuk memulai percakapan dengan penerbit. Bagian-bagian mahal di Tiongkok, yaitu administrasi dan peninjauan platform, hanya perlu dikeluarkan untuk game yang sebelumnya telah membuktikan bahwa game tersebut seru di tempat yang lebih murah.</p>
<p>Itulah sebabnya ini bukan benar-benar Cinevva versus Cocos. Ini adalah Cinevva lalu Cocos, dan hanya untuk game yang layak mendapatkan tahap kedua.</p>
<h2 id="realitas-regulasi-sama-untuk-keduanya" tabindex="-1">Realitas Regulasi (Sama untuk Keduanya) <a class="header-anchor" href="#realitas-regulasi-sama-untuk-keduanya" aria-label="Permalink to &quot;Realitas Regulasi (Sama untuk Keduanya)&quot;"></a></h2>
<p>Engine apa pun yang Anda gunakan, persyaratan untuk menerbitkan game di Tiongkok tetap sama. Mini game gratis yang didukung iklan memerlukan hak cipta perangkat lunak per judul (软著) atau sertifikasi hak cipta elektronik, ditambah pendaftaran ICP, yang semuanya dapat dilakukan oleh individu dengan identitas Tiongkok daratan. Pembelian dalam aplikasi apa pun memerlukan banhao, yang hanya dapat dimiliki oleh perusahaan Tiongkok, sehingga studio asing membutuhkan penerbit lokal berlisensi. Semua itu tidak bergantung pada engine Anda. Kami membahasnya dalam <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan WeChat dan Douyin</a>. Pilihan engine menentukan seberapa cepat Anda dapat membuat game; pilihan tersebut tidak mengubah urusan administrasi.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-cinevva-merupakan-pengganti-cocos" tabindex="-1">Apakah Cinevva merupakan pengganti Cocos? <a class="header-anchor" href="#apakah-cinevva-merupakan-pengganti-cocos" aria-label="Permalink to &quot;Apakah Cinevva merupakan pengganti Cocos?&quot;"></a></h3>
<p>Tidak, dan kami tidak memasarkannya seperti itu. Cocos adalah engine produksi untuk merilis mini game final. Cinevva adalah alat pembuatan prototipe AI untuk menemukan game yang layak dirilis. Keduanya mencakup tahap yang berbeda, dan menggunakan keduanya—membuat prototipe dengan cepat, lalu mengembangkan pemenangnya dengan benar—biasanya lebih cerdas daripada memilih salah satu.</p>
<h3 id="apakah-cinevva-sudah-dapat-mengekspor-ke-mini-game-wechat-saat-ini" tabindex="-1">Apakah Cinevva sudah dapat mengekspor ke mini game WeChat saat ini? <a class="header-anchor" href="#apakah-cinevva-sudah-dapat-mengekspor-ke-mini-game-wechat-saat-ini" aria-label="Permalink to &quot;Apakah Cinevva sudah dapat mengekspor ke mini game WeChat saat ini?&quot;"></a></h3>
<p>Mode mini game WeChat Cinevva membuat game Anda di dalam subset portabel yang dapat di-porting dengan rapi, dan game tersebut sudah dapat berjalan di browser saat ini. Eksportir yang menghasilkan proyek WeChat DevTools siap kirim masih dalam pengembangan. Sebaliknya, Cocos saat ini sudah dapat mengekspor ke WeChat melalui alur kelas utama yang telah selesai.</p>
<h3 id="mengapa-cocos-lebih-baik-untuk-batas-4-mb" tabindex="-1">Mengapa Cocos lebih baik untuk batas 4 MB? <a class="header-anchor" href="#mengapa-cocos-lebih-baik-untuk-batas-4-mb" aria-label="Permalink to &quot;Mengapa Cocos lebih baik untuk batas 4 MB?&quot;"></a></h3>
<p>Karena runtime engine Cocos tertanam dalam klien WeChat itu sendiri, sehingga tidak dihitung dalam paket awal 4 MB Anda, dan sistem AssetBundle miliknya membagi sisanya dengan rapi ke dalam subpaket sesuai permintaan. Ini merupakan keunggulan struktural yang tidak dimiliki engine lain, dan itulah alasan sebagian besar mini game WeChat dibuat dengan Cocos.</p>
<h3 id="mana-yang-sebaiknya-digunakan-developer-solo" tabindex="-1">Mana yang sebaiknya digunakan developer solo? <a class="header-anchor" href="#mana-yang-sebaiknya-digunakan-developer-solo" aria-label="Permalink to &quot;Mana yang sebaiknya digunakan developer solo?&quot;"></a></h3>
<p>Mulailah di Cinevva untuk menemukan ide yang benar-benar seru tanpa harus menghabiskan waktu berhari-hari di dalam editor terlebih dahulu. Jika sebuah prototipe terbukti berhasil dan membutuhkan optimalisasi berat agar memenuhi batas 4 MB, pindahkan prototipe tersebut ke Cocos. Untuk sebagian besar eksperimen awal, kecepatan prompt-to-game merupakan pengungkit yang lebih besar.</p>
<h3 id="apakah-engine-mengubah-dokumen-yang-saya-perlukan-di-tiongkok" tabindex="-1">Apakah engine mengubah dokumen yang saya perlukan di Tiongkok? <a class="header-anchor" href="#apakah-engine-mengubah-dokumen-yang-saya-perlukan-di-tiongkok" aria-label="Permalink to &quot;Apakah engine mengubah dokumen yang saya perlukan di Tiongkok?&quot;"></a></h3>
<p>Tidak. Hak cipta perangkat lunak, pendaftaran ICP, dan banhao untuk game berbayar adalah persyaratan platform dan regulasi yang sama, baik Anda membuat game dengan Cocos, Cinevva, maupun alat lainnya.</p>
<BuildCta
  title="Buat prototipe ide sebelum Anda mengembangkannya di Cocos"
  desc="Jelaskan sebuah mini game dan mainkan di browser Anda dalam hitungan menit. Pertahankan satu yang benar-benar seru."
  prompt="Buat game arkade satu ketukan yang sulit berhenti dimainkan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/wechat-mini-game-engines.html">Engine Game untuk Mini Game WeChat</a> — perbandingan Cocos, LayaAir, Egret, Unity, dan Tuanjie dalam menghadapi batas 4 MB</li>
<li><a href="/id/guides/cocos-alternatives.html">Alternatif Cocos untuk Mini Game</a> — semua pilihan, dipilih berdasarkan alasan Anda mencari alternatif di luar Cocos</li>
<li><a href="/id/guides/cinevva-to-cocos-workflow.html">Dari Cinevva ke Cocos: Serah Terima Mini Game</a> — cara membuat prototipe di sini dan mengembangkan pemenangnya di Cocos</li>
<li><a href="/id/guides/china-mini-game-platforms.html">Perbandingan Platform Mini Game &amp; HTML5 Tiongkok</a> — WeChat, Douyin, QQ, 4399, dan platform lainnya</li>
<li><a href="/id/guides/publish-wechat-douyin-mini-games.html">Cara Menerbitkan Mini Game di WeChat &amp; Douyin</a> — lisensi, peninjauan, dan pembagian pendapatan</li>
<li><a href="/id/news/2026-07-19-wechat-mini-game-mode.html">Mode mini game WeChat</a> — cara Cinevva membuat game di dalam subset portabel</li>
<li><a href="/id/engine.html">Engine Cinevva</a> — engine sumber terbuka kami yang mengutamakan web</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/cinevva-vs-cocos-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Alternatif Cocos untuk Mini Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/cocos-alternatives</link>
            <guid>https://app.cinevva.com/id/guides/cocos-alternatives</guid>
            <pubDate>Sun, 19 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Alternatif nyata untuk Cocos Creator bagi mini game dan game web pada 2026, dipilih berdasarkan alasan Anda mencarinya. LayaAir, Egret, SDK konversi Unity, Tuanjie, Three.js, dan pendekatan AI dari prompt menjadi game, lengkap dengan penilaian jujur untuk masing-masing.]]></description>
            <content:encoded><![CDATA[<h1 id="alternatif-cocos-untuk-mini-game-2026" tabindex="-1">Alternatif Cocos untuk Mini Game (2026) <a class="header-anchor" href="#alternatif-cocos-untuk-mini-game-2026" aria-label="Permalink to &quot;Alternatif Cocos untuk Mini Game (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/cocos-alternatives-hero.jpg?v=1" alt="Alternatif Cocos untuk mini game pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Cocos Creator adalah engine standar untuk mini game WeChat dan Douyin, dan biasanya menjadi pilihan tepat untuk merilis game yang sudah selesai. Namun, &quot;standar&quot; bukan berarti &quot;satu-satunya&quot;, dan ada alasan nyata untuk mempertimbangkan pilihan lain: Anda menginginkan alur kerja yang berbeda, sedang mem-porting game yang sudah ada, ingin AI membuat draf pertama, atau sekadar ingin menguji apakah sebuah ide menyenangkan sebelum berkomitmen pada engine lengkap.</p>
<p>Panduan ini mengelompokkan alternatif berdasarkan alasan Anda mencarinya, bukan berdasarkan peringkat. Untuk pembahasan lebih mendalam tentang setiap engine dan batas 4 MB, lihat <a href="/id/guides/wechat-mini-game-engines.html">panduan engine mini game WeChat</a>.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alternatif</th>
<th>Alasan terbaik untuk memilihnya</th>
<th>2D/3D</th>
<th>Dukungan WeChat</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>LayaAir</strong></td>
<td>Anda lebih menyukai alur kerjanya, target WeChat kelas utama</td>
<td>2D + 3D</td>
<td>Kuat, tetapi engine menghabiskan anggaran paket</td>
</tr>
<tr>
<td><strong>Egret</strong></td>
<td>Memelihara game Egret yang sudah ada</td>
<td>2D</td>
<td>Lama, ekosistem makin menyusut</td>
</tr>
<tr>
<td><strong>Unity (SDK konversi)</strong></td>
<td>Mem-porting game Unity yang sudah ada</td>
<td>2D + 3D</td>
<td>Konversi WebGL, ukuran build besar</td>
</tr>
<tr>
<td><strong>Tuanjie (Unity China)</strong></td>
<td>Keahlian Unity, berkomitmen pada pasar Tiongkok</td>
<td>2D + 3D</td>
<td>Target ekspor WeChat native</td>
</tr>
<tr>
<td><strong>Three.js + weapp-adapter</strong></td>
<td>Game khusus berukuran kecil, tim Anda terbiasa dengan Three.js</td>
<td>2D + 3D</td>
<td>Anda menangani seluruh infrastrukturnya</td>
</tr>
<tr>
<td><strong>Cinevva (AI dari prompt menjadi game)</strong></td>
<td>Membuat prototipe sebelum berkomitmen pada engine apa pun</td>
<td>3D</td>
<td>Mode subset portabel; eksportir sedang dikembangkan</td>
</tr>
</tbody>
</table>
<h2 id="jika-anda-menginginkan-engine-wechat-kelas-utama-layaair" tabindex="-1">Jika Anda menginginkan engine WeChat kelas utama: LayaAir <a class="header-anchor" href="#jika-anda-menginginkan-engine-wechat-kelas-utama-layaair" aria-label="Permalink to &quot;Jika Anda menginginkan engine WeChat kelas utama: LayaAir&quot;"></a></h2>
<p>LayaAir adalah alternatif yang paling sebanding. Engine ini sejak awal beradaptasi dengan WeChat, memperlakukannya sebagai target build kelas utama, mendukung 2D dan 3D, menggunakan TypeScript, serta memiliki basis pengembang setia yang memang lebih menyukai alur kerjanya dibandingkan Cocos. Pengembang yang pernah memakai keduanya cenderung menganggap pilihan tersebut sebagai masalah selera, bukan kemampuan. Satu komprominya: runtime LayaAir tidak tertanam di klien WeChat seperti Cocos, sehingga engine itu sendiri memakai lebih banyak dari anggaran 4 MB Anda. Tidak menjadi masalah untuk 2D berukuran kecil, tetapi lebih ketat untuk 3D dengan banyak aset.</p>
<h2 id="jika-anda-mem-porting-game-yang-sudah-ada-unity-atau-tuanjie" tabindex="-1">Jika Anda mem-porting game yang sudah ada: Unity atau Tuanjie <a class="header-anchor" href="#jika-anda-mem-porting-game-yang-sudah-ada-unity-atau-tuanjie" aria-label="Permalink to &quot;Jika Anda mem-porting game yang sudah ada: Unity atau Tuanjie&quot;"></a></h2>
<p>Jika game Anda sudah dibuat di Unity, jangan menulisnya ulang. Tencent dan Unity memelihara SDK konversi resmi yang mengubah build Unity WebGL menjadi paket mini game, dengan ekspor sekali klik sejak pertengahan 2025. Bersikaplah realistis mengenai komprominya: build Unity WebGL berukuran besar, dan batas paket awal 4 MB sangat menyulitkan engine yang tidak dirancang untuk itu. Jadi, bersiaplah mengerahkan upaya nyata untuk mengurangi ukuran dan membagi paket. Jika Anda berkomitmen pada pasar Tiongkok untuk jangka panjang dan sudah sangat terbiasa dengan Unity, Tuanjie (engine lokal dari Unity China) memperlakukan WeChat sebagai target ekspor native, bukan konversi WebGL, sehingga menghindari sebagian besar pembengkakan ukuran tersebut.</p>
<h2 id="jika-anda-menginginkan-kendali-maksimal-three-js-dan-webgl-mentah" tabindex="-1">Jika Anda menginginkan kendali maksimal: Three.js dan WebGL mentah <a class="header-anchor" href="#jika-anda-menginginkan-kendali-maksimal-three-js-dan-webgl-mentah" aria-label="Permalink to &quot;Jika Anda menginginkan kendali maksimal: Three.js dan WebGL mentah&quot;"></a></h2>
<p>Anda dapat menjalankan Three.js atau WebGL yang ditulis manual di dalam mini game melalui <code>weapp-adapter</code> milik WeChat, yang menyediakan tiruan objek DOM dan canvas yang diharapkan oleh pustaka tersebut. Ini merupakan pilihan paling fleksibel sekaligus paling merepotkan: Anda bertanggung jawab atas render loop, pipeline aset, pembagian paket, dan setiap kasus khusus pada adapter. Pendekatan ini cocok untuk game khusus berukuran kecil yang sensitif terhadap ukuran, atau ketika tim Anda sudah terbiasa dengan Three.js. Ini juga merupakan jalur yang paling mendekati game browser yang sudah Anda buat.</p>
<h2 id="jika-anda-memelihara-sistem-lama-egret-dengan-memahami-risikonya" tabindex="-1">Jika Anda memelihara sistem lama: Egret, dengan memahami risikonya <a class="header-anchor" href="#jika-anda-memelihara-sistem-lama-egret-dengan-memahami-risikonya" aria-label="Permalink to &quot;Jika Anda memelihara sistem lama: Egret, dengan memahami risikonya&quot;"></a></h2>
<p>Egret (白鹭) adalah engine HTML5 2D lama yang mendukung banyak game pada gelombang awal mini game. Engine ini masih berfungsi, tetapi momentum telah beralih ke Cocos dan Laya. Memulai proyek baru dengannya pada 2026 berarti bertaruh pada ekosistem yang terus menyusut. Gunakan untuk memelihara game Egret yang sudah ada; jangan memulai proyek baru dengannya.</p>
<h2 id="jika-anda-ingin-melewati-editor-sepenuhnya-alat-ai-dari-prompt-menjadi-game" tabindex="-1">Jika Anda ingin melewati editor sepenuhnya: alat AI dari prompt menjadi game <a class="header-anchor" href="#jika-anda-ingin-melewati-editor-sepenuhnya-alat-ai-dari-prompt-menjadi-game" aria-label="Permalink to &quot;Jika Anda ingin melewati editor sepenuhnya: alat AI dari prompt menjadi game&quot;"></a></h2>
<p>Kategori terbaru bukanlah editor lain, melainkan tidak membuka editor sama sekali. Dengan Cinevva, Anda mendeskripsikan game menggunakan bahasa sehari-hari, dalam bahasa Inggris atau Mandarin, lalu mendapatkan game 3D yang dapat dimainkan di browser dalam hitungan menit. Sembilan model spesialis menangani 3D, animasi, adegan, musik, suara, efek, UI, logika, dan multipemain.</p>
<p>Ini bukan pengganti Cocos, dan kami tidak berpura-pura demikian. Cocos digunakan untuk menyelesaikan dan mengoptimalkan game; Cinevva ditujukan untuk tahap sebelumnya, yaitu mencari tahu ide mana yang layak diselesaikan. <a href="/id/news/2026-07-19-wechat-mini-game-mode.html">Mode mini game WeChat</a> miliknya membangun game di dalam subset portabel sejak prompt pertama (UI canvas, kontrol yang mengutamakan sentuhan, audio mp3, tanpa kode dinamis, dan gerbang boot WebGL2), sementara sandbox mode ketat menandai apa pun yang dapat menggagalkan proses porting ke WeChat. Alur kerja yang realistis adalah membuat prototipe dengan cepat di sini, mempertahankan game yang terbukti memiliki retensi, lalu memutuskan apakah game tersebut akan dirilis apa adanya atau layak dibuat secara menyeluruh di Cocos. Anggap Cinevva sebagai bagian awal funnel yang memasok game ke engine yang pada akhirnya Anda gunakan untuk merilisnya.</p>
<h2 id="cara-memilih" tabindex="-1">Cara Memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara Memilih&quot;"></a></h2>
<p>Cocokkan alat dengan alasan Anda mencari pilihan selain Cocos. Lebih menyukai alur kerja berbeda: LayaAir. Mem-porting game Unity yang sudah ada: SDK konversi, atau Tuanjie untuk jangka panjang. Game kecil, khusus, atau sudah dibuat dengan Three.js: <code>weapp-adapter</code> dan WebGL mentah. Memelihara game lama: Egret. Ingin memvalidasi ide sebelum berkomitmen pada engine apa pun: gunakan alat AI dari prompt menjadi game, lalu pindahkan ide terbaik ke Cocos atau Laya jika layak mendapatkan penyempurnaan.</p>
<h2 id="gerbang-regulasi-tidak-bergantung-pada-engine" tabindex="-1">Gerbang Regulasi (tidak bergantung pada engine) <a class="header-anchor" href="#gerbang-regulasi-tidak-bergantung-pada-engine" aria-label="Permalink to &quot;Gerbang Regulasi (tidak bergantung pada engine)&quot;"></a></h2>
<p>Tidak ada alternatif yang mengubah aturan penerbitan. Mini game gratis yang didukung iklan memerlukan hak cipta perangkat lunak per judul (软著) atau sertifikasi hak cipta elektronik, ditambah pendaftaran ICP. Proses ini dapat dilakukan oleh individu yang memiliki kartu identitas Tiongkok daratan. Pembelian dalam aplikasi apa pun memerlukan banhao, yang hanya dapat dimiliki oleh perusahaan Tiongkok. Karena itu, studio asing memerlukan penerbit lokal berlisensi. Lihat <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan</a>. Pilih engine berdasarkan kebutuhan build; dokumennya tetap sama di mana pun.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-alternatif-terbaik-untuk-cocos-bagi-mini-game-wechat" tabindex="-1">Apa alternatif terbaik untuk Cocos bagi mini game WeChat? <a class="header-anchor" href="#apa-alternatif-terbaik-untuk-cocos-bagi-mini-game-wechat" aria-label="Permalink to &quot;Apa alternatif terbaik untuk Cocos bagi mini game WeChat?&quot;"></a></h3>
<p>LayaAir adalah alternatif langsung yang paling dekat, dengan dukungan WeChat kelas utama dan alur kerja TypeScript 2D/3D yang serupa. Komprominya adalah runtime LayaAir tidak tertanam di klien WeChat, sehingga memakai lebih banyak dari anggaran 4 MB Anda. Untuk mem-porting game Unity yang sudah ada, SDK konversi Unity atau Tuanjie lebih cocok.</p>
<h3 id="apakah-ada-alternatif-gratis-untuk-cocos" tabindex="-1">Apakah ada alternatif gratis untuk Cocos? <a class="header-anchor" href="#apakah-ada-alternatif-gratis-untuk-cocos" aria-label="Permalink to &quot;Apakah ada alternatif gratis untuk Cocos?&quot;"></a></h3>
<p>Ya. Cocos sendiri gratis dan sumber terbuka, begitu pula LayaAir, Three.js, dan pendekatan pembuatan prototipe dengan AI di browser. Unity gratis selama pendapatan Anda masih di bawah batasnya. Biaya jarang menjadi faktor penentu di antara pilihan ini; alur kerja dan titik awal Anda jauh lebih penting.</p>
<h3 id="bisakah-saya-menggunakan-ai-sebagai-pengganti-cocos-untuk-membuat-mini-game" tabindex="-1">Bisakah saya menggunakan AI sebagai pengganti Cocos untuk membuat mini game? <a class="header-anchor" href="#bisakah-saya-menggunakan-ai-sebagai-pengganti-cocos-untuk-membuat-mini-game" aria-label="Permalink to &quot;Bisakah saya menggunakan AI sebagai pengganti Cocos untuk membuat mini game?&quot;"></a></h3>
<p>Anda dapat menggunakan AI untuk membuat prototipe dengan cepat. Cinevva mengubah prompt menjadi game yang dapat dimainkan dan membangunnya di dalam subset portabel WeChat, sehingga ideal untuk menemukan ide yang layak dikembangkan lebih lanjut. Untuk game produksi akhir yang sangat dioptimalkan, engine matang seperti Cocos masih menjadi alat yang lebih kuat. Karena itu, pola yang umum adalah membuat prototipe dengan AI, lalu membangun ide terbaik di Cocos.</p>
<h3 id="alternatif-mana-yang-terbaik-untuk-mem-porting-game-yang-sudah-ada" tabindex="-1">Alternatif mana yang terbaik untuk mem-porting game yang sudah ada? <a class="header-anchor" href="#alternatif-mana-yang-terbaik-untuk-mem-porting-game-yang-sudah-ada" aria-label="Permalink to &quot;Alternatif mana yang terbaik untuk mem-porting game yang sudah ada?&quot;"></a></h3>
<p>Jika game tersebut dibuat dengan Unity, SDK konversi WeChat memungkinkan Anda mem-porting-nya tanpa menulis ulang, sedangkan Tuanjie merupakan pilihan yang lebih siap untuk masa depan jika Anda berkomitmen pada pasar Tiongkok. Jika game tersebut dibuat dengan Three.js atau WebGL, <code>weapp-adapter</code> adalah jalurnya. Jika sudah berupa game browser, strukturnya telah mendekati apa yang dibutuhkan WeChat.</p>
<BuildCta
  title="Uji idenya sebelum Anda memilih engine"
  desc="Deskripsikan mini game dan mainkan di browser dalam hitungan menit, lalu pindahkan ide terbaik ke engine lengkap."
  prompt="Buat game menyusun objek berbasis fisika yang penuh warna dan sulit berhenti dimainkan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/cinevva-vs-cocos.html">Cinevva vs Cocos untuk Mini Game</a> — perbedaan antara pembuatan prototipe dan produksi secara mendetail</li>
<li><a href="/id/guides/cinevva-to-cocos-workflow.html">Dari Cinevva ke Cocos: Serah Terima Mini Game</a> — buat prototipe di sini, lalu bangun ide terbaik di Cocos</li>
<li><a href="/id/guides/wechat-mini-game-engines.html">Engine Game untuk Mini Game WeChat</a> — seluruh pilihan engine dan batas 4 MB</li>
<li><a href="/id/guides/china-mini-game-platforms.html">Perbandingan Platform Mini Game &amp; HTML5 Tiongkok</a> — WeChat, Douyin, QQ, 4399, dan lainnya</li>
<li><a href="/id/guides/publish-wechat-douyin-mini-games.html">Cara Menerbitkan Mini Game di WeChat &amp; Douyin</a> — lisensi, peninjauan, pembagian pendapatan</li>
<li><a href="/id/guides/localize-web-game-china.html">Melokalkan Game Web untuk Tiongkok</a> — font, hosting, pembayaran</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang mengutamakan web</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/cocos-alternatives-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Generator Model 3D AI Terbaik pada 2026 (Teks-ke-3D dan Gambar-ke-3D)]]></title>
            <link>https://app.cinevva.com/id/guides/ai-3d-model-generators</link>
            <guid>https://app.cinevva.com/id/guides/ai-3d-model-generators</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Generator model 3D AI terbaik pada 2026 untuk teks-ke-3D dan gambar-ke-3D. Perbandingan Meshy 6, Tripo, Rodin, TRELLIS.2, Hunyuan3D, dan SAM 3D, lengkap dengan penjelasan lisensi.]]></description>
            <content:encoded><![CDATA[<h1 id="generator-model-3d-ai-terbaik-pada-2026-teks-ke-3d-dan-gambar-ke-3d" tabindex="-1">Generator Model 3D AI Terbaik pada 2026 (Teks-ke-3D dan Gambar-ke-3D) <a class="header-anchor" href="#generator-model-3d-ai-terbaik-pada-2026-teks-ke-3d-dan-gambar-ke-3d" aria-label="Permalink to &quot;Generator Model 3D AI Terbaik pada 2026 (Teks-ke-3D dan Gambar-ke-3D)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Jawaban singkatnya: Meshy 6 dan Tripo adalah generator model 3D AI ter-hosting terbaik pada 2026, Rodin Gen-2.5 unggul dalam detail geometri mentah, dan TRELLIS.2 dari Microsoft (lisensi MIT) adalah model terbaik yang bisa Anda jalankan sendiri. Jika ingin mencoba gambar-ke-3D secara gratis di browser tanpa instalasi, <a href="/id/tools/hunyuan3d.html">Generator Model 3D</a> dari Cinevva mengubah foto atau prompt teks menjadi mesh PBR bertekstur yang dapat diunduh sebagai GLB atau OBJ.</p>
<p>Panduan ini hanya membahas pembuatan 3D secara mendalam. Untuk tekstur, audio, dan bagian lain dari pipeline aset AI, lihat <a href="/id/guides/ai-asset-generators-games.html">panduan generator aset AI</a> kami.</p>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<ul>
<li><strong>Alat ter-hosting serbaguna terbaik:</strong> Meshy 6 (opsi topologi bersih, Mode Low Poly, ekosistem besar).</li>
<li><strong>Alat ter-hosting terbaik untuk pipeline game:</strong> Tripo (engine v3.1, auto-rigging, quad remesh, kredit murah).</li>
<li><strong>Detail geometri terbaik:</strong> Rodin Gen-2.5 dari Hyper3D (detail setara sculpt, keluaran 10 juta+ poligon).</li>
<li><strong>Model sumber terbuka terbaik:</strong> Microsoft TRELLIS.2 (lisensi MIT, PBR native, tanpa syarat tambahan).</li>
<li><strong>Terbaik yang gratis dan berbasis browser:</strong> <a href="/id/tools/hunyuan3d.html">Generator Model 3D</a> dan <a href="/id/tools/sam3d.html">rekonstruksi Gambar ke 3D</a> dari Cinevva.</li>
</ul>
<h2 id="sekilas-perbandingan" tabindex="-1">Sekilas perbandingan <a class="header-anchor" href="#sekilas-perbandingan" aria-label="Permalink to &quot;Sekilas perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Jenis</th>
<th>Input</th>
<th>Output</th>
<th>Penggunaan komersial</th>
<th>Paket gratis</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Meshy 6</strong></td>
<td>Ter-hosting</td>
<td>Teks, gambar</td>
<td>GLB, FBX, OBJ, STL, peta PBR</td>
<td>Paket berbayar (gratis = CC BY 4.0)</td>
<td>100 kredit/bulan</td>
</tr>
<tr>
<td><strong>Tripo (v3.1)</strong></td>
<td>Ter-hosting</td>
<td>Teks, gambar</td>
<td>GLB, FBX, OBJ, STL, PBR, auto-rig</td>
<td>Paket berbayar</td>
<td>Ya, nonkomersial</td>
</tr>
<tr>
<td><strong>Rodin Gen-2.5</strong></td>
<td>Ter-hosting</td>
<td>Teks, gambar, multi-gambar</td>
<td>Mesh dengan PBR, opsi quad</td>
<td>Paket berbayar</td>
<td>Gratis untuk membuat</td>
</tr>
<tr>
<td><strong>Hi3D (Hitem3D)</strong></td>
<td>Ter-hosting</td>
<td>Gambar, multi-gambar</td>
<td>Mesh resolusi tinggi</td>
<td>Paket berbayar</td>
<td>Kredit uji coba</td>
</tr>
<tr>
<td><strong>Tencent Hunyuan 3D</strong></td>
<td>Ter-hosting</td>
<td>Teks, gambar, sketsa</td>
<td>OBJ, GLB, PBR</td>
<td>Periksa ketentuan paket</td>
<td>20 pembuatan/hari</td>
</tr>
<tr>
<td><strong>Cinevva 3D Generator</strong></td>
<td>Ter-hosting, gratis</td>
<td>Teks, gambar</td>
<td>GLB, OBJ, PBR</td>
<td>Ya</td>
<td>Sepenuhnya gratis</td>
</tr>
<tr>
<td><strong>TRELLIS.2</strong></td>
<td>Sumber terbuka (MIT)</td>
<td>Gambar</td>
<td>GLB, OBJ, PLY, PBR hingga 4K</td>
<td>Ya</td>
<td>Hosting mandiri</td>
</tr>
<tr>
<td><strong>Hunyuan3D 2.1</strong></td>
<td>Sumber terbuka</td>
<td>Gambar</td>
<td>Mesh + PBR</td>
<td>Ya, dengan batasan wilayah</td>
<td>Hosting mandiri</td>
</tr>
<tr>
<td><strong>SAM 3D</strong></td>
<td>Sumber terbuka</td>
<td>Satu foto</td>
<td>Gaussian splat, geometri</td>
<td>Ya (Lisensi SAM)</td>
<td>Hosting mandiri</td>
</tr>
<tr>
<td><strong>SPAR3D</strong></td>
<td>Sumber terbuka</td>
<td>Satu foto</td>
<td>Mesh GLB bertekstur</td>
<td>Ya, jika pendapatan di bawah $1 juta</td>
<td>Hosting mandiri</td>
</tr>
</tbody>
</table>
<p>Diverifikasi pada Juli 2026. Bidang ini berubah setiap bulan, jadi periksa ketentuan setiap alat sebelum Anda merilis proyek.</p>
<h2 id="alat-ter-hosting" tabindex="-1">Alat ter-hosting <a class="header-anchor" href="#alat-ter-hosting" aria-label="Permalink to &quot;Alat ter-hosting&quot;"></a></h2>
<h3 id="meshy" tabindex="-1">Meshy <a class="header-anchor" href="#meshy" aria-label="Permalink to &quot;Meshy&quot;"></a></h3>
<p>Generator 3D AI paling populer, dan pada 2026 merupakan produk yang paling lengkap. Engine saat ini adalah Meshy 6, yang memasuki pratinjau publik pada Oktober 2025 dan tersedia secara umum pada Januari 2026. Peningkatan utamanya mencakup geometri kedap air, Mode Low Poly yang secara khusus ditujukan bagi developer game, serta quad remeshing native sehingga Anda bisa mendapatkan model dengan edge loop yang sebenarnya, bukan sekadar tumpukan segitiga.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Ter-hosting</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Teks-ke-3D dan gambar-ke-3D</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>GLB, FBX, OBJ, STL, dengan peta tekstur PBR serta topologi quad atau tri</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Pro dan paket di atasnya. Model dari paket gratis dipublikasikan di bawah CC BY 4.0</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>100 kredit/bulan, direset setiap bulan</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Prop game dan aset serbaguna dengan kebutuhan pembersihan paling sedikit</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: Meshy adalah pilihan standar yang aman. Kualitas keluarannya konsisten bagus, meski tidak selalu mencengangkan, alat topologinya merupakan yang terbaik di antara generator ter-hosting, dan paket Pro seharga $20/bulan dengan 1.000 kredit serta kepemilikan privat penuh tergolong wajar. Kekurangan paket gratisnya adalah model Anda dipublikasikan di bawah CC BY 4.0, sehingga siapa pun dapat menggunakannya dan Anda wajib mencantumkan atribusi kepada Meshy jika merilisnya. <a href="https://www.meshy.ai" target="_blank" rel="noreferrer">meshy.ai</a></p>
<h3 id="tripo" tabindex="-1">Tripo <a class="header-anchor" href="#tripo" aria-label="Permalink to &quot;Tripo&quot;"></a></h3>
<p>Tripo berasal dari VAST, tim yang mengembangkan TripoSR bersama Stability AI, dan kecepatannya mencerminkan pengalaman tersebut. Engine v3.1 saat ini mampu menangani prompt teks yang kompleks dengan baik, dan platformnya dibangun untuk alur kerja game: auto-rigging, quad remesh sebagai fitur tambahan sekali klik, dan opsi Smart Mesh untuk topologi siap pakai dalam game.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Ter-hosting</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Teks-ke-3D dan gambar-ke-3D</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>GLB, FBX, OBJ, STL, tekstur PBR 4K, auto-rig opsional</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Pro dan paket di atasnya. Paket gratis hanya untuk penggunaan nonkomersial</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>Ya, dengan kredit bulanan, hanya untuk penggunaan pribadi</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Karakter dan makhluk yang ingin Anda rig dengan cepat</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: paket Pro Tripo seharga $19,90/bulan menyediakan 3.000 kredit, kira-kira 120 pembuatan, yang merupakan nilai kredit terbaik di antara tiga pemain besar. Kualitas rigging-nya bagus untuk humanoid, tetapi tidak konsisten untuk makhluk dengan jumlah anggota tubuh yang tidak lazim. Keluaran paket gratis sama sekali tidak boleh dikomersialkan, yang lebih ketat daripada skema CC BY 4.0 milik Meshy. <a href="https://www.tripo3d.ai" target="_blank" rel="noreferrer">tripo3d.ai</a></p>
<h3 id="rodin-hyper3d" tabindex="-1">Rodin (Hyper3D) <a class="header-anchor" href="#rodin-hyper3d" aria-label="Permalink to &quot;Rodin (Hyper3D)&quot;"></a></h3>
<p>Rodin selalu menjadi pilihan bagi mereka yang sangat mementingkan topologi, dan Gen-2.5 (dirilis Mei 2026) membawanya lebih jauh. Model ini menghasilkan detail setara sculpt hingga lebih dari 10 juta poligon, menyediakan pengaturan &quot;tingkat pemrosesan&quot; lima level yang menukar kecepatan dengan kualitas (sekitar 1 juta poligon dalam 4 detik pada pengaturan terendah), serta menambahkan 3D ControlNet, penyuntingan 3D terlokalisasi, dan penyempurnaan per bagian.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Ter-hosting</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Teks, gambar, penggabungan multi-gambar</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>Mesh high-poly dengan PBR, topologi quad pada paket yang lebih tinggi</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Paket berbayar. Creator $30/bulan, Business $120/bulan</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>Gratis untuk membuat dan melihat pratinjau, bayar untuk mengunduh</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Aset utama dan model dengan banyak detail ketika topologi sangat penting</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: detail keluarannya adalah yang terbaik di antara alat ter-hosting, dan fitur penyuntingannya (3D inpainting, membuat ulang satu bagian model) lebih maju daripada semua pesaing. Alat ini juga yang paling mahal, sementara tekstur 4K dan ekspor quad high-poly hanya tersedia pada paket Business seharga $120/bulan. Gunakan untuk sepuluh aset yang benar-benar penting, bukan dua ratus aset yang tidak terlalu penting. <a href="https://hyper3d.ai" target="_blank" rel="noreferrer">hyper3d.ai</a></p>
<h3 id="hi3d-sebelumnya-hitem3d" tabindex="-1">Hi3D (sebelumnya Hitem3D) <a class="header-anchor" href="#hi3d-sebelumnya-hitem3d" aria-label="Permalink to &quot;Hi3D (sebelumnya Hitem3D)&quot;"></a></h3>
<p>Pendatang penting pada 2026. Dibangun oleh Math Magic berdasarkan dua model riset yang telah dipublikasikan, Sparc3D (NeurIPS 2025, geometri kedap air beresolusi tinggi) dan Ultra3D (akselerasi berbasis perhatian pada bagian), alat ini menghasilkan model dengan resolusi voxel hingga 1536³, fidelitas geometri mentah tertinggi di antara semua alat ter-hosting. Namanya diubah dari Hitem3D menjadi Hi3D pada 2026.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Ter-hosting</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Gambar dan multi-gambar</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>Mesh kedap air beresolusi tinggi</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Paket berbayar, periksa ketentuan terbaru</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>Kredit uji coba</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Pekerjaan yang mengutamakan detail: miniatur, barang koleksi, pencetakan 3D</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: alat ini telah menjadi pilihan utama untuk alur kerja yang berfokus pada pencetakan, ketika geometri kedap air dan detail halus lebih penting daripada yang lain. Untuk game, Anda perlu mengurangi poligon keluarannya secara drastis, jadi alat ini paling masuk akal saat Anda membutuhkan satu prop utama yang sangat indah. <a href="https://www.hi3d.ai" target="_blank" rel="noreferrer">hi3d.ai</a></p>
<h3 id="tencent-hunyuan-3d-platform-ter-hosting" tabindex="-1">Tencent Hunyuan 3D (platform ter-hosting) <a class="header-anchor" href="#tencent-hunyuan-3d-platform-ter-hosting" aria-label="Permalink to &quot;Tencent Hunyuan 3D (platform ter-hosting)&quot;"></a></h3>
<p>Tencent membawa keluarga model Hunyuan3D ke pasar global pada November 2025 melalui platform berbahasa Inggris di 3d.hunyuanglobal.com, yang menjalankan engine terbarunya (3.0, serta 3.1 sejak Januari 2026) yang tidak dirilis sebagai sumber terbuka. Pada 2026, platform ini berkembang menjadi HY 3D Studio, sebuah pipeline lengkap: gambar ke 3D, retopologi, UV, tekstur, rigging, hingga animasi.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Ter-hosting (model terbaru), bobot terbuka untuk versi lama</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Teks, gambar, sketsa</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>OBJ, GLB dengan tekstur PBR</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Periksa ketentuan paket, API perusahaan melalui Tencent Cloud</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>20 pembuatan gratis per hari</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Eksperimen gratis yang leluasa dengan engine mutakhir</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: 20 pembuatan gratis sehari merupakan jatah gratis paling besar di antara model mutakhir ter-hosting, dan engine 3.x menghasilkan geometri yang jelas lebih baik daripada bobot terbuka 2.1. Platform ini masih tergolong baru bagi pengguna Barat, jadi baca ketentuan hak atas keluaran sebelum membangun pipeline yang bergantung padanya. <a href="https://3d.hunyuanglobal.com" target="_blank" rel="noreferrer">3d.hunyuanglobal.com</a></p>
<h3 id="hilang-pada-2026-luma-genie-dan-csm" tabindex="-1">Hilang pada 2026: Luma Genie dan CSM <a class="header-anchor" href="#hilang-pada-2026-luma-genie-dan-csm" aria-label="Permalink to &quot;Hilang pada 2026: Luma Genie dan CSM&quot;"></a></h3>
<p>Dua nama yang masih akan Anda temukan dalam rangkuman lama pada dasarnya sudah tidak aktif. Alat teks-ke-3D Genie milik Luma tidak lagi muncul di situs Luma, yang kini sepenuhnya beralih ke pembuatan video dan agen kreatif. CSM (Common Sense Machines) menutup platform Cube pada 5 Januari 2026, dan perusahaan tersebut diakuisisi oleh Google pada bulan yang sama. Jangan memulai proyek baru dengan keduanya.</p>
<h2 id="model-sumber-terbuka" tabindex="-1">Model sumber terbuka <a class="header-anchor" href="#model-sumber-terbuka" aria-label="Permalink to &quot;Model sumber terbuka&quot;"></a></h2>
<p>Model terbuka membalik kesepakatannya: Anda menyediakan GPU, dan sebagai gantinya tidak ada meteran kredit maupun paket yang membatasi hak komersial Anda. Hanya lisensi model itu sendiri yang berlaku.</p>
<h3 id="microsoft-trellis-2" tabindex="-1">Microsoft TRELLIS.2 <a class="header-anchor" href="#microsoft-trellis-2" aria-label="Permalink to &quot;Microsoft TRELLIS.2&quot;"></a></h3>
<p>Pemimpin sumber terbuka saat ini. Dirilis pada Desember 2025 di bawah lisensi MIT, TRELLIS.2 adalah model gambar-ke-3D dengan 4 miliar parameter yang dibangun di atas representasi voxel jarang (O-Voxel), sehingga mampu menangani topologi kompleks, tepi tajam, dan material PBR lengkap. Model ini mengekspor GLB dengan tekstur hingga 4096², serta OBJ, PLY, radiance field, dan Gaussian splat.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Sumber terbuka, MIT</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Gambar</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>GLB (PBR hingga 4K), OBJ, PLY, radiance field, Gaussian splat</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Ya, tanpa batasan</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>Gratis selamanya jika Anda memiliki GPU</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Rasio kualitas dan kebebasan terbaik dalam pembuatan 3D saat ini</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: lisensi MIT berarti tidak ada ambiguitas komersial, dan kualitas keluarannya benar-benar mampu bersaing dengan alat ter-hosting berbayar. Anda memerlukan GPU NVIDIA yang mumpuni untuk menjalankannya secara lokal, atau dapat menyewa inferensi per detik di cloud GPU. Jika hanya ingin meng-hosting satu model sendiri, pilih model ini. <a href="https://github.com/microsoft/TRELLIS.2" target="_blank" rel="noreferrer">github.com/microsoft/TRELLIS.2</a></p>
<h3 id="hunyuan3d-2-1-bobot-terbuka" tabindex="-1">Hunyuan3D 2.1 (bobot terbuka) <a class="header-anchor" href="#hunyuan3d-2-1-bobot-terbuka" aria-label="Permalink to &quot;Hunyuan3D 2.1 (bobot terbuka)&quot;"></a></h3>
<p>Rilis Tencent yang sepenuhnya terbuka dari Juni 2025: bobot model dan kode pelatihan lengkap untuk model bentuk 3,3 miliar parameter serta model tekstur PBR 2 miliar parameter. Ini adalah model di balik <a href="/id/tools/hunyuan3d.html">Generator Model 3D</a> gratis dari Cinevva, sekaligus model yang diam-diam dijalankan oleh sebagian besar produk di bidang ini.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Bobot terbuka dan kode pelatihan</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Gambar (teks diproses melalui langkah pembuatan gambar terlebih dahulu)</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>Mesh bertekstur dengan material PBR siap produksi</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Ya, tetapi lisensinya mengecualikan Uni Eropa, Inggris, dan Korea Selatan</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>Gratis untuk di-hosting sendiri</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Tekstur PBR produksi dengan bobot terbuka, fine-tuning</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: model pewarnaan PBR-nya masih menjadi rangkaian tekstur terbuka terkuat, dan kode pelatihan lengkap memungkinkan Anda melakukan fine-tuning dengan gaya visual sendiri. Pengecualian wilayah dalam lisensi komunitasnya (Uni Eropa, Inggris, Korea Selatan) menjadi kendala nyata jika Anda merilis produk di sana; lisensi MIT milik TRELLIS.2 merupakan pilihan yang lebih jelas. <a href="https://github.com/Tencent-Hunyuan/Hunyuan3D-2.1" target="_blank" rel="noreferrer">github.com/Tencent-Hunyuan/Hunyuan3D-2.1</a></p>
<h3 id="sam-3d-meta" tabindex="-1">SAM 3D (Meta) <a class="header-anchor" href="#sam-3d-meta" aria-label="Permalink to &quot;SAM 3D (Meta)&quot;"></a></h3>
<p>Ini bukan generator mesh, dan justru itulah intinya. SAM 3D adalah pasangan model terbuka dari Meta (SAM 3D Objects dan SAM 3D Body) yang merekonstruksi geometri 3D, tekstur, dan tata letak adegan dari satu foto biasa, bahkan ketika terdapat objek tertutup dan latar yang berantakan. Keluaran utamanya adalah Gaussian splat dalam bentuk file .ply. Kode dan checkpoint tersedia di GitHub di bawah Lisensi SAM permisif dari Meta, yang mengizinkan penggunaan komersial.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Sumber terbuka, Lisensi SAM</td>
</tr>
<tr>
<td><strong>Input</strong></td>
<td>Satu foto (ditambah mask objek)</td>
</tr>
<tr>
<td><strong>Output</strong></td>
<td>Gaussian splat (.ply), geometri, tekstur, pose</td>
</tr>
<tr>
<td><strong>Komersial</strong></td>
<td>Ya</td>
</tr>
<tr>
<td><strong>Paket gratis</strong></td>
<td>Gratis untuk di-hosting sendiri, atau gratis di browser melalui Cinevva</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Merekam objek nyata dari satu foto</td>
</tr>
</tbody>
</table>
<p>Pendapat jujur: ini adalah rekonstruksi, bukan pembuatan. Arahkan ke objek nyata dan Anda akan mendapatkan rekonstruksi 3D yang akurat tanpa perangkat fotogrametri. Keluaran splat lebih cocok untuk penayangan dan referensi daripada langsung diimpor ke game (selengkapnya di bawah). Cinevva menjalankannya secara gratis di browser sebagai <a href="/id/tools/sam3d.html">rekonstruksi objek Gambar ke 3D</a>. <a href="https://github.com/facebookresearch/sam-3d-objects" target="_blank" rel="noreferrer">github.com/facebookresearch/sam-3d-objects</a></p>
<h3 id="triposr-dan-spar3d-rekonstruktor-cepat" tabindex="-1">TripoSR dan SPAR3D (rekonstruktor cepat) <a class="header-anchor" href="#triposr-dan-spar3d-rekonstruktor-cepat" aria-label="Permalink to &quot;TripoSR dan SPAR3D (rekonstruktor cepat)&quot;"></a></h3>
<p>Dua model satu-gambar yang lebih lama tetapi masih berguna. TripoSR (Tripo dan Stability AI, lisensi MIT) merekonstruksi mesh dalam waktu kurang dari setengah detik pada GPU pusat data, dengan kualitas yang juga relatif sederhana. SPAR3D (Stability AI, Januari 2025) menghasilkan GLB bertekstur dengan UV yang sudah dibuka dalam waktu kurang dari satu detik dan mendukung penyuntingan pada tingkat titik. SPAR3D dirilis di bawah Stability Community License: gratis untuk penggunaan komersial hingga pendapatan tahunan organisasi Anda melampaui $1 juta, setelah itu Anda memerlukan lisensi perusahaan.</p>
<p>Pendapat jujur: pada 2026, kualitas keduanya telah dikalahkan oleh TRELLIS.2 dan Hunyuan3D 2.1. Keunggulannya adalah kecepatan, yang penting jika Anda membuat mesh secara langsung di dalam aplikasi.</p>
<h3 id="hal-lain-yang-perlu-diketahui" tabindex="-1">Hal lain yang perlu diketahui <a class="header-anchor" href="#hal-lain-yang-perlu-diketahui" aria-label="Permalink to &quot;Hal lain yang perlu diketahui&quot;"></a></h3>
<p>Sparc3D, model NeurIPS 2025 di balik Hi3D, memiliki demo publik di Hugging Face dan menghasilkan mesh kedap air pada resolusi 1024³. Cube 3D dari Roblox menyediakan kode teks-ke-mesh terbuka, tetapi dirilis di bawah lisensi RAIL khusus riset, sehingga Anda tidak dapat menggunakan keluarannya dalam game komersial.</p>
<h2 id="alat-browser-gratis-dari-cinevva" tabindex="-1">Alat browser gratis dari Cinevva <a class="header-anchor" href="#alat-browser-gratis-dari-cinevva" aria-label="Permalink to &quot;Alat browser gratis dari Cinevva&quot;"></a></h2>
<p>Jika ingin mencoba bidang ini tanpa menginstal apa pun atau membuat akun dengan meteran kredit, Cinevva menjalankan dua model terbuka di atas sebagai alat browser gratis.</p>
<p><a href="/id/tools/hunyuan3d.html">Generator Model 3D</a> mengubah foto, URL gambar, atau prompt teks menjadi mesh poligon bertekstur dengan material PBR, yang dapat diunduh sebagai GLB atau OBJ. Tersedia mode Rapid (sekitar 2 menit) dan mode Pro (sekitar 5 menit), dan keluarannya dapat langsung dimasukkan ke Blender, Unity, Godot, atau game web. Anda juga dapat mengirim hasilnya ke <a href="/id/tools/rigger.html">Auto Rigger</a> untuk menambahkan kerangka dan animasi preset.
<a href="/id/tools/sam3d.html">Pengambilan Gambar ke 3D</a> menjalankan SAM 3D dari Meta pada satu foto dan menghasilkan Gaussian splat yang dapat Anda putar di browser serta diekspor sebagai .ply. Gunakan untuk menangkap objek nyata, lalu gunakan Generator Model 3D saat Anda membutuhkan mesh yang dapat diedit dari subjek yang sama.</p>
<p>Keduanya gratis, dan jika Anda membuat game di Cinevva, model yang dihasilkan langsung masuk ke game Anda tanpa perlu bolak-balik mengekspor dan mengimpor.</p>
<h2 id="seperti-apa-sebenarnya-mesh-ai-penjelasan-jujurnya" tabindex="-1">Seperti apa sebenarnya mesh AI (penjelasan jujurnya) <a class="header-anchor" href="#seperti-apa-sebenarnya-mesh-ai-penjelasan-jujurnya" aria-label="Permalink to &quot;Seperti apa sebenarnya mesh AI (penjelasan jujurnya)&quot;"></a></h2>
<p>Setiap generator di halaman ini menghasilkan mesh segitiga yang padat, biasanya terdiri dari puluhan ribu hingga beberapa ratus ribu segitiga, dengan UV yang di-unwrap secara otomatis. Berikut arti praktisnya.</p>
<p><strong>Topologi.</strong> Hasil mentah AI tidak memiliki edge loop, penempatan pole yang masuk akal, maupun struktur yang ramah deformasi. Opsi quad remesh (Meshy, Tripo, Rodin) memang menghasilkan quad, tetapi quad tersebut tersebar merata, bukan loop terkonsentrasi di sekitar sendi dan wajah yang dibutuhkan animasi karakter. Untuk prop statis, hal ini sama sekali tidak menjadi masalah. Untuk karakter animasi, bersiaplah melakukan retopologi manual atau menerima deformasi patah-patah yang terlihat di bagian bahu.</p>
<p><strong>Tekstur.</strong> Dukungan PBR kini merupakan standar dasar, dan TRELLIS.2, Hunyuan3D 2.1, Meshy, serta Rodin semuanya menghasilkan peta metallic-roughness yang sesungguhnya. Ada dua masalah yang sering muncul: pencahayaan yang menyatu ke dalam albedo (bayangan tergambar pada tekstur) dan kepadatan texel yang tidak merata karena proses auto-unwrap memadatkan UV island. Keduanya dapat diperbaiki di Blender, tetapi tidak akan membaik dengan sendirinya.</p>
<p><strong>Jumlah poligon.</strong> Secara default, perkirakan 20 ribu hingga 300 ribu segitiga untuk setiap aset, bahkan mencapai jutaan pada mode berupaya tinggi milik Rodin. Jumlah tersebut tidak masalah untuk prop utama, tetapi sangat membebani jika digunakan untuk seratus batu yang tersebar. Sisihkan anggaran performa untuk proses decimation dan uji pada perangkat target Anda yang sebenarnya, terutama untuk game web dan seluler.</p>
<p><strong>Yang sudah layak dirilis saat ini.</strong> Prop statis, dekorasi lingkungan, item bergaya, dan geometri blockout benar-benar dapat langsung digunakan dalam produksi dari alat-alat ini. Dalam hal ini, kecepatan generasi AI sudah mengungguli pencarian di <a href="/id/guides/free-3d-model-sites.html">situs model gratis</a>. Karakter latar yang sudah di-rig dapat digunakan dengan auto-rigging selama tetap berada di latar belakang. Karakter utama dengan animasi wajah jarak dekat masih memerlukan sentuhan manusia pada topologinya, sedangkan model hard-surface yang membutuhkan simetri tepat atau presisi CAD masih terlihat agak meleleh.</p>
<h2 id="gaussian-splat-vs-mesh" tabindex="-1">Gaussian splat vs mesh <a class="header-anchor" href="#gaussian-splat-vs-mesh" aria-label="Permalink to &quot;Gaussian splat vs mesh&quot;"></a></h2>
<p>Mesh terdiri dari poligon: vertex, segitiga, UV, dan tekstur. Gaussian splat adalah kumpulan ribuan gumpalan kecil berwarna dan semi-transparan yang secara keseluruhan tampak fotorealistis dari sudut mana pun. Splat menangkap objek dan pemandangan dunia nyata dengan tingkat fidelitas yang sulit ditandingi mesh. Itulah sebabnya alat pengambilan seperti SAM 3D dan ekosistem Luma menghasilkan format ini.</p>
<p>Untuk game, komprominya sangat jelas. Splat tidak memiliki permukaan, sehingga collision, fisika, dan pencahayaan dinamis tidak dapat bekerja langsung padanya. Splat juga berat: sekitar 180 MB untuk satu juta splat dibandingkan 5 hingga 20 MB untuk mesh bertekstur yang sebanding, sehingga tidak cocok untuk sebagian besar batas ukuran game seluler. Dukungan engine memang sudah tersedia, tetapi masih berbasis plugin pada 2026: UnityGaussianSplatting untuk Unity 6, plugin pihak ketiga untuk Unreal 5.7, serta format terkompresi (SPZ, SOG, KSPLAT) untuk web.</p>
<p>Pola yang efektif: gunakan splat untuk latar fotorealistis dan dekorasi set yang tidak pernah disentuh pemain, serta mesh untuk semua elemen interaktif. Jika Anda menangkap sesuatu sebagai splat dan membutuhkannya dalam gameplay, buat ulang sebagai mesh menggunakan alat gambar-ke-3D.</p>
<h2 id="siapa-yang-memiliki-model-3d-buatan-ai" tabindex="-1">Siapa yang memiliki model 3D buatan AI? <a class="header-anchor" href="#siapa-yang-memiliki-model-3d-buatan-ai" aria-label="Permalink to &quot;Siapa yang memiliki model 3D buatan AI?&quot;"></a></h2>
<p>Ada tiga lapisan yang perlu diperiksa, dan aturannya berbeda untuk alat yang di-host dan alat terbuka.</p>
<p><strong>Hak cipta.</strong> Berdasarkan panduan Kantor Hak Cipta AS saat ini, hasil yang sepenuhnya dibuat oleh AI tidak dapat dilindungi hak cipta dengan sendirinya. Pekerjaan retopologi, texturing, rigging, dan integrasi yang Anda lakukan menambahkan unsur kepengarangan manusia, dan game secara keseluruhan tetap dilindungi. Dampak praktisnya: Anda mungkin tidak dapat mencegah orang lain menggunakan kembali mesh mentah yang dihasilkan, sesuatu yang lebih penting bagi penjual aset daripada developer game.</p>
<p><strong>Ketentuan alat yang di-host.</strong> Di sinilah banyak orang terjebak. Model dari paket gratis Meshy tersedia untuk publik berdasarkan CC BY 4.0 (penggunaan komersial diizinkan, atribusi diwajibkan, dan siapa pun juga dapat menggunakan model Anda), sedangkan kepemilikan privat dimulai dari paket Pro. Paket gratis Tripo sepenuhnya bersifat nonkomersial. Rodin membatasi unduhan dan ketentuan komersial di balik paket berbayar. Pola di seluruh industri: buat secara gratis, bayar untuk memilikinya. Baca ketentuan terbaru sebelum merilis game karena ketentuan tersebut dapat berubah tanpa banyak pemberitahuan.</p>
<p><strong>Lisensi model terbuka.</strong> Self-hosting sepenuhnya menghindari ketentuan platform, tetapi lisensi model tetap berlaku. TRELLIS.2 menggunakan lisensi MIT tanpa persyaratan tambahan. Lisensi SAM 3D mengizinkan penggunaan komersial. Hunyuan3D 2.1 mengecualikan Uni Eropa, Inggris, dan Korea Selatan. SPAR3D gratis hingga pendapatan tahunan $1 juta. Roblox Cube hanya untuk penelitian. Istilah &quot;terbuka&quot; tidak selalu berarti hal yang sama, jadi periksa lisensi spesifiknya.</p>
<p>Untuk aturan yang lebih luas mengenai lisensi aset, lihat <a href="/id/guides/game-asset-licenses.html">panduan lisensi aset game</a> kami.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-generator-model-3d-ai-terbaik-pada-2026" tabindex="-1">Apa generator model 3D AI terbaik pada 2026? <a class="header-anchor" href="#apa-generator-model-3d-ai-terbaik-pada-2026" aria-label="Permalink to &quot;Apa generator model 3D AI terbaik pada 2026?&quot;"></a></h3>
<p>Meshy 6 adalah alat hosted serbaguna terbaik, Tripo menawarkan nilai terbaik untuk pipeline game dengan auto-rigging, dan Rodin Gen-2.5 menghasilkan geometri paling mendetail. Jika Anda lebih memilih self-hosting, TRELLIS.2 dari Microsoft (lisensi MIT, PBR native) adalah model terbuka terkuat. Untuk opsi browser gratis, Generator Model 3D Cinevva menjalankan Hunyuan3D tanpa perlu instalasi.</p>
<h3 id="dapatkah-saya-menggunakan-model-3d-buatan-ai-dalam-game-komersial" tabindex="-1">Dapatkah saya menggunakan model 3D buatan AI dalam game komersial? <a class="header-anchor" href="#dapatkah-saya-menggunakan-model-3d-buatan-ai-dalam-game-komersial" aria-label="Permalink to &quot;Dapatkah saya menggunakan model 3D buatan AI dalam game komersial?&quot;"></a></h3>
<p>Biasanya bisa, tetapi hak penggunaannya bergantung pada asal model tersebut. Alat yang di-host membatasi penggunaan komersial di balik paket berbayar (Meshy Pro, Tripo Pro, paket berbayar Rodin), sedangkan hasil dari paket gratis bersifat nonkomersial atau tersedia untuk publik berdasarkan CC BY 4.0. Model yang Anda hasilkan menggunakan bobot sumber terbuka seperti TRELLIS.2 sama sekali tidak terikat ketentuan platform, meskipun lisensi modelnya sendiri tetap berlaku. Konfirmasikan ketentuan terbaru dari alat yang Anda gunakan sebelum merilis game.</p>
<h3 id="apakah-mesh-buatan-ai-sudah-cukup-bagus-untuk-game" tabindex="-1">Apakah mesh buatan AI sudah cukup bagus untuk game? <a class="header-anchor" href="#apakah-mesh-buatan-ai-sudah-cukup-bagus-untuk-game" aria-label="Permalink to &quot;Apakah mesh buatan AI sudah cukup bagus untuk game?&quot;"></a></h3>
<p>Untuk prop statis, elemen lingkungan, dan item bergaya, ya, semuanya sudah layak digunakan dalam produksi setelah proses decimation. Untuk karakter animasi, hasilnya baru sebagian memadai: auto-rigging dapat menangani karakter latar, tetapi karakter utama masih memerlukan retopologi manual karena topologi AI tidak memiliki edge loop yang dibutuhkan animasi. Anggap generator terutama sebagai mesin pembuat prop dan blockout, kemudian sebagai pipeline karakter.</p>
<h3 id="apa-generator-model-3d-ai-gratis-terbaik" tabindex="-1">Apa generator model 3D AI gratis terbaik? <a class="header-anchor" href="#apa-generator-model-3d-ai-gratis-terbaik" aria-label="Permalink to &quot;Apa generator model 3D AI gratis terbaik?&quot;"></a></h3>
<p>Generator Model 3D Cinevva sepenuhnya gratis di browser: masukkan foto atau teks, lalu dapatkan mesh PBR bertekstur dalam format GLB atau OBJ. Platform Hunyuan 3D milik Tencent menyediakan 20 generasi gratis per hari menggunakan engine terbarunya. Paket gratis Meshy mencakup 100 kredit per bulan, tetapi memublikasikan model Anda berdasarkan CC BY 4.0. Self-hosting TRELLIS.2 gratis tanpa batas jika Anda memiliki GPU yang sesuai.</p>
<h3 id="teks-ke-3d-atau-gambar-ke-3d-mana-yang-memberikan-hasil-lebih-baik" tabindex="-1">Teks-ke-3D atau gambar-ke-3D, mana yang memberikan hasil lebih baik? <a class="header-anchor" href="#teks-ke-3d-atau-gambar-ke-3d-mana-yang-memberikan-hasil-lebih-baik" aria-label="Permalink to &quot;Teks-ke-3D atau gambar-ke-3D, mana yang memberikan hasil lebih baik?&quot;"></a></h3>
<p>Gambar-ke-3D, secara konsisten. Gambar referensi menentukan proporsi, material, dan gaya, sedangkan prompt teks membuat model harus menebak. Alur kerja terkuat pada 2026 terdiri dari dua langkah: buat gambar referensi yang bersih menggunakan model gambar, lalu masukkan ke generator gambar-ke-3D. Sebagian besar alat, termasuk milik Cinevva, melakukan hal ini di balik layar saat Anda mengetik prompt teks.</p>
<h3 id="apa-yang-terjadi-pada-luma-genie-dan-csm" tabindex="-1">Apa yang terjadi pada Luma Genie dan CSM? <a class="header-anchor" href="#apa-yang-terjadi-pada-luma-genie-dan-csm" aria-label="Permalink to &quot;Apa yang terjadi pada Luma Genie dan CSM?&quot;"></a></h3>
<p>Dalam praktiknya, keduanya telah keluar dari bidang ini. Luma menghapus Genie dari situsnya ketika perusahaan tersebut beralih fokus ke generasi video dan agen kreatif. CSM menutup platform Cube pada 5 Januari 2026 dan diakuisisi oleh Google pada bulan yang sama. Jika sebuah rangkuman merekomendasikan salah satunya, informasinya sudah kedaluwarsa.</p>
<h3 id="apakah-saya-memerlukan-gpu-yang-bertenaga-untuk-membuat-model-3d-dengan-ai" tabindex="-1">Apakah saya memerlukan GPU yang bertenaga untuk membuat model 3D dengan AI? <a class="header-anchor" href="#apakah-saya-memerlukan-gpu-yang-bertenaga-untuk-membuat-model-3d-dengan-ai" aria-label="Permalink to &quot;Apakah saya memerlukan GPU yang bertenaga untuk membuat model 3D dengan AI?&quot;"></a></h3>
<p>Tidak jika Anda menggunakan alat yang di-host atau alat berbasis browser karena proses generasi berjalan di server penyedia. Anda hanya memerlukan GPU sendiri (kartu NVIDIA yang mumpuni) untuk menjalankan model terbuka seperti TRELLIS.2 atau Hunyuan3D 2.1 secara lokal melalui self-hosting. Bahkan dalam kasus tersebut, Anda dapat menyewa inferensi GPU dengan biaya per detik.</p>
<BuildCta
  title="Buat model, lalu buat game di sekelilingnya"
  desc="Cinevva memiliki generasi 3D AI yang terintegrasi ke dalam editor, sehingga sebuah prompt menjadi model yang sudah ditempatkan di dalam game yang dapat dimainkan."
  prompt="Buat museum misterius tempat saya dapat berjalan di antara pedestal dan mengamati artefak aneh yang dihasilkan dari dekat" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI Terbaik untuk Game</a>: pipeline lengkap dengan tekstur, audio, dan rigging</li>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a>: cari alih-alih membuat</li>
<li><a href="/id/guides/long-reference-video-models.html">Model Video dengan Referensi Panjang</a>: sisi video dari AI generatif</li>
<li><a href="/id/tools/hunyuan3d.html">Generator Model 3D</a>: teks atau foto menjadi mesh PBR bertekstur secara gratis</li>
<li><a href="/id/tools/sam3d.html">Pengambilan Gambar ke 3D</a>: satu foto menjadi Gaussian splat secara gratis</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/ai-3d-model-generators-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[NPC AI dan Dialog dalam Game: Perangkat dan Realitasnya (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/ai-npcs-dialogue</link>
            <guid>https://app.cinevva.com/id/guides/ai-npcs-dialogue</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[NPC AI dan dialog pada 2026 dibandingkan secara jujur - Inworld, Convai, NVIDIA ACE, dan opsi sumber terbuka, game mana yang benar-benar menggunakannya, biaya riil, serta cara memulai.]]></description>
            <content:encoded><![CDATA[<h1 id="npc-ai-dan-dialog-dalam-game-perangkat-dan-realitasnya-2026" tabindex="-1">NPC AI dan Dialog dalam Game: Perangkat dan Realitasnya (2026) <a class="header-anchor" href="#npc-ai-dan-dialog-dalam-game-perangkat-dan-realitasnya-2026" aria-label="Permalink to &quot;NPC AI dan Dialog dalam Game: Perangkat dan Realitasnya (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>NPC AI adalah karakter nonpemain yang dialognya dibuat oleh model bahasa saat game berjalan, alih-alih ditulis baris demi baris sebelumnya. Anda berbicara atau mengetik kepadanya, model membaca system prompt yang mendefinisikan identitas karakter beserta keadaan game saat ini, lalu langsung menulis balasan. Beberapa konfigurasi juga menambahkan suara: speech-to-text agar karakter dapat mendengar Anda dan text-to-speech agar dapat membalas dengan suara. Gagasan yang ditawarkan adalah seorang penduduk desa yang mampu menjawab pertanyaan yang tidak pernah diperkirakan penulis. Kenyataannya pada 2026 lebih beragam dan patut dipahami sebelum Anda membangun sesuatu yang bergantung padanya.</p>
<p>Pilihan nyata Anda terbagi menjadi tiga kategori. Anda dapat menggunakan platform karakter terkelola seperti <a href="https://convai.com/" target="_blank" rel="noreferrer">Convai</a> yang langsung menyediakan memori, suara, dan plugin untuk game engine. Anda dapat mengintegrasikan middleware suara dan animasi seperti <a href="https://developer.nvidia.com/ace-for-games" target="_blank" rel="noreferrer">NVIDIA ACE</a> jika ingin sinkronisasi bibir dan animasi wajah sesuai dengan ucapan yang dihasilkan. Atau Anda dapat membuat solusi sendiri dengan memanggil API model bahasa (atau menjalankan model kecil secara lokal) menggunakan prompt yang dirancang secara ketat. Cara ini lebih murah dan fleksibel, tetapi urusan pagar pengaman menjadi tanggung jawab Anda. Perlu dicatat, <a href="https://inworld.ai/" target="_blank" rel="noreferrer">Inworld</a>, nama yang masih pertama kali terlintas bagi kebanyakan orang, sebagian besar telah meninggalkan posisinya sebagai studio NPC siap pakai dan beralih menjadi infrastruktur AI B2B. Karena itu, &quot;alternatif Inworld&quot; menjadi salah satu pencarian paling umum di bidang ini saat ini. Berikut gambaran keadaan sebenarnya.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Perangkat</th>
<th>Apa fungsinya</th>
<th>Model harga</th>
<th>Game engine (termasuk web)</th>
<th>Status pada 2026</th>
</tr>
</thead>
<tbody>
<tr>
<td>Convai</td>
<td>Platform NPC terkelola: dialog, suara, memori, persepsi</td>
<td>Berdasarkan penggunaan, paket gratis + Indie $29/bulan</td>
<td>Unity, Unreal, three.js, web</td>
<td>Aktif, ditujukan bagi pengembang</td>
</tr>
<tr>
<td>NVIDIA ACE</td>
<td>Middleware suara + animasi wajah (Audio2Face, Riva ASR)</td>
<td>Microservice per penggunaan / di perangkat</td>
<td>Unity, Unreal, tidak bergantung pada game engine</td>
<td>Digunakan dalam sejumlah game</td>
</tr>
<tr>
<td>Inworld</td>
<td>Runtime AI + infrastruktur suara/TTS</td>
<td>Kredit berdasarkan penggunaan, TTS mulai sekitar $5–25/1 juta karakter</td>
<td>SDK tersedia, tetapi berfokus pada B2B</td>
<td>Beralih dari studio NPC konsumen</td>
</tr>
<tr>
<td>Ubisoft Neo NPCs</td>
<td>Litbang karakter generatif internal (&quot;Teammates&quot;)</td>
<td>Bukan produk yang dapat dibeli</td>
<td>Internal Ubisoft</td>
<td>Uji coba pemain / litbang, belum dirilis</td>
</tr>
<tr>
<td>Buat sendiri</td>
<td>API LLM atau model lokal + prompt dan pagar pengaman Anda sendiri</td>
<td>Token API, atau gratis jika lokal</td>
<td>Apa pun, termasuk web biasa</td>
<td>Jalur paling fleksibel</td>
</tr>
</tbody>
</table>
<h2 id="perbandingan-perangkat" tabindex="-1">Perbandingan perangkat <a class="header-anchor" href="#perbandingan-perangkat" aria-label="Permalink to &quot;Perbandingan perangkat&quot;"></a></h2>
<p><strong>Convai</strong> adalah jalan masuk paling mudah jika Anda menginginkan platform karakter, bukan proyek eksperimen yang rumit. Platform ini menangani dialog, suara waktu nyata, memori jangka panjang, dan &quot;persepsi multimodal&quot; agar karakter dapat bereaksi terhadap apa yang dilihat dan didengarnya. Convai juga menyediakan plugin untuk Unity, Unreal, dan three.js serta API terbuka untuk web, sebagaimana dijelaskan dalam <a href="https://convai.com/" target="_blank" rel="noreferrer">ikhtisar platformnya</a>. Harganya berdasarkan penggunaan: paket Developer gratis dengan kuota harian, kemudian paket Indie Dev seharga <a href="https://www.saasworthy.com/product/convai/pricing" target="_blank" rel="noreferrer">$29 per bulan (atau $19 jika ditagih tahunan) untuk 3.000 interaksi</a>, dengan kelebihan penggunaan ditagih per interaksi. Satuan &quot;interaksi&quot; inilah yang perlu diperhatikan karena tagihan akan bertambah seiring meningkatnya jumlah pemain.</p>
<p><strong>NVIDIA ACE</strong> bukan otak NPC yang lengkap. Ini adalah rangkaian microservice untuk komponen di sekitar otak tersebut: <a href="https://nvidianews.nvidia.com/news/ace-avatar-cloud-engine-microservices" target="_blank" rel="noreferrer">Audio2Face untuk membuat animasi wajah dari audio dan Riva untuk pengenalan ucapan</a>, yang dipasangkan dengan model bahasa pilihan Anda. Komponen inilah yang membuat suara hasil generasi terlihat seolah-olah benar-benar diucapkan oleh sebuah wajah. NVIDIA mencantumkan mitra seperti Tencent, NetEase, miHoYo, dan Ubisoft. Model bahasa juga makin sering dijalankan di perangkat sebagai model kecil, bukan di cloud, yang penting untuk latensi dan biaya (dibahas lebih lanjut di bawah). Jika game Anda mengutamakan browser, ACE mungkin terlalu berlebihan karena ditujukan untuk game PC yang banyak menggunakan GPU.</p>
<p><strong>Inworld</strong> perlu dibahas secara objektif karena namanya mendominasi tutorial lama. Awalnya, Inworld merupakan platform pilihan utama untuk membuat karakter game dan masih menyediakan SDK, tetapi kini telah <a href="https://inworld.ai/blog/new-ai-infrastructure-scaling-games-media-characters" target="_blank" rel="noreferrer">mengubah posisinya menjadi infrastruktur AI untuk meningkatkan skala game dan media</a>, dengan fokus pada suara, text-to-speech, dan runtime agen yang ditujukan bagi perusahaan seperti Google, NVIDIA, dan Xbox. <a href="https://inworld.ai/pricing" target="_blank" rel="noreferrer">Harganya</a> menggunakan sistem kredit berdasarkan penggunaan. Biaya text-to-speech berkisar dari sekitar $25 per satu juta karakter pada paket On-Demand gratis hingga sekitar $5 pada volume perusahaan, speech-to-text sekitar $0,15 per jam, dan model bahasa ditagih terpisah sesuai biaya penyedia. Inworld masih dapat digunakan, tetapi pengembang web solo yang mencari NPC siap integrasi akan mendapati platform ini lebih kompleks daripada sebelumnya. Itulah sebabnya Convai dan solusi buatan sendiri telah mengambil alih posisi tersebut.</p>
<p><strong>Neo NPCs dari Ubisoft</strong> patut disebutkan justru karena bukan produk yang dapat Anda gunakan. Ini merupakan upaya litbang studio besar yang paling terlihat dan kini hadir sebagai prototipe bernama Teammates, yang menghadirkan rekan satu regu AI berbasis suara dalam game tembak-menembak orang pertama. Prototipe ini <a href="https://variety.com/2025/gaming/news/ubisoft-generative-ai-game-teammates-neo-npc-developers-1236588038/" target="_blank" rel="noreferrer">dibuat oleh tim beranggotakan sekitar 80 orang menggunakan Google Gemini serta middleware internal dan sedang menjalani uji coba pemain tertutup</a>, bukan digunakan dalam game yang telah dirilis. Ubisoft menyebut AI generatif sebagai perubahan yang sama besarnya bagi industri dengan peralihan ke 3D. Namun, status sebenarnya hingga pertengahan 2026 adalah eksperimen, bukan rilis.</p>
<h2 id="siapa-yang-benar-benar-menggunakannya-dalam-game" tabindex="-1">Siapa yang benar-benar menggunakannya dalam game <a class="header-anchor" href="#siapa-yang-benar-benar-menggunakannya-dalam-game" aria-label="Permalink to &quot;Siapa yang benar-benar menggunakannya dalam game&quot;"></a></h2>
<p>Jika semua demo dikesampingkan, jumlah game rilis yang memiliki NPC AI sungguhan masih sedikit, meskipun akhirnya tidak lagi nol. Contoh paling jelas adalah <a href="https://en.wikipedia.org/wiki/InZOI" target="_blank" rel="noreferrer">inZOI</a>, game simulasi kehidupan dari Krafton yang diluncurkan dalam akses awal pada 28 Maret 2025 dan terjual lebih dari satu juta kopi pada minggu pertamanya. Karakter &quot;Smart Zoi&quot; menjalankan <a href="https://www.dsogaming.com/news/inzoi-is-the-first-game-with-ai-powered-npcs-using-nvidia-ace/" target="_blank" rel="noreferrer">model bahasa kecil di perangkat yang dibuat dengan NVIDIA ACE</a>, sehingga AI mengendalikan perilaku dari waktu ke waktu secara lokal, alih-alih menghubungi cloud untuk setiap baris dialog. Krafton memperluas pendekatan yang sama ke PUBG melalui <a href="https://venturebeat.com/gaming-business/krafton-and-nvidia-team-up-to-create-smarter-ai-characters-for-pubg-and-inzoi/" target="_blank" rel="noreferrer">karakter yang dapat bermain bersama bernama PUBG Ally, yang diuji hingga awal 2026</a>.</p>
<p>Di sisi yang mengutamakan percakapan, <a href="https://allthings.how/where-winds-meet-and-ai-how-the-mmos-chatbot-npcs-work/" target="_blank" rel="noreferrer">Where Winds Meet</a>, sebuah MMO besar, menambahkan percakapan teks bebas berbasis LLM kepada sejumlah NPC sampingan. Game ini juga melacak afinitas agar karakter dapat menjadi lebih ramah kepada Anda, berhenti berbicara, atau berubah menjadi bermusuhan. Pilihan desain yang paling menarik, berdasarkan ulasan November 2025, adalah betapa sempitnya cakupan fitur ini: AI hanya digunakan pada karakter sampingan yang mengisi suasana, dan keluarannya dibatasi pada balasan teks serta serangkaian flag dalam game yang sudah ditetapkan. AI tidak dapat memunculkan item, membuat lokasi, atau menulis ulang alur quest. Cerita utama tetap ditulis secara manual. Game indie lebih berani menjadikan AI sebagai inti pengalaman. <a href="https://wanderfolk.ai/best-ai-npc-games-2026/" target="_blank" rel="noreferrer">Suck Up!</a> adalah game rilis yang seluruh gameplay loop-nya berupa percakapan dengan penghuni bertenaga GPT untuk membujuk mereka agar mengundang vampir masuk. Konsep ini berhasil karena percakapan adalah mekanik utamanya, bukan sekadar hiasan di atas quest dengan naskah tetap.</p>
<p>Polanya sama dalam setiap contoh game yang telah dirilis. Bagian generatifnya dibatasi. Teknologi tersebut digunakan untuk obrolan dalam simulasi kehidupan, basa-basi karakter sampingan, atau game yang secara khusus dibangun seputar persuasi. Belum ada pihak kredibel yang merilis game beranggaran besar dengan dialog quest utama yang ditulis oleh AI. Alasannya, secara berurutan, adalah biaya, latensi, dan kepercayaan.</p>
<h2 id="biaya-dan-masalah-latensi" tabindex="-1">Biaya dan masalah latensi <a class="header-anchor" href="#biaya-dan-masalah-latensi" aria-label="Permalink to &quot;Biaya dan masalah latensi&quot;"></a></h2>
<p>Ada dua hal yang meruntuhkan fantasi bahwa &quot;setiap NPC adalah chatbot&quot;, dan keduanya tidak berkaitan dengan seberapa cerdas modelnya.</p>
<p>Yang pertama adalah latensi. Percakapan memiliki ritme, dan pemain dapat merasakan ketika ritme itu terputus. Penelitian tentang NPC AI menemukan bahwa respons di bawah sekitar 800 milidetik terasa alami untuk percakapan, sedangkan respons yang jauh lebih lambat terasa janggal. Sementara itu, perjalanan pulang-pergi ke API cloud umumnya menambahkan jeda satu hingga dua detik yang terasa seperti sistem berhenti bekerja. Sebuah <a href="https://arxiv.org/pdf/2507.10469" target="_blank" rel="noreferrer">studi tahun 2025 tentang realisme yang dirasakan dalam VR</a> meminta pemain menilai pengaruh latensi terhadap seberapa manusiawi suatu karakter terasa. Permintaan mereka secara konsisten sederhana: sistem harus merespons lebih cepat. Inilah alasan terbesar inZOI dan PUBG memilih model kecil di perangkat, bukan model cloud raksasa. Model lokal yang lebih kecil dan cepat serta menjawab dalam setengah detik lebih baik daripada model lebih cerdas yang membutuhkan tiga detik.</p>
<p>Yang kedua adalah biaya, dan skalanya berkembang ke arah yang tidak menguntungkan. Sebuah baris dialog yang ditulis manual hanya perlu dibayar sekali, lalu dapat ditampilkan gratis kepada jutaan pemain. Baris hasil generasi membutuhkan biaya setiap kali dibuat, untuk setiap NPC, pemain, dan percakapan. Platform berbasis penggunaan memperjelas hal ini: Convai menagih per interaksi, Inworld menagih per karakter ucapan dan per token teks, sedangkan API LLM mentah menagih per token masukan dan keluaran. Untuk game pemain tunggal yang tenang dengan segelintir percakapan, biayanya hanya recehan. Untuk game live dengan satu juta pemain harian yang masing-masing mengobrol bebas, hasilnya adalah tagihan cloud yang tidak pernah dianggarkan. Inilah alasan adanya harga berbasis kredit dan kuota, serta mengapa &quot;percakapan bebas dengan NPC tanpa batas&quot; menjadi cara cepat untuk membakar uang. Rancang jumlah giliran percakapan AI sebagaimana Anda merancang biaya lainnya, karena memang itulah hakikatnya.</p>
<h2 id="pola-desain-yang-berhasil-dan-yang-tidak" tabindex="-1">Pola desain yang berhasil dan yang tidak <a class="header-anchor" href="#pola-desain-yang-berhasil-dan-yang-tidak" aria-label="Permalink to &quot;Pola desain yang berhasil dan yang tidak&quot;"></a></h2>
<p>Pola yang benar-benar digunakan dalam game rilis adalah generasi terbatas, bukan percakapan terbuka. Alih-alih membiarkan model mengatakan apa saja, Anda memberinya system prompt yang ketat—siapa karakter ini, apa yang diketahuinya, dan apa yang tidak boleh diungkapkannya—menjaga balasan tetap singkat, serta membatasi keluarannya pada teks dan sejumlah kecil aksi atau flag dalam game yang diizinkan. <a href="https://allthings.how/where-winds-meet-and-ai-how-the-mmos-chatbot-npcs-work/" target="_blank" rel="noreferrer">Desain berbasis flag milik Where Winds Meet</a> adalah contoh ideal: NPC berbicara, dan satu-satunya tindakan terstruktur yang dapat dilakukannya adalah hal-hal seperti mengubah nilai afinitas atau menjadi bermusuhan. Segala hal lain tetap berada di luar kendali model.</p>
<p>Pola yang gagal adalah NPC bebas bergaya &quot;tanyakan apa saja&quot; yang dimasukkan begitu saja ke dalam game berbasis cerita. Tanpa batasan, model akan dengan percaya diri mengarang fakta, menyimpang dari lore game, atau membocorkan quest karena pemain mengajukan pertanyaan pancingan yang tepat. Sebuah ulasan industri berpendapat—secara tepat—bahwa <a href="https://www.gameindustry.com/news-industry-happenings/the-hard-problem-of-ai-npcs-why-character-consistency-matters-more-than-intelligence/" target="_blank" rel="noreferrer">konsistensi karakter lebih penting daripada kecerdasan mentah</a>: pemain dapat memaklumi NPC yang agak lamban, tetapi karakter yang bertentangan dengan perkataannya sendiri atau merusak fiksi akan langsung menghancurkan imersi. Dari sinilah skeptisisme pemain juga berasal. Banyak demo NPC AI terasa seperti berbicara dengan bot layanan pelanggan yang mengenakan kostum, dan pemain menyadarinya. Tim yang berhasil memperlakukan model sebagai penulis dialog yang bekerja di dalam sangkar aturan, bukan sebagai peramal yang serba tahu.</p>
<p>Beberapa pagar pengaman konkret sudah cukup untuk menangani sebagian besar masalah. Berikan kepada karakter hanya informasi yang semestinya diketahui agar ia tidak dapat membocorkan akhir cerita. Batasi panjang respons supaya karakter tetap sesuai peran dan tidak bermonolog. Pertahankan versi yang ditulis manual untuk semua hal yang menopang alur cerita, dan gunakan generasi hanya untuk memperkaya suasana: seruan singkat, basa-basi, reaksi, dan karakter sampingan. Tentukan sejak awal apakah NPC tertentu benar-benar membutuhkan percakapan bebas, karena banyak momen &quot;NPC AI&quot; sebenarnya lebih baik dilayani oleh pohon dialog bercabang yang lebih cerdas daripada panggilan langsung ke model.</p>
<h2 id="cara-mencobanya-dalam-game-web" tabindex="-1">Cara mencobanya dalam game web <a class="header-anchor" href="#cara-mencobanya-dalam-game-web" aria-label="Permalink to &quot;Cara mencobanya dalam game web&quot;"></a></h2>
<p>Anda tidak memerlukan game engine yang banyak menggunakan GPU untuk bereksperimen. Jalur termudah adalah memanggil API model bahasa langsung dari backend game dengan system prompt yang mendefinisikan karakter dan memasukkan keadaan game saat ini, lalu menampilkan balasannya dalam kotak dialog. Ini dapat menjadi proyek akhir pekan dan memang begitulah sebagian besar prototipe browser dimulai. Jika Anda ingin platform yang menangani memori dan suara, <a href="https://convai.com/" target="_blank" rel="noreferrer">Convai memiliki SDK web dan integrasi three.js</a> sehingga Anda dapat memasang karakter yang dapat berbicara ke dalam adegan browser tanpa harus membangun sendiri semua komponen penghubungnya.</p>
<p>Jika biaya atau privasi membuat Anda meninggalkan cloud, jalur sumber terbuka menjalankan model di perangkat milik pemain. <a href="https://blog.player2.game/p/building-ai-npcs-with-player2-api" target="_blank" rel="noreferrer">WebLLM</a> menjalankan model bahasa kecil langsung di browser menggunakan WebGPU. Dengan demikian, tidak ada tagihan server dan tidak ada jeda jaringan setelah model selesai dimuat, tetapi konsekuensinya adalah unduhan awal yang lebih besar dan kebutuhan akan perangkat yang mumpuni. Menjalankan model lokal melalui perangkat seperti Ollama selama pengembangan juga menjadi cara murah untuk melakukan iterasi sebelum Anda berkomitmen kepada penyedia layanan terkelola. Apa pun pilihan Anda, buat batasannya terlebih dahulu: prompt karakter yang jelas, batas panjang yang tegas, dan daftar tetap berisi tindakan yang boleh dipicu oleh NPC.</p>
<p>Jika Anda lebih memilih melewati seluruh proses integrasi dan hanya ingin melihat karakter dengan kepribadian berbeda berjalan dalam browser, itulah kegunaan chat game Cinevva. Anda mendeskripsikan desa dan orang-orang di dalamnya, lalu agen akan membuat karakter beserta perilaku mereka di dalam adegan 3D yang dapat dimainkan, dibuka, dan diajak berbicara. Dengan demikian, Anda dapat merasakan apakah ide karakter AI tersebut menyenangkan sebelum berinvestasi dalam pipeline lengkap.</p>
<BuildCta
  title="Coba game berkarakter AI di browser Anda"
  desc="Deskripsikan para karakternya, lalu Cinevva membangun dunia yang dapat dimainkan dan dijelajahi melalui percakapan."
  prompt="Buat desa tempat saya dapat berbicara dengan karakter yang masing-masing memiliki kepribadian sendiri" />
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-itu-npc-ai" tabindex="-1">Apa itu NPC AI? <a class="header-anchor" href="#apa-itu-npc-ai" aria-label="Permalink to &quot;Apa itu NPC AI?&quot;"></a></h3>
<p>NPC AI adalah karakter nonpemain yang dialognya—dan terkadang perilakunya—dihasilkan oleh model bahasa saat gim berjalan, bukan ditulis terlebih dahulu oleh penulis. Anda mengetik atau berbicara kepadanya, lalu model membaca prompt yang mendeskripsikan karakter dan kondisi gim saat ini, kemudian menghasilkan jawaban secara langsung. Lapisan suara opsional menambahkan pengenalan ucapan agar NPC dapat mendengar Anda serta text-to-speech agar dapat membalas dengan suara.</p>
<h3 id="apa-alternatif-inworld-terbaik-pada-2026" tabindex="-1">Apa alternatif Inworld terbaik pada 2026? <a class="header-anchor" href="#apa-alternatif-inworld-terbaik-pada-2026" aria-label="Permalink to &quot;Apa alternatif Inworld terbaik pada 2026?&quot;"></a></h3>
<p>Bagi sebagian besar developer, jawabannya adalah Convai, yang tetap berfokus sebagai platform NPC siap integrasi dengan dialog, suara, memori, dan plugin engine (Unity, Unreal, three.js, serta web) setelah Inworld beralih ke infrastruktur AI B2B. Jika Anda menginginkan kendali maksimal dan biaya lebih rendah, alternatif kuat lainnya adalah membuat solusi sendiri dengan memanggil API model bahasa atau menjalankan model lokal menggunakan system prompt dan batasan pengaman buatan Anda. Pilihan yang paling cocok bergantung pada apakah Anda lebih mengutamakan kemudahan atau kendali.</p>
<h3 id="gim-yang-sudah-dirilis-mana-saja-yang-benar-benar-menggunakan-npc-ai" tabindex="-1">Gim yang sudah dirilis mana saja yang benar-benar menggunakan NPC AI? <a class="header-anchor" href="#gim-yang-sudah-dirilis-mana-saja-yang-benar-benar-menggunakan-npc-ai" aria-label="Permalink to &quot;Gim yang sudah dirilis mana saja yang benar-benar menggunakan NPC AI?&quot;"></a></h3>
<p>Daftarnya singkat, tetapi nyata. Gim simulasi kehidupan inZOI dari Krafton menggunakan karakter AI yang berjalan di perangkat dan dibuat dengan NVIDIA ACE, serta sedang memperluas teknologi tersebut ke PUBG. MMO Where Winds Meet menambahkan percakapan LLM ke sejumlah karakter sampingan dengan batasan ketat mengenai tindakan yang dapat mereka lakukan. Gim indie seperti Suck Up! sepenuhnya dibangun di seputar percakapan dengan karakter bertenaga AI. Gim cerita beranggaran besar belum menyerahkan dialog misi utama kepada AI, sedangkan Neo NPCs dari Ubisoft masih berupa uji coba internal, bukan fitur yang telah dirilis.</p>
<h3 id="berapa-biaya-operasional-npc-ai" tabindex="-1">Berapa biaya operasional NPC AI? <a class="header-anchor" href="#berapa-biaya-operasional-npc-ai" aria-label="Permalink to &quot;Berapa biaya operasional NPC AI?&quot;"></a></h3>
<p>Setiap baris yang dihasilkan membutuhkan biaya setiap kali dibuat, tidak seperti dialog tertulis yang hanya perlu Anda bayar sekali. Platform terkelola menagih berdasarkan penggunaan: Convai mengenakan biaya per interaksi dengan paket gratis dan paket indie seharga $29 per bulan, sedangkan Inworld menagih per karakter ucapan dan per token teks. API langsung menagih per token. Biayanya sangat kecil untuk gim pemain tunggal berskala kecil, tetapi mahal untuk gim live dengan jutaan pemain harian yang melakukan percakapan terbuka. Karena itu, studio membatasi jumlah giliran percakapan AI yang benar-benar dapat terjadi.</p>
<h3 id="apakah-npc-ai-terasa-seperti-gimmick-bagi-pemain" tabindex="-1">Apakah NPC AI terasa seperti gimmick bagi pemain? <a class="header-anchor" href="#apakah-npc-ai-terasa-seperti-gimmick-bagi-pemain" aria-label="Permalink to &quot;Apakah NPC AI terasa seperti gimmick bagi pemain?&quot;"></a></h3>
<p>Sering kali ya, dan skeptisisme itu beralasan. Karakter AI tanpa batasan cenderung mengarang fakta, menyimpang dari cerita gim, atau terasa seperti chatbot berkostum, yang dengan cepat merusak imersi. Versi yang disambut baik oleh pemain dibatasi dengan ketat: kepribadian yang jelas, jawaban singkat yang sesuai karakter, serta tidak memiliki kemampuan untuk membocorkan alur atau bertentangan dengan dunia gim. Pelajaran dari contoh yang telah dirilis adalah bahwa konsistensi lebih penting daripada kecerdasan mentah.</p>
<h3 id="apa-cara-termudah-untuk-menambahkan-npc-ai-ke-gim-web" tabindex="-1">Apa cara termudah untuk menambahkan NPC AI ke gim web? <a class="header-anchor" href="#apa-cara-termudah-untuk-menambahkan-npc-ai-ke-gim-web" aria-label="Permalink to &quot;Apa cara termudah untuk menambahkan NPC AI ke gim web?&quot;"></a></h3>
<p>Panggil API model bahasa dari backend gim Anda menggunakan system prompt yang mendefinisikan karakter dan menyertakan kondisi gim saat ini, lalu tampilkan jawabannya dalam kotak dialog. Prototipe seperti ini dapat dibuat dalam satu akhir pekan. Untuk menghindari biaya server, Anda dapat menjalankan model kecil di browser menggunakan WebLLM melalui WebGPU. Jika Anda ingin memori dan suara ditangani secara otomatis, Convai menyediakan SDK untuk web dan three.js. Apa pun pendekatannya, tentukan batasannya (prompt karakter, batas panjang, dan tindakan yang diizinkan) sebelum memikirkan modelnya.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-game-generators-2026.html">Generator Gim AI Terbaik pada 2026</a> — alat yang membuat gim siap dimainkan dari sebuah prompt</li>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Gim dengan AI (Tanpa Coding)</a> — proses pembuatan lengkap dari awal hingga akhir</li>
<li><a href="/id/guides/ai-voice-acting-games.html">Pengisi Suara AI untuk Gim</a> — lapisan text-to-speech yang memberikan suara kepada NPC AI</li>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Frontier</a> — model bahasa yang menangani percakapan di balik layar</li>
<li><a href="/id/guides/vibe-coding-games.html">Vibe Coding untuk Gim: Pengertian dan Cara Memulainya</a> — pola pikir prototipe cepat untuk menguji ide seperti ini</li>
<li><a href="/id/guides/co-op-game-design.html">Desain Gim Co-op</a> — merancang karakter yang berbagi dunia dengan pemain</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/ai-npcs-dialogue-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Akting Suara AI untuk Game: Alat, Biaya, dan Aturannya (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/ai-voice-acting-games</link>
            <guid>https://app.cinevva.com/id/guides/ai-voice-acting-games</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Akting suara AI untuk game pada 2026: biaya ElevenLabs dan alternatifnya, hal yang diizinkan oleh lisensi komersial untuk dirilis, serta aturan serikat pekerja dan Steam.]]></description>
            <content:encoded><![CDATA[<h1 id="akting-suara-ai-untuk-game-alat-biaya-dan-aturannya-2026" tabindex="-1">Akting Suara AI untuk Game: Alat, Biaya, dan Aturannya (2026) <a class="header-anchor" href="#akting-suara-ai-untuk-game-alat-biaya-dan-aturannya-2026" aria-label="Permalink to &quot;Akting Suara AI untuk Game: Alat, Biaya, dan Aturannya (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Ya, Anda bisa menggunakan suara yang dihasilkan AI dalam game komersial, dan bagi kebanyakan developer solo serta studio kecil, biayanya murah. Paket berbayar pada alat seperti <a href="https://elevenlabs.io/pricing" target="_blank" rel="noreferrer">ElevenLabs</a> dimulai dari $6 per bulan dan disertai lisensi komersial, sehingga dialog yang Anda hasilkan boleh disertakan dalam game yang dijual. Biaya <a href="https://texttolab.com/blog/openai-tts-pricing" target="_blank" rel="noreferrer">API text-to-speech OpenAI</a> sekitar $0,015 per menit audio dan juga diizinkan untuk penggunaan komersial. Model sumber terbuka berlisensi permisif seperti Piper dan Kokoro tidak memerlukan biaya untuk dijalankan dan boleh disertakan dalam produk komersial, sedangkan model lain seperti XTTS v2 bersifat nonkomersial. Jadi, lisensi model menentukan apa yang boleh Anda jual. Untuk game indie biasa dengan beberapa ratus baris dialog, biaya generasinya berkisar dari gratis hingga sekitar $20 sampai $30.</p>
<p>Masalahnya bukan biaya, melainkan aturan dan tanggapan pemain. Paket gratis hampir tidak pernah mengizinkan penggunaan komersial dan biasanya mewajibkan atribusi pada hasilnya. Jadi, alat &quot;gratis&quot; yang boleh digunakan untuk merilis game adalah alat yang lisensinya secara tegas mengizinkannya. Mengkloning suara orang sungguhan tanpa izin justru berpotensi membuat Anda digugat atau game Anda dihapus dari toko, bukan menghemat waktu. Steam mengharuskan Anda <a href="https://www.pcgamer.com/software/ai/steam-updates-ai-disclosure-form-to-specify-that-its-focused-on-ai-generated-content-that-is-consumed-by-players-not-efficiency-tools-used-behind-the-scenes/" target="_blank" rel="noreferrer">mengungkapkan konten AI yang ditampilkan kepada pemain</a>, termasuk dialog suara AI, pada halaman toko Anda. Dan pemain bisa mengetahuinya. Sejumlah game pada 2025 dan 2026 menuai kecaman nyata karena menggunakan suara AI. Jadi, memperlakukannya sebagai cara diam-diam untuk menghemat biaya, alih-alih sebagai pilihan kreatif, merupakan kekeliruan. Panduan ini membahas berbagai alat, biaya sebenarnya, aturan serikat pekerja dan toko, serta kapan Anda sebaiknya mempekerjakan manusia.</p>
<h2 id="referensi-singkat-perbandingan-alat" tabindex="-1">Referensi singkat: perbandingan alat <a class="header-anchor" href="#referensi-singkat-perbandingan-alat" aria-label="Permalink to &quot;Referensi singkat: perbandingan alat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Harga (2026)</th>
<th>Lisensi komersial</th>
<th>Kebijakan kloning suara</th>
<th>Catatan kualitas</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://elevenlabs.io/pricing" target="_blank" rel="noreferrer">ElevenLabs</a></td>
<td>Paket gratis, lalu $6/bulan (Starter) hingga $99/bulan (Pro)</td>
<td>Hanya paket berbayar, berlaku selamanya bahkan setelah Anda berhenti berlangganan</td>
<td>Kloning instan pada Starter, kloning profesional pada Creator+, persetujuan wajib untuk suara orang sungguhan</td>
<td>Emosi dan penyampaian terbaik di kelasnya, pilihan utama untuk dialog game</td>
</tr>
<tr>
<td><a href="https://texttolab.com/blog/openai-tts-pricing" target="_blank" rel="noreferrer">OpenAI TTS</a> (gpt-4o-mini-tts)</td>
<td>Sekitar $0,015/menit audio, bayar sesuai pemakaian</td>
<td>Ya, berdasarkan kebijakan penggunaan OpenAI</td>
<td>Hanya suara preset, tanpa kloning</td>
<td>Murah, alami, cocok untuk volume besar, tetapi lebih sulit diarahkan</td>
</tr>
<tr>
<td><a href="https://murf.ai/" target="_blank" rel="noreferrer">Murf</a></td>
<td>Paket berbayar mencakup hak komersial</td>
<td>Semua paket berbayar</td>
<td>Kloning tersedia pada paket yang lebih tinggi</td>
<td>Cepat (model Falcon berlatensi rendah), narasi bergaya studio</td>
</tr>
<tr>
<td><a href="https://www.resemble.ai/" target="_blank" rel="noreferrer">Resemble AI</a></td>
<td>Paket berbayar, ditambah Chatterbox sumber terbuka</td>
<td>Ya pada paket berbayar, ditambah Chatterbox berlisensi MIT</td>
<td>Kloning merupakan fitur utama, persetujuan wajib</td>
<td>Chatterbox memiliki kontrol &quot;exaggeration&quot; yang cocok untuk karakter game</td>
</tr>
<tr>
<td><a href="https://huggingface.co/coqui/XTTS-v2" target="_blank" rel="noreferrer">XTTS v2</a> (Coqui)</td>
<td>Gratis, dihosting sendiri</td>
<td>CPML, bobot nonkomersial, hanya untuk penggunaan prototipe</td>
<td>Mengkloning dari sekitar 6 detik audio, 17 bahasa</td>
<td>Kloning multibahasa lokal sumber terbuka terbaik, memerlukan GPU</td>
</tr>
<tr>
<td><a href="https://github.com/rhasspy/piper" target="_blank" rel="noreferrer">Piper</a></td>
<td>Gratis, dihosting sendiri</td>
<td>Permisif, boleh disertakan dalam produk</td>
<td>Suara preset, tanpa kloning</td>
<td>Berjalan secara real-time pada CPU, sangat cocok untuk sistem tertanam atau perangkat berspesifikasi rendah</td>
</tr>
</tbody>
</table>
<p>Harga dan ketentuan dapat berubah, jadi pastikan untuk memeriksa lisensi terkini di halaman resmi penyedia sebelum membangun pipeline berdasarkan alat tersebut. Bagian selanjutnya dalam panduan ini menjelaskan arti praktis setiap baris di atas bagi game yang ingin Anda jual.</p>
<h2 id="berbagai-alat-dan-kegunaan-terbaiknya" tabindex="-1">Berbagai alat dan kegunaan terbaiknya <a class="header-anchor" href="#berbagai-alat-dan-kegunaan-terbaiknya" aria-label="Permalink to &quot;Berbagai alat dan kegunaan terbaiknya&quot;"></a></h2>
<p><strong>ElevenLabs</strong> adalah alat yang dipilih oleh kebanyakan developer game, dan ada alasan kuat untuk itu. Alat ini menangani rentang emosi serta tempo alami dengan lebih baik dibandingkan alternatifnya. Hal tersebut penting ketika sebuah dialog harus terdengar ketakutan, sarkastis, atau kelelahan, bukan sekadar dibacakan. <a href="https://help.elevenlabs.io/hc/en-us/articles/13313564601361-Can-I-publish-the-content-I-generate-on-the-platform" target="_blank" rel="noreferrer">Paket gratis memberi Anda 10.000 kredit per bulan, tetapi tidak memberikan hak komersial dan mewajibkan atribusi</a>, sehingga hanya cocok untuk pengujian. <a href="https://elevenlabs.io/pricing" target="_blank" rel="noreferrer">Paket Starter seharga $6 per bulan menambahkan lisensi komersial dan 30.000 kredit</a>, yang setara dengan sekitar 30 menit ucapan karena satu karakter teks memerlukan satu kredit pada model standar. Creator seharga $22 memberi Anda sekitar 121.000 kredit dan kloning suara profesional, sedangkan Pro seharga $99 memberi Anda 600.000 kredit. Untuk kebanyakan game kecil, paket $6 atau $22 sudah lebih dari cukup.</p>
<p><strong>Text-to-speech OpenAI</strong> adalah pilihan paling ekonomis. Biaya <a href="https://tokenmix.ai/blog/gpt-4o-mini-tts-cheapest-tts-api-2026" target="_blank" rel="noreferrer">model gpt-4o-mini-tts sekitar $0,015 per menit audio yang dihasilkan</a>, ditagihkan melalui API, dan penggunaan komersial diizinkan berdasarkan kebijakan penggunaan OpenAI. Anda mendapatkan serangkaian suara preset tanpa fitur kloning. Alat ini juga tidak semudah ElevenLabs untuk diarahkan, tetapi harganya sulit ditandingi jika Anda perlu menghasilkan ratusan dialog singkat dan seruan. Ini merupakan pilihan tepat untuk dialog berjumlah besar dengan kepentingan yang lebih rendah.</p>
<p><strong>Murf</strong> lebih menyasar pengguna narasi studio. Semua paket berbayarnya <a href="https://undetectr.com/blog/ai-voice-generator-free" target="_blank" rel="noreferrer">mencakup hak komersial</a>, dan model Falcon terbarunya dibuat untuk latensi rendah, <a href="https://murf.ai/" target="_blank" rel="noreferrer">dilaporkan sekitar 55 ms dalam pengujian independen</a>. Hal ini lebih penting bagi agen interaktif daripada dialog game yang dibuat sebelumnya. <strong>Resemble AI</strong> patut diketahui karena dua alasan: produk berbayarnya mengutamakan kloning, dan perusahaan tersebut juga menerbitkan <a href="https://findskill.ai/blog/best-open-source-tts-2026/" target="_blank" rel="noreferrer">Chatterbox</a>, model sumber terbuka dengan lisensi permisif serta parameter &quot;exaggeration&quot; yang dapat mendorong suara ke arah karikatur. Fitur ini benar-benar berguna untuk karakter dan makhluk dalam game.</p>
<p>Di ranah sumber terbuka, <strong>XTTS v2</strong> dari Coqui yang kini sudah berhenti beroperasi masih <a href="https://localaimaster.com/models/coqui-tts" target="_blank" rel="noreferrer">dianggap sebagai mesin kloning suara multibahasa lokal terbaik pada 2026</a>. Model ini dapat mengkloning suara dari audio berdurasi sekitar enam detik dalam 17 bahasa dan terus bertahan melalui fork komunitas meskipun <a href="https://apatero.com/blog/open-source-text-to-speech-models-beyond-elevenlabs-2026" target="_blank" rel="noreferrer">perusahaannya tutup pada Januari 2024</a>. Namun, perlakukan model ini hanya sebagai alat prototipe: bobot modelnya dirilis berdasarkan lisensi CPML milik Coqui yang bersifat nonkomersial, sehingga secara hukum Anda tidak boleh menggunakannya dalam game yang dijual. <strong>Piper</strong> berada di ujung spektrum yang berlawanan: <a href="https://www.bentoml.com/blog/exploring-the-world-of-open-source-text-to-speech-models" target="_blank" rel="noreferrer">alat ini berjalan secara real-time pada CPU tanpa GPU</a>, sehingga cocok untuk sistem tertanam, perangkat berspesifikasi rendah, atau pembuatan suara secara runtime di dalam game. <strong>Bark</strong> berlisensi MIT dan dapat menghasilkan suara nonverbal seperti tawa dan desahan, sedangkan <strong>Kokoro</strong> merupakan opsi ringan yang mengutamakan bahasa Inggris dan boleh disertakan dalam produk komersial. Untuk modding bergaya Skyrim, alat seperti <strong>xVASynth</strong> sudah lama menjadi standar komunitas dalam membuat dialog NPC khusus. Namun, jika Anda seorang modder, periksa ketentuan game dasar dan alat tersebut sebelum mendistribusikannya.</p>
<p>Satu catatan mengenai industri ini: <a href="https://undetectr.com/blog/ai-voice-generator-free" target="_blank" rel="noreferrer">Play.ht diakuisisi oleh Meta pada pertengahan 2025 dan dilaporkan berhenti beroperasi pada akhir tahun tersebut</a>. Jadi, jika Anda melihatnya direkomendasikan dalam artikel lama, abaikan saja.</p>
<h2 id="biaya-dalam-praktik" tabindex="-1">Biaya dalam praktik <a class="header-anchor" href="#biaya-dalam-praktik" aria-label="Permalink to &quot;Biaya dalam praktik&quot;"></a></h2>
<p>Angka biaya per menit dan per karakter hanya memberi gambaran terbatas, jadi mari lihat perhitungan sebenarnya. Game naratif pendek dengan, misalnya, 300 baris dialog yang rata-rata terdiri atas 12 kata menghasilkan sekitar 21.600 karakter. Di ElevenLabs, jumlah tersebut masih berada di bawah jatah bulanan paket Starter. Jadi, anggaran suara untuk seluruh game hanya $6, atau $22 jika Anda menginginkan suara hasil kloning atau berkualitas lebih tinggi. Dengan API OpenAI, naskah yang sama hanya menghasilkan audio selama beberapa menit dengan biaya jauh di bawah satu dolar. Model sumber terbuka tidak memerlukan biaya selain komputasi dan waktu Anda sendiri.</p>
<p>Biaya sebenarnya mulai meningkat karena iterasi dan skala. Anda jarang mendapatkan hasil dialog yang tepat pada generasi pertama. Mengulangi penyampaian, menyesuaikan penekanan, dan membuat ulang audio setelah perubahan naskah semuanya menghabiskan kredit. RPG dengan banyak dialog, ribuan baris, beberapa take untuk setiap dialog, dan sejumlah bahasa dapat mendorong Anda ke paket $99 atau pengeluaran API yang cukup besar. Meski begitu, Anda masih membandingkan biaya puluhan atau ratusan dolar dengan ribuan dolar yang diperlukan untuk seluruh pemeran manusia. Penjelasan yang jujur adalah bahwa suara AI murah untuk proses generasi mentah dan hanya menjadi mahal jika dibandingkan dengan dirinya sendiri, bukan jika dibandingkan dengan biaya mempekerjakan pemeran dari serikat pekerja. Jika anggaran Anda nol, paket gratis dapat digunakan untuk membuat prototipe, sedangkan model sumber terbuka memungkinkan Anda membuat game yang dapat dirilis selama lisensinya dipatuhi.</p>
<h2 id="lisensi-dan-aturan-serikat-pekerja" tabindex="-1">Lisensi dan aturan serikat pekerja <a class="header-anchor" href="#lisensi-dan-aturan-serikat-pekerja" aria-label="Permalink to &quot;Lisensi dan aturan serikat pekerja&quot;"></a></h2>
<p>Bagian ini sering membuat orang keliru, jadi bacalah dengan saksama. Ada dua persoalan lisensi yang berbeda dan keduanya mudah tertukar.</p>
<p>Pertama adalah lisensi alat, yang menentukan apakah Anda boleh menjual hasil yang dibuat. Pada paket berbayar ElevenLabs, Murf, Resemble, dan OpenAI, jawabannya adalah ya. Khusus untuk ElevenLabs, Anda <a href="https://terms.law/ai-output-rights/elevenlabs/" target="_blank" rel="noreferrer">tetap memiliki hak komersial atas audio yang dibuat selama masa langganan berbayar, bahkan setelah langganan dibatalkan</a>. Ada dua hal yang perlu diketahui dalam ketentuan lengkapnya: Anda tetap harus memiliki hak atas naskah dan konten yang mendasarinya, dan penyedia seperti ElevenLabs <a href="https://terms.law/ai-output-rights/elevenlabs/" target="_blank" rel="noreferrer">tetap memiliki lisensi untuk menggunakan konten hasil generasi Anda guna melatih serta meningkatkan model mereka</a>. Paket gratis merupakan jebakannya karena biasanya melarang penggunaan komersial dan mewajibkan atribusi. Jadi, game yang dirilis dengan hasil dari paket gratis melanggar ketentuan. Untuk model sumber terbuka, lisensi melekat pada model tertentu, bukan pada kategori alatnya. Karena itu, periksa apakah model tersebut menggunakan lisensi MIT, Apache, atau lisensi lain yang memiliki klausul nonkomersial sebelum Anda membangun produk dengannya.</p>
<p>Persoalan kedua adalah suara itu sendiri. Menghasilkan suara preset atau sintetis tidak bermasalah. Mengkloning suara orang sungguhan tanpa persetujuan merupakan tindakan bermasalah yang mengandung risiko hukum dan persoalan etika. Di sinilah aturan serikat pekerja berlaku. Setelah mogok kerja selama hampir setahun, <a href="https://deadline.com/2025/07/sag-aftra-video-game-agreement-approved-strike-1236453741/" target="_blank" rel="noreferrer">anggota SAG-AFTRA meratifikasi Interactive Media Agreement baru pada 9 Juli 2025 dengan 95% suara</a>, yang secara resmi mengakhiri <a href="https://en.wikipedia.org/wiki/2024%E2%80%932025_SAG-AFTRA_video_game_strike" target="_blank" rel="noreferrer">mogok kerja industri video game yang dimulai pada Juli 2024</a>. Ketentuan AI dalam perjanjian tersebut mewajibkan <a href="https://variety.com/2025/gaming/news/video-game-actors-strike-contract-ratified-sag-aftra-1236451291/" target="_blank" rel="noreferrer">persetujuan, pengungkapan, dan kompensasi sebelum replika suara digital seorang penampil digunakan</a>. Perjanjian itu juga memungkinkan penampil menangguhkan persetujuan untuk pembuatan materi AI baru selama mogok kerja.</p>
<p>Jika Anda seorang developer indie yang menggunakan suara preset sintetis, kontrak tersebut tidak secara langsung mengikat Anda karena kontrak itu mengatur studio penanda tangan yang bekerja dengan penampil anggota serikat. Namun, kontrak tersebut menetapkan standar yang kini digunakan untuk menilai semua pihak: dapatkan persetujuan tegas yang disertai pembayaran sebelum mengkloning suara manusia sungguhan. Jangan mengambil demo suara seorang pengisi suara atau klip seorang streamer untuk melatih model. Perjuangan serikat pekerja tersebut secara khusus menyangkut penampil yang digantikan oleh AI yang dilatih menggunakan karya mereka sendiri tanpa izin. Melakukan hal itu sebagai studio kecil menghadirkan risiko hukum sekaligus ranjau reputasi.</p>
<h2 id="persyaratan-pengungkapan" tabindex="-1">Persyaratan pengungkapan <a class="header-anchor" href="#persyaratan-pengungkapan" aria-label="Permalink to &quot;Persyaratan pengungkapan&quot;"></a></h2>
<p>Jika merilis game di Steam, Anda wajib mengungkapkan konten suara AI. <a href="https://finance.biggo.com/news/202601171220_Steam_AI_Disclosure_Update_Focuses_on_Player_Content" target="_blank" rel="noreferrer">Kebijakan pengungkapan AI Valve telah berlaku sejak awal 2024 dan diperbarui pada 17 Januari 2026</a> agar secara khusus berfokus pada konten hasil AI yang disertakan bersama game dan <a href="https://www.pcgamer.com/software/ai/steam-updates-ai-disclosure-form-to-specify-that-its-focused-on-ai-generated-content-that-is-consumed-by-players-not-efficiency-tools-used-behind-the-scenes/" target="_blank" rel="noreferrer">dinikmati oleh pemain, bukan alat efisiensi yang digunakan di balik layar</a>. Dialog suara AI secara eksplisit termasuk dalam cakupannya. Kebijakan tersebut membedakan konten yang dibuat sebelumnya, yaitu konten yang sudah disertakan dalam unduhan seperti dialog suara dan gambar AI, dari konten yang dibuat secara live, yaitu ketika game menghasilkan dialog secara langsung dan Anda diwajibkan menerapkan batasan pengaman terhadap hasil ilegal atau ofensif. Pengungkapan Anda akan muncul pada halaman toko di bagian &quot;About This Game&quot; dan dapat dilihat pemain sebelum membeli.</p>
<p>Makna praktisnya: jika Anda menggunakan AI untuk menghasilkan dialog suara yang disertakan dalam game, centang kotak konten yang dibuat sebelumnya dan jelaskan dengan jujur. Jika NPC Anda menghasilkan dialog saat runtime, konten tersebut termasuk hasil yang dibuat secara live dan memiliki kewajiban tambahan untuk menerapkan batasan pengaman. Platform lain saat ini belum memiliki aturan seformal Steam mengenai pengungkapan suara khusus game, tetapi arah industrinya menuju pelabelan yang lebih luas, bukan lebih sedikit. Bersikap terbuka juga cenderung diterima lebih baik oleh pemain daripada ketahuan belakangan. Selain aturan toko, beberapa komunitas dan ajang penghargaan memiliki batasan sendiri: <a href="https://www.notebookcheck.net/Indie-Game-Awards-disqualify-Clair-Obscur-Expedition-33-after-generative-AI-controversy.1189979.0.html" target="_blank" rel="noreferrer">Indie Game Awards mendiskualifikasi salah satu nomine pada 2025 setelah penggunaan AI generatif terungkap</a>. Jadi, jika Anda menargetkan festival atau etalase tertentu, baca juga kebijakannya.</p>
<h2 id="tips-alur-kerja" tabindex="-1">Tips alur kerja <a class="header-anchor" href="#tips-alur-kerja" aria-label="Permalink to &quot;Tips alur kerja&quot;"></a></h2>
<p>Perbedaan antara suara AI yang terdengar seperti suara dalam game dan suara AI yang terdengar seperti sistem telepon otomatis sebagian besar terletak pada pengarahannya. Tulis dialog sesuai cara yang Anda inginkan saat dibawakan, dengan tanda baca yang benar-benar berperan, karena koma, elipsis, dan jeda baris lebih memengaruhi tempo dibandingkan pengaturan apa pun. Buat beberapa versi untuk setiap dialog penting lalu pilih yang terbaik, sama seperti yang dilakukan sutradara dengan aktor manusia. Pertahankan suara yang konsisten untuk setiap karakter di seluruh naskah, dan catat ID suara serta pengaturan persis yang digunakan agar dialog yang dibuat ulang tiga bulan kemudian tetap terdengar selaras.</p>
<p>Buat suara secara massal setelah naskah stabil daripada terus-menerus membuat ulang selama proses penulisan, karena di situlah kredit dan waktu cepat terkuras. Untuk momen emosional, beberapa alat memungkinkan Anda mengarahkan nada dengan instruksi singkat atau kontrol emosi. Sebaiknya curahkan upaya Anda pada bagian tersebut dan biarkan seruan-seruan sekali pakai dibuat secara otomatis. Pertahankan tingkat kenyaringan dan format sulih suara yang sama dengan audio lainnya agar dialog, <a href="/id/guides/free-sound-effects-music.html">musik, dan efek suara</a> berpadu dengan baik dalam proses mixing. Uji juga suara tersebut kepada pemain sungguhan sejak awal, karena penyampaian datar yang tak lagi Anda sadari setelah mendengarnya untuk kelima puluh kali justru menjadi hal pertama yang diperhatikan pemain baru.</p>
<h2 id="kapan-sebaiknya-menggunakan-aktor-manusia" tabindex="-1">Kapan sebaiknya menggunakan aktor manusia <a class="header-anchor" href="#kapan-sebaiknya-menggunakan-aktor-manusia" aria-label="Permalink to &quot;Kapan sebaiknya menggunakan aktor manusia&quot;"></a></h2>
<p>Suara AI adalah alat, bukan pengganti sebuah penampilan, dan developer yang menggunakannya dengan baik bersikap jujur mengenai hal itu. Bahkan <a href="https://gamerant.com/arc-raiders-controversial-ai-voice-change/" target="_blank" rel="noreferrer">Embark Studios, yang merilis ARC Raiders dengan dialog buatan AI pada Oktober 2025, mengganti banyak dialog tersebut dengan penampilan aktor manusia setelah peluncuran</a>, sementara CEO studio tersebut menyatakan dengan terus terang bahwa terdapat perbedaan kualitas antara AI dan aktor profesional sungguhan. Itulah pertandanya. Jika suara karakter menjadi bagian utama dari identitas game Anda, jika Anda mengandalkan akting emosional yang halus, atau jika audiens Anda cenderung mencermati dan mengecam suara AI, pekerjakan aktor manusia. Aktor sungguhan menghadirkan interpretasi, improvisasi, dan kekhasan yang masih sekadar didekati, belum dapat ditandingi, oleh model saat ini.</p>
<p>Gunakan suara AI di bagian yang benar-benar sesuai: pembuatan prototipe dan trek sementara agar Anda dapat mendengar pengaturan waktu dialog sebelum berkomitmen, dialog fungsional bervolume tinggi seperti percakapan radio dan seruan umum, suara pengganti sementara yang akan Anda ganti nanti, proyek solo tanpa anggaran yang alternatifnya hanyalah keheningan, serta fitur aksesibilitas seperti membacakan teks UI. Jalan tengah yang umum adalah membuat semuanya dengan AI untuk menyempurnakan naskah dan pengaturan waktu, lalu mendatangkan aktor manusia untuk dialog yang menjadi inti game. Dengan begitu, Anda menggunakan anggaran sulih suara pada bagian yang memberikan dampak terbesar dan membiarkan AI menangani sisanya.</p>
<BuildCta
  title="Buat gamenya dahulu, lalu tentukan suaranya"
  desc="Cinevva mengubah prompt menjadi game yang dapat dimainkan di browser Anda, lengkap dengan efek suara dan musik yang dibuatkan untuk Anda. Sulih suara dapat Anda tambahkan menggunakan alat-alat di atas."
  prompt="Buat game petualangan naratif singkat dengan dialog bercabang" />
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-penggunaan-suara-ai-dalam-game-komersial-legal" tabindex="-1">Apakah penggunaan suara AI dalam game komersial legal? <a class="header-anchor" href="#apakah-penggunaan-suara-ai-dalam-game-komersial-legal" aria-label="Permalink to &quot;Apakah penggunaan suara AI dalam game komersial legal?&quot;"></a></h3>
<p>Ya, selama Anda menggunakan alat yang lisensinya mengizinkan penggunaan komersial dan tidak mengkloning suara orang sungguhan tanpa persetujuan mereka. Paket berbayar ElevenLabs, OpenAI, Murf, dan Resemble semuanya menyertakan hak penggunaan komersial, sedangkan model sumber terbuka berlisensi permisif seperti Piper dan Bark dapat dirilis secara gratis. Ada dua cara yang dapat menimbulkan masalah: merilis hasil dari paket gratis yang melarang penggunaan komersial dan mewajibkan atribusi, atau melatih suara menggunakan rekaman aktor sungguhan tanpa izin. Keduanya dapat dihindari.</p>
<h3 id="berapa-biaya-sulih-suara-ai-untuk-sebuah-game" tabindex="-1">Berapa biaya sulih suara AI untuk sebuah game? <a class="header-anchor" href="#berapa-biaya-sulih-suara-ai-untuk-sebuah-game" aria-label="Permalink to &quot;Berapa biaya sulih suara AI untuk sebuah game?&quot;"></a></h3>
<p>Lebih murah daripada perkiraan kebanyakan orang. Game singkat dengan beberapa ratus dialog dapat dibuat menggunakan paket Starter ElevenLabs seharga $6 per bulan atau dengan biaya kurang dari satu dolar melalui API OpenAI, sedangkan model sumber terbuka dapat dijalankan secara gratis di perangkat keras Anda sendiri. RPG yang sarat dialog, dengan ribuan baris dan banyak bahasa, mungkin mengharuskan Anda menggunakan paket seharga $99 atau menghabiskan API hingga ratusan dolar. Bahkan pada kisaran tertinggi, biaya tersebut hanya sebagian kecil dari biaya seluruh jajaran pengisi suara manusia.</p>
<h3 id="apakah-saya-harus-mengungkapkan-penggunaan-sulih-suara-ai-di-steam" tabindex="-1">Apakah saya harus mengungkapkan penggunaan sulih suara AI di Steam? <a class="header-anchor" href="#apakah-saya-harus-mengungkapkan-penggunaan-sulih-suara-ai-di-steam" aria-label="Permalink to &quot;Apakah saya harus mengungkapkan penggunaan sulih suara AI di Steam?&quot;"></a></h3>
<p>Ya. Kebijakan pengungkapan AI Steam mewajibkan Anda menyatakan konten buatan AI yang disertakan dalam game dan dinikmati pemain, dan dialog suara AI secara eksplisit termasuk di dalamnya. Pengungkapan tersebut muncul di halaman toko Anda pada bagian &quot;Tentang Game Ini&quot;. Sejak pembaruan Januari 2026, alat di balik layar yang tidak menghasilkan konten untuk pemain bukanlah fokus utamanya, tetapi dialog suara yang benar-benar didengar pemain termasuk di dalamnya. Jika game Anda menghasilkan dialog secara langsung saat runtime, hal tersebut masuk dalam kategori terpisah yang juga memerlukan pengamanan keselamatan.</p>
<h3 id="dapatkah-saya-mengkloning-suara-aktor-atau-selebritas-sungguhan-untuk-game-saya" tabindex="-1">Dapatkah saya mengkloning suara aktor atau selebritas sungguhan untuk game saya? <a class="header-anchor" href="#dapatkah-saya-mengkloning-suara-aktor-atau-selebritas-sungguhan-untuk-game-saya" aria-label="Permalink to &quot;Dapatkah saya mengkloning suara aktor atau selebritas sungguhan untuk game saya?&quot;"></a></h3>
<p>Tidak tanpa persetujuan eksplisit dan berbayar dari mereka. Mengkloning suara orang sungguhan tanpa izin dapat membuat Anda menghadapi tuntutan hukum terkait hak atas kemiripan dan publisitas, dan praktik inilah yang ingin dihentikan oleh perjanjian video game SAG-AFTRA. Kontrak tahun 2025 mewajibkan persetujuan, pengungkapan, dan kompensasi untuk replika suara digital para penampil. Meskipun Anda adalah developer indie yang tidak terikat kontrak tersebut, risiko hukum dan reputasi akibat kloning tanpa izin tetap nyata. Gunakan suara sintetis bawaan atau lisensikan suara dengan benar.</p>
<h3 id="akankah-pemain-tahu-bahwa-saya-menggunakan-suara-ai-dan-apakah-mereka-akan-keberatan" tabindex="-1">Akankah pemain tahu bahwa saya menggunakan suara AI, dan apakah mereka akan keberatan? <a class="header-anchor" href="#akankah-pemain-tahu-bahwa-saya-menggunakan-suara-ai-dan-apakah-mereka-akan-keberatan" aria-label="Permalink to &quot;Akankah pemain tahu bahwa saya menggunakan suara AI, dan apakah mereka akan keberatan?&quot;"></a></h3>
<p>Sering kali jawaban untuk keduanya adalah ya. Pemain makin mahir mengenali penyampaian text-to-speech saat ini yang datar dan terasa sedikit janggal, dan beberapa game pada 2025 dan 2026 mendapat reaksi negatif publik karena suara AI, hingga beberapa developer membatalkan keputusan tersebut setelah peluncuran. Hal ini tidak berlaku secara universal, dan dialog fungsional atau suara yang jelas-jelas bergaya cenderung mendapat lebih sedikit kritik dibandingkan karakter utama yang membacakan dialog emosional. Bersikaplah jujur dalam pengungkapan Anda, gunakan AI di bagian yang sesuai alih-alih di bagian yang jelas-jelas tidak cocok, dan pertimbangkan aktor manusia untuk suara yang menentukan identitas game Anda.</p>
<h3 id="apa-alat-suara-ai-gratis-terbaik-untuk-game" tabindex="-1">Apa alat suara AI gratis terbaik untuk game? <a class="header-anchor" href="#apa-alat-suara-ai-gratis-terbaik-untuk-game" aria-label="Permalink to &quot;Apa alat suara AI gratis terbaik untuk game?&quot;"></a></h3>
<p>Untuk game komersial yang siap dirilis tanpa anggaran, gunakan model sumber terbuka berlisensi permisif karena paket gratis dari alat berbayar melarang penggunaan komersial. Piper dapat berjalan pada CPU biasa dan sangat cocok untuk perangkat berspesifikasi rendah atau pembuatan suara saat runtime, sementara Bark dan Kokoro sama-sama mudah disertakan dalam rilis. XTTS v2 menawarkan kloning suara multibahasa terbaik jika Anda memiliki GPU, tetapi hanya cocok untuk prototipe, bukan untuk dirilis: bobot modelnya menggunakan lisensi CPML milik Coqui yang bersifat nonkomersial. Pastikan dahulu lisensi model tertentu sebelum menggunakannya sebagai dasar proyek, karena &quot;sumber terbuka&quot; tidak selalu berarti &quot;penggunaan komersial diizinkan&quot;.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-music-generators-games.html">Generator Musik AI Terbaik untuk Game</a> — pertanyaan yang sama mengenai alat untuk soundtrack Anda</li>
<li><a href="/id/guides/free-sound-effects-music.html">Efek Suara dan Musik Gratis untuk Game</a> — tempat mendapatkan audio lainnya secara legal</li>
<li><a href="/id/guides/ai-npcs-dialogue.html">NPC dan Dialog AI</a> — membuat percakapan, bukan sekadar membacakannya</li>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI untuk Game</a> — karya visual, model, dan audio dari sebuah prompt</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — arti sebenarnya dari komersial, CC0, dan bebas royalti</li>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Tanpa Coding)</a> — buat game yang akan menggunakan suara-suara tersebut</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/ai-voice-acting-games-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Sprite 2D, Pixel Art, dan Tileset Gratis Terbaik untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/free-2d-sprites-tilesets</link>
            <guid>https://app.cinevva.com/id/guides/free-2d-sprites-tilesets</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Sprite 2D, pixel art, dan tileset gratis terbaik pada 2026: sumber CC0 seperti Kenney, OpenGameArt, kreator itch.io, dan generator AI, lengkap dengan penjelasan lisensinya.]]></description>
            <content:encoded><![CDATA[<h1 id="sprite-2d-pixel-art-dan-tileset-gratis-terbaik-untuk-game-2026" tabindex="-1">Sprite 2D, Pixel Art, dan Tileset Gratis Terbaik untuk Game (2026) <a class="header-anchor" href="#sprite-2d-pixel-art-dan-tileset-gratis-terbaik-untuk-game-2026" aria-label="Permalink to &quot;Sprite 2D, Pixel Art, dan Tileset Gratis Terbaik untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Tempat terbaik untuk mendapatkan sprite 2D, pixel art, dan tileset gratis untuk game adalah Kenney (lebih dari 40.000 aset CC0), OpenGameArt (saring berdasarkan lisensi), serta sejumlah kreator itch.io seperti Pixel Frog, Ansimuz, dan 0x72 yang merilis paket lengkap dengan lisensi CC0. Semuanya aman digunakan untuk game komersial tanpa wajib mencantumkan atribusi. Berikut semua sumber yang layak disimpan pada 2026, dengan ketentuan lisensi yang telah diverifikasi secara tepat agar Anda tidak perlu menebak-nebak.</p>
<figure class="sample-sheet">
<a href="/id/assets?providers=kenney"><img src="https://cdn.cinevva.com/guides/samples/samples-pixel-tiles.jpg" alt="Sprite pixel-art dari paket CC0 Kenney: astronaut, pintu ruang bawah tanah, pesawat shmup, dan tile platformer" loading="lazy"></a>
<figcaption>Karakter pixel-art, kapal, tile, dan properti dari paket pixel CC0 Kenney. <a href="/id/assets?providers=kenney">Jelajahi semuanya di pustaka aset</a>.</figcaption>
</figure>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<ul>
<li><strong>Sumber serba ada, gaya konsisten, tanpa risiko lisensi:</strong> Kenney (CC0).</li>
<li><strong>Paket platformer lengkap dengan karakter beranimasi:</strong> Pixel Frog dan Ansimuz di itch.io (CC0).</li>
<li><strong>Tile dan karakter dungeon crawler:</strong> DungeonTileset II dari 0x72 (CC0).</li>
<li><strong>Tile RPG tampak atas:</strong> Cainos di itch.io, atau koleksi LPC di OpenGameArt.</li>
<li><strong>Ribuan ikon UI dan inventaris:</strong> Game-icons.net (CC BY 3.0, wajib mencantumkan kredit).</li>
<li><strong>Gambar sendiri:</strong> Aseprite (berbayar), Libresprite atau Piskel (gratis).</li>
</ul>
<h2 id="referensi-cepat" tabindex="-1">Referensi Cepat <a class="header-anchor" href="#referensi-cepat" aria-label="Permalink to &quot;Referensi Cepat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kebutuhan</th>
<th>Sumber Terbaik</th>
<th>Lisensi</th>
<th>Atribusi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Sprite dan tile platformer</td>
<td>Kenney, Pixel Frog</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Tileset dungeon pixel art</td>
<td>0x72</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Tile RPG tampak atas</td>
<td>Cainos, LPC (OpenGameArt)</td>
<td>Gratis / CC-BY-SA + GPL</td>
<td>Tidak ada / kredit + berbagi serupa</td>
</tr>
<tr>
<td>Arsip besar yang dapat ditelusuri</td>
<td>OpenGameArt</td>
<td>CC0 hingga CC-BY-SA</td>
<td>Bergantung pada filter</td>
</tr>
<tr>
<td>Paket bertema yang berkualitas</td>
<td>Gratisan CraftPix</td>
<td>Lisensi CraftPix</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>UI game dan ikon item</td>
<td>Game-icons.net</td>
<td>CC BY 3.0</td>
<td>Wajib</td>
</tr>
<tr>
<td>Palet dan teknik</td>
<td>Lospec</td>
<td>Bervariasi</td>
<td>tidak berlaku</td>
</tr>
</tbody>
</table>
<h2 id="andalan-cc0-kenney" tabindex="-1">Andalan CC0: Kenney <a class="header-anchor" href="#andalan-cc0-kenney" aria-label="Permalink to &quot;Andalan CC0: Kenney&quot;"></a></h2>
<figure class="sample-sheet">
<a href="/id/assets?providers=kenney"><img src="https://cdn.cinevva.com/guides/samples/samples-kenney-sprites.jpg" alt="Contoh sprite 2D CC0 dari Kenney: karakter astronaut, pesawat luar angkasa, tile pixel, emote hati, dan alien" loading="lazy"></a>
<figcaption>Sekilas ragam aset 2D Kenney: karakter, kapal, tile, dan emote, semuanya CC0. <a href="/id/assets?providers=kenney">Jelajahi sprite Kenney di pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kenney.nl" target="_blank" rel="noreferrer">kenney.nl</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (domain publik), tidak wajib mencantumkan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 40.000 aset dalam 270+ paket, dengan lebih dari 100 paket di bagian 2D saja</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Sprite dan spritesheet PNG, serta sumber vektor dalam banyak paket</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, ZIP gratis untuk setiap paket</td>
</tr>
</tbody>
</table>
<p>Kenney adalah titik awal terbaik untuk aset visual game 2D, jauh mengungguli pilihan lainnya. Semuanya berlisensi CC0, semuanya telah dipotong menjadi spritesheet siap pakai untuk game, dan paket dalam satu keluarga gaya saling serasi. Jadi, Anda dapat menggabungkan New Platformer Pack dengan UI Pack dan Input Prompts tanpa membuat gaya visualnya berbenturan. Seri Tiny (Tiny Town, Tiny Farm, Tiny Dungeon) populer untuk game tampak atas 16x16, sementara Roguelike Characters mencakup ratusan karakter mungil dalam satu lembar. Sprite Kenney juga <a href="/id/assets.html?providers=kenney">dapat dicari di dalam pustaka aset Cinevva</a>.</p>
<figure class="sample-sheet">
<a href="/id/assets?providers=kenney"><img src="https://cdn.cinevva.com/guides/samples/samples-kenney-ui.jpg" alt="Elemen UI CC0 Kenney: tombol, ikon gamepad, petunjuk tombol, tanda centang, kartu item, medali, dan crosshair" loading="lazy"></a>
<figcaption>Tombol, ikon, petunjuk input, crosshair, dan kartu item dari paket UI CC0 Kenney. <a href="/id/assets?providers=kenney">Jelajahi paket UI di pustaka aset</a>.</figcaption>
</figure>
<h2 id="opengameart" tabindex="-1">OpenGameArt <a class="header-anchor" href="#opengameart" aria-label="Permalink to &quot;OpenGameArt&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://opengameart.org" target="_blank" rel="noreferrer">opengameart.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Per aset: CC0, OGA-BY, CC-BY, CC-BY-SA, GPL, domain publik</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan kiriman 2D, digerakkan komunitas sejak 2009</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>PNG, spritesheet, dan berkas sumber yang berbeda-beda untuk setiap kiriman</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, berkas dilampirkan pada setiap halaman kiriman</td>
</tr>
</tbody>
</table>
<p>OpenGameArt adalah arsip aset visual game gratis tertua yang masih beroperasi, dan tetap aktif pada 2026 dengan art jam rutin serta kiriman baru. Kualitasnya sangat bervariasi, jadi filter lisensi situs ini adalah kuncinya: cari dengan kotak centang CC0 aktif dan Anda hanya akan memperoleh hasil yang aman untuk penggunaan komersial. Koleksi unggulannya adalah gaya Liberated Pixel Cup (LPC), sebuah standar aset visual RPG tampak atas 32x32 terkoordinasi dengan pustaka besar berisi tile dan karakter yang saling serasi, ditambah Universal LPC Spritesheet Character Generator. Ada satu hal yang perlu diperhatikan: aset LPC memiliki lisensi ganda CC-BY-SA 3.0 dan GPLv3. Artinya, kredit wajib dicantumkan dan karya turunannya harus memakai lisensi yang sama. Karena itu, baca <a href="/id/guides/game-asset-licenses.html">panduan lisensi</a> kami sebelum menggunakannya sebagai dasar game komersial.</p>
<h2 id="paket-aset-gratis-itch-io" tabindex="-1">Paket aset gratis itch.io <a class="header-anchor" href="#paket-aset-gratis-itch-io" aria-label="Permalink to &quot;Paket aset gratis itch.io&quot;"></a></h2>
<p>itch.io menampung lebih dari 6.500 paket gratis hanya di bawah tag Sprites, dan di sanalah sebagian besar seniman pixel art aktif menerbitkan karya mereka. Lisensi ditentukan per paket oleh masing-masing kreator, jadi selalu periksa halaman paketnya. Kreator berikut selalu layak mendapat perhatian Anda.</p>
<h3 id="pixel-frog" tabindex="-1">Pixel Frog <a class="header-anchor" href="#pixel-frog" aria-label="Permalink to &quot;Pixel Frog&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://pixelfrog-assets.itch.io" target="_blank" rel="noreferrer">pixelfrog-assets.itch.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Pixel Adventure secara eksplisit berlisensi CC0; periksa setiap halaman paket</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Paket bertema lengkap: Pixel Adventure 1 dan 2, Kings and Pigs, Treasure Hunters, Pirate Bomb, Tiny Swords</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Spritesheet PNG, animasi pada 20 FPS</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, gratis (bayar sesuka Anda)</td>
</tr>
</tbody>
</table>
<p>Jika Anda ingin membuat platformer lengkap akhir pekan ini, mulailah dari sini. Pixel Adventure memberi Anda karakter beranimasi, musuh, tileset, jebakan, dan item dalam satu gaya yang selaras. Semuanya dirilis dengan lisensi CC0 sehingga Anda dapat menerbitkannya secara komersial tanpa kredit. Tiny Swords, paket pertempuran tampak atas yang lebih baru, sering diperbarui dan memuncaki tangga sprite gratis itch.io pada 2026.</p>
<h3 id="ansimuz" tabindex="-1">Ansimuz <a class="header-anchor" href="#ansimuz" aria-label="Permalink to &quot;Ansimuz&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://ansimuz.itch.io" target="_blank" rel="noreferrer">ansimuz.itch.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>SunnyLand secara eksplisit berlisensi CC0; paket gratis lainnya bervariasi, jadi periksa setiap halaman</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Katalog besar: SunnyLand, seri Warped, Gothicvania, TinyRPG, dan koleksi lawas 16-bit gratis</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Spritesheet PNG, latar belakang paralaks, dan SunnyLand menyertakan berkas proyek Phaser serta Godot</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, paket gratis tersedia bersama koleksi mega berbayar</td>
</tr>
</tbody>
</table>
<p>Ansimuz telah membagikan pixel art berkualitas tinggi secara gratis selama satu dekade. SunnyLand adalah paket gratis andalannya, sebuah kit platformer CC0 lengkap dengan karakter pemain beranimasi, musuh, properti, efek, bahkan musik, serta proyek Phaser dan Godot siap pakai. Paket metroidvania Warped gratis dan koleksi lawas 16-bit cocok untuk nuansa fiksi ilmiah yang lebih gelap. Koleksi besar Gothicvania memang berbayar, tetapi versi gratisnya saja cukup untuk menyelesaikan sebuah game.</p>
<h3 id="_0x72" tabindex="-1">0x72 <a class="header-anchor" href="#_0x72" aria-label="Permalink to &quot;0x72&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://0x72.itch.io" target="_blank" rel="noreferrer">0x72.itch.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>DungeonTileset II secara eksplisit berlisensi CC0, kredit tidak diperlukan</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>DungeonTileset II 16x16, ditambah tileset industrial, bajak laut, dan robot gratis</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Atlas PNG, autotile disertakan sejak v1.7</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, gratis (bayar sesuka Anda)</td>
</tr>
</tbody>
</table>
<p>DungeonTileset II adalah jawaban standar untuk pertanyaan &quot;tileset roguelike gratis&quot; dan sudah demikian selama bertahun-tahun. Satu unduhan memberi Anda dinding dan lantai dungeon, obor beranimasi, jebakan, senjata, serta puluhan karakter beranimasi dari kesatria hingga iblis. Semuanya berukuran 16x16, semuanya CC0, dan masih aktif dipelihara. Jika pernah memainkan dungeon crawler indie berskala kecil, Anda mungkin pernah melihat sprite ini.</p>
<h3 id="cainos" tabindex="-1">Cainos <a class="header-anchor" href="#cainos" aria-label="Permalink to &quot;Cainos&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://cainos.itch.io" target="_blank" rel="noreferrer">cainos.itch.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis untuk proyek komersial, kredit tidak diperlukan, dilarang mendistribusikan ulang atau menjual kembali</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Pixel Art Top Down - Basic: tileset 32x32, 48 properti, pohon, dan pengontrol karakter</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Tileset dan sprite PNG, proyek Unity disertakan, teksturnya juga dapat digunakan di Godot</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, gratis (bayar sesuka Anda)</td>
</tr>
</tbody>
</table>
<p>Pixel Art Top Down - Basic adalah salah satu titik awal gratis paling rapi untuk RPG tampak atas atau game bertani. Anda mendapatkan tileset rumput, batu, dan dinding dengan properti serta sprite bayangan yang serasi pada ukuran 32x32, ditambah adegan demo Unity sederhana. Lisensinya merupakan lisensi milik Cainos sendiri, bukan CC0, tetapi ketentuannya jelas: gunakan dalam game gratis maupun komersial, modifikasi dengan bebas, tetapi jangan menjual kembali berkas mentahnya.</p>
<h3 id="penusbmic" tabindex="-1">penusbmic <a class="header-anchor" href="#penusbmic" aria-label="Permalink to &quot;penusbmic&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://penusbmic.itch.io" target="_blank" rel="noreferrer">penusbmic.itch.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Per paket; periksa setiap halaman sebelum menerbitkan game</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Paket bulanan: DARK Series, STRANDED, karakter fiksi ilmiah, dan sampel gratis di sebagian besar seri</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Spritesheet PNG dengan animasi multiframe yang mulus</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, sampel gratis tersedia bersama paket berbayar ($1.99 hingga $9.99)</td>
</tr>
</tbody>
</table>
<p>Penusbmic pernah mengerjakan Dome Keeper dan Shogun Showdown, dan kualitas animasinya menunjukkan pengalaman tersebut. Sebagian besar seri menyertakan sampel gratis, seperti Skeleton Warrior gratis, tileset Dungeon Ruins gratis, dan satu hero gratis dari DARK Series. Paket lengkapnya juga cukup murah untuk dibeli saat Anda memutuskan akan menggunakannya. Ketentuan lisensi tercantum pada setiap halaman paket, jadi bacalah sebelum merilis game komersial.</p>
<h3 id="gratisan-craftpix" tabindex="-1">Gratisan CraftPix <a class="header-anchor" href="#gratisan-craftpix" aria-label="Permalink to &quot;Gratisan CraftPix&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://craftpix.net/freebies/" target="_blank" rel="noreferrer">craftpix.net/freebies</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Lisensi milik CraftPix sendiri: penggunaan komersial diizinkan, proyek tanpa batas, lihat halaman file-licenses mereka</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ratusan paket gratis di sekitar 291 halaman: sprite, tileset, kit GUI, ikon, dan latar belakang</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>PNG, sumber berlayer dalam banyak paket</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, akun gratis mungkin diperlukan</td>
</tr>
</tbody>
</table>
<p>CraftPix adalah toko aset komersial dengan bagian gratis yang luar biasa lengkap. Gratisannya berupa paket matang berkualitas produksi, dan ketentuan yang dinyatakan mengizinkan penggunaan komersial dalam proyek tanpa batas. Lisensinya bukan CC0, melainkan lisensi mereka sendiri dengan pembatasan penjualan kembali. Cukup baca sekilas halaman file-licenses mereka satu kali dan Anda siap menggunakannya. Sumber ini sangat cocok untuk kit GUI lengkap dan paket karakter bertema yang akan memerlukan waktu berminggu-minggu jika digambar sendiri.</p>
<h2 id="game-icons-net" tabindex="-1">Game-icons.net <a class="header-anchor" href="#game-icons-net" aria-label="Permalink to &quot;Game-icons.net&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://game-icons.net" target="_blank" rel="noreferrer">game-icons.net</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC BY 3.0, atribusi wajib dicantumkan</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 4.100 ikon karya Lorc, Delapouite, dan kontributor</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>SVG dan PNG, varian putih di atas hitam serta transparan</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, per ikon atau paket lengkap</td>
</tr>
</tbody>
</table>
<p>Setiap layar inventaris, pohon keahlian, dan tooltip item memerlukan ikon, dan game-icons.net menyediakan lebih dari 4.100 ikon dalam satu gaya stensil yang konsisten, semuanya berupa SVG yang dapat diwarnai ulang. Kekurangannya terletak pada lisensinya: CC BY 3.0 berarti Anda wajib mencantumkan kredit kepada para pembuatnya di dalam game. Satu baris pada layar kredit sudah cukup, dan itu merupakan imbal balik yang wajar untuk koleksi selengkap ini.</p>
<h2 id="lospec" tabindex="-1">Lospec <a class="header-anchor" href="#lospec" aria-label="Permalink to &quot;Lospec&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://lospec.com" target="_blank" rel="noreferrer">lospec.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Palet bebas digunakan, sedangkan karya seni di galeri merupakan milik senimannya</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 4.300 palet warna dalam 6 format unduhan, serta lebih dari 500 tutorial</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Berkas palet (PNG, ASE, GPL, dan lainnya)</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p>Lospec bukan pustaka sprite, melainkan pusat referensi komunitas pixel art. Situs ini layak masuk daftar karena palet menyumbang separuh dari daya tarik visual pixel art. Ambil palet teruji seperti set 16 atau 32 warna, muat ke editor Anda, dan sprite akan langsung terlihat terarah alih-alih kusam. Bagian tutorialnya merupakan salah satu sumber pembelajaran pixel art gratis terbaik di web, sementara alat-alatnya (scaler dan generator dither) menyelesaikan masalah alur kerja yang nyata.</p>
<h2 id="gambar-sendiri" tabindex="-1">Gambar sendiri <a class="header-anchor" href="#gambar-sendiri" aria-label="Permalink to &quot;Gambar sendiri&quot;"></a></h2>
<p>Jika Anda tidak dapat menemukan sprite yang dibutuhkan, menggambar karakter 16x16 sebenarnya lebih mudah didekati daripada yang Anda bayangkan. Aseprite adalah editor standar industri yang dapat dibeli sekali dan menyediakan versi uji coba. Seluruh fiturnya dirancang untuk spritesheet, onion-skinning animasi, dan pengaturan palet. Kode sumbernya juga tersedia di GitHub jika Anda lebih suka mengompilasinya sendiri. Libresprite adalah fork gratis dan sumber terbuka dari versi lama Aseprite yang mencakup semua fitur dasar. Piskel adalah editor gratis dan sumber terbuka yang berjalan di browser tanpa perlu instalasi, dapat mengekspor spritesheet PNG dan GIF beranimasi, serta memiliki aplikasi desktop untuk Windows, macOS, dan Linux. Mulailah dengan Piskel untuk belajar, lalu beralihlah ke Aseprite setelah Anda benar-benar menyukainya.</p>
<h2 id="membuat-sprite-dengan-ai" tabindex="-1">Membuat sprite dengan AI <a class="header-anchor" href="#membuat-sprite-dengan-ai" aria-label="Permalink to &quot;Membuat sprite dengan AI&quot;"></a></h2>
<p>Pada 2026, alat AI dapat menghasilkan pixel art yang dapat digunakan, bahkan sprite sheet beranimasi. PixelLab berjalan di browser atau sebagai plugin Aseprite dan dapat menghasilkan karakter dengan varian 4 atau 8 arah serta frame animasi, yang sebelumnya merupakan bagian paling melelahkan dalam pembuatan sprite. Retro Diffusion melatih model secara khusus menggunakan pixel art dan sprite sheet multiframe, sehingga hasilnya lebih mendekati aset siap pakai untuk game dibandingkan model gambar umum. Ada dua hal yang perlu diperhatikan. Hak penggunaan komersial pada alat berbasis layanan biasanya terkait dengan paket berbayar, jadi periksa ketentuannya sebelum menerbitkan game. Selain itu, keluaran AI hampir selalu memerlukan perapian di editor pixel untuk menjaga kedisiplinan palet dan konsistensi proporsi di seluruh set karakter. Jadi, perlakukan hasilnya sebagai draf awal yang cepat, bukan aset akhir. <a href="/id/assets.html">Pencarian aset</a> Cinevva juga mencakup ratusan sprite CC0 yang dapat langsung Anda masukkan ke dalam game tanpa perlu membuat apa pun.</p>
<h2 id="memahami-lisensi-dalam-30-detik" tabindex="-1">Memahami lisensi dalam 30 detik <a class="header-anchor" href="#memahami-lisensi-dalam-30-detik" aria-label="Permalink to &quot;Memahami lisensi dalam 30 detik&quot;"></a></h2>
<ul>
<li><strong>CC0:</strong> domain publik. Dapat digunakan secara komersial, dimodifikasi, dan tidak memerlukan atribusi. Pilihan paling aman.</li>
<li><strong>CC-BY:</strong> bebas digunakan secara komersial, tetapi Anda wajib mencantumkan kredit kepada kreatornya.</li>
<li><strong>CC-BY-SA:</strong> wajib mencantumkan kredit, dan karya turunan harus menggunakan lisensi yang sama. Ini berlaku untuk LPC.</li>
<li><strong>Lisensi milik kreator sendiri (Cainos, CraftPix):</strong> biasanya berarti &quot;boleh digunakan dalam proyek apa pun, tetapi file-nya tidak boleh dijual kembali.&quot; Baca halaman paketnya.</li>
</ul>
<p>Jika ragu, pilih CC0. Untuk penjelasan lengkapnya, lihat <a href="/id/guides/game-asset-licenses.html">panduan lisensi aset game</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="di-mana-saya-bisa-mengunduh-sprite-2d-gratis-untuk-game" tabindex="-1">Di mana saya bisa mengunduh sprite 2D gratis untuk game? <a class="header-anchor" href="#di-mana-saya-bisa-mengunduh-sprite-2d-gratis-untuk-game" aria-label="Permalink to &quot;Di mana saya bisa mengunduh sprite 2D gratis untuk game?&quot;"></a></h3>
<p>Kenney adalah tempat terbaik untuk memulai, dengan lebih dari 40.000 aset CC0 yang mencakup sprite, tileset, dan paket UI. Di itch.io, Pixel Frog dan Ansimuz merilis paket animasi lengkap berlisensi CC0, sedangkan OpenGameArt memungkinkan Anda memfilter ribuan kiriman komunitas berdasarkan lisensi. Semuanya gratis untuk digunakan dalam game komersial.</p>
<h3 id="apakah-sprite-gratis-aman-digunakan-dalam-game-komersial" tabindex="-1">Apakah sprite gratis aman digunakan dalam game komersial? <a class="header-anchor" href="#apakah-sprite-gratis-aman-digunakan-dalam-game-komersial" aria-label="Permalink to &quot;Apakah sprite gratis aman digunakan dalam game komersial?&quot;"></a></h3>
<p>Sprite CC0 selalu aman digunakan, tanpa kewajiban atribusi maupun batasan. Sprite CC-BY memerlukan baris kredit, sedangkan CC-BY-SA (seperti koleksi LPC) juga mewajibkan karya turunan menggunakan lisensi yang sama. Untuk paket dengan lisensi milik kreatornya sendiri, seperti Cainos atau CraftPix, ketentuannya biasanya mengizinkan penggunaan komersial tetapi melarang penjualan kembali file mentah.</p>
<h3 id="apa-tileset-pixel-art-gratis-terbaik-untuk-game-dungeon-crawler" tabindex="-1">Apa tileset pixel art gratis terbaik untuk game dungeon crawler? <a class="header-anchor" href="#apa-tileset-pixel-art-gratis-terbaik-untuk-game-dungeon-crawler" aria-label="Permalink to &quot;Apa tileset pixel art gratis terbaik untuk game dungeon crawler?&quot;"></a></h3>
<p>DungeonTileset II berukuran 16x16 karya 0x72 di itch.io. Tileset ini berlisensi CC0, masih aktif dipelihara, dan mencakup ubin dungeon, obor beranimasi, jebakan, senjata, serta puluhan karakter beranimasi dalam satu unduhan. Padukan dengan Tiny Dungeon dari Kenney jika Anda menginginkan lebih banyak variasi dalam skala yang kurang lebih sama.</p>
<h3 id="apakah-saya-harus-mencantumkan-kredit-kepada-seniman-saat-menggunakan-sprite-gratis" tabindex="-1">Apakah saya harus mencantumkan kredit kepada seniman saat menggunakan sprite gratis? <a class="header-anchor" href="#apakah-saya-harus-mencantumkan-kredit-kepada-seniman-saat-menggunakan-sprite-gratis" aria-label="Permalink to &quot;Apakah saya harus mencantumkan kredit kepada seniman saat menggunakan sprite gratis?&quot;"></a></h3>
<p>Hanya jika lisensinya mewajibkan. CC0 tidak mensyaratkan apa pun, CC BY (seperti 4.100+ ikon dari game-icons.net) mewajibkan baris kredit, dan CC-BY-SA menambahkan ketentuan berbagi-serupa. Meskipun kredit tidak diwajibkan, mencantumkan nama seniman di layar kredit adalah cara yang baik untuk mendukung para seniman yang menjaga pustaka ini tetap gratis.</p>
<h3 id="lisensi-apa-yang-sebaiknya-saya-cari-pada-paket-aset-itch-io" tabindex="-1">Lisensi apa yang sebaiknya saya cari pada paket aset itch.io? <a class="header-anchor" href="#lisensi-apa-yang-sebaiknya-saya-cari-pada-paket-aset-itch-io" aria-label="Permalink to &quot;Lisensi apa yang sebaiknya saya cari pada paket aset itch.io?&quot;"></a></h3>
<p>CC0 adalah standar terbaik karena menghapus semua kewajiban. Kreator itch.io menetapkan ketentuan lisensi secara terpisah di setiap halaman paket, jadi gulir melewati tangkapan layar dan baca deskripsinya sebelum menjadikan sebuah paket sebagai fondasi proyek Anda. Jika suatu halaman sama sekali tidak mencantumkan ketentuan, tanyakan kepada kreatornya atau pilih paket lain dengan ketentuan yang jelas.</p>
<h3 id="bisakah-saya-menggunakan-ai-untuk-membuat-sprite-bagi-game-komersial" tabindex="-1">Bisakah saya menggunakan AI untuk membuat sprite bagi game komersial? <a class="header-anchor" href="#bisakah-saya-menggunakan-ai-untuk-membuat-sprite-bagi-game-komersial" aria-label="Permalink to &quot;Bisakah saya menggunakan AI untuk membuat sprite bagi game komersial?&quot;"></a></h3>
<p>Biasanya bisa, tetapi lisensi komersial umumnya hanya disertakan dalam paket berbayar alat tersebut, jadi periksa ketentuan generator yang Anda gunakan. Alat seperti PixelLab dan Retro Diffusion menghasilkan pixel art dan sprite sheet yang hampir siap digunakan dalam game, meskipun kebanyakan developer masih menyempurnakan hasilnya di editor seperti Aseprite agar palet dan proporsinya konsisten.</p>
<h3 id="apa-perbedaan-antara-sprite-sprite-sheet-dan-tileset" tabindex="-1">Apa perbedaan antara sprite, sprite sheet, dan tileset? <a class="header-anchor" href="#apa-perbedaan-antara-sprite-sprite-sheet-dan-tileset" aria-label="Permalink to &quot;Apa perbedaan antara sprite, sprite sheet, dan tileset?&quot;"></a></h3>
<p>Sprite adalah satu gambar 2D, misalnya satu frame karakter. Sprite sheet mengemas banyak frame ke dalam satu gambar agar engine dapat memutarnya sebagai animasi. Tileset adalah kisi-kisi gambar kecil yang dapat diulang (umumnya berukuran 16x16 atau 32x32) untuk menyusun peta level, seperti ubin rumput, dinding, dan air.</p>
<BuildCta
  title="Lewati pencarian aset. Dapatkan sprite yang langsung ditempatkan dalam game"
  desc="Cinevva menyediakan ratusan sprite CC0 gratis dan membuatkan game di sekelilingnya untuk Anda."
  prompt="Buat game platformer pixel art 2D tentang seekor rubah yang berlari dan melompat melintasi hutan sambil mengumpulkan ceri, dengan musuh yang bisa diinjak" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> - panduan lengkap dengan lebih dari 20 sumber</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> - CC0, CC-BY, dan lisensi lainnya</li>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a> - pilihan untuk aset 3D</li>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik pada 2026</a> - alat untuk membuat game</li>
<li><a href="/id/assets.html">Pencarian Aset Cinevva</a> - cari aset Kenney dan lainnya dari satu kotak pencarian</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/free-2d-sprites-tilesets-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Animasi Karakter Gratis dan Rigging Otomatis: Mixamo dan Alternatifnya (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/free-character-animations-rigging</link>
            <guid>https://app.cinevva.com/id/guides/free-character-animations-rigging</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Apakah Mixamo masih gratis pada 2026? Ya, tetapi sudah tidak dipelihara. Pustaka animasi karakter dan alat rigging otomatis gratis terbaik, dengan lisensi yang telah diverifikasi.]]></description>
            <content:encoded><![CDATA[<h1 id="animasi-karakter-gratis-dan-rigging-otomatis-mixamo-dan-alternatifnya-2026" tabindex="-1">Animasi Karakter Gratis dan Rigging Otomatis: Mixamo dan Alternatifnya (2026) <a class="header-anchor" href="#animasi-karakter-gratis-dan-rigging-otomatis-mixamo-dan-alternatifnya-2026" aria-label="Permalink to &quot;Animasi Karakter Gratis dan Rigging Otomatis: Mixamo dan Alternatifnya (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Anda bisa melakukan rigging dan menganimasikan karakter secara gratis pada 2026 tanpa menyentuh Blender. Mixamo masih tersedia secara daring dan tetap gratis dengan akun Adobe, tetapi berada dalam mode pemeliharaan. Karena itu, langkah cerdasnya adalah mengetahui alternatif yang tersedia: pustaka animasi CC0 seperti Quaternius Universal Animation Library, alat rigging otomatis gratis seperti <a href="/id/tools/rigger.html">Auto Rigger</a> berbasis browser dari Cinevva dan AccuRIG dari Reallusion, serta alat teks-ke-gerakan yang menghasilkan animasi dari deskripsi tertulis.</p>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<ul>
<li><strong>Cara tercepat, tanpa instalasi:</strong> <a href="/id/tools/rigger.html">Auto Rigger</a> + <a href="/id/tools/animate.html">Prompt Animations</a> dari Cinevva, keduanya gratis di browser.</li>
<li><strong>Pustaka animasi gratis terbaik:</strong> Quaternius Universal Animation Library 1 dan 2 (CC0, dapat di-retarget).</li>
<li><strong>Pilihan klasik:</strong> Mixamo, masih gratis dan tetap berfungsi, tetapi jangan mengharapkan pembaruan.</li>
<li><strong>Alat rigging otomatis desktop gratis terbaik:</strong> AccuRIG 2.0 (Windows, memerlukan akun ActorCore gratis).</li>
<li><strong>Mocap mentah dalam jumlah besar:</strong> basis data CMU Graphics Lab, lebih dari 2.500 gerakan, gratis tetapi perlu dibersihkan.</li>
</ul>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kebutuhan</th>
<th>Opsi Terbaik</th>
<th>Lisensi</th>
<th>Catatan</th>
</tr>
</thead>
<tbody>
<tr>
<td>Rigging otomatis di browser</td>
<td><a href="/id/tools/rigger.html">Cinevva Auto Rigger</a></td>
<td>Gratis</td>
<td>Masukkan GLB/FBX/OBJ, keluarkan GLB yang sudah di-rig, mendukung biped dan quadruped</td>
</tr>
<tr>
<td>Rigging otomatis plus animasi siap pakai</td>
<td>Mixamo</td>
<td>Gratis, bebas royalti untuk penggunaan komersial</td>
<td>Akun Adobe, hanya humanoid dengan pose T, tidak dipelihara</td>
</tr>
<tr>
<td>Rigging otomatis di desktop</td>
<td>AccuRIG 2.0</td>
<td>Gratis</td>
<td>Windows, memerlukan akun ActorCore gratis untuk mengekspor FBX/USD</td>
</tr>
<tr>
<td>Paket animasi siap pakai</td>
<td>Quaternius UAL 1 + 2</td>
<td>CC0</td>
<td>Total lebih dari 250 animasi, dapat di-retarget ke Unity/Unreal/Godot</td>
</tr>
<tr>
<td>Karakter animasi sederhana</td>
<td>Kenney</td>
<td>CC0</td>
<td>Karakter low-poly yang sudah di-rig dengan klip dasar</td>
</tr>
<tr>
<td>Pustaka mocap mentah</td>
<td>Basis data mocap CMU</td>
<td>Gratis, data mentah tidak boleh dijual kembali</td>
<td>Tersedia konversi BVH/FBX, kualitas bervariasi</td>
</tr>
<tr>
<td>Klip mocap gratis yang dikurasi</td>
<td>Rokoko Motion Library</td>
<td>Klip gratis boleh digunakan secara komersial</td>
<td>Dijelajahi melalui Rokoko Studio gratis</td>
</tr>
<tr>
<td>Teks-ke-gerakan</td>
<td><a href="/id/tools/animate.html">Cinevva Prompt Animations</a></td>
<td>Gratis</td>
<td>Deskripsikan gerakan, dapatkan GLB atau BVH</td>
</tr>
<tr>
<td>Animasi manual dengan bantuan fisika</td>
<td>Cascadeur</td>
<td>Tingkat gratis hanya untuk penggunaan nonkomersial</td>
<td>Paket Indie $8/bulan menambahkan ekspor FBX</td>
</tr>
<tr>
<td>Kontrol manual penuh</td>
<td>Blender Rigify</td>
<td>Gratis</td>
<td>Disertakan bersama Blender, rig Anda tetap menjadi milik Anda</td>
</tr>
</tbody>
</table>
<h2 id="mixamo-pada-2026-hidup-gratis-dan-membeku" tabindex="-1">Mixamo pada 2026: hidup, gratis, dan membeku <a class="header-anchor" href="#mixamo-pada-2026-hidup-gratis-dan-membeku" aria-label="Permalink to &quot;Mixamo pada 2026: hidup, gratis, dan membeku&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.mixamo.com" target="_blank" rel="noreferrer">mixamo.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas royalti untuk penggunaan komersial dan nonkomersial tanpa batas, tanpa distribusi ulang berkas mentah</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan animasi siap pakai plus pustaka karakter siap pakai</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, FBX untuk Unity, DAE (tidak ada GLB, konversikan sendiri)</td>
</tr>
<tr>
<td><strong>Akun</strong></td>
<td>Memerlukan akun Adobe gratis</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Manual, per animasi atau paket</td>
</tr>
</tbody>
</table>
<p>Pertanyaan utama di bidang ini adalah apakah Mixamo sudah mati. Berikut yang dapat kami verifikasi per Juli 2026: situsnya aktif, alat rigging otomatisnya berfungsi, dan layanannya gratis dengan akun Adobe gratis. Ketentuan lisensi Adobe memang menguntungkan bagi pengembang game. Menurut FAQ lisensi Adobe sendiri, karakter dan animasi Mixamo &quot;tersedia secara gratis, tanpa biaya lisensi atau royalti, untuk penggunaan komersial maupun nonkomersial tanpa batas.&quot; Satu-satunya batasan adalah distribusi ulang: Anda dapat menyertakannya dalam game yang sudah jadi, tetapi tidak boleh mengemas ulang berkas animasi atau karakter mentah sebagai paket aset atau templat engine untuk dijual maupun didistribusikan.</p>
<p>Bagian yang mengkhawatirkan adalah status pemeliharaannya. Adobe membeli Mixamo pada 2015 dan sejak itu tidak merilis pembaruan berarti. Fuse, alat pembuat karakter pendampingnya, dihentikan dan ditarik dari Creative Cloud pada 2020. Pada Juni 2025, layanan ini tidak dapat digunakan oleh siapa pun selama berhari-hari akibat galat server 500, dan pengguna di forum Adobe sendiri melaporkan bahwa seorang agen dukungan memberi tahu mereka bahwa Mixamo &quot;sudah tidak didukung lagi.&quot; Layanan tersebut kembali beroperasi dan Adobe belum mengumumkan tanggal penutupan, tetapi alat gratis tanpa peta jalan dan dengan riwayat gangguan tanpa pemberitahuan bukanlah fondasi yang tepat untuk membangun pipeline. Ambil yang Anda perlukan dan kenali opsi cadangan Anda.</p>
<p>Dua batasan praktis yang perlu diingat: alat rigging otomatisnya hanya menangani humanoid bipedal dalam pose yang kurang lebih menyerupai pose T atau pose A, dan hasil ekspornya berupa FBX atau DAE. Jadi, untuk game web Anda perlu mengonversinya menjadi GLB di Blender atau alat lain.</p>
<h2 id="cara-tercepat-rig-dan-animasikan-di-browser" tabindex="-1">Cara tercepat: rig dan animasikan di browser <a class="header-anchor" href="#cara-tercepat-rig-dan-animasikan-di-browser" aria-label="Permalink to &quot;Cara tercepat: rig dan animasikan di browser&quot;"></a></h2>
<p>Jika Anda hanya menginginkan karakter yang sudah di-rig dan dianimasikan tanpa perlu menginstal apa pun, alat gratis Cinevva mencakup seluruh alur kerja Mixamo di browser.</p>
<h3 id="cinevva-auto-rigger" tabindex="-1">Cinevva Auto Rigger <a class="header-anchor" href="#cinevva-auto-rigger" aria-label="Permalink to &quot;Cinevva Auto Rigger&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="/id/tools/rigger.html">cinevva.com/tools/rigger</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis, model Anda tetap menjadi milik Anda</td>
</tr>
<tr>
<td><strong>Masukan</strong></td>
<td>GLB, FBX, atau OBJ hingga 30 MB</td>
</tr>
<tr>
<td><strong>Keluaran</strong></td>
<td>GLB yang sudah di-rig dengan animasi baked opsional</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, langsung dari browser</td>
</tr>
</tbody>
</table>
<p>Unggah model statis dan dapatkan kembali versi yang sudah di-rig, dengan skeleton yang disesuaikan dan skinning yang dilakukan secara otomatis. Alat ini menangani biped dan quadruped (Mixamo tidak pernah mendukung makhluk berkaki empat), dan Anda dapat melakukan bake terhadap animasi preset seperti diam, berjalan, berlari, melompat, menebas, menembak, memanjat, terluka, dan jatuh. Keluaran GLB dapat langsung digunakan di Three.js, Babylon, Unity, Godot, atau Blender. Alat ini cocok dipadukan dengan model dari <a href="/id/tools/hunyuan3d.html">Generator Model 3D</a> kami, sehingga Anda dapat beralih dari prompt teks menjadi karakter animasi tanpa meninggalkan browser.</p>
<h3 id="cinevva-prompt-animations" tabindex="-1">Cinevva Prompt Animations <a class="header-anchor" href="#cinevva-prompt-animations" aria-label="Permalink to &quot;Cinevva Prompt Animations&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="/id/tools/animate.html">cinevva.com/tools/animate</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis</td>
</tr>
<tr>
<td><strong>Masukan</strong></td>
<td>Deskripsi teks, ditambah GLB humanoid yang sudah di-rig jika diinginkan</td>
</tr>
<tr>
<td><strong>Keluaran</strong></td>
<td>GLB dengan animasi yang sudah di-bake, atau BVH untuk pipeline apa pun</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p>Ketik &quot;seseorang berjongkok, lalu melompat ke depan&quot; dan dapatkan gerakan skeletal yang dapat Anda pratinjau secara langsung serta di-retarget ke karakter Anda sendiri di browser. Alat ini mendeteksi secara otomatis penamaan tulang humanoid Mixamo, Tripo, Reallusion CC4, UE5, dan generik, sehingga karakter yang di-rig di tempat lain juga dapat digunakan. Durasi klip berkisar antara 1 hingga 10 detik, dan ekspor BVH memungkinkan Anda membersihkan hasilnya di Blender atau Cascadeur jika diperlukan.</p>
<h2 id="pustaka-animasi-gratis" tabindex="-1">Pustaka animasi gratis <a class="header-anchor" href="#pustaka-animasi-gratis" aria-label="Permalink to &quot;Pustaka animasi gratis&quot;"></a></h2>
<h3 id="quaternius-universal-animation-library" tabindex="-1">Quaternius Universal Animation Library <a class="header-anchor" href="#quaternius-universal-animation-library" aria-label="Permalink to &quot;Quaternius Universal Animation Library&quot;"></a></h3>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-characters.jpg" alt="Karakter low-poly CC0 siap rig dari KayKit, Quaternius, PolygonalMind, dan Kenney: kesatria, shiba inu, prajurit kerangka, astronaut, dan barbar" loading="lazy"></a>
<figcaption>Karakter CC0 siap rig dari KayKit, Quaternius, PolygonalMind, dan Kenney yang cocok dengan pustaka animasi ini. <a href="/id/assets">Ambil salah satunya dari pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://quaternius.com/packs/universalanimationlibrary.html" target="_blank" rel="noreferrer">quaternius.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (domain publik), termasuk tingkat gratis</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>UAL 1 memiliki lebih dari 120 animasi, UAL 2 menambahkan lebih dari 130 animasi</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, glTF, OBJ, dengan sumber .blend pada tingkat berbayar</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, melalui quaternius.com atau itch.io</td>
</tr>
</tbody>
</table>
<p>Pustaka animasi gratis terbaik pada 2026. Kedua paket menggunakan satu rig humanoid universal yang dibuat untuk retargeting di Unity, Unreal, dan Godot. Semuanya berlisensi CC0, sehingga dapat digunakan secara komersial tanpa atribusi. UAL 1 mencakup lokomosi ke segala arah, pertarungan, senjata api, dan emote. UAL 2 menambahkan kombo jarak dekat, parkour, bertani, memancing, dan lokomosi zombi. Sebagian besar isi setiap paket dapat diunduh secara gratis, sedangkan tingkat berbayar menambahkan sisanya beserta berkas sumber Blender, yang tetap berlisensi CC0. Jika Anda menggunakan pustaka aset Cinevva, karakter Quaternius sudah dapat dicari di editor.</p>
<h3 id="kenney" tabindex="-1">Kenney <a class="header-anchor" href="#kenney" aria-label="Permalink to &quot;Kenney&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kenney.nl/assets/series:Animated%20Characters" target="_blank" rel="noreferrer">kenney.nl</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (domain publik)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Animated Characters 1 hingga 3, plus paket karakter modular</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLB, FBX</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p>Kenney lebih dikenal karena prop dan sprite-nya, tetapi tersedia juga karakter animasi. Setiap paket Animated Characters menyertakan karakter low-poly yang sudah di-rig dengan beberapa skin dan sejumlah animasi dasar, sementara aset karakter modular yang lebih baru menambahkan lebih banyak skin dan klip. Jangan mengharapkan kumpulan animasi yang mendalam. Ini adalah karakter pemula dengan gaya balok bersih khas Kenney, berguna untuk purwarupa dan game jam ketika konsistensi lebih penting daripada fidelitas.</p>
<h3 id="cmu-graphics-lab-motion-capture-database" tabindex="-1">CMU Graphics Lab Motion Capture Database <a class="header-anchor" href="#cmu-graphics-lab-motion-capture-database" aria-label="Permalink to &quot;CMU Graphics Lab Motion Capture Database&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="http://mocap.cs.cmu.edu" target="_blank" rel="noreferrer">mocap.cs.cmu.edu</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis digunakan, termasuk dalam produk komersial, tetapi data mentah tidak boleh dijual kembali</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 2.500 rangkaian gerakan dari lebih dari 100 subjek</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>ASF/AMC asli, konversi BVH dan FBX dari komunitas</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p>Pustaka mocap akademis klasik: berjalan, berlari, olahraga, menari, aktivitas sehari-hari, dan banyak gerakan unik, yang direkam pada awal 2000-an. Ketentuannya bersifat informal tetapi cukup jelas: gratis untuk penelitian dan Anda boleh menyertakan datanya dalam produk yang dijual secara komersial, tetapi tidak boleh menjual kembali datanya sendiri, bahkan setelah dikonversi. Format ASF/AMC mentah cukup merepotkan, jadi gunakan hasil konversi: rilis BVH cgspeed telah lama menjadi standar, dan tersedia konversi FBX dari komunitas di Hugging Face dan Academic Torrents (salah satunya bahkan sudah di-retarget ke karakter Quaternius berlisensi CC0). Bersiaplah membersihkan pergeseran kaki dan jitter. Ini adalah mocap mentah, bukan klip siap pakai untuk game.</p>
<h3 id="rokoko-motion-library" tabindex="-1">Rokoko Motion Library <a class="header-anchor" href="#rokoko-motion-library" aria-label="Permalink to &quot;Rokoko Motion Library&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.rokoko.com/products/motion-library" target="_blank" rel="noreferrer">rokoko.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Klip gratis dilisensikan untuk penggunaan komersial, klip berbayar seharga $3 hingga $20</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan klip yang direkam secara profesional, ratusan di antaranya gratis</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX melalui ekspor Rokoko Studio</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Melalui aplikasi Rokoko Studio gratis</td>
</tr>
</tbody>
</table>
<p>Rokoko (perusahaan pembuat baju mocap) mengelola pustaka gerakan yang dapat Anda jelajahi di dalam aplikasi Rokoko Studio gratis, ditambah paket tematik gratis di situs mereka: gerakan olahraga, animasi diam sehari-hari, klip bertema sihir, dan bundel berisi 263 aset. Klip gratisnya secara eksplisit mengizinkan proyek komersial. Kualitasnya tinggi karena data ini direkam dan dibersihkan secara profesional. Kekurangannya terletak pada alur kerja: Anda harus menggunakan Rokoko Studio dan akun gratis, alih-alih mengambil berkas secara langsung.</p>
<h3 id="bandai-namco-research-motion-dataset" tabindex="-1">Bandai Namco Research Motion Dataset <a class="header-anchor" href="#bandai-namco-research-motion-dataset" aria-label="Permalink to &quot;Bandai Namco Research Motion Dataset&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://github.com/BandaiNamcoResearchInc/Bandai-Namco-Research-Motiondataset" target="_blank" rel="noreferrer">github.com/BandaiNamcoResearchInc</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC BY-NC 4.0, hanya untuk penggunaan nonkomersial</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 3.000 gerakan dari aktor profesional dalam berbagai gaya</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>BVH</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, dari GitHub</td>
</tr>
</tbody>
</table>
<p>Layak diketahui dan lisensinya wajib dibaca. Bandai Namco merilis dua set data mocap berkualitas studio (berjalan, berlari, bertarung, menari, dalam beragam gaya mulai dari lelah hingga gembira) yang ditujukan untuk penelitian AI mengenai transfer gaya gerakan. Keduanya berlisensi CC BY-NC 4.0, yang berarti tidak boleh digunakan secara komersial. Cocok untuk game jam gratis atau proyek penelitian, tetapi tidak boleh digunakan untuk apa pun yang Anda jual atau monetisasi. Jangan biarkan judul berita seperti &quot;mocap gratis dari studio AAA&quot; membujuk Anda untuk merilisnya dalam produk komersial.</p>
<h2 id="alat-rigging" tabindex="-1">Alat rigging <a class="header-anchor" href="#alat-rigging" aria-label="Permalink to &quot;Alat rigging&quot;"></a></h2>
<h3 id="blender-rigify-gratis-manual" tabindex="-1">Blender Rigify (gratis, manual) <a class="header-anchor" href="#blender-rigify-gratis-manual" aria-label="Permalink to &quot;Blender Rigify (gratis, manual)&quot;"></a></h3>
<p>Rigify disertakan di dalam Blender sebagai add-on bawaan. Anda menempatkan metarig di atas mesh, menyesuaikan tulang agar pas, lalu menghasilkan rig kontrol lengkap dengan peralihan IK/FK, kemudian mengikat mesh menggunakan weight otomatis. Ini memberikan kontrol paling besar yang bisa Anda dapatkan secara gratis, mendukung karakter nonhumanoid, dan rig yang dihasilkan sepenuhnya menjadi milik Anda untuk digunakan di mana saja. Biayanya adalah waktu: menyesuaikan tulang dan memperbaiki weight painting secara manual merupakan keterampilan tersendiri, dan rig pertama Anda akan memakan waktu semalaman, bukan satu menit.</p>
<h3 id="auto-rig-pro-standar-berbayar" tabindex="-1">Auto-Rig Pro (standar berbayar) <a class="header-anchor" href="#auto-rig-pro-standar-berbayar" aria-label="Permalink to &quot;Auto-Rig Pro (standar berbayar)&quot;"></a></h3>
<p>Add-on Blender berbayar yang paling banyak diandalkan, dijual di Superhive (sebelumnya Blender Market) dengan pembelian satu kali: $25 untuk Lite dengan penempatan penanda manual, atau $50 untuk edisi Full dengan deteksi penanda Smart sekali klik yang membuatnya terkenal. Add-on ini menyediakan retargeting yang layak (inilah cara banyak data Mixamo dan CMU dipetakan ulang ke rig kustom) serta modul ekspor game engine untuk menghasilkan FBX dan glTF yang bersih. Jika Anda rutin melakukan rigging karakter di Blender, inilah satu-satunya alat berbayar dalam panduan ini yang sepadan dengan harganya.</p>
<h3 id="cascadeur" tabindex="-1">Cascadeur <a class="header-anchor" href="#cascadeur" aria-label="Permalink to &quot;Cascadeur&quot;"></a></h3>
<p>Cascadeur adalah alat animasi keyframe berbantuan fisika, sangat baik untuk membuat lompatan, jatuh, dan pertarungan yang meyakinkan tanpa mocap. Verifikasi tingkat gratisnya sebelum menjadikannya bagian dari rencana Anda karena ketentuannya telah diperketat: per pertengahan 2026, paket Free hanya untuk penggunaan nonkomersial dan hanya mengekspor format .casc milik Cascadeur sendiri, sementara .fbx dan .dae dikunci, ditambah batas 300 frame dan 120 sendi. Agar benar-benar dapat memasukkan animasi ke dalam game, Anda memerlukan paket Indie seharga $8/bulan dengan penagihan tahunan. Paket ini mengizinkan penggunaan komersial dengan pendapatan tahunan di bawah $100 ribu, mengekspor FBX, DAE, USD, dan glTF, serta berubah menjadi lisensi permanen setelah berlangganan selama dua tahun. Pro berharga $33/bulan tanpa batas pendapatan.</p>
<h3 id="accurig-dan-actorcore-reallusion" tabindex="-1">AccuRIG dan ActorCore (Reallusion) <a class="header-anchor" href="#accurig-dan-actorcore-reallusion" aria-label="Permalink to &quot;AccuRIG dan ActorCore (Reallusion)&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://actorcore.reallusion.com/auto-rig" target="_blank" rel="noreferrer">actorcore.reallusion.com/auto-rig</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Alat gratis, karakter yang sudah di-rig dapat digunakan secara komersial tanpa biaya tambahan</td>
</tr>
<tr>
<td><strong>Platform</strong></td>
<td>Aplikasi desktop Windows</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Ekspor FBX dan USD</td>
</tr>
<tr>
<td><strong>Akun</strong></td>
<td>Memerlukan akun ActorCore gratis untuk mengekspor</td>
</tr>
<tr>
<td>AccuRIG adalah auto-rigger desktop gratis dari Reallusion dan alternatif Mixamo terkuat untuk urusan rigging. Versi 2.0 (2025) menghasilkan rig seluruh tubuh dan jari, memungkinkan Anda menelusuri animasi stok ActorCore di dalam aplikasi, melakukan retargeting ke karakter Anda, serta mengekspor FBX atau USD untuk Blender, Unity, Unreal, dan engine lainnya. Alat ini sepenuhnya gratis dan tidak ada biaya untuk karakter yang Anda rig; Anda hanya memerlukan akun ActorCore gratis untuk mengekspor. Model bisnisnya adalah toko animasi ActorCore: pustaka yang terhubung dengannya sebagian besar berbayar, dengan beberapa sampel gratis. Hanya tersedia untuk Windows, jadi pengguna Mac dan Linux sebaiknya menggunakan alat berbasis browser.</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="retargeting-dan-alur-kerja-standar" tabindex="-1">Retargeting dan alur kerja standar <a class="header-anchor" href="#retargeting-dan-alur-kerja-standar" aria-label="Permalink to &quot;Retargeting dan alur kerja standar&quot;"></a></h2>
<p>Retargeting adalah proses menyalin animasi yang dibuat untuk satu kerangka ke kerangka lain, dengan penyesuaian terhadap nama tulang, proporsi, dan pose istirahat. Anda memerlukannya setiap kali animasi dan karakter berasal dari sumber yang berbeda, yang hampir selalu terjadi dalam alur kerja aset gratis. Kini setiap engine memiliki solusinya sendiri (avatar Humanoid dari Unity, IK Retargeter dari Unreal, pemetaan tulang Godot 4), pengguna Blender biasanya memakai Auto-Rig Pro atau plugin Rokoko Blender gratis, dan <a href="/id/tools/animate.html">Animasi dari Prompt</a> milik Cinevva melakukan retargeting di browser dengan mendeteksi skema penamaan tulang yang umum secara otomatis. Jika animasi yang diunduh membuat lengan karakter menembus tubuhnya, berarti proporsinya tidak berhasil di-retarget dengan baik, dan biasanya penyebabnya adalah ketidakcocokan pose istirahat.</p>
<p>Alur kerja yang efektif pada 2026, dari awal hingga akhir: dapatkan model (lihat <a href="/id/guides/free-3d-model-sites.html">panduan situs model 3D gratis</a> kami, atau buat model dengan generator), lakukan rigging otomatis menggunakan <a href="/id/tools/rigger.html">Auto Rigger Cinevva</a>, AccuRIG, atau Mixamo, terapkan animasi dari pustaka CC0 seperti Quaternius atau buat animasi dari teks, lalu ekspor GLB untuk engine web (konversikan FBX menggunakan pengekspor glTF Blender jika alat Anda tidak dapat menghasilkan GLB secara langsung). Siapkan waktu satu jam untuk percobaan pertama; setelah melakukannya dua kali, proses ini hanya membutuhkan beberapa menit.</p>
<h2 id="ai-teks-ke-gerakan-pada-2026" tabindex="-1">AI teks-ke-gerakan pada 2026 <a class="header-anchor" href="#ai-teks-ke-gerakan-pada-2026" aria-label="Permalink to &quot;AI teks-ke-gerakan pada 2026&quot;"></a></h2>
<p>Membuat animasi yang siap digunakan dari sebuah kalimat telah berkembang dari sekadar demo menjadi alat sehari-hari. <a href="/id/tools/animate.html">Animasi dari Prompt</a> milik Cinevva melakukannya secara gratis di browser dengan ekspor GLB dan BVH. Rokoko Create menghasilkan klip seluruh tubuh dari prompt teks secara gratis, meskipun proses ekspornya bergantung pada Rokoko Studio, dengan akun Starter gratis yang menyediakan lima ekspor FBX per bulan. SayMotion dari DeepMotion adalah opsi layanan daring mapan lainnya, dengan paket gratis terbatas dan hak penggunaan komersial pada paket berbayar. Di sisi sumber terbuka, model riset yang memelopori bidang ini, MDM dan MoMask, menerbitkan kode berlisensi MIT, tetapi keduanya dilatih menggunakan dataset HumanML3D dan AMASS yang memiliki ketentuan akademis nonkomersial, sehingga legalitas penggunaan output mentahnya dalam game komersial masih tidak jelas. Untuk apa pun yang akan Anda jual, gunakan layanan daring yang ketentuannya telah Anda baca. Kualitas pada 2026 benar-benar bagus untuk lokomosi, emote, dan aksi tunggal, tetapi masih kurang stabil untuk rangkaian panjang dan interaksi objek yang presisi. Karena itu, buatlah klip pendek dan padukan di dalam engine.</p>
<h2 id="lisensi-dalam-30-detik" tabindex="-1">Lisensi dalam 30 detik <a class="header-anchor" href="#lisensi-dalam-30-detik" aria-label="Permalink to &quot;Lisensi dalam 30 detik&quot;"></a></h2>
<ul>
<li><strong>CC0:</strong> domain publik. Dapat digunakan secara komersial dan dimodifikasi tanpa atribusi. Animasi Quaternius dan Kenney berlisensi CC0.</li>
<li><strong>Bebas royalti (Mixamo, klip gratis Rokoko):</strong> gratis digunakan dalam proyek jadi, termasuk game komersial, tetapi Anda tidak boleh mendistribusikan ulang atau menjual kembali file mentahnya.</li>
<li><strong>CC BY-NC (dataset Bandai Namco):</strong> hanya untuk penggunaan nonkomersial. Tidak boleh digunakan dalam game yang Anda jual atau monetisasi.</li>
<li><strong>Ketentuan akademis informal (CMU):</strong> penggunaan komersial dalam produk diperbolehkan, tetapi datanya sendiri tidak boleh dijual kembali.</li>
</ul>
<p>Jika ragu, pilih CC0. Untuk penjelasan lengkapnya, lihat <a href="/id/guides/game-asset-licenses.html">panduan lisensi aset game</a> kami.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-mixamo-masih-gratis" tabindex="-1">Apakah Mixamo masih gratis? <a class="header-anchor" href="#apakah-mixamo-masih-gratis" aria-label="Permalink to &quot;Apakah Mixamo masih gratis?&quot;"></a></h3>
<p>Ya. Per Juli 2026, Mixamo tersedia gratis dengan akun Adobe gratis, dan animasi serta karakter yang di-rig otomatis bebas royalti untuk penggunaan komersial tanpa batas. Kekurangannya adalah Adobe tidak memperbaruinya selama bertahun-tahun, layanan ini sempat tidak tersedia selama beberapa hari pada Juni 2025, dan tim dukungan menyebutnya tidak lagi didukung. Jadi, anggap Mixamo sebagai alat lama yang masih berguna, bukan sebagai alur kerja yang dapat diandalkan.</p>
<h3 id="apakah-mixamo-akan-dihentikan" tabindex="-1">Apakah Mixamo akan dihentikan? <a class="header-anchor" href="#apakah-mixamo-akan-dihentikan" aria-label="Permalink to &quot;Apakah Mixamo akan dihentikan?&quot;"></a></h3>
<p>Adobe belum mengumumkan penghentian Mixamo. Hal yang dapat diverifikasi: tidak ada pembaruan berarti sejak akuisisi pada 2015, pembuat karakter Fuse dihentikan pada 2020, dan gangguan layanan pada Juni 2025 tidak pernah dijelaskan. Mixamo masih berfungsi saat ini. Unduh semua yang Anda perlukan dan siapkan alternatif.</p>
<h3 id="bagaimana-cara-melakukan-rigging-model-3d-tanpa-blender" tabindex="-1">Bagaimana cara melakukan rigging model 3D tanpa Blender? <a class="header-anchor" href="#bagaimana-cara-melakukan-rigging-model-3d-tanpa-blender" aria-label="Permalink to &quot;Bagaimana cara melakukan rigging model 3D tanpa Blender?&quot;"></a></h3>
<p>Gunakan auto-rigger. <a href="/id/tools/rigger.html">Auto Rigger</a> Cinevva berjalan di browser: unggah GLB, FBX, atau OBJ, lalu unduh GLB yang telah di-rig dengan pilihan animasi preset. Alat ini juga mendukung hewan berkaki empat. Untuk desktop, AccuRIG dari Reallusion tersedia gratis di Windows dan dapat mengekspor FBX atau USD. Mixamo juga masih dapat digunakan untuk karakter humanoid dalam pose T. Ketiganya sepenuhnya menghilangkan kebutuhan untuk menempatkan tulang dan melakukan weight painting secara manual.</p>
<h3 id="bisakah-saya-menggunakan-animasi-mixamo-dalam-game-komersial" tabindex="-1">Bisakah saya menggunakan animasi Mixamo dalam game komersial? <a class="header-anchor" href="#bisakah-saya-menggunakan-animasi-mixamo-dalam-game-komersial" aria-label="Permalink to &quot;Bisakah saya menggunakan animasi Mixamo dalam game komersial?&quot;"></a></h3>
<p>Ya. Ketentuan Adobe mengizinkan penggunaan komersial tanpa batas dan tanpa royalti. Satu-satunya batasan yang penting adalah distribusi ulang: Anda tidak boleh menjual kembali atau membagikan file animasi atau karakter mentah, misalnya sebagai paket di toko aset. Penggunaan animasi yang telah dimasukkan ke dalam game yang dirilis diperbolehkan.</p>
<h3 id="di-mana-saya-bisa-mendapatkan-animasi-karakter-cc0-gratis" tabindex="-1">Di mana saya bisa mendapatkan animasi karakter CC0 gratis? <a class="header-anchor" href="#di-mana-saya-bisa-mendapatkan-animasi-karakter-cc0-gratis" aria-label="Permalink to &quot;Di mana saya bisa mendapatkan animasi karakter CC0 gratis?&quot;"></a></h3>
<p>Quaternius Universal Animation Library 1 dan 2 adalah sumber terbaik: gabungan lebih dari 250 animasi pada rig humanoid universal yang dapat di-retarget di Unity, Unreal, dan Godot, semuanya berlisensi CC0 termasuk versi gratisnya. Paket Animated Characters dari Kenney menyediakan karakter sederhana yang telah di-rig beserta klip dasar, juga dengan lisensi CC0.</p>
<h3 id="apa-itu-retargeting-animasi" tabindex="-1">Apa itu retargeting animasi? <a class="header-anchor" href="#apa-itu-retargeting-animasi" aria-label="Permalink to &quot;Apa itu retargeting animasi?&quot;"></a></h3>
<p>Retargeting memetakan animasi dari satu kerangka ke kerangka lain yang memiliki nama tulang dan proporsi berbeda. Anda memerlukannya setiap kali karakter dan animasi berasal dari sumber yang berbeda. Unity, Unreal, dan Godot 4 memiliki fitur retargeting bawaan, pengguna Blender biasanya menggunakan Auto-Rig Pro, dan <a href="/id/tools/animate.html">Animasi dari Prompt</a> milik Cinevva melakukan retargeting ke karakter yang Anda unggah melalui browser.</p>
<h3 id="bisakah-ai-membuat-animasi-karakter-dari-teks" tabindex="-1">Bisakah AI membuat animasi karakter dari teks? <a class="header-anchor" href="#bisakah-ai-membuat-animasi-karakter-dari-teks" aria-label="Permalink to &quot;Bisakah AI membuat animasi karakter dari teks?&quot;"></a></h3>
<p>Ya, dan pada 2026 teknologi ini sudah praktis untuk klip pendek. <a href="/id/tools/animate.html">Animasi dari Prompt</a> milik Cinevva tersedia gratis di browser dengan ekspor GLB dan BVH, Rokoko Create menghasilkan klip gratis dengan lima ekspor per bulan melalui akun gratis, dan SayMotion dari DeepMotion adalah alternatif berbayar utamanya. Model sumber terbuka seperti MDM dan MoMask memiliki kode berlisensi MIT, tetapi dilatih menggunakan dataset riset nonkomersial. Karena itu, periksa lisensinya sebelum menyertakan output tersebut dalam produk yang dirilis.</p>
<BuildCta
  title="Lewati seluruh alur kerja rigging"
  desc="Jelaskan sebuah game dan Cinevva akan membuatnya lengkap dengan karakter yang telah di-rig, dianimasikan, dan langsung bergerak."
  prompt="Buat petualangan orang ketiga tempat karakter saya bisa berlari, melompat, dan memanjat melintasi pulau-pulau terapung" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a> - tempat mendapatkan karakter untuk di-rig</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> - panduan lengkap berisi lebih dari 20 sumber</li>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI Terbaik untuk Game</a> - buat model, tekstur, dan audio</li>
<li><a href="/id/tools/rigger.html">Auto Rigger</a> - lakukan rigging model di browser secara gratis</li>
<li><a href="/id/tools/animate.html">Animasi dari Prompt</a> - buat gerakan dari deskripsi teks</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/free-character-animations-rigging-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Tekstur PBR, Material, dan HDRI Gratis untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/free-textures-hdris-materials</link>
            <guid>https://app.cinevva.com/id/guides/free-textures-hdris-materials</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Sumber tekstur PBR, material, dan HDRI gratis terbaik untuk game pada 2026, mulai dari pustaka CC0 seperti Poly Haven dan ambientCG hingga generator AI, lengkap dengan penjelasan lisensinya.]]></description>
            <content:encoded><![CDATA[<h1 id="tekstur-pbr-material-dan-hdri-gratis-untuk-game-2026" tabindex="-1">Tekstur PBR, Material, dan HDRI Gratis untuk Game (2026) <a class="header-anchor" href="#tekstur-pbr-material-dan-hdri-gratis-untuk-game-2026" aria-label="Permalink to &quot;Tekstur PBR, Material, dan HDRI Gratis untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Tekstur PBR dan HDRI gratis terbaik berasal dari pustaka CC0: Poly Haven (lebih dari 780 tekstur dan 980 HDRI) serta ambientCG (lebih dari 2.000 material dan 400 HDRI) adalah dua sumber utama. Keduanya berada dalam domain publik tanpa kewajiban atribusi dan menyediakan API gratis tanpa kunci. Situs CC0 yang lebih kecil seperti 3DTextures.me, ShareTextures, dan cgbookcase menyediakan ribuan aset tambahan, sedangkan Kenney mencakup tekstur untuk prototipe dan gaya stilistis. Satu-satunya situs populer yang BUKAN CC0 adalah FreePBR, yang mewajibkan pembayaran satu kali untuk penggunaan komersial.</p>
<div class="info custom-block"><p class="custom-block-title">Cari Semua Sumber Ini di Satu Tempat</p>
<p><a href="/id/assets.html">Pencarian Pustaka Aset</a> Cinevva menyertakan Poly Haven dan ambientCG sebagai penyedia, sehingga Anda dapat mencari tekstur dan HDRI mereka dari satu kotak pencarian: <a href="/id/assets.html?providers=polyhaven">Poly Haven</a> · <a href="/id/assets.html?providers=ambientcg">ambientCG</a></p>
</div>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<ul>
<li><strong>Satu situs untuk semuanya, fotorealistis:</strong> Poly Haven (tekstur, HDRI, dan model CC0).</li>
<li><strong>Pustaka khusus material terbesar:</strong> ambientCG (CC0, lebih dari 2.000 material PBR).</li>
<li><strong>Variasi tambahan yang tetap CC0:</strong> 3DTextures.me, ShareTextures, cgbookcase.</li>
<li><strong>Tekstur prototipe dan stilistis:</strong> Kenney (CC0).</li>
<li><strong>HDRI gratis selain Poly Haven:</strong> ambientCG, koleksi gratis HDRMaps, OpenHDRI.</li>
<li><strong>Perhatikan lisensinya:</strong> FreePBR hanya gratis untuk penggunaan pribadi, sedangkan hak komersial berharga $16.</li>
</ul>
<h2 id="referensi-cepat" tabindex="-1">Referensi Cepat <a class="header-anchor" href="#referensi-cepat" aria-label="Permalink to &quot;Referensi Cepat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kebutuhan</th>
<th>Sumber Terbaik</th>
<th>Lisensi</th>
<th>Atribusi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Material PBR fotorealistis</td>
<td>Poly Haven, ambientCG</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Variasi material yang luas</td>
<td>3DTextures.me, ShareTextures</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Pustaka lebih kecil yang dikurasi</td>
<td>cgbookcase</td>
<td>CC0 1.0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Tekstur prototipe/blockout</td>
<td>Kenney</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>HDRI untuk pencahayaan</td>
<td>Poly Haven, ambientCG</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Lebih banyak HDRI gratis</td>
<td>Koleksi gratis HDRMaps, OpenHDRI</td>
<td>Bebas royalti / CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Game komersial dengan anggaran terbatas</td>
<td>Semua sumber CC0 di atas</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Unduhan FreePBR</td>
<td>FreePBR</td>
<td>Khusus</td>
<td>Tidak ada, tetapi penggunaan komersial berbayar</td>
</tr>
</tbody>
</table>
<h2 id="situs-tekstur-dan-material-pbr" tabindex="-1">Situs tekstur dan material PBR <a class="header-anchor" href="#situs-tekstur-dan-material-pbr" aria-label="Permalink to &quot;Situs tekstur dan material PBR&quot;"></a></h2>
<h3 id="poly-haven" tabindex="-1">Poly Haven <a class="header-anchor" href="#poly-haven" aria-label="Permalink to &quot;Poly Haven&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Material dan HDRI fotorealistis tanpa perlu mengkhawatirkan lisensi</p>
<figure class="sample-sheet">
<a href="/id/assets?providers=polyhaven"><img src="https://cdn.cinevva.com/guides/samples/samples-polyhaven-textures.jpg" alt="Contoh material PBR CC0 dari Poly Haven yang dirender pada bola: bata, lantai kayu, pelat logam, batu jalan, kain, rumput, marmer, dan beton" loading="lazy"></a>
<figcaption>Pratinjau material Poly Haven: bata, kayu, logam, batu jalan, kain, rumput, marmer, dan beton, semuanya CC0. <a href="/id/assets?providers=polyhaven">Cari Poly Haven di pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://polyhaven.com" target="_blank" rel="noreferrer">polyhaven.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (domain publik), tidak memerlukan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 780 tekstur PBR, 980 HDRI, dan 520 model</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Peta JPG/PNG, EXR/HDR untuk HDRI, Blend, glTF</td>
</tr>
<tr>
<td><strong>Resolusi</strong></td>
<td>Tekstur 1K hingga 8K, HDRI 1K hingga 16K</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya, gratis, tidak memerlukan kunci</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Setiap aset dibuat berdasarkan pemindaian atau secara manual dengan standar fotorealistis yang konsisten</li>
<li>Set peta lengkap: diffuse, normal, roughness, displacement, AO</li>
<li>Pilih resolusi setiap kali mengunduh alih-alih mendapatkan satu berkas ZIP raksasa</li>
<li>API memungkinkan berbagai alat (termasuk pencarian aset Cinevva) mengambil aset secara langsung</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Material tanah, batu, dan medan untuk adegan luar ruangan</li>
<li>Kayu, bata, plester, dan logam untuk arsitektur</li>
<li>HDRI langit dan studio untuk pencahayaan apa pun</li>
</ul>
<p>Poly Haven adalah sumber utama dalam panduan ini. Situs ini didanai oleh Patreon dan sponsor perusahaan, bukan iklan. Standar kualitasnya paling tinggi di antara semua pustaka gratis, dan CC0 berarti Anda tidak perlu memikirkan lisensinya lagi. Jika Anda hanya ingin menandai satu situs, pilih situs ini. Cari di Cinevva melalui <a href="/id/assets.html?providers=polyhaven">/id/assets?providers=polyhaven</a>.</p>
<h3 id="ambientcg" tabindex="-1">ambientCG <a class="header-anchor" href="#ambientcg" aria-label="Permalink to &quot;ambientCG&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Pustaka material CC0 terbesar di web</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://ambientcg.com" target="_blank" rel="noreferrer">ambientcg.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0, gratis untuk penggunaan komersial, tanpa atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 2.000 material PBR, 400 HDRI, serta aset 3D</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Set peta JPG/PNG, HDRI EXR</td>
</tr>
<tr>
<td><strong>Resolusi</strong></td>
<td>Hingga 8K untuk sebagian besar material</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya, terdokumentasi, tidak memerlukan kunci</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Menawarkan lebih banyak variasi material mentah dibandingkan sumber lain di ranah CC0</li>
<li>Sebelumnya bernama CC0Textures, lalu berganti nama pada 2021, dengan kreator dan lisensi yang sama sejak 2018</li>
<li>Melayani lebih dari 1.000.000 unduhan per bulan, sehingga telah teruji dan stabil</li>
<li>Cakupan prosedural dan berbasis pemindaian yang bagus: bata, kain, tanah, logam, atap</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Permukaan berulang dalam jumlah besar saat Anda mengisi seluruh level</li>
<li>Variasi dari kelompok material yang sama (belasan jenis beton berbeda)</li>
<li>HDRI saat Poly Haven tidak memiliki suasana yang Anda butuhkan</li>
</ul>
<p>Jika Poly Haven adalah galeri yang dikurasi, ambientCG adalah gudangnya. Saat Anda membutuhkan delapan varian aspal atau tenunan kain yang sangat spesifik, di sinilah Anda akan menemukannya. Cari di Cinevva melalui <a href="/id/assets.html?providers=ambientcg">/id/assets?providers=ambientcg</a>.</p>
<h3 id="_3dtextures-me" tabindex="-1">3DTextures.me <a class="header-anchor" href="#_3dtextures-me" aria-label="Permalink to &quot;3DTextures.me&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Pustaka gratis besar yang juga memuat material stilistis dan buatan tangan</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://3dtextures.me" target="_blank" rel="noreferrer">3dtextures.me</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (domain publik)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 1.300 set tekstur</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Set peta PNG/JPG (base color, normal, roughness, AO, height)</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Tidak</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, per tekstur</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Pilihan kategori yang luas: lebih dari 340 logam, 200 ubin, dan 200 kain</li>
<li>Menyertakan material stilistis dan semi-prosedural yang tidak akan Anda temukan di situs berbasis pemindaian</li>
<li>Kompatibel dengan konvensi peta Blender, Unreal, Unity, dan Godot</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Permukaan stilistis yang tidak tersedia di pustaka pemindaian fotorealistis</li>
<li>Panel fiksi ilmiah, ubin berornamen, dan material yang kaya pola</li>
</ul>
<p>Proyek yang dikerjakan oleh satu orang ini diam-diam telah menjadi salah satu pustaka tekstur CC0 terbesar. Setiap unduhan tersedia gratis, dan donasi kecil melalui Ko-fi memberi Anda akses ke folder unduhan massal jika ingin mendapatkan semuanya sekaligus.</p>
<h3 id="sharetextures" tabindex="-1">ShareTextures <a class="header-anchor" href="#sharetextures" aria-label="Permalink to &quot;ShareTextures&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Sumber CC0 lain yang patut diperiksa saat dua situs terbesar tidak memiliki aset yang Anda cari</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.sharetextures.com" target="_blank" rel="noreferrer">sharetextures.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0, secara eksplisit diizinkan untuk proyek komersial</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 1.700 tekstur serta beberapa model 3D</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Set peta PBR</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Tidak</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Cakupan permukaan arsitektural yang kuat: lantai, dinding, kain, kayu</li>
<li>Semuanya bebas hak cipta menurut kebijakan yang mereka nyatakan sendiri</li>
<li>Didukung melalui Patreon dan masih aktif dikelola pada 2026</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Permukaan interior untuk adegan arsitektural atau berskala ruangan</li>
<li>Pilihan alternatif saat Poly Haven dan ambientCG sama-sama tidak memiliki yang Anda cari</li>
</ul>
<p>Situs ini tidak seterkenal dua situs terbesar, tetapi lisensinya sama jelasnya. Kebiasaan yang baik: cari di Poly Haven dan ambientCG terlebih dahulu, lalu periksa situs ini sebelum memilih sesuatu yang hanya setengah sesuai.</p>
<h3 id="cgbookcase" tabindex="-1">cgbookcase <a class="header-anchor" href="#cgbookcase" aria-label="Permalink to &quot;cgbookcase&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Koleksi CC0 yang lebih kecil, dikurasi, dan memiliki resolusi tinggi</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.cgbookcase.com" target="_blank" rel="noreferrer">cgbookcase.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 1.0, gunakan secara gratis tanpa memberikan kredit</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 550 tekstur</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Set peta PBR</td>
</tr>
<tr>
<td><strong>Resolusi</strong></td>
<td>1K hingga 8K</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Tidak</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Setiap tekstur dilengkapi set peta lengkap untuk material fotorealistis</li>
<li>Dapat difilter berdasarkan resolusi minimum saat menelusuri</li>
<li>Dikelola oleh satu seniman (Dorian Zgraggen) sebagai proyek pribadi, tanpa paywall</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Permukaan alam dan organik (kulit kayu, daun, tanah)</li>
<li>Versi beresolusi tinggi dari material umum</li>
</ul>
<p>Kecil tetapi dibuat dengan baik. Tekstur daun dua sisi menjadi salah satu aset unggulannya yang hampir tidak ditawarkan oleh pustaka gratis lain.</p>
<h3 id="freepbr" tabindex="-1">FreePBR <a class="header-anchor" href="#freepbr" aria-label="Permalink to &quot;FreePBR&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Set material yang berorientasi pada game, asalkan Anda membaca lisensinya terlebih dahulu</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://freepbr.com" target="_blank" rel="noreferrer">freepbr.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Khusus, BUKAN CC0. Gratis untuk penggunaan pribadi/nonkomersial. Hak komersial dikenai biaya satu kali sebesar $16</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 600 set tekstur PBR</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>PNG 2048x2048 (albedo, normal, roughness, metallic, AO, sebagian dengan height)</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Tidak</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, per set</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Kategori yang berorientasi pada game: lebih dari 100 logam, lantai, panel fiksi ilmiah, tanah</li>
<li>Set PNG 2K konsisten yang dapat langsung digunakan dalam alur kerja Unity atau Unreal</li>
<li>Tingkat komersial seharga $16 juga memungkinkan unduhan massal seluruh pustaka</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Logam stilistis dan permukaan fiksi ilmiah untuk game</li>
<li>Set 2K siap pakai saat Anda tidak membutuhkan realisme setingkat pemindaian</li>
</ul>
<p>Inilah jebakan lisensi dalam kategori ini. FreePBR tampak seperti situs CC0, tetapi sebenarnya bukan: FAQ situs tersebut menyatakan bahwa set tersedia gratis &quot;selama Anda tidak menggunakannya secara komersial,&quot; dan distribusi ulang tidak diizinkan. Jika game Anda akan menghasilkan uang, bayar $16 atau gunakan situs CC0 di atas.</p>
<h3 id="kenney" tabindex="-1">Kenney <a class="header-anchor" href="#kenney" aria-label="Permalink to &quot;Kenney&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Tekstur prototipe dan pola stilistis</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kenney.nl" target="_blank" rel="noreferrer">kenney.nl</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (domain publik)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Paket tekstur dalam pustaka berisi lebih dari 40.000 aset, termasuk paket Prototype dengan 75 tekstur</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>PNG</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Tidak, tetapi katalog luring tersedia</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>Ya, satu ZIP per paket</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Paket Prototype Textures menghadirkan tampilan kisi dan pola kotak-kotak standar untuk blockout</li>
<li>Pola dan permukaan stilistis yang serasi dengan paket 3D dan 2D Kenney</li>
<li>Lisensi CC0 yang sama berlaku di seluruh katalog</li>
</ul>
<p><strong>Paling cocok untuk mencari:</strong></p>
<ul>
<li>Kisi greybox/blockout untuk membuat prototipe level</li>
<li>Tekstur stilistis datar untuk game low-poly yang tidak cocok menggunakan PBR fotorealistis</li>
</ul>
<p>Ini bukan pustaka PBR, dan justru itulah keunggulannya. Jika game Anda bergaya low-poly, alur kerja roughness 4K lengkap terlalu berlebihan dan tekstur datar Kenney akan tampak lebih konsisten.</p>
<h2 id="hdri-gratis" tabindex="-1">HDRI gratis <a class="header-anchor" href="#hdri-gratis" aria-label="Permalink to &quot;HDRI gratis&quot;"></a></h2>
<p>HDRI (high dynamic range image) adalah panorama 360 derajat yang digunakan untuk menerangi adegan dan mengisi latar belakang. Satu HDRI yang bagus dapat menggantikan berjam-jam pekerjaan menempatkan lampu secara manual.</p>
<figure class="sample-sheet">
<a href="/id/assets?providers=polyhaven"><img src="https://cdn.cinevva.com/guides/samples/samples-polyhaven-hdris.jpg" alt="Contoh HDRI CC0 dari Poly Haven: lapangan pegunungan, langit laut, interior studio seni, padang musim gugur, langit murni, dan panorama hutan musim gugur" loading="lazy"></a>
<figcaption>Enam HDRI Poly Haven, mulai dari langit murni hingga interior, semuanya CC0. <a href="/id/assets?providers=polyhaven">Cari HDRI di pustaka aset</a>.</figcaption>
</figure>
<p><strong>Poly Haven</strong> juga menjadi pilihan utama di sini: lebih dari 980 HDRI CC0, mulai dari langit cerah hingga tatanan studio dan adegan malam, dapat diunduh dalam resolusi 1K sampai 16K dengan format EXR atau HDR. <strong>ambientCG</strong> menyediakan lebih dari 400 HDRI tambahan dengan ketentuan CC0 yang sama. Dengan kombinasi keduanya, Anda jarang membutuhkan sumber lain.</p>
<p>Jika masih perlu sumber lain, <strong>HDRMaps</strong> (<a href="https://hdrmaps.com/freebies/" target="_blank" rel="noreferrer">hdrmaps.com</a>) menawarkan lebih dari 200 HDRI gratis yang menurut situsnya dapat digunakan dalam proyek pribadi maupun komersial. Tim yang sama juga mengelola <strong>OpenHDRI</strong> (<a href="https://openhdri.org" target="_blank" rel="noreferrer">openhdri.org</a>), sebuah pustaka yang merilis setiap HDRI di bawah lisensi CC0.</p>
<p>Untuk game web, jangan sertakan HDRI 16K. HDRI 2K sudah memadai jika hanya digunakan untuk menerangi adegan, dan 4K biasanya sudah cukup meskipun terlihat sebagai langit.</p>
<h2 id="apa-sebenarnya-fungsi-peta-pbr" tabindex="-1">Apa sebenarnya fungsi peta PBR? <a class="header-anchor" href="#apa-sebenarnya-fungsi-peta-pbr" aria-label="Permalink to &quot;Apa sebenarnya fungsi peta PBR?&quot;"></a></h2>
<p>Material PBR adalah kumpulan gambar yang masing-masing menggambarkan satu sifat fisik permukaan. Sebagian besar situs gratis memberi Anda lima peta:</p>
<table tabindex="0">
<thead>
<tr>
<th>Peta</th>
<th>Yang dikontrol</th>
</tr>
</thead>
<tbody>
<tr>
<td>Albedo (base color)</td>
<td>Warna mentah permukaan, tanpa pencahayaan yang sudah dipanggang</td>
</tr>
<tr>
<td>Normal</td>
<td>Menyimulasikan tonjolan dan lekukan kecil tanpa geometri tambahan</td>
</tr>
<tr>
<td>Roughness</td>
<td>Menentukan seberapa tajam atau buram pantulan (mengilap vs kusam)</td>
</tr>
<tr>
<td>Metallic</td>
<td>Menentukan apakah permukaan berperilaku seperti logam atau bukan</td>
</tr>
<tr>
<td>AO (ambient occlusion)</td>
<td>Bayangan lembut yang sudah dipanggang pada celah-celah</td>
</tr>
</tbody>
</table>
<p>Sebagian set juga menyertakan peta height/displacement untuk detail geometris nyata. Untuk game web, Anda biasanya dapat melewatkannya. Jika performa sangat terbatas, Anda bahkan dapat menghilangkan AO dan metallic pada properti yang jelas bukan logam.</p>
<h2 id="memilih-resolusi-untuk-game-web" tabindex="-1">Memilih resolusi untuk game web <a class="header-anchor" href="#memilih-resolusi-untuk-game-web" aria-label="Permalink to &quot;Memilih resolusi untuk game web&quot;"></a></h2>
<p>Lebih besar tidak selalu lebih baik di browser. Setiap tekstur didekode menjadi piksel mentah dalam memori GPU, sehingga tekstur RGBA 4K menghabiskan 64 MB VRAM terlepas dari ukuran berkasnya. Patokan yang baik untuk web: 1K untuk sebagian besar properti dan permukaan berulang, 2K untuk objek utama yang dilihat kamera dari dekat, dan hampir tidak pernah 4K. Unduh resolusi terkecil yang tetap terlihat bagus, bukan yang terbesar yang tersedia.</p>
<h2 id="kompres-semuanya-dengan-ktx2" tabindex="-1">Kompres semuanya dengan KTX2 <a class="header-anchor" href="#kompres-semuanya-dengan-ktx2" aria-label="Permalink to &quot;Kompres semuanya dengan KTX2&quot;"></a></h2>
<p>Sebelum tekstur dimasukkan ke dalam game WebGL atau WebGPU, konversikan ke KTX2 (Basis Universal). Tidak seperti PNG atau JPG, tekstur KTX2 tetap terkompresi untuk GPU di dalam memori video. Cara ini biasanya mengurangi penggunaan VRAM tekstur sebanyak 4 hingga 8 kali dan mempercepat pemuatan. Three.js, Babylon.js, dan PlayCanvas semuanya menyediakan loader KTX2. Cinevva memiliki <a href="/id/tools/ktx2-compressor.html">Kompresor Tekstur KTX2</a> gratis di browser yang mengonversi PNG, JPG, dan WebP secara lokal tanpa mengunggah apa pun. Jika Anda ingin memilih API grafis terlebih dahulu, baca <a href="/id/guides/webgpu-vs-webgl-games.html">panduan WebGPU vs WebGL</a> kami.</p>
<h2 id="buat-material-dan-skybox-dengan-ai" tabindex="-1">Buat material dan skybox dengan AI <a class="header-anchor" href="#buat-material-dan-skybox-dengan-ai" aria-label="Permalink to &quot;Buat material dan skybox dengan AI&quot;"></a></h2>
<p>Pada 2026, Anda juga dapat membuat apa pun yang tidak berhasil ditemukan. Alat text-to-material kini dapat menghasilkan set lengkap peta PBR berulang (albedo, normal, roughness) dari prompt, dengan opsi khusus seperti Texturly dan 3D AI Studio. Adobe Substance 3D Sampler juga dapat mengubah satu foto menjadi material. Untuk lingkungan 360 derajat, Skybox AI dari Blockade Labs menghasilkan skybox 8K tanpa sambungan dari teks, dengan paket gratis dan lisensi komersial pada paket berbayar.
Cinevva menyediakan keduanya: <a href="/id/tools/skybox.html">Generator Skybox</a> membuat skybox 360 derajat dengan peta kedalaman untuk lingkungan game Anda, sedangkan <a href="/id/tools/flux.html">Generator Gambar</a> menangani tekstur datar, decal, dan seni konsep dari prompt teks. Periksa ketentuan komersial setiap alat AI yang dihosting sebelum merilis game, sama seperti Anda memeriksa lisensi tekstur.</p>
<h2 id="lisensi-dalam-30-detik" tabindex="-1">Lisensi dalam 30 detik <a class="header-anchor" href="#lisensi-dalam-30-detik" aria-label="Permalink to &quot;Lisensi dalam 30 detik&quot;"></a></h2>
<ul>
<li><strong>CC0:</strong> domain publik. Boleh digunakan secara komersial dan dimodifikasi tanpa atribusi. Poly Haven, ambientCG, 3DTextures.me, ShareTextures, cgbookcase, dan Kenney semuanya menggunakan CC0.</li>
<li><strong>CC-BY:</strong> bebas digunakan secara komersial, tetapi wajib mencantumkan kredit kepada kreator.</li>
<li><strong>Bebas royalti / lisensi gratis khusus:</strong> bebas digunakan berdasarkan ketentuan situs masing-masing. Bacalah ketentuannya. Paket gratis FreePBR tidak mencakup penggunaan komersial.</li>
<li><strong>Dilarang mendistribusikan ulang:</strong> situs yang permisif sekalipun sering melarang pengunggahan ulang file mentah di tempat lain. Larangan ini berlaku untuk file, bukan game Anda, jadi menyertakannya di dalam build tidak menjadi masalah.</li>
</ul>
<p>Jika ragu, pilih CC0. Untuk pembahasan lengkap, lihat <a href="/id/guides/game-asset-licenses.html">panduan lisensi aset game</a> kami.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="di-mana-saya-dapat-mengunduh-tekstur-pbr-gratis-untuk-game-komersial" tabindex="-1">Di mana saya dapat mengunduh tekstur PBR gratis untuk game komersial? <a class="header-anchor" href="#di-mana-saya-dapat-mengunduh-tekstur-pbr-gratis-untuk-game-komersial" aria-label="Permalink to &quot;Di mana saya dapat mengunduh tekstur PBR gratis untuk game komersial?&quot;"></a></h3>
<p>Poly Haven dan ambientCG adalah sumber terbaik: keduanya menggunakan CC0, sehingga setiap tekstur aman digunakan dalam game komersial tanpa atribusi. 3DTextures.me, ShareTextures, dan cgbookcase juga sepenuhnya menggunakan CC0. Jangan berasumsi bahwa setiap situs &quot;tekstur gratis&quot; menerapkan ketentuan yang sama, karena beberapa situs (seperti FreePBR) membatasi penggunaan komersial untuk unduhan gratis.</p>
<h3 id="apakah-ambientcg-benar-benar-gratis-untuk-penggunaan-komersial" tabindex="-1">Apakah ambientCG benar-benar gratis untuk penggunaan komersial? <a class="header-anchor" href="#apakah-ambientcg-benar-benar-gratis-untuk-penggunaan-komersial" aria-label="Permalink to &quot;Apakah ambientCG benar-benar gratis untuk penggunaan komersial?&quot;"></a></h3>
<p>Ya. Setiap aset di ambientCG menggunakan CC0, yang menurut situs tersebut bebas digunakan tanpa atribusi, bahkan dalam proyek komersial. Situs ini sebelumnya bernama CC0Textures dan telah menggunakan lisensi yang sama sejak 2018.</p>
<h3 id="apakah-freepbr-menggunakan-cc0" tabindex="-1">Apakah FreePBR menggunakan CC0? <a class="header-anchor" href="#apakah-freepbr-menggunakan-cc0" aria-label="Permalink to &quot;Apakah FreePBR menggunakan CC0?&quot;"></a></h3>
<p>Tidak. FreePBR menggunakan lisensinya sendiri: unduhannya gratis untuk penggunaan pribadi dan nonkomersial, tetapi penggunaan komersial memerlukan pembayaran satu kali sebesar $16, dan pendistribusian ulang file di situs lain tidak diperbolehkan. Jika Anda menginginkan tekstur komersial tanpa biaya, gunakan situs CC0.</p>
<h3 id="di-mana-saya-bisa-mendapatkan-hdri-gratis-untuk-pencahayaan-game" tabindex="-1">Di mana saya bisa mendapatkan HDRI gratis untuk pencahayaan game? <a class="header-anchor" href="#di-mana-saya-bisa-mendapatkan-hdri-gratis-untuk-pencahayaan-game" aria-label="Permalink to &quot;Di mana saya bisa mendapatkan HDRI gratis untuk pencahayaan game?&quot;"></a></h3>
<p>Poly Haven memiliki lebih dari 980 HDRI CC0 dan merupakan pilihan standar. ambientCG menyediakan lebih dari 400 HDRI tambahan dengan lisensi CC0. HDRMaps menawarkan lebih dari 200 aset gratis yang dapat digunakan dalam proyek komersial, sedangkan situs saudaranya, OpenHDRI, sepenuhnya menggunakan CC0.</p>
<h3 id="resolusi-tekstur-apa-yang-sebaiknya-saya-gunakan-untuk-game-web" tabindex="-1">Resolusi tekstur apa yang sebaiknya saya gunakan untuk game web? <a class="header-anchor" href="#resolusi-tekstur-apa-yang-sebaiknya-saya-gunakan-untuk-game-web" aria-label="Permalink to &quot;Resolusi tekstur apa yang sebaiknya saya gunakan untuk game web?&quot;"></a></h3>
<p>Gunakan 1K untuk sebagian besar permukaan dan 2K untuk objek yang dilihat kamera dari dekat. Tekstur 4K tanpa kompresi menggunakan memori GPU sebesar 64 MB, terlalu besar untuk dialokasikan oleh game browser hanya pada satu permukaan. Apa pun resolusi yang Anda pilih, konversikan ke KTX2 agar tetap terkompresi di VRAM.</p>
<h3 id="bisakah-ai-menghasilkan-material-pbr-yang-dapat-di-tile" tabindex="-1">Bisakah AI menghasilkan material PBR yang dapat di-tile? <a class="header-anchor" href="#bisakah-ai-menghasilkan-material-pbr-yang-dapat-di-tile" aria-label="Permalink to &quot;Bisakah AI menghasilkan material PBR yang dapat di-tile?&quot;"></a></h3>
<p>Ya. Alat khusus seperti Texturly dan 3D AI Studio menghasilkan kumpulan peta PBR yang dapat di-tile dari prompt teks, sedangkan Adobe Substance 3D Sampler membuat material dari satu foto. Untuk langit, Skybox AI dari Blockade Labs dan <a href="/id/tools/skybox.html">Generator Skybox</a> Cinevva membuat lingkungan 360 derajat lengkap dari sebuah prompt.</p>
<h3 id="apakah-saya-perlu-mencantumkan-kredit-untuk-poly-haven-atau-ambientcg-di-dalam-game" tabindex="-1">Apakah saya perlu mencantumkan kredit untuk Poly Haven atau ambientCG di dalam game? <a class="header-anchor" href="#apakah-saya-perlu-mencantumkan-kredit-untuk-poly-haven-atau-ambientcg-di-dalam-game" aria-label="Permalink to &quot;Apakah saya perlu mencantumkan kredit untuk Poly Haven atau ambientCG di dalam game?&quot;"></a></h3>
<p>Tidak. CC0 berarti atribusi tidak diwajibkan di mana pun, termasuk dalam game komersial. Kedua situs menghargai pemberian kredit atau donasi, tetapi secara hukum Anda tidak memiliki kewajiban apa pun.</p>
<BuildCta
  title="Lewati pencarian tekstur. Langsung bangun adegannya"
  desc="Cinevva menelusuri Poly Haven dan ambientCG untuk Anda, lalu langsung memasukkan material dan HDRI ke dalam game yang dapat dimainkan."
  prompt="Buat lembah pegunungan berkabut saat matahari terbenam dengan reruntuhan batu yang dapat saya jelajahi, diterangi langit HDRI yang hangat" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a>: panduan lengkap dengan lebih dari 20 sumber</li>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik</a>: model untuk menggunakan material tersebut</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a>: CC0, CC-BY, dan lisensi lainnya</li>
<li><a href="/id/guides/webgpu-vs-webgl-games.html">WebGPU vs WebGL untuk Game</a>: tempat tekstur terkompresi tersebut digunakan</li>
<li><a href="/id/assets.html">Pencarian Pustaka Aset</a>: cari di Poly Haven, ambientCG, dan sumber lainnya dari satu tempat</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/free-textures-hdris-materials-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Panduan Developer CrazyGames: Publikasikan dan Hasilkan Pendapatan (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/publish-game-crazygames</link>
            <guid>https://app.cinevva.com/id/guides/publish-game-crazygames</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara memublikasikan game Anda di CrazyGames pada 2026: portal developer, pengajuan dan peninjauan, SDK, bagi hasil iklan, pembelian dalam game, dan cara kerja pembayaran.]]></description>
            <content:encoded><![CDATA[<h1 id="panduan-developer-crazygames-publikasikan-dan-hasilkan-pendapatan-2026" tabindex="-1">Panduan Developer CrazyGames: Publikasikan dan Hasilkan Pendapatan (2026) <a class="header-anchor" href="#panduan-developer-crazygames-publikasikan-dan-hasilkan-pendapatan-2026" aria-label="Permalink to &quot;Panduan Developer CrazyGames: Publikasikan dan Hasilkan Pendapatan (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Untuk memublikasikan game di CrazyGames, Anda mengunggah build HTML5 atau Unity WebGL melalui <a href="https://developer.crazygames.com/" target="_blank" rel="noreferrer">portal developer</a>, lalu tim QA meninjaunya (umpan balik biasanya diterima dalam <a href="https://docs.pley.com/docs/crazy-games" target="_blank" rel="noreferrer">1 hingga 2 hari</a>), dan game Anda dirilis dalam salah satu dari dua tahap. Basic Launch menempatkan game di situs tanpa memerlukan integrasi SDK agar CrazyGames dapat mengukur respons pemain. Jika game tersebut mampu mempertahankan perhatian pemain, Anda akan diundang ke Full Launch, tempat Anda mengintegrasikan <a href="https://docs.crazygames.com/" target="_blank" rel="noreferrer">CrazyGames SDK</a> dan mulai menghasilkan pendapatan. Tidak ada biaya publikasi dan <a href="https://docs.crazygames.com/faq/" target="_blank" rel="noreferrer">tidak ada persyaratan eksklusivitas</a>, sehingga Anda dapat menyediakan game yang sama di Steam, perangkat seluler, atau portal pesaing pada saat bersamaan.</p>
<p>Anda memperoleh penghasilan melalui bagi hasil dari iklan yang ditayangkan oleh SDK (video dan banner), ditambah pembelian dalam game bagi game yang diundang melalui Xsolla. CrazyGames tidak memublikasikan persentase pembagian yang pasti, tetapi membayar setiap bulan melalui <a href="https://docs.crazygames.com/payouts/" target="_blank" rel="noreferrer">Tipalti</a> setelah saldo Anda melewati batas minimum €100, dengan target pembayaran paling lambat tanggal 10 pada bulan berikutnya. Pendapatan cenderung lebih tinggi di pasar Tier 1 berbahasa Inggris seperti AS, Inggris, dan Australia karena permintaan iklan paling kuat di sana dan sebagian besar audiens platform berasal dari wilayah tersebut.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Model pengajuan</td>
<td>Unggah mandiri melalui portal developer, lalu peninjauan QA oleh manusia</td>
</tr>
<tr>
<td>Biaya publikasi</td>
<td>Gratis, tanpa persyaratan eksklusivitas</td>
</tr>
<tr>
<td>Waktu peninjauan</td>
<td>Umpan balik biasanya 1 hingga 2 hari; pembaruan sering kali diproses pada hari kerja yang sama</td>
</tr>
<tr>
<td>Tahap peluncuran</td>
<td>Basic Launch (tanpa SDK, tanpa monetisasi) → Full Launch (SDK diwajibkan, menghasilkan pendapatan)</td>
</tr>
<tr>
<td>Monetisasi</td>
<td>Bagi hasil iklan (video + banner SDK); pembelian dalam game melalui Xsolla (khusus undangan)</td>
</tr>
<tr>
<td>Pembagian pendapatan</td>
<td>Tidak tercantum dalam dokumentasi utama; <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">ketentuan game jam 2026</a> mencantumkan 60% iklan / 70% IAP untuk developer</td>
</tr>
<tr>
<td>Ambang pembayaran</td>
<td>Minimum €100, dibayar setiap bulan melalui Tipalti (transfer bank, ACH, PayPal)</td>
</tr>
<tr>
<td>Batas build</td>
<td>Pemuatan awal ≤ 50MB, total ≤ 250MB, ≤ 1.500 file</td>
</tr>
<tr>
<td>Audiens</td>
<td>PEGI 12 / usia 13+</td>
</tr>
</tbody>
</table>
<h2 id="mengapa-crazygames" tabindex="-1">Mengapa CrazyGames <a class="header-anchor" href="#mengapa-crazygames" aria-label="Permalink to &quot;Mengapa CrazyGames&quot;"></a></h2>
<p>CrazyGames adalah salah satu portal game browser terbesar di web. Portal developer perusahaan tersebut kini mengklaim memiliki <a href="https://developer.crazygames.com/" target="_blank" rel="noreferrer">lebih dari 50 juta pemain bulanan</a>, yang terkonsentrasi di pasar Tier 1, naik dari <a href="https://mobidictum.com/crazygames-reaches-35-million-monthly-users/" target="_blank" rel="noreferrer">35 juta pengguna aktif bulanan</a> yang dilaporkan secara independen pada awal 2025 untuk katalog berisi sekitar 4.000 game. Itu merupakan audiens siap pakai yang besar dan tidak perlu Anda dapatkan sendiri—inti daya tarik portal dibandingkan meluncurkan game dari nol di domain Anda sendiri.</p>
<p>Tawaran bagi developer cukup sederhana. Anda menyediakan game yang dapat dimainkan di web, CrazyGames menyediakan trafik dan sistem periklanan, lalu Anda berbagi pendapatan iklan. Platform ini sangat menekankan dukungannya kepada developer kecil dan solo serta tidak mengikat Anda. Karena tidak ada klausul eksklusivitas, CrazyGames biasanya menjadi kanal distribusi tambahan, bukan satu-satunya tempat Anda mempertaruhkan segalanya.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 210" role="img" aria-label="Sekilas tentang CrazyGames: lebih dari 50 juta pemain bulanan, sekitar 4.000 game, umpan balik peninjauan dalam 1 hingga 2 hari, ambang pembayaran 100 euro" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="210" rx="14" fill="#0b1020"/>
  <text x="24" y="40" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Sekilas tentang CrazyGames</text>
  <text x="24" y="62" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Skala platform dan dasar-dasar publikasi. Sumber: portal developer &amp; dokumentasi CrazyGames.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <g transform="translate(24,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#c8a8ff">50Jt+</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">Pemain bulanan</text>
      <rect x="16" y="82" width="72" height="20" rx="10" fill="#c8a8ff22"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#c8a8ff">Dominan Tier 1</text>
    </g>
    <g transform="translate(196,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#7dd3fc">~4.000</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">Game dalam katalog</text>
      <rect x="16" y="82" width="80" height="20" rx="10" fill="#7dd3fc22"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#7dd3fc">HTML5 + Unity</text>
    </g>
    <g transform="translate(368,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#6ee7b7">1-2 hari</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">Umpan balik tinjauan</text>
      <rect x="16" y="82" width="76" height="20" rx="10" fill="#6ee7b722"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#6ee7b7">QA manusia</text>
    </g>
    <g transform="translate(540,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#fb7185">€100</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">Minimum pembayaran</text>
      <rect x="16" y="82" width="60" height="20" rx="10" fill="#fb718522"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#fb7185">Bulanan</text>
    </g>
  </g>
</svg>
<h2 id="cara-kerja-publikasi" tabindex="-1">Cara Kerja Publikasi <a class="header-anchor" href="#cara-kerja-publikasi" aria-label="Permalink to &quot;Cara Kerja Publikasi&quot;"></a></h2>
<p>Anda memulai di <a href="https://developer.crazygames.com/games" target="_blank" rel="noreferrer">portal developer</a>, tempat Anda menyiapkan akun, melengkapi detail pembayaran, dan mengunggah build. Portal tersebut mencakup Quality Assurance Tool yang menjalankan game persis seperti tampilannya di CrazyGames, sehingga Anda dapat menguji panggilan SDK dan menemukan masalah sebelum ditinjau oleh manusia. Siapkan metode pembayaran sebelum mengajukan game karena CrazyGames meminta Anda melakukannya terlebih dahulu.</p>
<p>Setelah itu, game akan melalui peninjauan, bukan langsung dipublikasikan. Tim QA memainkan game Anda, memeriksa kesesuaiannya dengan persyaratan, lalu mengirimkan satu putaran umpan balik. Developer melaporkan bahwa umpan balik biasanya diterima dalam <a href="https://docs.pley.com/docs/crazy-games" target="_blank" rel="noreferrer">1 hingga 2 hari</a>, sering kali dilengkapi tangkapan layar yang menunjukkan hal-hal yang perlu diperbaiki. Catatan tersebut mencakup masalah yang wajib diperbaiki dan saran peningkatan. Setelah Anda mengatasi masalah penghambat, persiapan game untuk dirilis memerlukan waktu sekitar dua hari lagi. Pembaruan untuk game yang sudah tersedia diproses lebih cepat, biasanya <a href="https://docs.crazygames.com/faq/" target="_blank" rel="noreferrer">dalam hari kerja yang sama</a>.</p>
<h3 id="basic-launch-kemudian-full-launch" tabindex="-1">Basic Launch, Kemudian Full Launch <a class="header-anchor" href="#basic-launch-kemudian-full-launch" aria-label="Permalink to &quot;Basic Launch, Kemudian Full Launch&quot;"></a></h3>
<p>CrazyGames menggunakan <a href="https://docs.crazygames.com/requirements/intro/" target="_blank" rel="noreferrer">peluncuran dua tahap</a>. Pada Basic Launch, game Anda mulai tersedia tanpa memerlukan penyesuaian apa pun. SDK bersifat opsional dan monetisasi dinonaktifkan. Ini adalah periode soft launch (digambarkan oleh developer berlangsung sekitar dua minggu) ketika platform memantau interaksi nyata: waktu bermain rata-rata, jumlah pengunjung yang benar-benar mulai bermain, dan retensi. Jika game Anda mencapai tolok ukur yang ditetapkan, Anda akan diundang ke Full Launch.</p>
<p>Full Launch adalah tahap ketika pendapatan mulai dihasilkan. Anda mengintegrasikan SDK dengan benar, memenuhi seluruh persyaratan integrasi dan QA, lalu game langsung membuka sesi permainan dengan monetisasi yang telah diaktifkan. Gerbang di antara kedua tahap ini merupakan inti dari model tersebut. CrazyGames lebih memilih memberi game kesempatan yang adil untuk diuji oleh pemain sungguhan daripada menyetujuinya hanya berdasarkan potensi. Karena itu, kualitas penyelesaian dan sesi bermain pertama yang menarik lebih penting di sini daripada daftar fitur yang panjang.</p>
<h3 id="batas-build-dan-persyaratan-teknis" tabindex="-1">Batas Build dan Persyaratan Teknis <a class="header-anchor" href="#batas-build-dan-persyaratan-teknis" aria-label="Permalink to &quot;Batas Build dan Persyaratan Teknis&quot;"></a></h3>
<p>Build Anda memiliki batas tegas: <a href="https://docs.crazygames.com/requirements/intro/" target="_blank" rel="noreferrer">unduhan awal harus berukuran 50MB atau kurang</a>, ukuran total 250MB atau kurang (50MB jika Anda tidak menggunakan SDK), dan semuanya harus tetap di bawah 1.500 file. Game ditujukan untuk iframe responsif 16:9 dan harus dapat dibaca pada devicePixelRatio 1. Fisika harus tetap <a href="https://docs.crazygames.com/requirements/quality/" target="_blank" rel="noreferrer">konsisten pada berbagai refresh rate</a> seperti 144Hz dan 165Hz. Persyaratan ini menjegal cukup banyak engine yang mengaitkan pergerakan dengan frame rate alih-alih delta time. CrazyGames adalah situs bagi pemain <a href="https://docs.crazygames.com/requirements/gameplay/" target="_blank" rel="noreferrer">berusia 13 tahun ke atas</a>, sehingga game Anda harus mematuhi PEGI 12.</p>
<h2 id="crazygames-sdk" tabindex="-1">CrazyGames SDK <a class="header-anchor" href="#crazygames-sdk" aria-label="Permalink to &quot;CrazyGames SDK&quot;"></a></h2>
<p>SDK memungkinkan game Anda berkomunikasi dengan platform dan wajib digunakan untuk Full Launch. SDK menangani <a href="https://docs.crazygames.com/" target="_blank" rel="noreferrer">iklan, akun pengguna, penyimpanan cloud, undangan, papan peringkat, dan pembelian</a>. Hanya iklan yang ditayangkan melalui SDK yang diizinkan, dan ini merupakan aturan inti dari seluruh model pendapatannya.</p>
<p>Untuk iklan, tersedia dua jenis iklan video. Iklan midgame ditayangkan pada jeda alami, seperti ketika pemain kalah atau menyelesaikan level, sedangkan iklan berhadiah diminta oleh pemain untuk mendapatkan sesuatu di dalam game. <a href="https://docs.crazygames.com/requirements/ads/" target="_blank" rel="noreferrer">Persyaratannya ketat</a>: iklan tidak boleh mengganggu permainan aktif atau mengejutkan pemain, game harus dijeda dan input diblokir selama iklan berjalan, serta audio harus dibisukan selama iklan lalu diaktifkan kembali setelah iklan berakhir. Tersedia juga iklan banner. Selain iklan, SDK menyediakan penyimpanan data cloud agar progres pemain dapat tersinkronisasi di berbagai perangkat, autentikasi pengguna yang terhubung ke akun CrazyGames mereka, serta undangan teman dan fitur sosial untuk multiplayer. Platform telah mendorong fitur-fitur tersebut sejak menambahkan fungsi sosial sekitar pencapaian 35 juta penggunanya.</p>
<p>SDK secara langsung mendukung <a href="https://docs.crazygames.com/" target="_blank" rel="noreferrer">HTML5, Unity, GameMaker, Construct 3, Godot, dan Cocos</a>, dengan ekstensi mitra untuk GDevelop, Defold, dan Wonderland Engine. CrazyGames memiliki game aktif yang dibuat menggunakan Unity, Defold, Godot, Phaser, PlayCanvas, Construct, Pixi.js, dan BabylonJS. Jadi, engine yang Anda pilih jauh kurang penting dibandingkan kemampuannya mengekspor build web yang bersih dan cepat. Dukungan SDK langsung dan saran khusus mengenai penempatan iklan mulai tersedia setelah seluruh game Anda mencapai <a href="https://docs.crazygames.com/requirements/intro/" target="_blank" rel="noreferrer">50.000 kali dimainkan</a>.</p>
<h3 id="pembelian-dalam-game" tabindex="-1">Pembelian Dalam Game <a class="header-anchor" href="#pembelian-dalam-game" aria-label="Permalink to &quot;Pembelian Dalam Game&quot;"></a></h3>
<p>Pembelian dalam game tersedia, tetapi <a href="https://docs.crazygames.com/sdk/in-game-purchases/" target="_blank" rel="noreferrer">khusus undangan</a>. CrazyGames menjalankan IAP melalui <a href="https://xsolla.com/partner-spotlight/crazygames-adds-xsolla-payments" target="_blank" rel="noreferrer">Xsolla</a> sebagai penyedia pembayaran, dan pembelian selalu ditangani melalui akun Xsolla milik CrazyGames sehingga secara otomatis ditautkan kembali ke ID pengguna CrazyGames milik pemain. Fitur ini diluncurkan secara lebih luas sepanjang 2025. Xsolla dan Defold <a href="https://www.pocketgamer.biz/xsolla-partners-with-defold-to-simplify-in-game-purchases-for-web-developers/" target="_blank" rel="noreferrer">merilis SDK khusus</a> pada Juni 2025 yang memungkinkan game web Defold di CrazyGames menambahkan pembelian tanpa harus menghubungkan API secara manual. Dalam praktiknya, IAP bukan sesuatu yang dijadikan dasar rencana peluncuran. Raih undangan dengan menunjukkan performa iklan yang baik terlebih dahulu, lalu tambahkan pembelian setelahnya.</p>
<h2 id="cara-anda-dibayar" tabindex="-1">Cara Anda Dibayar <a class="header-anchor" href="#cara-anda-dibayar" aria-label="Permalink to &quot;Cara Anda Dibayar&quot;"></a></h2>
<p>CrazyGames tidak memublikasikan pembagian pendapatan dalam dokumentasi utama developernya, jadi berhati-hatilah terhadap panduan yang menyebut persentase pasti sebagai angka resmi. Angka yang paling mendekati keterangan resmi terdapat dalam ketentuan yang diterbitkan CrazyGames untuk <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">GameMaker web jam 2026</a>, yang menyatakan bahwa developer menerima 60% pendapatan iklan dalam game dan 70% pendapatan pembelian dalam game. <a href="https://developer.crazygames.com/" target="_blank" rel="noreferrer">Portal developer</a> memungkinkan Anda melacak pendapatan setiap game. Hal yang didokumentasikan CrazyGames secara lengkap adalah mekanisme pembayaran, dan ketentuannya jelas.</p>
<p>Pembayaran dilakukan <a href="https://docs.crazygames.com/payouts/" target="_blank" rel="noreferrer">setiap bulan melalui Tipalti</a> setelah saldo Anda mencapai minimum €100. Jika Anda tidak mencapai €100 pada bulan tertentu, saldo akan diakumulasikan ke bulan berikutnya. Tipalti mendukung transfer bank, setoran langsung/ACH, eCheck, dan PayPal, dengan ketersediaan yang bergantung pada negara Anda. Ketentuan resminya adalah NET 60, tetapi CrazyGames menyatakan bahwa saat ini mereka berupaya membayar lebih cepat, biasanya paling lambat tanggal 10 pada bulan berikutnya. Perhitungkan biaya valuta asing saat mengonversi mata uang dan kemungkinan biaya bank perantara yang berada di luar kendali CrazyGames. Pendapatan Anda bergantung pada jumlah permainan, retensi, dan lokasi pemain. Karena itu, game yang sama dapat menghasilkan pendapatan yang sangat berbeda dari audiens AS dibandingkan audiens di wilayah dengan CPM rendah.</p>
<h2 id="game-yang-berperforma-baik-di-crazygames" tabindex="-1">Game yang Berperforma Baik di CrazyGames <a class="header-anchor" href="#game-yang-berperforma-baik-di-crazygames" aria-label="Permalink to &quot;Game yang Berperforma Baik di CrazyGames&quot;"></a></h2>
<p>Katalog CrazyGames cenderung berisi multiplayer bergaya .io, game aksi berdurasi singkat, puzzle kasual, balapan, dan shooter—jenis game yang menarik pemain dalam sepuluh detik pertama dan tetap cocok dimainkan di tab browser di sela-sela aktivitas lain. Karena gerbang Basic Launch mengukur waktu bermain dan retensi, game yang langsung menyajikan keseruan cenderung berperforma baik, sedangkan game yang memerlukan tutorial lima menit sebelum sesuatu terjadi cenderung tersendat. Fitur sosial dan undangan SDK menguntungkan game yang memiliki elemen multiplayer atau daya tarik untuk dibagikan. Itulah sebabnya begitu banyak game browser populer dibangun di seputar pengalaman bermain bersama atau melawan orang lain.</p>
<h2 id="alasan-penolakan-yang-umum" tabindex="-1">Alasan Penolakan yang Umum <a class="header-anchor" href="#alasan-penolakan-yang-umum" aria-label="Permalink to &quot;Alasan Penolakan yang Umum&quot;"></a></h2>
<p>Cara tercepat agar ditolak adalah mengirimkan sesuatu yang tidak orisinal. CrazyGames secara eksplisit menyaring <a href="https://docs.crazygames.com/requirements/quality/" target="_blank" rel="noreferrer">klona, reskin, dan asset flip</a>, dan game Anda tidak boleh mudah tertukar dengan game lain karena nama atau ikonografinya. Masalah kedua yang paling umum adalah tingkat penyempurnaan. Seorang pengembang menulis tentang gamenya yang <a href="https://www.linkedin.com/pulse/my-game-got-rejected-just-2-hours-dmitrii-rigin" target="_blank" rel="noreferrer">ditolak dalam waktu sekitar dua jam</a> dengan catatan bahwa game tersebut &quot;terlihat seperti prototipe,&quot; dan mengeluhkan bahwa masukan yang diberikan sangat minim dibandingkan beberapa portal pesaing. Ini peringatan yang wajar: standar yang ditetapkan adalah game yang terasa sudah selesai, bukan build game jam, dan masukan yang Anda terima bisa sangat singkat.</p>
<p>Kegagalan teknis melengkapi daftar tersebut. Game yang lambat dimuat, tersendat, crash, atau memunculkan error akan ditolak, begitu pula build dengan cacat grafis seperti artefak kompresi, gaya visual yang tidak konsisten, fisika yang rusak pada monitor dengan refresh rate tinggi, atau kontrol yang mengabaikan tata letak keyboard umum. Teks yang tidak terbaca pada resolusi standar atau di iframe 16:9 juga merupakan masalah yang sering terjadi. Semua ini bukan masalah yang aneh, tetapi justru merupakan hal-hal yang mudah terlewat saat Anda terburu-buru mengirimkan game.</p>
<h2 id="peran-cinevva" tabindex="-1">Peran Cinevva <a class="header-anchor" href="#peran-cinevva" aria-label="Permalink to &quot;Peran Cinevva&quot;"></a></h2>
<p>Jika Anda sedang menghadapi standar &quot;harus terasa selesai, bukan seperti prototipe&quot; dan belum memiliki build, alat seperti Cinevva dapat membantu. Anda menjelaskan game yang diinginkan, lalu Cinevva membuat game web 3D yang dapat dimainkan langsung di browser dan mengekspornya sebagai build HTML5 mandiri. Dengan begitu, Anda memiliki sesuatu yang bisa disempurnakan dan diuji melalui alat QA CrazyGames, alih-alih memulai dari proyek engine kosong. Cinevva tidak akan memenuhi standar orisinalitas dan penyempurnaan untuk Anda, tetapi alat ini memangkas jarak antara ide dan versi pertama yang dapat dimainkan, yang biasanya merupakan bagian paling lambat dalam proses menuju pengiriman game.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="berapa-banyak-crazygames-membayar-pengembang" tabindex="-1">Berapa banyak CrazyGames membayar pengembang? <a class="header-anchor" href="#berapa-banyak-crazygames-membayar-pengembang" aria-label="Permalink to &quot;Berapa banyak CrazyGames membayar pengembang?&quot;"></a></h3>
<p>CrazyGames tidak memublikasikan pembagian pendapatan dalam dokumentasi utama untuk pengembang. Data resmi terdekat berasal dari <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">ketentuan web jam GameMaker 2026</a>, yang menyatakan bahwa pengembang memperoleh 60% pendapatan iklan dan 70% pendapatan pembelian. Anda memperoleh bagian dari pendapatan iklan yang dihasilkan game melalui SDK, yang dilacak per game di portal pengembang, ditambah pembelian dalam game jika Anda diundang. Pembayaran dilakukan setiap bulan melalui Tipalti setelah saldo Anda mencapai €100, dan pendapatan sebenarnya sangat bergantung pada jumlah permainan, retensi, serta seberapa besar bagian audiens Anda yang berada di pasar dengan CPM tinggi seperti AS dan Inggris.</p>
<h3 id="berapa-lama-crazygames-meninjau-sebuah-game" tabindex="-1">Berapa lama CrazyGames meninjau sebuah game? <a class="header-anchor" href="#berapa-lama-crazygames-meninjau-sebuah-game" aria-label="Permalink to &quot;Berapa lama CrazyGames meninjau sebuah game?&quot;"></a></h3>
<p>Pengembang biasanya menerima kabar dalam 1 hingga 2 hari setelah mengirimkan game, sering kali disertai tangkapan layar yang menunjukkan bagian yang perlu diperbaiki. Setelah Anda mengatasi masalah yang menghambat, persiapan game untuk dirilis membutuhkan sekitar dua hari lagi. Pembaruan untuk game yang sudah tayang diproses lebih cepat dan biasanya selesai dalam hari kerja yang sama. Waktu paling banyak tersita pada periode Basic Launch, yaitu masa peluncuran terbatas selama sekitar dua minggu ketika CrazyGames mengukur interaksi pemain yang sebenarnya sebelum mengundang Anda ke Full Launch.</p>
<h3 id="apakah-game-saya-harus-eksklusif-untuk-crazygames" tabindex="-1">Apakah game saya harus eksklusif untuk CrazyGames? <a class="header-anchor" href="#apakah-game-saya-harus-eksklusif-untuk-crazygames" aria-label="Permalink to &quot;Apakah game saya harus eksklusif untuk CrazyGames?&quot;"></a></h3>
<p>Tidak. CrazyGames tidak mewajibkan eksklusivitas, jadi Anda dapat menerbitkan game yang sama di Steam, toko aplikasi seluler, itch.io, atau portal pesaing seperti Poki secara bersamaan dan tetap memperoleh bagi hasil pendapatan di CrazyGames. Hal ini menjadikannya kanal berisiko rendah untuk ditambahkan ke peluncuran multiplatform, bukan keputusan yang membatasi distribusi game Anda.</p>
<h3 id="jenis-game-apa-yang-paling-cocok-di-crazygames" tabindex="-1">Jenis game apa yang paling cocok di CrazyGames? <a class="header-anchor" href="#jenis-game-apa-yang-paling-cocok-di-crazygames" aria-label="Permalink to &quot;Jenis game apa yang paling cocok di CrazyGames?&quot;"></a></h3>
<p>Game browser yang cepat dimuat dan langsung menyenangkan adalah yang paling unggul di sini. Tahap seleksi peluncuran platform ini mengukur waktu bermain dan retensi, sehingga game multipemain .io, game aksi dengan sesi singkat, teka-teki kasual, balapan, dan game tembak-menembak yang mampu memikat pemain dalam sepuluh detik pertama cenderung lolos dan berkembang. Game yang membutuhkan tutorial panjang sebelum keseruannya dimulai, atau yang lambat dimuat, cenderung kesulitan. Fitur undangan dan sosial dalam SDK juga memberikan keunggulan tambahan bagi game multipemain dan game yang mudah dibagikan.</p>
<h3 id="berapa-batas-ukuran-build-untuk-crazygames" tabindex="-1">Berapa batas ukuran build untuk CrazyGames? <a class="header-anchor" href="#berapa-batas-ukuran-build-untuk-crazygames" aria-label="Permalink to &quot;Berapa batas ukuran build untuk CrazyGames?&quot;"></a></h3>
<p>Unduhan awal Anda harus berukuran 50MB atau kurang, total build harus 250MB atau kurang (atau 50MB jika Anda tidak mengintegrasikan SDK), dan semuanya harus berjumlah kurang dari 1.500 file. Game berjalan dalam iframe responsif 16:9 dan harus dapat dibaca pada devicePixelRatio 1. Menjaga ukuran pemuatan awal tetap kecil adalah hal terpenting karena waktu mulai yang lambat merugikan metrik konversi dan retensi yang menentukan apakah Anda dapat mencapai Full Launch.</p>
<h3 id="bisakah-saya-menjual-pembelian-dalam-game-di-crazygames" tabindex="-1">Bisakah saya menjual pembelian dalam game di CrazyGames? <a class="header-anchor" href="#bisakah-saya-menjual-pembelian-dalam-game-di-crazygames" aria-label="Permalink to &quot;Bisakah saya menjual pembelian dalam game di CrazyGames?&quot;"></a></h3>
<p>Ya, tetapi hanya melalui undangan. Pembelian dalam game diproses melalui Xsolla menggunakan akun Xsolla milik CrazyGames sendiri sehingga setiap pembelian secara otomatis terhubung dengan ID CrazyGames pemain. Umumnya, Anda akan diundang setelah game menunjukkan performa yang baik dalam monetisasi iklan. Jadi, rencanakan untuk meluncurkan game dengan iklan terlebih dahulu dan menambahkan pembelian nanti, alih-alih membangun seluruh ekonomi game berdasarkan IAP sejak hari pertama.</p>
<BuildCta
  title="Butuh game siap web untuk dikirimkan?"
  desc="Buat game 3D yang dapat dimainkan dari satu kalimat dan ekspor build HTML5 mandiri untuk alat QA CrazyGames."
  prompt="Buat game arena multipemain bergaya .io yang cepat dimuat dan dapat saya terbitkan di CrazyGames" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-web-game.html">Cara Menerbitkan Game Web</a> — daftar lengkap portal dan platform untuk game browser</li>
<li><a href="/id/guides/publish-game-poki.html">Terbitkan Game Anda di Poki</a> — portal game browser besar lainnya, dibandingkan secara berdampingan</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web</a> — bagaimana bagi hasil pendapatan iklan, IAP, dan video berhadiah benar-benar memberikan penghasilan</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Luncurkan Game Anda di itch.io</a> — alternatif terbuka tanpa seleksi ketat tempat Anda menetapkan ketentuan sendiri</li>
<li><a href="/id/guides/promote-indie-game-no-budget.html">Promosikan Game Indie Tanpa Anggaran</a> — mendatangkan trafik sendiri ketika portal saja tidak cukup</li>
<li><a href="/id/tutorials/ship-web-game-fast.html">Rilis Game Web yang Dimuat dengan Cepat</a> — memenuhi batas pemuatan awal 50MB yang diberlakukan CrazyGames</li>
<li><a href="/id/guides/multiplayer-browser-game.html">Buat Game Browser Multipemain</a> — daya tarik bergaya .io yang memberikan performa terbaik di CrazyGames</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/publish-game-crazygames-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Menerbitkan Game di Discord Activities (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/publish-game-discord-activities</link>
            <guid>https://app.cinevva.com/id/guides/publish-game-discord-activities</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara menerbitkan game di Discord Activities pada 2026 - Embedded App SDK, batasan iframe dan proksi, integrasi multipemain, monetisasi, serta realitas penemuan.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-menerbitkan-game-di-discord-activities-2026" tabindex="-1">Cara Menerbitkan Game di Discord Activities (2026) <a class="header-anchor" href="#cara-menerbitkan-game-di-discord-activities-2026" aria-label="Permalink to &quot;Cara Menerbitkan Game di Discord Activities (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Ya, Anda dapat menerbitkan game di Discord, dan caranya disebut Activity. Activity adalah aplikasi web yang berjalan di dalam klien Discord, disematkan dalam iframe yang dapat Anda luncurkan dari kanal suara, kanal teks, atau DM. Anda membuatnya dengan <a href="https://github.com/discord/embedded-app-sdk" target="_blank" rel="noreferrer">Discord Embedded App SDK</a>, perangkat JavaScript yang pertama kali diluncurkan pada 2024 dan masih aktif diperbarui (v2.5.0 dirilis pada <a href="https://github.com/discord/embedded-app-sdk/releases" target="_blank" rel="noreferrer">5 Mei 2026</a>). Jika game Anda sudah berjalan di browser, sebagian besar pekerjaannya adalah meng-host game tersebut, memberi tahu Discord lokasinya, serta menggunakan SDK untuk mendapatkan informasi pengguna saat ini dan orang lain di kanal.</p>
<p>Versi singkatnya: buat aplikasi di Discord Developer Portal, aktifkan fitur Activities, host build web Anda di tempat yang dapat diakses publik, tambahkan pemetaan URL agar proksi Discord dapat menyajikannya, lalu gunakan SDK untuk mengautentikasi pemain dan membaca daftar peserta. Dengan begitu, Anda mendapatkan Activity yang berfungsi dan dapat diluncurkan oleh teman-teman Anda. Membuat orang lain menemukannya adalah bagian yang lebih sulit karena Discord tidak memiliki toko &quot;jelajahi semua game&quot;, dan kami akan membahasnya secara terbuka di bawah.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Apa itu</strong></td>
<td>Aplikasi web (game Anda) yang berjalan dalam iframe di dalam Discord dan dapat diluncurkan di kanal suara/teks serta DM</td>
</tr>
<tr>
<td><strong>Teknologi</strong></td>
<td>Build web apa pun (HTML5/WebGL, Unity WebGL, ekspor web Godot) ditambah <a href="https://www.npmjs.com/package/@discord/embedded-app-sdk" target="_blank" rel="noreferrer">Embedded App SDK</a> untuk autentikasi dan peserta</td>
</tr>
<tr>
<td><strong>Hosting</strong></td>
<td>Anda meng-host build sendiri; Discord meneruskannya melalui <code>discordsays.com</code> dengan CSP yang ketat</td>
</tr>
<tr>
<td><strong>Monetisasi</strong></td>
<td>Pembelian dalam aplikasi bawaan (langganan + item sekali beli). Biaya platform Discord adalah <a href="https://support-dev.discord.com/hc/en-us/articles/17299902720919-Premium-Apps-Payout" target="_blank" rel="noreferrer">15% untuk pendapatan $1 juta pertama, lalu 30%</a>, ditambah biaya pemrosesan pembayaran</td>
</tr>
<tr>
<td><strong>Penemuan</strong></td>
<td>App Launcher, profil App Directory (setelah verifikasi), dan sebagian besar dari rekomendasi mulut ke mulut. Tidak ada halaman global untuk menjelajahi semua game</td>
</tr>
<tr>
<td><strong>Biaya penerbitan</strong></td>
<td>Gratis untuk membuat aplikasi; Anda membayar hosting sendiri dan server game jika diperlukan</td>
</tr>
</tbody>
</table>
<h2 id="apa-itu-activities-pada-2026" tabindex="-1">Apa itu Activities pada 2026 <a class="header-anchor" href="#apa-itu-activities-pada-2026" aria-label="Permalink to &quot;Apa itu Activities pada 2026&quot;"></a></h2>
<p>Activity bukanlah game native yang Anda unggah. Activity adalah situs web Anda yang berjalan secara langsung dan dimuat Discord dalam frame terisolasi saat orang-orang berkumpul bersama. SDK menjadi penghubung antara halaman Anda dan klien Discord serta menangani kebutuhan sosialnya: siapa yang ada di sini, siapa saya, kanal apa yang sedang kami gunakan, dan proses OAuth untuk memperoleh token yang dapat Anda percayai (<a href="https://docs.discord.com/developers/developer-tools/embedded-app-sdk" target="_blank" rel="noreferrer">referensi SDK</a>).</p>
<p>Alasan hal ini lebih penting pada 2026 dibandingkan saat peluncuran adalah karena Discord makin serius menjadikan game sebagai sebuah kategori. Aplikasi dan Activities kini digunakan oleh lebih dari 25% pengguna aktif bulanan Discord, dan pada akhir 2025 terdapat lebih dari 10.000 komunitas game di platform tersebut dengan total lebih dari 80 juta anggota (<a href="https://discord.com/press-releases/discord-deepens-its-ability-to-drive-growth-for-games" target="_blank" rel="noreferrer">siaran pers Discord, GDC 2026</a>). Beberapa Activities berhasil meraih popularitas nyata di kalangan tersebut. Death by AI dari Playroom mencapai puncak sekitar 700 ribu pengguna aktif harian dan memperoleh kurang lebih 7 juta pemain dalam hitungan minggu, dengan lebih dari 70% sesi melibatkan tiga teman atau lebih. Chef Showdown dari Mojiworks telah dimainkan oleh lebih dari 14 juta orang, yang menghabiskan waktu sekitar tiga kali lebih lama di dalam game dibandingkan di platform lain. Krunker Strike FRVR meningkatkan jumlah pemainnya lebih dari dua kali lipat setelah dirilis sebagai Activity (<a href="https://a16z.com/discord-activities-social-gaming/" target="_blank" rel="noreferrer">a16z</a>, <a href="https://discord.com/press-releases/discord-deepens-its-ability-to-drive-growth-for-games" target="_blank" rel="noreferrer">Discord</a>). Pola dari semua game tersebut adalah sosial, kasual, dan langsung multipemain. Itulah jenis game yang berhasil di sini.</p>
<h2 id="menyiapkan-activity" tabindex="-1">Menyiapkan Activity <a class="header-anchor" href="#menyiapkan-activity" aria-label="Permalink to &quot;Menyiapkan Activity&quot;"></a></h2>
<p>Mulailah di <a href="https://discord.com/developers/build" target="_blank" rel="noreferrer">Discord Developer Portal</a>. Buat aplikasi baru, lalu aktifkan hak akses Activities untuk aplikasi tersebut di bagian Activities. Game Anda harus dapat diakses melalui URL HTTPS publik, jadi host build web-nya di layanan apa pun yang biasa Anda gunakan (Cloudflare Pages, Vercel, Netlify, atau hosting statis biasa).</p>
<p>Langkah yang sering menyulitkan orang adalah pemetaan URL. Discord tidak memuat situs Anda secara langsung. Setiap permintaan diteruskan melalui proksi di <code>https://&lt;your-app-id&gt;.discordsays.com</code> untuk menyembunyikan alamat IP pemain dan memblokir endpoint yang diketahui berbahaya (<a href="https://docs.discord.com/developers/activities/development-guides/networking" target="_blank" rel="noreferrer">dokumentasi jaringan Discord</a>). Di Developer Portal, Anda memetakan prefiks jalur ke host sebenarnya, sehingga <code>/</code> mengarah ke game Anda dan, misalnya, <code>/api</code> mengarah ke backend Anda. Apa pun yang diambil game Anda dan belum dipetakan akan diblokir. Untuk permintaan yang baru muncul saat runtime, API <code>patchUrlMappings</code> milik SDK menulis ulang permintaan tersebut secara dinamis agar build pengembangan dan build produksi yang melalui proksi berperilaku sama (<a href="https://github.com/discord/embedded-app-sdk/blob/main/patch-url-mappings.md" target="_blank" rel="noreferrer">panduan patch-url-mappings</a>).</p>
<p>Setelah hosting dan pemetaan siap, integrasikan SDK. Panggil <code>discordSdk.ready()</code> untuk memastikan frame telah terhubung, lalu <code>authorize()</code> dan <code>authenticate()</code> untuk menjalankan proses OAuth serta memperoleh token yang mengidentifikasi pemain (<a href="https://docs.discord.com/developers/developer-tools/embedded-app-sdk" target="_blank" rel="noreferrer">referensi SDK</a>). Setelah itu, Anda dapat membaca daftar peserta di kanal dan merancang game berdasarkan mereka. Uji dengan meluncurkan Activity di kanal suara sungguhan setelah aplikasinya terpasang. Dokumentasi Discord dan templat komunitas untuk <a href="https://robojs.dev/discord-activities/proxy" target="_blank" rel="noreferrer">Robo.js</a> serta konfigurasi vanilla dapat membantu Anda beralih dari repositori kosong menjadi frame yang berjalan dalam satu sore.</p>
<h2 id="batasan-teknis" tabindex="-1">Batasan teknis <a class="header-anchor" href="#batasan-teknis" aria-label="Permalink to &quot;Batasan teknis&quot;"></a></h2>
<p>Karena Activity merupakan halaman web di dalam iframe yang sangat dibatasi, batasannya mencakup batasan web ditambah aturan keamanan Discord. Activities berjalan dengan Content Security Policy yang ketat, dan semua permintaan jaringan harus melalui proksi <code>discordsays.com</code>. Panggilan langsung ke domain eksternal yang tidak Anda petakan akan gagal dengan galat <code>blocked:csp</code> (<a href="https://blog.waveplay.com/discord-proxy-csp-patch/" target="_blank" rel="noreferrer">catatan proksi Discord</a>). Masalah ini paling terasa ketika modul npm pihak ketiga diam-diam menghubungi CDN atau API miliknya sendiri. Anda harus memetakan domain tersebut atau menambal permintaannya.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 300" role="img" aria-label="Alur permintaan Discord Activity: iframe game Anda mengirim setiap permintaan ke proksi discordsays.com; permintaan ke host yang dipetakan diizinkan dan disajikan, sedangkan permintaan ke host eksternal yang tidak dipetakan diblokir dengan galat blocked:csp" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <defs>
    <marker id="ah-g" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path d="M0 0 L10 5 L0 10 z" fill="#6ee7b7"/></marker>
    <marker id="ah-r" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path d="M0 0 L10 5 L0 10 z" fill="#fb7185"/></marker>
    <marker id="ah-b" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path d="M0 0 L10 5 L0 10 z" fill="#c8a8ff"/></marker>
  </defs>
  <rect width="720" height="300" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Setiap permintaan melewati proksi</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Petakan host agar disajikan. Tanpa pemetaan, CSP Discord akan memblokirnya.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <rect x="24" y="150" width="160" height="70" rx="12" fill="#121a31" stroke="#7dd3fc" stroke-width="1.5"/>
    <text x="104" y="181" text-anchor="middle" font-size="14" font-weight="800" fill="#e8edf5">Game Anda</text>
    <text x="104" y="200" text-anchor="middle" font-size="11.5" fill="#9aa7b4">iframe di Discord</text>
    <rect x="262" y="150" width="182" height="70" rx="12" fill="#121a31" stroke="#c8a8ff" stroke-width="1.5"/>
    <text x="353" y="181" text-anchor="middle" font-size="14" font-weight="800" fill="#c8a8ff">discordsays.com</text>
    <text x="353" y="200" text-anchor="middle" font-size="11.5" fill="#9aa7b4">proksi + CSP</text>
    <rect x="524" y="94" width="172" height="66" rx="12" fill="#121a31" stroke="#6ee7b7" stroke-width="1.5"/>
    <text x="610" y="122" text-anchor="middle" font-size="14" font-weight="800" fill="#6ee7b7">Host yang dipetakan</text>
    <text x="610" y="141" text-anchor="middle" font-size="11.5" fill="#9aa7b4">disajikan &#10003;</text>
    <rect x="524" y="210" width="172" height="66" rx="12" fill="#121a31" stroke="#fb7185" stroke-width="1.5"/>
    <text x="610" y="238" text-anchor="middle" font-size="14" font-weight="800" fill="#fb7185">Host tanpa pemetaan</text>
    <text x="610" y="257" text-anchor="middle" font-size="11.5" fill="#9aa7b4">blocked:csp &#10007;</text>
    <path d="M184 185 H256" fill="none" stroke="#c8a8ff" stroke-width="2.5" marker-end="url(#ah-b)"/>
    <path d="M444 176 C486 176 486 127 518 127" fill="none" stroke="#6ee7b7" stroke-width="2.5" marker-end="url(#ah-g)"/>
    <path d="M444 194 C486 194 486 243 518 243" fill="none" stroke="#fb7185" stroke-width="2.5" marker-end="url(#ah-r)"/>
    <text x="470" y="112" font-size="11" font-weight="700" fill="#6ee7b7">dipetakan</text>
    <text x="470" y="270" font-size="11" font-weight="700" fill="#fb7185">tidak dipetakan</text>
  </g>
</svg>
<p>Untuk kompatibilitas engine, jika dapat dikompilasi untuk web, game tersebut dapat dijadikan Activity. HTML5 biasa dan WebGL dapat digunakan. Ekspor WebGL Unity juga dapat digunakan, dengan komunitas yang menyediakan <a href="https://www.supertorio.dev/creating-a-unity-discord-activity/" target="_blank" rel="noreferrer">wrapper SDK Unity</a> dan templat, karena Discord hanya meneruskan build WebGL yang disajikan ke dalam frame. Ekspor web Godot bekerja dengan cara yang sama, dan tersedia <a href="https://github.com/TheSleepyKoala/Svelcordot" target="_blank" rel="noreferrer">templat siap pakai</a> yang memasangkan Godot dengan host web. Engine native yang tidak dapat menargetkan browser sama sekali tidak dapat dijadikan Activities. Jaga agar pemuatan awal tetap ringan karena unduhan WebGL yang berat di dalam jendela obrolan akan membuat orang pergi lebih cepat dibandingkan di halaman toko.</p>
<p>Dukungan seluler adalah bagian utama, bukan sesuatu yang baru dipikirkan belakangan. Activities berjalan di klien desktop, web, dan seluler Discord, jadi rancang untuk layar sentuh dan orientasi potret sejak awal alih-alih mengasumsikan pemain menggunakan papan ketik dan tetikus.</p>
<h2 id="integrasi-multipemain-dan-sosial" tabindex="-1">Integrasi multipemain dan sosial <a class="header-anchor" href="#integrasi-multipemain-dan-sosial" aria-label="Permalink to &quot;Integrasi multipemain dan sosial&quot;"></a></h2>
<p>Inilah alasan utama untuk hadir di Discord. Platform ini memberi Anda sekelompok teman yang sudah berada bersama dalam kanal suara, persis seperti kondisi yang coba diciptakan oleh kebanyakan game multipemain dengan biaya besar. SDK memberi Anda daftar peserta dan identitas secara gratis, sehingga &quot;semua orang dalam panggilan ini kini berada di game saya&quot; hanya memerlukan beberapa baris kode, bukan sebuah sistem matchmaking.</p>
<p>Anda tetap harus menjalankan state real-time game sendiri. Embedded App SDK menangani identitas dan presence, bukan netcode, jadi Anda perlu memasangkannya dengan server game. <a href="https://colyseus.io/blog/discord-embedded-sdk/" target="_blank" rel="noreferrer">Colyseus menjelaskan cara kerjanya di balik Discord Activity</a>, dan opsi yang sama dari <a href="/id/guides/multiplayer-browser-game.html">panduan game browser multipemain kami</a> juga berlaku: gunakan WebSocket agar cepat dirilis dan server otoritatif supaya pencegahan kecurangan serta sumber data utama tetap sederhana. Ingat saja bahwa server game Anda merupakan satu lagi host eksternal, sehingga memerlukan pemetaan URL seperti yang lainnya.</p>
<p>Manfaatkan konteks sosialnya semaksimal mungkin. Activities yang berhasil populer adalah game yang menjadikan kebersamaan dalam kelompok sebagai inti permainan, bukan sekadar mode yang dapat dinonaktifkan. Game pesta, game menggambar, trivia, ronde kompetitif singkat—apa pun yang lebih seru saat langsung dimainkan bersama orang-orang yang sudah berada dalam panggilan Anda dibandingkan bermain sendirian.</p>
<h2 id="realitas-monetisasi" tabindex="-1">Realitas monetisasi <a class="header-anchor" href="#realitas-monetisasi" aria-label="Permalink to &quot;Realitas monetisasi&quot;"></a></h2>
<p>Discord mendukung pembelian dalam aplikasi bawaan untuk Activities, sehingga Anda dapat berjualan tanpa mengarahkan pemain ke halaman pembayaran eksternal. <a href="https://docs.discord.com/developers/monetization/implementing-iap-for-activities" target="_blank" rel="noreferrer">Sistem IAP untuk Activities</a> mencakup langganan (pengguna atau server) dan pembelian sekali bayar, baik dalam bentuk item permanen untuk membuka fitur selamanya maupun item konsumsi yang dapat digunakan pemain.</p>
<p>Soal pembagian pendapatan, pahami angkanya dengan jernih. Biaya platform Discord adalah 15% untuk penjualan kumulatif $1 juta pertama Anda, lalu 30% setelah melewati ambang tersebut, dan itu belum termasuk biaya pemrosesan pembayaran serta biaya transaksi (<a href="https://support-dev.discord.com/hc/en-us/articles/17299902720919-Premium-Apps-Payout" target="_blank" rel="noreferrer">Pembayaran Premium Apps, berlaku sejak 6 Juni 2024</a>). Anda mungkin melihat angka &quot;Discord mengambil 10%&quot; beredar di internet. Jangan langsung mempercayainya karena ketentuan pembayaran yang terdokumentasi menetapkan tingkatan 15%/30% di atas. Anda berhak menerima pembayaran setelah memperoleh $100.
Dua bagian lain dari gambaran monetisasi 2026 juga perlu diketahui, meskipun saat ini belum relevan bagi sebagian besar pengembang indie. Mata uang Orbs dari Discord, yang diluncurkan secara global pada <a href="https://www.tweaktown.com/news/105500/discord-rewards-users-for-engaging-with-ads-new-orbs-currency-introduced/index.html" target="_blank" rel="noreferrer">Juli 2025</a>, memungkinkan pemain memperoleh mata uang lunak dengan menyelesaikan Quest (aksi iklan berhadiah) dan membelanjakannya di Shop Discord. Ini adalah ekonomi periklanan yang lebih ditujukan untuk anggaran pemasaran game besar daripada Activity pertama. Kemudian, pada GDC 2026, Discord memperluas Social Commerce, yaitu cara bawaan untuk membeli dan menghadiahkan item dalam game di dalam server, yang pertama kali diperkenalkan bersama Marvel Rivals pada <a href="https://discord.com/blog/bringing-in-game-commerce-to-discord-communities" target="_blank" rel="noreferrer">Desember 2025</a>. Sekitar 20% pembelian di Discord Shop merupakan hadiah, dan dalam peluncuran Marvel Rivals, 41% pembelian merupakan hadiah (<a href="https://discord.com/blog/building-on-the-social-layer-of-games-whats-new-from-gdc-2026" target="_blank" rel="noreferrer">rangkuman GDC 2026</a>). Social Commerce pertama-tama diluncurkan kepada kelompok mitra terbatas, jadi ini merupakan opsi yang bisa Anda manfaatkan setelah berkembang, bukan alat yang tersedia sejak hari pertama.</p>
<h2 id="realitas-penemuan" tabindex="-1">Realitas penemuan <a class="header-anchor" href="#realitas-penemuan" aria-label="Permalink to &quot;Realitas penemuan&quot;"></a></h2>
<p>Inilah bagian yang perlu Anda pahami sebelum menyusun rencana dengan mengandalkan Discord. Tidak ada toko global untuk &quot;menjelajahi Activity&quot; di dalam Discord seperti halaman depan yang dimiliki Steam atau portal web (<a href="https://www.strayspark.studio/blog/discord-activities-embedded-app-sdk-indie-game-distribution-2026" target="_blank" rel="noreferrer">StraySpark, 14 Mei 2026</a>). Penemuan terjadi melalui server yang sudah diikuti pengguna, tautan yang dibagikan dalam obrolan, dan App Launcher (ikon bentuk-bentuk di bagian bawah klien), serta halaman profil App Directory Anda. Keduanya baru muncul setelah aplikasi Anda diverifikasi dan Anda mengaktifkan Discovery di Developer Portal (<a href="https://support-dev.discord.com/hc/en-us/articles/21204493235991-How-Can-Users-Discover-and-Play-My-Activity" target="_blank" rel="noreferrer">dukungan Discord</a>).</p>
<p>Dalam praktiknya, ini berarti sebuah Activity tidak menciptakan audiens dengan sendirinya. Jika komunitas Anda belum berada di Discord, menerbitkan Activity tidak akan secara ajaib menciptakan komunitas. Game-game yang sukses menyebar melalui kelompok pertemanan yang sudah ada, ketika satu orang meluncurkannya dalam panggilan dan seluruh kelompok langsung bermain. Jadi, siklus pertumbuhan yang perlu Anda rancang adalah &quot;satu orang membagikannya di sebuah kanal&quot;, bukan &quot;seseorang menemukannya saat menjelajahi katalog&quot;. Buat game tersebut agar 30 detik pertama bersama tiga teman sudah cukup untuk meyakinkan pemain.</p>
<h2 id="apakah-sepadan-dibandingkan-portal-web" tabindex="-1">Apakah sepadan dibandingkan portal web <a class="header-anchor" href="#apakah-sepadan-dibandingkan-portal-web" aria-label="Permalink to &quot;Apakah sepadan dibandingkan portal web&quot;"></a></h2>
<p>Discord dan portal web menyelesaikan masalah yang berbeda, jadi jawabannya biasanya adalah &quot;keduanya, untuk alasan yang berbeda&quot;.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Discord Activities</th>
<th>Portal web (Poki, CrazyGames, itch.io)</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Audiens</strong></td>
<td>Teman-teman yang sudah berada dalam panggilan suara bersama</td>
<td>Orang asing yang sedang mencari game untuk dicoba</td>
</tr>
<tr>
<td><strong>Penemuan</strong></td>
<td>Rekomendasi dari mulut ke mulut, tanpa toko yang menampilkan semuanya</td>
<td>Trafik halaman depan dan algoritmik</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Game sosial, kasual, dan multipemain instan</td>
<td>Game pemain tunggal dan game web dengan jangkauan luas</td>
</tr>
<tr>
<td><strong>Monetisasi</strong></td>
<td>IAP bawaan, tingkat biaya 15%/30%</td>
<td>Bagi hasil iklan portal atau IAP milik Anda sendiri</td>
</tr>
<tr>
<td><strong>Pekerjaan tambahan setelah versi web dibuat</strong></td>
<td>SDK, pemetaan proksi, CSP, desain sosial</td>
<td>Biasanya hanya penyematan dan sebuah halaman</td>
</tr>
</tbody>
</table>
<p>Portal seperti <a href="/id/guides/publish-game-poki.html">Poki</a> dan <a href="/id/guides/publish-game-crazygames.html">CrazyGames</a> mendatangkan pemain yang belum mengenal Anda dan menampilkan game Anda kepada orang-orang yang aktif mencari sesuatu yang baru, hal yang tidak dilakukan Discord. Discord mendatangkan kelompok pertemanan dan konteks sosial yang membuat jumlah pemain awal untuk game multipemain mudah terpenuhi, hal yang tidak dilakukan portal. Jika game Anda adalah game pemain tunggal, portal merupakan tempat pertama yang lebih baik. Jika game tersebut menjadi jauh lebih seru saat dimainkan bersama tiga teman dalam panggilan, Discord sepadan dengan integrasi teknis tambahannya. Kabar baiknya, karena semua platform ini menjalankan versi web, satu game dapat diterbitkan di mana saja. Rilis terlebih dahulu sebagai game web, lalu sesuaikan untuk setiap platform.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bisakah-saya-menerbitkan-game-apa-pun-di-discord" tabindex="-1">Bisakah saya menerbitkan game apa pun di Discord? <a class="header-anchor" href="#bisakah-saya-menerbitkan-game-apa-pun-di-discord" aria-label="Permalink to &quot;Bisakah saya menerbitkan game apa pun di Discord?&quot;"></a></h3>
<p>Bisa, asalkan game tersebut berjalan di browser. Discord Activity adalah aplikasi web yang dimuat dalam iframe, jadi HTML5, WebGL, Unity WebGL, dan ekspor web Godot semuanya memenuhi syarat, sedangkan game khusus native yang tidak dapat dikompilasi untuk web tidak memenuhi syarat. Anda membuatnya dengan Embedded App SDK, meng-host versi web sendiri di URL publik, lalu mendaftarkannya sebagai Activity di Discord Developer Portal. Jika game Anda sudah dapat dimainkan di browser, sebagian besar pekerjaan sudah selesai.</p>
<h3 id="apakah-menerbitkan-discord-activity-itu-gratis" tabindex="-1">Apakah menerbitkan Discord Activity itu gratis? <a class="header-anchor" href="#apakah-menerbitkan-discord-activity-itu-gratis" aria-label="Permalink to &quot;Apakah menerbitkan Discord Activity itu gratis?&quot;"></a></h3>
<p>Membuat aplikasi dan mengaktifkan Activities di Developer Portal tidak dikenai biaya. Yang perlu Anda bayar adalah hosting sendiri untuk versi web dan server game apa pun yang Anda jalankan untuk multipemain, karena Discord hanya memproksikan situs Anda, bukan meng-host-nya. Jika Anda menjual pembelian dalam aplikasi, Discord mengambil biaya platform sebesar 15% dari penjualan pertama Anda hingga $1 juta dan 30% setelahnya, ditambah biaya pemrosesan pembayaran. Namun, tidak ada biaya di muka atau biaya pencantuman untuk menerbitkannya.</p>
<h3 id="bagaimana-pemain-menemukan-discord-activity-saya" tabindex="-1">Bagaimana pemain menemukan Discord Activity saya? <a class="header-anchor" href="#bagaimana-pemain-menemukan-discord-activity-saya" aria-label="Permalink to &quot;Bagaimana pemain menemukan Discord Activity saya?&quot;"></a></h3>
<p>Terutama melalui teman. Discord tidak memiliki etalase global untuk &quot;menjelajahi semua Activity&quot;, jadi penemuan bergantung pada tautan yang dibagikan di kanal, seseorang yang meluncurkannya dalam panggilan suara, serta—setelah aplikasi Anda diverifikasi—profil App Directory dan App Launcher dalam klien. Activity yang tumbuh besar berhasil dengan menyebar di dalam kelompok pertemanan yang sudah ada, bukan karena ditemukan dalam katalog. Rencanakan pertumbuhan dari mulut ke mulut dan rancang menit pertama bersama teman sebagai daya tarik utamanya.</p>
<h3 id="apakah-saya-memerlukan-fitur-multipemain-untuk-menerbitkan-activity" tabindex="-1">Apakah saya memerlukan fitur multipemain untuk menerbitkan Activity? <a class="header-anchor" href="#apakah-saya-memerlukan-fitur-multipemain-untuk-menerbitkan-activity" aria-label="Permalink to &quot;Apakah saya memerlukan fitur multipemain untuk menerbitkan Activity?&quot;"></a></h3>
<p>Tidak, tetapi fitur itulah yang membuat platform ini menarik. Activity bisa berupa game pemain tunggal, tetapi keunggulan Discord adalah menempatkan game Anda ke dalam kanal suara tempat teman-teman sudah berkumpul, dan SDK langsung memberikan daftar pesertanya kepada Anda. Activity yang paling sukses bersifat sosial dan dapat dimainkan secara multipemain dengan seketika. Game pemain tunggal biasanya akan lebih berhasil di portal web yang mendatangkan trafik dari pengguna yang sedang menjelajah.</p>
<h3 id="bagaimana-perbandingan-monetisasi-discord-activity-dengan-portal" tabindex="-1">Bagaimana perbandingan monetisasi Discord Activity dengan portal? <a class="header-anchor" href="#bagaimana-perbandingan-monetisasi-discord-activity-dengan-portal" aria-label="Permalink to &quot;Bagaimana perbandingan monetisasi Discord Activity dengan portal?&quot;"></a></h3>
<p>Discord memungkinkan Anda menjual pembelian dalam aplikasi bawaan (langganan dan item sekali beli) tanpa mengarahkan pemain ke proses pembayaran eksternal. Anda menerima 85% pendapatan hingga penjualan mencapai $1 juta, lalu 70% setelahnya, sebelum dipotong biaya pemrosesan. Portal web lebih sering membayar bagian pendapatan iklan berdasarkan jumlah permainan, atau mengizinkan Anda menjalankan IAP sendiri. Model Discord menguntungkan game dengan pemain setia yang membeli kosmetik atau konten yang dapat dibuka, sedangkan portal menguntungkan game yang menghasilkan volume permainan kasual yang tinggi.</p>
<h3 id="apa-saja-kendala-teknis-saat-menerbitkan-ke-discord" tabindex="-1">Apa saja kendala teknis saat menerbitkan ke Discord? <a class="header-anchor" href="#apa-saja-kendala-teknis-saat-menerbitkan-ke-discord" aria-label="Permalink to &quot;Apa saja kendala teknis saat menerbitkan ke Discord?&quot;"></a></h3>
<p>Dua kendala terbesar adalah proksi dan CSP. Setiap permintaan jaringan dari Activity Anda diarahkan melalui <code>discordsays.com</code>, dan domain eksternal apa pun yang belum Anda deklarasikan sebagai pemetaan URL akan diblokir. Masalah ini paling sering terjadi ketika sebuah dependensi diam-diam memanggil API-nya sendiri. Anda dapat memperbaikinya dengan memetakan domain tersebut atau memodifikasi permintaannya menggunakan SDK. Selain itu, jaga agar pemuatan awal tetap ringan karena game berjalan di dalam jendela obrolan, dan rancang untuk kontrol sentuh karena Activity juga berjalan di perangkat seluler.</p>
<BuildCta
  title="Discord Activities menjalankan game web"
  desc="Buat game browser 3D yang dapat dimainkan dari satu kalimat, lalu adaptasikan menjadi sebuah Activity."
  prompt="Buat game pesta cepat tempat hingga empat teman bertanding dalam ronde-ronde singkat" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/multiplayer-browser-game.html">Cara Membuat Game Browser Multipemain</a> — netcode yang dibutuhkan Activity Anda di balik SDK</li>
<li><a href="/id/guides/publish-web-game.html">Cara Menerbitkan Game Web</a> — rilis versi web yang akan menjadi Activity Anda</li>
<li><a href="/id/guides/publish-game-poki.html">Cara Menerbitkan Game di Poki</a> — portal yang mendatangkan trafik penjelajahan yang tidak disediakan Discord</li>
<li><a href="/id/guides/publish-game-crazygames.html">Cara Menerbitkan Game di CrazyGames</a> — portal web lain untuk menjangkau audiens luas</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web</a> — perbandingan IAP dan pendapatan iklan di Discord dengan portal</li>
<li><a href="/id/guides/co-op-game-design.html">Desain Game Co-op</a> — merancang daya tarik sosial yang membuat Activity menyebar</li>
<li><a href="/id/tutorials/iframe-embedding-games.html">Menyematkan game dengan iframe</a> — dasar teknis cara Discord membingkai game Anda</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/publish-game-discord-activities-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Memasukkan Game Anda ke Poki (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/publish-game-poki</link>
            <guid>https://app.cinevva.com/id/guides/publish-game-poki</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Poki hanya menerima melalui undangan dan didanai iklan. Berikut cara mengirimkan game web Anda, lolos Web Fit Test, memenuhi persyaratan teknis, dan memahami pembagian pendapatan.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-memasukkan-game-anda-ke-poki-2026" tabindex="-1">Cara Memasukkan Game Anda ke Poki (2026) <a class="header-anchor" href="#cara-memasukkan-game-anda-ke-poki-2026" aria-label="Permalink to &quot;Cara Memasukkan Game Anda ke Poki (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Untuk memasukkan game Anda ke Poki, kirimkan game tersebut melalui portal <a href="https://developers.poki.com/" target="_blank" rel="noreferrer">Poki for Developers</a>, tempat tim manusia meninjau setiap game dan memutuskan apakah game itu cocok untuk platform. Tidak ada tombol unggah terbuka ataupun opsi &quot;terbitkan sekarang&quot;. Anda membuat akun developer, mengunggah build HTML5 yang memenuhi persyaratan teknis Poki (unduhan awal di bawah 8 MB, kanvas 16:9 yang dapat menyesuaikan ukurannya untuk desktop dan perangkat seluler, serta Poki SDK yang terintegrasi dengan benar), lalu game Anda melewati rangkaian pengujian bertahap: Player Fit Test, Web Fit Test, dan peninjauan akhir sebelum dirilis secara global.</p>
<p>Poki adalah platform game web terkurasi, bukan etalase, jadi proses untuk diterima lebih mirip menawarkan game kepada penerbit daripada mengunggahnya ke itch.io. Keuntungannya, Poki menangani distribusi untuk Anda. Platform ini menyambut <a href="https://markets.financialcontent.com/stocks/article/accwirecq-2026-3-20-poki-announces-milestone-of-625-million-players-without-raising-external-funding" target="_blank" rel="noreferrer">625 juta pemain pada 2025</a> dan memiliki <a href="https://www.superjumpmagazine.com/what-pokis-100-million-monthly-gamers-reveal-about-the-future-of-browser-games/" target="_blank" rel="noreferrer">lebih dari 100 juta pemain bulanan</a>, semuanya dijangkau oleh tim beranggotakan 65 orang yang tidak pernah menerima investasi eksternal. Anda membawa game web bagus yang mampu mempertahankan pemain selama tiga menit pertama, dan Poki menampilkannya kepada audiens sebesar jaringan konsol. Panduan ini membahas cara kerja pengiriman game yang sebenarnya, standar teknis yang harus dipenuhi, cara Anda dibayar, dan alasan game ditolak.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Poki</th>
</tr>
</thead>
<tbody>
<tr>
<td>Model pengiriman</td>
<td>Terkurasi, bergaya undangan. Setiap game ditinjau manusia. Tidak ada unggahan terbuka</td>
</tr>
<tr>
<td>Biaya pengiriman</td>
<td>Gratis</td>
</tr>
<tr>
<td>Model pendapatan</td>
<td>Pembagian pendapatan berbasis iklan. <a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">100% pendapatan dari trafik yang Anda bawa, 50/50 dari trafik yang dibawa Poki</a></td>
</tr>
<tr>
<td>Metode pembayaran</td>
<td>Transfer bank atau PayPal, dalam mata uang pilihan Anda</td>
</tr>
<tr>
<td>Teknis</td>
<td>HTML5. Unduhan awal <a href="https://sdk.poki.com/new-requirements" target="_blank" rel="noreferrer">di bawah 8 MB</a>, kanvas 16:9, wajib menggunakan Poki SDK</td>
</tr>
<tr>
<td>Rangkaian peninjauan</td>
<td>Player Fit Test, lalu Web Fit Test (<a href="https://sdk.poki.com/web-fit-test" target="_blank" rel="noreferrer">sekitar 3–5 hari</a>), kemudian peninjauan akhir</td>
</tr>
<tr>
<td>Waktu hingga rilis global</td>
<td>Sekitar 2–3 minggu <a href="https://sdk.poki.com/releaseprocess" target="_blank" rel="noreferrer">rilis terbatas</a> setelah Anda lolos pengujian</td>
</tr>
</tbody>
</table>
<h2 id="apa-itu-poki-dan-mengapa-upayanya-sepadan" tabindex="-1">Apa itu Poki dan mengapa upayanya sepadan <a class="header-anchor" href="#apa-itu-poki-dan-mengapa-upayanya-sepadan" aria-label="Permalink to &quot;Apa itu Poki dan mengapa upayanya sepadan&quot;"></a></h2>
<p>Poki adalah nama terbesar dalam dunia game web. Platform ini berjalan sepenuhnya di browser, tanpa unduhan dan tanpa toko aplikasi, serta berfokus pada game kasual yang dimainkan orang dalam sesi singkat. Skalanya menjadi alasan utama untuk memperhatikannya. Poki mengumumkan bahwa platform ini mencapai <a href="https://markets.financialcontent.com/stocks/article/accwirecq-2026-3-20-poki-announces-milestone-of-625-million-players-without-raising-external-funding" target="_blank" rel="noreferrer">625 juta pemain pada 2025</a> dan memiliki <a href="https://www.superjumpmagazine.com/what-pokis-100-million-monthly-gamers-reveal-about-the-future-of-browser-games/" target="_blank" rel="noreferrer">lebih dari 100 juta pemain bulanan</a>, sehingga layak disejajarkan dengan PlayStation Network. Game yang sukses di sana meraih angka besar: Subway Surfers telah melampaui satu miliar permainan di platform tersebut, sementara judul seperti Stickman Hook (lebih dari 500 juta permainan) dan Monkey Mart (sekitar 300 juta) menunjukkan seperti apa game web populer, menurut <a href="https://www.gamedeveloper.com/business/the-huge-hidden-web-game-market-no-one-talks-about-and-how-to-get-in-" target="_blank" rel="noreferrer">Game Developer</a>.</p>
<p>Konsekuensinya adalah kendali. Di itch.io, Anda menerbitkan dan memasarkan sendiri. Di Poki, timnya mengkurasi katalog dan menangani distribusi, sehingga Anda menukar kemandirian dengan jangkauan. Model tersebut hanya berjalan jika game Anda memenuhi standar mereka, dan itulah yang dibahas dalam bagian selanjutnya dari panduan ini.</p>
<h2 id="proses-pengiriman-langkah-demi-langkah" tabindex="-1">Proses pengiriman, langkah demi langkah <a class="header-anchor" href="#proses-pengiriman-langkah-demi-langkah" aria-label="Permalink to &quot;Proses pengiriman, langkah demi langkah&quot;"></a></h2>
<p>Anda memulai dari <a href="https://developers.poki.com/" target="_blank" rel="noreferrer">Poki for Developers</a>, portal tempat informasi tim dan game Anda dikelola. Anda membuat akun dan mengirimkan game melalui formulir. Poki menggambarkan platformnya sebagai platform yang dikurasi secara manual: tim memeriksa setiap kiriman dan memutuskan apakah game tersebut cocok, jadi jawaban &quot;tidak&quot; atau tidak adanya respons merupakan hasil yang wajar, bukan kesalahan sistem.</p>
<p>Jika Poki ingin melanjutkan prosesnya, game Anda akan melewati rangkaian tahapan yang didokumentasikan di <a href="https://sdk.poki.com/what-is-p4d" target="_blank" rel="noreferrer">situs Poki for Developers</a>: Anda menambahkan game, mengumpulkan masukan awal dari pemain, lalu menjalani Player Fit Test, Web Fit Test, dan peninjauan akhir Poki. Setiap tahap dibuat untuk menjawab satu pertanyaan menggunakan pemain sungguhan sebelum Poki mengalokasikan trafiknya kepada Anda: apakah orang benar-benar terus bermain?</p>
<p>Player Fit Test adalah rintangan nyata pertama. Seorang developer yang mendokumentasikan perjalanannya menuju penerbitan menjelaskan bahwa standarnya adalah <a href="https://kuyimobile.substack.com/p/my-game-production-process-and-how" target="_blank" rel="noreferrer">125 dari 500 pemain (25%) bermain selama setidaknya 3 menit</a>. Jika cukup banyak pemain bertahan, Anda melanjutkan ke Web Fit Test, yang menguji game kepada kelompok pemain yang lebih besar selama <a href="https://sdk.poki.com/web-fit-test" target="_blank" rel="noreferrer">sekitar 3 hingga 5 hari menurut dokumentasi Poki</a> (beberapa developer melaporkan durasi yang mendekati satu minggu). Jika berhasil melewatinya, Poki akan menghubungi Anda untuk melanjutkan menuju perilisan.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 380" role="img" aria-label="Rangkaian pengiriman Poki: kirim melalui portal developer, lalu Player Fit Test yang mewajibkan 125 dari 500 penguji (25 persen) bermain selama 3 menit atau lebih, kemudian Web Fit Test selama 3 hingga 5 hari, lalu rilis terbatas selama 2 hingga 3 minggu dengan target setidaknya satu iklan per pengguna aktif harian, kemudian rilis global dengan promosi unggulan selama sekitar 2 minggu" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="380" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Rangkaian pengiriman Poki</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Setiap tahap adalah rintangan. Pemain sungguhan menentukan hasil sebelum Poki mengalokasikan trafiknya.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <g transform="translate(80,92)">
      <rect width="600" height="42" rx="9" fill="#7dd3fc"/>
      <text x="18" y="19" font-size="14" font-weight="800" fill="#0b1020">1 · Kirim melalui portal developer</text>
      <text x="18" y="35" font-size="11.5" fill="#0b1020" fill-opacity="0.72">Buat akun, unggah build HTML5. Ditinjau manusia, tanpa unggahan terbuka.</text>
    </g>
    <g transform="translate(80,148)">
      <rect width="500" height="42" rx="9" fill="#c8a8ff"/>
      <text x="18" y="19" font-size="14" font-weight="800" fill="#0b1020">2 · Player Fit Test</text>
      <text x="18" y="35" font-size="11.5" fill="#0b1020" fill-opacity="0.72">125 dari 500 penguji (25%) harus bermain selama 3+ menit.</text>
    </g>
    <g transform="translate(80,204)">
      <rect width="410" height="42" rx="9" fill="#a9b4ff"/>
      <text x="18" y="19" font-size="14" font-weight="800" fill="#0b1020">3 · Web Fit Test</text>
      <text x="18" y="35" font-size="11.5" fill="#0b1020" fill-opacity="0.72">Kelompok pemain lebih besar, berlangsung 3–5 hari.</text>
    </g>
    <g transform="translate(80,260)">
      <rect width="340" height="42" rx="9" fill="#f0abfc"/>
      <text x="18" y="19" font-size="14" font-weight="800" fill="#0b1020">4 · Rilis terbatas</text>
      <text x="18" y="35" font-size="11.5" fill="#0b1020" fill-opacity="0.72">2–3 minggu. Targetkan ≥1 iklan per DAU.</text>
    </g>
    <g transform="translate(80,316)">
      <rect width="300" height="42" rx="9" fill="#6ee7b7"/>
      <text x="18" y="19" font-size="14" font-weight="800" fill="#0b1020">5 · Rilis global</text>
      <text x="18" y="35" font-size="11.5" fill="#0b1020" fill-opacity="0.72">Promosi unggulan selama ~2 minggu.</text>
    </g>
  </g>
</svg>
<h2 id="rilis-terbatas-dan-peluncuran-global" tabindex="-1">Rilis terbatas dan peluncuran global <a class="header-anchor" href="#rilis-terbatas-dan-peluncuran-global" aria-label="Permalink to &quot;Rilis terbatas dan peluncuran global&quot;"></a></h2>
<p>Lolos uji kecocokan tidak langsung menempatkan game Anda di halaman utama. Poki terlebih dahulu menjalankan rilis terbatas. Menurut <a href="https://sdk.poki.com/releaseprocess" target="_blank" rel="noreferrer">dokumentasi proses perilisan</a>, penjadwalan rilis terbatas biasanya memerlukan satu hingga dua minggu, lalu berlangsung selama sekitar dua hingga tiga minggu. Selama periode tersebut, game Anda muncul di halaman kategori yang relevan, tetapi tidak di halaman utama. Anda juga memantau serangkaian metrik tertentu di dasbor: konversi menjadi permainan, interaksi, galat, dan monetisasi. Untuk monetisasi, Poki menyarankan target setidaknya satu iklan per pengguna aktif harian, dengan perpaduan yang sehat antara video midroll dan video berhadiah.</p>
<p>Rilis terbatas adalah tahap untuk melakukan perbaikan. Anda dapat mengirim versi baru dan menjalankan pengujian A/B saat game tersedia bagi audiens yang lebih kecil, sambil menyempurnakan retensi dan ritme iklan sebelum promosi besar. Setelah metrik rilis terbatas Anda kuat, game berlanjut ke rilis global. Sistem promosi Poki kemudian menampilkannya di halaman utama yang dilokalkan, halaman kategori, dan halaman game, dengan promosi besar selama sekitar dua minggu menurut dokumentasinya, ditambah ikon api &quot;baru&quot;.</p>
<h2 id="persyaratan-teknis-yang-harus-anda-penuhi" tabindex="-1">Persyaratan teknis yang harus Anda penuhi <a class="header-anchor" href="#persyaratan-teknis-yang-harus-anda-penuhi" aria-label="Permalink to &quot;Persyaratan teknis yang harus Anda penuhi&quot;"></a></h2>
<p><a href="https://sdk.poki.com/new-requirements" target="_blank" rel="noreferrer">Halaman persyaratan</a> Poki sangat spesifik, dan kegagalan memenuhi ketentuan ini dapat membuat game Anda cepat ditolak. Angka utamanya adalah ukuran: targetkan unduhan awal di bawah 8 MB. Pemain web tidak akan menunggu pemuatan yang berat, dan inilah satu-satunya batasan yang paling sering gagal dipenuhi oleh port konsol atau perangkat seluler.</p>
<p>Game Anda harus sesuai dengan kanvas 16:9 dan dapat menyesuaikan ukurannya dengan baik di berbagai perangkat. Poki mencantumkan dimensi proporsional 640x360, 836x470, atau 1031x580, dan game Anda harus memenuhi seluruh kanvas di desktop, perangkat seluler, dan tablet. Di ponsel, game harus memenuhi layar dalam orientasi potret, lanskap, atau keduanya. Tablet harus menggunakan skema kontrol perangkat seluler, bukan kontrol desktop.</p>
<p>Anda harus mengintegrasikan Poki SDK dengan benar, dan event SDK bukan sekadar tambahan opsional. <code>gameplayStart()</code> dipicu saat pemain memberikan input pertama, bukan saat pemuatan, sedangkan <code>gameplayStop()</code> dipicu ketika terjadi gangguan apa pun, seperti jeda, menu, atau berakhirnya level. Event ini tidak boleh dipicu berturut-turut, dan event iklan tidak boleh dipicu selama video midroll atau video berhadiah. Poki menggunakan sinyal-sinyal ini untuk menempatkan iklan dan mengukur uji kecocokan, sehingga penerapan yang salah akan merusak keduanya.</p>
<p>Ada beberapa persyaratan lain yang sering menjegal developer. Poki <a href="https://sdk.poki.com/new-requirements" target="_blank" rel="noreferrer">memblokir semua permintaan eksternal secara default</a>, jadi Anda harus membundel semuanya: tanpa Google Fonts, tanpa CDN aset, dan tanpa library kode eksternal yang dimuat saat runtime. Hanya sistem iklan milik Poki yang diizinkan, jadi hapus SDK iklan atau pelacakan lainnya (pelacak eksternal harus mendapat persetujuan Poki terlebih dahulu). Game Anda harus berfungsi dalam mode samaran, yang berarti akses <code>localStorage</code> perlu dibungkus dengan try/catch agar pemanggilan penyimpanan yang diblokir tidak membuat game mengalami crash. Untuk rilis global, Anda juga memerlukan thumbnail statis dan animasi. Sebelum mengirimkan game, hapus semua kode debug, alat pengembangan, dan artefak pengujian.</p>
<p>Dalam hal engine, Poki tidak mempermasalahkan cara Anda membuat game selama hasil ekspornya berupa HTML5 yang bersih. <a href="https://sdk.poki.com/faq" target="_blank" rel="noreferrer">FAQ</a> mencantumkan dukungan SDK untuk HTML5, Defold, Unity, GameMaker, Phaser 3, Godot, Cocos, Construct 3, dan GDevelop, serta tersedia alat untuk mengonversi game Flash lama menjadi HTML5. Unity dapat digunakan, tetapi paling sulit disesuaikan dengan batas 8 MB: Anda perlu mengikuti panduan pengoptimalan Poki dan mengekspor build WASM agar berpeluang memenuhi batas ukuran tersebut.</p>
<p>Jika Anda membuat game dengan Cinevva, sebagian besar bagian ini sudah ditangani untuk Anda. Cinevva mengekspor build HTML5 mandiri dengan aset yang telah dibundel, sesuai dengan format yang diinginkan Poki. Dengan demikian, fokus pekerjaan beralih dari upaya memangkas ukuran engine berat menjadi menghubungkan event SDK dan menyempurnakan retensi.</p>
<h2 id="cara-developer-dibayar" tabindex="-1">Cara developer dibayar <a class="header-anchor" href="#cara-developer-dibayar" aria-label="Permalink to &quot;Cara developer dibayar&quot;"></a></h2>
<p>Model Poki <a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">sepenuhnya berbasis iklan</a>, yang berarti Anda tidak perlu menangani integrasi pembayaran atau pembelian dalam aplikasi. Anda memperoleh bagian dari pendapatan iklan, dan pembagiannya bergantung pada asal pemain. Jika pemain membuka game Anda secara langsung, melalui bookmark, mesin pencari, media sosial, atau komunitas Anda sendiri, Anda menerima 100% pendapatan dari pemain tersebut. Jika pemain membuka game Anda melalui Poki.com atau upaya pemasaran Poki, Poki membagi pendapatannya 50/50 dengan Anda. Struktur ini secara tidak langsung memberikan imbalan bagi developer yang membawa audiens sendiri: trafik yang Anda datangkan bernilai dua kali lebih besar bagi Anda dibandingkan trafik yang didatangkan Poki.</p>
<p>Poki membayar melalui transfer bank atau PayPal, dan Anda dapat menetapkan informasi penagihan serta mata uang pilihan di portal developer. Selain pembagian pendapatan langsung, Poki juga menawarkan kesepakatan lisensi, dengan membayar sebagian developer di muka atau secara berkelanjutan agar suatu game tetap eksklusif atau terutama tersedia di platform tersebut. Ketentuan kesepakatan ini tidak distandarkan secara publik dan cenderung disediakan bagi game yang ingin dipromosikan Poki secara besar-besaran.</p>
<p>Tetapkan ekspektasi berdasarkan angka nyata. Untuk game web pertama, kisaran yang realistis adalah <a href="https://indiegamebusiness.com/web-gaming-for-indie-developers/" target="_blank" rel="noreferrer">sekitar $500 hingga $3.000 per bulan</a>, dan pendapatan sangat bergantung pada genre, seberapa sering Anda memperbaruinya, serta berapa lama game tersebut telah tersedia. Angka itu memang jauh lebih rendah daripada pendapatan singkat sebuah game populer di Steam, tetapi pendapatan web lebih stabil dan terakumulasi: durasi sesi mendorong pendapatan iklan, sehingga game dengan nilai replay tinggi terus menghasilkan pendapatan lama setelah diluncurkan. Selain itu, kebanyakan developer yang sukses di web mencapainya melalui beberapa game, bukan hanya satu.</p>
<h2 id="poki-dibandingkan-platform-web-lainnya" tabindex="-1">Poki dibandingkan platform web lainnya <a class="header-anchor" href="#poki-dibandingkan-platform-web-lainnya" aria-label="Permalink to &quot;Poki dibandingkan platform web lainnya&quot;"></a></h2>
<p>Poki bukan satu-satunya tempat untuk menerbitkan game browser, dan pilihan yang tepat bergantung pada seberapa besar Anda menghargai jangkauan dibandingkan kendali.</p>
<table tabindex="0">
<thead>
<tr>
<th>Platform</th>
<th>Cara bergabung</th>
<th>Model pendapatan</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td>Poki</td>
<td>Dikurasi, ditinjau manusia, berbasis undangan</td>
<td>Bagi hasil iklan: <a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">100% trafik langsung, 50/50 trafik Poki</a></td>
<td>Game kasual yang mengejar audiens web terbesar</td>
</tr>
<tr>
<td>CrazyGames</td>
<td>Dikurasi, ditinjau sebelum ditayangkan</td>
<td>Bagi hasil pendapatan iklan</td>
<td>Game web kasual dan mid-core, dengan jangkauan serupa Poki</td>
</tr>
<tr>
<td>itch.io</td>
<td>Terbuka, tanpa seleksi</td>
<td>Anda menentukan bagi hasilnya (<a href="https://itch.io/docs/creators/pricing" target="_blank" rel="noreferrer">default ~10%</a>, bayar sesuka hati, atau harga tetap)</td>
<td>Game indie, eksperimental, dan game jam yang ingin Anda kendalikan sepenuhnya</td>
</tr>
<tr>
<td>Newgrounds</td>
<td>Pengajuan komunitas terbuka</td>
<td>Bagi hasil pendapatan iklan ditambah tip dari pendukung</td>
<td>Game pendek kreatif berbasis komunitas dengan audiens bawaan</td>
</tr>
</tbody>
</table>
<p>Cara paling sederhana untuk memahaminya: Poki dan CrazyGames bersifat terkurasi, didanai iklan, dan sangat besar, sehingga Anda menukar kemandirian dengan distribusi. itch.io dan Newgrounds bersifat terbuka, jadi siapa pun dapat menerbitkan game, tetapi Anda harus melakukan pemasaran sendiri. Banyak developer web mengajukan game ke Poki dan CrazyGames demi jangkauan, sambil mempertahankan halaman itch.io yang sepenuhnya mereka kendalikan. Untuk panduan lengkap itch.io, baca <a href="/id/guides/itch-io-launch-guide.html">panduan peluncuran itch.io</a>.</p>
<h2 id="game-seperti-apa-yang-benar-benar-sukses-di-poki" tabindex="-1">Game seperti apa yang benar-benar sukses di Poki <a class="header-anchor" href="#game-seperti-apa-yang-benar-benar-sukses-di-poki" aria-label="Permalink to &quot;Game seperti apa yang benar-benar sukses di Poki&quot;"></a></h2>
<p>Poki mengutamakan game kasual. Game yang berkembang pesat biasanya mudah dipahami, dapat dimainkan dalam sesi singkat, ramah perangkat seluler, dan memiliki nilai replay tinggi. Poin terakhir lebih penting daripada yang terlihat: karena Anda memperoleh penghasilan dari tayangan iklan selama waktu bermain, game yang membuat pemain kembali akan menghasilkan jauh lebih banyak daripada pengalaman sekali tamat dengan puncak audiens yang sama. Loop arkade sederhana, game multipemain bergaya <code>.io</code>, game berdandan dan kustomisasi, serta game aksi dengan sesi singkat, semuanya sesuai dengan pola ini. Audiensnya juga cenderung lebih muda dan lebih sering bermain di perangkat seluler dibandingkan audiens Steam pada umumnya, sehingga kontrol satu jempol dan mulai ulang instan lebih unggul daripada desain mendalam yang menuntut komitmen besar.</p>
<h2 id="alasan-penolakan-yang-umum" tabindex="-1">Alasan penolakan yang umum <a class="header-anchor" href="#alasan-penolakan-yang-umum" aria-label="Permalink to &quot;Alasan penolakan yang umum&quot;"></a></h2>
<p>Sebagian besar penolakan disebabkan oleh retensi dan tingkat polesan, bukan selera. Alasan terbesar adalah <a href="https://indiegamebusiness.com/web-gaming-for-indie-developers/" target="_blank" rel="noreferrer">retensi pemain yang lemah dalam tiga menit pertama</a>, dan itulah tepatnya yang diukur oleh Player Fit Test. Jadi, jika bagian pembuka game Anda lambat atau membingungkan, game akan gagal melewati tahap seleksi bahkan sebelum dinilai manusia. Alasan berikutnya: build yang melampaui <a href="https://sdk.poki.com/new-requirements" target="_blank" rel="noreferrer">unduhan awal 8 MB</a>, kompatibilitas seluler yang buruk, game yang membutuhkan kontrol rumit atau komitmen waktu panjang, serta apa pun yang terasa belum selesai atau kurang dipoles. Masalah IP juga dapat menyebabkan penolakan karena Poki meninjau game dari segi kecocokan teknis sekaligus hak kekayaan intelektual. Perbaiki retensi dan ukuran terlebih dahulu karena keduanya paling sering menggagalkan pengajuan sebelum faktor lain dipertimbangkan.</p>
<BuildCta
  title="Buat sesuatu yang bisa Anda tawarkan kepada Poki"
  desc="Cinevva mengubah satu kalimat menjadi game web HTML5 siap dimainkan yang dapat Anda ekspor, integrasikan dengan SDK Poki, lalu ajukan."
  prompt="Buat game arkade satu jempol dengan loop 10 detik dan mulai ulang instan" />
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bagaimana-cara-mengajukan-game-saya-ke-poki" tabindex="-1">Bagaimana cara mengajukan game saya ke Poki? <a class="header-anchor" href="#bagaimana-cara-mengajukan-game-saya-ke-poki" aria-label="Permalink to &quot;Bagaimana cara mengajukan game saya ke Poki?&quot;"></a></h3>
<p>Anda mengajukannya melalui <a href="https://developers.poki.com/" target="_blank" rel="noreferrer">portal Poki for Developers</a> dengan membuat akun developer dan mengirimkan game melalui formulir pengajuan. Poki dikurasi secara manual, jadi tim yang nyata meninjau setiap pengajuan dan memutuskan apakah game tersebut cocok sebelum ditayangkan. Jika mereka tertarik, game Anda akan melewati rangkaian pengujian (Player Fit Test, kemudian Web Fit Test, lalu tinjauan akhir), sehingga pemain sungguhan dapat membuktikan bahwa game tersebut mampu mempertahankan perhatian sebelum Poki mengalokasikan trafiknya. Tidak ada fitur unggah terbuka, jadi anggap proses ini lebih seperti menawarkan game kepada penerbit daripada memasangnya di etalase.</p>
<h3 id="apakah-menerbitkan-game-di-poki-gratis-dan-seberapa-ketat-seleksinya" tabindex="-1">Apakah menerbitkan game di Poki gratis, dan seberapa ketat seleksinya? <a class="header-anchor" href="#apakah-menerbitkan-game-di-poki-gratis-dan-seberapa-ketat-seleksinya" aria-label="Permalink to &quot;Apakah menerbitkan game di Poki gratis, dan seberapa ketat seleksinya?&quot;"></a></h3>
<p>Pengajuan tidak dikenai biaya, tetapi Poki sangat selektif. Timnya meninjau setiap game dan mengujikannya kepada pemain sungguhan dalam beberapa tahap, jadi ini bukan marketplace terbuka tempat semua game dapat diterbitkan. Tolok ukur utamanya adalah retensi: menurut laporan developer yang banyak dikutip, ambang Player Fit Test adalah <a href="https://kuyimobile.substack.com/p/my-game-production-process-and-how" target="_blank" rel="noreferrer">25% penguji bermain setidaknya selama tiga menit</a>. Game yang kurang dipoles, terlalu berat, sulit dikendalikan, atau tidak optimal di perangkat seluler biasanya gagal lolos. Karena itu, polesan dan menit pembuka yang kuat lebih penting daripada ide yang unik.</p>
<h3 id="berapa-banyak-uang-yang-bisa-anda-hasilkan-di-poki" tabindex="-1">Berapa banyak uang yang bisa Anda hasilkan di Poki? <a class="header-anchor" href="#berapa-banyak-uang-yang-bisa-anda-hasilkan-di-poki" aria-label="Permalink to &quot;Berapa banyak uang yang bisa Anda hasilkan di Poki?&quot;"></a></h3>
<p>Poki menggunakan sistem bagi hasil pendapatan iklan, dan kisaran realistis untuk game web pertama adalah <a href="https://indiegamebusiness.com/web-gaming-for-indie-developers/" target="_blank" rel="noreferrer">sekitar $500 hingga $3.000 per bulan</a>, tergantung genre, frekuensi pembaruan, dan berapa lama game tersebut telah ditayangkan. Pembagiannya menguntungkan developer yang mendatangkan audiens sendiri: Anda mendapatkan <a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">100% pendapatan dari trafik yang Anda datangkan dan 50% dari trafik yang didatangkan Poki</a>. Jumlahnya memang lebih kecil daripada peluncuran sukses besar di Steam, tetapi lebih stabil. Karena penghasilan mengikuti durasi sesi, game dengan nilai replay tinggi dapat terus menghasilkan uang lama setelah dirilis.</p>
<h3 id="apa-saja-persyaratan-teknis-poki" tabindex="-1">Apa saja persyaratan teknis Poki? <a class="header-anchor" href="#apa-saja-persyaratan-teknis-poki" aria-label="Permalink to &quot;Apa saja persyaratan teknis Poki?&quot;"></a></h3>
<p>Game Anda harus berbasis HTML5 dengan <a href="https://sdk.poki.com/new-requirements" target="_blank" rel="noreferrer">unduhan awal di bawah 8 MB</a>, menggunakan kanvas 16:9 yang dapat menyesuaikan ukuran di desktop, perangkat seluler, dan tablet, serta mengintegrasikan SDK Poki dengan event <code>gameplayStart()</code> dan <code>gameplayStop()</code> yang dipicu dengan benar. Poki memblokir permintaan eksternal secara default, jadi sertakan semua font, aset, dan library di dalam build alih-alih memuatnya saat runtime, dan hanya gunakan sistem iklan Poki. Game juga harus berfungsi dalam mode samaran (bungkus <code>localStorage</code> dengan try/catch) serta menyertakan thumbnail statis dan animasi untuk perilisan global.</p>
<h3 id="berapa-lama-waktu-yang-diperlukan-agar-game-ditayangkan-di-poki" tabindex="-1">Berapa lama waktu yang diperlukan agar game ditayangkan di Poki? <a class="header-anchor" href="#berapa-lama-waktu-yang-diperlukan-agar-game-ditayangkan-di-poki" aria-label="Permalink to &quot;Berapa lama waktu yang diperlukan agar game ditayangkan di Poki?&quot;"></a></h3>
<p>Rencanakan dalam hitungan minggu, bukan hari. Setelah Anda lolos Player Fit Test dan Web Fit Test (<a href="https://sdk.poki.com/web-fit-test" target="_blank" rel="noreferrer">Web Fit Test sendiri berlangsung sekitar 3–5 hari</a>), game Anda memasuki perilisan terbatas yang <a href="https://sdk.poki.com/releaseprocess" target="_blank" rel="noreferrer">biasanya membutuhkan satu hingga dua minggu untuk dijadwalkan dan berlangsung selama dua hingga tiga minggu</a>. Game baru akan dirilis secara global dengan dorongan promosi setelah metrik perilisan terbatasnya terlihat kuat. Seluruh proses dari pengajuan hingga peluncuran global unggulan biasanya memerlukan waktu satu bulan atau lebih.</p>
<h3 id="jenis-game-apa-yang-paling-sukses-di-poki" tabindex="-1">Jenis game apa yang paling sukses di Poki? <a class="header-anchor" href="#jenis-game-apa-yang-paling-sukses-di-poki" aria-label="Permalink to &quot;Jenis game apa yang paling sukses di Poki?&quot;"></a></h3>
<p>Game kasual dengan nilai replay tinggi. Audiens Poki bermain dalam sesi singkat dan cenderung menggunakan perangkat seluler, sehingga loop arkade yang mudah dipahami, game bergaya <code>.io</code>, game berdandan dan kustomisasi, serta game aksi dengan sesi singkat adalah pilihan yang paling cocok. Karena Anda memperoleh penghasilan dari tayangan iklan selama waktu bermain, game yang membuat pemain kembali setiap hari akan menghasilkan lebih banyak daripada pengalaman sekali main dengan jumlah audiens yang sama. Kontrol yang rumit, tuntutan waktu yang panjang, dan build berukuran besar justru menjadi penghambat.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-web-game.html">Menerbitkan Game Web: Panduan Lengkap</a> — semua platform dan jalur untuk merilis game browser</li>
<li><a href="/id/guides/publish-game-crazygames.html">Cara Memasukkan Game Anda ke CrazyGames</a> — platform web terkurasi besar lainnya yang sering menjadi tujuan pengajuan bersama Poki</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web</a> — pendapatan iklan, IAP, dan lisensi di berbagai platform web</li>
<li><a href="/id/guides/publish-game-discord-activities.html">Cara Menerbitkan Game di Discord Activities</a> — audiens web bawaan lain yang dapat menjadi tujuan perilisan</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — alternatif terbuka yang sepenuhnya Anda kendalikan</li>
<li><a href="/id/tutorials/ship-web-game-fast.html">Rilis Game Web yang Dimuat dengan Cepat</a> — memenuhi batas 8 MB Poki dan mempercepat pemuatan awal</li>
<li><a href="/id/guides/casual-games-trends-2026.html">Tren Game Kasual pada 2026</a> — gambaran berdasarkan data tentang game yang diinginkan audiens Poki</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/publish-game-poki-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Monetisasi Game Web: Apa yang Sebenarnya Dikatakan Data (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/web-game-monetization</link>
            <guid>https://app.cinevva.com/id/guides/web-game-monetization</guid>
            <pubDate>Fri, 17 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Pendapatan nyata game web pada 2026, mulai dari bagi hasil portal seperti Poki dan itch.io hingga CPM iklan sebenarnya, harga lisensi, dan kisaran penghasilan yang jujur, semuanya disertai sumber.]]></description>
            <content:encoded><![CDATA[<h1 id="monetisasi-game-web-apa-yang-sebenarnya-dikatakan-data-2026" tabindex="-1">Monetisasi Game Web: Apa yang Sebenarnya Dikatakan Data (2026) <a class="header-anchor" href="#monetisasi-game-web-apa-yang-sebenarnya-dikatakan-data-2026" aria-label="Permalink to &quot;Monetisasi Game Web: Apa yang Sebenarnya Dikatakan Data (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Tanyakan &quot;bagaimana game web menghasilkan uang&quot; dan Anda akan mendapat selusin jawaban penuh keyakinan, yang kebanyakan merupakan promosi untuk platform yang dijual oleh penulisnya. Versi yang jujur lebih rumit, tetapi juga lebih berguna. Uang dari game web berasal dari empat sumber (bagi hasil iklan portal, kesepakatan lisensi satu kali, pembelian dalam game, dan penjualan langsung), dengan jumlah mulai dari beberapa euro per tahun hingga tujuh digit bagi segelintir game yang berada di puncak. Kami mengambil ketentuan terbaru langsung dari platform (<a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">Poki</a>, <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">CrazyGames</a>, <a href="https://itch.io/updates/introducing-open-revenue-sharing" target="_blank" rel="noreferrer">itch.io</a>, <a href="https://gamemonetize.com/developers" target="_blank" rel="noreferrer">GameMonetize</a>), tolok ukur iklan 2026, dan perincian penghasilan pengembang sungguhan, lalu membuang setiap angka yang tidak dapat kami temukan sumbernya. Inilah kenyataan sebenarnya.</p>
<p>Versi singkatnya: sebagian besar game web menghasilkan uang dengan membagikannya secara gratis di portal seperti Poki atau CrazyGames dan membagi pendapatan iklan, dengan pengembang menerima sekitar 50% hingga 80% tergantung platform dan sumber trafik, menurut <a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">dokumentasi platform</a>. Jalur kedua adalah melisensikan game HTML5 Anda yang sudah selesai kepada portal dengan biaya tetap, biasanya <a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">$300 hingga $800 untuk lisensi noneksklusif dan $5.000 atau lebih untuk lisensi eksklusif</a>. Jalur ketiga adalah menjual pembelian dalam game atau keseluruhan game secara langsung, dan itch.io memungkinkan Anda menyimpan <a href="https://itch.io/updates/introducing-open-revenue-sharing" target="_blank" rel="noreferrer">90% secara default</a>. Angkanya sangat keras pada median (sebagian besar game berbayar di itch.io menghasilkan <a href="https://generalistprogrammer.com/tutorials/how-to-make-money-on-itchio-indie-game-guide" target="_blank" rel="noreferrer">kurang dari $50 per bulan</a>) dan sangat besar di puncak (studio terbaik di Poki meraup <a href="https://app.dealroom.co/news/feed/poki-hits-1b-monthly-plays-as-developer-first-model-boosts-top-studio-revenues-tenfold-1" target="_blank" rel="noreferrer">hingga €1 juta per tahun</a>). Game kasual yang berkinerja baik di portal besar berada di kisaran menengah <a href="https://www.abratabia.com/web-game-monetization/licensing-to-portals.php" target="_blank" rel="noreferrer">$200 hingga $2.000 per bulan</a>.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 350" role="img" aria-label="Bagi hasil pengembang menurut platform game web pada 2026: itch.io 90 persen, Playgama Bridge 80 persen, pembelian dalam game CrazyGames 70 persen, iklan CrazyGames 60 persen, Poki 50 persen, GameMonetize 45 persen" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="350" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Bagian pendapatan yang Anda terima dari setiap platform</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Bagian pendapatan pengembang, pertengahan 2026. Sumber: dokumentasi platform dan ketentuan game jam yang dipublikasikan.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" font-weight="700">
    <text x="205" y="118" text-anchor="end" fill="#e8edf5">itch.io (default)</text>
    <rect x="220" y="102" width="414" height="24" rx="5" fill="#6ee7b7"/>
    <text x="644" y="119" font-size="13" font-weight="800" fill="#6ee7b7">90%</text>
    <text x="205" y="158" text-anchor="end" fill="#e8edf5">Playgama Bridge</text>
    <rect x="220" y="142" width="368" height="24" rx="5" fill="#7dd3fc"/>
    <text x="598" y="159" font-size="13" font-weight="800" fill="#7dd3fc">80%</text>
    <text x="205" y="198" text-anchor="end" fill="#e8edf5">CrazyGames · pembelian</text>
    <rect x="220" y="182" width="322" height="24" rx="5" fill="#7dd3fc"/>
    <text x="552" y="199" font-size="13" font-weight="800" fill="#7dd3fc">70%</text>
    <text x="205" y="238" text-anchor="end" fill="#e8edf5">CrazyGames · iklan</text>
    <rect x="220" y="222" width="276" height="24" rx="5" fill="#a9b4ff"/>
    <text x="506" y="239" font-size="13" font-weight="800" fill="#a9b4ff">60%</text>
    <text x="205" y="278" text-anchor="end" fill="#e8edf5">Poki</text>
    <rect x="220" y="262" width="230" height="24" rx="5" fill="#c8a8ff"/>
    <text x="460" y="279" font-size="13" font-weight="800" fill="#c8a8ff">50%</text>
    <text x="516" y="279" font-size="11.5" font-weight="600" fill="#9aa7b4">100% dari trafik Anda sendiri</text>
    <text x="205" y="318" text-anchor="end" fill="#e8edf5">GameMonetize</text>
    <rect x="220" y="302" width="207" height="24" rx="5" fill="#fb7185"/>
    <text x="437" y="319" font-size="13" font-weight="800" fill="#fb7185">45%</text>
  </g>
</svg>
<h2 id="model-bisnis-default-game-web-adalah-free-to-play-plus-bagi-hasil-iklan" tabindex="-1">Model bisnis default game web adalah free-to-play plus bagi hasil iklan <a class="header-anchor" href="#model-bisnis-default-game-web-adalah-free-to-play-plus-bagi-hasil-iklan" aria-label="Permalink to &quot;Model bisnis default game web adalah free-to-play plus bagi hasil iklan&quot;"></a></h2>
<p>Model dominan di web terbuka sangatlah sederhana. Anda menempatkan game secara gratis di portal, pemain memainkannya di browser, portal menampilkan iklan di sekitar dan di dalam game, lalu Anda membagi pendapatannya. Tidak ada biaya di muka maupun penjagaan ketat dari toko. Portal menangani teknologi iklan, trafik, dan pembayaran, sedangkan Anda memperoleh bagiannya.</p>
<p>Besaran bagian inilah yang membedakan setiap platform. <a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">Poki</a> menerapkan pembagian langsung 50/50, dengan satu perbedaan penting: jika pemain menemukan game Anda melalui Poki.com atau pemasaran Poki sendiri, pendapatan dibagi dua, tetapi jika mereka datang melalui bookmark, pencarian, media sosial, atau komunitas Anda sendiri, Anda menerima 100%. Ini merupakan dorongan yang disengaja agar Anda membawa audiens sendiri. CrazyGames tidak menyatakan pembagian dalam dokumentasi utama untuk pengembangnya, tetapi ketentuan yang dipublikasikannya untuk <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">game jam web GameMaker 2026</a> menyebutkan bahwa pengembang menerima 60% pendapatan iklan dalam game dan 70% pendapatan pembelian dalam game, dengan pembayaran setelah Anda melampaui <a href="https://docs.crazygames.com/faq/" target="_blank" rel="noreferrer">minimum €100</a>. GameMonetize berada di ujung bawah dengan <a href="https://gamemonetize.com/developers" target="_blank" rel="noreferrer">bagian 45%</a>, sedangkan lapisan distribusi yang lebih baru seperti Playgama Bridge menawarkan <a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">80%</a>. Selisihnya nyata, jadi platform yang Anda pilih merupakan keputusan pendapatan, bukan sekadar keputusan distribusi.</p>
<p>Skala adalah alasan pembagian tersebut memiliki nilai. Poki melampaui <a href="https://app.dealroom.co/news/feed/poki-hits-1b-monthly-plays-as-developer-first-model-boosts-top-studio-revenues-tenfold-1" target="_blank" rel="noreferrer">1 miliar sesi bermain per bulan</a> pada 2026 dengan lebih dari 600 studio independen dalam katalognya, sedangkan CrazyGames melaporkan <a href="https://gamesbeat.com/crazygames-hits-35m-users-for-browser-games-and-launches-social-multiplayer-features/" target="_blank" rel="noreferrer">lebih dari 300 juta sesi bermain per bulan</a> dari lebih dari 50 juta pemain bulanan, menurut portal pengembangnya. Agregator bahkan menjangkau lebih luas: <a href="https://gamedistribution.com/developers/partnership/" target="_blank" rel="noreferrer">GameDistribution</a> melakukan sindikasi ke lebih dari 4.000 portal yang menjangkau 350 juta pengguna bulanan. Satu game bagus dapat mengumpulkan angka yang sulit dibayangkan. Dalam ulasan pasar game web yang <a href="https://www.gamedeveloper.com/business/the-huge-hidden-web-game-market-no-one-talks-about-and-how-to-get-in-" target="_blank" rel="noreferrer">dipublikasikan Game Developer</a>, Monkey Mart mencapai 300 juta sesi bermain, Level Devil 83 juta, dan Stickman Hook 574 juta. Semuanya merupakan game yang biaya pembuatannya di bawah $10.000 dan membutuhkan waktu satu hingga tiga bulan untuk dikembangkan.</p>
<h2 id="tarif-iklan-yang-sebenarnya-diperoleh-game-web" tabindex="-1">Tarif iklan yang sebenarnya diperoleh game web <a class="header-anchor" href="#tarif-iklan-yang-sebenarnya-diperoleh-game-web" aria-label="Permalink to &quot;Tarif iklan yang sebenarnya diperoleh game web&quot;"></a></h2>
<p>Bagi hasil hanya berarti jika Anda mengetahui tarif iklan dasarnya. Di sinilah data game web menjadi terbatas karena sebagian besar tolok ukur yang dipublikasikan ditujukan untuk aplikasi seluler. Angka paling jelas yang khusus untuk web berasal dari <a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">perincian monetisasi Playgama 2026</a>: video berhadiah, format dengan bayaran tertinggi, menghasilkan eCPM sekitar $15 hingga $28 di Amerika Serikat, $8 hingga $15 di Uni Eropa, dan hanya $1 hingga $3 di pasar tingkat 3 seperti India dan Brasil. Iklan &quot;intrinsik&quot; dalam game (penempatan merek yang menyatu ke dalam adegan) menghasilkan $2 hingga $6. Itu merupakan tarif kotor sebelum bagi hasil, jadi audiens yang didominasi pengguna AS di Poki memberi Anda separuh dari angka tertinggi tersebut, sedangkan audiens global memberi Anda gabungan yang lebih condong ke ujung bawah.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 300" role="img" aria-label="eCPM video berhadiah web menurut wilayah pada 2026: Amerika Serikat 15 hingga 28 dolar, Uni Eropa 8 hingga 15 dolar, pasar tingkat 3 1 hingga 3 dolar" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="300" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Bayaran video berhadiah di web</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Kisaran eCPM video berhadiah di web sebelum bagi hasil. Sumber: Playgama, 2026.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="12" fill="#5b6472">
    <line x1="180" y1="96" x2="180" y2="248" stroke="#ffffff" stroke-opacity="0.14"/>
    <text x="180" y="268" text-anchor="middle">$0</text>
    <text x="347" y="268" text-anchor="middle">$10</text>
    <text x="513" y="268" text-anchor="middle">$20</text>
    <text x="680" y="268" text-anchor="middle">$30</text>
  </g>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="14" font-weight="700">
    <text x="165" y="126" text-anchor="end" fill="#e8edf5">Amerika Serikat</text>
    <rect x="430" y="110" width="217" height="26" rx="6" fill="#c8a8ff"/>
    <text x="538" y="128" text-anchor="middle" font-size="12.5" font-weight="800" fill="#0b1020">$15–$28</text>
    <text x="165" y="176" text-anchor="end" fill="#e8edf5">Uni Eropa</text>
    <rect x="313" y="160" width="117" height="26" rx="6" fill="#7dd3fc"/>
    <text x="371" y="178" text-anchor="middle" font-size="12.5" font-weight="800" fill="#0b1020">$8–$15</text>
    <text x="165" y="226" text-anchor="end" fill="#e8edf5">Tingkat 3 (IN, BR)</text>
    <rect x="197" y="210" width="34" height="26" rx="6" fill="#fb7185"/>
    <text x="252" y="228" font-size="12.5" font-weight="800" fill="#fb7185">$1–$3</text>
  </g>
</svg>
<p>Tarif yang Anda peroleh juga bergantung pada formatnya, dan dalam hal ini semua sumber sepakat mengenai urutannya. Video berhadiah (penempatan opsional &quot;tonton iklan untuk mendapatkan hadiah&quot;) memberi bayaran tertinggi, sering kali sekitar dua kali lipat iklan interstisial, menurut <a href="https://www.applixir.com/blog/the-complete-guide-to-ecpm-optimization-for-web-games/" target="_blank" rel="noreferrer">panduan game web AppLixir</a>. Iklan interstisial yang diputar pada jeda alami berada di urutan berikutnya, sedangkan banner berada di posisi terbawah dengan bayaran hanya beberapa sen per seribu tayangan di sebagian besar wilayah. Urutan inilah yang membuat CrazyGames dan Poki sama-sama mengutamakan video berhadiah dan video di tengah permainan dalam SDK mereka, serta memperlakukan banner sebagai hal sekunder.</p>
<p>Google juga membuka kembali program iklan web-nya. AdSense for Games versi lama telah menjadi <a href="https://support.google.com/adsense/answer/9959170" target="_blank" rel="noreferrer">H5 Games Ads</a>, produk berbasis pengajuan yang menayangkan iklan interstisial dan berhadiah melalui Ad Placement API. Aksesnya tidak otomatis (persetujuan bergantung pada kelayakan), tetapi program ini memberi pengembang web opsi iklan pihak pertama di luar portal besar. Studi kasus Google sendiri menyebutkan seorang pengembang mengalami peningkatan pendapatan sebesar 20% dan peningkatan eCPM sebesar 50% dalam waktu tiga bulan setelah beralih ke program tersebut.</p>
<h2 id="melisensikan-game-anda-dengan-biaya-tetap" tabindex="-1">Melisensikan game Anda dengan biaya tetap <a class="header-anchor" href="#melisensikan-game-anda-dengan-biaya-tetap" aria-label="Permalink to &quot;Melisensikan game Anda dengan biaya tetap&quot;"></a></h2>
<p>Tidak semua orang ingin bertaruh pada bagi hasil. Model yang lebih lama, yang dirintis oleh situs seperti FGL bertahun-tahun lalu, adalah lisensi: Anda menjual hak untuk menjalankan game HTML5 yang telah selesai kepada portal atau merek dengan biaya satu kali. Pembeli mendapatkan game, Anda dibayar di muka, lalu melanjutkan ke proyek berikutnya. Model ini masih ada melalui lokapasar seperti MarketJS, GameDistribution, dan CodeThisLab.</p>
<p>Harganya sangat bervariasi karena &quot;lisensi&quot; memiliki arti yang berbeda-beda. <a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">Angka Playgama untuk 2026</a> menempatkan lisensi noneksklusif (game yang sama dijual kepada banyak pembeli) di kisaran $300 hingga $800 per platform, sedangkan kesepakatan eksklusif (pembeli memilikinya sepenuhnya dan game ditarik dari katalog) dimulai sekitar $5.000 dan dapat melampaui $25.000 untuk game yang digarap dengan matang. Ulasan independen tentang <a href="https://www.abratabia.com/web-game-monetization/licensing-to-portals.php" target="_blank" rel="noreferrer">lisensi kepada portal</a> berada di kisaran yang sama, dengan biaya tetap mulai dari &quot;beberapa ratus dolar untuk game sederhana hingga $5.000 atau lebih&quot; untuk game berkualitas tinggi. Komprominya sederhana. Lisensi membayar sekarang dan membatasi potensi keuntungan Anda, sedangkan bagi hasil membayar kemudian tanpa batas maksimal.</p>
<h2 id="pembelian-dalam-game-dan-penjualan-langsung-di-web-terbuka" tabindex="-1">Pembelian dalam game dan penjualan langsung di web terbuka <a class="header-anchor" href="#pembelian-dalam-game-dan-penjualan-langsung-di-web-terbuka" aria-label="Permalink to &quot;Pembelian dalam game dan penjualan langsung di web terbuka&quot;"></a></h2>
<p>Menjual item di dalam game browser dulunya merepotkan. Sekarang prosesnya semakin mudah. Di sisi pembelian, CrazyGames menjalankan <a href="https://docs.crazygames.com/resources/ad-monetization-guide/" target="_blank" rel="noreferrer">program pembelian dalam game khusus undangan melalui Xsolla</a> untuk game berkinerja tinggi, dengan membayar pengembang sebesar <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">70% dari pendapatan pembelian</a>. Lapisan distribusi yang lebih baru seperti Playgama Bridge menawarkan dukungan penuh untuk IAP dengan gerbang pembayaran lokal yang sudah terintegrasi. Di luar portal, Anda dapat memasang checkout Stripe atau Xsolla di situs sendiri dan menyimpan hampir seluruh pendapatan setelah dipotong biaya pemrosesan.
Versi paling murni dari konsep “menyimpan uang Anda sendiri” adalah itch.io. Ini adalah etalase, bukan portal iklan, dan model <a href="https://itch.io/updates/introducing-open-revenue-sharing" target="_blank" rel="noreferrer">bagi hasil terbuka</a> memungkinkan Anda menentukan sendiri bagian platform, mulai dari 0% hingga 100%, dengan nilai bawaan 10%. Dari penjualan senilai $10 dengan tarif bawaan, setelah biaya pemrosesan pembayaran sekitar <a href="https://generalistprogrammer.com/tutorials/how-to-make-money-on-itchio-indie-game-guide" target="_blank" rel="noreferrer">2,9% ditambah $0,30</a> dan satu dolar untuk itch.io, Anda memperoleh $8,41. Bandingkan dengan potongan 30% yang diambil Steam, App Store, dan Google Play, dan Anda bisa memahami mengapa itch.io menjadi pilihan utama bagi developer yang ingin menjual build web secara langsung. Newgrounds menjalankan skema serupa yang ramah kreator, dengan membayarkan bagi hasil iklan setelah saldo Anda mencapai <a href="https://newgrounds.fandom.com/wiki/Revenue_Sharing" target="_blank" rel="noreferrer">$50 melalui PayPal atau cek</a>, dan pada 2026 platform ini makin mengandalkan keanggotaan Supporter (menaikkan harganya menjadi <a href="https://newgrounds.wiki.gg/wiki/Supporter_Status" target="_blank" rel="noreferrer">$5 per bulan pada April 2026</a>) untuk mendanai kumpulan pembayaran yang lebih sehat.</p>
<h2 id="perbandingan-lengkap" tabindex="-1">Perbandingan lengkap <a class="header-anchor" href="#perbandingan-lengkap" aria-label="Permalink to &quot;Perbandingan lengkap&quot;"></a></h2>
<p>Berikut semua jalur utama untuk menghasilkan uang dari game web dalam satu tempat. Anggap kolom bagian developer sebagai tarif utama sebelum disesuaikan dengan komposisi dan lokasi geografis traffic Anda.</p>
<table tabindex="0">
<thead>
<tr>
<th>Platform / model</th>
<th>Cara Anda menghasilkan uang</th>
<th>Bagian developer</th>
<th>Ketentuan penting</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">Poki</a></td>
<td>Gratis dimainkan, bagi hasil iklan</td>
<td>50% (100% untuk traffic Anda sendiri)</td>
<td>Tanpa biaya di muka, katalog terkurasi, 1 miliar+ permainan per bulan</td>
</tr>
<tr>
<td><a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">CrazyGames</a></td>
<td>Bagi hasil iklan + IAP khusus undangan</td>
<td>60% iklan, 70% pembelian (berdasarkan ketentuan jam 2026, bukan dokumentasi utama)</td>
<td>Pembayaran minimum €100, IAP Xsolla untuk judul teratas</td>
</tr>
<tr>
<td><a href="https://gamemonetize.com/developers" target="_blank" rel="noreferrer">GameMonetize</a></td>
<td>Bagi hasil iklan melalui SDK</td>
<td>45%</td>
<td>Sindikasi luas, pembayaran bulanan melalui PayPal/USDT</td>
</tr>
<tr>
<td><a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">Playgama Bridge</a></td>
<td>Bagi hasil iklan + IAP</td>
<td>80%</td>
<td>Gateway pembayaran lokal, bagian yang dinyatakan lebih tinggi</td>
</tr>
<tr>
<td><a href="https://gamedistribution.com/developers/partnership/" target="_blank" rel="noreferrer">GameDistribution</a></td>
<td>Bagi hasil iklan tersindikasi</td>
<td>Bervariasi menurut kesepakatan</td>
<td>4.000+ portal, jangkauan 350 juta per bulan</td>
</tr>
<tr>
<td>Lisensi (MarketJS, CodeThisLab)</td>
<td>Biaya tetap satu kali</td>
<td>100% dari biaya</td>
<td><a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">$300–$800 non-eksklusif, $5.000+ eksklusif</a></td>
</tr>
<tr>
<td><a href="https://itch.io/updates/introducing-open-revenue-sharing" target="_blank" rel="noreferrer">itch.io</a></td>
<td>Penjualan langsung, potongan bayar sesuka hati</td>
<td>Hingga 100% (bawaan 10%)</td>
<td>Anda menentukan bagian platform</td>
</tr>
<tr>
<td><a href="https://newgrounds.fandom.com/wiki/Revenue_Sharing" target="_blank" rel="noreferrer">Newgrounds</a></td>
<td>Bagi hasil iklan + kumpulan dana Supporter</td>
<td>Bagian dari kumpulan iklan</td>
<td>Pembayaran minimum $50</td>
</tr>
</tbody>
</table>
<h2 id="ekspektasi-pendapatan-yang-realistis" tabindex="-1">Ekspektasi pendapatan yang realistis <a class="header-anchor" href="#ekspektasi-pendapatan-yang-realistis" aria-label="Permalink to &quot;Ekspektasi pendapatan yang realistis&quot;"></a></h2>
<p>Inilah bagian yang dilewatkan oleh kebanyakan panduan. Distribusi pendapatan game web sangat berat di kelompok teratas, sementara nilai mediannya mendekati nol. Rincian paling jelas berasal dari <a href="https://generalistprogrammer.com/tutorials/how-to-make-money-on-itchio-indie-game-guide" target="_blank" rel="noreferrer">analisis pendapatan itch.io tahun 2026</a> yang membagi game berbayar ke dalam beberapa tingkat: sekitar 80% menghasilkan $0 hingga $50 per bulan, sekitar 15% menghasilkan $50 hingga $500, sekitar 4% mencapai pendapatan paruh waktu sebesar $500 hingga $2.000, kurang dari 1% mencapai pendapatan penuh waktu sebesar $2.000 hingga $10.000, dan kurang dari 0,2% menjadi hit besar dengan pendapatan di atas $10.000. Seperti yang ditegaskan analisis tersebut, kebanyakan game menghasilkan kurang dari $100 sepanjang masa hidupnya.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 320" role="img" aria-label="Persentase game berbayar itch.io berdasarkan pendapatan bulanan pada 2026: 80 persen menghasilkan 0 hingga 50 dolar, 15 persen menghasilkan 50 hingga 500, 4 persen menghasilkan 500 hingga 2000, kurang dari 1 persen menghasilkan 2000 hingga 10000, kurang dari 0,2 persen menghasilkan lebih dari 10000" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="320" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Kebanyakan game hampir tidak menghasilkan apa pun</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Persentase game berbayar itch.io berdasarkan pendapatan bulanan, 2026. Sumber: Generalist Programmer.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" font-weight="700">
    <text x="205" y="118" text-anchor="end" fill="#e8edf5">$0–$50 / bln</text>
    <rect x="220" y="102" width="400" height="24" rx="5" fill="#fb7185"/>
    <text x="628" y="119" font-size="13" font-weight="800" fill="#fb7185">~80%</text>
    <text x="205" y="158" text-anchor="end" fill="#e8edf5">$50–$500</text>
    <rect x="220" y="142" width="75" height="24" rx="5" fill="#a9b4ff"/>
    <text x="303" y="159" font-size="13" font-weight="800" fill="#a9b4ff">~15%</text>
    <text x="205" y="198" text-anchor="end" fill="#e8edf5">$500–$2.000</text>
    <rect x="220" y="182" width="20" height="24" rx="5" fill="#7dd3fc"/>
    <text x="248" y="199" font-size="13" font-weight="800" fill="#7dd3fc">~4%</text>
    <text x="205" y="238" text-anchor="end" fill="#e8edf5">$2.000–$10.000</text>
    <rect x="220" y="222" width="7" height="24" rx="3" fill="#6ee7b7"/>
    <text x="235" y="239" font-size="13" font-weight="800" fill="#6ee7b7">&lt;1%</text>
    <text x="205" y="278" text-anchor="end" fill="#e8edf5">$10.000+</text>
    <rect x="220" y="262" width="5" height="24" rx="2.5" fill="#c8a8ff"/>
    <text x="233" y="279" font-size="13" font-weight="800" fill="#c8a8ff">&lt;0,2%</text>
  </g>
</svg>
<p>Pendapatan portal iklan menunjukkan cerita yang sama dari sudut berbeda. Game kasual yang berkinerja baik di portal besar biasanya menghasilkan <a href="https://www.abratabia.com/web-game-monetization/licensing-to-portals.php" target="_blank" rel="noreferrer">$200 hingga $2.000 per bulan</a> melalui bagi hasil, sementara jajaran teratas katalog Poki mencapai <a href="https://app.dealroom.co/news/feed/poki-hits-1b-monthly-plays-as-developer-first-model-boosts-top-studio-revenues-tenfold-1" target="_blank" rel="noreferrer">hingga €1 juta per tahun</a>, peningkatan sepuluh kali lipat dibandingkan pendapatan studio tersebut sebelum model Poki, menurut Dealroom. Tulisan seorang developer indie pada 2025 menjelaskan bagaimana mereka mencapai <a href="https://medium.com/@playrea/from-hobby-to-67-million-gameplays-on-poki-in-2025-df2c147cfb27" target="_blank" rel="noreferrer">67 juta permainan dari lima game Poki</a> dan sekitar 200.000 permainan per hari menjelang akhir tahun, yang menurut mereka cukup untuk menjadikan pengembangan game sebagai sumber pendapatan utama.</p>
<p>Untuk mendapat gambaran konkret tentang pendapatan per permainan di tingkat bawah, <a href="https://donislawdev.com/earnings-and-statistics-from-my-8-games-android-ios-webgl/" target="_blank" rel="noreferrer">rincian pendapatan dari beberapa game</a> milik seorang developer cukup informatif, meskipun angkanya sudah lama (game tersebut diluncurkan sekitar 2018). Dari delapan game WebGL dan 451.327 permainan di CrazyGames, mereka memperoleh €556,92, atau sekitar €1,20 per seribu permainan, ditambah $163,79 di Kongregate dari 104.444 permainan lainnya. Game mereka yang berkinerja paling baik, Fish Eat Fishes, menghasilkan €149,36 dari 143.000 permainan. Tarif telah berubah sejak saat itu dan sangat bervariasi berdasarkan wilayah geografis serta format, tetapi polanya tetap sama: Anda memerlukan volume yang benar-benar besar sebelum bagi hasil iklan menjadi pendapatan yang berarti. Game dengan total 10.000 permainan sepanjang masa hidupnya adalah karya portofolio, bukan sumber penghasilan.</p>
<h2 id="kesimpulan-dari-semua-angka-tersebut" tabindex="-1">Kesimpulan dari semua angka tersebut <a class="header-anchor" href="#kesimpulan-dari-semua-angka-tersebut" aria-label="Permalink to &quot;Kesimpulan dari semua angka tersebut&quot;"></a></h2>
<p>Jika semuanya digabungkan, strategi yang jelas akan terlihat. Jika Anda menginginkan jangkauan seluas mungkin tanpa biaya di muka, tempatkan game gratis di Poki atau CrazyGames dan andalkan pembagian pendapatan, sambil mendatangkan traffic sendiri kapan pun memungkinkan agar mendekati tarif traffic langsung 100% dari Poki. Jika Anda lebih suka dibayar sekarang dan tidak ingin mengambil risiko mengejar volume, lisensikan game yang sudah selesai dengan biaya tetap. Jika game Anda merupakan sesuatu yang bersedia dibeli orang untuk dimiliki, jual langsung di itch.io dan simpan lebih dari 90% pendapatannya. Dan jika Anda benar-benar serius, lakukan lebih dari satu hal, karena developer yang benar-benar mencari nafkah menggabungkan pendapatan iklan di portal dengan pembelian dan penjualan langsung, alih-alih mempertaruhkan semuanya pada satu saluran.</p>
<p>Benang merah dari semuanya adalah bahwa uang mengikuti gamenya, bukan sebaliknya. Tidak ada skema monetisasi yang bisa menyelamatkan game yang tidak ingin dimainkan siapa pun, dan game web yang benar-benar menyenangkan akan menemukan jalur pendapatan, apa pun portal tempatnya berada. Kini, hal itu juga menjadi bagian yang paling murah untuk diuji. Ketika membuat prototipe yang bisa dimainkan hanya membutuhkan beberapa menit, bukan satu akhir pekan, Anda dapat menampilkan beberapa game kepada pemain sungguhan dan membiarkan dasbor iklan serta daftar keinginan menunjukkan game mana yang layak dimonetisasi. Alat seperti Cinevva dapat mengubah satu kalimat menjadi game web 3D yang dapat dimainkan di browser Anda, yang merupakan cara tercepat untuk sampai pada satu-satunya pertanyaan penting: apakah ada orang yang terus memainkannya.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="berapa-banyak-uang-yang-dapat-dihasilkan-game-browser" tabindex="-1">Berapa banyak uang yang dapat dihasilkan game browser? <a class="header-anchor" href="#berapa-banyak-uang-yang-dapat-dihasilkan-game-browser" aria-label="Permalink to &quot;Berapa banyak uang yang dapat dihasilkan game browser?&quot;"></a></h3>
<p>Mulai dari hampir tidak menghasilkan apa pun hingga jutaan, dan distribusinya sangat berat di kelompok teratas. Sekitar <a href="https://generalistprogrammer.com/tutorials/how-to-make-money-on-itchio-indie-game-guide" target="_blank" rel="noreferrer">80% game berbayar di itch.io menghasilkan kurang dari $50 per bulan</a>, dan kebanyakan menghasilkan kurang dari $100 sepanjang masa hidupnya. Game kasual yang berkinerja baik di portal seperti Poki atau CrazyGames biasanya menghasilkan <a href="https://www.abratabia.com/web-game-monetization/licensing-to-portals.php" target="_blank" rel="noreferrer">$200 hingga $2.000 per bulan</a> dari bagi hasil iklan, sementara segelintir studio teratas di Poki mencapai <a href="https://app.dealroom.co/news/feed/poki-hits-1b-monthly-plays-as-developer-first-model-boosts-top-studio-revenues-tenfold-1" target="_blank" rel="noreferrer">hingga €1 juta per tahun</a>. Volume adalah segalanya, karena pendapatan iklan baru terkumpul menjadi jumlah yang berarti setelah mencapai ratusan ribu permainan.</p>
<h3 id="berapa-bagian-pendapatan-yang-diambil-poki" tabindex="-1">Berapa bagian pendapatan yang diambil Poki? <a class="header-anchor" href="#berapa-bagian-pendapatan-yang-diambil-poki" aria-label="Permalink to &quot;Berapa bagian pendapatan yang diambil Poki?&quot;"></a></h3>
<p><a href="https://developers.poki.com/guide/monetization" target="_blank" rel="noreferrer">Poki membagi pendapatan iklan 50/50</a> ketika pemain mengakses game Anda melalui Poki.com atau pemasaran Poki. Ketika pemain datang melalui bookmark, pencarian, media sosial, atau komunitas Anda sendiri, Anda memperoleh 100%. Tidak ada biaya di muka untuk menerbitkan game, dan katalog Poki kini menarik lebih dari 1 miliar permainan per bulan dari 600 lebih studio.</p>
<h3 id="berapa-bagian-pendapatan-yang-diambil-crazygames" tabindex="-1">Berapa bagian pendapatan yang diambil CrazyGames? <a class="header-anchor" href="#berapa-bagian-pendapatan-yang-diambil-crazygames" aria-label="Permalink to &quot;Berapa bagian pendapatan yang diambil CrazyGames?&quot;"></a></h3>
<p>CrazyGames tidak memublikasikan pembagiannya dalam dokumentasi utama developer, tetapi data resmi terdekat berasal dari ketentuan <a href="https://crazygames.indiehero.io/cggmwj-jg/" target="_blank" rel="noreferrer">GameMaker web jam 2026</a>, yang menyatakan bahwa developer memperoleh 60% pendapatan iklan dalam game dan 70% pendapatan pembelian dalam game. Pembayaran dilakukan setiap bulan setelah saldo Anda melewati <a href="https://docs.crazygames.com/faq/" target="_blank" rel="noreferrer">batas minimum €100</a>, sementara pembelian dalam game diproses melalui integrasi Xsolla khusus undangan yang diperuntukkan bagi judul berkinerja tinggi.</p>
<h3 id="bisakah-anda-menjual-pembelian-dalam-aplikasi-di-game-web" tabindex="-1">Bisakah Anda menjual pembelian dalam aplikasi di game web? <a class="header-anchor" href="#bisakah-anda-menjual-pembelian-dalam-aplikasi-di-game-web" aria-label="Permalink to &quot;Bisakah Anda menjual pembelian dalam aplikasi di game web?&quot;"></a></h3>
<p>Bisa. CrazyGames menawarkan <a href="https://docs.crazygames.com/resources/ad-monetization-guide/" target="_blank" rel="noreferrer">program pembelian dalam game khusus undangan melalui Xsolla</a> yang membayar 70% kepada developer, lapisan distribusi seperti Playgama Bridge menyertakan IAP dengan gateway pembayaran lokal, dan Anda dapat memasang checkout Stripe atau Xsolla di situs sendiri untuk menyimpan hampir seluruh pendapatan setelah biaya pemrosesan. Untuk menjual game secara utuh, bukan item, itch.io memungkinkan Anda menetapkan harga secara langsung dan menentukan sendiri bagian platform, dengan nilai bawaan hanya 10%.</p>
<h3 id="berapa-pendapatan-game-web-per-1-000-permainan" tabindex="-1">Berapa pendapatan game web per 1.000 permainan? <a class="header-anchor" href="#berapa-pendapatan-game-web-per-1-000-permainan" aria-label="Permalink to &quot;Berapa pendapatan game web per 1.000 permainan?&quot;"></a></h3>
<p>Jumlahnya sangat bergantung pada format iklan dan lokasi geografis pemain, jadi berhati-hatilah saat menggunakan satu angka tertentu. Video berhadiah, format dengan bayaran tertinggi, menghasilkan sekitar <a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">eCPM $15 hingga $28 di AS, $8 hingga $15 di UE, dan $1 hingga $3 di pasar tingkat 3</a> sebelum pembagian pendapatan. Itu adalah tarif kotor per seribu tayangan iklan, bukan per sesi game, dan bayaran banner hanya sebagian kecil darinya. Rincian lama dari seorang developer melaporkan sekitar <a href="https://donislawdev.com/earnings-and-statistics-from-my-8-games-android-ios-webgl/" target="_blank" rel="noreferrer">€1,20 per seribu permainan</a> di CrazyGames untuk sebuah portofolio game sederhana.</p>
<h3 id="berapa-biaya-untuk-melisensikan-game-html5-ke-sebuah-portal" tabindex="-1">Berapa biaya untuk melisensikan game HTML5 ke sebuah portal? <a class="header-anchor" href="#berapa-biaya-untuk-melisensikan-game-html5-ke-sebuah-portal" aria-label="Permalink to &quot;Berapa biaya untuk melisensikan game HTML5 ke sebuah portal?&quot;"></a></h3>
<p>Tidak ada biaya untuk menerbitkan game di portal bagi hasil seperti Poki atau CrazyGames. Jika yang Anda maksud adalah model lisensi berbiaya tetap, <a href="https://playgama.com/blog/main/10-ways-to-monetize-html5-games-that-actually-work-in-2026/" target="_blank" rel="noreferrer">lisensi non-eksklusif berkisar antara $300 hingga $800 per platform, sementara kesepakatan eksklusif dimulai sekitar $5.000 dan dapat melampaui $25.000</a> untuk game yang sudah dipoles. Non-eksklusif berarti game yang sama dijual kepada banyak pembeli, sedangkan eksklusif berarti satu pembeli memilikinya dan game tersebut dihapus dari marketplace.</p>
<h3 id="apakah-itch-io-merupakan-cara-yang-baik-untuk-menghasilkan-uang-dari-game-web" tabindex="-1">Apakah itch.io merupakan cara yang baik untuk menghasilkan uang dari game web? <a class="header-anchor" href="#apakah-itch-io-merupakan-cara-yang-baik-untuk-menghasilkan-uang-dari-game-web" aria-label="Permalink to &quot;Apakah itch.io merupakan cara yang baik untuk menghasilkan uang dari game web?&quot;"></a></h3>
<p>Ini adalah pilihan terbaik jika Anda ingin menjual game secara langsung dan menyimpan sebanyak mungkin pendapatan. <a href="https://itch.io/updates/introducing-open-revenue-sharing" target="_blank" rel="noreferrer">Bagi hasil terbuka</a> itch.io memungkinkan Anda menentukan potongannya dari 0% hingga 100%, dengan nilai bawaan 10%, sehingga dari penjualan senilai $10 Anda memperoleh sekitar $8,41 setelah biaya pemrosesan pembayaran. Itu lebih baik daripada potongan 30% yang diambil Steam dan toko aplikasi seluler. Kekurangannya adalah itch.io mendatangkan pembeli, bukan banjir traffic permainan gratis, sehingga platform ini lebih menguntungkan game yang sudah memiliki audiens atau promosi dari mulut ke mulut yang kuat daripada game kasual yang mengandalkan pengunjung portal.</p>
<BuildCta
  title="Buat gamenya dahulu, monetisasi kemudian"
  desc="Tidak ada model pendapatan yang dapat menyelamatkan game yang tidak dimainkan siapa pun. Mulailah dengan sesuatu yang menyenangkan."
  prompt="Buat game browser cepat tempat Anda melompat dari dinding ke dinding untuk memanjat menara yang runtuh" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-web-game.html">Cara Menerbitkan Game Web</a> — tempat menaruh build yang sudah selesai dan cara kerja setiap platform</li>
<li><a href="/id/guides/publish-game-poki.html">Cara Menerbitkan Game Anda di Poki</a> — persyaratan pengajuan dan program 50/50 Poki secara mendalam</li>
<li><a href="/id/guides/publish-game-crazygames.html">Cara Menerbitkan Game Anda di CrazyGames</a> — SDK, format iklan, dan cara kerja pembayarannya</li>
<li><a href="/id/guides/publish-game-discord-activities.html">Cara Menerbitkan Game di Discord Activities</a> — kanal distribusi lain, dengan jalur IAP dan iklannya sendiri</li>
<li><a href="/id/guides/casual-games-trends-2026.html">Tren Game Kasual pada 2026</a> — arah pergerakan uang di seluruh pasar game kasual</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Panduan Peluncuran di itch.io</a> — menjual game secara langsung dan menyimpan 90% pendapatannya</li>
<li><a href="/id/guides/promote-indie-game-no-budget.html">Cara Mempromosikan Game Indie Tanpa Anggaran</a> — mendatangkan traffic yang mengubah pembagian pendapatan menjadi uang nyata</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/web-game-monetization-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Generator Musik AI Terbaik untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/ai-music-generators-games</link>
            <guid>https://app.cinevva.com/id/guides/ai-music-generators-games</guid>
            <pubDate>Thu, 16 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Generator musik AI terbaik untuk soundtrack game pada 2026, dibandingkan berdasarkan vokal, lisensi komersial, stem, dan self-hosting, mulai dari Suno dan ElevenLabs Music hingga model terbuka seperti Stable Audio dan ACE-Step.]]></description>
            <content:encoded><![CDATA[<h1 id="generator-musik-ai-terbaik-untuk-game-2026" tabindex="-1">Generator Musik AI Terbaik untuk Game (2026) <a class="header-anchor" href="#generator-musik-ai-terbaik-untuk-game-2026" aria-label="Permalink to &quot;Generator Musik AI Terbaik untuk Game (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/ai-music-generators-games.jpg?v=1" alt="Generator musik AI terbaik untuk soundtrack game pada 2026" style="width:100%;border-radius:10px">
</figure>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Dahulu, soundtrack adalah bagian game yang dilewatkan begitu saja oleh developer solo. Anda mungkin merilis game tanpa suara atau mengambil loop gratis yang sudah digunakan oleh lima puluh game lain karena biaya menyewa komposer melebihi biaya seluruh bagian proyek lainnya. Musik AI mengubah perhitungan itu. Anda dapat menjelaskan suasana dalam satu kalimat dan memperoleh track yang sudah jadi dalam waktu kurang dari satu menit.</p>
<p>Bagian tersulit pada 2026 bukanlah kualitas. Sebagian besar alat ini menghasilkan suara yang cukup bagus untuk digunakan dalam game yang dirilis. Masalahnya adalah lisensi. Game merupakan produk komersial, sementara separuh generator musik populer melarang penggunaan komersial pada paket gratisnya atau masih menghadapi gugatan hukum terkait data pelatihan mereka. Salah memilih alat berarti Anda menyertakan masalah hukum di dalam file game.</p>
<p>Kami berkepentingan langsung dalam hal ini. Cinevva menjalankan <a href="/id/tools/music.html">alat musik</a> sendiri, dan ketika memilih mesin di baliknya, kami mencoba jauh lebih dari tiga pilihan. Kami akhirnya memilih ElevenLabs Music, ACE-Step, dan Mubert, dan faktor penentunya bukanlah mesin mana yang memenangkan uji dengar buta. Faktor penentunya adalah lisensi mana yang berani kami pertanggungjawabkan ketika kreator mengajukan satu-satunya pertanyaan yang penting: bisakah saya menjual game yang memuat track ini? Pertanyaan tersebut menjadi benang merah seluruh pembahasan berikut.</p>
<p>Berikut gambaran suara yang dihasilkan dari prompt menjadi track, dengan alur yang sama seperti yang akan Anda gunakan di dalam alat:</p>
<audio controls style="width:100%">
  <source src="/img/ai-samples/music-sample.mp3" type="audio/mpeg">
</audio>
<p><em>Klip pendek yang dihasilkan AI. Jelaskan suasana, lalu dapatkan track yang sesuai.</em></p>
<p>Panduan ini membandingkan generator musik AI yang benar-benar cocok untuk game, dikelompokkan berdasarkan cara penggunaannya: alat pembuat lagu lengkap dengan vokal, generator bebas royalti yang dirancang untuk produk, dan model terbuka yang dapat Anda jalankan sendiri. Untuk setiap alat, hal terpenting dibahas terlebih dahulu: bisakah Anda secara legal memasukkan hasilnya ke dalam game yang dijual?</p>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<p>Jika Anda menginginkan versi singkatnya, berikut pengguna yang paling cocok untuk setiap alat.</p>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Paling cocok untuk</th>
<th>Vokal</th>
<th>Lisensi komersial</th>
<th>Self-host</th>
<th>Harga</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>ElevenLabs Music</strong></td>
<td>Lisensi paling jelas untuk game yang dirilis</td>
<td>Ya</td>
<td>Diizinkan untuk penggunaan komersial, data pelatihan berlisensi</td>
<td>Tidak</td>
<td>Paket berbayar</td>
</tr>
<tr>
<td><strong>Suno</strong></td>
<td>Membuat lagu lengkap dengan vokal secara cepat</td>
<td>Ya</td>
<td>Hanya paket berbayar, ada risiko lanjutan dari litigasi</td>
<td>Tidak</td>
<td>Pro $10/bulan</td>
</tr>
<tr>
<td><strong>Stable Audio 3</strong></td>
<td>Self-hosting dan desain suara</td>
<td>Instrumental</td>
<td>Community License, gratis untuk pendapatan di bawah $1 juta</td>
<td>Ya</td>
<td>Bobot terbuka</td>
</tr>
<tr>
<td><strong>ACE-Step</strong></td>
<td>Track lengkap yang terbuka dan dapat di-self-host</td>
<td>Ya</td>
<td>MIT, sepenuhnya permisif</td>
<td>Ya</td>
<td>Gratis</td>
</tr>
<tr>
<td><strong>Mubert</strong></td>
<td>Musik latar tanpa henti di dalam aplikasi</td>
<td>Tidak</td>
<td>Bebas royalti sesuai paket, dirancang untuk produk</td>
<td>API</td>
<td>Tingkat harga API</td>
</tr>
<tr>
<td><strong>Soundraw</strong></td>
<td>Track bebas royalti dan API dalam produk</td>
<td>Tidak</td>
<td>Bebas royalti, katalog internal berlisensi</td>
<td>API</td>
<td>~$17/bulan</td>
</tr>
<tr>
<td><strong>AIVA</strong></td>
<td>Musik sinematik dan orkestra</td>
<td>Instrumental</td>
<td>Komersial pada tingkat berbayar</td>
<td>Tidak</td>
<td>Paket berbayar</td>
</tr>
<tr>
<td><strong>Magenta RealTime</strong></td>
<td>Musik adaptif yang bereaksi secara real-time</td>
<td>Instrumental</td>
<td>Terbuka, bobot CC-BY</td>
<td>Ya</td>
<td>Gratis</td>
</tr>
<tr>
<td><strong>Udio</strong></td>
<td>Mendengarkan dan membuat remix, bukan untuk file game</td>
<td>Ya</td>
<td>Hanya streaming, tanpa ekspor</td>
<td>Tidak</td>
<td>Paket berbayar</td>
</tr>
</tbody>
</table>
<h2 id="generator-lagu-lengkap-dengan-vokal" tabindex="-1">Generator lagu lengkap dengan vokal <a class="header-anchor" href="#generator-lagu-lengkap-dengan-vokal" aria-label="Permalink to &quot;Generator lagu lengkap dengan vokal&quot;"></a></h2>
<p>Alat-alat ini menulis track lengkap, sering kali dengan nyanyian, dari prompt teks. Inilah yang biasanya dimaksud orang ketika menyebut &quot;musik AI&quot;, dan alat-alat ini merupakan pilihan tepat ketika Anda menginginkan lagu tema, track menu, atau karya vokal untuk trailer.</p>
<h3 id="elevenlabs-music" tabindex="-1">ElevenLabs Music <a class="header-anchor" href="#elevenlabs-music" aria-label="Permalink to &quot;ElevenLabs Music&quot;"></a></h3>
<p>Jika Anda akan merilis game komersial dan ingin berhenti mengkhawatirkan lisensi, mulailah dari sini. ElevenLabs meluncurkan Eleven Music pada Agustus 2025, dan tidak seperti para pesaingnya, mereka membangun model ini menggunakan musik produksi berlisensi serta menandatangani kesepakatan dengan Merlin dan Kobalt agar para pemegang hak mendapatkan bayaran. Hasilnya diizinkan untuk penggunaan komersial yang luas, dan game disebutkan secara khusus dalam persyaratannya.</p>
<p>Konsekuensinya adalah serangkaian batasan yang harus Anda patuhi. Anda tidak dapat menggunakan nama artis, judul lagu, atau lirik asli dalam prompt, dan beberapa sektor dikecualikan, jadi bacalah persyaratan musiknya sebelum membangun produk berdasarkan alat ini. Untuk soundtrack game, batasan tersebut jarang menjadi masalah. Sebagai gantinya, Anda memperoleh satu hal yang tidak dapat ditawarkan generator vokal lain pada 2026: rantai lisensi yang jelas dan dapat Anda tunjukkan jika ada yang bertanya. Ini adalah salah satu dari tiga mesin di balik <a href="/id/tools/music.html">alat musik</a> kami sendiri, khususnya karena urusan lisensinya sudah jelas.</p>
<h3 id="suno" tabindex="-1">Suno <a class="header-anchor" href="#suno" aria-label="Permalink to &quot;Suno&quot;"></a></h3>
<p>Suno adalah cara tercepat untuk menghasilkan lagu vokal yang sudah jadi, dan mulai model v5.5 (Maret 2026), vokalnya terdengar paling alami dibandingkan generator lain. Untuk game, aturannya sederhana dan tegas. Paket gratis sepenuhnya dilarang untuk penggunaan komersial. Anda memerlukan paket Pro seharga $10 per bulan (atau $8 jika ditagih tahunan), yang memberikan hak komersial dan file yang dapat diunduh, kredit setara sekitar 500 lagu, serta akses ke model v5.5. Paket Premier seharga $30 per bulan menambahkan Suno Studio, yang penting untuk game karena dapat memisahkan track menjadi stem yang bisa Anda remix untuk berbagai konteks di dalam game.</p>
<p>Ada dua hal yang perlu dibedakan dengan jelas. Pertama, lisensi komersial bukanlah kepemilikan hak cipta. Persyaratan Suno sendiri menyatakan bahwa pemberian hak penggunaan komersial berbeda dengan pengalihan kepemilikan, sementara hukum AS umumnya mewajibkan adanya pencipta manusia untuk memperoleh hak cipta penuh. Jadi, yang Anda miliki adalah lisensi untuk menggunakan track tersebut, bukan hak cipta yang tak terbantahkan. Kedua, Suno mencapai penyelesaian dengan Warner pada November 2025, tetapi gugatan Sony dan Universal masih aktif menjelang sidang putusan ringkas pada Juli 2026. Suno juga menyatakan bahwa mereka berencana mengganti model saat ini dengan model baru berlisensi label pada akhir 2026, sehingga model dan aturan pengunduhan yang berlaku dapat berubah. Belum ada pengadilan yang menyatakan pengguna hilir bertanggung jawab, dan risiko praktis bagi developer indie tergolong rendah, tetapi ini tetap merupakan risiko lanjutan yang perlu diketahui sebelum Anda membangun waralaba berdasarkan alat tersebut. Simpan bukti pembayaran untuk menunjukkan bahwa langganan Anda aktif ketika setiap track dibuat.</p>
<h3 id="udio" tabindex="-1">Udio <a class="header-anchor" href="#udio" aria-label="Permalink to &quot;Udio&quot;"></a></h3>
<p>Udio menghasilkan audio yang memukau, tetapi pada 2026 Anda tidak dapat memasukkannya ke dalam game. Setelah penyelesaian dengan Universal Music pada Oktober 2025, Udio menonaktifkan semua pengunduhan dan stem serta menjadi ekosistem tertutup yang hanya menyediakan streaming. Anda dapat membuat, mendengarkan, dan me-remix di dalam aplikasi, tetapi tidak dapat mengekspor file. Bagi pengembangan game, ini langsung menggugurkan Udio karena tujuan utamanya adalah memasukkan file audio ke dalam engine. Universal sedang mengembangkan bersama sebuah platform Udio berlisensi untuk 2026, sehingga situasinya mungkin berubah. Namun, pada saat artikel ini ditulis, anggap Udio sebagai tempat untuk bereksperimen, bukan sebagai sumber soundtrack.</p>
<h2 id="generator-bebas-royalti-yang-dirancang-untuk-produk" tabindex="-1">Generator bebas royalti yang dirancang untuk produk <a class="header-anchor" href="#generator-bebas-royalti-yang-dirancang-untuk-produk" aria-label="Permalink to &quot;Generator bebas royalti yang dirancang untuk produk&quot;"></a></h2>
<p>Kelompok ini ditujukan kepada kreator dan perusahaan, bukan musisi. Track yang dihasilkan biasanya instrumental, antarmukanya lebih sederhana, dan nilai jual utamanya adalah keamanan lisensi. Beberapa di antaranya menawarkan API, yang menjadi pilihan jika Anda ingin pemain membuat musik sendiri di dalam game.</p>
<h3 id="mubert" tabindex="-1">Mubert <a class="header-anchor" href="#mubert" aria-label="Permalink to &quot;Mubert&quot;"></a></h3>
<p>Mubert dirancang untuk produk, dan game merupakan salah satu kasus penggunaan utamanya. Alat ini menghasilkan musik bebas royalti dan bebas DMCA berdasarkan prompt, suasana, BPM, atau aktivitas, dengan pelatihan menggunakan konten berlisensi dan konten mitra. Detail pentingnya adalah struktur paket karena hal tersebut menentukan tindakan yang dapat Anda lakukan secara legal. Pada paket Startup, musik dapat diputar di dalam aplikasi, tetapi pengguna tidak dapat mengekspornya, sehingga cocok untuk game seluler dengan musik latar. Jika Anda ingin pemain dapat mengekspor atau membagikan track yang mereka buat, Anda memerlukan Startup+ atau paket yang lebih tinggi, yang mencakup hak sublisensi. Paket gratis tidak boleh digunakan secara komersial. Mubert juga merupakan salah satu mesin di balik <a href="/id/tools/music.html">alat musik</a> kami. Itulah sebabnya pembuatan musik di dalam aplikasi menjadi fitur utama, bukan sekadar tambahan.</p>
<h3 id="soundraw" tabindex="-1">Soundraw <a class="header-anchor" href="#soundraw" aria-label="Permalink to &quot;Soundraw&quot;"></a></h3>
<p>Soundraw adalah generator bebas royalti yang sudah lama beroperasi, dilatih sepenuhnya menggunakan katalog internal berlisensi untuk menghindari persoalan hak cipta. Anda memilih genre, suasana, dan tema, lalu menyempurnakan aransemennya. Layanan ini menggunakan sistem langganan untuk penggunaan individual dengan harga sekitar $17 per bulan, serta menawarkan API yang digunakan oleh developer game dan alat kreator yang ingin menyematkan fitur pembuatan musik. Ini adalah pilihan aman dan sederhana ketika Anda membutuhkan musik latar instrumental serta penjelasan lisensi yang mudah disampaikan kepada penerbit.</p>
<h3 id="beatoven-loudly-dan-aiva" tabindex="-1">Beatoven, Loudly, dan AIVA <a class="header-anchor" href="#beatoven-loudly-dan-aiva" aria-label="Permalink to &quot;Beatoven, Loudly, dan AIVA&quot;"></a></h3>
<p>Ada tiga pilihan lain yang patut diketahui untuk kebutuhan tertentu. <strong>Beatoven.ai</strong> adalah pilihan hemat, sekitar $2,50 per bulan dengan hak komersial yang sudah termasuk, sehingga sulit ditandingi jika Anda hanya membutuhkan musik latar yang bersih. <strong>Loudly</strong> berada sedikit lebih tinggi dengan harga sekitar $6 per bulan dan lebih menekankan kontrol kustomisasi serta kolaborasi. <strong>AIVA</strong> adalah pilihan spesialis: alat ini dibuat untuk scoring sinematik dan orkestra, sehingga paling cocok ketika game Anda membutuhkan tema simfonik yang megah alih-alih loop pop. Ketiganya memberikan hak komersial pada tingkat berbayar dan melarangnya pada tingkat gratis, yang merupakan pola umum di seluruh kategori ini.</p>
<h2 id="model-terbuka-yang-dapat-anda-jalankan-sendiri" tabindex="-1">Model terbuka yang dapat Anda jalankan sendiri <a class="header-anchor" href="#model-terbuka-yang-dapat-anda-jalankan-sendiri" aria-label="Permalink to &quot;Model terbuka yang dapat Anda jalankan sendiri&quot;"></a></h2>
<p>Jika Anda tidak menginginkan langganan maupun biaya per track serta ingin mengendalikan sepenuhnya audio proyek yang belum dirilis, jalankan model di perangkat keras sendiri. Model audio terbuka berkembang sangat cepat, dan pada 2026 beberapa di antaranya benar-benar bagus. Satu aturannya: periksa lisensi bobot model, bukan hanya lisensi kodenya, karena keduanya sering berbeda.</p>
<h3 id="stable-audio-3" tabindex="-1">Stable Audio 3 <a class="header-anchor" href="#stable-audio-3" aria-label="Permalink to &quot;Stable Audio 3&quot;"></a></h3>
<p>Stable Audio 3 (Mei 2026) adalah pilihan terbuka terkuat untuk game karena kombinasi lisensi dan cakupannya. Stability merilis tiga model berbobot terbuka yang dilatih menggunakan data berlisensi penuh: Small-Music dan Small-SFX dapat dijalankan di CPU tanpa memerlukan GPU, sedangkan Medium berjalan di GPU kelas konsumen untuk menghasilkan kualitas lebih tinggi. Hanya model Large yang tersedia secara eksklusif melalui API. Berdasarkan Stability AI Community License, Anda memiliki hasilnya dan dapat mengomersialkannya secara bebas sampai pendapatan tahunan studio melampaui $1 juta. Setelah itu, Anda harus beralih ke lisensi Enterprise yang juga mencakup perlindungan hukum.</p>
<p>Untuk game, alat ini memenuhi dua kebutuhan sekaligus. Model musiknya menghasilkan track dengan durasi bervariasi hingga sekitar enam menit, sedangkan Small-SFX adalah model terbuka terbaik untuk membuat efek suara yang benar-benar dapat Anda sertakan dalam game yang dirilis. Anda juga dapat melakukan fine-tuning LoRA terhadap model mana pun menggunakan folder berisi audio Anda sendiri. Dengan begitu, Anda dapat mengajarkannya gaya suara khas game, lalu menghasilkan loop menu, stinger pertempuran, dan ambience yang selaras layaknya satu komposisi utuh.</p>
<h3 id="ace-step" tabindex="-1">ACE-Step <a class="header-anchor" href="#ace-step" aria-label="Permalink to &quot;ACE-Step&quot;"></a></h3>
<p>ACE-Step adalah model terbuka yang perlu diketahui untuk membuat track lengkap dengan vokal. Lini 1.5 (Januari 2026) menggunakan lisensi MIT, yang sangat permisif, dan dapat menghasilkan musik berdurasi beberapa menit dengan cepat dalam 19 bahasa, lengkap dengan fitur kloning suara, remix, dan penyuntingan lirik. Ini adalah alternatif Suno yang dapat di-self-host bagi tim yang lebih memilih memiliki pipeline sendiri daripada menyewanya, sekaligus menjadi mesin ketiga di balik <a href="/id/tools/music.html">alat musik</a> kami.</p>
<h3 id="pilihan-model-terbuka-lainnya" tabindex="-1">Pilihan model terbuka lainnya <a class="header-anchor" href="#pilihan-model-terbuka-lainnya" aria-label="Permalink to &quot;Pilihan model terbuka lainnya&quot;"></a></h3>
<p>Ada beberapa pilihan lain, tergantung kebutuhan Anda. <strong>YuE</strong> (Apache 2.0) menghasilkan lagu lengkap dengan vokal berdasarkan lembar lirik dan merupakan model terbuka pertama yang mampu melakukannya dengan baik. <strong>DiffRhythm 2</strong> (Apache 2.0, Februari 2026) dibuat untuk menghasilkan lagu lengkap dengan cepat. <strong>MusicGen</strong> dari Meta masih cukup baik untuk pembuatan prototipe, tetapi bobotnya menggunakan CC-BY-NC sehingga hanya boleh digunakan sebagai alat membuat sketsa. Jangan pernah memasukkan track MusicGen ke dalam game yang Anda jual. Gunakan ACE-Step atau Stable Audio untuk versi final.</p>
<p><strong>Magenta RealTime</strong> dari Google (kode Apache 2.0, bobot CC-BY) berbeda dari yang lain, dan perbedaan tersebut justru sangat cocok untuk game. Alih-alih merender file yang sudah jadi, alat ini menghasilkan musik secara langsung dan dapat Anda arahkan selama musik diputar. Format tersebut sangat sesuai untuk soundtrack adaptif yang berubah ketika pemain memasuki pertempuran atau saat bos muncul. Tidak ada model terbuka lain yang dirancang untuk pengarahan secara real-time. Jadi, jika musik interaktif adalah tujuan Anda, inilah titik awalnya.</p>
<h2 id="efek-suara-bukan-hanya-musik" tabindex="-1">Efek suara, bukan hanya musik <a class="header-anchor" href="#efek-suara-bukan-hanya-musik" aria-label="Permalink to &quot;Efek suara, bukan hanya musik&quot;"></a></h2>
<p>Soundtrack hanyalah separuh dari pekerjaan. Game juga membutuhkan suara langkah kaki, klik UI, ledakan, dan ambience, sementara aturan lisensi AI yang sama juga berlaku. Ada dua pilihan yang menonjol. <strong>Stable Audio 3 Small-SFX</strong> berjalan secara lokal, menghasilkan efek sesuai kebutuhan, dan dirilis dengan Community License yang aman untuk penggunaan komersial, sama seperti model musik saudaranya. <strong>ElevenLabs</strong> memiliki generator efek suara khusus dengan status izin komersial yang sama jelasnya seperti Eleven Music. Itulah sebabnya <a href="/id/tools/sfx.html">alat SFX</a> kami tersedia bersama alat musik. Untuk pendekatan tradisional, panduan <a href="/id/guides/free-sound-effects-music.html">efek suara dan musik gratis</a> kami membahas pustaka CC0 yang layak disimpan sebagai cadangan.</p>
<h2 id="realitas-lisensi-untuk-game" tabindex="-1">Realitas lisensi untuk game <a class="header-anchor" href="#realitas-lisensi-untuk-game" aria-label="Permalink to &quot;Realitas lisensi untuk game&quot;"></a></h2>
<p>Bagian inilah yang dapat menyelamatkan Anda dari pemberitahuan penghapusan, jadi bacalah sebelum membuat apa pun yang akan disertakan dalam game yang dirilis.</p>
<p><strong>&quot;Bebas royalti&quot; tidak berarti &quot;bebas hak cipta&quot;, dan keduanya juga tidak berarti kepemilikan.</strong> Bebas royalti berarti Anda tidak perlu membayar biaya setiap kali track diputar. Istilah tersebut tidak menjelaskan siapa pemilik musiknya atau apakah data pelatihannya bersih. Ketiganya merupakan konsep berbeda yang sering dicampuradukkan dalam materi pemasaran.</p>
<p><strong>Paket gratis hampir tidak pernah aman untuk game komersial.</strong> Pada Suno, Mubert, Soundraw, Beatoven, dan Loudly, paket gratis hanya boleh digunakan untuk keperluan pribadi dan nonkomersial. Game yang Anda jual, atau bahkan game gratis dengan iklan maupun DLC berbayar, merupakan proyek komersial. Gunakan paket berbayar atau model terbuka dengan lisensi permisif, dan jangan merilis track yang dibuat menggunakan paket gratis.</p>
<p><strong>Perhatikan gugatan terkait data pelatihan.</strong> Suno dan Udio sama-sama menghadapi litigasi aktif dari label-label besar. Sejauh ini, belum ada pengadilan yang menyatakan pengguna hilir bertanggung jawab, dan risiko praktis bagi developer indie tergolong rendah. Namun, risikonya tetap ada, dan inilah alasan pilihan dengan status paling jelas pada 2026 adalah alat yang dilatih menggunakan data berlisensi: ElevenLabs Music, Stable Audio, Mubert, Soundraw, dan AIVA.</p>
<p><strong>Simpan bukti pembayaran Anda.</strong> Hak komersial pada alat seperti Suno berlaku untuk track yang dibuat selama langganan Anda aktif. Simpan bukti bahwa langganan aktif pada saat pembuatan, agar Anda dapat menunjukkan bahwa track tersebut sudah berlisensi ketika dibuat.
<strong>Ungkapkan penggunaan AI jika diwajibkan oleh platform.</strong> itch.io dan Steam memiliki aturan pengungkapan konten AI masing-masing, dan bersikap jujur di sini adalah perlindungan murah. Lihat <a href="/id/ai-content.html">kebijakan konten buatan AI</a> kami untuk mengetahui cara kami menangani pengungkapan, serta <a href="/id/guides/game-asset-licenses.html">panduan lisensi aset game</a> kami untuk memahami posisi lisensi musik di samping aset visual dan kode Anda.</p>
<h2 id="membuat-musik-yang-cocok-untuk-game-bukan-sekadar-lagu" tabindex="-1">Membuat musik yang cocok untuk game, bukan sekadar lagu <a class="header-anchor" href="#membuat-musik-yang-cocok-untuk-game-bukan-sekadar-lagu" aria-label="Permalink to &quot;Membuat musik yang cocok untuk game, bukan sekadar lagu&quot;"></a></h2>
<p>Lagu pop berdurasi tiga menit bukanlah soundtrack game. Game membutuhkan loop tanpa sambungan yang terdengar, stem yang dapat Anda padukan saat adegan berubah, serta transisi suasana yang mengikuti pemain. Berikut beberapa catatan alur kerja.</p>
<p>Untuk <strong>loop</strong>, buat komposisi yang sedikit lebih panjang lalu potong pada titik loop yang mulus, atau gunakan fitur continuation dan inpainting (Stable Audio dan Suno sama-sama memilikinya) untuk menyambungkan bagian akhir kembali ke awal. Untuk <strong>stem</strong>, Suno Studio pada paket Premier dan mode remix ACE-Step dapat memisahkan lagu menjadi beberapa bagian, sehingga Anda dapat menghilangkan drum selama segmen mengendap-endap dan memunculkannya kembali saat pengejaran. Untuk musik <strong>adaptif dan real-time</strong> yang bereaksi terhadap tindakan pemain, Magenta RealTime memang dirancang khusus untuk itu, sementara stream tanpa akhir berdasarkan suasana dari Mubert cocok untuk lapisan latar ambient atau tanpa batas di dalam aplikasi.</p>
<h2 id="yang-benar-benar-akan-saya-gunakan" tabindex="-1">Yang benar-benar akan saya gunakan <a class="header-anchor" href="#yang-benar-benar-akan-saya-gunakan" aria-label="Permalink to &quot;Yang benar-benar akan saya gunakan&quot;"></a></h2>
<p>Jika saya membuat musik untuk sebuah game hari ini, berikut rangkaian alat yang akan saya pilih.</p>
<p><strong>Merilis game komersial yang lisensinya harus benar-benar aman?</strong> Gunakan ElevenLabs Music untuk trek vokal dan melodi utama, serta Stable Audio 3 untuk lapisan instrumental dan efek suara. Keduanya dilatih menggunakan data berlisensi dan mengizinkan output-nya untuk penggunaan komersial. Itulah alasan dua dari tiga mesin dalam alat kami sendiri berasal dari kategori ini.</p>
<p>Butuh <strong>iterasi cepat dan vokal terbaik</strong>? Suno Pro adalah jawabannya, selama Anda menyimpan bukti pembayaran dan bersedia menerima sedikit risiko dari proses hukum yang masih berlangsung. Ekspor hasil terbaik ke Suno Studio untuk memisahkan stem.</p>
<p>Ingin <strong>kendali penuh tanpa langganan</strong>? Host ACE-Step sendiri untuk trek vokal dan Stable Audio 3 untuk musik instrumental serta SFX, lalu lakukan fine-tuning LoRA pada Stable Audio menggunakan audio Anda sendiri agar semuanya terdengar seperti satu kesatuan musik latar.</p>
<p>Untuk <strong>musik latar di dalam aplikasi Anda</strong>, atau agar pemain dapat membuat musik sendiri, integrasikan API Mubert atau Soundraw pada tingkatan paket yang sesuai dengan izin ekspor bagi pengguna. Jika Anda menginginkan <strong>musik adaptif yang bereaksi terhadap gameplay</strong>, mulailah dengan membuat prototipe menggunakan Magenta RealTime.</p>
<p>Kesalahan umum adalah mencoba memakai satu alat untuk semuanya. Musik, stem, SFX, dan lapisan adaptif merupakan pekerjaan yang berbeda, dan solusi yang tepat biasanya berupa dua atau tiga alat yang masing-masing unggul dalam satu bidang. Tujuan semuanya sama: soundtrack tidak lagi menjadi bagian yang Anda korbankan.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan umum&quot;"></a></h2>
<h3 id="apa-generator-musik-ai-terbaik-untuk-game-komersial" tabindex="-1">Apa generator musik AI terbaik untuk game komersial? <a class="header-anchor" href="#apa-generator-musik-ai-terbaik-untuk-game-komersial" aria-label="Permalink to &quot;Apa generator musik AI terbaik untuk game komersial?&quot;"></a></h3>
<p>Untuk lisensi yang jelas, ElevenLabs Music dan Stable Audio 3 menjadi pilihan terdepan pada 2026 karena keduanya dilatih menggunakan data berlisensi dan mengizinkan output-nya untuk penggunaan komersial. Untuk mendapatkan vokal terbaik dengan cepat, Suno Pro cocok jika Anda bersedia menerima perkara hukum Sony yang masih berlangsung sebagai risiko kecil. Hindari paket gratis dan bobot model nonkomersial untuk apa pun yang akan Anda rilis.</p>
<h3 id="apakah-saya-boleh-secara-legal-menggunakan-musik-buatan-ai-dalam-game-yang-saya-jual" tabindex="-1">Apakah saya boleh secara legal menggunakan musik buatan AI dalam game yang saya jual? <a class="header-anchor" href="#apakah-saya-boleh-secara-legal-menggunakan-musik-buatan-ai-dalam-game-yang-saya-jual" aria-label="Permalink to &quot;Apakah saya boleh secara legal menggunakan musik buatan AI dalam game yang saya jual?&quot;"></a></h3>
<p>Biasanya boleh, jika menggunakan paket berbayar atau model terbuka dengan lisensi permisif, tetapi detailnya penting. Paket gratis hampir selalu hanya untuk penggunaan nonkomersial, lisensi komersial tidak sama dengan memiliki hak cipta, dan alat yang dilatih menggunakan data tanpa lisensi membawa risiko hukum. Periksa lisensi yang berlaku, simpan bukti langganan Anda, dan ungkapkan penggunaan konten AI jika diwajibkan oleh platform Anda.</p>
<h3 id="generator-musik-ai-mana-yang-dapat-saya-jalankan-di-perangkat-keras-sendiri" tabindex="-1">Generator musik AI mana yang dapat saya jalankan di perangkat keras sendiri? <a class="header-anchor" href="#generator-musik-ai-mana-yang-dapat-saya-jalankan-di-perangkat-keras-sendiri" aria-label="Permalink to &quot;Generator musik AI mana yang dapat saya jalankan di perangkat keras sendiri?&quot;"></a></h3>
<p>Stable Audio 3 (model Small dapat berjalan pada CPU, sedangkan Medium pada GPU konsumen), ACE-Step, YuE, DiffRhythm 2, dan Magenta RealTime semuanya bersifat terbuka dan dapat di-host sendiri. Periksa lisensi bobot model, bukan hanya kodenya: bobot MusicGen bersifat nonkomersial, sedangkan ACE-Step (MIT) dan Stable Audio (Community License) mengizinkan penggunaan komersial.</p>
<h3 id="bagaimana-cara-membuat-musik-loop-atau-adaptif-untuk-game" tabindex="-1">Bagaimana cara membuat musik loop atau adaptif untuk game? <a class="header-anchor" href="#bagaimana-cara-membuat-musik-loop-atau-adaptif-untuk-game" aria-label="Permalink to &quot;Bagaimana cara membuat musik loop atau adaptif untuk game?&quot;"></a></h3>
<p>Buat trek yang lebih panjang lalu potong menjadi loop tanpa celah, atau gunakan continuation dan inpainting untuk menyambungkan kedua ujungnya. Untuk stem, gunakan Suno Studio atau mode remix ACE-Step. Untuk musik real-time yang bereaksi terhadap gameplay, Magenta RealTime dirancang agar dapat diarahkan secara langsung, sedangkan stream berbasis suasana dari Mubert cocok untuk lapisan latar tanpa akhir.</p>
<hr>
<h2 id="bacaan-lanjutan" tabindex="-1">Bacaan lanjutan <a class="header-anchor" href="#bacaan-lanjutan" aria-label="Permalink to &quot;Bacaan lanjutan&quot;"></a></h2>
<ul>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Open-Source Terbaik untuk Game</a>, rangkuman lengkap model terbuka untuk video, gambar, 3D, audio, dan suara</li>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI Terbaik untuk Game</a>, pembuatan model 3D, tekstur, dan audio dalam satu panduan</li>
<li><a href="/id/guides/ai-voice-acting-games.html">Pengisi Suara AI untuk Game</a>, pembahasan alat serupa untuk dialog dan narasi</li>
<li><a href="/id/guides/free-sound-effects-music.html">Efek Suara dan Musik Gratis untuk Game</a>, pustaka CC0 untuk dipadukan dengan generasi AI</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a>, posisi lisensi musik di samping aset visual dan kode Anda</li>
<li><a href="/id/ai-content.html">Kebijakan konten buatan AI</a>, cara kami menangani pengungkapan penggunaan AI</li>
</ul>
<BuildCta
  title="Buat game dan soundtrack-nya di satu tempat"
  desc="Musik terasa lebih menyenangkan saat menjadi soundtrack untuk game yang benar-benar Anda buat."
  prompt="Buat game ritme berlatar kota neon, dengan ketukan musik yang menggerakkan rintangannya" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/ai-music-generators-games.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Perbandingan Platform Mini Game & HTML5 Tiongkok (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/china-mini-game-platforms</link>
            <guid>https://app.cinevva.com/id/guides/china-mini-game-platforms</guid>
            <pubDate>Fri, 10 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Perbandingan platform yang mendistribusikan game HTML5 dan Mini Game di Tiongkok. WeChat, Douyin, QQ, 4399, Kuaishou, Alipay, dan Meituan berdasarkan jangkauan, pembagian pendapatan, audiens, serta persyaratan untuk masuk ke masing-masing platform.]]></description>
            <content:encoded><![CDATA[<h1 id="perbandingan-platform-mini-game-html5-tiongkok-2026" tabindex="-1">Perbandingan Platform Mini Game &amp; HTML5 Tiongkok (2026) <a class="header-anchor" href="#perbandingan-platform-mini-game-html5-tiongkok-2026" aria-label="Permalink to &quot;Perbandingan Platform Mini Game &amp; HTML5 Tiongkok (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/china-mini-game-platforms-hero.jpg?v=1" alt="Perbandingan platform Mini Game dan HTML5 Tiongkok pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Di Barat, &quot;menerbitkan game web&quot; berarti itch.io, Poki, CrazyGames, atau Newgrounds. Tiongkok memiliki versinya sendiri, dan skalanya sangat besar. Pasar Mini Game menghasilkan sekitar $7,65 miliar pada 2025 dan diperkirakan mencapai sekitar $20 miliar pada 2030. Platformnya berbeda, mekanisme penemuannya berbeda, dan persyaratan untuk masuk ke sana pun berbeda. Inilah panduan lapangannya.</p>
<p>Untuk versi Baratnya, lihat <a href="/id/guides/publish-web-game.html">tempat terbaik untuk menerbitkan game web</a>. Halaman ini adalah peta platform Tiongkok. Jika Anda ingin memahami proses agar game terdaftar dan menghasilkan uang, <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan di WeChat dan Douyin</a> membahas perizinan dan pembagian pendapatan secara lebih mendalam.</p>
<h2 id="dua-platform-yang-paling-penting" tabindex="-1">Dua platform yang paling penting <a class="header-anchor" href="#dua-platform-yang-paling-penting" aria-label="Permalink to &quot;Dua platform yang paling penting&quot;"></a></h2>
<p>WeChat dan Douyin bersama-sama menguasai lebih dari 90% pendapatan Mini Game di Tiongkok. Jika Anda hanya merilis game di dua tempat, pilih keduanya.</p>
<p>WeChat Mini Games adalah raksasanya. Sekitar 500 hingga 570 juta pemain bulanan memainkan game di dalam aplikasi yang digunakan satu miliar orang untuk berkirim pesan dan melakukan pembayaran. Penemuannya bersifat sosial: game menyebar melalui teman dan grup percakapan. Ada lebih dari 400.000 pengembang WeChat Mini Game, dan lebih dari 300 tim membukukan pendapatan kuartalan di atas 10 juta yuan. Platform ini menguntungkan game dengan retensi dan promosi dari mulut ke mulut yang kuat, sementara ekosistem pembelian dalam aplikasinya sudah sangat matang. Jika game Anda memiliki siklus permainan yang membuat orang kembali membukanya serta alasan untuk membagikannya kepada teman, WeChat adalah tempat pertumbuhan tersebut dapat berlipat ganda.</p>
<p>Douyin Mini Games adalah penantang yang tumbuh pesat. Platform ini memiliki sekitar 170 juta pemain bulanan, sementara pendapatannya tumbuh sekitar 100% dan jumlah penggunanya sekitar 120% dari tahun ke tahun pada 2025. Penemuannya bersifat algoritmis dan didukung video pendek. Klip menarik di linimasa dapat mendatangkan gelombang pemain. Douyin menawarkan persyaratan yang agresif, dengan sejumlah mitra pilihan menerima hingga 90% dari hasil pendapatan, sementara label Ohayoo miliknya berfokus pada penerbitan game hiper-kasual. Jika game Anda terlihat sulit ditolak dalam lima detik, linimasa Douyin adalah mesin pertumbuhan yang tak mampu ditandingi WeChat.</p>
<h2 id="platform-lainnya" tabindex="-1">Platform lainnya <a class="header-anchor" href="#platform-lainnya" aria-label="Permalink to &quot;Platform lainnya&quot;"></a></h2>
<p>Selain dua pemain besar tersebut, ada beberapa platform lain yang perlu diketahui, terutama untuk menjangkau audiens yang belum sepenuhnya dikuasai para raksasa.</p>
<p>QQ Mini Games adalah platform sosial Tencent lainnya, dengan demografi pengguna yang lebih muda daripada WeChat. Jika game Anda menyasar remaja dan pelajar, demografi QQ menjadi alasan kuat untuk hadir di sana. Berada di dalam ekosistem Tencent juga dapat menyederhanakan sejumlah integrasi.</p>
<p>4399 adalah pemain veteran dari era game web kasual Tiongkok. Portal ini sudah ada sebelum ledakan Mini Game dan masih menarik banyak pemain kasual. Platform tersebut dan perusahaan mapan serupa, seperti BoKe, Tanwan, dan lainnya, telah berekspansi ke Mini Game sambil mempertahankan keunggulan tradisional mereka sebagai portal kasual. Cocok untuk game kasual yang sederhana dan mudah dipahami.</p>
<p>Kuaishou adalah pesaing utama Douyin di ranah video pendek, dengan model penemuan algoritmis yang sama dan audiens yang lebih banyak berasal dari wilayah pedesaan serta kota lapis bawah. Pendapatan Mini Game-nya sejauh ini lebih kecil, tetapi basis penggunanya berbeda.</p>
<p>Alipay dan Meituan melengkapi peta ini. Keduanya sedang membangun momentum Mini Game dengan memanfaatkan basis pengguna transaksional yang sangat besar, masing-masing dari layanan pembayaran dan pesan-antar makanan, dan keduanya masih berada pada tahap awal. Jangkauannya sangat luas, tetapi pangsa gaming-nya masih kecil. Karena itu, platform-platform ini lebih cocok sebagai taruhan pada ceruk tertentu atau peluang masuk sebelum pasar ramai, bukan sebagai kanal utama untuk saat ini.</p>
<h2 id="sekilas-perbandingan" tabindex="-1">Sekilas perbandingan <a class="header-anchor" href="#sekilas-perbandingan" aria-label="Permalink to &quot;Sekilas perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Platform</th>
<th>Pemain bulanan</th>
<th>Penemuan</th>
<th>Ketentuan pendapatan</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td>WeChat</td>
<td>~500–570 juta</td>
<td>Sosial, berbagi antarteman</td>
<td>Iklan ~50/50, pengembang menerima ~60–70% IAP</td>
<td>Game berbasis retensi yang mudah dibagikan secara sosial</td>
</tr>
<tr>
<td>Douyin</td>
<td>~170 juta</td>
<td>Video pendek algoritmis</td>
<td>Mitra pilihan menerima hingga ~90%</td>
<td>Game hiper-kasual dengan daya tarik visual yang kuat</td>
</tr>
<tr>
<td>QQ</td>
<td>Besar, lebih muda</td>
<td>Sosial, ekosistem Tencent</td>
<td>Ketentuan Tencent</td>
<td>Audiens remaja dan pelajar</td>
</tr>
<tr>
<td>4399</td>
<td>Basis pemain kasual yang besar</td>
<td>Penelusuran portal</td>
<td>Ketentuan portal</td>
<td>Game kasual yang sederhana</td>
</tr>
<tr>
<td>Kuaishou</td>
<td>Terus tumbuh</td>
<td>Video pendek algoritmis</td>
<td>Dinegosiasikan</td>
<td>Jangkauan kota lapis bawah dan wilayah pedesaan</td>
</tr>
<tr>
<td>Alipay / Meituan</td>
<td>Sangat besar, masih awal untuk game</td>
<td>Penempatan di aplikasi transaksional</td>
<td>Ketentuan tahap awal</td>
<td>Taruhan ceruk, posisi sebagai pelopor</td>
</tr>
</tbody>
</table>
<p>Jumlah pemain dan ketentuan berubah mengikuti kondisi pasar dan promosi, jadi anggap data ini sebagai gambaran umum medan persaingan, bukan angka yang tetap.</p>
<h2 id="cara-memilih" tabindex="-1">Cara memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara memilih&quot;"></a></h2>
<p>Sesuaikan platform dengan cara game Anda ditemukan, bukan hanya dengan ukuran platform tersebut.</p>
<p>Jika game Anda membuat pemain kembali membukanya dan terdorong untuk membagikannya, WeChat adalah tempat retensi berubah menjadi pertumbuhan. Jika game tersebut merupakan judul hiper-kasual yang keberhasilannya bergantung pada klip menarik, linimasa Douyin adalah mesin terkuat di pasar. Jika Anda menyasar audiens muda, QQ layak mendapatkan upaya integrasi tambahan. Jika game Anda merupakan game kasual sederhana, 4399 dan berbagai portal sejenis adalah pilihan yang sesuai. Karena lisensi dan build game dapat digunakan lintas platform, merilis di lebih dari satu platform besar biasanya menjadi pilihan standar, bukan pengecualian.</p>
<p>Hambatan terbesar di semua platform sama: game yang dimonetisasi memerlukan lisensi Tiongkok dan operator lokal sebagai pemegangnya. Hal ini dibahas dalam <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan</a>, dan berlaku untuk seluruh platform dalam tabel di atas.</p>
<h2 id="peran-cinevva" tabindex="-1">Peran Cinevva <a class="header-anchor" href="#peran-cinevva" aria-label="Permalink to &quot;Peran Cinevva&quot;"></a></h2>
<p>Tak satu pun dari platform tersebut merupakan tempat yang tepat untuk baru mencari tahu apakah game Anda menyenangkan. Lisensi, mitra lokal, dan peninjauan platform—semuanya terlalu mahal untuk dihabiskan pada ide yang belum teruji. Cinevva adalah tahap awal corong yang murah: buat game browser dalam hitungan menit, tampilkan kepada pemain sungguhan, lalu pelajari game mana yang memiliki siklus permainan khas WeChat atau daya tarik khas Douyin sebelum Anda membayar untuk memasuki pasar Tiongkok. Platform Mini Game menghargai hal yang sama dengan game web yang bagus—langsung dimainkan tanpa instalasi—jadi game yang berfungsi baik di browser pada dasarnya sudah menggunakan bahasa yang mereka pahami.</p>
<h2 id="pertanyaan-yang-sering-diajukan" tabindex="-1">Pertanyaan yang sering diajukan <a class="header-anchor" href="#pertanyaan-yang-sering-diajukan" aria-label="Permalink to &quot;Pertanyaan yang sering diajukan&quot;"></a></h2>
<h3 id="apa-saja-platform-mini-game-terbesar-di-tiongkok" tabindex="-1">Apa saja platform Mini Game terbesar di Tiongkok? <a class="header-anchor" href="#apa-saja-platform-mini-game-terbesar-di-tiongkok" aria-label="Permalink to &quot;Apa saja platform Mini Game terbesar di Tiongkok?&quot;"></a></h3>
<p>WeChat Mini Games dan Douyin Mini Games, yang bersama-sama menguasai lebih dari 90% pendapatan pasar. WeChat memiliki sekitar 500 hingga 570 juta pemain bulanan, sedangkan Douyin memiliki sekitar 170 juta dan terus tumbuh pesat.</p>
<h3 id="apakah-ada-versi-tiongkok-dari-itch-io-atau-poki" tabindex="-1">Apakah ada versi Tiongkok dari itch.io atau Poki? <a class="header-anchor" href="#apakah-ada-versi-tiongkok-dari-itch-io-atau-poki" aria-label="Permalink to &quot;Apakah ada versi Tiongkok dari itch.io atau Poki?&quot;"></a></h3>
<p>Tidak persis sama. Padanan terdekatnya adalah platform Mini Game di dalam aplikasi super seperti WeChat, Douyin, dan QQ, serta portal kasual lama seperti 4399. Penemuan game berlangsung melalui jejaring sosial dan algoritme video pendek, bukan melalui situs game mandiri.</p>
<h3 id="apakah-saya-memerlukan-build-berbeda-untuk-setiap-platform-tiongkok" tabindex="-1">Apakah saya memerlukan build berbeda untuk setiap platform Tiongkok? <a class="header-anchor" href="#apakah-saya-memerlukan-build-berbeda-untuk-setiap-platform-tiongkok" aria-label="Permalink to &quot;Apakah saya memerlukan build berbeda untuk setiap platform Tiongkok?&quot;"></a></h3>
<p>Biasanya Anda memerlukan penyesuaian khusus platform karena sistem login, iklan, dan SDK pembayaran berbeda, tetapi game inti beserta lisensinya dapat digunakan lintas platform. Engine seperti Cocos dan LayaAir dapat menargetkan beberapa platform Tiongkok dari satu proyek.</p>
<h3 id="platform-mana-yang-terbaik-untuk-game-hiper-kasual" tabindex="-1">Platform mana yang terbaik untuk game hiper-kasual? <a class="header-anchor" href="#platform-mana-yang-terbaik-untuk-game-hiper-kasual" aria-label="Permalink to &quot;Platform mana yang terbaik untuk game hiper-kasual?&quot;"></a></h3>
<p>Douyin, karena linimasa video pendeknya dapat mengirimkan gelombang viral ke game dengan daya tarik visual yang kuat, sementara ketentuan pendapatannya bagi mitra pilihan juga menguntungkan. Ohayoo, label milik Douyin, berfokus pada game hiper-kasual.</p>
<h3 id="seberapa-besar-pasar-mini-game-tiongkok" tabindex="-1">Seberapa besar pasar Mini Game Tiongkok? <a class="header-anchor" href="#seberapa-besar-pasar-mini-game-tiongkok" aria-label="Permalink to &quot;Seberapa besar pasar Mini Game Tiongkok?&quot;"></a></h3>
<p>Sekitar $7,65 miliar pada 2025, naik kurang lebih 34% dari tahun ke tahun, dengan proyeksi mendekati $20 miliar pada 2030.</p>
<BuildCta
  title="Temukan kanal Anda dengan menguji game"
  desc="Buat di browser, amati reaksi pemain, lalu pilih platform yang paling sesuai."
  prompt="Buat game menyusun objek berbasis fisika yang penuh warna dan sulit ditinggalkan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-wechat-douyin-mini-games.html">Cara Menerbitkan Game di WeChat &amp; Douyin Mini Games</a> — lisensi, peninjauan, pembagian pendapatan</li>
<li><a href="/id/guides/wechat-mini-game-engines.html">Game Engine untuk WeChat Mini Games</a> — membuat game untuk platform tersebut</li>
<li><a href="/id/guides/localize-web-game-china.html">Melokalkan Game Web untuk Tiongkok</a> — font, hosting, pembayaran</li>
<li><a href="/id/guides/publish-web-game.html">Tempat Terbaik untuk Menerbitkan Game Web</a> — peta platform Barat</li>
<li><a href="/id/guides/casual-games-trends-2026.html">Tren Game Kasual pada 2026</a> — arah perkembangan game kasual</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/china-mini-game-platforms-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Melokalkan Game Web untuk Tiongkok (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/localize-web-game-china</link>
            <guid>https://app.cinevva.com/id/guides/localize-web-game-china</guid>
            <pubDate>Fri, 10 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Hal-hal yang benar-benar diperlukan untuk membawa game web ke Tiongkok pada 2026. Bahasa Mandarin Sederhana dan font, pengajuan ICP, hosting di dalam Great Firewall, WeChat Pay dan Alipay, serta layanan pihak ketiga yang diam-diam tidak berfungsi.]]></description>
            <content:encoded><![CDATA[<h1 id="melokalkan-game-web-untuk-tiongkok-2026" tabindex="-1">Melokalkan Game Web untuk Tiongkok (2026) <a class="header-anchor" href="#melokalkan-game-web-untuk-tiongkok-2026" aria-label="Permalink to &quot;Melokalkan Game Web untuk Tiongkok (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/localize-web-game-china-hero.jpg?v=1" alt="Melokalkan game web untuk Tiongkok pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Melokalkan game web untuk Tiongkok bukan sekadar menerjemahkan. Penerjemahan adalah 10% yang mudah. Sementara itu, 90% yang sulit adalah lingkungan teknis dan hukumnya yang berbeda: font, hosting, penyedia pembayaran, dan setengah dari layanan pihak ketiga yang diam-diam Anda andalkan akan berubah atau berhenti berfungsi di perbatasan. Panduan ini adalah daftar periksa tentang hal-hal yang benar-benar harus dilakukan.</p>
<p>Jika target Anda secara khusus adalah Mini Game, baca juga <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan di WeChat dan Douyin</a>. Halaman ini membahas game web secara lebih luas, baik yang akan diterbitkan ke platform Mini Game maupun situs mandiri.</p>
<h2 id="bahasa-mandarin-sederhana-yang-dikerjakan-dengan-benar" tabindex="-1">Bahasa: Mandarin Sederhana yang dikerjakan dengan benar <a class="header-anchor" href="#bahasa-mandarin-sederhana-yang-dikerjakan-dengan-benar" aria-label="Permalink to &quot;Bahasa: Mandarin Sederhana yang dikerjakan dengan benar&quot;"></a></h2>
<p>Mulailah dengan Mandarin Sederhana (简体中文), standar tulisan di Tiongkok daratan. Mandarin Tradisional digunakan di Hong Kong dan Taiwan, dan keduanya tidak dapat dipertukarkan begitu saja. Pastikan variannya benar sebelum mengerjakan hal lain.</p>
<p>Kemudian tangani bagian-bagian yang tidak dapat diselesaikan oleh terjemahan mesin. Teks berbahasa Mandarin lebih padat daripada bahasa Inggris, sehingga UI yang disesuaikan untuk teks bahasa Inggris akan memiliki ruang kosong yang terasa janggal, dan tombol yang ukurannya dibuat untuk kata &quot;Continue&quot; terlihat aneh saat hanya berisi dua karakter. Pemenggalan baris juga bekerja secara berbeda karena tidak ada spasi di antara kata. Selain itu, nada bahasa sangat penting: terjemahan harfiah terdengar kaku bagi pemain Tiongkok, sama seperti terjemahan harfiah dari bahasa Mandarin ke bahasa Inggris terdengar kaku bagi Anda. Siapkan anggaran untuk peninjauan oleh penutur asli, bukan hanya keluaran model.</p>
<h2 id="font-jebakan-yang-tidak-diduga-siapa-pun" tabindex="-1">Font: jebakan yang tidak diduga siapa pun <a class="header-anchor" href="#font-jebakan-yang-tidak-diduga-siapa-pun" aria-label="Permalink to &quot;Font: jebakan yang tidak diduga siapa pun&quot;"></a></h2>
<p>Di sinilah sebagian besar game web Barat tersandung. Anda tidak dapat mengambil font Mandarin dari Google Fonts karena Google diblokir di Tiongkok daratan dan permintaannya langsung gagal. Halaman yang tampil indah di perangkat Anda bisa menampilkan teks rusak atau font fallback ketika dibuka dari dalam Firewall.</p>
<p>Lebih buruk lagi, ukuran font Mandarin sangat besar. Satu typeface CJK lengkap mencakup puluhan ribu glif dan dapat berukuran puluhan megabita, sehingga tidak layak untuk game web dan sama sekali mustahil digunakan dengan batas ukuran paket Mini Game. Solusinya: gunakan font sistem yang sudah tersedia di setiap perangkat, atau buat subset font yang hanya mencakup karakter yang benar-benar digunakan game Anda, lalu host sendiri. Apa pun pilihannya, host font tersebut sendiri dari dalam Tiongkok. Jangan mengandalkan CDN font eksternal.</p>
<h2 id="hosting-di-dalam-tembok-atau-lambat-di-luarnya" tabindex="-1">Hosting: di dalam tembok atau lambat di luarnya <a class="header-anchor" href="#hosting-di-dalam-tembok-atau-lambat-di-luarnya" aria-label="Permalink to &quot;Hosting: di dalam tembok atau lambat di luarnya&quot;"></a></h2>
<p>Lokasi penyajian game menentukan pengalaman pemain. Jika di-host di luar Tiongkok, setiap permintaan harus melewati pemeriksaan Great Firewall, menambah latensi yang membuat game waktu nyata terasa rusak. Jika di-host di Tiongkok daratan, game akan cepat, tetapi hosting di Tiongkok mewajibkan pengajuan ICP.</p>
<p>Pengajuan ICP (Internet Content Provider) adalah pendaftaran ke Kementerian Perindustrian dan Teknologi Informasi Tiongkok yang diwajibkan untuk setiap situs yang disajikan dari server di Tiongkok daratan. Ada dua bentuk: pengajuan dasar (备案) untuk situs nonkomersial dan lisensi ICP komersial untuk situs yang menjual, menampilkan iklan, atau menerima pembayaran, termasuk game yang dimonetisasi. Game yang beroperasi secara komersial biasanya juga memerlukan Internet Culture Business License (网络文化经营许可证). Nomor ICP harus ditampilkan di footer situs dan ditautkan ke situs arsip pemerintah. Proses pengajuan memakan waktu berminggu-minggu dan memerlukan badan usaha lokal. Ini menjadi alasan tambahan bagi studio asing untuk bekerja melalui mitra Tiongkok.</p>
<p>Namun, pengajuan ICP hanya mencakup hosting. Game yang dimonetisasi juga memerlukan persetujuan game ISBN (版号, &quot;banhao&quot;), yang hanya dapat diperoleh melalui penerbit Tiongkok berlisensi. <a href="/id/guides/publish-wechat-douyin-mini-games.html">Panduan penerbitan di WeChat dan Douyin</a> kami menjelaskan seluruh alur perizinannya.</p>
<p>Pengajuan tersebut bukan sekadar birokrasi. Inilah kunci yang membuka akses ke hal-hal lain: hosting lokal, CDN Tiongkok untuk pengiriman cepat ke seluruh negeri, dan integrasi pembayaran.</p>
<h2 id="pembayaran-wechat-pay-dan-alipay-bukan-stripe" tabindex="-1">Pembayaran: WeChat Pay dan Alipay, bukan Stripe <a class="header-anchor" href="#pembayaran-wechat-pay-dan-alipay-bukan-stripe" aria-label="Permalink to &quot;Pembayaran: WeChat Pay dan Alipay, bukan Stripe&quot;"></a></h2>
<p>Pemain Tiongkok tidak menggunakan kartu dan dompet digital yang digunakan di negara lain. Pembayaran dilakukan melalui WeChat Pay dan Alipay, tanpa pengecualian. Stripe, PayPal, dan alur pembayaran kartu Barat bukanlah jawabannya. Integrasi WeChat Pay atau Alipay memerlukan hosting lokal dan lisensi ICP. Jadi, pembayaran, hosting, dan pengajuan merupakan satu masalah yang saling terhubung, bukan tiga masalah terpisah. Rencanakan semuanya bersama-sama.</p>
<h2 id="layanan-yang-diam-diam-tidak-berfungsi" tabindex="-1">Layanan yang diam-diam tidak berfungsi <a class="header-anchor" href="#layanan-yang-diam-diam-tidak-berfungsi" aria-label="Permalink to &quot;Layanan yang diam-diam tidak berfungsi&quot;"></a></h2>
<p>Bug paling menyakitkan dalam peluncuran di Tiongkok adalah bug yang baru muncul saat pemain dari dalam Firewall memuat game. Apa pun yang diambil game Anda dari layanan yang diblokir akan gagal, sering kali tanpa pesan, bahkan setelah hosting dan pengajuan Anda sudah benar. Korban yang paling umum:</p>
<p>Google Fonts, Google Analytics, dan segala layanan Google lainnya. Diblokir. Ganti dengan font yang di-host sendiri dan penyedia analitik domestik.</p>
<p>YouTube dan video tersemat dari hosting Barat. Diblokir. Gunakan hosting video domestik jika Anda menyematkan trailer.</p>
<p>Facebook, Twitter, serta SDK dan tombol berbagi milik keduanya. Diblokir. Ganti dengan fitur berbagi melalui WeChat dan Weibo.</p>
<p>CDN eksternal dan hosting skrip yang mungkin luput dari perhatian Anda. Sebagian berfungsi, tetapi banyak yang tidak. Audit setiap URL pihak ketiga yang dimuat game Anda dan anggap semuanya bermasalah sampai terbukti dapat diakses.</p>
<p>Aturannya: jika sumber daya disajikan oleh perusahaan yang diblokir di Tiongkok, sumber daya tersebut akan gagal bagi pemain Tiongkok terlepas dari seberapa benar bagian lain dari penyiapan Anda. Host sendiri atau cari padanan domestik untuk setiap dependensi.</p>
<h2 id="peninjauan-konten" tabindex="-1">Peninjauan konten <a class="header-anchor" href="#peninjauan-konten" aria-label="Permalink to &quot;Peninjauan konten&quot;"></a></h2>
<p>Tiongkok meninjau konten game, dan standarnya berbeda dari platform Barat. Tema, gambar, dan teks yang lolos di tempat lain dapat ditandai. Di sinilah penerbit lokal layak mendapatkan bagiannya, karena mereka memahami batasannya dan dapat melakukan peninjauan sebelum pengajuan, bukan setelah terjadi penolakan. Masukkan tahap peninjauan ke linimasa Anda, alih-alih menganggapnya sebagai formalitas di akhir proses.</p>
<h2 id="daftar-periksa-pelokalan" tabindex="-1">Daftar periksa pelokalan <a class="header-anchor" href="#daftar-periksa-pelokalan" aria-label="Permalink to &quot;Daftar periksa pelokalan&quot;"></a></h2>
<p>Terjemahkan ke Mandarin Sederhana dan lakukan peninjauan nada bahasa oleh penutur asli, bukan hanya mengandalkan hasil terjemahan mesin.</p>
<p>Sesuaikan UI untuk teks yang lebih padat dan aturan pemenggalan baris yang berbeda.</p>
<p>Host sendiri font subset atau gunakan font sistem. Jangan pernah memuat font Mandarin dari CDN yang diblokir.</p>
<p>Tentukan hosting: gunakan hosting lokal dengan pengajuan ICP demi kecepatan dan pembayaran, atau terima lambatnya hosting luar negeri.</p>
<p>Integrasikan WeChat Pay dan Alipay untuk segala hal yang dimonetisasi.</p>
<p>Audit setiap sumber daya pihak ketiga dan ganti yang diblokir.</p>
<p>Rencanakan peninjauan konten bersama mitra lokal.</p>
<h2 id="peran-cinevva" tabindex="-1">Peran Cinevva <a class="header-anchor" href="#peran-cinevva" aria-label="Permalink to &quot;Peran Cinevva&quot;"></a></h2>
<p>Versi jujurnya: game adalah bagian yang portabel, sedangkan lapisan Tiongkok berkaitan dengan distribusi dan kepatuhan. Cinevva membuat game web-native yang langsung berjalan melalui tautan tanpa instalasi, sesuai dengan format yang diinginkan platform Tiongkok. Namun, kami tidak akan berpura-pura bahwa pengajuan ICP, penerbit lokal, atau integrasi pembayaran dapat dihilangkan oleh sebuah alat. Bagian yang kami buat lebih murah adalah tahap sebelum semua itu. Buat game Anda, buktikan bahwa game tersebut layak dilokalkan, dan baru belanjakan dana untuk infrastruktur Tiongkok setelah Anda tahu game itu memang pantas mendapatkannya. Sebagian besar game tidak perlu melewati daftar periksa tersebut. Namun, game yang memang perlu melaluinya layak dikerjakan dengan benar.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan umum&quot;"></a></h2>
<h3 id="apakah-saya-memerlukan-lisensi-icp-untuk-menjalankan-game-web-di-tiongkok" tabindex="-1">Apakah saya memerlukan lisensi ICP untuk menjalankan game web di Tiongkok? <a class="header-anchor" href="#apakah-saya-memerlukan-lisensi-icp-untuk-menjalankan-game-web-di-tiongkok" aria-label="Permalink to &quot;Apakah saya memerlukan lisensi ICP untuk menjalankan game web di Tiongkok?&quot;"></a></h3>
<p>Untuk hosting di Tiongkok daratan, ya. Situs nonkomersial memerlukan pengajuan ICP dasar (备案); situs komersial yang menjual, menampilkan iklan, atau menerima pembayaran memerlukan lisensi ICP komersial, dan game yang dimonetisasi biasanya juga memerlukan Internet Culture Business License. Hosting di luar Tiongkok menghindari pengajuan tersebut, tetapi membuat game lambat saat melewati Great Firewall.</p>
<h3 id="mengapa-font-saya-tidak-berfungsi-di-tiongkok" tabindex="-1">Mengapa font saya tidak berfungsi di Tiongkok? <a class="header-anchor" href="#mengapa-font-saya-tidak-berfungsi-di-tiongkok" aria-label="Permalink to &quot;Mengapa font saya tidak berfungsi di Tiongkok?&quot;"></a></h3>
<p>Hampir selalu karena Anda memuatnya dari Google Fonts atau CDN lain yang diblokir, sehingga permintaannya gagal di dalam Firewall. Ukuran font Mandarin juga sangat besar. Solusinya adalah membuat subset font yang hanya berisi glif yang Anda gunakan dan meng-host-nya sendiri, atau mengandalkan font sistem perangkat.</p>
<h3 id="dapatkah-saya-menggunakan-stripe-atau-paypal-untuk-game-di-tiongkok" tabindex="-1">Dapatkah saya menggunakan Stripe atau PayPal untuk game di Tiongkok? <a class="header-anchor" href="#dapatkah-saya-menggunakan-stripe-atau-paypal-untuk-game-di-tiongkok" aria-label="Permalink to &quot;Dapatkah saya menggunakan Stripe atau PayPal untuk game di Tiongkok?&quot;"></a></h3>
<p>Tidak. Pemain Tiongkok membayar menggunakan WeChat Pay dan Alipay. Integrasi keduanya memerlukan hosting lokal dan lisensi ICP. Jadi, pembayaran, hosting, dan pengajuan merupakan satu proyek yang saling terhubung.</p>
<h3 id="layanan-pihak-ketiga-apa-yang-tidak-berfungsi-di-tiongkok" tabindex="-1">Layanan pihak ketiga apa yang tidak berfungsi di Tiongkok? <a class="header-anchor" href="#layanan-pihak-ketiga-apa-yang-tidak-berfungsi-di-tiongkok" aria-label="Permalink to &quot;Layanan pihak ketiga apa yang tidak berfungsi di Tiongkok?&quot;"></a></h3>
<p>Apa pun dari perusahaan yang diblokir di negara tersebut: Google (Fonts, Analytics), YouTube, SDK Facebook dan Twitter, serta banyak CDN eksternal. Audit setiap URL yang dimuat game Anda dan ganti URL yang diblokir dengan aset yang di-host sendiri atau penyedia domestik.</p>
<h3 id="apakah-menerjemahkan-ke-bahasa-mandarin-sudah-cukup-untuk-melokalkan-game" tabindex="-1">Apakah menerjemahkan ke bahasa Mandarin sudah cukup untuk melokalkan game? <a class="header-anchor" href="#apakah-menerjemahkan-ke-bahasa-mandarin-sudah-cukup-untuk-melokalkan-game" aria-label="Permalink to &quot;Apakah menerjemahkan ke bahasa Mandarin sudah cukup untuk melokalkan game?&quot;"></a></h3>
<p>Tidak. Penerjemahan hanyalah sebagian kecil dari prosesnya. Anda juga harus menangani teks yang lebih padat dan pemenggalan baris, font yang di-host sendiri, hosting lokal dan pengajuan, pembayaran lokal, layanan pihak ketiga yang diblokir, serta peninjauan konten. Bahasa adalah lapisan yang mudah.</p>
<BuildCta
  title="Buat gamenya terlebih dahulu, lalu lokalkan yang terbukti layak"
  desc="Buat game web-native dalam hitungan menit dan buktikan potensinya sebelum Anda berinvestasi dalam infrastruktur Tiongkok."
  prompt="Buat game bertani yang nyaman dengan siklus siang dan malam" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-wechat-douyin-mini-games.html">Cara Menerbitkan Game di WeChat &amp; Douyin Mini Games</a> — lisensi, peninjauan, bagi hasil</li>
<li><a href="/id/guides/china-mini-game-platforms.html">Perbandingan Platform Mini-Game &amp; HTML5 Tiongkok</a> — tempat mendistribusikan game</li>
<li><a href="/id/guides/wechat-mini-game-engines.html">Game Engine untuk WeChat Mini Games</a> — buat game untuk platformnya</li>
<li><a href="/id/guides/publish-web-game.html">Tempat Terbaik untuk Menerbitkan Game Web</a> — lanskap platform Barat</li>
<li><a href="/id/guides/publish-web-game.html">Cara Menerbitkan Game Web</a> — terbitkan game di mana saja terlebih dahulu</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/localize-web-game-china-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Menerbitkan Game Mini di WeChat & Douyin (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/publish-wechat-douyin-mini-games</link>
            <guid>https://app.cinevva.com/id/guides/publish-wechat-douyin-mini-games</guid>
            <pubDate>Fri, 10 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Alur nyata untuk menerbitkan Game Mini di Tiongkok pada 2026. Lisensi ISBN/banhao, alasan studio asing membutuhkan penerbit lokal, pembagian pendapatan WeChat vs Douyin, dan perbedaan sebenarnya antara kedua platform.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-menerbitkan-game-mini-di-wechat-douyin-2026" tabindex="-1">Cara Menerbitkan Game Mini di WeChat &amp; Douyin (2026) <a class="header-anchor" href="#cara-menerbitkan-game-mini-di-wechat-douyin-2026" aria-label="Permalink to &quot;Cara Menerbitkan Game Mini di WeChat &amp; Douyin (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/publish-wechat-douyin-mini-games-hero.jpg?v=1" alt="Menerbitkan Game Mini di WeChat dan Douyin pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Pasar Game Mini Tiongkok menghasilkan sekitar $7,65 miliar pada 2025, naik sekitar 34% dari tahun sebelumnya, dan diperkirakan akan mendekati $20 miliar pada 2030. Lebih dari 90% pasar tersebut dikuasai oleh dua platform: Game Mini WeChat dan Game Mini Douyin. Jika Anda telah membuat sebuah game dan ingin mencoba memasuki pasar tersebut, inilah alur yang benar-benar harus Anda tempuh. Tantangannya bukan hanya soal game, tetapi lebih pada perizinan, mitra lokal, dan pemilihan platform yang tepat.</p>
<p>Jika Anda belum memilih engine, mulailah dengan <a href="/id/guides/wechat-mini-game-engines.html">engine game untuk Game Mini WeChat</a>. Panduan ini mengasumsikan bahwa Anda sudah memiliki build dan membahas cara menerbitkan serta memperoleh pendapatan darinya.</p>
<h2 id="lisensi-adalah-gerbang-utama" tabindex="-1">Lisensi adalah gerbang utama <a class="header-anchor" href="#lisensi-adalah-gerbang-utama" aria-label="Permalink to &quot;Lisensi adalah gerbang utama&quot;"></a></h2>
<p>Setiap game yang didistribusikan di Tiongkok, mulai dari judul konsol AAA hingga Game Mini yang berjalan di dalam aplikasi perpesanan, berada di bawah rezim perizinan yang sama. Ada dua dokumen penting.</p>
<p>Hak cipta perangkat lunak (软著) adalah dokumen yang lebih mudah diperoleh, berupa pendaftaran kepengarangan. Dokumen yang menentukan kelangsungan bisnis Anda adalah ISBN, atau 版号 (banhao), yaitu lisensi penerbitan yang dikeluarkan oleh regulator. Dalam praktiknya, Game Mini yang menerima pembayaran dalam aplikasi membutuhkan banhao. Game gratis atau yang hanya mengandalkan iklan secara historis memiliki jalur yang lebih ringan, tetapi peraturannya makin ketat seiring waktu. Asumsi paling aman adalah bahwa monetisasi yang serius pada akhirnya akan membutuhkan lisensi tersebut.</p>
<p>Inilah bagian yang menghentikan langkah sebagian besar studio asing: hanya badan usaha Tiongkok yang disetujui yang dapat memegang lisensi dan mengoperasikan game yang dimonetisasi. Anda tidak dapat memperoleh banhao sebagai perusahaan asing. Anda harus menerbitkan melalui operator Tiongkok berlisensi yang memegang lisensi, menangani pembayaran, dan mengambil bagian pendapatan. Ini bukan sekadar formalitas yang dapat diakali. Beginilah struktur pasarnya.</p>
<p>Kabar baiknya: <a href="/id/news/2026-01-06-china-game-approvals-2025.html">Tiongkok menyetujui 1.771 game pada 2025</a>, jumlah terbanyak sejak 2018, dan ritme persetujuan bulanannya stabil. Alur yang dahulu dapat terhenti tanpa terduga kini kembali berjalan dengan konsisten, sehingga perencanaan menjadi jauh lebih memungkinkan dibandingkan beberapa tahun lalu.</p>
<h2 id="yang-sebenarnya-perlu-dilakukan-studio-asing" tabindex="-1">Yang sebenarnya perlu dilakukan studio asing <a class="header-anchor" href="#yang-sebenarnya-perlu-dilakukan-studio-asing" aria-label="Permalink to &quot;Yang sebenarnya perlu dilakukan studio asing&quot;"></a></h2>
<p>Urutan yang realistis kurang lebih seperti ini.</p>
<p>Cari penerbit atau operator Tiongkok. Ini adalah keputusan yang menopang seluruh proses. Mereka memegang lisensi, menangani pengajuan banhao, mengintegrasikan pembayaran, dan sering kali membantu peninjauan budaya serta hubungan dengan platform. Besarnya bagian yang mereka ambil dan kompetensi mereka adalah dua faktor yang menentukan keberhasilan atau kegagalan kesepakatan.</p>
<p>Daftarkan akun Game Mini. Akun yang melakukan monetisasi harus didukung oleh badan usaha Tiongkok, yang dalam praktiknya adalah badan usaha milik penerbit Anda, bukan milik Anda.</p>
<p>Buat build untuk platform tersebut. Kemas game dengan engine dan adaptor yang tepat, pastikan ukurannya berada di bawah batas paket awal, lalu integrasikan SDK login, iklan, dan pembayaran platform.</p>
<p>Ajukan untuk ditinjau. Setiap Game Mini harus melewati peninjauan platform sebelum tersedia untuk publik, di samping proses perizinan. Konten yang tidak bermasalah di tempat lain bisa saja ditandai, jadi makin awal penerbit Anda meninjaunya, makin sedikit kejutan yang akan muncul.</p>
<p>Luncurkan dan lakukan iterasi. Kedua platform memberikan keuntungan bagi game yang menjalankan operasi langsung, acara, dan pembaruan. Game Mini adalah sebuah layanan, bukan produk yang cukup dirilis satu kali.</p>
<h2 id="wechat-vs-douyin-dua-mesin-yang-berbeda" tabindex="-1">WeChat vs Douyin: dua mesin yang berbeda <a class="header-anchor" href="#wechat-vs-douyin-dua-mesin-yang-berbeda" aria-label="Permalink to &quot;WeChat vs Douyin: dua mesin yang berbeda&quot;"></a></h2>
<p>Kedua platform besar ini tidak dapat dipertukarkan begitu saja. Keduanya menjangkau pemain dengan cara yang berlawanan, dan hal tersebut menentukan jenis game yang berhasil di masing-masing platform.</p>
<p>Game Mini WeChat adalah raksasa dengan sekitar 500 hingga 570 juta pemain bulanan. Penemuan game berjalan melalui jejaring sosial: berbagi antarteman, obrolan grup, dan kesan bahwa semua orang sudah memainkannya. Retensi dan rekomendasi dari mulut ke mulut adalah penggeraknya. Pembagian pendapatan WeChat bergantung pada modelnya. Untuk iklan dalam game, pembagiannya adalah 50/50. Untuk pembelian dalam aplikasi, pengembang biasanya memperoleh sekitar 60% dan WeChat mengambil 40%, sedangkan judul yang diterbitkan langsung melalui WeChat dapat memperoleh hingga 70%. WeChat menguntungkan game yang terus dimainkan kembali dan diceritakan kepada teman.</p>
<p>Game Mini Douyin lebih kecil, dengan sekitar 170 juta pemain bulanan, tetapi pertumbuhannya sangat pesat. Pada 2025, pendapatannya naik sekitar 100% dan jumlah penggunanya meningkat sekitar 120% dari tahun sebelumnya. Cara penemuannya berlawanan dengan WeChat: bersifat algoritmik dan digerakkan oleh video pendek. Cuplikan game Anda menjadi viral di feed lalu mendatangkan gelombang pemain. Douyin juga gencar menarik pengembang dengan mengizinkan sejumlah mitra pilihan memperoleh hingga 90% pendapatan, sementara label Ohayoo miliknya membantu menerbitkan dan memonetisasi judul hiper-kasual. Douyin menguntungkan game yang terlihat tak tertahankan dalam video berdurasi lima detik.</p>
<p>Kesimpulan praktisnya: game yang berfokus pada retensi dan mudah dibagikan secara sosial lebih cocok untuk WeChat. Game hiper-kasual dengan daya tarik visual yang kuat lebih cocok untuk Douyin. Banyak studio merilis game di keduanya karena lisensi dan build dapat digunakan kembali, sementara audiens kedua platform hampir tidak tumpang tindih.</p>
<h2 id="gambaran-singkat-pembagian-pendapatan" tabindex="-1">Gambaran singkat pembagian pendapatan <a class="header-anchor" href="#gambaran-singkat-pembagian-pendapatan" aria-label="Permalink to &quot;Gambaran singkat pembagian pendapatan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Platform</th>
<th>Iklan dalam game</th>
<th>Pembelian dalam aplikasi</th>
<th>Catatan</th>
</tr>
</thead>
<tbody>
<tr>
<td>WeChat</td>
<td>~50/50</td>
<td>Pengembang memperoleh ~60% (hingga 70% secara langsung)</td>
<td>Penemuan sosial, jangkauan sangat luas, berfokus pada retensi</td>
</tr>
<tr>
<td>Douyin</td>
<td>Menguntungkan, melalui negosiasi</td>
<td>Mitra pilihan memperoleh hingga ~90%</td>
<td>Penemuan melalui video algoritmik, ketentuan agresif bagi pengembang, Ohayoo untuk game hiper-kasual</td>
</tr>
</tbody>
</table>
<p>Angka-angka tersebut dapat berubah mengikuti promosi dan status mitra, jadi anggaplah ini sebagai gambaran struktur kesepakatan, bukan kontrak. Bagian penerbit Anda diambil setelah bagian platform, sehingga memilih operator yang tepat sama pentingnya dengan memilih platform yang tepat.</p>
<h2 id="peran-cinevva" tabindex="-1">Peran Cinevva <a class="header-anchor" href="#peran-cinevva" aria-label="Permalink to &quot;Peran Cinevva&quot;"></a></h2>
<p>Cinevva tidak menerbitkan game Anda ke WeChat atau Douyin, dan kami tidak akan berpura-pura bahwa lapisan perizinannya lebih sederhana daripada kenyataannya. Penerbit lokal dan banhao adalah biaya nyata untuk memasuki Tiongkok. Cinevva memberi Anda cara semurah mungkin untuk mengetahui apakah sebuah game layak melalui seluruh proses tersebut: buat game browser dalam hitungan menit, tampilkan kepada pemain, lalu lihat apakah game itu memiliki daya tarik yang mampu menonjol dalam cuplikan Douyin atau siklus permainan yang membuat pemain membukanya kembali di WeChat. Buktikan terlebih dahulu potensi game Anda di web terbuka. Setelah itu, bawa game yang berhasil melalui alur penerbitan di Tiongkok.</p>
<h2 id="pertanyaan-yang-sering-diajukan" tabindex="-1">Pertanyaan yang sering diajukan <a class="header-anchor" href="#pertanyaan-yang-sering-diajukan" aria-label="Permalink to &quot;Pertanyaan yang sering diajukan&quot;"></a></h2>
<h3 id="apakah-saya-memerlukan-isbn-banhao-untuk-menerbitkan-game-mini-di-tiongkok" tabindex="-1">Apakah saya memerlukan ISBN (banhao) untuk menerbitkan Game Mini di Tiongkok? <a class="header-anchor" href="#apakah-saya-memerlukan-isbn-banhao-untuk-menerbitkan-game-mini-di-tiongkok" aria-label="Permalink to &quot;Apakah saya memerlukan ISBN (banhao) untuk menerbitkan Game Mini di Tiongkok?&quot;"></a></h3>
<p>Jika game menerima pembayaran dalam aplikasi, pada dasarnya ya. Game Mini gratis atau yang hanya mengandalkan iklan pernah memiliki jalur yang lebih ringan, tetapi game yang dimonetisasi membutuhkan lisensi penerbitan, dan hanya badan usaha Tiongkok yang disetujui yang dapat memegangnya.</p>
<h3 id="bisakah-pengembang-asing-menerbitkan-langsung-ke-game-mini-wechat" tabindex="-1">Bisakah pengembang asing menerbitkan langsung ke Game Mini WeChat? <a class="header-anchor" href="#bisakah-pengembang-asing-menerbitkan-langsung-ke-game-mini-wechat" aria-label="Permalink to &quot;Bisakah pengembang asing menerbitkan langsung ke Game Mini WeChat?&quot;"></a></h3>
<p>Tidak untuk game yang dimonetisasi. Studio asing menerbitkan melalui operator Tiongkok berlisensi yang memegang lisensi, menangani pembayaran, dan mengambil bagian pendapatan. Menemukan penerbit lokal yang tepat adalah keputusan utama.</p>
<h3 id="mana-yang-membayar-lebih-besar-wechat-atau-douyin" tabindex="-1">Mana yang membayar lebih besar, WeChat atau Douyin? <a class="header-anchor" href="#mana-yang-membayar-lebih-besar-wechat-atau-douyin" aria-label="Permalink to &quot;Mana yang membayar lebih besar, WeChat atau Douyin?&quot;"></a></h3>
<p>Itu bergantung pada model dan status kemitraan Anda. WeChat membagi pendapatan iklan sekitar 50/50 dan memungkinkan pengembang memperoleh sekitar 60 hingga 70% dari pembelian. Douyin menawarkan hingga sekitar 90% kepada sejumlah mitra pilihan. Ketentuan Douyin bisa lebih menguntungkan, tetapi jangkauan WeChat jauh lebih luas.</p>
<h3 id="apa-perbedaan-antara-game-mini-wechat-dan-douyin" tabindex="-1">Apa perbedaan antara Game Mini WeChat dan Douyin? <a class="header-anchor" href="#apa-perbedaan-antara-game-mini-wechat-dan-douyin" aria-label="Permalink to &quot;Apa perbedaan antara Game Mini WeChat dan Douyin?&quot;"></a></h3>
<p>Penemuan di WeChat bersifat sosial, digerakkan oleh aktivitas berbagi antarteman dan grup, serta mengutamakan retensi. Penemuan di Douyin bersifat algoritmik, digerakkan oleh video pendek, dan menguntungkan game yang tampak menarik dalam sebuah cuplikan. WeChat lebih besar, sedangkan Douyin tumbuh lebih cepat.</p>
<h3 id="seberapa-besar-pasar-game-mini-tiongkok" tabindex="-1">Seberapa besar pasar Game Mini Tiongkok? <a class="header-anchor" href="#seberapa-besar-pasar-game-mini-tiongkok" aria-label="Permalink to &quot;Seberapa besar pasar Game Mini Tiongkok?&quot;"></a></h3>
<p>Sekitar $7,65 miliar pada 2025, naik sekitar 34% dari tahun sebelumnya, dengan proyeksi mendekati $20 miliar pada 2030. WeChat dan Douyin bersama-sama menguasai lebih dari 90% pasar tersebut.</p>
<BuildCta
  title="Buktikan potensi game sebelum membayar seluruh prosesnya"
  desc="Buat versi browser dalam hitungan menit dan uji daya tariknya sebelum berkomitmen meluncurkannya di Tiongkok."
  prompt="Buat puzzle merge yang memuaskan dengan efek penggabungan yang menarik" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/wechat-mini-game-engines.html">Engine Game untuk Game Mini WeChat</a> — pilih engine sebelum menerbitkan</li>
<li><a href="/id/guides/china-mini-game-platforms.html">Perbandingan Platform Game Mini &amp; HTML5 Tiongkok</a> — pilihan di luar dua platform terbesar</li>
<li><a href="/id/guides/localize-web-game-china.html">Melokalkan Game Web untuk Tiongkok</a> — font, hosting, pembayaran, dan Tembok Api Besar</li>
<li><a href="/id/guides/publish-web-game.html">Tempat Terbaik untuk Menerbitkan Game Web</a> — lanskap distribusi Barat</li>
<li><a href="/id/guides/promote-indie-game-no-budget.html">Cara Mempromosikan Game Indie Tanpa Anggaran</a> — bangun audiens yang membuat peluncuran berhasil</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/publish-wechat-douyin-mini-games-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Engine Game untuk WeChat Mini Games (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/wechat-mini-game-engines</link>
            <guid>https://app.cinevva.com/id/guides/wechat-mini-game-engines</guid>
            <pubDate>Fri, 10 Jul 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Engine mana yang sebaiknya digunakan untuk WeChat Mini Games pada 2026. Cocos Creator, LayaAir, Egret, transformasi WebGL Unity, dan engine Tuanjie dari Unity China, dibandingkan berdasarkan batas paket 4 MB, plugin engine bawaan, serta cara memindahkan game web yang sudah ada.]]></description>
            <content:encoded><![CDATA[<h1 id="engine-game-untuk-wechat-mini-games-2026" tabindex="-1">Engine Game untuk WeChat Mini Games (2026) <a class="header-anchor" href="#engine-game-untuk-wechat-mini-games-2026" aria-label="Permalink to &quot;Engine Game untuk WeChat Mini Games (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/wechat-mini-game-engines-hero.jpg?v=1" alt="Engine game untuk WeChat Mini Games pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>WeChat Mini Games (微信小游戏) adalah platform game terbesar yang belum pernah dijadikan target rilis oleh sebagian besar developer Barat. Lebih dari 500 juta orang memainkannya setiap bulan, di dalam aplikasi yang sama yang mereka gunakan untuk berkirim pesan dengan teman dan membayar makan siang. Tidak perlu instalasi, toko aplikasi, atau layar unduhan. Pemain mengetuk sebuah tautan dan game langsung berjalan.</p>
<p>Masalahnya, Mini Game bukanlah game web biasa. Game berjalan di dalam sandbox JavaScript tanpa DOM dan HTML, menggunakan canvas khusus yang disediakan platform, dan paket pertama Anda tidak boleh melebihi 4 MB. Engine yang Anda pilih menentukan seberapa banyak masalah tersebut harus Anda tangani sendiri. Panduan ini membandingkan opsi yang benar-benar tersedia pada 2026.</p>
<p>Jika Anda terlebih dahulu ingin memilih engine browser secara umum, <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web</a> kami mencakup pilihan yang lebih luas. Halaman ini hanya membahas engine yang dapat merilis game ke WeChat.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Engine</th>
<th>Plugin WeChat bawaan?</th>
<th>2D/3D</th>
<th>Bahasa</th>
<th>Kondisi ukuran paket</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Cocos Creator</strong></td>
<td>Ya, tertanam di klien WeChat</td>
<td>2D + 3D</td>
<td>TypeScript</td>
<td>Terbaik: engine tidak dihitung dalam batas 4 MB, ditambah subpaket AssetBundle</td>
<td>Proyek yang mengutamakan WeChat tanpa kode yang sudah ada (pilihan standar)</td>
</tr>
<tr>
<td><strong>LayaAir</strong></td>
<td>Tidak</td>
<td>2D + 3D</td>
<td>TypeScript</td>
<td>Engine menghabiskan anggaran paket; cukup untuk game 2D kecil, tetapi sempit untuk 3D</td>
<td>Tim yang lebih menyukai alur kerja Laya</td>
</tr>
<tr>
<td><strong>Egret</strong></td>
<td>Tidak</td>
<td>2D</td>
<td>—</td>
<td>Lawas, ekosistem terus menyusut</td>
<td>Hanya untuk memelihara game Egret yang sudah ada</td>
</tr>
<tr>
<td><strong>Unity (transformasi WebGL)</strong></td>
<td>Tidak, menggunakan SDK transformasi</td>
<td>2D + 3D</td>
<td>C#</td>
<td>Sangat berat: build WebGL berukuran besar, jadi bersiaplah melakukan stripping dan pembagian subpaket secara agresif</td>
<td>Memindahkan game Unity yang sudah ada dengan cepat</td>
</tr>
<tr>
<td><strong>Tuanjie (Unity China)</strong></td>
<td>Tidak, WeChat merupakan target ekspor native</td>
<td>2D + 3D</td>
<td>C#</td>
<td>Target native, menghindari pembengkakan akibat konversi WebGL</td>
<td>Studio yang berkomitmen pada pasar Tiongkok dan memiliki keahlian Unity</td>
</tr>
<tr>
<td><strong>Three.js / WebGL mentah</strong></td>
<td>Tidak, melalui <code>weapp-adapter</code></td>
<td>2D + 3D</td>
<td>JavaScript</td>
<td>Anda harus menangani subpaket sendiri; cocok untuk game kecil yang sensitif terhadap ukuran</td>
<td>Game kustom kecil atau tim yang sudah menggunakan Three.js</td>
</tr>
</tbody>
</table>
<h2 id="hal-yang-membedakan-wechat-mini-game" tabindex="-1">Hal yang membedakan WeChat Mini Game <a class="header-anchor" href="#hal-yang-membedakan-wechat-mini-game" aria-label="Permalink to &quot;Hal yang membedakan WeChat Mini Game&quot;"></a></h2>
<p>Sebelum pilihan engine dapat dipahami, ada tiga batasan penting.</p>
<p>Tidak ada DOM. Runtime Mini Game merupakan lingkungan JavaScript dasar dengan <code>canvas</code> dan konteks WebGL (serta semakin sering WebGPU), ditambah API milik WeChat untuk penyimpanan, audio, jaringan, dan fitur sosial. Apa pun yang bergantung pada <code>document</code>, <code>window</code>, atau elemen HTML harus melewati adapter yang memalsukan objek-objek tersebut. Setiap engine di bawah ini menyediakan adapter tersebut.</p>
<p>Aturan 4 MB adalah inti dari semuanya. Paket awal Anda—kode dan aset yang dimuat sebelum frame pertama—harus muat dalam 4 MB. Selebihnya harus dibagi menjadi subpaket (分包) yang diunduh sesuai kebutuhan, hingga mencapai batas total yang jauh lebih besar. Menurunkan ukuran hingga di bawah 4 MB adalah masalah rekayasa tersulit di platform ini, dan inilah faktor utama yang dapat dipermudah atau justru dipersulit oleh engine Anda.</p>
<p>Monetisasi memerlukan lisensi. Mini Game yang menerima pembayaran dalam aplikasi membutuhkan lisensi game Tiongkok, dan studio asing memerlukan penerbit lokal untuk mendapatkannya. Itu adalah masalah distribusi, bukan masalah engine, dan kami membahasnya dalam <a href="/id/guides/publish-wechat-douyin-mini-games.html">panduan penerbitan WeChat dan Douyin</a>.</p>
<h2 id="cocos-creator-pilihan-standar" tabindex="-1">Cocos Creator: pilihan standar <a class="header-anchor" href="#cocos-creator-pilihan-standar" aria-label="Permalink to &quot;Cocos Creator: pilihan standar&quot;"></a></h2>
<p>Sebagian besar WeChat Mini Games dibuat dengan Cocos Creator, dan platform ini memang dirancang untuk menguntungkannya. Sejak klien WeChat 7.0.7, runtime engine Cocos tersedia sebagai plugin yang tertanam langsung di aplikasi WeChat. Jika pemain pernah menjalankan Mini Game berbasis Cocos, kode engine sudah ada di ponselnya dan tidak dihitung dalam batas 4 MB Anda. Ini merupakan keunggulan struktural yang tidak dimiliki engine lain: paket Anda hanya berisi game, bukan game beserta engine-nya.</p>
<p>Cocos juga menyediakan sistem AssetBundle, yang merupakan cara paling praktis untuk menangani subpaket. Anda menandai bundle agar dimuat sesuai kebutuhan, dan perbedaan antara proyek yang muat dalam 4 MB dan yang tidak biasanya hanya soal memindahkan bundle yang tepat keluar dari paket utama. Cocos mendukung 2D dan 3D, menggunakan TypeScript, dan panel build-nya memperlakukan WeChat sebagai platform kelas utama.</p>
<p>Jika Anda belum memiliki basis kode dan membangun untuk WeChat sejak awal, Cocos Creator adalah pilihan aman. Mulailah dari sini kecuali Anda memiliki alasan khusus untuk memilih yang lain.</p>
<h2 id="layaair-alternatif-yang-kuat" tabindex="-1">LayaAir: alternatif yang kuat <a class="header-anchor" href="#layaair-alternatif-yang-kuat" aria-label="Permalink to &quot;LayaAir: alternatif yang kuat&quot;"></a></h2>
<p>LayaAir (dari Laya) adalah engine lain yang sejak awal beradaptasi dengan WeChat dan memperlakukannya sebagai target kelas utama. Anda cukup memilih WeChat Mini Game di panel build, lalu menerbitkannya. Engine ini mendukung 2D dan 3D, menggunakan TypeScript, serta memiliki basis developer setia yang lebih menyukai alur kerjanya dibandingkan Cocos. Developer yang pernah menggunakan keduanya cenderung menggambarkan pilihan tersebut sebagai masalah selera, bukan kemampuan.</p>
<p>Satu hal yang perlu dipertimbangkan: runtime engine LayaAir tidak tertanam dalam klien WeChat seperti Cocos, sehingga engine itu sendiri memakan lebih banyak anggaran paket Anda. Untuk game 2D kecil, biasanya ini tidak menjadi masalah. Untuk game 3D sarat aset, ketika setiap kilobyte dari batas 4 MB sangat berarti, plugin bawaan Cocos dapat menjadi faktor penentu.</p>
<h2 id="egret-engine-lawas-gunakan-dengan-penuh-pertimbangan" tabindex="-1">Egret: engine lawas, gunakan dengan penuh pertimbangan <a class="header-anchor" href="#egret-engine-lawas-gunakan-dengan-penuh-pertimbangan" aria-label="Permalink to &quot;Egret: engine lawas, gunakan dengan penuh pertimbangan&quot;"></a></h2>
<p>Egret (白鹭) adalah engine HTML5 2D lama yang sejak awal mendukung WeChat Mini Games dan digunakan untuk membuat banyak game pada gelombang pertama. Engine ini masih berfungsi, tetapi momentumnya telah beralih ke Cocos dan Laya, aktivitas komunitasnya menurun, dan memulai proyek baru dengannya pada 2026 berarti bertaruh pada ekosistem yang terus menyusut. Jika Anda memelihara game Egret yang sudah ada, itu tidak masalah. Jika memulai dari nol, pilih Cocos atau Laya.</p>
<h2 id="unity-jalur-transformasi-webgl" tabindex="-1">Unity: jalur transformasi WebGL <a class="header-anchor" href="#unity-jalur-transformasi-webgl" aria-label="Permalink to &quot;Unity: jalur transformasi WebGL&quot;"></a></h2>
<p>Unity tidak memiliki ekspor native ke WeChat, tetapi Tencent dan Unity mengelola alat resmi yang mengubah build Unity WebGL menjadi paket Mini Game: WeChat Mini Game transform SDK, yang terkadang didistribusikan sebagai WeChat MiniGame Exporter. Sejak pembaruan pertengahan 2025, alat ini mendukung ekspor sekali klik, dan <code>minigame-adaptor</code> pendampingnya diklaim memberikan performa rendering sekitar 3x lebih tinggi dibandingkan WebGL biasa dengan memanfaatkan jalur rendering WeChat yang telah dioptimalkan.</p>
<p>Inilah jalur yang tepat jika Anda sudah memiliki game Unity dan ingin membawanya ke WeChat tanpa menulis ulang. Namun, pertimbangkan komprominya secara realistis. Build Unity WebGL berukuran besar, dan batas paket awal 4 MB sangat berat bagi engine yang tidak dirancang untuk itu. Anda akan menghabiskan banyak upaya untuk stripping, pemisahan kode, dan memindahkan aset ke subpaket. Ini adalah alat untuk memindahkan game yang sudah ada, bukan alat untuk membuat game yang sejak awal ditujukan bagi WeChat.</p>
<h2 id="tuanjie-solusi-native-dari-unity-china" tabindex="-1">Tuanjie: solusi native dari Unity China <a class="header-anchor" href="#tuanjie-solusi-native-dari-unity-china" aria-label="Permalink to &quot;Tuanjie: solusi native dari Unity China&quot;"></a></h2>
<p>Jika Anda menyukai alur kerja Unity tetapi menginginkan WeChat sebagai target build sungguhan alih-alih hasil konversi WebGL, pertimbangkan Tuanjie (团结引擎), engine lokal dari Unity China. Engine ini berbasis Unity 2022 LTS dan memperlakukan WeChat Mini Games sebagai platform native bersama iOS dan Android, serta target domestik seperti OpenHarmony dan AliOS. Versi-versi terbarunya menambahkan sistem global illumination real-time lengkap (TuanjieGI), dan jumlah unduhannya telah melampaui 500.000.</p>
<p>Bagi studio yang berkomitmen pada pasar Tiongkok dan sudah terbiasa dengan Unity, Tuanjie adalah opsi dari keluarga Unity yang paling siap untuk masa depan karena WeChat bukan fitur tambahan yang ditempelkan melalui WebGL. WeChat merupakan target ekspor kelas utama.</p>
<h2 id="three-js-dan-webgl-mentah" tabindex="-1">Three.js dan WebGL mentah <a class="header-anchor" href="#three-js-dan-webgl-mentah" aria-label="Permalink to &quot;Three.js dan WebGL mentah&quot;"></a></h2>
<p>Anda dapat menjalankan Three.js atau WebGL yang ditulis manual di dalam Mini Game melalui <code>weapp-adapter</code> milik WeChat, yang menyediakan stub untuk objek DOM dan canvas yang diharapkan oleh library. Ini adalah opsi paling fleksibel sekaligus paling merepotkan: Anda harus menangani sendiri render loop, pipeline aset, subpaket, dan setiap kasus khusus pada adapter. Pilihan ini masuk akal untuk game kustom kecil yang sensitif terhadap ukuran dan tidak membutuhkan engine lengkap, atau ketika tim Anda sudah terbiasa dengan Three.js dan ingin menggunakan kembali kodenya.</p>
<p>Ini juga merupakan jalur yang paling dekat dengan game browser yang sudah Anda buat. Game Three.js yang berjalan di web terbuka memiliki struktur serupa dengan game yang berjalan di WeChat. Perbedaannya terletak pada adapter dan anggaran 4 MB, bukan pada rendering.</p>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<p>Membuat game untuk WeChat sejak awal tanpa kode yang sudah ada: Cocos Creator. Plugin engine bawaan dan sistem AssetBundle membuat tantangan batas 4 MB lebih mudah diatasi.</p>
<p>Memindahkan game Unity yang sudah ada: gunakan WeChat WebGL transform SDK agar dapat segera merilisnya, atau Tuanjie jika Anda berkomitmen pada pasar Tiongkok untuk jangka panjang dan menginginkan target native.</p>
<p>Game kecil, kustom, atau sudah menggunakan Three.js: gunakan <code>weapp-adapter</code> dan WebGL mentah, serta terima bahwa Anda harus menangani sendiri seluruh infrastruktur dasarnya.</p>
<p>Lebih menyukai alur kerja Laya: gunakan LayaAir, sambil tetap memperhatikan ukuran paket untuk game 3D.</p>
<h2 id="posisi-cinevva" tabindex="-1">Posisi Cinevva <a class="header-anchor" href="#posisi-cinevva" aria-label="Permalink to &quot;Posisi Cinevva&quot;"></a></h2>
<p>Cinevva membuat game 3D yang mengutamakan web menggunakan Three.js dan dapat dijalankan dari tautan di browser apa pun. Bentuk ini sama seperti yang dibutuhkan WeChat Mini Game: tanpa instalasi, langsung dimainkan, dengan JavaScript dan WebGL di balik layar. Great Firewall dan lapisan perizinan memang merupakan tantangan nyata, dan kami terbuka mengenai fakta bahwa merilis ke WeChat memerlukan penerbit lokal serta disiplin dalam memenuhi batas 4 MB. Namun, game itu sendiri—pengalaman 3D native-browser tanpa unduhan—sudah sesuai dengan konsep yang mendasari platform game terbesar di Tiongkok. Jika Anda membuat prototipe yang suatu hari mungkin ingin ditampilkan kepada 500 juta pemain Mini Game, memulai dari browser adalah langkah dengan upaya paling sedikit yang terbuang.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan umum&quot;"></a></h2>
<h3 id="berapa-batas-ukuran-berkas-untuk-wechat-mini-game" tabindex="-1">Berapa batas ukuran berkas untuk WeChat Mini Game? <a class="header-anchor" href="#berapa-batas-ukuran-berkas-untuk-wechat-mini-game" aria-label="Permalink to &quot;Berapa batas ukuran berkas untuk WeChat Mini Game?&quot;"></a></h3>
<p>Paket awal dibatasi hingga 4 MB. Apa pun yang melebihi batas tersebut harus dibagi menjadi subpaket (分包) yang dimuat sesuai kebutuhan dan secara keseluruhan dapat mencapai batas total yang jauh lebih besar. Memuat pengalaman awal ke dalam 4 MB merupakan masalah optimasi utama di platform ini.</p>
<h3 id="bisakah-saya-menggunakan-unity-untuk-wechat-mini-games" tabindex="-1">Bisakah saya menggunakan Unity untuk WeChat Mini Games? <a class="header-anchor" href="#bisakah-saya-menggunakan-unity-untuk-wechat-mini-games" aria-label="Permalink to &quot;Bisakah saya menggunakan Unity untuk WeChat Mini Games?&quot;"></a></h3>
<p>Ya, tetapi tidak secara native. Tencent dan Unity menyediakan SDK transformasi resmi yang mengubah build Unity WebGL menjadi Mini Game, dengan dukungan ekspor sekali klik sejak pertengahan 2025. Sebagai alternatif, engine Tuanjie dari Unity China mendukung WeChat sebagai target build native. Apa pun pilihannya, bersiaplah mencurahkan upaya untuk mengoptimalkan ukuran build.</p>
<h3 id="engine-apa-yang-digunakan-oleh-sebagian-besar-wechat-mini-games" tabindex="-1">Engine apa yang digunakan oleh sebagian besar WeChat Mini Games? <a class="header-anchor" href="#engine-apa-yang-digunakan-oleh-sebagian-besar-wechat-mini-games" aria-label="Permalink to &quot;Engine apa yang digunakan oleh sebagian besar WeChat Mini Games?&quot;"></a></h3>
<p>Cocos Creator adalah pilihan paling umum, didukung oleh fakta bahwa runtime engine-nya tertanam dalam klien WeChat sehingga tidak mengurangi jatah paket 4 MB Anda. LayaAir merupakan alternatif utamanya.</p>
<h3 id="apakah-wechat-mini-games-mendukung-3d" tabindex="-1">Apakah WeChat Mini Games mendukung 3D? <a class="header-anchor" href="#apakah-wechat-mini-games-mendukung-3d" aria-label="Permalink to &quot;Apakah WeChat Mini Games mendukung 3D?&quot;"></a></h3>
<p>Ya. Cocos Creator, LayaAir, Unity (melalui SDK transformasi), dan Tuanjie semuanya mendukung 3D, sementara runtime WeChat menyediakan WebGL dan semakin sering WebGPU. Batasannya adalah ukuran paket dan performa pada ponsel kelas bawah, bukan soal apakah 3D dapat dijalankan.</p>
<h3 id="bisakah-saya-mengubah-game-browser-menjadi-wechat-mini-game" tabindex="-1">Bisakah saya mengubah game browser menjadi WeChat Mini Game? <a class="header-anchor" href="#bisakah-saya-mengubah-game-browser-menjadi-wechat-mini-game" aria-label="Permalink to &quot;Bisakah saya mengubah game browser menjadi WeChat Mini Game?&quot;"></a></h3>
<p>Sering kali bisa. Game yang dibuat dengan Three.js atau WebGL dapat berjalan di dalam WeChat melalui <code>weapp-adapter</code>, yang mengemulasikan objek browser yang dibutuhkan oleh kode. Pekerjaan utamanya terletak pada lapisan adapter dan menurunkan ukuran paket awal hingga di bawah batas 4 MB, bukan menulis ulang game.</p>
<BuildCta
  title="Mulai di browser, pertahankan semua opsi Anda"
  desc="Buat prototipe game 3D native-web terlebih dahulu. Bentuknya sama seperti yang dibutuhkan Mini Game, hanya tanpa sandbox."
  prompt="Buat endless runner cepat sekali ketuk melewati kota neon" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-wechat-douyin-mini-games.html">Cara Menerbitkan Game di WeChat &amp; Douyin Mini Games</a> — lisensi, peninjauan, dan bagi hasil</li>
<li><a href="/id/guides/china-mini-game-platforms.html">Perbandingan Platform Mini-Game &amp; HTML5 Tiongkok</a> — WeChat, Douyin, QQ, 4399, dan platform lainnya</li>
<li><a href="/id/guides/localize-web-game-china.html">Melokalkan Game Web untuk Tiongkok</a> — font, hosting, pembayaran, dan Firewall</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Dibandingkan)</a> — seluruh pilihan yang tersedia</li>
<li><a href="/id/guides/threejs-vs-babylonjs.html">Three.js vs Babylon.js</a> — jika Anda memilih jalur WebGL mentah</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang mengutamakan web dan dibuat dengan Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/wechat-mini-game-engines-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Tren Game Kasual pada 2026 (Apa yang Sebenarnya Ditunjukkan Data)]]></title>
            <link>https://app.cinevva.com/id/guides/casual-games-trends-2026</link>
            <guid>https://app.cinevva.com/id/guides/casual-games-trends-2026</guid>
            <pubDate>Tue, 30 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Tinjauan tren game kasual pada 2026 yang didukung data, mulai dari penurunan unduhan dan kebangkitan hybrid-casual hingga sumber pendapatan, judul yang sedang melejit, dan perubahan yang dibawa AI.]]></description>
            <content:encoded><![CDATA[<h1 id="tren-game-kasual-pada-2026-apa-yang-sebenarnya-ditunjukkan-data" tabindex="-1">Tren Game Kasual pada 2026 (Apa yang Sebenarnya Ditunjukkan Data) <a class="header-anchor" href="#tren-game-kasual-pada-2026-apa-yang-sebenarnya-ditunjukkan-data" aria-label="Permalink to &quot;Tren Game Kasual pada 2026 (Apa yang Sebenarnya Ditunjukkan Data)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Kisah game kasual pada 2026 bukanlah &quot;ledakan terus berlanjut.&quot; Yang terjadi adalah &quot;ledakan itu telah matang.&quot; Pemain masih lebih sering membuka game-game ini, tetapi mereka memasang lebih sedikit game baru, dan aliran pendapatan kini menguntungkan jenis game yang berbeda dari game yang berjaya tiga tahun lalu. Kami menelusuri angka setahun penuh 2025 dari <a href="https://sensortower.com/state-of-gaming-2025" target="_blank" rel="noreferrer">Sensor Tower</a>, AppMagic (melalui <a href="https://investgame.net/wp-content/uploads/2025/07/Gamesforum-Intelligence-Casual-Gaming-Report.pdf" target="_blank" rel="noreferrer">Gamesforum Intelligence</a> dan <a href="https://www.gamerefinery.com/mobile-game-market-review-december-2025/" target="_blank" rel="noreferrer">GameRefinery</a>), serta para analis di <a href="https://www.deconstructoroffun.com/blog/2026/2/2/state-of-mobile-2026" target="_blank" rel="noreferrer">Deconstructor of Fun</a> dan <a href="https://www.pocketgamer.biz/what-happened-to-hypercasual-the-markets-evolution-over-the-past-year/" target="_blank" rel="noreferrer">PocketGamer.biz</a> untuk memisahkan perubahan nyata dari sensasi belaka. Inilah yang sebenarnya terjadi.</p>
<p>Versi singkatnya: pasar game kasual telah matang pada 2025. Pendapatan dalam aplikasi hanya naik 1,3% menjadi sekitar $81,75 miliar, sementara unduhan turun 7,2% menjadi 50,4 miliar. Artinya, pertumbuhan kini berasal dari peningkatan belanja pemain, bukan pemasangan baru. Hybrid-casual adalah satu-satunya segmen yang mencatat pertumbuhan pendapatan dalam aplikasi, naik 20% menjadi $4,2 miliar, dengan puzzle hybrid-casual sebagai kategori paling menonjol. Monetisasi meluas ke spektrum yang lebar, dari game bervolume tinggi yang hanya mengandalkan iklan hingga game bebas iklan yang menghasilkan lebih dari $500 juta, sementara AI generatif beralih dari eksperimen menjadi perangkat standar di studio.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 210" role="img" aria-label="Ringkasan game seluler 2025: pendapatan dalam aplikasi $81,8 miliar, naik 1,3%; 50,4 miliar unduhan, turun 7,2%; pendapatan hybrid-casual $4,2 miliar, naik 20%; 22,05 miliar pemasangan hypercasual" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="210" rx="14" fill="#0b1020"/>
  <text x="24" y="40" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Ringkasan 2025</text>
  <text x="24" y="62" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Data game seluler setahun penuh. Sumber: Sensor Tower.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <g transform="translate(24,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#c8a8ff">$81.8B</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">IAP game seluler</text>
      <rect x="16" y="82" width="62" height="20" rx="10" fill="#fbbf2422"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#fbbf24">+1.3%</text>
    </g>
    <g transform="translate(196,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#7dd3fc">50.4B</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">Unduhan aplikasi</text>
      <rect x="16" y="82" width="62" height="20" rx="10" fill="#fb718522"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#fb7185">&#8722;7.2%</text>
    </g>
    <g transform="translate(368,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#f0abfc">$4.2B</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">IAP hybrid-casual</text>
      <rect x="16" y="82" width="56" height="20" rx="10" fill="#6ee7b722"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#6ee7b7">+20%</text>
    </g>
    <g transform="translate(540,80)">
      <rect width="156" height="106" rx="10" fill="#121a31"/>
      <text x="16" y="48" font-size="27" font-weight="800" fill="#e8edf5">22.05B</text>
      <text x="16" y="72" font-size="12" fill="#9aa7b4">Pemasangan hypercasual</text>
      <rect x="16" y="82" width="92" height="20" rx="10" fill="#ffffff14"/>
      <text x="26" y="96" font-size="12" font-weight="700" fill="#9aa7b4">#1 berdasarkan volume</text>
    </g>
  </g>
</svg>
<h2 id="pertumbuhan-pasar-dari-pemasangan-telah-berhenti" tabindex="-1">Pertumbuhan pasar dari pemasangan telah berhenti <a class="header-anchor" href="#pertumbuhan-pasar-dari-pemasangan-telah-berhenti" aria-label="Permalink to &quot;Pertumbuhan pasar dari pemasangan telah berhenti&quot;"></a></h2>
<p>Game seluler menghasilkan sekitar $81,75 miliar dari pembelian dalam aplikasi pada 2025, tetapi angka itu hanya meningkat 1,3% dibandingkan 2024, menurut <a href="https://www.deconstructoroffun.com/blog/2026/2/2/state-of-mobile-2026" target="_blank" rel="noreferrer">angka setahun penuh 2025</a>. Unduhan bergerak ke arah sebaliknya, turun 7,2% menjadi 50,4 miliar, yang merupakan penurunan selama dua tahun berturut-turut. Sebagai perbandingan, belanja dalam aplikasi untuk seluruh kategori aplikasi di toko tumbuh sehat sebesar 10,6% menjadi $167 miliar. Jadi, yang mendatar secara khusus adalah game, bukan perdagangan seluler secara umum.</p>
<p>Kesenjangan itu menjelaskan keseluruhan ceritanya. Interaksi pemain masih meningkat (pada tahun sebelumnya, jumlah sesi naik 12% dan waktu yang dihabiskan naik 7,9%), tetapi pemasangan baru menyusut. Pertumbuhan kini berasal dari menghasilkan lebih banyak pendapatan dari pemain yang sudah Anda miliki, bukan dari mendapatkan pemain baru. Era akuisisi pengguna murah telah berakhir.</p>
<p>Angka awal 2026 menunjukkan bahwa tren ini semakin cepat, bukan berbalik arah. <a href="https://gamedevreports.substack.com/p/sensor-tower-mobile-market-in-q1" target="_blank" rel="noreferrer">Data Q1 2026 Sensor Tower</a> mencatat belanja game seluler sebesar $20,4 miliar, hanya naik 0,5% dari tahun sebelumnya, sementara unduhan turun 11,9%, lebih tajam daripada penurunan setahun penuh pada 2025. Sisi positifnya adalah kategori puzzle, dengan pendapatan yang naik 21% dari tahun sebelumnya.</p>
<p>Perbedaan yang sama juga terlihat di dalam kategori kasual itu sendiri. Di antara 1.000 game kasual teratas, pendapatan pembelian dalam aplikasi naik dari $17,47 miliar pada 2022 menjadi $21,99 miliar pada 2024, dengan perkiraan $22,99 miliar untuk 2025, sementara jumlah unduhan relatif datar di kisaran 16 miliar, menurut <a href="https://investgame.net/wp-content/uploads/2025/07/Gamesforum-Intelligence-Casual-Gaming-Report.pdf" target="_blank" rel="noreferrer">laporan game kasual Gamesforum Intelligence</a> (data AppMagic). Pendapatan lebih besar, jumlah unduhan tetap sama. Pemain hanya membelanjakan lebih banyak uang per pemasangan.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 360" role="img" aria-label="Pendapatan game kasual terus meningkat sementara unduhan tetap datar, 2022 hingga 2025" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <defs>
    <linearGradient id="revfill" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0" stop-color="#c8a8ff" stop-opacity="0.34"/>
      <stop offset="1" stop-color="#c8a8ff" stop-opacity="0"/>
    </linearGradient>
  </defs>
  <rect width="720" height="360" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Pendapatan kasual terus naik. Pemasangan tidak.</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">1.000 game kasual teratas: pendapatan IAP ($B) vs unduhan (B). Perkiraan 2025. Sumber: AppMagic / Gamesforum.</text>
  <g stroke="#ffffff" stroke-opacity="0.07"><path d="M70 130 H680 M70 190 H680 M70 250 H680"/></g>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="12" fill="#9aa7b4">
    <line x1="70" y1="300" x2="680" y2="300" stroke="#ffffff" stroke-opacity="0.14"/>
    <text x="110" y="324" text-anchor="middle">2022</text>
    <text x="300" y="324" text-anchor="middle">2023</text>
    <text x="490" y="324" text-anchor="middle">2024</text>
    <text x="650" y="324" text-anchor="middle">2025p</text>
  </g>
  <path d="M110 208 L300 168 L490 130 L650 120 L650 300 L110 300 Z" fill="url(#revfill)"/>
  <polyline points="110,208 300,168 490,130 650,120" fill="none" stroke="#c8a8ff" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
  <polyline points="110,244 300,242 490,238 650,232" fill="none" stroke="#7dd3fc" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-weight="700" font-size="12">
    <circle cx="650" cy="120" r="5" fill="#c8a8ff"/>
    <text x="638" y="108" text-anchor="end" fill="#c8a8ff">Pendapatan $23.0B</text>
    <circle cx="650" cy="232" r="5" fill="#7dd3fc"/>
    <text x="638" y="258" text-anchor="end" fill="#7dd3fc">Unduhan 16.4B</text>
  </g>
  <g transform="translate(118,128)">
    <rect width="186" height="26" rx="13" fill="#c8a8ff1f"/>
    <text x="16" y="18" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" font-weight="700" fill="#c8a8ff">Pendapatan +32% sejak 2022</text>
  </g>
</svg>
<h2 id="model-hypercasual-yang-hanya-mengandalkan-iklan-telah-runtuh-dan-itu-tidak-masalah" tabindex="-1">Model hypercasual yang hanya mengandalkan iklan telah runtuh, dan itu tidak masalah <a class="header-anchor" href="#model-hypercasual-yang-hanya-mengandalkan-iklan-telah-runtuh-dan-itu-tidak-masalah" aria-label="Permalink to &quot;Model hypercasual yang hanya mengandalkan iklan telah runtuh, dan itu tidak masalah&quot;"></a></h2>
<p>Judul yang akan sering Anda lihat adalah &quot;hypercasual sedang sekarat.&quot; Itu hanya setengah benar. Yang runtuh adalah keekonomiannya, bukan gamenya. Selama bertahun-tahun, hypercasual mengandalkan satu trik: beli pemasangan dengan murah, tampilkan iklan, lalu ambil selisihnya. Ketika biaya akuisisi naik melampaui pendapatan yang bisa dihasilkan iklan, model murni yang hanya mengandalkan iklan itu berhenti berfungsi.</p>
<p>Game-gamenya sendiri baik-baik saja. Hypercasual masih mendominasi unduhan pada 2025 dengan 22,05 miliar pemasangan dan terus meningkatkan waktu bermain, menurut <a href="https://gameworldobserver.com/2026/01/21/in-2025-the-revenue-of-the-mobile-gaming-market-grew-but-only-slightly-analysis" target="_blank" rel="noreferrer">Game World Observer</a>. <a href="https://www.pocketgamer.biz/what-happened-to-hypercasual-the-markets-evolution-over-the-past-year/" target="_blank" rel="noreferrer">PocketGamer.biz melaporkan</a> bahwa judul-judul terkemuka menghasilkan pendapatan bulanan sekitar 3 kali lebih besar daripada tahun sebelumnya, meskipun angka itu berangkat dari basis yang rendah dan sebagian mencerminkan game hybrid-casual yang diklasifikasikan ulang. Kesimpulannya sederhana: format ini bertahan dengan menambahkan pembelian dalam aplikasi di atas iklan, alih-alih hanya bergantung pada iklan.</p>
<h2 id="hybrid-casual-adalah-pemenang-sesungguhnya" tabindex="-1">Hybrid-casual adalah pemenang sesungguhnya <a class="header-anchor" href="#hybrid-casual-adalah-pemenang-sesungguhnya" aria-label="Permalink to &quot;Hybrid-casual adalah pemenang sesungguhnya&quot;"></a></h2>
<p>Jika ada satu tren yang mendefinisikan 2026, tren itu adalah hybrid-casual. Ini merupakan satu-satunya segmen kasual yang mencatat pertumbuhan pendapatan pembelian dalam aplikasi tahun lalu, naik 20% menjadi $4,2 miliar. Sepuluh judul teratas mencatat pertumbuhan IAP tahunan antara 67% dan 100%, sebagaimana diuraikan oleh <a href="https://gameworldobserver.com/2026/01/21/in-2025-the-revenue-of-the-mobile-gaming-market-grew-but-only-slightly-analysis" target="_blank" rel="noreferrer">Game World Observer</a>. Setiap pelacak membagi segmen ini secara berbeda: Game World Observer mencatat pertumbuhan 20%, sedangkan Sensor Tower sendiri mencatat 37%. Namun, semuanya sepakat bahwa ini adalah satu-satunya segmen kasual yang tumbuh. Hybrid-casual mengambil loop singkat yang ramah iklan dari hypercasual, lalu menambahkan meta-progression dan kedalaman belanja dari game kasual yang sesungguhnya. Format ini mempertahankan kemudahan pemasangan sekaligus menambahkan alasan untuk membayar.</p>
<p>Pertumbuhan terkonsentrasi pada puzzle hybrid-casual. <a href="https://www.gamerefinery.com/mobile-game-market-review-december-2025/" target="_blank" rel="noreferrer">Ulasan Desember 2025 GameRefinery</a> menyebut subgenre mapan seperti Match3 &quot;sangat jenuh&quot;, sementara sekelompok judul puzzle baru berhasil masuk ke tangga game berpendapatan tertinggi: Color Block Jam, Pixel Flow, Screwdom, Magic Sort, dan All in Hole. Color Block Jam sendiri menghasilkan pendapatan sekitar $42 juta dari 21,8 juta pemasangan hanya dalam satu kuartal. Tren ini terus berlanjut sepanjang paruh pertama 2026: Pixel Flow berkembang dari pendatang baru menjadi pemimpin kategori dengan pendapatan dalam aplikasi kumulatif sekitar $94 juta, Jigsolitaire dan Color Block: Combo Blast adalah nama-nama yang kini sedang berkembang pesat, sedangkan Gossip Harbor dan Tasty Travels mendorong sebagian besar pertumbuhan pendapatan puzzle pada Q1. Jika Anda sedang menentukan jenis game kasual yang akan dibuat pada 2026, &quot;klona Match3 yang sudah jenuh&quot; dan &quot;puzzle hybrid-casual yang segar&quot; merupakan dua pilihan dengan prospek yang sangat berbeda.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 300" role="img" aria-label="Game kasual terkemuka pada 2025: Royal Match dan Monopoly Go dengan pendapatan tertinggi, serta puzzle hybrid-casual yang melejit, Color Block Jam, Screwdom, dan Pixel Flow" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="300" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Yang melejit pada 2025</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Rentang pendapatan berbeda-beda. Sumber: AppMagic.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <text x="32" y="100" font-size="12" font-weight="800" letter-spacing="1" fill="#c8a8ff">PENDAPATAN TERTINGGI · TANPA IKLAN</text>
    <g transform="translate(32,112)">
      <rect width="316" height="46" rx="10" fill="#121a31"/>
      <text x="16" y="29" font-size="15" font-weight="700" fill="#e8edf5">Royal Match</text>
      <text x="300" y="29" text-anchor="end" font-size="14" font-weight="800" fill="#c8a8ff">&gt;$500Jt</text>
    </g>
    <g transform="translate(32,166)">
      <rect width="316" height="46" rx="10" fill="#121a31"/>
      <text x="16" y="29" font-size="15" font-weight="700" fill="#e8edf5">Monopoly Go!</text>
      <text x="300" y="29" text-anchor="end" font-size="14" font-weight="800" fill="#c8a8ff">$431Jt</text>
    </g>
    <text x="372" y="100" font-size="12" font-weight="800" letter-spacing="1" fill="#7dd3fc">PUZZLE HYBRID-CASUAL YANG MELEJIT</text>
    <g transform="translate(372,112)">
      <rect width="316" height="46" rx="10" fill="#121a31"/>
      <text x="16" y="22" font-size="15" font-weight="700" fill="#e8edf5">Color Block Jam</text>
      <text x="16" y="38" font-size="11" fill="#9aa7b4">21,8 juta instalasi dalam satu kuartal</text>
      <text x="300" y="30" text-anchor="end" font-size="14" font-weight="800" fill="#7dd3fc">$42Jt</text>
    </g>
    <g transform="translate(372,166)">
      <rect width="150" height="46" rx="10" fill="#121a31"/>
      <text x="16" y="22" font-size="14" font-weight="700" fill="#e8edf5">Screwdom</text>
      <text x="134" y="38" text-anchor="end" font-size="13" font-weight="800" fill="#7dd3fc">$27,1Jt</text>
    </g>
    <g transform="translate(538,166)">
      <rect width="150" height="46" rx="10" fill="#121a31"/>
      <text x="16" y="22" font-size="14" font-weight="700" fill="#e8edf5">Pixel Flow</text>
      <text x="134" y="38" text-anchor="end" font-size="11" fill="#9aa7b4">menyalip pada Des</text>
    </g>
  </g>
  <text x="32" y="248" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="12.5" fill="#9aa7b4">Magic Sort dan All in Hole juga naik ke tangga 50 besar berpendapatan tertinggi, sementara Match3</text>
  <text x="32" y="268" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="12.5" fill="#9aa7b4">tetap datar di pasar yang sangat jenuh.</text>
</svg>
<h2 id="monetisasi-kini-merupakan-spektrum-bukan-satu-model" tabindex="-1">Monetisasi kini merupakan spektrum, bukan satu model <a class="header-anchor" href="#monetisasi-kini-merupakan-spektrum-bukan-satu-model" aria-label="Permalink to &quot;Monetisasi kini merupakan spektrum, bukan satu model&quot;"></a></h2>
<p>Tak ada lagi satu &quot;model monetisasi kasual&quot;. Pasar telah terbagi menjadi spektrum yang jelas, dan posisi sebuah game bergantung pada karakter game tersebut. Kesimpulan konsisten dari berbagai pelacak adalah bahwa memadukan pembelian dalam aplikasi dengan iklan telah menjadi strategi tengah yang paling optimal, tetapi kedua ujung spektrum tetap bisa meraih kesuksesan besar.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 290" role="img" aria-label="Spektrum monetisasi game kasual, dari Block Blast yang hanya menggunakan iklan, melalui Candy Crush dan Coin Master yang hybrid, hingga Royal Match dan Monopoly Go yang bebas iklan" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <defs>
    <linearGradient id="spec" x1="0" y1="0" x2="1" y2="0">
      <stop offset="0" stop-color="#7dd3fc"/>
      <stop offset="0.5" stop-color="#a9b4ff"/>
      <stop offset="1" stop-color="#c8a8ff"/>
    </linearGradient>
  </defs>
  <rect width="720" height="290" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Satu genre, tiga model pendapatan</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Posisi game kasual sukses dalam spektrum monetisasi. Sumber: AppMagic, Gamesforum.</text>
  <rect x="60" y="150" width="600" height="10" rx="5" fill="url(#spec)"/>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <g text-anchor="middle">
      <circle cx="150" cy="155" r="9" fill="#7dd3fc" stroke="#0b1020" stroke-width="3"/>
      <text x="150" y="120" font-size="14" font-weight="800" fill="#e8edf5">Block Blast!</text>
      <text x="150" y="138" font-size="11.5" fill="#9aa7b4">paling banyak diunduh</text>
      <text x="150" y="186" font-size="12" font-weight="700" fill="#7dd3fc">Hanya iklan</text>
      <text x="150" y="204" font-size="11.5" fill="#9aa7b4">monetisasi berbasis volume</text>
    </g>
    <g text-anchor="middle">
      <circle cx="360" cy="155" r="9" fill="#a9b4ff" stroke="#0b1020" stroke-width="3"/>
      <text x="360" y="120" font-size="14" font-weight="800" fill="#e8edf5">Candy Crush · Coin Master</text>
      <text x="360" y="138" font-size="11.5" fill="#9aa7b4">standar baru yang berkembang</text>
      <text x="360" y="186" font-size="12" font-weight="700" fill="#a9b4ff">Hybrid (IAP + iklan)</text>
      <text x="360" y="204" font-size="11.5" fill="#9aa7b4">video berhadiah plus pembelian</text>
    </g>
    <g text-anchor="middle">
      <circle cx="570" cy="155" r="9" fill="#c8a8ff" stroke="#0b1020" stroke-width="3"/>
      <text x="570" y="120" font-size="14" font-weight="800" fill="#e8edf5">Royal Match · Monopoly Go!</text>
      <text x="570" y="138" font-size="11.5" fill="#9aa7b4">&gt;$500Jt · $431Jt</text>
      <text x="570" y="186" font-size="12" font-weight="700" fill="#c8a8ff">Bebas iklan, hanya IAP</text>
      <text x="570" y="204" font-size="11.5" fill="#9aa7b4">ditopang pemain yang berbelanja</text>
    </g>
  </g>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="12" fill="#5b6472" font-weight="600">
    <text x="60" y="252">◄ Jangkauan &amp; volume</text>
    <text x="660" y="252" text-anchor="end">Kedalaman &amp; pemain pembelanja ►</text>
  </g>
</svg>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Siapa yang menggunakannya</th>
<th>Contoh</th>
<th>Maknanya bagi Anda</th>
</tr>
</thead>
<tbody>
<tr>
<td>Bebas iklan, hanya IAP</td>
<td>Game berpendapatan tertinggi</td>
<td>Royal Match (lebih dari $500 juta Jan–Apr 2025), Monopoly Go! ($431 juta)</td>
<td>Meta-game mendalam tidak membutuhkan iklan; pemain yang membayar menopangnya</td>
</tr>
<tr>
<td>Hybrid (IAP + iklan)</td>
<td>Game kelas menengah dan sebagian besar game sukses baru</td>
<td>Candy Crush, Coin Master, Township</td>
<td>Standar baru yang berkembang: video berhadiah plus pembelian</td>
</tr>
<tr>
<td>Hanya iklan</td>
<td>Game yang paling banyak diunduh</td>
<td>Block Blast!</td>
<td>Jangkauan sangat besar, dimonetisasi hampir sepenuhnya berdasarkan volume</td>
</tr>
</tbody>
</table>
<p>Pelajarannya bukanlah &quot;pilih satu&quot;. Model harus mengikuti gamenya. Game puzzle murni dengan jangkauan sangat besar dapat hidup dari iklan. Game dengan koleksi, progresi, dan fitur sosial kehilangan potensi pendapatan jika menampilkan iklan kepada pemain yang gemar berbelanja. Hampir semua game di antara kedua ujung itu memperoleh hasil terbaik dengan memadukan keduanya. Angka-angka di sini berasal dari <a href="https://investgame.net/wp-content/uploads/2025/07/Gamesforum-Intelligence-Casual-Gaming-Report.pdf" target="_blank" rel="noreferrer">laporan game kasual Gamesforum Intelligence</a> (data AppMagic).</p>
<h2 id="berapa-pendapatan-iklan-yang-dapat-diharapkan-game-kasual-pada-2026" tabindex="-1">Berapa pendapatan iklan yang dapat diharapkan game kasual pada 2026? <a class="header-anchor" href="#berapa-pendapatan-iklan-yang-dapat-diharapkan-game-kasual-pada-2026" aria-label="Permalink to &quot;Berapa pendapatan iklan yang dapat diharapkan game kasual pada 2026?&quot;"></a></h2>
<p>Sisi iklan dalam spektrum tersebut lebih besar daripada perkiraan kebanyakan orang. Menurut kajian mendalam monetisasi iklan Sensor Tower, pendapatan iklan game seluler melampaui <a href="https://gameworldobserver.com/2026/07/06/in-2025-mobile-game-advertising-revenue-exceeded-12-billion-analytics" target="_blank" rel="noreferrer">$12 miliar pada 2025</a>, dan game puzzle saja menguasai 53% pangsa pendapatan iklan genre pada awal 2026. Besarnya porsi pendapatan Anda yang berasal dari iklan sangat bergantung pada lokasi pemain. Iklan menyumbang sekitar 22% pendapatan game seluler AS antara Januari dan Mei 2026, tetapi 70% di India. Jadi, audiens negara tier-1 membayar Anda melalui pembelian, sedangkan audiens global bervolume tinggi membayar Anda melalui tayangan.</p>
<p>Untuk tarif, <a href="https://business.mistplay.com/resources/mobile-ads-ecpm/" target="_blank" rel="noreferrer">tolok ukur eCPM Appodeal</a> menempatkan rata-rata AS pada sekitar $15 untuk video berhadiah, $12 hingga $13 untuk iklan interstisial, dan sekitar $0,50 untuk banner, sedangkan angka di Eropa dan APAC jauh lebih rendah. Pendapatan per pemain lebih bervariasi berdasarkan subgenre daripada jaringan iklan: <a href="https://appdevelopermagazine.com/mobile-casual-benchmarks-report-2025/" target="_blank" rel="noreferrer">laporan tolok ukur game kasual</a> Appodeal menunjukkan ARPU iklan Android AS di bawah satu dolar untuk game hypercasual, mendekati $3 untuk game match, dan jauh di atas $10 untuk game merge. Sementara itu, <a href="https://tenjin.com/blog/ad-mon-gaming-2026/" target="_blank" rel="noreferrer">laporan tolok ukur 2026 dari Tenjin dan CAS.AI</a> menunjukkan Android menyumbang 57% pendapatan iklan game seluler, dengan AdMob dan AppLovin sebagai jaringan terbesar. Anggap semua angka ini sebagai petunjuk arah, bukan kebenaran mutlak. Genre, komposisi geografis, dan desain penempatan lebih memengaruhi angka daripada stack mediasi.</p>
<h2 id="fitur-meta-renovasi-sudah-menjadi-standar-minimum-lapisan-barunya-adalah-tugas-dan-co-op" tabindex="-1">Fitur meta: renovasi sudah menjadi standar minimum, lapisan barunya adalah tugas dan co-op <a class="header-anchor" href="#fitur-meta-renovasi-sudah-menjadi-standar-minimum-lapisan-barunya-adalah-tugas-dan-co-op" aria-label="Permalink to &quot;Fitur meta: renovasi sudah menjadi standar minimum, lapisan barunya adalah tugas dan co-op&quot;"></a></h2>
<p>Jika Anda bertanya-tanya fitur meta apa yang benar-benar digunakan game kasual berpendapatan tertinggi, jawabannya sangat konsisten: dekorasi dan konstruksi. GameRefinery menemukan elemen renovasi dalam <a href="https://www.pocketgamer.biz/gamerefinery-renovation-features-are-in-every-top-100-us-casual-mobile-game/" target="_blank" rel="noreferrer">setiap game kasual AS yang dirilis sejak 2020 dan masuk 100 besar berpendapatan tertinggi</a> (temuan 2022 yang masih membentuk kategori ini), serta <a href="https://www.gamerefinery.com/why-renovation-and-construction-elements-are-becoming-more-popular-in-casual-games/" target="_blank" rel="noreferrer">elemen konstruksi dalam 49% game Match3 AS di 100 besar berpendapatan tertinggi</a>, naik dari 7% enam tahun sebelumnya.</p>
<p>Yang berubah pada 2026 adalah lapisan di atasnya. <a href="https://www.gamerefinery.com/mobile-game-market-review-january-2026/" target="_blank" rel="noreferrer">Ulasan GameRefinery pada Januari 2026</a> menyebutnya evolusi, bukan revolusi: Zen Match mengganti meta dekorasi ruangannya dengan lapisan eksplorasi pulau berbasis tugas, Gossip Harbor menambahkan Medal Challenges—kisi tugas meta berformat panjang yang berjalan paralel untuk menggantikan event bulanan satu kali—dan Hay Day menambahkan progresi kooperatif tingkat lingkungan di atas pertaniannya. Dekorasi membawa semua game hingga ke titik ini, tetapi diferensiasi sekarang berasal dari sistem tugas, loop musiman, dan meta co-op yang ditumpuk di atasnya.</p>
<h2 id="ke-mana-uang-mengalir" tabindex="-1">Ke mana uang mengalir <a class="header-anchor" href="#ke-mana-uang-mengalir" aria-label="Permalink to &quot;Ke mana uang mengalir&quot;"></a></h2>
<p>Secara geografis, game kasual mendorong pertumbuhan terbesar di pasar Barat. Amerika Utara mencatat pertumbuhan absolut terbesar dan Eropa tumbuh lebih cepat secara persentase, sedangkan Asia menjadi satu-satunya wilayah tempat pendapatan pembelian dalam aplikasi benar-benar <a href="https://sensortower.com/state-of-gaming-2025" target="_blank" rel="noreferrer">menurun</a>. Sebagian penurunan di Asia disebabkan oleh kuatnya dolar, tetapi arahnya jelas: belanja game kasual berkembang di Barat.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 240" role="img" aria-label="Pertumbuhan pendapatan game kasual menurut wilayah pada 2025: Eropa naik 14 persen, Amerika Utara naik 9 persen dengan pertumbuhan absolut terbesar, dan Asia turun 3 persen" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="240" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Pertumbuhan game kasual bergerak ke Barat</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Perubahan pendapatan dalam aplikasi 2025 menurut wilayah. Penurunan Asia sebagian disebabkan oleh kuatnya dolar. Sumber: Sensor Tower.</text>
  <line x1="280" y1="96" x2="280" y2="212" stroke="#ffffff" stroke-opacity="0.18"/>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="14" font-weight="700">
    <text x="150" y="122" text-anchor="end" fill="#e8edf5">Eropa</text>
    <rect x="280" y="106" width="252" height="22" rx="5" fill="#6ee7b7"/>
    <text x="542" y="122" font-size="13" font-weight="800" fill="#6ee7b7">+14%</text>
    <text x="150" y="164" text-anchor="end" fill="#e8edf5">Amerika Utara</text>
    <rect x="280" y="148" width="162" height="22" rx="5" fill="#7dd3fc"/>
    <text x="452" y="164" font-size="13" font-weight="800" fill="#7dd3fc">+9%</text>
    <text x="504" y="164" font-size="11.5" font-weight="600" fill="#9aa7b4">pertumbuhan absolut terbesar</text>
    <text x="150" y="206" text-anchor="end" fill="#e8edf5">Asia</text>
    <rect x="226" y="190" width="54" height="22" rx="5" fill="#fb7185"/>
    <text x="218" y="206" text-anchor="end" font-size="13" font-weight="800" fill="#fb7185">&#8722;3%</text>
  </g>
</svg>
<p>Tonggak paling mencolok pada 2025 justru berada di luar game. Untuk pertama kalinya, aplikasi non-game mengungguli game dalam pendapatan pembelian dalam aplikasi seluler, sekitar $85,6 miliar berbanding $81,8 miliar. Sebagian besar pergeseran itu berasal dari aplikasi langganan AI generatif, seperti dijelaskan oleh <a href="https://www.deconstructoroffun.com/blog/2026/2/2/state-of-mobile-2026" target="_blank" rel="noreferrer">Deconstructor of Fun</a>. Game kehilangan posisi teratas di toko aplikasi yang dahulu dikuasainya, sebagian karena produk AI. Ini layak direnungkan.</p>
<h2 id="aturan-toko-aplikasi-juga-berubah" tabindex="-1">Aturan toko aplikasi juga berubah <a class="header-anchor" href="#aturan-toko-aplikasi-juga-berubah" aria-label="Permalink to &quot;Aturan toko aplikasi juga berubah&quot;"></a></h2>
<p>Hal lain yang membentuk ulang monetisasi game kasual pada 2026 terjadi di ruang sidang dan kantor regulator, bukan dalam desain game. Di AS, Apple dipaksa mengizinkan tautan pembayaran eksternal bebas komisi sejak putusan penghinaan terhadap pengadilan pada April 2025. Meski <a href="https://www.macrumors.com/2025/12/11/apple-app-store-fees-external-payment-links/" target="_blank" rel="noreferrer">putusan banding Desember 2025</a> mengizinkan Apple pada akhirnya mengenakan &quot;komisi yang wajar&quot;, tak ada biaya yang berlaku hingga pengadilan menyetujuinya, sehingga tautan tersebut tetap gratis hingga pertengahan 2026. Di Uni Eropa, Core Technology Fee per instalasi telah dihapus dan digantikan oleh <a href="https://developer.apple.com/support/dma-and-apps-in-the-eu/" target="_blank" rel="noreferrer">Core Technology Commission sebesar 5%</a> atas pendapatan barang digital mulai Januari 2026. Di Android, Google dan Epic <a href="https://www.pocketgamer.biz/google-and-epic-withdraw-settlement-as-play-store-overhaul-moves-ahead/" target="_blank" rel="noreferrer">menarik kembali kesepakatan mereka pada 15 Juli 2026</a>, sehingga putusan awal tetap berlaku: mulai 22 Juli, toko aplikasi pesaing didistribusikan sebagai aplikasi yang dapat diunduh di Play Store AS, dan listing AS secara otomatis diikutsertakan ke toko pihak ketiga kecuali developer memilih untuk keluar.
Bagi studio game kasual, kesimpulan praktisnya adalah pendapatan di luar toko aplikasi tidak lagi menjadi hal yang asing. <a href="https://www.revenuecat.com/state-of-subscription-apps" target="_blank" rel="noreferrer">State of Subscription Apps 2026</a> dari RevenueCat menemukan bahwa 41% aplikasi terbesar sudah menghasilkan pendapatan dari web, dibandingkan hanya sekitar 1% aplikasi tingkat hobi. Toko web langsung ke konsumen, tautan pembayaran eksternal, dan toko alternatif kini menjadi opsi yang setidaknya perlu dipertimbangkan oleh game kasual skala menengah.</p>
<h2 id="perubahan-yang-dibawa-ai-dalam-pembuatan-game-kasual" tabindex="-1">Perubahan yang dibawa AI dalam pembuatan game kasual <a class="header-anchor" href="#perubahan-yang-dibawa-ai-dalam-pembuatan-game-kasual" aria-label="Permalink to &quot;Perubahan yang dibawa AI dalam pembuatan game kasual&quot;"></a></h2>
<p>AI hadir di kedua sisi persamaan. Dari sisi pengeluaran, seperti disebutkan di atas, aplikasi AI kini menyerap uang yang sebelumnya mengalir ke game. Dari sisi produksi, AI generatif telah beralih dari eksperimen menjadi perangkat standar. Survei State of the Game Industry dari GDC untuk 2025 menemukan bahwa 52% developer bekerja di perusahaan yang menggunakan AI generatif di suatu bagian organisasi, sementara edisi 2026 mencatat penggunaan pribadi sebesar 36%.</p>
<p>Namun, trennya tidak terus meningkat secara lurus. <a href="https://www.gamedeveloper.com/production/developer-use-of-generative-ai-may-be-declining" target="_blank" rel="noreferrer">Survei Game Developer Collective</a> yang lebih baru menemukan bahwa penggunaan pribadi turun menjadi 29%, menunjukkan bahwa beberapa tim mencoba perangkat AI lalu mengurangi penggunaannya. Sentimen juga memburuk meskipun adopsinya meluas: dalam survei GDC 2026 yang sama, 52% developer mengatakan bahwa AI generatif memberikan dampak negatif pada industri, angka tertinggi sejauh ini. Kesimpulan jujurnya pada 2026 adalah bahwa AI telah menjadi arus utama di studio game, tetapi masih mencari peran yang benar-benar bermanfaat. Untuk game kasual, itu berarti pembuatan prototipe cepat, pembuatan aset, dan konten live-ops, bukan merilis seluruh game dalam kondisi yang sepenuhnya tidak disentuh manusia.</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 250" role="img" aria-label="Adopsi AI generatif di kalangan developer game: 52 persen bekerja di perusahaan yang menggunakan AI, 36 persen menggunakannya sendiri, dan 29 persen dalam survei berikutnya" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="250" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">AI telah masuk ke studio</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Persentase developer game yang menggunakan AI generatif. Sumber: GDC; Game Developer Collective.</text>
  <g transform="translate(180,120)">
    <circle r="44" fill="none" stroke="#1b2540" stroke-width="11"/>
    <circle r="44" fill="none" stroke="#c8a8ff" stroke-width="11" stroke-linecap="round" stroke-dasharray="143.8 276.5" transform="rotate(-90)"/>
    <text y="8" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="26" font-weight="800" fill="#e8edf5">52%</text>
    <text y="74" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" font-weight="700" fill="#e8edf5">Di perusahaan pengguna AI</text>
    <text y="92" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="11.5" fill="#9aa7b4">Survei GDC 2025</text>
  </g>
  <g transform="translate(360,120)">
    <circle r="44" fill="none" stroke="#1b2540" stroke-width="11"/>
    <circle r="44" fill="none" stroke="#7dd3fc" stroke-width="11" stroke-linecap="round" stroke-dasharray="99.5 276.5" transform="rotate(-90)"/>
    <text y="8" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="26" font-weight="800" fill="#e8edf5">36%</text>
    <text y="74" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" font-weight="700" fill="#e8edf5">Menggunakannya sendiri</text>
    <text y="92" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="11.5" fill="#9aa7b4">Survei GDC 2026</text>
  </g>
  <g transform="translate(540,120)">
    <circle r="44" fill="none" stroke="#1b2540" stroke-width="11"/>
    <circle r="44" fill="none" stroke="#f0abfc" stroke-width="11" stroke-linecap="round" stroke-dasharray="80.2 276.5" transform="rotate(-90)"/>
    <text y="8" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="26" font-weight="800" fill="#e8edf5">29%</text>
    <text y="74" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" font-weight="700" fill="#e8edf5">Penggunaan pribadi, berikutnya</text>
    <text y="92" text-anchor="middle" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="11.5" fill="#9aa7b4">turun dari 36%</text>
  </g>
</svg>
<p>Bagi kreator solo dan tim kecil, inilah perkembangan yang paling menarik. Pendekatan prompt-ke-game yang sama dengan yang melahirkan kategori aplikasi AI kini diarahkan untuk membuat game itu sendiri. Kasual adalah genre yang paling mampu ditangani AI karena gameplay loop-nya ringkas dan cakupannya kecil. Itulah sebabnya perangkat seperti Cinevva dapat mengubah satu kalimat menjadi game yang bisa langsung dimainkan di browser Anda.</p>
<h2 id="artinya-bagi-anda-yang-sedang-membuat-game-kasual" tabindex="-1">Artinya bagi Anda yang sedang membuat game kasual <a class="header-anchor" href="#artinya-bagi-anda-yang-sedang-membuat-game-kasual" aria-label="Permalink to &quot;Artinya bagi Anda yang sedang membuat game kasual&quot;"></a></h2>
<p>Jika semuanya disatukan, strategi untuk 2026 berbeda dari 2022. Anda tidak lagi berlomba mendapatkan instalasi murah karena era itu sudah berakhir. Anda berusaha membuat sesuatu yang benar-benar akan dipertahankan dan dibelanjakan oleh audiens yang lebih kecil. Strategi ini mengutamakan daya tarik utama yang jelas dengan kedalaman di baliknya, monetisasi hibrida yang menghargai baik penonton iklan maupun pemain yang berbelanja, serta pendekatan baru terhadap gameplay loop yang sudah terbukti alih-alih membuat klona Match3 yang keseribu. Audiens Barat aktif berbelanja, kategori puzzle padat di jajaran teratas tetapi masih terbuka lebar bagi mekanik baru, dan biaya untuk mencoba sebuah ide telah merosot karena AI kini dapat membuat versi pertama yang bisa dimainkan untuk Anda.</p>
<p>Bagian terakhir itulah peluang yang sebenarnya. Ketika prototipe hanya membutuhkan beberapa menit, bukan sepanjang akhir pekan, Anda dapat menguji sepuluh konsep hybrid-casual dengan usaha yang sebelumnya hanya cukup untuk satu konsep. Pasar menghargai ide yang mampu bertahan, dan cara tercepat untuk menemukannya adalah dengan membuat dan memainkannya, bukan sekadar merencanakannya. <a href="/id/game-creator.html">Mulai dari sebuah prompt</a> dan lihat mana yang berhasil.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-pasar-game-kasual-menyusut-pada-2026" tabindex="-1">Apakah pasar game kasual menyusut pada 2026? <a class="header-anchor" href="#apakah-pasar-game-kasual-menyusut-pada-2026" aria-label="Permalink to &quot;Apakah pasar game kasual menyusut pada 2026?&quot;"></a></h3>
<p>Tidak, tetapi pertumbuhan jumlah unduhannya telah berhenti. Pendapatan dalam aplikasi masih naik tipis menjadi sekitar $81,75 miliar pada 2025, sementara jumlah unduhan turun 7,2%. Penurunan berlanjut hingga 2026, dengan jumlah unduhan pada kuartal pertama turun 11,9% dari tahun ke tahun. Pasar ini semakin matang, sehingga pertumbuhan berasal dari peningkatan belanja pemain, bukan instalasi baru.</p>
<h3 id="apa-itu-hybrid-casual-dan-mengapa-penting" tabindex="-1">Apa itu hybrid-casual dan mengapa penting? <a class="header-anchor" href="#apa-itu-hybrid-casual-dan-mengapa-penting" aria-label="Permalink to &quot;Apa itu hybrid-casual dan mengapa penting?&quot;"></a></h3>
<p>Hybrid-casual memadukan gameplay loop hypercasual yang sederhana dan cocok untuk iklan dengan progresi serta pembelian yang lebih mendalam seperti dalam game kasual lengkap. Ini adalah satu-satunya segmen kasual yang mencatat pertumbuhan pendapatan dalam aplikasi pada 2025, naik 20% menjadi $4,2 miliar, sehingga menjadi kategori yang paling layak dipelajari saat ini.</p>
<h3 id="game-kasual-apa-yang-sedang-melejit-saat-ini" tabindex="-1">Game kasual apa yang sedang melejit saat ini? <a class="header-anchor" href="#game-kasual-apa-yang-sedang-melejit-saat-ini" aria-label="Permalink to &quot;Game kasual apa yang sedang melejit saat ini?&quot;"></a></h3>
<p>Di antara berbagai hit baru, game puzzle hybrid-casual seperti Color Block Jam, Pixel Flow, Screwdom, dan Magic Sort tumbuh pesat pada 2025. Di antara para raksasa yang sudah mapan, Royal Match dan Monopoly Go! memimpin dari sisi pendapatan, sementara Block Blast! memimpin dari sisi jumlah unduhan.</p>
<h3 id="apakah-game-saya-sebaiknya-menggunakan-iklan-atau-pembelian-dalam-aplikasi" tabindex="-1">Apakah game saya sebaiknya menggunakan iklan atau pembelian dalam aplikasi? <a class="header-anchor" href="#apakah-game-saya-sebaiknya-menggunakan-iklan-atau-pembelian-dalam-aplikasi" aria-label="Permalink to &quot;Apakah game saya sebaiknya menggunakan iklan atau pembelian dalam aplikasi?&quot;"></a></h3>
<p>Itu bergantung pada gamenya. Game sederhana dengan jangkauan luas dapat mengandalkan iklan, game dengan metagame mendalam paling cocok bebas iklan dan mengandalkan pembelian, sedangkan sebagian besar game di antara keduanya menghasilkan lebih banyak dengan memadukan kedua model. Model monetisasi harus mengikuti desain, bukan sebaliknya.</p>
<h3 id="bagaimana-ai-mengubah-pengembangan-game-kasual" tabindex="-1">Bagaimana AI mengubah pengembangan game kasual? <a class="header-anchor" href="#bagaimana-ai-mengubah-pengembangan-game-kasual" aria-label="Permalink to &quot;Bagaimana AI mengubah pengembangan game kasual?&quot;"></a></h3>
<p>AI generatif kini menjadi perangkat standar di studio, dengan 52% developer bekerja di perusahaan yang menggunakannya. Khusus untuk game kasual, AI mempercepat pembuatan prototipe, aset, dan konten live-ops. Perangkat prompt-ke-game kini juga memungkinkan kreator membuat game kasual yang bisa dimainkan hanya dari sebuah deskripsi.</p>
<h3 id="seberapa-besar-pasar-game-kasual-pada-2026" tabindex="-1">Seberapa besar pasar game kasual pada 2026? <a class="header-anchor" href="#seberapa-besar-pasar-game-kasual-pada-2026" aria-label="Permalink to &quot;Seberapa besar pasar game kasual pada 2026?&quot;"></a></h3>
<p>Game seluler menghasilkan sekitar $81,75 miliar dari pembelian dalam aplikasi pada 2025, hanya naik 1,3% dibandingkan 2024, dan 1.000 game kasual teratas menyumbang sekitar $23 miliar dari jumlah tersebut. Jumlah unduhan turun 7,2% menjadi 50,4 miliar, sehingga pasar tumbuh melalui belanja per pemain, bukan instalasi baru.</p>
<h3 id="apakah-hypercasual-sudah-mati-pada-2026" tabindex="-1">Apakah hypercasual sudah mati pada 2026? <a class="header-anchor" href="#apakah-hypercasual-sudah-mati-pada-2026" aria-label="Permalink to &quot;Apakah hypercasual sudah mati pada 2026?&quot;"></a></h3>
<p>Tidak. Yang tidak lagi berfungsi adalah model bisnis yang hanya mengandalkan iklan, bukan gamenya. Hypercasual masih memimpin seluruh kategori dalam jumlah unduhan pada 2025 dengan 22,05 miliar instalasi, dan format ini beralih ke monetisasi hibrida yang menambahkan pembelian dalam aplikasi di atas pendapatan iklan.</p>
<BuildCta
  title="Ikuti gelombang game kasual dengan game buatan Anda sendiri"
  desc="Game cozy dan kasual adalah genre termudah untuk memulai."
  prompt="Buat game puzzle match-and-merge yang cozy dengan warna-warna lembut" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-game-generators-2026.html">Generator Game AI Terbaik pada 2026</a> — perangkat yang membuat game kasual dari sebuah prompt</li>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Tanpa Coding)</a> — proses pembuatan langkah demi langkah</li>
<li><a href="/id/guides/vibe-coding-games.html">Vibe Coding untuk Game: Pengertian dan Cara Memulainya</a> — pola pikir pembuatan prototipe yang dihargai pasar ini</li>
<li><a href="/id/guides/vibe-coding-game-prompts.html">Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — konsep kasual untuk diuji dengan cepat</li>
<li><a href="/id/guides/get-more-plays-itch-io.html">Cara Mendapatkan Lebih Banyak Pemain di itch.io</a> — menemukan audiens yang bertahan</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web: Fakta yang Sebenarnya Ditunjukkan Data</a> — tinjauan berbasis data yang sama tentang cara game browser menghasilkan pendapatan</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/casual-games-trends-2026-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara membuat game di Cinevva]]></title>
            <link>https://app.cinevva.com/id/guides/how-to-write-a-game</link>
            <guid>https://app.cinevva.com/id/guides/how-to-write-a-game</guid>
            <pubDate>Wed, 24 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Panduan praktis untuk menulis prompt yang berubah menjadi game yang benar-benar ingin terus Anda kembangkan. Cara memulai, melakukan iterasi, dan menjelaskan bug agar AI memperbaikinya pada percobaan pertama.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-membuat-game-di-cinevva" tabindex="-1">Cara membuat game di Cinevva <a class="header-anchor" href="#cara-membuat-game-di-cinevva" aria-label="Permalink to &quot;Cara membuat game di Cinevva&quot;"></a></h1>
<p>Anda mengetikkan apa yang diinginkan, Cinevva membuat game yang bisa dimainkan di browser, lalu Anda mengubahnya lewat percakapan. Begitulah keseluruhan alurnya. Bagian tersulitnya bukan alatnya, melainkan mengetahui apa yang perlu dikatakan.</p>
<p>Kami menelaah sesi nyata selama seminggu untuk melihat perbedaan antara prompt yang menghasilkan game yang terus dikembangkan seseorang dan prompt yang ditinggalkan tepat setelah pembuatan pertama. Polanya jelas dan sama sekali tidak rumit. Berikut cara yang efektif.</p>
<h2 id="mulailah-dengan-satu-kalimat-yang-jelas" tabindex="-1">Mulailah dengan satu kalimat yang jelas <a class="header-anchor" href="#mulailah-dengan-satu-kalimat-yang-jelas" aria-label="Permalink to &quot;Mulailah dengan satu kalimat yang jelas&quot;"></a></h2>
<p>Pembuka terbaik adalah satu atau dua kalimat yang menyebutkan jenis game dan satu hal yang membuatnya seru. &quot;Game bertahan hidup dari zombi dengan tampilan dari atas, tempat Anda membawa senter dan amunisi terbatas&quot; memberi AI sebuah genre, sudut kamera, ketegangan utama, dan batasan sebagai dasar pembuatan. AI tahu persis apa yang harus dibuat.</p>
<p>Bandingkan dengan &quot;platformer&quot; atau &quot;game shooter&quot;. Itu adalah pembuka nyata yang kami lihat setiap hari. Cinevva akan membuat sesuatu berdasarkan prompt tersebut, tetapi hasilnya belum tentu sesuai dengan yang Anda bayangkan. Semakin spesifik kalimat pertama Anda, semakin mendekati keinginan Anda hasil pembuatan pertamanya.</p>
<h2 id="jelaskan-nuansanya-bukan-game-terkenal" tabindex="-1">Jelaskan nuansanya, bukan game terkenal <a class="header-anchor" href="#jelaskan-nuansanya-bukan-game-terkenal" aria-label="Permalink to &quot;Jelaskan nuansanya, bukan game terkenal&quot;"></a></h2>
<p>Banyak orang memulai dengan satu judul. Pokemon. GTA. Minecraft. Game Roblox yang mereka sukai. Kami mengerti, game-game itulah yang membuat Anda ingin menciptakan game sendiri. Masalahnya, game tersebut dibuat selama bertahun-tahun oleh studio yang beranggotakan banyak orang dan tidak akan muat dalam satu tab browser.</p>
<p>Jadi, sebutkan bagian yang benar-benar Anda inginkan. Jika Anda mengatakan GTA, kemungkinan maksud Anda adalah &quot;berkendara mengelilingi kota terbuka dan menjalankan misi&quot;. Jika Anda mengatakan Minecraft, mungkin maksud Anda adalah &quot;memasang dan menghancurkan balok pada kisi tanpa batas untuk membangun berbagai hal&quot;. Jabarkan mekaniknya dan Cinevva dapat menangkap nuansanya, meskipun tidak bisa menghadirkan seluruh waralabanya. Menjelaskan pengalaman selalu lebih baik daripada sekadar menyebutkan merek.</p>
<h2 id="biarkan-game-dibuat-dalam-skala-kecil-lalu-kembangkan" tabindex="-1">Biarkan game dibuat dalam skala kecil, lalu kembangkan <a class="header-anchor" href="#biarkan-game-dibuat-dalam-skala-kecil-lalu-kembangkan" aria-label="Permalink to &quot;Biarkan game dibuat dalam skala kecil, lalu kembangkan&quot;"></a></h2>
<p>Cinevva sengaja membuat bagian kecil yang bisa dimainkan sejak giliran pertama. Kreator yang akhirnya menghasilkan sesuatu yang mereka sukai tidak mencoba memasukkan semuanya ke dalam prompt pembuka. Setelah melihat game berjalan, mereka menambahkan satu hal pada setiap pesan.</p>
<p>&quot;Tambahkan mobil yang berlalu-lalang.&quot; &quot;Buat lompatannya lebih tinggi.&quot; &quot;Beri saya level kedua.&quot; &quot;Tambahkan bilah kesehatan.&quot; Setiap perubahan kecil, cepat, dan mudah diperiksa, lalu semuanya terangkai menjadi game yang utuh. Mencoba menjejalkan sepuluh fitur pada giliran pertama biasanya hanya menghasilkan versi rapuh dari kesepuluh fitur tersebut. Perubahan yang jelas satu per satu adalah cara game bagus dibuat.</p>
<h2 id="jika-ada-yang-salah-jelaskan-dengan-tepat" tabindex="-1">Jika ada yang salah, jelaskan dengan tepat <a class="header-anchor" href="#jika-ada-yang-salah-jelaskan-dengan-tepat" aria-label="Permalink to &quot;Jika ada yang salah, jelaskan dengan tepat&quot;"></a></h2>
<p>Pesan paling umum yang tidak membantu adalah &quot;ini tidak berfungsi&quot;, atau hanya &quot;perbaiki&quot;. AI tidak dapat melihat layar Anda, jadi hanya bisa menebak-nebak.</p>
<p>Sampaikan tiga hal: apa yang Anda lakukan, apa yang terjadi, dan apa yang Anda harapkan. &quot;Saat saya menekan spasi, burungnya nyaris tidak melompat. Saya ingin kepakannya membuatnya terbang lebih tinggi&quot; akan menghasilkan perbaikan nyata pada percobaan pertama. &quot;Mobilnya menembus dinding alih-alih berhenti&quot; langsung menunjukkan adanya masalah pada deteksi tabrakan. Sepuluh kata tambahan dapat menghemat tiga putaran percakapan bolak-balik.</p>
<h2 id="jelaskan-tampilan-secara-konkret" tabindex="-1">Jelaskan tampilan secara konkret <a class="header-anchor" href="#jelaskan-tampilan-secara-konkret" aria-label="Permalink to &quot;Jelaskan tampilan secara konkret&quot;"></a></h2>
<p>Cinevva andal membuat visual saat Anda memberikan sesuatu yang bisa dibayangkan. Warna, bentuk, suasana, dan detail karakter. Seorang kreator mendeskripsikan pahlawannya sebagai &quot;sosok gelap dengan jubah putih, sarung tangan putih, dan mata putih bercahaya&quot;, lalu mendapatkan hasil yang tepat seperti itu.</p>
<p>&quot;Buat tampilannya lebih keren&quot; tidak memberi AI petunjuk apa pun. Sebagai gantinya, sebutkan palet warna, nuansa (neon, nyaman, retro, horor, gambar tangan), serta detail penting tentang karakter atau dunia yang Anda inginkan. Beberapa kata konkret dapat mengubah keseluruhan tampilannya.</p>
<h2 id="gunakan-karya-seni-anda-sendiri" tabindex="-1">Gunakan karya seni Anda sendiri <a class="header-anchor" href="#gunakan-karya-seni-anda-sendiri" aria-label="Permalink to &quot;Gunakan karya seni Anda sendiri&quot;"></a></h2>
<p>Anda tidak harus terpaku pada apa pun yang digambar AI. Masukkan gambar Anda sendiri langsung ke dalam chat dan Cinevva akan menggunakannya sebagai tekstur, sprite, atau latar belakang. Anda juga dapat membuka pustaka aset untuk menggunakan model 3D gratis tanpa perlu mencemaskan atribusi. Jika Anda menginginkan tampilan tertentu, memberikan gambar referensi sering kali lebih efektif daripada mencoba menjelaskannya.</p>
<h2 id="pembuatan-pertama-paling-lambat-dan-pekerjaan-anda-tersimpan" tabindex="-1">Pembuatan pertama paling lambat, dan pekerjaan Anda tersimpan <a class="header-anchor" href="#pembuatan-pertama-paling-lambat-dan-pekerjaan-anda-tersimpan" aria-label="Permalink to &quot;Pembuatan pertama paling lambat, dan pekerjaan Anda tersimpan&quot;"></a></h2>
<p>Pembuatan pertama membutuhkan waktu paling lama karena Cinevva menulis seluruh game Anda dari awal. Setelah itu, hasil pengeditan akan tersedia dalam hitungan detik. Jadi, bertahanlah selama penantian pertama tersebut. Itu benar-benar penantian terlama yang akan Anda alami dalam sesi itu.</p>
<p>Dan ya, game Anda tersimpan. Tutup tab, kembali besok, buka Game saya, lalu lanjutkan tepat dari bagian terakhir yang Anda kerjakan. Tidak ada yang hilang saat Anda pergi.</p>
<h2 id="contoh-prompt-yang-bagus-dari-awal-hingga-akhir" tabindex="-1">Contoh prompt yang bagus dari awal hingga akhir <a class="header-anchor" href="#contoh-prompt-yang-bagus-dari-awal-hingga-akhir" aria-label="Permalink to &quot;Contoh prompt yang bagus dari awal hingga akhir&quot;"></a></h2>
<p>Jika semuanya digabungkan, pembuka yang kuat akan terlihat seperti ini:</p>
<p>&quot;Game shooter twin-stick dengan tampilan dari atas. Saya adalah robot kecil di arena neon, gelombang musuh terus mendekat, dan saya harus menghindar serta menembak untuk bertahan hidup. Buat permainannya cepat dan bergaya arkade.&quot;</p>
<p>Prompt tersebut mencakup genre, karakter, latar, alur permainan utama, dan nuansa, semuanya dalam empat kalimat singkat. Buat gamenya, lihat hasilnya berjalan, lalu mulai menambahkan berbagai hal. Bos setiap lima gelombang. Gerakan dash dengan tombol shift. Pengganda skor untuk kombo. Begitulah satu kalimat berubah menjadi game yang benar-benar ingin Anda bagikan.</p>
<p>Siap mencobanya? <a href="/id/create.html?utm_source=guide&amp;utm_medium=content&amp;utm_campaign=how_to_write_a_game">Buka alat kreasi dan mulai membuat secara gratis →</a></p>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/how-to-write-a-game-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Membuat Game Browser 3D Tanpa Coding (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/3d-browser-game-without-coding</link>
            <guid>https://app.cinevva.com/id/guides/3d-browser-game-without-coding</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Pilihan nyata untuk membuat game browser 3D tanpa coding pada 2026, alasan sebagian besar alat tanpakode hanya mendukung 2D, dan bagaimana alat AI berbasis perintah-teks menjadi cara praktis untuk membuat game 3D di browser.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-membuat-game-browser-3d-tanpa-coding-2026" tabindex="-1">Cara Membuat Game Browser 3D Tanpa Coding (2026) <a class="header-anchor" href="#cara-membuat-game-browser-3d-tanpa-coding-2026" aria-label="Permalink to &quot;Cara Membuat Game Browser 3D Tanpa Coding (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Membuat game 2D tanpa kode sudah dimungkinkan selama bertahun-tahun. Namun, membuat game 3D yang berjalan di browser tanpa kode ternyata sangat sulit, dan kebanyakan panduan diam-diam menghindari persoalan ini dengan menunjukkan alat 2D. Panduan ini tidak demikian. Berikut keadaan sebenarnya dari pembuatan game 3D tanpakode di browser pada 2026, serta cara yang kini benar-benar berfungsi.</p>
<h2 id="kenyataan-pahit-tentang-3d-tanpakode" tabindex="-1">Kenyataan pahit tentang 3D tanpakode <a class="header-anchor" href="#kenyataan-pahit-tentang-3d-tanpakode" aria-label="Permalink to &quot;Kenyataan pahit tentang 3D tanpakode&quot;"></a></h2>
<p>Sebagian besar pembuat game tanpakode klasik ditujukan untuk 2D. Sedikit alat 3D yang benar-benar tanpakode dan berjalan di browser kebanyakan sudah mati atau beralih arah:</p>
<ul>
<li><strong>Struckd</strong>, yang paling mendekati pembuatan 3D seret dan lepas sungguhan di web, akan menutup studionya pada Agustus 2026.</li>
<li><strong>Crayta</strong> sudah ditutup pada 2023.</li>
<li><strong>Core</strong> mendukung pembuatan 3D tanpakode, tetapi hanya tersedia sebagai klien yang harus diunduh, bukan game browser.</li>
<li><strong>PlayCanvas</strong> adalah mesin 3D web yang sangat bagus, tetapi mengharuskan Anda menulis JavaScript sehingga sebenarnya bukan tanpakode.</li>
</ul>
<p>Hal ini menyisakan kesenjangan yang nyata. Jika Anda menginginkan 3D di browser tanpa kode, dunia pembuat visual klasik hampir tidak lagi menawarkan apa pun selain satu pengecualian.</p>
<h2 id="satu-pengecualian-klasik-gdevelop" tabindex="-1">Satu pengecualian klasik: GDevelop <a class="header-anchor" href="#satu-pengecualian-klasik-gdevelop" aria-label="Permalink to &quot;Satu pengecualian klasik: GDevelop&quot;"></a></h2>
<p>GDevelop adalah pembuat game visual gratis dan sumber terbuka yang berjalan di browser serta telah berinvestasi besar-besaran dalam fitur 3D sejak akhir 2025. Anda membuat logika menggunakan lembar kejadian visual alih-alih kode. GDevelop memiliki editor 3D khusus dan fisika 3D, serta dapat menerbitkan game ke web di gd.games dengan tautan yang bisa dibagikan. GDevelop pada dasarnya adalah alat 2D dengan kemampuan 3D yang terus berkembang, jadi kemampuannya tidak akan menyamai mesin 3D khusus. Namun, untuk pembuatan 3D yang benar-benar tanpakode di browser, inilah pilihan klasik terkuat. GDevelop juga telah menambahkan agen AI, yang membawa kita ke cara lainnya.</p>
<h2 id="cara-yang-benar-benar-berfungsi-pada-2026-ai-perintah-teks-ke-game" tabindex="-1">Cara yang benar-benar berfungsi pada 2026: AI perintah-teks-ke-game <a class="header-anchor" href="#cara-yang-benar-benar-berfungsi-pada-2026-ai-perintah-teks-ke-game" aria-label="Permalink to &quot;Cara yang benar-benar berfungsi pada 2026: AI perintah-teks-ke-game&quot;"></a></h2>
<p>Inilah perubahannya. Cara paling praktis untuk membuat game browser 3D tanpa coding pada 2026 bukanlah memakai editor visual, melainkan mendeskripsikan game kepada AI dan membiarkannya membuat game 3D sungguhan menggunakan mesin web. Pendekatan ini terkadang disebut <a href="/id/guides/vibe-coding-games.html">vibe coding</a>, dan khusus untuk 3D, metode ini diam-diam menjadi cara yang dapat diandalkan ketika alat 3D tanpakode klasik mulai menghilang.</p>
<p>Beberapa alat dapat melakukannya:</p>
<ul>
<li><strong>Cinevva</strong> membuat game yang benar-benar 3D dan dapat dimainkan di browser dari perintah teks menggunakan mesin berbasis Three.js, lengkap dengan pembuatan model 3D, gambar, musik, dan skybox bawaan, serta tautan yang langsung dapat dibagikan.</li>
<li><strong>Rosebud</strong> mendukung pembuatan game dari perintah teks dalam format 2D maupun 3D yang terus berkembang, dengan hosting di browser.</li>
<li><strong>Nilo</strong> adalah alat AI 3D berbasis browser yang sangat berfokus pada ekspor ke Roblox dan ditujukan bagi audiens yang lebih muda.</li>
</ul>
<p>Anda tidak perlu menulis kode saat menggunakan alat-alat ini. Anda cukup mendeskripsikan game, memainkan hasilnya, lalu menyempurnakannya dengan meminta perubahan. Lihat <a href="/id/guides/ai-game-generators-2026.html">perbandingan lengkap generator game AI</a> untuk mengetahui perbedaannya.</p>
<h2 id="cara-membuat-game-browser-3d-dengan-ai-langkah-demi-langkah" tabindex="-1">Cara membuat game browser 3D dengan AI, langkah demi langkah <a class="header-anchor" href="#cara-membuat-game-browser-3d-dengan-ai-langkah-demi-langkah" aria-label="Permalink to &quot;Cara membuat game browser 3D dengan AI, langkah demi langkah&quot;"></a></h2>
<h3 id="_1-deskripsikan-game-3d-sederhana" tabindex="-1">1. Deskripsikan game 3D sederhana <a class="header-anchor" href="#_1-deskripsikan-game-3d-sederhana" aria-label="Permalink to &quot;1. Deskripsikan game 3D sederhana&quot;"></a></h3>
<p>Sebutkan genre, satu detail khas, dan sebuah tujuan. 3D berfungsi paling baik ketika konsepnya sederhana dan bersifat spasial. Contohnya:</p>
<blockquote>
<p>Buat game parkour sudut pandang orang pertama yang mengharuskan saya melompati pulau-pulau terapung dan berpacu dengan waktu untuk mencapai garis akhir.</p>
</blockquote>
<p>Anda dapat <a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=3d_no_code">memulai dari perintah teks kosong</a> atau mengambil <a href="/id/guides/vibe-coding-game-prompts.html">perintah teks 3D sekali klik</a>, lalu menyesuaikannya.</p>
<h3 id="_2-mainkan-lalu-ubah-satu-hal" tabindex="-1">2. Mainkan, lalu ubah satu hal <a class="header-anchor" href="#_2-mainkan-lalu-ubah-satu-hal" aria-label="Permalink to &quot;2. Mainkan, lalu ubah satu hal&quot;"></a></h3>
<p>Anda akan mendapatkan adegan 3D yang dapat dimainkan. Mainkan dan pilih satu masalah terbesar. Mintalah satu perubahan tersebut: &quot;buat jangkauan lompatannya lebih jauh,&quot; &quot;tambahkan mekanisme jatuh dan muncul kembali,&quot; atau &quot;percepat pemain.&quot; Ubah, mainkan, lalu ulangi. Siklus inilah inti dari seluruh proses kreatifnya.</p>
<h3 id="_3-tambahkan-aset-3d" tabindex="-1">3. Tambahkan aset 3D <a class="header-anchor" href="#_3-tambahkan-aset-3d" aria-label="Permalink to &quot;3. Tambahkan aset 3D&quot;"></a></h3>
<p>Mintalah model dan tampilan yang Anda inginkan: &quot;beri pemain karakter robot low-poly,&quot; &quot;gunakan skybox matahari terbenam,&quot; atau &quot;buat pulau-pulaunya dari batu dengan rumput di atasnya.&quot; Jika alat tersebut memiliki pustaka aset CC0, manfaatkan aset itu untuk segala hal yang akan Anda terbitkan. <a href="/id/guides/game-assets-guide.html">Panduan aset game gratis</a> kami menjelaskan sumber dan lisensinya.</p>
<h3 id="_4-buat-agar-terasa-seperti-game" tabindex="-1">4. Buat agar terasa seperti game <a class="header-anchor" href="#_4-buat-agar-terasa-seperti-game" aria-label="Permalink to &quot;4. Buat agar terasa seperti game&quot;"></a></h3>
<p>Tambahkan sentuhan akhir yang diperhatikan pemain dalam game 3D: kamera yang jelas, kontrol yang responsif, tujuan yang terlihat, suara untuk tindakan penting, serta kondisi menang atau kalah. Mintalah layar judul dan tombol mulai ulang.</p>
<h3 id="_5-terbitkan-tautannya" tabindex="-1">5. Terbitkan tautannya <a class="header-anchor" href="#_5-terbitkan-tautannya" aria-label="Permalink to &quot;5. Terbitkan tautannya&quot;"></a></h3>
<p>Alat berbasis browser menyediakan URL yang dapat dibagikan hanya dengan satu klik. Bagikan kepada orang lain, lihat pada bagian mana mereka berhenti bermain, lalu jadikan temuan tersebut sebagai dasar untuk perubahan berikutnya.</p>
<h2 id="bagaimana-jika-membuatnya-secara-manual" tabindex="-1">Bagaimana jika membuatnya secara manual? <a class="header-anchor" href="#bagaimana-jika-membuatnya-secara-manual" aria-label="Permalink to &quot;Bagaimana jika membuatnya secara manual?&quot;"></a></h2>
<p>Jika bersedia mempelajari sedikit kode, dunia 3D web menawarkan banyak pilihan: Three.js, Babylon.js, dan PlayCanvas semuanya dapat digunakan untuk membuat game browser 3D yang sangat bagus, sementara mesin seperti Godot juga dapat mengekspor game ke web. Itu memang bukan tanpakode, tetapi perlu diketahui bahwa kemungkinannya sangat luas setelah Anda melewati batas tersebut. <a href="/id/guides/web-game-engines-comparison.html">Perbandingan mesin game web</a> kami membahas berbagai pilihan itu. Jika ingin tetap benar-benar tanpakode, GDevelop atau alat AI perintah-teks-ke-game adalah jawabannya.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bisakah-anda-membuat-game-3d-di-browser-tanpa-coding" tabindex="-1">Bisakah Anda membuat game 3D di browser tanpa coding? <a class="header-anchor" href="#bisakah-anda-membuat-game-3d-di-browser-tanpa-coding" aria-label="Permalink to &quot;Bisakah Anda membuat game 3D di browser tanpa coding?&quot;"></a></h3>
<p>Bisa, tetapi pilihannya terbatas. GDevelop adalah alat tanpakode klasik utama dengan kemampuan 3D browser yang nyata, sedangkan alat AI perintah-teks-ke-game seperti Cinevva, Rosebud, dan Nilo memungkinkan Anda membuat game browser 3D dengan mendeskripsikannya alih-alih menulis kode. Beberapa alat 3D tanpakode lama (Struckd, Crayta) telah ditutup, jadi pilihan praktis pada 2026 adalah GDevelop atau jalur AI.</p>
<h3 id="apa-cara-termudah-untuk-membuat-game-3d-tanpa-pengalaman" tabindex="-1">Apa cara termudah untuk membuat game 3D tanpa pengalaman? <a class="header-anchor" href="#apa-cara-termudah-untuk-membuat-game-3d-tanpa-pengalaman" aria-label="Permalink to &quot;Apa cara termudah untuk membuat game 3D tanpa pengalaman?&quot;"></a></h3>
<p>Deskripsikan game kepada alat AI perintah-teks-ke-game, lalu sempurnakan melalui percakapan. Anda bisa mendapatkan game 3D yang dapat dimainkan dalam hitungan menit tanpa perlu memasang mesin atau menulis kode, lalu meningkatkannya satu perubahan demi satu. Ini adalah titik awal dengan hambatan paling rendah bagi pemula sepenuhnya.</p>
<h3 id="apakah-gdevelop-bagus-untuk-3d" tabindex="-1">Apakah GDevelop bagus untuk 3D? <a class="header-anchor" href="#apakah-gdevelop-bagus-untuk-3d" aria-label="Permalink to &quot;Apakah GDevelop bagus untuk 3D?&quot;"></a></h3>
<p>GDevelop pada dasarnya adalah mesin 2D, tetapi sejak akhir 2025 telah menambahkan editor 3D khusus, fisika 3D, dan berbagai fitur 3D. GDevelop juga gratis, bersumber terbuka, berbasis browser, dan mendukung penerbitan ke web. Kemampuannya memang tidak akan menyamai mesin 3D khusus, tetapi untuk pembuatan 3D tanpakode gratis di browser, GDevelop adalah pilihan klasik terkuat.</p>
<h3 id="apakah-saya-memerlukan-komputer-bertenaga-tinggi-untuk-membuat-game-browser-3d" tabindex="-1">Apakah saya memerlukan komputer bertenaga tinggi untuk membuat game browser 3D? <a class="header-anchor" href="#apakah-saya-memerlukan-komputer-bertenaga-tinggi-untuk-membuat-game-browser-3d" aria-label="Permalink to &quot;Apakah saya memerlukan komputer bertenaga tinggi untuk membuat game browser 3D?&quot;"></a></h3>
<p>Tidak. Alat AI berbasis browser dan GDevelop menjalankan pekerjaan berat di server mereka atau di browser itu sendiri, jadi Anda tidak memerlukan PC gaming atau GPU khusus. Komputer modern yang cukup memadai dan browser terkini sudah cukup untuk membuat dan memainkan game.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-game-generators-2026.html">Generator Game AI Terbaik pada 2026</a> — alat yang membuat game 3D dari perintah teks</li>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Tanpa Coding)</a> — alur kerja lengkap untuk pemula</li>
<li><a href="/id/guides/vibe-coding-games.html">Vibe Coding untuk Game: Pengertian dan Cara Memulainya</a> — penjelasan pendekatan berbasis perintah teks</li>
<li><a href="/id/guides/vibe-coding-game-prompts.html">Perintah Teks Game AI yang Bisa Anda Buat dengan Sekali Klik</a> — titik awal untuk game 3D</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Mesin Game Web Terbaik untuk 2026</a> — jika Anda memutuskan mempelajari sedikit kode</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — model dan tekstur 3D</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/3d-browser-game-without-coding-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Generator Aset AI Terbaik untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/ai-asset-generators-games</link>
            <guid>https://app.cinevva.com/id/guides/ai-asset-generators-games</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Generator aset AI terbaik untuk game pada 2026 untuk model 3D, tekstur, dan audio, membandingkan Meshy, Tripo, Hunyuan3D, TRELLIS, Stable Audio, dan lainnya, beserta catatan lisensi.]]></description>
            <content:encoded><![CDATA[<h1 id="generator-aset-ai-terbaik-untuk-game-2026" tabindex="-1">Generator Aset AI Terbaik untuk Game (2026) <a class="header-anchor" href="#generator-aset-ai-terbaik-untuk-game-2026" aria-label="Permalink to &quot;Generator Aset AI Terbaik untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Pada 2026, membuat aset game sering kali lebih cepat daripada mencari aset gratis yang tepat. Deskripsikan sebuah properti, lalu dapatkan model 3D bertekstur dalam waktu kurang dari satu menit. Ketikkan suasana yang diinginkan, lalu dapatkan musik. Panduan ini membahas generator aset AI terbaik untuk game dalam kategori 3D, tekstur, dan audio, keunggulan masing-masing, serta ketentuan lisensi yang harus Anda perhatikan sebelum merilis game.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/9zUOvhQ828g" title="Meshy 5 - ulasan generator model 3D AI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Ulasan Meshy, salah satu generator model 3D AI terkemuka.</div>
<h2 id="ketentuan-lisensi-yang-perlu-diperhatikan-baca-ini-terlebih-dahulu" tabindex="-1">Ketentuan lisensi yang perlu diperhatikan (baca ini terlebih dahulu) <a class="header-anchor" href="#ketentuan-lisensi-yang-perlu-diperhatikan-baca-ini-terlebih-dahulu" aria-label="Permalink to &quot;Ketentuan lisensi yang perlu diperhatikan (baca ini terlebih dahulu)&quot;"></a></h2>
<p>Sebagian besar generator AI yang dihosting memungkinkan Anda membuat aset secara gratis, tetapi hanya memberikan hak penggunaan komersial melalui paket berbayar. Hasil dari paket gratis juga sering kali tidak boleh digunakan secara komersial. Model terbuka yang Anda hosting sendiri biasanya paling aman untuk penggunaan komersial, tetapi masing-masing memiliki lisensi tersendiri (beberapa mengecualikan wilayah tertentu). Sebelum merilis apa pun yang dibuat oleh AI, pastikan ketentuan hak penggunaan hasil dari model tersebut. Jika ragu, gunakan model terbuka dengan lisensi permisif atau paket berbayar yang memberikan hak penggunaan komersial.</p>
<h2 id="generator-model-3d" tabindex="-1">Generator model 3D <a class="header-anchor" href="#generator-model-3d" aria-label="Permalink to &quot;Generator model 3D&quot;"></a></h2>
<h3 id="dihosting-paling-cepat-untuk-mulai-digunakan" tabindex="-1">Dihosting (paling cepat untuk mulai digunakan) <a class="header-anchor" href="#dihosting-paling-cepat-untuk-mulai-digunakan" aria-label="Permalink to &quot;Dihosting (paling cepat untuk mulai digunakan)&quot;"></a></h3>
<ul>
<li><strong>Meshy</strong>: mengubah teks atau gambar menjadi mesh 3D bertekstur yang dapat di-rig, lengkap dengan material PBR. Hasil dari paket gratis dilisensikan dengan CC BY 4.0, sehingga penggunaan komersial diperbolehkan selama Anda mencantumkan atribusi kepada Meshy. Pilihan serbaguna yang paling populer. <a href="https://www.meshy.ai" target="_blank" rel="noreferrer">meshy.ai</a></li>
<li><strong>Tripo</strong>: mengubah teks atau gambar menjadi 3D dengan PBR 4K dan rigging otomatis. Paket gratis hanya untuk penggunaan nonkomersial. Menghasilkan aset berkualitas tinggi yang berfokus pada kebutuhan game. <a href="https://www.tripo3d.ai" target="_blank" rel="noreferrer">tripo3d.ai</a></li>
<li><strong>Rodin / Hyper3D</strong>: topologi quad yang rapi, gratis untuk membuat tetapi berbayar untuk mengunduh. Cocok jika Anda mementingkan topologi mesh. <a href="https://hyper3d.ai" target="_blank" rel="noreferrer">hyper3d.ai</a></li>
<li><strong>Sloyd</strong>: pembuatan aset parametrik dan AI yang berfokus pada game, dengan penggunaan komersial melalui paket berbayar. <a href="https://www.sloyd.ai" target="_blank" rel="noreferrer">sloyd.ai</a></li>
</ul>
<h3 id="terbuka-hosting-sendiri-ramah-penggunaan-komersial" tabindex="-1">Terbuka (hosting sendiri, ramah penggunaan komersial) <a class="header-anchor" href="#terbuka-hosting-sendiri-ramah-penggunaan-komersial" aria-label="Permalink to &quot;Terbuka (hosting sendiri, ramah penggunaan komersial)&quot;"></a></h3>
<ul>
<li><strong>Hunyuan3D 2.1</strong> (Tencent): bobot dan kode pelatihan terbuka, dengan tekstur PBR berkualitas produksi. Perhatikan bahwa lisensinya mengecualikan Uni Eropa, Britania Raya, dan Korea Selatan, jadi periksa ketentuannya sebelum merilis game di wilayah tersebut. Cinevva menjalankannya sebagai <a href="/id/tools/hunyuan3d.html">Generator Model 3D</a>.</li>
<li><strong>TRELLIS.2</strong> (Microsoft): berlisensi MIT, pemimpin terkini dalam kategori model terbuka untuk konversi gambar ke 3D, dengan PBR native.</li>
<li><strong>SAM 3D</strong> (Meta): mengubah satu foto menjadi 3D untuk objek dan tubuh manusia. Cinevva menjalankannya sebagai <a href="/id/tools/sam3d.html">alat perekaman objek dari gambar ke 3D</a> di dalam browser yang menghasilkan Gaussian splat.</li>
<li><strong>Roblox Cube 3D</strong>: alat sumber terbuka untuk mengubah teks menjadi mesh.</li>
</ul>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/-_ZlUTXaFqA" title="Tripo 3.1 - ulasan pembuatan aset 3D dengan AI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Melihat Tripo membuat aset 3D yang siap digunakan dalam game.</div>
<h2 id="generator-tekstur-dan-gambar" tabindex="-1">Generator tekstur dan gambar <a class="header-anchor" href="#generator-tekstur-dan-gambar" aria-label="Permalink to &quot;Generator tekstur dan gambar&quot;"></a></h2>
<p>Untuk tekstur tileable, sprite, concept art, dan UI:</p>
<ul>
<li><strong>FLUX.2</strong> (Black Forest Labs): andal untuk mengubah teks menjadi gambar dan melakukan penyuntingan. Opsi terbuka yang bebas digunakan secara komersial adalah klein 4B (Apache 2.0).</li>
<li><strong>Qwen-Image</strong> (Alibaba): terbuka, berlisensi Apache 2.0, dengan kemampuan rendering teks terbaik di kelasnya (sangat cocok untuk papan petunjuk dan label).</li>
<li><strong>Stable Diffusion 3.5</strong>: ekosistem matang (ControlNet, inpainting, LoRA) untuk kustomisasi mendalam.</li>
</ul>
<p>Model-model ini menghasilkan tekstur tileable dan karya seni 2D yang dapat langsung Anda masukkan ke dalam game. Lihat <a href="/id/guides/frontier-gen-ai-models.html">panduan model AI generatif terbuka</a> kami untuk daftar lengkap beserta lisensinya.</p>
<h2 id="generator-audio-musik-dan-sfx" tabindex="-1">Generator audio (musik dan SFX) <a class="header-anchor" href="#generator-audio-musik-dan-sfx" aria-label="Permalink to &quot;Generator audio (musik dan SFX)&quot;"></a></h2>
<ul>
<li><strong>Stable Audio 3.0</strong>: bobot terbuka untuk model Small, ditambah model efek suara terbuka khusus, yang dilatih menggunakan data berlisensi (memberikan landasan hukum yang jelas). Pilihan terbuka terbaik untuk SFX game.</li>
<li><strong>ACE-Step 1.5</strong>: generator musik terbuka berlisensi MIT dalam berbagai bahasa, dengan fitur kloning suara.</li>
<li><strong>ElevenLabs</strong>: opsi terkuat yang dihosting untuk SFX dan musik, dengan hak penggunaan komersial pada paket berbayar.</li>
</ul>
<h2 id="rigging-dan-animasi" tabindex="-1">Rigging dan animasi <a class="header-anchor" href="#rigging-dan-animasi" aria-label="Permalink to &quot;Rigging dan animasi&quot;"></a></h2>
<p>Rigging otomatis telah berkembang pesat: model terbuka seperti <strong>UniRig</strong> (MIT) dan <strong>NVIDIA SOMA-X</strong> (Apache 2.0) menghasilkan skeleton dan skinning untuk mesh Anda, sehingga menjadi pengganti Mixamo yang layak, mengingat layanan tersebut kini kurang dapat diandalkan. Alat yang dihosting seperti Tripo dan Meshy juga menyediakan rigging otomatis. <a href="/id/tools/rigger.html">Auto Rigger</a> dari Cinevva melakukannya di dalam browser: unggah GLB, FBX, atau OBJ, lalu dapatkan kembali model yang telah di-rig dengan opsi animasi preset.</p>
<h2 id="perbandingan" tabindex="-1">Perbandingan <a class="header-anchor" href="#perbandingan" aria-label="Permalink to &quot;Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Menghasilkan</th>
<th>Terbuka / dihosting</th>
<th>Penggunaan komersial</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Meshy</strong></td>
<td>Model 3D</td>
<td>Dihosting</td>
<td>Paket gratis CC BY (cantumkan atribusi kepada Meshy)</td>
</tr>
<tr>
<td><strong>Tripo</strong></td>
<td>Model 3D + rig</td>
<td>Dihosting</td>
<td>Paket berbayar</td>
</tr>
<tr>
<td><strong>Hunyuan3D 2.1</strong></td>
<td>Model 3D</td>
<td>Terbuka</td>
<td>Ya (dengan batasan wilayah)</td>
</tr>
<tr>
<td><strong>TRELLIS.2</strong></td>
<td>Model 3D</td>
<td>Terbuka (MIT)</td>
<td>Ya</td>
</tr>
<tr>
<td><strong>FLUX.2 klein</strong></td>
<td>Gambar/tekstur</td>
<td>Terbuka (Apache)</td>
<td>Ya</td>
</tr>
<tr>
<td><strong>Qwen-Image</strong></td>
<td>Gambar/tekstur</td>
<td>Terbuka (Apache)</td>
<td>Ya</td>
</tr>
<tr>
<td><strong>Stable Audio 3.0</strong></td>
<td>Musik + SFX</td>
<td>Terbuka</td>
<td>Ya</td>
</tr>
<tr>
<td><strong>ElevenLabs</strong></td>
<td>SFX + musik</td>
<td>Dihosting</td>
<td>Paket berbayar</td>
</tr>
</tbody>
</table>
<h2 id="opsi-lengkap-dalam-satu-alat" tabindex="-1">Opsi lengkap dalam satu alat <a class="header-anchor" href="#opsi-lengkap-dalam-satu-alat" aria-label="Permalink to &quot;Opsi lengkap dalam satu alat&quot;"></a></h2>
<p>Menggabungkan alat-alat ini memang bisa dilakukan, tetapi membutuhkan sebuah pipeline. Beberapa kreator game mengintegrasikan fitur pembuatan aset langsung ke dalam editor: Cinevva memiliki fitur bawaan untuk mengubah teks menjadi 3D serta membuat gambar, musik, dan skybox, sehingga Anda dapat membuat aset dan langsung memasukkannya ke dalam game tanpa harus mengekspor dan mengimpor antaralat. Anda dapat <a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=ai_asset_generators">mencobanya secara gratis</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-generator-model-3d-ai-terbaik-untuk-game" tabindex="-1">Apa generator model 3D AI terbaik untuk game? <a class="header-anchor" href="#apa-generator-model-3d-ai-terbaik-untuk-game" aria-label="Permalink to &quot;Apa generator model 3D AI terbaik untuk game?&quot;"></a></h3>
<p>Untuk alat yang dihosting, Meshy dan Tripo merupakan pilihan serbaguna terkemuka (mengubah teks atau gambar menjadi mesh bertekstur yang dapat di-rig). Hasil dari paket gratis Meshy menggunakan lisensi CC BY 4.0, sehingga Anda dapat menggunakannya secara komersial jika mencantumkan kredit kepada Meshy, sedangkan Tripo memberikan hak penggunaan komersial melalui paket berbayarnya. Untuk model terbuka yang dapat dihosting sendiri, Hunyuan3D 2.1 dan TRELLIS.2 dari Microsoft adalah pilihan terkuat pada 2026. Pilihan terbaik bergantung pada apakah Anda menginginkan alat praktis yang dihosting atau bobot terbuka yang ramah penggunaan komersial.</p>
<h3 id="bisakah-saya-menggunakan-aset-buatan-ai-dalam-game-komersial" tabindex="-1">Bisakah saya menggunakan aset buatan AI dalam game komersial? <a class="header-anchor" href="#bisakah-saya-menggunakan-aset-buatan-ai-dalam-game-komersial" aria-label="Permalink to &quot;Bisakah saya menggunakan aset buatan AI dalam game komersial?&quot;"></a></h3>
<p>Sering kali bisa, tetapi periksa lisensinya. Model terbuka yang Anda hosting sendiri biasanya paling aman (perhatikan bahwa Hunyuan3D mengecualikan beberapa wilayah). Alat yang dihosting umumnya hanya memberikan hak penggunaan komersial melalui paket berbayar, sedangkan hasil dari paket gratis sering kali tidak boleh digunakan secara komersial. Selalu pastikan ketentuan hak penggunaan hasil dari model tersebut, dan ungkapkan penggunaan konten AI jika diwajibkan oleh platform Anda.</p>
<h3 id="apakah-ada-generator-aset-ai-gratis" tabindex="-1">Apakah ada generator aset AI gratis? <a class="header-anchor" href="#apakah-ada-generator-aset-ai-gratis" aria-label="Permalink to &quot;Apakah ada generator aset AI gratis?&quot;"></a></h3>
<p>Banyak alat menawarkan paket gratis, tetapi biasanya membatasi penggunaan dan tidak memberikan hak penggunaan komersial. Model terbuka seperti TRELLIS.2, FLUX.2 klein, Qwen-Image, dan Stable Audio dapat dijalankan sendiri secara gratis dengan lisensi yang ramah penggunaan komersial jika Anda memiliki perangkat keras yang memadai. Tabel perbandingan di atas menunjukkan alat mana yang terbuka dan mana yang dihosting.</p>
<h3 id="bisakah-ai-membuat-musik-dan-efek-suara-untuk-game" tabindex="-1">Bisakah AI membuat musik dan efek suara untuk game? <a class="header-anchor" href="#bisakah-ai-membuat-musik-dan-efek-suara-untuk-game" aria-label="Permalink to &quot;Bisakah AI membuat musik dan efek suara untuk game?&quot;"></a></h3>
<p>Bisa. Stable Audio 3.0 menawarkan bobot terbuka, termasuk model efek suara khusus, ACE-Step menghasilkan musik dengan lisensi MIT, dan ElevenLabs merupakan opsi kuat yang dihosting dengan hak penggunaan komersial pada paket berbayar. Alat-alat ini mencakup musik dan SFX untuk keseluruhan lanskap suara game.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Terbaik untuk Game</a> — pembahasan teknis mendalam</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — aset gratis siap pakai</li>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a> — cari aset alih-alih membuatnya</li>
<li><a href="/id/guides/free-sound-effects-music.html">Efek Suara dan Musik Gratis untuk Game</a> — audio siap pakai</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — memahami ketentuannya</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/ai-asset-generators-games-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Generator Game AI Terbaik pada 2026 (Peringkat dan Perbandingan)]]></title>
            <link>https://app.cinevva.com/id/guides/ai-game-generators-2026</link>
            <guid>https://app.cinevva.com/id/guides/ai-game-generators-2026</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Kami membandingkan generator game AI terbaik pada 2026 berdasarkan apa yang benar-benar dapat dibuat, 2D vs 3D, kepemilikan, dan harga, mulai dari Rosebud dan Summer hingga Replit, Gameer, GDevelop AI, dan Cinevva.]]></description>
            <content:encoded><![CDATA[<h1 id="generator-game-ai-terbaik-pada-2026-peringkat-dan-perbandingan" tabindex="-1">Generator Game AI Terbaik pada 2026 (Peringkat dan Perbandingan) <a class="header-anchor" href="#generator-game-ai-terbaik-pada-2026-peringkat-dan-perbandingan" aria-label="Permalink to &quot;Generator Game AI Terbaik pada 2026 (Peringkat dan Perbandingan)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Anda mengetik satu kalimat, lalu AI membuat sebuah game. Itulah janjinya, dan pada 2026 hal ini benar-benar nyata, tetapi cara kerja alat-alat yang mewujudkannya sangat berbeda. Ada yang membuat game arkade 2D berkualitas di browser Anda. Ada pula engine desktop yang memberikan proyek yang sepenuhnya Anda miliki. Beberapa lainnya merupakan asisten pemrograman umum yang kebetulan mampu membuat game. Salah memilih alat bisa membuang seluruh akhir pekan Anda.</p>
<p>Panduan ini membandingkan generator game AI yang layak diketahui pada 2026, apa yang sebenarnya dihasilkan oleh masing-masing alat, apakah Anda dapat memiliki dan mengekspor game tersebut, serta berapa biayanya. Kami berusaha jujur mengenai keunggulan setiap alat, termasuk dalam hal apa produk kami unggul maupun tidak.</p>
<h2 id="empat-jenis-generator-game-ai" tabindex="-1">Empat jenis &quot;generator game AI&quot; <a class="header-anchor" href="#empat-jenis-generator-game-ai" aria-label="Permalink to &quot;Empat jenis &quot;generator game AI&quot;&quot;"></a></h2>
<p>Sebagian besar daftar &quot;pembuat game AI terbaik&quot; mencampur semuanya, sehingga menjadi membingungkan. Sebenarnya ada empat kategori:</p>
<ol>
<li><strong>Pembuat game dari prompt</strong> menghasilkan game yang dapat dimainkan berdasarkan deskripsi. Rosebud, Gameer, Astrocade, Nilo, dan Cinevva termasuk dalam kategori ini.</li>
<li><strong>Agen AI yang terintegrasi dengan engine</strong> menambahkan asisten AI ke dalam engine yang sudah ada. GDevelop AI, Buildbox 4, dan Unity AI termasuk kategori ini.</li>
<li><strong>Pembuat kode umum</strong> seperti Replit dapat membuat game karena mampu membuat aplikasi web apa pun, tetapi alat-alat ini tidak dirancang khusus untuk game.</li>
<li><strong>Alat ideasi dan aset</strong> seperti Ludo.ai membantu Anda merencanakan dan menghasilkan aset, tetapi tidak membuat game jadi.</li>
</ol>
<p>Mengetahui kategori yang Anda inginkan akan mempersempit pilihan dengan cepat.</p>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan Cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan Cepat&quot;"></a></h2>
<ul>
<li><strong>Hasil paling cepat yang dapat dimainkan di browser:</strong> Rosebud atau Cinevva.</li>
<li><strong>Anda ingin memiliki kode dan merilisnya di Steam:</strong> Summer Engine.</li>
<li><strong>Fiksi interaktif dan novel visual:</strong> Gameer.</li>
<li><strong>Gratis dan sumber terbuka dengan hosting web:</strong> GDevelop AI.</li>
<li><strong>Game 3D dari prompt yang langsung dapat dibagikan melalui tautan:</strong> Cinevva atau Nilo.</li>
<li><strong>Sudah menjadi developer Unity atau web:</strong> Unity AI atau Replit.</li>
</ul>
<h2 id="tabel-perbandingan" tabindex="-1">Tabel Perbandingan <a class="header-anchor" href="#tabel-perbandingan" aria-label="Permalink to &quot;Tabel Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Menghasilkan</th>
<th>2D / 3D</th>
<th>Memiliki kode?</th>
<th>Dapat dibagikan di web</th>
<th>Paket gratis</th>
<th>Paket berbayar termurah</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/id/engine.html"><strong>Cinevva</strong></a></td>
<td>Game yang dapat dimainkan</td>
<td>2D + 3D (web)</td>
<td>✅ dapat diunduh</td>
<td>✅ tautan</td>
<td>✅</td>
<td>lihat <a href="/id/plans.html">paket</a></td>
</tr>
<tr>
<td><a href="https://rosebud.ai/" target="_blank" rel="noreferrer"><strong>Rosebud</strong></a></td>
<td>Game yang dapat dimainkan</td>
<td>2D + 3D</td>
<td>Ekspor JS</td>
<td>✅ tautan</td>
<td>✅ ~20 prompt/minggu</td>
<td>~$10/bulan</td>
</tr>
<tr>
<td><a href="https://www.summerengine.com/" target="_blank" rel="noreferrer"><strong>Summer Engine</strong></a></td>
<td>Proyek engine sungguhan</td>
<td>2D + 3D</td>
<td>✅ penuh (Godot)</td>
<td>❌ build native</td>
<td>✅</td>
<td>$20/bulan</td>
</tr>
<tr>
<td><a href="https://www.gameer.io/" target="_blank" rel="noreferrer"><strong>Gameer</strong></a></td>
<td>Cerita interaktif</td>
<td>2D</td>
<td>❌ terkunci pada engine</td>
<td>✅ tautan</td>
<td>✅</td>
<td>$1,99/bulan</td>
</tr>
<tr>
<td><a href="https://gdevelop.io/" target="_blank" rel="noreferrer"><strong>GDevelop AI</strong></a></td>
<td>Proyek engine</td>
<td>2D + 3D</td>
<td>✅ sumber terbuka</td>
<td>✅ gd.games</td>
<td>✅ ~40 kredit/bulan</td>
<td>~$5,49/bulan</td>
</tr>
<tr>
<td><a href="https://replit.com/" target="_blank" rel="noreferrer"><strong>Replit</strong></a></td>
<td>Aplikasi/game web</td>
<td>2D (3D memungkinkan)</td>
<td>✅ ekspor kode</td>
<td>✅ URL</td>
<td>✅</td>
<td>$25/bulan</td>
</tr>
<tr>
<td><a href="https://unity.com/" target="_blank" rel="noreferrer"><strong>Unity AI</strong></a></td>
<td>Proyek Unity</td>
<td>2D + 3D</td>
<td>✅ proyek Anda</td>
<td>Ekspor WebGL</td>
<td>uji coba</td>
<td>$10/bulan</td>
</tr>
<tr>
<td><a href="https://www.buildbox.com/" target="_blank" rel="noreferrer"><strong>Buildbox 4</strong></a></td>
<td>Game tanpa kode</td>
<td>2D + 3D</td>
<td>❌ terkunci pada engine</td>
<td>Ekspor HTML5</td>
<td>✅</td>
<td>~$48,99/tahun</td>
</tr>
<tr>
<td><a href="https://www.astrocade.com/" target="_blank" rel="noreferrer"><strong>Astrocade</strong></a></td>
<td>Game sosial</td>
<td>2D (mengklaim 3D)</td>
<td>❌ terkunci</td>
<td>✅ tautan</td>
<td>✅</td>
<td>tidak tersedia (hubungi mereka)</td>
</tr>
<tr>
<td><a href="https://nilo.io/" target="_blank" rel="noreferrer"><strong>Nilo</strong></a></td>
<td>Dunia/aset 3D</td>
<td>3D</td>
<td>ekspor FBX/glTF</td>
<td>✅ tautan + Roblox</td>
<td>✅ beta</td>
<td>belum tersedia</td>
</tr>
</tbody>
</table>
<p>Harga bersifat perkiraan dan sering berubah, jadi pastikan kembali saat melakukan pembayaran. Paket gratis biasanya membatasi hak komersial, jadi periksa ketentuannya sebelum merilis apa pun yang ingin Anda jual.</p>
<h2 id="ulasan-setiap-alat" tabindex="-1">Ulasan setiap alat <a class="header-anchor" href="#ulasan-setiap-alat" aria-label="Permalink to &quot;Ulasan setiap alat&quot;"></a></h2>
<h3 id="rosebud-ai" tabindex="-1">Rosebud AI <a class="header-anchor" href="#rosebud-ai" aria-label="Permalink to &quot;Rosebud AI&quot;"></a></h3>
<p>Rosebud mengubah prompt menjadi game yang dapat dimainkan di browser dan paling unggul dalam 2D, dengan dukungan 3D dan voxel yang terus berkembang. Di balik layar, alat ini menghasilkan JavaScript (Three.js untuk 3D, Phaser untuk 2D), sehingga secara teori hasilnya portabel. Anda melakukan iterasi dengan mengobrol bersama asistennya, yang menghasilkan sprite dan NPC untuk Anda, lalu memublikasikannya ke URL yang di-host Rosebud dan dapat dibagikan. Paket gratis memberikan beberapa prompt per minggu tanpa hak komersial; paket berbayar membuka penggunaan komersial. Paling cocok bagi pemula, pendidik, dan peserta game jam yang menginginkan jalur tercepat menuju tautan game 2D.</p>
<h3 id="summer-engine" tabindex="-1">Summer Engine <a class="header-anchor" href="#summer-engine" aria-label="Permalink to &quot;Summer Engine&quot;"></a></h3>
<p>Summer adalah pilihan tepat jika Anda ingin merilis dan menjual game sungguhan serta memiliki semuanya. Ini merupakan engine desktop berbasis AI yang diposisikan sebagai pengganti langsung Godot 4, sehingga proyek Anda terdiri atas berkas Godot standar (GDScript atau C#) tanpa ketergantungan pada platform. Anda mendeskripsikan adegan dan logika melalui chat, alat ini menghasilkan kode dan aset, lalu Anda dapat mengekspornya ke Windows, macOS, Linux, perangkat seluler, web, dan Steam sambil mempertahankan seluruh pendapatan. Kekurangannya dibandingkan alat berbasis browser: Summer merupakan aplikasi desktop yang ditujukan untuk merilis game ke toko, bukan untuk menghasilkan tautan publik secara instan. Perlu diketahui bahwa Summer menerbitkan banyak rangkuman &quot;pembuat game AI terbaik&quot; yang menempatkan Summer di peringkat pertama, jadi pertimbangkan hal tersebut saat membacanya.</p>
<h3 id="gameer" tabindex="-1">Gameer <a class="header-anchor" href="#gameer" aria-label="Permalink to &quot;Gameer&quot;"></a></h3>
<p>Gameer membuat game cerita interaktif sinematik dan novel visual dari prompt teks biasa dalam beberapa menit, tanpa kode. Sistem multiagen menangani narasi, visual, dan mekanik. Anda mendapatkan tautan yang dapat langsung dibagikan, meskipun game tersebut terkunci pada runtime Gameer. Alat ini dibuat untuk penulis, pendidik, dan pemasar yang menginginkan fiksi bercabang, bukan aksi waktu nyata atau 3D.</p>
<h3 id="gdevelop-ai" tabindex="-1">GDevelop AI <a class="header-anchor" href="#gdevelop-ai" aria-label="Permalink to &quot;GDevelop AI&quot;"></a></h3>
<p>GDevelop adalah engine gratis dan sumber terbuka yang menambahkan agen AI di dalam editornya. Anda dapat memintanya membuat fitur atau game utuh, lalu alat ini menulis event dan behavior ke dalam proyek yang dapat Anda edit. Engine ini mendukung 2D dan kemampuan 3D yang terus berkembang, dapat mengekspor ke web, Android, iOS, dan desktop, serta memberikan hosting publik gratis di gd.games dengan tautan berbagi. AI-nya menggunakan jatah kredit bulanan, dengan paket berbayar yang memberikan kredit lebih banyak. Pilihan gratis dan terbuka yang kuat jika Anda tidak keberatan dengan batas kredit dan kebutuhan untuk melakukan beberapa iterasi.</p>
<h3 id="replit" tabindex="-1">Replit <a class="header-anchor" href="#replit" aria-label="Permalink to &quot;Replit&quot;"></a></h3>
<p>Agent milik Replit adalah pembuat full-stack umum, bukan engine game, tetapi alat ini dapat membuat game web dari deskripsi dan menerapkannya ke URL publik. Replit tidak menghasilkan sprite, musik, atau suara, sehingga Anda perlu menyediakan aset sendiri, dan alat ini lebih condong ke 2D. Paling cocok bagi orang yang sudah nyaman mengarahkan alat pemrograman AI dan menginginkan hasil yang dapat dimainkan di web serta sepenuhnya mereka kendalikan.</p>
<h3 id="unity-ai" tabindex="-1">Unity AI <a class="header-anchor" href="#unity-ai" aria-label="Permalink to &quot;Unity AI&quot;"></a></h3>
<p>Unity mengganti produk lamanya, Muse, dengan Unity AI, yang tersedia dalam beta terbuka sejak Mei 2026. Ini adalah agen di dalam editor Unity 6 yang menghasilkan kode C#, aset sementara, dan adegan menggunakan model-model AI terdepan. Anda tetap bekerja di dalam proyek Unity sendiri dan memiliki game Anda, serta dapat mengekspornya ke WebGL dan target lainnya. Alat ini ditujukan bagi orang yang sudah bekerja dengan Unity dan menginginkan bantuan AI, bukan bagi pemula yang ingin membuat game hanya dari satu kalimat.</p>
<h3 id="buildbox-4-astrocade-nilo" tabindex="-1">Buildbox 4, Astrocade, Nilo <a class="header-anchor" href="#buildbox-4-astrocade-nilo" aria-label="Permalink to &quot;Buildbox 4, Astrocade, Nilo&quot;"></a></h3>
<p><strong>Buildbox 4</strong> adalah engine tanpa kode yang terutama ditujukan untuk game seluler hiper-kasual dan telah menambahkan pembuatan aset serta node berbasis AI; engine ini dapat mengekspor ke HTML5, tetapi proyeknya terkunci pada engine. <strong>Astrocade</strong> adalah platform sosial dengan pendanaan besar dan fitur berbagi instan, yang hasilnya dalam praktik lebih condong ke 2D meskipun dipasarkan sebagai 3D, dengan ketergantungan kuat pada platform dan tanpa ekspor kode. <strong>Nilo</strong> adalah alat AI 3D berbasis browser yang paling mendekati apa yang kami buat, dengan fokus kuat pada ekspor ke Roblox dan target audiens yang lebih muda; saat ini tersedia dalam beta gratis.</p>
<h2 id="cara-memilih" tabindex="-1">Cara memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara memilih&quot;"></a></h2>
<p>Ajukan tiga pertanyaan. Pertama, apakah Anda membutuhkan 3D, atau 2D sudah cukup? Sebagian besar alat paling unggul dalam 2D, sedangkan menghasilkan 3D yang andal dari prompt adalah standar sulit yang hanya mampu dicapai segelintir alat. Kedua, apakah Anda perlu memiliki dan mengekspor kode, atau tautan yang di-host sudah cukup? Summer, GDevelop, Unity AI, dan Cinevva semuanya memungkinkan Anda mengekspor proyek (Cinevva memungkinkan Anda mengunduh game lengkap untuk di-host di mana saja); Rosebud, Gameer, dan Astrocade lebih mengandalkan tautan yang dapat langsung dibagikan. Ketiga, apakah Anda akan merilisnya ke Steam dan toko aplikasi, atau sekadar membagikan tautan kepada teman? Engine desktop lebih cocok untuk toko; alat browser lebih cocok untuk tautan.</p>
<h2 id="posisi-cinevva" tabindex="-1">Posisi Cinevva <a class="header-anchor" href="#posisi-cinevva" aria-label="Permalink to &quot;Posisi Cinevva&quot;"></a></h2>
<p>Kami akan berterus terang. Bagian pasar yang paling ramai adalah game 2D di browser (Rosebud, Astrocade, Gameer, Replit). Cinevva berada di posisi yang jauh lebih lengang: dikendalikan melalui chat, mampu membuat game 2D maupun 3D sungguhan, dapat dimainkan di browser menggunakan engine nyata berbasis Three.js, langsung dapat dibagikan melalui tautan, dan dapat diekspor sebagai game lengkap yang bisa Anda unduh serta host di mana saja, dengan fitur pembuatan teks-ke-3D, gambar, musik, dan skybox serta pustaka aset CC0 bawaan. Ekspor kode tersebut penting karena beberapa pesaing dengan fitur berbagi instan (Astrocade, Gameer) mengunci game Anda pada runtime mereka. Alat yang paling mendekati perpaduan tersebut adalah Nilo, yang lebih berfokus pada ekspor aset 3D ke Roblox dan menyasar audiens yang lebih muda. Karena itu, game web mandiri yang dapat Anda bagikan sekaligus unduh merupakan celah yang menjadi fokus kami.</p>
<p>Namun, perlu diakui bahwa &quot;3D sungguhan dari prompt&quot; adalah klaim yang paling sulit dalam kategori ini, dan wajar jika pengulas bersikap skeptis. Cara yang adil untuk menilai alat-alat ini, termasuk milik kami, adalah dengan membuat sesuatu lalu membagikan tautannya. Anda dapat <a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=ai_game_generators">membuat game 3D dari prompt secara gratis</a> dan melihat hasilnya, atau <a href="/id/guides/vibe-coding-game-prompts.html">memulai dengan prompt sekali klik</a> jika Anda tidak ingin menatap kotak kosong.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-generator-game-ai-terbaik-pada-2026" tabindex="-1">Apa generator game AI terbaik pada 2026? <a class="header-anchor" href="#apa-generator-game-ai-terbaik-pada-2026" aria-label="Permalink to &quot;Apa generator game AI terbaik pada 2026?&quot;"></a></h3>
<p>Tidak ada satu pilihan yang terbaik untuk semuanya karena alat-alat ini melayani tujuan yang berbeda. Untuk membuat game browser 2D dengan cepat, Rosebud sangat baik. Untuk game browser 3D yang dapat langsung dibagikan, pilih Cinevva atau Nilo. Untuk game yang Anda miliki dan dapat dirilis ke Steam, pilih Summer Engine. Untuk pilihan gratis dan sumber terbuka, gunakan GDevelop AI. Pilih berdasarkan 2D vs 3D, apakah Anda perlu memiliki kodenya, dan apakah Anda akan membagikan tautan atau merilisnya ke toko.</p>
<h3 id="apakah-ai-benar-benar-dapat-membuat-game-lengkap-dari-sebuah-prompt" tabindex="-1">Apakah AI benar-benar dapat membuat game lengkap dari sebuah prompt? <a class="header-anchor" href="#apakah-ai-benar-benar-dapat-membuat-game-lengkap-dari-sebuah-prompt" aria-label="Permalink to &quot;Apakah AI benar-benar dapat membuat game lengkap dari sebuah prompt?&quot;"></a></h3>
<p>Untuk game kecil dan kasual, ya, terutama 2D. AI menangani pergerakan, tabrakan, fisika, dan ilustrasi dasar sehingga Anda dapat mengubah ide menjadi sesuatu yang dapat dimainkan dalam hitungan menit. Game yang lebih besar atau lebih berkualitas tetap membutuhkan iterasi dan pekerjaan desain oleh manusia, sementara 3D lebih sulit dibuat dengan benar oleh AI dibandingkan 2D. Anggap hasil generasi pertama sebagai titik awal yang kuat untuk disempurnakan, bukan sebagai produk jadi.</p>
<h3 id="apakah-saya-memiliki-game-yang-dibuat-dengan-generator-game-ai" tabindex="-1">Apakah saya memiliki game yang dibuat dengan generator game AI? <a class="header-anchor" href="#apakah-saya-memiliki-game-yang-dibuat-dengan-generator-game-ai" aria-label="Permalink to &quot;Apakah saya memiliki game yang dibuat dengan generator game AI?&quot;"></a></h3>
<p>Tergantung pada alatnya. Alat berbasis engine seperti Summer, GDevelop, dan Unity AI memberi Anda proyek nyata yang dapat Anda miliki dan ekspor. Platform pembuat game dari prompt yang di-host memiliki ketentuan berbeda-beda: sebagian memungkinkan Anda mengekspor kode, sebagian lainnya mengunci game pada runtime mereka, dan banyak yang membatasi hak komersial di balik paket berbayar. Selalu baca ketentuannya sebelum menjual apa pun.</p>
<h3 id="apakah-game-buatan-ai-dapat-dibuat-secara-gratis" tabindex="-1">Apakah game buatan AI dapat dibuat secara gratis? <a class="header-anchor" href="#apakah-game-buatan-ai-dapat-dibuat-secara-gratis" aria-label="Permalink to &quot;Apakah game buatan AI dapat dibuat secara gratis?&quot;"></a></h3>
<p>Sebagian besar alat memiliki paket gratis yang cukup untuk mencobanya, tetapi paket gratis biasanya membatasi jumlah yang dapat Anda hasilkan dan sering kali tidak menyertakan hak komersial. Bersiaplah untuk membayar ketika Anda ingin menerbitkan secara komersial, melakukan banyak generasi, atau mengekspor. Tabel perbandingan di atas mencantumkan paket gratis dan paket berbayar termurah dari setiap alat.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Panduan 2026)</a> — alur kerja tanpa kode selengkapnya, langkah demi langkah</li>
<li><a href="/id/guides/3d-browser-game-without-coding.html">Cara Membuat Game Browser 3D Tanpa Pemrograman</a> — panduan khusus untuk 3D</li>
<li><a href="/id/guides/vibe-coding-games.html">Vibe Coding untuk Game: Pengertian dan Cara Memulainya</a> — istilah, alur kerja, dan kendalanya</li>
<li><a href="/id/guides/vibe-coding-game-prompts.html">Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — titik awal yang dapat dicoba</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — jika Anda lebih suka membuatnya secara manual</li>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Terbaik untuk Game</a> — model yang mendukung pembuatan aset dengan AI</li>
<li><a href="/id/guides/ai-npcs-dialogue.html">NPC dan Dialog AI dalam Game</a> — AI di dalam game, bukan hanya untuk membuatnya</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/ai-game-generators-2026-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Engine Game Gratis Terbaik untuk Pemula (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/best-free-game-engines-beginners</link>
            <guid>https://app.cinevva.com/id/guides/best-free-game-engines-beginners</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Engine game gratis terbaik untuk pemula pada 2026, mulai dari alat tanpa kode seperti GDevelop hingga Godot dan Phaser, beserta kegunaan terbaik masing-masing dan cara memilih engine pertama Anda.]]></description>
            <content:encoded><![CDATA[<h1 id="engine-game-gratis-terbaik-untuk-pemula-2026" tabindex="-1">Engine Game Gratis Terbaik untuk Pemula (2026) <a class="header-anchor" href="#engine-game-gratis-terbaik-untuk-pemula-2026" aria-label="Permalink to &quot;Engine Game Gratis Terbaik untuk Pemula (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Saat baru memulai, engine terbaik adalah yang paling cepat membantu Anda menghasilkan game yang dapat dimainkan tanpa biaya atau hambatan pengodean yang terjal. Kabar baiknya, pada 2026 pilihan terbaik untuk pemula sepenuhnya gratis. Berikut rekomendasinya, diurutkan berdasarkan seberapa banyak kode yang ingin Anda tulis, ditambah pendekatan baru dengan &quot;mendeskripsikannya kepada AI&quot;.</p>
<h2 id="pilihan-cepat-berdasarkan-titik-awal-anda" tabindex="-1">Pilihan cepat berdasarkan titik awal Anda <a class="header-anchor" href="#pilihan-cepat-berdasarkan-titik-awal-anda" aria-label="Permalink to &quot;Pilihan cepat berdasarkan titik awal Anda&quot;"></a></h2>
<ul>
<li><strong>Sama sekali tanpa kode, ingin membuat game hari ini:</strong> GDevelop atau alat AI prompt-to-game.</li>
<li><strong>Sedikit kode, ingin belajar dengan benar:</strong> Godot.</li>
<li><strong>Sudah memahami sedikit JavaScript:</strong> Phaser.</li>
<li><strong>Scripting visual dengan editor yang matang:</strong> Construct (paket gratis) atau GDevelop.</li>
</ul>
<h2 id="engine-gratis-terbaik" tabindex="-1">Engine gratis terbaik <a class="header-anchor" href="#engine-gratis-terbaik" aria-label="Permalink to &quot;Engine gratis terbaik&quot;"></a></h2>
<h3 id="gdevelop" tabindex="-1">GDevelop <a class="header-anchor" href="#gdevelop" aria-label="Permalink to &quot;GDevelop&quot;"></a></h3>
<p>Gratis, sumber terbuka, dapat dijalankan di browser atau sebagai aplikasi desktop, dan Anda membangun logika menggunakan lembar event visual, bukan kode. GDevelop mendukung 2D dan semakin berkembang dalam 3D, dapat mengekspor ke web, perangkat seluler, dan desktop, serta menyediakan hosting gratis di gd.games dengan tautan untuk dibagikan. GDevelop bahkan telah menambahkan agen AI yang dapat membangun fitur dari prompt. Ini adalah pilihan awal tanpa kode terbaik bagi kebanyakan pemula, tanpa biaya untuk merilis game.</p>
<h3 id="godot" tabindex="-1">Godot <a class="header-anchor" href="#godot" aria-label="Permalink to &quot;Godot&quot;"></a></h3>
<p>Gratis dan bersumber terbuka dengan lisensi MIT, tanpa biaya atau batas pendapatan untuk selamanya. Godot mendukung 2D maupun 3D, memiliki bahasa scripting yang mudah dipelajari (GDScript) dan dirancang agar mudah didekati, serta pustaka tutorial gratis yang sangat besar. Versi terbarunya adalah 4.7 (Juni 2026). Ini pilihan terbaik jika Anda ingin mempelajari pemrograman game sungguhan tanpa mengkhawatirkan lisensi, dan dapat terus digunakan mulai dari proyek pertama hingga merilis game lengkap. Satu catatan: proyek C# tidak dapat diekspor ke web, jadi gunakan GDScript jika web adalah target Anda.</p>
<h3 id="phaser" tabindex="-1">Phaser <a class="header-anchor" href="#phaser" aria-label="Permalink to &quot;Phaser&quot;"></a></h3>
<p>Gratis dengan lisensi MIT, Phaser adalah framework game HTML5 paling populer, dengan komunitas terbesar dan tutorial terbanyak untuk game web 2D. Versi 4 dirilis pada 2026. Phaser mengutamakan kode (JavaScript atau TypeScript), sehingga cocok bagi pemula yang sudah memahami sedikit pengembangan web dan ingin belajar dengan menulis kode alih-alih menggunakan editor visual.</p>
<h3 id="construct-paket-gratis" tabindex="-1">Construct (paket gratis) <a class="header-anchor" href="#construct-paket-gratis" aria-label="Permalink to &quot;Construct (paket gratis)&quot;"></a></h3>
<p>Construct adalah engine visual berbasis lembar event yang berjalan di browser tanpa pengodean. Paket gratisnya memungkinkan Anda membuat dan menerbitkan game 2D ke web, dengan batasan (jumlah maksimum event dan layer) yang akan Anda lampaui ketika proyek semakin besar. Sangat cocok bagi pemula total yang menginginkan editor matang dan terpandu, dengan langganan yang baru diperlukan saat proyek Anda berkembang.</p>
<h3 id="pendekatan-ai-tanpa-kode" tabindex="-1">Pendekatan AI / tanpa kode <a class="header-anchor" href="#pendekatan-ai-tanpa-kode" aria-label="Permalink to &quot;Pendekatan AI / tanpa kode&quot;"></a></h3>
<p>Pilihan yang lebih baru: deskripsikan game kepada alat AI prompt-to-game, lalu sempurnakan melalui percakapan, tanpa perlu menginstal engine. Ini adalah jalur tercepat dari ide menjadi game yang dapat dimainkan dan dibagikan, terutama untuk 3D, yang masih menjadi kelemahan alat tanpa kode klasik. Lihat <a href="/id/guides/make-a-game-with-ai.html">cara membuat game dengan AI</a> dan <a href="/id/guides/ai-game-generators-2026.html">perbandingan generator game AI</a> kami.</p>
<h2 id="perbandingan" tabindex="-1">Perbandingan <a class="header-anchor" href="#perbandingan" aria-label="Permalink to &quot;Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Engine</th>
<th>Kode yang diperlukan</th>
<th>2D / 3D</th>
<th>Berjalan di browser</th>
<th>Publikasi web</th>
<th>Biaya</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>GDevelop</strong></td>
<td>Tidak ada (visual)</td>
<td>2D + 3D</td>
<td>Ya</td>
<td>gd.games</td>
<td>Gratis</td>
</tr>
<tr>
<td><strong>Godot</strong></td>
<td>Ringan (GDScript)</td>
<td>2D + 3D</td>
<td>Desktop</td>
<td>Ekspor</td>
<td>Gratis (MIT)</td>
</tr>
<tr>
<td><strong>Phaser</strong></td>
<td>Ya (JS/TS)</td>
<td>2D</td>
<td>Ya</td>
<td>Milik Anda sendiri</td>
<td>Gratis (MIT)</td>
</tr>
<tr>
<td><strong>Construct</strong></td>
<td>Tidak ada (visual)</td>
<td>2D</td>
<td>Ya</td>
<td>Paket gratis</td>
<td>Paket gratis; berbayar untuk berkembang</td>
</tr>
<tr>
<td><strong>AI prompt-to-game</strong></td>
<td>Tidak ada (cukup deskripsikan)</td>
<td>2D + 3D</td>
<td>Ya</td>
<td>Tautan instan</td>
<td>Gratis untuk memulai</td>
</tr>
</tbody>
</table>
<h2 id="cara-memilih-engine-pertama-anda" tabindex="-1">Cara memilih engine pertama Anda <a class="header-anchor" href="#cara-memilih-engine-pertama-anda" aria-label="Permalink to &quot;Cara memilih engine pertama Anda&quot;"></a></h2>
<p>Jangan terlalu dipikirkan. Sesuaikan engine dengan seberapa banyak kode yang ingin Anda tulis, lalu mulailah dari proyek kecil. Jika gagasan menulis kode terasa tidak menarik, mulailah dengan GDevelop dan rilis game kecil minggu ini. Jika ingin mempelajari pemrograman sambil belajar desain, mulailah dengan Godot dan ikuti salah satu dari banyak tutorial pemulanya. Jika Anda sudah memahami JavaScript, Phaser akan terasa alami. Dan jika Anda hanya ingin melihat ide Anda dapat dimainkan secepat mungkin, cobalah pendekatan AI, lalu beralihlah ke engine berbasis kode atau visual saat proyek Anda berkembang. Kesalahan terbesar pemula adalah memilih engine profesional yang berat, merasa kewalahan, lalu berhenti. Game kecil yang selesai dibuat dengan engine sederhana akan mengajari Anda lebih banyak daripada game besar yang ditinggalkan.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-engine-game-gratis-yang-paling-mudah-bagi-pemula" tabindex="-1">Apa engine game gratis yang paling mudah bagi pemula? <a class="header-anchor" href="#apa-engine-game-gratis-yang-paling-mudah-bagi-pemula" aria-label="Permalink to &quot;Apa engine game gratis yang paling mudah bagi pemula?&quot;"></a></h3>
<p>GDevelop adalah pilihan awal gratis yang paling mudah: tanpa kode (lembar event visual), berjalan di browser, dan dapat dipublikasikan ke web secara gratis. Construct juga ramah bagi pemula dengan paket gratis. Jika Anda sama sekali tidak ingin melakukan penyiapan, alat AI prompt-to-game dapat menghasilkan game yang dapat dimainkan dari sebuah deskripsi.</p>
<h3 id="apakah-godot-cocok-untuk-pemula" tabindex="-1">Apakah Godot cocok untuk pemula? <a class="header-anchor" href="#apakah-godot-cocok-untuk-pemula" aria-label="Permalink to &quot;Apakah Godot cocok untuk pemula?&quot;"></a></h3>
<p>Ya. Godot gratis, bersumber terbuka, dan memiliki bahasa scripting yang ramah bagi pemula (GDScript), ditambah pustaka tutorial gratis yang besar. Ini adalah pilihan gratis terbaik jika Anda ingin mempelajari pemrograman game sungguhan, dan mendukung 2D maupun 3D. Perlu diingat bahwa proyek C# tidak dapat diekspor ke web, jadi tetap gunakan GDScript jika target Anda adalah browser.</p>
<h3 id="apakah-saya-perlu-bisa-menulis-kode-untuk-membuat-game" tabindex="-1">Apakah saya perlu bisa menulis kode untuk membuat game? <a class="header-anchor" href="#apakah-saya-perlu-bisa-menulis-kode-untuk-membuat-game" aria-label="Permalink to &quot;Apakah saya perlu bisa menulis kode untuk membuat game?&quot;"></a></h3>
<p>Tidak. Engine tanpa kode seperti GDevelop dan Construct memungkinkan Anda membuat game dengan logika visual, sedangkan alat AI prompt-to-game dapat membangun game dari deskripsi dalam bahasa sehari-hari. Pengodean memberikan kontrol lebih besar dan pada akhirnya layak dipelajari, tetapi Anda dapat membuat dan menerbitkan game sungguhan hari ini tanpa kode.</p>
<h3 id="engine-gratis-mana-yang-sebaiknya-saya-pelajari-pada-2026" tabindex="-1">Engine gratis mana yang sebaiknya saya pelajari pada 2026? <a class="header-anchor" href="#engine-gratis-mana-yang-sebaiknya-saya-pelajari-pada-2026" aria-label="Permalink to &quot;Engine gratis mana yang sebaiknya saya pelajari pada 2026?&quot;"></a></h3>
<p>Pilih berdasarkan seberapa banyak kode yang ingin Anda tulis: GDevelop atau alat AI untuk pendekatan tanpa kode, Godot untuk mempelajari pemrograman, dan Phaser jika Anda memahami JavaScript. Semuanya dapat digunakan untuk merilis game komersial secara gratis. Mulailah dengan pilihan yang paling memudahkan Anda, selesaikan satu game kecil, lalu berkembanglah dari sana.</p>
<BuildCta
  title="Buat game pertama Anda sebelum menginstal apa pun"
  desc="Cara tercepat untuk mengetahui apakah membuat game cocok untuk Anda."
  prompt="Buat lintasan rintangan 3D sederhana dengan checkpoint dan garis finis" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/vibe-coding-game-prompts.html">100 Ide Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — ambil sebuah ide dan jadikan dapat dimainkan dalam waktu sekitar satu menit</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — gambaran lengkap berbagai pilihan saat Anda berkembang</li>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — jika game pertama Anda berbentuk 2D</li>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Tanpa Pengodean)</a> — pendekatan AI tanpa kode</li>
<li><a href="/id/guides/3d-browser-game-without-coding.html">Cara Membuat Game Browser 3D Tanpa Pengodean</a> — 3D untuk pemula</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — menerbitkan game pertama Anda</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/best-free-game-engines-beginners-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Situs Model 3D Gratis Terbaik untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/free-3d-model-sites</link>
            <guid>https://app.cinevva.com/id/guides/free-3d-model-sites</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Situs model 3D gratis terbaik untuk game pada 2026, mulai dari sumber CC0 seperti Kenney, Quaternius, dan Poly Haven hingga Sketchfab dan penerus Google Poly, lengkap dengan penjelasan lisensinya.]]></description>
            <content:encoded><![CDATA[<h1 id="situs-model-3d-gratis-terbaik-untuk-game-2026" tabindex="-1">Situs Model 3D Gratis Terbaik untuk Game (2026) <a class="header-anchor" href="#situs-model-3d-gratis-terbaik-untuk-game-2026" aria-label="Permalink to &quot;Situs Model 3D Gratis Terbaik untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Anda tidak perlu membuat semua model sendiri atau membayarnya. Ada banyak sekali model 3D gratis yang siap digunakan dalam game, dan yang terbaik di antaranya berlisensi CC0, yang berarti Anda dapat menggunakannya secara komersial tanpa atribusi. Berikut situs-situs yang layak ditandai pada 2026, diurutkan berdasarkan cara Anda akan menggunakannya, dengan lisensi yang dijelaskan secara jelas.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/pC937t3NlOA" title="Ribuan Model Game 3D GRATIS (aset CC0 Quaternius)" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Tur melihat ribuan model game 3D CC0 gratis dari Quaternius.</div>
<h2 id="referensi-singkat" tabindex="-1">Referensi singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kebutuhan</th>
<th>Sumber terbaik</th>
<th>Lisensi</th>
<th>Atribusi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Properti siap pakai untuk game dengan satu gaya yang konsisten</td>
<td>Kenney</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Karakter low-poly bergaya artistik</td>
<td>Quaternius, KayKit</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Properti fotorealistis, tekstur, HDRI</td>
<td>Poly Haven</td>
<td>CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Variasi terluas, model kompleks</td>
<td>Sketchfab</td>
<td>Campuran, filter per model</td>
<td>Tergantung model</td>
</tr>
<tr>
<td>Arsip Google Poly, properti bergaya artistik yang praktis</td>
<td>Poly Pizza, Icosa Gallery</td>
<td>Sebagian besar CC-BY</td>
<td>Cantumkan kredit kreator</td>
</tr>
<tr>
<td>Pindaian berkualitas AAA gratis</td>
<td>Fab (paket pemula Megascans)</td>
<td>Fab Standard, sebagian CC</td>
<td>Tidak ada, periksa halaman aset</td>
</tr>
<tr>
<td>Pustaka besar yang mengutamakan Blender</td>
<td>Tingkat gratis BlenderKit</td>
<td>Royalty-Free dan CC0</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Karya komunitas yang ramah sumber terbuka</td>
<td>OpenGameArt</td>
<td>CC0, CC-BY, OGA-BY, GPL</td>
<td>Tergantung aset</td>
</tr>
<tr>
<td>Aset gratis dari marketplace</td>
<td>CGTrader, TurboSquid</td>
<td>Royalty-Free</td>
<td>Tidak ada</td>
</tr>
<tr>
<td>Pindaian museum dan antariksa</td>
<td>Smithsonian, NASA</td>
<td>CC0 / karya pemerintah AS</td>
<td>Tidak ada</td>
</tr>
</tbody>
</table>
<h2 id="pilihan-cepat" tabindex="-1">Pilihan cepat <a class="header-anchor" href="#pilihan-cepat" aria-label="Permalink to &quot;Pilihan cepat&quot;"></a></h2>
<ul>
<li><strong>Siap digunakan dalam game, gaya konsisten, tanpa repot:</strong> Kenney, Quaternius, KayKit (semuanya CC0).</li>
<li><strong>Model fotorealistis, tekstur, HDRI:</strong> Poly Haven (CC0).</li>
<li><strong>Variasi terluas, model kompleks:</strong> Sketchfab (lisensi campuran, periksa masing-masing).</li>
<li><strong>Low-poly, arsip Google Poly:</strong> Poly Pizza, Icosa Gallery (sebagian besar CC-BY).</li>
<li><strong>Properti unik yang tidak tersedia di tempat lain:</strong> Smithsonian Open Access dan NASA 3D Resources.</li>
</ul>
<h2 id="sumber-cc0-andalan-tanpa-atribusi-aman-untuk-penggunaan-komersial" tabindex="-1">Sumber CC0 andalan (tanpa atribusi, aman untuk penggunaan komersial) <a class="header-anchor" href="#sumber-cc0-andalan-tanpa-atribusi-aman-untuk-penggunaan-komersial" aria-label="Permalink to &quot;Sumber CC0 andalan (tanpa atribusi, aman untuk penggunaan komersial)&quot;"></a></h2>
<h3 id="kenney" tabindex="-1">Kenney <a class="header-anchor" href="#kenney" aria-label="Permalink to &quot;Kenney&quot;"></a></h3>
<p>Titik awal terbaik. Kenney menyediakan puluhan ribu aset siap pakai untuk game, semuanya CC0, mencakup model 3D, sprite, UI, dan audio dalam gaya visual konsisten yang dapat dipadukan sesuka hati. Semuanya dioptimalkan untuk game, dengan atlas tekstur bersama dan jumlah poligon yang wajar. Jika Anda ingin mendapatkan tampilan yang padu dengan cepat, mulailah dari sini.</p>
<figure class="sample-sheet">
<a href="/id/assets?providers=kenney"><img src="https://cdn.cinevva.com/guides/samples/samples-kenney-3d.jpg" alt="Contoh model 3D CC0 dari Kenney: mobil balap, pesawat luar angkasa, menara pengepungan, rumah, kapal bajak laut, kincir angin, UFO, dan mobil pemadam kebakaran" loading="lazy"></a>
<figcaption>Delapan properti Kenney, semuanya CC0. <a href="/id/assets?providers=kenney">Jelajahi seluruh koleksi Kenney di pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kenney.nl" target="_blank" rel="noreferrer">kenney.nl</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0, tidak memerlukan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 270 paket, puluhan ribu aset individual</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLB/GLTF, OBJ, FBX untuk 3D, serta PNG dan WAV</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, ZIP gratis per paket, tanpa perlu akun</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Membuat prototipe dengan cepat dan merilis game dengan satu gaya yang konsisten</td>
</tr>
</tbody>
</table>
<h3 id="quaternius" tabindex="-1">Quaternius <a class="header-anchor" href="#quaternius" aria-label="Permalink to &quot;Quaternius&quot;"></a></h3>
<p>Model 3D low-poly yang imut dan bergaya artistik, semuanya CC0, disusun dalam paket bertema (karakter, lingkungan, kendaraan, monster), ditambah pustaka animasi universal yang dapat digunakan di seluruh paket karakter. Sempurna untuk game indie yang menginginkan estetika low-poly menawan.</p>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-quaternius.jpg" alt="Contoh model low-poly CC0 dari Quaternius: monster, kapten bajak laut, mech, penyihir, pesawat luar angkasa, shiba inu, dan kesatria" loading="lazy"></a>
<figcaption>Karakter dan pesawat Quaternius, semuanya CC0 dan sebagian besar memiliki animasi. <a href="/id/assets">Cari aset tersebut di pustaka aset gratis</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://quaternius.com" target="_blank" rel="noreferrer">quaternius.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0, tidak memerlukan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Hampir 80 paket bertema, lebih dari 1.100 model</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF/GLB, FBX</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, ZIP gratis per paket</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Karakter dan makhluk low-poly dengan animasi yang serasi</td>
</tr>
</tbody>
</table>
<h3 id="kaykit-oleh-kay-lousberg" tabindex="-1">KayKit oleh Kay Lousberg <a class="header-anchor" href="#kaykit-oleh-kay-lousberg" aria-label="Permalink to &quot;KayKit oleh Kay Lousberg&quot;"></a></h3>
<p>KayKit adalah lini paket aset low-poly dari Kay Lousberg yang mengisi celah antara Kenney dan Quaternius dengan kit dungeon, paket karakter (petualang, kerangka), medan heksagonal, dan puluhan paket properti &quot;Bits&quot; bertema. Sebagian besar paketnya gratis dan CC0, dengan bundel lengkap berbayar jika Anda menginginkan semuanya sekaligus. Paket karakternya sudah menyertakan animasi dan memiliki rig yang rapi.</p>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-kaykit.jpg" alt="Contoh model CC0 dari KayKit: peti harta karun, penyihir kerangka, kesatria, menara heksagonal, penyihir, menara air, tong, dan labu jack-o'-lantern" loading="lazy"></a>
<figcaption>Paket dungeon dan karakter KayKit, CC0. <a href="/id/assets">Cari KayKit di pustaka aset</a>.</figcaption>
</figure>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-kaylousberg.jpg" alt="Contoh properti interior dan taman CC0 karya Kay Lousberg: kulkas, kue ulang tahun, kaktus, pohon, bangku taman, bak mandi, air mancur, dan roti" loading="lazy"></a>
<figcaption>Paket Bits rumah tangga dan taman dari Kay Lousberg, CC0. <a href="/id/assets">Temukan aset tersebut di pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kaylousberg.itch.io" target="_blank" rel="noreferrer">kaylousberg.itch.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 pada paket gratis, tidak memerlukan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Sekitar 25 paket, sebagian besar gratis</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF, FBX, OBJ</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, melalui itch.io (bayar sesuka Anda mulai dari $0)</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Game dungeon crawler, properti RPG, karakter fantasi beranimasi</td>
</tr>
</tbody>
</table>
<h3 id="poly-haven" tabindex="-1">Poly Haven <a class="header-anchor" href="#poly-haven" aria-label="Permalink to &quot;Poly Haven&quot;"></a></h3>
<p>Model 3D fotorealistis, tekstur PBR, dan HDRI, semuanya CC0, dengan berbagai resolusi serta API tanpa kunci untuk unduhan langsung. Lebih dari 2.000 aset dan terus bertambah, termasuk lebih dari 500 model. Paling cocok untuk properti, lingkungan, dan pencahayaan realistis. Koleksi HDRI-nya saja sudah layak ditandai karena dapat mempercantik tampilan adegan apa pun hanya dengan sekali klik.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://polyhaven.com" target="_blank" rel="noreferrer">polyhaven.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0, tidak memerlukan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 2.000 (model, tekstur PBR, HDRI)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF, Blend, FBX, resolusi dari 1K hingga 16K</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya, publik dan tanpa kunci</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Properti realistis, material, dan pencahayaan berbasis gambar</td>
</tr>
</tbody>
</table>
<h3 id="polygonalmind" tabindex="-1">PolygonalMind <a class="header-anchor" href="#polygonalmind" aria-label="Permalink to &quot;PolygonalMind&quot;"></a></h3>
<p>Studio yang merilis sebagian karyanya sebagai sumber terbuka. Proyek 100 Avatars telah merilis lebih dari 200 karakter low-poly CC0 dalam dua gelombang penuh (dengan gelombang ketiga sedang dikerjakan), masing-masing sudah memiliki rig dan siap digunakan untuk game atau VR, ditambah paket properti CC0 bertema yang diterbitkan di Sketchfab dan GitHub. Sumber yang sangat bagus untuk mendapatkan beragam karakter bergaya artistik ketika Anda membutuhkan kerumunan.</p>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-polygonalmind.jpg" alt="Contoh avatar CC0 dari proyek 100 Avatars milik PolygonalMind: delapan karakter bergaya artistik dengan rig" loading="lazy"></a>
<figcaption>Delapan dari lebih dari 200 avatar CC0 dengan rig dari 100 Avatars. <a href="/id/assets">Jelajahi avatar di pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://github.com/PolygonalMind" target="_blank" rel="noreferrer">github.com/PolygonalMind</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 pada rilis sumber terbuka</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 200 avatar serta paket properti bertema</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, VRM, GLB (bervariasi menurut paket)</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, melalui rilis GitHub dan Sketchfab</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Karakter bergaya artistik dengan rig dalam jumlah besar</td>
</tr>
</tbody>
</table>
<h2 id="pustaka-besar-lisensi-campuran-periksa-masing-masing" tabindex="-1">Pustaka besar (lisensi campuran, periksa masing-masing) <a class="header-anchor" href="#pustaka-besar-lisensi-campuran-periksa-masing-masing" aria-label="Permalink to &quot;Pustaka besar (lisensi campuran, periksa masing-masing)&quot;"></a></h2>
<h3 id="sketchfab" tabindex="-1">Sketchfab <a class="header-anchor" href="#sketchfab" aria-label="Permalink to &quot;Sketchfab&quot;"></a></h3>
<p>Pustaka model 3D terbesar, dengan jutaan model dan pratinjau 3D sebelum Anda mengunduhnya. Lisensi berbeda-beda untuk setiap model, jadi gunakan filter model yang dapat diunduh serta CC0 atau CC-BY. Catatan penting untuk 2026: toko berbayar Sketchfab telah ditutup dan dipindahkan ke Fab milik Epic, dan hanya konten CC-BY serta Fab Standard yang dapat dimigrasikan ke sana. Model CC0, CC-BY-SA, CC-BY-NC, dan CC-BY-ND tetap berada di Sketchfab, dan hingga pertengahan 2026 unduhan gratis serta API unduhannya masih berfungsi. Anggaplah Sketchfab sebagai sumber CC0 yang masih berguna tetapi perlahan menyusut, jadi ambil yang Anda perlukan alih-alih berasumsi aset tersebut akan selalu tersedia.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://sketchfab.com" target="_blank" rel="noreferrer">sketchfab.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Campuran, per model (CC0, CC-BY, CC-BY-NC, dan lainnya)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Jutaan model</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF, FBX, OBJ, USDZ</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya, API unduhan dan penampil masih aktif pada 2026</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Menemukan satu model spesifik yang tidak tersedia di tempat lain</td>
</tr>
</tbody>
</table>
<h3 id="poly-pizza-dan-icosa-gallery" tabindex="-1">Poly Pizza dan Icosa Gallery <a class="header-anchor" href="#poly-pizza-dan-icosa-gallery" aria-label="Permalink to &quot;Poly Pizza dan Icosa Gallery&quot;"></a></h3>
<p>Google Poly ditutup pada 2021, tetapi katalog low-poly-nya masih berlanjut. Poly Pizza menampung lebih dari 10.600 model gratis, termasuk koleksi arsip &quot;Poly by Google&quot; (sekitar 2.294 model), ditambah ribuan unggahan baru dari komunitas. Icosa Gallery yang bersifat nirlaba melanjutkan misi terbuka tersebut dengan arsipnya sendiri, API, serta keterkaitan dengan proyek Open Brush dan Open Blocks. Sebagian besar model di kedua situs menggunakan CC-BY (cantumkan kredit kreator), dengan beberapa model CC0. Sangat cocok untuk properti bergaya artistik yang cepat digunakan dan serasi dengan tampilan Kenney serta Quaternius.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://poly.pizza" target="_blank" rel="noreferrer">poly.pizza</a> dan <a href="https://icosa.gallery" target="_blank" rel="noreferrer">icosa.gallery</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Sebagian besar CC-BY, sebagian CC0, ditampilkan per model</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 10.600 di Poly Pizza, ditambah ribuan lainnya di Icosa</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLB/GLTF, OBJ</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, tanpa perlu akun di Poly Pizza</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Properti low-poly praktis jika Anda tidak keberatan mencantumkan kredit</td>
</tr>
</tbody>
</table>
<h3 id="fab-epic" tabindex="-1">Fab (Epic) <a class="header-anchor" href="#fab-epic" aria-label="Permalink to &quot;Fab (Epic)&quot;"></a></h3>
<p>Marketplace terpadu milik Epic, penerus Unreal Marketplace, Quixel Megascans, dan toko Sketchfab. Daya tarik utamanya bagi pemburu aset adalah paket pemula Megascans yang gratis secara permanen, berisi lebih dari 1.500 aset pindaian, permukaan, dan decal yang dapat digunakan di engine apa pun, ditambah pilihan aset gratis bergilir setiap dua minggu. Seluruh katalog Megascans yang berisi sekitar 17.000 aset menjadi berbayar pada akhir 2024. Periksa lisensi pada setiap halaman aset sebelum merilis game.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.fab.com" target="_blank" rel="noreferrer">fab.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Fab Standard (Personal/Professional) dan sebagian Creative Commons</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 1.500 Megascans yang gratis secara permanen, ditambah aset gratis setiap dua minggu</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Unreal, Unity, glTF, dan lainnya</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, setelah mendaftar secara gratis</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Pindaian fotorealistis dan kebiasaan berburu aset gratis dua mingguan</td>
</tr>
</tbody>
</table>
<h3 id="opengameart" tabindex="-1">OpenGameArt <a class="header-anchor" href="#opengameart" aria-label="Permalink to &quot;OpenGameArt&quot;"></a></h3>
<p>Repositori karya komunitas untuk game sumber terbuka dan indie yang telah beroperasi sejak 2009. Situs ini menampung karya 2D dan 3D, audio, serta tekstur di bawah kumpulan lisensi terbuka yang ketat, sehingga semua yang tersedia legal digunakan selama Anda mengikuti lisensi yang ditampilkan. Bagian 3D-nya lebih kecil dan kurang konsisten dibandingkan situs khusus model, tetapi menyimpan banyak aset bagus, dan filter lisensinya memudahkan penelusuran khusus CC0. Waspadai aset berlisensi GPL karena lisensi tersebut dapat memberlakukan kewajiban berbagi serupa pada proyek Anda.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://opengameart.org" target="_blank" rel="noreferrer">opengameart.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0, CC-BY, CC-BY-SA, OGA-BY, atau GPL, per aset</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan kontribusi komunitas dalam kategori 2D, 3D, dan audio</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Bervariasi (Blend, OBJ, FBX, GLTF)</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, tanpa perlu akun</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Penelusuran dengan filter CC0 dan proyek yang ramah sumber terbuka</td>
</tr>
</tbody>
</table>
<h3 id="blenderkit" tabindex="-1">BlenderKit <a class="header-anchor" href="#blenderkit" aria-label="Permalink to &quot;BlenderKit&quot;"></a></h3>
<p>Pustaka aset besar yang tersedia langsung di dalam add-on Blender, sehingga model, material, dan HDRI dapat dimasukkan langsung ke adegan Anda. Tingkat gratisnya benar-benar besar: lebih dari 17.000 model gratis, 26.000 material gratis, dan 2.000 HDRI gratis berdasarkan jumlah publik terakhir. BlenderKit hanya menggunakan dua lisensi, yaitu Royalty-Free dan CC0, dan Anda dapat memfilter keduanya. Royalty-Free di sini berarti Anda bebas menggunakannya secara komersial dalam game, tetapi tidak boleh menjual kembali aset mentahnya.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.blenderkit.com" target="_blank" rel="noreferrer">blenderkit.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Royalty-Free atau CC0, dapat difilter</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 45.000 aset gratis (model, material, HDRI, kuas)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Blend secara native, ekspor ke GLB/FBX dari Blender</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya, melalui add-on Blender, memerlukan akun gratis</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Mengisi adegan dan mencari material jika Blender menjadi bagian dari alur kerja Anda</td>
</tr>
</tbody>
</table>
<h2 id="bagian-gratis-marketplace-royalty-free-baca-ketentuannya-dengan-teliti" tabindex="-1">Bagian gratis marketplace (royalty-free, baca ketentuannya dengan teliti) <a class="header-anchor" href="#bagian-gratis-marketplace-royalty-free-baca-ketentuannya-dengan-teliti" aria-label="Permalink to &quot;Bagian gratis marketplace (royalty-free, baca ketentuannya dengan teliti)&quot;"></a></h2>
<h3 id="turbosquid" tabindex="-1">TurboSquid <a class="header-anchor" href="#turbosquid" aria-label="Permalink to &quot;TurboSquid&quot;"></a></h3>
<p>Marketplace 3D besar tertua, kini dimiliki oleh Shutterstock, dengan bagian gratis yang cukup besar. Model gratis menggunakan lisensi royalty-free TurboSquid yang sama dengan model berbayar: game untuk konsol, PC, perangkat seluler, dan VR secara eksplisit diizinkan, Anda dapat menggunakan model dalam proyek tanpa batas selamanya, tetapi Anda tidak boleh mendistribusikan ulang file mentahnya dan pengguna akhir tidak boleh dapat mengekstraknya. Hindari semua yang berlabel &quot;Editorial Use&quot; karena model tersebut tidak dapat disertakan dalam game komersial.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.turbosquid.com/Search/3D-Models/free" target="_blank" rel="noreferrer">turbosquid.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Royalty-free TurboSquid, diizinkan untuk game</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Bagian gratis yang besar dalam katalog berisi jutaan model</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MAX, FBX, OBJ, Blend, GLTF (bervariasi per model)</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Setelah mendaftar akun gratis</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Properti realistis satuan, kendaraan, dan model hard-surface</td>
</tr>
</tbody>
</table>
<h3 id="cgtrader" tabindex="-1">CGTrader <a class="header-anchor" href="#cgtrader" aria-label="Permalink to &quot;CGTrader&quot;"></a></h3>
<p>Bagian gratis terbesar di antara semua marketplace, dengan lebih dari 150.000 model gratis. Lisensi bebas royalti mengizinkan penggunaan komersial dalam game tanpa biaya tambahan, dengan ketentuan yang sama seperti TurboSquid: model harus diintegrasikan ke dalam game agar pemain tidak dapat mengambil file tersebut, dan Anda tidak boleh menjualnya kembali secara terpisah. Kualitasnya jauh lebih bervariasi dibandingkan situs yang dikurasi, jadi periksa jumlah poligon dan teksturnya sebelum memilih.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.cgtrader.com/free-3d-models" target="_blank" rel="noreferrer">cgtrader.com/free-3d-models</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas royalti CGTrader, penggunaan komersial diizinkan</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 150.000 model gratis</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, OBJ, Blend, GLTF, MAX (bervariasi menurut model)</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Setelah mendaftar akun gratis</td>
</tr>
<tr>
<td><strong>Terbaik untuk</strong></td>
<td>Pilihan yang sangat banyak ketika situs CC0 tidak memiliki aset yang dicari</td>
</tr>
</tbody>
</table>
<h2 id="pindaian-domain-publik-museum-dan-antariksa" tabindex="-1">Pindaian domain publik (museum dan antariksa) <a class="header-anchor" href="#pindaian-domain-publik-museum-dan-antariksa" aria-label="Permalink to &quot;Pindaian domain publik (museum dan antariksa)&quot;"></a></h2>
<h3 id="smithsonian-open-access-3d" tabindex="-1">Smithsonian Open Access 3D <a class="header-anchor" href="#smithsonian-open-access-3d" aria-label="Permalink to &quot;Smithsonian Open Access 3D&quot;"></a></h3>
<p>Smithsonian merilis jutaan benda koleksi di bawah CC0, termasuk lebih dari 2.000 pindaian 3D yang dapat diunduh: fosil dinosaurus, wahana antariksa, patung, instrumen, dan artefak yang tidak akan Anda temukan di tempat lain. Cari tanda CC0 di halaman model. Pindaian ini banyak menggunakan fotogrametri, jadi rencanakan untuk mengurangi jumlah poligonnya di Blender sebelum digunakan dalam game browser.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://3d.si.edu" target="_blank" rel="noreferrer">3d.si.edu</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 pada model yang ditandai, periksa masing-masing</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 2.000 pindaian 3D</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>OBJ, glTF/GLB</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, tidak perlu akun</td>
</tr>
<tr>
<td><strong>Terbaik untuk</strong></td>
<td>Properti berkualitas museum, fosil, dan dekorasi latar historis</td>
</tr>
</tbody>
</table>
<h3 id="nasa-3d-resources" tabindex="-1">NASA 3D Resources <a class="header-anchor" href="#nasa-3d-resources" aria-label="Permalink to &quot;NASA 3D Resources&quot;"></a></h3>
<p>NASA menerbitkan ratusan model wahana antariksa, rover, asteroid, dan medan planet yang dapat diunduh dan digunakan secara gratis berdasarkan pedoman penggunaan media NASA (sebagian besar materi buatan NASA tidak dilindungi hak cipta, tetapi jangan menyiratkan bahwa NASA mendukung game Anda atau menggunakan lambang NASA). Kualitas mesh berkisar dari pindaian siap cetak hingga model teknik sungguhan, dan koleksinya juga dicerminkan di GitHub.</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://science.nasa.gov/3d-resources/" target="_blank" rel="noreferrer">science.nasa.gov/3d-resources</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis sesuai pedoman media NASA, tanpa menyiratkan dukungan</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ratusan model dan tekstur</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLB, FBX, Blend, STL, 3DS, dan lainnya</td>
</tr>
<tr>
<td><strong>Unduhan langsung</strong></td>
<td>Ya, tidak perlu akun</td>
</tr>
<tr>
<td><strong>Terbaik untuk</strong></td>
<td>Game antariksa yang menginginkan rover Curiosity asli</td>
</tr>
</tbody>
</table>
<h2 id="membuat-model-dengan-ai" tabindex="-1">Membuat model dengan AI <a class="header-anchor" href="#membuat-model-dengan-ai" aria-label="Permalink to &quot;Membuat model dengan AI&quot;"></a></h2>
<p>Pada 2026, membuat model bisa lebih cepat daripada mencarinya. Alat seperti Meshy dan Tripo mengubah teks atau gambar menjadi mesh 3D bertekstur, sementara model terbuka seperti Hunyuan3D dan TRELLIS.2 dapat di-host sendiri. Sebagian besar alat yang di-host membatasi hak penggunaan komersial pada paket berbayar, jadi periksa ketentuannya. Lihat panduan <a href="/id/guides/ai-asset-generators-games.html">generator aset AI terbaik untuk game</a> kami untuk ulasan lengkap, dan perlu diketahui bahwa Cinevva memiliki <a href="/id/tools/hunyuan3d.html">Generator Model 3D</a> bawaan yang mengubah foto atau perintah teks menjadi model.</p>
<h2 id="menyiapkan-model-untuk-game" tabindex="-1">Menyiapkan model untuk game <a class="header-anchor" href="#menyiapkan-model-untuk-game" aria-label="Permalink to &quot;Menyiapkan model untuk game&quot;"></a></h2>
<p>Menemukan model baru separuh pekerjaan. Berikut cara memastikan model tersebut benar-benar dapat berjalan dalam game Anda.</p>
<p><strong>Utamakan GLB untuk game web.</strong> GLB adalah satu file biner yang memuat mesh, material, dan tekstur, serta dapat dimuat secara native oleh setiap engine web (Three.js, Babylon.js, PlayCanvas). Jika model hanya tersedia dalam format FBX atau OBJ, buka di Blender lalu ekspor ke GLB; prosesnya hanya memerlukan waktu satu menit. Kenney, Quaternius, KayKit, dan Poly Haven sudah menyediakan GLTF/GLB, yang menjadi salah satu alasan utama mereka berada di urutan teratas daftar ini.</p>
<p><strong>Perhatikan anggaran poligon.</strong> Game browser berjalan di perangkat apa pun yang digunakan pemain, termasuk ponsel berusia tiga tahun. Sebagai pedoman umum, batasi properti hingga beberapa ratus atau beberapa ribu segitiga, karakter utama antara 10.000 dan 30.000, serta setiap model unduhan di bawah 100.000. Model marketplace dan museum sering kali jauh melampaui angka ini, jadi periksa jumlah segitiganya sebelum terlanjur menyukainya, atau rencanakan proses pengurangan poligon di Blender.</p>
<p><strong>Perhatikan draw call, bukan hanya poligon.</strong> Lima puluh properti terpisah dengan lima puluh material akan lebih membebani daripada satu mesh padat. Paket yang dikurasi juga membantu dalam hal ini; aset Kenney dan Quaternius menggunakan atlas tekstur bersama sehingga seluruh adegan dapat dirender hanya dengan beberapa draw call.</p>
<p><strong>Periksa lisensi sebelum merilis, bukan sesudahnya.</strong> Simpan tangkapan layar atau PDF halaman lisensi untuk setiap model non-CC0 yang Anda gunakan, dan kelola daftar kredit untuk aset CC-BY. Melacak asal model setahun kemudian sangat merepotkan.</p>
<p><strong>Atau tidak perlu berpindah-pindah tab.</strong> <a href="/id/assets.html">Pencarian aset</a> Cinevva menelusuri Kenney, Quaternius, Poly Haven, Sketchfab, dan lainnya dari satu kotak pencarian, lengkap dengan informasi lisensi pada setiap kartu serta filter per sumber seperti <a href="/id/assets.html?providers=kenney">Kenney saja</a> atau <a href="/id/assets.html?providers=polyhaven">Poly Haven saja</a>. Jika Anda mengunduh karakter yang belum memiliki rig, <a href="/id/tools/rigger.html">auto-rigger</a> gratis dapat memasang rig pada model humanoid langsung di browser.</p>
<h2 id="lisensi-dalam-30-detik" tabindex="-1">Lisensi dalam 30 detik <a class="header-anchor" href="#lisensi-dalam-30-detik" aria-label="Permalink to &quot;Lisensi dalam 30 detik&quot;"></a></h2>
<ul>
<li><strong>CC0:</strong> domain publik. Dapat digunakan secara komersial dan dimodifikasi tanpa atribusi. Pilihan paling aman.</li>
<li><strong>CC-BY:</strong> penggunaan komersial gratis, tetapi Anda harus mencantumkan kredit kreator.</li>
<li><strong>Bebas Royalti:</strong> bayar sekali (atau gratis), lalu gunakan tanpa biaya per penggunaan, tetapi Anda tidak boleh menjual kembali file mentahnya.</li>
<li><strong>CC-BY-NC / Editorial:</strong> tidak boleh digunakan secara komersial. Hindari untuk game yang akan Anda jual.</li>
</ul>
<p>Jika ragu, utamakan CC0. Untuk penjelasan lengkap, lihat <a href="/id/guides/game-asset-licenses.html">panduan lisensi aset game</a> kami.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="di-mana-saya-bisa-menemukan-model-3d-gratis-untuk-game" tabindex="-1">Di mana saya bisa menemukan model 3D gratis untuk game? <a class="header-anchor" href="#di-mana-saya-bisa-menemukan-model-3d-gratis-untuk-game" aria-label="Permalink to &quot;Di mana saya bisa menemukan model 3D gratis untuk game?&quot;"></a></h3>
<p>Kenney, Quaternius, KayKit, dan Poly Haven adalah titik awal terbaik. Semuanya menggunakan CC0 sehingga Anda dapat memakainya secara komersial tanpa atribusi. Untuk pilihan yang lebih beragam, Sketchfab memiliki jutaan model dengan berbagai lisensi, Poly Pizza menyediakan katalog arsip Google Poly, dan bagian gratis CGTrader memiliki lebih dari 150.000 model. Selalu periksa lisensi setiap model sebelum merilis game.</p>
<h3 id="apa-arti-cc0-untuk-model-3d" tabindex="-1">Apa arti CC0 untuk model 3D? <a class="header-anchor" href="#apa-arti-cc0-untuk-model-3d" aria-label="Permalink to &quot;Apa arti CC0 untuk model 3D?&quot;"></a></h3>
<p>CC0 berarti model tersebut berada dalam domain publik: Anda dapat menggunakannya dalam game komersial, memodifikasinya, dan tidak perlu mencantumkan kredit kreator. Ini adalah lisensi yang paling permisif dan berisiko paling rendah. Kenney, Quaternius, KayKit, Poly Haven, dan AmbientCG merupakan sumber CC0 utama untuk aset game.</p>
<h3 id="apakah-model-3d-gratis-boleh-digunakan-untuk-game-komersial" tabindex="-1">Apakah model 3D gratis boleh digunakan untuk game komersial? <a class="header-anchor" href="#apakah-model-3d-gratis-boleh-digunakan-untuk-game-komersial" aria-label="Permalink to &quot;Apakah model 3D gratis boleh digunakan untuk game komersial?&quot;"></a></h3>
<p>Sebagian besar boleh, tetapi tergantung pada lisensinya. Aset CC0 selalu aman. CC-BY mengharuskan Anda mencantumkan kredit kreator. Model marketplace bebas royalti mengizinkan penggunaan dalam game komersial, tetapi melarang distribusi ulang file mentah. Model CC-BY-NC dan khusus Editorial tidak boleh digunakan dalam game yang Anda jual, jadi periksa lisensi setiap model dan utamakan CC0 jika memungkinkan.</p>
<h3 id="apa-yang-terjadi-pada-google-poly" tabindex="-1">Apa yang terjadi pada Google Poly? <a class="header-anchor" href="#apa-yang-terjadi-pada-google-poly" aria-label="Permalink to &quot;Apa yang terjadi pada Google Poly?&quot;"></a></h3>
<p>Google menutup Poly pada 30 Juni 2021. Katalognya diarsipkan oleh komunitas sebelum ditutup dan kini tersedia di dua tempat: Poly Pizza menyediakan koleksi &quot;Poly by Google&quot; bersama ribuan unggahan yang lebih baru, sedangkan organisasi nirlaba Icosa Gallery melanjutkan misi platform terbuka tersebut. Sebagian besar model yang diarsipkan menggunakan CC-BY, jadi cantumkan kredit kreator aslinya.</p>
<h3 id="apakah-sketchfab-akan-ditutup" tabindex="-1">Apakah Sketchfab akan ditutup? <a class="header-anchor" href="#apakah-sketchfab-akan-ditutup" aria-label="Permalink to &quot;Apakah Sketchfab akan ditutup?&quot;"></a></h3>
<p>Belum ditutup, tetapi aktivitasnya sebagai marketplace sedang dihentikan secara bertahap. Epic menutup toko Sketchfab dan memindahkan aktivitas penjualan ke Fab, dan hanya konten CC-BY serta Fab Standard yang dapat dimigrasikan ke sana. Hingga pertengahan 2026, situs, unduhan gratis, dan API unduhannya masih berfungsi, serta model CC0 masih dapat diunduh. Langkah paling aman adalah mengunduh aset yang Anda tahu akan dibutuhkan daripada menganggapnya akan selalu tersedia.</p>
<h3 id="apa-alternatif-gratis-terbaik-untuk-turbosquid" tabindex="-1">Apa alternatif gratis terbaik untuk TurboSquid? <a class="header-anchor" href="#apa-alternatif-gratis-terbaik-untuk-turbosquid" aria-label="Permalink to &quot;Apa alternatif gratis terbaik untuk TurboSquid?&quot;"></a></h3>
<p>Untuk aset siap pakai dalam game, Kenney, Quaternius, dan KayKit lebih baik daripada bagian gratis marketplace mana pun karena semua asetnya menggunakan CC0 dan telah dioptimalkan untuk engine. Untuk pindaian realistis, Poly Haven dan paket awal Megascans gratis dari Fab merupakan pilihan yang lebih kuat. Jika Anda secara khusus menginginkan variasi ala marketplace, bagian gratis CGTrader lebih besar daripada TurboSquid, dengan lebih dari 150.000 model gratis di bawah lisensi bebas royalti serupa.</p>
<h3 id="berapa-jumlah-poligon-yang-ideal-untuk-model-game-web" tabindex="-1">Berapa jumlah poligon yang ideal untuk model game web? <a class="header-anchor" href="#berapa-jumlah-poligon-yang-ideal-untuk-model-game-web" aria-label="Permalink to &quot;Berapa jumlah poligon yang ideal untuk model game web?&quot;"></a></h3>
<p>Batasi properti hingga beberapa ratus atau beberapa ribu segitiga, karakter antara 10.000 dan 30.000, serta hindari satu model yang melebihi 100.000. Seluruh adegan browser sebaiknya tetap berada pada kisaran rendah ratusan ribu segitiga agar berjalan lancar di ponsel kelas menengah. Jika model terlalu berat, modifier Decimate di Blender biasanya dapat memangkas jumlahnya hingga separuh sebelum perbedaannya terlihat.</p>
<h3 id="bisakah-saya-membuat-model-3d-dengan-ai" tabindex="-1">Bisakah saya membuat model 3D dengan AI? <a class="header-anchor" href="#bisakah-saya-membuat-model-3d-dengan-ai" aria-label="Permalink to &quot;Bisakah saya membuat model 3D dengan AI?&quot;"></a></h3>
<p>Ya. Alat seperti Meshy dan Tripo membuat mesh bertekstur dari teks atau gambar, sedangkan model terbuka seperti Hunyuan3D dan TRELLIS.2 dapat di-host sendiri. Hak komersial pada alat yang di-host biasanya memerlukan paket berbayar, jadi pastikan ketentuannya. Pembuatan dengan AI semakin sering lebih cepat daripada mencari model gratis yang tepat.</p>
<BuildCta
  title="Tidak perlu mengunduh. Dapatkan properti yang langsung ditempatkan untuk Anda"
  desc="Cinevva menyediakan ribuan properti CC0 gratis dan menempatkannya ke dalam game untuk Anda."
  prompt="Buat adegan perkemahan low-poly yang bisa saya jelajahi pada malam hari dengan senter" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — panduan lengkap untuk lebih dari 20 sumber</li>
<li><a href="/id/guides/sketchfab-polyhaven-kenney.html">Sketchfab vs Poly Haven vs Kenney</a> — perbandingan langsung tiga sumber terbaik</li>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI Terbaik untuk Game</a> — buat aset alih-alih mencarinya</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — CC0, CC-BY, dan lisensi lainnya</li>
<li><a href="/id/guides/free-sound-effects-music.html">Efek Suara dan Musik Gratis untuk Game</a> — sisi audionya</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/free-3d-model-sites-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Efek Suara dan Musik Gratis untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/free-sound-effects-music</link>
            <guid>https://app.cinevva.com/id/guides/free-sound-effects-music</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Tempat menemukan efek suara dan musik gratis untuk game pada 2026, mulai dari sumber CC0 seperti Kenney dan Freesound hingga Incompetech dan Pixabay, lengkap dengan penjelasan lisensi dan atribusi.]]></description>
            <content:encoded><![CDATA[<h1 id="efek-suara-dan-musik-gratis-untuk-game-2026" tabindex="-1">Efek Suara dan Musik Gratis untuk Game (2026) <a class="header-anchor" href="#efek-suara-dan-musik-gratis-untuk-game-2026" aria-label="Permalink to &quot;Efek Suara dan Musik Gratis untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Audio menentukan separuh dari nuansa sebuah game, dan Anda tidak memerlukan anggaran untuk mendapatkannya. Ada banyak sumber gratis yang sangat bagus untuk efek suara maupun musik, tetapi lisensinya sangat beragam, dan beberapa situs populer hanya mengizinkan penggunaan nonkomersial, yang diam-diam dapat menggagalkan game yang ingin Anda jual. Berikut tempat mencarinya pada 2026 dan apa saja yang benar-benar boleh Anda rilis.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/eFSKkNdHh_k" title="Tempat mendapatkan Efek Suara dan Musik untuk Game Anda (Gratis dan Berbayar)" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Gambaran umum sumber gratis dan berbayar untuk efek suara dan musik game.</div>
<h2 id="referensi-cepat" tabindex="-1">Referensi Cepat <a class="header-anchor" href="#referensi-cepat" aria-label="Permalink to &quot;Referensi Cepat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kebutuhan</th>
<th>Sumber Terbaik</th>
<th>Lisensi</th>
<th>Atribusi</th>
</tr>
</thead>
<tbody>
<tr>
<td>SFX dalam jumlah besar, kualitas studio</td>
<td><a href="https://sonniss.com/gameaudiogdc" target="_blank" rel="noreferrer">Paket GDC Sonniss</a></td>
<td>Bebas royalti</td>
<td>Tidak</td>
</tr>
<tr>
<td>Satu suara tertentu</td>
<td><a href="https://freesound.org" target="_blank" rel="noreferrer">Freesound</a> (filter CC0)</td>
<td>CC0</td>
<td>Tidak</td>
</tr>
<tr>
<td>SFX siap pakai dengan gaya konsisten</td>
<td><a href="https://kenney.nl/assets/category:Audio" target="_blank" rel="noreferrer">Kenney</a></td>
<td>CC0</td>
<td>Tidak</td>
</tr>
<tr>
<td>SFX UI dan game kasual dengan cepat</td>
<td><a href="https://mixkit.co/free-sound-effects/" target="_blank" rel="noreferrer">Mixkit</a></td>
<td>Lisensi gratis Mixkit</td>
<td>Tidak</td>
</tr>
<tr>
<td>Musik latar tanpa kerumitan</td>
<td><a href="https://pixabay.com/music/" target="_blank" rel="noreferrer">Pixabay Music</a></td>
<td>Lisensi Konten Pixabay</td>
<td>Tidak</td>
</tr>
<tr>
<td>Variasi soundtrack yang luas</td>
<td><a href="https://incompetech.com" target="_blank" rel="noreferrer">Incompetech</a></td>
<td>CC-BY 4.0</td>
<td>Ya</td>
</tr>
<tr>
<td>Musik chiptune dan RPG</td>
<td><a href="https://opengameart.org" target="_blank" rel="noreferrer">OpenGameArt</a></td>
<td>CC0 / CC-BY per item</td>
<td>Tergantung</td>
</tr>
<tr>
<td>Paket tematik bergaya khas</td>
<td><a href="https://itch.io/game-assets/free/tag-audio" target="_blank" rel="noreferrer">itch.io</a></td>
<td>Per paket, sering kali CC0</td>
<td>Tergantung</td>
</tr>
<tr>
<td>Pustaka SFX besar, tidak masalah memberi kredit</td>
<td><a href="https://www.zapsplat.com" target="_blank" rel="noreferrer">ZapSplat</a></td>
<td>ZapSplat Standard</td>
<td>Ya</td>
</tr>
<tr>
<td>Audio khusus yang dihasilkan secara generatif</td>
<td>Alat <a href="/id/tools/sfx.html">Cinevva SFX</a> dan <a href="/id/tools/music.html">Music</a></td>
<td>Bebas Anda gunakan</td>
<td>Tidak</td>
</tr>
</tbody>
</table>
<h2 id="pilihan-cc0-paling-aman-tanpa-atribusi-aman-untuk-penggunaan-komersial" tabindex="-1">Pilihan CC0 paling aman (tanpa atribusi, aman untuk penggunaan komersial) <a class="header-anchor" href="#pilihan-cc0-paling-aman-tanpa-atribusi-aman-untuk-penggunaan-komersial" aria-label="Permalink to &quot;Pilihan CC0 paling aman (tanpa atribusi, aman untuk penggunaan komersial)&quot;"></a></h2>
<p>Jika Anda tidak ingin repot mempelajari lisensi, mulailah dari sini. <strong>Audio Kenney</strong> sepenuhnya berlisensi CC0 dengan suara klik UI, benturan, dan SFX retro yang bersih serta siap digunakan dalam game. <strong>Pixabay Music</strong> tersedia gratis berdasarkan Lisensi Konten Pixabay, mengizinkan penggunaan komersial tanpa atribusi (Anda tidak boleh menjual kembali berkasnya secara terpisah, tetapi boleh menyertakannya dalam game yang dirilis). <strong>Paket GDC Sonniss</strong> bebas royalti untuk penggunaan komersial tanpa atribusi, dengan arsip multi-tahun berisi lebih dari 200 GB SFX profesional. Selain itu, <strong>Freesound</strong> dan <strong>OpenGameArt</strong> menyediakan konten CC0 melalui filter lisensi, jadi gunakan filter tersebut agar tetap aman.</p>
<h2 id="efek-suara" tabindex="-1">Efek suara <a class="header-anchor" href="#efek-suara" aria-label="Permalink to &quot;Efek suara&quot;"></a></h2>
<h3 id="freesound" tabindex="-1">Freesound <a class="header-anchor" href="#freesound" aria-label="Permalink to &quot;Freesound&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Efek spesifik sekali pakai dan rekaman lapangan</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://freesound.org" target="_blank" rel="noreferrer">freesound.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Per suara: CC0, CC-BY, CC-BY-SA, atau CC-BY-NC</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 700.000 suara</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV, MP3, FLAC, OGG (bervariasi menurut unggahan)</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tidak diperlukan untuk CC0, wajib untuk CC-BY, sedangkan CC-BY-NC tidak aman untuk penggunaan komersial</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Pustaka SFX gratis terbesar di web dan masih terus berkembang pada 2026</li>
<li>Filter pencarian lanjutan berdasarkan lisensi, sehingga Anda dapat membatasi hasil ke CC0</li>
<li>Rekaman lapangan dan suara unik yang tidak akan Anda temukan dalam paket pilihan</li>
</ul>
<p>Kekurangannya, lisensi berlaku per suara, jadi periksa setiap berkas sebelum merilis game. CC0 tidak memerlukan kredit, CC-BY memerlukan baris kredit, dan CC-BY-NC tidak boleh digunakan dalam game yang Anda jual. Katalog CC0 Freesound juga dapat dicari langsung melalui <a href="/id/assets.html?providers=freesound">pencarian aset Cinevva</a>, yang telah difilter sebelumnya sehingga semua yang Anda impor aman untuk penggunaan komersial.</p>
<h3 id="audio-kenney" tabindex="-1">Audio Kenney <a class="header-anchor" href="#audio-kenney" aria-label="Permalink to &quot;Audio Kenney&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> SFX siap pakai dengan gaya konsisten tanpa kerumitan lisensi</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kenney.nl/assets/category:Audio" target="_blank" rel="noreferrer">kenney.nl</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (Domain Publik)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>10 paket audio (UI, benturan, fiksi ilmiah, RPG, kasino, jingle, sulih suara)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV, siap digunakan dalam game</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tidak ada</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Semuanya berlisensi CC0, jadi tidak ada yang perlu dicatat atau diberi kredit</li>
<li>Suara dalam satu paket memiliki gaya yang sama, sehingga audio game Anda terdengar konsisten</li>
<li>Mencakup kebutuhan dasar setiap game: klik, konfirmasi, benturan, dan jingle</li>
</ul>
<p>Unduh paket Interface Sounds dan Impact Sounds terlebih dahulu. Kedua paket tersebut sudah mencakup sebagian besar kebutuhan game kecil, sementara paket Music Jingles menyediakan sting untuk kemenangan dan kekalahan.</p>
<h3 id="paket-gdc-sonniss" tabindex="-1">Paket GDC Sonniss <a class="header-anchor" href="#paket-gdc-sonniss" aria-label="Permalink to &quot;Paket GDC Sonniss&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> SFX kualitas studio dalam jumlah besar</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://sonniss.com/gameaudiogdc" target="_blank" rel="noreferrer">sonniss.com/gameaudiogdc</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas royalti, penggunaan komersial, proyek tanpa batas seumur hidup</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Paket 2026 berukuran lebih dari 7 GB, sedangkan total arsip multi-tahun lebih dari 200 GB</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV (laju sampel tinggi)</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tidak ada</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Pustaka desain suara profesional yang disumbangkan oleh vendor komersial</li>
<li>Paket baru dirilis setiap tahun sekitar waktu GDC (paket 2026 hadir pada Maret)</li>
<li>Arsip paket dari tahun-tahun sebelumnya tetap dapat diunduh tanpa batas waktu</li>
</ul>
<p>Satu batasannya: penggunaan suara untuk pelatihan AI/ML secara tegas dilarang. Untuk memutarnya dalam game, Anda aman. Ukuran berkasnya besar, jadi sebaiknya unduh, pilih yang Anda perlukan, lalu transkode ke OGG sebelum merilis game.</p>
<h3 id="zapsplat" tabindex="-1">ZapSplat <a class="header-anchor" href="#zapsplat" aria-label="Permalink to &quot;ZapSplat&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Pustaka SFX sehari-hari yang luas jika Anda dapat mencantumkan kredit</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.zapsplat.com" target="_blank" rel="noreferrer">zapsplat.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>ZapSplat Standard License (tingkat gratis), beberapa suara berlisensi CC-BY</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Puluhan ribu SFX dalam berbagai kategori</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3 gratis, WAV dengan tingkat Gold berbayar</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Wajib pada tingkat gratis</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Unduhan gratis tanpa batas untuk proyek pribadi dan komersial</li>
<li>Persyaratan kreditnya sederhana dan game secara tegas termasuk penggunaan yang diizinkan</li>
<li>Keanggotaan Gold menghapus kewajiban atribusi dan mempertahankan lisensi suara seumur hidup</li>
</ul>
<p>Kredit yang diperlukan untuk game adalah baris seperti &quot;Efek suara diperoleh dari zapsplat.com&quot; pada layar kredit atau halaman game Anda. Suara yang diunduh saat langganan Gold aktif akan tetap bebas atribusi selamanya, bahkan setelah langganan dibatalkan.</p>
<h3 id="mixkit" tabindex="-1">Mixkit <a class="header-anchor" href="#mixkit" aria-label="Permalink to &quot;Mixkit&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Suara UI dan game kasual yang cepat dan berkualitas tanpa perlu mendaftar</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://mixkit.co/free-sound-effects/" target="_blank" rel="noreferrer">mixkit.co</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Mixkit Sound Effects Free License</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Kategori SFX dan musik stok pilihan, termasuk bagian khusus game</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3 dan WAV</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tidak ada</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Secara tegas mengizinkan penggunaan komersial, termasuk video game, tanpa atribusi</li>
<li>Tidak memerlukan akun, Anda cukup mengunduhnya</li>
<li>Kualitasnya sudah dikurasi, jadi Anda tidak perlu menggali sebanyak di pustaka besar</li>
</ul>
<p>Musik dan efek suara Mixkit berada di bawah lisensi gratis yang berbeda, jadi baca sekilas keduanya jika Anda mengambil aset dari kedua katalog. Pilihannya lebih sedikit daripada Freesound atau ZapSplat, tetapi semuanya bersih dan dapat langsung digunakan.</p>
<h3 id="audio-opengameart" tabindex="-1">Audio OpenGameArt <a class="header-anchor" href="#audio-opengameart" aria-label="Permalink to &quot;Audio OpenGameArt&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Chiptune, musik RPG, dan SFX retro yang dibuat oleh pengembang game untuk game</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://opengameart.org" target="_blank" rel="noreferrer">opengameart.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Per item: CC0, CC-BY, OGA-BY, atau GPL</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan trek musik dan paket SFX</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>OGG, WAV, MP3, format tracker</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tidak diperlukan untuk CC0, wajib untuk CC-BY dan OGA-BY</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Musik ditulis khusus untuk game, sehingga treknya dapat di-loop dan sesuai dengan genre</li>
<li>Filter lisensi dalam pencarian memudahkan pembatasan hasil ke CC0</li>
<li>Koleksi komunitas menghimpun audio CC0 terbaik di satu tempat</li>
</ul>
<p>Dua catatan lisensi: OGA-BY adalah lisensi atribusi milik OpenGameArt, serupa dengan CC-BY tetapi lebih ramah untuk game yang dilindungi DRM. Audio berlisensi GPL secara hukum rumit untuk digunakan dalam game sumber tertutup, jadi sebaiknya pilih opsi CC.</p>
<h3 id="paket-audio-itch-io" tabindex="-1">Paket audio itch.io <a class="header-anchor" href="#paket-audio-itch-io" aria-label="Permalink to &quot;Paket audio itch.io&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Paket tematik dengan arahan artistik yang kuat</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://itch.io/game-assets/free/tag-audio" target="_blank" rel="noreferrer">itch.io/game-assets/free/tag-audio</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Per paket, ditentukan oleh masing-masing kreator (banyak yang CC0 atau bebas royalti)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 980 paket gratis bertag audio</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV, OGG, MP3 (bervariasi menurut paket)</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tergantung paketnya, baca setiap halaman</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Komposer indie menerbitkan paket lengkap yang sesuai genre (synthwave, RPG fantasi, horor)</li>
<li>Banyak paket menggunakan sistem bayar sesuka Anda, jadi bisa gratis sekarang dan diberi tip nanti</li>
<li>Halaman paket menjelaskan ketentuannya dengan bahasa sederhana</li>
</ul>
<p>itch.io tidak memiliki satu lisensi yang berlaku untuk seluruh situs; kreator menentukan ketentuan setiap paket, jadi baca deskripsinya sebelum merilis game. Sebagian besar paket populer secara langsung menyatakan &quot;gratis untuk penggunaan komersial&quot;, dan banyak di antaranya berlisensi CC0.</p>
<h2 id="musik" tabindex="-1">Musik <a class="header-anchor" href="#musik" aria-label="Permalink to &quot;Musik&quot;"></a></h2>
<h3 id="incompetech-kevin-macleod" tabindex="-1">Incompetech (Kevin MacLeod) <a class="header-anchor" href="#incompetech-kevin-macleod" aria-label="Permalink to &quot;Incompetech (Kevin MacLeod)&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Trek latar lengkap untuk hampir semua suasana</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://incompetech.com" target="_blank" rel="noreferrer">incompetech.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC-BY 4.0, tersedia lisensi berbayar tanpa atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Lebih dari 2.000 trek lengkap</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Wajib, baris kredit yang tepat disediakan untuk setiap trek</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Salah satu katalog musik gratis dari satu komposer terbesar yang tersedia</li>
<li>Dapat dicari berdasarkan genre, suasana, dan tempo</li>
<li>Lisensinya memiliki satu aturan yang jelas, bukan ketentuan acak untuk setiap trek</li>
</ul>
<p>Kredit yang diwajibkan adalah baris lengkap: &quot;Music by Kevin MacLeod (incompetech.com), Licensed under Creative Commons: By Attribution 4.0&quot;. Jika Anda tidak dapat menampilkan kredit, lisensi tanpa atribusi dimulai dari $30 untuk satu lagu dan turun menjadi $20 per lagu jika membeli tiga lagu atau lebih. Musiknya masih gratis dengan atribusi pada 2026; tidak ada perubahan dalam hal ini.</p>
<h3 id="pixabay-music" tabindex="-1">Pixabay Music <a class="header-anchor" href="#pixabay-music" aria-label="Permalink to &quot;Pixabay Music&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Musik latar yang aman untuk penggunaan komersial tanpa kerumitan</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://pixabay.com/music/" target="_blank" rel="noreferrer">pixabay.com/music</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Lisensi Konten Pixabay (unggahan sebelum 2019 berlisensi CC0)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Katalog besar berisi trek dan loop yang dapat dicari</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tidak ada</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Penggunaan komersial tanpa atribusi dan tanpa prosedur akun yang merepotkan</li>
<li>Pilihan loop dan musik latar berbagai genre yang bagus</li>
<li>Efek suara tersedia di situs yang sama dengan lisensi yang sama</li>
</ul>
<p>Lisensi Konten melarang penjualan kembali berkas secara terpisah serta penggunaan konten yang menampilkan merek dagang atau logo untuk mempromosikan barang, tetapi menyematkan trek dalam game Anda merupakan penggunaan yang memang dimaksudkan. Ini tetap menjadi pilihan termudah ketika Anda hanya ingin mendapatkan musik dengan cepat.</p>
<h3 id="purple-planet" tabindex="-1">Purple Planet <a class="header-anchor" href="#purple-planet" aria-label="Permalink to &quot;Purple Planet&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Musik soundtrack yang dikelompokkan berdasarkan suasana dengan kredit sederhana</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.purple-planet.com" target="_blank" rel="noreferrer">purple-planet.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis dengan atribusi, lisensi berbayar menghapus kewajiban kredit</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Trek orisinal karya Chris Martyn dan Geoff Harvey, disusun berdasarkan suasana</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3 gratis, berkas berkualitas lebih tinggi dengan lisensi berbayar</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Wajib pada tingkat gratis: &quot;Music: <a href="https://www.purple-planet.com" target="_blank" rel="noreferrer">https://www.purple-planet.com</a>&quot;</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Ketentuannya secara tegas mengizinkan game yang Anda jual dan distribusikan sendiri</li>
<li>Trek dikelompokkan berdasarkan emosi, sehingga pencarian soundtrack menjadi cepat</li>
<li>Kredit dapat dicantumkan pada layar kredit atau halaman toko game Anda</li>
</ul>
<p>Penggunaan komersial yang lebih luas, seperti iklan dan penyiaran, memerlukan salah satu lisensi berbayar mereka, yang juga menghapus kewajiban atribusi. Untuk game indie pada umumnya, tingkat gratis ditambah satu baris kredit sudah mencukupi.</p>
<h3 id="uppbeat" tabindex="-1">Uppbeat <a class="header-anchor" href="#uppbeat" aria-label="Permalink to &quot;Uppbeat&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Musik bagi kreator konten, kurang cocok untuk game yang dirilis</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://uppbeat.io" target="_blank" rel="noreferrer">uppbeat.io</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Paket gratis Uppbeat, kode kredit per unduhan</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Katalog modern pilihan (25% tersedia dalam paket gratis)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Wajib pada paket gratis</td>
</tr>
</tbody>
</table>
<p>Paket gratis kini memberikan 3 unduhan per bulan dan bahasa lisensinya ditujukan untuk platform sosial, siaran langsung, podcast, serta situs web, bukan game yang dapat diunduh. Karena itu, baca ketentuannya dengan saksama sebelum menjadikannya dasar soundtrack Anda. Uppbeat sangat cocok untuk trailer dan devlog game Anda. Untuk musik di dalam game komersial, sumber-sumber di atas lebih aman.</p>
<h3 id="free-music-archive" tabindex="-1">Free Music Archive <a class="header-anchor" href="#free-music-archive" aria-label="Permalink to &quot;Free Music Archive&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Menjelajahi genre secara mendalam jika Anda bersedia memeriksa setiap lisensi</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://freemusicarchive.org" target="_blank" rel="noreferrer">freemusicarchive.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Per trek: CC0, CC-BY, CC-BY-SA, dan banyak varian NC</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Katalog besar lintas genre dari para artis sungguhan</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Tergantung lisensi CC trek tersebut</td>
</tr>
</tbody>
</table>
<p>FMA tetap aktif dan berkembang pada 2026 di bawah Tribe of Noise. Kendalanya masih sama: banyak trek bersifat nonkomersial atau share-alike, jadi filter berdasarkan lisensi dan baca halaman trek sebelum merilis game. Layanan berbayarnya, Tribe of Noise PRO, melisensikan trek untuk proyek komersial termasuk game dengan harga sekitar 45 euro per lagu.</p>
<h3 id="jamendo" tabindex="-1">Jamendo <a class="header-anchor" href="#jamendo" aria-label="Permalink to &quot;Jamendo&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Menemukan musik, bukan untuk penggunaan komersial gratis</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.jamendo.com" target="_blank" rel="noreferrer">jamendo.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC untuk penggunaan pribadi, lisensi sinkronisasi berbayar untuk proyek komersial</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Katalog besar artis independen</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>tidak berlaku untuk penggunaan komersial (memerlukan lisensi berbayar)</td>
</tr>
</tbody>
</table>
<p>Jamendo sering membingungkan orang. Unduhan gratis ditujukan untuk penggunaan pribadi, dan sebagian besar trek memiliki ketentuan CC nonkomersial. Menyertakan trek dalam game yang Anda jual memerlukan lisensi per trek dari Jamendo Licensing, program sinkronisasi berbayar mereka. Anggap Jamendo sebagai sumber berbayar dengan pratinjau gratis, bukan sebagai sumber gratis.</p>
<h2 id="waspadai-jebakan-lisensi" tabindex="-1">Waspadai jebakan lisensi <a class="header-anchor" href="#waspadai-jebakan-lisensi" aria-label="Permalink to &quot;Waspadai jebakan lisensi&quot;"></a></h2>
<p>Beberapa sumber populer tidak aman untuk game komersial:</p>
<ul>
<li><strong>Arsip BBC Sound Effects</strong> gratis, tetapi lisensi RemArc-nya hanya untuk penggunaan nonkomersial. Gunakan untuk prototipe dan proyek pelajar, bukan untuk game yang Anda jual.</li>
<li><strong>Unduhan gratis Jamendo</strong> hanya untuk penggunaan pribadi, seperti dijelaskan di atas. Penggunaan komersial mengharuskan Anda membeli lisensi sinkronisasi.</li>
<li><strong>Paket gratis Uppbeat</strong> ditujukan untuk konten media sosial, bukan game yang dapat diunduh, jadi jangan menganggap paket tersebut mencakup build Anda.</li>
<li>Audio di <strong>Internet Archive</strong> memiliki ketentuan yang sangat berbeda untuk setiap item, dan beberapa diunggah tanpa persetujuan pemegang hak. Periksa kolom hak pada setiap item; ini adalah sumber dengan risiko tertinggi di sini.</li>
</ul>
<h2 id="format-audio-untuk-game-web" tabindex="-1">Format audio untuk game web <a class="header-anchor" href="#format-audio-untuk-game-web" aria-label="Permalink to &quot;Format audio untuk game web&quot;"></a></h2>
<p>Jika game Anda berjalan di browser, pilihan format memengaruhi ukuran file serta apakah audio yang diulang benar-benar dapat berulang dengan mulus.</p>
<table tabindex="0">
<thead>
<tr>
<th>Format</th>
<th>Ukuran pada kualitas bagus</th>
<th>Dukungan browser</th>
<th>Gunakan untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td>OGG Vorbis</td>
<td>Kecil</td>
<td>Semua browser, Safari sejak 18.4 (2025)</td>
<td>Musik dan SFX, pilihan standar Anda</td>
</tr>
<tr>
<td>MP3</td>
<td>Sedikit lebih besar</td>
<td>Universal, termasuk Safari versi lama</td>
<td>Format cadangan, suara sekali putar</td>
</tr>
<tr>
<td>Opus (WebM/OGG)</td>
<td>Paling kecil</td>
<td>Browser modern, dukungan Safari masih relatif baru</td>
<td>Musik panjang dengan bitrate rendah</td>
</tr>
<tr>
<td>WAV</td>
<td>Sangat besar</td>
<td>Universal</td>
<td>Hanya bunyi UI yang sangat singkat, jika benar-benar diperlukan</td>
</tr>
</tbody>
</table>
<p>Safari akhirnya menambahkan dukungan native untuk OGG Vorbis pada versi 18.4. Jadi, mulai 2026 Anda dapat menyediakan OGG saja untuk sebagian besar audiens. Jika analitik menunjukkan adanya trafik dari perangkat iOS lama, sediakan MP3 sebagai cadangan menggunakan pola beberapa sumber pada elemen <code>&lt;audio&gt;</code> atau pustaka seperti Howler.js.</p>
<h3 id="mengulang-musik-tanpa-jeda" tabindex="-1">Mengulang musik tanpa jeda <a class="header-anchor" href="#mengulang-musik-tanpa-jeda" aria-label="Permalink to &quot;Mengulang musik tanpa jeda&quot;"></a></h3>
<p>MP3 bukan format yang tepat untuk audio berulang. Encoder menambahkan beberapa milidetik keheningan pada awal dan akhir setiap file, sehingga loop MP3 berbunyi klik atau tersendat pada titik sambungannya. Gunakan OGG untuk semua audio yang berulang. Untuk loop dengan akurasi hingga tingkat sampel, dekode file menggunakan Web Audio API (<code>decodeAudioData</code> menjadi <code>AudioBufferSourceNode</code> dengan <code>loop = true</code>), yang akan mengulang audio tanpa jeda sama sekali. Pangkas keheningan dari kedua ujung file dan potong loop pada batas birama agar sambungannya tidak terdengar.</p>
<h3 id="menormalkan-volume" tabindex="-1">Menormalkan volume <a class="header-anchor" href="#menormalkan-volume" aria-label="Permalink to &quot;Menormalkan volume&quot;"></a></h3>
<p>Suara gratis berasal dari berbagai sumber dengan tingkat kenyaringan yang sangat berbeda. Sebelum dirilis, masukkan semuanya ke editor seperti Audacity lalu lakukan normalisasi: musik latar sekitar -14 hingga -16 LUFS, sementara puncak efek suara sebaiknya satu atau dua desibel di bawah skala penuh agar tidak clipping ketika beberapa suara diputar bersamaan. Dalam kode, teruskan semuanya melalui satu node gain utama agar satu penggeser volume dapat mengontrol seluruh campuran audio.</p>
<h3 id="menekan-total-ukuran-audio" tabindex="-1">Menekan total ukuran audio <a class="header-anchor" href="#menekan-total-ukuran-audio" aria-label="Permalink to &quot;Menekan total ukuran audio&quot;"></a></h3>
<p>Audio diam-diam dapat menjadi bagian terberat dari sebuah game browser. Enkode musik dalam OGG 96 hingga 128 kbps (pemain tidak akan mendengar perbedaannya saat bermain), ekspor SFX dalam format mono, dan pilih satu loop berdurasi 60 detik daripada trek berdurasi 4 menit. Streaming musik panjang melalui elemen <code>&lt;audio&gt;</code> alih-alih mendekodenya ke memori, dan gunakan buffer Web Audio hanya untuk SFX pendek yang membutuhkan latensi rendah. Seluruh audio untuk game kecil dapat dengan mudah disimpan dalam ukuran di bawah 5 MB.</p>
<h2 id="membuat-audio-dengan-ai" tabindex="-1">Membuat audio dengan AI <a class="header-anchor" href="#membuat-audio-dengan-ai" aria-label="Permalink to &quot;Membuat audio dengan AI&quot;"></a></h2>
<p>Cara lain untuk memperoleh audio game gratis pada 2026 adalah dengan membuatnya sendiri. Model terbuka seperti Stable Audio Open dan ACE-Step dapat membuat efek suara serta musik dengan lisensi yang ramah untuk penggunaan komersial. ElevenLabs merupakan opsi layanan terkelola terbaik, dengan hak komersial pada paket berbayar. <a href="/id/guides/frontier-gen-ai-models.html">Panduan model AI generatif terbuka kami</a> membandingkan semuanya.</p>
<p>Satu catatan tentang lisensi: berdasarkan panduan Kantor Hak Cipta AS saat ini, audio yang sepenuhnya dibuat oleh AI tidak dapat memperoleh hak cipta dengan sendirinya. Artinya, tidak ada yang dapat mengklaim kepemilikan atas SFX buatan AI Anda, tetapi Anda juga tidak dapat mencegah orang lain menggunakan hasil yang identik. Dalam praktiknya, hal yang paling penting adalah ketentuan penyedia. Jadi, pastikan Anda memiliki hak penggunaan komersial sebelum merilis game.</p>
<p>Keduanya sudah tersedia di Cinevva dan dapat dicoba secara gratis. <a href="/id/tools/sfx.html">Buat efek suara dari deskripsi teks</a> (tembakan laser, derit pintu, suara mengambil koin) atau <a href="/id/tools/music.html">buat lagu orisinal</a> dengan vokal dan instrumental untuk soundtrack Anda. Jika Anda lebih memilih rekaman suara, katalog CC0 Freesound telah terintegrasi dengan <a href="/id/assets.html?providers=freesound">pencarian aset Cinevva</a>, sehingga Anda dapat mencari dan langsung memasukkan audio yang aman untuk penggunaan komersial ke dalam game.</p>
<h2 id="referensi-singkat-lisensi" tabindex="-1">Referensi singkat lisensi <a class="header-anchor" href="#referensi-singkat-lisensi" aria-label="Permalink to &quot;Referensi singkat lisensi&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Sumber</th>
<th>Lisensi</th>
<th>Atribusi</th>
<th>Aman untuk penggunaan komersial</th>
</tr>
</thead>
<tbody>
<tr>
<td>Audio Kenney</td>
<td>CC0</td>
<td>Tidak</td>
<td>✅</td>
</tr>
<tr>
<td>Pixabay Music</td>
<td>Pixabay Content License</td>
<td>Tidak</td>
<td>✅</td>
</tr>
<tr>
<td>Sonniss GDC</td>
<td>Bebas royalti</td>
<td>Tidak</td>
<td>✅</td>
</tr>
<tr>
<td>Mixkit</td>
<td>Lisensi gratis Mixkit</td>
<td>Tidak</td>
<td>✅</td>
</tr>
<tr>
<td>Freesound</td>
<td>Per suara (CC0/CC-BY/NC)</td>
<td>Tergantung</td>
<td>✅ (periksa setiap suara)</td>
</tr>
<tr>
<td>OpenGameArt</td>
<td>Per item (CC0/CC-BY/OGA-BY)</td>
<td>Tergantung</td>
<td>✅ (periksa setiap item)</td>
</tr>
<tr>
<td>Paket itch.io</td>
<td>Per paket</td>
<td>Tergantung</td>
<td>✅ (periksa setiap paket)</td>
</tr>
<tr>
<td>Incompetech</td>
<td>CC-BY 4.0</td>
<td>Ya</td>
<td>✅</td>
</tr>
<tr>
<td>ZapSplat (gratis)</td>
<td>Standar</td>
<td>Ya</td>
<td>✅</td>
</tr>
<tr>
<td>Purple Planet (gratis)</td>
<td>Lisensi atribusi</td>
<td>Ya</td>
<td>✅</td>
</tr>
<tr>
<td>Uppbeat (gratis)</td>
<td>Tingkat gratis</td>
<td>Ya</td>
<td>Terbatas</td>
</tr>
<tr>
<td>Free Music Archive</td>
<td>CC per trek</td>
<td>Tergantung</td>
<td>⚠️ banyak trek NC</td>
</tr>
<tr>
<td>Jamendo</td>
<td>CC pribadi / sinkronisasi berbayar</td>
<td>n/a</td>
<td>❌ tanpa lisensi berbayar</td>
</tr>
<tr>
<td>BBC Sound Effects</td>
<td>RemArc</td>
<td>n/a</td>
<td>❌ nonkomersial</td>
</tr>
<tr>
<td>Internet Archive</td>
<td>Bervariasi</td>
<td>Bervariasi</td>
<td>⚠️ periksa setiap item</td>
</tr>
</tbody>
</table>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="di-mana-saya-bisa-mendapatkan-efek-suara-gratis-untuk-game" tabindex="-1">Di mana saya bisa mendapatkan efek suara gratis untuk game? <a class="header-anchor" href="#di-mana-saya-bisa-mendapatkan-efek-suara-gratis-untuk-game" aria-label="Permalink to &quot;Di mana saya bisa mendapatkan efek suara gratis untuk game?&quot;"></a></h3>
<p>Freesound memiliki pustaka terbesar dengan lebih dari 700.000 suara (lisensi berbeda untuk setiap suara, jadi gunakan filter CC0). Kenney menyediakan paket audio yang seluruhnya berlisensi CC0 tanpa persyaratan atribusi, sementara bundel Sonniss GDC menyediakan SFX profesional bebas royalti dalam jumlah besar. Untuk game komersial, utamakan sumber CC0 atau yang jelas-jelas bebas royalti dan periksa lisensi setiap file.</p>
<h3 id="apa-musik-gratis-terbaik-untuk-game" tabindex="-1">Apa musik gratis terbaik untuk game? <a class="header-anchor" href="#apa-musik-gratis-terbaik-untuk-game" aria-label="Permalink to &quot;Apa musik gratis terbaik untuk game?&quot;"></a></h3>
<p>Untuk musik tanpa persyaratan atribusi, Pixabay Music adalah pilihan paling mudah dan aman untuk penggunaan komersial. Incompetech menyediakan lebih dari 2.000 trek di bawah lisensi CC-BY jika Anda menyertakan baris kredit, sementara OpenGameArt memiliki loop khusus game di bawah lisensi CC0. Free Music Archive menawarkan variasi yang sangat luas, tetapi lisensinya beragam, jadi periksa setiap trek. Hindari unduhan gratis Jamendo untuk game komersial karena hanya ditujukan untuk penggunaan pribadi.</p>
<h3 id="bisakah-saya-menggunakan-audio-freesound-dalam-game-komersial" tabindex="-1">Bisakah saya menggunakan audio Freesound dalam game komersial? <a class="header-anchor" href="#bisakah-saya-menggunakan-audio-freesound-dalam-game-komersial" aria-label="Permalink to &quot;Bisakah saya menggunakan audio Freesound dalam game komersial?&quot;"></a></h3>
<p>Ya, jika lisensi suara tersebut mengizinkannya. Suara CC0 sepenuhnya aman untuk penggunaan komersial tanpa kredit, suara CC-BY dapat digunakan dengan atribusi, sedangkan suara CC-BY-NC tidak dapat digunakan dalam game yang Anda jual. Pencarian lanjutan Freesound dapat memfilter berdasarkan lisensi. Batasi hasil ke CC0 dan CC-BY agar aman.</p>
<h3 id="apakah-saya-harus-mencantumkan-kredit-untuk-kenney" tabindex="-1">Apakah saya harus mencantumkan kredit untuk Kenney? <a class="header-anchor" href="#apakah-saya-harus-mencantumkan-kredit-untuk-kenney" aria-label="Permalink to &quot;Apakah saya harus mencantumkan kredit untuk Kenney?&quot;"></a></h3>
<p>Tidak. Semua aset Kenney, termasuk setiap paket audio, merupakan domain publik CC0. Karena itu, atribusi tidak diwajibkan bahkan untuk game komersial. Kenney secara eksplisit mendorong penggunaan komersial. Memberikan kredit atau donasi adalah tindakan yang baik, tetapi bukan kewajiban hukum.</p>
<h3 id="apakah-musik-incompetech-masih-gratis" tabindex="-1">Apakah musik Incompetech masih gratis? <a class="header-anchor" href="#apakah-musik-incompetech-masih-gratis" aria-label="Permalink to &quot;Apakah musik Incompetech masih gratis?&quot;"></a></h3>
<p>Ya. Pada 2026, katalog Kevin MacLeod yang berisi lebih dari 2.000 trek masih tersedia gratis di bawah lisensi CC-BY 4.0, selama Anda menyertakan baris kredit lengkap dengan namanya, situsnya, dan lisensinya. Jika Anda tidak dapat menampilkan kredit, lisensi tanpa atribusi tersedia mulai dari $30 untuk satu lagu.</p>
<h3 id="apakah-saya-harus-mencantumkan-kredit-untuk-audio-game-gratis" tabindex="-1">Apakah saya harus mencantumkan kredit untuk audio game gratis? <a class="header-anchor" href="#apakah-saya-harus-mencantumkan-kredit-untuk-audio-game-gratis" aria-label="Permalink to &quot;Apakah saya harus mencantumkan kredit untuk audio game gratis?&quot;"></a></h3>
<p>Tergantung pada lisensinya. Audio berlisensi CC0, lisensi Pixabay, dan Mixkit tidak memerlukan kredit. CC-BY (seperti Incompetech), ZapSplat tingkat gratis, dan Purple Planet mengharuskan atribusi, biasanya berupa satu baris pada layar kredit. CC-BY-NC dan lisensi BBC RemArc sepenuhnya melarang penggunaan komersial. Pilih CC0 agar Anda tidak perlu mengelola atribusi sama sekali.</p>
<h3 id="format-audio-apa-yang-sebaiknya-digunakan-game-web" tabindex="-1">Format audio apa yang sebaiknya digunakan game web? <a class="header-anchor" href="#format-audio-apa-yang-sebaiknya-digunakan-game-web" aria-label="Permalink to &quot;Format audio apa yang sebaiknya digunakan game web?&quot;"></a></h3>
<p>OGG Vorbis. Ukurannya kecil dengan kualitas bagus, dapat diulang tanpa jeda, dan sekarang didukung oleh setiap browser utama sejak Safari menambahkannya pada versi 18.4. Sediakan MP3 sebagai cadangan jika Anda perlu mendukung perangkat iOS lama, dan hindari MP3 untuk musik berulang karena padding encoder merusak sambungan loop.</p>
<h3 id="bisakah-saya-menggunakan-ai-untuk-membuat-suara-dan-musik-game" tabindex="-1">Bisakah saya menggunakan AI untuk membuat suara dan musik game? <a class="header-anchor" href="#bisakah-saya-menggunakan-ai-untuk-membuat-suara-dan-musik-game" aria-label="Permalink to &quot;Bisakah saya menggunakan AI untuk membuat suara dan musik game?&quot;"></a></h3>
<p>Ya. Model terbuka seperti Stable Audio Open dan ACE-Step dapat membuat audio dengan lisensi yang ramah untuk penggunaan komersial. ElevenLabs juga merupakan opsi layanan terkelola yang kuat, dengan hak komersial pada paket berbayar. Alat <a href="/id/tools/sfx.html">SFX</a> dan <a href="/id/tools/music.html">musik</a> gratis dari Cinevva dapat membuat audio game dari perintah teks. Pastikan ketentuan hak atas output dari penyedia sebelum merilis apa pun secara komersial.</p>
<BuildCta
  title="Tambahkan musik dan suara ke dalam game secara otomatis"
  desc="AI menggubah musik untuk game Anda sambil membuatnya."
  prompt="Buat game clicker ritme dengan musik ceria dan efek suara yang memuaskan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — panduan aset lengkap</li>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a> — sisi visualnya</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — CC0, CC-BY, bebas royalti</li>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Terbaik untuk Game</a> — pembuatan audio dengan AI</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game di itch.io</a> — merilis game dengan paket audio tersebut</li>
<li><a href="/id/tutorials/tone-js-game-audio.html">Audio game dengan Tone.js</a> — memutar audio di browser</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/free-sound-effects-music-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Mendapatkan Lebih Banyak Pemain di itch.io (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/get-more-plays-itch-io</link>
            <guid>https://app.cinevva.com/id/guides/get-more-plays-itch-io</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Panduan praktis 2026 untuk mendapatkan lebih banyak pemain dan unduhan di itch.io, mencakup cara kerja penemuan, tag, build web yang dapat dimainkan, devlog, game jam, dan trafik dari luar platform.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-mendapatkan-lebih-banyak-pemain-di-itch-io-2026" tabindex="-1">Cara Mendapatkan Lebih Banyak Pemain di itch.io (2026) <a class="header-anchor" href="#cara-mendapatkan-lebih-banyak-pemain-di-itch-io-2026" aria-label="Permalink to &quot;Cara Mendapatkan Lebih Banyak Pemain di itch.io (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Mengunggah game ke itch.io itu mudah. Mendapatkan pemain adalah bagian yang sulit. itch.io tidak akan langsung memberi Anda audiens seperti portal besar, jadi jumlah permainan bergantung pada halaman yang menarik, build web yang dapat dimainkan, devlog, jam, serta trafik yang Anda datangkan sendiri. Berikut hal-hal yang benar-benar memberikan dampak pada 2026, berdasarkan cara kerja penemuan di itch.io.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/dSLhu2ufSvc" title="Cara Mendapatkan Lebih Banyak Tayangan & Unduhan di Itch.io — Brani_Dev" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Taktik praktis untuk mendapatkan lebih banyak tayangan dan unduhan di itch.io.</div>
<h2 id="cara-kerja-penemuan-di-itch-io" tabindex="-1">Cara kerja penemuan di itch.io <a class="header-anchor" href="#cara-kerja-penemuan-di-itch-io" aria-label="Permalink to &quot;Cara kerja penemuan di itch.io&quot;"></a></h2>
<p>Beberapa fakta sebagai dasar upaya Anda:</p>
<ul>
<li>Urutan <strong>Popular</strong> menggunakan algoritma tertutup yang menggabungkan aktivitas historis dan terkini, dengan bobot lebih besar pada aktivitas terkini. Faktor yang telah dikonfirmasi mencakup tayangan organik, unduhan, dan jumlah permainan. Memalsukan salah satunya akan membuat game Anda dihapus dari daftar.</li>
<li><strong>Most Recent</strong> hanya menampilkan game Anda satu kali, saat pertama kali diterbitkan; Anda tidak dapat memicunya kembali dengan menerbitkan ulang (itch tidak akan mengubah tanggal penerbitan Anda).</li>
<li><strong>Halaman depan dikurasi oleh manusia</strong>, dipilih langsung oleh staf, bukan oleh algoritma. Anda tidak dapat mengakalinya agar muncul di sana, tetapi halaman yang bagus dan traksi nyata akan meningkatkan peluang Anda.</li>
<li>Agar dapat diindeks, halaman Anda harus bersifat publik, memiliki gambar sampul, serta menyediakan game yang dapat dimainkan atau diunduh. Halaman placeholder kosong tidak akan diindeks, dan akun penjual baru harus melewati antrean peninjauan singkat.</li>
</ul>
<p>Kesimpulan praktisnya: itch menghargai aktivitas nyata yang terkonsentrasi sejak awal dan halaman yang lengkap. itch tidak menghargai trik.</p>
<h2 id="buat-game-dapat-dimainkan-di-browser" tabindex="-1">Buat game dapat dimainkan di browser <a class="header-anchor" href="#buat-game-dapat-dimainkan-di-browser" aria-label="Permalink to &quot;Buat game dapat dimainkan di browser&quot;"></a></h2>
<p>Ini adalah langkah paling efektif yang bisa dilakukan pada halaman game. Unggah build HTML5 (file ZIP dengan <code>index.html</code>) agar orang dapat langsung bermain tanpa harus mengunduh. Game yang dapat dimainkan di browser memperoleh interaksi jauh lebih tinggi daripada game yang hanya dapat diunduh karena tidak ada hambatan tambahan. Pendiri itch telah menyoroti tingkat konversinya yang jauh lebih tinggi, sementara data analis menunjukkan bahwa interaksi pada game browser kira-kira 3 kali lebih tinggi, dan sering kali sekitar separuh dari seluruh kunjungan halaman berubah menjadi permainan. Jika engine Anda dapat mengekspor ke web, lakukanlah.</p>
<h2 id="sempurnakan-halaman-game" tabindex="-1">Sempurnakan halaman game <a class="header-anchor" href="#sempurnakan-halaman-game" aria-label="Permalink to &quot;Sempurnakan halaman game&quot;"></a></h2>
<ul>
<li><strong>Gambar sampul:</strong> wajib, dengan ukuran yang disarankan 630x500. Ini adalah elemen grafis terpenting di halaman Anda, dan sampul GIF animasi didukung serta dianjurkan. Utamakan gerakan yang menunjukkan daya tarik utama game.</li>
<li><strong>Tangkapan layar dan trailer/GIF:</strong> itch menampilkan sematan video (YouTube, Vimeo) di atas tangkapan layar dan sangat menyarankannya, terutama untuk game. Tunjukkan, jangan hanya ceritakan.</li>
<li><strong>Deskripsi singkat:</strong> deskripsi ini muncul dalam berbagai daftar, jadi buatlah daya tarik yang jelas dan spesifik.</li>
</ul>
<h2 id="tag-dan-metadata" tabindex="-1">Tag dan metadata <a class="header-anchor" href="#tag-dan-metadata" aria-label="Permalink to &quot;Tag dan metadata&quot;"></a></h2>
<p>Gunakan tag yang disarankan alih-alih membuat tag sendiri, hindari sinonim, dan jangan memasukkan tag secara berlebihan karena game Anda dapat dihapus dari halaman jelajah. Anda dapat menggunakan hingga 10 tag ditambah satu genre. Hanya centang platform (Windows/Mac/Linux) jika Anda benar-benar memiliki build yang sudah diuji untuk platform tersebut; klasifikasi yang keliru dapat membuat game Anda dihapus dari daftar.</p>
<h2 id="gunakan-devlog" tabindex="-1">Gunakan devlog <a class="header-anchor" href="#gunakan-devlog" aria-label="Permalink to &quot;Gunakan devlog&quot;"></a></h2>
<p>Menerbitkan devlog akan menampilkannya di feed semua pengikut Anda dan feed devlog seluruh situs sehingga dapat menjangkau orang-orang di luar pengikut Anda. Pengikut juga akan mendapat notifikasi saat Anda merilis proyek baru atau mengadakan diskon. Dengan demikian, memposting devlog membantu menambah pengikut, dan para pengikut tersebut akan mendapat notifikasi saat peluncuran Anda berikutnya. Perlakukan devlog sebagai sarana rutin untuk mendatangkan trafik dan membangun audiens, bukan sebagai pelengkap belaka.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/l9TZl_0Gqe4" title="Mengapa Game itch.io Anda Mendapat 0 Unduhan (dan Cara Memperbaikinya) — KiriSoft Games" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Alasan umum game itch.io tidak mendapatkan unduhan beserta solusinya.</div>
<h2 id="ikuti-game-jam-mesin-penemuan-yang-sebenarnya" tabindex="-1">Ikuti game jam (mesin penemuan yang sebenarnya) <a class="header-anchor" href="#ikuti-game-jam-mesin-penemuan-yang-sebenarnya" aria-label="Permalink to &quot;Ikuti game jam (mesin penemuan yang sebenarnya)&quot;"></a></h2>
<p>Jam adalah pendorong penemuan organik terbesar di itch.io, dengan ratusan ribu game yang dibuat untuk berbagai jam. Sebuah jam memberi Anda audiens bawaan, tenggat waktu, dan mekanisme timbal balik: jika Anda memberi nilai dan mengomentari karya peserta lain (dan telah mengirimkan karya Anda sendiri), tautan ke game Anda akan otomatis ditambahkan di bawah komentar tersebut sehingga mengarahkan pemain kembali kepada Anda. Jam besar seperti GMTK menarik puluhan ribu peserta. Jam tidak akan secara ajaib meningkatkan posisi Anda dalam algoritma Popular, tetapi jam akan menarik perhatian nyata ke game Anda saat kanal lain belum mampu melakukannya.</p>
<h2 id="menentukan-harga-untuk-mendapatkan-pemain" tabindex="-1">Menentukan harga untuk mendapatkan pemain <a class="header-anchor" href="#menentukan-harga-untuk-mendapatkan-pemain" aria-label="Permalink to &quot;Menentukan harga untuk mendapatkan pemain&quot;"></a></h2>
<p>Penetapan harga di itch selalu menggunakan sistem bayar sesuka hati: harga yang ditentukan merupakan harga minimum, dan pembeli dapat membayar lebih (sekitar 30% dari uang yang dibelanjakan merupakan pembayaran tambahan di atas harga minimum). Untuk memaksimalkan jumlah pemain, opsi gratis atau bayar sesuka hati menghilangkan semua hambatan sambil tetap memungkinkan penggemar memberi tip. Perlu diketahui bahwa game HTML5 hanya dapat menerima pembayaran sebagai donasi. Hindari diskon permanen karena itch tidak menganggapnya sebagai diskon sungguhan dan dapat menghapus game Anda dari indeks.</p>
<h2 id="datangkan-trafik-sendiri-sumber-sebagian-besar-pemain" tabindex="-1">Datangkan trafik sendiri (sumber sebagian besar pemain) <a class="header-anchor" href="#datangkan-trafik-sendiri-sumber-sebagian-besar-pemain" aria-label="Permalink to &quot;Datangkan trafik sendiri (sumber sebagian besar pemain)&quot;"></a></h2>
<p>itch mengganti game unggulan dengan cepat dan tidak mempertahankan penemuan seperti Steam, jadi trafik eksternal adalah sumber pemain yang sebenarnya:</p>
<ul>
<li><strong>Streamer dan YouTuber</strong> merupakan kanal dengan potensi hasil terbesar. Satu kreator saja dapat menghasilkan lebih banyak instalasi daripada upaya selama berbulan-bulan melalui kanal lain, dan mereka secara aktif mencari demo gratis di itch.</li>
<li><strong>Video format pendek</strong> (TikTok, Reels, Shorts) berisi cuplikan gameplay nyata kini menjadi salah satu pendorong utama viralitas game indie.</li>
<li><strong>Reddit</strong> (r/IndieGaming, r/playmygame, dan komunitas serupa), dengan tetap mematuhi aturan kira-kira 9 banding 1 antara postingan komunitas dan promosi diri.</li>
<li><strong>Discord</strong> untuk mencari playtester dan mempertahankan pemain, serta X dengan #screenshotsaturday dan GIF.</li>
</ul>
<p>Untuk strategi tanpa anggaran yang lebih luas, baca <a href="/id/guides/promote-indie-game-no-budget.html">cara mempromosikan game indie tanpa anggaran</a>.</p>
<h2 id="kesalahan-umum" tabindex="-1">Kesalahan umum <a class="header-anchor" href="#kesalahan-umum" aria-label="Permalink to &quot;Kesalahan umum&quot;"></a></h2>
<p>Hanya menyediakan unduhan saat build web memungkinkan, sampul yang lemah atau tidak ada, tidak memiliki trailer atau GIF, deskripsi yang minim, tag yang buruk atau berlebihan, menerbitkan game lalu tidak aktif (tanpa devlog), berharap algoritma atau fitur unggulan melakukan semuanya, tidak menyediakan demo, dan memalsukan metrik (yang akan membuat game Anda dihapus dari daftar). Perbaiki hal-hal ini terlebih dahulu; semuanya gratis.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bagaimana-cara-mendapatkan-lebih-banyak-pemain-di-itch-io" tabindex="-1">Bagaimana cara mendapatkan lebih banyak pemain di itch.io? <a class="header-anchor" href="#bagaimana-cara-mendapatkan-lebih-banyak-pemain-di-itch-io" aria-label="Permalink to &quot;Bagaimana cara mendapatkan lebih banyak pemain di itch.io?&quot;"></a></h3>
<p>Unggah build HTML5 yang dapat dimainkan di browser (interaksinya jauh lebih tinggi daripada unduhan), buat halaman yang menarik dengan sampul animasi dan trailer, gunakan tag rekomendasi yang akurat, posting devlog untuk menjangkau pengikut, ikuti game jam untuk mendapatkan penemuan bawaan, serta datangkan trafik eksternal dari streamer, video format pendek, dan komunitas. itch menghargai aktivitas nyata dan halaman yang lengkap, bukan trik.</p>
<h3 id="apakah-itch-io-akan-mempromosikan-game-anda" tabindex="-1">Apakah itch.io akan mempromosikan game Anda? <a class="header-anchor" href="#apakah-itch-io-akan-mempromosikan-game-anda" aria-label="Permalink to &quot;Apakah itch.io akan mempromosikan game Anda?&quot;"></a></h3>
<p>Tidak banyak. Halaman depan dikurasi langsung oleh staf, sedangkan urutan Popular berubah dengan cepat berdasarkan aktivitas nyata terkini. itch menyediakan sarana dan audiens dasar, tetapi penemuan yang berkelanjutan berasal dari upaya Anda sendiri: build yang dapat dimainkan, devlog, jam, serta trafik yang Anda datangkan dari streamer, video, dan komunitas.</p>
<h3 id="apakah-game-web-mendapatkan-lebih-banyak-pemain-daripada-game-unduhan-di-itch-io" tabindex="-1">Apakah game web mendapatkan lebih banyak pemain daripada game unduhan di itch.io? <a class="header-anchor" href="#apakah-game-web-mendapatkan-lebih-banyak-pemain-daripada-game-unduhan-di-itch-io" aria-label="Permalink to &quot;Apakah game web mendapatkan lebih banyak pemain daripada game unduhan di itch.io?&quot;"></a></h3>
<p>Ya, jauh lebih banyak. Game yang dapat dimainkan di browser menghilangkan hambatan pengunduhan, dan data menunjukkan interaksi kira-kira 3 kali lebih tinggi dibandingkan game yang hanya dapat diunduh, dengan sebagian besar kunjungan halaman berubah menjadi permainan. Jika engine Anda dapat mengekspor ke HTML5, menerbitkan build web yang dapat dimainkan adalah langkah terbaik untuk mendapatkan lebih banyak pemain.</p>
<h3 id="apakah-game-jam-layak-diikuti-untuk-mendapatkan-pemain" tabindex="-1">Apakah game jam layak diikuti untuk mendapatkan pemain? <a class="header-anchor" href="#apakah-game-jam-layak-diikuti-untuk-mendapatkan-pemain" aria-label="Permalink to &quot;Apakah game jam layak diikuti untuk mendapatkan pemain?&quot;"></a></h3>
<p>Sangat layak. Jam merupakan pendorong penemuan organik terbesar di itch.io: Anda mendapatkan audiens bawaan dan tenggat waktu, sementara memberi nilai pada karya peserta lain akan otomatis menautkan kembali game Anda sehingga mendatangkan pemain. Jam tidak akan meningkatkan posisi Anda dalam algoritma secara langsung, tetapi akan mendatangkan pemain sungguhan saat Anda belum memiliki audiens.</p>
<BuildCta
  title="Perlu membuat game untuk dipromosikan terlebih dahulu?"
  desc="Buat sesuatu yang singkat dan membuat ketagihan, lalu terapkan strategi ini."
  prompt="Buat game satu tombol yang singkat dan membuat ketagihan, dengan nuansa perebutan skor tertinggi global" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — dasar-dasar penyiapan</li>
<li><a href="/id/guides/publish-web-game.html">Tempat Terbaik untuk Menerbitkan Game Web pada 2026</a> — itch.io dibandingkan portal game</li>
<li><a href="/id/guides/promote-indie-game-no-budget.html">Cara Mempromosikan Game Indie Tanpa Anggaran</a> — strategi yang lebih luas</li>
<li><a href="/id/guides/game-jams-hackathons.html">Game Jam dan Hackathon</a> — memilih jam untuk diikuti</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web: Fakta yang Sebenarnya Ditunjukkan Data</a> — mengubah jumlah permainan menjadi pendapatan</li>
<li><a href="/id/guides/steam-next-fest-strategy.html">Strategi Steam Next Fest</a> — jika Anda juga membawanya ke Steam</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/get-more-plays-itch-io-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Membuat Game dengan AI pada 2026 (Tanpa Perlu Coding)]]></title>
            <link>https://app.cinevva.com/id/guides/make-a-game-with-ai</link>
            <guid>https://app.cinevva.com/id/guides/make-a-game-with-ai</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Panduan langkah demi langkah untuk membuat game dengan AI tanpa coding pada 2026, mulai dari menulis prompt pertama hingga membuat aset, melakukan iterasi, dan menerbitkan game yang dapat dimainkan.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-membuat-game-dengan-ai-pada-2026-tanpa-perlu-coding" tabindex="-1">Cara Membuat Game dengan AI pada 2026 (Tanpa Perlu Coding) <a class="header-anchor" href="#cara-membuat-game-dengan-ai-pada-2026-tanpa-perlu-coding" aria-label="Permalink to &quot;Cara Membuat Game dengan AI pada 2026 (Tanpa Perlu Coding)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Beberapa tahun lalu, membuat game berarti harus mempelajari game engine, bahasa pemrograman, dan alur produksi aset visual sebelum Anda memiliki sesuatu yang bisa dimainkan. Pada 2026, Anda dapat mendeskripsikan sebuah game dengan bahasa sehari-hari dan mendapatkan versi yang berfungsi dalam hitungan menit. Anda tetap mengambil keputusan kreatif, tetapi AI menangani pekerjaan teknis standar: pergerakan, tabrakan, fisika, aset visual sementara, dan suara.</p>
<p>Panduan ini membahas seluruh proses tanpa coding, mulai dari prompt pertama hingga menerbitkan game. Contohnya menggunakan kreator game AI berbasis browser, tetapi alur kerjanya berlaku untuk sebagian besar alat pembuat game dari prompt.</p>
<h2 id="yang-anda-butuhkan" tabindex="-1">Yang Anda butuhkan <a class="header-anchor" href="#yang-anda-butuhkan" aria-label="Permalink to &quot;Yang Anda butuhkan&quot;"></a></h2>
<p>Tidak banyak. Cukup browser, ide, dan sebuah alat. Anda tidak perlu memasang game engine, memiliki GPU, atau menyiapkan aset visual. Jika ingin memilih alat terlebih dahulu, lihat <a href="/id/guides/ai-game-generators-2026.html">perbandingan generator game AI</a>; jika hanya ingin langsung mulai, Anda dapat <a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=make_game_with_ai">membuka kreator dan mengetikkan ide</a> sekarang juga.</p>
<h2 id="langkah-1-mulailah-dengan-ide-yang-jelas-dan-sederhana" tabindex="-1">Langkah 1: Mulailah dengan ide yang jelas dan sederhana <a class="header-anchor" href="#langkah-1-mulailah-dengan-ide-yang-jelas-dan-sederhana" aria-label="Permalink to &quot;Langkah 1: Mulailah dengan ide yang jelas dan sederhana&quot;"></a></h2>
<p>Kesalahan pemula yang paling umum adalah menggunakan prompt seperti &quot;RPG dunia terbuka dengan multipemain.&quot; Alat AI memberikan hasil terbaik jika dimulai dari konsep inti yang kecil dan spesifik, lalu dikembangkan kemudian. Tentukan tiga hal:</p>
<ul>
<li><strong>Jenis gamenya.</strong> Platformer, balapan, shooter, puzzle, survival, atau simulasi santai.</li>
<li><strong>Satu hal yang membuatnya khas.</strong> Efek cahaya, variasi aturan, atau latar tertentu.</li>
<li><strong>Sebuah tujuan.</strong> Apa yang ingin dicapai pemain.</li>
</ul>
<p>&quot;Game parkour orang pertama melintasi pulau-pulau terapung sambil berpacu dengan waktu&quot; adalah prompt awal yang jauh lebih baik daripada &quot;petualangan 3D yang seru.&quot; Prompt pertama memberi AI kerangka yang dapat dibangun, sedangkan prompt kedua membuatnya harus menebak.</p>
<h2 id="langkah-2-tulis-prompt-pertama-anda" tabindex="-1">Langkah 2: Tulis prompt pertama Anda <a class="header-anchor" href="#langkah-2-tulis-prompt-pertama-anda" aria-label="Permalink to &quot;Langkah 2: Tulis prompt pertama Anda&quot;"></a></h2>
<p>Batasi menjadi satu atau dua kalimat. Anda tidak sedang menulis spesifikasi, melainkan memulai percakapan. Prompt awal yang baik menyebutkan genre, tujuan, dan nuansa:</p>
<blockquote>
<p>Buat game survival zombi dengan sudut pandang dari atas, menggunakan senter yang hanya menerangi area berbentuk kerucut sempit, amunisi terbatas, dan gelombang musuh yang makin sulit.</p>
</blockquote>
<p>Kemudian biarkan alat tersebut membuat gamenya. Anda akan mendapatkan versi pertama yang dapat dimainkan dan biasanya belum sempurna. Itulah yang Anda inginkan, karena pekerjaan sebenarnya adalah melakukan iterasi. Jika kotak prompt kosong terasa membingungkan, mulailah dari <a href="/id/guides/vibe-coding-game-prompts.html">prompt siap pakai</a>, lalu ubah satu kata.</p>
<h2 id="langkah-3-lakukan-iterasi-dengan-berbicara-kepada-ai" tabindex="-1">Langkah 3: Lakukan iterasi dengan berbicara kepada AI <a class="header-anchor" href="#langkah-3-lakukan-iterasi-dengan-berbicara-kepada-ai" aria-label="Permalink to &quot;Langkah 3: Lakukan iterasi dengan berbicara kepada AI&quot;"></a></h2>
<p>Di tahap inilah game benar-benar dibuat. Mainkan versi pertama, temukan satu hal yang paling mengganggu, lalu minta satu perubahan spesifik. Permintaan kecil dan jelas lebih efektif daripada permintaan besar yang samar:</p>
<ul>
<li>&quot;Buat pemain bergerak lebih cepat dan melompat lebih tinggi.&quot;</li>
<li>&quot;Musuh terlalu agresif. Perlambat mereka dan kurangi health mereka.&quot;</li>
<li>&quot;Tambahkan penghitung skor di kanan atas dan layar game over.&quot;</li>
</ul>
<p>Ubah satu hal, mainkan, lalu ulangi. Jika suatu perubahan memperburuk hasilnya, minta AI membatalkan atau mengembalikannya. Anggap proses ini seperti menyutradarai, bukan melakukan coding: Anda mendeskripsikan hasil yang diinginkan, lalu menilai hasilnya.</p>
<h2 id="langkah-4-buat-aset-yang-anda-butuhkan" tabindex="-1">Langkah 4: Buat aset yang Anda butuhkan <a class="header-anchor" href="#langkah-4-buat-aset-yang-anda-butuhkan" aria-label="Permalink to &quot;Langkah 4: Buat aset yang Anda butuhkan&quot;"></a></h2>
<p>Alat pembuat game AI modern dapat menghasilkan aset visual dan audio sesuai permintaan, sehingga Anda tidak harus terpaku pada kotak-kotak abu-abu. Bergantung pada alatnya, Anda dapat meminta model 3D, tekstur, sprite, musik, dan efek suara, atau mengambilnya dari pustaka aset gratis bawaan. Minta aset yang sesuai dengan suasana: &quot;beri pemain model robot low-poly,&quot; &quot;tambahkan musik synth yang ceria,&quot; atau &quot;gunakan skybox gurun.&quot; Jika alat Anda memiliki pustaka aset CC0, itulah sumber paling aman untuk apa pun yang ingin diterbitkan. <a href="/id/guides/game-assets-guide.html">Panduan aset game gratis</a> kami menjelaskan asal aset-aset tersebut dan cara kerja lisensinya.</p>
<h2 id="langkah-5-sempurnakan-pengalaman-bermain" tabindex="-1">Langkah 5: Sempurnakan pengalaman bermain <a class="header-anchor" href="#langkah-5-sempurnakan-pengalaman-bermain" aria-label="Permalink to &quot;Langkah 5: Sempurnakan pengalaman bermain&quot;"></a></h2>
<p>Perbedaan antara demo teknologi dan game terletak pada pengalaman bermainnya. Setelah gameplay loop inti berfungsi, gunakan iterasi Anda untuk hal-hal yang benar-benar diperhatikan pemain: kontrol yang responsif, umpan balik yang jelas ketika sesuatu terjadi, tujuan yang terlihat, serta kondisi menang atau kalah. Minta layar judul, tombol mulai ulang, suara untuk aksi penting, dan kurva tingkat kesulitan. Sentuhan-sentuhan kecil inilah yang membuat sebuah game terasa selesai.</p>
<h2 id="langkah-6-terbitkan-dan-bagikan" tabindex="-1">Langkah 6: Terbitkan dan bagikan <a class="header-anchor" href="#langkah-6-terbitkan-dan-bagikan" aria-label="Permalink to &quot;Langkah 6: Terbitkan dan bagikan&quot;"></a></h2>
<p>Setelah game dapat dimainkan, terbitkan. Alat berbasis browser menyediakan tautan yang dapat dibagikan hanya dengan sekali klik, dan ini merupakan cara tercepat untuk memperoleh masukan. Bagikan kepada teman, posting di tempat audiens Anda berkumpul, lalu perhatikan bagian mana yang membuat pemain kesulitan atau berhenti bermain. Masukan tersebut menjadi bahan untuk putaran iterasi berikutnya. Jika ingin melangkah lebih jauh, <a href="/id/guides/itch-io-launch-guide.html">panduan peluncuran di itch.io</a> kami membahas cara mendistribusikan game web kepada audiens yang lebih luas.</p>
<h2 id="kiat-agar-pembuatan-game-dengan-ai-berhasil" tabindex="-1">Kiat agar pembuatan game dengan AI berhasil <a class="header-anchor" href="#kiat-agar-pembuatan-game-dengan-ai-berhasil" aria-label="Permalink to &quot;Kiat agar pembuatan game dengan AI berhasil&quot;"></a></h2>
<ul>
<li><strong>Mulai dari yang kecil, lalu kembangkan.</strong> Rilis game kecil yang lengkap sebelum menambahkan fitur. Game kecil yang selesai lebih baik daripada game besar yang tidak selesai.</li>
<li><strong>Lakukan satu perubahan dalam satu waktu.</strong> Permintaan yang digabungkan dapat membingungkan AI dan menyulitkan Anda mengetahui perubahan mana yang berhasil.</li>
<li><strong>Jelaskan hasilnya, bukan implementasinya.</strong> Katakan &quot;lompatannya terasa terlalu melayang, buat lebih sigap,&quot; bukan &quot;atur gravitasi menjadi 20.&quot;</li>
<li><strong>Simpan versi yang sudah terbukti berfungsi.</strong> Sebelum membuat perubahan besar, catat bahwa kondisi saat ini berfungsi agar Anda dapat kembali ke versi tersebut.</li>
<li><strong>Gunakan AI untuk bagian yang membosankan.</strong> Biarkan AI menangani pekerjaan teknis standar dan berbagai variasi agar Anda dapat menghabiskan waktu untuk keputusan yang membuat game terasa khas.</li>
</ul>
<h2 id="hal-yang-dikuasai-ai-dan-yang-tidak" tabindex="-1">Hal yang dikuasai AI dan yang tidak <a class="header-anchor" href="#hal-yang-dikuasai-ai-dan-yang-tidak" aria-label="Permalink to &quot;Hal yang dikuasai AI dan yang tidak&quot;"></a></h2>
<p>AI benar-benar unggul dalam mengubah ide kosong menjadi prototipe yang dapat dimainkan dengan cepat, menghasilkan aset sementara maupun aset final, serta menangani mekanisme teknis sebuah game. AI lebih lemah dalam desain besar yang sarat sistem, penyeimbangan terperinci, dan segala sesuatu yang membutuhkan visi jangka panjang yang konsisten—hal-hal tersebut tetap menjadi tugas Anda. Ekspektasi realistis pada 2026: AI memadatkan pekerjaan persiapan selama akhir pekan menjadi satu sore, dan hasil yang paling andal cenderung ditemukan pada game kecil hingga menengah, bukan game berskala sangat luas.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bisakah-saya-benar-benar-membuat-game-tanpa-pengalaman-coding" tabindex="-1">Bisakah saya benar-benar membuat game tanpa pengalaman coding? <a class="header-anchor" href="#bisakah-saya-benar-benar-membuat-game-tanpa-pengalaman-coding" aria-label="Permalink to &quot;Bisakah saya benar-benar membuat game tanpa pengalaman coding?&quot;"></a></h3>
<p>Ya. Alat pembuat game dari prompt pada 2026 menghasilkan kode, aset visual, dan logika untuk Anda berdasarkan deskripsi dalam bahasa sehari-hari. Dengan demikian, Anda dapat membuat dan menerbitkan game yang dapat dimainkan tanpa menulis atau membaca kode apa pun. Anda mengarahkan pembuatan game dengan menjelaskan keinginan Anda dan menyempurnakan hasilnya.</p>
<h3 id="berapa-lama-waktu-yang-dibutuhkan-untuk-membuat-game-dengan-ai" tabindex="-1">Berapa lama waktu yang dibutuhkan untuk membuat game dengan AI? <a class="header-anchor" href="#berapa-lama-waktu-yang-dibutuhkan-untuk-membuat-game-dengan-ai" aria-label="Permalink to &quot;Berapa lama waktu yang dibutuhkan untuk membuat game dengan AI?&quot;"></a></h3>
<p>Game sederhana yang dapat dimainkan bisa dibuat dalam hitungan menit hingga satu jam. Game kecil yang telah disempurnakan, lengkap dengan aset visual, suara, menu, dan kurva tingkat kesulitan, biasanya membutuhkan iterasi selama satu sore hingga satu akhir pekan. Game yang lebih besar atau kompleks tetap membutuhkan waktu lebih lama karena pekerjaannya bergeser dari persiapan ke desain dan penyempurnaan.</p>
<h3 id="jenis-game-apa-yang-dapat-dibuat-ai" tabindex="-1">Jenis game apa yang dapat dibuat AI? <a class="header-anchor" href="#jenis-game-apa-yang-dapat-dibuat-ai" aria-label="Permalink to &quot;Jenis game apa yang dapat dibuat AI?&quot;"></a></h3>
<p>AI paling baik dalam menangani game kecil dan kasual: platformer, endless runner, arcade shooter, puzzle, balapan, survival, dan simulasi santai. Alat berbasis browser dapat membuat game 2D maupun 3D, meskipun 2D cenderung lebih andal. Game besar yang sarat sistem, seperti RPG berskala besar atau game strategi, masih sulit dihasilkan dengan rapi dan membutuhkan banyak arahan manusia.</p>
<h3 id="apakah-saya-harus-membayar-untuk-membuat-game-dengan-ai" tabindex="-1">Apakah saya harus membayar untuk membuat game dengan AI? <a class="header-anchor" href="#apakah-saya-harus-membayar-untuk-membuat-game-dengan-ai" aria-label="Permalink to &quot;Apakah saya harus membayar untuk membuat game dengan AI?&quot;"></a></h3>
<p>Sebagian besar alat memiliki paket gratis yang cukup untuk membuat dan mencoba sebuah game. Biasanya Anda perlu membayar jika menginginkan pembuatan konten yang lebih intensif, hak komersial, atau fitur ekspor. <a href="/id/guides/ai-game-generators-2026.html">Perbandingan generator game AI</a> kami mencantumkan paket gratis dan harganya secara berdampingan.</p>
<h3 id="bisakah-saya-menjual-game-yang-dibuat-dengan-ai" tabindex="-1">Bisakah saya menjual game yang dibuat dengan AI? <a class="header-anchor" href="#bisakah-saya-menjual-game-yang-dibuat-dengan-ai" aria-label="Permalink to &quot;Bisakah saya menjual game yang dibuat dengan AI?&quot;"></a></h3>
<p>Sering kali bisa, tetapi periksa dua hal: ketentuan komersial alat tersebut—sebagian hanya mengizinkan penggunaan komersial melalui paket berbayar—dan lisensi aset yang dihasilkan atau diimpor. Banyak platform juga mewajibkan Anda mengungkapkan penggunaan konten buatan AI. Gunakan aset CC0 dan paket komersial dari alat tersebut agar tetap aman.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-game-generators-2026.html">Generator Game AI Terbaik pada 2026</a> — pilih alat yang tepat terlebih dahulu</li>
<li><a href="/id/guides/3d-browser-game-without-coding.html">Cara Membuat Game Browser 3D Tanpa Coding</a> — panduan langkah demi langkah khusus 3D</li>
<li><a href="/id/guides/vibe-coding-games.html">Vibe Coding untuk Game: Pengertian dan Cara Memulainya</a> — pola pikir di balik proses pembuatan berbasis prompt</li>
<li><a href="/id/guides/vibe-coding-game-prompts.html">Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — titik awal</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — aset visual dan audio untuk game Anda</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — mendapatkan pemain</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/make-a-game-with-ai-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Membuat Game Browser Multipemain (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/multiplayer-browser-game</link>
            <guid>https://app.cinevva.com/id/guides/multiplayer-browser-game</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara membuat game browser multipemain pada 2026, mulai dari WebSockets vs WebRTC hingga alat terbaik (Colyseus, PartyKit, Playroom), dasar-dasar netcode, dan stack untuk pemula.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-membuat-game-browser-multipemain-2026" tabindex="-1">Cara Membuat Game Browser Multipemain (2026) <a class="header-anchor" href="#cara-membuat-game-browser-multipemain-2026" aria-label="Permalink to &quot;Cara Membuat Game Browser Multipemain (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Multipemain adalah fitur yang dapat membuat game kecil menyebar luas, dan pada 2026 Anda bisa menambahkannya ke game browser tanpa mengelola pusat data sendiri. Bagian tersulitnya bukan menghubungkan pemain, melainkan menjaga game tetap tersinkronisasi dan adil. Panduan ini membahas pilihan yang penting (transport, model server, netcode) dan alat yang membuatnya lebih mudah dikelola, lalu memberikan stack awal yang masuk akal.</p>
<p><strong>Pilihan standar pada 2026 untuk game browser multipemain adalah WebSockets dengan server otoritatif, menggunakan framework seperti Colyseus atau PartyKit untuk menangani room dan sinkronisasi state, serta menggunakan WebRTC hanya ketika Anda benar-benar membutuhkan koneksi peer-to-peer.</strong></p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/s4lcuCTO2K8" title="Menyiapkan Server Game Multipemain dengan Colyseus & Phaser 3 — ourcade" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">ourcade menunjukkan proses pembuatan server multipemain dengan Colyseus dan Phaser.</div>
<h2 id="pertama-tentukan-cakupannya-secara-realistis" tabindex="-1">Pertama, tentukan cakupannya secara realistis <a class="header-anchor" href="#pertama-tentukan-cakupannya-secara-realistis" aria-label="Permalink to &quot;Pertama, tentukan cakupannya secara realistis&quot;"></a></h2>
<p>Tingkat kesulitan multipemain meningkat drastis seiring bertambahnya kecepatan dan tingkat kompetitif game Anda.</p>
<ul>
<li><strong>Mudah:</strong> game berbasis giliran (kartu, permainan papan), room kecil berisi 2–8 pemain, kursor bersama, lobi, chat, dan co-op kasual. WebSockets biasa atau alat tanpa backend sudah cukup.</li>
<li><strong>Sulit:</strong> aksi real-time cepat (shooter, pergerakan ala .io), banyak pemain serentak, dan game kompetitif apa pun yang rentan terhadap kecurangan. Game seperti ini membutuhkan server otoritatif, prediksi, dan netcode yang dirancang dengan cermat.</li>
</ul>
<p>Mulailah dari kategori mudah. Game berbasis giliran atau game dengan room kecil yang berfungsi baik akan mengajarkan seluruh alurnya sebelum Anda menangani masalah yang lebih sulit.</p>
<h2 id="transport-cara-data-dikirim" tabindex="-1">Transport: cara data dikirim <a class="header-anchor" href="#transport-cara-data-dikirim" aria-label="Permalink to &quot;Transport: cara data dikirim&quot;"></a></h2>
<ul>
<li><strong>WebSockets</strong> adalah pilihan standar yang praktis. Berbasis TCP, dua arah, matang, dan didukung di mana-mana. Satu kelemahannya adalah head-of-line blocking: paket yang hilang akan menahan semua paket di belakangnya, sehingga mengganggu game aksi cepat. Untuk sebagian besar game, gunakan WebSockets saat merilisnya.</li>
<li><strong>WebRTC</strong> menyediakan kanal data seperti UDP (tanpa head-of-line blocking), cocok untuk aksi cepat atau peer-to-peer, tetapi penyiapannya jauh lebih rumit (signaling, STUN/TURN). Gunakan hanya ketika Anda memerlukan P2P atau harus menghindari server relai.</li>
<li><strong>WebTransport</strong> adalah opsi yang lebih baru (HTTP/3 + QUIC) dengan datagram bergaya UDP. Teknologi ini menjadi arah perkembangan berikutnya, tetapi dukungan browser masih belum stabil pada 2026, sehingga belum aman dijadikan satu-satunya transport bagi pemula yang ingin merilis game sekarang.</li>
</ul>
<p>Patokan sederhananya: WebSockets untuk merilis sekarang, WebTransport nanti jika dibutuhkan, dan WebRTC untuk P2P atau media.</p>
<h2 id="model-server-siapa-yang-menentukan-apa-yang-terjadi" tabindex="-1">Model server: siapa yang menentukan apa yang terjadi <a class="header-anchor" href="#model-server-siapa-yang-menentukan-apa-yang-terjadi" aria-label="Permalink to &quot;Model server: siapa yang menentukan apa yang terjadi&quot;"></a></h2>
<ul>
<li><strong>Server otoritatif:</strong> klien mengirim input, server menjalankan simulasi dan menyiarkan hasilnya. Ini adalah standar untuk game kompetitif karena server menjadi batas anti-cheat alami; Anda tidak pernah memercayai klien.</li>
<li><strong>Peer-to-peer:</strong> lebih murah untuk dijalankan, tetapi kecurangan sulit dicegah dan konektivitasnya rapuh. Cocok untuk co-op kasual dan lobi kecil dengan pemain tepercaya.</li>
</ul>
<p>Bahkan untuk game kecil, server otoritatif membuat &quot;sumber kebenaran&quot; Anda tetap sederhana. Sebagian besar alat di bawah ini menggunakan model tersebut secara default.</p>
<h2 id="dasar-dasar-netcode-hanya-ketika-anda-membutuhkannya" tabindex="-1">Dasar-dasar netcode (hanya ketika Anda membutuhkannya) <a class="header-anchor" href="#dasar-dasar-netcode-hanya-ketika-anda-membutuhkannya" aria-label="Permalink to &quot;Dasar-dasar netcode (hanya ketika Anda membutuhkannya)&quot;"></a></h2>
<p>Untuk game real-time cepat, sinkronisasi state mentah akan terasa lambat. Solusi standarnya, yang dijelaskan dengan baik dalam seri klasik Gabriel Gambetta, adalah:</p>
<ul>
<li><strong>Prediksi sisi klien:</strong> klien langsung menerapkan input Anda alih-alih menunggu perjalanan pulang-pergi ke server, sehingga pergerakan terasa instan.</li>
<li><strong>Rekonsiliasi server:</strong> ketika state otoritatif diterima, klien menerapkan kembali input yang masih tertunda untuk memperbaiki penyimpangan.</li>
<li><strong>Interpolasi entitas:</strong> tampilkan pemain lain sedikit di masa lalu, di antara state yang diketahui, agar gerakan mereka terlihat mulus.</li>
<li><strong>Kompensasi lag:</strong> server memundurkan simulasi ke posisi target ketika tembakan dilepaskan, sehingga hit diputuskan secara adil.</li>
</ul>
<p>Jangan membuat semua ini sejak awal. Tambahkan hanya ketika pergerakan benar-benar terasa buruk, yang tidak akan terjadi pada game berbasis giliran atau game lambat.</p>
<h2 id="lanskap-alat-pada-2026" tabindex="-1">Lanskap alat pada 2026 <a class="header-anchor" href="#lanskap-alat-pada-2026" aria-label="Permalink to &quot;Lanskap alat pada 2026&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Kegunaannya</th>
<th>Sumber terbuka</th>
<th>Hosting</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Socket.IO</strong></td>
<td>Library WebSocket; Anda menulis logika gamenya. Cocok untuk belajar dan room kecil.</td>
<td>Ya (MIT)</td>
<td>Hosting mandiri</td>
</tr>
<tr>
<td><strong>Colyseus</strong></td>
<td>Framework server game otoritatif: room, matchmaking, dan sinkronisasi state otomatis.</td>
<td>Ya (MIT)</td>
<td>Hosting mandiri gratis; Cloud mulai sekitar $15/bulan</td>
</tr>
<tr>
<td><strong>Playroom</strong></td>
<td>Room tanpa backend yang dapat dimasuki, presence, dan matchmaking kasual. Jalur tercepat untuk game kasual.</td>
<td>SDK</td>
<td>Terkelola</td>
</tr>
<tr>
<td><strong>PartyKit</strong></td>
<td>Room real-time di edge Cloudflare (sekarang menjadi bagian dari Cloudflare).</td>
<td>Ya</td>
<td>Cloudflare berbasis penggunaan</td>
</tr>
<tr>
<td><strong>Cloudflare Durable Objects</strong></td>
<td>Primitif stateful per room tingkat rendah yang menjadi dasar PartyKit.</td>
<td>Platform</td>
<td>Cloudflare berbasis penggunaan</td>
</tr>
<tr>
<td><strong>geckos.io</strong></td>
<td>Klien/server seperti UDP melalui WebRTC, untuk game aksi cepat.</td>
<td>Ya</td>
<td>Hosting mandiri</td>
</tr>
<tr>
<td><strong>Nakama</strong></td>
<td>Backend sumber terbuka lengkap: real-time, matchmaking, papan peringkat, dan chat.</td>
<td>Ya (Apache-2.0)</td>
<td>Hosting mandiri; cloud terkelola</td>
</tr>
<tr>
<td><strong>Photon</strong></td>
<td>Jaringan real-time komersial yang matang dan berfokus pada Unity.</td>
<td>Tidak</td>
<td>100 CCU gratis; paket berbayar</td>
</tr>
<tr>
<td><strong>Supabase Realtime</strong></td>
<td>Broadcast + presence melalui WebSockets untuk sinkronisasi ringan dan lobi.</td>
<td>Ya</td>
<td>Termasuk dalam paket Supabase</td>
</tr>
</tbody>
</table>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/DbaBeLDU-oY" title="Membuat aplikasi web multipemain real-time — CodeTV" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Pembuatan pengalaman multipemain real-time menggunakan PartyKit di edge.</div>
<h2 id="stack-yang-direkomendasikan-untuk-pemula" tabindex="-1">Stack yang direkomendasikan untuk pemula <a class="header-anchor" href="#stack-yang-direkomendasikan-untuk-pemula" aria-label="Permalink to &quot;Stack yang direkomendasikan untuk pemula&quot;"></a></h2>
<p>Untuk game browser real-time kecil pada 2026:</p>
<ul>
<li><strong>Transport:</strong> WebSockets (kompatibilitas yang siap digunakan sekarang).</li>
<li><strong>Model server:</strong> otoritatif, bahkan untuk game kecil, agar penanganan kecurangan dan &quot;sumber kebenaran&quot; tetap sederhana.</li>
<li><strong>Framework:</strong> Colyseus. Framework ini berlisensi MIT, gratis untuk di-host sendiri, serta langsung menyediakan room, matchmaking, dan sinkronisasi state otomatis, dengan cloud terkelola (mulai sekitar $15/bulan) jika Anda tidak ingin menjalankan server sendiri. Jika Anda menginginkan solusi tanpa backend untuk game kasual, Playroom adalah opsi yang bahkan lebih cepat; jika Anda sudah menggunakan Cloudflare, PartyKit atau Durable Objects akan cocok secara alami.</li>
<li><strong>Netcode:</strong> mulailah tanpa prediksi. Tambahkan prediksi dan interpolasi ala Gambetta hanya setelah pergerakan terasa lambat.</li>
</ul>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-cara-termudah-untuk-membuat-game-browser-multipemain" tabindex="-1">Apa cara termudah untuk membuat game browser multipemain? <a class="header-anchor" href="#apa-cara-termudah-untuk-membuat-game-browser-multipemain" aria-label="Permalink to &quot;Apa cara termudah untuk membuat game browser multipemain?&quot;"></a></h3>
<p>Mulailah dengan game berbasis giliran atau game dengan room kecil menggunakan WebSockets, melalui framework seperti Colyseus atau alat tanpa backend seperti Playroom. Alat-alat ini menangani room, proses bergabung, dan sinkronisasi state untuk Anda, sehingga Anda dapat merilis game multipemain yang berfungsi tanpa membuat netcode atau menjalankan server sendiri. Tunda aksi real-time cepat sampai Anda berhasil merilis sesuatu yang lebih sederhana.</p>
<h3 id="haruskah-saya-menggunakan-websockets-atau-webrtc-untuk-game-saya" tabindex="-1">Haruskah saya menggunakan WebSockets atau WebRTC untuk game saya? <a class="header-anchor" href="#haruskah-saya-menggunakan-websockets-atau-webrtc-untuk-game-saya" aria-label="Permalink to &quot;Haruskah saya menggunakan WebSockets atau WebRTC untuk game saya?&quot;"></a></h3>
<p>Gunakan WebSockets untuk sebagian besar game: teknologinya sederhana, matang, dan didukung di mana-mana. Gunakan WebRTC hanya jika Anda memerlukan koneksi peer-to-peer atau latensi serendah mungkin untuk aksi cepat, karena penyiapannya jauh lebih rumit. WebTransport adalah opsi masa depan yang menjanjikan, tetapi dukungan browsernya masih belum stabil pada 2026.</p>
<h3 id="apakah-saya-memerlukan-server-sendiri-untuk-multipemain" tabindex="-1">Apakah saya memerlukan server sendiri untuk multipemain? <a class="header-anchor" href="#apakah-saya-memerlukan-server-sendiri-untuk-multipemain" aria-label="Permalink to &quot;Apakah saya memerlukan server sendiri untuk multipemain?&quot;"></a></h3>
<p>Tidak selalu. Alat terkelola seperti Colyseus Cloud, Playroom, PartyKit, dan Photon meng-host bagian real-time untuk Anda. Anda juga dapat meng-host sendiri framework sumber terbuka seperti Colyseus atau Nakama jika menginginkan kendali penuh. Untuk game kecil, layanan terkelola adalah jalur tercepat dan sering kali gratis atau murah untuk memulai.</p>
<h3 id="bagaimana-cara-menghentikan-kecurangan-dalam-game-multipemain" tabindex="-1">Bagaimana cara menghentikan kecurangan dalam game multipemain? <a class="header-anchor" href="#bagaimana-cara-menghentikan-kecurangan-dalam-game-multipemain" aria-label="Permalink to &quot;Bagaimana cara menghentikan kecurangan dalam game multipemain?&quot;"></a></h3>
<p>Gunakan server otoritatif: klien hanya mengirim input mereka, sedangkan server menentukan apa yang benar-benar terjadi dengan memvalidasi semuanya. Jangan pernah memercayai klien untuk menentukan hasil game. Inilah alasan framework seperti Colyseus, Nakama, dan Photon menggunakan model server otoritatif secara default, khususnya untuk game kompetitif.</p>
<BuildCta
  title="Mulailah dengan inti pemain tunggal"
  desc="Sempurnakan sensasi bermain melawan bot sebelum menambahkan netcode."
  prompt="Buat game arena shooter tempat saya melawan gelombang bot AI" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — engine yang menjalankan game multipemain Anda</li>
<li><a href="/id/guides/best-free-game-engines-beginners.html">Engine Game Gratis Terbaik untuk Pemula</a> — tempat untuk memulai</li>
<li><a href="/id/tutorials/websocket-multiplayer-basics.html">Dasar-dasar multipemain WebSocket</a> — pengantar praktis</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Merilis Game Anda di itch.io</a> — menerbitkan game multipemain Anda</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/multiplayer-browser-game-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Phaser vs Defold: Perbandingan Engine Game Web 2D Terbaik (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/phaser-vs-defold</link>
            <guid>https://app.cinevva.com/id/guides/phaser-vs-defold</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Phaser vs Defold pada 2026 untuk game web 2D, dibandingkan berdasarkan ukuran build, waktu pemuatan, bahasa, alur kerja, dan biaya agar Anda dapat memilih engine 2D yang tepat untuk browser.]]></description>
            <content:encoded><![CDATA[<h1 id="phaser-vs-defold-perbandingan-engine-game-web-2d-terbaik-2026" tabindex="-1">Phaser vs Defold: Perbandingan Engine Game Web 2D Terbaik (2026) <a class="header-anchor" href="#phaser-vs-defold-perbandingan-engine-game-web-2d-terbaik-2026" aria-label="Permalink to &quot;Phaser vs Defold: Perbandingan Engine Game Web 2D Terbaik (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Untuk game 2D di browser, ada dua engine yang unggul dalam aspek berbeda: Phaser, framework HTML5 terpopuler, dan Defold, engine dengan build web terkecil dan paling cepat dimuat. Keduanya cocok untuk pengembang yang berbeda. Berikut perbandingannya pada 2026 untuk membantu Anda memilih.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/3nfs6MNTNDo" title="Perbandingan engine game Defold — GameFromScratch" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">GameFromScratch membandingkan Defold secara langsung dengan engine lain.</div>
<h2 id="kesimpulan-singkat" tabindex="-1">Kesimpulan singkat <a class="header-anchor" href="#kesimpulan-singkat" aria-label="Permalink to &quot;Kesimpulan singkat&quot;"></a></h2>
<ul>
<li><strong>Build web terkecil dan paling cepat dimuat serta editor lengkap yang matang:</strong> Defold.</li>
<li><strong>Komunitas terbesar, tutorial terbanyak, dan framework JavaScript yang mengutamakan kode:</strong> Phaser.</li>
</ul>
<p>Keduanya gratis. Pilihan sebenarnya bergantung pada alur kerja (editor visual vs framework kode), bahasa (Lua vs JavaScript), serta seberapa penting waktu pemuatan dan komunitas bagi Anda.</p>
<h2 id="perbandingan" tabindex="-1">Perbandingan <a class="header-anchor" href="#perbandingan" aria-label="Permalink to &quot;Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Phaser (4)</th>
<th>Defold</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis</strong></td>
<td>Framework game JS/TS</td>
<td>Engine lengkap + editor</td>
</tr>
<tr>
<td><strong>Bahasa</strong></td>
<td>JavaScript / TypeScript</td>
<td>Lua</td>
</tr>
<tr>
<td><strong>Teknologi web</strong></td>
<td>WebGL2 / Canvas</td>
<td>WebAssembly + WebGL</td>
</tr>
<tr>
<td><strong>Ukuran build kosong</strong></td>
<td>~500 KB (framework)</td>
<td>~1,14 MB (build lengkap)</td>
</tr>
<tr>
<td><strong>Editor</strong></td>
<td>Gunakan editor pilihan Anda sendiri (kode)</td>
<td>Bawaan, serba lengkap</td>
</tr>
<tr>
<td><strong>Komunitas</strong></td>
<td>Terbesar di kalangan game HTML5</td>
<td>Lebih kecil tetapi aktif</td>
</tr>
<tr>
<td><strong>Publikasi</strong></td>
<td>Manual / milik Anda sendiri</td>
<td>Bawaan (Poki dan lainnya)</td>
</tr>
<tr>
<td><strong>Lisensi / biaya</strong></td>
<td>Gratis (MIT)</td>
<td>Gratis, tanpa royalti</td>
</tr>
<tr>
<td><strong>3D</strong></td>
<td>Tidak (2D)</td>
<td>Utamanya 2D, sedang menambahkan 3D</td>
</tr>
</tbody>
</table>
<h2 id="phaser-4" tabindex="-1">Phaser 4 <a class="header-anchor" href="#phaser-4" aria-label="Permalink to &quot;Phaser 4&quot;"></a></h2>
<p>Phaser adalah framework game HTML5 terpopuler, dan versi stabil 4.0 dirilis pada April 2026 (segera disusul rilis minor seperti 4.2). Versi ini merupakan penulisan ulang menyeluruh renderer WebGL2 dengan arsitektur baru berbasis node, sembari mempertahankan API v3 yang sudah dikenal. Anda menulis JavaScript atau TypeScript dan langsung mendapatkan fisika, input, audio, scene, serta pemuatan aset. Framework-nya sendiri berukuran kecil (~500 KB), meskipun ukuran akhir bergantung pada aset Anda. Keunggulan utamanya adalah komunitas yang sangat besar, tutorial dan contoh yang melimpah, serta kebebasan menulis kode web standar yang sepenuhnya Anda kendalikan. Perlu diperhatikan bahwa Phaser 4 adalah engine WebGL2, bukan WebGPU; WebGPU masih berupa fondasi untuk masa depan, bukan fitur yang sudah tersedia.</p>
<h2 id="defold" tabindex="-1">Defold <a class="header-anchor" href="#defold" aria-label="Permalink to &quot;Defold&quot;"></a></h2>
<p>Defold, yang awalnya dikembangkan oleh King (Candy Crush), dirancang untuk game web berukuran kecil dan cepat dimuat. Build HTML5 kosongnya berukuran sekitar 1,14 MB dan menggunakan WebAssembly secara default, menjadikannya salah satu engine dengan waktu pemuatan tercepat dalam berbagai studi terhadap game web populer. Defold hadir sebagai paket lengkap: editor bawaan, alat scene, dan publikasi sekali klik ke platform seperti Poki. Rilis stabil terbarunya adalah 1.13.0 (Juni 2026), yang menghapus target asm.js lama sehingga build web hanya menggunakan Wasm. Defold juga gratis tanpa royalti. Kekurangannya adalah komunitas yang lebih kecil dibandingkan Phaser serta adanya kurva pembelajaran untuk skrip Lua dan model komponen Defold. Engine ini terutama ditujukan untuk 2D, meskipun fitur 3D terus dikembangkan secara aktif.</p>
<h2 id="cara-memilih" tabindex="-1">Cara memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara memilih&quot;"></a></h2>
<p>Jika Anda sudah menguasai JavaScript, menginginkan pilihan tutorial dan bantuan terbanyak, serta suka merangkai toolchain sendiri, pilih Phaser. Jika Anda menginginkan build terkecil dan paling cepat dimuat, editor lengkap yang matang, serta fitur publikasi bawaan, dan tidak keberatan mempelajari Lua, pilih Defold. Untuk game web seluler yang sangat bergantung pada waktu pemuatan, Defold memiliki keunggulan nyata; untuk pembelajaran dan dukungan komunitas, Phaser sulit dikalahkan.</p>
<p>Ingin melihat pilihan yang lebih luas, termasuk PixiJS, Construct, dan GDevelop? Lihat <a href="/id/guides/best-2d-game-engines-2026.html">engine game 2D terbaik untuk 2026</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-phaser-atau-defold-lebih-baik-untuk-game-web-2d" tabindex="-1">Apakah Phaser atau Defold lebih baik untuk game web 2D? <a class="header-anchor" href="#apakah-phaser-atau-defold-lebih-baik-untuk-game-web-2d" aria-label="Permalink to &quot;Apakah Phaser atau Defold lebih baik untuk game web 2D?&quot;"></a></h3>
<p>Keduanya sangat baik, tetapi cocok untuk pengembang yang berbeda. Phaser adalah framework JavaScript yang mengutamakan kode, dengan komunitas terbesar dan materi pembelajaran terbanyak. Defold adalah engine lengkap dengan editor bawaan serta build web terkecil dan paling cepat dimuat. Pilih Phaser untuk komunitas dan JavaScript, atau Defold untuk waktu pemuatan dan alur kerja serba lengkap.</p>
<h3 id="mana-yang-memiliki-build-web-lebih-kecil-dan-lebih-cepat-dimuat" tabindex="-1">Mana yang memiliki build web lebih kecil dan lebih cepat dimuat? <a class="header-anchor" href="#mana-yang-memiliki-build-web-lebih-kecil-dan-lebih-cepat-dimuat" aria-label="Permalink to &quot;Mana yang memiliki build web lebih kecil dan lebih cepat dimuat?&quot;"></a></h3>
<p>Defold. Build HTML5 kosongnya berukuran sekitar 1,14 MB dan menggunakan WebAssembly, menjadikannya salah satu engine dengan waktu pemuatan tercepat untuk game web. Framework Phaser berukuran sekitar 500 KB, tetapi Phaser adalah framework, bukan build lengkap, dan ukuran sebenarnya sangat bergantung pada aset Anda sendiri. Untuk game yang sensitif terhadap waktu pemuatan, Defold lebih unggul.</p>
<h3 id="apakah-phaser-dan-defold-mendukung-webgpu" tabindex="-1">Apakah Phaser dan Defold mendukung WebGPU? <a class="header-anchor" href="#apakah-phaser-dan-defold-mendukung-webgpu" aria-label="Permalink to &quot;Apakah Phaser dan Defold mendukung WebGPU?&quot;"></a></h3>
<p>Belum sebagai fitur yang tersedia pada 2026. Phaser 4 merupakan penulisan ulang berbasis WebGL2, sedangkan WebGPU masih sebatas fondasi untuk pengembangan mendatang. Backend HTML5 Defold menggunakan WebGL, dengan pengembangan WebGPU yang masih eksperimental. Untuk game 2D, hal ini jarang menjadi masalah; WebGL2 lebih dari cukup untuk rendering 2D pada umumnya.</p>
<h3 id="apakah-phaser-dan-defold-gratis-untuk-game-komersial" tabindex="-1">Apakah Phaser dan Defold gratis untuk game komersial? <a class="header-anchor" href="#apakah-phaser-dan-defold-gratis-untuk-game-komersial" aria-label="Permalink to &quot;Apakah Phaser dan Defold gratis untuk game komersial?&quot;"></a></h3>
<p>Ya. Phaser tersedia gratis di bawah lisensi MIT, sedangkan Defold gratis dan sumber terbuka tanpa royalti atau ambang batas pendapatan. Keduanya tidak memungut biaya untuk merilis game komersial, meskipun Phaser menjual produk editor opsional secara terpisah.</p>
<BuildCta
  title="Uji ide 2D Anda sebelum berkomitmen"
  desc="Satu prompt, satu draf yang dapat dimainkan, tanpa kode boilerplate."
  prompt="Buat game tembak-menembak luar angkasa 2D dengan gelombang musuh dan power-up" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — pilihan lengkap engine 2D</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — 2D dan 3D sekaligus</li>
<li><a href="/id/guides/best-free-game-engines-beginners.html">Engine Game Gratis Terbaik untuk Pemula</a> — tempat untuk memulai</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — menerbitkan game 2D yang sudah selesai</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/phaser-vs-defold-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Mempromosikan Game Indie Tanpa Anggaran (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/promote-indie-game-no-budget</link>
            <guid>https://app.cinevva.com/id/guides/promote-indie-game-no-budget</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Panduan praktis tahun 2026 untuk memasarkan game indie tanpa anggaran, mulai dari wishlist dan halaman Steam hingga video pendek, devlog, komunitas, dan pendekatan kepada streamer.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-mempromosikan-game-indie-tanpa-anggaran-2026" tabindex="-1">Cara Mempromosikan Game Indie Tanpa Anggaran (2026) <a class="header-anchor" href="#cara-mempromosikan-game-indie-tanpa-anggaran-2026" aria-label="Permalink to &quot;Cara Mempromosikan Game Indie Tanpa Anggaran (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Anda tidak memerlukan uang untuk iklan guna memasarkan sebuah game. Anda membutuhkan waktu, daya tarik yang jelas, dan harus memulai sejak dini. Kenyataan pahit pada 2026 adalah bahwa masalahnya terletak pada penemuan, bukan permintaan: sekitar 19.000 game dirilis di Steam pada 2024, dan sebagian besar tidak pernah mencapai penjualan yang berarti. Kabar baiknya, kanal yang efektif bagi developer indie sebagian besar gratis. Berikut cara memanfaatkannya.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/kpb2Ab8x7Zg" title="Mengapa wishlist sangat penting bagi developer indie? (bersama Chris Zukowski)" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Mengapa wishlist penting, bersama pakar pemasaran Chris Zukowski.</div>
<h2 id="mulailah-dengan-halaman-steam-jika-game-anda-tersedia-di-steam" tabindex="-1">Mulailah dengan halaman Steam (jika game Anda tersedia di Steam) <a class="header-anchor" href="#mulailah-dengan-halaman-steam-jika-game-anda-tersedia-di-steam" aria-label="Permalink to &quot;Mulailah dengan halaman Steam (jika game Anda tersedia di Steam)&quot;"></a></h2>
<p>Jika game Anda akan hadir di Steam, langkah gratis paling berharga yang bisa dilakukan adalah memasang halaman &quot;Segera Hadir&quot; sejak dini. Game yang memasangnya enam bulan atau lebih sebelum peluncuran mencatat penjualan jauh lebih besar daripada game yang menunggu hingga bulan terakhir. Wishlist tidak kedaluwarsa, jadi halaman tersebut sebaiknya dipublikasikan segera setelah Anda memiliki beberapa tangkapan layar dan klip pendek.</p>
<p>Fungsi wishlist sebenarnya: setiap orang yang memasukkan game ke wishlist akan mendapat notifikasi saat peluncuran dan ketika ada diskon, sehingga daftar yang terkumpul dapat berubah menjadi lonjakan penjualan pada hari pertama. Wishlist juga menentukan tab &quot;Populer Mendatang&quot; pada minggu terakhir. Batas bawah kasar untuk peluncuran yang layak adalah sekitar 7.000 wishlist; itu bukan angka ajaib, tetapi menunjukkan bahwa game Anda termasuk rilisan teratas pada minggu tersebut. Lengkapi juga halaman toko Anda dengan benar: tag yang akurat (Steam mengategorikan game berdasarkan tag) dan dukungan untuk lebih banyak bahasa sama-sama meningkatkan frekuensi Steam menampilkan game Anda.</p>
<h3 id="siklus-demo-next-fest" tabindex="-1">Siklus demo Next Fest <a class="header-anchor" href="#siklus-demo-next-fest" aria-label="Permalink to &quot;Siklus demo Next Fest&quot;"></a></h3>
<p>Steam Next Fest adalah acara gratis terbesar untuk mengumpulkan wishlist, tetapi acara ini memperkuat audiens yang sudah ada, bukan menciptakannya dari nol. Jumlah wishlist yang Anda peroleh sangat dipengaruhi oleh jumlah wishlist yang sudah dimiliki saat masuk, jadi bangun audiens sebelum festival, lalu manfaatkan momentumnya. Tingkat konversi demo ke wishlist yang baik berkisar antara 16–20%.</p>
<h2 id="buat-game-yang-dapat-memasarkan-dirinya-sendiri" tabindex="-1">Buat game yang dapat memasarkan dirinya sendiri <a class="header-anchor" href="#buat-game-yang-dapat-memasarkan-dirinya-sendiri" aria-label="Permalink to &quot;Buat game yang dapat memasarkan dirinya sendiri&quot;"></a></h2>
<p>Keputusan pemasaran terbesar dibuat sebelum pemasaran apa pun dimulai: genre dan konsep game Anda. Game dengan konsep yang kuat dapat menarik perhatian sejak tangkapan layar pertama dan hanya membutuhkan satu atau dua kalimat untuk membuat orang tertarik. Jika Anda tidak dapat menunjukkan alasan game Anda menarik dalam beberapa detik pertama sebuah klip, orang akan langsung menggulir melewatinya. Jadi, utamakan daya tarik utama: trailer dan klip harus menampilkan bagian menarik dalam beberapa detik pertama, lalu menyajikan genre, daya tarik utama, dan konten—bukan sekadar daftar fitur.</p>
<h2 id="kanal-gratis-yang-efektif-pada-2026" tabindex="-1">Kanal gratis yang efektif pada 2026 <a class="header-anchor" href="#kanal-gratis-yang-efektif-pada-2026" aria-label="Permalink to &quot;Kanal gratis yang efektif pada 2026&quot;"></a></h2>
<ul>
<li><strong>Video pendek</strong> (TikTok, Reels, YouTube Shorts) adalah kanal gratis dengan potensi jangkauan terbesar karena algoritmanya mendorong klip kepada orang yang tidak mengikuti Anda, tidak seperti X yang jangkauan organiknya telah menyusut. Sebuah klip dapat jauh mengungguli sebuah tweet. Namun, perlu diakui bahwa jangkauan organik video pendek semakin sulit pada 2025–2026, jadi bersiaplah untuk mengunggah secara konsisten dan pertimbangkan YouTube Shorts sebagai opsi stabil yang juga efektif dalam menghasilkan klik.</li>
<li><strong>Devlog, trailer, GIF, ilustrasi kapsul:</strong> paparan berulang membangun keakraban yang kemudian berubah menjadi wishlist, sementara klip yang diunggah secara rutin juga menjadi pengujian gratis untuk mengetahui daya tarik mana yang paling efektif.</li>
<li><strong>Reddit:</strong> unggah ke subreddit yang relevan (r/IndieGaming, r/IndieDev, r/indiegames, r/playmygame, ditambah subreddit khusus sesuai niche), dan patuhi aturan kira-kira 10 banding 1—hanya sekitar satu dari sepuluh kiriman yang boleh mempromosikan game Anda secara langsung. Promosi diri yang terasa seperti spam dapat membuat Anda diblokir.</li>
<li><strong>Discord:</strong> sebuah server menjaga minat calon pemain, menyediakan penguji game, dan membangun komunitas inti yang akan hadir saat peluncuran.</li>
</ul>
<h2 id="media-dan-streamer-tanpa-anggaran" tabindex="-1">Media dan streamer tanpa anggaran <a class="header-anchor" href="#media-dan-streamer-tanpa-anggaran" aria-label="Permalink to &quot;Media dan streamer tanpa anggaran&quot;"></a></h2>
<p>Streamer dan YouTuber kini mendorong penemuan game indie secara lebih konsisten daripada media tradisional, dan beberapa kreator yang tepat dapat memberikan hasil lebih besar daripada seluruh pendekatan Anda kepada media. Mereka secara aktif mencari demo gratis. Ketepatan sasaran lebih penting daripada jangkauan: pilih kreator yang audiensnya sesuai dengan genre game Anda dan jelaskan alasan Anda memilih mereka.</p>
<p>Untuk media, buat proposal tetap singkat (sebagian besar jurnalis lebih menyukai kurang dari 200 kata), sertakan daya tarik utama, genre, tautan kit pers, trailer, serta key game, lalu sesuaikan pesannya untuk setiap penerima. Siapkan kit pers satu halaman berisi lembar fakta, tangkapan layar beresolusi tinggi, trailer, dan logo—setiap hambatan yang Anda hilangkan akan meningkatkan peluang keberhasilan. Kirim salinan ulasan sekitar dua minggu sebelum peluncuran dan berikan key kepada streamer sekitar satu minggu sebelumnya. Kesalahan pendekatan terbesar adalah tidak menindaklanjuti setelah seseorang menunjukkan minat sehingga Anda melewatkan kesempatan.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/gQBdIGaZROE" title="Cara agar peluncuran game indie Anda TIDAK berantakan. 30 kesalahan dalam 30 menit." frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Kesalahan umum dalam peluncuran game indie yang perlu dihindari.</div>
<h2 id="ekspektasi-yang-realistis" tabindex="-1">Ekspektasi yang realistis <a class="header-anchor" href="#ekspektasi-yang-realistis" aria-label="Permalink to &quot;Ekspektasi yang realistis&quot;"></a></h2>
<p>Patokan dasarnya memang suram: median pendapatan kotor game Steam yang dirilis pada 2024 hanya beberapa ratus dolar, dan sebagian besar pendapatan dikuasai oleh segelintir pemenang. Namun, itu adalah masalah penemuan, bukan permintaan—game indie kini menyumbang sekitar separuh pendapatan dan jumlah salinan yang terjual di Steam. Audiensnya sangat besar; tugas Anda adalah memastikan game mudah ditemukan. Kesalahan terbesar adalah mengembangkan game secara diam-diam dan baru mulai memasarkannya pada minggu terakhir. Berdiam diri sepenuhnya lebih berbahaya daripada menampilkan game yang belum sempurna.</p>
<p>Jika game Anda berjalan di browser, menerbitkannya secara gratis di portal seperti Poki dan CrazyGames merupakan langkah pemasaran tanpa anggaran, karena platform tersebut mendatangkan pemain yang jika tidak, harus Anda jangkau dengan biaya. Daftar di portal menempatkan game Anda di hadapan audiens yang sudah tersedia dan sedang mencari sesuatu untuk dimainkan, sehingga Anda memperoleh distribusi dan trafik tanpa mengeluarkan uang untuk iklan. Lihat <a href="/id/guides/publish-web-game.html">tempat menerbitkan game web</a> untuk membandingkan kelebihan dan kekurangan setiap platform serta <a href="/id/guides/web-game-monetization.html">monetisasi game web</a> untuk mengetahui potensi pendapatan sebenarnya dari jangkauan tersebut.</p>
<h2 id="linimasa-tanpa-anggaran" tabindex="-1">Linimasa tanpa anggaran <a class="header-anchor" href="#linimasa-tanpa-anggaran" aria-label="Permalink to &quot;Linimasa tanpa anggaran&quot;"></a></h2>
<ul>
<li><strong>6–12 bulan sebelumnya:</strong> publikasikan halaman &quot;Segera Hadir&quot; di Steam, mulai mengunggah klip dan devlog, serta mulai membangun komunitas Discord.</li>
<li><strong>3–6 bulan sebelumnya:</strong> unggah video pendek secara konsisten, kumpulkan wishlist, dan persiapkan Next Fest.</li>
<li><strong>4–6 minggu sebelumnya:</strong> hubungi media dan kreator, lalu selesaikan trailer dan kit pers.</li>
<li><strong>Minggu peluncuran:</strong> koordinasikan Reddit, media sosial, dan media pers pada pagi yang sama; berikan key kepada streamer satu minggu sebelumnya.</li>
</ul>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bagaimana-cara-memasarkan-game-indie-tanpa-uang" tabindex="-1">Bagaimana cara memasarkan game indie tanpa uang? <a class="header-anchor" href="#bagaimana-cara-memasarkan-game-indie-tanpa-uang" aria-label="Permalink to &quot;Bagaimana cara memasarkan game indie tanpa uang?&quot;"></a></h3>
<p>Mulailah sejak dini dan manfaatkan kanal gratis: buat halaman Steam beberapa bulan sebelumnya untuk mengumpulkan wishlist, unggah klip video pendek yang menampilkan daya tarik utama, tulis devlog, bagikan game di komunitas Reddit dan Discord yang relevan, serta hubungi streamer dan media kecil. Kuncinya adalah konsistensi dari waktu ke waktu dan daya tarik yang jelas serta cepat dipahami, bukan anggaran pemasaran.</p>
<h3 id="berapa-banyak-wishlist-yang-saya-perlukan-sebelum-meluncurkan-game-di-steam" tabindex="-1">Berapa banyak wishlist yang saya perlukan sebelum meluncurkan game di Steam? <a class="header-anchor" href="#berapa-banyak-wishlist-yang-saya-perlukan-sebelum-meluncurkan-game-di-steam" aria-label="Permalink to &quot;Berapa banyak wishlist yang saya perlukan sebelum meluncurkan game di Steam?&quot;"></a></h3>
<p>Tidak ada angka ajaib, tetapi batas bawah kasarnya sekitar 7.000, sementara 7.000–10.000 wishlist memberi Anda peluang untuk masuk tab Populer Mendatang. Semakin banyak semakin baik karena wishlist dapat berubah menjadi penjualan pada hari peluncuran melalui notifikasi. Intinya adalah menjadi salah satu rilisan teratas pada minggu tersebut, yang biasanya dicapai dengan membuat halaman dan memulai pemasaran sejak dini.</p>
<h3 id="apa-kanal-pemasaran-gratis-terbaik-untuk-game-indie-pada-2026" tabindex="-1">Apa kanal pemasaran gratis terbaik untuk game indie pada 2026? <a class="header-anchor" href="#apa-kanal-pemasaran-gratis-terbaik-untuk-game-indie-pada-2026" aria-label="Permalink to &quot;Apa kanal pemasaran gratis terbaik untuk game indie pada 2026?&quot;"></a></h3>
<p>Video pendek (TikTok, Reels, YouTube Shorts) yang menampilkan gameplay nyata, karena algoritmanya mendorong klip kepada orang yang belum mengikuti Anda, sehingga memberi jangkauan tanpa memerlukan audiens yang sudah ada. Streamer dan YouTuber juga memberikan dampak yang sangat besar. Jangkauan organik video pendek kini lebih sulit dibandingkan beberapa tahun lalu, jadi unggahlah secara konsisten alih-alih mengharapkan satu konten viral.</p>
<h3 id="apa-kesalahan-pemasaran-game-indie-terbesar" tabindex="-1">Apa kesalahan pemasaran game indie terbesar? <a class="header-anchor" href="#apa-kesalahan-pemasaran-game-indie-terbesar" aria-label="Permalink to &quot;Apa kesalahan pemasaran game indie terbesar?&quot;"></a></h3>
<p>Mengembangkan game secara diam-diam dan baru mulai memasarkannya pada minggu terakhir. Pemasaran membutuhkan waktu berbulan-bulan untuk mengumpulkan wishlist dan membangun audiens, sehingga game hebat yang diluncurkan tanpa wishlist, tanpa trailer, dan dengan halaman toko yang lemah akan tenggelam. Tampilkan game Anda sejak dini, meskipun belum sempurna, dan mulai kumpulkan minat jauh sebelum peluncuran.</p>
<BuildCta
  title="Aset pemasaran terbaik Anda adalah tautan yang langsung dapat dimainkan"
  desc="Game web mudah tersebar karena tidak ada yang perlu diinstal."
  prompt="Buat mini game yang dapat dibagikan dengan tantangan kalahkan skor saya" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/steam-next-fest-strategy.html">Strategi Steam Next Fest</a> — pembahasan mendalam tentang acara demo dan wishlist</li>
<li><a href="/id/guides/kickstarter-for-indie-games.html">Kickstarter untuk Game Indie</a> — jika Anda memilih jalur urun dana</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — meluncurkan game di itch</li>
<li><a href="/id/guides/get-more-plays-itch-io.html">Cara Mendapatkan Lebih Banyak Pemain di itch.io</a> — meningkatkan trafik game web</li>
<li><a href="/id/guides/publish-web-game.html">Tempat Terbaik untuk Menerbitkan Game Web pada 2026</a> — tempat menerbitkan game web</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web: Fakta yang Ditunjukkan Data</a> — potensi pendapatan dari jangkauan portal gratis</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/promote-indie-game-no-budget-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Tempat Terbaik untuk Menerbitkan Game Web pada 2026]]></title>
            <link>https://app.cinevva.com/id/guides/publish-web-game</link>
            <guid>https://app.cinevva.com/id/guides/publish-web-game</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Tempat menerbitkan game web pada 2026, dengan perbandingan itch.io, Newgrounds, CrazyGames, Poki, GameJolt, dan lainnya berdasarkan jangkauan, bagi hasil, serta persyaratan.]]></description>
            <content:encoded><![CDATA[<h1 id="tempat-terbaik-untuk-menerbitkan-game-web-pada-2026" tabindex="-1">Tempat Terbaik untuk Menerbitkan Game Web pada 2026 <a class="header-anchor" href="#tempat-terbaik-untuk-menerbitkan-game-web-pada-2026" aria-label="Permalink to &quot;Tempat Terbaik untuk Menerbitkan Game Web pada 2026&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Anda sudah menyelesaikan sebuah game web. Lalu apa? Tempat Anda menerbitkannya memengaruhi jumlah pemain, apakah Anda memperoleh penghasilan, dan seberapa besar kendali yang tetap Anda miliki. Pilihan platformnya beragam, mulai dari penerbitan mandiri gratis dan instan hingga portal terkurasi dengan jutaan pemain dan standar penerimaan yang lebih tinggi. Berikut rangkuman untuk 2026 beserta pertimbangan yang benar-benar penting.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/hyWQHY7EqoE" title="Cara membuat halaman game itch.io untuk game indie Anda — TheOdie" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Menyiapkan halaman itch.io yang menarik, tempat paling fleksibel untuk menerbitkan game web secara mandiri.</div>
<h2 id="perbandingan" tabindex="-1">Perbandingan <a class="header-anchor" href="#perbandingan" aria-label="Permalink to &quot;Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Platform</th>
<th>Jangkauan</th>
<th>Model pendapatan</th>
<th>Persetujuan</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>itch.io</strong></td>
<td>Besar (indie)</td>
<td>Anda menentukan potongannya (standar 90% untuk Anda / 10% untuk itch); berbayar, donasi, gratis</td>
<td>Instan, tanpa seleksi</td>
<td>Indie, berbayar/PWYW, game jam</td>
</tr>
<tr>
<td><strong>Newgrounds</strong></td>
<td>Menengah, berbasis komunitas</td>
<td>Bagi hasil iklan untuk kreator</td>
<td>Pemungutan suara portal</td>
<td>Game browser gratis, komunitas seni/animasi</td>
</tr>
<tr>
<td><strong>CrazyGames</strong></td>
<td>50 juta+ pemain bulanan</td>
<td>Bagi hasil iklan (% tidak dipublikasikan)</td>
<td>QA + peninjauan</td>
<td>Aksi/arkade/kasual, audiens besar</td>
</tr>
<tr>
<td><strong>Poki</strong></td>
<td>~100 juta MAU</td>
<td>100% jika Anda mendatangkan pemain / 50% jika Poki yang mendatangkannya</td>
<td>Ketat, melalui uji main</td>
<td>Game kasual yang matang dan dioptimalkan</td>
</tr>
<tr>
<td><strong>GameJolt</strong></td>
<td>Komunitas</td>
<td>Potongan marketplace maksimal 10%</td>
<td>Instan</td>
<td>Membangun basis penggemar, penjualan berbiaya rendah</td>
</tr>
<tr>
<td><strong>gd.games</strong> (GDevelop)</td>
<td>Komunitas</td>
<td>Pendapatan iklan berbasis sesi</td>
<td>Privat, lalu publik</td>
<td>Pengguna GDevelop, hosting gratis</td>
</tr>
<tr>
<td><strong>Armor Games</strong></td>
<td>Lebih kecil</td>
<td>Biaya sponsor/lisensi di muka</td>
<td>Penawaran melalui email, terkurasi</td>
<td>Game matang yang menginginkan pembayaran di muka</td>
</tr>
<tr>
<td><strong>GameDistribution / GameMonetize</strong></td>
<td>Jangkauan jaringan</td>
<td>Bagi hasil (33% / 45%+)</td>
<td>Dasbor + peninjauan</td>
<td>Sindikasi pasif untuk game kasual</td>
</tr>
</tbody>
</table>
<p>Catatan mengenai dua portal terbesar: <strong>Poki dan CrazyGames</strong> memiliki audiens terbesar, tetapi standar penerimaan tertinggi dan SDK wajib. <strong>itch.io</strong> menawarkan kebebasan paling besar dan pembagian pendapatan terbaik, tetapi Anda harus mendatangkan trafik sendiri. Lewati <strong>Kongregate</strong>, yang berhenti menerima game baru pada 2020 dan kini menjadi arsip.</p>
<h2 id="terbitkan-secara-mandiri-terlebih-dahulu-itch-io" tabindex="-1">Terbitkan secara mandiri terlebih dahulu: itch.io <a class="header-anchor" href="#terbitkan-secara-mandiri-terlebih-dahulu-itch-io" aria-label="Permalink to &quot;Terbitkan secara mandiri terlebih dahulu: itch.io&quot;"></a></h2>
<p>Bagi kebanyakan pengembang indie, itch.io adalah titik awal utama. Anda mengunggah build HTML5 (file ZIP berisi <code>index.html</code>), game tersebut disematkan dalam iframe, dan dalam hitungan menit sudah tayang tanpa proses persetujuan. Anda menentukan pembagian pendapatan (secara default, Anda menerima 90%) dan dapat menetapkan harga, menerima donasi, atau membagikannya secara gratis. Kekurangannya adalah itch tidak mendatangkan banyak trafik berkelanjutan dengan sendirinya. Andalah yang harus mengarahkan pemain ke sana. Hal itu dibahas dalam panduan <a href="/id/guides/get-more-plays-itch-io.html">cara mendapatkan lebih banyak permainan di itch.io</a>, sedangkan dasar-dasarnya tersedia dalam <a href="/id/guides/itch-io-launch-guide.html">panduan peluncuran itch.io</a>.</p>
<h2 id="portal-besar-crazygames-dan-poki" tabindex="-1">Portal besar: CrazyGames dan Poki <a class="header-anchor" href="#portal-besar-crazygames-dan-poki" aria-label="Permalink to &quot;Portal besar: CrazyGames dan Poki&quot;"></a></h2>
<p>Jika Anda menginginkan audiens bawaan yang terdiri atas puluhan juta pemain, portal game kasual adalah tempatnya, tetapi proses seleksinya ketat.</p>
<ul>
<li><strong>CrazyGames</strong> (50 juta+ pemain bulanan) menerima game HTML5/WebGL. Listing dasar hanya memerlukan sedikit persyaratan, tetapi peluncuran penuh dengan monetisasi mengharuskan penggunaan SDK mereka dan kelulusan QA, termasuk tetap berfungsi dengan pemblokir iklan serta langsung membuka gameplay. Pembayaran dimulai dari €100.</li>
<li><strong>Poki</strong> (~100 juta pengguna bulanan) memiliki proses paling ketat: alur beberapa tahap yang mencakup uji main serta penilaian berdasarkan kualitas, kecocokan dengan pemain, dan keandalan teknis. SDK-nya wajib digunakan, dan kesepakatan pendapatannya bergantung pada siapa yang mendatangkan pemain (100% jika Anda yang mendatangkannya, 50% jika Poki).</li>
</ul>
<p>Platform-platform ini cocok untuk game kasual yang matang dan sangat dioptimalkan, tetapi menjalani proses mereka membutuhkan usaha nyata.</p>
<h2 id="platform-komunitas-newgrounds-gamejolt-gd-games" tabindex="-1">Platform komunitas: Newgrounds, GameJolt, gd.games <a class="header-anchor" href="#platform-komunitas-newgrounds-gamejolt-gd-games" aria-label="Permalink to &quot;Platform komunitas: Newgrounds, GameJolt, gd.games&quot;"></a></h2>
<ul>
<li><strong>Newgrounds</strong> mengutamakan komunitas, dengan sistem pemungutan suara portal dan bagi hasil pendapatan iklan. Sangat cocok untuk game browser gratis serta komunitas seni dan animasi.</li>
<li><strong>GameJolt</strong> membatasi potongan marketplace-nya hingga maksimal 10% dan dirancang untuk membangun pengikut serta basis penggemar.</li>
<li><strong>gd.games</strong> memberikan hosting gratis kepada pengguna GDevelop, dengan pendapatan iklan berbasis sesi dan penerbitan sekali klik dari editor.</li>
</ul>
<h2 id="jaringan-distribusi-gamedistribution-gamemonetize" tabindex="-1">Jaringan distribusi: GameDistribution, GameMonetize <a class="header-anchor" href="#jaringan-distribusi-gamedistribution-gamemonetize" aria-label="Permalink to &quot;Jaringan distribusi: GameDistribution, GameMonetize&quot;"></a></h2>
<p>Platform-platform ini menyindikasikan satu unggahan HTML5 ke berbagai situs mitra untuk memperoleh jangkauan pasif, sebagai imbalan atas potongan yang lebih besar dan penggunaan SDK wajib. GameDistribution mengambil bagian lebih besar; GameMonetize menawarkan pembagian yang lebih tinggi serta pembayaran cepat dengan ambang rendah. Cocok untuk game kasual, puzzle, dan .io ketika volume lebih penting daripada persentase pembagian.</p>
<h2 id="jangan-lupakan-hosting-mandiri" tabindex="-1">Jangan lupakan hosting mandiri <a class="header-anchor" href="#jangan-lupakan-hosting-mandiri" aria-label="Permalink to &quot;Jangan lupakan hosting mandiri&quot;"></a></h2>
<p>Game HTML5 hanyalah kumpulan file statis, sehingga Anda dapat meng-host-nya secara gratis di GitHub Pages, Cloudflare Pages, Netlify, atau Vercel menggunakan domain sendiri, tanpa potongan pendapatan dan dengan kendali penuh atas SEO serta analitik. Kekurangannya adalah tidak ada audiens bawaan sama sekali. Pendekatan yang umum: host versi kanonis secara mandiri untuk merek dan SEO Anda, lalu terbitkan juga di itch.io serta satu atau dua portal demi memperluas jangkauan. Jika game Anda dibuat dengan alat kreasi seperti Cinevva, Anda juga dapat langsung membagikannya melalui tautan dan mengirimkannya ke galeri karya.</p>
<h2 id="cara-memilih" tabindex="-1">Cara memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara memilih&quot;"></a></h2>
<p>Sesuaikan platform dengan tujuan Anda. Menginginkan kebebasan maksimal dan pembagian terbaik? Gunakan itch.io serta hosting mandiri. Menginginkan audiens terbesar dan Anda memiliki game kasual yang matang? Pilih Poki atau CrazyGames. Menginginkan pembayaran di muka untuk game berkualitas yang sudah selesai? Ajukan penawaran ke Armor Games. Menginginkan jangkauan sindikasi pasif? Gunakan jaringan distribusi. Sebagian besar pengembang indie menerbitkan game di beberapa tempat sekaligus: itch.io sebagai basis utama, portal untuk jangkauan, dan tautan mereka sendiri untuk mempertahankan kendali.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="di-mana-saya-sebaiknya-menerbitkan-game-html5" tabindex="-1">Di mana saya sebaiknya menerbitkan game HTML5? <a class="header-anchor" href="#di-mana-saya-sebaiknya-menerbitkan-game-html5" aria-label="Permalink to &quot;Di mana saya sebaiknya menerbitkan game HTML5?&quot;"></a></h3>
<p>Mulailah dengan itch.io: prosesnya instan, gratis, menawarkan pembagian pendapatan terbaik, dan memungkinkan Anda menetapkan harga atau membagikan game secara gratis. Untuk memperoleh audiens yang lebih besar, kirimkan game kasual yang matang ke CrazyGames atau Poki (keduanya memiliki proses peninjauan selektif dan mewajibkan SDK). Sebagian besar pengembang menerbitkan game di beberapa tempat: itch.io, ditambah sebuah portal, serta tautan yang mereka host sendiri.</p>
<h3 id="platform-game-web-mana-yang-memberikan-bayaran-paling-besar" tabindex="-1">Platform game web mana yang memberikan bayaran paling besar? <a class="header-anchor" href="#platform-game-web-mana-yang-memberikan-bayaran-paling-besar" aria-label="Permalink to &quot;Platform game web mana yang memberikan bayaran paling besar?&quot;"></a></h3>
<p>Itu bergantung pada trafik dan modelnya. itch.io memberikan pembagian terbaik (secara default Anda mempertahankan 90%+) tetapi Anda harus mendatangkan audiens sendiri. Poki dan CrazyGames memiliki audiens bawaan yang sangat besar, tetapi membagi pendapatan iklan berdasarkan ketentuan mereka. Armor Games membayar biaya sponsor di muka untuk game berkualitas. Tidak ada satu pilihan terbaik; pembagian tinggi dengan trafik rendah dapat menghasilkan lebih sedikit daripada pembagian yang lebih kecil dengan jutaan pemain.</p>
<h3 id="apakah-saya-memerlukan-sdk-untuk-menerbitkan-game-web" tabindex="-1">Apakah saya memerlukan SDK untuk menerbitkan game web? <a class="header-anchor" href="#apakah-saya-memerlukan-sdk-untuk-menerbitkan-game-web" aria-label="Permalink to &quot;Apakah saya memerlukan SDK untuk menerbitkan game web?&quot;"></a></h3>
<p>Di itch.io, Newgrounds, dan GameJolt, tidak; Anda cukup mengunggah game. Di portal besar (Poki, CrazyGames) dan jaringan distribusi (GameDistribution, GameMonetize), SDK diperlukan untuk monetisasi dan peluncuran penuh. SDK menangani iklan dan fitur platform. Pertimbangkan pekerjaan integrasi tersebut saat memilih tempat untuk menerbitkan game.</p>
<h3 id="bisakah-saya-menerbitkan-game-web-yang-sama-di-beberapa-platform" tabindex="-1">Bisakah saya menerbitkan game web yang sama di beberapa platform? <a class="header-anchor" href="#bisakah-saya-menerbitkan-game-web-yang-sama-di-beberapa-platform" aria-label="Permalink to &quot;Bisakah saya menerbitkan game web yang sama di beberapa platform?&quot;"></a></h3>
<p>Biasanya bisa, kecuali Anda menyetujui kesepakatan eksklusif (misalnya, pembagian pendapatan Poki yang lebih tinggi dapat mensyaratkan eksklusivitas web). Hosting mandiri yang dipadukan dengan itch.io dan portal non-eksklusif merupakan kombinasi umum. Baca ketentuan setiap platform karena eksklusivitas dan pembagian pendapatan sering kali saling terkait.</p>
<BuildCta
  title="Butuh game untuk diterbitkan?"
  desc="Buat game di browser dan bagikan dengan satu tautan."
  prompt="Buatkan game arkade sederhana yang dapat saya terbitkan dan bagikan melalui tautan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/publish-game-poki.html">Cara Menerbitkan Game Anda di Poki</a> — alur pengiriman dan pembagian pendapatan secara mendalam</li>
<li><a href="/id/guides/publish-game-crazygames.html">Panduan Pengembang CrazyGames</a> — portal, SDK, dan pembayarannya secara mendalam</li>
<li><a href="/id/guides/publish-game-discord-activities.html">Cara Menerbitkan Game di Discord Activities</a> — merilis game web di dalam Discord</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web: Fakta yang Sebenarnya Ditunjukkan Data</a> — jumlah bayaran setiap platform berdasarkan sumber</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — panduan langkah demi langkah</li>
<li><a href="/id/guides/get-more-plays-itch-io.html">Cara Mendapatkan Lebih Banyak Permainan di itch.io</a> — mendatangkan trafik setelah game Anda tayang</li>
<li><a href="/id/guides/promote-indie-game-no-budget.html">Cara Mempromosikan Game Indie Tanpa Anggaran</a> — pemasaran dengan anggaran $0</li>
<li><a href="/id/guides/steam-next-fest-strategy.html">Strategi Steam Next Fest</a> — jika Anda juga merilisnya di Steam</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — membuat gamenya terlebih dahulu</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/publish-web-game-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Sketchfab vs Poly Haven vs Kenney: Perbandingan Aset 3D Gratis (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/sketchfab-polyhaven-kenney</link>
            <guid>https://app.cinevva.com/id/guides/sketchfab-polyhaven-kenney</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Perbandingan Sketchfab, Poly Haven, dan Kenney untuk aset game gratis pada 2026 berdasarkan lisensi, gaya, variasi, format, serta platform yang cocok untuk setiap jenis game.]]></description>
            <content:encoded><![CDATA[<h1 id="sketchfab-vs-poly-haven-vs-kenney-perbandingan-aset-3d-gratis-2026" tabindex="-1">Sketchfab vs Poly Haven vs Kenney: Perbandingan Aset 3D Gratis (2026) <a class="header-anchor" href="#sketchfab-vs-poly-haven-vs-kenney-perbandingan-aset-3d-gratis-2026" aria-label="Permalink to &quot;Sketchfab vs Poly Haven vs Kenney: Perbandingan Aset 3D Gratis (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Ada tiga nama yang terus muncul ketika Anda mencari aset 3D gratis: Sketchfab, Poly Haven, dan Kenney. Ketiganya sebenarnya bukan pesaing karena masing-masing unggul dalam hal berbeda. Satu merupakan marketplace besar dengan beragam lisensi, satu berfokus pada fotorealisme dan berlisensi CC0, sementara satu lagi menawarkan aset bergaya khas yang siap digunakan dalam game. Berikut perbandingannya pada 2026 dan kapan sebaiknya Anda menggunakan masing-masing.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/8aGqyS7IQVA" title="Situs Terbaik untuk Model 3D Gratis" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Rangkuman sumber model 3D gratis, termasuk tiga platform yang dibandingkan di sini.</div>
<h2 id="sekilas-perbandingan" tabindex="-1">Sekilas perbandingan <a class="header-anchor" href="#sekilas-perbandingan" aria-label="Permalink to &quot;Sekilas perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Sketchfab</th>
<th>Poly Haven</th>
<th>Kenney</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Terbaik untuk</strong></td>
<td>Variasi, model kompleks dan mendetail</td>
<td>Model fotorealistis, tekstur, HDRI</td>
<td>Aset siap pakai untuk game, bergaya khas, dan konsisten</td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam (periksa satu per satu)</td>
<td>CC0 (semuanya)</td>
<td>CC0 (semuanya)</td>
</tr>
<tr>
<td><strong>Atribusi</strong></td>
<td>Bergantung pada model</td>
<td>Tidak ada</td>
<td>Tidak ada</td>
</tr>
<tr>
<td><strong>Katalog</strong></td>
<td>Jutaan</td>
<td>2.000+</td>
<td>Puluhan ribu</td>
</tr>
<tr>
<td><strong>Gaya</strong></td>
<td>Segala gaya</td>
<td>Realistis</td>
<td>Low-poly yang serasi dan bersih</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>glTF, FBX, OBJ</td>
<td>glTF, Blend, FBX</td>
<td>GLB, PNG, WAV, dan lainnya</td>
</tr>
<tr>
<td><strong>Unduhan langsung / API</strong></td>
<td>Wajib masuk</td>
<td>Ya, API tanpa kunci</td>
<td>Ya (paket)</td>
</tr>
</tbody>
</table>
<h2 id="kenney-serasi-dan-siap-digunakan-dalam-game" tabindex="-1">Kenney: serasi dan siap digunakan dalam game <a class="header-anchor" href="#kenney-serasi-dan-siap-digunakan-dalam-game" aria-label="Permalink to &quot;Kenney: serasi dan siap digunakan dalam game&quot;"></a></h2>
<p>Kenney adalah cara tercepat untuk membuat game dengan tampilan yang serasi. Tersedia puluhan ribu aset yang semuanya berlisensi CC0 (tanpa atribusi dan boleh digunakan secara komersial), memiliki gaya konsisten yang dapat dipadukan antar-paket, serta telah dioptimalkan untuk game. Kekurangannya adalah rentang pilihan: asetnya bergaya khas dan bersih, bukan fotorealistis, dan Anda tidak akan menemukan properti spesifik yang sangat mendetail. Gunakan Kenney jika Anda ingin seluruh game tampak menyatu dengan cepat tanpa perlu memikirkan lisensi.</p>
<h2 id="poly-haven-fotorealistis-dan-cc0" tabindex="-1">Poly Haven: fotorealistis dan CC0 <a class="header-anchor" href="#poly-haven-fotorealistis-dan-cc0" aria-label="Permalink to &quot;Poly Haven: fotorealistis dan CC0&quot;"></a></h2>
<p>Poly Haven adalah spesialis realisme: model 3D dengan tekstur PBR, tekstur beresolusi tinggi, serta HDRI untuk pencahayaan. Semuanya berlisensi CC0, tersedia dalam beberapa resolusi, dan dapat diunduh langsung melalui API tanpa kunci. Katalognya mencakup lebih dari 2.000 aset dan terus bertambah. Katalog tersebut lebih kecil dan terarah—mencakup properti, elemen lingkungan, material, serta pencahayaan—alih-alih menjadi marketplace yang sangat luas. Gunakan Poly Haven jika Anda menginginkan material realistis, dekorasi lingkungan, dan pencahayaan HDRI yang baik tanpa atribusi.</p>
<h2 id="sketchfab-banyak-pilihan-tetapi-lisensinya-harus-diperiksa" tabindex="-1">Sketchfab: banyak pilihan, tetapi lisensinya harus diperiksa <a class="header-anchor" href="#sketchfab-banyak-pilihan-tetapi-lisensinya-harus-diperiksa" aria-label="Permalink to &quot;Sketchfab: banyak pilihan, tetapi lisensinya harus diperiksa&quot;"></a></h2>
<p>Sketchfab adalah platform raksasa dengan jutaan model, pratinjau 3D sebelum diunduh, serta pilihan gaya dan subjek yang sangat luas. Kekurangannya, lisensi setiap model berbeda-beda. Karena itu, Anda harus memfilter model yang dapat diunduh dan berlisensi CC0 atau CC-BY, lalu memverifikasi lisensi setiap model. Ada satu hal yang perlu diperhatikan pada 2026: toko Sketchfab telah dipindahkan ke Fab milik Epic, dan hanya konten berlisensi CC-BY serta Fab Standard yang dapat dimigrasikan. Model CC0 dan model dengan lisensi Creative Commons lainnya untuk saat ini masih dapat diunduh dari Sketchfab, tetapi anggaplah platform ini sebagai sumber CC0 yang perlahan menyusut dan segera unduh aset yang Anda perlukan. Gunakan Sketchfab jika Anda membutuhkan model spesifik atau tidak biasa yang tidak tersedia di platform lain dan bersedia memeriksa lisensinya.</p>
<h2 id="mana-yang-sebaiknya-anda-gunakan" tabindex="-1">Mana yang sebaiknya Anda gunakan? <a class="header-anchor" href="#mana-yang-sebaiknya-anda-gunakan" aria-label="Permalink to &quot;Mana yang sebaiknya Anda gunakan?&quot;"></a></h2>
<ul>
<li><strong>Tampilan seluruh game yang serasi, cepat, tanpa atribusi:</strong> Kenney.</li>
<li><strong>Properti, material, dan pencahayaan realistis berlisensi CC0:</strong> Poly Haven.</li>
<li><strong>Model spesifik atau tidak biasa dengan pilihan terluas:</strong> Sketchfab (periksa lisensinya).</li>
</ul>
<p>Dalam praktiknya, banyak pengembang menggunakan ketiganya: Kenney untuk set dasar dan UI, Poly Haven untuk tekstur realistis serta HDRI, dan Sketchfab untuk aset utama unik yang hanya diperlukan satu kali. Memasang material realistis dari Poly Haven pada model bergaya khas dari Kenney dapat menimbulkan ketidakserasian. Jadi, tentukan dahulu arahan visual Anda, lalu pilih sumber aset yang sesuai.</p>
<h2 id="selain-tiga-platform-utama-ini" tabindex="-1">Selain tiga platform utama ini <a class="header-anchor" href="#selain-tiga-platform-utama-ini" aria-label="Permalink to &quot;Selain tiga platform utama ini&quot;"></a></h2>
<p>Ketiganya bukan satu-satunya pilihan. Quaternius juga merupakan sumber CC0 yang sangat baik untuk aset low-poly bergaya khas, AmbientCG berfokus pada tekstur CC0, dan Poly Pizza menyediakan katalog Google Poly yang telah diarsipkan. Anda juga dapat membuat model dengan AI. Untuk melihat pilihan selengkapnya, baca panduan <a href="/id/guides/free-3d-model-sites.html">situs model 3D gratis</a> dan <a href="/id/guides/game-assets-guide.html">aset game gratis</a> kami.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-sketchfab-poly-haven-atau-kenney-yang-terbaik-untuk-model-3d-gratis" tabindex="-1">Apakah Sketchfab, Poly Haven, atau Kenney yang terbaik untuk model 3D gratis? <a class="header-anchor" href="#apakah-sketchfab-poly-haven-atau-kenney-yang-terbaik-untuk-model-3d-gratis" aria-label="Permalink to &quot;Apakah Sketchfab, Poly Haven, atau Kenney yang terbaik untuk model 3D gratis?&quot;"></a></h3>
<p>Masing-masing unggul dalam hal berbeda. Kenney paling cocok untuk aset bergaya khas yang serasi, siap digunakan dalam game, dan semuanya berlisensi CC0. Poly Haven paling cocok untuk model fotorealistis, tekstur, dan HDRI yang semuanya berlisensi CC0. Sketchfab paling unggul dalam variasi serta model spesifik atau mendetail, tetapi lisensinya berbeda-beda sehingga Anda harus memeriksa setiap model. Banyak pengembang menggunakan ketiganya secara bersamaan.</p>
<h3 id="apakah-poly-haven-dan-kenney-benar-benar-gratis-untuk-game-komersial" tabindex="-1">Apakah Poly Haven dan Kenney benar-benar gratis untuk game komersial? <a class="header-anchor" href="#apakah-poly-haven-dan-kenney-benar-benar-gratis-untuk-game-komersial" aria-label="Permalink to &quot;Apakah Poly Haven dan Kenney benar-benar gratis untuk game komersial?&quot;"></a></h3>
<p>Ya. Keduanya sepenuhnya berlisensi CC0, yang berarti setiap aset berada dalam domain publik: bebas digunakan secara komersial, dapat dimodifikasi, dan tidak memerlukan atribusi. Hal ini menjadikan keduanya sebagai sumber dengan risiko paling rendah di antara ketiga platform tersebut. Sebaliknya, Sketchfab memiliki beragam lisensi untuk setiap model yang harus Anda verifikasi sebelum menggunakannya secara komersial.</p>
<h3 id="apakah-saya-harus-mencantumkan-kredit-untuk-aset-dari-situs-situs-ini" tabindex="-1">Apakah saya harus mencantumkan kredit untuk aset dari situs-situs ini? <a class="header-anchor" href="#apakah-saya-harus-mencantumkan-kredit-untuk-aset-dari-situs-situs-ini" aria-label="Permalink to &quot;Apakah saya harus mencantumkan kredit untuk aset dari situs-situs ini?&quot;"></a></h3>
<p>Tidak untuk Kenney atau Poly Haven karena semuanya berlisensi CC0. Untuk Sketchfab, hal ini bergantung pada lisensi setiap model: CC0 tidak memerlukan kredit, CC-BY mewajibkan atribusi, dan beberapa model sama sekali tidak boleh digunakan secara komersial. Selalu periksa lisensi setiap model Sketchfab sebelum merilis game Anda.</p>
<h3 id="bisakah-saya-menggabungkan-aset-dari-ketiganya-dalam-satu-game" tabindex="-1">Bisakah saya menggabungkan aset dari ketiganya dalam satu game? <a class="header-anchor" href="#bisakah-saya-menggabungkan-aset-dari-ketiganya-dalam-satu-game" aria-label="Permalink to &quot;Bisakah saya menggabungkan aset dari ketiganya dalam satu game?&quot;"></a></h3>
<p>Secara teknis bisa, dan lisensinya mengizinkan hal tersebut, tetapi perhatikan arahan visual Anda. Tampilan bergaya khas dari Kenney dan material fotorealistis dari Poly Haven dapat terlihat tidak serasi jika digabungkan sembarangan. Tentukan gaya visual terlebih dahulu, lalu pilih aset yang sesuai. Gunakan Sketchfab untuk elemen tertentu yang tidak tersedia dari sumber CC0.</p>
<BuildCta
  title="Dapatkan properti bergaya Kenney yang langsung ditempatkan ke dalam game Anda"
  desc="Cinevva menyediakan ribuan properti CC0 dari Kenney dan Quaternius langsung di dalam editornya."
  prompt="Buat satu blok kota low-poly dengan taman, mobil, dan berbagai tempat untuk dijelajahi" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a> — pilihan yang lebih luas</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — 20+ sumber untuk segala jenis aset</li>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI Terbaik untuk Game</a> — buat aset sendiri sebagai alternatif</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — CC0, CC-BY, dan lisensi lainnya</li>
<li><a href="/id/guides/free-sound-effects-music.html">Efek Suara dan Musik Gratis untuk Game</a> — pilihan untuk audio</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/sketchfab-polyhaven-kenney-hero.jpg?v=1" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Unity WebGL vs Godot vs PlayCanvas untuk 3D Web (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/unity-godot-playcanvas-web</link>
            <guid>https://app.cinevva.com/id/guides/unity-godot-playcanvas-web</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Perbandingan Unity WebGL, ekspor web Godot, dan PlayCanvas pada 2026 berdasarkan ukuran build, waktu pemuatan, WebGPU, alur kerja, dan biaya untuk memilih engine 3D yang tepat bagi browser.]]></description>
            <content:encoded><![CDATA[<h1 id="unity-webgl-vs-godot-vs-playcanvas-untuk-3d-web-2026" tabindex="-1">Unity WebGL vs Godot vs PlayCanvas untuk 3D Web (2026) <a class="header-anchor" href="#unity-webgl-vs-godot-vs-playcanvas-untuk-3d-web-2026" aria-label="Permalink to &quot;Unity WebGL vs Godot vs PlayCanvas untuk 3D Web (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Jika Anda ingin membuat game 3D yang berjalan di browser, ada tiga engine yang paling sering disebut: Unity, Godot, dan PlayCanvas. Ketiganya menggunakan pendekatan yang sangat berbeda untuk web. Unity adalah engine desktop tangguh yang dapat mengekspor ke WebGL, Godot merupakan engine serbaguna gratis dan sumber terbuka, sedangkan PlayCanvas sejak awal dibuat khusus untuk web. Berikut perbandingan ketiganya pada 2026, khusus untuk 3D di browser.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/MiejI68zyCk" title="PlayCanvas - Engine Game 3D Terbaik untuk Web? — GameFromScratch" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Ulasan GameFromScratch tentang PlayCanvas sebagai engine 3D yang mengutamakan web.</div>
<h2 id="kesimpulan-singkat" tabindex="-1">Kesimpulan singkat <a class="header-anchor" href="#kesimpulan-singkat" aria-label="Permalink to &quot;Kesimpulan singkat&quot;"></a></h2>
<ul>
<li><strong>3D yang mengutamakan web, build terkecil, WebGPU terbaik:</strong> PlayCanvas.</li>
<li><strong>Gratis, sumber terbuka, mendukung 2D dan 3D, satu basis kode untuk web dan native:</strong> Godot.</li>
<li><strong>Anda sudah memiliki proyek Unity, atau juga memerlukan dukungan konsol dan native kelas atas:</strong> Unity, dengan konsekuensi unduhan web yang lebih besar.</li>
</ul>
<h2 id="perbandingan" tabindex="-1">Perbandingan <a class="header-anchor" href="#perbandingan" aria-label="Permalink to &quot;Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Unity (WebGL)</th>
<th>Godot (4.7)</th>
<th>PlayCanvas</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Target web</strong></td>
<td>Ekspor WebGL2</td>
<td>WebGL2 + Wasm (wasm64 di 4.7)</td>
<td>WebGL2 + WebGPU</td>
</tr>
<tr>
<td><strong>Ukuran build kosong</strong></td>
<td>~8 MB+</td>
<td>~9 MB setelah gzip</td>
<td>~1–2 MB</td>
</tr>
<tr>
<td><strong>Waktu pemuatan</strong></td>
<td>Paling lambat di antara ketiganya</td>
<td>Sedang</td>
<td>Paling cepat</td>
</tr>
<tr>
<td><strong>WebGPU</strong></td>
<td>Eksperimental</td>
<td>Tidak didukung di web</td>
<td>Paling matang</td>
</tr>
<tr>
<td><strong>2D / 3D</strong></td>
<td>Keduanya</td>
<td>Keduanya (2D + 3D yang kuat)</td>
<td>Mengutamakan 3D</td>
</tr>
<tr>
<td><strong>Editor</strong></td>
<td>Desktop</td>
<td>Desktop (ringan)</td>
<td>Cloud, kolaboratif</td>
</tr>
<tr>
<td><strong>Bahasa</strong></td>
<td>C# (dikompilasi menjadi WebAssembly untuk ekspor web)</td>
<td>GDScript (C# tidak dapat diekspor ke web)</td>
<td>JavaScript / TypeScript</td>
</tr>
<tr>
<td><strong>Biaya</strong></td>
<td>Gratis untuk pendapatan di bawah $200 ribu; Pro $2.310/kursi/tahun</td>
<td>Gratis (MIT)</td>
<td>Tingkat gratis; editor cloud berbayar</td>
</tr>
</tbody>
</table>
<h2 id="unity-webgl" tabindex="-1">Unity (WebGL) <a class="header-anchor" href="#unity-webgl" aria-label="Permalink to &quot;Unity (WebGL)&quot;"></a></h2>
<p>Unity dapat mengekspor build WebGL yang bisa langsung dimainkan, dan ekosistemnya (Asset Store, alat bantu, dokumentasi) tidak tertandingi. Kekurangannya, khusus untuk web: build kosong mulai dari sekitar 8 MB, waktu pemuatannya tertinggal dari engine web-native, dan memori browser seluler dapat terasa terbatas. WebGPU tersedia, tetapi masih eksperimental dan dinonaktifkan secara default; WebGL2 tetap menjadi target utamanya. Hal praktis yang perlu diperhatikan adalah Unity merupakan opsi paling berat untuk dijalankan di browser. Karena itu, Unity paling cocok ketika web menjadi target sekunder bagi game yang juga dirilis untuk desktop, seluler, atau konsol. Unity juga telah mengganti alat AI Muse dengan Unity AI (beta terbuka, 2026) jika Anda menginginkan bantuan AI di dalam editor.</p>
<h2 id="godot-4-7" tabindex="-1">Godot (4.7) <a class="header-anchor" href="#godot-4-7" aria-label="Permalink to &quot;Godot (4.7)&quot;"></a></h2>
<p>Godot tersedia secara gratis dan bersumber terbuka di bawah lisensi MIT, tanpa batas pendapatan maupun biaya per kursi, serta mampu menangani 2D dan 3D dengan baik. Versi 4.7 (Juni 2026) mengaktifkan SIMD WebAssembly secara default dan menambahkan opsi ekspor wasm64 yang menghapus batas memori lama sebesar 4 GB. Rendering web masih terbatas pada WebGL 2.0 melalui renderer Compatibility karena Godot belum mendukung WebGPU. Masih ada dua hal yang perlu diperhatikan untuk web: proyek C# tidak dapat diekspor ke web (hanya GDScript), dan threading SharedArrayBuffer memerlukan header server COOP/COEP tertentu, yang dapat menimbulkan masalah pada sebagian layanan hosting. Bagi kreator indie yang menginginkan satu engine untuk web dan native tanpa mengkhawatirkan lisensi, Godot adalah pilihan gratis yang kuat.</p>
<h2 id="playcanvas" tabindex="-1">PlayCanvas <a class="header-anchor" href="#playcanvas" aria-label="Permalink to &quot;PlayCanvas&quot;"></a></h2>
<p>PlayCanvas sejak awal dirancang untuk web. Runtime-nya sangat kecil (~1–2 MB), pemuatannya paling cepat di antara ketiganya, dan engine ini memiliki renderer WebGPU paling siap produksi di antara semua engine web, termasuk rendering 3D Gaussian splat berbasis komputasi sejak v2.20 (Juni 2026). Editornya berbasis cloud dan mendukung kolaborasi, sehingga cocok untuk tim, meskipun alur kerjanya tidak sesuai untuk semua orang. PlayCanvas mengutamakan 3D dan kurang cocok untuk 2D yang kompleks. Jika ukuran unduhan dan performa web menjadi prioritas Anda, PlayCanvas memang dibuat khusus untuk kebutuhan tersebut.</p>
<h2 id="cara-memilih" tabindex="-1">Cara memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara memilih&quot;"></a></h2>
<p>Pilih berdasarkan batasan utama proyek Anda. Jika Anda memerlukan build web 3D yang paling kecil, paling cepat dimuat, dan memiliki dukungan WebGPU yang baik, pilih PlayCanvas. Jika Anda menginginkan engine gratis dan terbuka yang mampu menangani 2D serta 3D, sekaligus mengekspor ke desktop dan seluler dari satu basis kode, pilih Godot. Jika game Anda sudah dibuat dengan Unity atau benar-benar memerlukan rendering kelas atas dan ekspor konsol dari Unity, rilis build WebGL-nya dan terima konsekuensi unduhan yang lebih besar.</p>
<p>Jika Anda lebih suka melewati penggunaan engine sepenuhnya dan mendeskripsikan game web 3D kepada AI, itu merupakan pendekatan berbeda yang dibahas dalam <a href="/id/guides/3d-browser-game-without-coding.html">cara membuat game browser 3D tanpa coding</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="engine-apa-yang-terbaik-untuk-game-browser-3d" tabindex="-1">Engine apa yang terbaik untuk game browser 3D? <a class="header-anchor" href="#engine-apa-yang-terbaik-untuk-game-browser-3d" aria-label="Permalink to &quot;Engine apa yang terbaik untuk game browser 3D?&quot;"></a></h3>
<p>PlayCanvas adalah pilihan terkuat yang mengutamakan web pada 2026: runtime kecil, pemuatan tercepat, dan renderer WebGPU paling matang. Godot merupakan opsi gratis dan sumber terbuka terbaik yang juga dapat mengekspor ke platform native. Unity paling cocok hanya jika game Anda sudah menggunakannya atau memerlukan fitur kelas atasnya, karena build web Unity memiliki ukuran paling besar. Pilihan terbaik bergantung pada ukuran build, kebutuhan ekspor native, dan anggaran Anda.</p>
<h3 id="apakah-unity-dan-godot-dapat-mengekspor-game-c-ke-web" tabindex="-1">Apakah Unity dan Godot dapat mengekspor game C# ke web? <a class="header-anchor" href="#apakah-unity-dan-godot-dapat-mengekspor-game-c-ke-web" aria-label="Permalink to &quot;Apakah Unity dan Godot dapat mengekspor game C# ke web?&quot;"></a></h3>
<p>Ini merupakan kendala umum yang perlu diperhatikan: Godot sama sekali tidak dapat mengekspor proyek C# ke web (hanya GDScript). Ekspor web Unity menggunakan C#, tetapi mengompilasinya untuk WebGL melalui Wasm, dan build yang dihasilkan berukuran besar (~8 MB+ dalam keadaan kosong). PlayCanvas menggunakan JavaScript atau TypeScript secara native, yang menjadi salah satu alasan build web-nya begitu kecil.</p>
<h3 id="mana-yang-paling-cepat-dimuat-di-browser" tabindex="-1">Mana yang paling cepat dimuat di browser? <a class="header-anchor" href="#mana-yang-paling-cepat-dimuat-di-browser" aria-label="Permalink to &quot;Mana yang paling cepat dimuat di browser?&quot;"></a></h3>
<p>PlayCanvas, dengan selisih yang jauh, berkat runtime ~1–2 MB yang dibuat khusus untuk web. Build kosong Godot berukuran sekitar 9 MB setelah gzip, sedangkan Unity mulai dari sekitar 8 MB atau lebih. Untuk game web, ukuran unduhan total sangat memengaruhi jumlah pemain yang bersedia menunggu hingga game selesai dimuat. Jadi, ini merupakan faktor pemilihan yang penting, bukan sekadar detail.</p>
<h3 id="apakah-engine-engine-ini-mendukung-webgpu" tabindex="-1">Apakah engine-engine ini mendukung WebGPU? <a class="header-anchor" href="#apakah-engine-engine-ini-mendukung-webgpu" aria-label="Permalink to &quot;Apakah engine-engine ini mendukung WebGPU?&quot;"></a></h3>
<p>PlayCanvas memiliki renderer WebGPU paling matang. Ekspor web Godot masih terbatas pada WebGL2 dan belum mendukung WebGPU. Unity mempertahankan WebGPU sebagai fitur eksperimental dengan WebGL2 sebagai pilihan default. Untuk pembahasan lebih mendalam mengenai komprominya, lihat <a href="/id/guides/webgpu-vs-webgl-games.html">panduan WebGPU vs WebGL</a> kami.</p>
<BuildCta
  title="Bandingkan engine nanti, mainkan ide Anda sekarang"
  desc="Prototipe yang dapat dimainkan akan memperjelas pilihan engine."
  prompt="Buat FPS browser dengan grafis low poly" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — perbandingan lengkap 11 engine</li>
<li><a href="/id/guides/webgpu-vs-webgl-games.html">WebGPU vs WebGL untuk Game</a> — kompromi antara kedua API rendering</li>
<li><a href="/id/guides/playcanvas-vs-threejs.html">PlayCanvas vs Three.js</a> — engine vs pustaka untuk 3D web</li>
<li><a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk Game Web</a> — perbandingan langsung dua engine lengkap terbesar</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/unity-godot-playcanvas-web-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Vibe Coding Game: Apa Itu dan Cara Memulainya (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/vibe-coding-games</link>
            <guid>https://app.cinevva.com/id/guides/vibe-coding-games</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Arti vibe coding, asal-usul istilahnya, dan cara membuat game dengan vibe coding pada 2026, lengkap dengan alur kerja, alat, kisah sukses nyata, serta jebakan yang perlu dihindari.]]></description>
            <content:encoded><![CDATA[<h1 id="vibe-coding-game-apa-itu-dan-cara-memulainya-2026" tabindex="-1">Vibe Coding Game: Apa Itu dan Cara Memulainya (2026) <a class="header-anchor" href="#vibe-coding-game-apa-itu-dan-cara-memulainya-2026" aria-label="Permalink to &quot;Vibe Coding Game: Apa Itu dan Cara Memulainya (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>&quot;Vibe coding&quot; berkembang dari sebuah tweet menjadi Kata Tahun Ini versi Collins Dictionary dalam waktu kurang dari setahun. Untuk game, ini merupakan salah satu cara paling menyenangkan untuk berkarya saat ini: Anda menjelaskan apa yang diinginkan, AI menuliskannya, lalu Anda mengarahkan prosesnya berdasarkan rasa alih-alih sintaks. Berikut arti sebenarnya dari istilah tersebut, cara membuat game dengan vibe coding, serta situasi ketika metode ini berhasil dan ketika justru menimbulkan masalah.</p>
<h2 id="asal-usul-istilah-ini" tabindex="-1">Asal-usul istilah ini <a class="header-anchor" href="#asal-usul-istilah-ini" aria-label="Permalink to &quot;Asal-usul istilah ini&quot;"></a></h2>
<p>Istilah ini berasal dari Andrej Karpathy, salah satu anggota pendiri OpenAI, dalam sebuah unggahan pada Februari 2025. Ia menggambarkannya sebagai &quot;jenis baru pemrograman ketika Anda sepenuhnya mengikuti vibe, merangkul pertumbuhan eksponensial, dan bahkan melupakan bahwa kode itu ada,&quot; yang dimungkinkan karena model AI pemrograman sudah cukup canggih sehingga Anda dapat &quot;cukup melihat sesuatu, mengatakan sesuatu, menjalankan sesuatu, dan menyalin-tempel sesuatu, dan biasanya berhasil.&quot; Ia membingkainya sebagai metode untuk proyek akhir pekan sekali pakai, dan hal itu patut diingat.</p>
<p>Pengembang Simon Willison memperjelas definisinya: vibe coding yang sesungguhnya berarti membangun perangkat lunak dengan LLM tanpa meninjau kode yang ditulisnya. Jika Anda membaca, menguji, dan memahami setiap baris, berarti Anda menggunakan AI sebagai asisten mengetik, yang merupakan hal berbeda. Menjelang akhir 2025, istilah ini telah menyebar begitu luas hingga Collins menobatkannya sebagai Kata Tahun Ini.</p>
<p>Untuk game, penerapannya sangat jelas: Anda mendeskripsikan sebuah game, AI membangunnya, Anda memainkannya dan meminta perubahan, serta biasanya tidak melihat kodenya. Itulah membuat game dengan vibe coding.</p>
<h2 id="mengapa-game-sangat-cocok-untuk-metode-ini" tabindex="-1">Mengapa game sangat cocok untuk metode ini <a class="header-anchor" href="#mengapa-game-sangat-cocok-untuk-metode-ini" aria-label="Permalink to &quot;Mengapa game sangat cocok untuk metode ini&quot;"></a></h2>
<p>Game bersifat visual dan dapat langsung diuji, persis seperti siklus yang didukung oleh vibe coding. Dalam dua detik, Anda dapat melihat apakah lompatan terasa pas atau musuh terlalu cepat, sehingga siklus &quot;katakan sesuatu, jalankan sesuatu&quot; berlangsung singkat dan memuaskan. Bukti terkenalnya pun berupa sebuah game: pada awal 2025, pengembang indie Pieter Levels membuat simulator penerbangan 3D di browser dengan vibe coding hanya dalam beberapa jam menggunakan editor kode AI dan Three.js, tanpa latar belakang pengembangan game, dan game tersebut menjadi viral. (Angka pendapatannya dilaporkan sendiri, jadi jangan langsung menerimanya mentah-mentah, tetapi proses pembuatannya memang nyata dan terdokumentasi dengan baik.)</p>
<h2 id="dua-cara-membuat-game-dengan-vibe-coding" tabindex="-1">Dua cara membuat game dengan vibe coding <a class="header-anchor" href="#dua-cara-membuat-game-dengan-vibe-coding" aria-label="Permalink to &quot;Dua cara membuat game dengan vibe coding&quot;"></a></h2>
<p>Ada dua pendekatan, tergantung seberapa jauh Anda ingin terlibat secara langsung.</p>
<p><strong>Alat pemrograman AI umum.</strong> Cursor, Claude Code, dan GitHub Copilot memungkinkan Anda membuat game dengan cara yang dijelaskan Karpathy: berikan prompt kepada agen pemrograman AI, biasanya dengan kerangka kerja web seperti Three.js, lalu lakukan iterasi. Anda tidak perlu membaca kodenya, tetapi proyek tersebut merupakan basis kode sungguhan yang dapat dibawa ke mana saja. Ini adalah jalur paling fleksibel dan paling canggih, tetapi juga memberi Anda peluang terbesar untuk membuat masalah sendiri.</p>
<p><strong>Alat prompt-ke-game khusus game.</strong> Cinevva, Rosebud, Summer, Replit, dan Nilo mengemas seluruh siklus tersebut dalam lingkungan yang dirancang khusus. Anda mendeskripsikan game, alat tersebut membuat versi yang dapat dimainkan, lalu Anda menyempurnakannya melalui percakapan, dengan aset yang dibuatkan untuk Anda. Ini merupakan jalur masuk termudah dan cara tercepat untuk memperoleh hasil yang dapat dibagikan. <a href="/id/guides/ai-game-generators-2026.html">Perbandingan generator game AI</a> kami menguraikan perbedaan masing-masing alat.</p>
<h2 id="cara-membuat-game-dengan-vibe-coding-langkah-demi-langkah" tabindex="-1">Cara membuat game dengan vibe coding, langkah demi langkah <a class="header-anchor" href="#cara-membuat-game-dengan-vibe-coding-langkah-demi-langkah" aria-label="Permalink to &quot;Cara membuat game dengan vibe coding, langkah demi langkah&quot;"></a></h2>
<ol>
<li><strong>Pilih ide kecil.</strong> Vibe coding paling efektif untuk proyek berskala akhir pekan. Tentukan genre, satu keunikan, dan sebuah tujuan.</li>
<li><strong>Tulis prompt satu kalimat.</strong> &quot;Buat game ular neon yang semakin cepat saat tubuhnya memanjang.&quot; Biarkan alat tersebut membuat versi pertama. Anda dapat <a href="/id/guides/vibe-coding-game-prompts.html">mencoba prompt sekali klik</a> agar tidak perlu memulai dari halaman kosong.</li>
<li><strong>Mainkan, lalu minta satu perubahan.</strong> &quot;Buat lebih cepat,&quot; &quot;tambahkan skor,&quot; &quot;kontrolnya terasa kaku, buat lebih responsif.&quot; Ubah, mainkan, ulangi.</li>
<li><strong>Buat aset dengan memintanya.</strong> &quot;Beri tampilan low-poly,&quot; &quot;tambahkan musik ceria,&quot; &quot;gunakan skybox gurun.&quot;</li>
<li><strong>Publikasikan tautannya.</strong> Alat berbasis browser memungkinkan Anda membagikannya dengan sekali klik. Tunjukkan kepada orang lain dan biarkan reaksi mereka mengarahkan putaran pengembangan berikutnya.</li>
</ol>
<p>Anda dapat <a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_coding_games">mulai membuat game 3D gratis dengan vibe coding di browser</a> sekarang juga jika ingin belajar sambil praktik.</p>
<h2 id="jebakan-dan-cara-menghindarinya" tabindex="-1">Jebakan (dan cara menghindarinya) <a class="header-anchor" href="#jebakan-dan-cara-menghindarinya" aria-label="Permalink to &quot;Jebakan (dan cara menghindarinya)&quot;"></a></h2>
<p>Vibe coding memang canggih, tetapi gambaran jujur pada 2026 juga menunjukkan sejumlah tanda peringatan nyata:</p>
<ul>
<li><strong>&quot;Hampir benar, tetapi belum sepenuhnya.&quot;</strong> Dua pertiga pengembang menyebut hal ini sebagai sumber frustrasi terbesar mereka terhadap AI. Solusinya untuk game adalah mengajukan permintaan kecil dan spesifik, serta bersedia mengembalikan perubahan ketika hasilnya justru memburuk.</li>
<li><strong>Utang keamanan dan kualitas.</strong> Studi pada 2025 menemukan bahwa sebagian besar sampel kode buatan AI menimbulkan celah keamanan, dan jumlah kode duplikat yang tidak direfaktor terus meningkat. Untuk game sekali pakai, hal ini jarang menjadi masalah; untuk apa pun yang menangani data pengguna atau uang, tinjau kodenya atau minta bantuan seseorang yang mampu melakukannya.</li>
<li><strong>Berhasil sampai tiba-tiba tidak.</strong> Dalam sebuah insiden yang diberitakan secara luas, agen pemrograman AI menghapus basis data produksi selama periode pembekuan kode. Pelajarannya: simpan cadangan, pisahkan eksperimen dari hal-hal penting, dan jangan arahkan agen vibe coding ke sistem yang tidak boleh sampai hilang.</li>
</ul>
<p>Karpathy sendiri kemudian menyebut unggahan awal tersebut sebagai &quot;tweet sekali pakai&quot; dan lebih menyukai istilah yang lebih cermat untuk pekerjaan serius. Kesimpulannya bukan bahwa vibe coding itu buruk, melainkan bahwa metode ini sangat bagus untuk prototipe dan game kecil, tetapi berisiko jika dijadikan satu-satunya metode untuk hal-hal yang harus benar-benar akurat.</p>
<h2 id="apakah-vibe-coding-termasuk-pengembangan-game-yang-sesungguhnya" tabindex="-1">Apakah vibe coding termasuk pengembangan game yang &quot;sesungguhnya&quot;? <a class="header-anchor" href="#apakah-vibe-coding-termasuk-pengembangan-game-yang-sesungguhnya" aria-label="Permalink to &quot;Apakah vibe coding termasuk pengembangan game yang &quot;sesungguhnya&quot;?&quot;"></a></h2>
<p>Ini adalah cara yang nyata dan berguna untuk berkarya, khususnya untuk prototipe, game jam, dan game kecil, serta menjadi pintu masuk pertama bagi banyak orang ke dunia pembuatan game. Namun, ketika taruhannya tinggi, metode ini tidak menggantikan kebutuhan untuk memahami apa yang Anda bangun. Pendekatan paling produktif pada 2026 adalah menggunakan vibe coding untuk bereksplorasi dan membuat prototipe dengan cepat, lalu memperlambat proses dan memahami bagian-bagian yang harus andal. Untuk sebagian besar game browser, keseimbangan tersebut sangat menguntungkan Anda.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-arti-vibe-coding" tabindex="-1">Apa arti vibe coding? <a class="header-anchor" href="#apa-arti-vibe-coding" aria-label="Permalink to &quot;Apa arti vibe coding?&quot;"></a></h3>
<p>Vibe coding adalah proses membangun perangkat lunak dengan menjelaskan keinginan Anda kepada AI dan membiarkannya menulis kode, tanpa meninjau sendiri kode tersebut. Istilah ini dicetuskan oleh Andrej Karpathy pada Februari 2025 dan dinobatkan sebagai Kata Tahun Ini versi Collins pada 2025. Untuk game, ini berarti mendeskripsikan game dengan bahasa sehari-hari dan menyempurnakannya melalui percakapan, alih-alih menulis kode.</p>
<h3 id="bagaimana-cara-mulai-membuat-game-dengan-vibe-coding" tabindex="-1">Bagaimana cara mulai membuat game dengan vibe coding? <a class="header-anchor" href="#bagaimana-cara-mulai-membuat-game-dengan-vibe-coding" aria-label="Permalink to &quot;Bagaimana cara mulai membuat game dengan vibe coding?&quot;"></a></h3>
<p>Pilih ide kecil, deskripsikan dalam satu kalimat kepada alat prompt-ke-game atau editor kode AI, mainkan versi pertamanya, lalu minta satu perubahan pada satu waktu. Kreator game AI berbasis browser merupakan titik awal termudah karena alat tersebut membuat game yang dapat dimainkan dan memungkinkan Anda langsung membagikannya tanpa penyiapan apa pun.</p>
<h3 id="apakah-vibe-coding-cocok-untuk-membuat-game" tabindex="-1">Apakah vibe coding cocok untuk membuat game? <a class="header-anchor" href="#apakah-vibe-coding-cocok-untuk-membuat-game" aria-label="Permalink to &quot;Apakah vibe coding cocok untuk membuat game?&quot;"></a></h3>
<p>Ya, terutama untuk prototipe serta game kecil atau kasual, karena siklus cepat deskripsikan-mainkan-sempurnakan sangat cocok untuk kebutuhan tersebut. Metode ini kurang cocok untuk proyek besar, kompleks, atau yang menuntut akurasi tinggi, karena kode AI yang tidak ditinjau dapat menimbulkan bug dan masalah keamanan. Gunakan metode ini untuk bergerak cepat, lalu tinjau kodenya untuk bagian apa pun yang harus andal.</p>
<h3 id="alat-apa-yang-digunakan-orang-untuk-membuat-game-dengan-vibe-coding" tabindex="-1">Alat apa yang digunakan orang untuk membuat game dengan vibe coding? <a class="header-anchor" href="#alat-apa-yang-digunakan-orang-untuk-membuat-game-dengan-vibe-coding" aria-label="Permalink to &quot;Alat apa yang digunakan orang untuk membuat game dengan vibe coding?&quot;"></a></h3>
<p>Ada dua jenis. Alat pemrograman AI umum seperti Cursor, Claude Code, dan GitHub Copilot (sering kali bersama Three.js untuk web), serta alat prompt-ke-game khusus game seperti Cinevva, Rosebud, Summer, Replit, dan Nilo. Alat khusus game menawarkan jalur masuk yang lebih mudah; alat pemrograman lebih fleksibel.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/ai-game-generators-2026.html">Generator Game AI Terbaik pada 2026</a> — perbandingan alat</li>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Tanpa Pemrograman)</a> — alur kerja langkah demi langkah</li>
<li><a href="/id/guides/3d-browser-game-without-coding.html">Cara Membuat Game Browser 3D Tanpa Pemrograman</a> — jalur pembuatan 3D</li>
<li><a href="/id/guides/vibe-coding-game-prompts.html">Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — prompt untuk memulai</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Game Engine Web Terbaik untuk 2026</a> — untuk membuat game dengan cara tradisional</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/vibe-coding-games-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[WebGPU vs WebGL untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/webgpu-vs-webgl-games</link>
            <guid>https://app.cinevva.com/id/guides/webgpu-vs-webgl-games</guid>
            <pubDate>Tue, 23 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[WebGPU vs WebGL untuk game browser pada 2026 - apa yang berubah, keunggulan masing-masing, dukungan browser setelah Safari 26, dan engine mana yang menggunakannya.]]></description>
            <content:encoded><![CDATA[<h1 id="webgpu-vs-webgl-untuk-game-2026" tabindex="-1">WebGPU vs WebGL untuk Game (2026) <a class="header-anchor" href="#webgpu-vs-webgl-untuk-game-2026" aria-label="Permalink to &quot;WebGPU vs WebGL untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Selama lebih dari satu dekade, WebGL merupakan satu-satunya cara untuk menghadirkan grafis sungguhan di browser. WebGPU adalah penerusnya, dan 2026 menjadi tahun ketika teknologi ini akhirnya dapat digunakan di mana saja. Jika Anda membuat game web dan bingung harus menargetkan yang mana, berikut perbandingan apa adanya: apa yang berubah, di mana masing-masing unggul, dan apa yang sudah digunakan oleh engine Anda.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/grj7uYdCna0" title="Pembaruan WebGL dan WebGPU di 3D on the Web 2025 — The Khronos Group" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">The Khronos Group membahas kondisi WebGL dan WebGPU, termasuk compute shader serta renderer WebGPU di Three.js dan Babylon.js.</div>
<h2 id="versi-singkat" tabindex="-1">Versi singkat <a class="header-anchor" href="#versi-singkat" aria-label="Permalink to &quot;Versi singkat&quot;"></a></h2>
<p>WebGL adalah API grafis berbasis OpenGL ES yang dirancang untuk rendering. WebGPU adalah API modern yang mengikuti model Vulkan, Metal, dan Direct3D 12 serta dirancang untuk rendering sekaligus komputasi GPU umum. WebGPU lebih cepat untuk scene berat, membuka akses ke compute shader (partikel, simulasi, dan culling di GPU), serta memiliki API yang lebih rapi. WebGL lebih tua, lebih sederhana, dan didukung oleh hampir semua perangkat yang ada.</p>
<h2 id="apa-yang-berubah-pada-2026" tabindex="-1">Apa yang berubah pada 2026 <a class="header-anchor" href="#apa-yang-berubah-pada-2026" aria-label="Permalink to &quot;Apa yang berubah pada 2026&quot;"></a></h2>
<p>Kabar utamanya: WebGPU akhirnya tersedia lintas browser. Safari 26 (September 2025) menghadirkan WebGPU di macOS, iPadOS, iOS, dan visionOS, sehingga menutup celah dukungan besar terakhir. Sebelumnya, saran &quot;gunakan saja WebGL karena Safari dan iOS tidak mendukung WebGPU&quot; memang benar. Sekarang tidak lagi. Chrome dan Firefox sudah mendukungnya, jadi sejak 2026 WebGPU berjalan di semua browser utama.</p>
<p>Ini bukan berarti WebGPU menjadi pilihan default di mana-mana. Di sebagian besar engine, fitur ini masih harus diaktifkan secara khusus atau berstatus eksperimental (selengkapnya di bawah), dan WebGL2 tetap menjadi standar dasar yang aman. Namun, hambatan dukungan browser yang sebelumnya menghalangi adopsi WebGPU kini sudah hilang.</p>
<h2 id="perbandingan-langsung" tabindex="-1">Perbandingan langsung <a class="header-anchor" href="#perbandingan-langsung" aria-label="Permalink to &quot;Perbandingan langsung&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>WebGL (2.0)</th>
<th>WebGPU</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Berbasis</strong></td>
<td>OpenGL ES 3.0</td>
<td>Vulkan / Metal / D3D12</td>
</tr>
<tr>
<td><strong>Dirilis</strong></td>
<td>2017 (WebGL 1: 2011)</td>
<td>2023, dukungan browser luas pada 2025-2026</td>
</tr>
<tr>
<td><strong>Compute shader</strong></td>
<td>Tidak</td>
<td>Ya</td>
</tr>
<tr>
<td><strong>Overhead CPU</strong></td>
<td>Lebih tinggi (biaya per draw call)</td>
<td>Lebih rendah (command buffer, lebih sedikit komunikasi dengan driver)</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Kompatibilitas, scene sederhana hingga menengah</td>
<td>Scene berat, banyak objek, komputasi GPU</td>
</tr>
<tr>
<td><strong>Dukungan browser</strong></td>
<td>Universal</td>
<td>Chrome, Firefox, Safari 26+, semua browser seluler utama</td>
</tr>
<tr>
<td><strong>Bahasa shader</strong></td>
<td>GLSL</td>
<td>WGSL</td>
</tr>
<tr>
<td><strong>Ergonomi API</strong></td>
<td>Lebih tua, lebih banyak state global</td>
<td>Modern, eksplisit, lebih panjang</td>
</tr>
</tbody>
</table>
<h2 id="kapan-webgpu-unggul" tabindex="-1">Kapan WebGPU unggul <a class="header-anchor" href="#kapan-webgpu-unggul" aria-label="Permalink to &quot;Kapan WebGPU unggul&quot;"></a></h2>
<ul>
<li><strong>Banyak objek atau draw call.</strong> Overhead CPU WebGPU yang lebih rendah dan fitur seperti multi-draw membuatnya mampu mempertahankan frame rate saat WebGL mulai kewalahan oleh banyaknya draw call.</li>
<li><strong>Komputasi GPU.</strong> Sistem partikel, fisika, culling, pembuatan prosedural, dan 3D Gaussian splatting dapat dijalankan di GPU melalui compute shader. WebGL sama sekali tidak dapat melakukan ini.</li>
<li><strong>Lebih siap menghadapi masa depan.</strong> WebGPU adalah arah perkembangan platform ini; fitur-fitur engine baru semakin sering hadir di sana terlebih dahulu.</li>
</ul>
<h2 id="kapan-webgl-masih-menjadi-pilihan-yang-tepat" tabindex="-1">Kapan WebGL masih menjadi pilihan yang tepat <a class="header-anchor" href="#kapan-webgl-masih-menjadi-pilihan-yang-tepat" aria-label="Permalink to &quot;Kapan WebGL masih menjadi pilihan yang tepat&quot;"></a></h2>
<ul>
<li><strong>Jangkauan maksimum pada perangkat lama atau kelas bawah.</strong> WebGL2 berjalan pada perangkat keras dan versi browser yang mungkin belum memiliki jalur WebGPU yang berfungsi.</li>
<li><strong>2D sederhana dan 3D ringan.</strong> Jika game Anda tidak membebani GPU, WebGL sudah lebih dari cukup dan menghindari kasus-kasus khusus pada driver yang lebih baru.</li>
<li><strong>Anda menginginkan standar dasar paling aman saat ini.</strong> Merilis WebGL2 tanpa logika fallback masih menjadi pilihan dengan risiko terendah untuk audiens luas.</li>
</ul>
<p>Jawaban pragmatis pada 2026 untuk sebagian besar game: gunakan engine yang mendukung keduanya dan memakai WebGPU jika tersedia, dengan fallback otomatis ke WebGL2. Anda mendapatkan kecepatan saat WebGPU tersedia dan kompatibilitas saat tidak tersedia, tanpa harus menulis dua renderer.</p>
<h2 id="apa-yang-sudah-digunakan-oleh-engine-anda" tabindex="-1">Apa yang sudah digunakan oleh engine Anda <a class="header-anchor" href="#apa-yang-sudah-digunakan-oleh-engine-anda" aria-label="Permalink to &quot;Apa yang sudah digunakan oleh engine Anda&quot;"></a></h2>
<p>Berdasarkan <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web kami</a>, berikut posisi engine web utama terkait WebGPU pada 2026:</p>
<ul>
<li><strong>PlayCanvas</strong> memiliki renderer WebGPU yang paling siap untuk produksi di antara berbagai engine web, termasuk rendering Gaussian splat berbasis komputasi.</li>
<li><strong>Three.js</strong> menyediakan renderer WebGPU tanpa konfigurasi (<code>three/webgpu</code>) dengan fallback otomatis ke WebGL2, meskipun ekspor default-nya masih menggunakan WebGL.</li>
<li><strong>Babylon.js</strong> mendukung WebGPU (aktifkan <code>WebGPUEngine</code>); versi 8 memangkas ukuran build WebGPU hingga separuhnya, sedangkan Babylon.js 9.0 (Maret 2026) melangkah lebih jauh dengan clustered lighting pada kedua backend serta pencahayaan volumetrik yang dibangun di atas compute shader WebGPU.</li>
<li><strong>Godot</strong> belum mendukung WebGPU. Ekspor web di versi 4.7 masih hanya menggunakan WebGL2, meskipun build wasm64 kini menghapus batas memori lama sebesar 4 GB.</li>
<li><strong>Cocos Creator</strong> memiliki dukungan WebGPU eksperimental melalui pipeline rendering barunya.</li>
<li><strong>Unity</strong> mempertahankan WebGPU sebagai fitur eksperimental dan WebGL2 sebagai target web default.</li>
<li><strong>Phaser 4</strong> adalah penulisan ulang berbasis WebGL2 yang belum mendukung WebGPU; <strong>PixiJS</strong> mendukung WebGPU, tetapi menggunakan WebGL secara default.</li>
</ul>
<p>Jadi, dalam praktiknya, engine biasanya mengambil keputusan antara WebGPU atau WebGL untuk Anda, dan engine yang bagus akan beralih ke fallback secara otomatis.</p>
<h2 id="ringkasan-dukungan-browser-2026" tabindex="-1">Ringkasan dukungan browser (2026) <a class="header-anchor" href="#ringkasan-dukungan-browser-2026" aria-label="Permalink to &quot;Ringkasan dukungan browser (2026)&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Fitur</th>
<th>Chrome</th>
<th>Firefox</th>
<th>Safari</th>
<th>Seluler</th>
</tr>
</thead>
<tbody>
<tr>
<td>WebGL 2.0</td>
<td>✅</td>
<td>✅</td>
<td>✅</td>
<td>✅</td>
</tr>
<tr>
<td>WebGPU</td>
<td>✅</td>
<td>✅</td>
<td>✅ Safari 26+</td>
<td>✅ iOS/iPadOS 26+</td>
</tr>
</tbody>
</table>
<p>Selalu lakukan pengujian di Safari/iOS jika Anda menargetkan audiens luas, dan pertahankan fallback WebGL2 untuk sebagian kecil perangkat lama yang masih digunakan.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-webgpu-lebih-baik-daripada-webgl-untuk-game" tabindex="-1">Apakah WebGPU lebih baik daripada WebGL untuk game? <a class="header-anchor" href="#apakah-webgpu-lebih-baik-daripada-webgl-untuk-game" aria-label="Permalink to &quot;Apakah WebGPU lebih baik daripada WebGL untuk game?&quot;"></a></h3>
<p>Untuk game yang berat, ya: WebGPU memiliki overhead CPU yang lebih rendah, menangani lebih banyak objek, dan menambahkan compute shader untuk efek yang tidak dapat dibuat dengan WebGL. Untuk 2D sederhana atau 3D ringan, WebGL2 masih lebih dari cukup dan memiliki dukungan lebih luas pada perangkat lama. Pendekatan terbaik pada 2026 adalah menggunakan engine yang memakai WebGPU jika tersedia dan secara otomatis beralih ke WebGL2 sebagai fallback.</p>
<h3 id="apakah-webgpu-berfungsi-di-safari-dan-ios-pada-2026" tabindex="-1">Apakah WebGPU berfungsi di Safari dan iOS pada 2026? <a class="header-anchor" href="#apakah-webgpu-berfungsi-di-safari-dan-ios-pada-2026" aria-label="Permalink to &quot;Apakah WebGPU berfungsi di Safari dan iOS pada 2026?&quot;"></a></h3>
<p>Ya. Safari 26, yang dirilis pada September 2025, menambahkan WebGPU di macOS, iPadOS, iOS, dan visionOS. Langkah ini menutup celah besar terakhir, sehingga WebGPU kini berfungsi di Chrome, Firefox, dan Safari, termasuk di perangkat seluler. Perangkat dan versi browser lama mungkin masih belum mendukungnya, jadi tetap sediakan fallback WebGL2.</p>
<h3 id="haruskah-saya-mempelajari-webgpu-atau-webgl-terlebih-dahulu" tabindex="-1">Haruskah saya mempelajari WebGPU atau WebGL terlebih dahulu? <a class="header-anchor" href="#haruskah-saya-mempelajari-webgpu-atau-webgl-terlebih-dahulu" aria-label="Permalink to &quot;Haruskah saya mempelajari WebGPU atau WebGL terlebih dahulu?&quot;"></a></h3>
<p>Jika Anda menggunakan engine game, biasanya Anda tidak perlu menulis kode untuk keduanya secara langsung karena engine yang menanganinya. Jika Anda menulis kode grafis secara manual, WebGPU adalah API yang lebih siap untuk masa depan, tetapi saat ini WebGL memiliki lebih banyak tutorial dan contoh. Banyak developer masih memulai dengan WebGL atau library seperti Three.js, yang kini menawarkan renderer WebGPU ketika Anda siap.</p>
<h3 id="apakah-webgpu-akan-menggantikan-webgl" tabindex="-1">Apakah WebGPU akan menggantikan WebGL? <a class="header-anchor" href="#apakah-webgpu-akan-menggantikan-webgl" aria-label="Permalink to &quot;Apakah WebGPU akan menggantikan WebGL?&quot;"></a></h3>
<p>Pada akhirnya, sebagian besar pengembangan baru akan menargetkan WebGPU, tetapi WebGL tidak akan segera menghilang. WebGL tetap menjadi standar dasar universal untuk perangkat keras lama dan sudah tertanam kuat dalam berbagai alat serta konten yang ada. Akan ada masa tumpang tindih yang panjang ketika engine mendukung keduanya dan memilih salah satunya saat runtime.</p>
<BuildCta
  title="Uji GPU Anda dengan sesuatu yang bisa dimainkan"
  desc="Satu prompt menghasilkan game yang benar-benar mengolah piksel di browser Anda."
  prompt="Buat game tembak-tembakan luar angkasa dengan banyak partikel dan ledakan" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026</a> — perbandingan lengkap, termasuk status WebGPU setiap engine</li>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Game Web pada 2026</a> — WebGL, WebGPU, dan Wasm pada tingkat API</li>
<li><a href="/id/guides/unity-godot-playcanvas-web.html">Unity WebGL vs Godot vs PlayCanvas</a> — tiga engine web 3D utama</li>
<li><a href="/id/guides/playcanvas-vs-threejs.html">PlayCanvas vs Three.js</a> — engine vs library untuk 3D di web</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/webgpu-vs-webgl-games-hero.jpg?v=3" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[100 Ide Prompt Game AI (2026) yang Bisa Anda Buat dengan Sekali Klik]]></title>
            <link>https://app.cinevva.com/id/guides/vibe-coding-game-prompts</link>
            <guid>https://app.cinevva.com/id/guides/vibe-coding-game-prompts</guid>
            <pubDate>Sat, 20 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[100 ide prompt game AI untuk 2026, diurutkan berdasarkan genre. Klik prompt apa pun dan Cinevva akan membuat game 3D yang bisa dimainkan di browser Anda, gratis. Ambil, modifikasi, atau tulis prompt Anda sendiri.]]></description>
            <content:encoded><![CDATA[<h1 id="_100-ide-prompt-game-ai-2026-yang-bisa-anda-buat-dengan-sekali-klik" tabindex="-1">100 Ide Prompt Game AI (2026) yang Bisa Anda Buat dengan Sekali Klik <a class="header-anchor" href="#_100-ide-prompt-game-ai-2026-yang-bisa-anda-buat-dengan-sekali-klik" aria-label="Permalink to &quot;100 Ide Prompt Game AI (2026) yang Bisa Anda Buat dengan Sekali Klik&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juni 2026.</em></p>
<p>Vibe coding adalah cara tercepat untuk membuat game saat ini. Anda cukup menjelaskan keinginan Anda dengan bahasa sehari-hari, lalu AI akan membuatnya. Tidak perlu memasang engine, menulis kode, atau mencari-cari di toko aset. Bagian tersulit sering kali hanyalah menemukan ide, jadi berikut 100 ide yang bisa Anda coba.</p>
<p>Klik prompt mana pun di bawah ini dan Cinevva akan terbuka dengan ide tersebut sudah tertulis, lalu mulai membuat game 3D yang dapat dimainkan, diedit, dan dibagikan. Semuanya berjalan di browser dan bisa dicoba secara gratis. Ambil idenya, ubah satu kata, atau jadikan sebagai titik awal untuk ide Anda sendiri. Baru mengenal konsep ini? Baca <a href="/id/guides/vibe-coding-games.html">apa itu vibe coding</a> atau panduan lengkap <a href="/id/guides/make-a-game-with-ai.html">cara membuat game dengan AI</a>.</p>
<h2 id="_12-favorit-untuk-memulai" tabindex="-1">12 favorit untuk memulai <a class="header-anchor" href="#_12-favorit-untuk-memulai" aria-label="Permalink to &quot;12 favorit untuk memulai&quot;"></a></h2>
<div class="prompt-grid">
<div class="prompt-card">
<strong>Snake neon, tetapi lebih cepat</strong>
<p>Game klasik dengan cahaya neon dan kurva kesulitan yang makin menggigit.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Make%20a%20neon%20snake%20game%20that%20speeds%20up%20as%20you%20grow">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Balapan gokar di gurun</strong>
<p>Lintasan low-poly, boost dari drift, dan catatan waktu putaran untuk dikalahkan.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Build%20a%20low%20poly%20kart%20racer%20on%20a%20desert%20track%20with%20drift%20boosts">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Parkour di pulau terapung</strong>
<p>Sudut pandang orang pertama, melompat antar-pulau tanpa terjatuh.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Make%20a%20first%20person%20parkour%20game%20across%20floating%20islands">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Tower defense melawan slime</strong>
<p>Tempatkan turret dan pertahankan garis depan dari gelombang slime.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Build%20a%20tower%20defense%20where%20I%20place%20turrets%20to%20stop%20waves%20of%20slimes">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Memancing santai saat matahari terbenam</strong>
<p>Danau yang tenang, kail di dalam air, dan tak ada yang perlu diburu-buru.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Make%20a%20cozy%20fishing%20game%20on%20a%20quiet%20lake%20at%20sunset">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Bertahan hidup dari zombi dengan senter</strong>
<p>Tampilan dari atas, amunisi terbatas, dan sorot cahaya dengan jarak pandang terbatas.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Build%20a%20top%20down%20zombie%20survival%20with%20a%20flashlight%20and%20limited%20ammo">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Sandbox fisika balok</strong>
<p>Susun setinggi mungkin, lalu robohkan semuanya.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Make%20a%20physics%20sandbox%20where%20I%20stack%20blocks%20and%20knock%20them%20down">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Runner berirama</strong>
<p>Melompat mengikuti irama atau kehilangan rentetan keberhasilan Anda.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Build%20a%20rhythm%20runner%20where%20I%20jump%20in%20time%20with%20the%20music">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Pertempuran antariksa di antara asteroid</strong>
<p>Ruang angkasa, rudal pelacak, dan bebatuan yang tidak mau menyingkir.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Make%20a%20space%20dogfight%20with%20asteroids%20and%20homing%20missiles">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Platformer pengumpul bintang</strong>
<p>Ambil bintang, buka pintu, lalu temukan ruangan berikutnya.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Build%20a%203D%20platformer%20collecting%20stars%20to%20open%20the%20next%20door">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Mini golf nyeleneh</strong>
<p>Jalur landai, dinding bergerak, dan nilai par yang akan Anda perdebatkan.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Make%20a%20golf%20game%20with%20wacky%20ramps%20and%20moving%20obstacles">Buat gratis →</a>
</div>
<div class="prompt-card">
<strong>Misi siluman pencurian permata</strong>
<p>Menyelinap melewati penjaga, mengambil permata, dan jangan sampai terlihat.</p>
<a class="prompt-go" href="/id/create?utm_source=blog&utm_medium=content&utm_campaign=vibe_prompt_pack#prompt=Build%20a%20stealth%20game%20sneaking%20past%20guards%20to%20steal%20the%20gem">Buat gratis →</a>
</div>
</div>
<h2 id="ide-prompt-lainnya-berdasarkan-genre" tabindex="-1">Ide prompt lainnya berdasarkan genre <a class="header-anchor" href="#ide-prompt-lainnya-berdasarkan-genre" aria-label="Permalink to &quot;Ide prompt lainnya berdasarkan genre&quot;"></a></h2>
<p>Setiap baris di bawah ini dapat diklik. Pilih salah satu dan proses pembuatannya akan dimulai.</p>
<h3 id="platformer-runner" tabindex="-1">Platformer &amp; runner <a class="header-anchor" href="#platformer-runner" aria-label="Permalink to &quot;Platformer &amp; runner&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a 3D platformer collecting coins across moving platforms">Platformer 3D mengumpulkan koin di atas platform bergerak</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an endless runner dodging obstacles that speeds up over time">Endless runner yang makin cepat seiring waktu sambil menghindari rintangan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a wall jumping ninja platformer in a neon city">Platformer ninja dengan lompatan dinding di kota neon</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a double jump platformer where the floor is lava">Platformer lompatan ganda dengan lantai berupa lava</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make an ice physics platformer where everything is slippery">Platformer dengan fisika es yang membuat semuanya licin</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a speedrun platformer with a countdown timer per level">Platformer speedrun dengan penghitung waktu mundur di setiap level</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a gravity flip platformer where you walk on the ceiling">Platformer pembalik gravitasi yang memungkinkan Anda berjalan di langit-langit</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an auto runner where I only control jumping and sliding">Auto-runner yang hanya mengharuskan saya mengendalikan lompatan dan seluncuran</a></li>
</ul>
<h3 id="balapan-berkendara" tabindex="-1">Balapan &amp; berkendara <a class="header-anchor" href="#balapan-berkendara" aria-label="Permalink to &quot;Balapan &amp; berkendara&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a futuristic hover pod race on a glowing track">Balapan pod melayang futuristis di lintasan bercahaya</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an off road rally through muddy hills and jumps">Reli off-road melewati perbukitan berlumpur dan lompatan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a time trial drift game scoring points for long drifts">Game drift uji waktu yang memberikan poin untuk drift panjang</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a top down racer with power ups and oil slicks">Balapan tampilan atas dengan power-up dan tumpahan oli</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a downhill bike ride dodging trees and rocks">Bersepeda menuruni bukit sambil menghindari pohon dan bebatuan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a boat race through a stormy sea with big waves">Balapan perahu melintasi laut berbadai dengan ombak besar</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a delivery driving game beating the clock through traffic">Game mengemudi untuk mengantar barang tepat waktu di tengah lalu lintas</a></li>
</ul>
<h3 id="shooter-aksi" tabindex="-1">Shooter &amp; aksi <a class="header-anchor" href="#shooter-aksi" aria-label="Permalink to &quot;Shooter &amp; aksi&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a wave shooter defending a base from robots">Wave shooter untuk mempertahankan markas dari robot</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a first person arena shooter with jump pads and power weapons">Arena shooter orang pertama dengan jump pad dan senjata kuat</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a twin stick shooter clearing rooms of enemies">Twin-stick shooter untuk menumpas musuh di setiap ruangan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a bullet hell game dodging waves of projectiles">Game bullet hell untuk menghindari gelombang proyektil</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a tank battle in a destructible arena">Pertempuran tank di arena yang dapat dihancurkan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a sword fighting game blocking and countering attacks">Game pertarungan pedang untuk menangkis dan membalas serangan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an archery defense holding a gate against raiders">Pertahanan memanah untuk menjaga gerbang dari para penyerbu</a></li>
</ul>
<h3 id="teka-teki-logika" tabindex="-1">Teka-teki &amp; logika <a class="header-anchor" href="#teka-teki-logika" aria-label="Permalink to &quot;Teka-teki &amp; logika&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a block sliding puzzle to clear a path to the exit">Teka-teki menggeser balok untuk membuka jalan menuju pintu keluar</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a color matching puzzle that clears connected groups">Teka-teki mencocokkan warna untuk membersihkan kelompok yang terhubung</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a portal puzzle where I place two doors to cross gaps">Teka-teki portal yang memungkinkan saya menempatkan dua pintu untuk menyeberangi celah</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a light and mirror puzzle aiming a beam at a target">Teka-teki cahaya dan cermin untuk mengarahkan sinar ke sasaran</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a maze game where the walls shift every few seconds">Game labirin dengan dinding yang bergeser setiap beberapa detik</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a pipe connecting puzzle to route water to a tank">Teka-teki menyambungkan pipa untuk mengalirkan air ke tangki</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a memory game flipping tiles to find matching pairs">Game memori dengan membalik ubin untuk menemukan pasangan yang sama</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a crate pushing puzzle placing boxes onto targets">Game bergaya Sokoban untuk mendorong peti ke sasaran</a></li>
</ul>
<h3 id="bertahan-hidup-horor" tabindex="-1">Bertahan hidup &amp; horor <a class="header-anchor" href="#bertahan-hidup-horor" aria-label="Permalink to &quot;Bertahan hidup &amp; horor&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make an island survival gathering wood and food to last the night">Bertahan hidup di pulau dengan mengumpulkan kayu dan makanan agar selamat semalaman</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a horror game escaping a dark maze while something follows">Game horor untuk melarikan diri dari labirin gelap saat sesuatu membuntuti Anda</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a bunker survival rationing supplies through waves of night">Bertahan hidup di bunker dengan menjatah persediaan sepanjang malam yang penuh ancaman</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an underwater survival managing oxygen while exploring a reef">Bertahan hidup di bawah air dengan mengelola oksigen sambil menjelajahi terumbu karang</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a hide and seek horror in an abandoned house">Horor petak umpet di rumah terbengkalai</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a winter survival keeping a fire lit against the cold">Bertahan hidup pada musim dingin dengan menjaga api tetap menyala untuk melawan hawa dingin</a></li>
</ul>
<h3 id="rpg-petualangan" tabindex="-1">RPG &amp; petualangan <a class="header-anchor" href="#rpg-petualangan" aria-label="Permalink to &quot;RPG &amp; petualangan&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a top down dungeon crawler fighting monsters for loot">Dungeon crawler tampak atas melawan monster demi mendapatkan jarahan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an open field adventure collecting herbs and crafting potions">Petualangan di alam terbuka untuk mengumpulkan herba dan meracik ramuan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a quest game talking to villagers to find a lost relic">Game misi berbicara dengan penduduk desa untuk menemukan relik yang hilang</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a roguelike where each run scrambles the dungeon layout">Roguelike dengan tata letak dungeon yang diacak setiap kali bermain</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a treasure hunt adventure following a map across an island">Petualangan berburu harta karun dengan mengikuti peta melintasi sebuah pulau</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a boss rush game fighting a series of giant creatures">Game boss rush melawan serangkaian makhluk raksasa</a></li>
</ul>
<h3 id="olahraga-arkade" tabindex="-1">Olahraga &amp; arkade <a class="header-anchor" href="#olahraga-arkade" aria-label="Permalink to &quot;Olahraga &amp; arkade&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make an arcade basketball game shooting hoops against the clock">Game basket arkade memasukkan bola ke ring sebelum waktu habis</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a bowling game with trick lanes and bumpers">Game boling dengan lintasan unik dan bumper</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a penalty shootout soccer game aiming past a keeper">Game adu penalti sepak bola dengan menembakkan bola melewati kiper</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a skateboard game chaining tricks for combos">Game skateboard merangkai trik untuk menghasilkan kombo</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a home run derby baseball game timing the swing">Game bisbol home run derby yang mengandalkan ketepatan waktu ayunan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a table tennis game rallying against a tricky opponent">Game tenis meja beradu reli melawan lawan yang sulit ditebak</a></li>
</ul>
<h3 id="santai-kasual" tabindex="-1">Santai &amp; kasual <a class="header-anchor" href="#santai-kasual" aria-label="Permalink to &quot;Santai &amp; kasual&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a cozy farm game planting and harvesting crops">Game pertanian santai untuk menanam dan memanen tanaman</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a cafe game serving drinks to a line of customers">Game kafe menyajikan minuman kepada antrean pelanggan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a garden game arranging plants and decorations">Game taman untuk menata tanaman dan dekorasi</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a pet care game feeding and playing with a creature">Game merawat hewan peliharaan dengan memberi makan dan bermain bersama seekor makhluk</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a cozy cooking game following recipes to plate a dish">Game memasak santai mengikuti resep untuk menyajikan hidangan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a relaxing bird watching game spotting species in a forest">Game mengamati burung yang menenangkan untuk menemukan berbagai spesies di hutan</a></li>
</ul>
<h3 id="sandbox-fisika" tabindex="-1">Sandbox &amp; fisika <a class="header-anchor" href="#sandbox-fisika" aria-label="Permalink to &quot;Sandbox &amp; fisika&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a marble run where I build ramps to reach the goal">Lintasan kelereng tempat saya membangun jalur miring untuk mencapai tujuan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a demolition game knocking down towers with a wrecking ball">Game penghancuran merobohkan menara dengan bola penghancur</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a bridge builder where my bridge has to hold a truck">Game membangun jembatan yang harus mampu menopang sebuah truk</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a ragdoll launch game flinging a character for distance">Game melontarkan ragdoll sejauh mungkin</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a cannon game blasting targets with bouncing balls">Game meriam menghancurkan target dengan bola-bola yang memantul</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a domino toppling sandbox setting off a chain reaction">Sandbox menjatuhkan domino untuk memicu reaksi berantai</a></li>
</ul>
<h3 id="fiksi-ilmiah-luar-angkasa" tabindex="-1">Fiksi ilmiah &amp; luar angkasa <a class="header-anchor" href="#fiksi-ilmiah-luar-angkasa" aria-label="Permalink to &quot;Fiksi ilmiah &amp; luar angkasa&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a spaceship landing game touching down gently on low fuel">Game mendaratkan pesawat luar angkasa dengan lembut saat bahan bakar hampir habis</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an asteroid mining game collecting ore and dodging rocks">Game menambang asteroid sambil mengumpulkan bijih dan menghindari bebatuan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a zero gravity station where I float between handholds">Stasiun tanpa gravitasi tempat saya melayang dari satu pegangan ke pegangan lain</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an alien planet explorer scanning strange creatures">Penjelajahan planet alien untuk memindai makhluk-makhluk aneh</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a wormhole runner steering through a tunnel of light">Game endless runner wormhole mengendalikan arah melalui terowongan cahaya</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a rover game driving across a crater filled moon">Game rover berkendara melintasi bulan yang dipenuhi kawah</a></li>
</ul>
<h3 id="strategi-tower-defense" tabindex="-1">Strategi &amp; tower defense <a class="header-anchor" href="#strategi-tower-defense" aria-label="Permalink to &quot;Strategi &amp; tower defense&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a tower defense where towers can be upgraded between waves">Tower defense dengan menara yang dapat ditingkatkan di antara gelombang serangan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a base builder placing walls and turrets before a raid">Game membangun markas dengan menempatkan tembok dan turet sebelum penyerbuan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a resource game balancing food wood and gold to grow a town">Game sumber daya yang menyeimbangkan makanan, kayu, dan emas untuk mengembangkan kota</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a maze tower defense where I shape the path enemies take">Tower defense labirin tempat saya membentuk jalur yang dilalui musuh</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a lane defense sending units to push toward the enemy base">Pertahanan jalur dengan mengirim unit untuk mendesak menuju markas musuh</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build an auto battler arranging a team that fights on its own">Auto-battler untuk menyusun tim yang bertarung sendiri</a></li>
</ul>
<h3 id="terbang-penerbangan" tabindex="-1">Terbang &amp; penerbangan <a class="header-anchor" href="#terbang-penerbangan" aria-label="Permalink to &quot;Terbang &amp; penerbangan&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a flight sim gliding through canyons and arches">Simulator penerbangan meluncur melewati ngarai dan lengkungan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a hot air balloon game drifting between rings in the sky">Game balon udara melayang melewati cincin-cincin di langit</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a wingsuit dive threading through narrow gaps">Terjun dengan wingsuit menerobos celah-celah sempit</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a paper airplane game catching wind currents for distance">Game pesawat kertas memanfaatkan arus angin untuk terbang sejauh mungkin</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a dragon flight game swooping to grab coins midair">Game menerbangkan naga yang menukik untuk mengambil koin di udara</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a helicopter rescue lifting survivors off rooftops">Penyelamatan dengan helikopter untuk mengangkat penyintas dari atap bangunan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a jetpack game burning fuel to climb past obstacles">Game jetpack menggunakan bahan bakar untuk terbang melewati rintangan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a bird flocking game leading a flock through gates">Game memimpin kawanan burung melewati gerbang-gerbang</a></li>
</ul>
<h3 id="unik-eksperimental" tabindex="-1">Unik &amp; eksperimental <a class="header-anchor" href="#unik-eksperimental" aria-label="Permalink to &quot;Unik &amp; eksperimental&quot;"></a></h3>
<ul>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a game where you play as a rolling ball growing bigger by absorbing objects">Game tempat Anda bermain sebagai bola menggelinding yang membesar dengan menyerap berbagai benda</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a game where gravity points wherever I click">Game dengan arah gravitasi mengikuti lokasi yang saya klik</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a game played entirely in one rotating room">Game yang seluruhnya berlangsung di dalam satu ruangan berputar</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a game where the screen shrinks as time runs out">Game dengan layar yang menyusut seiring waktu habis</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a game where you control two characters at once">Game tempat Anda mengendalikan dua karakter sekaligus</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a game where painting the floor is how you score">Game tempat Anda memperoleh skor dengan mengecat lantai</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Make a game where the world is made of stacked cubes you can remove">Game dengan dunia dari susunan kubus yang dapat Anda singkirkan</a></li>
<li><a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack#prompt=Build a game where you grow a tower as tall as possible before it topples">Game membangun menara setinggi mungkin sebelum roboh</a></li>
</ul>
<h2 id="cara-menulis-prompt-anda-sendiri" tabindex="-1">Cara menulis prompt Anda sendiri <a class="header-anchor" href="#cara-menulis-prompt-anda-sendiri" aria-label="Permalink to &quot;Cara menulis prompt Anda sendiri&quot;"></a></h2>
<p>Prompt di atas sengaja dibuat singkat. Anda tidak perlu menjelaskan setiap aturan secara terperinci. Sebutkan jenis game, satu hal yang membuatnya khas, dan sebuah tujuan, lalu AI akan melengkapi sisanya. Setelah game berjalan, beri tahu AI apa yang ingin Anda ubah. Untuk mempelajari alur kerjanya lebih lanjut, baca <a href="/id/guides/make-a-game-with-ai.html">cara membuat game dengan AI</a>.</p>
<p>Lebih suka memulai dari kanvas kosong? <a href="/id/create.html?utm_source=blog&amp;utm_medium=content&amp;utm_campaign=vibe_prompt_pack">Buka kreator</a> dan ketik ide Anda sendiri.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bagaimana-cara-menulis-prompt-game-ai-yang-bagus" tabindex="-1">Bagaimana cara menulis prompt game AI yang bagus? <a class="header-anchor" href="#bagaimana-cara-menulis-prompt-game-ai-yang-bagus" aria-label="Permalink to &quot;Bagaimana cara menulis prompt game AI yang bagus?&quot;"></a></h3>
<p>Buat prompt dalam satu kalimat dan sebutkan tiga hal: genre, satu detail yang membuat game tersebut khas, dan tujuan yang jelas. &quot;Game parkour orang pertama melintasi pulau-pulau terapung untuk berpacu melawan waktu&quot; jauh lebih efektif daripada &quot;game 3D yang seru&quot;, karena memberi AI gambaran konkret untuk dibuat. Sempurnakan hasilnya dengan meminta satu perubahan setiap kali.</p>
<h3 id="apakah-prompt-game-ai-ini-gratis-untuk-digunakan" tabindex="-1">Apakah prompt game AI ini gratis untuk digunakan? <a class="header-anchor" href="#apakah-prompt-game-ai-ini-gratis-untuk-digunakan" aria-label="Permalink to &quot;Apakah prompt game AI ini gratis untuk digunakan?&quot;"></a></h3>
<p>Ya. Setiap prompt di halaman ini dapat dibuat secara gratis di browser, dan Anda bisa mengedit hasilnya serta membagikan tautan ke game Anda. Pembuatan gratis memiliki batasan, sedangkan penggunaan komersial game yang telah selesai bergantung pada paket dan aset yang digunakan. Jadi, periksa ketentuannya sebelum menjual apa pun.</p>
<h3 id="bisakah-ai-membuat-game-3d-dari-salah-satu-prompt-ini" tabindex="-1">Bisakah AI membuat game 3D dari salah satu prompt ini? <a class="header-anchor" href="#bisakah-ai-membuat-game-3d-dari-salah-satu-prompt-ini" aria-label="Permalink to &quot;Bisakah AI membuat game 3D dari salah satu prompt ini?&quot;"></a></h3>
<p>Ya. Setiap prompt di sini dirancang untuk menghasilkan game 3D yang dapat dimainkan di browser. Versi pertama merupakan titik awal yang dapat Anda sempurnakan melalui percakapan dengan meminta mekanik, karya visual, suara, dan penyesuaian tingkat kesulitan baru hingga hasilnya terasa tepat.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/make-a-game-with-ai.html">Cara Membuat Game dengan AI (Tanpa Coding)</a> — alur kerja lengkap</li>
<li><a href="/id/guides/vibe-coding-games.html">Vibe Coding Game: Pengertian dan Cara Memulainya</a> — penjelasan tentang pendekatan ini</li>
<li><a href="/id/guides/ai-game-generators-2026.html">Generator Game AI Terbaik pada 2026</a> — perbandingan berbagai alat</li>
<li><a href="/id/guides/3d-browser-game-without-coding.html">Cara Membuat Game Browser 3D Tanpa Coding</a> — pembahasan mendalam tentang cara membuat game 3D</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/vibe-coding-game-prompts-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Engine Game Open Source Terbaik untuk 2026]]></title>
            <link>https://app.cinevva.com/id/guides/open-source-game-engines-2026</link>
            <guid>https://app.cinevva.com/id/guides/open-source-game-engines-2026</guid>
            <pubDate>Thu, 18 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Daftar lengkap engine game open source terbaik untuk 2026 - Godot, Phaser, PixiJS, Defold, Bevy, Three.js, Babylon.js, dan lainnya, lengkap dengan lisensi, bahasa, ekspor web, serta pilihan untuk setiap kebutuhan.]]></description>
            <content:encoded><![CDATA[<h1 id="engine-game-open-source-terbaik-untuk-2026" tabindex="-1">Engine Game Open Source Terbaik untuk 2026 <a class="header-anchor" href="#engine-game-open-source-terbaik-untuk-2026" aria-label="Permalink to &quot;Engine Game Open Source Terbaik untuk 2026&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/open-source-game-engines-hero.jpg?v=2" alt="Engine game open source terbaik untuk 2026" style="width:100%;border-radius:10px">
</figure>
<p>Engine game open source memberi Anda sesuatu yang tidak bisa diberikan engine proprietari: lisensi yang tidak akan berubah setelah game dirilis. Tidak ada biaya per pengguna, ambang pendapatan, atau perubahan harga yang mengejutkan. Anda dapat membaca kode sumbernya, membuat fork, dan terus mengembangkan meskipun tim aslinya berhenti. Setelah <a href="/id/news/2024-09-12-unity-runtime-fee-cancelled.html">kasus Unity Runtime Fee</a>, stabilitas itulah yang membuat banyak tim beralih ke open source sejak awal.</p>
<p>Ini adalah daftar lengkap engine game open source yang layak digunakan pada 2026, dikelompokkan berdasarkan kegunaannya. Jika Anda secara khusus membutuhkan build web, kami telah menandai engine yang dapat diekspor ke browser. Anda juga dapat mempelajarinya lebih lanjut dalam <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web terbaik</a>.</p>
<h2 id="perbandingan-singkat" tabindex="-1">Perbandingan singkat <a class="header-anchor" href="#perbandingan-singkat" aria-label="Permalink to &quot;Perbandingan singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Engine</th>
<th>Lisensi</th>
<th>Bahasa</th>
<th>2D / 3D</th>
<th>Ekspor web</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/id/guides/godot-vs-unity-web-games.html"><strong>Godot</strong></a></td>
<td>MIT</td>
<td>GDScript, C#</td>
<td>Keduanya</td>
<td>Ya (GDScript)</td>
<td>Engine gratis serbaguna</td>
</tr>
<tr>
<td><strong>Phaser</strong></td>
<td>MIT</td>
<td>JavaScript</td>
<td>2D</td>
<td>Ya</td>
<td>Game web 2D</td>
</tr>
<tr>
<td><strong>PixiJS</strong></td>
<td>MIT</td>
<td>JavaScript</td>
<td>2D</td>
<td>Ya</td>
<td>Rendering 2D khusus</td>
</tr>
<tr>
<td><strong>Three.js</strong></td>
<td>MIT</td>
<td>JS / TS</td>
<td>3D</td>
<td>Ya</td>
<td>3D web, kontrol maksimal</td>
</tr>
<tr>
<td><strong>Babylon.js</strong></td>
<td>Apache 2.0</td>
<td>JS / TS</td>
<td>3D</td>
<td>Ya</td>
<td>3D web berfitur lengkap</td>
</tr>
<tr>
<td><strong>Defold</strong></td>
<td>Gratis, kode sumber tersedia</td>
<td>Lua</td>
<td>2D / 3D ringan</td>
<td>Ya</td>
<td>Build web terkecil</td>
</tr>
<tr>
<td><strong>Excalibur.js</strong></td>
<td>BSD</td>
<td>TypeScript</td>
<td>2D</td>
<td>Ya</td>
<td>Game 2D dengan TypeScript</td>
</tr>
<tr>
<td><strong>Bevy</strong></td>
<td>MIT / Apache 2.0</td>
<td>Rust</td>
<td>Keduanya</td>
<td>Ya (Wasm)</td>
<td>Rust, desain berbasis data</td>
</tr>
<tr>
<td><strong>LÖVE</strong></td>
<td>zlib</td>
<td>Lua</td>
<td>2D</td>
<td>Terbatas</td>
<td>Prototipe 2D cepat</td>
</tr>
<tr>
<td><strong>Cocos Creator</strong></td>
<td>Runtime MIT</td>
<td>TypeScript</td>
<td>Keduanya</td>
<td>Ya</td>
<td>Mini-game, pasar Asia</td>
</tr>
<tr>
<td><strong>O3DE</strong></td>
<td>Apache 2.0</td>
<td>C++, Lua</td>
<td>3D</td>
<td>Tidak</td>
<td>3D skala besar, lingkup AAA</td>
</tr>
</tbody>
</table>
<p>Tidak ada satu engine open source yang &quot;terbaik&quot; untuk semua kebutuhan. Pilihan yang tepat bergantung pada 2D atau 3D, bahasa yang Anda gunakan, dan apakah target Anda adalah web.</p>
<h2 id="engine-2d-dan-3d-lengkap" tabindex="-1">Engine 2D dan 3D lengkap <a class="header-anchor" href="#engine-2d-dan-3d-lengkap" aria-label="Permalink to &quot;Engine 2D dan 3D lengkap&quot;"></a></h2>
<h3 id="godot" tabindex="-1">Godot <a class="header-anchor" href="#godot" aria-label="Permalink to &quot;Godot&quot;"></a></h3>
<p>Godot adalah engine yang paling sering dimaksud ketika orang menyebut &quot;engine game open source&quot;. Engine ini berlisensi MIT, mendukung 2D dan 3D, serta tidak mengenakan biaya atau batas pendapatan apa pun. Godot menghasilkan build web berukuran kecil (sekitar 5 MB dengan Brotli atau 9 MB dengan gzip), dan sejak versi 4.3 dapat mengekspor build single-thread agar mendukung iOS dan Safari dengan baik. Satu keterbatasan untuk web adalah proyek C# belum dapat diekspor ke browser, hanya GDScript. Bagi kebanyakan tim yang beralih dari engine proprietari, Godot merupakan pengganti serbaguna yang paling mendekati. Lihat <a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk game web</a> untuk perbandingan langsung.</p>
<h3 id="cocos-creator" tabindex="-1">Cocos Creator <a class="header-anchor" href="#cocos-creator" aria-label="Permalink to &quot;Cocos Creator&quot;"></a></h3>
<p>Cocos Creator memadukan editor gratis dengan runtime open source (MIT). Engine ini mendukung 2D dan 3D, WebGL, WebGPU, dan Wasm, serta sangat unggul untuk platform mini-game seperti WeChat dan TikTok yang sangat mementingkan ukuran build. Ukuran build-nya sekitar 2 hingga 4 MB.</p>
<h2 id="library-dan-engine-3d-untuk-web" tabindex="-1">Library dan engine 3D untuk web <a class="header-anchor" href="#library-dan-engine-3d-untuk-web" aria-label="Permalink to &quot;Library dan engine 3D untuk web&quot;"></a></h2>
<h3 id="three-js" tabindex="-1">Three.js <a class="header-anchor" href="#three-js" aria-label="Permalink to &quot;Three.js&quot;"></a></h3>
<p>Three.js adalah library 3D yang paling banyak digunakan di web, berlisensi MIT, dengan ukuran inti sekitar 150 KB. Three.js merupakan library rendering, bukan engine lengkap, sehingga Anda perlu menambahkan sistem game sendiri atau menggunakan framework di atasnya. Inilah komprominya: kontrol maksimal dan ukuran sekecil mungkin, tetapi Anda harus menulis lebih banyak sendiri. Three.js menjadi fondasi yang kami gunakan untuk membangun <a href="/id/engine.html">Cinevva Engine</a>, dengan menambahkan kembali berbagai sistem game agar Anda tidak perlu memulai dari kanvas kosong.</p>
<h3 id="babylon-js" tabindex="-1">Babylon.js <a class="header-anchor" href="#babylon-js" aria-label="Permalink to &quot;Babylon.js&quot;"></a></h3>
<p>Babylon.js adalah engine 3D open source lengkap (Apache 2.0) dengan fisika, animasi, pemeriksa scene, serta dukungan WebGPU dan WGSL yang kuat. Dibandingkan Three.js, Babylon.js menyediakan lebih banyak fitur siap pakai dengan ukuran yang lebih besar. Lihat <a href="/id/guides/threejs-vs-babylonjs.html">Three.js vs Babylon.js</a> untuk mengetahui mana yang paling sesuai dengan proyek Anda.</p>
<h2 id="framework-2d" tabindex="-1">Framework 2D <a class="header-anchor" href="#framework-2d" aria-label="Permalink to &quot;Framework 2D&quot;"></a></h2>
<h3 id="phaser" tabindex="-1">Phaser <a class="header-anchor" href="#phaser" aria-label="Permalink to &quot;Phaser&quot;"></a></h3>
<p>Phaser adalah framework game HTML5 open source paling populer, berlisensi MIT, dengan komunitas dan ekosistem web 2D terbesar. Ukuran build-nya sekitar 500 KB. Jika game Anda 2D dan Anda menggunakan JavaScript, Phaser sulit ditandingi.</p>
<h3 id="pixijs" tabindex="-1">PixiJS <a class="header-anchor" href="#pixijs" aria-label="Permalink to &quot;PixiJS&quot;"></a></h3>
<p>PixiJS adalah renderer WebGL 2D yang cepat (MIT), dengan ukuran sekitar 200 KB. Seperti Three.js untuk 3D, PixiJS merupakan renderer, bukan engine lengkap, sehingga Anda perlu menyediakan logika game sendiri. Pilih PixiJS jika Anda menginginkan rendering 2D khusus dengan ukuran yang sangat kecil.</p>
<h3 id="excalibur-js" tabindex="-1">Excalibur.js <a class="header-anchor" href="#excalibur-js" aria-label="Permalink to &quot;Excalibur.js&quot;"></a></h3>
<p>Excalibur.js adalah engine 2D ramah pemula berlisensi BSD yang ditulis dalam TypeScript, dengan ukuran sekitar 300 KB dan lebih banyak fitur game bawaan daripada renderer dasar. Pilihan yang cocok jika Anda menginginkan type safety dan kurva belajar yang landai.</p>
<h3 id="love-love2d" tabindex="-1">LÖVE (Love2D) <a class="header-anchor" href="#love-love2d" aria-label="Permalink to &quot;LÖVE (Love2D)&quot;"></a></h3>
<p>LÖVE adalah framework 2D berlisensi zlib yang telah lama dikembangkan dan menggunakan Lua untuk scripting. Framework ini disukai karena memungkinkan pembuatan prototipe cepat dan cocok untuk game jam di desktop. Ekspor web tersedia melalui love.js, tetapi terbatas, jadi anggap LÖVE sebagai alat yang mengutamakan desktop.</p>
<h2 id="rust-c-dan-engine-skala-besar" tabindex="-1">Rust, C++, dan engine skala besar <a class="header-anchor" href="#rust-c-dan-engine-skala-besar" aria-label="Permalink to &quot;Rust, C++, dan engine skala besar&quot;"></a></h2>
<h3 id="bevy" tabindex="-1">Bevy <a class="header-anchor" href="#bevy" aria-label="Permalink to &quot;Bevy&quot;"></a></h3>
<p>Bevy adalah engine modern berbasis data yang ditulis dalam Rust serta memiliki lisensi ganda MIT dan Apache 2.0. Arsitektur entity-component-system miliknya menjadi daya tarik utama, dan engine ini dapat dikompilasi ke WebAssembly untuk build browser. Bevy lebih muda daripada engine lainnya dan berkembang cepat, jadi bersiaplah menghadapi perubahan yang tidak kompatibel antaversi. Meski demikian, momentumnya sangat kuat pada 2026.</p>
<h3 id="open-3d-engine-o3de" tabindex="-1">Open 3D Engine (O3DE) <a class="header-anchor" href="#open-3d-engine-o3de" aria-label="Permalink to &quot;Open 3D Engine (O3DE)&quot;"></a></h3>
<p>O3DE adalah proyek Linux Foundation (Apache 2.0) untuk pembuatan 3D skala besar dengan fidelitas tinggi, yang didukung oleh AWS dan pihak lainnya. Ini adalah engine kelas berat yang serius bagi tim dengan ambisi AAA dan sumber daya yang sepadan. O3DE tidak menargetkan browser.</p>
<h2 id="cara-memilih" tabindex="-1">Cara memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara memilih&quot;"></a></h2>
<ul>
<li><strong>Menginginkan satu engine gratis untuk hampir semua kebutuhan?</strong> Godot.</li>
<li><strong>Membuat game web 2D?</strong> Phaser, atau PixiJS/Excalibur.js untuk rendering khusus.</li>
<li><strong>Membuat game 3D web?</strong> Three.js untuk kontrol dan ukuran, Babylon.js untuk fitur lengkap siap pakai.</li>
<li><strong>Menginginkan build web sekecil mungkin?</strong> Defold.</li>
<li><strong>Menargetkan platform mini-game?</strong> Cocos Creator.</li>
<li><strong>Menyukai Rust dan ECS?</strong> Bevy.</li>
<li><strong>Membuat 3D skala besar dengan fidelitas tinggi?</strong> O3DE.</li>
</ul>
<p>Jika web adalah target Anda, setiap engine di atas kecuali O3DE dan (sebagian besar) LÖVE dapat menghasilkan build browser. Untuk pembahasan lengkap yang secara khusus berfokus pada web, lihat <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web</a> dan panduan kami mengenai <a href="/id/guides/unity-alternatives-web-games.html">alternatif Unity untuk game web</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-engine-game-open-source-terbaik-pada-2026" tabindex="-1">Apa engine game open source terbaik pada 2026? <a class="header-anchor" href="#apa-engine-game-open-source-terbaik-pada-2026" aria-label="Permalink to &quot;Apa engine game open source terbaik pada 2026?&quot;"></a></h3>
<p>Bagi kebanyakan orang, jawabannya adalah Godot: berlisensi MIT, gratis tanpa batas pendapatan, serta mumpuni untuk 2D dan 3D dengan ekspor web yang baik. Khusus untuk web 2D, Phaser adalah pilihan open source paling populer. Untuk 3D web, pilihannya adalah Three.js (library) atau Babylon.js (engine lengkap). Pilihan terbaik bergantung pada dimensi, bahasa, dan platform.</p>
<h3 id="apakah-godot-benar-benar-gratis-tanpa-syarat-tersembunyi" tabindex="-1">Apakah Godot benar-benar gratis tanpa syarat tersembunyi? <a class="header-anchor" href="#apakah-godot-benar-benar-gratis-tanpa-syarat-tersembunyi" aria-label="Permalink to &quot;Apakah Godot benar-benar gratis tanpa syarat tersembunyi?&quot;"></a></h3>
<p>Ya. Godot dirilis di bawah lisensi MIT, yang berarti tidak ada biaya, royalti, ambang pendapatan, atau biaya per pengguna, selamanya. Anda dapat menggunakannya untuk game komersial dan bahkan memodifikasi engine itu sendiri. Proyek ini didanai melalui donasi dan sponsor, bukan dengan membebankan biaya kepada developer.</p>
<h3 id="apakah-engine-game-open-source-cukup-bagus-untuk-game-komersial" tabindex="-1">Apakah engine game open source cukup bagus untuk game komersial? <a class="header-anchor" href="#apakah-engine-game-open-source-cukup-bagus-untuk-game-komersial" aria-label="Permalink to &quot;Apakah engine game open source cukup bagus untuk game komersial?&quot;"></a></h3>
<p>Ya. Banyak game yang sukses secara komersial dirilis menggunakan engine open source, dan sifatnya yang open source berarti tidak ada batas pendapatan yang perlu dikhawatirkan. Komprominya biasanya berupa marketplace aset bawaan yang lebih kecil dan, pada beberapa engine, lebih sedikit fitur siap pakai dibandingkan engine proprietari besar. Khusus untuk game web, engine open source sering kali menghasilkan build yang lebih kecil dan lebih cepat.</p>
<h3 id="apakah-unity-atau-unreal-bersifat-open-source" tabindex="-1">Apakah Unity atau Unreal bersifat open source? <a class="header-anchor" href="#apakah-unity-atau-unreal-bersifat-open-source" aria-label="Permalink to &quot;Apakah Unity atau Unreal bersifat open source?&quot;"></a></h3>
<p>Tidak. Unity bersifat closed source dan menggunakan sistem langganan. Kode sumber Unreal Engine tersedia (Anda dapat membaca dan memodifikasi kodenya dengan sebuah akun), tetapi engine ini bukan open source dan menggunakan model royalti setelah melewati ambang pendapatan tertentu. Jika Anda secara khusus menginginkan engine open source, Godot adalah padanan yang paling mendekati Unity. <a href="/id/guides/unity-alternatives-web-games.html">Panduan alternatif Unity</a> kami membahas pilihan lainnya.</p>
<h3 id="engine-game-open-source-mana-yang-terbaik-untuk-web" tabindex="-1">Engine game open source mana yang terbaik untuk web? <a class="header-anchor" href="#engine-game-open-source-mana-yang-terbaik-untuk-web" aria-label="Permalink to &quot;Engine game open source mana yang terbaik untuk web?&quot;"></a></h3>
<p>Godot untuk engine 2D/3D serbaguna, Phaser untuk 2D, serta Three.js atau Babylon.js untuk 3D. Defold menghasilkan build web terkecil di antara semua engine lengkap. Semuanya gratis dan open source. <a href="/id/guides/web-game-engines-comparison.html">Perbandingan engine game web</a> kami memberi peringkat berdasarkan ukuran build, waktu pemuatan, dan dukungan browser.</p>
<BuildCta
  title="Engine gratis memang hebat. Gratis dan tanpa penyiapan jauh lebih cepat"
  desc="Coba idenya terlebih dahulu, lalu gunakan engine ketika proyek Anda berkembang melampauinya."
  prompt="Buat dungeon crawler retro dengan obor dan kerangka" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Dibandingkan)</a> — diperingkat berdasarkan ukuran build, waktu pemuatan, dan biaya</li>
<li><a href="/id/guides/unity-alternatives-web-games.html">Alternatif Unity untuk Game Web</a> — pilihan open source untuk tim yang meninggalkan Unity</li>
<li><a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk Game Web</a> — perbandingan langsung dengan pengganti open source yang paling mendekati</li>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — jika game Anda berbentuk 2D</li>
<li><a href="/id/guides/threejs-vs-babylonjs.html">Three.js vs Babylon.js</a> — dua library 3D web open source utama</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine open source kami yang mengutamakan web dan dibangun di atas Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/open-source-game-engines-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Alternatif Unity untuk Game Web (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/unity-alternatives-web-games</link>
            <guid>https://app.cinevva.com/id/guides/unity-alternatives-web-games</guid>
            <pubDate>Thu, 11 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Alternatif Unity terbaik untuk game browser pada 2026 - Godot, PlayCanvas, Three.js, Defold, Cocos, Phaser, dan lainnya, dibandingkan berdasarkan ekspor web, ukuran build, bahasa, dan biaya, lengkap dengan pilihan sesuai alasan Anda meninggalkan Unity.]]></description>
            <content:encoded><![CDATA[<h1 id="alternatif-unity-untuk-game-web-2026" tabindex="-1">Alternatif Unity untuk Game Web (2026) <a class="header-anchor" href="#alternatif-unity-untuk-game-web-2026" aria-label="Permalink to &quot;Alternatif Unity untuk Game Web (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/unity-alternatives-web-hero.jpg?v=2" alt="Alternatif Unity untuk game web pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Unity dapat mengekspor ke web, tetapi build WebGL-nya berat, perubahan harganya membuat developer kelimpungan sejak 2023, dan untuk game yang mengutamakan browser, Unity jarang menjadi pilihan paling ringan. Jika Anda mencari alternatif Unity khusus untuk game web, panduan ini membahas engine yang benar-benar menghasilkan build browser kecil dan cepat pada 2026, serta mana yang sebaiknya dipilih berdasarkan alasan Anda meninggalkan Unity.</p>
<p>Jika Anda ingin melihat seluruh pilihannya secara berdampingan, mulailah dengan <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web terbaik untuk 2026</a>. Halaman ini khusus membahas pengganti Unity untuk web.</p>
<h2 id="mengapa-developer-mencari-alternatif-unity" tabindex="-1">Mengapa developer mencari alternatif Unity <a class="header-anchor" href="#mengapa-developer-mencari-alternatif-unity" aria-label="Permalink to &quot;Mengapa developer mencari alternatif Unity&quot;"></a></h2>
<p>Ada beberapa alasan yang terus muncul:</p>
<ul>
<li><strong>Kepercayaan terhadap harga.</strong> <a href="/id/news/2024-09-12-unity-runtime-fee-cancelled.html">Unity Runtime Fee</a> dibatalkan pada September 2024 dan belum diberlakukan kembali, tetapi kebijakan itu mengajarkan banyak tim untuk membuat rencana dengan mempertimbangkan pertanyaan, &quot;bagaimana jika ketentuannya berubah lagi?&quot; Engine dengan lisensi yang tidak dapat diubah harganya akan menghilangkan risiko tersebut.</li>
<li><strong>Ukuran build web.</strong> Build WebGL kosong dari Unity mulai dari sekitar 8 hingga 11 MB. Engine web-native menghasilkan build dalam kisaran 1 hingga 5 MB, yang dampaknya langsung dirasakan pemain pada waktu muat.</li>
<li><strong>Dukungan browser seluler.</strong> Unity WebGL di ponsel sejak dulu cenderung bermasalah. Engine yang lebih ringan dan dibuat untuk web bekerja lebih baik di Safari dan Chrome versi seluler.</li>
<li><strong>Sumber terbuka.</strong> Sebagian tim menginginkan basis kode yang dapat mereka baca, fork, dan andalkan tanpa bergantung pada vendor.</li>
</ul>
<p>Kabar baiknya: untuk web, berbagai alternatif yang tersedia sangat kuat, dan beberapa di antaranya gratis selamanya.</p>
<h2 id="perbandingan-singkat" tabindex="-1">Perbandingan singkat <a class="header-anchor" href="#perbandingan-singkat" aria-label="Permalink to &quot;Perbandingan singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Alternatif</th>
<th>Jenis</th>
<th>Teknologi web</th>
<th>Ukuran build (kosong)</th>
<th>Bahasa</th>
<th>Biaya</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/id/guides/godot-vs-unity-web-games.html"><strong>Godot</strong></a></td>
<td>Engine 2D/3D lengkap</td>
<td>WebGL2 + Wasm</td>
<td>~5 MB Brotli, ~9 MB gzip</td>
<td>GDScript (C# belum tersedia di web)</td>
<td>Gratis (MIT)</td>
<td>Pengganti Unity serbaguna yang paling mendekati</td>
</tr>
<tr>
<td><strong>PlayCanvas</strong></td>
<td>Engine 3D yang mengutamakan web</td>
<td>WebGL2 + WebGPU</td>
<td>~1-2 MB</td>
<td>JavaScript</td>
<td>Paket gratis; paket berbayar</td>
<td>3D yang mengutamakan browser dengan editor cloud</td>
</tr>
<tr>
<td><strong>Babylon.js</strong></td>
<td>Engine 3D yang mengutamakan web</td>
<td>WebGL2 + WebGPU</td>
<td>~1-2 MB</td>
<td>JavaScript / TypeScript</td>
<td>Gratis (Apache 2.0)</td>
<td>Engine gratis dan lengkap bagi pengguna yang meninggalkan Unity</td>
</tr>
<tr>
<td><strong>Three.js / Cinevva</strong></td>
<td>Pustaka / engine 3D</td>
<td>WebGL2 + WebGPU</td>
<td>Inti ~150 KB</td>
<td>JavaScript / TypeScript</td>
<td>Gratis (MIT)</td>
<td>Kendali maksimal, ukuran paling kecil</td>
</tr>
<tr>
<td><strong>Defold</strong></td>
<td>2D/3D yang mengutamakan web</td>
<td>WebGL + Wasm</td>
<td>~1,14 MB</td>
<td>Lua</td>
<td>Gratis</td>
<td>Game web paling kecil dan paling cepat dimuat</td>
</tr>
<tr>
<td><strong>Cocos Creator</strong></td>
<td>Engine 2D/3D lengkap</td>
<td>WebGL + WebGPU + Wasm</td>
<td>~2-4 MB</td>
<td>TypeScript</td>
<td>Gratis</td>
<td>Mini-game dan pasar web Asia</td>
</tr>
<tr>
<td><strong>Phaser</strong></td>
<td>Framework 2D</td>
<td>WebGL/Canvas</td>
<td>~500 KB</td>
<td>JavaScript</td>
<td>Gratis (MIT)</td>
<td>Game web 2D, komunitas HTML5 terbesar</td>
</tr>
<tr>
<td><strong>Construct / GDevelop</strong></td>
<td>2D visual</td>
<td>WebGL</td>
<td>~1-3 MB</td>
<td>Tanpa kode</td>
<td>Langganan / paket gratis</td>
<td>Meninggalkan Unity tanpa menulis kode</td>
</tr>
</tbody>
</table>
<p>Tidak ada satu pilihan yang bisa disebut sebagai &quot;pengganti Unity&quot; untuk semua kebutuhan. Pilihan yang tepat bergantung pada kebutuhan 3D, apakah Anda menulis kode, dan alasan Unity tidak cocok bagi Anda.</p>
<h2 id="godot-pengganti-serbaguna-yang-paling-mendekati" tabindex="-1">Godot: pengganti serbaguna yang paling mendekati <a class="header-anchor" href="#godot-pengganti-serbaguna-yang-paling-mendekati" aria-label="Permalink to &quot;Godot: pengganti serbaguna yang paling mendekati&quot;"></a></h2>
<p>Godot adalah alternatif yang paling sering dipilih oleh mantan developer Unity. Godot merupakan engine 2D dan 3D lengkap yang tersedia gratis dengan lisensi MIT, tanpa biaya per pengguna, royalti, atau batas pendapatan, serta memiliki ekspor web yang andal. Ukuran build-nya sekitar 5 MB dengan Brotli atau 9 MB dengan gzip, yang secara default lebih kecil daripada Unity. Sejak Godot 4.3, Anda dapat mengekspor build web single-threaded yang tidak lagi memerlukan SharedArrayBuffer, sekaligus mengatasi masalah pemutaran lama di iOS dan Safari.</p>
<p>Satu kekurangannya untuk web: proyek C# (.NET) di Godot belum dapat diekspor ke browser; untuk saat ini hanya GDScript yang bisa. Jika Anda memindahkan basis kode C#, hal ini perlu dipertimbangkan. Kami membahas komprominya secara mendetail dalam <a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk game web</a>.</p>
<p>Pilih Godot jika Anda menginginkan engine serbaguna yang paling mirip Unity, gratis selamanya, dengan jalur yang rapi untuk game web 2D dan 3D.</p>
<h2 id="playcanvas-3d-yang-mengutamakan-web-dengan-editor" tabindex="-1">PlayCanvas: 3D yang mengutamakan web dengan editor <a class="header-anchor" href="#playcanvas-3d-yang-mengutamakan-web-dengan-editor" aria-label="Permalink to &quot;PlayCanvas: 3D yang mengutamakan web dengan editor&quot;"></a></h2>
<p>PlayCanvas sejak awal dibuat untuk browser. Runtime-nya berukuran sekitar 1 hingga 2 MB, mendukung WebGL2 dan WebGPU, serta memiliki editor cloud kolaboratif yang akan terasa familier jika Anda menyukai alur kerja scene di Unity. Game ditulis menggunakan JavaScript. Ini merupakan pilihan yang kuat ketika Anda membutuhkan 3D real-time di browser dan menginginkan editor visual, bukan pustaka yang hanya berbasis kode.</p>
<p>Pilih PlayCanvas jika Anda menginginkan pengeditan scene 3D ala Unity dengan build web yang sangat kecil.</p>
<h2 id="babylon-js-engine-gratis-dan-lengkap-yang-web-native" tabindex="-1">Babylon.js: engine gratis dan lengkap yang web-native <a class="header-anchor" href="#babylon-js-engine-gratis-dan-lengkap-yang-web-native" aria-label="Permalink to &quot;Babylon.js: engine gratis dan lengkap yang web-native&quot;"></a></h2>
<p>Babylon.js adalah pilihan bagi Anda yang meninggalkan Unity tetapi tetap menginginkan engine lengkap, bukan sekadar pustaka rendering dasar. Babylon.js gratis dan bersumber terbuka (Apache 2.0), dikembangkan serta didukung oleh tim di Microsoft, dan sejak awal dirancang untuk berjalan di browser. Anda mendapatkan fisika Havok bawaan, pemeriksa scene, alat animasi, dan editor berbasis web gratis. Dengan demikian, kelengkapan fitur siap pakai yang menarik orang ke Unity tetap tersedia tanpa biaya per pengguna atau batas pendapatan. Babylon.js 9.0 (Maret 2026) juga menghadirkan salah satu dukungan WebGPU tercanggih di antara engine web, termasuk clustered lighting dan pencahayaan volumetrik berbasis compute. Jadi, mengutamakan web tidak berarti mengorbankan kualitas rendering. Anda menulis skrip menggunakan JavaScript atau TypeScript.</p>
<p>Pilih Babylon.js jika Anda menginginkan engine 3D web-native yang lengkap dan gratis, dengan rangkaian fitur mirip Unity serta rendering WebGPU modern.</p>
<h2 id="three-js-dan-cinevva-kendali-maksimal-ukuran-paling-kecil" tabindex="-1">Three.js dan Cinevva: kendali maksimal, ukuran paling kecil <a class="header-anchor" href="#three-js-dan-cinevva-kendali-maksimal-ukuran-paling-kecil" aria-label="Permalink to &quot;Three.js dan Cinevva: kendali maksimal, ukuran paling kecil&quot;"></a></h2>
<p>Jika Anda menginginkan build web seringan mungkin dan kendali penuh atas rendering, <a href="/id/guides/playcanvas-vs-threejs.html">Three.js</a> adalah standarnya. Pustaka intinya berukuran sekitar 150 KB dan digunakan oleh sebagian besar konten 3D di web. Three.js merupakan pustaka rendering, bukan engine lengkap, sehingga Anda perlu menyediakan sendiri sistem game atau menggunakan framework tambahan.</p>
<p>Itulah alasan kami membangun <a href="/id/engine.html">Cinevva Engine</a> di atas Three.js: bersumber terbuka, mengutamakan web, dan dilengkapi sistem game agar Anda tidak perlu memulai dari kanvas kosong. Satu basis kode dapat dirilis ke browser, perangkat seluler, desktop, Steam, dan Discord. Tanpa biaya per pengguna, biaya instalasi, atau ketentuan yang dapat berubah setelah Anda selesai membangun game—hal yang menjadi perhatian banyak orang setelah polemik Runtime Fee.</p>
<p>Pilih Three.js atau Cinevva jika Anda menginginkan 3D web-native, sumber terbuka, dan ukuran paling kecil, serta nyaman menggunakan JavaScript atau TypeScript.</p>
<h2 id="defold-build-web-2d-paling-kecil-dan-cepat" tabindex="-1">Defold: build web 2D paling kecil dan cepat <a class="header-anchor" href="#defold-build-web-2d-paling-kecil-dan-cepat" aria-label="Permalink to &quot;Defold: build web 2D paling kecil dan cepat&quot;"></a></h2>
<p>Defold menghasilkan build web paling kecil di antara semua engine lengkap, sekitar 1,14 MB, dan dapat dimuat dengan cepat. Engine ini mendukung 2D dan 3D ringan, menggunakan Lua untuk skrip, serta gratis tanpa ambang pendapatan. Jika game Unity Anda berbentuk 2D dan waktu muat menjadi prioritas, Defold sulit dikalahkan di web.</p>
<p>Pilih Defold untuk game web kasual dan seluler ketika setiap kilobita sangat berarti.</p>
<h2 id="cocos-creator-mini-game-dan-pasar-asia" tabindex="-1">Cocos Creator: mini-game dan pasar Asia <a class="header-anchor" href="#cocos-creator-mini-game-dan-pasar-asia" aria-label="Permalink to &quot;Cocos Creator: mini-game dan pasar Asia&quot;"></a></h2>
<p>Cocos Creator adalah engine 2D dan 3D lengkap dengan dukungan WebGL, WebGPU, dan Wasm, menghasilkan build dalam kisaran 2 hingga 4 MB, serta menggunakan TypeScript untuk skrip. Engine ini sangat kuat untuk platform mini-game (WeChat, TikTok, Taobao), yang tidak cocok dengan ukuran Unity. Cocos Creator tersedia gratis.</p>
<p>Pilih Cocos Creator untuk mini-game atau jika Anda menargetkan ekosistem web Asia.</p>
<h2 id="phaser-standar-web-2d" tabindex="-1">Phaser: standar web 2D <a class="header-anchor" href="#phaser-standar-web-2d" aria-label="Permalink to &quot;Phaser: standar web 2D&quot;"></a></h2>
<p>Jika game Anda berbentuk 2D dan Anda menulis JavaScript, Phaser adalah framework game HTML5 paling populer dengan komunitas dan ekosistem terbesar. Ukuran build-nya sekitar 500 KB. Phaser tersedia gratis dengan lisensi MIT. Untuk game web 2D, framework ini sering kali jauh lebih cocok daripada Unity. Lihat <a href="/id/guides/best-2d-game-engines-2026.html">engine game 2D terbaik untuk 2026</a> untuk mengetahui perbandingannya dengan Defold, Construct, dan GDevelop.</p>
<p>Pilih Phaser untuk game web 2D ketika Anda menginginkan pengembangan berbasis kode, komunitas besar, dan build kecil.</p>
<h2 id="construct-dan-gdevelop-meninggalkan-unity-tanpa-kode" tabindex="-1">Construct dan GDevelop: meninggalkan Unity tanpa kode <a class="header-anchor" href="#construct-dan-gdevelop-meninggalkan-unity-tanpa-kode" aria-label="Permalink to &quot;Construct dan GDevelop: meninggalkan Unity tanpa kode&quot;"></a></h2>
<p>Jika salah satu alasan Unity membuat Anda frustrasi adalah banyaknya kode dan penyiapan yang diperlukan, engine visual dapat menjadi alternatif nyata. <a href="/id/guides/construct-vs-gdevelop.html">Construct dan GDevelop</a> sama-sama memungkinkan Anda membuat game 2D tanpa pemrograman dan mengekspornya menjadi build web yang rapi. GDevelop memiliki paket gratis dan ramah terhadap sumber terbuka; Construct berbasis langganan dengan editor yang matang.</p>
<p>Pilih salah satunya jika Anda ingin membuat game web secara visual dengan sedikit atau tanpa kode.</p>
<h2 id="cara-memilih-berdasarkan-alasan-meninggalkan-unity" tabindex="-1">Cara memilih berdasarkan alasan meninggalkan Unity <a class="header-anchor" href="#cara-memilih-berdasarkan-alasan-meninggalkan-unity" aria-label="Permalink to &quot;Cara memilih berdasarkan alasan meninggalkan Unity&quot;"></a></h2>
<ul>
<li><strong>Meninggalkan Unity karena harga atau kepercayaan?</strong> Pilih sumber terbuka: Godot, Defold, Phaser, Three.js, atau Cinevva. Tidak ada yang dapat mengubah harga secara sepihak dan merugikan Anda.</li>
<li><strong>Membutuhkan 3D di browser?</strong> PlayCanvas atau Babylon.js (engine lengkap dengan editor), atau Three.js dan Cinevva (untuk kendali dan ukuran paling kecil).</li>
<li><strong>Membuat game 2D?</strong> Defold untuk build paling kecil, Phaser untuk komunitas terbesar.</li>
<li><strong>Tidak ingin menulis kode?</strong> Construct atau GDevelop.</li>
<li><strong>Menargetkan platform mini-game?</strong> Cocos Creator.</li>
</ul>
<p>Apa pun pilihan Anda, web menghargai build kecil dan waktu muat cepat. Setelah menentukan pilihan, lihat <a href="/id/tutorials/ship-web-game-fast.html">cara merilis game web yang dimuat dengan cepat</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-alternatif-unity-terbaik-untuk-game-web" tabindex="-1">Apa alternatif Unity terbaik untuk game web? <a class="header-anchor" href="#apa-alternatif-unity-terbaik-untuk-game-web" aria-label="Permalink to &quot;Apa alternatif Unity terbaik untuk game web?&quot;"></a></h3>
<p>Bagi kebanyakan tim, jawabannya adalah Godot: engine 2D dan 3D lengkap yang gratis dan bersumber terbuka, dengan build web lebih kecil daripada Unity serta jalur ekspor single-threaded yang rapi untuk iOS dan Safari. Jika Anda secara khusus membutuhkan 3D yang mengutamakan browser, PlayCanvas atau Three.js bahkan lebih ringan. Pilihan terbaik bergantung pada kebutuhan 3D dan apakah Anda menulis kode.</p>
<h3 id="apakah-ada-alternatif-gratis-untuk-unity" tabindex="-1">Apakah ada alternatif gratis untuk Unity? <a class="header-anchor" href="#apakah-ada-alternatif-gratis-untuk-unity" aria-label="Permalink to &quot;Apakah ada alternatif gratis untuk Unity?&quot;"></a></h3>
<p>Ya, ada beberapa. Godot, Defold, Phaser, PixiJS, Excalibur.js, dan Three.js semuanya gratis dan bersumber terbuka, tanpa batas pendapatan atau biaya per pengguna. Cocos Creator dan GDevelop juga memiliki opsi gratis. Khusus untuk game web, engine gratis ini sering menghasilkan build yang lebih kecil dan cepat daripada Unity.</p>
<h3 id="mengapa-beralih-dari-unity-untuk-game-web" tabindex="-1">Mengapa beralih dari Unity untuk game web? <a class="header-anchor" href="#mengapa-beralih-dari-unity-untuk-game-web" aria-label="Permalink to &quot;Mengapa beralih dari Unity untuk game web?&quot;"></a></h3>
<p>Alasan umumnya adalah ukuran build (build WebGL kosong dari Unity mulai dari sekitar 8 hingga 11 MB, dibandingkan 1 hingga 5 MB untuk engine web-native), keandalan browser seluler, kepercayaan terhadap harga setelah polemik Runtime Fee 2023, dan preferensi terhadap sumber terbuka. Jika web menjadi target utama Anda, engine yang mengutamakan web biasanya memberikan hasil lebih baik.</p>
<h3 id="bisakah-saya-mengganti-unity-dengan-engine-sumber-terbuka" tabindex="-1">Bisakah saya mengganti Unity dengan engine sumber terbuka? <a class="header-anchor" href="#bisakah-saya-mengganti-unity-dengan-engine-sumber-terbuka" aria-label="Permalink to &quot;Bisakah saya mengganti Unity dengan engine sumber terbuka?&quot;"></a></h3>
<p>Ya. Godot adalah padanan sumber terbuka yang paling mendekati untuk kebutuhan umum 2D dan 3D, serta menggunakan lisensi MIT tanpa biaya. Untuk 3D web-native, Three.js (dan engine yang dibangun di atasnya seperti Cinevva) juga bersumber terbuka. Biaya migrasi utamanya adalah membangun ulang menggunakan bahasa baru karena setiap engine memiliki sistem skripnya sendiri.</p>
<h3 id="alternatif-unity-mana-yang-memiliki-build-web-paling-kecil" tabindex="-1">Alternatif Unity mana yang memiliki build web paling kecil? <a class="header-anchor" href="#alternatif-unity-mana-yang-memiliki-build-web-paling-kecil" aria-label="Permalink to &quot;Alternatif Unity mana yang memiliki build web paling kecil?&quot;"></a></h3>
<p>Di antara engine lengkap, Defold adalah yang paling kecil, sekitar 1,14 MB. Three.js sebagai pustaka bahkan lebih kecil, dengan inti sekitar 150 KB, meskipun Anda perlu menambahkan sendiri kode game. Godot berada di kisaran 5 MB dengan Brotli atau 9 MB dengan gzip, masih jauh di bawah ukuran awal Unity yang mencapai 8 MB lebih.</p>
<BuildCta
  title="Alternatif Unity paling radikal: tanpa engine sama sekali"
  desc="Jelaskan game Anda dan mainkan di browser dalam waktu sekitar satu menit."
  prompt="Buat platformer orang ketiga yang dimuat seketika di browser" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Dibandingkan)</a> — seluruh pilihan, diurutkan berdasarkan peringkat</li>
<li><a href="/id/guides/open-source-game-engines-2026.html">Engine Game Sumber Terbuka Terbaik untuk 2026</a> — pilihan gratis yang dapat Anda fork sendiri dalam satu tempat</li>
<li><a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk Game Web</a> — alternatif yang paling mendekati, dibandingkan langsung</li>
<li><a href="/id/news/2024-09-12-unity-runtime-fee-cancelled.html">Unity Runtime Fee Dibatalkan: kisah resminya</a> — mengapa kepercayaan terhadap harga menjadi faktor penentu</li>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — jika game Anda berbentuk 2D</li>
<li><a href="/id/guides/playcanvas-vs-threejs.html">PlayCanvas vs Three.js</a> — engine versus pustaka untuk 3D web</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang mengutamakan web dan dibangun di atas Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/unity-alternatives-web-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Engine Game 2D Terbaik untuk 2026 (Perbandingan)]]></title>
            <link>https://app.cinevva.com/id/guides/best-2d-game-engines-2026</link>
            <guid>https://app.cinevva.com/id/guides/best-2d-game-engines-2026</guid>
            <pubDate>Sun, 07 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Engine game 2D terbaik untuk 2026 - Godot, GameMaker, Construct, Defold, Phaser, GDevelop, Unity, dan LÖVE, dibandingkan berdasarkan harga, ekspor web, ukuran build, dan target pengguna masing-masing.]]></description>
            <content:encoded><![CDATA[<h1 id="engine-game-2d-terbaik-untuk-2026-perbandingan" tabindex="-1">Engine Game 2D Terbaik untuk 2026 (Perbandingan) <a class="header-anchor" href="#engine-game-2d-terbaik-untuk-2026-perbandingan" aria-label="Permalink to &quot;Engine Game 2D Terbaik untuk 2026 (Perbandingan)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/best-2d-game-engines-2026-hero.jpg?v=2" alt="Engine game 2D terbaik untuk 2026: Godot, GameMaker, Construct, Defold, Phaser" style="width:100%;border-radius:10px">
</figure>
<p>Game 2D tetap hidup dan berkembang pada 2026, dan kini tersedia lebih banyak engine berkualitas daripada sebelumnya. Pilihan yang tepat bergantung pada apakah Anda bisa menulis kode, apakah Anda akan merilis game ke web, dan seberapa kecil ukuran build yang dibutuhkan. Berikut perbandingan pilihan utama dan target pengguna masing-masing.</p>
<p>Jika Anda juga mempertimbangkan engine 3D atau engine lintas platform lengkap, lihat <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web</a> yang lebih luas.</p>
<h2 id="referensi-singkat" tabindex="-1">Referensi Singkat <a class="header-anchor" href="#referensi-singkat" aria-label="Permalink to &quot;Referensi Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Engine</th>
<th>Harga</th>
<th>Ekspor web</th>
<th>Paling cocok untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://godotengine.org/" target="_blank" rel="noreferrer"><strong>Godot</strong></a></td>
<td>Gratis (MIT)</td>
<td>Baik (WebGL2, GDScript)</td>
<td>Pilihan serbaguna dan sumber terbuka terbaik</td>
</tr>
<tr>
<td><a href="https://gamemaker.io/" target="_blank" rel="noreferrer"><strong>GameMaker</strong></a></td>
<td>Gratis untuk nonkomersial; Pro sekali bayar $99.99</td>
<td>HTML5 disertakan</td>
<td>Game 2D komersial, rilis cepat</td>
</tr>
<tr>
<td><a href="https://www.construct.net/" target="_blank" rel="noreferrer"><strong>Construct</strong></a></td>
<td>Paket gratis; Personal $99/tahun</td>
<td>Sangat baik (berbasis HTML5)</td>
<td>Pemula dan pengguna no-code, mengutamakan web</td>
</tr>
<tr>
<td><a href="https://defold.com/" target="_blank" rel="noreferrer"><strong>Defold</strong></a></td>
<td>Gratis</td>
<td>Sangat baik (&lt;2 MB gzip)</td>
<td>Build web terkecil dengan pemuatan tercepat</td>
</tr>
<tr>
<td><a href="https://phaser.io/" target="_blank" rel="noreferrer"><strong>Phaser</strong></a></td>
<td>Gratis (MIT)</td>
<td>Native (merupakan framework JS)</td>
<td>Game web yang mengutamakan kode</td>
</tr>
<tr>
<td><a href="https://gdevelop.io/" target="_blank" rel="noreferrer"><strong>GDevelop</strong></a></td>
<td>Gratis; premium mulai $2.19/bulan</td>
<td>Ya (HTML5)</td>
<td>Pengembangan no-code gratis</td>
</tr>
<tr>
<td><a href="https://unity.com/" target="_blank" rel="noreferrer"><strong>Unity</strong></a></td>
<td>Personal gratis di bawah $200K; Pro $2,310/tahun</td>
<td>Ya (WebGL2)</td>
<td>Ekosistem besar, jangkauan lintas platform</td>
</tr>
<tr>
<td><a href="https://love2d.org/" target="_blank" rel="noreferrer"><strong>LÖVE</strong></a></td>
<td>Gratis (sumber terbuka)</td>
<td>Melalui love.js (pihak ketiga)</td>
<td>Pembuatan prototipe Lua minimalis</td>
</tr>
</tbody>
</table>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/a_TDD1QhYGg" title="Unity vs Godot vs Defold! Perbandingan Engine Game" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Asatte Games membandingkan langsung tiga engine di bawah ini.</div>
<h2 id="daftar-engine" tabindex="-1">Daftar Engine <a class="header-anchor" href="#daftar-engine" aria-label="Permalink to &quot;Daftar Engine&quot;"></a></h2>
<h3 id="godot" tabindex="-1">Godot <a class="header-anchor" href="#godot" aria-label="Permalink to &quot;Godot&quot;"></a></h3>
<p>Engine sumber terbuka favorit yang benar-benar unggul untuk game 2D. Godot 4.7 (Juni 2026) memiliki renderer 2D khusus, editor yang ringan, dan GDScript yang ramah bagi pemula. Engine ini gratis berdasarkan lisensi MIT tanpa royalti. Ekspor web melalui WebGL2 cukup andal, dengan catatan bahwa hanya GDScript yang dapat diekspor ke browser, bukan C#. Jika Anda menginginkan satu alat gratis yang sangat baik untuk 2D dan cukup mumpuni untuk 3D, ini adalah pilihan utama.</p>
<p><strong>Paling cocok untuk:</strong> game 2D serbaguna, proyek sumber terbuka, pixel art.</p>
<h3 id="gamemaker" tabindex="-1">GameMaker <a class="header-anchor" href="#gamemaker" aria-label="Permalink to &quot;GameMaker&quot;"></a></h3>
<p>Engine di balik game populer seperti Undertale dan banyak game 2D komersial lainnya. Engine ini menggunakan GML, bahasa scripting cepat miliknya sendiri, dan menyediakan ekspor HTML5 bahkan pada paket gratis. Model harganya kini lebih bersahabat: gratis untuk penggunaan nonkomersial dan lisensi Pro sekali bayar sebesar $99.99 untuk penggunaan komersial, bukan langganan.</p>
<p><strong>Paling cocok untuk:</strong> game 2D komersial yang perlu dirilis dengan cepat, pixel art.</p>
<h3 id="construct" tabindex="-1">Construct <a class="header-anchor" href="#construct" aria-label="Permalink to &quot;Construct&quot;"></a></h3>
<p>Engine no-code berbasis browser yang dibangun dengan sistem event. Anda membuat game secara visual tanpa pemrograman, dan karena engine ini berbasis HTML5, ekspor web-nya sangat baik. Harganya berbasis langganan, $99 per tahun untuk paket Personal, dengan opsi gratis yang terbatas.</p>
<p><strong>Paling cocok untuk:</strong> pemula, kreator no-code, dan game 2D yang mengutamakan web.</p>
<h3 id="defold" tabindex="-1">Defold <a class="header-anchor" href="#defold" aria-label="Permalink to &quot;Defold&quot;"></a></h3>
<p>Engine gratis dari mantan pengembang King yang menghasilkan build web luar biasa kecil, sering kali di bawah 2 MB setelah dikompresi dengan gzip. Hal ini membuatnya ideal untuk game web kasual dan platform mini-game yang sangat mementingkan waktu pemuatan. Engine ini menggunakan Lua dan kode sumbernya tersedia berdasarkan Defold License.</p>
<p><strong>Paling cocok untuk:</strong> game web terkecil dengan pemuatan tercepat.</p>
<h3 id="phaser" tabindex="-1">Phaser <a class="header-anchor" href="#phaser" aria-label="Permalink to &quot;Phaser&quot;"></a></h3>
<p>Framework game HTML5 paling populer yang mengutamakan kode. Phaser 4 (dirilis April 2026) menghadirkan renderer WebGL baru yang dibangun ulang dari awal. Framework ini gratis dan bersumber terbuka, Anda menulis JavaScript atau TypeScript, dan karena Phaser merupakan framework web, tidak ada tahap &quot;ekspor&quot;—game Anda sudah berjalan di browser.</p>
<p><strong>Paling cocok untuk:</strong> pengembang yang menginginkan framework 2D berbasis web dan mengutamakan kode.</p>
<h3 id="gdevelop" tabindex="-1">GDevelop <a class="header-anchor" href="#gdevelop" aria-label="Permalink to &quot;GDevelop&quot;"></a></h3>
<p>Sebagai engine sumber terbuka dan no-code, GDevelop merupakan salah satu engine paling ramah bagi pemula. Engine ini gratis dengan paket premium opsional mulai $2.19 per bulan (bahkan setelah kenaikan harga Januari 2026), serta memungkinkan ekspor build HTML5 tanpa batas. Pilihan yang tepat jika Anda menginginkan sistem no-code sekaligus sumber terbuka.</p>
<p><strong>Paling cocok untuk:</strong> pengembangan 2D no-code gratis.</p>
<h3 id="unity" tabindex="-1">Unity <a class="header-anchor" href="#unity" aria-label="Permalink to &quot;Unity&quot;"></a></h3>
<p>Perangkat 2D Unity sudah matang, sementara ekosistem dan toko asetnya tidak tertandingi. Unity mungkin berlebihan untuk game 2D kecil, tetapi jika Anda menginginkan jangkauan lintas platform atau berencana beralih ke 3D, engine ini layak dipertimbangkan. Personal gratis untuk pendapatan di bawah $200K, sedangkan Pro berharga $2,310 per tahun per pengguna. Berbeda dengan Godot, C# di Unity dapat diekspor ke web.</p>
<p><strong>Paling cocok untuk:</strong> tim yang menginginkan ekosistem besar atau jangkauan lintas platform.</p>
<h3 id="love-love2d" tabindex="-1">LÖVE (Love2D) <a class="header-anchor" href="#love-love2d" aria-label="Permalink to &quot;LÖVE (Love2D)&quot;"></a></h3>
<p>Framework Lua minimalis, bukan editor lengkap. Anda menulis kode, lalu menjalankannya. LÖVE 11.5 merupakan rilis stabil saat ini, sedangkan versi 12.0 sedang dikembangkan. Ekspor web tersedia melalui love.js dari pihak ketiga, tetapi bukan fitur utama. Pilih LÖVE jika Anda senang menulis kode dan menginginkan lapisan abstraksi seminimal mungkin antara Anda dan game loop.</p>
<p><strong>Paling cocok untuk:</strong> penghobi yang berfokus pada kode dan prototipe ringan.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/ZiBsbBGT9L4" title="Unreal vs Unity vs Godot, mana yang lebih baik pada 2026?" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">InspirationTuts menyandingkan engine-engine besar untuk 2026.</div>
<h2 id="cara-memilih" tabindex="-1">Cara Memilih <a class="header-anchor" href="#cara-memilih" aria-label="Permalink to &quot;Cara Memilih&quot;"></a></h2>
<ul>
<li><strong>Anda tidak ingin menulis kode:</strong> Construct atau GDevelop. Pilih Construct jika Anda merilis ke web, atau GDevelop jika menginginkan sumber terbuka.</li>
<li><strong>Anda menginginkan build web terkecil dan tercepat:</strong> Defold.</li>
<li><strong>Anda menulis kode dan menargetkan web:</strong> Phaser.</li>
<li><strong>Anda menginginkan satu engine gratis untuk segala kebutuhan:</strong> Godot.</li>
<li><strong>Anda akan merilis game 2D komersial:</strong> GameMaker atau Unity.</li>
<li><strong>Anda membutuhkan ekosistem terbesar atau berencana menambahkan 3D:</strong> Unity.</li>
</ul>
<p>Apa pun pilihan Anda, Anda akan membutuhkan aset visual dan audio. Lihat <a href="/id/guides/game-assets-guide.html">tempat menemukan aset game gratis</a> untuk sumber aset yang dapat langsung digunakan.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-engine-game-2d-terbaik-pada-2026" tabindex="-1">Apa engine game 2D terbaik pada 2026? <a class="header-anchor" href="#apa-engine-game-2d-terbaik-pada-2026" aria-label="Permalink to &quot;Apa engine game 2D terbaik pada 2026?&quot;"></a></h3>
<p>Bagi kebanyakan orang, Godot adalah engine 2D serbaguna terbaik: gratis, sumber terbuka, dan memiliki renderer 2D kelas utama. Jika Anda tidak ingin menulis kode, Construct (mengutamakan web) atau GDevelop (sumber terbuka) adalah pilihan yang lebih baik. Untuk game 2D komersial, GameMaker dan Unity telah teruji. Engine &quot;terbaik&quot; bergantung pada apakah Anda menulis kode dan platform tempat Anda akan merilis game.</p>
<h3 id="engine-game-2d-mana-yang-terbaik-untuk-pemula" tabindex="-1">Engine game 2D mana yang terbaik untuk pemula? <a class="header-anchor" href="#engine-game-2d-mana-yang-terbaik-untuk-pemula" aria-label="Permalink to &quot;Engine game 2D mana yang terbaik untuk pemula?&quot;"></a></h3>
<p>Construct dan GDevelop paling ramah bagi pemula karena keduanya no-code—Anda membuat game dengan sistem event visual, bukan pemrograman. GDevelop gratis dan bersumber terbuka, sedangkan Construct berbasis langganan tetapi memiliki proses ekspor web paling mulus. Jika Anda ingin belajar menulis kode sambil membuat game, Godot dengan GDScript adalah pilihan termudah di antara engine berbasis kode.</p>
<h3 id="apa-engine-game-2d-gratis-terbaik" tabindex="-1">Apa engine game 2D gratis terbaik? <a class="header-anchor" href="#apa-engine-game-2d-gratis-terbaik" aria-label="Permalink to &quot;Apa engine game 2D gratis terbaik?&quot;"></a></h3>
<p>Godot adalah engine 2D gratis dan sumber terbuka terkuat, tanpa biaya maupun royalti. GDevelop merupakan pilihan no-code gratis terbaik, Defold gratis dengan build web terkecil, dan Phaser adalah framework sumber terbuka gratis jika Anda menulis kode. GameMaker gratis untuk penggunaan nonkomersial, lalu memerlukan lisensi sekali bayar sebesar $99.99 untuk proyek komersial.</p>
<h3 id="engine-2d-mana-yang-menghasilkan-game-web-terkecil" tabindex="-1">Engine 2D mana yang menghasilkan game web terkecil? <a class="header-anchor" href="#engine-2d-mana-yang-menghasilkan-game-web-terkecil" aria-label="Permalink to &quot;Engine 2D mana yang menghasilkan game web terkecil?&quot;"></a></h3>
<p>Defold menghasilkan build web terkecil, sering kali di bawah 2 MB setelah dikompresi dengan gzip. Itulah sebabnya Defold populer untuk platform game kasual dan mini-game, tempat waktu pemuatan menentukan apakah pemain akan bertahan. Phaser dan Godot juga cukup efisien, tetapi Defold unggul dalam hal ukuran mentah.</p>
<BuildCta
  title="Tidak yakin engine 2D mana yang harus dipilih? Lewati saja keputusan ini"
  desc="Deskripsikan game 2D dan mainkan dalam waktu sekitar satu menit, tanpa perlu menginstal engine."
  prompt="Buat game endless runner 2D neon side-scrolling dengan koin dan skor tertinggi" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/vibe-coding-game-prompts.html">100 Ide Prompt Game AI yang Bisa Anda Buat dengan Satu Klik</a> — ambil sebuah ide dan mainkan dalam waktu sekitar satu menit</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Perbandingan)</a> — 2D dan 3D, perbandingan lengkap</li>
<li><a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk Game Web</a> — perbandingan langsung dua engine besar</li>
<li><a href="/id/guides/construct-vs-gdevelop.html">Construct vs GDevelop</a> — perbandingan dua engine 2D no-code</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — visual dan audio untuk game 2D Anda</li>
<li><a href="/id/tutorials/canvas-2d-game-loop.html">Game loop Canvas 2D</a> — buat game 2D tanpa engine sama sekali</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang mengutamakan web</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/best-2d-game-engines-2026-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Construct vs GDevelop: Engine 2D Tanpa Kode Terbaik (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/construct-vs-gdevelop</link>
            <guid>https://app.cinevva.com/id/guides/construct-vs-gdevelop</guid>
            <pubDate>Sun, 07 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Perbandingan Construct vs GDevelop pada 2026—dua engine game 2D tanpa kode yang dibandingkan dari segi harga, ekspor web, dukungan 3D, skrip, multipemain, dan sumber terbuka, beserta rekomendasi untuk setiap jenis kreator.]]></description>
            <content:encoded><![CDATA[<h1 id="construct-vs-gdevelop-engine-2d-tanpa-kode-terbaik-2026" tabindex="-1">Construct vs GDevelop: Engine 2D Tanpa Kode Terbaik (2026) <a class="header-anchor" href="#construct-vs-gdevelop-engine-2d-tanpa-kode-terbaik-2026" aria-label="Permalink to &quot;Construct vs GDevelop: Engine 2D Tanpa Kode Terbaik (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/construct-vs-gdevelop-hero.jpg?v=2" alt="Construct vs GDevelop, engine game 2D tanpa kode pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Jika Anda ingin membuat game tanpa menulis kode, kedua engine ini adalah yang terdepan. Keduanya memungkinkan Anda membuat game dengan logika event visual alih-alih pemrograman, dan keduanya dapat mengekspor ke web. Perbedaan utamanya terletak pada filosofi dan harga: Construct adalah produk berlangganan yang matang, sedangkan GDevelop gratis dan bersumber terbuka. Berikut perbandingan keduanya pada 2026.</p>
<p>Untuk cakupan yang lebih luas, termasuk engine berbasis kode, lihat <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web</a> dan <a href="/id/guides/best-2d-game-engines-2026.html">engine game 2D terbaik untuk 2026</a>.</p>
<h2 id="kesimpulan-singkat" tabindex="-1">Kesimpulan Singkat <a class="header-anchor" href="#kesimpulan-singkat" aria-label="Permalink to &quot;Kesimpulan Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Construct</th>
<th>GDevelop</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Model</strong></td>
<td>Proprietari, berlangganan</td>
<td>Gratis, sumber terbuka (MIT)</td>
</tr>
<tr>
<td><strong>Logika</strong></td>
<td>Event sheet</td>
<td>Sistem event</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Paket gratis; Personal $99/tahun</td>
<td>Gratis; premium mulai $2,19/bulan</td>
</tr>
<tr>
<td><strong>Ekspor web</strong></td>
<td>Sangat baik (berbasis HTML5)</td>
<td>Ya (HTML5)</td>
</tr>
<tr>
<td><strong>3D</strong></td>
<td>Terus berkembang (editor 3D di r487, berfokus pada 2D)</td>
<td>Editor 3D waktu nyata lengkap (5.6)</td>
</tr>
<tr>
<td><strong>Skrip</strong></td>
<td>JavaScript dan TypeScript</td>
<td>Event + JavaScript</td>
</tr>
<tr>
<td><strong>Terbaik untuk</strong></td>
<td>Alur kerja matang, multipemain bawaan</td>
<td>Gratis, sumber terbuka, 3D yang lebih baru</td>
</tr>
</tbody>
</table>
<h2 id="tanpa-kode-dua-pendekatan" tabindex="-1">Tanpa Kode, Dua Pendekatan <a class="header-anchor" href="#tanpa-kode-dua-pendekatan" aria-label="Permalink to &quot;Tanpa Kode, Dua Pendekatan&quot;"></a></h2>
<p>Kedua engine memungkinkan Anda membuat game dengan menyusun kondisi dan aksi visual, tanpa perlu pemrograman. Construct menggunakan &quot;event sheet&quot;, yaitu alur bersih seperti spreadsheet yang banyak dipuji karena memungkinkan pembuatan prototipe dengan sangat cepat. GDevelop menggunakan sistem event serupa dan sama mudahnya dipelajari oleh pemula.</p>
<p>Perbedaan yang paling penting: <strong>Construct adalah produk berbayar dengan sumber tertutup; GDevelop gratis dan bersumber terbuka di bawah lisensi MIT.</strong> Jika sumber terbuka atau tanpa biaya menjadi prioritas, hal itu saja mungkin sudah menentukan pilihan Anda.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/MDlP01bwczo" title="Mengapa Saya Beralih dari Construct 3 ke GDevelop" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Pendapat seorang kreator tentang perpindahannya dari Construct ke GDevelop.</div>
<h2 id="harga" tabindex="-1">Harga <a class="header-anchor" href="#harga" aria-label="Permalink to &quot;Harga&quot;"></a></h2>
<p>Construct 3 menggunakan sistem berlangganan. Tersedia edisi gratis yang terbatas, sedangkan paket Personal berharga $99 per tahun, dengan paket Education dan Business di atasnya. Anda membayar untuk produk matang yang dikembangkan secara aktif.</p>
<p>Engine GDevelop gratis dan bersumber terbuka. Paket premium opsional ($2,19 Silver, $4,39 Gold, dan $23,99 Pro per bulan) menambahkan build cloud dan layanan daring, tetapi Anda tetap dapat membuat dan mengekspor game sepenuhnya secara gratis. Harga naik 20% bagi pelanggan baru pada Januari 2026.</p>
<p>Bagi pengembang hobi atau siapa pun yang mempertimbangkan biaya, paket gratis GDevelop sulit ditandingi. Bagi studio yang menginginkan alat komersial yang matang, biaya berlangganan Construct cukup masuk akal.</p>
<h2 id="_3d-skrip-dan-multipemain" tabindex="-1">3D, Skrip, dan Multipemain <a class="header-anchor" href="#_3d-skrip-dan-multipemain" aria-label="Permalink to &quot;3D, Skrip, dan Multipemain&quot;"></a></h2>
<p><strong>3D:</strong> GDevelop unggul dalam hal ini. Rilis 5.6-nya (Desember 2025) menghadirkan editor 3D waktu nyata lengkap dengan fisika berbasis Jolt, bayangan, model beranimasi, partikel 3D, serta perilaku karakter dan kendaraan siap pakai. Pembaruan 5.6 berikutnya juga menambahkan point light dan spotlight 3D. Construct mulai mengejar: rilis stabil r487 (Mei 2026) menambahkan mode editor 3D dengan gizmo dan perilaku peluru 3D, melengkapi dukungan kamera 3D dan model glTF yang sudah ada. Ini merupakan kemajuan nyata, tetapi semuanya masih dibangun di atas engine yang pada dasarnya berfokus pada 2D.</p>
<p><strong>Skrip:</strong> ketika sistem event tidak lagi mencukupi, keduanya memungkinkan Anda beralih ke kode. Construct mendukung JavaScript dan TypeScript bersama event sheet. GDevelop mendukung JavaScript melalui event dan ekstensinya. Keduanya tetap menjadikan alur tanpa kode sebagai pendekatan utama.</p>
<p><strong>Multipemain:</strong> Construct menyediakan objek Multiplayer bawaan melalui saluran data WebRTC untuk game peer-to-peer. GDevelop memiliki multipemain berbasis lobi bawaan melalui layanan daringnya, dengan paket gratis dibatasi hingga satu lobi berisi 4 pemain dan paket berbayar menaikkan batas tersebut menjadi 8 pemain.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/Jjsfk-vzlWQ" title="Construct 3 Resmi Beralih ke 3D" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">FoozleCC membahas langkah Construct memasuki ranah 3D.</div>
<h2 id="kapan-harus-memilih-yang-mana" tabindex="-1">Kapan Harus Memilih yang Mana <a class="header-anchor" href="#kapan-harus-memilih-yang-mana" aria-label="Permalink to &quot;Kapan Harus Memilih yang Mana&quot;"></a></h2>
<p>Pilih <strong>GDevelop</strong> jika Anda menginginkan engine gratis dan bersumber terbuka, ekspor lintas platform, serta editor 3D waktu nyata yang lebih mumpuni. Engine ini lebih cocok untuk pengembang hobi, pelajar, dan siapa pun yang ingin memiliki kendali atas perangkat pengembangannya.</p>
<p>Pilih <strong>Construct</strong> jika Anda menginginkan alur kerja event sheet yang paling matang, ekspor HTML5 yang andal dan telah teruji, serta multipemain WebRTC bawaan, dan tidak keberatan membayar biaya berlangganan untuk produk komersial yang berkualitas.</p>
<p>Apa pun pilihannya, Anda akan membutuhkan aset visual dan audio. Lihat <a href="/id/guides/game-assets-guide.html">tempat menemukan aset game gratis</a> untuk sumber yang dapat langsung Anda gunakan.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-construct-atau-gdevelop-lebih-baik-untuk-pemula" tabindex="-1">Apakah Construct atau GDevelop lebih baik untuk pemula? <a class="header-anchor" href="#apakah-construct-atau-gdevelop-lebih-baik-untuk-pemula" aria-label="Permalink to &quot;Apakah Construct atau GDevelop lebih baik untuk pemula?&quot;"></a></h3>
<p>Keduanya dirancang untuk pemula dan menggunakan logika event visual tanpa memerlukan penulisan kode. GDevelop unggul dalam hal biaya (gratis dan bersumber terbuka) serta kini memiliki editor 3D yang lebih kuat. Construct unggul dalam kematangan alur kerja dan fitur multipemain bawaan. Jika anggaran penting, mulailah dengan GDevelop. Jika Anda menginginkan alur kerja event 2D yang paling matang, coba dahulu edisi gratis Construct.</p>
<h3 id="apakah-gdevelop-benar-benar-gratis" tabindex="-1">Apakah GDevelop benar-benar gratis? <a class="header-anchor" href="#apakah-gdevelop-benar-benar-gratis" aria-label="Permalink to &quot;Apakah GDevelop benar-benar gratis?&quot;"></a></h3>
<p>Ya. Engine GDevelop gratis dan bersumber terbuka di bawah lisensi MIT, dan Anda dapat membuat serta mengekspor game HTML5 tanpa biaya. Paket premium opsional (mulai sekitar $2,19/bulan) menambahkan build cloud dan layanan daring, tetapi paket tersebut tidak diperlukan untuk membuat dan merilis game.</p>
<h3 id="bisakah-construct-dan-gdevelop-membuat-game-3d" tabindex="-1">Bisakah Construct dan GDevelop membuat game 3D? <a class="header-anchor" href="#bisakah-construct-dan-gdevelop-membuat-game-3d" aria-label="Permalink to &quot;Bisakah Construct dan GDevelop membuat game 3D?&quot;"></a></h3>
<p>Keduanya memiliki dukungan 3D, tetapi GDevelop lebih maju. GDevelop 5.6 (Desember 2025) menambahkan editor 3D waktu nyata lengkap dengan fisika, bayangan, dan model beranimasi. Construct menambahkan mode editor 3D-nya sendiri dalam r487 (Mei 2026), melengkapi dukungan kamera 3D dan model glTF, tetapi engine ini masih berfokus terutama pada 2D. Untuk proyek yang lebih condong ke 3D, GDevelop masih menjadi opsi tanpa kode yang lebih kuat.</p>
<h3 id="apakah-construct-dan-gdevelop-dapat-mengekspor-ke-web" tabindex="-1">Apakah Construct dan GDevelop dapat mengekspor ke web? <a class="header-anchor" href="#apakah-construct-dan-gdevelop-dapat-mengekspor-ke-web" aria-label="Permalink to &quot;Apakah Construct dan GDevelop dapat mengekspor ke web?&quot;"></a></h3>
<p>Ya, keduanya dapat mengekspor game HTML5 yang berjalan di browser. Construct berbasis HTML5 dengan kemampuan ekspor web yang matang dan andal. GDevelop memungkinkan ekspor build HTML5 tanpa batas, termasuk secara lokal dan gratis. Keduanya merupakan pilihan yang solid untuk game browser.</p>
<BuildCta
  title="Tanpa kode itu hebat. Tanpa engine lebih cepat"
  desc="Jelaskan gamenya tanpa perlu merangkai event sheet."
  prompt="Buat game kejar-kejaran labirin dari atas, tempat hantu memburuku dan aku mengumpulkan kunci" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — seluruh pilihan engine 2D, dengan dan tanpa kode</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Dibandingkan)</a> — 2D dan 3D</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — aset visual dan audio untuk game Anda</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — memperkenalkan game Anda kepada pemain</li>
<li><a href="/id/engine.html">Cinevva</a> — buat game dengan alat bertenaga AI yang mengutamakan web</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/construct-vs-gdevelop-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Godot vs Unity untuk Game Web (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/godot-vs-unity-web-games</link>
            <guid>https://app.cinevva.com/id/guides/godot-vs-unity-web-games</guid>
            <pubDate>Sun, 07 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Godot vs Unity untuk game browser pada 2026 - ukuran build, WebGL2 vs WebGPU, batas ekspor web C#, dukungan iOS, dan harga, dengan pilihan yang jelas untuk setiap jenis game web.]]></description>
            <content:encoded><![CDATA[<h1 id="godot-vs-unity-untuk-game-web-2026" tabindex="-1">Godot vs Unity untuk Game Web (2026) <a class="header-anchor" href="#godot-vs-unity-untuk-game-web-2026" aria-label="Permalink to &quot;Godot vs Unity untuk Game Web (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/godot-vs-unity-web-hero.jpg?v=2" alt="Godot vs Unity untuk game web pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Godot dan Unity sama-sama dapat merilis game ke browser. Namun, keduanya mencapainya dengan cara yang sangat berbeda, dan khusus untuk web, kesenjangan di antara keduanya lebih tajam daripada yang terlihat dalam perdebatan umum &quot;Godot vs Unity&quot;. Panduan ini membandingkan keduanya berdasarkan hal-hal yang benar-benar menentukan sebuah build web: ukuran unduhan, rendering, dukungan bahasa, browser seluler, dan biaya.</p>
<p>Jika Anda ingin melihat gambaran yang lebih luas untuk semua engine browser, mulailah dengan <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web</a> kami. Halaman ini berfokus pada dua pilihan engine lengkap terbesar.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/84Prr0SOMvk" title="Unity atau Godot pada 2025 - Engine Game Mana yang Tepat untuk Anda?" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Gamefromscratch menjelaskan penggunaan yang paling cocok untuk setiap engine. Versi singkatnya untuk web tersedia di bawah ini.</div>
<h2 id="kesimpulan-singkat" tabindex="-1">Kesimpulan Singkat <a class="header-anchor" href="#kesimpulan-singkat" aria-label="Permalink to &quot;Kesimpulan Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Godot</th>
<th>Unity</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Ukuran build web (kosong)</strong></td>
<td>~5 MB Brotli, ~9 MB gzip</td>
<td>~7,7 MB 2D, ~10,7 MB 3D, ~2 MB setelah stripping (Brotli)</td>
</tr>
<tr>
<td><strong>Bahasa untuk web</strong></td>
<td>Hanya GDScript (C# belum dapat diekspor ke web)</td>
<td>C# (berfungsi di web)</td>
</tr>
<tr>
<td><strong>Rendering web</strong></td>
<td>WebGL2 (renderer Compatibility)</td>
<td>WebGL2, ditambah WebGPU eksperimental</td>
</tr>
<tr>
<td><strong>iOS/Safari</strong></td>
<td>Baik dengan ekspor single-threaded (4.3+)</td>
<td>Web seluler sejak Unity 6</td>
</tr>
<tr>
<td><strong>Biaya</strong></td>
<td>Gratis, MIT, tanpa biaya selamanya</td>
<td>Personal gratis di bawah $200 ribu; Pro $2.310/tahun/seat</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Game web 2D kecil dan 3D ringan yang gratis</td>
<td>3D lebih berat, tim C#, ekosistem aset besar</td>
</tr>
</tbody>
</table>
<p>Faktor penentu terbesar: <strong>jika game Anda ditulis dalam C#, Unity dapat merilisnya ke web, sedangkan Godot masih belum bisa.</strong> Semua pertimbangan lainnya mengikuti hal tersebut.</p>
<h2 id="ukuran-build-dan-waktu-muat" tabindex="-1">Ukuran Build dan Waktu Muat <a class="header-anchor" href="#ukuran-build-dan-waktu-muat" aria-label="Permalink to &quot;Ukuran Build dan Waktu Muat&quot;"></a></h2>
<p>Ukuran unduhan adalah hal pertama yang dirasakan pemain web. Ekspor web Godot mengirimkan engine sebagai biner WebAssembly yang setelah dikompresi berukuran sekitar 5 MB dengan Brotli, atau sekitar 9 MB dengan gzip. Ukuran tersebut berasal dari template bawaan yang memuat engine lengkap (renderer 3D, audio, jaringan) karena template itu tidak dapat mengetahui fitur mana yang digunakan game Anda.</p>
<p>Build web kosong Unity, yang diukur pada Unity 6 dengan Brotli, berukuran sekitar 7,7 MB untuk proyek 2D dengan built-in pipeline dan 10,7 MB untuk template 3D URP. Build minimal yang dipangkas secara agresif dapat mencapai sekitar 2 MB. Jadi, build 2D Unity yang dipangkas dengan cermat dapat mendekati ukuran Godot, tetapi ukuran bawaan Godot lebih kecil tanpa banyak usaha.</p>
<p>Untuk kedua engine, ukuran aset Anda biasanya jauh melampaui biner engine. Kompres tekstur dan audio, streaming apa pun yang memungkinkan, dan pilihan engine akan menjadi kurang penting dibandingkan anggaran aset Anda.</p>
<h2 id="batasan-c-baca-ini-sebelum-memilih" tabindex="-1">Batasan C# (Baca Ini Sebelum Memilih) <a class="header-anchor" href="#batasan-c-baca-ini-sebelum-memilih" aria-label="Permalink to &quot;Batasan C# (Baca Ini Sebelum Memilih)&quot;"></a></h2>
<p>Inilah masalah yang sering mengejutkan tim. Hingga 2026, <strong>proyek Godot yang ditulis dalam C# (.NET) belum dapat diekspor secara resmi ke web.</strong> GDScript dapat diekspor tanpa masalah. Sebuah prototipe web C# yang berfungsi didemonstrasikan di GodotCon Boston pada Mei 2025 dengan menautkan Mono secara statis, tetapi menghasilkan payload besar dan timnya tidak bersedia menetapkan jadwal rilis.</p>
<p>Sebaliknya, Unity mengompilasi C# menjadi WebAssembly dan telah mendukung C# di browser selama bertahun-tahun. Jadi, jika Anda memiliki basis kode C# yang sudah ada atau tim Anda hanya menguasai C#, Unity adalah pilihan praktis untuk web. Jika Anda memulai dari awal dan nyaman menggunakan GDScript, jalur web Godot sangat mulus.</p>
<h2 id="rendering-webgl2-vs-webgpu" tabindex="-1">Rendering: WebGL2 vs WebGPU <a class="header-anchor" href="#rendering-webgl2-vs-webgpu" aria-label="Permalink to &quot;Rendering: WebGL2 vs WebGPU&quot;"></a></h2>
<p>Ekspor web Godot menargetkan WebGL2 melalui renderer Compatibility. Pengembangan WebGPU yang lebih luas belum siap untuk ekspor web produksi. Godot 4.7 (Juni 2026, diikuti 4.7.1 pada Juli 2026) mengaktifkan WebAssembly SIMD secara default dan menambahkan opsi ekspor wasm64, yang membantu performa web tanpa perubahan kode.</p>
<p>Unity 6 menambahkan backend WebGPU eksperimental yang menyediakan compute shader dan fitur GPU modern di luar WebGL2, sementara WebGL2 tetap menjadi fallback yang aman. WebGPU belum tersedia di setiap browser (lihat <a href="/id/guides/web-games-stack-2026.html">panduan tech stack game web</a> kami untuk dukungan terkini), jadi perlakukan WebGPU sebagai jalur peningkatan, bukan standar minimum. Unity 6 juga meningkatkan heap WebAssembly menjadi 4 GB serta menambahkan Wasm SIMD dan native exception.</p>
<p>Jika Anda membutuhkan compute shader atau 3D yang lebih berat di browser saat ini, jalur WebGPU Unity lebih unggul. Untuk 2D dan 3D yang lebih ringan di WebGL2, keduanya sama-sama memadai.</p>
<h2 id="threading-ios-dan-kerumitan-hosting" tabindex="-1">Threading, iOS, dan Kerumitan Hosting <a class="header-anchor" href="#threading-ios-dan-kerumitan-hosting" aria-label="Permalink to &quot;Threading, iOS, dan Kerumitan Hosting&quot;"></a></h2>
<p>Godot 4 pada awalnya memerlukan SharedArrayBuffer, yang hanya disediakan browser ketika halaman diisolasi lintas origin (header COOP dan COEP). Hal ini merepotkan dari sisi hosting, dan di itch.io hanya berfungsi di Chrome. Sejak Godot 4.3, Anda dapat mengekspor build single-threaded yang sepenuhnya menghilangkan persyaratan tersebut. Perubahan itu juga memperbaiki masalah pemutaran di iOS dan Safari yang telah berlangsung lama. Untuk game Godot yang mengutamakan web, ekspor single-threaded biasanya menjadi pilihan bawaan yang lebih aman.</p>
<p>Build web Unity juga menggunakan WebAssembly, dengan dukungan web seluler yang dimulai pada Unity 6. Jika Anda menargetkan berbagai browser seluler, lakukan pengujian pada perangkat nyata sejak awal di kedua engine, karena build web biasanya pertama kali bermasalah di sana.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/WB7v-ezqcJM" title="Saya Membuat Game yang Sama di Unity dan Godot, Engine Mana yang Lebih Baik?" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Thomas Grové membuat game yang sama di kedua engine, memberikan gambaran praktis untuk membandingkan alur kerja sehari-hari.</div>
<h2 id="harga" tabindex="-1">Harga <a class="header-anchor" href="#harga" aria-label="Permalink to &quot;Harga&quot;"></a></h2>
<p>Godot gratis di bawah lisensi MIT. Tanpa biaya seat, tanpa royalti, tanpa batas pendapatan, dan tanpa biaya apa pun, selamanya.</p>
<p>Unity kembali menggunakan langganan berbasis seat setelah membatalkan Runtime Fee pada September 2024 (dan biaya tersebut belum kembali). Unity Personal tetap gratis hingga pendapatan atau pendanaan sebesar $200 ribu, dan splash &quot;Made with Unity&quot; menjadi opsional di Unity 6. Unity Pro berharga $2.310 per seat per tahun setelah kenaikan sekitar 5% untuk paket berbayar mulai berlaku pada awal 2026. Bagi developer solo atau tim kecil yang masih berada di bawah batas tersebut, kedua engine pada dasarnya gratis untuk merilis game.</p>
<h2 id="kapan-harus-memilih-masing-masing" tabindex="-1">Kapan Harus Memilih Masing-Masing <a class="header-anchor" href="#kapan-harus-memilih-masing-masing" aria-label="Permalink to &quot;Kapan Harus Memilih Masing-Masing&quot;"></a></h2>
<p>Pilih <strong>Godot</strong> untuk web jika Anda menginginkan game browser 2D atau 3D ringan yang gratis dan berukuran kecil, dukungan iOS dan Safari yang lancar melalui ekspor single-threaded, serta nyaman menulis GDScript.</p>
<p>Pilih <strong>Unity</strong> untuk web jika Anda membutuhkan 3D yang lebih berat atau compute shader melalui WebGPU, menginginkan ekosistem aset yang lebih besar, atau memiliki tim C#, serta dapat menerima build yang lebih besar dan keterbatasan WebGPU eksperimental.</p>
<p>Apa pun pilihannya, build Anda tetap harus dimuat dengan cepat dan berjalan di ponsel. Setelah memilih, lihat <a href="/id/tutorials/ship-web-game-fast.html">merilis game web yang dimuat dengan cepat</a>.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bisakah-godot-mengekspor-game-c-ke-web" tabindex="-1">Bisakah Godot mengekspor game C# ke web? <a class="header-anchor" href="#bisakah-godot-mengekspor-game-c-ke-web" aria-label="Permalink to &quot;Bisakah Godot mengekspor game C# ke web?&quot;"></a></h3>
<p>Belum secara resmi hingga 2026. Ekspor web Godot berfungsi untuk GDScript, tetapi proyek C# (.NET) belum dapat diekspor ke browser. Sebuah prototipe ditampilkan di GodotCon Boston pada Mei 2025, tetapi belum ada tanggal rilis yang ditetapkan. Jika Anda membutuhkan C# di web, saat ini Unity adalah satu-satunya dari kedua engine tersebut yang dapat merilisnya.</p>
<h3 id="apakah-godot-atau-unity-lebih-kecil-untuk-build-web" tabindex="-1">Apakah Godot atau Unity lebih kecil untuk build web? <a class="header-anchor" href="#apakah-godot-atau-unity-lebih-kecil-untuk-build-web" aria-label="Permalink to &quot;Apakah Godot atau Unity lebih kecil untuk build web?&quot;"></a></h3>
<p>Build web kosong Godot berukuran sekitar 5 MB setelah dikompresi dengan Brotli. Build kosong Unity 6 berukuran sekitar 7,7 MB untuk 2D dan 10,7 MB untuk 3D, meskipun build Unity yang dipangkas secara agresif dapat mencapai sekitar 2 MB. Godot lebih kecil secara default, tetapi build 2D Unity yang dioptimalkan dapat mendekatinya. Aset Anda sendiri biasanya lebih berpengaruh daripada biner engine.</p>
<h3 id="apakah-unity-mendukung-webgpu-di-browser" tabindex="-1">Apakah Unity mendukung WebGPU di browser? <a class="header-anchor" href="#apakah-unity-mendukung-webgpu-di-browser" aria-label="Permalink to &quot;Apakah Unity mendukung WebGPU di browser?&quot;"></a></h3>
<p>Ya, Unity 6 menambahkan backend WebGPU eksperimental dengan compute shader dan fitur GPU modern, dengan WebGL2 sebagai fallback. Fitur ini berlabel eksperimental dan tidak didukung di setiap browser, jadi gunakan WebGL2 sebagai standar minimum dan perlakukan WebGPU sebagai peningkatan.</p>
<h3 id="mana-yang-lebih-baik-untuk-game-browser-godot-atau-unity" tabindex="-1">Mana yang lebih baik untuk game browser, Godot atau Unity? <a class="header-anchor" href="#mana-yang-lebih-baik-untuk-game-browser-godot-atau-unity" aria-label="Permalink to &quot;Mana yang lebih baik untuk game browser, Godot atau Unity?&quot;"></a></h3>
<p>Untuk game 2D ringan atau 3D yang lebih ringan, gratis, dan memiliki dukungan iOS yang baik, Godot menawarkan jalur web yang lebih mulus, selama Anda menggunakan GDScript. Untuk 3D yang lebih berat, compute shader, ekosistem yang lebih besar, atau basis kode C# yang sudah ada, Unity lebih unggul di web. Pertanyaan mengenai C# biasanya menjadi penentunya.</p>
<BuildCta
  title="Buat prototipe di browser sebelum menentukan pilihan"
  desc="Uji ide Anda sebagai game web yang dapat dimainkan terlebih dahulu, lalu pilih engine."
  prompt="Buat game pengumpul koin sudut pandang orang ketiga di pulau-pulau terapung" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/vibe-coding-game-prompts.html">100 Ide Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — ambil sebuah ide dan jadikan dapat dimainkan dalam waktu sekitar satu menit</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Dibandingkan)</a> — perbandingan lengkap, tidak hanya dua engine ini</li>
<li><a href="/id/guides/unity-alternatives-web-games.html">Alternatif Unity untuk Game Web</a> — semua pilihan yang mendukung web, berdasarkan alasan Anda meninggalkan Unity</li>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — jika game Anda 2D, mulailah di sini</li>
<li><a href="/id/guides/web-games-stack-2026.html">Tech Stack Game Web pada 2026</a> — penjelasan tentang WebGL, WebGPU, dan Wasm</li>
<li><a href="/id/tutorials/ship-web-game-fast.html">Merilis game web yang dimuat dengan cepat</a> — strategi ukuran build dan waktu muat</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang mengutamakan web dan dibangun di atas Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/godot-vs-unity-web-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[PlayCanvas vs Three.js: Perbandingan 3D Web (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/playcanvas-vs-threejs</link>
            <guid>https://app.cinevva.com/id/guides/playcanvas-vs-threejs</guid>
            <pubDate>Sun, 07 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[PlayCanvas vs Three.js untuk 3D di web - mesin lengkap dengan editor visual dibandingkan dengan pustaka rendering, termasuk dukungan WebGPU, sistem bawaan, harga, dan kapan sebaiknya memilih masing-masing.]]></description>
            <content:encoded><![CDATA[<h1 id="playcanvas-vs-three-js-perbandingan-3d-web-2026" tabindex="-1">PlayCanvas vs Three.js: Perbandingan 3D Web (2026) <a class="header-anchor" href="#playcanvas-vs-three-js-perbandingan-3d-web-2026" aria-label="Permalink to &quot;PlayCanvas vs Three.js: Perbandingan 3D Web (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/playcanvas-vs-threejs-hero.jpg?v=2" alt="PlayCanvas vs Three.js untuk 3D web pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Keduanya sering dianggap sebagai pesaing, tetapi sebenarnya bukan jenis alat yang sama. PlayCanvas adalah mesin game lengkap dengan editor visual. Three.js adalah pustaka rendering yang Anda kembangkan melalui kode. Memilih di antara keduanya pada dasarnya bergantung pada seberapa banyak hal yang ingin langsung tersedia dibandingkan dengan seberapa besar kendali yang Anda inginkan. Berikut perbandingannya untuk 3D web pada 2026.</p>
<p>Untuk melihat pilihan yang lebih luas, baca <a href="/id/guides/web-game-engines-comparison.html">perbandingan mesin game web</a> kami.</p>
<h2 id="kesimpulan-singkat" tabindex="-1">Kesimpulan Singkat <a class="header-anchor" href="#kesimpulan-singkat" aria-label="Permalink to &quot;Kesimpulan Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>PlayCanvas</th>
<th>Three.js</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Jenis alat</strong></td>
<td>Mesin lengkap + editor cloud</td>
<td>Pustaka rendering (tanpa editor)</td>
</tr>
<tr>
<td><strong>Alur kerja</strong></td>
<td>Editor visual, kolaborasi waktu nyata</td>
<td>Hanya melalui kode</td>
</tr>
<tr>
<td><strong>Rendering</strong></td>
<td>WebGL2 + WebGPU</td>
<td>WebGL2 + WebGPU (WebGPURenderer)</td>
</tr>
<tr>
<td><strong>Sistem bawaan</strong></td>
<td>ECS, fisika, animasi, audio, input</td>
<td>Hanya renderer, Anda menambahkan sisanya</td>
</tr>
<tr>
<td><strong>Lisensi/biaya</strong></td>
<td>Mesin berlisensi MIT; editor gratis hingga $50/kursi/bulan</td>
<td>MIT, gratis</td>
</tr>
<tr>
<td><strong>Paling cocok untuk</strong></td>
<td>Tim yang menginginkan mesin siap pakai + editor</td>
<td>Proyek khusus yang mengutamakan kode dan kendali maksimal</td>
</tr>
</tbody>
</table>
<h2 id="mesin-vs-pustaka" tabindex="-1">Mesin vs Pustaka <a class="header-anchor" href="#mesin-vs-pustaka" aria-label="Permalink to &quot;Mesin vs Pustaka&quot;"></a></h2>
<p>Inilah inti perbedaannya dalam satu kalimat. <strong>PlayCanvas menyediakan mesin game</strong>: sistem entitas-komponen, fisika, animasi, audio, input, dan pipeline aset yang semuanya telah terintegrasi, ditambah editor berbasis browser tempat tim dapat membangun adegan bersama-sama secara waktu nyata (bayangkan penyuntingan kolaboratif seperti alat desain untuk 3D).</p>
<p><strong>Three.js menyediakan renderer.</strong> Grafik adegan, kamera, lampu, material, serta renderer WebGL/WebGPU yang cepat. Tidak ada editor, fisika, maupun ketentuan tentang game loop. Anda menambahkan fisika dengan alat seperti Rapier atau cannon-es, menyusun logika game sendiri, dan membuat alat apa pun yang diperlukan. Itu memberi kebebasan, tetapi juga menambah pekerjaan.</p>
<p>Jadi, pertanyaan sebenarnya bukanlah &quot;mana yang lebih baik&quot;, melainkan &quot;apakah saya menginginkan mesin atau renderer?&quot;</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/-0envvPmj5k" title="Mesin Game PlayCanvas Menjadi Sumber Terbuka" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Gamefromscratch membahas PlayCanvas yang menjadi sumber terbuka.</div>
<h2 id="rendering-dan-webgpu" tabindex="-1">Rendering dan WebGPU <a class="header-anchor" href="#rendering-dan-webgpu" aria-label="Permalink to &quot;Rendering dan WebGPU&quot;"></a></h2>
<p>Keduanya modern dalam hal GPU. PlayCanvas berjalan dengan backend ganda WebGL2 dan WebGPU. Rilis v2.0-nya (Agustus 2024) sepenuhnya menghentikan dukungan WebGL1, dan versi mesin terbaru menambahkan jalur WebGPU berbasis komputasi untuk Gaussian splat 3D. Three.js merilis WebGPURenderer yang siap produksi sekitar r171 (September 2025), dengan penyiapan yang hampir tanpa konfigurasi dan fallback WebGL2 otomatis, ditambah TSL (Three.js Shading Language) agar Anda dapat menulis shader sekali dan menargetkan kedua backend.</p>
<p>Untuk sebagian besar proyek pada 2026, keduanya mampu menghasilkan rendering yang sangat baik. WebGPU menjadi jalur peningkatan bagi keduanya, sedangkan WebGL2 merupakan dasar yang aman. Lihat <a href="/id/guides/web-games-stack-2026.html">panduan stack teknologi game web</a> kami untuk mengetahui dukungan browser terkini.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/7we9mqIOKyw" title="Mengadopsi WebGPU dan WebXR dengan Three.js - Mr.doob, JSNation 2024" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Kreator Three.js, Mr.doob, membahas arah WebGPU dan WebXR dalam perkembangan pustaka tersebut.</div>
<h2 id="alur-kerja-lisensi-dan-biaya" tabindex="-1">Alur Kerja, Lisensi, dan Biaya <a class="header-anchor" href="#alur-kerja-lisensi-dan-biaya" aria-label="Permalink to &quot;Alur Kerja, Lisensi, dan Biaya&quot;"></a></h2>
<p>Editor PlayCanvas adalah fitur unggulannya: editor adegan kolaboratif yang dihosting dan dilengkapi pipeline aset. Mesinnya bersifat sumber terbuka di bawah lisensi MIT, dan frontend editornya juga dijadikan sumber terbuka pada 2025. Editor yang dihosting tersedia dalam beberapa paket: paket gratis, paket Personal sekitar $15 per bulan, dan paket Organization sekitar $50 per kursi per bulan. Perbedaan utamanya terletak pada kapasitas penyimpanan dan batas proyek privat.</p>
<p>Three.js berlisensi MIT dan sepenuhnya gratis. Tidak ada biaya editor karena memang tidak menyediakan editor. &quot;Biaya&quot; Anda adalah waktu rekayasa yang diperlukan untuk membangun struktur yang sudah disediakan PlayCanvas.</p>
<h2 id="kapan-harus-memilih-masing-masing" tabindex="-1">Kapan Harus Memilih Masing-Masing <a class="header-anchor" href="#kapan-harus-memilih-masing-masing" aria-label="Permalink to &quot;Kapan Harus Memilih Masing-Masing&quot;"></a></h2>
<p>Pilih <strong>PlayCanvas</strong> ketika Anda menginginkan mesin lengkap dan editor visual yang siap digunakan, tim Anda perlu berkolaborasi dalam pembuatan adegan, dan Anda lebih suka melakukan konfigurasi daripada membangun semuanya dari awal. PlayCanvas sangat cocok untuk konfigurator produk, pengalaman 3D interaktif, dan tim yang ingin merilis dengan cepat.</p>
<p>Pilih <strong>Three.js</strong> ketika Anda menginginkan kendali penuh atas rendering dan arsitektur, nyaman merangkai stack sendiri, atau sedang membangun sesuatu yang sangat khusus sehingga ketentuan bawaan mesin justru akan membatasi. Ekosistemnya juga lebih besar dan keahlian 3D web ini paling banyak dicari. Kami membangun <a href="/id/engine.html">Cinevva Engine</a> di atas Three.js karena alasan tersebut: mengutamakan web, terbuka, dan tanpa batasan dalam hal penyesuaian.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-playcanvas-atau-three-js-lebih-baik-untuk-game-web" tabindex="-1">Apakah PlayCanvas atau Three.js lebih baik untuk game web? <a class="header-anchor" href="#apakah-playcanvas-atau-three-js-lebih-baik-untuk-game-web" aria-label="Permalink to &quot;Apakah PlayCanvas atau Three.js lebih baik untuk game web?&quot;"></a></h3>
<p>Tidak ada yang mutlak lebih baik karena keduanya merupakan alat yang berbeda. PlayCanvas adalah mesin lengkap dengan editor visual sehingga Anda dapat lebih cepat merilis game terstruktur atau aplikasi interaktif, terutama jika dikerjakan oleh tim. Three.js adalah pustaka rendering yang memberi Anda kendali penuh, tetapi mengharuskan Anda membangun sendiri sistem game. Pilih PlayCanvas untuk solusi siap pakai dan Three.js untuk solusi khusus.</p>
<h3 id="apakah-three-js-merupakan-mesin-game" tabindex="-1">Apakah Three.js merupakan mesin game? <a class="header-anchor" href="#apakah-three-js-merupakan-mesin-game" aria-label="Permalink to &quot;Apakah Three.js merupakan mesin game?&quot;"></a></h3>
<p>Bukan. Three.js adalah pustaka rendering 3D. Pustaka ini menangani grafik adegan, kamera, lampu, material, dan rendering melalui WebGL2 atau WebGPU, tetapi tidak memiliki fisika, audio, input, atau game loop bawaan. Anda harus menambahkannya melalui pustaka lain (seperti Rapier untuk fisika) atau membuatnya sendiri. Sebaliknya, PlayCanvas adalah mesin lengkap.</p>
<h3 id="apakah-playcanvas-dan-three-js-mendukung-webgpu" tabindex="-1">Apakah PlayCanvas dan Three.js mendukung WebGPU? <a class="header-anchor" href="#apakah-playcanvas-dan-three-js-mendukung-webgpu" aria-label="Permalink to &quot;Apakah PlayCanvas dan Three.js mendukung WebGPU?&quot;"></a></h3>
<p>Ya, keduanya mendukung WebGPU pada 2026. PlayCanvas berjalan dengan backend ganda WebGL2/WebGPU. Three.js memiliki WebGPURenderer yang siap produksi (stabil sejak sekitar r171), dengan fallback WebGL2 otomatis dan TSL untuk shader lintas target. Gunakan WebGL2 sebagai dasar rilis dan manfaatkan WebGPU sebagai peningkatan performa.</p>
<h3 id="apakah-playcanvas-gratis" tabindex="-1">Apakah PlayCanvas gratis? <a class="header-anchor" href="#apakah-playcanvas-gratis" aria-label="Permalink to &quot;Apakah PlayCanvas gratis?&quot;"></a></h3>
<p>Mesin PlayCanvas gratis dan bersifat sumber terbuka di bawah lisensi MIT, sedangkan frontend editornya dijadikan sumber terbuka pada 2025. Editor cloud yang dihosting memiliki paket gratis serta paket berbayar (Personal sekitar $15/bulan dan Organization sekitar $50/kursi/bulan) yang terutama menambahkan kapasitas penyimpanan dan proyek privat. Three.js sepenuhnya gratis tanpa biaya editor.</p>
<BuildCta
  title="Ingin mendapatkan hasil 3D tanpa mempelajari seluk-beluk mesinnya?"
  desc="Jelaskan adegannya dan dapatkan sesuatu yang dapat dimainkan, bukan sekadar proyek boilerplate."
  prompt="Buat lintasan balap kelereng 3D dengan putaran loop dan pengatur waktu" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-game-engines-comparison.html">Mesin Game Web Terbaik untuk 2026 (Perbandingan)</a> — perbandingan lengkap</li>
<li><a href="/id/guides/threejs-vs-babylonjs.html">Three.js vs Babylon.js</a> — jika pilihan Anda sudah mengerucut ke pustaka 3D web</li>
<li><a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk Game Web</a> — mesin lengkap, bukan pustaka</li>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Game Web pada 2026</a> — WebGL, WebGPU, dan Wasm</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — mesin sumber terbuka kami yang dibangun di atas Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/playcanvas-vs-threejs-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Three.js vs Babylon.js: Library 3D Web Mana yang Tepat (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/threejs-vs-babylonjs</link>
            <guid>https://app.cinevva.com/id/guides/threejs-vs-babylonjs</guid>
            <pubDate>Sun, 07 Jun 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Three.js vs Babylon.js pada 2026 - renderer minimalis versus engine lengkap, dukungan WebGPU dan WGSL, alat bawaan, ukuran bundle, TypeScript, serta kapan sebaiknya memilih masing-masing untuk 3D web.]]></description>
            <content:encoded><![CDATA[<h1 id="three-js-vs-babylon-js-library-3d-web-mana-yang-tepat-2026" tabindex="-1">Three.js vs Babylon.js: Library 3D Web Mana yang Tepat (2026) <a class="header-anchor" href="#three-js-vs-babylon-js-library-3d-web-mana-yang-tepat-2026" aria-label="Permalink to &quot;Three.js vs Babylon.js: Library 3D Web Mana yang Tepat (2026)&quot;"></a></h1>
<figure style="margin:1.5rem 0">
<img src="https://cdn.cinevva.com/guides/threejs-vs-babylonjs-hero.jpg?v=2" alt="Three.js vs Babylon.js untuk 3D web pada 2026" style="width:100%;border-radius:10px">
</figure>
<p>Keduanya adalah raksasa di dunia 3D web, dan pilihan di antara keduanya bergantung pada filosofi. Three.js adalah renderer ramping yang dapat Anda perluas. Babylon.js adalah engine lengkap dengan berbagai alat yang sudah tersedia. Keduanya sangat bagus, gratis, dan mendukung WebGPU pada 2026. Berikut cara memilihnya.</p>
<p>Jika Anda mencari engine 2D atau engine game lengkap, lihat <a href="/id/guides/web-game-engines-comparison.html">perbandingan engine game web</a>.</p>
<h2 id="ringkasan-singkat" tabindex="-1">Ringkasan Singkat <a class="header-anchor" href="#ringkasan-singkat" aria-label="Permalink to &quot;Ringkasan Singkat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th>Three.js</th>
<th>Babylon.js</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Gaya</strong></td>
<td>Renderer/library minimalis</td>
<td>Engine/framework lengkap</td>
</tr>
<tr>
<td><strong>Bahasa</strong></td>
<td>JavaScript (dengan definisi tipe)</td>
<td>Mengutamakan TypeScript</td>
</tr>
<tr>
<td><strong>Alat bawaan</strong></td>
<td>Renderer; add-on untuk kebutuhan lainnya</td>
<td>Fisika, GUI, Inspector, Playground, NME</td>
</tr>
<tr>
<td><strong>WebGPU</strong></td>
<td>WebGPURenderer + TSL</td>
<td>Inti GLSL + WGSL (8.0)</td>
</tr>
<tr>
<td><strong>Bundle</strong></td>
<td>Inti lebih kecil dan mendukung tree-shaking</td>
<td>Lebih besar, tetapi modular</td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>MIT</td>
<td>Apache 2.0</td>
</tr>
<tr>
<td><strong>Terbaik untuk</strong></td>
<td>Proyek khusus dan ringan, ekosistem terbesar</td>
<td>Solusi lengkap dengan alat yang mumpuni</td>
</tr>
</tbody>
</table>
<h2 id="library-vs-framework" tabindex="-1">Library vs Framework <a class="header-anchor" href="#library-vs-framework" aria-label="Permalink to &quot;Library vs Framework&quot;"></a></h2>
<p>Three.js mempertahankan inti yang kecil dan menyerahkan sisanya kepada Anda serta komunitas. Anda mendapatkan renderer, scene graph, dan material yang sangat baik, lalu menggunakan add-on ketika memerlukan fisika, post-processing, atau kontrol. Ini adalah library 3D web paling populer dan memiliki ekosistem terbesar, yang berarti lebih banyak contoh, tutorial, dan tenaga ahli yang dapat direkrut.</p>
<p>Babylon.js adalah engine yang lebih lengkap dan didukung oleh Microsoft. Engine ini dilengkapi fisika, sistem GUI, animasi, Inspector bawaan untuk men-debug scene, Playground online untuk berbagi kode, serta Node Material Editor untuk membuat shader secara visual. Jika Anda menginginkan alat dan struktur yang sudah disediakan alih-alih merakitnya sendiri, Babylon menawarkan lebih banyak sejak hari pertama.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/kKaomUggipQ" title="Memperkenalkan Babylon.js 8.0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Presentasi resmi Babylon.js 8.0 memberikan gambaran tentang banyaknya fitur yang sudah tersedia di dalamnya.</div>
<h2 id="webgpu-pada-2026" tabindex="-1">WebGPU pada 2026 <a class="header-anchor" href="#webgpu-pada-2026" aria-label="Permalink to &quot;WebGPU pada 2026&quot;"></a></h2>
<p>Keduanya kini serius mengembangkan WebGPU. Babylon.js 8.0 (Maret 2025) menyediakan seluruh shader inti engine dalam GLSL dan WGSL. Perubahan ini menghilangkan lapisan konversi berukuran beberapa megabita dan membuat ukuran engine kira-kira setengahnya saat menargetkan WebGPU. Babylon.js 9.0 (Maret 2026) melangkah lebih jauh dengan clustered lighting, pencahayaan volumetrik melalui compute shader, frame graph, dan area light.</p>
<p>Three.js memiliki WebGPURenderer yang siap digunakan dalam produksi dengan fallback otomatis ke WebGL2, sementara TSL memungkinkan Anda menulis shader satu kali untuk kedua backend. Rilis terbaru terus menyempurnakannya.</p>
<p>Kesimpulannya: WebGPU sudah solid pada keduanya. Babylon lebih mengandalkan fitur berbasis compute shader, sedangkan Three.js mempertahankan renderer yang ramping dan fleksibel.</p>
<h2 id="typescript-ukuran-bundle-dan-ekosistem" tabindex="-1">TypeScript, Ukuran Bundle, dan Ekosistem <a class="header-anchor" href="#typescript-ukuran-bundle-dan-ekosistem" aria-label="Permalink to &quot;TypeScript, Ukuran Bundle, dan Ekosistem&quot;"></a></h2>
<p>Babylon.js mengutamakan TypeScript dan hampir seluruhnya ditulis dalam TS, sesuatu yang disukai banyak tim untuk basis kode besar. Three.js menggunakan JavaScript dengan definisi tipe terpisah yang berfungsi baik, tetapi bukan merupakan sumber acuan utama.</p>
<p>Dalam hal ukuran, Three.js memiliki inti yang lebih kecil dan lebih mendukung tree-shaking, sehingga scene minimal memuat lebih sedikit kode. Babylon lebih besar, tetapi bersifat modular melalui scoped package, dan jalur WGSL-native-nya memperkecil selisih ukuran untuk WebGPU.</p>
<p>Dalam hal skala dan produksi komunitas, ekosistem Three.js lebih unggul. Untuk kelengkapan alat bawaan, Babylon lebih unggul.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/6k5ZK3SV3ko" title="Memindahkan Three.js dari WebGL ke WebGPU - Mr.doob, JSConf JP 2024" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Kreator Three.js, Mr.doob, membahas peralihan ke WebGPU.</div>
<h2 id="kapan-harus-memilih-masing-masing" tabindex="-1">Kapan Harus Memilih Masing-Masing <a class="header-anchor" href="#kapan-harus-memilih-masing-masing" aria-label="Permalink to &quot;Kapan Harus Memilih Masing-Masing&quot;"></a></h2>
<p>Pilih <strong>Three.js</strong> jika Anda menginginkan renderer yang ringan dan fleksibel, ekosistem terbesar, serta kebebasan untuk merancang arsitektur sesuai keinginan. Ini merupakan pilihan utama untuk proyek 3D web khusus dan keahlian yang paling mudah diterapkan di berbagai proyek.</p>
<p>Pilih <strong>Babylon.js</strong> jika Anda menginginkan engine lengkap dengan alat bawaan yang mumpuni (Inspector, Playground, Node Material Editor), pengembangan yang mengutamakan TypeScript, serta stabilitas dengan dukungan perusahaan, dan Anda bersedia menerima bundle yang sedikit lebih besar demi memperoleh solusi lengkap.</p>
<p>Keduanya merupakan pilihan yang sangat baik. Kami memilih Three.js untuk <a href="/id/engine.html">Cinevva Engine</a> karena menginginkan fondasi ramping yang mengutamakan web dan dapat kami bentuk sendiri.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-three-js-atau-babylon-js-lebih-baik" tabindex="-1">Apakah Three.js atau Babylon.js lebih baik? <a class="header-anchor" href="#apakah-three-js-atau-babylon-js-lebih-baik" aria-label="Permalink to &quot;Apakah Three.js atau Babylon.js lebih baik?&quot;"></a></h3>
<p>Keduanya sangat bagus dan gratis. Three.js adalah renderer minimalis dengan ekosistem terbesar, paling cocok ketika Anda menginginkan fleksibilitas dan ingin membangun struktur sendiri. Babylon.js adalah engine yang lebih lengkap dengan fisika, GUI, Inspector, dan Playground bawaan, paling cocok ketika Anda menginginkan alat yang sudah tersedia serta pengembangan yang mengutamakan TypeScript. Ini adalah pilihan filosofi, bukan perbedaan kualitas.</p>
<h3 id="apakah-three-js-dan-babylon-js-mendukung-webgpu" tabindex="-1">Apakah Three.js dan Babylon.js mendukung WebGPU? <a class="header-anchor" href="#apakah-three-js-dan-babylon-js-mendukung-webgpu" aria-label="Permalink to &quot;Apakah Three.js dan Babylon.js mendukung WebGPU?&quot;"></a></h3>
<p>Ya, keduanya mendukung WebGPU pada 2026. Three.js memiliki WebGPURenderer yang siap digunakan dalam produksi dengan fallback WebGL2 dan TSL untuk shader lintas target. Babylon.js 8.0 membuat shader intinya WGSL-native (mengurangi ukuran bundle di WebGPU), sedangkan versi 9.0 menambahkan fitur compute shader seperti pencahayaan volumetrik. Gunakan WebGL2 sebagai standar dasar dan WebGPU jika tersedia.</p>
<h3 id="apakah-babylon-js-merupakan-engine-game-sedangkan-three-js-bukan" tabindex="-1">Apakah Babylon.js merupakan engine game, sedangkan Three.js bukan? <a class="header-anchor" href="#apakah-babylon-js-merupakan-engine-game-sedangkan-three-js-bukan" aria-label="Permalink to &quot;Apakah Babylon.js merupakan engine game, sedangkan Three.js bukan?&quot;"></a></h3>
<p>Secara garis besar, ya. Babylon.js adalah engine lengkap: mencakup fisika, sistem GUI, animasi, Inspector, dan alat bergaya editor. Three.js adalah library rendering yang berfokus pada penggambaran 3D, sehingga Anda perlu menambahkan fisika, kontrol, dan sistem game melalui package lain atau kode sendiri. Itulah perbedaan utama di antara keduanya.</p>
<h3 id="mana-yang-lebih-kecil-three-js-atau-babylon-js" tabindex="-1">Mana yang lebih kecil, Three.js atau Babylon.js? <a class="header-anchor" href="#mana-yang-lebih-kecil-three-js-atau-babylon-js" aria-label="Permalink to &quot;Mana yang lebih kecil, Three.js atau Babylon.js?&quot;"></a></h3>
<p>Three.js memiliki inti yang lebih kecil dan lebih mendukung tree-shaking, sehingga scene minimal memuat lebih sedikit JavaScript. Babylon.js secara keseluruhan lebih besar, tetapi bersifat modular melalui scoped package, dan shader WGSL-native pada versi 8.0 kira-kira mengurangi ukurannya hingga setengah saat menargetkan WebGPU. Untuk bundle sekecil mungkin, Three.js tetap unggul.</p>
<BuildCta
  title="Dapatkan game 3D tanpa menulis renderer"
  desc="Kedua library berada di balik Cinevva, Anda cukup mendeskripsikan gamenya."
  prompt="Buat game endless runner 3D di browser" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/playcanvas-vs-threejs.html">PlayCanvas vs Three.js</a> — tambahkan editor visual ke dalam perbandingan</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Engine Game Web Terbaik untuk 2026 (Dibandingkan)</a> — perbandingan lengkap</li>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Game Web pada 2026</a> — WebGL, WebGPU, dan Wasm</li>
<li><a href="/id/guides/threejs-usdc-tech-report.html">Three.js + USDC di Browser</a> — memuat aset 3D USD di Three.js</li>
<li><a href="/id/engine.html">Cinevva Engine</a> — engine sumber terbuka kami yang dibangun di atas Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/threejs-vs-babylonjs-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Memberi Pemain Kekuatan untuk Membentuk Dunia]]></title>
            <link>https://app.cinevva.com/id/guides/player-world-sculpting</link>
            <guid>https://app.cinevva.com/id/guides/player-world-sculpting</guid>
            <pubDate>Sun, 05 Apr 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara mengubah kuas medan menjadi mainan. TNT yang menggali gua, benih yang menumbuhkan hutan, hujan yang mengikis tebing. Pola desain game untuk membuat pembentukan dunia menyenangkan bagi pemain kasual dalam dunia multipemain bersama.]]></description>
            <content:encoded><![CDATA[<h1 id="memberi-pemain-kekuatan-untuk-membentuk-dunia" tabindex="-1">Memberi Pemain Kekuatan untuk Membentuk Dunia <a class="header-anchor" href="#memberi-pemain-kekuatan-untuk-membentuk-dunia" aria-label="Permalink to &quot;Memberi Pemain Kekuatan untuk Membentuk Dunia&quot;"></a></h1>
<img src="https://cdn.cinevva.com/guides/player-world-sculpting-hero.jpg?v=2" alt="Pemain yang dikelilingi alat pembentuk medan: dinamit, cangkul, penyiram tanaman, benih, beliung, awan hujan, dan suar terraforming, yang membentuk ulang lanskap 3D penuh warna" style="width:100%;border-radius:8px;margin:1.5rem 0" />
<p>Tak seorang pun membuka game lalu berpikir, &quot;Saya ingin menerapkan fungsi falloff halus dengan interpolasi Hermite pada signed distance field.&quot; Mereka berpikir, &quot;Saya ingin menggali gua&quot;, &quot;Saya ingin membangun gunung&quot;, atau &quot;Saya ingin membuat sungai.&quot;</p>
<p>Sisi teknis pembentukan medan (marching cubes, kuas SDF, sambungan transvoxel) dibahas dalam <a href="/id/guides/terrain-sculpting-brushes.html">panduan riset pendamping kami</a>. Panduan ini membahas separuh lainnya dari masalah tersebut: cara memberikan kekuatan untuk membentuk medan kepada pemain kasual dan membuatnya terasa seperti bermain, bukan seperti menggunakan alat pemodelan 3D.</p>
<h2 id="masalah-metafora" tabindex="-1">Masalah Metafora <a class="header-anchor" href="#masalah-metafora" aria-label="Permalink to &quot;Masalah Metafora&quot;"></a></h2>
<p>Setiap game yang telah dirilis dan memungkinkan pemain membentuk ulang medan telah memecahkan masalah desain yang sama: parameter pembentukan mentah (radius, kekuatan, falloff, jenis operasi) tidak berarti apa-apa bagi sebagian besar pemain. Solusinya selalu sama: kemas kuas tersebut dalam metafora yang sudah dipahami pemain.</p>
<h3 id="minecraft-blok-sebagai-metafora-universal" tabindex="-1">Minecraft: Blok sebagai Metafora Universal <a class="header-anchor" href="#minecraft-blok-sebagai-metafora-universal" aria-label="Permalink to &quot;Minecraft: Blok sebagai Metafora Universal&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/MmB9b5njVbA" title="Trailer Resmi Minecraft" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">Trailer resmi Minecraft (Mojang). Dunia berbasis blok tempat TNT, beliung, dan sekop sekaligus berfungsi sebagai alat penyunting medan.</p>
</div>
<p>Kejeniusan Minecraft terletak pada cara penyuntingan medan dijadikan sekadar pengelolaan inventaris. Anda menghancurkan sebuah blok. Anda mendapatkan sebuah blok. Anda menempatkan sebuah blok. &quot;Kuasnya&quot; adalah satu voxel, &quot;falloff-nya&quot; bersifat biner (terpengaruh atau tidak), dan &quot;operasinya&quot; adalah menambah atau menghapus.</p>
<p>TNT memperbesar skala ini. Anda membuatnya dari bubuk mesiu dan pasir (material yang sudah Anda kumpulkan saat bermain), menempatkannya seperti blok lain, menyalakannya dengan batu api dan baja, lalu TNT tersebut mengukir sebuah bola dari medan. Radius ledakannya adalah 4–7 blok. Ketahanan terhadap ledakan berbeda-beda menurut material: tanah dan pasir hancur, batu bertahan sebagian, sedangkan obsidian kebal. Air meniadakan penghancuran blok, tetapi tidak meniadakan kerusakan pada entitas.</p>
<p>Pemain tidak pernah memikirkan radius ledakan sebagai sebuah parameter. Mereka berpikir, &quot;TNT itu kuat, obsidian itu kokoh, air adalah perisai.&quot; Sistem penyuntingan medan sepenuhnya diwujudkan melalui material dan item yang sudah dikenal pemain.</p>
<h3 id="valheim-peralatan-petani" tabindex="-1">Valheim: Peralatan Petani <a class="header-anchor" href="#valheim-peralatan-petani" aria-label="Permalink to &quot;Valheim: Peralatan Petani&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/zmIS9B3w7bw" title="Cara Meratakan dan Membentuk Medan di Valheim" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">Panduan jelas tentang cangkul, kultivator, dan beliung sebagai kosakata pembentukan medan di Valheim, termasuk trik meratakan dengan "berdiri di tempat ketinggian tanah yang Anda inginkan".</p>
</div>
<p>Valheim mengambil pendekatan yang berbeda. Alih-alih blok, game ini memberi pemain alat-alat pertanian praindustri:</p>
<p><strong>Cangkul</strong> (5 kayu + 2 batu, tersedia dalam 10 menit pertama) memiliki empat mode: Ratakan Tanah (meratakan sesuai ketinggian tempat Anda berdiri), Tinggikan Tanah (menambahkan tanah dengan biaya 2 batu setiap penggunaan), Jalan Setapak (menghilangkan rumput), dan Paving (memasang batu bulat). Mekanisme perataannya sangat cerdas: Anda berdiri di tempat yang ketinggiannya ingin dijadikan patokan, lalu cangkul membuat semua area di sekitar Anda menyamai ketinggian tersebut. Tanpa input angka. Kaki Anda menjadi acuannya.</p>
<p><strong>Kultivator</strong> (5 perunggu + 5 kayu inti, memerlukan peleburan) digunakan untuk menanam: mengolah tanah, menanam benih, menumbuhkan rumput, dan memulihkan vegetasi. Alat ini tidak membentuk medan, tetapi menghiasinya. Setelah meratakan lereng bukit dengan cangkul, Anda mengolahnya dan menanam hutan. Medan tersebut menceritakan sebuah kisah: seseorang pernah berada di sini dan menggarap tanah ini.</p>
<p><strong>Beliung</strong> menangani sisi destruktifnya. Alat ini menggali medan, kebalikan dari fungsi cangkul untuk meninggikan tanah. Ketiga alat tersebut (beliung menggali, cangkul meninggikan/meratakan, kultivator menanam) membentuk kosakata lengkap yang selaras dengan kegiatan pertanian di dunia nyata.</p>
<p>Model biayanya penting. Meninggikan tanah membutuhkan batu. Anda merasakan bobot setiap perubahan. Anda tidak bisa melakukan terraforming pada sebuah gunung secara gratis. Biaya sumber daya membuat pembentukan medan menjadi sebuah keputusan, bukan sekadar kotak centang.</p>
<h3 id="animal-crossing-terraforming-yang-harus-diperoleh" tabindex="-1">Animal Crossing: Terraforming yang Harus Diperoleh <a class="header-anchor" href="#animal-crossing-terraforming-yang-harus-diperoleh" aria-label="Permalink to &quot;Animal Crossing: Terraforming yang Harus Diperoleh&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/q9wHV8XmLfs" title="Cara Membuka Terraforming di Animal Crossing: New Horizons" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">GameXplain menunjukkan cara membuka aplikasi Island Designer, beserta izin pembangunan tebing dan lanskap perairan yang mengunci setiap alat pembentukan baru di balik mata uang yang harus diperoleh.</p>
</div>
<p>Animal Crossing: New Horizons mengunci terraforming di balik peringkat pulau 3 bintang. Anda harus membangun area perkemahan, mengundang penduduk, membangun kavling rumah, dan mengembangkan pulau selama berhari-hari (hari di dunia nyata, bukan jam dalam game) sebelum Tom Nook memberikan aplikasi Island Designer. Saat terraforming akhirnya terbuka, Anda sudah memahami pulau tersebut. Anda tahu letak sungainya, tebing mana yang menghalangi pemandangan favorit Anda, dan apa yang ingin Anda ubah.</p>
<p>Alat-alatnya menggunakan sistem izin. Jalan setapak gratis. Pembentukan lanskap perairan (membuat sungai, kolam, dan air terjun) berharga 6.000 Nook Miles. Pembangunan Tebing berharga 6.000 lagi. Setiap jenis jalan setapak tambahan berharga 2.000. Anda membelanjakan mata uang yang diperoleh melalui gameplay untuk memperluas peralatan kreatif Anda.</p>
<p>Penyuntingannya berbasis petak. Satu kotak setiap kali. Tanpa penggeser radius. Tanpa parameter kekuatan. Anda meninggikan satu petak tebing atau menggali satu petak sungai. Batasan ini membuatnya mudah didekati: kesalahan terburuk yang bisa Anda buat hanya membutuhkan satu penekanan tombol untuk dibatalkan. Desainnya mendorong perencanaan (komunitas membuat Happy Island Designer, alat berbasis browser untuk merencanakan tata letak sebelumnya) dan penyempurnaan bertahap dari waktu ke waktu.</p>
<p>Tebing dapat dibangun hingga 3 tingkat. Sungai harus terhubung ke laut. Markah tanah tertentu (bandara, layanan penduduk) tidak dapat dipindahkan. Batasan ini bukan kekurangan. Inilah desainnya. Batasan tersebut mencegah &quot;kelumpuhan di hadapan kanvas kosong&quot; yang mematikan keterlibatan pemain kasual dalam editor bebas.</p>
<h3 id="no-man-s-sky-multi-tool" tabindex="-1">No Man's Sky: Multi-Tool <a class="header-anchor" href="#no-man-s-sky-multi-tool" aria-label="Permalink to &quot;No Man's Sky: Multi-Tool&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/mnxMzm3_Ykw?start=942" title="No Man's Sky: Membangun ke Dalam Medan (Beeblebum)" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">Bagian Terrain Manipulator dari panduan pembangunan markas Beeblebum (langsung ke 15:42), yang memperlihatkan empat mode berbasis bola dan batas "regenerasi".</p>
</div>
<p>No Man's Sky menempatkan manipulasi medan pada sebuah senjata. Terrain Manipulator adalah peningkatan multi-tool dengan empat mode: Mine (menghapus medan dalam bentuk bola), Create (menambahkan medan dalam bentuk bola atau kubus), Restore (mengembalikan medan ke kondisi awal yang dihasilkan), dan Flatten (meratakan area luas).</p>
<p>Metaforanya adalah perangkat fiksi ilmiah yang muat di tangan Anda. Anda mengarahkan dan menembak untuk menyunting dunia. Tombol T dan R mengubah ukuran bola di antara tiga preset (kecil, sedang, besar). Tidak ada radius berbentuk angka. Hanya tiga ukuran. Itulah seluruh UI-nya.</p>
<p>Alat ini diperkenalkan dalam misi pertama. Saat mulai menjelajah, Anda sudah tahu cara menggali gua atau meratakan landasan pendaratan. Mode create memungkinkan Anda memilih jenis medan (batu, tanah, dan sebagainya), yang di balik layar dipetakan ke pencampuran tekstur splat map.</p>
<p>Pengurasan energi menjaga agar pembentukan medan tetap terkendali. Dalam mode Normal, energinya berlimpah. Dalam mode Survival, setiap perubahan menghabiskan sumber daya yang berarti. Alat yang sama pada dua tingkat kesulitan melayani baik pematung medan kasual maupun pemain survival yang penuh pertimbangan dalam memakai sumber daya.</p>
<h3 id="astroneer-senapan-penyedot" tabindex="-1">Astroneer: Senapan Penyedot <a class="header-anchor" href="#astroneer-senapan-penyedot" aria-label="Permalink to &quot;Astroneer: Senapan Penyedot&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/0KXQZG7riEs" title="ASTRONEER - Trailer Perilisan" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">Trailer perilisan resmi Astroneer (System Era). Terrain Tool menyedot tanah lalu menyemburkannya kembali, menjadikan pembentukan medan dan pengumpulan sumber daya sebagai tindakan yang sama.</p>
</div>
<p>Astroneer menggunakan metafora paling sederhana: penyedot debu untuk tanah. Arahkan ke medan, tahan pelatuk, dan alat tersebut menyedot tanah. Arahkan ke ruang kosong dan alat itu menyemburkan tanah kembali. Medan berubah bentuk secara waktu nyata di sekitar kursor Anda.</p>
<p>Augment memodifikasi perilakunya: Alignment Mod membuat permukaan rata mengikuti lengkungan planet. Boost Mod meningkatkan kecepatan. Wide Mod memperluas area efek. Inhibitor Mod memungkinkan Anda mengumpulkan sumber daya tanpa mengubah bentuk medan sama sekali.</p>
<p>Kejeniusannya adalah bahwa medan sekaligus merupakan sumber daya. Tanah yang Anda sedot mengisi tabung. Tanah di dalam tabung dapat diolah menjadi material di Soil Centrifuge. Membentuk dunia dan mengumpulkan sumber daya adalah tindakan yang sama. Anda tidak menggali karena menginginkan sebuah gua. Anda menggali karena membutuhkan tanah untuk membuat compound. Gua tersebut adalah efek samping yang kemudian menjadi berguna.</p>
<h3 id="deep-rock-galactic-menambang-sebagai-kerja-sama-tim" tabindex="-1">Deep Rock Galactic: Menambang sebagai Kerja Sama Tim <a class="header-anchor" href="#deep-rock-galactic-menambang-sebagai-kerja-sama-tim" aria-label="Permalink to &quot;Deep Rock Galactic: Menambang sebagai Kerja Sama Tim&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/t9VsWTLJkVY" title="Kelas Master Driller - Deep Rock Academy" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">Kelas Master Driller dari Deep Rock Academy. Bor di lengan bawah mengukir terowongan di tengah pertempuran, mengaburkan batas antara senjata dan alat medan.</p>
</div>
<p>Deep Rock Galactic memetakan penghancuran medan ke peran kelas. Driller memiliki bor listrik yang terpasang di lengan bawah dan mengunyah batu selebar 2 m, setinggi 2,2 m, dan sedalam 1 m per detik. Bor tersebut mengalami panas berlebih setelah digunakan terus-menerus (5,5 detik hingga indikator merah, cooldown 8 detik) dan menggunakan bahan bakar terbatas. Setiap dwarf memiliki beliung untuk pekerjaan presisi.</p>
<p>Tugas Driller adalah membuat jalur. Menggali terowongan dari titik A ke titik B menembus batu padat. Tim mengikutinya. Penyuntingan medan melayani tujuan misi (mencapai pod ekstraksi), bukan menjadi alat kreatif. Namun, efek sampingnya adalah setiap sistem gua yang dilalui tim dibentuk secara unik oleh keputusan mereka. Tidak ada dua sesi yang terlihat sama.</p>
<p>Struktur co-op membuat pembentukan medan menjadi aktivitas sosial. Driller tidak menggali sendirian. Scout menerangi gua dengan suar. Engineer memasang platform pada dinding yang dibuka Driller. Gunner mempertahankan pintu masuk terowongan. Penyuntingan medan adalah satu kata kerja dalam kalimat yang disusun bersama.</p>
<h3 id="teardown-penghancuran-sebagai-teka-teki" tabindex="-1">Teardown: Penghancuran sebagai Teka-Teki <a class="header-anchor" href="#teardown-penghancuran-sebagai-teka-teki" aria-label="Permalink to &quot;Teardown: Penghancuran sebagai Teka-Teki&quot;"></a></h3>
<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/mdqJEvia4mQ" title="Teardown - Trailer Ikhtisar Gameplay" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  <p class="game-caption">Ikhtisar gameplay resmi Teardown (Tuxedo Labs / PlayStation). Setiap alat dipetakan ke metafora fisik, dan fisika voxel membuat konsekuensinya langsung terasa dan mudah dipahami.</p>
</div>
<p>Teardown mengemas penghancuran medan dalam perencanaan aksi perampokan. Anda memiliki waktu tak terbatas untuk bersiap: menghancurkan dinding, menerobos bangunan dengan kendaraan, menempatkan bahan peledak, dan membangun tanjakan. Kemudian alarm berbunyi dan Anda memiliki 60 detik untuk mencapai setiap sasaran lalu melarikan diri.</p>
<p>Setiap alat memiliki identitas fisik. Palu godam menghancurkan benda dari jarak dekat. Obor las memotong baja. Bahan peledak menjebol dinding. Alat pemadam api memadamkan kebakaran. Kendaraan menerobos struktur. Pemain tidak &quot;menyunting medan&quot; secara abstrak. Mereka mengayunkan palu ke dinding dan dinding itu hancur.</p>
<p>Fisikanya membuat semuanya terasa nyata. Struktur runtuh ketika penyangganya dihilangkan. Api menyebar. Asap memenuhi ruangan. Puing-puing berjatuhan. Siklus umpan baliknya langsung dan bersifat fisik: pukul sesuatu, lihat benda itu hancur, lalu saksikan konsekuensinya merambat. Pemain kasual memahami ini karena mereka pernah mengayunkan palu di dunia nyata (atau setidaknya pernah ingin melakukannya).</p>
<h3 id="eco-konsekuensi-sebagai-desain-game" tabindex="-1">Eco: Konsekuensi sebagai Desain Game <a class="header-anchor" href="#eco-konsekuensi-sebagai-desain-game" aria-label="Permalink to &quot;Eco: Konsekuensi sebagai Desain Game&quot;"></a></h3>
<p>Eco adalah game langka tempat penyuntingan medan memiliki konsekuensi permanen yang dirasakan bersama. Tebang terlalu banyak pohon dan kualitas udara menurun. Menambang terlalu agresif dan Anda mencemari muka air tanah. Berburu secara berlebihan dan spesies akan punah. Ekosistemnya disimulasikan sepenuhnya.</p>
<p>Pemain dapat mengusulkan dan memberikan suara atas undang-undang: &quot;Dilarang menebang pohon dalam jarak 200 m dari sungai&quot; atau &quot;Pajak penambangan sebesar 10 emas per meter kubik.&quot; Sistem pemerintahan membuat penyuntingan medan menjadi tindakan politik. Anda tidak bisa sekadar menggali di mana pun Anda mau. Komunitas mungkin akan menghentikan Anda.</p>
<p>Inilah ujung ekstrem gamifikasi: sistem pembentukan medan itu sendiri menjadi gameplay loop inti. Medan adalah sumber daya bersama yang dipengaruhi oleh setiap tindakan pemain. Pembentukan medan bukanlah alat kreatif. Inilah ketegangan utama dalam game.</p>
<h2 id="pola-desain-untuk-cinevva" tabindex="-1">Pola Desain untuk Cinevva <a class="header-anchor" href="#pola-desain-untuk-cinevva" aria-label="Permalink to &quot;Pola Desain untuk Cinevva&quot;"></a></h2>
<p>Game-game ini menunjukkan sekumpulan pola yang dapat kita gunakan. Bukan semuanya sekaligus. Terapkan secara berlapis, dimulai dari yang paling mudah diakses lalu berkembang menuju yang paling kompleks.</p>
<h3 id="pola-1-pembentukan-berbasis-objek-pola-tnt" tabindex="-1">Pola 1: Pembentukan Berbasis Objek (Pola TNT) <a class="header-anchor" href="#pola-1-pembentukan-berbasis-objek-pola-tnt" aria-label="Permalink to &quot;Pola 1: Pembentukan Berbasis Objek (Pola TNT)&quot;"></a></h3>
<p>Jangan berikan kuas kepada pemain. Berikan mereka objek yang kebetulan membentuk ulang medan saat digunakan.
<strong>TNT / Dinamit:</strong> Pemain membuat atau menemukan bahan peledak. Meletakkannya di dunia. Menyalakan sumbunya (atau melemparkannya). Sebuah bola medan dikurangi. Radiusnya bergantung pada jenis bahan peledak. Petasan kecil: radius 2 m. Dinamit standar: 5 m. Bom mega (jarahan langka): 15 m. Pemain sedang meledakkan sesuatu, bukan &quot;mengedit medan.&quot;</p>
<p><strong>Beliung / Sekop / Bor:</strong> Peralatan genggam dengan karakteristik berbeda. Beliung mengikis batu (radius kecil, cepat, berfungsi pada material keras). Sekop menggali tanah (radius sedang, cepat pada tanah lunak, tidak berguna pada batu). Bor membuat terowongan (sempit dan dalam, meninggalkan lubang silindris yang halus). Di balik layar, setiap alat dipetakan ke operasi kuas SDF yang berbeda, tetapi pemain mengalaminya sebagai objek fisik berbeda dengan umpan balik yang berbeda pula.</p>
<p><strong>Ember / Penyiram Tanaman:</strong> Tuangkan air ke medan dan air akan mengalir menuruni lereng, mengikis sebuah saluran. Kuas erosi secara otomatis mengikuti gradien medan. Pemain tidak membidik dengan kuas. Mereka menuangkan air dan menyaksikan sungai terbentuk. Di balik layar, ini adalah operasi smooth-lower yang dipengaruhi oleh kemiringan medan.</p>
<p><strong>Benih / Bibit Pohon:</strong> Tanam dan medan akan tumbuh. Sebungkus benih yang diletakkan di tanah datar akan bertunas menjadi bukit kecil seiring waktu (selama beberapa detik, dengan animasi). Bibit pohon yang ditanam di atas batu gundul akan menghasilkan gundukan tanah di sekitar pangkalnya. Medan yang &quot;tumbuh&quot; hanyalah kuas raise dengan tampilan bertema alam.</p>
<p><strong>Suar Terraformasi:</strong> Letakkan suar dan suar tersebut perlahan meratakan semua yang berada dalam radiusnya ke ketinggian target. Cocok untuk lokasi pembangunan. Pemain meletakkan objek tersebut lalu pergi. Kuas flatten berjalan otomatis dengan intensitas rendah hingga permukaan tanah sesuai dengan ketinggian suar.</p>
<h3 id="pola-2-progresi-alat-pola-stardew" tabindex="-1">Pola 2: Progresi Alat (Pola Stardew) <a class="header-anchor" href="#pola-2-progresi-alat-pola-stardew" aria-label="Permalink to &quot;Pola 2: Progresi Alat (Pola Stardew)&quot;"></a></h3>
<p>Berikan pemain alat lemah yang hanya menghasilkan perubahan kecil di awal. Tingkatkan alat tersebut melalui permainan.</p>
<p><strong>Tingkat 1 (Gratis, langsung tersedia):</strong> Tangan kosong. Dapat menepuk tonjolan kecil hingga rata (micro-smooth, radius 0,5 m). Dapat mengambil segenggam tanah (micro-lower, radius 0,3 m). Dampaknya nyaris tidak berarti. Mengajarkan bahwa sistem ini tersedia.</p>
<p><strong>Tingkat 2 (Dibuat dari material dasar):</strong> Sekop batu, beliung kayu. Dapat digunakan untuk perubahan kecil. Ratakan area perkemahan. Gali parit dangkal. Radius 1–2 m. Di tingkat inilah sebagian besar pemain kasual berada.</p>
<p><strong>Tingkat 3 (Memerlukan eksplorasi atau perdagangan):</strong> Peralatan logam. Radius lebih besar (3–5 m). Operasi baru terbuka: naikkan medan dengan cangkul, pahat lengkungan halus dengan alat pahat.</p>
<p><strong>Tingkat 4 (Akhir permainan / jarahan langka):</strong> Peralatan listrik, bahan peledak, perangkat terraformasi. Radius 10–20 m. Pengeboran gua. Pembuatan gunung. Ini adalah alat spektakuler yang memberi penghargaan kepada pemain jangka panjang.</p>
<p>Jalur peningkatan ini juga berfungsi sebagai tutorial. Setiap tingkat memperkenalkan satu konsep baru. Saat mencapai Tingkat 4, Anda telah memahami kosakata pengeditan medan melalui paparan bertahap, bukan melalui layar tutorial.</p>
<h3 id="pola-3-alat-kontekstual-pola-valheim" tabindex="-1">Pola 3: Alat Kontekstual (Pola Valheim) <a class="header-anchor" href="#pola-3-alat-kontekstual-pola-valheim" aria-label="Permalink to &quot;Pola 3: Alat Kontekstual (Pola Valheim)&quot;"></a></h3>
<p>Sesuaikan alat dengan hal yang ingin dilakukan pemain, bukan dengan kebutuhan medan.</p>
<p><strong>Mode membangun:</strong> Saat pemain berada dalam mode membangun (menempatkan dinding, lantai, atap), medan otomatis diratakan di bawah fondasi. Mereka tidak memerlukan alat perata terpisah. Sistem pembangunan yang menanganinya. Beginilah cara kerja pembangunan di Valheim: letakkan lantai, lalu permukaan tanah akan menyesuaikan.</p>
<p><strong>Mode bertani:</strong> Saat menanam tanaman, kultivator mengolah tanah (mengubah material permukaan) dan meratakan tonjolan kecil. Pemain sedang bertani, bukan melakukan terraformasi. Pengeditan medan merupakan efek samping dari aktivitas pertanian.</p>
<p><strong>Mode menambang:</strong> Saat mengambil sumber daya dari medan (urat bijih, endapan tanah liat, simpul mineral), proses ekstraksi meninggalkan lubang. Pengeditan medan merupakan efek samping dari pengumpulan sumber daya. Astroneer melakukannya dengan sempurna: sedot tanah, dapatkan sumber daya, tinggalkan sebuah gua.</p>
<p><strong>Mode bertempur:</strong> Ledakan dari senjata menciptakan kawah. Api membakar habis vegetasi. Asam melarutkan batu. Kerusakan medan merupakan efek samping dari pertempuran. Bor di Deep Rock Galactic bekerja seperti ini: alat tersebut sekaligus menjadi senjata dan alat medan.</p>
<h3 id="pola-4-pembentukan-sosial-pola-eco" tabindex="-1">Pola 4: Pembentukan Sosial (Pola Eco) <a class="header-anchor" href="#pola-4-pembentukan-sosial-pola-eco" aria-label="Permalink to &quot;Pola 4: Pembentukan Sosial (Pola Eco)&quot;"></a></h3>
<p>Di dunia bersama, setiap perubahan adalah tindakan sosial. Rancanglah dengan mempertimbangkan hal tersebut.</p>
<p><strong>Kepengarangan yang terlihat:</strong> Saat pemain membentuk medan, tinggalkan indikator halus tentang siapa yang melakukannya. Cahaya redup. Semburat warna pemain pada permukaan yang diedit. Bendera kecil. Pemain lain dapat melihat bahwa seseorang pernah berada di sana dan mengubah lanskapnya.</p>
<p><strong>Proyek kolaboratif:</strong> Perubahan medan di dalam area yang diklaim diakumulasikan untuk mencapai tujuan bersama. &quot;Gali sungai dari gunung menuju danau.&quot; Bilah progres terlihat oleh semua orang di area tersebut. Setelah selesai, sungai akan terisi air. Pembentukan medan menjadi aktivitas kelompok dengan hadiah bersama.</p>
<p><strong>Zona persetujuan:</strong> Di area yang dilindungi, perubahan medan memerlukan persetujuan pemilik lahan atau pemungutan suara dari pemain di sekitar. Ini mencegah tindakan merusak tanpa menonaktifkan pembentukan medan. Perubahan ditampilkan sebagai pratinjau bayangan (transparan, dengan garis tepi) hingga disetujui.</p>
<p><strong>Urungkan berdasarkan konsensus:</strong> Setiap pemain dapat mengusulkan pengembalian perubahan medan. Jika cukup banyak pemain di sekitar yang menyetujuinya, perubahan tersebut memudar selama beberapa detik. Seperti mode pemulihan dari No Man's Sky, tetapi bersifat sosial.</p>
<h3 id="pola-5-kekuatan-alam-pola-erosi" tabindex="-1">Pola 5: Kekuatan Alam (Pola Erosi) <a class="header-anchor" href="#pola-5-kekuatan-alam-pola-erosi" aria-label="Permalink to &quot;Pola 5: Kekuatan Alam (Pola Erosi)&quot;"></a></h3>
<p>Alih-alih sapuan kuas langsung, biarkan pemain memicu proses alami.</p>
<p><strong>Pemanggil hujan:</strong> Tempatkan awan di atas bukit dan hujan pun turun. Seiring waktu, hujan mengikis lereng bukit, membentuk saluran dan menghaluskan tepian. Pemain mengendalikan lokasi turunnya hujan dan durasinya. Shader erosi melakukan pembentukan medan.</p>
<p><strong>Perangkat gempa bumi:</strong> Memicu gempa bumi lokal yang meretakkan tanah, menciptakan celah, dan menurunkan medan di area terdampak. Pemain menentukan lokasinya. Simulasi fisika menentukan caranya.</p>
<p><strong>Aliran lava:</strong> Keluarkan lava dari suatu titik dan lava akan mengalir menuruni lereng, mengisi lembah, lalu mengeras menjadi batu. Medan baru tercipta melalui metafora alami. Di balik layar, ini adalah kuas raise yang mengikuti gradien medan dengan material batu.</p>
<p><strong>Pemahat angin:</strong> Kipas atau perangkat peniup yang mendorong medan lunak (pasir, tanah) ke arah angin. Seiring waktu, alat ini menciptakan bukit pasir dan lereng halus. Kuas smooth dengan bias arah.</p>
<p><strong>Bekukan / Cairkan:</strong> Bekukan air di sungai untuk membuat jembatan es. Cairkan lereng bukit yang membeku untuk memicu tanah longsor. Suhu menjadi parameter pengeditan medan yang diekspresikan melalui item cuaca.</p>
<h3 id="pola-6-penemuan-dan-kejutan-pola-infinite-craft" tabindex="-1">Pola 6: Penemuan dan Kejutan (Pola Infinite Craft) <a class="header-anchor" href="#pola-6-penemuan-dan-kejutan-pola-infinite-craft" aria-label="Permalink to &quot;Pola 6: Penemuan dan Kejutan (Pola Infinite Craft)&quot;"></a></h3>
<p>Beri penghargaan atas eksperimen.</p>
<p><strong>Efek kombinasi:</strong> TNT di dekat air menciptakan mata air panas (kawah + pengisian air + partikel uap). Benih yang ditanam di kawah TNT tumbuh lebih cepat (kawah tersebut memiliki &quot;tanah subur&quot;). Sungai beku yang diledakkan dengan dinamit akan menyingkap gua di bawahnya.</p>
<p><strong>Material tersembunyi:</strong> Menggali cukup dalam akan menyingkap berbagai lapisan medan: tanah lapisan atas, tanah liat, batu, kristal, lava. Setiap lapisan memiliki sifat dan tampilan berbeda. Pemain yang menggali lebih dalam akan melihat hal-hal yang belum pernah dilihat siapa pun.</p>
<p><strong>Fosil dan artefak:</strong> Perubahan medan secara acak terkadang menemukan objek terkubur: fosil, artefak kuno, peti harta karun, benih langka. Aktivitas membentuk medan menjadi mekanik eksplorasi. Anda tidak hanya menggali demi menemukan gua. Anda menggali karena mungkin menemukan sesuatu.</p>
<p><strong>Ingatan medan:</strong> Medan yang diedit mengingat apa yang terjadi padanya. Area yang diledakkan dengan TNT memiliki bekas hangus dan tepian yang terbakar. Area yang ditumbuhkan dengan benih memiliki warna tanah yang lebih subur. Area yang terkikis oleh hujan memiliki tekstur halus yang aus oleh air. Medan menceritakan sejarahnya sendiri.</p>
<h2 id="pemetaan-kuas-ke-metafora" tabindex="-1">Pemetaan Kuas ke Metafora <a class="header-anchor" href="#pemetaan-kuas-ke-metafora" aria-label="Permalink to &quot;Pemetaan Kuas ke Metafora&quot;"></a></h2>
<p>Setiap metafora yang digunakan pemain dipetakan ke operasi kuas teknis dari <a href="/id/guides/terrain-sculpting-brushes.html">pipeline pembentukan kami</a>. Berikut tabel pemetaannya:</p>
<p><strong>Beliung / Sekop</strong> dipetakan ke <strong>kuas lower</strong> (mengurangi heightmap atau SDF) dengan radius kecil, kekuatan tinggi, dan falloff tajam. Animasi alat memicu pemanggilan <code>Chunk.applyBrush()</code> yang sama.</p>
<p><strong>TNT / Bahan Peledak</strong> dipetakan ke <strong>kuas lower</strong> dengan radius besar, kekuatan maksimum, dan falloff berbentuk bola. Satu peristiwa ledakan menerapkan satu sapuan kuas yang berpusat pada titik detonasi. Ketahanan ledakan tiap jenis material dipetakan ke pengali kekuatan kuas.</p>
<p><strong>Cangkul / Perata</strong> dipetakan ke <strong>kuas flatten</strong> dengan radius sedang dan falloff halus. Ketinggian target diambil sampelnya dari posisi kaki pemain saat alat diaktifkan, persis seperti di Valheim.</p>
<p><strong>Benih / Pertumbuhan</strong> dipetakan ke <strong>kuas raise</strong> dengan radius kecil dan falloff halus, yang diterapkan selama beberapa frame (pertumbuhan beranimasi). Setiap frame menerapkan peningkatan kecil. Animasi membuat metaforanya terasa nyata, sementara kuas menangani geometrinya.</p>
<p><strong>Penyiram Tanaman / Hujan</strong> dipetakan ke <strong>kuas smooth</strong> dengan bias arah. Bias tersebut mengikuti gradien kemiringan medan dari <code>ChunkManager.getNormal()</code>. Titik di bawah pusat kuas diturunkan lebih banyak daripada titik di atasnya, sehingga menciptakan saluran erosi alami.</p>
<p><strong>Suar Terraformasi</strong> dipetakan ke <strong>kuas flatten</strong> yang diterapkan dengan kekuatan rendah pada setiap frame hingga mencapai konvergensi. Posisi suar dalam world-space menentukan ketinggian target. Radiusnya merupakan area efek suar.</p>
<p><strong>Bor</strong> dipetakan ke <strong>kuas lower</strong> yang diproyeksikan sepanjang arah sinar, bukan berbentuk bola. Ray cast dari arah bidikan pemain menentukan pusat kuas pada setiap langkah kedalaman, sehingga menciptakan terowongan silindris.</p>
<h2 id="progresi-dan-ekonomi" tabindex="-1">Progresi dan Ekonomi <a class="header-anchor" href="#progresi-dan-ekonomi" aria-label="Permalink to &quot;Progresi dan Ekonomi&quot;"></a></h2>
<h3 id="yang-diperoleh-pemain" tabindex="-1">Yang Diperoleh Pemain <a class="header-anchor" href="#yang-diperoleh-pemain" aria-label="Permalink to &quot;Yang Diperoleh Pemain&quot;"></a></h3>
<p><strong>Pembukaan alat:</strong> Mulai dengan tangan kosong. Buat alat dasar dari material umum. Temukan resep alat canggih melalui eksplorasi, perdagangan, atau penyelesaian misi.</p>
<p><strong>Peningkatan kapasitas:</strong> Bahan peledak yang lebih besar. Cangkul yang lebih lebar. Bor yang lebih cepat. Radius dan kekuatan kuas meningkat sesuai tingkat. Meningkatkan sekop dari kayu menjadi besi akan menggandakan radiusnya.</p>
<p><strong>Jenis material:</strong> Material medan baru terbuka saat pemain menjelajahi bioma. Anda hanya dapat &quot;menciptakan&quot; jenis medan yang pernah ditemui. Kunjungi gurun untuk membuka pembuatan pasir. Kunjungi gunung berapi untuk membuka basal. Mode create dari No Man's Sky, yang dibatasi oleh eksplorasi.</p>
<p><strong>Resep:</strong> Efek kombinasi harus ditemukan, bukan diberikan. Tanam benih di kawah TNT dan temukan &quot;Ledakan Subur.&quot; Tuangkan air ke medan lava dan temukan &quot;Pembentukan Obsidian.&quot; Setiap penemuan dicatat dalam katalog dan dapat dibagikan.</p>
<h3 id="biayanya" tabindex="-1">Biayanya <a class="header-anchor" href="#biayanya" aria-label="Permalink to &quot;Biayanya&quot;"></a></h3>
<p><strong>Sumber daya:</strong> Setiap perubahan medan mengonsumsi material. Menaikkan medan membutuhkan tanah/batu/pasir (material yang ditempatkan). Menurunkan medan menghasilkan material (yang masuk ke inventaris Anda). Perataan mendistribusikan ulang material. Aliran sumber daya menjaga ekonomi tetap terhubung dengan sistem medan.</p>
<p><strong>Energi / Ketahanan:</strong> Alat memiliki batas ketahanan atau energi. Beliung rusak setelah digunakan sebanyak N kali. Suar terraformasi menggunakan bahan bakar. Ini mencegah pengeditan tanpa batas dan menciptakan batas sesi yang alami. Pemain beristirahat untuk mengisi kembali persediaan.</p>
<p><strong>Waktu:</strong> Beberapa operasi berlangsung seketika (ayunan beliung). Operasi lainnya berjalan lambat (perataan oleh suar, pertumbuhan benih, erosi hujan). Operasi lambat menghargai kesabaran dan mencegah spam. Operasi ini juga terlihat lebih baik: menyaksikan benih bertunas menjadi bukit jauh lebih memuaskan daripada mengeklik tombol &quot;raise.&quot;</p>
<h3 id="yang-dilihat-pemain-lain" tabindex="-1">Yang Dilihat Pemain Lain <a class="header-anchor" href="#yang-dilihat-pemain-lain" aria-label="Permalink to &quot;Yang Dilihat Pemain Lain&quot;"></a></h3>
<p><strong>Jejak perubahan:</strong> Setiap modifikasi medan memiliki ciri visual. Kawah TNT memiliki tepian gelap dan retak. Area yang diratakan dengan cangkul memiliki tekstur tanah olahan yang halus. Medan yang ditumbuhkan memiliki warna alami yang kaya. Saluran yang terkikis hujan memiliki bekas air. Pemain dapat membaca sejarah lanskap tersebut.</p>
<p><strong>Label kreator:</strong> Arahkan kursor ke medan yang diedit untuk melihat siapa yang mengubahnya dan kapan. &quot;Dibentuk oleh @PlayerName, 2 jam lalu.&quot; Ini menciptakan kebanggaan atas karya dan akuntabilitas sosial.</p>
<p><strong>Sebelum/Sesudah:</strong> Tampilan &quot;selang waktu&quot; yang menunjukkan medan pada titik mana pun dalam riwayat pengeditannya. Geser penggeser linimasa untuk melihat perubahan lanskap. Ini dimungkinkan karena pohon pengeditan CSG dari Fase 3 <a href="/id/guides/terrain-sculpting-brushes.html">panduan teknis</a> menyimpan setiap operasi secara berurutan.</p>
<h2 id="yang-kita-bangun-terlebih-dahulu" tabindex="-1">Yang Kita Bangun Terlebih Dahulu <a class="header-anchor" href="#yang-kita-bangun-terlebih-dahulu" aria-label="Permalink to &quot;Yang Kita Bangun Terlebih Dahulu&quot;"></a></h2>
<p>Fase 1 dari <a href="/id/guides/terrain-sculpting-brushes.html#practical-architecture-for-sculpting">arsitektur teknis</a> menggunakan pembentukan heightmap pada renderer WebGL yang ada. Alat kasual yang dapat kita rilis di atasnya:</p>
<ol>
<li><strong>Sekop</strong> (kuas lower, radius kecil). Alat paling dasar. Klik medan, gali lubang. Menghasilkan sumber daya tanah.</li>
<li><strong>Cangkul</strong> (kuas flatten, radius sedang). Berdirilah di tempat yang Anda inginkan, gunakan cangkul, lalu medan akan diratakan setinggi kaki Anda.</li>
<li><strong>TNT</strong> (kuas lower, radius besar, sekali pakai). Buat dari material, letakkan, nyalakan, lalu saksikan ledakannya. Menghasilkan puing.</li>
<li><strong>Benih</strong> (kuas raise, dianimasikan selama beberapa frame). Tanam di tanah datar, saksikan medan naik menjadi bukit kecil, lalu vegetasi muncul di atasnya.</li>
<li><strong>Penyiram Tanaman</strong> (kuas smooth dengan bias kemiringan). Tuangkan air pada lereng untuk mengikisnya. Menciptakan saluran yang tampak alami.</li>
</ol>
<p>Lima alat. Lima metafora berbeda. Satu sistem kuas yang mendasarinya. Setiap alat merupakan konfigurasi berbeda dari <code>(radius, strength, falloff, operation, animation)</code> yang dibungkus sebagai item yang dibuat, dipakai, dan digunakan pemain melalui model interaksi yang sama dengan <code>PlacementTool</code> yang sudah ada.</p>
<BuildCta
  title="Biarkan pemain membangun: coba sandbox sekarang"
  desc="Cara tercepat untuk merasakan mengapa pengeditan dunia membuat pemain terus bermain."
  prompt="Buat pulau sandbox tempat saya dapat menempatkan dan menumpuk balok" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/player-world-sculpting-hero.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Teknik Kuas 3D dan Pemahatan Dunia di Dalam Game]]></title>
            <link>https://app.cinevva.com/id/guides/terrain-sculpting-brushes</link>
            <guid>https://app.cinevva.com/id/guides/terrain-sculpting-brushes</guid>
            <pubDate>Sun, 05 Apr 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Dari displacement heightmap hingga pohon CSG SDF. Cara kerja kuas pemahat medan yang sebenarnya, apa yang dilakukan marching cubes dan surface nets di balik layar, serta cara memungkinkan pemain membentuk ulang dunia bersama secara real-time.]]></description>
            <content:encoded><![CDATA[<h1 id="teknik-kuas-3d-dan-pemahatan-dunia-di-dalam-game" tabindex="-1">Teknik Kuas 3D dan Pemahatan Dunia di Dalam Game <a class="header-anchor" href="#teknik-kuas-3d-dan-pemahatan-dunia-di-dalam-game" aria-label="Permalink to &quot;Teknik Kuas 3D dan Pemahatan Dunia di Dalam Game&quot;"></a></h1>
<p>Kami ingin pemain dapat memahat dunia. Bukan menempatkan prefab pada grid. Bukan mengaktifkan dan menonaktifkan blok. Melainkan benar-benar membentuk ulang medan: mengukir sungai, meninggikan gunung, menghaluskan sisi tebing, dan menggali gua. Seperti yang dilakukan ZBrush dan mode sculpt Blender untuk seniman, tetapi berjalan pada 60fps di dalam game browser multipemain.</p>
<p>Itu adalah masalah rekayasa sulit yang mencakup representasi data, ekstraksi mesh, komputasi GPU, matematika kuas, dan sinkronisasi jaringan. Panduan ini mendokumentasikan semua yang kami temukan.</p>
<h2 id="dua-dunia-representasi-medan" tabindex="-1">Dua Dunia Representasi Medan <a class="header-anchor" href="#dua-dunia-representasi-medan" aria-label="Permalink to &quot;Dua Dunia Representasi Medan&quot;"></a></h2>
<p>Setiap sistem pemahatan dimulai dengan pilihan tentang cara menyimpan data medan. Pilihan tersebut menentukan jenis pengeditan yang dapat dilakukan, seberapa cepat prosesnya berjalan, dan berapa banyak memori yang diperlukan.</p>
<h3 id="heightmap" tabindex="-1">Heightmap <a class="header-anchor" href="#heightmap" aria-label="Permalink to &quot;Heightmap&quot;"></a></h3>
<p>Heightmap menyimpan satu nilai ketinggian untuk setiap titik grid. Anda dapat membayangkannya sebagai gambar skala abu-abu dengan tingkat kecerahan yang mewakili elevasi. Medan <code>world/client</code> kami saat ini bekerja tepat seperti ini: <code>noise.ts</code> menghasilkan ketinggian melalui FBM value noise, dan setiap <code>Chunk</code> menyimpan heightmap <code>Float32Array</code> yang diproyeksikan ke <code>PlaneGeometry</code>.</p>
<p>Heightmap itu cepat. Pengambilan sampel hanya memerlukan satu pencarian array dengan interpolasi bilinear. LOD sangat mudah karena Anda cukup mengurangi resolusi grid. Pencampuran tekstur berbasis splat dipetakan langsung ke grid UV. Tabrakan fisika dapat disederhanakan menjadi kueri ketinggian.</p>
<p>Keterbatasannya adalah topologi. Heightmap hanya dapat merepresentasikan satu ketinggian untuk setiap koordinat (x, z). Tidak ada gua. Tidak ada bagian yang menggantung. Tidak ada lengkungan. Tidak ada terowongan. Jika pemain memahat tebing yang melipat kembali ke arahnya sendiri, heightmap tidak dapat menyimpannya. Untuk medan yang sebagian besar berupa perbukitan dan pegunungan, ini tidak menjadi masalah. Namun, untuk pemahatan bentuk bebas yang memungkinkan pemain menggali ke dalam tanah, pendekatan ini menemui jalan buntu.</p>
<h3 id="volumetrik-medan-skalar-3d" tabindex="-1">Volumetrik (Medan Skalar 3D) <a class="header-anchor" href="#volumetrik-medan-skalar-3d" aria-label="Permalink to &quot;Volumetrik (Medan Skalar 3D)&quot;"></a></h3>
<p>Alternatifnya adalah menyimpan nilai pada setiap titik dalam ruang 3D. Jika nilainya negatif di dalam material padat dan positif di luarnya (atau sebaliknya), Anda memiliki Signed Distance Field (SDF). Jika nilainya hanya berupa densitas (di atas ambang tertentu berarti padat, sedangkan di bawahnya berarti kosong), Anda memiliki medan densitas.</p>
<p>Representasi volumetrik dapat menangani topologi apa pun. Gua, bagian yang menggantung, pulau terapung, dan terowongan yang menembus gunung. Konsekuensinya adalah penggunaan memori dan kompleksitas. Grid 256^3 dengan float 32-bit membutuhkan 64 MB. Grid 512^3 membutuhkan 512 MB. Dan itu baru untuk satu chunk. Anda membutuhkan struktur data sparse (octree, brick map) agar pendekatan ini praktis.</p>
<p>Langkah ekstraksi mesh juga tidak sederhana. Anda tidak dapat sekadar menetapkan posisi Y vertex lalu selesai. Anda memerlukan algoritma yang membaca medan skalar dan menghasilkan mesh segitiga yang mendekati permukaan tempat medan melewati nilai nol.</p>
<h2 id="ekstraksi-mesh-marching-cubes-surface-nets-dan-dual-contouring" tabindex="-1">Ekstraksi Mesh: Marching Cubes, Surface Nets, dan Dual Contouring <a class="header-anchor" href="#ekstraksi-mesh-marching-cubes-surface-nets-dan-dual-contouring" aria-label="Permalink to &quot;Ekstraksi Mesh: Marching Cubes, Surface Nets, dan Dual Contouring&quot;"></a></h2>
<h3 id="marching-cubes" tabindex="-1">Marching Cubes <a class="header-anchor" href="#marching-cubes" aria-label="Permalink to &quot;Marching Cubes&quot;"></a></h3>
<p>Marching Cubes adalah algoritma ekstraksi isosurface tertua dan yang paling banyak diimplementasikan. Dipublikasikan oleh Lorensen dan Cline pada 1987, algoritma ini bekerja dengan memeriksa setiap kubus dalam grid voxel yang setiap sudutnya memiliki nilai skalar. Jika sebagian sudut berada di dalam permukaan (negatif) dan sebagian lainnya berada di luar (positif), sebuah bagian mesh segitiga ditempatkan di dalam kubus tersebut.</p>
<p>Setiap kubus memiliki 8 sudut yang masing-masing dapat berada di dalam atau di luar, sehingga menghasilkan 256 kemungkinan konfigurasi (2^8). Melalui simetri, konfigurasi tersebut dapat disederhanakan menjadi 15 kasus unik. Sebuah tabel pencarian memetakan setiap kasus ke sekumpulan segitiga. Titik perpotongan edge ditemukan melalui interpolasi linear di sepanjang edge tempat tanda nilainya berubah.</p>
<p><strong>Implementasi GPU terbaru</strong> telah membuat Marching Cubes cukup cepat untuk pemahatan real-time. Implementasi UE5 dari 2025 menetapkan setiap thread GPU ke satu kubus sehingga ribuan kubus dapat diproses secara bersamaan. Inti pendekatannya adalah bahwa triangulasi setiap kubus tidak bergantung pada tetangganya, sehingga algoritma ini sangat mudah diparalelkan.</p>
<p><strong>MCHex</strong> (arxiv 2511.02064, 2025) memperluas Marching Cubes untuk menghasilkan mesh heksahedral adaptif dengan nilai Jacobian positif yang dijamin, sehingga meningkatkan pendekatan batas untuk mesh simulasi.</p>
<p><strong>rupMC</strong> menghasilkan performa puluhan kali lebih cepat daripada implementasi serial dan 4x lebih cepat daripada varian DMC paralel dengan menggunakan arsitektur heterogen CPU/GPU.</p>
<p>Keterbatasan utamanya: Marching Cubes kesulitan menangani fitur tajam. Edge 90 derajat akan dibulatkan menjadi kurva halus. Untuk pemahatan medan, hal ini biasanya dapat diterima (medan alami sebagian besar berbentuk halus), tetapi akan menjadi masalah untuk fitur arsitektural.</p>
<h3 id="surface-nets" tabindex="-1">Surface Nets <a class="header-anchor" href="#surface-nets" aria-label="Permalink to &quot;Surface Nets&quot;"></a></h3>
<p>Surface Nets adalah keluarga algoritma yang lebih baru dan menghasilkan mesh lebih halus dari medan skalar diskret. Alih-alih menempatkan vertex pada edge kubus (seperti Marching Cubes), Surface Nets menempatkan satu vertex untuk setiap kubus yang berisi permukaan, lalu menghubungkan vertex yang berdekatan untuk membentuk quad.</p>
<p>Hasilnya secara alami lebih halus. Makalah tahun 2024 (arxiv 2401.14906) mendemonstrasikan implementasi Surface Nets paralel berperforma tinggi yang berjalan satu hingga dua orde magnitudo lebih cepat daripada algoritma sekuensial. Crate Rust <code>fast-surface-nets</code> menghasilkan sekitar 20 juta segitiga per detik pada satu core 2,5 GHz dengan menggunakan tabel pencarian kecil dan akselerasi SIMD.</p>
<p><code>bevy-sculpter</code> (v0.18.0, Januari 2026) menggunakan Surface Nets sebagai strategi meshing utamanya. Crate tersebut menyediakan pemahatan volumetrik berbasis SDF dengan empat jenis kuas: CSG keras (langsung menambah/menghapus), kontinu halus (untuk input yang ditahan), blur (menghaluskan permukaan), dan flatten (menetapkan ke ketinggian target). Crate ini juga menyertakan redistancing SDF melalui Fast Sweeping Method untuk memulihkan properti signed distance field yang semestinya setelah pengeditan.</p>
<p>Surface Nets merupakan jalan tengah yang baik antara Marching Cubes (sederhana dan cepat, tetapi menghasilkan mesh bergerigi pada data biner) dan Dual Contouring (mempertahankan fitur tetapi kompleks).</p>
<h3 id="dual-contouring" tabindex="-1">Dual Contouring <a class="header-anchor" href="#dual-contouring" aria-label="Permalink to &quot;Dual Contouring&quot;"></a></h3>
<p>Dual Contouring mempertahankan fitur tajam yang tidak dapat dipertahankan oleh Marching Cubes dan Surface Nets. Algoritma ini tidak hanya menggunakan tanda medan pada setiap sudut, tetapi juga gradien (normal) pada perpotongan edge. Minimisasi QEF (Quadratic Error Function) menempatkan vertex di dalam setiap sel pada posisi yang paling memenuhi semua batasan perpotongan edge.</p>
<p>Hasilnya: edge dan sudut tajam tetap dipertahankan dalam mesh yang diekstrak. Kubus dengan sisi-sisi tegak lurus tetap berbentuk kubus.</p>
<p>Konsekuensinya adalah kompleksitas. Penyelesaian QEF memiliki dependensi antarsel yang menyulitkan paralelisasi GPU. Algoritma ini dapat menghasilkan mesh non-manifold (edge yang digunakan bersama oleh lebih dari dua poligon). Implementasinya juga lebih rumit daripada Marching Cubes, meskipun Johannes Jendersie menyatakan bahwa implementasi Dual Contouring yang berfungsi membutuhkan sekitar 200 baris kode, dibandingkan dengan lebih dari 500 baris untuk implementasi Marching Cubes yang tangguh.</p>
<p><strong>Cubical Marching Squares (CMS)</strong> telah diusulkan sebagai jalan tengah: independen antarsel (ramah GPU), tetapi tetap mampu mempertahankan sebagian fitur.</p>
<h3 id="mana-yang-sebaiknya-digunakan" tabindex="-1">Mana yang Sebaiknya Digunakan <a class="header-anchor" href="#mana-yang-sebaiknya-digunakan" aria-label="Permalink to &quot;Mana yang Sebaiknya Digunakan&quot;"></a></h3>
<p>Untuk pemahatan medan oleh pemain di browser:</p>
<p><strong>Surface Nets</strong> adalah kandidat terkuat. Algoritma ini menghasilkan mesh halus (medan yang tampak alami) tanpa artefak bergerigi yang muncul pada Marching Cubes ketika memproses data biner. Performanya cukup cepat untuk melakukan meshing ulang secara real-time. Implementasinya juga lebih sederhana daripada Dual Contouring.</p>
<p><strong>Marching Cubes</strong> tetap menjadi pilihan solid ketika paralelisme GPU menjadi prioritas (setiap kubus bersifat independen) atau ketika Anda memerlukan dukungan library terluas. WebGPU SDF Editor karya Reinder Nijhoff (Januari 2026) mengimplementasikan Marching Cubes dan Surface Nets dalam pipeline ekstraksinya, yang sepenuhnya berjalan pada GPU.</p>
<p><strong>Dual Contouring</strong> sebaiknya digunakan untuk kasus ketika presisi arsitektural lebih penting daripada performa. Pendekatan ini kurang ideal untuk pemahatan medan real-time dalam konteks browser.</p>
<h2 id="algoritma-transvoxel-mengatasi-penyambungan-lod" tabindex="-1">Algoritma Transvoxel: Mengatasi Penyambungan LOD <a class="header-anchor" href="#algoritma-transvoxel-mengatasi-penyambungan-lod" aria-label="Permalink to &quot;Algoritma Transvoxel: Mengatasi Penyambungan LOD&quot;"></a></h2>
<p>Ketika medan voxel dibuat menjadi mesh dengan resolusi yang berbeda (LOD0 di dekat pemain, LOD2 di kejauhan), retakan akan terbentuk pada batasnya. Untuk heightmap, ini adalah masalah sederhana: interpolasikan vertex pada edge agar cocok dengan tetangga beresolusi lebih rendah. <code>chunk.ts</code> kami saat ini melakukan hal tersebut dalam <code>stitchEdge()</code>.</p>
<p>Untuk medan volumetrik, masalahnya jauh lebih sulit. Mulut gua pada LOD0 mungkin menghasilkan 30 segitiga pada batas. Area yang sama pada LOD1 mungkin menghasilkan 8 segitiga dengan topologi yang sepenuhnya berbeda. Tidak ada cara sederhana untuk melakukan interpolasi linear di antara keduanya.</p>
<p>Transvoxel Algorithm karya Eric Lengyel (2009) mengatasi masalah ini dengan &quot;sel transisi&quot;. Pada batas antara dua level LOD, algoritma mempertimbangkan 9 sampel beresolusi tinggi (bukan 8 sudut kubus), sehingga menghasilkan 512 kemungkinan konfigurasi yang terbagi menjadi 73 kelas ekuivalensi. Setiap kelas dipetakan ke pola segitiga yang telah ditentukan sebelumnya dan mengisi celah antara kedua resolusi dengan sempurna.</p>
<p>Algoritma ini beroperasi pada data voxel lokal, sehingga proses triangulasi ulang wilayah yang dimodifikasi berlangsung cepat. Hal ini sangat penting untuk pemahatan real-time: ketika pemain mengedit medan di dekat batas LOD, hanya sel transisi yang perlu dibangun ulang.</p>
<p>Implementasi Rust tersedia sebagai crate <code>transvoxel</code>. Tabel pencarian aslinya tersedia di transvoxel.org.</p>
<h2 id="matematika-kuas" tabindex="-1">Matematika Kuas <a class="header-anchor" href="#matematika-kuas" aria-label="Permalink to &quot;Matematika Kuas&quot;"></a></h2>
<p>Kuas pemahat adalah fungsi yang memodifikasi nilai medan skalar dalam radius di sekitar titik target. Matematikanya ternyata sangat mirip di berbagai implementasi, mulai dari Blender dan Unreal Engine hingga sistem game runtime.</p>
<h3 id="fungsi-falloff" tabindex="-1">Fungsi Falloff <a class="header-anchor" href="#fungsi-falloff" aria-label="Permalink to &quot;Fungsi Falloff&quot;"></a></h3>
<p>Falloff kuas menentukan bagaimana kekuatan pengeditan berkurang dari pusat ke tepi. Blender 5.1 mendefinisikan profil standar berikut:</p>
<p><strong>Halus:</strong> <code>f(d) = 3d^2 - 2d^3</code> (interpolasi Hermite, smoothstep yang sama seperti dalam noise.ts kami)</p>
<p><strong>Bola:</strong> Kuat di pusat dengan falloff curam di dekat batas. Diaproksimasi sebagai <code>f(d) = sqrt(1 - d^2)</code>.</p>
<p><strong>Tajam:</strong> <code>f(d) = (1 - d)^n</code> dengan n &gt; 2. Menghasilkan ujung yang runcing.</p>
<p><strong>Linear:</strong> <code>f(d) = 1 - d</code>, dengan d sebagai jarak ternormalisasi dari pusat (0 di pusat, 1 di tepi).</p>
<p><strong>Konstan:</strong> <code>f(d) = 1</code> untuk <code>d &lt; 1</code>, dengan pemutusan tegas pada batas kuas.</p>
<p><strong>Kuadrat Terbalik:</strong> Gabungan antara halus dan bola untuk menghasilkan nuansa alami seperti tanah liat.</p>
<p>Dalam semua kasus, <code>d = distance_to_center / brush_radius</code>, dibatasi ke [0, 1]. Nilai falloff dikalikan dengan kekuatan kuas untuk menghasilkan modifikasi medan yang sebenarnya pada setiap titik.</p>
<h3 id="ruang-falloff" tabindex="-1">Ruang Falloff <a class="header-anchor" href="#ruang-falloff" aria-label="Permalink to &quot;Ruang Falloff&quot;"></a></h3>
<p>Blender membedakan antara <strong>falloff bola</strong> (jarak dihitung dalam ruang dunia 3D) dan <strong>falloff terproyeksi</strong> (jarak dihitung dalam ruang layar 2D). Falloff terproyeksi berarti dua titik yang tampak berdekatan di layar akan saling memengaruhi dengan kekuatan yang sama, meskipun keduanya berada pada kedalaman yang sangat berbeda dalam ruang dunia. Untuk pemahatan medan, falloff dalam ruang dunia 3D biasanya terasa lebih intuitif.</p>
<h3 id="operasi-inti-kuas" tabindex="-1">Operasi Inti Kuas <a class="header-anchor" href="#operasi-inti-kuas" aria-label="Permalink to &quot;Operasi Inti Kuas&quot;"></a></h3>
<p><strong>Naikkan/Turunkan (Displacement):</strong> Tambahkan atau kurangi nilai medan skalar dalam radius kuas, dengan pembobotan berdasarkan falloff. Untuk heightmap: <code>height[i] += strength * falloff(d)</code>. Untuk SDF: <code>sdf[i] -= strength * falloff(d)</code> (pengurangan membuat material lebih padat dan menaikkan permukaan).</p>
<p><strong>Haluskan (Laplacian):</strong> Ganti setiap nilai dengan rata-rata nilai tetangganya, dengan pembobotan berdasarkan falloff. Operasi ini menghapus detail dan mengurangi noise. Filter Laplacian mengambil sampel kernel kecil (3x3 untuk heightmap, 3x3x3 untuk volume) dan memadukannya menuju nilai rata-rata. Penghalusan HC (Humphrey's Classes) adalah varian yang mempertahankan volume lebih baik daripada Laplacian mentah.</p>
<p><strong>Ratakan:</strong> Tetapkan nilai medan ke ketinggian target (atau jarak dalam ruang SDF), yang dipadukan berdasarkan falloff. Target biasanya diambil sampelnya dari pusat kuas ketika goresan dimulai, lalu dipertahankan konstan. Operasi ini menghasilkan dataran tinggi yang rata.</p>
<p><strong>Cubit/Gembungkan:</strong> Gerakkan vertex menuju atau menjauhi normal permukaan. Dalam ruang SDF, operasi ini setara dengan displacement sepanjang arah gradien.</p>
<p><strong>Tarik:</strong> Translasi suatu wilayah pada medan, seolah-olah Anda sedang menarik tanah liat. Vektor displacement berasal dari delta mouse yang diproyeksikan ke ruang dunia, lalu diterapkan pada nilai medan dalam radius.</p>
<p><strong>Noise:</strong> Tambahkan noise prosedural pada medan dalam radius kuas. Berguna untuk membuat permukaan halus menjadi lebih kasar.</p>
<p><strong>Stempel:</strong> Terapkan gambar skala abu-abu 2D sebagai displacement dengan memproyeksikannya ke permukaan di bawah kursor. Alat Landscape Unreal Engine mendukung teknik ini untuk kuas medan.</p>
<h3 id="teselasi-adaptif" tabindex="-1">Teselasi Adaptif <a class="header-anchor" href="#teselasi-adaptif" aria-label="Permalink to &quot;Teselasi Adaptif&quot;"></a></h3>
<p><code>sculpt-3D</code> (pemahatan berbasis React + Three.js di browser) mengimplementasikan teselasi adaptif: saat kuas bergerak melintasi mesh, segitiga di dekat pusat kuas dibagi lagi untuk menyediakan lebih banyak vertex bagi deformasi. Hal ini mencegah masalah &quot;peregangan low-poly&quot; ketika mesh kasar terdistorsi akibat pemahatan. Pembagian tersebut menggunakan pemisahan simetris agar kualitas segitiga tetap seragam.</p>
<p>Untuk sistem volumetrik, teselasi adaptif tidak diperlukan dengan cara yang sama karena mesh dibuat ulang dari medan. Sebagai gantinya, Anda dapat meningkatkan resolusi voxel secara lokal di dekat area pengeditan (octree adaptif) untuk memperoleh efek yang sama.</p>
<h2 id="pemahatan-sdf-pendekatan-dreams" tabindex="-1">Pemahatan SDF: Pendekatan Dreams <a class="header-anchor" href="#pemahatan-sdf-pendekatan-dreams" aria-label="Permalink to &quot;Pemahatan SDF: Pendekatan Dreams&quot;"></a></h2>
<p>Dreams dari Media Molecule (PS4, 2020) adalah sistem pemahatan di dalam game paling ambisius yang pernah dirilis. Alex Evans mempresentasikan pendekatan teknisnya pada SIGGRAPH 2015.</p>
<h3 id="representasi" tabindex="-1">Representasi <a class="header-anchor" href="#representasi" aria-label="Permalink to &quot;Representasi&quot;"></a></h3>
<p>Dreams menyimpan geometri sebagai fungsi SDF gabungan dalam blok tekstur volume fp16 berukuran 83^3. Setiap pahatan merupakan daftar berisi 1 hingga 100.000 &quot;pengeditan&quot;, dengan setiap pengeditan berupa operasi CSG (tambah, kurangi, warna) yang memiliki bentuk primitif (bola, kubus, silinder, kerucut, elipsoid, torus, dan sebagainya) serta mode blend.
Mode perpaduan menggunakan fungsi soft-max dan soft-min. Perpaduan &quot;lunak&quot; menghasilkan transisi membulat antarprimitif (seperti tanah liat yang ditekan hingga menyatu). Perpaduan &quot;keras&quot; menghasilkan potongan boolean yang tegas. Radius perpaduan dapat dikendalikan pengguna.</p>
<h3 id="rendering" tabindex="-1">Rendering <a class="header-anchor" href="#rendering" aria-label="Permalink to &quot;Rendering&quot;"></a></h3>
<p>Dreams tidak mengekstrak mesh segitiga. Sebaliknya, Dreams merender langsung dari SDF menggunakan perender point-cloud khusus (&quot;flecks&quot;). Setiap fleck adalah cakram kecil yang diorientasikan mengikuti normal permukaan. SDF diambil sampelnya untuk menemukan permukaan, lalu fleck disebarkan di atasnya. Hal ini sepenuhnya menghindari hambatan kinerja ekstraksi mesh, tetapi membutuhkan perender khusus.</p>
<p>Untuk dunia Three.js/WebGL, pendekatan ini tidak dapat diterapkan secara langsung. Kita perlu mengekstrak mesh. Namun, konsep daftar pengeditan CSG sangat relevan untuk urungkan/ulangi dan sinkronisasi jaringan.</p>
<h2 id="mesin-sdf-dinamis-mike-turitzin-2026" tabindex="-1">Mesin SDF Dinamis Mike Turitzin (2026) <a class="header-anchor" href="#mesin-sdf-dinamis-mike-turitzin-2026" aria-label="Permalink to &quot;Mesin SDF Dinamis Mike Turitzin (2026)&quot;"></a></h2>
<p>Sebuah mesin game yang saat ini sedang dikembangkan oleh Mike Turitzin menggunakan SDF dinamis sebagai representasi intinya. Mesin ini mendukung:</p>
<p><strong>Modifikasi mendetail selama permainan:</strong> Menambahkan dan menghilangkan materi secara halus atau dengan tepian tajam. Perubahan nondestruktif seperti memindahkan lubang atau membuat terowongan sementara yang menghilang di belakang pemain.</p>
<p><strong>Peta brick dan atlas brick</strong> untuk caching renggang. Alih-alih menyimpan seluruh medan SDF dalam grid 3D padat, medan dibagi menjadi &quot;brick&quot; (ubin 3D kecil). Hanya brick yang memuat batas permukaan yang dialokasikan. Hal ini secara drastis mengurangi penggunaan memori untuk adegan yang sebagian besar ruangnya kosong atau padat.</p>
<p><strong>Geometry clipmap</strong> (Losasso &amp; Hoppe, SIGGRAPH 2004) untuk LOD. Grid reguler bertingkat dengan resolusi yang makin tinggi mengelilingi posisi kamera. Grid terdalam memiliki resolusi paling tinggi; grid luar menjadi semakin kasar. Pendekatan ini sangat mengurangi penggunaan memori sekaligus mendukung ruang yang sangat luas. Clipmap diperbarui secara inkremental saat kamera bergerak, sehingga efisien untuk streaming dunia terbuka.</p>
<p><strong>Fisika dan tabrakan</strong> bekerja langsung terhadap SDF. Sphere-tracing (ray marching dengan jarak SDF sebagai ukuran langkah) memungkinkan raycasting yang efisien. Deteksi tabrakan menggunakan gradien SDF sebagai normal permukaan dan nilai jarak sebagai kedalaman penetrasi.</p>
<h2 id="teardown-destruksi-voxel-dalam-skala-besar" tabindex="-1">Teardown: Destruksi Voxel dalam Skala Besar <a class="header-anchor" href="#teardown-destruksi-voxel-dalam-skala-besar" aria-label="Permalink to &quot;Teardown: Destruksi Voxel dalam Skala Besar&quot;"></a></h2>
<p>Teardown (Voxagon) mewakili ujung spektrum yang lain: setiap objek di dunia merupakan volume voxel yang dapat dihancurkan sedikit demi sedikit.</p>
<h3 id="arsitektur" tabindex="-1">Arsitektur <a class="header-anchor" href="#arsitektur" aria-label="Permalink to &quot;Arsitektur&quot;"></a></h3>
<p>Objek disimpan sebagai grid voxel dengan jarak teratur. Mesin ini tidak menggunakan Marching Cubes atau SDF untuk rendering. Sebaliknya, mesin melakukan ray tracing langsung pada voxel menggunakan algoritma DDA (Digital Differential Analyzer) yang dimodifikasi dalam fragment shader, dibangun di atas OpenGL 3.3. Mipmap membentuk struktur octree padat untuk mempercepat penelusuran ruang kosong selama perpotongan sinar.</p>
<p>Untuk setiap objek, mesin merasterisasi oriented bounding box (OBB) miliknya dan menelusurkan sinar melaluinya untuk menemukan perpotongan voxel. Hanya sisi belakang OBB yang dirender, sehingga kamera dapat masuk ke dalam volume pembatas.</p>
<h3 id="sinkronisasi-destruksi-multipemain" tabindex="-1">Sinkronisasi Destruksi (Multipemain) <a class="header-anchor" href="#sinkronisasi-destruksi-multipemain" aria-label="Permalink to &quot;Sinkronisasi Destruksi (Multipemain)&quot;"></a></h3>
<p>Pembaruan multipemain Teardown pada Maret 2026 menggunakan pendekatan semideterministik. Destruksi struktural (memotong lubang, mengubah kepemilikan, menyambungkan kembali joint) ditangani melalui matematika bilangan bulat fixed-point pada aliran jaringan yang andal. Semua klien menjalankan perintah deterministik yang sama dan mencapai keadaan dunia yang sama. Perubahan nonstruktural (serpihan, partikel) menggunakan sinkronisasi keadaan yang tidak andal.</p>
<p>Ini merupakan wawasan penting bagi dunia multipemain kita: pengeditan medan harus deterministik. Jika Pemain A memahat gunung, semua klien harus menghasilkan mesh yang sama dari data medan yang sama. Perintah pengeditan (posisi kuas, radius, kekuatan, jenis operasi) harus menjadi data otoritatif, bukan mesh yang dihasilkan.</p>
<h2 id="alice-sdf-kompresi-dan-pohon-csg" tabindex="-1">ALICE-SDF: Kompresi dan Pohon CSG <a class="header-anchor" href="#alice-sdf-kompresi-dan-pohon-csg" aria-label="Permalink to &quot;ALICE-SDF: Kompresi dan Pohon CSG&quot;"></a></h2>
<p>ALICE-SDF (Adaptive Lightweight Implicit Compression Engine, v1.3.0 Maret 2026) menyediakan implementasi data spasial berbasis SDF dalam Rust dengan kompresi 10–1.000x dibandingkan mesh poligon. ALICE-SDF mendukung:</p>
<p><strong>126 blok pembangun:</strong> 72 primitif, 24 operasi, 7 transformasi, dan 23 modifier. Operasi perpaduan halus (union, subtraction, intersection), serta perpaduan chamfer dan tangga untuk bevel bertepi keras dan transisi CSG bertingkat.</p>
<p><strong>Diff/patch pohon CSG</strong> untuk urungkan/ulangi dan sinkronisasi jaringan. Inilah fitur utama untuk pemahatan multipemain: alih-alih mengirim seluruh keadaan medan, Anda mengirim diff struktural antara dua pohon CSG. Klien menerapkan patch untuk merekonstruksi keadaan baru. Pendekatan ini jauh lebih hemat bandwidth dibandingkan mengompresi delta data voxel mentah.</p>
<p><strong>Optimalisasi pohon CSG</strong> yang mencakup penghapusan transformasi identitas, penggabungan transformasi bertingkat, dan demosi modifier. Hal ini menjaga pohon tetap ringkas seiring menumpuknya pengeditan.</p>
<p><strong>Pembuatan mesh</strong> melalui Marching Cubes dan Dual Contouring. Deteksi tabrakan fisika bekerja langsung terhadap SDF.</p>
<p><strong>Dukungan WebAssembly</strong> memungkinkan integrasi browser. Mesin ini ditulis dalam Rust dengan binding WASM, sehingga menjadi opsi yang realistis untuk aplikasi Three.js.</p>
<h2 id="komputasi-webgpu-untuk-medan" tabindex="-1">Komputasi WebGPU untuk Medan <a class="header-anchor" href="#komputasi-webgpu-untuk-medan" aria-label="Permalink to &quot;Komputasi WebGPU untuk Medan&quot;"></a></h2>
<p>WebGPU kini tersedia di semua browser utama sejak akhir 2025. Chrome 113+, Edge 113+, Firefox 141+, dan Safari 26+ semuanya menyertakannya dalam keadaan aktif. Hal ini membuka pipeline compute shader yang sebelumnya hanya tersedia di GPU.</p>
<h3 id="performa" tabindex="-1">Performa <a class="header-anchor" href="#performa" aria-label="Permalink to &quot;Performa&quot;"></a></h3>
<p>Compute shader WebGPU menghasilkan medan sekitar 100x lebih cepat daripada metode CPU berkat paralelisasi masif. GPU menjalankan ribuan kalkulasi secara bersamaan, dan pembuatan medan hampir sepenuhnya paralel (setiap vertex/voxel bersifat independen).</p>
<p>Pekerjaan diatur dalam tiga tingkatan: Dispatch Level (distribusi beban kerja di seluruh GPU), Workgroup Level (memori bersama dalam unit pemrosesan), dan Thread Level (kalkulasi individual). WGSL (WebGPU Shading Language) adalah bahasa shader yang digunakan.</p>
<h3 id="pipeline-pemahatan-medan-real-time" tabindex="-1">Pipeline Pemahatan Medan Real-Time <a class="header-anchor" href="#pipeline-pemahatan-medan-real-time" aria-label="Permalink to &quot;Pipeline Pemahatan Medan Real-Time&quot;"></a></h3>
<p>Pipeline pemahatan WebGPU akan terlihat seperti ini:</p>
<ol>
<li>
<p><strong>Penerapan kuas</strong> (compute shader): Perbarui nilai medan skalar dalam radius kuas. Setiap thread menangani satu voxel. Baca parameter kuas (posisi, radius, kekuatan, jenis falloff, operasi) dari uniform buffer dan terapkan modifikasi.</p>
</li>
<li>
<p><strong>Ekstraksi mesh</strong> (compute shader): Jalankan Surface Nets atau Marching Cubes pada wilayah yang dimodifikasi. WebGPU SDF Editor karya Nijhoff mengimplementasikannya sebagai pipeline multistage: partisi ruang di 16.384 sel, pemisahan sel berbasis octree, lalu ekstraksi permukaan.</p>
</li>
<li>
<p><strong>Pembaruan vertex buffer</strong> (di sisi GPU): Tulis vertex yang diekstrak langsung ke render buffer tanpa perlu bolak-balik melalui memori CPU.</p>
</li>
<li>
<p><strong>Penghitungan normal</strong> (compute shader): Hitung normal vertex dari mesh atau gradien SDF.</p>
</li>
<li>
<p><strong>Render</strong> (pipeline standar): Gambar mesh dengan material PBR standar.</p>
</li>
</ol>
<p>Langkah 1–4 seluruhnya dapat berjalan di GPU tanpa mengembalikan data apa pun ke JavaScript. CPU hanya perlu mengirim parameter kuas pada setiap frame.</p>
<h3 id="webgpu-sdf-editor" tabindex="-1">WebGPU SDF Editor <a class="header-anchor" href="#webgpu-sdf-editor" aria-label="Permalink to &quot;WebGPU SDF Editor&quot;"></a></h3>
<p>WebGPU SDF Editor karya Reinder Nijhoff (Januari 2026) mendemonstrasikan pendekatan ini berjalan di Chrome. Editor ini mendukung enam primitif (kerucut, silinder, kapsul, torus, kotak, bola), tiga operasi perpaduan (union, subtraction, intersection) dengan perpaduan halus yang dapat dikonfigurasi, serta scene graph hierarkis. Setiap primitif menempati 112 byte dalam satu buffer GPU.</p>
<p>Pipeline rendering menggunakan 1.024 shadow map untuk ambient occlusion dan temporal anti-aliasing. Pipeline ini berjalan pada frame rate interaktif di GPU kelas atas.</p>
<h2 id="pemahatan-heightmap-jalur-yang-lebih-sederhana" tabindex="-1">Pemahatan Heightmap: Jalur yang Lebih Sederhana <a class="header-anchor" href="#pemahatan-heightmap-jalur-yang-lebih-sederhana" aria-label="Permalink to &quot;Pemahatan Heightmap: Jalur yang Lebih Sederhana&quot;"></a></h2>
<p>Jika dukungan gua dan bagian yang menjorok tidak diperlukan, pemahatan heightmap dapat menghindari seluruh pipeline volumetrik. Inilah cara sebagian besar game yang telah dirilis menangani pengeditan medan.</p>
<h3 id="pola-implementasi-runtime" tabindex="-1">Pola Implementasi Runtime <a class="header-anchor" href="#pola-implementasi-runtime" aria-label="Permalink to &quot;Pola Implementasi Runtime&quot;"></a></h3>
<p>Unity Runtime Terrain (JohannHotzel, Januari 2026) mendemonstrasikan pola standar:</p>
<ol>
<li><strong>Lakukan raycast</strong> dari kamera melalui posisi mouse untuk menemukan titik perkenaan pada medan.</li>
<li><strong>Petakan titik perkenaan</strong> ke koordinat heightmap.</li>
<li><strong>Terapkan kuas</strong> ke nilai heightmap di sekitarnya, dengan bobot berdasarkan falloff.</li>
<li><strong>Perbarui mesh</strong> dengan mengatur posisi Y vertex berdasarkan heightmap yang telah dimodifikasi.</li>
<li><strong>Bangun ulang collider fisika</strong> agar sesuai dengan mesh baru.</li>
</ol>
<p>Untuk medan Three.js kita, langkah 1–4 dapat dipetakan langsung ke arsitektur yang ada. Kelas <code>Chunk</code> sudah menyimpan heightmap dan membangun mesh darinya. Menambahkan pemahatan berarti menyediakan:</p>
<ul>
<li>Sistem raycasting terhadap mesh chunk (Three.js <code>Raycaster</code>)</li>
<li>Fungsi penerapan kuas yang memodifikasi nilai <code>chunk.heightmap</code></li>
<li>Pembaruan vertex mesh (atur posisi Y, hitung ulang normal)</li>
<li>Penghitungan ulang splat map untuk wilayah yang terdampak (agar perpaduan tekstur mencerminkan kemiringan/ketinggian baru)</li>
<li>Broadcast pengeditan melalui jaringan (posisi kuas, radius, kekuatan, operasi) ke klien lain melalui protokol WebSocket yang sudah ada</li>
</ul>
<h3 id="pendekatan-clipmap" tabindex="-1">Pendekatan Clipmap <a class="header-anchor" href="#pendekatan-clipmap" aria-label="Permalink to &quot;Pendekatan Clipmap&quot;"></a></h3>
<p>Landow.dev menjelaskan &quot;wandering clipmap&quot; untuk medan heightmap: satu mesh dengan kepadatan subdivisi bervariasi yang mengikuti pemain. Alih-alih membagi heightmap menjadi mesh terpisah dengan tingkat LOD berbeda (seperti yang kita lakukan sekarang), clipmap merupakan mesh kontinu yang rapat di dekat kamera dan kasar di bagian tepi.</p>
<p>Hal ini sepenuhnya menghilangkan penyambungan LOD. Mesh hanya memiliki lebih banyak segitiga di tempat yang membutuhkannya dan lebih sedikit di tempat yang tidak. Konsekuensinya, pemahatan perlu memperbarui satu mesh besar, bukan masing-masing chunk, yang dapat memakan biaya besar untuk pengeditan berskala luas.</p>
<h3 id="heightmap-sdf-nondestruktif" tabindex="-1">Heightmap SDF Nondestruktif <a class="header-anchor" href="#heightmap-sdf-nondestruktif" aria-label="Permalink to &quot;Heightmap SDF Nondestruktif&quot;"></a></h3>
<p>Landow.dev juga menjelaskan teknik yang menghasilkan heightmap itu sendiri dari komposisi SDF. Instans bentuk (bola, kotak, fungsi noise) dikomposisikan dalam compute shader menggunakan operasi CSG, lalu output-nya diambil sampelnya sebagai heightmap. Pendekatan ini menyediakan pengeditan nondestruktif (Anda dapat memindahkan atau menghapus instans bentuk apa pun kapan saja) sekaligus mempertahankan kesederhanaan rendering heightmap.</p>
<p>Ini merupakan pendekatan hibrida yang menarik: representasi datanya bersifat volumetrik (pohon CSG SDF), tetapi jalur rendering-nya menggunakan mesh heightmap standar. Anda memperoleh fitur urungkan/ulangi dan operasi pengeditan yang ramah jaringan dari sisi SDF, serta rendering dan fisika sederhana dari sisi heightmap. Keterbatasannya tetap sama: tidak ada gua atau bagian yang menjorok.</p>
<h2 id="sparse-voxel-octree-untuk-dunia-luas" tabindex="-1">Sparse Voxel Octree untuk Dunia Luas <a class="header-anchor" href="#sparse-voxel-octree-untuk-dunia-luas" aria-label="Permalink to &quot;Sparse Voxel Octree untuk Dunia Luas&quot;"></a></h2>
<p>Grid 3D padat tidak dapat diskalakan dengan baik. Dunia berukuran 1 km pada setiap sisinya dengan resolusi 0,5 m akan membutuhkan 8 miliar voxel. Sparse Voxel Octree (SVO) mengatasi hal ini dengan membagi ruang secara rekursif dan hanya mengalokasikan penyimpanan untuk oktan yang memuat batas permukaan.</p>
<p>SVO secara alami menyediakan LOD hierarkis: kedalaman pohon di titik mana pun menentukan resolusi efektif. Di dekat pemain, pohon dikembangkan sepenuhnya (detail maksimum). Di kejauhan, pohon dipangkas pada tingkat yang lebih kasar.</p>
<p>Untuk rendering, SVO dapat di-ray-trace secara langsung (tidak memerlukan ekstraksi mesh). GPU ray marcher memotongkan sinar dengan kotak yang sejajar sumbu pada setiap tingkat pohon, sambil sepenuhnya melewati subtree kosong. Hal ini menghilangkan masalah overdraw pada rendering berbasis chunk dan menghindari artefak greedy meshing.</p>
<p>Pembangun SVO berbasis Vulkan karya AdamYuan menunjukkan performa yang signifikan: waktu pembangunan 19 md untuk Crytek Sponza pada resolusi 2^10 di GTX 1660 Ti.</p>
<p>Untuk pemahatan, modifikasi SVO berlangsung efisien: hanya node daun di dalam radius kuas yang perlu diperbarui, dan struktur pohon secara alami menangani resolusi yang bervariasi. Penambahan detail di tempat pemain memahat (membagi node ke resolusi yang lebih tinggi) dan pengurangan detail di tempat yang dihaluskan (menggabungkan node ke resolusi yang lebih rendah) muncul secara alami dari struktur data tersebut.</p>
<p>Tantangan untuk deployment di browser adalah WebGL tidak mendukung compute shader. Meskipun WebGPU mendukungnya, algoritma konstruksi dan penelusuran SVO rumit untuk diimplementasikan dalam WGSL.</p>
<h2 id="sinkronisasi-jaringan-untuk-pemahatan-multipemain" tabindex="-1">Sinkronisasi Jaringan untuk Pemahatan Multipemain <a class="header-anchor" href="#sinkronisasi-jaringan-untuk-pemahatan-multipemain" aria-label="Permalink to &quot;Sinkronisasi Jaringan untuk Pemahatan Multipemain&quot;"></a></h2>
<p>Dunia kita sudah memiliki fitur multipemain melalui Cloudflare Durable Objects (<code>world-chunk-do.ts</code>). Menambahkan pemahatan berarti menyinkronkan modifikasi medan di antara semua klien yang terhubung.</p>
<h3 id="kompresi-delta" tabindex="-1">Kompresi Delta <a class="header-anchor" href="#kompresi-delta" aria-label="Permalink to &quot;Kompresi Delta&quot;"></a></h3>
<p>Mengirim data voxel mentah membutuhkan biaya besar. Studi tahun 2024 dari Universitas Oulu mencapai peningkatan payload 2–8x dengan menggabungkan delta-encoding dan kompresi DEFLATE, mengemas pembaruan voxel menjadi kurang dari satu byte per voxel. Codec SDEC mendemonstrasikan delta encoding yang dikemas dalam bit, dengan paket rata-rata 259 byte dibandingkan 1.114 byte menggunakan serialisasi generik.</p>
<h3 id="sinkronisasi-berbasis-operasi-direkomendasikan" tabindex="-1">Sinkronisasi Berbasis Operasi (Direkomendasikan) <a class="header-anchor" href="#sinkronisasi-berbasis-operasi-direkomendasikan" aria-label="Permalink to &quot;Sinkronisasi Berbasis Operasi (Direkomendasikan)&quot;"></a></h3>
<p>Alih-alih menyinkronkan keadaan medan, sinkronkan operasinya. Setiap tindakan pemahatan menjadi pesan:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> TerrainEditMsg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  t</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> MsgType</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">TerrainEdit</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  brush</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    position</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    radius</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    strength</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    falloff</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'smooth'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'linear'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'sharp'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'constant'</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    operation</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'raise'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'lower'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'smooth'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'flatten'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'noise'</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    targetHeight</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Server menyiarkan pesan ini ke semua klien, lalu setiap klien menerapkan operasi kuas deterministik yang sama pada data medan lokalnya. Ini adalah pendekatan yang sama dengan yang digunakan Teardown untuk destruksi struktural: perintah deterministik pada aliran yang andal.</p>
<p>Diff/patch pohon CSG ALICE-SDF membawa pendekatan ini lebih jauh: alih-alih goresan kuas individual, diff merepresentasikan perubahan struktural pada seluruh pohon CSG. Hal ini memungkinkan urungkan/ulangi secara efisien melalui jaringan (kirim patch invers) dan klien yang terlambat bergabung dapat merekonstruksi keadaan dunia secara penuh dengan memutar ulang log operasi.</p>
<h3 id="prioritas-dan-pembatasan-laju" tabindex="-1">Prioritas dan Pembatasan Laju <a class="header-anchor" href="#prioritas-dan-pembatasan-laju" aria-label="Permalink to &quot;Prioritas dan Pembatasan Laju&quot;"></a></h3>
<p>Pengeditan medan di dekat pemain yang terhubung harus berprioritas tinggi (langsung disiarkan). Pengeditan yang jauh dari pemain mana pun dapat dikelompokkan dan dikirim dengan frekuensi lebih rendah. Jaringan voxel Enshrouded menggunakan pola ini: pembaruan 60 Hz untuk medan di dekat pemain dan 10 Hz untuk wilayah latar belakang.</p>
<p>Kompresi ZSTD pada transmisi jaringan mengurangi ukuran paket hingga 60% untuk pesan pembaruan medan.</p>
<h2 id="pemahatan-kolaboratif-pengeditan-bersamaan" tabindex="-1">Pemahatan Kolaboratif: Pengeditan Bersamaan <a class="header-anchor" href="#pemahatan-kolaboratif-pengeditan-bersamaan" aria-label="Permalink to &quot;Pemahatan Kolaboratif: Pengeditan Bersamaan&quot;"></a></h2>
<p>Saat beberapa pemain memahat wilayah yang sama secara bersamaan, Anda memerlukan penyelesaian konflik. <code>cSculpt</code> (CNR Visual Computing Lab, 2016) mengatasinya dengan algoritma penggabungan multiresolusi. Setiap pengeditan direpresentasikan pada beberapa skala, lalu pengeditan bersamaan yang tumpang tindih digabungkan dengan memadukan representasi multiresolusinya.
Untuk kebutuhan kita, pendekatan yang lebih sederhana sudah memadai: penulisan terakhir yang menang dengan pengurutan oleh server. Durable Object memberi stempel waktu pada setiap pengeditan dan menyiarkannya secara berurutan. Semua klien menerapkan pengeditan dalam urutan yang sama. Karena sapuan kuas berukuran kecil, terlokalisasi, dan bersifat menambah/mengurangi, hasil visual dari pengeditan bersamaan yang urutannya sedikit berubah biasanya tidak dapat dibedakan dari urutan yang &quot;benar&quot;.</p>
<h2 id="inst-sculpt-pengeditan-sdf-neural-garda-depan-riset" tabindex="-1">INST-Sculpt: Pengeditan SDF Neural (Garda Depan Riset) <a class="header-anchor" href="#inst-sculpt-pengeditan-sdf-neural-garda-depan-riset" aria-label="Permalink to &quot;INST-Sculpt: Pengeditan SDF Neural (Garda Depan Riset)&quot;"></a></h2>
<p>INST-Sculpt (arxiv 2502.02891, Februari 2025) memungkinkan pengeditan SDF neural berbasis sapuan. Pengguna menggambar sapuan pada permukaan, lalu sistem mendeformasi medan neural yang mendasarinya di sepanjang area tubular di sekitar jalur sapuan. Profil kuas khusus (penampang lintang yang dapat dikonfigurasi) mengendalikan bentuk deformasi.</p>
<p>Hal ini menarik untuk medan yang dihasilkan AI: jika dunia dasar direpresentasikan sebagai SDF neural (jaringan neural kecil yang memetakan koordinat 3D ke jarak bertanda), pemahatan memodifikasi bobot jaringan alih-alih data voxel eksplisit. Representasinya sangat ringkas (beberapa MB untuk seluruh dunia), tetapi evaluasinya lebih mahal daripada tabel pencarian.</p>
<p>Teknologi ini masih berada pada tahap riset. Biaya inferensi SDF neural pada perangkat konsumen saat ini terlalu tinggi untuk penggunaan gim waktu nyata. Namun, teknologi ini patut dipantau, terutama seiring meningkatnya kemampuan shader WebGPU dan semakin cepatnya inferensi model.</p>
<h2 id="world-creator-2026-3-mutakhir-dalam-medan-komersial" tabindex="-1">World Creator 2026.3: Mutakhir dalam Medan Komersial <a class="header-anchor" href="#world-creator-2026-3-mutakhir-dalam-medan-komersial" aria-label="Permalink to &quot;World Creator 2026.3: Mutakhir dalam Medan Komersial&quot;"></a></h2>
<p>World Creator (BiteTheBytes, Maret 2026) merepresentasikan teknologi mutakhir komersial untuk alat pembuatan medan. Versi 2026.3 menambahkan pembuatan medan berbasis GPU dengan adaptasi medan otomatis (medan menyesuaikan diri dengan objek yang ditempatkan), distribusi objek yang berfokus pada kamera untuk pengoptimalan LOD, dan impor data elevasi dunia nyata (GeoTIFF, HGT, DTED).</p>
<p>Sejak itu, World Creator 2026.4 (28 April 2026) menambahkan ekspresi matematis dalam kolom numerik, pencampuran normal medan untuk menyatukan objek utama dengan permukaan, dukungan penuh untuk decal, dan penskalaan VRAM yang menyesuaikan jumlah maksimum objek dengan memori GPU yang tersedia. BiteTheBytes juga merilis Community Edition gratis yang memiliki fitur lengkap tetapi ekspornya dinonaktifkan, sehingga secara efektif menjadi versi uji coba tanpa batas waktu.</p>
<p>Pendekatan mereka menggunakan komputasi GPU untuk semua operasi medan: simulasi erosi, pengukiran sungai, dan pengecatan tekstur. Alat kuasnya diakselerasi GPU dengan umpan balik viewport waktu nyata. Ini sesuai dengan pipeline komputasi WebGPU yang dijelaskan di atas, yang dijalankan pada GPU desktop.</p>
<h2 id="yang-telah-kita-bangun-24-spike-dan-sebuah-dunia-produksi" tabindex="-1">Yang Telah Kita Bangun: 24 Spike dan Sebuah Dunia Produksi <a class="header-anchor" href="#yang-telah-kita-bangun-24-spike-dan-sebuah-dunia-produksi" aria-label="Permalink to &quot;Yang Telah Kita Bangun: 24 Spike dan Sebuah Dunia Produksi&quot;"></a></h2>
<p>Direktori <code>world/spikes/</code> berisi 24 prototipe mandiri. Ini bukan demo mainan. Semuanya merupakan pipeline R&amp;D progresif, dengan setiap spike menyelesaikan masalah tertentu, mengukur performanya terhadap target, dan menjadi dasar untuk spike berikutnya. Sistem pemahatan dibangun di atas semuanya, bukan hanya spike volumetrik yang lebih baru.</p>
<h3 id="medan-heightmap-produksi-world-client" tabindex="-1">Medan Heightmap Produksi (<code>world/client/</code>) <a class="header-anchor" href="#medan-heightmap-produksi-world-client" aria-label="Permalink to &quot;Medan Heightmap Produksi (`world/client/`)&quot;"></a></h3>
<p>Dunia aktif menggunakan sistem heightmap berbasis chunk di Three.js WebGL:</p>
<ul>
<li><code>noise.ts</code> menghasilkan ketinggian medan melalui FBM value noise (5 oktaf untuk perbukitan, 4 untuk punggung bukit, 3 untuk detail mikro) dengan fungsi <code>terrainHeight(wx, wz)</code> yang deterministik</li>
<li><code>chunk.ts</code> membuat mesh <code>PlaneGeometry</code> dari heightmap <code>Float32Array</code> dengan 3 tingkat LOD (32/8/4 segmen per chunk berukuran 64 unit), serta menempatkan pohon/billboard terinstansiasi menggunakan penempatan acak berbasis seed dan collider per objek</li>
<li><code>chunk-manager.ts</code> melakukan streaming chunk dalam bentuk cincin di sekitar pemain (radius 1 pada LOD0, radius 3 pada LOD1, radius 6 pada LOD2) dengan penyambungan tepi melalui interpolasi linear di <code>stitchEdge()</code>, serta menyediakan <code>getHeight()</code>, <code>getNormal()</code>, dan <code>resolveCollisions()</code> untuk lapisan fisika</li>
<li><code>terrain-material.ts</code> melakukan pencampuran tekstur berbasis splat dengan 4 lapisan (rumput/batu/pasir/tanah) melalui <code>MeshStandardMaterial.onBeforeCompile</code>, menggunakan bobot berdasarkan kemiringan dan ketinggian, ditambah pencampuran normal map per lapisan</li>
<li><code>character-controller.ts</code> mengambil sampel ketinggian medan setiap frame untuk gravitasi, pijakan, dan penolakan lereng (kosinus kemiringan maksimum 50 derajat). Pemahatan harus segera memasukkan ketinggian yang telah dimodifikasi ke sistem ini atau pemain akan jatuh menembus medan yang diedit</li>
<li><code>placement.ts</code> sudah memiliki <code>Raycaster</code> yang mengenai mesh chunk untuk alat penempatan objek. Alat kuas harus mengikuti pola yang sama persis, alih-alih membangun raycasting dari awal</li>
<li><code>protocol.ts</code> mendefinisikan pesan berkode MessagePack untuk sinkronisasi multipemain melalui Durable Object <code>world-chunk-do.ts</code>, yang saat ini menangani pesan <code>PlayerState</code>, <code>PlaceObject</code>, <code>RemoveObject</code>, dan <code>Snapshot</code>. Pengeditan medan akan memerlukan jenis pesan baru</li>
<li><code>world-chunk-do.ts</code> (Cloudflare Worker) menyimpan objek yang ditempatkan ke penyimpanan Durable Object dan menyiarkannya kepada pemain yang terhubung dalam interval 50 md. Saat ini sistem tersebut belum memiliki konsep modifikasi medan</li>
</ul>
<h3 id="spike-01-11-lapisan-fondasi" tabindex="-1">Spike 01-11: Lapisan Fondasi <a class="header-anchor" href="#spike-01-11-lapisan-fondasi" aria-label="Permalink to &quot;Spike 01-11: Lapisan Fondasi&quot;"></a></h3>
<p>Spike-spike ini memvalidasi sistem inti yang akan menjadi tumpuan pemahatan. Melewatinya berarti mengabaikan batasan yang harus dipatuhi oleh sistem pemahatan.</p>
<p><strong>Spike 01 (Medan + Instancing):</strong> Prototipe medan pertama di Three.js. Menetapkan pola PlaneGeometry + heightmap dan penempatan objek terinstansiasi yang masih digunakan oleh <code>chunk.ts</code>.</p>
<p><strong>Spike 02 (Worker Fisika Rapier):</strong> Rapier 3D berjalan di dalam Web Worker dengan collider <code>ColliderDesc.heightfield()</code>. Spike ini membangun pengontrol karakter kinematik dengan langkah otomatis, batas kemiringan, dan penempelan ke permukaan tanah. Spike ini membuktikan bahwa fisika dapat berjalan di luar thread utama terhadap sebuah heightfield. Jika kita memahat medan, heightfield fisika harus dibuat ulang atau diganti dengan collider trimesh untuk chunk MC.</p>
<p><strong>Spike 05 (Perilaku LLM):</strong> Tidak berkaitan langsung dengan medan, tetapi menetapkan skema perilaku JSON untuk objek gim. Ini relevan karena fitur medan hasil pahatan dapat memicu perilaku (misalnya, sungai yang diukir memunculkan efek air).</p>
<p><strong>Spike 06 (Streaming Chunk):</strong> Sistem pemuatan/pertukaran chunk pertama dengan pemuatan dinamis saat pemain bergerak. Menetapkan pola yang digunakan oleh <code>chunk-manager.ts</code>: wilayah berwarna yang dimuat dan dibongkar. Pemahatan harus mempertahankan status pengeditan ketika chunk dibongkar dan dimuat kembali.</p>
<p><strong>Spike 07 (Vegetasi GPU dari Peta Kepadatan):</strong> Rumput dan pohon terinstansiasi yang ditempatkan melalui peta kepadatan dengan mengambil sampel ketinggian dan kemiringan medan. Pemahatan membuat penempatan vegetasi tidak lagi valid: jika ketinggian medan berubah, pohon dapat berakhir melayang atau terkubur. Peta kepadatan harus dibuat ulang untuk chunk yang diedit.</p>
<p><strong>Spike 08 (Biaya Shader Material Medan):</strong> Mengukur performa proyeksi triplanar, normal map, dan pencampuran 4 lapisan. Mengukur biaya setiap fitur secara presisi dalam milidetik. Ditemukan bahwa triplanar + normal + 4 lapisan tetap sesuai anggaran pada 45+ FPS. Anggaran ini penting bagi medan terpahat: jika kita menambahkan lapisan ke-5 untuk &quot;tanah yang diedit&quot; atau mengubah pencampuran untuk permukaan yang diukir, kita tahu persis berapa banyak ruang performa yang tersedia.</p>
<p><strong>Spike 09 (Anggaran Bayangan CSM):</strong> Cascaded shadow map dengan 3 cascade pada resolusi 1024^2. Biaya bayangan terukur sekitar 1,5 md. Medan terpahat mengubah shadow map, tetapi biayanya tetap konstan terlepas dari bentuk medan.</p>
<p><strong>Spike 10 (Clipmap Geometri + Geomorphing):</strong> Cincin clipmap bertingkat dengan geomorphing di antara tingkat LOD untuk menghilangkan kemunculan mendadak. Jumlah segitiga yang konstan menghasilkan biaya GPU yang dapat diprediksi. Geomorphing penting bagi pemahatan: ketika pemain memahat di dekat batas LOD, transisi morf di antara tingkat LOD harus mencerminkan pengeditan tersebut. Jika pengeditan hanya ada di cincin beresolusi tinggi, target geomorph akan salah.</p>
<p><strong>Spike 11 (Streaming Chunk Heightmap):</strong> Streaming chunk yang lebih canggih dengan kisi visual yang menunjukkan status dimuat/sedang dimuat/tidak dimuat pada setiap tingkat LOD. Menetapkan anggaran streaming: jumlah maksimum chunk yang dimuat per frame dan prioritas chunk yang memerlukan peningkatan LOD. Pemahatan menambahkan sinyal prioritas baru: chunk yang sedang aktif diedit oleh pemain tidak boleh dibongkar.</p>
<h3 id="spike-12-14-integrasi-webgpu-three-js" tabindex="-1">Spike 12-14: Integrasi WebGPU + Three.js <a class="header-anchor" href="#spike-12-14-integrasi-webgpu-three-js" aria-label="Permalink to &quot;Spike 12-14: Integrasi WebGPU + Three.js&quot;"></a></h3>
<p><strong>Spike 12 (Marching Cubes WebGPU):</strong> Spike volumetrik pertama. Empat chunk SDF berukuran 64^3 dengan gua berbentuk bola yang dianimasikan, berjalan sepenuhnya di GPU. Menggunakan WebGPU mentah: pipeline komputasi untuk evaluasi SDF, ekstraksi MC dengan tabel kasus Twinklebear (256 konfigurasi, masing-masing 16 entri), penghitung vertex atomik, dan indirect draw. Target performanya adalah &lt;4 md per chunk, &lt;12 md untuk keempatnya. Ini memvalidasi bahwa MC GPU cukup cepat untuk remeshing waktu nyata di browser. Setiap spike volumetrik berikutnya menggunakan kembali tabel kasus MC dan shader WGSL yang didefinisikan di sini.</p>
<p><strong>Spike 13 (Reset Baseline dari Spike 12):</strong> Memindahkan jalur penggambaran WebGPU mentah milik Spike 12 agar berjalan di dalam <code>WebGPURenderer</code> Three.js, dengan mengakses <code>device</code> backend secara langsung. Pipeline rendering tetap menggunakan WebGPU mentah (<code>drawIndirect</code> dengan struct Vertex vec4+vec4). Ini membuktikan bahwa komputasi khusus dan rendering scene Three.js dapat berjalan berdampingan pada perangkat GPU yang sama.</p>
<p><strong>Spike 14 (Penguatan Inkremental WebGPU Three.js):</strong> Mengganti pipeline rendering mentah dengan <code>StorageBufferAttribute</code> Three.js untuk posisi dan normal. Komputasi MC menulis langsung ke buffer yang berada di GPU ini. Buffer <code>drawIndirect</code> mengendalikan jumlah vertex yang digambar Three.js. Ini adalah pola yang digunakan semua spike berikutnya: komputasi tetap menggunakan WebGPU mentah, sedangkan rendering dilakukan melalui scene graph Three.js. Versi Three.js di seluruh spike ini berkembang dari 0.170.0 menjadi 0.172.0 seiring stabilnya backend WebGPU.</p>
<h3 id="spike-15-17-penyambungan-lod-transvoxel" tabindex="-1">Spike 15-17: Penyambungan LOD Transvoxel <a class="header-anchor" href="#spike-15-17-penyambungan-lod-transvoxel" aria-label="Permalink to &quot;Spike 15-17: Penyambungan LOD Transvoxel&quot;"></a></h3>
<p><strong>Spike 15 (Kerangka Seam Transvoxel):</strong> Menambahkan arsitektur tiga zona: chunk MC (pusat volumetrik), strip transisi (seam antara batas MC dan heightmap), serta cincin medan (heightmap di sekelilingnya). Ketiganya menggunakan pass material yang sama. Pada tahap ini, strip transisi masih berupa mesh pengganti, bukan sel Transvoxel yang sebenarnya.</p>
<p><strong>Spike 16 (Sisi +X Transvoxel dengan Heightmap Bersama):</strong> Dua terobosan penting dalam satu spike. Pertama, mengganti bidang medan datar di SDF dengan heightmap Perlin bersama: sebuah Float32Array 257x257 yang diunggah ke GPU sebagai buffer penyimpanan dan diambil sampelnya melalui interpolasi bilinear di shader komputasi SDF. Permukaan MC dan mesh heightmap kini menyepakati sumber data kebenaran yang sama. Kedua, mengimplementasikan sel transisi Transvoxel sebenarnya untuk sisi +X dengan mengambil tabel data referensi Eric Lengyel dari GitHub (<code>transitionCellClass</code>, <code>transitionVertexData</code>, <code>transitionCellData</code>) dan paket npm <code>transvoxel-data</code>. CPU mengevaluasi sel transisi 9 sampel (512 konfigurasi, 73 kelas ekuivalensi), menempatkan vertex dengan menginterpolasi nilai SDF pada titik kisi, dan menangani pembalikan winding untuk kasus yang dicerminkan.</p>
<p><strong>Spike 17 (LOD MC Ganda 1x/2x):</strong> Dua chunk MC berdampingan dengan resolusi berbeda. Resolusi tinggi: 62 sel dengan cell_scale=1.0. Resolusi rendah: 31 sel dengan cell_scale=2.0. Shader MC mendapatkan uniform <code>cell_scale</code> dan <code>grid_points</code>. Memperkenalkan <code>transition_shrink</code>: vertex batas face-0 pada chunk beresolusi rendah ditarik ke dalam sebesar 15% dari cell_scale, sehingga menciptakan celah tipis yang diisi oleh sel transisi Transvoxel tanpa z-fighting. Inilah model LOD yang dibutuhkan sistem produksi: chunk dekat menggunakan resolusi penuh, chunk jauh menggunakan separuh resolusi, dan Transvoxel pada setiap batas.</p>
<h3 id="spike-18-21-kasus-sudut-transvoxel-dan-akselerasi-gpu" tabindex="-1">Spike 18-21: Kasus Sudut Transvoxel dan Akselerasi GPU <a class="header-anchor" href="#spike-18-21-kasus-sudut-transvoxel-dan-akselerasi-gpu" aria-label="Permalink to &quot;Spike 18-21: Kasus Sudut Transvoxel dan Akselerasi GPU&quot;"></a></h3>
<p>Keempat spike ini masing-masing menyelesaikan kasus kegagalan tertentu dalam implementasi Transvoxel. Mengelompokkannya akan mengaburkan perbedaan masalah yang diselesaikan.</p>
<p><strong>Spike 18 (Seam Heightmap 2:1):</strong> Menerapkan Transvoxel pada batas heightmap murni, dengan satu sisi memiliki resolusi dua kali sisi lainnya. Tidak ada MC yang terlibat. Seam antara chunk heightmap 62 sel dan 31 sel dihasilkan dari tabel transisi Transvoxel dengan penyusutan sisi beresolusi rendah sebesar 15%. Ini memvalidasi bahwa Transvoxel berfungsi untuk kasus yang hanya menggunakan heightmap, bukan hanya MC.</p>
<p><strong>Spike 19 (Kisi Sudut 64/32/32/16):</strong> Kasus penyambungan tersulit: empat chunk dengan resolusi berbeda bertemu di satu titik sudut (64, 32, 32, dan 16 sel). Sistem seam harus menghasilkan sel transisi di sepanjang empat tepi (A-B, A-C, B-D, C-D) dengan winding yang benar untuk setiap arah. Spike ini membuktikan bahwa tabel Transvoxel menangani sudut multiresolusi tanpa logika kasus khusus.</p>
<p><strong>Spike 20 (Sudut Transvoxel GPU):</strong> Memindahkan pembuatan sel transisi Transvoxel ke GPU untuk tata letak sudut 64/32/32/16. CPU menjadi bottleneck ketika membuat ulang sel transisi setiap frame untuk medan yang dianimasikan. Komputasi GPU menghasilkan vertex seam dalam pass yang sama dengan ekstraksi MC.</p>
<p><strong>Spike 21 (Sudut GPU MC + Transvoxel):</strong> Menggabungkan ekstraksi MC GPU penuh dengan pembuatan seam Transvoxel GPU dalam satu rangkaian dispatch komputasi. Chunk MC dan keempat seam dihasilkan di GPU, dengan jumlah vertex dikelola melalui penghitung atomik dan digambar menggunakan <code>drawIndirect</code>. Ini adalah pipeline GPU lengkap untuk medan volumetrik multiresolusi dengan transisi LOD tanpa celah.</p>
<h3 id="spike-22-24-arsitektur-hibrida" tabindex="-1">Spike 22-24: Arsitektur Hibrida <a class="header-anchor" href="#spike-22-24-arsitektur-hibrida" aria-label="Permalink to &quot;Spike 22-24: Arsitektur Hibrida&quot;"></a></h3>
<p><strong>Spike 22 (Kebijakan Hibrida MC/Heightmap):</strong> Spike arsitektur utama. Secara default, chunk menggunakan heightmap. Ketika bola deformasi yang dianimasikan beririsan dengan AABB sebuah chunk, chunk tersebut beralih ke mode MC. Chunk lainnya tetap berupa mesh heightmap statis. Tata letak: chunk 64, 32/32, dan 16 sel pada resolusi berbeda. Seam Transvoxel menangani setiap batas, termasuk transisi MC-ke-heightmap. Spike ini melacak jumlah chunk MC dibandingkan chunk HM dan luapan vertex per frame.</p>
<p><strong>Spike 23 (Mode Chunk Berbasis Kebijakan):</strong> Dimuat sebagai patch di atas Spike 22. Menambahkan histeresis berdasarkan jarak kamera (chunk tidak berubah-ubah cepat di antara mode ketika kamera berada dekat ambang batas) dan mask pengeditan (chunk yang telah dideformasi tetap berada dalam mode MC meskipun sumber deformasi berpindah menjauh). Inilah perilaku &quot;pengeditan persisten&quot; yang dibutuhkan pemahatan: setelah pemain mengukir gua, chunk tersebut tetap volumetrik selamanya.</p>
<p><strong>Spike 24 (Kebijakan + Cincin Clipmap):</strong> Spike tercanggih. Menggabungkan sistem kebijakan medan dekat dari Spike 23 dengan cincin clipmap geometri medan jauh dari Spike 10. Ditingkatkan ke Three.js 0.183.1. Medan dekat menggunakan hibrida HM/MC dengan seam Transvoxel pada resolusi 64/32/16. Medan jauh menggunakan cincin clipmap berpusat statis yang mengikuti kamera. Ini adalah arsitektur rendering medan lengkap: pemahatan volumetrik berbasis chunk di tempat yang dibutuhkan dan medan clipmap murah di area lainnya.</p>
<h3 id="mengapa-marching-cubes-bukan-surface-nets" tabindex="-1">Mengapa Marching Cubes, Bukan Surface Nets <a class="header-anchor" href="#mengapa-marching-cubes-bukan-surface-nets" aria-label="Permalink to &quot;Mengapa Marching Cubes, Bukan Surface Nets&quot;"></a></h3>
<p>Bagian riset eksternal dalam panduan ini menyarankan Surface Nets sebagai kandidat terkuat untuk pemahatan medan di browser. Namun, setiap spike dalam pipeline menggunakan Marching Cubes. Itu bukan kebetulan.</p>
<p>Keunggulan utama MC adalah paralelisme yang sangat mudah: setiap kubus sepenuhnya independen. Shader komputasi WGSL dalam Spike 12-24 menjalankan satu thread per kubus tanpa komunikasi antarsel. Penghitung atomik menangani alokasi verteks. Pendekatan ini sangat cocok dengan workgroup GPU.</p>
<p>Surface Nets menempatkan satu verteks per sel yang mengandung permukaan, lalu menghubungkannya dengan sel tetangga. Konektivitas tetangga tersebut merupakan dependensi antarsel. Crate <code>fast-surface-nets</code> menanganinya di CPU dengan urutan iterasi yang cermat. Di GPU, metode ini memerlukan pendekatan dua tahap (menemukan verteks, lalu menghubungkannya) atau memori bersama di dalam workgroup. Keduanya dapat dilakukan di WebGPU, tetapi menambah kompleksitas.</p>
<p>Rekomendasi praktisnya: tetap gunakan Marching Cubes untuk pipeline pemahatan. Metode ini telah terbukti di codebase kami, shader WGSL-nya sudah tersedia dan telah di-benchmark, serta sistem sambungan Transvoxel dibangun berdasarkan penempatan verteks berbasis sisi milik MC. Surface Nets layak dipertimbangkan kembali jika aliasing MC pada data biner menjadi masalah yang terlihat, tetapi untuk medan SDF dengan nilai berupa gradien halus, MC menghasilkan permukaan yang bersih.</p>
<h2 id="arsitektur-praktis-untuk-pemahatan" tabindex="-1">Arsitektur Praktis untuk Pemahatan <a class="header-anchor" href="#arsitektur-praktis-untuk-pemahatan" aria-label="Permalink to &quot;Arsitektur Praktis untuk Pemahatan&quot;"></a></h2>
<p>Rangkaian spike telah menyelesaikan pipeline rendering. Yang tersisa adalah sistem kuas, efek samping berantai di seluruh sistem game, dan sinkronisasi multipemain. Berikut rencananya, yang dibangun berdasarkan setiap spike.</p>
<h3 id="fase-1-pemahatan-heightmap-perubahan-minimal-jangkauan-maksimal" tabindex="-1">Fase 1: Pemahatan Heightmap (Perubahan Minimal, Jangkauan Maksimal) <a class="header-anchor" href="#fase-1-pemahatan-heightmap-perubahan-minimal-jangkauan-maksimal" aria-label="Permalink to &quot;Fase 1: Pemahatan Heightmap (Perubahan Minimal, Jangkauan Maksimal)&quot;"></a></h3>
<p>Tambahkan alat kuas yang memodifikasi heightmap chunk dalam kode produksi <code>world/client/</code>. Pendekatan ini bekerja dengan renderer WebGL yang sudah ada dan tidak memerlukan WebGPU.</p>
<p><strong>Input kuas:</strong> Ikuti pola <code>PlacementTool</code> dalam <code>placement.ts</code>. Pola tersebut sudah memiliki <code>Raycaster</code> yang mengenai <code>chunkManager.getChunkMeshes()</code> dan melacak mesh bayangan pada titik tumbukan. <code>TerrainBrushTool</code> akan melakukan raycast yang sama, tetapi memodifikasi heightmap chunk alih-alih menempatkan objek. Handler <code>World.onMouseDown</code> sudah meneruskan tindakan berdasarkan status alat.</p>
<p><strong>Modifikasi chunk (<code>Chunk.applyBrush</code>):</strong> Petakan posisi kuas di dunia ke koordinat kisi heightmap. Untuk setiap titik kisi di dalam radius kuas, hitung perpindahan berbobot falloff, lalu tambahkan atau kurangi nilainya dari heightmap. Setelah itu, perbarui mesh: atur posisi Y verteks dari heightmap yang telah dimodifikasi, hitung ulang normal melalui diferensiasi terpusat (pola <code>terrainHeight(wx +/- eps, wz)</code> yang sama seperti yang sudah digunakan dalam <code>chunk.ts</code> baris 155-158), lalu buat ulang splat map melalui <code>createSplatMap()</code> dalam <code>terrain-material.ts</code> untuk area terdampak agar perpaduan tekstur berbasis kemiringan ikut diperbarui.</p>
<p><strong>Pengontrol karakter:</strong> <code>CharacterController.update()</code> memanggil <code>getHeight()</code> pada setiap frame untuk menentukan pijakan. <code>ChunkManager.getHeight()</code> mendelegasikan ke <code>Chunk.sampleHeight()</code>, yang membaca dari Float32Array <code>heightmap</code> milik chunk. Karena kita memodifikasi array tersebut secara langsung, pengontrol karakter akan mendeteksi perubahan pada frame berikutnya tanpa wiring tambahan.</p>
<p><strong>Invalidasi objek:</strong> Instance pohon dalam <code>chunk.ts</code> ditempatkan dengan mengambil sampel <code>terrainHeight()</code> saat spawn. Setelah pemahatan, pohon di area terdampak mungkin berada pada ketinggian yang salah. Fase 1 dapat menunda penanganan ini (pohon hanya sedikit melayang pada edit kecil). Fase 2 memerlukan <code>chunk.invalidateObjects()</code> yang mengambil ulang sampel ketinggian dan membangun kembali matriks instance. Hal yang sama berlaku untuk collider yang digunakan dalam <code>resolveCollisions()</code>.</p>
<p><strong>Fisika Rapier (jika terintegrasi):</strong> Spike 02 membuktikan bahwa collider heightfield berfungsi. Jika Rapier aktif, collider heightfield harus dibangun ulang atau di-patch untuk chunk yang dimodifikasi. <code>ColliderDesc.heightfield()</code> milik Rapier menerima Float32Array datar, sehingga collider dapat langsung diganti.</p>
<p><strong>Sinkronisasi jaringan:</strong> Tambahkan <code>MsgType.TerrainEdit = 10</code> ke <code>protocol.ts</code>:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> TerrainEditMsg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  t</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> MsgType</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">TerrainEdit</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  cx</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  cz</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  brush</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    wx</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    wz</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    radius</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    strength</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    falloff</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">    operation</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p><code>WorldChunkDO</code> menyiarkannya kepada semua klien dan menambahkannya ke log edit per chunk yang disimpan dalam penyimpanan Durable Object. Klien yang bergabung belakangan menerima log edit dalam pesan <code>Snapshot</code> dan memutarnya kembali untuk merekonstruksi status medan. Semua klien menerapkan fungsi kuas deterministik yang sama, sehingga semuanya menghasilkan heightmap yang sama.</p>
<p><strong>Pelepasan/pemuatan ulang chunk:</strong> Spike 06 dan Spike 11 menetapkan pola streaming. Saat sebuah chunk dilepas lalu dimuat ulang, log edit untuk chunk tersebut harus diputar kembali pada heightmap prosedural dasar. Log edit disimpan di sisi server (Durable Object) dan disertakan dalam pesan Snapshot.</p>
<h3 id="fase-2-pemahatan-volumetrik-dengan-arsitektur-spike-22-24" tabindex="-1">Fase 2: Pemahatan Volumetrik dengan Arsitektur Spike 22-24 <a class="header-anchor" href="#fase-2-pemahatan-volumetrik-dengan-arsitektur-spike-22-24" aria-label="Permalink to &quot;Fase 2: Pemahatan Volumetrik dengan Arsitektur Spike 22-24&quot;"></a></h3>
<p>Port pipeline Spike 24 ke dunia produksi. Saat pemain memahat di bawah permukaan (membentuk gua atau menggali terowongan), chunk terdampak beralih dari mode heightmap ke mode MC.</p>
<p><strong>Migrasi renderer WebGPU:</strong> Spike 13-14 membuktikan bahwa <code>WebGPURenderer</code> milik Three.js dapat menjalankan komputasi kustom bersama scene graph. Dunia produksi beralih dari <code>WebGLRenderer</code> ke <code>WebGPURenderer</code> dengan <code>StorageBufferAttribute</code> untuk chunk MC. Gunakan jalur fallback khusus heightmap dari Fase 1 saat WebGPU tidak tersedia.</p>
<p><strong>Alokasi SDF per chunk:</strong> Ikuti pola hibrida Spike 22. Setiap chunk dimulai sebagai heightmap. Pada sapuan kuas volumetrik pertama, alokasikan Float32Array 64^3, inisialisasikan dengan mengambil sampel heightmap (nilai SDF pada setiap titik adalah <code>world.y - heightmap_value</code>), lalu beralih ke rendering MC. Sistem kebijakan dari Spike 23 memastikan chunk tetap berada dalam mode MC secara permanen (perilaku &quot;edit melekat&quot; dari edit mask).</p>
<p><strong>Heightmap bersama dalam shader SDF:</strong> Fungsi <code>height_at()</code> dari Spike 16. Unggah heightmap chunk ke buffer penyimpanan GPU. Shader komputasi SDF mengevaluasi <code>max(height_sdf, edit_sdf)</code>, dengan <code>height_sdf = world.y - height_at(world.xz)</code> dan <code>edit_sdf</code> berisi modifikasi kuas. Chunk MC dan heightmap menggunakan acuan permukaan yang sama pada batas-batasnya.</p>
<p><strong>Sambungan Transvoxel:</strong> Gunakan stack lengkap dari Spike 15-21. Batas MC-ke-heightmap menggunakan sel transisi dengan celah penyusutan. Batas MC-ke-MC pada resolusi berbeda menggunakan pola LOD ganda dari Spike 17. Kasus sudut dari Spike 19 menangani persimpangan empat arah. Komputasi GPU Spike 21 menghasilkan semua geometri sambungan dalam dispatch yang sama.</p>
<p><strong>Medan jauh clipmap:</strong> Gunakan cincin clipmap dari Spike 24 untuk medan di luar jangkauan pemahatan. Pemahatan tidak pernah memengaruhi cincin ini; cincin tersebut mengambil sampel heightmap prosedural dasar.</p>
<p><strong>Geomorphing:</strong> Geomorphing dari Spike 10 menghilangkan kemunculan mendadak pada transisi LOD. Untuk chunk yang diedit, target geomorph harus menyertakan edit tersebut. Jika sebuah chunk menggunakan MC pada LOD0 dan tetangga LOD1-nya menggunakan heightmap, geomorph memadukan kedua representasi tersebut. Hal ini memerlukan pengambilan sampel log edit bahkan pada LOD yang lebih rendah.</p>
<p><strong>Anggaran material:</strong> Spike 08 menguji 4 lapisan triplanar + normal pada 45+ FPS. Chunk MC memerlukan material yang sama. Splat map dapat dibuat dari gradien SDF (curam = batu, datar = rumput), bukan dari kemiringan heightmap. Pendekatan ini tetap berada dalam anggaran empat lapisan.</p>
<p><strong>Invalidasi vegetasi:</strong> Vegetasi berbasis density map dari Spike 07 bergantung pada ketinggian dan kemiringan medan. Saat sebuah chunk beralih ke mode MC, instance pohon harus dibuat ulang dengan mengambil sampel permukaan SDF. Pohon pada bagian menggantung atau di dalam gua harus disingkirkan. Matriks instanced mesh dari <code>chunk.ts</code> dibangun ulang berdasarkan permukaan baru.</p>
<h3 id="fase-3-pohon-edit-csg-untuk-urungkan-ulangi-dan-sinkronisasi-jaringan" tabindex="-1">Fase 3: Pohon Edit CSG untuk Urungkan/Ulangi dan Sinkronisasi Jaringan <a class="header-anchor" href="#fase-3-pohon-edit-csg-untuk-urungkan-ulangi-dan-sinkronisasi-jaringan" aria-label="Permalink to &quot;Fase 3: Pohon Edit CSG untuk Urungkan/Ulangi dan Sinkronisasi Jaringan&quot;"></a></h3>
<p>Ganti mutasi SDF mentah dengan pohon operasi CSG. Setiap sapuan kuas menambahkan bentuk primitif (bola, kapsul, kotak) beserta operasinya (tambah, kurangi, perpaduan halus). SDF dihitung ulang dari pohon tersebut.</p>
<p><strong>Manfaat:</strong></p>
<ul>
<li>Nondestruktif: edit apa pun dapat dihapus dari pohon untuk mengurungkannya</li>
<li>Efisien untuk jaringan: siarkan operasi CSG, bukan nilai field mentah</li>
<li>Deterministik: semua klien membangun SDF yang sama dari urutan operasi yang sama</li>
<li>Diff/patch pohon CSG milik ALICE-SDF menyediakan sinkronisasi serta urungkan/ulangi lintas jaringan yang hemat bandwidth</li>
</ul>
<p><strong>Penyimpanan Durable Object:</strong> Pohon edit per chunk menggantikan log edit datar dari Fase 1. <code>WorldChunkDO</code> menyimpan struktur pohon CSG, bukan delta heightmap mentah. Pesan <code>Snapshot</code> menyertakan pohon tersebut, dan klien yang bergabung belakangan mengevaluasinya untuk menghasilkan SDF lokal.</p>
<h3 id="fase-4-pemahatan-kolaboratif" tabindex="-1">Fase 4: Pemahatan Kolaboratif <a class="header-anchor" href="#fase-4-pemahatan-kolaboratif" aria-label="Permalink to &quot;Fase 4: Pemahatan Kolaboratif&quot;"></a></h3>
<p>Tambahkan dukungan edit serentak dengan pemutaran ulang operasi yang diurutkan server. Durable Object memberi timestamp pada setiap edit dan menyiarkannya secara berurutan. Klien yang bergabung belakangan menerima log operasi dan merekonstruksi status dunia. Tipe pesan <code>Snapshot</code> yang ada diperluas agar menyertakan riwayat edit medan per chunk.</p>
<p>Karena sapuan kuas berukuran kecil, terlokalisasi, serta bersifat aditif atau subtraktif, hasil visual dari edit serentak yang urutannya sedikit berbeda biasanya tidak dapat dibedakan dari urutan yang &quot;benar&quot;. Strategi last-write-wins dengan pengurutan server sudah memadai. Fungsi <code>tick()</code> milik Durable Object (saat ini berjalan setiap interval 50 ms untuk status pemain) menambahkan siaran edit medan ke loop yang sama.</p>
<h2 id="referensi-utama" tabindex="-1">Referensi Utama <a class="header-anchor" href="#referensi-utama" aria-label="Permalink to &quot;Referensi Utama&quot;"></a></h2>
<p><strong>Algoritma:</strong></p>
<ul>
<li>Lorensen &amp; Cline, &quot;Marching Cubes&quot; (1987)</li>
<li>Eric Lengyel, &quot;Transvoxel Algorithm&quot; (2009), transvoxel.org</li>
<li>Losasso &amp; Hoppe, &quot;Geometry Clipmaps&quot; (SIGGRAPH 2004)</li>
<li>&quot;A High-Performance SurfaceNets Discrete Isocontouring Algorithm&quot; (arxiv 2401.14906, 2024)</li>
<li>MCHex (arxiv 2511.02064, 2025)</li>
</ul>
<p><strong>Implementasi:</strong></p>
<ul>
<li>bevy-sculpter v0.18.0 (Rust, Surface Nets + kuas SDF)</li>
<li>fast-surface-nets (Rust, 20 juta segitiga/detik)</li>
<li>ALICE-SDF v1.3.0 (Rust + WASM, diff/patch pohon CSG)</li>
<li>Editor SDF WebGPU (Nijhoff, Januari 2026)</li>
<li>SculptingPro (API pemahatan runtime Unity)</li>
<li>TerraBrush (GDExtension pemahatan medan Godot)</li>
</ul>
<p><strong>Game:</strong></p>
<ul>
<li>Dreams (Media Molecule, SDF + rendering point cloud, SIGGRAPH 2015)</li>
<li>Teardown (Voxagon, ray tracing DDA voxel, penghancuran multipemain deterministik)</li>
<li>Engine SDF Mike Turitzin (brick map + geometry clipmap, Januari 2026)</li>
</ul>
<p><strong>Jaringan:</strong></p>
<ul>
<li>&quot;Optimizing payload size for voxel state synchronization&quot; (Oulu, 2024)</li>
<li>Multipemain Teardown (sinkronisasi penghancuran semideterministik, Maret 2026)</li>
<li>cSculpt (pemahatan mesh kolaboratif dengan penggabungan multiresolusi)</li>
</ul>
<BuildCta
  title="Lebih sedikit memahat, lebih cepat bermain"
  desc="Buat game berbasis medan tanpa menyentuh kuas."
  prompt="Buat game yang berlatar di ngarai pahatan tangan dengan sebuah sungai" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/terrain-sculpting-brushes.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Model Video AI Terbaik dengan Dukungan Gambar Referensi (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/long-reference-video-models</link>
            <guid>https://app.cinevva.com/id/guides/long-reference-video-models</guid>
            <pubDate>Sat, 28 Mar 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Model pembuatan video AI yang menghasilkan video panjang dan konsisten dari gambar referensi pada 2026 - generator berdurasi panjang native, alur kerja referensi-dan-perpanjang, serta opsi sumber terbuka yang dapat Anda hosting sendiri.]]></description>
            <content:encoded><![CDATA[<h1 id="model-video-ai-terbaik-dengan-dukungan-gambar-referensi-2026" tabindex="-1">Model Video AI Terbaik dengan Dukungan Gambar Referensi (2026) <a class="header-anchor" href="#model-video-ai-terbaik-dengan-dukungan-gambar-referensi-2026" aria-label="Permalink to &quot;Model Video AI Terbaik dengan Dukungan Gambar Referensi (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Membuat klip berdurasi 10 detik kini mudah. Semua model utama dapat melakukannya. Pertanyaan sebenarnya adalah: bisakah Anda membuat video koheren berdurasi 5 atau 10 menit, dengan karakter yang tetap terlihat sama pada menit pertama dan menit kedelapan? Dengan adegan yang tetap konsisten di sepanjang ratusan frame?</p>
<p>Itulah masalah yang sulit. Dan bidang ini sedang berubah dengan cepat. Panduan ini membahas setiap model yang kami temukan, baik yang dapat menghasilkan video panjang secara native maupun yang mendukung alur kerja untuk membuat konten berdurasi panjang dengan karakter konsisten melalui gambar referensi. Kami membaginya menjadi tiga tingkat: model yang secara langsung menghasilkan video berdurasi beberapa menit, model dengan dukungan gambar referensi yang kuat dan dapat diperpanjang melalui fitur kelanjutan, serta opsi sumber terbuka yang dapat Anda jalankan sendiri.</p>
<h2 id="tingkat-1-pembuatan-berdurasi-panjang-secara-native-beberapa-menit" tabindex="-1">Tingkat 1: Pembuatan Berdurasi Panjang secara Native (Beberapa Menit+) <a class="header-anchor" href="#tingkat-1-pembuatan-berdurasi-panjang-secara-native-beberapa-menit" aria-label="Permalink to &quot;Tingkat 1: Pembuatan Berdurasi Panjang secara Native (Beberapa Menit+)&quot;"></a></h2>
<p>Model-model ini menghasilkan video yang durasinya dihitung dalam menit, bukan detik. Model tersebut sejak awal dirancang untuk menjaga konsistensi temporal di sepanjang rangkaian panjang.</p>
<h3 id="longcat-video" tabindex="-1">LongCat Video <a class="header-anchor" href="#longcat-video" aria-label="Permalink to &quot;LongCat Video&quot;"></a></h3>
<p>Meituan merilis LongCat Video pada akhir 2025. Model ini merupakan diffusion transformer dengan 13,6 miliar parameter dan menjadi model pertama yang dapat menghasilkan video koheren berdurasi hingga 15 menit secara andal.</p>
<p>Model ini mendukung teks-ke-video, gambar-ke-video, dan kelanjutan video dalam satu pipeline terpadu. Dalam mode I2V, gambar input menjadi frame pertama video secara harfiah. Gambar tersebut bukan referensi karakter fleksibel yang bisa Anda tempatkan di sembarang adegan. Model menganimasikan video ke depan dari frame awal tersebut sambil menggunakan &quot;Cross-Chunk Latent Stitching&quot; untuk terus merujuk gambar asli selama proses pembuatan, sehingga mencegah pergeseran warna dan mempertahankan konsistensi visual di sepanjang rangkaian panjang. Varian terbaru pada 2026 menambahkan pembuatan avatar berbasis audio dengan sinkronisasi bibir untuk video kepala berbicara berdurasi lebih dari 5 menit.</p>
<p>Di balik layar, LongCat menggunakan pendekatan pembuatan dari kasar ke halus dengan Block Sparse Attention untuk menangani panjang rangkaian yang sangat besar. Penyetelan RLHF meningkatkan kualitas gerakan. Pada tolok ukur VBench 2.0, model ini menempati peringkat ketiga secara keseluruhan, di belakang Google Veo 3 dan Vidu Q1 dari Shengshu.</p>
<p><strong>Ketersediaan:</strong> Sumber terbuka dengan lisensi MIT. Tersedia melalui API fal.ai seharga $0.04 per detik video yang dihasilkan ($36 untuk video 15 menit pada 720p). Juga tersedia melalui platform LongCat sendiri dengan harga berbasis kredit.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi maksimum</td>
<td>~15 menit</td>
</tr>
<tr>
<td>Resolusi</td>
<td>720p pada 30fps</td>
</tr>
<tr>
<td>Parameter</td>
<td>13.6B</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Hanya frame pertama (mode I2V, bukan referensi karakter)</td>
</tr>
<tr>
<td>Lisensi</td>
<td>MIT</td>
</tr>
<tr>
<td>Biaya API</td>
<td>~$0.04/detik (fal.ai)</td>
</tr>
</tbody>
</table>
<h3 id="seaweed-apt2" tabindex="-1">Seaweed APT2 <a class="header-anchor" href="#seaweed-apt2" aria-label="Permalink to &quot;Seaweed APT2&quot;"></a></h3>
<p>Seaweed APT2 dari ByteDance menggunakan pendekatan yang berbeda. Alih-alih membuat video lengkap di awal, model ini menghasilkan frame secara autoregresif pada 24fps dengan latensi hanya 0,16 detik per frame pada satu H100. Hasilnya adalah video stabil berdurasi hingga 5 menit dengan konsistensi temporal yang tetap terjaga.</p>
<p>Trik teknisnya adalah Autoregressive Adversarial Post-Training (AAPT), yang mengubah model difusi video dua arah pralatih menjadi generator autoregresif satu arah. Hanya diperlukan satu evaluasi forward jaringan per frame. Inilah yang memungkinkan pembuatan secara real-time.</p>
<p>Selain durasinya, hal yang membuat model ini menarik adalah interaktivitasnya. Anda dapat mengontrol kamera, menganimasikan karakter melalui deteksi pose, dan memanipulasi adegan saat video dirender. Anggap pendekatannya bukan sekadar &quot;membuat video&quot;, melainkan &quot;mengarahkan video secara real-time.&quot;</p>
<p><strong>Ketersediaan:</strong> Masih dalam tahap riset. Belum tersedia untuk publik. Model dasar 7B (Seaweed-7B) telah memiliki makalah yang dipublikasikan, tetapi bobot APT2 belum dirilis.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi maksimum</td>
<td>~5 menit</td>
</tr>
<tr>
<td>Resolusi</td>
<td>736x416 (satu GPU), hingga 720p (8 GPU)</td>
</tr>
<tr>
<td>Parameter</td>
<td>8B</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Melalui I2V dan kontrol pose interaktif</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Belum dirilis</td>
</tr>
<tr>
<td>Status</td>
<td>Pratinjau riset</td>
</tr>
</tbody>
</table>
<h3 id="helios" tabindex="-1">Helios <a class="header-anchor" href="#helios" aria-label="Permalink to &quot;Helios&quot;"></a></h3>
<p>Helios berasal dari Peking University dan dibangun di atas Wan 2.1. Model dengan 14B parameter ini menghasilkan video berdurasi beberapa menit pada 19,5 FPS menggunakan satu H100. Inovasi utamanya terletak pada cara model menangani drift pada video panjang. Alih-alih menggunakan teknik anti-drift konvensional seperti self-forcing atau pengambilan sampel keyframe, Helios menyimulasikan drift selama pelatihan agar model mempelajari cara memperbaikinya.</p>
<p>Model ini secara native mendukung tugas teks-ke-video, gambar-ke-video, dan video-ke-video. Mode I2V menerima gambar referensi sebagai titik awal pembuatan.</p>
<p><strong>Ketersediaan:</strong> Sepenuhnya sumber terbuka dengan lisensi Apache 2.0. Dirilis pada Maret 2026. Kode dan bobot tersedia di GitHub (PKU-YuanGroup/Helios). Terintegrasi dengan Diffusers, SGLang, dan vLLM-Omni. Demo Gradio tersedia di HuggingFace Spaces.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi maksimum</td>
<td>Skala menit (tanpa batas tetap)</td>
</tr>
<tr>
<td>Resolusi</td>
<td>720p</td>
</tr>
<tr>
<td>Parameter</td>
<td>14B</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Ya (mode I2V)</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Apache 2.0</td>
</tr>
<tr>
<td>Perangkat keras</td>
<td>Satu H100 untuk pemrosesan real-time</td>
</tr>
</tbody>
</table>
<h3 id="skyreels-v2-v3" tabindex="-1">SkyReels V2 / V3 <a class="header-anchor" href="#skyreels-v2-v3" aria-label="Permalink to &quot;SkyReels V2 / V3&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/NJcRyQu30yM" title="SkyReels AI: Pembuatan Video Berdurasi Tak Terbatas" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">SkyReels V3 menerima 1-4 gambar referensi dan menghasilkan video berdurasi tak terbatas dengan pergantian beberapa shot serta sintesis avatar yang dipandu audio.</div>
<p>Lini SkyReels dari Skywork menargetkan video berdurasi tak terbatas. V2 menggunakan arsitektur AutoRegressive Diffusion-Forcing yang menghasilkan video tanpa batas durasi tetap. V3, yang dirilis pada Januari 2026, menyatukan gambar referensi-ke-video, perpanjangan video-ke-video, dan pembuatan avatar yang dipandu audio dalam satu model.</p>
<p>V3 menerima 1 hingga 4 gambar referensi dan mempertahankan identitas subjek di sepanjang video yang dihasilkan. Mode video-ke-video memungkinkan kelanjutan satu shot yang mulus dan pergantian beberapa shot dengan transisi sinematik.</p>
<p>Skywork merilis SkyReels V4 pada 25 Februari 2026, model sumber terbuka pertama yang menghasilkan video dan audio secara bersamaan dalam satu proses dual-stream hingga 1080p/32fps. Model ini menerima teks, gambar, klip video, mask, dan audio sebagai input pengondisian serta menyatukan pembuatan, inpainting, dan pengeditan dalam satu framework, sehingga memperluas lini referensi-dan-perpanjang V2/V3 dengan suara native. Kini model tersebut berada di dekat posisi teratas arena teks-ke-video Artificial Analysis.</p>
<p><strong>Ketersediaan:</strong> Sepenuhnya sumber terbuka. Model tersedia dari 1.3B hingga 14B parameter. Tersedia pada 540p dan 720p. Kode dan bobot tersedia di GitHub dan HuggingFace.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi maksimum</td>
<td>Tak terbatas (autoregresif)</td>
</tr>
<tr>
<td>Resolusi</td>
<td>540p, 720p</td>
</tr>
<tr>
<td>Parameter</td>
<td>1.3B, 5B, 14B</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>1-4 gambar (V3)</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Sumber terbuka</td>
</tr>
<tr>
<td>Perangkat keras</td>
<td>Minimum RTX 4090, disarankan 4-8x A100</td>
</tr>
</tbody>
</table>
<h2 id="tingkat-2-klip-pendek-dengan-dukungan-referensi-perpanjangan-yang-kuat" tabindex="-1">Tingkat 2: Klip Pendek dengan Dukungan Referensi + Perpanjangan yang Kuat <a class="header-anchor" href="#tingkat-2-klip-pendek-dengan-dukungan-referensi-perpanjangan-yang-kuat" aria-label="Permalink to &quot;Tingkat 2: Klip Pendek dengan Dukungan Referensi + Perpanjangan yang Kuat&quot;"></a></h2>
<p>Model-model ini menghasilkan klip berdurasi 8-60 detik, tetapi menawarkan dukungan gambar referensi dan fitur perpanjangan video yang kuat. Untuk konten berdurasi panjang, Anda merangkai klip menggunakan endpoint kelanjutan atau perpanjangan dari model. Konsistensi karakter berasal dari gambar referensi yang terus dipertahankan di antara proses pembuatan.</p>
<p>Inilah alur kerja praktis yang saat ini digunakan sebagian besar kreator untuk konten berdurasi lebih dari satu menit. Kualitas tiap klipnya sering kali lebih tinggi daripada model berdurasi panjang native.</p>
<h3 id="kling-3-0-omni-kuaishou" tabindex="-1">Kling 3.0 Omni (Kuaishou) <a class="header-anchor" href="#kling-3-0-omni-kuaishou" aria-label="Permalink to &quot;Kling 3.0 Omni (Kuaishou)&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/gn3YTrStUn8" title="Memperkenalkan Kling 3.0: Pembuatan Video AI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Kling 3.0 Omni menggabungkan elemen karakter, referensi gaya, dan storyboard beberapa shot dalam satu panggilan dengan output 4K 60fps native.</div>
<p>Kling memiliki sistem gambar referensi paling lengkap dibandingkan model video lainnya. Model ini memisahkan input referensi menjadi tiga kategori berbeda, yang masing-masing memiliki fungsi tersendiri:</p>
<p><strong>Gambar Referensi</strong> (<code>image_urls</code>): Hingga 4 gambar untuk panduan gaya dan tampilan. Anda menandainya dalam prompt sebagai <code>@Image1</code>, <code>@Image2</code>, dan seterusnya. Gambar-gambar ini memengaruhi tampilan keseluruhan, gaya adegan, dan lingkungan tanpa menjadi frame pertama.</p>
<p><strong>Elemen</strong> (<code>elements</code>): Input khusus untuk karakter/objek. Setiap elemen menerima <code>frontal_image_url</code> (foto tampak depan yang jelas) ditambah <code>reference_image_urls</code> opsional (sudut tambahan). Anda merujuknya sebagai <code>@Element1</code>, <code>@Element2</code> dalam prompt. Model mengekstrak identitas karakter dan menempatkannya dalam adegan apa pun yang Anda deskripsikan. Inilah fitur utama untuk konten bergaya film petualangan: unggah foto karakter, lalu deskripsikan mereka berjalan melewati hutan, melawan naga, atau melakukan apa pun yang Anda inginkan.</p>
<p><strong>Frame Awal/Akhir</strong> (<code>start_image_url</code>, <code>end_image_url</code>): Menetapkan gambar tertentu sebagai frame pertama atau terakhir. Gambar ini merupakan frame literal, bukan panduan gaya.</p>
<p>Jumlah total di ketiga kategori tersebut mencapai 7 input referensi (turun menjadi 4 jika juga menggunakan video referensi). Satu prompt seperti <code>&quot;@Element1 dan @Element2 sedang makan malam di meja pada @Image1&quot;</code> dapat menggabungkan karakter dengan referensi adegan.</p>
<p>Untuk konten berdurasi panjang, Kling menawarkan dua jalur. Mode beberapa shot menghasilkan hingga 6 adegan dalam satu panggilan, masing-masing dengan prompt dan durasinya sendiri (masing-masing 3-15 detik). Elemen karakter secara otomatis tetap konsisten di semua shot. API perpanjangan melanjutkan dari titik berakhirnya video yang telah selesai, hingga mencapai sekitar 3 menit melalui perpanjangan berantai. Mode pengeditan V2V menerima video yang sudah ada (3-10 detik) dan mengubahnya menggunakan referensi elemen serta prompt teks, sambil mempertahankan gerakan kamera dan penataan karakter dari sumber serta mengubah gaya karakter dan lingkungan berdasarkan referensi Anda. Hal ini membuat Kling sangat berguna untuk menyempurnakan rekaman yang sudah ada, termasuk render 3D berfidelitas rendah.</p>
<p>Kling 3.0 Omni menyatukan teks-ke-video, gambar-ke-video, referensi-ke-video, dan pengeditan video dalam satu model dengan pembuatan audio native serta sinkronisasi bibir. Pada 17 Juni 2026, Kuaishou menambahkan Kling 3.0 Turbo, varian yang lebih cepat dan murah dengan audio yang sudah disertakan pada 720p dan 1080p (harga resmi sekitar $0.11-0.14/detik), serta meningkatkan pipeline pengeditan Omni agar dapat menerima dan menghasilkan video 4K.</p>
<p><strong>Ketersediaan:</strong> API komersial melalui Kuaishou, fal.ai ($0.084-0.112/detik), dan Replicate. Antarmuka web tersedia di klingai.com.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>3-15 detik</td>
</tr>
<tr>
<td>Durasi setelah diperpanjang</td>
<td>~3 menit (melalui perpanjangan berantai)</td>
</tr>
<tr>
<td>Resolusi</td>
<td>720p, 1080p (4K dalam pengeditan Omni)</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Hingga 4 (referensi gaya <code>@Image</code>)</td>
</tr>
<tr>
<td>Elemen</td>
<td>Hingga 4 (referensi karakter <code>@Element</code> dengan tampak depan + sudut lainnya)</td>
</tr>
<tr>
<td>Total referensi</td>
<td>Hingga 7 gabungan (4 dengan referensi video)</td>
</tr>
<tr>
<td>Beberapa shot</td>
<td>Ya (hingga 6 shot dalam storyboard)</td>
</tr>
<tr>
<td>Audio</td>
<td>Audio tersinkronisasi native + sinkronisasi bibir</td>
</tr>
<tr>
<td>Pengeditan video</td>
<td>Ya (pengeditan video yang sudah ada dengan panduan teks)</td>
</tr>
<tr>
<td>API</td>
<td>Kuaishou, fal.ai, Replicate</td>
</tr>
</tbody>
</table>
<h3 id="grok-imagine-xai" tabindex="-1">Grok Imagine (xAI) <a class="header-anchor" href="#grok-imagine-xai" aria-label="Permalink to &quot;Grok Imagine (xAI)&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/DMXA0qGf-1s" title="Grok Imagine: Demo Perpanjangan Video dan Referensi" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Grok Imagine memisahkan mode referensi dari mode frame pertama, sehingga Anda dapat menandai hingga 7 gambar sebagai referensi karakter atau objek dalam prompt.</div>
<p>xAI meluncurkan mode Referensi-ke-Video Grok Imagine pada awal 2026 dengan dukungan untuk 1-7 gambar referensi. Dokumentasinya secara eksplisit membedakan mode ini dari gambar-ke-video: &quot;Tidak seperti gambar-ke-video, yang menjadikan gambar sumber sebagai frame awal, gambar referensi memengaruhi apa yang muncul dalam video tanpa mengunci frame pertama.&quot;</p>
<p>Anda menandai gambar dalam prompt sebagai <code>&lt;IMAGE_1&gt;</code>, <code>&lt;IMAGE_2&gt;</code>, dan seterusnya. Prompt seperti <code>&quot;model dari &lt;IMAGE_1&gt; berjalan ke atas panggung peragaan busana dengan mengenakan kemeja dari &lt;IMAGE_2&gt;&quot;</code> menggabungkan referensi orang dengan referensi pakaian. Model ini dapat menangani percobaan pakaian virtual, penempatan produk, dan penceritaan dengan karakter yang konsisten di berbagai adegan.</p>
<p>Satu batasannya: Anda tidak dapat menggabungkan gambar referensi dengan gambar-ke-video dalam permintaan yang sama. Anda harus memilih mode frame pertama atau mode referensi, bukan keduanya.</p>
<p>Grok Imagine juga memiliki endpoint perpanjangan video yang menambahkan rekaman baru ke bagian akhir video yang sudah ada. Parameter <code>duration</code> hanya mengontrol bagian baru. Anda dapat merangkai beberapa perpanjangan untuk membuat konten yang lebih panjang.</p>
<p>xAI merilis Grok Imagine 1.5 sebagai pratinjau API pada 3 Juni 2026, lalu menjadikannya tersedia secara umum sebagai <code>grok-imagine-video-1.5</code> pada 16 Juni, dengan varian Fast yang diluncurkan secara bertahap ke aplikasi konsumen. Ini merupakan model gambar-ke-video yang menganimasikan satu gambar diam menjadi gerakan sinematik dengan pergerakan kamera, atmosfer, fisika, dan audio tersinkronisasi yang dihasilkan secara native dalam proses inferensi yang sama. Model ini mendukung pengurutan beberapa shot untuk merangkai adegan yang konsisten, menghasilkan klip 720p berdurasi 6 detik dalam waktu sekitar 25 detik, dan saat ini menempati posisi ketiga dalam arena gambar-ke-video Artificial Analysis. Harganya $0.08/detik pada 480p dan $0.14/detik pada 720p, ditambah $0.01 per gambar input.</p>
<p><strong>Ketersediaan:</strong> API xAI (diluncurkan Januari 2026), fal.ai, dan Replicate. SDK Python, JavaScript/AI SDK, dan REST API. $0.05/detik pada 720p dengan audio. Juga tersedia bagi pelanggan X Premium.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>1-15 detik</td>
</tr>
<tr>
<td>Durasi yang diperpanjang</td>
<td>Dapat dirangkai melalui API ekstensi</td>
</tr>
<tr>
<td>Resolusi</td>
<td>480p, 720p</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>1-7 (referensi sebenarnya, bukan frame pertama)</td>
</tr>
<tr>
<td>Tag prompt</td>
<td><code>&lt;IMAGE_1&gt;</code>, <code>&lt;IMAGE_2&gt;</code>, dan seterusnya</td>
</tr>
<tr>
<td>Audio</td>
<td>Ya (720p)</td>
</tr>
<tr>
<td>Penyuntingan video</td>
<td>Ya (dipandu teks)</td>
</tr>
<tr>
<td>API</td>
<td>xAI API, fal.ai, Replicate</td>
</tr>
<tr>
<td>Biaya API</td>
<td>$0,05/detik (720p dengan audio)</td>
</tr>
</tbody>
</table>
<h3 id="seedance-2-0-bytedance" tabindex="-1">Seedance 2.0 (ByteDance) <a class="header-anchor" href="#seedance-2-0-bytedance" aria-label="Permalink to &quot;Seedance 2.0 (ByteDance)&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/W_lxyDFDZt4" title="Seedance 2.0: Generator Video AI Terbaik yang Baru" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="video-caption">Seedance 2.0 menerima hingga 12 input multimodal secara bersamaan dan menghasilkan video dengan sinkronisasi audio native serta sinkronisasi bibir tingkat fonem dalam lebih dari 8 bahasa.</div>
<p>Seedance 2.0 dari ByteDance menerima input referensi terbanyak dibandingkan model lainnya: hingga 12 file secara bersamaan, termasuk maksimal 9 gambar, 3 video, dan 3 file audio. Model ini mendukung pembuatan audio-video native dengan sinkronisasi bibir tingkat fonem dalam lebih dari 8 bahasa.</p>
<p>Setiap gambar dapat berukuran hingga 30 MB. Video referensi harus berdurasi 2-15 detik. Model ini menggunakan referensi untuk tampilan karakter, gaya adegan, dan panduan gerakan.</p>
<p>Lompatan berikutnya sudah dijadwalkan. ByteDance mengumumkan Seedance 2.5 pada konferensi Volcano Engine FORCE tanggal 23 Juni 2026: satu klip native berdurasi 30 detik dalam satu proses dan hingga 50 file referensi multimodal, meningkat dari 12. Model ini pertama-tama diluncurkan melalui Dreamina dan Jimeng, lalu API-nya dibuka di BytePlus pada 16 Juli 2026. Jika dirilis sesuai demonya, model ini akan menghilangkan banyak kebutuhan penyambungan klip yang dijelaskan dalam panduan ini.</p>
<p><strong>Ketersediaan:</strong> API resmi ByteDance (melalui Volcengine, diluncurkan Februari 2026) dan penyedia API pihak ketiga. Output 480p-720p melalui API, hingga resolusi sinema 2K melalui platform.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>4-15 detik</td>
</tr>
<tr>
<td>Resolusi</td>
<td>Hingga 2K (sinema)</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Hingga 9 gambar + 3 video + 3 audio (total 12)</td>
</tr>
<tr>
<td>Audio</td>
<td>Native dengan sinkronisasi bibir (lebih dari 8 bahasa)</td>
</tr>
<tr>
<td>API</td>
<td>ByteDance/Volcengine, penyedia pihak ketiga</td>
</tr>
</tbody>
</table>
<h3 id="runway-gen-4-5" tabindex="-1">Runway Gen-4.5 <a class="header-anchor" href="#runway-gen-4-5" aria-label="Permalink to &quot;Runway Gen-4.5&quot;"></a></h3>
<p>Runway Gen-4.5 diluncurkan di posisi teratas papan peringkat Text-to-Video Artificial Analysis dengan 1.247 ELO, mengungguli Veo 3 dan Sora 2 Pro pada saat itu. Pada pertengahan 2026, susunan arena telah berubah (Gemini Omni Flash kini memimpin), tetapi Gen-4.5 tetap menjadi model kelas atas untuk kualitas sinematik dan aksi yang dapat dikendalikan. Model ini menghasilkan klip berdurasi 2-10 detik untuk teks-ke-video dan mendukung video berdurasi panjang dengan karakter yang konsisten hingga satu menit melalui pengurutan beberapa pengambilan gambar.</p>
<p>Gambar-ke-video ditambahkan pada Januari 2026 dan mendukung gambar referensi untuk semua rasio aspek. Model ini mengintegrasikan neural radiance fields dan Gaussian splatting dalam arsitektur difusi, sehingga memiliki pemahaman geometris 3D, bukan sekadar prediksi tingkat piksel. Hasilnya adalah persistensi objek yang lebih baik dan gerakan yang masuk akal secara fisik.</p>
<p><strong>Ketersediaan:</strong> API komersial dan antarmuka web. SDK untuk Node dan Python. Juga tersedia di Replicate.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>2-10 detik</td>
</tr>
<tr>
<td>Mode durasi panjang</td>
<td>Hingga sekitar 1 menit</td>
</tr>
<tr>
<td>Resolusi</td>
<td>Hingga 1080p</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>0-1 per pembuatan</td>
</tr>
<tr>
<td>Audio</td>
<td>Pembuatan audio native</td>
</tr>
<tr>
<td>Beberapa pengambilan gambar</td>
<td>Ya</td>
</tr>
<tr>
<td>API</td>
<td>Ya (Runway, Replicate)</td>
</tr>
</tbody>
</table>
<h3 id="google-veo-3-1" tabindex="-1">Google Veo 3.1 <a class="header-anchor" href="#google-veo-3-1" aria-label="Permalink to &quot;Google Veo 3.1&quot;"></a></h3>
<p>Veo 3.1 dari Google secara native menghasilkan klip berdurasi 4, 6, atau 8 detik. Fitur &quot;Perpanjang Video&quot; (saat ini dalam pratinjau) merangkai klip hingga mencapai sekitar 1-2,5 menit, meskipun koherensinya dapat menyimpang pada rangkaian yang lebih panjang.</p>
<p>Fitur &quot;Bahan menjadi Video&quot; menerima hingga 3 gambar referensi sebagai input. Anda dapat menyediakan karakter untuk dianimasikan, latar belakang, dan tekstur material. Saat menggunakan gambar referensi, model ini lebih mengikuti referensi visual Anda dan membuat lebih sedikit perubahan acak. Salah satu keterbatasannya: mode gambar referensi hanya berfungsi dengan opsi durasi 8 detik.</p>
<p>Per Januari 2026, Veo 3.1 menambahkan video vertikal (9:16) untuk pembuatan berbasis referensi dan peningkatan resolusi ke 4K di Vertex AI.</p>
<p><strong>Ketersediaan:</strong> Google Vertex AI API, Gemini API, dan Google Flow. Memerlukan akun Google Cloud.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>4, 6, atau 8 detik</td>
</tr>
<tr>
<td>Durasi yang diperpanjang</td>
<td>Sekitar 1-2,5 menit</td>
</tr>
<tr>
<td>Resolusi</td>
<td>Hingga 4K (dengan peningkatan resolusi)</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Hingga 3 (&quot;Bahan menjadi Video&quot;)</td>
</tr>
<tr>
<td>Audio</td>
<td>Dialog dan musik tersinkronisasi</td>
</tr>
<tr>
<td>API</td>
<td>Vertex AI, Gemini API</td>
</tr>
</tbody>
</table>
<h3 id="google-gemini-omni-flash" tabindex="-1">Google Gemini Omni Flash <a class="header-anchor" href="#google-gemini-omni-flash" aria-label="Permalink to &quot;Google Gemini Omni Flash&quot;"></a></h3>
<p>Google mengumumkan keluarga Gemini Omni di I/O pada Mei 2026 dan merilis Gemini Omni Flash sebagai model pertamanya. Model ini dengan cepat menempati posisi teratas di arena Artificial Analysis, mengungguli Veo 3.1. Gagasan utamanya adalah video percakapan: Anda menghasilkan klip berdurasi 10 detik dari teks, gambar, atau video, lalu menyuntingnya melalui instruksi lanjutan yang saling melanjutkan. Ubah pencahayaan, ganti pakaian, sesuaikan kamera—semuanya tanpa membuat ulang dari awal.</p>
<p>Untuk dukungan referensi, Omni Flash menerima gambar dan klip video pendek sebagai referensi gaya, gerakan, dan efek, sementara dukungan referensi audio direncanakan. Konsistensi karakter tetap terjaga di sepanjang penyuntingan percakapan, meskipun dokumentasi Google sendiri mencatat bahwa konsistensi dapat terganggu saat pergantian adegan dan pergerakan kamera. Karena itu, tinjau output yang banyak menampilkan karakter sebelum Anda merilisnya.</p>
<p><strong>Ketersediaan:</strong> API (<code>gemini-omni-flash-preview</code>) dibuka sebagai pratinjau publik pada 30 Juni 2026 melalui Google AI Studio dan Gemini API dengan biaya sekitar $0,10 per detik output. Setiap klip memiliki tanda air SynthID. Akses konsumen tersedia melalui aplikasi Gemini, Google Flow, dan YouTube Shorts.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>10 detik (durasi yang lebih panjang direncanakan)</td>
</tr>
<tr>
<td>Resolusi</td>
<td>720p</td>
</tr>
<tr>
<td>Input referensi</td>
<td>Gambar + klip video pendek (audio direncanakan)</td>
</tr>
<tr>
<td>Penyuntingan</td>
<td>Percakapan, iteratif</td>
</tr>
<tr>
<td>Audio</td>
<td>Native</td>
</tr>
<tr>
<td>API</td>
<td>Gemini API (pratinjau publik), sekitar $0,10/detik</td>
</tr>
</tbody>
</table>
<h3 id="openai-sora-2-sora-2-pro" tabindex="-1">OpenAI Sora 2 / Sora 2 Pro <a class="header-anchor" href="#openai-sora-2-sora-2-pro" aria-label="Permalink to &quot;OpenAI Sora 2 / Sora 2 Pro&quot;"></a></h3>
<blockquote>
<p><strong>Sedang dihentikan (2026):</strong> OpenAI sedang menghentikan Sora. Aplikasi Sora untuk konsumen ditutup pada 26 April 2026, dan Sora 2 API akan dihentikan pada 24 September 2026 tanpa penerus yang diumumkan. Kemampuan di bawah ini masih patut diperhatikan, tetapi jangan membangun pipeline baru dengan Sora. Gunakan Kling, Grok Imagine, atau model terbuka sebagai gantinya.</p>
</blockquote>
<p>Sora 2 Pro menghasilkan klip hingga 20 detik. Characters API menggunakan pendekatan yang berbeda dari Kling atau Grok: alih-alih mengunggah gambar statis, Anda membuat <code>character_id</code> dengan mengarahkan API ke sebuah klip video (dengan rentang stempel waktu 1-3 detik). Sora menganalisis frame video untuk mengekstrak struktur wajah, proporsi tubuh, gaya pakaian, dan ciri pengenal lainnya. <code>character_id</code> tersebut tersimpan tanpa batas waktu dan dapat digunakan kembali untuk pembuatan berikutnya tanpa batas.</p>
<p>Anda dapat mereferensikan hingga 2 karakter yang diunggah per pembuatan. Sejak Maret 2026, referensi karakter juga berfungsi untuk objek dan hewan, bukan hanya manusia. Ekstensi video menggunakan seluruh klip awal sebagai konteks untuk kelanjutannya.</p>
<p>Sistem karakter memerlukan input video (bukan gambar statis) untuk membuat karakter. Jika Anda hanya memiliki foto, Anda perlu membuat video pendek terlebih dahulu, lalu mengekstrak karakter dari video tersebut.</p>
<p><strong>Ketersediaan:</strong> OpenAI API dengan dukungan Batch API untuk alur kerja produksi.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>Hingga 20 detik</td>
</tr>
<tr>
<td>Resolusi</td>
<td>Hingga 1920x1080</td>
</tr>
<tr>
<td>Referensi karakter</td>
<td>Hingga 2 per pembuatan (<code>character_id</code> persisten)</td>
</tr>
<tr>
<td>Input karakter</td>
<td>Klip video (rentang stempel waktu 1-3 detik), bukan gambar statis</td>
</tr>
<tr>
<td>Audio</td>
<td>Tersinkronisasi</td>
</tr>
<tr>
<td>Ekstensi</td>
<td>Ya (seluruh klip sebagai konteks)</td>
</tr>
<tr>
<td>API</td>
<td>OpenAI API + Batch API</td>
</tr>
</tbody>
</table>
<h3 id="minimax-hailuo-02" tabindex="-1">MiniMax Hailuo 02 <a class="header-anchor" href="#minimax-hailuo-02" aria-label="Permalink to &quot;MiniMax Hailuo 02&quot;"></a></h3>
<p>Hailuo 02 menempati peringkat ke-2 secara global pada tolok ukur Artificial Analysis saat diluncurkan, mengungguli Veo 3. Model ini menghasilkan klip 10 detik dalam 1080p native dengan salah satu simulasi fisika terbaik di bidang ini. Model ini mampu menangani gerakan ekstrem seperti gimnastik dan akrobatik tanpa membuat bentuk objek berantakan.</p>
<p>Model ini mendukung pembuatan gambar-ke-video dengan konsistensi karakter yang kuat melalui pengenalan wajah dan pelacakan tubuh. Arsitektur Noise-aware Compute Redistribution secara dinamis mengalokasikan komputasi berdasarkan kompleksitas adegan.</p>
<p>MiniMax sejak itu telah melampaui Hailuo 02 dengan keluarga Hailuo 2.3 (Standard, Pro, Fast, Fast Pro), yang meningkatkan aksi fisik, stilisasi, dan ekspresi mikro karakter. Model ini menghasilkan 1080p berdurasi 6 detik atau 768p berdurasi 10 detik dan tersedia melalui platform MiniMax serta fal.ai.</p>
<p><strong>Ketersediaan:</strong> API komersial. Tersedia melalui platform MiniMax, fal.ai, dan Replicate. $0,28 per video.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>Hingga 10 detik</td>
</tr>
<tr>
<td>Resolusi</td>
<td>1080p native</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Ya (mode I2V)</td>
</tr>
<tr>
<td>Audio</td>
<td>Tidak native</td>
</tr>
<tr>
<td>Fisika</td>
<td>Simulasi terbaik di kelasnya</td>
</tr>
<tr>
<td>API</td>
<td>MiniMax, fal.ai, Replicate</td>
</tr>
</tbody>
</table>
<h3 id="luma-ray3-2" tabindex="-1">Luma Ray3.2 <a class="header-anchor" href="#luma-ray3-2" aria-label="Permalink to &quot;Luma Ray3.2&quot;"></a></h3>
<p>Ray2 dari Luma telah digantikan oleh keluarga Ray3. Ray3 (September 2025) menambahkan Character Reference untuk mengunci identitas dan mode Modify video-ke-video, sedangkan Ray3.2 (9 Juni 2026) menambahkan kontrol tingkat frame dengan hingga 16 keyframe per klip, fitur Reframe, dan klip hingga 20 detik, sekaligus menghadirkan API publik pertama untuk lini Ray3. Output-nya adalah 1080p native, dengan 4K tersedia melalui peningkatan resolusi Hi-Fi. Gambar-ke-video menerima gambar referensi sebagai keyframe awal atau akhir.</p>
<p><strong>Ketersediaan:</strong> Luma API dan antarmuka web.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>Hingga 20 detik (Ray3.2)</td>
</tr>
<tr>
<td>Jenis referensi</td>
<td>Keyframe awal/akhir + Character Reference (identitas)</td>
</tr>
<tr>
<td>Resolusi</td>
<td>1080p native, 4K melalui peningkatan resolusi</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Ya (keyframe + referensi karakter)</td>
</tr>
<tr>
<td>API</td>
<td>Luma API</td>
</tr>
</tbody>
</table>
<h3 id="pika-2-5" tabindex="-1">Pika 2.5 <a class="header-anchor" href="#pika-2-5" aria-label="Permalink to &quot;Pika 2.5&quot;"></a></h3>
<p>Pika menggunakan pendekatan berbasis keyframe dengan Pikaframes. Unggah 2-5 keyframe (gambar referensi pada momen penting), lalu model akan menghasilkan transisi yang mulus di antaranya. Durasi totalnya mencapai 20-25 detik.</p>
<p>Pikascenes menerima hingga 10 gambar referensi dan menggabungkannya menjadi satu video. Model ini menggunakan pengenalan gambar untuk menentukan secara otomatis peran setiap referensi (karakter, latar belakang, properti).</p>
<p><strong>Ketersediaan:</strong> Platform web dan API Pika. Paket langganan mulai dari Gratis hingga Pro.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Durasi klip native</td>
<td>5-10 detik</td>
</tr>
<tr>
<td>Durasi Pikaframes</td>
<td>20-25 detik</td>
</tr>
<tr>
<td>Resolusi</td>
<td>Hingga 1080p</td>
</tr>
<tr>
<td>Gambar referensi</td>
<td>Hingga 10 (Pikascenes), 2-5 keyframe (Pikaframes)</td>
</tr>
<tr>
<td>API</td>
<td>Ya</td>
</tr>
</tbody>
</table>
<h2 id="tingkat-3-model-sumber-terbuka-untuk-alur-kerja-yang-dihoskan-sendiri" tabindex="-1">Tingkat 3: Model Sumber Terbuka untuk Alur Kerja yang Dihoskan Sendiri <a class="header-anchor" href="#tingkat-3-model-sumber-terbuka-untuk-alur-kerja-yang-dihoskan-sendiri" aria-label="Permalink to &quot;Tingkat 3: Model Sumber Terbuka untuk Alur Kerja yang Dihoskan Sendiri&quot;"></a></h2>
<p>Model-model ini menghasilkan klip yang lebih pendek, tetapi sepenuhnya terbuka. Anda dapat menjalankannya di perangkat keras sendiri, melakukan fine-tuning, dan membangun pipeline ekstensi khusus tanpa bergantung pada API.</p>
<h3 id="wan-2-1-alibaba" tabindex="-1">Wan 2.1 (Alibaba) <a class="header-anchor" href="#wan-2-1-alibaba" aria-label="Permalink to &quot;Wan 2.1 (Alibaba)&quot;"></a></h3>
<p>Wan 2.1 adalah fondasi yang digunakan oleh beberapa model lain (termasuk Helios). Arsitektur Wan-VAE mengodekan dan mendekodekan video 1080p dengan durasi berapa pun sambil mempertahankan informasi temporal. Model ini tersedia dalam varian I2V pada 480p dan 720p, serta model First-Last-Frame-to-Video yang menghasilkan video di antara dua gambar referensi.</p>
<p>Wan-Edit memungkinkan transfer gaya dan konten menggunakan gambar referensi sambil mempertahankan struktur atau pose karakter tertentu. Wan 2.2 (Juli 2025) adalah rilis terbuka yang lebih baru, sebuah model Mixture-of-Experts dengan varian 5B yang dapat berjalan pada satu RTX 4090 dan tetap menggunakan Apache 2.0. Satu catatan penting bagi pengguna yang menghoskan sendiri: Wan menjadi tertutup mulai versi 2.5. Wan 2.5, 2.6, dan kini 2.7 yang lebih baru (yang menempati peringkat ketiga di arena dengan audio Artificial Analysis pada pertengahan 2026) menambahkan audio tersinkronisasi dan resolusi yang lebih tinggi, tetapi hanya tersedia melalui API tanpa bobot publik. Karena itu, 2.2 masih menjadi versi terbuka tertinggi. Abaikan halaman SEO yang mengklaim bahwa bobot Wan 2.7 dapat diunduh. Organisasi GitHub dan akun Hugging Face resminya hanya menyediakan hingga versi 2.2.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Parameter</td>
<td>1.3B, 5B, 14B (2.1); 5B + 14B MoE (2.2)</td>
</tr>
<tr>
<td>Mode I2V</td>
<td>I2V-480P, I2V-720P, FLF2V-720P</td>
</tr>
<tr>
<td>Versi terbuka tertinggi</td>
<td>Wan 2.2 (2.5 hingga 2.7 hanya tersedia melalui API)</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Apache 2.0</td>
</tr>
<tr>
<td>Perangkat keras</td>
<td>VRAM 8 GB+ (varian yang lebih kecil)</td>
</tr>
<tr>
<td>Platform</td>
<td>Diffusers, ComfyUI</td>
</tr>
</tbody>
</table>
<h3 id="hunyuanvideo-tencent" tabindex="-1">HunyuanVideo (Tencent) <a class="header-anchor" href="#hunyuanvideo-tencent" aria-label="Permalink to &quot;HunyuanVideo (Tencent)&quot;"></a></h3>
<p>Model 13B parameter dari Tencent ini menjadi pemimpin pembuatan video sumber terbuka sepanjang sebagian besar 2025. HunyuanVideo-I2V menggunakan teknik penggantian token dengan MLLM yang telah dilatih sebelumnya untuk memasukkan informasi gambar referensi. HunyuanVideo-1.5, yang dirilis pada November 2025, meningkatkan efisiensi. HunyuanCustom memungkinkan pembuatan video khusus yang digerakkan oleh input multimodal.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Parameter</td>
<td>13B</td>
</tr>
<tr>
<td>I2V</td>
<td>Ya (teknik penggantian token)</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Sumber terbuka</td>
</tr>
<tr>
<td>Perangkat keras</td>
<td>VRAM 60 GB+ (720p)</td>
</tr>
<tr>
<td>Varian</td>
<td>Base, I2V, 1.5, Avatar, Custom</td>
</tr>
</tbody>
</table>
<h3 id="ltx-2-lightricks" tabindex="-1">LTX-2 (Lightricks) <a class="header-anchor" href="#ltx-2-lightricks" aria-label="Permalink to &quot;LTX-2 (Lightricks)&quot;"></a></h3>
<p>Lightricks merilis LTX-2 sebagai sumber terbuka pada Januari 2026 dengan bobot lengkap, kode inferensi, dan kode pelatihan. Model berbasis DiT ini menghasilkan video dan audio tersinkronisasi secara bersamaan dalam satu proses, dengan 4K native hingga 50 fps dan klip berdurasi hingga 20 detik. Pengondisian gambar-ke-video dan beberapa keyframe sudah terintegrasi, sehingga Anda dapat memasang gambar diam referensi pada titik-titik tertentu di sepanjang klip seperti pada Pikaframes.</p>
<p>Lisensinya bisa menjadi kendala, atau tidak, tergantung pada ukuran bisnis Anda. LTX-2 gratis untuk penelitian dan penggunaan komersial dengan pendapatan tahunan di bawah $10 juta. Di atas itu, Anda memerlukan lisensi komersial. Jadi, dalam arti ketat, ini adalah bobot terbuka, bukan sumber terbuka. LTX-2.3, checkpoint saat ini, merupakan pembaruan 22B parameter dengan audio dan kepatuhan terhadap prompt yang lebih baik. Bobot tersedia di Hugging Face bersama varian terdistilasi 8 langkah, adaptor LoRA, serta integrasi ComfyUI dan Diffusers. API terhos tersedia di platform LTX, fal.ai, dan Replicate.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Parameter</td>
<td>22B (LTX-2.3)</td>
</tr>
<tr>
<td>Klip maksimum</td>
<td>Sekitar 20 detik</td>
</tr>
<tr>
<td>Resolusi</td>
<td>4K native hingga 50 fps</td>
</tr>
<tr>
<td>Audio</td>
<td>Tersinkronisasi secara native</td>
</tr>
<tr>
<td>I2V</td>
<td>Ya (pengondisian gambar + beberapa keyframe)</td>
</tr>
<tr>
<td>Lisensi</td>
<td>LTX-2 Community License (gratis di bawah ARR $10 juta)</td>
</tr>
<tr>
<td>Perangkat keras</td>
<td>Varian terdistilasi dan FP8 untuk GPU konsumen</td>
</tr>
</tbody>
</table>
<h3 id="cogvideox-tsinghua-zhipu-ai" tabindex="-1">CogVideoX (Tsinghua/Zhipu AI) <a class="header-anchor" href="#cogvideox-tsinghua-zhipu-ai" aria-label="Permalink to &quot;CogVideoX (Tsinghua/Zhipu AI)&quot;"></a></h3>
<p>CogVideoX menggunakan VAE kausal 3D yang mengurangi panjang urutan dan mencegah kedipan. Transformer LayerNorm adaptif meningkatkan keselarasan teks-video. Tersedia dalam varian 2B (Apache 2.0) dan 5B (lisensi riset), dengan integrasi native Diffusers.</p>
<p>Klip berdurasi 6-10 detik pada 720x480. Memang singkat, tetapi rasio kualitas terhadap komputasinya bagus dan dapat berjalan pada GPU 12GB.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Parameter</td>
<td>2B, 5B</td>
</tr>
<tr>
<td>I2V</td>
<td>Ya (CogVideoXImageToVideoPipeline)</td>
</tr>
<tr>
<td>Resolusi</td>
<td>720x480 pada 8fps</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Apache 2.0 (2B), Riset (5B)</td>
</tr>
<tr>
<td>Perangkat Keras</td>
<td>VRAM 12GB</td>
</tr>
</tbody>
</table>
<h2 id="frame-pertama-vs-referensi-sejati-perbedaan-utama" tabindex="-1">Frame Pertama vs. Referensi Sejati: Perbedaan Utama <a class="header-anchor" href="#frame-pertama-vs-referensi-sejati-perbedaan-utama" aria-label="Permalink to &quot;Frame Pertama vs. Referensi Sejati: Perbedaan Utama&quot;"></a></h2>
<p>Tidak semua dukungan &quot;gambar referensi&quot; itu sama. Memahami perbedaannya sangat penting untuk memilih model yang tepat.</p>
<p><strong>Model frame pertama</strong> (LongCat, Helios, Hailuo, Luma Ray2, HunyuanVideo) memperlakukan gambar Anda sebagai frame pembuka secara harfiah. Model menganimasikan video ke depan dari visual tersebut. Anda tidak dapat mengunggah foto wajah karakter lalu mendeskripsikannya dalam adegan lain. Gambar tersebut adalah adegannya.</p>
<p><strong>Model referensi sejati</strong> (Kling, Grok Imagine, Seedance, SkyReels V3) mengekstrak identitas dari gambar Anda dan menempatkan karakter/objek tersebut ke dalam adegan apa pun yang Anda deskripsikan. Unggah foto seseorang, lalu gunakan prompt &quot;orang tersebut berjalan melewati hutan saat matahari terbenam.&quot; Karakter akan muncul di lingkungan yang sepenuhnya baru sambil mempertahankan identitasnya. Inilah yang Anda perlukan untuk konten naratif multiadegan seperti film petualangan.</p>
<p><strong>Model ID karakter</strong> (Sora 2 Pro) mengekstrak identitas dari klip video, bukan gambar statis. Anda membuat ID karakter persisten satu kali, lalu menggunakannya kembali dalam generasi berikutnya tanpa batas.</p>
<p><strong>Model gaya/bahan</strong> (Veo 3.1) menggunakan gambar referensi untuk memengaruhi gaya visual, tekstur, dan tampilan keseluruhan, bukan untuk mengekstrak identitas karakter tertentu. Cocok untuk menjaga konsistensi visual di seluruh proyek, tetapi kurang presisi untuk mengontrol karakter individual.</p>
<h2 id="alur-kerja-nyata-untuk-video-10-menit" tabindex="-1">Alur Kerja Nyata untuk Video 10 Menit <a class="header-anchor" href="#alur-kerja-nyata-untuk-video-10-menit" aria-label="Permalink to &quot;Alur Kerja Nyata untuk Video 10 Menit&quot;"></a></h2>
<p>Berikut gambaran jujur tentang kondisi teknologi ini pada pertengahan 2026. Belum ada satu pun model yang dapat menghasilkan video konsisten dan berkualitas tinggi berdurasi 10 menit dalam sekali proses secara andal. LongCat Video paling mendekati dengan klaim durasi 15 menit, tetapi kualitas dan koherensinya sangat bervariasi pada durasi tersebut. Helios dan SkyReels V2 masing-masing menghasilkan video &quot;berskala menit&quot; dan &quot;berdurasi tak terbatas&quot;, tetapi hasilnya memerlukan prompt yang cermat dan sering kali beberapa kali percobaan.</p>
<p>Alur kerja yang benar-benar efektif bagi sebagian besar kreator yang membuat video berdurasi 5-15 menit menggabungkan beberapa pendekatan:</p>
<p><strong>Untuk konten talking head/avatar:</strong> Mode berbasis audio LongCat Video versi 2026 atau pembuatan avatar SkyReels V3 dapat menghasilkan karakter berbicara yang konsisten selama lebih dari 5 menit. Ini merupakan opsi yang paling mendekati konsep &quot;tekan tombol, dapatkan video panjang.&quot;</p>
<p><strong>Untuk konten naratif dengan banyak adegan (gaya film petualangan):</strong> Gunakan Kling 3.0, Grok Imagine, atau Seedance 2.0 dengan gambar referensi karakter sejati. Buat shot individual berdurasi 10-15 detik. Gunakan referensi @Element atau <code>&lt;IMAGE&gt;</code> yang sama pada setiap generasi untuk mempertahankan identitas karakter. Rangkai shot menggunakan mode multishot (Kling mendukung 6 shot per panggilan) atau API perpanjangan. Kling adalah opsi yang paling teruji untuk alur kerja ini. Pemisahan eksplisit Grok Imagine antara &quot;mode referensi&quot; dan &quot;mode frame pertama&quot; menjadikannya alternatif yang kuat. Seedance 2.0 menerima input referensi paling banyak (12 berkas), tetapi lebih baru dan belum banyak teruji.</p>
<p><strong>Untuk konsistensi karakter di banyak klip:</strong> Sistem <code>character_id</code> persisten milik Sora 2 Pro adalah pendekatan paling rapi untuk proyek yang sangat panjang. Ekstrak karakter satu kali dari video singkat, lalu buat puluhan klip yang merujuk ID tersebut. Identitas karakter tidak menurun seiring waktu karena disimpan sebagai embedding persisten, bukan ditafsirkan ulang dari gambar setiap kali.</p>
<p><strong>Untuk konten dengan transfer gaya:</strong> Lucy Restyle di fal.ai memproses video yang sudah ada hingga 30 menit, menerapkan transformasi gaya AI sambil mempertahankan gerakan. Jika Anda memiliki rekaman sumber, pendekatan ini sepenuhnya menghindari masalah batas durasi generasi. $0.01 per detik video sumber.</p>
<p><strong>Untuk pipeline sumber terbuka:</strong> Bangun pipeline berbasis Wan 2.1 atau Helios dengan loop kelanjutan video. Buat sebuah klip, gunakan frame terakhir sebagai frame awal klip berikutnya, lalu ulangi. Alur kerja ComfyUI dapat mengotomatiskan proses ini. Konsistensi menurun setelah banyak iterasi, tetapi pendekatan ini gratis dan dapat dikendalikan.</p>
<p>Tantangan utamanya tetap sama: bahkan dengan dukungan gambar referensi sejati, pergeseran karakter akan terakumulasi di puluhan klip. Fitur wajah, rambut, pakaian, dan warna kulit berubah secara bertahap. Solusi sementara seperti foto referensi berkualitas tinggi, prompt yang konsisten, dan pemrosesan shot secara batch tetap diperlukan. Namun, model seperti Kling dan Grok Imagine yang memisahkan identitas karakter dari komposisi adegan membuat proses ini jauh lebih mudah dibandingkan model yang hanya mendukung frame pertama.</p>
<h2 id="pendekatan-kerangka-3d-render-sederhana-transformasikan-menjadi-berkualitas-tinggi" tabindex="-1">Pendekatan Kerangka 3D: Render Sederhana, Transformasikan Menjadi Berkualitas Tinggi <a class="header-anchor" href="#pendekatan-kerangka-3d-render-sederhana-transformasikan-menjadi-berkualitas-tinggi" aria-label="Permalink to &quot;Pendekatan Kerangka 3D: Render Sederhana, Transformasikan Menjadi Berkualitas Tinggi&quot;"></a></h2>
<p>Ada sebuah alur kerja yang makin populer dan dapat menghindari sebagian besar masalah generasi video berdurasi panjang. Alih-alih meminta model AI membuat video 10 menit dari nol, Anda merender cutscene 3D berfidelitas rendah dengan pergerakan kamera, penempatan karakter, dan pengaturan waktu yang tepat, lalu memprosesnya melalui model video-ke-video dengan gambar referensi dan prompt peningkatan. Mesin 3D menangani struktur. AI menangani estetika.</p>
<p>Pendekatan ini efektif karena transformasi V2V merupakan masalah yang lebih sempit dibandingkan generasi penuh. Model tidak perlu menciptakan gerakan kamera, penempatan karakter, atau komposisi adegan. Model hanya perlu membuat rekaman yang ada tampak fotorealistis sambil mengikuti referensi visual Anda. Proses ini jauh lebih mudah ditangani dan dapat diskalakan ke durasi berapa pun yang dapat dirender oleh mesin 3D Anda.</p>
<h3 id="mengapa-pendekatan-ini-berhasil" tabindex="-1">Mengapa Pendekatan Ini Berhasil <a class="header-anchor" href="#mengapa-pendekatan-ini-berhasil" aria-label="Permalink to &quot;Mengapa Pendekatan Ini Berhasil&quot;"></a></h3>
<p>Mesin 3D menyediakan semua hal yang masih sulit dilakukan model video AI: kontrol kamera yang presisi, penempatan karakter yang tepat di seluruh frame, interaksi fisika yang benar, dan pengaturan waktu yang konsisten selama beberapa menit rekaman. Dolly zoom, tracking shot, serta karakter yang masuk dan keluar frame sesuai isyarat—semuanya mudah dilakukan dalam mesin 3D, tetapi tidak andal dalam generasi berbasis prompt teks. Satu-satunya tugas model V2V adalah mentransformasikan material, pencahayaan, dan tekstur menjadi hasil fotorealistis sambil mempertahankan geometri dan gerakan yang telah Anda tentukan.</p>
<p>Konsistensi karakter juga menjadi lebih mudah. Alih-alih mengatasi pergeseran identitas di 50 generasi AI yang berbeda, Anda memperlihatkan karakter 3D yang sama kepada model di setiap frame. Gambar referensi memberi tahu model seperti apa tampilan akhir karakter tersebut. Ini adalah masalah yang lebih sederhana daripada membuat karakter konsisten dari nol setiap kali.</p>
<p>Durasi pun tidak lagi menjadi kendala. Lucy Restyle dapat menangani 30 menit dalam satu panggilan. Wan 2.1 di ComfyUI dapat memproses durasi berapa pun dalam beberapa potongan. Anda tidak perlu lagi menghadapi masalah &quot;bagaimana cara membuat video 10 menit&quot; karena rekamannya sudah tersedia.</p>
<h3 id="realmaster-meta-universitas-tel-aviv" tabindex="-1">RealMaster (Meta / Universitas Tel Aviv) <a class="header-anchor" href="#realmaster-meta-universitas-tel-aviv" aria-label="Permalink to &quot;RealMaster (Meta / Universitas Tel Aviv)&quot;"></a></h3>
<p>RealMaster adalah sistem riset yang dibuat khusus untuk alur kerja ini. Dipublikasikan pada Maret 2026 oleh Meta Reality Labs dan Universitas Tel Aviv, sistem ini mentransformasikan video 3D hasil render menjadi video fotorealistis sambil mempertahankan keselarasan geometris penuh dengan sumbernya.</p>
<p>Metode ini mengekstrak peta tepi dari render 3D untuk mempertahankan struktur dan gerakan, lalu menerapkan model difusi video (dibangun di atas arsitektur VACE/Wan) untuk mentransformasikan seluruh elemen lainnya menjadi hasil fotorealistis. Adaptor IC-LoRA ringan menyuling pipeline menjadi satu kali proses inferensi yang tidak memerlukan frame jangkar dan dapat menangani objek yang muncul di tengah urutan.</p>
<p>Dalam pengujian pada urutan simulator GTA-V dan CARLA, RealMaster secara signifikan mengungguli baseline pengeditan video serbaguna. Sistem ini juga dapat menambahkan efek cuaca melalui prompt teks (&quot;Buat hujan&quot;, &quot;Buat salju&quot;) di atas transformasi realismenya. Model ini dapat digeneralisasi ke berbagai simulator tanpa pelatihan ulang. Bobot yang dilatih menggunakan data GTA-V dapat digunakan pada hasil CARLA tanpa penyetelan tambahan.</p>
<p><strong>Ketersediaan:</strong> Hanya untuk riset. Belum tersedia bobot publik maupun API.</p>
<table tabindex="0">
<thead>
<tr>
<th>Spesifikasi</th>
<th>Nilai</th>
</tr>
</thead>
<tbody>
<tr>
<td>Input</td>
<td>Video 3D hasil render (mesin apa pun)</td>
</tr>
<tr>
<td>Output</td>
<td>Video fotorealistis yang mempertahankan geometri dan gerakan</td>
</tr>
<tr>
<td>Arsitektur</td>
<td>IC-LoRA pada backbone difusi video VACE/Wan</td>
</tr>
<tr>
<td>Pengondisian</td>
<td>Peta tepi dari render sumber</td>
</tr>
<tr>
<td>Diuji pada</td>
<td>Simulator GTA-V, CARLA</td>
</tr>
<tr>
<td>Lisensi</td>
<td>Belum dirilis (hanya makalah riset)</td>
</tr>
</tbody>
</table>
<h3 id="alat-v2v-produksi-yang-tersedia-saat-ini" tabindex="-1">Alat V2V Produksi yang Tersedia Saat Ini <a class="header-anchor" href="#alat-v2v-produksi-yang-tersedia-saat-ini" aria-label="Permalink to &quot;Alat V2V Produksi yang Tersedia Saat Ini&quot;"></a></h3>
<p><strong>Kling 3.0 V2V dengan Referensi Elemen</strong> adalah opsi produksi paling lengkap. Endpoint Edit Video dan Reference V2V di fal.ai menerima klip video sumber berdurasi 3-10 detik beserta referensi elemen (<code>@Element1</code>, <code>@Element2</code> dengan foto tampak depan dan dari berbagai sudut) serta prompt peningkatan. Model menganalisis lintasan gerakan dan pola kamera dalam sumber, lalu meregenerasi rekaman dengan tampilan karakter dan gaya visual yang Anda tentukan sambil mempertahankan penataan serta pergerakan kamera aslinya. Mendukung hingga 7 input referensi. Hasil pada 1080p. Proses cutscene Anda dalam potongan berdurasi 10-15 detik dengan referensi elemen yang sama di seluruh potongan untuk menjaga konsistensi karakter.</p>
<p><strong>Lucy Restyle 2</strong> menangani video sumber hingga 30 menit dalam satu panggilan API dengan biaya $0.01 per detik input. Alat ini menerima prompt teks dan gambar referensi opsional sebagai panduan gaya. Tidak ada referensi elemen per karakter seperti Kling, tetapi untuk transfer gaya sinematik menyeluruh pada render 3D berdurasi penuh, inilah jalur paling sederhana dan termurah. Masukkan hasil render lengkap Anda dan prompt yang menjelaskan tampilan target. Hasil pada 720p dengan konsistensi temporal di ribuan frame.</p>
<p><strong>Wan 2.1 VACE di ComfyUI</strong> adalah jalur sumber terbuka. Model VACE 14B melakukan V2V berbasis referensi: masukkan video sumber beserta gambar referensi gaya, lalu hasilkan versi bergaya ulang yang mempertahankan struktur dan gerakan. Pengondisian peta tepi meningkatkan fidelitas struktural. Anda dapat membuat loop pemrosesan yang menangani durasi berapa pun dalam beberapa potongan dengan referensi gaya yang konsisten. Gratis dan berjalan secara lokal di perangkat keras Anda sendiri.</p>
<p><strong>Grok Imagine V2V</strong> menerima video sumber beserta 1-7 gambar referensi dalam mode referensi. $0.05 per detik pada 720p. Pemisahan eksplisit antara mode referensi dan mode frame pertama berarti referensi Anda memandu tampilan karakter tanpa menggantikan struktur video sumber.</p>
<h3 id="persyaratan-render-3d-anda" tabindex="-1">Persyaratan Render 3D Anda <a class="header-anchor" href="#persyaratan-render-3d-anda" aria-label="Permalink to &quot;Persyaratan Render 3D Anda&quot;"></a></h3>
<p>Batas minimum kualitas render itu penting. Wireframe polos tidak akan memberikan cukup informasi kepada model V2V. Namun, Anda juga tidak memerlukan material atau pencahayaan berkualitas produksi.</p>
<p><strong>Proporsi dan geometri yang tepat.</strong> Model karakter memerlukan proporsi tubuh dan struktur wajah yang kurang lebih tepat agar gambar referensi dapat dipetakan dengan benar. Geometri humanoid dasar dengan proporsi yang benar sudah cukup. Figur lidi tidak akan menghasilkan karakter yang dapat dikenali.</p>
<p><strong>Arah pencahayaan dasar.</strong> Satu cahaya terarah yang menentukan iluminasi keseluruhan adegan membantu model memahami suasana yang diinginkan. AI akan menyempurnakan dan menambahkan detail, tetapi perlu mengetahui apakah adegan berlangsung pada siang hari yang cerah atau di interior gelap.</p>
<p><strong>Gerakan kamera yang mulus.</strong> Pergerakan kamera yang stabil dan terarah akan diterjemahkan dengan baik. Gerakan tidak beraturan atau sangat cepat dapat membingungkan model V2V. Pastikan kamera virtual Anda bergerak sebagaimana kamera nyata.</p>
<p><strong>Shading datar alih-alih wireframe.</strong> Geometri sederhana dengan shading datar atau low-poly memberikan hasil yang lebih baik daripada wireframe atau model tanpa tekstur. Bahkan warna solid dasar pada permukaan membantu model memahami batas antar-material.</p>
<h3 id="biaya-dan-skala" tabindex="-1">Biaya dan Skala <a class="header-anchor" href="#biaya-dan-skala" aria-label="Permalink to &quot;Biaya dan Skala&quot;"></a></h3>
<p>Pemrosesan cutscene 10 menit melalui berbagai alat:</p>
<table tabindex="0">
<thead>
<tr>
<th>Alat</th>
<th>Durasi Input Maks.</th>
<th>Biaya untuk 10 menit</th>
<th>Resolusi</th>
<th>Gambar Referensi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Kling O3 V2V</td>
<td>Klip 10 detik</td>
<td>~$50-67</td>
<td>1080p</td>
<td>Hingga 7 (elemen + gaya)</td>
</tr>
<tr>
<td>Lucy Restyle 2</td>
<td>30 menit</td>
<td>$6</td>
<td>720p</td>
<td>1 (hanya gaya)</td>
</tr>
<tr>
<td>Grok Imagine V2V</td>
<td>Klip 10 detik</td>
<td>~$30</td>
<td>720p</td>
<td>1-7</td>
</tr>
<tr>
<td>Wan 2.1 VACE</td>
<td>Berapa pun (dipotong)</td>
<td>Gratis (GPU lokal)</td>
<td>720p</td>
<td>1 per potongan</td>
</tr>
</tbody>
</table>
<p>Lucy Restyle adalah opsi termurah untuk pemrosesan berdurasi penuh. Kling paling presisi untuk peningkatan khusus karakter dengan referensi elemen. Wan 2.1 gratis jika Anda memiliki perangkat kerasnya (memerlukan sekitar 60GB VRAM untuk model 14B pada 720p, atau 8GB untuk varian 1.3B dengan kualitas lebih rendah).</p>
<h2 id="tabel-perbandingan" tabindex="-1">Tabel Perbandingan <a class="header-anchor" href="#tabel-perbandingan" aria-label="Permalink to &quot;Tabel Perbandingan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Durasi Native Maks.</th>
<th>Durasi Diperpanjang</th>
<th>Jenis Referensi</th>
<th>Referensi Maks.</th>
<th>Resolusi</th>
<th>API Tersedia</th>
<th>Sumber Terbuka</th>
</tr>
</thead>
<tbody>
<tr>
<td>LongCat Video</td>
<td>~15 menit</td>
<td>N/A</td>
<td>Hanya frame pertama</td>
<td>1</td>
<td>720p/30fps</td>
<td>Ya (fal.ai)</td>
<td>Ya (MIT)</td>
</tr>
<tr>
<td>Seaweed APT2</td>
<td>~5 menit</td>
<td>N/A</td>
<td>I2V + pose</td>
<td>1</td>
<td>720p</td>
<td>Tidak</td>
<td>Tidak</td>
</tr>
<tr>
<td>Helios</td>
<td>Berskala menit</td>
<td>N/A</td>
<td>Frame pertama (I2V)</td>
<td>1</td>
<td>720p</td>
<td>HF Spaces</td>
<td>Ya (Apache 2.0)</td>
</tr>
<tr>
<td>SkyReels V3</td>
<td>Tak terbatas</td>
<td>N/A</td>
<td>Referensi sejati</td>
<td>1-4</td>
<td>720p</td>
<td>Tidak</td>
<td>Ya</td>
</tr>
<tr>
<td><strong>Kling 3.0</strong></td>
<td>15 detik</td>
<td>~3 menit</td>
<td><strong>Elemen + referensi gaya</strong></td>
<td><strong>7</strong></td>
<td>1080p</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td><strong>Grok Imagine</strong></td>
<td>15 detik</td>
<td>Dapat dirangkai</td>
<td><strong>Referensi sejati</strong></td>
<td><strong>7</strong></td>
<td>720p</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td><strong>Seedance 2.0</strong></td>
<td>15 detik</td>
<td>N/A</td>
<td><strong>Referensi multimodal</strong></td>
<td><strong>12</strong></td>
<td>2K</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td>Runway Gen-4.5</td>
<td>10 detik</td>
<td>~1 menit</td>
<td>I2V (0-1)</td>
<td>1</td>
<td>1080p</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td>Veo 3.1</td>
<td>8 detik</td>
<td>~2,5 menit</td>
<td>Bahan (gaya)</td>
<td>3</td>
<td>4K</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td>Gemini Omni Flash</td>
<td>10 detik</td>
<td>Pengeditan percakapan</td>
<td>Referensi multimodal</td>
<td>Gambar + video</td>
<td>720p</td>
<td>Ya (pratinjau)</td>
<td>Tidak</td>
</tr>
<tr>
<td>Sora 2 Pro ⚠️ akan dihentikan</td>
<td>20 detik</td>
<td>Dapat dirangkai</td>
<td>ID karakter (video)</td>
<td>2</td>
<td>1080p</td>
<td>API dihentikan Sep 2026</td>
<td>Tidak</td>
</tr>
<tr>
<td>Hailuo 02</td>
<td>10 detik</td>
<td>N/A</td>
<td>I2V (frame pertama)</td>
<td>1</td>
<td>1080p</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td>Luma Ray3.2</td>
<td>20 detik</td>
<td>N/A</td>
<td>Keyframe + referensi karakter</td>
<td>16 keyframe</td>
<td>1080p (upscale 4K)</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td>Pika 2.5</td>
<td>10 detik</td>
<td>25 detik</td>
<td>Pikascenes</td>
<td>10</td>
<td>1080p</td>
<td>Ya</td>
<td>Tidak</td>
</tr>
<tr>
<td>Wan 2.1</td>
<td>Klip pendek</td>
<td>Melalui kelanjutan</td>
<td>I2V / FLF2V</td>
<td>1-2</td>
<td>720p</td>
<td>Melalui fal.ai</td>
<td>Ya (Apache 2.0)</td>
</tr>
<tr>
<td>HunyuanVideo</td>
<td>Klip pendek</td>
<td>Melalui kelanjutan</td>
<td>I2V (frame pertama)</td>
<td>1</td>
<td>720p</td>
<td>Melalui fal.ai</td>
<td>Ya</td>
</tr>
<tr>
<td>LTX-2.3</td>
<td>20 detik</td>
<td>Melalui kelanjutan</td>
<td>I2V + keyframe</td>
<td>Multikeyframe</td>
<td>4K</td>
<td>Ya (LTX, fal.ai)</td>
<td>Bobot (dibatasi ARR)</td>
</tr>
<tr>
<td>CogVideoX</td>
<td>6-10 detik</td>
<td>Melalui kelanjutan</td>
<td>I2V (frame pertama)</td>
<td>1</td>
<td>720x480</td>
<td>Melalui fal.ai</td>
<td>Ya</td>
</tr>
</tbody>
</table>
<h2 id="yang-akan-hadir-berikutnya" tabindex="-1">Yang Akan Hadir Berikutnya <a class="header-anchor" href="#yang-akan-hadir-berikutnya" aria-label="Permalink to &quot;Yang Akan Hadir Berikutnya&quot;"></a></h2>
<p>Arah perkembangan hingga 2026 sudah jelas. LongCat Video membuktikan bahwa pembuatan video berdurasi hitungan menit dengan konsistensi dapat dilakukan oleh model terbuka. Helios menunjukkan bahwa hal itu dapat berlangsung secara real-time. Seaweed APT2 mendemonstrasikan pembuatan video berdurasi panjang secara interaktif. Dan model referensi sejati (Kling, Grok, Seedance) membuktikan bahwa identitas karakter dapat dipertahankan di berbagai adegan.</p>
<p>Langkah berikutnya adalah menggabungkan kemampuan-kemampuan ini: pembuatan video panjang secara native dengan dukungan referensi karakter sejati. Saat ini Anda harus memilih salah satunya. Ketika sebuah model mampu menghasilkan video berdurasi 5 menit sambil mempertahankan karakter dari gambar referensi di puluhan pergantian adegan, alur kerja merangkai klip akan menjadi usang. Spesifikasi Seedance 2.5 yang telah diumumkan (klip native 30 detik, hingga 50 file referensi, API dibuka pada 16 Juli 2026) merupakan langkah nyata pertama ke arah tersebut.</p>
<p>Per pertengahan Juli 2026, arena text-to-video Artificial Analysis (dengan audio) dipimpin oleh Gemini Omni Flash dari Google (~1.240 Elo), diikuti Seedance 2.0, Wan 2.7 dari Alibaba yang hanya tersedia melalui API, serta model-model HappyHorse, sementara berbagai varian Kling 3.0, SkyReels V4, dan Veo 3.1 menyusul ketat. Papan peringkat sering berubah, jadi anggap setiap peringkat sebagai gambaran sesaat, bukan urutan yang tetap.</p>
<p>Pendekatan kerangka 3D menawarkan jalur perkembangan paralel. Seiring meningkatnya kemampuan model V2V dalam mempertahankan struktur dan menghasilkan fotorealisme, peningkatan render 3D beresolusi rendah menjadi semakin layak untuk produksi penuh. RealMaster dari Meta telah mencapai transformasi simulasi-ke-dunia-nyata berkualitas riset pada keluaran mesin game. Ketika kemampuan ini tersedia melalui API produksi dengan dukungan gambar referensi, siapa pun yang memiliki keterampilan dasar 3D akan dapat membuat video panjang fotorealistis dengan kendali penuh atas kamera, penataan adegan, dan penempatan karakter untuk durasi berapa pun.</p>
<p>Untuk saat ini, jawaban praktisnya bergantung pada kebutuhan Anda:</p>
<p><strong>Terbaik untuk referensi banyak karakter:</strong> Kling 3.0 (hingga 7 referensi dengan sistem elemen + gaya terpisah) atau Seedance 2.0 (hingga 12 masukan multimodal, meningkat menjadi 50 saat API Seedance 2.5 dibuka pada 16 Juli 2026).</p>
<p><strong>API terbaik untuk referensi-ke-video:</strong> Grok Imagine (API yang sederhana, mode referensi eksplisit, $0,05/detik) atau Kling melalui fal.ai ($0,084–0,112/detik).</p>
<p><strong>Terbaik untuk karakter persisten di banyak klip:</strong> Referensi elemen Kling 3.0 atau fitur referensi-dan-perpanjang SkyReels V3. (Sistem ID karakter Sora 2 Pro merupakan pendekatan paling sederhana, tetapi akan dihentikan pada 2026, jadi jangan memulai proyek baru dengannya.)</p>
<p><strong>Sumber terbuka terbaik:</strong> SkyReels V3 (1–4 gambar referensi sejati, durasi tanpa batas) atau Helios (real-time, Apache 2.0).</p>
<p><strong>Terbaik untuk durasi murni:</strong> LongCat Video (~15 menit, tetapi hanya bingkai pertama).</p>
<p><strong>Terbaik untuk meningkatkan render 3D:</strong> Kling 3.0 V2V (referensi elemen per karakter, 1080p) atau Lucy Restyle 2 (masukan 30 menit, $0,01/detik).</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-model-video-ai-terbaik-untuk-video-panjang" tabindex="-1">Apa model video AI terbaik untuk video panjang? <a class="header-anchor" href="#apa-model-video-ai-terbaik-untuk-video-panjang" aria-label="Permalink to &quot;Apa model video AI terbaik untuk video panjang?&quot;"></a></h3>
<p>Untuk durasi murni, LongCat Video dapat menghasilkan video sekitar 15 menit secara native, meskipun hanya menggunakan bingkai pertama. Untuk video panjang dengan karakter yang konsisten, jawaban praktis pada 2026 adalah alur kerja referensi-dan-perpanjang: hasilkan klip menggunakan model dengan dukungan referensi yang kuat (Kling 3.0, Runway Gen-4.5, atau SkyReels V3 yang bersumber terbuka), lalu rangkai klip-klip tersebut. Belum ada satu model yang sekaligus dapat menghasilkan video panjang dan mempertahankan identitas karakter dengan sempurna, sehingga kebanyakan produksi menggabungkan keduanya.</p>
<h3 id="model-video-ai-mana-yang-mendukung-gambar-referensi" tabindex="-1">Model video AI mana yang mendukung gambar referensi? <a class="header-anchor" href="#model-video-ai-mana-yang-mendukung-gambar-referensi" aria-label="Permalink to &quot;Model video AI mana yang mendukung gambar referensi?&quot;"></a></h3>
<p>Kling 3.0 Omni, Runway Gen-4.5, Seedance 2.0, Google Veo 3.1, dan Gemini Omni Flash semuanya mendukung gambar referensi di antara opsi komersial. Di sisi sumber terbuka, SkyReels V2/V3, Wan 2.1, dan LTX-2 menerima masukan referensi yang dapat Anda jalankan sendiri. Kualitas dukungannya sangat bervariasi, karena itu panduan di atas membaginya ke dalam beberapa tingkatan.</p>
<h3 id="bisakah-ai-menghasilkan-karakter-yang-konsisten-di-sepanjang-video-panjang" tabindex="-1">Bisakah AI menghasilkan karakter yang konsisten di sepanjang video panjang? <a class="header-anchor" href="#bisakah-ai-menghasilkan-karakter-yang-konsisten-di-sepanjang-video-panjang" aria-label="Permalink to &quot;Bisakah AI menghasilkan karakter yang konsisten di sepanjang video panjang?&quot;"></a></h3>
<p>Bisa, tetapi tidak dalam satu kali pembuatan. Pendekatan yang andal adalah mengunci karakter dengan satu atau beberapa gambar referensi, menghasilkan klip-klip pendek, lalu memperpanjang atau menyatukannya sambil terus memasukkan kembali referensi yang sama. Dukungan referensi sejati (model mempertahankan identitas di berbagai pembuatan baru) jauh lebih penting di sini daripada pengondisian bingkai pertama, yang hanya menjadi acuan untuk bingkai pembuka.</p>
<h3 id="apa-perbedaan-antara-dukungan-bingkai-pertama-dan-gambar-referensi-sejati" tabindex="-1">Apa perbedaan antara dukungan bingkai pertama dan gambar referensi sejati? <a class="header-anchor" href="#apa-perbedaan-antara-dukungan-bingkai-pertama-dan-gambar-referensi-sejati" aria-label="Permalink to &quot;Apa perbedaan antara dukungan bingkai pertama dan gambar referensi sejati?&quot;"></a></h3>
<p>Pengondisian bingkai pertama menggunakan gambar Anda sebagai bingkai pembuka harfiah dari klip, lalu hasilnya mulai menyimpang seiring berjalannya video. Dukungan referensi sejati memperlakukan gambar sebagai jangkar identitas yang dipatuhi model selama proses pembuatan, sehingga karakter atau gaya tetap konsisten di seluruh klip dan di antara klip-klip terpisah. Bagian di atas menguraikan model mana yang menggunakan setiap pendekatan tersebut.</p>
<hr>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Terdepan</a> — panduan praktis AI generatif sumber terbuka untuk video, gambar, 3D, audio, dan lainnya</li>
<li><a href="/id/guides/ai-asset-generators-games.html">Generator Aset AI untuk Game</a> — karya seni, model, dan audio dari sebuah prompt</li>
<li><a href="/id/guides/ai-music-generators-games.html">Generator Musik AI Terbaik untuk Game</a> — membuat musik latar game Anda dengan musik hasil generatif</li>
<li><a href="/id/tools/video.html">Generator Video</a> — alat pembuatan video kami yang ditenagai Kling 3.0 Pro</li>
<li><a href="/id/blog/2026-03-04-sketch-to-animated-3d-character.html">Cara mengubah sketsa menjadi karakter 3D beranimasi</a> — menggunakan pembuatan gambar dan video untuk animasi karakter</li>
</ul>
<BuildCta
  title="Jadikan adegannya dapat dimainkan, bukan sekadar dirender"
  desc="Lewati antrean render dan jelajahi langsung secara real-time."
  prompt="Buat kota neon yang bisa saya jelajahi dengan mobil pada malam hari" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/long-reference-video-models.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Pembuatan Lanskap dengan LOD Dinamis dan Streaming untuk Dunia Terbuka di Browser]]></title>
            <link>https://app.cinevva.com/id/guides/landscape-generation-browser</link>
            <guid>https://app.cinevva.com/id/guides/landscape-generation-browser</guid>
            <pubDate>Sun, 22 Feb 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Melampaui heightmap dan fungsi noise. Pembuatan medan yang akurat secara fisik, representasi volumetrik, sintesis berbasis difusi, dan pipeline rendering berbasis GPU untuk dunia terbuka di browser.]]></description>
            <content:encoded><![CDATA[<h1 id="pembuatan-lanskap-dengan-lod-dinamis-dan-streaming-untuk-dunia-terbuka-di-browser" tabindex="-1">Pembuatan Lanskap dengan LOD Dinamis dan Streaming untuk Dunia Terbuka di Browser <a class="header-anchor" href="#pembuatan-lanskap-dengan-lod-dinamis-dan-streaming-untuk-dunia-terbuka-di-browser" aria-label="Permalink to &quot;Pembuatan Lanskap dengan LOD Dinamis dan Streaming untuk Dunia Terbuka di Browser&quot;"></a></h1>
<p>Heightmap dengan noise Perlin adalah titik awal standar untuk medan prosedural. Tumpuk beberapa oktaf fBm, terapkan gradasi warna, dan Anda mendapatkan sesuatu yang tampak seperti medan. Setiap tutorial berhenti di sini. Namun, lanskap nyata tidak tampak seperti noise yang ditumpuk. Lanskap nyata memiliki lembah sungai yang dipahat oleh air, permukaan tebing yang dibentuk oleh retakan tegangan, serta gua dan lengkungan yang terbentuk oleh erosi selama jutaan tahun. Lanskap nyata memiliki tekstur yang saling berkorelasi (rumput di tanah datar, batu di lereng curam, salju di atas batas pepohonan) yang muncul dari proses fisik yang sama dengan proses yang membentuk geometrinya.</p>
<p>Panduan ini membahas apa yang hadir setelah noise: metode pembuatan berbasis fisika, representasi volumetrik yang mendukung gua dan bagian menjorok, sintesis medan neural berbasis difusi, serta pipeline LOD dan streaming berbasis GPU yang diperlukan untuk merender semuanya di tab browser pada 60 fps.</p>
<p>Semua yang dibahas di sini ditujukan untuk batasan spesifik kami: dunia terbuka multipemain yang berjalan di WebGL 2 / WebGPU, di-streaming melalui jaringan, dan dapat diedit oleh kreator.</p>
<h2 id="mengapa-heightmap-tidak-cukup" tabindex="-1">Mengapa Heightmap Tidak Cukup <a class="header-anchor" href="#mengapa-heightmap-tidak-cukup" aria-label="Permalink to &quot;Mengapa Heightmap Tidak Cukup&quot;"></a></h2>
<p>Heightmap menyimpan satu nilai ketinggian untuk setiap titik kisi. Ini adalah fungsi 2D: dengan masukan (x, z), hasilkan y. Representasi ini ringkas, ramah GPU, dan cepat dirender. Namun, representasi ini memiliki keterbatasan mendasar yang penting bagi dunia kreator.</p>
<p><strong>Tidak ada gua atau bagian menjorok.</strong> Heightmap tidak dapat merepresentasikan medan saat satu titik memiliki dua ketinggian berbeda. Gua, lengkungan, tebing menjorok, terowongan, dan pulau terapung semuanya mustahil dibuat. Karena alasan inilah Minecraft, No Man's Sky, dan Deep Rock Galactic memerlukan medan volumetrik.</p>
<p><strong>Tidak ada fitur vertikal.</strong> Permukaan tebing vertikal dalam heightmap merupakan lereng yang nyaris tak terhingga, sehingga menyebabkan peregangan tekstur ekstrem dan artefak tabrakan. Tebing nyata memiliki fitur horizontal (tepian, celah) yang tidak dapat direpresentasikan oleh heightmap.</p>
<p><strong>Noise tampak seperti noise.</strong> Bahkan dengan 8 oktaf fBm dan domain warping, medan tetap memiliki kesan sintetis. Medan tersebut tidak memiliki struktur terarah seperti geologi nyata: garis punggungan, jaringan drainase, endapan sedimen, dan lipatan tektonik. Pola-pola ini muncul dari proses fisik, bukan dari fungsi noise.</p>
<p><strong>Pengeditan oleh kreator terbatas.</strong> Jika kreator hanya dapat mengubah ketinggian, mereka tidak dapat menggali terowongan, membuat gua, atau membangun ruang bawah tanah. Untuk dunia yang benar-benar dapat dibentuk oleh kreator, representasi medan perlu mendukung pengurangan maupun penambahan.</p>
<p>Solusinya bukan meninggalkan heightmap sepenuhnya. Heightmap tetap menjadi representasi terbaik untuk 90% medan yang berupa permukaan sederhana. Solusinya adalah pendekatan hibrida: medan dasar heightmap dengan lapisan volumetrik di lokasi yang memerlukan geometri kompleks, pembuatan berbasis fisika untuk bentang alam realistis, dan sintesis neural untuk menghasilkan keragaman yang tidak dapat dicapai oleh noise.</p>
<h2 id="jawaban-singkat-apa-yang-sebenarnya-akan-kami-bangun" tabindex="-1">Jawaban Singkat: Apa yang Sebenarnya Akan Kami Bangun <a class="header-anchor" href="#jawaban-singkat-apa-yang-sebenarnya-akan-kami-bangun" aria-label="Permalink to &quot;Jawaban Singkat: Apa yang Sebenarnya Akan Kami Bangun&quot;"></a></h2>
<p>Sebelum membahasnya secara mendalam, berikut kerangka pengambilan keputusannya. Bagian selanjutnya dari artikel ini menjelaskan setiap komponennya.</p>
<h3 id="representasi-medan" tabindex="-1">Representasi medan <a class="header-anchor" href="#representasi-medan" aria-label="Permalink to &quot;Representasi medan&quot;"></a></h3>
<p>Gunakan sistem <strong>heightmap + SDF hibrida</strong>. Heightmap mencakup seluruh dunia (murah, ringkas, teruji). Volume SDF hanya tersedia di tempat yang memerlukan gua, bagian menjorok, atau fitur yang dipahat kreator (mungkin 5–10% chunk). Dengan demikian, 90% dunia tetap memiliki biaya setara heightmap sambil mendukung geometri arbitrer di tempat yang diperlukan.</p>
<h3 id="pipeline-pembuatan" tabindex="-1">Pipeline pembuatan <a class="header-anchor" href="#pipeline-pembuatan" aria-label="Permalink to &quot;Pipeline pembuatan&quot;"></a></h3>
<p>Jalankan di sisi server sebagai proses berantai:</p>
<ol>
<li><strong>Terrain Diffusion</strong> (atau MESA untuk prompt teks) menghasilkan heightmap dasar dari seed. Ini menggantikan noise dengan bentang alam realistis secara geologis yang dilatih menggunakan data elevasi nyata.</li>
<li><strong>Erosi analitis</strong> (hukum daya aliran) menyempurnakan heightmap dengan jaringan sungai dan garis punggungan dalam hitungan milidetik.</li>
<li><strong>TerraFusion atau Geodiffussr</strong> menghasilkan tekstur yang saling berkorelasi dari heightmap (atau gunakan aturan prosedural berbasis kemiringan/ketinggian sebagai fallback WebGL 2).</li>
<li><strong>Simulasi ekosistem</strong> menghasilkan peta kepadatan vegetasi.</li>
<li><strong>Erosi bergaya Arenite</strong> menghasilkan volume SDF untuk permukaan tebing, lengkungan, dan gua di tempat yang sesuai dengan karakter medannya.</li>
<li><strong>Bagi menjadi chunk, kompres, lalu unggah ke CDN.</strong> Rata-rata chunk: 2–8 KB. Chunk kompleks dengan data volumetrik: 20–100 KB.</li>
</ol>
<p>Kreator berinteraksi dengan pipeline ini dengan menyesuaikan parameter (&quot;lebih basah&quot;, &quot;lebih bergunung&quot;, &quot;tambahkan gua&quot;), membuat sketsa maksud desain, atau memahat langsung menggunakan kuas dan alat SDF.</p>
<h3 id="strategi-lod" tabindex="-1">Strategi LOD <a class="header-anchor" href="#strategi-lod" aria-label="Permalink to &quot;Strategi LOD&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Kemampuan browser</th>
<th>LOD heightmap</th>
<th>LOD volumetrik</th>
<th>LOD vegetasi</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>WebGPU</strong></td>
<td>Quadtree berbasis GPU (CDLOD) dengan compute culling + indirect draw</td>
<td>SDF multiresolusi dengan compute marching cubes + Transvoxel</td>
<td>ComputeInstanceCulling dengan indirect draw</td>
</tr>
<tr>
<td><strong>WebGL 2</strong></td>
<td>Geometry clipmap dengan pembaruan ring di sisi CPU</td>
<td>Mesh yang dibuat sebelumnya pada 2–3 tingkat LOD, lalu disimpan dalam cache</td>
<td>CPU frustum cull, InstancedMesh</td>
</tr>
</tbody>
</table>
<p>Kedua jalur menggunakan geomorphing dalam vertex shader agar transisi bebas dari efek popping. Keduanya menggunakan impostor billboard untuk vegetasi di kejauhan. Jalur WebGPU lebih cepat (anggaran medan 3,5 ms), tetapi jalur WebGL 2 tetap layak (6,5 ms).</p>
<h3 id="streaming" tabindex="-1">Streaming <a class="header-anchor" href="#streaming" aria-label="Permalink to &quot;Streaming&quot;"></a></h3>
<p>Pemuatan progresif: geometri medan terlebih dahulu (&lt;100 ms), tekstur kedua (&lt;300 ms), vegetasi ketiga (&lt;1 dtk), data volumetrik keempat (❤️ dtk). Lakukan prefetch berdasarkan kecepatan pemain. Anggaran memori: total 256 MB untuk medan.</p>
<h3 id="pengeditan" tabindex="-1">Pengeditan <a class="header-anchor" href="#pengeditan" aria-label="Permalink to &quot;Pengeditan&quot;"></a></h3>
<p>Kuas heightmap untuk memahat permukaan (menaikkan, menurunkan, menghaluskan, mengikis). Primitif SDF untuk pengeditan volumetrik (memahat gua, menambahkan lengkungan). Keduanya langsung diterapkan secara lokal, disinkronkan ke server dalam 100–300 ms, dan disiarkan kepada pemain lain melalui pembaruan delta.</p>
<h3 id="urutan-pembangunan" tabindex="-1">Urutan pembangunan <a class="header-anchor" href="#urutan-pembangunan" aria-label="Permalink to &quot;Urutan pembangunan&quot;"></a></h3>
<p><strong>Bulan 1–2: Medan heightmap dengan geometry clipmap.</strong> Hanya WebGL 2. Streaming dari CDN. Material prosedural berbasis kemiringan/ketinggian. Ini menampilkan medan di setiap browser. Gunakan noise + erosi analitis untuk pembuatannya (Terrain Diffusion dapat menyusul).</p>
<p><strong>Bulan 3–4: Vegetasi dan atmosfer.</strong> Rumput dan pepohonan dengan instancing GPU berdasarkan peta kepadatan. Langit prosedural dengan siklus siang/malam. Kabut atmosfer. Cascaded shadow map. Dunia mulai terasa seperti sebuah tempat yang nyata.</p>
<p><strong>Bulan 5–6: Pengeditan oleh kreator.</strong> Alat kuas heightmap. Sinkronisasi berbasis delta untuk pengeditan medan multipemain. Penguncian spasial untuk pengeditan serentak. Pada tahap inilah kreator mulai membentuk dunia.</p>
<p><strong>Bulan 7–9: Medan volumetrik dan jalur WebGPU.</strong> Lapisan SDF untuk gua dan bagian menjorok. Marching cubes dalam compute WebGPU. Transvoxel untuk batas LOD. Alat pemahatan SDF. Ini membuka toolkit kreasi lengkap.</p>
<p><strong>Bulan 10–12: Pembuatan neural dan penyempurnaan.</strong> Terrain Diffusion atau MESA untuk heightmap dasar. TerraFusion/Geodiffussr untuk tekstur. Noise fasor untuk detail mikro. Hex-tiling untuk mencegah pengulangan. Virtual texturing. Laplacian blending. Kualitas medan mencapai tingkat produksi.</p>
<p>Urutan ini berarti sesuatu yang dapat dimainkan tersedia setelah 2 bulan, sesuatu yang indah setelah 4 bulan, sesuatu yang dapat diedit setelah 6 bulan, dan sesuatu yang mutakhir setelah 12 bulan.</p>
<p>Bagian selanjutnya dari artikel ini membahas riset yang mendasari setiap keputusan.</p>
<h2 id="representasi-medan-di-luar-heightmap" tabindex="-1">Representasi Medan di Luar Heightmap <a class="header-anchor" href="#representasi-medan-di-luar-heightmap" aria-label="Permalink to &quot;Representasi Medan di Luar Heightmap&quot;"></a></h2>
<h3 id="signed-distance-field-sdf" tabindex="-1">Signed Distance Field (SDF) <a class="header-anchor" href="#signed-distance-field-sdf" aria-label="Permalink to &quot;Signed Distance Field (SDF)&quot;"></a></h3>
<p>Signed distance field menyimpan jarak ke permukaan terdekat pada setiap titik dalam ruang 3D. Nilai positif berada di luar, nilai negatif berada di dalam, dan persilangan nol merupakan permukaannya. SDF merepresentasikan bentuk 3D arbitrer, termasuk gua, lengkungan, dan geometri terapung.</p>
<p>Untuk merender SDF sebagai mesh, Anda menjalankan marching cubes (atau variannya) untuk mengekstrak persilangan nol sebagai segitiga. Resolusi mesh bergantung pada resolusi kisi: kisi SDF 256x256x256 menghasilkan medan yang mencakup sekitar satu chunk pada resolusi 1 meter.</p>
<p><strong>Implementasi browser:</strong> Marching cubes WebGPU berjalan sepenuhnya di GPU melalui compute shader. Implementasi <a href="https://www.willusher.io/webgpu-marching-cubes/" target="_blank" rel="noreferrer">webgpu-marching-cubes</a> buatan Will Usher memproses kisi 256^3 secara real-time di browser, dengan performa setara aplikasi native. Algoritma ini sangat mudah diparalelkan (setiap sel diproses secara independen), sehingga ideal untuk compute GPU.</p>
<div class="language-wgsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">wgsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">compute</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">workgroup_size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">fn</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> marchingCubes</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">builtin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(global_invocation_id) id: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">u32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> sdfValues </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> sampleSDF</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(id);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> caseIndex </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> classifyCell</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(sdfValues);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (caseIndex </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">==</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0u</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> ||</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> caseIndex </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">==</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 255u</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) { </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">; }</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> triangles </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lookupTriangulation</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(caseIndex);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> vertices </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> interpolateEdges</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(sdfValues, triangles);</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    appendToMeshBuffer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(vertices);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p><strong>Biaya penyimpanan:</strong> SDF 256^3 dengan presisi terkuantisasi 8-bit memerlukan 16 MB tanpa kompresi. Namun, sebagian besar volume kosong (jauh dari permukaan). Run-length encoding atau penyimpanan sparse octree biasanya menguranginya menjadi 100–500 KB per chunk, sebanding dengan medan heightmap.</p>
<p><strong>Pengeditan:</strong> Medan SDF secara alami dapat diedit. Penambahan material adalah operasi <code>min()</code> pada distance field. Penghapusan material (penggalian) adalah operasi <code>max()</code> dengan bentuk yang dinegasikan. Pencampuran halus antar-bentuk menggunakan <code>smoothMin()</code>. Operasi ini berjalan dalam compute shader dengan kecepatan interaktif.</p>
<h3 id="dual-contouring" tabindex="-1">Dual Contouring <a class="header-anchor" href="#dual-contouring" aria-label="Permalink to &quot;Dual Contouring&quot;"></a></h3>
<p>Marching cubes menempatkan vertex pada tepi kisi, sehingga menghasilkan permukaan halus tetapi menghilangkan fitur tajam (tepi tebing, sudut batu). Dual contouring menempatkan satu vertex per sel pada posisi yang paling baik merepresentasikan permukaan di dalam sel tersebut, sehingga mempertahankan tepi dan sudut tajam.</p>
<p>Algoritma ini memerlukan nilai distance field dan normal permukaan (gradien SDF) pada setiap titik kisi. Algoritma tersebut menyelesaikan masalah least-squares kecil per sel untuk menemukan posisi vertex yang optimal. Hasilnya adalah mesh yang menangkap medan halus sekaligus fitur bebatuan yang tajam.</p>
<p><strong>Neural Dual Contouring</strong> (Chen dkk., 2022, <a href="https://arxiv.org/abs/2202.01999" target="_blank" rel="noreferrer">arXiv:2202.01999</a>) mengganti solver least-squares dengan jaringan neural yang memprediksi posisi vertex dan persilangan tepi yang optimal. Metode ini menghasilkan akurasi rekonstruksi permukaan dan pelestarian fitur yang lebih baik, terutama untuk formasi batuan alami yang kompleks.</p>
<h3 id="algoritma-transvoxel" tabindex="-1">Algoritma Transvoxel <a class="header-anchor" href="#algoritma-transvoxel" aria-label="Permalink to &quot;Algoritma Transvoxel&quot;"></a></h3>
<p>Masalah tersulit dalam medan volumetrik bukanlah menghasilkan mesh, melainkan transisi LOD. Ketika chunk beresolusi tinggi berdampingan dengan chunk beresolusi rendah, mesh keduanya tidak sejajar pada batasnya sehingga menciptakan retakan yang terlihat.</p>
<p>Algoritma Transvoxel, yang dirancang oleh Eric Lengyel (<a href="https://transvoxel.org/" target="_blank" rel="noreferrer">transvoxel.org</a>), menyelesaikannya dengan menyisipkan sel transisi khusus di sepanjang batas antartingkat resolusi. Sel-sel ini menjembatani perbedaan resolusi menggunakan segitiga tambahan yang cocok secara presisi dengan kedua sisi. Algoritma ini menyederhanakan masalah batas yang kompleks menjadi 73 kelas ekuivalensi (dibandingkan sekitar 1,2 juta kasus untuk pendekatan brute-force).</p>
<p>Transvoxel dirancang secara khusus untuk aplikasi real-time yang data voxel-nya berubah secara dinamis (pengeditan oleh kreator, erosi, penambangan). Algoritma ini bebas paten dan telah digunakan dalam game yang dirilis (Space Engineers, Astroneer). Untuk dunia browser dengan medan volumetrik yang dapat diedit, Transvoxel adalah solusi LOD yang tepat.</p>
<h3 id="hibrida-dasar-heightmap-lapisan-volumetrik" tabindex="-1">Hibrida: Dasar Heightmap + Lapisan Volumetrik <a class="header-anchor" href="#hibrida-dasar-heightmap-lapisan-volumetrik" aria-label="Permalink to &quot;Hibrida: Dasar Heightmap + Lapisan Volumetrik&quot;"></a></h3>
<p>Pendekatan praktis untuk dunia terbuka di browser adalah sistem berlapis:</p>
<p><strong>Lapisan 1: Medan heightmap</strong> mencakup seluruh dunia. Ini merupakan representasi murah dan ringkas untuk perbukitan, lembah, dan pegunungan. Data di-streaming sebagai patch heightmap kecil per chunk (masing-masing 2–4 KB). Rendering menggunakan geometry clipmap dengan biaya GPU konstan.</p>
<p><strong>Lapisan 2: Lapisan volumetrik</strong> hanya tersedia dalam chunk yang memerlukan geometri kompleks. Gua, permukaan tebing, lengkungan, terowongan yang dipahat kreator, dan ruang bawah tanah disimpan sebagai volume SDF sparse. Hanya chunk yang memiliki data volumetrik yang menanggung biaya penyimpanan SDF dan marching cubes.</p>
<p><strong>Lapisan 3: Modifikasi kreator</strong> disimpan sebagai pengeditan SDF di atas lapisan dasar. Kreator yang menggali terowongan menyimpan bentuk SDF terowongan tersebut. Sistem rendering menggabungkan permukaan heightmap dengan pengurangan dan penambahan volumetrik untuk menghasilkan mesh akhir.</p>
<p>Sistem hibrida ini hampir tidak menambah biaya untuk medan datar (hanya heightmap) dan hanya meningkat skalanya di tempat yang memiliki kompleksitas. Dalam dunia pada umumnya, mungkin hanya 5–10% chunk yang memerlukan data volumetrik.</p>
<h2 id="pembuatan-medan-yang-akurat-secara-fisik" tabindex="-1">Pembuatan Medan yang Akurat secara Fisik <a class="header-anchor" href="#pembuatan-medan-yang-akurat-secara-fisik" aria-label="Permalink to &quot;Pembuatan Medan yang Akurat secara Fisik&quot;"></a></h2>
<p>Noise menghasilkan medan acak. Fisika menghasilkan medan realistis. Perbedaannya terlihat jelas: medan noise tidak memiliki struktur (permukaannya bergelombang acak di mana-mana), sedangkan medan fisik memiliki jaringan sungai, garis punggungan, kipas aluvial, dan lapisan tebing yang terbentuk dari erosi dan aktivitas tektonik.</p>
<h3 id="erosi-hidraulis-fondasinya" tabindex="-1">Erosi Hidraulis: Fondasinya <a class="header-anchor" href="#erosi-hidraulis-fondasinya" aria-label="Permalink to &quot;Erosi Hidraulis: Fondasinya&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/eaXk97ujbPQ" title="Petualangan Pemrograman: Erosi Hidraulis" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Implementasi erosi hidraulis Sebastian Lague sedang beraksi. Tetesan hujan yang disimulasikan mengalir menuruni lereng, mengikis material berdasarkan kecepatan dan kemiringan, lalu mengendapkan sedimen ketika kecepatannya menurun—mengubah noise datar menjadi lembah sungai, garis punggungan, dan kipas aluvial.</div>
<p>Air mengalir menuruni lereng, membawa sedimen, lalu mengendapkannya ketika alirannya melambat. Satu proses ini, yang disimulasikan selama jutaan tahun virtual, mengubah noise tanpa ciri menjadi medan dengan fitur geologis yang dapat dikenali.
Pendekatan berbasis partikel menjatuhkan tetesan hujan simulasi ke peta ketinggian. Setiap tetesan mengalir menuruni lereng (mengikuti gradien), mengikis material berdasarkan kecepatan dan kemiringan, membawa sedimen sebagai muatan terlarut, lalu mengendapkan sedimen ketika kecepatannya menurun atau kapasitasnya terlampaui. Setelah 200.000-500.000 partikel, medan membentuk:</p>
<ul>
<li><strong>Lembah sungai</strong> yang mengikuti jalur aliran air maksimum</li>
<li><strong>Garis punggungan</strong> yang memisahkan daerah aliran sungai</li>
<li><strong>Kipas aluvial</strong> di tempat lembah curam terbuka menuju dataran rata</li>
<li><strong>Lembah berbentuk V</strong> di medan pegunungan dan berbentuk U di medan glasial</li>
</ul>
<p><strong>Implementasi GPU:</strong> Simulasi partikel dapat diparalelkan. Setiap partikel bersifat independen (aproksimasi ini mengabaikan interaksi antarpartikel, yang tidak menjadi masalah untuk erosi). Shader komputasi WebGPU memproses 10.000 partikel per frame pada 60fps, menyelesaikan 200.000 partikel dalam waktu nyata sekitar 3 detik.</p>
<p>Implementasi sumber terbuka Sebastian Lague (<a href="https://github.com/SebLague/Hydraulic-Erosion" target="_blank" rel="noreferrer">GitHub</a>) adalah titik awal standar. Implementasi tersebut berjalan pada satu thread dalam C# dan memproses peta ketinggian 1024x1024 dalam beberapa detik. Versi GPU 50-100x lebih cepat.</p>
<h3 id="erosi-termal" tabindex="-1">Erosi Termal <a class="header-anchor" href="#erosi-termal" aria-label="Permalink to &quot;Erosi Termal&quot;"></a></h3>
<p>Air bukan satu-satunya kekuatan erosi. Perubahan suhu menyebabkan batuan retak dan hancur (pelapukan termal). Ketika kemiringan antara dua titik medan melampaui sudut diam suatu material, material jatuh dari titik yang lebih tinggi ke titik yang lebih rendah. Proses ini menghasilkan:</p>
<ul>
<li><strong>Lereng talus</strong> di dasar tebing (tumpukan batuan yang jatuh)</li>
<li><strong>Garis punggungan yang melunak</strong> seiring waktu</li>
<li><strong>Profil yang bergantung pada material</strong> (batuan keras mempertahankan lereng curam, sedangkan tanah lunak runtuh menjadi lereng landai)</li>
</ul>
<p>Erosi termal lebih sederhana daripada erosi hidraulis. Ini merupakan operasi lokal: untuk setiap sel, bandingkan perbedaan ketinggiannya dengan sel-sel tetangga. Jika kemiringan melampaui ambang batas, pindahkan material menuruni lereng. Proses ini berjalan sebagai satu pass shader komputasi per iterasi dan mencapai konvergensi dalam 50-100 iterasi.</p>
<p>Menggabungkan erosi hidraulis dan termal menghasilkan medan yang tampak jauh lebih alami daripada jika hanya menggunakan salah satunya. Air mengukir lembah; erosi termal melunakkan punggungan di antaranya dan mengisi dasar lembah dengan material runtuhan.</p>
<h3 id="hukum-daya-aliran-erosi-analitis" tabindex="-1">Hukum Daya Aliran: Erosi Analitis <a class="header-anchor" href="#hukum-daya-aliran-erosi-analitis" aria-label="Permalink to &quot;Hukum Daya Aliran: Erosi Analitis&quot;"></a></h3>
<p>Penelitian terbaru menawarkan alternatif untuk simulasi berbasis partikel. Hukum daya aliran (persamaan geomorfologi yang menghubungkan laju erosi dengan luas drainase dan kemiringan) dapat diselesaikan secara analitis alih-alih disimulasikan secara iteratif.</p>
<p>Cordonnier dkk. (2024, <a href="https://hal.science/hal-04525371" target="_blank" rel="noreferrer">HAL</a>) menggabungkan hukum daya aliran analitis dengan proses longsor dan difusi lereng bukit. Hasilnya adalah pembuatan medan yang berlandaskan fisika, tetapi berjalan sebagai fungsi matematis alih-alih simulasi temporal. Anda memasukkan peta ketinggian berbasis noise beserta parameter (tingkat curah hujan, kekerasan batuan, laju pengangkatan tektonik), lalu memperoleh medan yang tererosi dalam hitungan milidetik.</p>
<p>Pendekatan analitis ini ideal untuk dunia berbasis browser karena hanya berjalan sekali di sisi server saat pembuatan medan, bukan secara iteratif. Parameternya dapat disesuaikan oleh kreator (&quot;buat wilayah ini lebih bergunung-gunung&quot; menyesuaikan laju pengangkatan; &quot;buat lebih basah&quot; meningkatkan curah hujan dan memperdalam lembah).</p>
<h3 id="arenite-erosi-multifisika-siggraph-2025" tabindex="-1">Arenite: Erosi Multifisika (SIGGRAPH 2025) <a class="header-anchor" href="#arenite-erosi-multifisika-siggraph-2025" aria-label="Permalink to &quot;Arenite: Erosi Multifisika (SIGGRAPH 2025)&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/pl_GdrBSAmA" title="Arenite: Simulator Batu Pasir Berbasis Fisika (SIGGRAPH 2025)" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Arenite menyimulasikan tegangan, erosi angin, erosi fluvial, dan pengendapan partikel untuk menghasilkan lengkungan, hoodoo, dan bukit meja dari batuan berlapis. Pembuatan di sisi server menghasilkan volume SDF yang langsung disalurkan ke pipeline marching cubes.</div>
<p>Arenite (<a href="https://jango6324.github.io/arenite/" target="_blank" rel="noreferrer">Halaman proyek</a>) adalah simulator batu pasir berbasis fisika yang menghasilkan lengkungan, ceruk, hoodoo, dan bukit meja dari kondisi awal yang sederhana. Pengguna melukis peta ketererosian (lapisan batuan lunak vs. batuan keras) dan vegetasi, lalu sistem menyimulasikan:</p>
<ul>
<li><strong>Distribusi tegangan</strong> melalui kolom batuan</li>
<li><strong>Erosi angin</strong> yang secara selektif menghilangkan material lunak yang terekspos</li>
<li><strong>Erosi fluvial</strong> akibat aliran air</li>
<li><strong>Pengendapan partikel</strong> yang menciptakan formasi baru</li>
</ul>
<p>Implementasi GPU berjalan dalam waktu kurang dari 5 menit untuk formasi kompleks pada GPU desktop. Meskipun terlalu lambat untuk penggunaan browser secara real-time, ini cukup cepat untuk pembuatan di sisi server. Kreator dapat menentukan permukaan tebing dengan lapisan batuan lunak/keras dan memperoleh formasi lengkungan yang realistis dalam hitungan menit.</p>
<p>Keluarannya berupa medan voxel 3D, yang langsung cocok dengan pipeline SDF/marching cubes kita.</p>
<h3 id="erosi-fleksibel-pada-berbagai-representasi" tabindex="-1">Erosi Fleksibel pada Berbagai Representasi <a class="header-anchor" href="#erosi-fleksibel-pada-berbagai-representasi" aria-label="Permalink to &quot;Erosi Fleksibel pada Berbagai Representasi&quot;"></a></h3>
<p>Makalah tahun 2024 dari IRIT-STORM (&quot;Flexible Terrain Erosion,&quot; <a href="https://link.springer.com/article/10.1007/s00371-024-03444-w" target="_blank" rel="noreferrer">Springer</a>) memecahkan masalah praktis: sebagian besar metode erosi hanya berfungsi pada heightfield. Jika medan Anda menggunakan voxel, SDF, atau material berlapis, Anda memerlukan kode erosi terpisah untuk masing-masing representasi.</p>
<p>Metode erosi fleksibel menguraikan erosi menjadi dua proses independen: perubahan medan (menghilangkan material dari permukaan) dan pengangkutan material (memindahkan sedimen dengan partikel yang diatur oleh fisika dasar). Setiap partikel memiliki ukuran, densitas, restitusi, dan kapasitas sedimen yang dapat dikonfigurasi. Medan vektor opsional mengendalikan pergerakan partikel untuk menghasilkan dinamika fluida yang realistis.</p>
<p>Karena partikel berinteraksi dengan medan melalui antarmuka perubahan material terpadu, simulasi yang sama dapat digunakan pada heightfield, kisi voxel, permukaan implisit, dan tumpukan material berlapis. Untuk medan hibrida kita (dasar peta ketinggian + overlay SDF), ini berarti satu sistem erosi menangani kedua representasi. Simulasi partikel berjalan secara paralel pada GPU.</p>
<h3 id="jaringan-sungai-dan-daerah-aliran-sungai" tabindex="-1">Jaringan Sungai dan Daerah Aliran Sungai <a class="header-anchor" href="#jaringan-sungai-dan-daerah-aliran-sungai" aria-label="Permalink to &quot;Jaringan Sungai dan Daerah Aliran Sungai&quot;"></a></h3>
<p>Erosi mengukir sungai, tetapi menghasilkan jaringan sungai yang meyakinkan memerlukan lebih dari sekadar mengalirkan air menuruni lereng. Dua pendekatan berikut menghasilkan hasil yang lebih baik:</p>
<p><strong>Pembuatan yang mendahulukan drainase</strong> (Amit Patel, Red Blob Games, <a href="https://www.redblobgames.com/x/1723-procedural-river-growing/" target="_blank" rel="noreferrer">Proyek</a>) membangun jaringan sungai sebelum menetapkan elevasi. Mulailah dengan sebuah graf (Voronoi atau mesh segitiga). Klasifikasikan sisi sebagai punggungan (tidak ada aliran), jalur masuk (air mengalir masuk), atau saluran keluar (air mengalir keluar). Pendekatan ini menciptakan hierarki drainase yang realistis, tempat sungai menyatu dari anak-anak sungai kecil menjadi aliran air utama, dengan mengikuti sistem klasifikasi Rosgen untuk berbagai jenis sungai (saluran berjalin di medan datar, ngarai sempit di pegunungan).</p>
<p><strong>Akumulasi aliran</strong> melacak jumlah air yang melewati setiap sel medan. Jatuhkan hujan simulasi secara merata, alirkan ke bawah, lalu hitung jumlah lintasan pada setiap sel. Sel dengan akumulasi tinggi menjadi saluran sungai. Sel dengan akumulasi sedang menjadi aliran musiman. Peta akumulasi juga mengendalikan intensitas erosi (lebih banyak air = lebih banyak erosi) dan distribusi vegetasi (tepian sungai lebih basah sehingga mendukung spesies tumbuhan yang berbeda).</p>
<p>Untuk dunia buatan kreator, jaringan sungai dibuat di sisi server saat pembuatan medan dan disimpan sebagai peta arah aliran 2D beserta peta akumulasi air untuk setiap chunk. Klien browser menggunakan peta-peta ini untuk merender permukaan air (bidang datar pada ketinggian yang tepat di saluran sungai) dan mengendalikan distribusi vegetasi (lebih rimbun di dekat air).</p>
<h3 id="pembuatan-pesisir-dan-garis-pantai" tabindex="-1">Pembuatan Pesisir dan Garis Pantai <a class="header-anchor" href="#pembuatan-pesisir-dan-garis-pantai" aria-label="Permalink to &quot;Pembuatan Pesisir dan Garis Pantai&quot;"></a></h3>
<p>Pesisir adalah tempat medan bertemu air, dan memiliki ciri khas yang tidak dihasilkan oleh erosi standar: tebing laut, endapan pantai, dataran pasang surut, tunggul laut, dan pelataran abrasi.</p>
<p>NEWTS1.0 (2024, <a href="https://dspace.mit.edu/handle/1721.1/157677" target="_blank" rel="noreferrer">MIT</a>) memodelkan evolusi garis pantai berbatu menggunakan dua mekanisme erosi: kemunduran seragam (laju erosi konstan) dan erosi yang digerakkan gelombang (laju erosi sebagai fungsi jarak fetch dan sudut datang gelombang). Model ini berjalan selama ribuan tahun simulasi dan menghasilkan tanjung, teluk, tunggul laut, serta lengkungan yang sesuai dengan geomorfologi pesisir dunia nyata.</p>
<p>Untuk dunia berbasis browser, fitur pesisir akan dibuat terlebih dahulu saat penciptaan dunia. Parameternya (arah gelombang dominan, variasi kekerasan batuan di sepanjang pesisir) memungkinkan kreator mengendalikan karakter garis pantai mereka. Pengaturan &quot;fjord Norwegia&quot; menghasilkan ceruk dengan sisi curam. Pengaturan &quot;atol tropis&quot; menghasilkan pesisir berpasir rendah dengan laguna.</p>
<h3 id="pembuatan-gua-dan-area-bawah-tanah" tabindex="-1">Pembuatan Gua dan Area Bawah Tanah <a class="header-anchor" href="#pembuatan-gua-dan-area-bawah-tanah" aria-label="Permalink to &quot;Pembuatan Gua dan Area Bawah Tanah&quot;"></a></h3>
<p>Gua memerlukan medan yang sepenuhnya volumetrik (SDF atau voxel) karena peta ketinggian tidak dapat merepresentasikan ruang tertutup. Pendekatan pembuatannya meliputi:</p>
<p><strong>Penerapan ambang batas noise 3D</strong> adalah metode paling sederhana. Ambil sampel noise Perlin atau simplex 3D pada setiap voxel. Nilai di bawah ambang batas bersifat padat, sedangkan nilai di atasnya kosong. Sesuaikan ambang batas dan parameter noise untuk mengendalikan diameter terowongan, konektivitas, dan ukuran ruang. Metode ini menghasilkan sistem gua organik menyerupai cacing seperti di Minecraft.</p>
<p><strong>PLUME (Procedural Layer Underground Modeling Engine)</strong> (2024, <a href="https://arxiv.org/html/2508.20926v1" target="_blank" rel="noreferrer">arXiv:2508.20926</a>) menghasilkan lingkungan gua dan tabung lava yang realistis menggunakan aturan prosedural berlapis. Awalnya dibuat untuk penelitian eksplorasi ruang angkasa (menyimulasikan tabung lava Mars), sistem ini menghasilkan struktur bawah tanah yang masuk akal secara geologis, lengkap dengan stalaktit, kolom, dan sistem ruangan.</p>
<p><strong>Terowongan L-system dengan pengukiran metaball</strong> menggunakan tata bahasa L-system untuk menumbuhkan jalur terowongan bercabang menembus medan, lalu mengukir geometri terowongan sebenarnya menggunakan permukaan implisit metaball. Metaball menghasilkan dinding gua yang halus dan membulat. Beberapa pass dengan parameter berbeda menciptakan lorong utama, ruang samping, dan terowongan penghubung yang sempit.</p>
<p>Untuk dunia buatan kreator, pembuatan gua terhubung dengan sistem overlay SDF. Medan dasar berupa peta ketinggian (tanpa gua). Ketika suatu chunk memerlukan gua (baik dari pembuatan prosedural maupun desain kreator), volume SDF dibuat untuk mengurangi geometri gua dari medan dasar. Pipeline marching cubes merender permukaan gabungannya.</p>
<h3 id="vegetasi-sebagai-proses-fisik" tabindex="-1">Vegetasi sebagai Proses Fisik <a class="header-anchor" href="#vegetasi-sebagai-proses-fisik" aria-label="Permalink to &quot;Vegetasi sebagai Proses Fisik&quot;"></a></h3>
<p>Vegetasi dalam game biasanya ditempatkan secara prosedural dengan aturan seperti &quot;rumput di bawah 2000m, pohon di bawah 1500m, salju di atas 3000m.&quot; Cara ini cepat, tetapi menghasilkan distribusi yang seragam dan tidak realistis.</p>
<p>Simulasi vegetasi yang berlandaskan fisika memodelkan setiap tumbuhan sebagai organisme yang bersaing memperebutkan sumber daya (cahaya, air, unsur hara tanah). Simulasinya:</p>
<ol>
<li>Benih disebarkan ke seluruh medan</li>
<li>Setiap tumbuhan tumbuh berdasarkan sumber daya yang tersedia (air mengalir dari simulasi erosi hidraulis, sinar matahari bergantung pada kemiringan dan arah hadap lereng, sedangkan kedalaman tanah bergantung pada riwayat erosi)</li>
<li>Tumbuhan bersaing: pepohonan menaungi rumput, dan kanopi rapat mencegah tumbuhnya bibit baru</li>
<li>Seiring waktu simulasi, bioma muncul secara alami: hutan di lembah yang berair, vegetasi jarang di punggungan yang tersapu angin, dan lahan basah di tempat air menggenang</li>
</ol>
<p>Simulasi ekosistem Deussen dkk. (<a href="https://export.arxiv.org/pdf/2208.01471v1.pdf" target="_blank" rel="noreferrer">Makalah</a>) menghasilkan distribusi hutan yang sesuai dengan pola ekologi dunia nyata. Simulasi berjalan pada kisi 2D (satu sel per chunk medan) dan menghasilkan peta densitas serta penetapan spesies yang digunakan sistem rendering untuk penempatan vegetasi dengan instancing GPU.</p>
<p>Untuk dunia berbasis browser, simulasi vegetasi berjalan sekali saat pembuatan dunia (di sisi server). Keluarannya berupa sekumpulan peta densitas per chunk: densitas pohon, densitas rumput, densitas bunga, dan densitas serpihan batuan. Klien browser menggunakan peta-peta ini bersama instancing GPU untuk menyebarkan vegetasi saat runtime.</p>
<h2 id="sintesis-medan-berbasis-difusi" tabindex="-1">Sintesis Medan Berbasis Difusi <a class="header-anchor" href="#sintesis-medan-berbasis-difusi" aria-label="Permalink to &quot;Sintesis Medan Berbasis Difusi&quot;"></a></h2>
<p>Bidang ini berkembang paling cepat. Model difusi (teknologi yang sama di balik Stable Diffusion untuk gambar) mulai diterapkan pada pembuatan medan, dan hasilnya jauh lebih realistis daripada metode berbasis noise.</p>
<h3 id="terrain-diffusion-penerus-perlin-noise" tabindex="-1">Terrain Diffusion: Penerus Perlin Noise <a class="header-anchor" href="#terrain-diffusion-penerus-perlin-noise" aria-label="Permalink to &quot;Terrain Diffusion: Penerus Perlin Noise&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/hJoaCZ7wZ5s" title="Integrasi Terrain Diffusion dengan Minecraft" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Terrain Diffusion berjalan di dalam Minecraft, mengalirkan medan tak terbatas yang konsisten dengan seed secara real-time. Karena dilatih menggunakan data elevasi dunia nyata, sistem ini menghasilkan lanskap dengan struktur geologis yang tidak dapat ditandingi oleh fungsi noise.</div>
<p>Terrain Diffusion (Goslin, 2025, <a href="https://arxiv.org/abs/2512.08309" target="_blank" rel="noreferrer">arXiv:2512.08309</a>, <a href="https://xandergos.github.io/terrain-diffusion/" target="_blank" rel="noreferrer">Halaman proyek</a>) merupakan kemajuan paling signifikan dalam pembuatan medan prosedural sejak Perlin noise pada 1985. Karya ini kemudian diterima di SIGGRAPH 2026, dan judul arXiv kanonisnya kini adalah &quot;InfiniteDiffusion: Bridging Learned Fidelity and Procedural Utility for Open-World Terrain Generation.&quot; Algoritma InfiniteDiffusion dan framework Terrain Diffusion merupakan dua bagian dari makalah yang sama.</p>
<p>Inovasi utamanya adalah <strong>InfiniteDiffusion</strong>, algoritma yang memformulasikan ulang sampling difusi untuk domain tak terbatas. Model difusi tradisional menghasilkan keluaran berukuran tetap (misalnya, peta ketinggian 512x512). InfiniteDiffusion menghasilkan medan dengan bentang tak terbatas yang memiliki:</p>
<ul>
<li><strong>Konsistensi seed:</strong> Seed yang sama selalu menghasilkan medan yang sama, seperti Perlin noise</li>
<li><strong>Akses acak dalam waktu konstan:</strong> Anda dapat meminta ketinggian di titik mana pun tanpa perlu membuat wilayah tetangganya terlebih dahulu</li>
<li><strong>Tanpa artefak batas:</strong> Pembuatan tanpa batas tanpa sambungan atau pengulangan yang terlihat</li>
</ul>
<p>Sistem ini menggunakan tumpukan hierarkis model difusi. Tingkat teratas menangkap fitur berskala planet (benua, rangkaian pegunungan). Setiap tingkat berikutnya menambahkan detail yang lebih halus (puncak individual, lembah, kekasaran berskala kecil). Enkode Laplacian yang ringkas menstabilkan keluaran pada rentang dinamis yang sangat besar, mulai dari permukaan laut hingga puncak Himalaya.</p>
<p><strong>Performa:</strong> Kecepatan pembuatan mampu mengimbangi eksplorasi secara real-time. Makalah tersebut melaporkan bahwa bahkan pada kondisi ekstrem teoretis berupa kecepatan orbit (sekitar 7.700 m/s), sintesis medan berjalan 9x lebih cepat daripada penjelajahan pada GPU konsumen. Proyek ini menyertakan integrasi Minecraft yang mendemonstrasikan sintesis medan secara real-time.
<strong>Mengapa ini penting bagi kita:</strong> Terrain Diffusion menghasilkan lanskap yang dilatih dengan data elevasi dunia nyata (topografi Bumi yang sebenarnya). Keluarannya memiliki jaringan sungai, rangkaian pegunungan, fitur pesisir, dan struktur dataran tinggi yang berasal dari data pelatihan, bukan dari parameter derau yang disetel secara manual. Kreator dapat mengatakan &quot;hasilkan medan seperti Dataran Tinggi Skotlandia&quot;, lalu model difusi akan menghasilkan medan dengan karakter geologis yang sesuai.</p>
<p>Model berjalan di sisi server selama pembuatan dunia. Keluarannya berupa heightmap standar yang dialirkan ke browser seperti data medan lainnya. Metode pembuatannya tidak terlihat oleh klien.</p>
<h3 id="terrafusion-geometri-dan-tekstur-terpadu" tabindex="-1">TerraFusion: Geometri dan Tekstur Terpadu <a class="header-anchor" href="#terrafusion-geometri-dan-tekstur-terpadu" aria-label="Permalink to &quot;TerraFusion: Geometri dan Tekstur Terpadu&quot;"></a></h3>
<div class="img-embed">
<img src="https://cdn.cinevva.com/blog/terrafusion-teaser.png" alt="TerraFusion menghasilkan heightmap medan dan tekstur permukaan yang selaras secara terpadu dari sketsa menggunakan difusi laten" />
</div>
<div class="game-caption">TerraFusion menghasilkan heightmap dan tekstur secara bersamaan dari sketsa tangan. Korelasi antara geometri dan material sudah tertanam — dasar sungai menjadi berpasir, permukaan tebing berbatu, tanah datar berumput — tanpa pengecatan splat manual.</div>
<p>TerraFusion (2025, <a href="https://arxiv.org/abs/2505.04050" target="_blank" rel="noreferrer">arXiv:2505.04050</a>) melangkah lebih jauh dengan menghasilkan heightmap dan tekstur medan secara terpadu. Gagasan utamanya: geometri medan dan tampilan permukaan saling berkorelasi (dasar sungai berpasir, permukaan tebing berbatu, area datar berumput). Menghasilkannya secara terpisah akan menimbulkan ketidakselarasan.</p>
<p>TerraFusion menggunakan model difusi laten dengan VAE terpisah untuk heightmap dan tekstur, yang dilatih untuk memodelkan distribusi gabungan keduanya. Sistem ini mendukung:</p>
<ul>
<li><strong>Pembuatan tanpa kondisi:</strong> Medan acak yang masuk akal dengan tekstur yang selaras</li>
<li><strong>Pembuatan berbasis sketsa:</strong> Kreator menggambar peta kasar (lembah di sini, punggung bukit di sana, tebing di sepanjang sisi ini), lalu model menghasilkan geometri dan tekstur mendetail yang sesuai dengan sketsa</li>
</ul>
<p>Untuk dunia buatan kreator, kemampuan ini sangat berguna. Kreator membuat sketsa tata letak umum lahannya, lalu sistem melengkapinya dengan medan yang masuk akal secara geologis beserta material permukaan yang sesuai. Tidak perlu mengecat heightmap, membuat texture splatting, atau menetapkan material secara manual.</p>
<h3 id="mesa-teks-ke-medan" tabindex="-1">MESA: Teks ke Medan <a class="header-anchor" href="#mesa-teks-ke-medan" aria-label="Permalink to &quot;MESA: Teks ke Medan&quot;"></a></h3>
<div class="img-embed">
<img src="https://cdn.cinevva.com/blog/mesa-header.png" alt="MESA menghasilkan citra medan bergaya satelit dan peta elevasi dari perintah teks, dengan pelatihan menggunakan data Copernicus global" />
</div>
<div class="game-caption">MESA menghasilkan pasangan citra satelit dan DEM dari perintah teks. Karena dilatih menggunakan kumpulan data global Copernicus, model ini memahami medan nyata pada setiap skala dan zona iklim — fyord, stepa, lahan pertanian, punggung pegunungan alpen.</div>
<p>MESA (2025, <a href="https://arxiv.org/abs/2504.07210" target="_blank" rel="noreferrer">arXiv:2504.07210</a>, Lokakarya CVPR 2025) menghasilkan medan dari deskripsi teks. Model ini dilatih menggunakan data penginderaan jauh global dari program Copernicus sehingga mengenal setiap jenis lanskap daratan.</p>
<p>Perintah seperti &quot;sebuah fyord dengan dinding granit curam yang terbuka ke garis pantai berbatu&quot; menghasilkan heightmap dengan struktur geologis yang sesuai. &quot;Lahan pertanian bergelombang dengan perbukitan landai dan lembah sungai yang lebar&quot; menghasilkan sesuatu yang sama sekali berbeda.</p>
<p>MESA memperkenalkan kumpulan data ekstensi Major TOM Core-DEM, yang memasangkan citra satelit dengan model elevasi digital dari seluruh dunia. Data pelatihan ini memberikan pemahaman kepada model tentang tampilan medan nyata pada setiap skala dan di setiap zona iklim.</p>
<h3 id="geodiffussr-pemberian-tekstur-medan-berpanduan-teks" tabindex="-1">Geodiffussr: Pemberian Tekstur Medan Berpanduan Teks <a class="header-anchor" href="#geodiffussr-pemberian-tekstur-medan-berpanduan-teks" aria-label="Permalink to &quot;Geodiffussr: Pemberian Tekstur Medan Berpanduan Teks&quot;"></a></h3>
<div class="img-embed">
<img src="https://cdn.cinevva.com/blog/geodiffussr-teaser.png" alt="Geodiffussr menghasilkan tekstur medan dari deskripsi teks sambil mengikuti data elevasi — salju di puncak, pasir di pesisir, hutan di lereng" />
</div>
<div class="game-caption">Geodiffussr menerima heightmap dan perintah teks, lalu menghasilkan tekstur permukaan yang mengikuti elevasi. Salju hanya muncul di atas ketinggian yang masuk akal; vegetasi menipis seiring bertambahnya ketinggian; air mengisi cekungan. Geometri tetap tidak berubah.</div>
<p>Geodiffussr (2025, <a href="https://arxiv.org/abs/2511.23029" target="_blank" rel="noreferrer">arXiv:2511.23029</a>) menerima heightmap yang sudah ada dan menghasilkan tekstur berdasarkan deskripsi teks sambil tetap mengikuti data elevasi. &quot;Hutan musim gugur&quot; menghasilkan dedaunan jingga dan keemasan pada lereng sedang, dengan batuan terbuka pada permukaan yang curam. &quot;Pesisir tropis&quot; menghasilkan vegetasi palem di dataran rendah dengan pasir koral di permukaan laut.</p>
<p>Sistem ini menggunakan agregasi konten multiskala untuk memastikan penetapan tekstur mengikuti elevasi: salju hanya muncul di atas ketinggian yang masuk akal secara fisik, fitur perairan berada di cekungan, dan vegetasi menipis seiring bertambahnya ketinggian.</p>
<p>Untuk dunia buatan kreator, ini berarti tekstur medan dapat dibuat ulang dari perintah teks tanpa mengubah geometrinya. Kreator membentuk medan yang diinginkan, lalu mendeskripsikan suasananya (&quot;gurun vulkanis gelap&quot; atau &quot;hutan beriklim sedang yang rimbun&quot;), dan sistem akan menghasilkan material permukaan yang sesuai.</p>
<h2 id="lod-dinamis-untuk-medan-di-browser" tabindex="-1">LOD Dinamis untuk Medan di Browser <a class="header-anchor" href="#lod-dinamis-untuk-medan-di-browser" aria-label="Permalink to &quot;LOD Dinamis untuk Medan di Browser&quot;"></a></h2>
<p>Merender medan luas dengan resolusi penuh di semua tempat mustahil dilakukan di browser. Dunia berukuran 4 km x 4 km dengan resolusi 1 meter memiliki 16 juta vertex hanya untuk medannya. LOD dinamis menguranginya menjadi jumlah vertex yang konstan dan dapat dikelola, berapa pun ukuran dunianya.</p>
<h3 id="geometry-clipmap" tabindex="-1">Geometry Clipmap <a class="header-anchor" href="#geometry-clipmap" aria-label="Permalink to &quot;Geometry Clipmap&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/yoUQRT-Hmcc" title="Geometry clipmap: Rendering medan menggunakan grid reguler bertingkat (SIGGRAPH 2004)" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Presentasi asli geometry clipmap di SIGGRAPH 2004. Cincin medan konsentris dengan resolusi yang terus dibagi dua menjaga jumlah vertex tetap konstan berapa pun ukuran dunia — hingga kini masih menjadi landasan sebagian besar LOD medan di browser.</div>
<p>Geometry clipmap (Losasso dan Hoppe, SIGGRAPH 2004, <a href="https://hhoppe.com/geomclipmap.pdf" target="_blank" rel="noreferrer">Makalah</a>) tetap menjadi standar utama untuk LOD medan berbasis heightmap. Gagasannya: render medan sebagai serangkaian cincin persegi konsentris yang berpusat pada kamera. Setiap cincin mencakup area dua kali lebih luas daripada cincin sebelumnya, tetapi dengan separuh resolusinya.</p>
<p>Dekat dengan kamera (cincin terdalam): resolusi penuh, jarak grid 1 meter.
Satu cincin ke luar: jarak 2 meter, mencakup area 4x lebih luas.
Cincin berikutnya: jarak 4 meter, mencakup area 16x lebih luas.
Begitu seterusnya untuk 6-8 tingkat, hingga cincin terluar mencakup seluruh jarak pandang.</p>
<p>Jumlah total vertex bersifat konstan: kira-kira N^2 * tingkat, dengan N sebagai lebar cincin dalam satuan vertex. Dengan N=256 dan 8 tingkat, totalnya sekitar 500 ribu vertex. Beban rendering tetap sama baik dunia memiliki lebar 1 km maupun 100 km.</p>
<p><strong>Implementasi di browser:</strong> Geometry clipmap dapat digunakan di WebGL 2 karena hanya memerlukan pembaruan vertex buffer standar (tanpa compute shader). Saat kamera bergerak, CPU memperbarui data heightmap untuk setiap cincin dengan mengambil sampel medan pada resolusi yang sesuai. Vertex shader membaca nilai ketinggian dari tekstur dan menggeser grid datar.</p>
<p><strong>Morphing:</strong> Transisi antartingkat LOD menghasilkan efek &quot;popping&quot; yang terlihat jika ditangani secara naif. Geomorphing (dijelaskan secara khusus di bagian berikutnya) memadukan posisi vertex antartingkat melalui zona transisi di dalam vertex shader, sehingga menghasilkan transisi mulus tanpa popping dan tanpa biaya draw call tambahan.</p>
<h3 id="cdlod-clipmap-adaptif-berbasis-quadtree" tabindex="-1">CDLOD: Clipmap Adaptif Berbasis Quadtree <a class="header-anchor" href="#cdlod-clipmap-adaptif-berbasis-quadtree" aria-label="Permalink to &quot;CDLOD: Clipmap Adaptif Berbasis Quadtree&quot;"></a></h3>
<p>CDLOD (Strugar, 2014, <a href="https://www.vertexasylum.com/CDLOD/cdlod_latest.pdf" target="_blank" rel="noreferrer">Makalah</a>) menyempurnakan geometry clipmap dengan menggunakan quadtree sebagai pengganti cincin konsentris tetap. Quadtree menyesuaikan diri dengan medan: area datar menggunakan node kasar, sedangkan area yang sangat mendetail (tebing, punggung bukit) dibagi lebih halus.</p>
<p>Hal ini penting untuk dunia buatan kreator karena setiap chunk memiliki tingkat kerumitan berbeda. Padang rumput datar hanya memerlukan resolusi minimal. Wilayah pegunungan dengan tebing dan gua memerlukan detail maksimum. CDLOD mengalokasikan resolusi ke tempat yang benar-benar membutuhkannya.</p>
<p>Traversal quadtree di sisi CPU bersifat ringan (beberapa ratus node) dan menentukan patch medan mana yang perlu digambar serta pada resolusi berapa. GPU merender setiap patch sebagai grid terinstansiasi dengan uniform LOD per patch.</p>
<h3 id="concurrent-binary-tree-teselasi-berskala-planet" tabindex="-1">Concurrent Binary Tree: Teselasi Berskala Planet <a class="header-anchor" href="#concurrent-binary-tree-teselasi-berskala-planet" aria-label="Permalink to &quot;Concurrent Binary Tree: Teselasi Berskala Planet&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/0TzgFwDmbGg" title="Bereksperimen dengan Concurrent Binary Tree untuk Rendering Medan Berskala Besar" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Teselasi adaptif CBT untuk medan berskala planet: segitiga dibagi di dekat kamera dan digabungkan di kejauhan, seluruhnya di GPU. Kurang dari 0,2 md pada perangkat keras kelas konsol.</div>
<p>Concurrent Binary Tree (CBT) adalah struktur data yang ramah GPU untuk teselasi medan adaptif, yang dipresentasikan oleh Benyoub dan Dupuy (Intel, HPG 2024, <a href="https://arxiv.org/html/2407.02215v1" target="_blank" rel="noreferrer">Makalah</a>, <a href="https://github.com/AnisB/large_cbt" target="_blank" rel="noreferrer">GitHub</a>).</p>
<p>Gagasan utamanya: representasikan medan sebagai binary tree dengan setiap node berupa segitiga. Pembagian adaptif memecah segitiga yang dekat dengan kamera dan menggabungkan segitiga yang jauh. Binary tree seluruhnya berada di memori GPU sebagai array 1D (binary heap), sedangkan operasi pembagian/penggabungan dijalankan sebagai compute shader.</p>
<p>Makalah tahun 2024 tersebut memperluas CBT dari domain heightmap persegi ke mesh poligon arbitrer. Artinya, Anda dapat melakukan teselasi pada bola (untuk rendering planet) atau base mesh arbitrer (untuk dunia game dengan batas nonpersegi panjang). Peningkatan utamanya: menggunakan CBT sebagai pengelola pool memori alih-alih pengodean implisit memungkinkan tingkat pembagian yang jauh lebih tinggi.</p>
<p>Performa: teselasi medan berskala planet dalam waktu kurang dari 0,2 md pada perangkat keras kelas konsol. Algoritmanya menskalakan secara linear terhadap jumlah prosesor. Untuk WebGPU, teknologi ini menyediakan jalur menuju rendering medan berskala planet di browser, meskipun kompleksitas implementasinya tinggi.</p>
<h3 id="lod-berbasis-gpu-dengan-webgpu" tabindex="-1">LOD Berbasis GPU dengan WebGPU <a class="header-anchor" href="#lod-berbasis-gpu-dengan-webgpu" aria-label="Permalink to &quot;LOD Berbasis GPU dengan WebGPU&quot;"></a></h3>
<p>WebGPU memungkinkan pipeline medan yang sepenuhnya digerakkan GPU sehingga CPU tidak perlu terlibat dalam pengambilan keputusan LOD:</p>
<ol>
<li>
<p><strong>Compute pass 1: Frustum dan occlusion culling.</strong> Compute shader menguji bounding box setiap patch medan terhadap frustum tampilan dan occlusion buffer (depth buffer dari frame sebelumnya yang telah di-downsample). Patch yang tidak terlihat dibuang sepenuhnya.</p>
</li>
<li>
<p><strong>Compute pass 2: Pemilihan LOD.</strong> Untuk patch yang terlihat, hitung ukurannya dalam screen space dan pilih tingkat LOD yang sesuai. Tulis tingkat LOD dan ID patch ke indirect draw buffer.</p>
</li>
<li>
<p><strong>Compute pass 3: Pembuatan mesh (untuk medan volumetrik).</strong> Untuk chunk yang memiliki data SDF, jalankan marching cubes guna menghasilkan mesh pada resolusi LOD yang dipilih.</p>
</li>
<li>
<p><strong>Indirect draw.</strong> Satu panggilan <code>drawIndexedIndirect()</code> merender semua patch medan. GPU memutuskan semuanya: apa yang digambar, pada resolusi berapa, dan dalam urutan apa.</p>
</li>
</ol>
<p>Pipeline ini memiliki biaya CPU konstan (menjalankan compute shader dan indirect draw call), berapa pun ukuran atau kompleksitas dunia. GPU menangani semua keputusan per patch.</p>
<div class="language-wgsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">wgsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">compute</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">workgroup_size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">64</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">fn</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lodSelection</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">builtin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(global_invocation_id) id: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">u32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> patchIdx </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">x;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> bounds </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> patchBounds[patchIdx];</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">!</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">frustumTest</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(bounds, viewProjection)) { </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">; }</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">occlusionTest</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(bounds, depthPyramid) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">==</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> OCCLUDED</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) { </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">; }</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> screenSize </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> projectedSize</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(bounds, viewProjection, screenDimensions);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> lod </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> clamp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">u32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">log2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(maxScreenSize </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> screenSize)), </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0u</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, MAX_LOD);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> drawIdx </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> atomicAdd</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">&#x26;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">drawCount, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1u</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    drawArgs[drawIdx] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> DrawArgs</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(patchIdx, lod, indexCount[lod], indexOffset[lod]);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><h3 id="geomorphing-transisi-lod-tanpa-popping" tabindex="-1">Geomorphing: Transisi LOD Tanpa Popping <a class="header-anchor" href="#geomorphing-transisi-lod-tanpa-popping" aria-label="Permalink to &quot;Geomorphing: Transisi LOD Tanpa Popping&quot;"></a></h3>
<p>Artefak visual terbesar pada LOD medan adalah popping: vertex mendadak berpindah ke posisi baru saat sebuah patch beralih tingkat LOD. Geomorphing menghilangkan masalah ini dengan menginterpolasi posisi vertex secara mulus antartingkat LOD melalui zona transisi.</p>
<p>Implementasinya seluruhnya berada di vertex shader. Setiap vertex menyimpan posisi LOD saat ini sekaligus posisi LOD berikutnya yang lebih kasar. Saat jarak kamera melewati ambang transisi, faktor morph memadukan keduanya:</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> morphFactor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(lodNear, lodFar, distanceToCamera);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> morphedHeight </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mix</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(fineLodHeight, coarseLodHeight, morphFactor);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">gl_Position</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> viewProjection </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(worldPos.x, morphedHeight, worldPos.z, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span></code></pre>
</div><p>Makalah geometry clipmap Hoppe (GPU Gems 2, <a href="https://developer.nvidia.com/gpugems/gpugems2/part-i-geometric-complexity/chapter-2-terrain-rendering-using-gpu-based-geometry" target="_blank" rel="noreferrer">Bab 2</a>) menjelaskan implementasi lengkap untuk cincin clipmap. Zona morph adalah 20% bagian terluar dari setiap cincin. Di dalam zona ini, vertex secara mulus menyatu menuju resolusi cincin berikutnya. Efek visualnya: geometri medan &quot;melebur&quot; di antara tingkat detail alih-alih berubah secara mendadak. Pada kecepatan kamera normal, transisinya tidak terlihat.</p>
<p>Pemaduan dalam image space (Scherzer dkk., <a href="https://onlinelibrary.wiley.com/doi/10.1111/j.1467-8659.2007.00943.x" target="_blank" rel="noreferrer">Makalah</a>) merupakan alternatif yang memadukan gambar hasil rendering dari dua tingkat LOD dalam screen space. Metode ini menangani perbedaan LOD yang lebih ekstrem (misalnya transisi mesh ke billboard), tetapi memerlukan render pass tambahan untuk zona transisi.</p>
<h3 id="culling-vegetasi-berbasis-gpu" tabindex="-1">Culling Vegetasi Berbasis GPU <a class="header-anchor" href="#culling-vegetasi-berbasis-gpu" aria-label="Permalink to &quot;Culling Vegetasi Berbasis GPU&quot;"></a></h3>
<p>Vegetasi (pohon, rumput, bebatuan) sering kali menjadi sumber draw call terbesar dalam dunia terbuka. Pendekatan naif menggambar setiap instance vegetasi pada setiap frame. Culling berbasis GPU, yang kini tersedia di Three.js melalui WebGPU, menghapus instance yang tidak terlihat sebelum mencapai rasterizer.</p>
<p><code>ComputeInstanceCulling</code> milik Three.js (<a href="https://www.threejs-blocks.com/docs/ComputeInstanceCulling" target="_blank" rel="noreferrer">Dokumentasi</a>) menyediakan frustum culling dan LOD culling untuk instanced mesh, dengan peningkatan performa 10-100x pada jumlah instance yang besar. Pipeline-nya:</p>
<ol>
<li>Compute shader membaca semua bounding sphere instance</li>
<li>Menguji masing-masing terhadap frustum kamera (pengujian 6 bidang)</li>
<li>Menerapkan LOD berbasis jarak: instance yang melewati ambang batas beralih ke detail lebih rendah atau di-cull sepenuhnya</li>
<li>Instance yang lolos dipadatkan ke dalam buffer dan digambar melalui <code>drawIndirect</code>
CPU tidak melakukan pekerjaan per instans sama sekali. Setelah penyiapan awal, biayanya hanya satu dispatch komputasi ditambah satu indirect draw call per jenis vegetasi, berapa pun jumlah instansnya.</li>
</ol>
<p>Untuk vegetasi yang lebih lebat, <code>IndirectBatchedMesh</code> milik Three.js (<a href="https://www.threejs-blocks.com/docs/IndirectBatchedMesh" target="_blank" rel="noreferrer">Dokumentasi</a>) mengemas beberapa jenis geometri (pohon, semak, batu) ke dalam satu buffer dan menggambarnya dengan multi-draw indirect. Hanya satu draw call untuk seluruh vegetasi dalam sebuah chunk.</p>
<p>Jika digabungkan dengan penyebaran berbasis peta kepadatan dari sistem vegetasi kami, artinya: peta kepadatan menghasilkan 50.000 posisi helai rumput dalam compute shader, tahap culling menghilangkan 70% yang berada di luar layar atau terlalu jauh, dan satu indirect draw call merender 15.000 helai yang tersisa. Total biaya CPU: dapat diabaikan.</p>
<h3 id="lod-untuk-medan-volumetrik" tabindex="-1">LOD untuk Medan Volumetrik <a class="header-anchor" href="#lod-untuk-medan-volumetrik" aria-label="Permalink to &quot;LOD untuk Medan Volumetrik&quot;"></a></h3>
<p>Medan volumetrik (SDF + marching cubes) memerlukan sistem LOD tersendiri karena mesh-nya dihasilkan, bukan dibuat sebelumnya. Pendekatannya:</p>
<p><strong>Penyimpanan SDF multiresolusi.</strong> Simpan SDF pada beberapa resolusi dalam hierarki mirip mipmap. Level 0 memiliki resolusi penuh (voksel 1 meter). Level 1 menggunakan voksel 2 meter (data 8x lebih sedikit). Level 2 menggunakan voksel 4 meter. Pada setiap level, SDF di-downsample dengan mengambil jarak absolut minimum.</p>
<p><strong>Marching cubes yang dipilih berdasarkan LOD.</strong> Jalankan marching cubes pada level SDF yang sesuai dengan LOD yang diinginkan. Chunk jarak dekat menggunakan level 0. Chunk yang jauh menggunakan level 2 atau 3. Algoritma Transvoxel menangani batas di antara level yang berbeda.</p>
<p><strong>Caching.</strong> Mesh yang dihasilkan disimpan dalam cache hingga SDF berubah (karena pengeditan kreator) atau level LOD berubah (kamera berpindah cukup jauh). Untuk medan statis, mesh dibuat sekali lalu digunakan kembali.</p>
<h2 id="arsitektur-streaming-untuk-medan" tabindex="-1">Arsitektur Streaming untuk Medan <a class="header-anchor" href="#arsitektur-streaming-untuk-medan" aria-label="Permalink to &quot;Arsitektur Streaming untuk Medan&quot;"></a></h2>
<h3 id="format-data-chunk" tabindex="-1">Format Data Chunk <a class="header-anchor" href="#format-data-chunk" aria-label="Permalink to &quot;Format Data Chunk&quot;"></a></h3>
<p>Setiap chunk medan (64x64 meter) dialirkan sebagai paket biner ringkas:</p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>ChunkPacket {</span></span>
<span class="line"><span>  header: {</span></span>
<span class="line"><span>    chunkX: i16, chunkZ: i16,</span></span>
<span class="line"><span>    version: u32,</span></span>
<span class="line"><span>    flags: u8  // hasHeightmap | hasVolumetric | hasVegetation</span></span>
<span class="line"><span>  }</span></span>
<span class="line"><span>  heightmap: {</span></span>
<span class="line"><span>    resolution: u8,      // 65x65 for full, 33x33 for half, 17x17 for quarter</span></span>
<span class="line"><span>    quantizedHeights: u16[resolution * resolution],  // delta-encoded, zlib compressed</span></span>
<span class="line"><span>    splatMap: u8[4 * resolution * resolution]         // RGBA blend weights, LZ4 compressed</span></span>
<span class="line"><span>  }</span></span>
<span class="line"><span>  volumetric?: {         // only present if flags.hasVolumetric</span></span>
<span class="line"><span>    sdfResolution: u8,   // typically 32 or 64</span></span>
<span class="line"><span>    sparseOctree: bytes  // run-length encoded sparse SDF</span></span>
<span class="line"><span>  }</span></span>
<span class="line"><span>  vegetation?: {         // only present if flags.hasVegetation</span></span>
<span class="line"><span>    treeDensityMap: u8[16 * 16],    // 4m resolution density grid</span></span>
<span class="line"><span>    grassDensityMap: u8[32 * 32],   // 2m resolution density grid</span></span>
<span class="line"><span>    rockDensityMap: u8[16 * 16]</span></span>
<span class="line"><span>  }</span></span>
<span class="line"><span>  creatorObjects: {</span></span>
<span class="line"><span>    count: u16,</span></span>
<span class="line"><span>    objects: PlacedObject[]   // assetId + transform + properties, ~40 bytes each</span></span>
<span class="line"><span>  }</span></span>
<span class="line"><span>}</span></span></code></pre>
</div><p><strong>Ukuran umum:</strong></p>
<ul>
<li>Chunk yang hanya berisi heightmap (medan datar): 2–4 KB setelah dikompresi</li>
<li>Heightmap + vegetasi: 4–8 KB</li>
<li>Heightmap + volumetrik + vegetasi (chunk kompleks): 20–100 KB</li>
<li>Area 5x5 dengan detail penuh: total 50–500 KB</li>
</ul>
<h3 id="pemuatan-chunk-progresif" tabindex="-1">Pemuatan Chunk Progresif <a class="header-anchor" href="#pemuatan-chunk-progresif" aria-label="Permalink to &quot;Pemuatan Chunk Progresif&quot;"></a></h3>
<p>Chunk dimuat berdasarkan urutan prioritas yang ditentukan oleh jarak, arah pergerakan, dan jenis data:</p>
<p><strong>Prioritas 1 (segera, &lt;100 md):</strong> Geometri heightmap untuk chunk yang akan dimasuki pemain. Permukaan medan muncul terlebih dahulu. Bahkan pada resolusi terendah (17x17 per chunk), permukaannya sudah tersedia.</p>
<p><strong>Prioritas 2 (cepat, &lt;300 md):</strong> Splat map dan tekstur medan. Permukaan mendapatkan warna.</p>
<p><strong>Prioritas 3 (streaming, &lt;1 dtk):</strong> Peningkatan ke heightmap beresolusi penuh. Peta kepadatan vegetasi. GPU instancing menghasilkan pohon dan rumput.</p>
<p><strong>Prioritas 4 (latar belakang, ❤️ dtk):</strong> Data SDF volumetrik untuk chunk yang memiliki gua atau tonjolan menggantung. Marching cubes menghasilkan mesh di dalam Web Worker, lalu mentransfer buffer ke thread utama.</p>
<p><strong>Prioritas 5 (lazy, &lt;10 dtk):</strong> Objek yang ditempatkan kreator. Tekstur beresolusi tinggi untuk struktur. Objek detail seperti bunga, batu kecil, dan puing-puing.</p>
<h3 id="pengambilan-awal-prediktif" tabindex="-1">Pengambilan Awal Prediktif <a class="header-anchor" href="#pengambilan-awal-prediktif" aria-label="Permalink to &quot;Pengambilan Awal Prediktif&quot;"></a></h3>
<p>Jangan menunggu pemain memasuki sebuah chunk sebelum memuatnya. Prediksi arah tujuan mereka berdasarkan kecepatan, lalu muat area di depan:</p>
<ul>
<li><strong>Kecepatan berjalan (5 km/jam):</strong> Ambil lebih awal 2 chunk di depan (128 m). Dengan latensi broadband umum, ini memberikan waktu pendahuluan 200–400 md.</li>
<li><strong>Berlari/berkendara (15 km/jam):</strong> Ambil lebih awal 4 chunk di depan. Cincin pemuatan bergeser mengikuti arah kecepatan.</li>
<li><strong>Terbang/perjalanan cepat:</strong> Jeda rendering selama transisi. Alirkan chunk tujuan dengan prioritas tertinggi. Lanjutkan rendering ketika data yang tersedia sudah cukup untuk frame pertama.</li>
</ul>
<p>Sistem pengambilan awal melacak chunk yang ada dalam cache, yang sedang dalam proses pengiriman (sudah diminta tetapi belum tiba), dan yang diperlukan. Antrean prioritas mengurutkan permintaan tertunda berdasarkan urgensi. Batalkan permintaan untuk chunk yang sudah dijauhi pemain.</p>
<h3 id="anggaran-memori-dan-eviksi" tabindex="-1">Anggaran Memori dan Eviksi <a class="header-anchor" href="#anggaran-memori-dan-eviksi" aria-label="Permalink to &quot;Anggaran Memori dan Eviksi&quot;"></a></h3>
<p>Sebuah tab browser mendapatkan 2–4 GB di desktop. Sistem medan perlu menggunakan hanya sebagian dari jumlah tersebut (sisanya untuk rendering, fisika, jaringan, dan heap JavaScript).</p>
<p><strong>Target anggaran: 256 MB untuk seluruh data medan.</strong></p>
<p>Dengan ukuran chunk umum kami:</p>
<ul>
<li>Chunk detail penuh dalam cache: ~100 (area 10x10), masing-masing 5–100 KB = 5–10 MB untuk data mentah</li>
<li>Geometri medan GPU: ~50 MB (vertex buffer dan index buffer untuk medan yang terlihat)</li>
<li>Tekstur medan: ~100 MB (dikompresi dengan KTX2 dan dikemas dalam atlas)</li>
<li>Buffer instans vegetasi: ~50 MB (posisi, rotasi, dan skala untuk GPU instancing)</li>
<li>Volume SDF dan mesh marching cubes dalam cache: ~50 MB</li>
</ul>
<p>Chunk di luar jangkauan pandang dikeluarkan dari memori GPU terlebih dahulu (tekstur, vertex buffer), lalu dari cache CPU. Data heightmap mentah dikeluarkan paling akhir karena paling murah untuk disimpan dan paling penting agar tersedia ketika pemain berbalik arah.</p>
<h2 id="transisi-bioma-dan-anti-tiling" tabindex="-1">Transisi Bioma dan Anti-Tiling <a class="header-anchor" href="#transisi-bioma-dan-anti-tiling" aria-label="Permalink to &quot;Transisi Bioma dan Anti-Tiling&quot;"></a></h2>
<h3 id="batas-bioma-yang-mulus" tabindex="-1">Batas Bioma yang Mulus <a class="header-anchor" href="#batas-bioma-yang-mulus" aria-label="Permalink to &quot;Batas Bioma yang Mulus&quot;"></a></h3>
<p>Bentang alam nyata tidak memiliki batas tegas di antara bioma. Hutan tidak berhenti pada sebuah garis lalu langsung berubah menjadi gurun. Ada gradasi: hutan lebat menipis menjadi pepohonan yang tersebar, lalu semak belukar, kemudian vegetasi gurun yang jarang. Jika ini diterapkan dengan benar, dunia akan terasa berkesinambungan, bukan seperti susunan petak.</p>
<p><strong>AutoBiomes</strong> (Kötter dkk., <a href="https://cgvr.cs.uni-bremen.de/papers/cgi20/AutoBiomes.pdf" target="_blank" rel="noreferrer">Makalah</a>) menggabungkan pembuatan medan prosedural dengan simulasi iklim yang disederhanakan. Suhu, kelembapan, dan elevasi menentukan jenis bioma pada setiap titik. Di antara bioma, bobot material dan kepadatan vegetasi diinterpolasi sepanjang zona transisi (biasanya selebar 50–100 meter). Lebar transisi berbeda untuk setiap pasangan bioma: transisi hutan ke padang rumput lebar dan bertahap, sedangkan transisi tebing ke air sempit dan mendadak.</p>
<p>Untuk dunia buatan kreator, penetapan bioma dijalankan pada grid kasar (satu sampel bioma per area 16x16 meter). Shader medan membaca nilai bioma untuk fragmen saat ini dan tetangganya, menginterpolasi bobot material di zona transisi, lalu memadukan tekstur sesuai hasilnya. Penyebaran vegetasi menggunakan nilai kepadatan terinterpolasi yang sama, sehingga kepadatan pohon berkurang secara bertahap di tepi hutan.</p>
<p>Kontrol kreator: izinkan kreator mengecat penggantian bioma pada petak mereka. Sistem menghasilkan bioma bawaan berdasarkan karakteristik medan, tetapi kreator dapat menggantinya. Cat &quot;rawa&quot; pada area dataran rendah, lalu material akan berubah menjadi air keruh, lumut, dan pepohonan mati. Peta cat bioma adalah grid ID bioma 16x16 per chunk (256 byte) yang menggantikan penetapan prosedural.</p>
<h3 id="hex-tiling-menghilangkan-pengulangan-tekstur" tabindex="-1">Hex-Tiling: Menghilangkan Pengulangan Tekstur <a class="header-anchor" href="#hex-tiling-menghilangkan-pengulangan-tekstur" aria-label="Permalink to &quot;Hex-Tiling: Menghilangkan Pengulangan Tekstur&quot;"></a></h3>
<p>Artefak visual yang paling umum dalam rendering medan adalah pengulangan tekstur. Tekstur rumput berukuran 1 meter yang diulang pada padang rumput selebar 100 meter menghasilkan pola grid yang terlihat. Dua teknik dapat mengatasinya:</p>
<p><strong>Hex-tiling</strong> (Mikkelsen, <a href="https://github.com/mmikk/hextile-demo" target="_blank" rel="noreferrer">Demo</a>) mengganti grid pengulangan berbentuk persegi dengan grid heksagonal. Setiap petak heksagonal mengambil sampel tekstur dengan offset dan rotasi acak. Batas heksagonal dipadukan untuk menyembunyikan sambungan. Hasilnya adalah permukaan yang tampak acak secara merata, bukan seperti tekstur berulang. Biaya: sekitar 3 sampel tekstur tambahan per fragmen. Teknik ini banyak digunakan dalam gim produksi dan dapat berjalan di shader fragmen apa pun.</p>
<p><strong>Pemfilteran tekstur stokastik</strong> (Pharr dkk., NVIDIA, 2024, <a href="https://research.nvidia.com/labs/rtr/publication/pharr2024stochtex/" target="_blank" rel="noreferrer">Makalah</a>) menerapkan pemfilteran setelah shading, bukan sebelumnya, dengan menggunakan sampling stokastik. Galat dari sampling stokastik sangat kecil dan dapat ditangani dengan baik oleh denoising spasiotemporal. Teknik ini menghasilkan pemfilteran yang lebih akurat dan dapat digunakan dengan tekstur terkompresi atau sparse. Untuk medan, teknik ini menghilangkan artefak pengulangan sekaligus artefak pemfilteran yang terkadang muncul akibat hex-tiling pada area transisi.</p>
<p>Untuk dunia berbasis browser, hex-tiling adalah pilihan praktis (dapat digunakan dalam shader apa pun). Pemfilteran stokastik memerlukan infrastruktur lebih banyak, tetapi menghasilkan kualitas lebih baik jika denoising temporal tersedia (seperti pada jalur WebGPU dengan TAA).</p>
<h2 id="sistem-material-medan" tabindex="-1">Sistem Material Medan <a class="header-anchor" href="#sistem-material-medan" aria-label="Permalink to &quot;Sistem Material Medan&quot;"></a></h2>
<h3 id="pemetaan-triplanar" tabindex="-1">Pemetaan Triplanar <a class="header-anchor" href="#pemetaan-triplanar" aria-label="Permalink to &quot;Pemetaan Triplanar&quot;"></a></h3>
<p>Tekstur dengan pemetaan UV standar mengalami peregangan parah pada lereng curam karena koordinat UV terkompresi. Pemetaan triplanar memproyeksikan tekstur sepanjang ketiga sumbu (X, Y, Z) dan memadukannya berdasarkan normal permukaan:</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> blending </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> abs</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(normal);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">blending </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> normalize</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">max</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(blending, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.00001</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">));</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">blending </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">/=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (blending.x </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> blending.y </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> blending.z);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> xaxis </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> texture</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(material, worldPos.yz </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70"> scale</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> yaxis </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> texture</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(material, worldPos.xz </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70"> scale</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> zaxis </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> texture</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(material, worldPos.xy </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70"> scale</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> color </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> xaxis </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> blending.x </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> yaxis </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> blending.y </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> zaxis </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> blending.z;</span></span></code></pre>
</div><p>Permukaan tebing mendapatkan proyeksi X atau Z (tanpa peregangan). Tanah datar mendapatkan proyeksi Y. Pemaduannya mulus dan otomatis. Tidak memerlukan UV unwrapping.</p>
<p>Babylon.js memiliki <a href="https://doc.babylonjs.com/toolsAndResources/assetLibraries/materialsLibrary/triPlanarMat" target="_blank" rel="noreferrer">Material TriPlanar</a> bawaan. Three.js memerlukan shader khusus, tetapi implementasinya hanya sekitar 30 baris GLSL.</p>
<p>Untuk medan PBR, terapkan pemetaan triplanar ke semua kanal: albedo, normal, roughness, dan ambient occlusion. Bobot pemaduan yang sama diterapkan ke setiap kanal.</p>
<h3 id="penetapan-material-berdasarkan-kemiringan-dan-ketinggian" tabindex="-1">Penetapan Material Berdasarkan Kemiringan dan Ketinggian <a class="header-anchor" href="#penetapan-material-berdasarkan-kemiringan-dan-ketinggian" aria-label="Permalink to &quot;Penetapan Material Berdasarkan Kemiringan dan Ketinggian&quot;"></a></h3>
<p>Alih-alih mengecat splat map secara manual, tetapkan material secara prosedural berdasarkan karakteristik medan:</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> slope </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> acos</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">dot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(normal, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)));</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> altitude </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> worldPos.y;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> grassWeight </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, slope) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2000.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1500.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, altitude);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> rockWeight </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, slope);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> snowWeight </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2500.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">3000.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, altitude) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, slope);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> sandWeight </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">5.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, altitude) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.15</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, slope);</span></span></code></pre>
</div><p>Tanah datar pada ketinggian rendah mendapatkan rumput. Lereng curam mendapatkan batu. Ketinggian tinggi mendapatkan salju (tetapi hanya pada permukaan yang cukup datar agar salju dapat menumpuk). Area di dekat permukaan laut mendapatkan pasir. Transisinya mulus dan didasarkan pada kondisi fisik.</p>
<p>Untuk dunia buatan kreator, tampilkan ambang ketinggian dan zona pemaduan sebagai parameter yang dapat dicat per chunk. Kreator dapat menaikkan atau menurunkan garis pepohonan, memperluas cakupan salju, atau mengubah bukit berumput menjadi gurun pasir dengan menyesuaikan aturan material untuk petak mereka.</p>
<h3 id="pemaduan-tekstur-laplacian-yang-ramah-gpu" tabindex="-1">Pemaduan Tekstur Laplacian yang Ramah GPU <a class="header-anchor" href="#pemaduan-tekstur-laplacian-yang-ramah-gpu" aria-label="Permalink to &quot;Pemaduan Tekstur Laplacian yang Ramah GPU&quot;"></a></h3>
<p>Pemaduan tekstur standar (interpolasi linear antar-lapisan) menghasilkan sambungan yang terlihat atau hasil pudar dengan kontras rendah. Pemaduan piramida Laplacian mengatasi masalah ini, tetapi secara tradisional memerlukan prakomputasi yang mahal.</p>
<p>Wronski (NVIDIA, 2025, <a href="https://jcgt.org/published/0014/01/02/" target="_blank" rel="noreferrer">JCGT</a>) menyajikan varian ramah GPU yang bekerja dalam shader waktu nyata tanpa prakomputasi dan tanpa memori tambahan. Teknik ini menggunakan rangkaian mipmap standar sebagai pendekatan piramida Laplacian: ambil sampel tekstur pada level mip saat ini dan level yang lebih kasar, hitung selisihnya (Laplacian), lalu padukan kontribusi Laplacian dari setiap lapisan.</p>
<p>Hasilnya mempertahankan fitur lokal yang tajam (helai rumput individual, retakan batu) sekaligus berpadu mulus pada skala yang lebih besar. Biayanya adalah beberapa pengambilan sampel tekstur tambahan per fragmen. Untuk medan yang memadukan 4 atau lebih lapisan material per piksel, teknik ini menghasilkan kualitas yang jauh lebih baik daripada pemaduan linear, terutama pada transisi antara rumput, batu, dan pasir.</p>
<h3 id="noise-phasor-untuk-detail-erosi" tabindex="-1">Noise Phasor untuk Detail Erosi <a class="header-anchor" href="#noise-phasor-untuk-detail-erosi" aria-label="Permalink to &quot;Noise Phasor untuk Detail Erosi&quot;"></a></h3>
<p>Medan standar sering terlihat datar dari jarak dekat karena simulasi erosi bekerja pada resolusi heightmap (grid 1 meter). Medan nyata memiliki pola erosi skala halus (alur kecil, parit, dan retakan akibat pelapukan) pada skala sentimeter.</p>
<p>Grenier dkk. (2024, <a href="https://diglib.eg.org/bitstream/handle/10.1111/cgf14992/v43i1_05_cgf14992.pdf" target="_blank" rel="noreferrer">CGF</a>) menggunakan noise phasor untuk menambahkan detail mikro medan secara waktu nyata. Noise phasor menyintesis pola terstruktur dengan menentukan medan fase stokastik yang dimasukkan ke fungsi periodik. Saat diterapkan pada medan, teknik ini menciptakan pola erosi yang bervariasi secara spasial dan dapat:</p>
<ul>
<li>Menggabungkan alur sempit menjadi parit yang lebih besar pada berbagai skala</li>
<li>Secara otomatis sejajar dengan kemiringan medan (pola erosi mengikuti garis jatuh)</li>
<li>Mencapai amplifikasi hingga 32x (menambahkan detail pada 32x resolusi heightmap)</li>
<li>Berjalan sepenuhnya dalam shader fragmen dengan frame rate interaktif</li>
</ul>
<p>Untuk dunia berbasis browser, noise phasor berjalan dalam shader medan sebagai lapisan detail. Heightmap menyediakan bentuk skala besar. Noise phasor menambahkan erosi mikro yang meyakinkan dalam shader fragmen tanpa meningkatkan kompleksitas geometri. Parameternya (frekuensi pola, amplitudo, orientasi) dapat berbeda untuk setiap bioma: alur dalam pada batu terbuka, riak lembut pada bukit pasir, dan tekstur kasar seperti kulit kayu pada lumpur kering.</p>
<h3 id="tekstur-virtual-untuk-medan" tabindex="-1">Tekstur Virtual untuk Medan <a class="header-anchor" href="#tekstur-virtual-untuk-medan" aria-label="Permalink to &quot;Tekstur Virtual untuk Medan&quot;"></a></h3>
<p>Pada skala besar, atlas tekstur medan menjadi sulit dikelola. Dunia berukuran 4 km x 4 km dengan 1 texel per sentimeter memerlukan tekstur berukuran 400.000 x 400.000 piksel. Jelas mustahil.</p>
<p>Tekstur virtual (juga disebut megatexture, dari Rage karya id Software) mengatasi masalah ini dengan memperlakukan tekstur medan sebagai struktur berhalaman. Tekstur lengkap ada secara konseptual, tetapi hanya petak yang terlihat di layar yang dimuat ke memori GPU.
Alur pemrosesannya:</p>
<ol>
<li><strong>Tahap umpan balik:</strong> Render medan dengan shader yang menghasilkan petak tekstur yang dibutuhkan setiap piksel (ID petak dan level mip). Baca kembali data ini ke CPU (atau proses dengan compute shader).</li>
<li><strong>Pemuatan petak:</strong> Muat petak yang diminta dari CDN atau hasilkan secara prosedural dari data splat map.</li>
<li><strong>Tekstur indireksi:</strong> Tekstur kecil memetakan koordinat petak virtual ke koordinat petak fisik dalam atlas tekstur.</li>
<li><strong>Tahap render:</strong> Shader medan membaca tekstur indireksi untuk menemukan petak fisik yang tepat, lalu mengambil sampel tekstur material dari atlas.</li>
</ol>
<p>Compute shader WebGPU dapat menangani analisis umpan balik dan pengelolaan tabel halaman sepenuhnya di GPU. CPU hanya mengelola I/O petak.</p>
<p>Hasilnya: medan dengan tekstur unik pada resolusi apa pun tanpa ledakan penggunaan memori tekstur. Petak yang jauh dari kamera dimuat pada resolusi rendah. Petak jarak dekat dimuat pada resolusi tinggi. Total penggunaan memori tetap berada dalam anggaran tetap (biasanya atlas tekstur sebesar 128–256 MB).</p>
<h2 id="efek-medan-dinamis" tabindex="-1">Efek Medan Dinamis <a class="header-anchor" href="#efek-medan-dinamis" aria-label="Permalink to &quot;Efek Medan Dinamis&quot;"></a></h2>
<h3 id="genangan-dan-kebasahan" tabindex="-1">Genangan dan Kebasahan <a class="header-anchor" href="#genangan-dan-kebasahan" aria-label="Permalink to &quot;Genangan dan Kebasahan&quot;"></a></h3>
<p>Hujan tidak sekadar turun. Air hujan terakumulasi. Di cekungan, air membentuk genangan. Pada permukaan, air menciptakan kilau basah. Di lereng curam, air mengalir turun. Simulasi ini membuat cuaca terasa menyatu dengan medan, bukan sekadar lapisan visual.</p>
<p>Pendekatan berbasis shader ini tidak menyimulasikan dinamika fluida. Pendekatan ini menggunakan heightmap medan untuk menentukan lokasi air menggenang:</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> concavity </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightCenter </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 4.0</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> -</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightLeft </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightRight </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightUp </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightDown;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> puddleDepth </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> max</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, concavity </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> rainIntensity </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> evaporationRate </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> timeSinceRain);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> wetness </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> smoothstep</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.02</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, puddleDepth);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> wetColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> baseColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.7</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> wetRoughness </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> baseRoughness </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> finalColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mix</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(baseColor, wetColor, wetness);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> finalRoughness </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mix</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(baseRoughness, wetRoughness, wetness);</span></span></code></pre>
</div><p>Area cekung (Laplacian negatif dari heightmap) menampung air. Semakin dalam cekungannya, semakin besar genangannya. Permukaan basah menjadi lebih gelap dan lebih reflektif (kekasaran lebih rendah). Efek ini memudar seiring waktu setelah hujan berhenti.</p>
<p>Untuk refleksi genangan penuh, tambahkan tahap refleksi planar pada permukaan genangan. Atau gunakan refleksi ruang layar (SSR), yang lebih ringan dan sudah tersedia dalam rangkaian pascapemrosesan Three.js maupun Babylon.js.</p>
<p>Tetes hujan pada permukaan genangan menggunakan persamaan gelombang 2D sederhana dalam tekstur umpan balik (Saurel, 2026, <a href="https://www.4rknova.com/blog/2026/02/08/raindrops-on-puddle" target="_blank" rel="noreferrer">Blog</a>). Setiap tetes hujan menciptakan riak yang merambat ke luar dan mereda. Tekstur gelombang memodulasi normal map genangan, sehingga menghasilkan pola riak yang meyakinkan pada 60 fps.</p>
<h3 id="jejak-kaki-dan-deformasi-medan" tabindex="-1">Jejak Kaki dan Deformasi Medan <a class="header-anchor" href="#jejak-kaki-dan-deformasi-medan" aria-label="Permalink to &quot;Jejak Kaki dan Deformasi Medan&quot;"></a></h3>
<p>Saat pemain berjalan di medan lunak (pasir, salju, lumpur), jejak kaki memperkuat kesan kehadiran fisik. Tekniknya: pertahankan tekstur deformasi kecil untuk setiap chunk (64x64 piksel = 4 KB) yang menyimpan offset ketinggian. Saat karakter menginjak medan lunak, cetakkan bentuk jejak kaki ke tekstur deformasi.</p>
<p>Vertex shader medan membaca tekstur deformasi dan mengurangi ketinggian dengan nilai offset tersebut. Fragment shader medan menggelapkan area jejak kaki (tanah yang tertekan lebih gelap) dan meningkatkan kekasaran (permukaan yang terusik).</p>
<p>Jejak kaki memudar seiring waktu (salju kembali menutupi jejak, hujan menghapus jejak lumpur) dengan mengembalikan tekstur deformasi ke nol secara bertahap. Laju pemudaran bergantung pada cuaca: cepat saat hujan, lambat dalam kondisi kering.</p>
<p>Untuk dunia multipemain, data jejak kaki bersifat sementara dan lokal. Setiap klien menghasilkan jejak kaki untuk pemain yang terlihat. Tekstur deformasi tidak perlu disinkronkan antarklien (setiap orang melihat versi jejak sementara mereka sendiri). Ini menghindari biaya jaringan untuk menyiarkan setiap langkah.</p>
<h3 id="langit-prosedural-dan-siklus-siang-malam" tabindex="-1">Langit Prosedural dan Siklus Siang/Malam <a class="header-anchor" href="#langit-prosedural-dan-siklus-siang-malam" aria-label="Permalink to &quot;Langit Prosedural dan Siklus Siang/Malam&quot;"></a></h3>
<p>Langit adalah permukaan terlihat terbesar dalam dunia terbuka mana pun. Langit menentukan suasana seluruh medan.</p>
<p>Three.js memiliki <a href="https://discourse.threejs.org/t/complete-sky-system-for-three-js-skybox-sun-moon-day-night-cycle-clouds-stars-lensflares/88311" target="_blank" rel="noreferrer">sistem langit lengkap</a> yang mencakup matahari/bulan prosedural, siklus siang/malam, awan, bintang, dan pijar lensa. Contoh bawaan <code>Sky</code> dari Three.js (juga tersedia dalam <a href="https://threejs.org/examples/webgpu_sky.html" target="_blank" rel="noreferrer">WebGPU</a>) mengimplementasikan model langit analitis Preetham.</p>
<p>Untuk hasil yang lebih akurat secara fisik, <a href="https://jolifantobambla.github.io/webgpu-sky-atmosphere/" target="_blank" rel="noreferrer">webgpu-sky-atmosphere</a> mengimplementasikan model atmosfer Hillaire sebagai pascaproses WebGPU. Sistem ini mendukung beberapa fungsi fase hamburan dan menghasilkan perspektif udara yang tepat (medan yang jauh tampak lebih berkabut), warna matahari/matahari terbenam, dan gradasi langit berdasarkan prinsip dasar fisika.</p>
<p><a href="https://dev.to/the_lone_engineer/terrainview7-full-scale-planet-rendering-in-webgpu-emscripten-now-with-precomputed-atmospheric-18ik" target="_blank" rel="noreferrer">TerrainView7</a> mendemonstrasikan rendering planet skala penuh di WebGPU dengan hamburan atmosfer yang telah diprakomputasi, membuktikan bahwa rendering atmosfer yang akurat secara fisik dapat berjalan di browser.</p>
<p>Untuk dunia kreator, parameter langit (posisi matahari, cakupan awan, kepadatan kabut) disinkronkan ke semua klien dari jam dunia server. Shader langit berjalan secara lokal pada setiap klien, menghasilkan pencahayaan yang konsisten untuk semua pemain.</p>
<h3 id="pencahayaan-medan-iluminasi-tidak-langsung" tabindex="-1">Pencahayaan Medan: Iluminasi Tidak Langsung <a class="header-anchor" href="#pencahayaan-medan-iluminasi-tidak-langsung" aria-label="Permalink to &quot;Pencahayaan Medan: Iluminasi Tidak Langsung&quot;"></a></h3>
<p>Sinar matahari langsung ditangani oleh shadow map. Namun, warna dan kecerahan medan dalam bayangan (cahaya ambien/tidak langsung) sama pentingnya bagi kualitas visual. Bayangan hitam pekat terlihat tidak alami. Bayangan seharusnya diwarnai oleh warna langit (biru pada hari cerah, abu-abu pada hari mendung).</p>
<p>Untuk dunia berbasis browser, pendekatan praktisnya:</p>
<p><strong>Pencahayaan tidak langsung ruang layar</strong> dengan bitmask visibilitas (Jimenez dkk., 2023, <a href="https://export.arxiv.org/pdf/2301.11376v2.pdf" target="_blank" rel="noreferrer">Makalah</a>) menyempurnakan SSAO standar dengan melacak 32 sektor visibilitas terarah per piksel. Teknik ini menangkap bukan hanya seberapa tertutup suatu titik, tetapi juga arah oklusinya. Permukaan tipis memungkinkan cahaya menembus dari sisi lain dengan tepat. Hasilnya adalah iluminasi tidak langsung yang bereaksi terhadap geometri di sekitarnya tanpa infrastruktur iluminasi global.</p>
<p>Biayanya sebanding dengan SSAO (1–2 md). Peningkatan visualnya signifikan: medan di dalam ngarai menerima pantulan cahaya dari dinding ngarai. Bagian bawah tonjolan diterangi oleh pantulan dari tanah. Efek ini berpadu dengan hamburan atmosfer dari shader langit untuk menghasilkan pencahayaan ambien yang berlandaskan fisika.</p>
<h2 id="integrasi-fisika-medan" tabindex="-1">Integrasi Fisika Medan <a class="header-anchor" href="#integrasi-fisika-medan" aria-label="Permalink to &quot;Integrasi Fisika Medan&quot;"></a></h2>
<h3 id="collider-heightfield-rapier" tabindex="-1">Collider Heightfield Rapier <a class="header-anchor" href="#collider-heightfield-rapier" aria-label="Permalink to &quot;Collider Heightfield Rapier&quot;"></a></h3>
<p>Mesin fisika WASM Rapier menyediakan collider heightfield native yang dioptimalkan untuk medan. Membuat collider medan cukup mudah:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> heights</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Float32Array</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">65</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 65</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Fill with heightmap data...</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> groundCollider</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> RAPIER</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.ColliderDesc.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">heightfield</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  64</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">64</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, heights, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> RAPIER</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">Vector3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">64.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">64.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">world.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">createCollider</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(groundCollider);</span></span></code></pre>
</div><p>Collider heightfield menggunakan grid terstruktur untuk kueri broadphase yang efisien. Raycasting terhadap heightfield memiliki kompleksitas O(log n), bukan O(n) seperti pada mesh segitiga. Untuk chunk berukuran 65x65, kueri tabrakan diselesaikan dalam hitungan mikrodetik.</p>
<p>Untuk chunk dengan medan volumetrik (lapisan SDF), hasilkan mesh segitiga dari keluaran marching cubes dan gunakan collider trimesh. Ini lebih mahal daripada collider heightfield, tetapi dapat menangani geometri arbitrer. Hanya hasilkan collider trimesh untuk 3–5 chunk terdekat dari pemain. Chunk yang jauh tidak memerlukan fisika.</p>
<p><strong>Performa:</strong> Collider heightfield Rapier untuk chunk 65x65 menambahkan sekitar 0,1 md per langkah fisika bagi kueri pengontrol karakter. 5 chunk aktif dengan collider heightfield: 0,5 md. Satu collider trimesh untuk chunk volumetrik: 0,2–0,5 md. Total anggaran fisika medan: di bawah 1 md, masih jauh dalam anggaran fisika 2–3 md untuk seluruh dunia.</p>
<h3 id="pengontrol-karakter-yang-peka-terhadap-medan" tabindex="-1">Pengontrol Karakter yang Peka terhadap Medan <a class="header-anchor" href="#pengontrol-karakter-yang-peka-terhadap-medan" aria-label="Permalink to &quot;Pengontrol Karakter yang Peka terhadap Medan&quot;"></a></h3>
<p>Pengontrol karakter perlu merespons properti medan:</p>
<ul>
<li><strong>Pembatasan kemiringan:</strong> Karakter dapat berjalan pada lereng hingga 45 derajat. Lereng yang lebih curam menyebabkan karakter meluncur. Ini menggunakan normal medan pada posisi karakter (dihitung secara ringan dari gradien heightmap).</li>
<li><strong>Respons material permukaan:</strong> Berjalan di atas batu menghasilkan suara langkah dan kecepatan gerak yang berbeda dibandingkan berjalan di atas pasir atau lumpur. Splat map medan menyediakan material permukaan di titik mana pun.</li>
<li><strong>Menaiki undakan:</strong> Karakter dapat menaiki undakan setinggi hingga 0,5 meter. <code>KinematicCharacterController</code> dari Rapier menangani ini secara otomatis dengan tinggi undakan yang dapat dikonfigurasi.</li>
</ul>
<h2 id="pengeditan-medan-interaktif-di-browser" tabindex="-1">Pengeditan Medan Interaktif di Browser <a class="header-anchor" href="#pengeditan-medan-interaktif-di-browser" aria-label="Permalink to &quot;Pengeditan Medan Interaktif di Browser&quot;"></a></h2>
<p>Untuk dunia kreator, medan tidak sekadar dihasilkan. Medan dipahat, dimodifikasi, dan dibentuk ulang oleh pemain. Alat pengeditan harus responsif (umpan balik visual instan) dan terhubung melalui jaringan (pemain lain melihat perubahan dalam hitungan detik).</p>
<h3 id="editor-sdf-webgpu" tabindex="-1">Editor SDF WebGPU <a class="header-anchor" href="#editor-sdf-webgpu" aria-label="Permalink to &quot;Editor SDF WebGPU&quot;"></a></h3>
<p><a href="https://reindernijhoff.net/2026/01/webgpu-sdf-editor-real-time-signed-distance-field-modeling/" target="_blank" rel="noreferrer">Editor SDF WebGPU</a> karya Reinder Nijhoff menunjukkan bahwa pemodelan SDF berfitur lengkap dapat dilakukan di browser saat ini. Editor ini mendukung:</p>
<ul>
<li><strong>Enam bentuk primitif</strong> (bola, kotak, kerucut, silinder, kapsul, torus) dengan posisi, rotasi, dan skala</li>
<li><strong>Operasi Boolean</strong> (gabungan, pengurangan, irisan) dengan pencampuran halus dan radius pencampuran yang dapat dikonfigurasi</li>
<li><strong>Graf adegan hierarkis</strong> dengan grup dan operasi bertingkat</li>
<li><strong>Rendering waktu nyata</strong> menggunakan beberapa tahap compute shader GPU, partisi ruang berbasis octree pada 16.384 sel grid, serta ekstraksi permukaan melalui marching cubes atau surface nets</li>
<li><strong>Antialiasing temporal dan oklusi ambien</strong> melalui shadow map</li>
</ul>
<p>Setiap primitif disimpan sebagai 28 float (112 byte) dalam satu buffer GPU. Representasi ringkas ini berarti pengeditan medan yang kompleks (puluhan primitif SDF yang membentuk pintu masuk gua, lengkungan, atau tebing terpahat) berukuran kurang dari 5 KB dan dapat langsung disinkronkan ke pemain lain.</p>
<p>Untuk dunia kreator, alur kerja pengeditan SDF terlihat seperti berikut:</p>
<ol>
<li>Kreator memilih alat pahat (tambahkan bola, kurangi kotak, pencampuran halus)</li>
<li>Klik/seret di dunia untuk menempatkan dan menentukan ukuran primitif SDF</li>
<li>Klien segera menjalankan marching cubes pada SDF yang dimodifikasi untuk memperbarui mesh lokal (umpan balik dalam &lt;16 md)</li>
<li>Pengeditan SDF (jenis primitif + transformasi + mode pencampuran, ~100 byte) dikirim ke server</li>
<li>Server memvalidasi pengeditan (berada di dalam petak milik kreator, tidak beririsan dengan area yang dilindungi) dan menyiarkannya kepada pemain di sekitar</li>
<li>Klien pemain lain menerapkan pengeditan SDF dan menghasilkan ulang mesh lokal mereka</li>
</ol>
<p>Total waktu pulang-pergi hingga pengeditan terlihat oleh pemain lain: 100–300 md, tergantung latensi jaringan. Kreator melihat pengeditannya secara instan karena perubahan diterapkan secara lokal sebelum konfirmasi server.</p>
<h3 id="pengeditan-heightmap-berbasis-kuas" tabindex="-1">Pengeditan Heightmap Berbasis Kuas <a class="header-anchor" href="#pengeditan-heightmap-berbasis-kuas" aria-label="Permalink to &quot;Pengeditan Heightmap Berbasis Kuas&quot;"></a></h3>
<p>Untuk lapisan heightmap (90% medan yang tidak membutuhkan fitur volumetrik), model pengeditan yang lebih sederhana sudah memadai. Kreator melukis perubahan ketinggian dengan kuas:</p>
<ul>
<li><strong>Naikkan/turunkan:</strong> Tambahkan atau kurangi ketinggian dalam radius dengan falloff</li>
<li><strong>Haluskan:</strong> Ratakan ketinggian dalam radius, sehingga fitur tajam menghilang</li>
<li><strong>Ratakan:</strong> Atur semua ketinggian dalam radius ke nilai target</li>
<li><strong>Kuas erosi:</strong> Terapkan beberapa langkah erosi hidraulis secara lokal dalam radius kuas</li>
</ul>
<p>Pengeditan heightmap berupa delta: petak kecil berisi perubahan ketinggian yang melapisi medan dasar. Petak delta ini sangat kecil (grid 32x32 berisi offset ketinggian 16-bit = 2 KB) dan disinkronkan ke pemain lain sebagai satu pesan. Beberapa petak delta terakumulasi per chunk dan secara berkala digabungkan di sisi server ke dalam heightmap persisten milik chunk.</p>
<h3 id="batasan-pengeditan-kolaboratif" tabindex="-1">Batasan Pengeditan Kolaboratif <a class="header-anchor" href="#batasan-pengeditan-kolaboratif" aria-label="Permalink to &quot;Batasan Pengeditan Kolaboratif&quot;"></a></h3>
<p>Saat beberapa kreator mengedit chunk yang sama secara bersamaan, sistem memerlukan aturan:</p>
<ul>
<li><strong>Penguncian spasial:</strong> Hanya satu kreator yang dapat mengedit subwilayah 8x8 meter tertentu pada satu waktu. Kunci diperoleh saat kreator memulai sapuan pengeditan dan dilepas saat mereka mengangkat kuas. Kunci kedaluwarsa setelah tidak ada aktivitas selama 10 detik.</li>
<li><strong>Pengeditan yang tidak tumpang tindih:</strong> Jika dua kreator mengedit bagian berbeda dari chunk yang sama, kedua pengeditan diterapkan tanpa konflik (keduanya memodifikasi sel heightmap atau wilayah SDF yang berbeda).</li>
<li><strong>Pengeditan yang tumpang tindih:</strong> Jika dua kreator mengedit lokasi yang sama, server mengurutkan pengeditan berdasarkan urutan kedatangan. Kedua klien melihat hasil akhir yang sama setelah rekonsiliasi.</li>
</ul>
<p>Pendekatan ini lebih sederhana daripada pendekatan CRDT penuh yang digunakan untuk objek yang ditempatkan karena pengeditan medan merupakan operasi aditif pada bidang kontinu (ketinggian, jarak SDF), bukan status objek diskret.</p>
<h2 id="geometri-virtual-bergaya-nanite-di-webgpu" tabindex="-1">Geometri Virtual Bergaya Nanite di WebGPU <a class="header-anchor" href="#geometri-virtual-bergaya-nanite-di-webgpu" aria-label="Permalink to &quot;Geometri Virtual Bergaya Nanite di WebGPU&quot;"></a></h2>
<p>Nanite dari Unreal Engine 5 merender miliaran segitiga dengan membangun DAG cluster (graf asiklik terarah) saat proses build dan memilih LOD yang tepat per cluster saat runtime berdasarkan galat ruang layar. Seluruh alur pemrosesan berjalan di GPU. Pendekatan ini telah diporting ke WebGPU.</p>
<h3 id="nanite-webgpu" tabindex="-1">Nanite WebGPU <a class="header-anchor" href="#nanite-webgpu" aria-label="Permalink to &quot;Nanite WebGPU&quot;"></a></h3>
<div class="img-embed">
<img src="https://cdn.cinevva.com/blog/nanite-webgpu-scene.png" alt="Nanite WebGPU merender adegan multiobjek kompleks di browser menggunakan hierarki LOD meshlet dan rasterizer perangkat lunak" />
</div>
<div class="game-caption">Nanite WebGPU merender adegan lengkap di Chrome menggunakan LOD meshlet, rasterisasi perangkat lunak dalam compute shader WGSL, serta frustum culling dan occlusion culling per meshlet. Tanpa plugin native—WebGPU murni.</div>
<p><a href="https://scthe.github.io/nanite-webgpu/" target="_blank" rel="noreferrer">Nanite WebGPU</a> karya Scthe (lebih dari 1,1 ribu bintang GitHub) adalah implementasi browser lengkap dari arsitektur inti Nanite:</p>
<ul>
<li><strong>Hierarki LOD meshlet</strong> yang dibangun secara offline menggunakan pembuatan cluster dari meshoptimizer</li>
<li><strong>Rasterizer perangkat lunak</strong> yang diimplementasikan dalam compute shader WGSL (bekerja dalam batasan WebGPU, ketika rasterisasi perangkat keras tidak dapat melakukan draw per cluster secara efisien)</li>
<li><strong>Culling per instance dan per meshlet</strong> menggunakan pengujian frustum dan oklusi</li>
<li><strong>Impostor billboard</strong> untuk objek yang sangat jauh</li>
<li><strong>Dukungan tekstur dan normal per vertex</strong>
Pipeline-nya: mesh dibagi menjadi klaster yang masing-masing berisi ~128 segitiga. Klaster-klaster yang berdekatan dikelompokkan, lalu setiap grup disederhanakan (menggunakan meshoptimizer) sambil mempertahankan batas bersama. Proses ini berulang hingga seluruh mesh menyusut menjadi satu klaster. Saat runtime, compute shader menelusuri DAG dan memilih klaster paling kasar per grup yang menghasilkan galat kurang dari 1 piksel pada resolusi layar saat ini.</li>
</ul>
<p><strong>THREE-Nanite</strong> adalah implementasi Three.js yang sedang berkembang dan mampu mencapai 20–40fps pada perangkat keras grafis terintegrasi sambil menangani ratusan ribu segitiga. Implementasi ini menunjukkan bahwa rendering bergaya Nanite tetap layak bahkan pada perangkat keras browser kelas bawah.</p>
<h3 id="meshoptimizer-fondasi-pipeline-lod" tabindex="-1">meshoptimizer: Fondasi Pipeline LOD <a class="header-anchor" href="#meshoptimizer-fondasi-pipeline-lod" aria-label="Permalink to &quot;meshoptimizer: Fondasi Pipeline LOD&quot;"></a></h3>
<p><a href="https://meshoptimizer.org/" target="_blank" rel="noreferrer">meshoptimizer</a> (oleh Arseny Kapoulkine) adalah pustaka yang mendasari sebagian besar pipeline LOD yang kompatibel dengan browser. Versi 1.0 (2025) menyediakan:</p>
<ul>
<li><strong>Penyederhanaan mesh</strong> dengan metrik galat (seberapa banyak bentuk berubah, digunakan untuk pemilihan LOD)</li>
<li><strong>Pembuatan klaster</strong> untuk hierarki meshlet bergaya Nanite</li>
<li><strong>Optimalisasi cache verteks</strong> untuk pengurutan segitiga yang ramah GPU</li>
<li><strong>Optimalisasi overdraw</strong> untuk mengurangi biaya pixel shader</li>
<li><strong>Kuantisasi dan kompresi verteks</strong> untuk unduhan yang lebih kecil</li>
</ul>
<p>meshoptimizer 1.0 (dirilis Desember 2025) menyertakan <code>clusterlod.h</code> baru berformat single-header yang secara langsung mengimplementasikan LOD kontinu bergaya Nanite. Fitur ini membangun hierarki klaster yang secara bertahap dikelompokkan dan disederhanakan, sehingga dapat langsung digunakan atau dijadikan referensi untuk pipeline khusus. Inilah tepatnya primitif cluster-DAG yang dibutuhkan pipeline medan untuk LOD mesh SDF/marching cubes.</p>
<p>Untuk pipeline medan kita, meshoptimizer memproses keluaran marching cubes dari medan SDF menjadi mesh yang dioptimalkan dan dikelompokkan ke dalam klaster dengan hierarki LOD. Pemrosesan offline berjalan di sisi server. Browser menerima mesh yang telah dikelompokkan sebelumnya dan melakukan pemilihan LOD berbasis GPU saat runtime.</p>
<p>Kombinasi meshoptimizer untuk pembuatan LOD dan komputasi WebGPU untuk pemilihan saat runtime memberikan medan browser pola arsitektur yang sama seperti Nanite, tetapi disesuaikan dengan keterbatasan web.</p>
<h2 id="desain-level-yang-mempertimbangkan-medan" tabindex="-1">Desain Level yang Mempertimbangkan Medan <a class="header-anchor" href="#desain-level-yang-mempertimbangkan-medan" aria-label="Permalink to &quot;Desain Level yang Mempertimbangkan Medan&quot;"></a></h2>
<p>Medan bukan sekadar permukaan untuk berjalan. Bentuknya memandu pergerakan pemain, mengarahkan perhatian, dan menciptakan ritme emosional eksplorasi. Dunia terbuka terbaik menggunakan medan sebagai alat desain.</p>
<h3 id="garis-pandang-dan-tengaran" tabindex="-1">Garis Pandang dan Tengaran <a class="header-anchor" href="#garis-pandang-dan-tengaran" aria-label="Permalink to &quot;Garis Pandang dan Tengaran&quot;"></a></h3>
<p><a href="https://book.leveldesignbook.com/process/blockout/wayfinding" target="_blank" rel="noreferrer">Bab pencarian arah</a> dalam The Level Design Book mendokumentasikan bagaimana elevasi medan mengendalikan apa yang dilihat pemain dan ke mana mereka pergi. Punggung bukit menyembunyikan apa yang ada di baliknya sehingga memancing rasa ingin tahu. Lembah menyalurkan pergerakan menuju titik terendahnya. Tengaran tinggi (menara, puncak gunung, pohon yang tidak biasa) yang terlihat dari kejauhan memberi pemain tujuan untuk dihampiri.</p>
<p>Untuk dunia kreator, ini berarti pembuatan medan harus menghasilkan fitur pencarian arah yang alami. Garis punggung bukit harus memutus garis pandang, menciptakan &quot;momen pengungkapan&quot; ketika pemain mencapai puncak bukit dan melihat area baru. Lembah harus bertemu menuju lokasi yang menarik. Harus tersedia titik-titik tinggi tempat kreator dapat menempatkan tengaran yang terlihat dari jauh.</p>
<h3 id="eksplorasi-yang-didorong-rasa-ingin-tahu" tabindex="-1">Eksplorasi yang Didorong Rasa Ingin Tahu <a class="header-anchor" href="#eksplorasi-yang-didorong-rasa-ingin-tahu" aria-label="Permalink to &quot;Eksplorasi yang Didorong Rasa Ingin Tahu&quot;"></a></h3>
<p>Riset dari Purdue University (<a href="https://web.ics.purdue.edu/~cmousas/papers/conf22-FDG-SpatialExploration.pdf" target="_blank" rel="noreferrer">Makalah</a>) mengidentifikasi empat pemicu eksplorasi spasial:</p>
<ol>
<li><strong>Mencapai titik ekstrem</strong> (puncak tertinggi, tepian terjauh, gua terdalam). Medan harus memiliki titik-titik ekstrem yang jelas dan memberi imbalan kepada pemain yang mencapainya.</li>
<li><strong>Mengungkap penghalang visual</strong> (apa yang ada di balik tebing itu? di dalam gua itu?). Medan yang menghalangi pandangan mendorong pergerakan untuk menemukan hal yang tersembunyi.</li>
<li><strong>Objek yang tidak pada tempatnya</strong> (bangunan di alam liar, cahaya di tengah kegelapan). Objek yang ditempatkan kreator dengan latar medan alami menciptakan kontras yang menarik perhatian.</li>
<li><strong>Memahami hubungan spasial</strong> (bagaimana lembah ini terhubung dengan pesisir itu?). Medan yang menciptakan geografi yang mudah dipahami mendorong pembacaan peta dan perencanaan rute.</li>
</ol>
<h3 id="plotmap-penempatan-poi-berbantuan-ai" tabindex="-1">PlotMap: Penempatan POI Berbantuan AI <a class="header-anchor" href="#plotmap-penempatan-poi-berbantuan-ai" aria-label="Permalink to &quot;PlotMap: Penempatan POI Berbantuan AI&quot;"></a></h3>
<p>PlotMap (<a href="https://arxiv.org/html/2309.15242v4" target="_blank" rel="noreferrer">arXiv:2309.15242</a>) mengotomatiskan tata letak titik penting dengan menerima persyaratan naratif (misi ini membutuhkan desa di dekat sungai, misi itu membutuhkan reruntuhan di puncak bukit), lalu menemukan lokasi medan yang memenuhi batasan spasial tersebut. Untuk dunia kreator, sistem serupa dapat menyarankan tempat untuk meletakkan bangunan berdasarkan karakteristik medan: &quot;puncak bukit ini memiliki garis pandang yang bagus untuk menara pengawas,&quot; &quot;lembah terlindung ini cocok untuk desa.&quot;</p>
<h2 id="air-mengalir-dan-air-terjun" tabindex="-1">Air Mengalir dan Air Terjun <a class="header-anchor" href="#air-mengalir-dan-air-terjun" aria-label="Permalink to &quot;Air Mengalir dan Air Terjun&quot;"></a></h2>
<p>Sungai dan air terjun adalah fitur medan yang menggabungkan daya tarik visual dengan suara ambien dan peluang gameplay (air sebagai penghalang, sumber daya, atau jalur).</p>
<h3 id="rendering-sungai" tabindex="-1">Rendering Sungai <a class="header-anchor" href="#rendering-sungai" aria-label="Permalink to &quot;Rendering Sungai&quot;"></a></h3>
<p>Sungai di dunia terbuka biasanya dirender sebagai strip bertekstur yang mengikuti permukaan medan. Mesh strip dibuat dari spline sungai (disimpan sebagai titik kontrol) dan diproyeksikan ke heightmap medan. Shader sungai menerapkan:</p>
<ul>
<li><strong>UV yang selaras dengan aliran</strong> dan bergulir mengikuti arah sungai sehingga menciptakan tampilan air mengalir</li>
<li><strong>Busa di tepian</strong> tempat sungai bertemu dengan bantaran (berbasis kedalaman, serupa dengan busa garis pantai)</li>
<li><strong>Variasi kecepatan</strong> berdasarkan lebar alur (bagian sempit mengalir lebih cepat, bagian lebar lebih lambat)</li>
<li><strong>Transparansi dengan warna berbasis kedalaman</strong> (bagian dangkal jernih, bagian dalam gelap)</li>
</ul>
<p>Untuk dunia browser, data sungai bersifat ringkas: sebuah spline (20–50 titik kontrol per segmen sungai, ~400 byte), ditambah parameter lebar dan kecepatan aliran. Klien membuat mesh sungai secara lokal dengan memproyeksikan spline ke permukaan medannya.</p>
<h3 id="rendering-air-terjun" tabindex="-1">Rendering Air Terjun <a class="header-anchor" href="#rendering-air-terjun" aria-label="Permalink to &quot;Rendering Air Terjun&quot;"></a></h3>
<p>Ketika sungai jatuh dari permukaan tebing, sistem partikel air terjun menggantikan permukaan sungai yang datar. Pendekatan hibrida dari riset simulasi air waktu nyata (<a href="https://diglib.eg.org/items/d0320015-4b07-416b-8f41-047485c9f7f3" target="_blank" rel="noreferrer">EG</a>): wilayah yang tidak dapat direpresentasikan oleh height field (air terjun, cipratan) diubah menjadi partikel semburan, cipratan, dan busa yang saling bertukar massa dan momentum dengan simulasi fluida.</p>
<p>Untuk dunia browser, air terjun dibuat lebih sederhana: deteksi tempat spline sungai melintasi diskontinuitas ketinggian medan, munculkan sistem partikel di titik tersebut dengan kecepatan ke bawah, lalu tambahkan cipratan busa di dasarnya. Partikel-partikel tersebut berupa quad berbasis instancing GPU dengan tekstur alfa bergulir. 500 partikel per air terjun, satu draw call. Suara air jatuh menggunakan Web Audio API dengan atenuasi jarak.</p>
<h2 id="impostor-untuk-fitur-medan-yang-jauh" tabindex="-1">Impostor untuk Fitur Medan yang Jauh <a class="header-anchor" href="#impostor-untuk-fitur-medan-yang-jauh" aria-label="Permalink to &quot;Impostor untuk Fitur Medan yang Jauh&quot;"></a></h2>
<p>Pohon, batu, bangunan, dan fitur medan lainnya menjadi sangat kecil di kejauhan. Merendernya sebagai mesh 3D penuh memboroskan siklus GPU. Impostor mengganti objek jauh dengan gambar datar yang telah dirender sebelumnya dan selalu menghadap kamera.</p>
<h3 id="atlas-impostor-oktahedral" tabindex="-1">Atlas Impostor Oktahedral <a class="header-anchor" href="#atlas-impostor-oktahedral" aria-label="Permalink to &quot;Atlas Impostor Oktahedral&quot;"></a></h3>
<p>Impostor oktahedral menangkap tampilan objek 3D dari berbagai sudut pandang dan menyimpannya dalam atlas tekstur. Saat runtime, shader mengambil sampel atlas berdasarkan arah pandang saat ini, dengan interpolasi di antara dua sudut tangkapan terdekat.</p>
<p>Atlas hemi-oktahedral (hanya pandangan dari belahan atas karena Anda jarang melihat pohon dari bawah) memberikan resolusi sudut dua kali lipat dibandingkan atlas oktahedral penuh dengan ukuran tekstur yang sama. Sistem impostor Unity melaporkan waktu frame turun dari 111ms menjadi 5,78ms ketika 1.600 instans pohon dialihkan dari mesh nyata (masing-masing 140K segitiga) ke impostor.</p>
<p>Untuk dunia browser, pipeline impostor:</p>
<ol>
<li>Sisi server: render setiap aset dari 16–32 sudut pandang, dengan menangkap warna, normal, dan kedalaman</li>
<li>Kemas ke dalam tekstur atlas (satu atlas per aset, ~256x256 piksel, &lt;100 KB sebagai KTX2)</li>
<li>Saat runtime: instans yang melampaui jarak impostor (biasanya 100–200m) dirender sebagai billboard yang mengambil sampel atlas</li>
<li>Terapkan crossfade antara mesh dan impostor di sepanjang zona transisi 20m untuk menyamarkan pergantian</li>
</ol>
<h3 id="billboard-splatting-bbsplat" tabindex="-1">Billboard Splatting (BBSplat) <a class="header-anchor" href="#billboard-splatting-bbsplat" aria-label="Permalink to &quot;Billboard Splatting (BBSplat)&quot;"></a></h3>
<p>Billboard Splatting (2024, <a href="https://arxiv.org/abs/2411.08508" target="_blank" rel="noreferrer">arXiv:2411.08508</a>) mengembangkan pendekatan ini lebih jauh dengan menggunakan primitif planar bertekstur yang dapat dipelajari. Alih-alih menggunakan tampilan yang dirender sebelumnya, BBSplat mengoptimalkan posisi dan tekstur billboard agar dapat merepresentasikan objek 3D sebaik mungkin dari sudut mana pun. Pendekatan ini mencapai kompresi hingga 17x dibandingkan 3D Gaussian Splatting sambil mempertahankan tampilan yang bergantung pada sudut pandang. Untuk fitur medan jauh dalam dunia browser, BBSplat dapat mengurangi penyimpanan impostor per aset sekaligus meningkatkan cakupan sudut.</p>
<h2 id="alat-medan-profesional-dan-pelajarannya" tabindex="-1">Alat Medan Profesional dan Pelajarannya <a class="header-anchor" href="#alat-medan-profesional-dan-pelajarannya" aria-label="Permalink to &quot;Alat Medan Profesional dan Pelajarannya&quot;"></a></h2>
<p>Sebelum membangun pipeline medan dari nol, ada baiknya memahami apa yang dilakukan alat offline profesional. Alat-alat ini mewakili riset pembuatan medan selama puluhan tahun yang telah disarikan menjadi alur kerja produksi.</p>
<p><strong>Gaea</strong> (QuadSpinner) diakselerasi GPU dan memberikan umpan balik nyaris seketika terhadap perubahan. Gaea mendukung build berbasis ubin hingga 2 juta piksel per sisi, ekspor mesh LOD otomatis, dan graf berbasis node dengan setiap node merepresentasikan proses fisik (erosi, sedimentasi, pengangkatan, pelapukan termal). Node erosi Gaea menghasilkan medan yang tampak dipahat secara manual karena memodelkan proses fisik tertentu, bukan noise generik. Wawasan utamanya: Gaea tidak menggunakan satu algoritma erosi saja. Gaea menyediakan node terpisah untuk erosi fluvial (pengikisan oleh sungai), erosi termal (pelapukan tebing), erosi pesisir (aksi gelombang), dan erosi angin (pembentukan bukit pasir). Menggabungkannya dalam graf menghasilkan medan dengan karakter geologis iklim tertentu.</p>
<p><strong>World Machine</strong> menggunakan pendekatan graf serupa dengan fokus pada struktur makro medan. &quot;Layout generator&quot;-nya memungkinkan seniman membuat sketsa bentuk kasar fitur medan (gunung di sini, lembah di sana, garis pantai di sepanjang tepian ini), lalu sistem mengisi detail yang masuk akal secara fisik. Inilah tepatnya alur kerja kreator yang kita inginkan: buat sketsa maksudnya, dapatkan geologinya.</p>
<p><strong>World Creator</strong> membedakan dirinya melalui pratinjau waktu nyata selama pengeditan dan pembuatan sungai bawaan yang menganalisis medan serta otomatis menghitung jalur aliran berdasarkan analisis drainase.</p>
<p><strong>Yang kita pelajari dari alat-alat ini:</strong> Pendekatan graf node untuk menggabungkan proses fisik lebih kuat daripada algoritma tunggal mana pun. Pipeline pembuatan di sisi server kita harus mendukung perangkaian: basis noise &gt; pengangkatan tektonik &gt; erosi hidraulis &gt; pelapukan termal &gt; erosi pesisir &gt; vegetasi. Kreator mengendalikan parameter pada setiap tahap. Pipeline berjalan di sisi server dalam hitungan detik dan menghasilkan heightmap, splat map, serta peta kepadatan vegetasi.</p>
<h3 id="soilmachine-geomorfologi-sumber-terbuka" tabindex="-1">SoilMachine: Geomorfologi Sumber Terbuka <a class="header-anchor" href="#soilmachine-geomorfologi-sumber-terbuka" aria-label="Permalink to &quot;SoilMachine: Geomorfologi Sumber Terbuka&quot;"></a></h3>
<div class="img-embed">
<img src="https://cdn.cinevva.com/blog/soilmachine-banner.png" alt="SoilMachine: simulator geomorfologi modular sumber terbuka yang menampilkan medan dengan erosi hidraulis, termal, dan angin yang saling terhubung" />
</div>
<div class="game-caption">SoilMachine menggabungkan erosi hidraulis, termal, dan angin dalam satu model medan berlapis. Struktur data multilapisnya mendukung fitur yang tidak dapat direpresentasikan oleh heightmap: gua, bagian menggantung, bukit meja, dan distribusi air tanah.</div>
<p><a href="https://github.com/weigert/soilmachine" target="_blank" rel="noreferrer">SoilMachine</a> adalah simulator geomorfologi modular sumber terbuka yang menggabungkan beberapa sistem erosi (hidraulis, termal, angin) dengan pengangkutan dan pengendapan sedimen. Dibangun menggunakan C++ dengan komputasi GPU, alat ini menyediakan implementasi referensi untuk pendekatan erosi multiproses yang digunakan alat profesional.</p>
<p><a href="https://github.com/erosiv/soillib" target="_blank" rel="noreferrer">soillib</a> terkait (C++20, lisensi MIT) menyediakan primitif simulasi geomorfologi yang mendasarinya sebagai pustaka yang dapat digunakan kembali. Sementara itu, <a href="https://github.com/ger0/hydro-gen" target="_blank" rel="noreferrer">hydro-gen</a> mengimplementasikan erosi hidraulis berbasis grid (air dangkal) dan berbasis partikel (tetes hujan) dalam compute shader OpenGL dengan penyesuaian parameter waktu nyata.</p>
<p>Alat-alat sumber terbuka ini dapat diadaptasi untuk pipeline pembuatan sisi server kita. Implementasi compute shader-nya dapat diterjemahkan langsung ke WebGPU jika nantinya kita ingin menjalankan erosi di browser untuk memberikan umpan balik waktu nyata kepada kreator.</p>
<h2 id="material-medan-multilapis" tabindex="-1">Material Medan Multilapis <a class="header-anchor" href="#material-medan-multilapis" aria-label="Permalink to &quot;Material Medan Multilapis&quot;"></a></h2>
<p>Medan nyata bukanlah satu permukaan saja. Medan terdiri dari lapisan: batuan dasar di bagian bawah, tanah di atasnya, serta salju atau pasir yang menumpuk di permukaan. Pelapisan dinamis mengubah karakter visual medan seiring musim, cuaca, dan tindakan kreator.</p>
<h3 id="representasi-heightfield-berlapis" tabindex="-1">Representasi Heightfield Berlapis <a class="header-anchor" href="#representasi-heightfield-berlapis" aria-label="Permalink to &quot;Representasi Heightfield Berlapis&quot;"></a></h3>
<p>Alih-alih menggunakan satu heightmap, gunakan beberapa lapisan ketinggian per sel grid:</p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>Cell {</span></span>
<span class="line"><span>  bedrock_height: f16,    // permukaan batuan permanen</span></span>
<span class="line"><span>  soil_height: f16,       // tanah/sedimen yang terakumulasi di atas batuan dasar</span></span>
<span class="line"><span>  snow_height: f16,       // akumulasi salju dinamis</span></span>
<span class="line"><span>  water_height: f16       // kedalaman genangan air</span></span>
<span class="line"><span>}</span></span></code></pre>
</div><p>Total: 8 byte per sel (dibandingkan 2 byte untuk satu heightmap). Untuk chunk 65x65, ukurannya 34 KB sebelum kompresi. Masih ringkas.</p>
<p>Permukaan visualnya adalah <code>bedrock + soil + snow</code>. Shader medan membaca semua lapisan dan mencampur material sebagaimana mestinya: ketika tanah tipis, batu terlihat dari bawahnya. Ketika salju menumpuk, permukaan menjadi putih. Ketika air menggenang, terbentuk kubangan atau danau.</p>
<h3 id="akumulasi-dinamis" tabindex="-1">Akumulasi Dinamis <a class="header-anchor" href="#akumulasi-dinamis" aria-label="Permalink to &quot;Akumulasi Dinamis&quot;"></a></h3>
<p>Salju menumpuk pada permukaan datar yang menghadap ke atas selama hujan salju. Laju akumulasi bergantung pada normal permukaan (lereng terjal tidak menahan salju), suhu (bergantung pada ketinggian), dan perlindungan (area di bawah bagian menggantung tetap bebas salju). Sebuah pass compute shader memperbarui lapisan salju sekali per tick cuaca (setiap beberapa detik).</p>
<p>Akumulasi pasir bekerja dengan cara serupa melalui pengendapan yang digerakkan angin. Angin membawa partikel dari permukaan terbuka dan mengendapkannya di belakang rintangan serta di area terlindung.</p>
<p>Untuk dunia kreator, akumulasi dinamis berarti medan tampak berbeda dalam cuaca yang berbeda. Salju menutupi dunia selama badai salju dan mencair saat cuaca cerah. Hujan mengisi cekungan dengan air. Hal ini membuat dunia terasa responsif tanpa kreator perlu melakukan apa pun.</p>
<h3 id="erosi-multilapis" tabindex="-1">Erosi Multilapis <a class="header-anchor" href="#erosi-multilapis" aria-label="Permalink to &quot;Erosi Multilapis&quot;"></a></h3>
<p>Makalah tahun 2024 &quot;3D Real-Time Hydraulic Erosion Simulation using Multi-Layered Heightmaps&quot; (<a href="https://diglib.eg.org/items/deefa865-6a25-4463-adcd-d8de2b37507e" target="_blank" rel="noreferrer">EG</a>) memperluas erosi agar bekerja lintas lapisan. Air mengikis tanah lebih cepat daripada batuan dasar. Sedimen mengendap sebagai lapisan tanah baru. Simulasi mempertahankan integritas lapisan (batuan dasar tetap berada di bawah tanah) sekaligus memungkinkan fitur kompleks seperti bagian menggantung (ketika batuan dasar menggantung di atas tanah yang telah terkikis).
Performa: sekitar 6 md per langkah simulasi pada RTX 3070 dengan resolusi 2048x2048. Ini cukup cepat untuk pembuatan di sisi server, tetapi terlalu lambat untuk simulasi per frame di browser. Representasi berlapis cocok untuk pembuatan medan statis, sedangkan akumulasi salju/air dinamis dijalankan sebagai shader per frame yang lebih ringan.</p>
<h2 id="rendering-rumput-bebatuan-dan-detail" tabindex="-1">Rendering Rumput, Bebatuan, dan Detail <a class="header-anchor" href="#rendering-rumput-bebatuan-dan-detail" aria-label="Permalink to &quot;Rendering Rumput, Bebatuan, dan Detail&quot;"></a></h2>
<p>Lanskap membutuhkan lebih dari sekadar geometri dan tekstur medan. Lanskap memerlukan helai-helai rumput yang bergoyang tertiup angin, bebatuan yang tersebar di lereng, dan detail kecil seperti bunga, kerikil, serta ranting tumbang yang membuat tampilan jarak dekat terlihat alami.</p>
<h3 id="rumput-dengan-instancing-gpu" tabindex="-1">Rumput dengan Instancing GPU <a class="header-anchor" href="#rumput-dengan-instancing-gpu" aria-label="Permalink to &quot;Rumput dengan Instancing GPU&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/pzkcM1rfKZw" title="Merender 1 Juta Helai Rumput di Unity" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Satu juta helai rumput dirender menggunakan instancing GPU dalam satu draw call. Teknik yang sama berfungsi di Three.js dan WebGPU: transformasi per instans, animasi angin melalui vertex shader, dan peta kepadatan untuk menyebarkan helai rumput berdasarkan data medan.</div>
<p>Rendering rumput berbasis browser telah terbukti andal di Three.js dan bekerja melalui instancing GPU. Pendekatan dari <a href="https://al-ro.github.io/projects/grass/" target="_blank" rel="noreferrer">demo rumput al-ro</a> merender 100.000 helai rumput dengan satu draw call menggunakan <code>InstancedBufferGeometry</code>.</p>
<p>Setiap helai rumput merupakan quad sederhana (4-8 segitiga). Atribut per instans menentukan posisi, tinggi, arah lengkungan, variasi warna, dan fase angin. Vertex shader:</p>
<ol>
<li>Membaca transformasi per instans</li>
<li>Menerapkan animasi angin menggunakan gelombang sinus yang ditentukan oleh posisi dunia dan waktu</li>
<li>Melengkungkan helai berdasarkan kekuatan angin (lebih melengkung di ujung, tanpa lengkungan di pangkal)</li>
<li>Menerapkan gradien warna (lebih gelap di pangkal, lebih terang di ujung untuk hamburan bawah permukaan)</li>
</ol>
<p><strong>Tutorial rumput lebat Codrops</strong> (2025, <a href="https://tympanus.net/codrops/2025/02/04/how-to-make-the-fluffiest-grass-with-three-js/" target="_blank" rel="noreferrer">Tutorial</a>) mendemonstrasikan pendekatan shell texturing: render bidang tanah beberapa kali dengan offset yang terus bertambah, lalu setiap lapisan mengambil sampel tekstur noise untuk menciptakan tampilan volume rumput yang rapat. Pendekatan ini lebih ringan daripada instancing setiap helai untuk cakupan yang sangat rapat, tetapi kurang realistis dari jarak dekat.</p>
<p>Untuk dunia kreator, kepadatan rumput berasal dari peta kepadatan vegetasi per chunk. GPU menyebarkan posisi helai dari peta kepadatan pada saat rendering. Tidak ada data per helai yang disimpan atau dialirkan. Peta kepadatan berupa kisi 32x32 per chunk (1 KB), dan GPU menghasilkan ribuan instans helai rumput darinya.</p>
<h3 id="detail-bebatuan-dan-tebing-prosedural" tabindex="-1">Detail Bebatuan dan Tebing Prosedural <a class="header-anchor" href="#detail-bebatuan-dan-tebing-prosedural" aria-label="Permalink to &quot;Detail Bebatuan dan Tebing Prosedural&quot;"></a></h3>
<p>Permukaan tebing dan medan berbatu membutuhkan detail geometris yang tidak dapat disediakan oleh heightmap dasar atau SDF pada resolusi yang wajar. Dua pendekatan berikut saling melengkapi:</p>
<p><strong>Pelapisan ulang dengan GPU mesh shader</strong> (Raad dkk., Eurographics 2025, <a href="https://hal.science/hal-05176868v1/file/Paper_Resurfacing_2024.pdf" target="_blank" rel="noreferrer">Makalah</a>) menghasilkan geometri prosedural pada saat rendering dari control mesh kasar. Mesh shader membaca permukaan medan dasar dan menambahkan displacement, retakan, serta tonjolan tanpa menyimpan geometri detail di memori. Ini mengurangi penggunaan VRAM dan memungkinkan LOD dinamis.</p>
<p><strong>Penyebaran bebatuan dengan instancing</strong> menempatkan mesh bebatuan siap pakai pada lereng terjal dan tepi tebing menggunakan instancing GPU. Compute shader membaca normal dan kemiringan medan, lalu menyebarkan instans bebatuan di lokasi yang kemiringannya melebihi ambang batas. Setiap instans merupakan mesh kecil (200-500 segitiga) dengan rotasi dan skala acak. Dengan instancing, 10.000 bebatuan yang tersebar hanya menambah biaya rendering yang dapat diabaikan.</p>
<h3 id="jalan-dan-jalur" tabindex="-1">Jalan dan Jalur <a class="header-anchor" href="#jalan-dan-jalur" aria-label="Permalink to &quot;Jalan dan Jalur&quot;"></a></h3>
<p>Jalan, lintasan, dan jalur yang ditempatkan kreator harus mengikuti bentuk medan dan mengubah material permukaan (mengganti rumput dengan tanah atau batu).</p>
<p>Pendekatan yang digunakan oleh setiap game engine besar: definisikan jalur sebagai spline (serangkaian titik kontrol). Proyeksikan spline ke permukaan medan. Buat strip mesh yang mengikuti spline dan berada sedikit di atas medan. Terapkan tekstur jalan ke strip tersebut. Di dalam shader medan, padukan material medan menuju material jalan dalam batas lebar spline menggunakan tekstur terproyeksi atau decal.</p>
<p>Untuk dunia berbasis browser, kreator menggambar jalur pada medan. Klien menghasilkan titik-titik kontrol dan mengirimkannya ke server (beberapa lusin nilai vec3). Server menyimpan spline tersebut. Semua klien merender strip jalan secara lokal dengan memproyeksikan spline ke mesh medan mereka. Data jalannya sangat kecil (titik-titik spline jalur, mungkin 200 byte), tetapi dampak visualnya besar: jalur yang menghubungkan karya para kreator membuat dunia terasa dihuni.</p>
<h2 id="bayangan-untuk-medan" tabindex="-1">Bayangan untuk Medan <a class="header-anchor" href="#bayangan-untuk-medan" aria-label="Permalink to &quot;Bayangan untuk Medan&quot;"></a></h2>
<p>Bayangan medan sangat penting untuk keterbacaan (memahami bentuk medan) dan atmosfer (nuansa berdasarkan waktu). Di dunia terbuka, matahari memancarkan bayangan ke seluruh medan yang terlihat.</p>
<h3 id="cascaded-shadow-maps-csm" tabindex="-1">Cascaded Shadow Maps (CSM) <a class="header-anchor" href="#cascaded-shadow-maps-csm" aria-label="Permalink to &quot;Cascaded Shadow Maps (CSM)&quot;"></a></h3>
<p>CSM membagi frustum pandangan menjadi 3-4 rentang jarak (cascade). Setiap cascade merender shadow map dari perspektif matahari pada resolusi yang sesuai dengan jaraknya. Cascade dekat: resolusi tinggi (bayangan mendetail di bawah pohon dan bangunan). Cascade jauh: resolusi rendah (bayangan pegunungan yang luas).</p>
<p>Three.js dan Babylon.js sama-sama mendukung CSM. Optimalisasi utama untuk medan: hanya render medan ke dalam shadow map, bukan setiap helai rumput atau detail kecil. Rumput menggunakan bayangan dari shadow map medan, bukan bayangannya sendiri.</p>
<p><strong>Anggaran performa:</strong> 3-4 cascade bayangan masing-masing berukuran 1024x1024. Merender medan ke shadow map memerlukan 0,5-1 md (geometri medan sudah berada di memori GPU). Mengambil sampel dari 4 cascade dalam shader medan menambah 0,2-0,3 md.</p>
<h3 id="bayangan-mandiri-medan-dari-heightmap" tabindex="-1">Bayangan Mandiri Medan dari Heightmap <a class="header-anchor" href="#bayangan-mandiri-medan-dari-heightmap" aria-label="Permalink to &quot;Bayangan Mandiri Medan dari Heightmap&quot;"></a></h3>
<p>Untuk medan yang sangat luas dan membuat CSM terlalu mahal, hitung sebelumnya sebuah horizon map: untuk setiap sel medan, simpan sudut elevasi maksimum dalam 8 arah mata angin. Saat rendering, bandingkan sudut matahari dengan horizon map untuk menentukan apakah suatu titik berada dalam bayangan. Beginilah Skyrim menangani bayangan mandiri medan untuk medan jauh (di luar jangkauan CSM).</p>
<p>Horizon map dihitung di sisi server dari heightmap (memerlukan beberapa detik pemrosesan) dan dialirkan sebagai tekstur 128x128 per chunk (16 KB setelah dikompresi). Dampak visualnya signifikan: lembah pegunungan menjadi gelap secara realistis bahkan pada jarak pandang yang ekstrem.</p>
<h2 id="kompresi-data-medan-untuk-streaming" tabindex="-1">Kompresi Data Medan untuk Streaming <a class="header-anchor" href="#kompresi-data-medan-untuk-streaming" aria-label="Permalink to &quot;Kompresi Data Medan untuk Streaming&quot;"></a></h2>
<p>Jaringan adalah hambatan utama bagi dunia berbasis browser. Setiap byte yang dihemat dari data medan mempercepat waktu pemuatan.</p>
<h3 id="kompresi-heightmap" tabindex="-1">Kompresi Heightmap <a class="header-anchor" href="#kompresi-heightmap" aria-label="Permalink to &quot;Kompresi Heightmap&quot;"></a></h3>
<p>Heightmap mentah 16-bit dapat dikompresi dengan baik karena sel-sel yang berdekatan memiliki nilai serupa. Alur pemrosesannya:</p>
<ol>
<li><strong>Delta encoding:</strong> Simpan selisih antara setiap sel dan nilai prediksinya (rata-rata sel tetangga). Nilai delta berukuran kecil dan mengelompok di dekat nol.</li>
<li><strong>Kuantisasi:</strong> Untuk chunk yang jauh, kurangi presisi dari 16-bit menjadi 12-bit atau 8-bit. Pada jarak 500 meter, presisi ketinggian 8-bit (resolusi 0,4 m pada rentang ketinggian 100 m) tidak dapat dibedakan dari 16-bit.</li>
<li><strong>Entropy coding:</strong> Terapkan kompresi zlib atau brotli ke aliran yang telah melalui delta encoding. Rasio kompresi umum: 4-8x.</li>
</ol>
<p>Hasilnya: chunk 65x65 pada 16-bit berkurang dari 8,4 KB mentah menjadi 1-2 KB setelah dikompresi. Pada presisi 8-bit yang dikurangi: 0,5-1 KB.</p>
<h3 id="streaming-heightmap-progresif" tabindex="-1">Streaming Heightmap Progresif <a class="header-anchor" href="#streaming-heightmap-progresif" aria-label="Permalink to &quot;Streaming Heightmap Progresif&quot;"></a></h3>
<p>Kirim medan beresolusi rendah terlebih dahulu, lalu sempurnakan secara bertahap. Heightmap 17x17 (ukuran minimum untuk chunk 64 m dengan jarak antarsel 4 m) berukuran 578 byte mentah dan kurang dari 200 byte setelah dikompresi. Medan langsung terlihat. Kemudian alirkan penyempurnaan 33x33 (menambahkan sampel baris/kolom ganjil). Setelah itu, alirkan resolusi penuh 65x65. Setiap tingkat menambahkan detail tanpa mengganti data sebelumnya.</p>
<p>Ini dipetakan ke cincin LOD geometry clipmap: medan jauh menggunakan versi beresolusi rendah (17x17), jarak menengah menggunakan resolusi sedang (33x33), dan tampilan jarak dekat menggunakan resolusi penuh (65x65). Prioritas streaming sesuai dengan LOD rendering.</p>
<h3 id="kompresi-volume-sdf" tabindex="-1">Kompresi Volume SDF <a class="header-anchor" href="#kompresi-volume-sdf" aria-label="Permalink to &quot;Kompresi Volume SDF&quot;"></a></h3>
<p>Volume SDF sparse dapat dikompresi secara drastis karena sebagian besar voxel berada jauh dari permukaan (ruang kosong). Pilihannya:</p>
<p><strong>Run-length encoding:</strong> Enkode rangkaian nilai identik (voxel kosong). Volume SDF umumnya lebih dari 95% kosong, sehingga RLE menghasilkan kompresi 10-50x.</p>
<p><strong>Sparse octree:</strong> Hanya simpan node octree yang berisi voxel yang dilintasi permukaan. Ruang kosong tidak memiliki node. Volume SDF 64^3 dengan satu terowongan gua mungkin hanya memiliki 2.000-5.000 node terisi (dibandingkan total 262.144 voxel), masing-masing disimpan sebagai 1-2 byte.</p>
<p><strong>Kompresi progresif berbasis entropi</strong> (2024, <a href="https://inria.hal.science/hal-04630545v1/file/sgp2024.pdf" target="_blank" rel="noreferrer">HAL</a>) diterapkan pada data spasial 3D dengan membagi ruang secara rekursif menggunakan bidang yang dioptimalkan berdasarkan entropi dan kuantisasi adaptif. Ini menghasilkan aliran penyempurnaan yang dioptimalkan untuk kompromi laju-distorsi, terutama bermanfaat pada bitrate rendah dalam streaming jaringan.</p>
<h2 id="menggabungkan-semuanya-pipeline-medan-browser" tabindex="-1">Menggabungkan Semuanya: Pipeline Medan Browser <a class="header-anchor" href="#menggabungkan-semuanya-pipeline-medan-browser" aria-label="Permalink to &quot;Menggabungkan Semuanya: Pipeline Medan Browser&quot;"></a></h2>
<p>Ikhtisar strategis di bagian atas artikel ini memberikan kerangka pengambilan keputusan cepat dan rencana pembangunan bertahap. Bagian ini menyediakan detail teknis lengkap untuk pipeline pembuatan di sisi server dan pipeline rendering browser.</p>
<h3 id="pipeline-pembuatan-sisi-server" tabindex="-1">Pipeline Pembuatan (Sisi Server) <a class="header-anchor" href="#pipeline-pembuatan-sisi-server" aria-label="Permalink to &quot;Pipeline Pembuatan (Sisi Server)&quot;"></a></h3>
<p>Pipeline pembuatan berjalan sebagai graf berarah dari berbagai proses fisik, terinspirasi oleh pendekatan graf node milik Gaea dan World Machine. Setiap tahap menerima keluaran tahap sebelumnya dan menyempurnakannya. Kreator mengendalikan parameter pada setiap tahap.</p>
<table tabindex="0">
<thead>
<tr>
<th>Tahap</th>
<th>Input</th>
<th>Proses</th>
<th>Output</th>
<th>Waktu</th>
</tr>
</thead>
<tbody>
<tr>
<td>1. Medan dasar</td>
<td>Seed atau prompt teks</td>
<td>Terrain Diffusion / MESA / noise + fBm</td>
<td>Heightmap 16-bit</td>
<td>1-5 dtk</td>
</tr>
<tr>
<td>2. Erosi</td>
<td>Heightmap</td>
<td>Stream power analitis + erosi termal</td>
<td>Heightmap tererosi, peta akumulasi aliran, peta sedimen</td>
<td>0,5-2 dtk</td>
</tr>
<tr>
<td>3. Sungai</td>
<td>Heightmap tererosi, peta aliran</td>
<td>Ekstraksi jaringan drainase, pengukiran saluran</td>
<td>Spline sungai, peta ketinggian air</td>
<td>0,5 dtk</td>
</tr>
<tr>
<td>4. Pesisir</td>
<td>Heightmap di dekat permukaan laut</td>
<td>Erosi gelombang bergaya NEWTS</td>
<td>Fitur garis pantai (tebing, pantai, stack)</td>
<td>1-3 dtk</td>
</tr>
<tr>
<td>5. Volumetrik</td>
<td>Heightmap + maksud kreator</td>
<td>Erosi Arenite / pembuatan gua / pemahatan SDF</td>
<td>Volume SDF sparse untuk chunk yang terdampak</td>
<td>1-60 dtk</td>
</tr>
<tr>
<td>6. Material</td>
<td>Heightmap + peta erosi</td>
<td>TerraFusion / Geodiffussr / aturan prosedural</td>
<td>Splat map, tekstur medan</td>
<td>1-5 dtk</td>
</tr>
<tr>
<td>7. Vegetasi</td>
<td>Heightmap + peta aliran + material</td>
<td>Simulasi persaingan ekosistem</td>
<td>Peta kepadatan per bioma per chunk</td>
<td>1-3 dtk</td>
</tr>
<tr>
<td>8. Horizon map</td>
<td>Heightmap akhir</td>
<td>Sudut elevasi maksimum 8 arah</td>
<td>Tekstur bayangan mandiri per chunk</td>
<td>2-5 dtk</td>
</tr>
<tr>
<td>9. Pembagian chunk</td>
<td>Semua output</td>
<td>Potong, terapkan delta encoding, kompresi, hash</td>
<td>Paket chunk di CDN</td>
<td>5-10 dtk</td>
</tr>
<tr>
<td><strong>Total</strong></td>
<td></td>
<td></td>
<td></td>
<td><strong>15-90 dtk</strong></td>
</tr>
</tbody>
</table>
<p>Dunia baru berukuran 4x4 km dapat dibuat dalam 15-90 detik. Edit kreator (pemahatan, perubahan parameter) hanya menjalankan ulang tahap yang terdampak untuk chunk terkait, dan biasanya selesai dalam waktu kurang dari 5 detik.</p>
<h3 id="pipeline-rendering-browser" tabindex="-1">Pipeline Rendering (Browser) <a class="header-anchor" href="#pipeline-rendering-browser" aria-label="Permalink to &quot;Pipeline Rendering (Browser)&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Langkah</th>
<th>Jalur WebGPU</th>
<th>Fallback WebGL 2</th>
<th>Anggaran frame</th>
</tr>
</thead>
<tbody>
<tr>
<td>1. Streaming</td>
<td>Antrean prioritas, pre-fetch prediktif</td>
<td>Sama</td>
<td>N/A (asinkron)</td>
</tr>
<tr>
<td>2. Medan heightmap</td>
<td>Quadtree CDLOD berbasis GPU, compute culling, indirect draw</td>
<td>Geometry clipmap, pembaruan cincin oleh CPU</td>
<td>0,5-1 md</td>
</tr>
<tr>
<td>3. Mesh volumetrik</td>
<td>Compute marching cubes + Transvoxel</td>
<td>Mesh yang dibuat sebelumnya dari Web Worker, 2-3 LOD tersimpan dalam cache</td>
<td>0,5-2 md</td>
</tr>
<tr>
<td>4. Transisi LOD</td>
<td>Geomorphing dalam vertex shader</td>
<td>Sama</td>
<td>Termasuk di atas</td>
</tr>
<tr>
<td>5. Material</td>
<td>PBR triplanar + Laplacian blending + detail phasor noise + virtual texturing</td>
<td>PBR triplanar + linear blending + splat map yang telah di-bake</td>
<td>1-1,5 md</td>
</tr>
<tr>
<td>6. Vegetasi</td>
<td>ComputeInstanceCulling + IndirectBatchedMesh, penutup tanah berubin heksagonal</td>
<td>Frustum culling CPU + InstancedMesh</td>
<td>1-1,5 md</td>
</tr>
<tr>
<td>7. Air</td>
<td>Strip sungai yang sejajar dengan aliran, buih garis pantai berbasis kedalaman</td>
<td>Sama (refleksi lebih sederhana)</td>
<td>0,5 md</td>
</tr>
<tr>
<td>8. Bayangan</td>
<td>CSM 3-4 cascade + bayangan mandiri horizon map</td>
<td>CSM 2 cascade</td>
<td>0,5-1 md</td>
</tr>
<tr>
<td>9. Atmosfer</td>
<td>Model langit Hillaire + kabut volumetrik + partikel cuaca</td>
<td>Langit Preetham + kabut jarak</td>
<td>0,5 md</td>
</tr>
<tr>
<td>10. Efek dinamis</td>
<td>Akumulasi genangan, deformasi jejak kaki, salju/hujan</td>
<td>Akumulasi genangan, partikel hujan</td>
<td>0,3 md</td>
</tr>
<tr>
<td><strong>Total medan</strong></td>
<td></td>
<td></td>
<td><strong>3,5-6,5 md</strong></td>
</tr>
</tbody>
</table>
<p>Pada 60 fps (16,6 md per frame), sistem medan menggunakan 21% anggaran frame di WebGPU dan 39% di WebGL 2. Sisanya tersedia untuk avatar pemain, objek kreator, UI, jaringan, dan pascapemrosesan.</p>
<h3 id="mengapa-ini-berfungsi-di-browser" tabindex="-1">Mengapa Ini Berfungsi di Browser <a class="header-anchor" href="#mengapa-ini-berfungsi-di-browser" aria-label="Permalink to &quot;Mengapa Ini Berfungsi di Browser&quot;"></a></h3>
<p>Seluruh pipeline dirancang dengan mempertimbangkan tiga keterbatasan browser:</p>
<p><strong>Memori (maksimum 2-4 GB):</strong> Anggaran medan 256 MB mencukupi karena setiap chunk heightmap berukuran 2-8 KB (setelah delta encoding), volume SDF bersifat sparse (100-500 KB per chunk volumetrik), vegetasi dibuat saat runtime dari peta kepadatan 1 KB, dan tekstur menggunakan kompresi KTX2 (150 KB per 1024x1024). Pada waktu tertentu, dunia yang terlihat di browser memiliki ukuran total 50-200 MB.</p>
<p><strong>Tanpa akses disk:</strong> Semuanya dialirkan melalui jaringan. Pemuatan progresif membuat pemain melihat medan dalam &lt;100 md (heightmap resolusi rendah), medan bertekstur dalam &lt;300 md, dan detail penuh dalam ❤️ dtk. Pre-fetch berdasarkan kecepatan menyembunyikan waktu pemuatan selama penjelajahan normal.</p>
<p><strong>Kemampuan GPU sangat bervariasi:</strong> Jalur WebGPU menangani desktop kelas atas. Fallback WebGL 2 menangani perangkat lainnya, termasuk perangkat seluler. Data chunk yang sama menggerakkan kedua jalur. Perbedaannya terletak pada teknik rendering, bukan format data. Chromebook yang menjalankan WebGL 2 melihat dunia yang sama seperti RTX 4090 yang menjalankan WebGPU, hanya dengan detail lebih rendah dan jarak pandang lebih pendek.</p>
<h2 id="makalah-penelitian" tabindex="-1">Makalah Penelitian <a class="header-anchor" href="#makalah-penelitian" aria-label="Permalink to &quot;Makalah Penelitian&quot;"></a></h2>
<h3 id="representasi-medan-dan-pembuatan-mesh" tabindex="-1">Representasi Medan dan Pembuatan Mesh <a class="header-anchor" href="#representasi-medan-dan-pembuatan-mesh" aria-label="Permalink to &quot;Representasi Medan dan Pembuatan Mesh&quot;"></a></h3>
<p><strong>&quot;Marching Cubes: Algoritma Konstruksi Permukaan 3D Beresolusi Tinggi&quot;</strong> -- Lorensen dan Cline (SIGGRAPH 1987). <a href="https://doi.org/10.1145/37402.37422" target="_blank" rel="noreferrer">DOI</a>. Algoritma fundamental untuk mengekstrak mesh segitiga dari data volumetrik. Masih menjadi metode ekstraksi isosurface yang paling luas digunakan 38 tahun kemudian. Implementasi paralel GPU berjalan secara real-time dalam compute shader WebGPU.
<strong>&quot;Dual Contouring Data Hermite&quot;</strong> -- Ju, Losasso, Schaefer, Warren (SIGGRAPH 2002). <a href="https://doi.org/10.1145/566570.566586" target="_blank" rel="noreferrer">DOI</a>. Menghasilkan mesh yang mempertahankan fitur tajam (tepi tebing, sudut batu) yang dibulatkan oleh marching cubes. Memerlukan normal permukaan selain nilai jarak.</p>
<p><strong>&quot;Neural Dual Contouring&quot;</strong> -- Chen dkk. (2022). <a href="https://arxiv.org/abs/2202.01999" target="_blank" rel="noreferrer">arXiv:2202.01999</a>. Menggantikan penempatan verteks kuadrat terkecil dalam dual contouring dengan prediktor terlatih. Menghasilkan kualitas permukaan yang lebih baik untuk fitur alami yang kompleks.</p>
<p><strong>&quot;Algoritma Transvoxel&quot;</strong> -- Lengyel (2009, diperbarui 2024). <a href="https://transvoxel.org/" target="_blank" rel="noreferrer">transvoxel.org</a>. Transisi LOD yang mulus untuk medan voxel. Menghilangkan retakan pada batas resolusi menggunakan 73 jenis sel transisi. Bebas paten dan dirancang untuk aplikasi waktu nyata.</p>
<h3 id="lod-dan-rendering-medan" tabindex="-1">LOD dan Rendering Medan <a class="header-anchor" href="#lod-dan-rendering-medan" aria-label="Permalink to &quot;LOD dan Rendering Medan&quot;"></a></h3>
<p><strong>&quot;Geometry Clipmaps: Rendering Medan Menggunakan Grid Reguler Bersarang&quot;</strong> -- Losasso dan Hoppe (SIGGRAPH 2004). <a href="https://hhoppe.com/geomclipmap.pdf" target="_blank" rel="noreferrer">Makalah</a>. Rendering medan dengan biaya konstan menggunakan cincin LOD konsentris. Menangani medan berukuran 40 GB dengan kecepatan interaktif. Menjadi dasar bagi sebagian besar renderer medan di browser.</p>
<p><strong>&quot;CDLOD: LOD Hibrida untuk Rendering Medan&quot;</strong> -- Strugar (2014). <a href="https://www.vertexasylum.com/CDLOD/cdlod_latest.pdf" target="_blank" rel="noreferrer">Makalah</a>. Penyempurnaan geometry clipmap yang adaptif terhadap quadtree. Mengalokasikan resolusi berdasarkan kompleksitas medan, bukan hanya jarak.</p>
<p><strong>&quot;Pipeline Rendering Berbasis GPU&quot;</strong> -- Ubisoft (SIGGRAPH 2015), Wihlidal dan Hoppe. Memformalkan pendekatan berbasis GPU, dengan compute shader yang menangani culling, pemilihan LOD, dan pembuatan draw call. Pola arsitektur untuk pipeline medan WebGPU kami.</p>
<h3 id="pembuatan-medan-fisik" tabindex="-1">Pembuatan Medan Fisik <a class="header-anchor" href="#pembuatan-medan-fisik" aria-label="Permalink to &quot;Pembuatan Medan Fisik&quot;"></a></h3>
<p><strong>&quot;Erosi Analitis Berbasis Fisika untuk Pembuatan Medan Secara Cepat&quot;</strong> -- Cordonnier dkk. (2024). <a href="https://hal.science/hal-04525371" target="_blank" rel="noreferrer">HAL</a>. Erosi analitis berdasarkan hukum daya aliran yang tidak memerlukan simulasi iteratif. Menghasilkan medan yang masuk akal secara fisik dalam hitungan milidetik.</p>
<p><strong>&quot;Simulasi dan Visualisasi Erosi Hidraulis Cepat pada GPU&quot;</strong> -- Mei, Decaudin, Hu (2007). <a href="https://hal.science/hal-02281637/file/main.pdf" target="_blank" rel="noreferrer">HAL</a>. Erosi hidraulis paralel pada GPU menggunakan simulasi air dangkal. Menjadi dasar bagi sebagian besar implementasi erosi di game engine.</p>
<p><strong>&quot;Arenite: Simulator Batu Pasir Berbasis Fisika&quot;</strong> -- SIGGRAPH 2025. <a href="https://jango6324.github.io/arenite/" target="_blank" rel="noreferrer">Proyek</a>. Erosi multifisika yang menghasilkan lengkungan, hoodoo, dan ceruk dari simulasi tekanan dan erosi. Berjalan dalam waktu kurang dari 5 menit pada GPU desktop.</p>
<p><strong>&quot;Simulasi Aliran Rombakan yang Efisien untuk Erosi Medan Curam&quot;</strong> -- Purdue CGVLAB (2024). <a href="https://www.cs.purdue.edu/cgvlab/www/resources/papers/Arymaan-ToG-2024-efficient.pdf" target="_blank" rel="noreferrer">Makalah</a>. Aliran rombakan dan erosi lereng curam yang diakselerasi GPU untuk menghasilkan fitur medan pegunungan yang realistis.</p>
<p><strong>&quot;Erosi Medan Fleksibel&quot;</strong> -- IRIT-STORM (2024). <a href="https://link.springer.com/article/10.1007/s00371-024-03444-w" target="_blank" rel="noreferrer">Springer</a>. Erosi berbasis partikel yang dapat digunakan pada heightfield, grid voxel, permukaan implisit, dan material berlapis melalui satu antarmuka terpadu. Memungkinkan satu sistem erosi digunakan untuk representasi medan hibrida.</p>
<h3 id="detail-dan-tekstur-medan" tabindex="-1">Detail dan Tekstur Medan <a class="header-anchor" href="#detail-dan-tekstur-medan" aria-label="Permalink to &quot;Detail dan Tekstur Medan&quot;"></a></h3>
<p><strong>&quot;Pencampuran Tekstur Laplacian yang Ramah GPU&quot;</strong> -- Wronski (NVIDIA, 2025). <a href="https://jcgt.org/published/0014/01/02/" target="_blank" rel="noreferrer">JCGT</a>. Pencampuran piramida Laplacian waktu nyata untuk material medan tanpa prakomputasi. Mempertahankan fitur tajam sekaligus menghilangkan artefak sambungan. Hanya memerlukan beberapa pengambilan sampel tekstur tambahan per fragmen.</p>
<p><strong>&quot;Penyempurnaan Medan Waktu Nyata dengan Pola Prosedural Terkendali&quot;</strong> -- Grenier dkk. (2024). <a href="https://diglib.eg.org/bitstream/handle/10.1111/cgf14992/v43i1_05_cgf14992.pdf" target="_blank" rel="noreferrer">CGF</a>. Detail mikroerosi berbasis phasor noise hingga 32 kali resolusi heightmap. Pola yang disejajarkan dengan lereng dijalankan sepenuhnya dalam fragment shader.</p>
<h3 id="teselasi-adaptif" tabindex="-1">Teselasi Adaptif <a class="header-anchor" href="#teselasi-adaptif" aria-label="Permalink to &quot;Teselasi Adaptif&quot;"></a></h3>
<p><strong>&quot;Pohon Biner Konkuren untuk Komponen Game Berskala Besar&quot;</strong> -- Benyoub dan Dupuy (Intel, HPG 2024). <a href="https://arxiv.org/html/2407.02215v1" target="_blank" rel="noreferrer">Makalah</a>. Struktur data pohon biner yang ramah GPU untuk teselasi medan adaptif. Merender geometri berskala planet dalam waktu kurang dari 0,2 md. Dikembangkan dari domain persegi ke mesh poligon arbitrer.</p>
<h3 id="pembuatan-gua-dan-bawah-tanah" tabindex="-1">Pembuatan Gua dan Bawah Tanah <a class="header-anchor" href="#pembuatan-gua-dan-bawah-tanah" aria-label="Permalink to &quot;Pembuatan Gua dan Bawah Tanah&quot;"></a></h3>
<p><strong>&quot;PLUME: Engine Pemodelan Bawah Tanah Berlapis Secara Prosedural&quot;</strong> -- 2024. <a href="https://arxiv.org/html/2508.20926v1" target="_blank" rel="noreferrer">arXiv:2508.20926</a>. Framework sumber terbuka untuk menghasilkan lingkungan gua dan tabung lava realistis menggunakan aturan prosedural berlapis. Awalnya dibuat untuk robotika eksplorasi ruang angkasa.</p>
<h3 id="sintesis-medan-neural" tabindex="-1">Sintesis Medan Neural <a class="header-anchor" href="#sintesis-medan-neural" aria-label="Permalink to &quot;Sintesis Medan Neural&quot;"></a></h3>
<p><strong>&quot;InfiniteDiffusion: Menjembatani Fidelitas Hasil Pembelajaran dan Kegunaan Prosedural untuk Pembuatan Medan Dunia Terbuka&quot;</strong> -- Goslin (2025, SIGGRAPH 2026). <a href="https://arxiv.org/abs/2512.08309" target="_blank" rel="noreferrer">arXiv:2512.08309</a>. Pembuatan medan tanpa batas yang konsisten dengan seed menggunakan model difusi hierarkis dengan pengodean Laplacian. 9 kali lebih cepat daripada baseline pada GPU konsumen.</p>
<p><strong>&quot;TerraFusion: Pembuatan Bersama Geometri dan Tekstur Medan&quot;</strong> -- 2025. <a href="https://arxiv.org/abs/2505.04050" target="_blank" rel="noreferrer">arXiv:2505.04050</a>. Difusi laten untuk sintesis heightmap dan tekstur secara bersamaan dengan pengondisian sketsa.</p>
<p><strong>&quot;MESA: Pembuatan Medan Berbasis Teks&quot;</strong> -- Lokakarya CVPR 2025. <a href="https://arxiv.org/abs/2504.07210" target="_blank" rel="noreferrer">arXiv:2504.07210</a>. Pembuatan medan dari teks menggunakan data pelatihan penginderaan jauh Copernicus.</p>
<p><strong>&quot;Geodiffussr: Pembuatan Tekstur Medan Generatif dengan Fidelitas Elevasi&quot;</strong> -- 2025. <a href="https://arxiv.org/abs/2511.23029" target="_blank" rel="noreferrer">arXiv:2511.23029</a>. Pembuatan tekstur medan berbasis teks yang menghormati data elevasi menggunakan flow-matching.</p>
<p><strong>&quot;Sketch2Terrain: Pemetaan Sketsa Medan Waktu Nyata Berbasis AI&quot;</strong> -- 2025. <a href="https://tianyixiao.top/publication/2025-sketch2terrain" target="_blank" rel="noreferrer">Proyek</a>. Konversi sketsa menjadi medan dalam realitas tertambah. Peningkatan efisiensi sebesar 38% dibandingkan pemetaan manual.</p>
<h3 id="simulasi-vegetasi-dan-ekosistem" tabindex="-1">Simulasi Vegetasi dan Ekosistem <a class="header-anchor" href="#simulasi-vegetasi-dan-ekosistem" aria-label="Permalink to &quot;Simulasi Vegetasi dan Ekosistem&quot;"></a></h3>
<p><strong>&quot;Distribusi Prosedural Vegetasi Waktu Nyata Berbasis GPU pada Medan Virtual Berskala Besar&quot;</strong> -- SBGames 2018. <a href="https://sbgames.org/sbgames2018/files/papers/ComputacaoFull/188348.pdf" target="_blank" rel="noreferrer">Makalah</a>. Penyebaran vegetasi berbasis quadtree menggunakan faktor biotik/abiotik pada GPU.</p>
<p><strong>&quot;Pembuatan dan Rendering Hutan Secara Prosedural&quot;</strong> -- 2022. <a href="https://export.arxiv.org/pdf/2208.01471v1.pdf" target="_blank" rel="noreferrer">Makalah</a>. Pembuatan pohon dengan L-system yang dipadukan dengan simulasi persaingan ekosistem untuk menghasilkan distribusi hutan yang realistis.</p>
<p><strong>&quot;Pembuatan Prosedural Waktu Nyata dengan GPU Work Graphs&quot;</strong> -- AMD GPUOpen 2024. <a href="https://gpuopen.com/download/Real-Time_Procedural_Generation_with_GPU_Work_Graphs-GPUOpen_preprint.pdf" target="_blank" rel="noreferrer">Makalah</a>. GPU work graph yang menghasilkan lebih dari 79 ribu instans vegetasi dalam waktu kurang dari 4 md.</p>
<h3 id="teknologi-gpu-browser" tabindex="-1">Teknologi GPU Browser <a class="header-anchor" href="#teknologi-gpu-browser" aria-label="Permalink to &quot;Teknologi GPU Browser&quot;"></a></h3>
<p><strong>&quot;Renderer GSWT&quot;</strong> -- SIGGRAPH Asia 2025. <a href="https://github.com/zengyf131/gswt_renderer" target="_blank" rel="noreferrer">GitHub</a>. Renderer WebGPU + Rust/Wasm yang menggunakan Gaussian Splatting Wang Tiles untuk medan 3D tanpa batas dengan LOD dinamis dan streaming.</p>
<p><strong>&quot;Komputasi GPU di Browser Secepat Native: WebGPU Marching Cubes&quot;</strong> -- Usher (2024). <a href="https://www.willusher.io/graphics/2024/04/22/webgpu-marching-cubes/" target="_blank" rel="noreferrer">Blog</a>. Menunjukkan bahwa komputasi WebGPU mencapai performa setara native untuk algoritma pembuatan mesh paralel.</p>
<h3 id="rendering-voxel-dan-adegan-berskala-besar" tabindex="-1">Rendering Voxel dan Adegan Berskala Besar <a class="header-anchor" href="#rendering-voxel-dan-adegan-berskala-besar" aria-label="Permalink to &quot;Rendering Voxel dan Adegan Berskala Besar&quot;"></a></h3>
<p><strong>&quot;Aokana: Framework Rendering Voxel Berbasis GPU untuk Game Dunia Terbuka&quot;</strong> -- 2025. <a href="https://arxiv.org/abs/2505.02017" target="_blank" rel="noreferrer">arXiv:2505.02017</a>. Sparse Voxel DAG dengan LOD dan streaming untuk adegan yang berisi puluhan miliar voxel. Mengurangi penggunaan memori 9 kali lipat dan menghasilkan rendering 4,8 kali lebih cepat dibandingkan teknologi mutakhir sebelumnya. Dirancang untuk integrasi dengan game engine.</p>
<h3 id="geometri-prosedural-dan-pelapisan-ulang-permukaan" tabindex="-1">Geometri Prosedural dan Pelapisan Ulang Permukaan <a class="header-anchor" href="#geometri-prosedural-dan-pelapisan-ulang-permukaan" aria-label="Permalink to &quot;Geometri Prosedural dan Pelapisan Ulang Permukaan&quot;"></a></h3>
<p><strong>&quot;Pelapisan Ulang Permukaan Secara Prosedural dan Waktu Nyata Menggunakan GPU Mesh Shader&quot;</strong> -- Raad dkk. (Eurographics 2025). <a href="https://hal.science/hal-05176868v1/file/Paper_Resurfacing_2024.pdf" target="_blank" rel="noreferrer">Makalah</a>. Menghasilkan permukaan geometris mendetail dari mesh kontrol kasar saat rendering menggunakan mesh shader. Memungkinkan LOD dinamis tanpa menyimpan geometri beresolusi tinggi di memori.</p>
<h3 id="bayangan-medan" tabindex="-1">Bayangan Medan <a class="header-anchor" href="#bayangan-medan" aria-label="Permalink to &quot;Bayangan Medan&quot;"></a></h3>
<p><strong>&quot;Mengoptimalkan Bayangan Medan&quot;</strong> -- AMD GPUOpen. <a href="https://gpuopen.com/learn/optimizing-terrain-shadows/" target="_blank" rel="noreferrer">Blog</a>. Optimasi CSM praktis untuk medan berskala besar. Membahas pembagian cascade, rendering shadow map yang efisien pada GPU, dan optimasi khusus medan.</p>
<h3 id="geometri-virtual-dan-optimasi-mesh" tabindex="-1">Geometri Virtual dan Optimasi Mesh <a class="header-anchor" href="#geometri-virtual-dan-optimasi-mesh" aria-label="Permalink to &quot;Geometri Virtual dan Optimasi Mesh&quot;"></a></h3>
<p><strong>&quot;Nanite WebGPU&quot;</strong> -- Scthe (2024). <a href="https://github.com/Scthe/nanite-webgpu" target="_blank" rel="noreferrer">GitHub</a>, <a href="https://scthe.github.io/nanite-webgpu/" target="_blank" rel="noreferrer">Demo</a>. Implementasi lengkap arsitektur Nanite UE5 di browser: hierarki LOD meshlet, rasterizer perangkat lunak dalam WGSL, culling per meshlet, dan impostor billboard.</p>
<p><strong>&quot;Miliaran Segitiga dalam Hitungan Menit&quot;</strong> -- Kapoulkine (2025). <a href="https://zeux.io/2025/09/30/billions-of-triangles-in-minutes/" target="_blank" rel="noreferrer">Blog</a>. Meshoptimizer v1.0 untuk pembuatan LOD berklaster hierarkis. Memproses mesh masif menjadi DAG klaster bergaya Nanite secara efisien.</p>
<p><strong>&quot;Billboard Splatting (BBSplat)&quot;</strong> -- 2024. <a href="https://arxiv.org/abs/2411.08508" target="_blank" rel="noreferrer">arXiv:2411.08508</a>. Primitif planar bertekstur yang dapat dilatih untuk sintesis sudut pandang baru, dengan kompresi 17 kali lipat dibandingkan 3D Gaussian Splatting.</p>
<h3 id="pencahayaan-medan-dan-iluminasi-global" tabindex="-1">Pencahayaan Medan dan Iluminasi Global <a class="header-anchor" href="#pencahayaan-medan-dan-iluminasi-global" aria-label="Permalink to &quot;Pencahayaan Medan dan Iluminasi Global&quot;"></a></h3>
<p><strong>&quot;Iluminasi Global dalam Once Human&quot;</strong> -- GDC 2025. <a href="https://schedule.gdconf.com/session/global-illumination-in-once-human-a-hybrid-approach-for-16km-open-world/907269" target="_blank" rel="noreferrer">Sesi</a>. GI hibrida untuk dunia terbuka seluas 16 km: probe yang dikompresi jaringan neural (rasio 69:1), penanganan kebocoran dalam/luar ruangan berbasis ML, dan respons probe dinamis.</p>
<p><strong>&quot;GI dengan AMD FidelityFX Brixelizer&quot;</strong> -- GDC 2024. <a href="https://gpuopen.com/download/GDC2024_GI_with_AMD_FidelityFX_Brixelizer.pdf" target="_blank" rel="noreferrer">Makalah</a>. Cascade medan jarak renggang berbasis komputasi dengan probe screen-space. Tidak memerlukan ray tracing perangkat keras.</p>
<p><strong>&quot;Radiance Cascades&quot;</strong> -- 2024. <a href="https://jason.today/rc" target="_blank" rel="noreferrer">Blog</a>. Iluminasi global waktu nyata tanpa noise menggunakan struktur radiance bertingkat tanpa akumulasi temporal.</p>
<h3 id="desain-level-dan-eksplorasi" tabindex="-1">Desain Level dan Eksplorasi <a class="header-anchor" href="#desain-level-dan-eksplorasi" aria-label="Permalink to &quot;Desain Level dan Eksplorasi&quot;"></a></h3>
<p><strong>&quot;PlotMap: Desain Tata Letak Otomatis untuk Membangun Dunia Game&quot;</strong> -- 2023. <a href="https://arxiv.org/html/2309.15242v4" target="_blank" rel="noreferrer">arXiv:2309.15242</a>. Penempatan POI berbantuan AI yang memenuhi batasan spasial naratif pada medan.</p>
<p><strong>&quot;Pemicu Eksplorasi Spasial&quot;</strong> -- Purdue University (FDG 2022). <a href="https://web.ics.purdue.edu/~cmousas/papers/conf22-FDG-SpatialExploration.pdf" target="_blank" rel="noreferrer">Makalah</a>. Empat pola desain yang mendorong eksplorasi pemain: titik ekstrem, penghalang visual, objek yang tidak pada tempatnya, dan koneksi spasial.</p>
<h3 id="kompresi-dan-streaming-data" tabindex="-1">Kompresi dan Streaming Data <a class="header-anchor" href="#kompresi-dan-streaming-data" aria-label="Permalink to &quot;Kompresi dan Streaming Data&quot;"></a></h3>
<p><strong>&quot;Kompresi Progresif Point Cloud 3D Berbasis Entropi&quot;</strong> -- SGP 2024. <a href="https://inria.hal.science/hal-04630545v1/file/sgp2024.pdf" target="_blank" rel="noreferrer">Makalah</a>. Kompresi progresif yang dioptimalkan berdasarkan laju-distorsi menggunakan partisi ruang rekursif dengan kuantisasi adaptif. Menghasilkan aliran penyempurnaan yang sesuai untuk streaming jaringan dengan bandwidth variabel.</p>
<h3 id="pengeditan-interaktif" tabindex="-1">Pengeditan Interaktif <a class="header-anchor" href="#pengeditan-interaktif" aria-label="Permalink to &quot;Pengeditan Interaktif&quot;"></a></h3>
<p><strong>&quot;Editor SDF WebGPU&quot;</strong> -- Nijhoff (2026). <a href="https://reindernijhoff.net/2026/01/webgpu-sdf-editor-real-time-signed-distance-field-modeling/" target="_blank" rel="noreferrer">Proyek</a>. Pemodelan SDF berfitur lengkap di browser dengan marching cubes waktu nyata, operasi boolean, pencampuran halus, dan partisi ruang octree. 112 byte per primitif.</p>
<h3 id="pembuatan-sungai-dan-pesisir" tabindex="-1">Pembuatan Sungai dan Pesisir <a class="header-anchor" href="#pembuatan-sungai-dan-pesisir" aria-label="Permalink to &quot;Pembuatan Sungai dan Pesisir&quot;"></a></h3>
<p><strong>&quot;Daerah Aliran Sungai Prosedural&quot;</strong> -- Patel (Red Blob Games). <a href="https://www.redblobgames.com/x/1723-procedural-river-growing/" target="_blank" rel="noreferrer">Proyek</a>. Pembuatan sungai yang mendahulukan drainase menggunakan klasifikasi tepi mesh Voronoi/segitiga. Membangun hierarki sungai sebelum menetapkan elevasi medan.</p>
<p><strong>&quot;NEWTS1.0: Model Numerik Erosi Pesisir oleh Gelombang dan Tebing Transgresif&quot;</strong> -- MIT (2024). <a href="https://dspace.mit.edu/handle/1721.1/157677" target="_blank" rel="noreferrer">Makalah</a>. Model erosi pesisir sederhana yang menggunakan kemunduran seragam dan erosi akibat gelombang. Menghasilkan tanjung, teluk, pilar laut, dan lengkungan yang sesuai dengan geomorfologi nyata.</p>
<h2 id="bacaan-lebih-lanjut" tabindex="-1">Bacaan Lebih Lanjut <a class="header-anchor" href="#bacaan-lebih-lanjut" aria-label="Permalink to &quot;Bacaan Lebih Lanjut&quot;"></a></h2>
<ul>
<li><a href="/id/guides/browser-3d-open-world-tech.html">Teknologi Dunia Terbuka 3D di Browser</a> membahas arsitektur lengkap untuk dunia kreator multipemain di browser</li>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Game Web pada 2026</a> membahas dasar-dasar WebGL, WebGPU, dan WebAssembly</li>
<li><a href="/id/guides/threejs-usdc-tech-report.html">Laporan Teknis Three.js + USDC</a> tentang pemuatan aset 3D di browser</li>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Mutakhir</a> untuk pipeline pembuatan berbasis AI</li>
<li><a href="/id/tutorials/webgpu-getting-started.html">Memulai WebGPU</a> — compute shader untuk medan berbasis GPU</li>
<li><a href="/id/tutorials/web-workers-game-logic.html">Web Worker untuk logika game</a> — memindahkan pembuatan medan ke Worker</li>
<li><a href="/id/tutorials/game-physics-libraries.html">Library fisika game</a> — fisika untuk interaksi medan dan collider heightfield</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — sumber tekstur dan material untuk rendering medan</li>
</ul>
<BuildCta
  title="Masukkan lanskap yang dihasilkan ke dalam game"
  desc="Medan akan lebih menarik jika Anda bisa berjalan di atasnya."
  prompt="Buat game yang berlatar di lembah pegunungan yang dihasilkan secara prosedural" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/landscape-generation-browser.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Teknologi Dunia Terbuka 3D di Browser untuk Dunia Kreator Multipemain]]></title>
            <link>https://app.cinevva.com/id/guides/browser-3d-open-world-tech</link>
            <guid>https://app.cinevva.com/id/guides/browser-3d-open-world-tech</guid>
            <pubDate>Fri, 20 Feb 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Riset mendalam tentang teknologi rendering, jaringan, streaming, dan pembangunan dunia yang diperlukan untuk menghadirkan para kreator dalam dunia terbuka 3D bersama berbasis browser yang dapat mereka bentuk bersama.]]></description>
            <content:encoded><![CDATA[<h1 id="teknologi-dunia-terbuka-3d-di-browser-untuk-dunia-kreator-multipemain" tabindex="-1">Teknologi Dunia Terbuka 3D di Browser untuk Dunia Kreator Multipemain <a class="header-anchor" href="#teknologi-dunia-terbuka-3d-di-browser-untuk-dunia-kreator-multipemain" aria-label="Permalink to &quot;Teknologi Dunia Terbuka 3D di Browser untuk Dunia Kreator Multipemain&quot;"></a></h1>
<p>Kami ingin menghadirkan para kreator kami dalam sebuah dunia terbuka bersama. Bukan lobi. Bukan galeri. Melainkan ruang 3D hidup tempat orang dapat menjelajah, membangun, dan secara tak sengaja menemukan karya satu sama lain. Sesuatu yang dapat dimuat di tab browser dan terasa seperti tempat yang layak dihuni.</p>
<p>Itu masalah yang sulit. Skyrim dan The Witcher 3 menghabiskan ratusan juta dolar untuk membangun dunia mereka, dan keduanya masih didistribusikan untuk perangkat keras khusus dengan data puluhan gigabita di penyimpanan. Target kami adalah sebuah tab browser, status bersama untuk ratusan pemain, dan dunia yang benar-benar dapat dibentuk ulang oleh para kreator.</p>
<p>Panduan ini mendokumentasikan temuan kami dari riset teknologi tersebut. Apa yang mungkin dilakukan saat ini, apa yang akan segera hadir, dan arsitektur seperti apa yang dapat mewujudkannya.</p>
<h2 id="pelajaran-yang-dapat-kita-ambil-dari-skyrim-dan-the-witcher" tabindex="-1">Pelajaran yang Dapat Kita Ambil dari Skyrim dan The Witcher <a class="header-anchor" href="#pelajaran-yang-dapat-kita-ambil-dari-skyrim-dan-the-witcher" aria-label="Permalink to &quot;Pelajaran yang Dapat Kita Ambil dari Skyrim dan The Witcher&quot;"></a></h2>
<p>Sebelum memilih teknologi, ada baiknya memahami cara kerja dua dunia terbuka paling sukses. Teknik yang mereka gunakan ternyata sangat sesuai dengan keterbatasan browser.</p>
<h3 id="sistem-sel-skyrim" tabindex="-1">Sistem Sel Skyrim <a class="header-anchor" href="#sistem-sel-skyrim" aria-label="Permalink to &quot;Sistem Sel Skyrim&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/JSRtYpNRoN0" title="Trailer Skyrim Special Edition" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Dunia terbuka Skyrim melakukan streaming kisi sel 5x5 di sekitar pemain. Pegunungan di kejauhan merupakan penyaru beresolusi rendah. Anda tidak pernah menyadarinya.</div>
<p>Skyrim membagi dunianya menjadi kisi berisi 57x37 sel eksterior, masing-masing berukuran 4096x4096 unit gim (sekitar 59 meter). Mesin gim memuat kisi 5x5 sel di sekitar pemain setiap saat. Saat Anda berjalan, sel di sisi belakang dikeluarkan dari memori sementara sel di sisi depan dimuat melalui streaming. Ruang interior (ruang bawah tanah, bangunan) merupakan ruang dunia terpisah yang dimuat melalui pemicu pintu.</p>
<p>Cara ini dapat diterapkan secara langsung pada dunia di browser. Anda tidak memuat seluruh peta. Anda memuat area di sekitar pemain dan mengganti potongan dunia saat mereka bergerak. Wawasan utamanya: Skyrim tidak pernah membiarkan Anda melihat seluruh detail medan yang jauh. Gim ini menggunakan pendekatan multiresolusi.</p>
<p><strong>Tingkatan LOD (Level of Detail/Tingkat Detail) di Skyrim:</strong></p>
<ul>
<li>Detail penuh dalam jarak 1-2 sel (area terdekat pemain)</li>
<li>Mesh yang disederhanakan pada jarak menengah (objek kehilangan geometri kecil)</li>
<li>Penyaru billboard untuk pohon dan batu di luar jarak menengah</li>
<li>LOD medan menggunakan mesh beresolusi rendah yang telah dipanggang untuk lanskap jauh</li>
<li>Jarak pemudaran objek disesuaikan per objek (rumput memudar lebih dahulu, bangunan paling akhir)</li>
</ul>
<p>Lanskap Skyrim menggunakan medan berbasis heightmap dengan petak 32x32 verteks per sel. Setiap petak dapat memiliki tekstur berbeda yang dipadukan dengan alpha map. Data seperti ini ringan untuk disimpan dan dirender. Data medan satu sel dihitung dalam kilobita, bukan megabita.</p>
<p><strong>Yang dapat kita terapkan:</strong> Streaming berbasis potongan, medan heightmap, LOD agresif, pemisahan interior/eksterior, serta gagasan bahwa medan yang jauh tidak perlu akurat secara geometris—cukup meyakinkan secara visual.</p>
<h3 id="arsitektur-streaming-the-witcher-3" tabindex="-1">Arsitektur Streaming The Witcher 3 <a class="header-anchor" href="#arsitektur-streaming-the-witcher-3" aria-label="Permalink to &quot;Arsitektur Streaming The Witcher 3&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/53MyR_Z3i1w" title="The Witcher 3: Wild Hunt - Dunia Terbuka yang Indah" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Dunia The Witcher 3 seluas 136 km2 menggunakan streaming yang sadar konten. Pohon yang berjarak lebih dari 200 m merupakan penyaru datar. Bangunan dimuat melalui streaming secara terpisah dari medan.</div>
<p>Dunia The Witcher 3 lebih luas daripada Skyrim (sekitar 136 km2 di seluruh wilayah) dan menggunakan sistem streaming yang lebih canggih. CD Projekt RED membangun mesin khusus (REDengine 3) yang membagi dunia menjadi sektor-sektor streaming, bukan kisi yang kaku.</p>
<p>Setiap sektor memuat hierarki lapisan konten:</p>
<ul>
<li><strong>Medan</strong> dimuat melalui streaming sebagai petak dengan 4 tingkat LOD</li>
<li><strong>Vegetasi</strong> menggunakan instancing GPU dengan culling berbasis jarak</li>
<li><strong>Geometri statis</strong> (bangunan, batu) dimuat melalui streaming secara terpisah dari medan</li>
<li><strong>Objek alur permainan</strong> (NPC, item, pemicu) dimuat berdasarkan status misi dan jarak</li>
</ul>
<p>Renderer menggunakan deferred shading dengan material berbasis fisika. Salah satu trik yang sangat relevan: The Witcher 3 menggunakan penyaru secara agresif. Pohon yang berjarak 200 meter bukanlah model 3D dengan cabang dan daun. Pohon itu berupa bidang segi empat bertekstur datar yang selalu menghadap kamera. Mesin gim melakukan pra-render penyaru ini dari beberapa sudut, lalu menggantinya saat kamera bergerak. Anda tidak pernah menyadarinya karena objek tersebut berada cukup jauh.</p>
<p><strong>Komposisi dunia:</strong> Dunia terbuka The Witcher 3 dibangun dalam sejumlah lapisan oleh tim-tim terpisah yang bekerja secara bersamaan. Tim medan membentuk lanskap. Tim seni lingkungan menempatkan struktur. Tim misi menghubungkan pemicu dan jalur NPC. Sistem komposisi berlapis ini memungkinkan tim besar bekerja tanpa saling mengganggu.</p>
<p><strong>Yang dapat kita terapkan:</strong> Komposisi dunia berlapis (sangat penting untuk platform kreator), rendering penyaru untuk objek jauh, deferred rendering untuk banyak sumber cahaya, serta wawasan bahwa streaming harus sadar konten (jangan muat interior yang tidak dapat dilihat, jangan munculkan NPC yang tidak berada di dekat pemain).</p>
<h3 id="mesin-kimia-breath-of-the-wild" tabindex="-1">Mesin Kimia Breath of the Wild <a class="header-anchor" href="#mesin-kimia-breath-of-the-wild" aria-label="Permalink to &quot;Mesin Kimia Breath of the Wild&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/zw47_q9wbBE" title="Zelda: Breath of the Wild - Trailer Presentasi Nintendo Switch" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">BotW berjalan pada perangkat keras kelas tablet dan terlihat memukau. Gaya cel-shaded, kabut jarak bergaya cat air, serta interaksi sistemis alih-alih konten berskrip. Standar emas untuk dunia terbuka bergaya.</div>
<p>Pendekatan Nintendo terhadap desain dunia terbuka membalik formula pada umumnya. Alih-alih memenuhi dunia dengan konten berskrip, mereka membangun aturan sistemis dan membiarkan pemain menemukan perilaku emergen. Api menjalar ke rumput. Logam menghantarkan listrik saat badai petir. Angin membawa objek. Segala sesuatu berinteraksi dengan yang lain melalui lapisan fisika/kimia yang konsisten.</p>
<p>Hal ini penting bagi dunia kreator karena menunjukkan bahwa dunia itu sendiri dapat lebih menarik daripada objek mana pun yang ditempatkan di dalamnya. Jika kreator dapat menentukan properti material dan aturan interaksi (bukan sekadar menempatkan mesh statis), dunia akan memperoleh perilaku emergen yang membuat penjelajahan tetap menarik, bahkan di area yang tidak dirancang secara khusus oleh siapa pun.</p>
<p><strong>Pelajaran teknis dari BotW:</strong></p>
<ul>
<li>Jumlah poligon dan resolusinya relatif rendah (900p saat Switch terpasang ke dok). Tampilan cel-shaded yang bergaya menyamarkan fidelitas rendah tersebut. Dunia di browser saat ini dapat mencapai kualitas visual serupa.</li>
<li>Rendering jarak jauh menggunakan kabut toon-shaded yang memudar menjadi skybox bergaya cat air. Murah untuk dirender, tetapi indah dalam praktiknya. Perspektif atmosfer seperti ini pada dasarnya tidak membutuhkan biaya tambahan dalam fragment shader.</li>
<li>Luas dunianya sekitar 84 km2, tetapi renggang. Sebagian besar peta berupa medan yang dapat dilintasi dengan titik-titik menarik yang tersebar di seluruh wilayah. Konten padat dikhususkan untuk kota dan kuil. Pendekatan &quot;renggang tetapi menarik&quot; ini secara drastis mengurangi kebutuhan aset dibandingkan dengan Novigrad di The Witcher 3 yang padat penduduk.</li>
<li>Objek fisika memiliki tag material (kayu, logam, makanan, bahan peledak) yang menentukan interaksinya. Jumlah aturan sebenarnya sedikit (mungkin 20-30 jenis interaksi), tetapi semuanya berpadu dengan cara yang terasa tak terbatas.</li>
</ul>
<h3 id="pelapisan-dunia-gta-v" tabindex="-1">Pelapisan Dunia GTA V <a class="header-anchor" href="#pelapisan-dunia-gta-v" aria-label="Permalink to &quot;Pelapisan Dunia GTA V&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/QkkoHAzjnUs" title="Trailer Resmi Grand Theft Auto V" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Los Santos di GTA V terasa hidup berkat sistem ambien berlapis: lalu lintas, pejalan kaki, waktu, dan cuaca. Bangunan di kejauhan merupakan foto komposit, bukan model 3D.</div>
<p>Pendekatan Rockstar terhadap Los Santos mengajarkan pelajaran yang berbeda. Dunia GTA V terasa hidup berkat sistem ambien berlapis, bukan karena setiap NPC memiliki misi.</p>
<p>Kota tersebut memiliki sistem lalu lintas yang menyimulasikan ratusan kendaraan di jaringan jalan. Pejalan kaki menyusuri rute, bereaksi terhadap pemain, dan berinteraksi satu sama lain. Waktu mengubah kepadatan populasi, jenis NPC yang hadir, dan aktivitas ambien. Cuaca memengaruhi fisika berkendara dan perilaku NPC.</p>
<p>Bagi dunia kreator, wawasannya adalah bahwa kehidupan ambien menentukan perbedaan antara dunia yang terasa seperti museum dan dunia yang terasa seperti tempat sungguhan. Bahkan perilaku sederhana (burung yang terbang di atas kepala, ombak yang menyapu pantai, NPC yang berjalan di antara bangunan) menciptakan ilusi dunia yang hidup.</p>
<p><strong>Pelajaran teknis dari GTA V:</strong></p>
<ul>
<li>Luas petanya 75 km2 dan menggunakan LOD agresif yang dipadukan dengan sistem streaming berbasis kecepatan (berkendara cepat akan memuat area lebih jauh di depan daripada berjalan kaki).</li>
<li>GTA Online menempatkan 30 pemain secara bersamaan di dunia ini. Bahkan dengan 30 pemain, Rockstar menyadari bahwa mereka memerlukan pengelolaan relevansi spasial: Anda menerima pembaruan mendetail tentang pemain di sekitar dan pembaruan yang lebih jarang tentang pemain jauh. Prinsip yang sama berlaku untuk target kami yang mencapai 200 pemain.</li>
<li>Pipeline aset GTA V merupakan salah satu yang paling efisien yang pernah dibuat. Seluruh gim hanya berukuran sekitar 80 GB berkat kompresi tekstur ekstrem, penggunaan bersama mesh, dan detail prosedural. Interior bangunannya banyak menggunakan kembali komponen modular.</li>
<li>Gim ini menggunakan sistem penyaru canggih yang membuat bangunan jauh sebenarnya berupa foto-foto datar yang dikomposisikan bersama. Pemain tidak pernah menyadarinya karena jarak transisi disesuaikan dengan sudut pandang tertentu.</li>
</ul>
<h3 id="dunia-terbuka-tanpa-jeda-elden-ring" tabindex="-1">Dunia Terbuka Tanpa Jeda Elden Ring <a class="header-anchor" href="#dunia-terbuka-tanpa-jeda-elden-ring" aria-label="Permalink to &quot;Dunia Terbuka Tanpa Jeda Elden Ring&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/E3Huy2cdih0" title="Trailer Alur Permainan Resmi Elden Ring" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Peta Elden Ring seluas 79 km2 memadukan medan terbuka yang renggang dengan ruang bawah tanah padat buatan tangan. Aset lingkungan yang sama muncul di mana-mana dalam susunan berbeda. Pengulangan tidak terasa ketika komposisi dan pencahayaannya bervariasi.</div>
<p>FromSoftware membangun Elden Ring dengan mesin yang sama seperti Dark Souls, tetapi memperluas skalanya menjadi dunia terbuka. Hasilnya menarik karena menunjukkan cara tim yang relatif kecil (dibandingkan dengan Rockstar atau CD Projekt) dapat membangun dunia terbuka yang luas.</p>
<p>Triknya adalah variasi kepadatan. Peta Elden Ring sangat luas (sekitar 79 km2), tetapi sebagian besar wilayahnya berupa medan terbuka dengan musuh dan titik menarik yang tersebar. Konten padat buatan tangan (Legacy Dungeon seperti Stormveil Castle) ditanamkan dalam dunia terbuka dan menggunakan pemisahan interior/eksterior yang sama seperti Skyrim.</p>
<p><strong>Pelajaran teknis dari Elden Ring:</strong></p>
<ul>
<li>Dunia dimuat melalui streaming dalam petak-petak besar. Saat menunggang kuda, Anda dapat melihat sangat jauh, tetapi medan di kejauhan sangat disederhanakan. Dari dekat, detailnya sebanding dengan Dark Souls 3.</li>
<li>Layar pemuatan hanya muncul ketika melakukan perjalanan cepat atau memasuki ruang bawah tanah tertentu. Dunia terbukanya sendiri dimuat melalui streaming tanpa gangguan.</li>
<li>Gim ini menggunakan kembali aset lingkungan secara ekstensif. Model pohon, formasi batu, dan komponen reruntuhan yang sama muncul di seluruh peta dalam susunan berbeda. Dengan variasi susunan dan pencahayaan yang cukup, pengulangannya tidak terasa. Hal ini dapat diterapkan secara langsung pada dunia kreator, tempat pustaka komponen modular dapat menghasilkan variasi tanpa batas.</li>
<li>Mode multipemainnya berbasis sesi (memanggil pemain lain ke dunia Anda), bukan persisten. Namun, fitur asinkron (pesan, noda darah, dan bayangan pemain lain) menciptakan kesan hidup bersama tanpa beban jaringan dari server persisten. Fitur multipemain ambien seperti ini dapat ditambahkan ke dunia browser dengan biaya rendah.</li>
</ul>
<h3 id="no-man-s-sky-semuanya-prosedural" tabindex="-1">No Man's Sky: Semuanya Prosedural <a class="header-anchor" href="#no-man-s-sky-semuanya-prosedural" aria-label="Permalink to &quot;No Man's Sky: Semuanya Prosedural&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/nLtmEjqzg7M" title="Trailer No Man's Sky NEXT" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">18 kuintiliun planet dihasilkan dari seed bersama. Setiap pemain melihat alam semesta yang sama tanpa menyimpannya di server. Data pembangunan markas sangat ringkas: ID komponen beserta transformasinya.</div>
<p>No Man's Sky merupakan contoh ekstrem generasi prosedural. Ada 18 kuintiliun planet yang dihasilkan dari seed bersama, sehingga setiap pemain melihat alam semesta yang sama tanpa perlu menyimpan semua itu di server.</p>
<p>Pipeline generasinya bekerja secara bertahap: seed tingkat galaksi menentukan posisi bintang, seed bintang menentukan jumlah dan jenis planet, sedangkan seed planet menggerakkan pembuatan medan (noise multioktaf), penetapan bioma, spesies flora/fauna, palet warna, dan distribusi sumber daya. Semuanya dihitung secara deterministik dari seed, sehingga dua pemain yang mengunjungi koordinat yang sama akan melihat planet yang sama tanpa bertukar data planet apa pun.
<strong>Pelajaran teknis dari No Man's Sky:</strong></p>
<ul>
<li>Pembuatan medan menggunakan marching cubes berbasis voxel dengan serangkaian fungsi noise. Pendekatan ini memungkinkan gua, tonjolan, dan pulau terapung yang tidak dapat direpresentasikan oleh medan berbasis heightmap. Konsekuensinya adalah biaya komputasi per chunk yang lebih tinggi, tetapi hasilnya berupa medan yang lebih menarik secara visual.</li>
<li>Sistem pembangunan markasnya paling mendekati apa yang kami bayangkan. Pemain menempatkan struktur yang tersimpan secara persisten di server dan terlihat oleh pemain lain. Data markasnya ringkas (daftar bagian beserta posisi dan rotasinya) dan dialirkan sesuai permintaan saat seseorang mengunjungi planet tersebut.</li>
<li>Gim ini awalnya dikritik karena kontennya repetitif meskipun memiliki variasi tak terbatas. Pembuatan berbasis seed dapat menghasilkan medan tak terbatas, tetapi hanya sedikit kejutan. Pelajarannya: pembuatan prosedural cocok untuk menyediakan kanvas, tetapi konten yang ditempatkan kreatorlah yang membuat suatu tempat terasa dirancang dan memiliki tujuan.</li>
<li>Hello Games menambahkan multipemain bertahun-tahun setelah peluncuran. Hingga 32 pemain berbagi satu sesi dengan fitur pembangunan dan penjelajahan penuh. Model jaringannya sederhana: satu pemain menjadi host, sementara yang lain terhubung. Untuk dunia browser dengan status persisten, model server-authoritative lebih cocok, tetapi No Man's Sky membuktikan bahwa dunia prosedural bersama dapat diwujudkan.</li>
</ul>
<h3 id="minecraft-cetak-biru-dunia-kreator" tabindex="-1">Minecraft: Cetak Biru Dunia Kreator <a class="header-anchor" href="#minecraft-cetak-biru-dunia-kreator" aria-label="Permalink to &quot;Minecraft: Cetak Biru Dunia Kreator&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/MmB9b5njVbA" title="Trailer Resmi Minecraft" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">300 juta kopi terjual. Tekstur piksel 16x16. Medan dapat diedit sepenuhnya. Dibuat tanpa batas. Multipemain. Referensi terpenting untuk dunia kreator. Klona berbasis browser membuktikan konsep ini berfungsi di WebGL.</div>
<p>Minecraft adalah acuan terpenting bagi apa yang sedang kami bangun, bahkan lebih penting daripada gim AAA mana pun dengan grafis canggih. 300 juta kopi terjual. Dunianya dibuat tanpa batas, dapat dihancurkan sepenuhnya, dan mendukung multipemain. Kreator tidak sekadar menempatkan objek di Minecraft. Mereka membentuk ulang medannya sendiri.</p>
<p><strong>Pelajaran teknis dari Minecraft:</strong></p>
<ul>
<li>Dunia dibagi menjadi chunk blok berukuran 16x16x384. Hanya chunk di dekat pemain yang dimuat (jarak render dapat dikonfigurasi). Ini adalah pola streaming chunk yang sama seperti Skyrim, tetapi dengan medan yang dapat diedit sepenuhnya.</li>
<li>Setiap chunk disimpan sebagai array ID blok yang dikompresi dengan palet. Chunk yang hanya memiliki 5 jenis blok berbeda menyimpan indeks palet 4-bit per blok, bukan ID blok lengkap. Ini membuat data chunk sangat ringkas (biasanya 10–50 KB per chunk setelah kompresi).</li>
<li>Protokol multipemain Minecraft terdokumentasi dengan baik dan relatif sederhana. Server mengirimkan data chunk saat pemain bergerak. Perubahan blok disiarkan sebagai pembaruan delta kecil (posisi + jenis blok baru). Inilah model yang akan kami gunakan untuk suntingan kreator.</li>
<li>Gim ini berjalan di Java dan kini memiliki Bedrock Edition dalam C++. Terdapat klona Minecraft berbasis browser (ClassiCube, eaglercraft) yang membuktikan bahwa konsep intinya berfungsi di WebGL. Klona tersebut biasanya mampu menangani jarak render 8–12 chunk pada 60fps, yang menghasilkan jarak pandang sekitar 200–400 meter.</li>
<li>Ekosistem modding Minecraft adalah keunggulan kompetitifnya yang sesungguhnya. Mod menambahkan blok, entitas, bioma, dan sistem permainan baru. Untuk dunia kreator, hal ini menunjukkan bahwa ekstensibilitas sama pentingnya dengan pengalaman dasar. Jika kreator dapat menentukan jenis interaksi baru (bukan sekadar menempatkan objek), dunia akan semakin kaya seiring waktu.</li>
<li>Redstone (sistem perkabelan dalam gim Minecraft) menunjukkan bahwa kreator akan membangun sistem kompleks jika diberi komponen dasar yang sederhana dan dapat dirangkai. Gerbang logika, pertanian otomatis, kalkulator. Kumpulan aturan sederhana menghasilkan kompleksitas luar biasa. Ini adalah pelajaran yang sama dengan mesin kimia BotW.</li>
</ul>
<h3 id="pola-umum-di-berbagai-dunia-terbuka-aaa" tabindex="-1">Pola Umum di Berbagai Dunia Terbuka AAA <a class="header-anchor" href="#pola-umum-di-berbagai-dunia-terbuka-aaa" aria-label="Permalink to &quot;Pola Umum di Berbagai Dunia Terbuka AAA&quot;"></a></h3>
<p>Jika melihat semua judul ini, pola yang sama terus bermunculan:</p>
<p><strong>Partisi spasial</strong> digunakan secara universal. Baik berupa cell (Bethesda), sector (CD Projekt), chunk (Mojang/Rockstar), maupun tile (FromSoftware), setiap dunia terbuka membagi ruang menjadi unit-unit yang dapat dimuat. Tidak ada engine yang mencoba menyimpan seluruh dunia di dalam memori.</p>
<p><strong>Segalanya memiliki banyak resolusi.</strong> Medan, mesh, tekstur, bahkan audio memiliki beberapa tingkat kualitas. Resolusi yang diperoleh bergantung pada seberapa dekat jaraknya dan seberapa penting objek tersebut.</p>
<p><strong>Occlusion culling</strong> lebih penting daripada throughput segitiga mentah. Tidak merender apa yang tak terlihat menghemat lebih banyak performa dibandingkan mengoptimalkan apa yang terlihat. Skyrim menggunakan sistem sederhana berbasis jarak. The Witcher 3 menggunakan software occlusion dengan occluder besar (bangunan, tebing). Engine modern seperti Nanite milik UE5 mengembangkan pendekatan ini lebih jauh dengan hardware occlusion query.</p>
<p><strong>Pemuatan asinkron</strong> menyamarkan transisi. Gim-gim ini tidak menampilkan layar pemuatan untuk dunia terbuka (hanya untuk perjalanan cepat atau transisi ke interior). Konten dimuat melalui thread latar belakang, didekompresi secara paralel, lalu konten baru dimasukkan secara bertahap.</p>
<p><strong>Arahan artistik lebih penting daripada jumlah poligon.</strong> Skyrim diluncurkan pada 2011 dengan grafis yang bahkan saat itu tergolong sederhana. BotW berjalan pada cip kelas tablet dan tetap terlihat indah. Minecraft menggunakan tekstur piksel 16x16 dan merupakan salah satu gim paling mudah dikenali secara visual sepanjang masa. Bagi dunia browser, hal ini sangat penting. Gaya visual yang terarah dengan fidelitas lebih rendah akan selalu mengungguli dunia yang maju secara teknis tetapi hambar secara artistik.</p>
<p><strong>Desain sistemik mengungguli konten berskrip.</strong> Mesin kimia BotW, interaksi blok Minecraft, dan sistem lalu lintas GTA V sama-sama menciptakan perilaku emergen dari aturan sederhana. Pendekatan ini lebih murah untuk dibuat, lebih murah untuk dijalankan, dan menghasilkan lebih banyak cerita pemain dibandingkan rangkaian skrip buatan tangan. Untuk dunia kreator, desain sistemik berarti dunia tetap menarik, bahkan di area yang tidak pernah dirancang secara khusus oleh siapa pun.</p>
<p><strong>Konten yang ditempatkan kreator membutuhkan persistensi dan visibilitas.</strong> Markas Minecraft, markas No Man's Sky, dan properti GTA Online tetap tersimpan lintas sesi serta terlihat oleh pemain lain. Model data untuk konten kreator selalu ringkas (ID bagian + transform), sementara representasi visualnya kaya (klien mengembangkan data tersebut menjadi adegan 3D lengkap).</p>
<h2 id="rendering-apa-yang-sebenarnya-dapat-dilakukan-browser" tabindex="-1">Rendering: Apa yang Sebenarnya Dapat Dilakukan Browser? <a class="header-anchor" href="#rendering-apa-yang-sebenarnya-dapat-dilakukan-browser" aria-label="Permalink to &quot;Rendering: Apa yang Sebenarnya Dapat Dilakukan Browser?&quot;"></a></h2>
<h3 id="three-js" tabindex="-1">Three.js <a class="header-anchor" href="#three-js" aria-label="Permalink to &quot;Three.js&quot;"></a></h3>
<p>Three.js adalah fondasinya. Three.js memiliki komunitas terbesar (lebih dari 100 ribu bintang GitHub), contoh terbanyak, dan kompatibilitas terluas. Library ini mengabstraksikan WebGL 2 dan memiliki dukungan WebGPU eksperimental melalui <code>WebGPURenderer</code>.</p>
<p>Untuk dunia terbuka, Three.js menyediakan:</p>
<ul>
<li><strong>Rendering instans</strong> untuk vegetasi, bebatuan, dan geometri berulang (<code>InstancedMesh</code>)</li>
<li><strong>Sistem LOD</strong> bawaan (<code>THREE.LOD</code> menukar mesh berdasarkan jarak)</li>
<li><strong>Frustum culling</strong> otomatis per objek</li>
<li><strong>Medan</strong> melalui <code>BufferGeometry</code> khusus atau <code>PlaneGeometry</code> berbasis heightmap</li>
<li><strong>Material PBR</strong> melalui <code>MeshStandardMaterial</code> dan <code>MeshPhysicalMaterial</code></li>
<li><strong>Pascapemrosesan</strong> melalui <code>EffectComposer</code> (bloom, SSAO, tone mapping)</li>
<li><strong>Shadow map</strong>, dengan cascaded shadow mapping yang dapat diterapkan melalui kode khusus</li>
<li><strong>glTF/GLB</strong> sebagai format aset utama (ringkas dan siap untuk GPU)</li>
</ul>
<p>Three.js juga memiliki ekosistem aktif berisi alat-alat yang penting bagi dunia terbuka. <code>three-mesh-bvh</code> mempercepat raycasting dan kueri spasial pada mesh kompleks. <code>postprocessing</code> (oleh vanruesc) menyediakan rangkaian pascapemrosesan yang lebih berperforma daripada rangkaian bawaan Three. <code>three-gpu-pathtracing</code> memungkinkan rendering berkualitas referensi.</p>
<p><strong>Keterbatasan untuk dunia terbuka:</strong> Three.js tidak memiliki scene graph bawaan yang menangani streaming, pengelolaan LOD, atau partisi spasial dalam skala besar. Anda harus membuatnya sendiri. Tidak ada entity component system (ECS), fisika, atau sistem medan bawaan. Three.js adalah renderer, bukan engine. Hal ini sebenarnya menjadi keunggulan bagi dunia terbuka khusus karena Anda dapat mengendalikan tata letak memori dan strategi pemuatan, tetapi konsekuensinya adalah lebih banyak pekerjaan di awal.</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> lod</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> THREE</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">LOD</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">lod.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">addLevel</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(highDetailMesh, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">lod.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">addLevel</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(mediumDetailMesh, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">50</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">lod.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">addLevel</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(lowDetailMesh, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">200</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">lod.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">addLevel</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(impostorSprite, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">500</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">scene.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">add</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(lod);</span></span></code></pre>
</div><h3 id="babylon-js" tabindex="-1">Babylon.js <a class="header-anchor" href="#babylon-js" aria-label="Permalink to &quot;Babylon.js&quot;"></a></h3>
<p>Babylon.js adalah kandidat utama lainnya. Dengan dukungan Microsoft, Babylon.js memiliki fitur bawaan yang lebih mendalam daripada Three.js untuk kebutuhan spesifik dunia terbuka.</p>
<p>Fitur bawaan yang relevan:</p>
<ul>
<li><strong>Partisi adegan berbasis octree</strong> untuk culling adegan besar secara efisien</li>
<li><strong>Solid Particle System</strong> untuk rendering instans dalam jumlah masif</li>
<li><strong>Medan dari heightmap</strong> dengan LOD dan multi-texture splatting bawaan</li>
<li><strong>Node Material Editor</strong> untuk pembuatan shader secara visual</li>
<li><strong>Dukungan WebGPU</strong> (lebih matang daripada Three.js karena Babylon berinvestasi lebih awal)</li>
<li><strong>Integrasi fisika Havok</strong> (dikompilasi ke Wasm dan berkualitas produksi)</li>
<li><strong>Streaming glTF</strong> dengan pemuatan progresif</li>
</ul>
<p>Ekstensi <code>DynamicTerrain</code> milik Babylon menghasilkan chunk medan secara dinamis dari data heightmap, menangani LOD secara otomatis, dan mendukung texture splatting. Fitur ini jauh lebih mendekati pendekatan Skyrim dibandingkan apa pun yang disediakan Three.js secara langsung.</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> terrain</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> BABYLON</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">DynamicTerrain</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"terrain"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  terrainSub: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  mapData: heightmapData,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  mapSubX: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  mapSubZ: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}, scene);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">terrain.LODLimits </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">];</span></span></code></pre>
</div><p><strong>Komprominya:</strong> Babylon.js adalah library yang lebih besar (build lengkapnya sekitar 1–2 MB setelah minifikasi, dibandingkan Three.js yang sekitar 600 KB). Namun, untuk dunia terbuka, kemungkinan besar Anda akan menambahkan cukup banyak kode khusus ke Three.js sehingga perbedaan ukurannya menjadi tidak berarti. Babylon juga memiliki sistem Node Material, inspector, dan alat pengembang sendiri yang mempercepat iterasi.</p>
<p>Babylon.js 8.0 (dirilis Maret 2025) makin memperkuat posisinya sebagai pilihan untuk inti engine di sini. Semua shader inti engine kini tersedia dalam GLSL dan WGSL, sehingga WebGPU dapat digunakan tanpa lapisan konversi dan ukuran bundel WebGPU menjadi sekitar setengah dari sebelumnya. Rilis yang sama menghadirkan pengontrol karakter Havok lengkap ke dalam engine, area light, engine audio yang dibangun ulang, serta peningkatan Gaussian splatting (format SPZ dan PLY terkompresi, spherical harmonics, serta penggunaan memori/CPU yang lebih rendah).</p>
<h3 id="playcanvas" tabindex="-1">PlayCanvas <a class="header-anchor" href="#playcanvas" aria-label="Permalink to &quot;PlayCanvas&quot;"></a></h3>
<p>PlayCanvas patut disebutkan karena merupakan engine 3D yang sejak awal dirancang untuk web dan paling terbukti dalam produksi. Snap, Facebook, dan banyak klien periklanan telah meluncurkan pengalaman 3D kompleks dengannya. Engine ini berukuran sekitar 1 MB, dimuat dengan cepat, dan editor cloud-nya memungkinkan pembangunan dunia secara kolaboratif.</p>
<p>Khusus untuk dunia terbuka, PlayCanvas menawarkan batch group untuk mengoptimalkan draw call, lightmapper bawaan, dan dukungan Gaussian splatting (relevan untuk lingkungan dunia nyata yang direkam melalui fotogrametri). Runtime-nya ringkas dan dioptimalkan dengan baik untuk browser seluler.</p>
<h3 id="webgpu-pembuka-potensi-performa" tabindex="-1">WebGPU: Pembuka Potensi Performa <a class="header-anchor" href="#webgpu-pembuka-potensi-performa" aria-label="Permalink to &quot;WebGPU: Pembuka Potensi Performa&quot;"></a></h3>
<p>WebGPU mengubah perhitungan untuk dunia terbuka berbasis browser. Dua fitur yang paling penting:</p>
<p><strong>Compute shader</strong> memungkinkan pembuatan medan, penempatan vegetasi, simulasi partikel, bahkan fisika sederhana di sisi GPU. Dalam dunia WebGL, semua ini berjalan pada CPU melalui JavaScript. Dengan WebGPU, Anda dapat menghasilkan petak medan sepenuhnya di GPU, menghitung transisi LOD di GPU, dan menjalankan tahap culling di GPU. Hal ini membebaskan CPU untuk jaringan, logika gim, dan streaming konten.</p>
<p><strong>Rendering tidak langsung</strong> memungkinkan GPU menentukan apa yang perlu digambar berdasarkan output compute shader. Anda mengirimkan satu draw call, lalu GPU menentukan jumlah instans yang harus dirender untuk setiap tingkat LOD berdasarkan jarak. Beginilah engine modern menangani jutaan helai rumput atau pohon. Tanpa rendering tidak langsung (yang tidak didukung WebGL), CPU harus mengurutkan dan mengelompokkan semuanya, sehingga menjadi hambatan pada adegan yang padat.</p>
<p>WebGPU kini tersedia di setiap browser utama. Chrome dan Edge telah mendukungnya sejak versi 113, Firefox menambahkannya di Windows (141) dan macOS dengan Apple Silicon (145), sedangkan Safari 26 menghadirkannya ke macOS, iOS, iPadOS, dan visionOS pada akhir 2025. Hal ini membuat dukungan globalnya mencapai sekitar 82%, termasuk perangkat seluler (Chrome untuk Android dan Samsung Internet juga menyediakannya). Anda tetap perlu menyediakan fallback WebGL 2 untuk browser dan perangkat lama yang belum mengaktifkan WebGPU, tetapi kesenjangannya telah menyusut dengan cepat.</p>
<div class="language-wgsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">wgsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">compute</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">workgroup_size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">64</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">fn</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> generateTerrain</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">builtin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(global_invocation_id) id: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">u32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> worldPos </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">x), </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">y)) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> cellSize </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> worldOffset;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> height </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fbmNoise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(worldPos, octaves, persistence);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    heightmap[id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">x </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">y </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> width] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> height;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><h3 id="stack-rendering-yang-direkomendasikan" tabindex="-1">Stack Rendering yang Direkomendasikan <a class="header-anchor" href="#stack-rendering-yang-direkomendasikan" aria-label="Permalink to &quot;Stack Rendering yang Direkomendasikan&quot;"></a></h3>
<p>Untuk dunia terbuka berbasis browser yang menargetkan kreator di desktop:</p>
<p><strong>Utama:</strong> Three.js atau Babylon.js dengan renderer WebGPU jika tersedia dan fallback WebGL 2. Babylon memiliki komponen dasar dunia terbuka bawaan yang lebih kuat. Three.js memiliki komunitas lebih besar dan fleksibilitas lebih tinggi.</p>
<p><strong>Pilihan kami:</strong> Babylon.js sebagai inti engine karena memiliki LOD medan bawaan, octree culling, fisika Havok (Wasm), dan dukungan WebGPU yang matang. Gunakan alat dari ekosistem Three.js jika Babylon tidak menyediakannya (misalnya mesh BVH untuk kueri spasial). Bungkus semuanya dalam lapisan streaming dunia khusus.</p>
<h2 id="arsitektur-streaming-dunia" tabindex="-1">Arsitektur Streaming Dunia <a class="header-anchor" href="#arsitektur-streaming-dunia" aria-label="Permalink to &quot;Arsitektur Streaming Dunia&quot;"></a></h2>
<p>Inilah bagian tersulitnya. Tab browser mendapat sekitar 2–4 GB memori di desktop (batas yang diberlakukan browser), sekitar 1 GB di perangkat seluler, dan tidak memiliki akses langsung ke disk. Semuanya dikirim melalui jaringan. Anda membutuhkan arsitektur yang menjaga bagian dunia yang terlihat tetap berada dalam memori sambil mengalirkan konten sedikit lebih awal ke arah pergerakan pemain.</p>
<h3 id="grid-dunia-berbasis-chunk" tabindex="-1">Grid Dunia Berbasis Chunk <a class="header-anchor" href="#grid-dunia-berbasis-chunk" aria-label="Permalink to &quot;Grid Dunia Berbasis Chunk&quot;"></a></h3>
<p>Seperti sistem cell Skyrim, bagi dunia menjadi grid chunk reguler. Setiap chunk merupakan unit independen yang dapat dimuat, dirender, dan dikeluarkan secara terpisah.</p>
<p><strong>Ukuran chunk sangat penting.</strong> Terlalu kecil dan Anda akan terus memuat serta mengeluarkan data dengan overhead tinggi. Terlalu besar dan setiap chunk membutuhkan waktu terlalu lama untuk diunduh. Untuk dunia browser dengan koneksi broadband pada umumnya:</p>
<ul>
<li>Chunk 64x64 meter pada permukaan tanah</li>
<li>Setiap chunk berisi: petak heightmap (2–4 KB), texture splat map (16–32 KB terkompresi), mesh statis sebagai referensi instans (1–50 KB data instans), objek yang ditempatkan kreator sebagai manifest (1–10 KB)</li>
<li>Radius pemuatan: 5x5 chunk pada detail penuh (jarak pandang 320 m), 9x9 pada LOD menengah, 17x17 untuk medan saja</li>
<li>Target: data detail penuh setiap chunk di bawah 200 KB, sehingga area 5x5 berukuran kurang dari 5 MB</li>
</ul>
<h3 id="pipeline-pemuatan-progresif" tabindex="-1">Pipeline Pemuatan Progresif <a class="header-anchor" href="#pipeline-pemuatan-progresif" aria-label="Permalink to &quot;Pipeline Pemuatan Progresif&quot;"></a></h3>
<p>Jangan memuat semua data tentang suatu chunk sekaligus. Gunakan antrean prioritas:</p>
<ol>
<li><strong>Geometri medan terlebih dahulu</strong> (hanya peta ketinggian, 2-4 KB per chunk). Pemain melihat permukaan tanah dalam 100 md.</li>
<li><strong>Tekstur medan</strong> (splat map, mulai dari resolusi rendah lalu ditingkatkan). Permukaan tanah memiliki warna dalam 200 md.</li>
<li><strong>Struktur utama</strong> (bangunan, batu besar). Siluet muncul dalam 500 md.</li>
<li><strong>Objek detail</strong> (vegetasi, properti kecil, item kreator). Dunia terisi dalam 1-2 detik.</li>
<li><strong>Tekstur resolusi tinggi</strong> ditingkatkan terakhir. Tak seorang pun menyadari jika tekstur bangunan yang jauh memerlukan satu detik tambahan.</li>
</ol>
<p>Ini sesuai dengan cara kerja mata manusia. Kita menyadari ketiadaan permukaan tanah dan struktur besar. Kita tidak menyadari ketiadaan rumput.</p>
<h3 id="manajemen-memori" tabindex="-1">Manajemen Memori <a class="header-anchor" href="#manajemen-memori" aria-label="Permalink to &quot;Manajemen Memori&quot;"></a></h3>
<p>Memori peramban terbatas dan pengumpul sampah adalah musuh Anda. Satu jeda GC dapat menurunkan performa dari 60 fps menjadi 10 fps selama satu frame.</p>
<p><strong>Object pooling</strong> wajib digunakan. Alokasikan pool terlebih dahulu untuk objek umum (pohon, batu, petak rumput), lalu gunakan kembali saat chunk dimuat/dibongkar. Jangan pernah membuat instans <code>THREE.Mesh</code> atau <code>BABYLON.Mesh</code> baru di hot path. Sebagai gantinya, tukar referensi geometri dan material pada objek yang berada dalam pool.</p>
<p><strong>Atlas tekstur</strong> mengurangi draw call sekaligus fragmentasi memori. Kemas semua tekstur medan ke dalam beberapa atlas besar. Kemas tekstur unggahan kreator ke dalam atlas per chunk di server, lalu streaming sebagai satu gambar.</p>
<p><strong>Kompresi geometri</strong> dengan Draco atau Meshopt mengurangi ukuran unduhan hingga 5-10 kali lipat, dan dekompresi berjalan di Web Worker agar tidak memblokir thread utama. Khusus untuk medan, peta ketinggian terkuantisasi (nilai 16-bit yang dikompresi dengan pengodean delta sederhana) berukuran lebih kecil daripada format mesh serbaguna mana pun.</p>
<p><strong>Transfer kepemilikan ArrayBuffer</strong> antara worker dan thread utama menghindari penyalinan. Saat worker mendekompresi mesh, transfer buffer ke thread utama tanpa penyalinan menggunakan <code>postMessage</code> dengan objek yang dapat ditransfer.</p>
<h3 id="pengiriman-aset" tabindex="-1">Pengiriman Aset <a class="header-anchor" href="#pengiriman-aset" aria-label="Permalink to &quot;Pengiriman Aset&quot;"></a></h3>
<p><strong>CDN dengan caching edge</strong> untuk data dunia statis. Chunk medan, mesh dasar, dan atlas tekstur yang jarang berubah harus di-cache secara agresif (Cache-Control: max-age=31536000, immutable).</p>
<p><strong>Penyimpanan berbasis alamat konten</strong> berarti setiap versi aset mendapatkan hash unik dalam URL-nya. Saat kreator memodifikasi chunk, versi baru memperoleh hash baru dan versi lama tetap berada di cache bagi siapa pun yang masih melihatnya. Tidak perlu melakukan invalidasi cache.</p>
<p><strong>Tekstur KTX2</strong> dengan kompresi Basis Universal. Tekstur ini didekompresi ke format GPU apa pun yang didukung perangkat (BC7, ASTC, ETC2, atau fallback RGBA). Tekstur medan 1024x1024 berkurang dari 4 MB tanpa kompresi menjadi sekitar 150 KB dalam KTX2. Untuk dunia dengan ribuan tekstur unik, kompresi ini menentukan apakah proyek tersebut layak diwujudkan atau tidak.</p>
<p><strong>glTF Binary (GLB)</strong> untuk semua aset 3D. Ini adalah JPEG-nya dunia 3D. Setiap mesin peramban dapat memuatnya, formatnya ringkas, serta dapat menyematkan tekstur, material, dan animasi dalam satu file. Gunakan ekstensi Draco atau Meshopt untuk kompresi mesh. Aset unggahan kreator diproses di sisi server menjadi GLB yang dioptimalkan sebelum dimasukkan ke dunia.</p>
<h2 id="jaringan-multipemain" tabindex="-1">Jaringan Multipemain <a class="header-anchor" href="#jaringan-multipemain" aria-label="Permalink to &quot;Jaringan Multipemain&quot;"></a></h2>
<p>Menempatkan ratusan kreator dalam dunia yang sama memerlukan arsitektur jaringan yang menangani pergerakan waktu nyata, status dunia persisten, dan pengeditan kreator tanpa kewalahan.</p>
<h3 id="arsitektur-server" tabindex="-1">Arsitektur Server <a class="header-anchor" href="#arsitektur-server" aria-label="Permalink to &quot;Arsitektur Server&quot;"></a></h3>
<p><strong>Server otoritatif</strong> untuk status dunia. Peramban tidak dapat dipercaya. Semua tindakan penting (menempatkan objek, memodifikasi medan, berpindah antar-chunk) divalidasi di sisi server. Klien melakukan prediksi secara lokal dan menyelaraskannya dengan status server.</p>
<p><strong>Sharding spasial</strong> membagi dunia di antara beberapa instans server. Setiap shard mengelola wilayah persegi panjang pada grid dunia. Saat kepadatan pemain berubah, shard dapat dibagi atau digabungkan. Beginilah EVE Online menangani ribuan pemain dalam satu semesta, dan prinsip yang sama berlaku pada skala yang lebih kecil.</p>
<p>Untuk dunia kreator yang sebagian besar interaksinya bersifat lokal (Anda membangun di area Anda dan tetangga dapat melihatnya), sharding spasial bekerja secara alami. Pemain yang berdiri di batas shard melihat konten dari kedua shard, yang memerlukan kueri visibilitas lintas shard, tetapi masalah ini sudah memiliki solusi yang mapan.</p>
<p><strong>Pilihan teknologi untuk server:</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Teknologi</th>
<th>Keunggulan</th>
<th>Kasus Penggunaan</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Cloudflare Durable Objects</strong></td>
<td>Diterapkan di edge, penskalaan otomatis, persistensi bawaan, dukungan WebSocket</td>
<td>Status shard dunia, otoritas per chunk</td>
</tr>
<tr>
<td><strong>Hathora / Rivet</strong></td>
<td>Hosting server gim terkelola, perlindungan DDoS, penerapan global</td>
<td>Instans server gim khusus</td>
</tr>
<tr>
<td><strong>Colyseus</strong></td>
<td>Kerangka kerja server gim sumber terbuka untuk Node.js, sinkronisasi status berbasis skema</td>
<td>Multipemain berbasis ruang dengan pencatatan perbedaan status</td>
</tr>
<tr>
<td><strong>PartyKit</strong></td>
<td>Diterapkan di edge, WebSocket + WebRTC, berbasis Cloudflare Workers</td>
<td>Kolaborasi waktu nyata, multipemain ringan</td>
</tr>
<tr>
<td><strong>Custom Rust/Go</strong></td>
<td>Kendali maksimum, performa terbaik per instans</td>
<td>Shard berkepadatan tinggi yang memerlukan fisika berlatensi rendah</td>
</tr>
</tbody>
</table>
<p><strong>Konteks kami (infrastruktur Cloudflare):</strong> Durable Objects sangat cocok digunakan. Setiap chunk dunia menjadi Durable Object yang menyimpan status otoritatif untuk konten chunk tersebut. Pemain terhubung melalui WebSocket ke Durable Object yang bertanggung jawab atas chunk mereka saat ini. Saat berpindah ke chunk yang bersebelahan, mereka terhubung ke DO chunk tersebut. Durable Objects mempertahankan status ke disk secara otomatis, sehingga data dunia tetap tersedia setelah server dimulai ulang.</p>
<h3 id="komunikasi-klien-server" tabindex="-1">Komunikasi Klien-Server <a class="header-anchor" href="#komunikasi-klien-server" aria-label="Permalink to &quot;Komunikasi Klien-Server&quot;"></a></h3>
<p><strong>WebSocket</strong> untuk pesan berurutan yang andal (obrolan, pengeditan dunia, inventaris, status gim). Satu koneksi per shard aktif yang dapat dilihat pemain (biasanya 1-4 koneksi).</p>
<p><strong>WebRTC DataChannel</strong> untuk pesan tak berurutan yang tidak memerlukan jaminan pengiriman (posisi pemain, animasi, efek sementara). WebRTC mendukung koneksi peer-to-peer, tetapi untuk dunia dengan banyak pemain, Anda perlu menjalankannya melalui SFU (Selective Forwarding Unit) guna menghindari koneksi N2. Cloudflare Calls atau LiveKit dapat berfungsi sebagai SFU.</p>
<p><strong>Sinkronisasi status</strong> menggunakan kompresi delta. Server melacak apa yang telah dilihat setiap klien dan hanya mengirim perubahan. Hal ini sangat penting bagi dunia kreator karena status dunia (objek apa yang ada, lokasi objek, dan properti yang dimilikinya) berubah jauh lebih jarang daripada posisi pemain. Anda dapat mengirim pembaruan status dunia pada frekuensi 2-5 Hz, sementara posisi pemain diperbarui pada 20-30 Hz.</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> WorldChunkState</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  version</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  terrain</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> TerrainPatch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  objects</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> PlacedObject</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  creators</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> CreatorPresence</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[];</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> DeltaUpdate</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  chunkId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  fromVersion</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  toVersion</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  addedObjects</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> PlacedObject</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  removedObjectIds</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  modifiedObjects</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Partial</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">PlacedObject</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>[];</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">  creatorMoves</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> CreatorPosition</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[];</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><h3 id="penyelesaian-konflik-untuk-pengeditan-kreator" tabindex="-1">Penyelesaian Konflik untuk Pengeditan Kreator <a class="header-anchor" href="#penyelesaian-konflik-untuk-pengeditan-kreator" aria-label="Permalink to &quot;Penyelesaian Konflik untuk Pengeditan Kreator&quot;"></a></h3>
<p>Saat dua kreator memodifikasi area yang sama secara bersamaan, Anda memerlukan strategi penyelesaian konflik. Di sinilah pemilihan model kolaborasi waktu nyata menjadi penting.</p>
<p><strong>Penulisan terakhir yang berlaku</strong> adalah pendekatan paling sederhana. Setiap objek hanya memiliki satu pemilik pada satu waktu. Jika Anda sedang mengedit bangunan, orang lain tidak dapat mengeditnya hingga Anda melepaskannya. Sederhana dan tanpa konflik, tetapi membatasi kolaborasi.</p>
<p><strong>Operational Transform (OT)</strong> adalah metode yang digunakan Google Docs. Operasi ditransformasikan berdasarkan operasi bersamaan untuk menghasilkan hasil yang konsisten. Metode ini cocok untuk teks, tetapi menjadi rumit untuk operasi spasial 3D. Figma menggunakan variasi metode ini untuk kanvas 2D mereka.</p>
<p><strong>CRDT (Conflict-free Replicated Data Types)</strong> memungkinkan pengeditan bersamaan yang selalu menyatu menjadi status yang sama tanpa koordinasi. Untuk dunia dengan objek terpisah (masing-masing memiliki ID dan properti), Last-Writer-Wins Register per properti yang digabungkan dengan Add-Wins Set untuk koleksi objek memberi Anda konvergensi otomatis. Yjs dan Automerge adalah pustaka CRDT berkualitas produksi untuk JavaScript.</p>
<p><strong>Rekomendasi kami:</strong> Gunakan CRDT untuk status objek dunia (apa yang ada, lokasi objek, dan properti yang dimilikinya), serta server otoritatif untuk validasi spasial (tidak ada dua objek di tempat yang sama dan objek tetap berada dalam batas dunia). CRDT menangani kolaborasi. Server menangani fisika.</p>
<h3 id="menangani-skala-berapa-banyak-pemain" tabindex="-1">Menangani Skala: Berapa Banyak Pemain? <a class="header-anchor" href="#menangani-skala-berapa-banyak-pemain" aria-label="Permalink to &quot;Menangani Skala: Berapa Banyak Pemain?&quot;"></a></h3>
<p>MMO peramban sudah ada saat ini. Hordes.io menjalankan lebih dari 200 pemain dalam satu adegan di peramban. BrowserQuest (eksperimen Mozilla) menangani ratusan pemain dengan dunia berbasis petak yang sederhana. Pertanyaannya bukan apakah peramban mampu menangani multipemain, melainkan tingkat fidelitas visual yang dapat dipertahankan saat jumlah pemain meningkat.</p>
<p><strong>Anggaran rendering pemain:</strong> Setiap pemain yang terlihat memerlukan mesh, animasi, dan kemungkinan tampilan yang disesuaikan kreator. Pada 60 fps, Anda memiliki 16 md per frame. Anggaran yang masuk akal:</p>
<ul>
<li>50 pemain dengan animasi penuh dalam jarak dekat: ~2 md untuk animasi + skinning</li>
<li>200 pemain pada jarak menengah (animasi disederhanakan, menggunakan instancing): ~1 md</li>
<li>Lebih dari 500 pemain sebagai titik/ikon pada minimap: dapat diabaikan</li>
</ul>
<p>Ini memberi Anda populasi terlihat sebanyak ~250 pemain dalam satu tampilan, yang lebih dari cukup untuk dunia kreator. Ibu kota di World of Warcraft jarang merender lebih dari 200 karakter dalam satu tampilan sekaligus.</p>
<p><strong>Anggaran jaringan:</strong> Setiap pemain yang mengirim posisi pada 20 Hz menggunakan sekitar 40 byte * 20 = 800 byte/detik. Dengan 200 pemain dalam tampilan: 160 KB/detik data posisi. Tambahkan status dunia, obrolan, dan tindakan kreator, maka kebutuhan data menjadi 200-500 KB/detik per klien. Masih berada dalam kemampuan koneksi pita lebar, tetapi tetap layak dikompresi.</p>
<h2 id="sistem-medan" tabindex="-1">Sistem Medan <a class="header-anchor" href="#sistem-medan" aria-label="Permalink to &quot;Sistem Medan&quot;"></a></h2>
<p>Medan adalah fondasi setiap dunia terbuka. Medan juga merupakan bagian yang paling terdampak oleh keterbatasan peramban karena harus tersedia di mana-mana dan selalu terlihat.</p>
<h3 id="medan-berbasis-peta-ketinggian" tabindex="-1">Medan Berbasis Peta Ketinggian <a class="header-anchor" href="#medan-berbasis-peta-ketinggian" aria-label="Permalink to &quot;Medan Berbasis Peta Ketinggian&quot;"></a></h3>
<p>Seperti Skyrim, gunakan peta ketinggian. Grid 2D berisi nilai ketinggian menghasilkan medan 3D melalui vertex shader. Pendekatan ini jauh lebih ringkas daripada medan berbentuk mesh arbitrer.</p>
<p>Peta ketinggian 4096x4096 dengan presisi 16-bit berukuran 32 MB tanpa kompresi. Namun, Anda tidak pernah memuat semuanya sekaligus. Setiap chunk 64 m menggunakan bagian peta ketinggian berukuran 65x65 (sekitar 8,4 KB pada 16-bit). Kompresikan bagian tersebut dengan pengodean delta dan zlib, maka ukurannya menjadi kurang dari 2 KB per chunk.</p>
<p><strong>Texture splatting</strong> mewarnai beberapa material medan (rumput, batu, tanah, pasir) menggunakan peta campuran. Setiap chunk memiliki splat map RGBA 4 kanal, dengan setiap kanal mengontrol bobot campuran satu material. Dengan 4 tekstur per splat map dan kemampuan untuk memvariasikan splat map per chunk, Anda mendapatkan variasi visual di seluruh dunia.</p>
<p>Renderer medan modern menggunakan <strong>tekstur virtual</strong> (juga disebut megatexture, yang berasal dari teknologi id Software dalam Rage). Alih-alih melakukan splatting saat runtime, Anda melakukan pra-render terhadap tekstur medan campuran pada resolusi tinggi, lalu melakukan streaming petaknya saat kamera bergerak. Pendekatan ini menukar kapasitas penyimpanan dengan performa runtime. Compute shader WebGPU dapat menangani umpan balik dan pengelolaan tabel halaman yang diperlukan oleh tekstur virtual.</p>
<h3 id="clipmap-atau-geoclipmapping" tabindex="-1">Clipmap atau Geoclipmapping <a class="header-anchor" href="#clipmap-atau-geoclipmapping" aria-label="Permalink to &quot;Clipmap atau Geoclipmapping&quot;"></a></h3>
<p>Untuk merender medan luas di peramban, pendekatan CDLOD (LOD karya C. Dick) atau geoclipmapping bekerja dengan baik. Medan dirender sebagai serangkaian cincin konsentris di sekitar kamera, dengan setiap cincin memiliki setengah resolusi dari cincin sebelumnya. Di dekat kamera, Anda melihat medan beresolusi penuh. Di kejauhan, Anda melihat versi yang lebih kasar. Transisinya mulus karena geometri bertransformasi di antara level.</p>
<p>Teknik ini ramah GPU (satu draw call per cincin), menangani medan tak terbatas dengan penggunaan memori konstan, dan berfungsi di WebGL 2. Teknik ini digunakan pada tingkat tertentu oleh Flight Simulator dan sebagian besar gim dunia terbuka modern.</p>
<h3 id="medan-yang-dimodifikasi-kreator" tabindex="-1">Medan yang Dimodifikasi Kreator <a class="header-anchor" href="#medan-yang-dimodifikasi-kreator" aria-label="Permalink to &quot;Medan yang Dimodifikasi Kreator&quot;"></a></h3>
<p>Jika kreator dapat memahat medan, Anda memerlukan cara untuk menyimpan dan melakukan streaming modifikasi di atas peta ketinggian dasar. Ada dua pendekatan:</p>
<p><strong>Peta ketinggian delta</strong> menyimpan selisih antara medan dasar dan medan yang dimodifikasi. Sebagian besar dunia tidak dimodifikasi (nilai delta adalah nol), sehingga pendekatan ini menghasilkan kompresi yang sangat baik. Saat memuat chunk, terapkan delta di atas data dasar.</p>
<p><strong>Overlay voxel</strong> untuk modifikasi yang lebih dramatis (gua, tonjolan, lengkungan). Peta ketinggian tidak dapat merepresentasikan medan saat satu titik memiliki dua ketinggian. Grid voxel renggang yang hanya disimpan dalam chunk termodifikasi dapat menanganinya. Marching cubes atau dual contouring digunakan untuk menghasilkan mesh. Pendekatan ini lebih mahal, tetapi memungkinkan pengeditan medan bergaya Minecraft.</p>
<h2 id="pembuatan-dunia-berbasis-ai" tabindex="-1">Pembuatan Dunia Berbasis AI <a class="header-anchor" href="#pembuatan-dunia-berbasis-ai" aria-label="Permalink to &quot;Pembuatan Dunia Berbasis AI&quot;"></a></h2>
<p>Di sinilah kemampuan AI generatif Cinevva yang sudah ada menjadi pengganda kekuatan. Alih-alih membuat setiap batu dan pohon secara manual, kreator dapat mengarahkan AI untuk mengisi dunia.</p>
<h3 id="pembuatan-medan-dengan-neural-field" tabindex="-1">Pembuatan Medan dengan Neural Field <a class="header-anchor" href="#pembuatan-medan-dengan-neural-field" aria-label="Permalink to &quot;Pembuatan Medan dengan Neural Field&quot;"></a></h3>
<p>Penelitian terbaru tentang pembuatan medan neural (GET3D dari NVIDIA, mode jaringan neural Terragen, dan makalah seperti &quot;Terrain Generation Using Procedural Models&quot;) menunjukkan bahwa model terlatih dapat menghasilkan medan yang meyakinkan dari perintah teks atau masukan sketsa. Kreator dapat menggambar garis pantai kasar dan mengatakan &quot;perbukitan berhutan yang bertemu dengan pantai berbatu&quot;, lalu mendapatkan peta ketinggian dengan erosi, mask vegetasi, dan penetapan material yang sesuai.</p>
<p>Untuk pengiriman melalui peramban, Anda akan menjalankan proses pembuatan di sisi server dan melakukan streaming hasilnya. Model generasi tidak perlu berjalan di peramban. Model tersebut menghasilkan peta ketinggian dan splat map yang dapat dirender peramban menggunakan pipeline medan standar.</p>
<h3 id="pembuatan-aset-3d" tabindex="-1">Pembuatan Aset 3D <a class="header-anchor" href="#pembuatan-aset-3d" aria-label="Permalink to &quot;Pembuatan Aset 3D&quot;"></a></h3>
<p>Model seperti <a href="https://github.com/Tencent-Hunyuan/HunyuanVideo" target="_blank" rel="noreferrer">Hunyuan3D</a>, Meshy, Tripo, dan Rodin dapat menghasilkan mesh 3D dari teks atau gambar. Alur kerja untuk dunia kreator:</p>
<ol>
<li>Kreator mendeskripsikan atau membuat sketsa yang diinginkan (&quot;gerbang batu berlumut&quot; atau &quot;tiang lampu futuristis&quot;)</li>
<li>Server menjalankan model generasi dan menghasilkan mesh berpoligon tinggi</li>
<li>Server melakukan pemrosesan otomatis: mengurangi jumlah poligon agar sesuai untuk web, menghasilkan LOD, memanggang tekstur ke atlas, dan mengekspor sebagai GLB dengan kompresi Draco</li>
<li>Aset muncul dalam inventaris kreator dan siap ditempatkan di dunia</li>
</ol>
<p>Bagian-bagian pipeline ini sudah tersedia di Cinevva. Bagian yang belum ada adalah tahap LOD/optimasi dan sistem penempatan dunia.</p>
<h3 id="pengisian-prosedural" tabindex="-1">Pengisian Prosedural <a class="header-anchor" href="#pengisian-prosedural" aria-label="Permalink to &quot;Pengisian Prosedural&quot;"></a></h3>
<p>Bahkan dengan aset yang dihasilkan AI, menempatkan setiap pohon di hutan secara manual tetap melelahkan. Aturan penyebaran prosedural memungkinkan kreator menentukan zona (&quot;area ini adalah hutan lebat&quot;, &quot;lereng ini berupa timbunan batu&quot;), lalu sistem mengisinya secara otomatis.</p>
<p>Compute shader GPU dapat menjalankan penyebaran ini di peramban. Dengan peta kepadatan dan serangkaian aturan (jarak minimum, batasan kemiringan, rentang ketinggian), satu compute pass menghasilkan posisi instans untuk seluruh chunk dalam waktu kurang dari 1 md. Ubah peta kepadatan, dan vegetasi akan dibuat ulang seketika.</p>
<h2 id="entity-component-system-ecs" tabindex="-1">Entity Component System (ECS) <a class="header-anchor" href="#entity-component-system-ecs" aria-label="Permalink to &quot;Entity Component System (ECS)&quot;"></a></h2>
<p>Dunia terbuka dengan ribuan objek membutuhkan sistem pengelolaan entitas yang efisien. Pola ECS (populer di mesin gim sejak DOTS milik Unity dan Bevy) sangat cocok diterapkan pada JavaScript.</p>
<p><strong>bitECS</strong> adalah ECS berperforma tinggi untuk JavaScript yang menggunakan typed array dan operasi bitwise. Entitas berupa bilangan bulat biasa. Komponen berupa typed array yang bersebelahan (satu untuk setiap jenis komponen). Sistem mengiterasi array secara berurutan, sehingga ramah cache bahkan dalam JavaScript.</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { createWorld, defineComponent, Types, defineQuery, addEntity, addComponent } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'bitecs'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> Position</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> defineComponent</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({ x: Types.f32, y: Types.f32, z: Types.f32 });</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> Velocity</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> defineComponent</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({ x: Types.f32, y: Types.f32, z: Types.f32 });</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> ChunkRef</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> defineComponent</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({ chunkX: Types.i16, chunkZ: Types.i16 });</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> world</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> createWorld</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> movingQuery</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> defineQuery</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">([Position, Velocity]);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> movementSystem</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">world</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> entities</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> movingQuery</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(world);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  for</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> i </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">; i </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">&#x3C;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> entities.</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">length</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">; i</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">++</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> eid</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> entities[i];</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    Position.x[eid] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Velocity.x[eid] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> dt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    Position.y[eid] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Velocity.y[eid] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> dt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    Position.z[eid] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Velocity.z[eid] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> dt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> world;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Untuk dunia terbuka, ECS menangani semuanya: karakter pemain, objek yang ditempatkan, NPC, partikel, pemicu, dan properti dunia. Saat sebuah chunk dibongkar, entitasnya dihapus dari ECS. Saat sebuah chunk dimuat, entitas ditambahkan. ECS tidak memedulikan pengaturan spasial. ECS hanya memproses komponen.</p>
<h2 id="fisika" tabindex="-1">Fisika <a class="header-anchor" href="#fisika" aria-label="Permalink to &quot;Fisika&quot;"></a></h2>
<p>Fisika di peramban telah berkembang sangat baik berkat WebAssembly.</p>
<h3 id="rapier-rust-wasm" tabindex="-1">Rapier (Rust -&gt; Wasm) <a class="header-anchor" href="#rapier-rust-wasm" aria-label="Permalink to &quot;Rapier (Rust -&gt; Wasm)&quot;"></a></h3>
<p>Rapier adalah mesin fisika yang ditulis dalam Rust dan dikompilasi ke WebAssembly. Rapier menangani rigid body, collider, joint, pengontrol karakter, dan raycasting. Untuk beban kerja gim pada umumnya, performanya berada dalam kisaran 2–3 kali performa Bullet/PhysX native.</p>
<p>Untuk dunia terbuka, Rapier menangani:</p>
<ul>
<li>Pengontrol karakter pemain (berjalan di medan, menaiki anak tangga, meluncur di lereng)</li>
<li>Tabrakan antarobjek (objek yang ditempatkan, proyektil)</li>
<li>Raycasting untuk interaksi pemain (mengeklik objek untuk memilihnya)</li>
<li>Volume pemicu (memasuki area, memicu peristiwa)</li>
</ul>
<p>Rapier berjalan di Web Worker, sehingga simulasi fisika tidak menghambat rendering. Anda mengirimkan posisi ke renderer setiap frame dan menerima kembali peristiwa input.</p>
<h3 id="havok-untuk-web-melalui-babylon-js" tabindex="-1">Havok untuk Web (melalui Babylon.js) <a class="header-anchor" href="#havok-untuk-web-melalui-babylon-js" aria-label="Permalink to &quot;Havok untuk Web (melalui Babylon.js)&quot;"></a></h3>
<p>Jika memilih Babylon.js, fisika Havok sudah disertakan sebagai modul Wasm. Havok adalah mesin fisika di balik sebagian besar gim AAA (Half-Life 2, Skyrim, Breath of the Wild). Build Wasm-nya berkualitas produksi dan dioptimalkan untuk scene graph Babylon.</p>
<h3 id="tabrakan-medan" tabindex="-1">Tabrakan Medan <a class="header-anchor" href="#tabrakan-medan" aria-label="Permalink to &quot;Tabrakan Medan&quot;"></a></h3>
<p>Mesin fisika membutuhkan geometri tabrakan untuk medan. Membuat trimesh beresolusi penuh untuk seluruh medan yang terlihat akan membutuhkan biaya besar. Sebagai gantinya, buat heightfield tabrakan hanya untuk chunk di dekat pemain (3x3 atau 5x5 chunk terdekat) dan gunakan tabrakan yang disederhanakan untuk yang lainnya. Collider heightfield Rapier dirancang tepat untuk kasus penggunaan ini.</p>
<h2 id="audio" tabindex="-1">Audio <a class="header-anchor" href="#audio" aria-label="Permalink to &quot;Audio&quot;"></a></h2>
<p>Suara mengubah ruang 3D dari demo visual menjadi sebuah tempat. Web Audio API menyediakan semua yang dibutuhkan untuk audio spasial di peramban.</p>
<p><strong>Audio spasial dengan HRTF</strong> (Head-Related Transfer Function) menempatkan suara dalam ruang 3D. Air terjun di sebelah kiri akan terdengar seolah berada di sebelah kiri. Berjalanlah mendekat dan suaranya menjadi lebih keras. Berjalanlah ke belakang bangunan dan suaranya menjadi teredam (dengan pemrosesan tambahan).</p>
<p><strong>Zona suasana</strong> bekerja seperti texture splatting untuk audio. Tentukan wilayah (hutan, gua, pantai, kota) dan lakukan crossfade di antara bentang suara sekitar saat pemain berpindah dari satu wilayah ke wilayah lain. Dengan cara inilah Skyrim membuat hutannya terdengar hidup. Lapisi suara angin, burung, gemerisik dedaunan, dan hewan di kejauhan. Tidak ada satu pun yang rumit. Semuanya bersifat spasial.</p>
<p><strong>Performa Web Audio</strong> cukup baik untuk puluhan sumber spasial secara bersamaan. Hambatannya biasanya adalah ukuran aset, bukan pemrosesan. Gunakan Opus atau AAC untuk audio terkompresi, streaming trek suasana yang panjang, dan muat terlebih dahulu efek suara pendek (langkah kaki, interaksi).</p>
<h2 id="air-cuaca-dan-atmosfer" tabindex="-1">Air, Cuaca, dan Atmosfer <a class="header-anchor" href="#air-cuaca-dan-atmosfer" aria-label="Permalink to &quot;Air, Cuaca, dan Atmosfer&quot;"></a></h2>
<p>Setiap dunia terbuka yang berkesan memiliki air dan cuaca. Sistem-sistem ini membentuk suasana dan membuat dunia terasa hidup. Keduanya juga ternyata sangat mungkin diwujudkan di peramban.</p>
<h3 id="rendering-air" tabindex="-1">Rendering Air <a class="header-anchor" href="#rendering-air" aria-label="Permalink to &quot;Rendering Air&quot;"></a></h3>
<p>Air dalam 3D di peramban memiliki tiga tingkat kompleksitas, dan Anda dapat merilis tingkat paling sederhana terlebih dahulu lalu meningkatkannya nanti.</p>
<p><strong>Tingkat 1: Bidang reflektif.</strong> Mesh datar pada ketinggian air dengan material reflektif/refraktif. Render adegan secara terbalik ke sebuah tekstur (refleksi planar), padukan dengan semburat biru, lalu tambahkan normal map yang bergerak untuk menciptakan gerakan ombak. Inilah yang dilakukan shader air dasar Skyrim. Di Three.js, contoh <code>Water</code> dalam repositori resmi mengimplementasikan teknik ini. Di Babylon.js, <code>WaterMaterial</code> menyediakannya secara bawaan. Biaya: satu render pass tambahan untuk refleksi (setengah resolusi sudah cukup), ditambah penggambaran permukaan air. Pada GPU kelas menengah, ini menambah 2–3 md per frame.</p>
<p><strong>Tingkat 2: Refleksi screen-space + efek berbasis kedalaman.</strong> Alih-alih menggunakan render pass refleksi terpisah, ambil sampel frame buffer yang sudah ada untuk refleksi (SSR). Tambahkan penyerapan warna berbasis kedalaman (air semakin gelap saat semakin dalam), buih di garis pantai menggunakan perbandingan kedalaman, dan kaustik yang diproyeksikan ke medan bawah air. Inilah yang digunakan The Witcher 3. SSR tersedia dalam stack pascapemrosesan Three.js maupun pipeline rendering Babylon.js. Biaya: 1–2 md untuk SSR, sedangkan efek kedalaman dapat diabaikan.</p>
<p><strong>Tingkat 3: Simulasi laut FFT.</strong> Untuk laut terbuka, gunakan Fast Fourier Transform guna menyimulasikan spektrum gelombang pada GPU. Makalah Jerry Tessendorf, &quot;Simulating Ocean Water&quot; (2001), adalah fondasi yang digunakan oleh setiap mesin gim besar. FFT berjalan sebagai compute shader di WebGPU, menghasilkan displacement map dan normal map pada setiap frame. Hasil lautnya tampak sangat meyakinkan. Inilah yang digunakan Sea of Thieves, Assassin's Creed Black Flag, dan Uncharted 4. Di WebGPU, laut FFT 256x256 berjalan dalam waktu kurang dari 1 md pada GPU desktop.</p>
<div class="language-wgsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">wgsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">compute</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">workgroup_size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">16</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">16</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">fn</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fftOceanDisplacement</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">builtin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(global_invocation_id) id: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">u32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> k </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">x) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> N</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">/</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">y) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> N</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">/</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> omega </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> sqrt</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">length</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(k) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> gravity);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> phase </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> omega </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> time;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> h </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> spectrum[id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">xy] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">cos</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(phase), </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">sin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(phase));</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    displacement[id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">xy] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> h;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Untuk dunia kreator, mulailah dengan Tingkat 1 (bidang reflektif), lalu tingkatkan ke Tingkat 2 saat renderer semakin matang. Tingkat 3 hanya diperlukan jika dunia tersebut memiliki laut terbuka.</p>
<h3 id="sistem-cuaca" tabindex="-1">Sistem Cuaca <a class="header-anchor" href="#sistem-cuaca" aria-label="Permalink to &quot;Sistem Cuaca&quot;"></a></h3>
<p>Cuaca di Skyrim dan BotW dikendalikan oleh state machine dengan transisi. Cerah &gt; Berawan &gt; Hujan &gt; Badai &gt; Cerah. Setiap keadaan mengubah beberapa sistem secara bersamaan: skybox, kerapatan kabut, warna cahaya sekitar, efek partikel (hujan/salju), audio (angin, hujan), dan properti gameplay (permukaan basah menjadi licin di BotW).</p>
<p>Untuk dunia di peramban, sistem cuaca memiliki tiga lapisan:</p>
<p><strong>Rendering langit.</strong> Shader langit prosedural lebih murah dan fleksibel daripada tekstur skybox. Model langit Preetham atau Hosek-Wilkie menghitung warna langit yang masuk akal secara fisik hanya dari posisi matahari. Tambahkan lapisan awan menggunakan noise 3D yang digulirkan melintasi sebuah bidang. Babylon.js memiliki material langit prosedural bawaan. Three.js memiliki contoh <code>Sky</code>. Keduanya menghasilkan tampilan meyakinkan dengan biaya GPU yang dapat diabaikan (hanya sebuah quad layar penuh).</p>
<p><strong>Efek partikel.</strong> Hujan adalah sistem partikel dengan ribuan quad tipis yang jatuh dari atas. Salju serupa, tetapi memiliki lintasan lebih lambat dan melayang. Kabut adalah pass pascapemrosesan yang memadukan adegan menuju warna kabut berdasarkan kedalaman. Semua ini merupakan efek WebGL standar. Biayanya bergantung pada jumlah partikel: 10.000 partikel hujan menambah sekitar 0,5 md per frame.</p>
<p><strong>Respons lingkungan.</strong> Permukaan basah meningkatkan refleksi spekular. Akumulasi salju menambahkan warna putih pada permukaan yang menghadap ke atas. Genangan muncul di medan cekung. Ini adalah trik shader, bukan perubahan geometri. Uniform &quot;wetness&quot; mengubah kekasaran material. Uniform &quot;snow cover&quot; memadukan warna putih pada permukaan yang normalnya mengarah ke atas. GTA V dan The Witcher 3 menggunakan pendekatan yang sama persis.</p>
<p><strong>Cuaca tersinkronisasi.</strong> Dalam dunia multipemain, cuaca harus konsisten di semua klien. Pendekatan paling sederhana: server menyiarkan status cuaca (termasuk progres transisi) pada frekuensi 1 Hz. Klien melakukan interpolasi secara lokal. Karena cuaca berubah perlahan (transisi dari cerah ke hujan memerlukan 30–60 detik), bahkan pembaruan yang tertunda tetap tampak mulus.</p>
<h3 id="perspektif-atmosfer" tabindex="-1">Perspektif Atmosfer <a class="header-anchor" href="#perspektif-atmosfer" aria-label="Permalink to &quot;Perspektif Atmosfer&quot;"></a></h3>
<p>Ini adalah teknik visual paling efektif untuk membuat dunia terasa luas, dan biayanya nyaris nol. Objek di kejauhan tampak lebih berkabut, lebih biru, dan memiliki kontras lebih rendah karena hamburan cahaya di atmosfer. Setiap dunia terbuka menggunakan teknik ini.</p>
<p>Dalam fragment shader, padukan piksel yang jauh menuju warna atmosfer berdasarkan kedalaman:</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> fogFactor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1.0</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> -</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> exp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">distance </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> fogDensity);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> finalColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mix</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(objectColor, atmosphereColor, fogFactor);</span></span></code></pre>
</div><p>BotW membawa teknik ini lebih jauh dengan kabut bergaya lukisan yang bertransisi menjadi jarak bergaya cat air. Warna kabut berubah mengikuti waktu dan cuaca. Efek shader tunggal ini memberikan kesan skala yang lebih besar daripada detail medan sebanyak apa pun.</p>
<p>Untuk dunia peramban dengan arahan seni bergaya, perspektif atmosfer adalah efek visual pertama yang perlu diterapkan. Teknik ini menyembunyikan transisi LOD (objek jauh dengan detail lebih rendah tetap terlihat baik melalui kabut), mengurangi pop-in konten streaming yang terlihat, dan membuat tangkapan layar tampak bagus bahkan sebelum dunia terisi sepenuhnya.</p>
<h2 id="sistem-avatar" tabindex="-1">Sistem Avatar <a class="header-anchor" href="#sistem-avatar" aria-label="Permalink to &quot;Sistem Avatar&quot;"></a></h2>
<p>Pemain membutuhkan tubuh. Dalam dunia kreator, avatar merupakan bentuk utama ekspresi diri selain karya yang Anda bangun. Sistemnya harus cukup fleksibel untuk personalisasi sekaligus menjaga biaya rendering tetap cukup rendah untuk 200+ pemain yang terlihat.</p>
<h3 id="arsitektur-avatar" tabindex="-1">Arsitektur Avatar <a class="header-anchor" href="#arsitektur-avatar" aria-label="Permalink to &quot;Arsitektur Avatar&quot;"></a></h3>
<p><strong>Mesh dasar + lapisan kustomisasi.</strong> Mulailah dengan mesh dasar humanoid bersama (1.500–3.000 segitiga untuk tubuh). Kustomisasi dilakukan melalui:</p>
<ul>
<li>Variasi warna/tekstur (warna kulit, warna rambut) melalui perubahan uniform. Tanpa geometri tambahan.</li>
<li>Bagian mesh yang dapat ditukar (gaya rambut, pakaian, aksesori) untuk menggantikan bagian dari mesh dasar. Setiap bagian merupakan mesh kecil terpisah (200–500 segitiga).</li>
<li>Variasi properti material (zirah logam vs. tunik kain) melalui perubahan parameter material.</li>
</ul>
<p>Beginilah Roblox, Fortnite, dan VRChat menangani avatar. Biaya dasarnya tetap konstan terlepas dari kustomisasi.</p>
<p><strong>Ready Player Me</strong> dan <strong>Avaturn</strong> menawarkan pembuatan avatar berbasis peramban yang menghasilkan model glTF kompatibel dengan mesin 3D apa pun. Keduanya menangani pemindaian wajah dari foto, proporsi tubuh, dan pakaian. Model keluarannya dioptimalkan untuk rendering waktu nyata (biasanya 10K–20K segitiga, yang dapat dikurangi menjadi 3K–5K untuk rendering jarak jauh).</p>
<h3 id="animasi-skeletal-di-peramban" tabindex="-1">Animasi Skeletal di Peramban <a class="header-anchor" href="#animasi-skeletal-di-peramban" aria-label="Permalink to &quot;Animasi Skeletal di Peramban&quot;"></a></h3>
<p>Setiap pemain yang terlihat membutuhkan animasi: diam, berjalan, berlari, melompat, dan emote. Animasi skeletal menggerakkan mesh melalui serangkaian transformasi tulang pada setiap frame.</p>
<p><strong>GPU skinning</strong> wajib digunakan demi performa. Three.js dan Babylon.js sama-sama melakukan skinning pada GPU secara bawaan. Matriks tulang diunggah sebagai uniform buffer atau tekstur, lalu vertex shader menerapkan transformasi tulang. Biaya CPU berasal dari penghitungan transformasi tulang berdasarkan klip animasi. Untuk skeleton 60 tulang pada 30 fps, biayanya sekitar 0,01 md per karakter. Untuk 200 karakter: total 2 md. Masih dapat diterima.</p>
<p><strong>Animation blending</strong> mencampurkan beberapa animasi (berjalan + melambaikan tangan, diam + melihat sekeliling) menggunakan bobot pencampuran. Three.js (<code>AnimationMixer</code>) dan Babylon.js (<code>AnimationGroup</code>) sama-sama mendukungnya. Pencampuran terjadi di CPU (menginterpolasi transformasi tulang) sebelum hasil campurannya dikirim ke GPU.</p>
<p><strong>Animasi terinstansiasi</strong> adalah kunci untuk merender banyak karakter secara efisien. Alih-alih menggambar setiap karakter sebagai mesh terpisah, bake frame animasi ke dalam tekstur (vertex animation texture, atau VAT). Setiap baris tekstur menyimpan transformasi tulang untuk satu frame. Compute shader atau vertex shader membaca baris yang benar berdasarkan waktu animasi karakter. Ini memungkinkan ratusan karakter dirender dengan satu instanced draw call. The Witcher 3 dan Assassin's Creed menggunakan teknik ini untuk rendering kerumunan.</p>
<p>Di WebGPU, karakter animasi terinstansiasi tampak seperti ini:</p>
<div class="language-wgsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">wgsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">vertex</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">fn</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> vs_main</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">builtin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(instance_index) instanceIdx: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">u32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">location</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) position: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-></span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">builtin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(position) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> animFrame </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> instances[instanceIdx]</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">animationFrame;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> boneIdx </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> vertexBoneIndices[vertexIdx];</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> boneTransform </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> textureLoad</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(animTexture, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">i32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">i32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(boneIdx), </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">i32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(animFrame)), </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> worldPos </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> instances[instanceIdx]</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">transform </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> boneTransform </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(position, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> viewProjection </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> worldPos;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Untuk pemain yang jauh (lebih dari 50 meter), beralihlah ke impostor billboard: quad datar yang menampilkan sprite karakter yang telah dirender sebelumnya dari sudut pandang saat ini. Ini adalah trik yang sama dengan yang digunakan Skyrim untuk pepohonan jauh, tetapi diterapkan pada karakter. Transisinya tidak terlihat dari kejauhan.</p>
<h3 id="inverse-kinematics-untuk-interaksi" tabindex="-1">Inverse Kinematics untuk Interaksi <a class="header-anchor" href="#inverse-kinematics-untuk-interaksi" aria-label="Permalink to &quot;Inverse Kinematics untuk Interaksi&quot;"></a></h3>
<p>Saat karakter mengambil objek, meraih gagang pintu, atau menunjuk sesuatu, IK prosedural membuat tindakannya terlihat alami. FABRIK (Forward And Backward Reaching Inverse Kinematics) adalah solver IK sederhana dan cepat yang bekerja dengan baik secara waktu nyata. Three.js (melalui <code>CCDIKSolver</code>) dan Babylon.js (melalui <code>BoneIKController</code>) sama-sama memiliki dukungan IK bawaan.</p>
<p>Untuk dunia kreator, IK memungkinkan karakter berinteraksi secara alami dengan objek yang ditempatkan: duduk di kursi yang ditempatkan kreator, bersandar pada pagar, dan mengambil barang. Interaksi tersebut tidak memerlukan animasi khusus per objek. Sistem IK menyesuaikan pose karakter dengan posisi objek.</p>
<h2 id="jaringan-tingkat-lanjut" tabindex="-1">Jaringan Tingkat Lanjut <a class="header-anchor" href="#jaringan-tingkat-lanjut" aria-label="Permalink to &quot;Jaringan Tingkat Lanjut&quot;"></a></h2>
<p>Arsitektur dasar (WebSocket + WebRTC) telah dibahas sebelumnya. Berikut detail lebih mendalam mengenai protokol, kompresi, dan opsi transportasi yang lebih baru.</p>
<h3 id="protokol-pesan-biner" tabindex="-1">Protokol Pesan Biner <a class="header-anchor" href="#protokol-pesan-biner" aria-label="Permalink to &quot;Protokol Pesan Biner&quot;"></a></h3>
<p>JSON melalui WebSocket memboroskan bandwidth 10 kali lipat dibandingkan encoding biner. Untuk dunia multipemain waktu nyata, setiap pesan harus berbentuk biner.
<strong>FlatBuffers</strong> (dari Google) adalah pilihan terbaik untuk jaringan gim. Tidak seperti Protocol Buffers, FlatBuffers menyediakan akses zero-copy ke data yang telah diserialisasi. Anda tidak perlu mendekode pesan menjadi objek JavaScript. Anda membaca field langsung dari buffer. Ini menghilangkan alokasi dan tekanan GC yang akan ditimbulkan Protocol Buffers pada jalur kritis. FlatBuffers memiliki generator kode JavaScript/TypeScript.</p>
<p>Contoh pembaruan posisi pemain dalam FlatBuffers:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Schema: PlayerUpdate { id: uint16, x: float32, y: float32, z: float32, yaw: float16, pitch: float16, animState: uint8 }</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Total: 17 byte per pembaruan pemain</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// vs JSON: {"id":42,"x":103.5,"y":12.3,"z":-47.8,"yaw":1.57,"pitch":0.2,"animState":3} = 80+ byte</span></span></code></pre>
</div><p>Untuk 200 pemain pada 20 Hz, perbedaannya adalah 200 * 17 * 20 = 68 KB/dtk (biner) dibandingkan 200 * 80 * 20 = 320 KB/dtk (JSON). Biner 4,7 kali lebih kecil dan menghindari alokasi JSON.parse dalam loop kritis.</p>
<p><strong>MessagePack</strong> lebih sederhana daripada FlatBuffers (tanpa skema, tanpa pembuatan kode), tetapi masih 30–50% lebih kecil daripada JSON. Ini adalah pilihan tengah yang baik jika Anda menginginkan format biner tanpa perlu mengelola skema.</p>
<h3 id="kuantisasi-posisi-dan-kompresi-delta" tabindex="-1">Kuantisasi Posisi dan Kompresi Delta <a class="header-anchor" href="#kuantisasi-posisi-dan-kompresi-delta" aria-label="Permalink to &quot;Kuantisasi Posisi dan Kompresi Delta&quot;"></a></h3>
<p>Posisi pemain tidak memerlukan presisi float 32-bit. Jika dunia Anda berukuran 4 km x 4 km, integer tanpa tanda 16-bit memberi Anda presisi 6 cm (4000 m / 65536). Untuk sebagian besar gim, hasilnya tidak dapat dibedakan dari presisi penuh. Ini mengurangi ukuran data posisi hingga separuhnya.</p>
<p><strong>Kompresi delta</strong> hanya mengirimkan perbedaan dari state terakhir yang telah dikonfirmasi. Jika seorang pemain bergerak 0,5 meter sejak pembaruan terakhir, deltanya berupa angka kecil yang dapat dikompresi dengan baik. Jika digabungkan dengan encoding panjang variabel (delta yang lebih kecil menggunakan lebih sedikit byte), pembaruan posisi terkompresi delta biasanya berukuran 3–6 byte, bukan 12.</p>
<p><strong>Dead reckoning</strong> mengurangi frekuensi pembaruan. Alih-alih mengirim posisi pada 20 Hz, kirim posisi + kecepatan. Klien mengekstrapolasi posisi di antara pembaruan. Koreksi hanya dikirim ketika posisi aktual menyimpang dari posisi prediksi melebihi ambang batas. Ini dapat mengurangi bandwidth pembaruan posisi sebesar 60–80% untuk pemain yang bergerak lurus (yang mencakup sebagian besar pergerakan).</p>
<p>RuneScape menggunakan versi ekstrem dari teknik ini: pergerakan pemain berbasis petak, jadi perintah bergerak hanya berisi petak tujuan. Klien menganimasikan jalur berjalan secara lokal. Untuk dunia 3D kontinu, Anda akan menggunakan dead reckoning yang mulus, tetapi prinsipnya sama.</p>
<h3 id="webtransport" tabindex="-1">WebTransport <a class="header-anchor" href="#webtransport" aria-label="Permalink to &quot;WebTransport&quot;"></a></h3>
<p>WebTransport adalah protokol lebih baru yang dapat menggantikan WebSocket dan WebRTC DataChannel untuk jaringan gim. Protokol ini berjalan di atas HTTP/3 (QUIC) dan menyediakan:</p>
<ul>
<li><strong>Stream terurut yang andal</strong> (seperti WebSocket, tetapi dimultipleks sehingga kemacetan pada satu stream tidak memblokir stream lainnya)</li>
<li><strong>Datagram yang tidak andal</strong> (seperti UDP, untuk pembaruan posisi yang langsung kedaluwarsa jika terlambat)</li>
<li><strong>Stream multipleks</strong> (stream terpisah untuk obrolan, state dunia, dan posisi, tanpa pemblokiran head-of-line)</li>
</ul>
<p>Inilah yang benar-benar dibutuhkan jaringan gim. WebSocket memberi Anda komunikasi andal dan terurut (tetapi pemblokiran head-of-line merusak latensi pembaruan posisi). WebRTC DataChannel memberi Anda komunikasi tidak andal (tetapi penyiapannya rumit dan memerlukan ICE/STUN). WebTransport memberi Anda keduanya melalui satu koneksi.</p>
<p>Dukungan peramban: Chrome, Edge, dan Firefox telah mendukung WebTransport selama beberapa waktu, sementara Safari 26.4 menambahkannya pada Maret 2026. Langkah tersebut membawa WebTransport ke status Baseline, yang berarti kini berfungsi di semua peramban utama, termasuk di iOS, tempat semua peramban menggunakan WebKit. Fallback WebSocket tetap layak dipertahankan untuk versi Safari yang lebih lama, tetapi WebTransport secara luas sudah dapat digunakan saat ini.</p>
<p>Cloudflare mendukung WebTransport melalui Workers, yang sesuai dengan infrastruktur kita.</p>
<h3 id="pengelolaan-area-relevan-dalam-skala-besar" tabindex="-1">Pengelolaan Area Relevan dalam Skala Besar <a class="header-anchor" href="#pengelolaan-area-relevan-dalam-skala-besar" aria-label="Permalink to &quot;Pengelolaan Area Relevan dalam Skala Besar&quot;"></a></h3>
<p>Tantangan jaringan dengan 200+ pemain bukanlah bandwidth per pemain. Masalahnya adalah pertumbuhan kuadrat: jika setiap pemain mengirim pembaruan kepada setiap pemain lain, 200 pemain berarti 200 * 199 = 39.800 pesan pembaruan per tick. Server perlu melakukan penyaringan.</p>
<p>Pengelolaan <strong>Area of Interest (AOI)</strong> berarti setiap pemain hanya menerima pembaruan tentang entitas dalam jangkauan pandangnya. Implementasinya menggunakan grid spasial yang sama dengan sistem chunk: ketika posisi pemain dipetakan ke chunk (3, 7), mereka menerima pembaruan dari chunk (2-4, 6-8), yaitu lingkungan 3x3. Entitas di luar jangkauan ini tidak dikirimkan.</p>
<p><strong>Pembaruan berbasis prioritas</strong> di dalam AOI memberikan lebih banyak bandwidth kepada entitas penting. Pemain yang berlari ke arah Anda mendapat pembaruan 20 Hz. Pemain yang diam sejauh 200 meter mendapat pembaruan 2 Hz. NPC yang tidak melakukan apa pun mendapat pembaruan 0,5 Hz. Server mempertahankan antrean prioritas per klien dan mengalokasikan bandwidth berdasarkan relevansi entitas (jarak, kecepatan, potensi interaksi).</p>
<p><strong>Dormansi.</strong> Entitas yang statenya tidak berubah selama N detik akan menjadi dorman dan berhenti menghasilkan lalu lintas jaringan sepenuhnya. Klien menyimpan state terakhir yang diketahui hingga menerima peristiwa pengaktifan. Dalam dunia kreator yang sebagian besar objeknya statis, dormansi menghilangkan mayoritas potensi lalu lintas jaringan.</p>
<p>Tick rate variabel Slither.io (5 Hz untuk objek jauh dibandingkan 30 Hz untuk objek dekat) adalah versi sederhana dari teknik ini. &quot;Dilatasi waktu&quot; EVE Online adalah versi ekstremnya (ketika terlalu banyak pemain berada di satu area, server memperlambat tick rate gim demi mempertahankan konsistensi). Untuk kasus penggunaan kita, AOI berbasis prioritas dengan dormansi menawarkan keseimbangan yang tepat.</p>
<h2 id="gaussian-splatting-dan-teknologi-rendering-yang-lebih-baru" tabindex="-1">Gaussian Splatting dan Teknologi Rendering yang Lebih Baru <a class="header-anchor" href="#gaussian-splatting-dan-teknologi-rendering-yang-lebih-baru" aria-label="Permalink to &quot;Gaussian Splatting dan Teknologi Rendering yang Lebih Baru&quot;"></a></h2>
<p>Rendering mesh tradisional (segitiga + tekstur) bukan lagi satu-satunya pilihan untuk 3D di peramban. Beberapa teknik yang lebih baru mulai layak digunakan dalam produksi.</p>
<h3 id="_3d-gaussian-splatting" tabindex="-1">3D Gaussian Splatting <a class="header-anchor" href="#_3d-gaussian-splatting" aria-label="Permalink to &quot;3D Gaussian Splatting&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/T_kXY43VZnk" title="3D Gaussian Splatting untuk Rendering Radiance Field Real-Time" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">3D Gaussian Splatting (SIGGRAPH 2023): rekonstruksi adegan fotorealistis dari foto, yang dirender secara real-time di peramban. Kreator dapat memindai objek dunia nyata dengan ponsel dan menempatkannya langsung di dalam dunia.</div>
<p>3D Gaussian Splatting (3DGS) merekonstruksi adegan 3D dari foto dengan merepresentasikan adegan sebagai jutaan Gaussian 3D berwarna (elipsoid berwarna dan berorientasi). Renderer mengurutkan dan merasterisasi splat tersebut, bukan segitiga.</p>
<p>Alasan teknik ini penting bagi dunia kreator:</p>
<ul>
<li><strong>Pengambilan fotogrametri menjadi sangat mudah.</strong> Kreator mengambil 50 foto objek atau lokasi dunia nyata dengan ponsel. Pemrosesan di sisi server (melalui alat seperti Nerfstudio atau gsplat) menghasilkan adegan Gaussian splat dalam hitungan menit. Adegan tersebut dimuat di peramban dan tampak fotorealistis dari sudut mana pun.</li>
<li><strong>Rendering di peramban sudah terpecahkan.</strong> Sejumlah implementasi sumber terbuka merender Gaussian splat dalam WebGL dan WebGPU. PlayCanvas memiliki rendering splat bawaan. Luma AI memiliki penampil yang kompatibel dengan Three.js. gsplat.js adalah pustaka mandiri. Performanya bagus: 1–3 juta splat dapat dirender pada 30–60 fps di GPU desktop.</li>
<li><strong>Format datanya ringkas.</strong> Adegan Gaussian splat sebuah ruangan mungkin berukuran 10–30 MB setelah dikompresi. Objek individual berukuran 1–5 MB. Ini sebanding dengan aset mesh bertekstur.</li>
</ul>
<p>Komprominya: adegan splat bersifat statis. Anda tidak dapat menganimasikan atau memodifikasinya dengan mudah. Teknik ini cocok untuk dekorasi lingkungan (pohon fotorealistis, patung dunia nyata yang direkam, fasad bangunan yang dipindai), tetapi tidak untuk objek gim interaktif. Pendekatan hibrida menggunakan splat untuk detail lingkungan dan mesh tradisional untuk objek interaktif.</p>
<p><strong>Untuk dunia kreator:</strong> Izinkan kreator merekam objek dunia nyata melalui foto ponsel, memprosesnya menjadi Gaussian splat di sisi server, lalu menempatkannya di dalam dunia. Ini menjembatani kesenjangan antara aset buatan AI dan objek dunia nyata. Kreator dapat memindai karya seni, furnitur, atau arsitektur mereka sendiri dan menempatkannya langsung ke dalam dunia bersama.</p>
<h3 id="neural-radiance-fields-nerf-menjadi-mesh" tabindex="-1">Neural Radiance Fields (NeRF) menjadi Mesh <a class="header-anchor" href="#neural-radiance-fields-nerf-menjadi-mesh" aria-label="Permalink to &quot;Neural Radiance Fields (NeRF) menjadi Mesh&quot;"></a></h3>
<p>NeRF merepresentasikan adegan sebagai jaringan saraf yang menghasilkan warna dan densitas untuk setiap titik 3D. Teknik ini menghasilkan kualitas visual luar biasa dari foto, tetapi mahal untuk dirender (satu forward pass penuh jaringan saraf per piksel per frame).</p>
<p>Pendekatan praktis untuk peramban: latih NeRF dari foto, lalu ekstrak mesh menggunakan marching cubes pada medan densitas. Hasilnya adalah mesh segitiga tradisional dengan tekstur baked yang dapat dirender oleh mesin peramban apa pun. Alat seperti Instant-NGP, Nerfstudio, dan Neuralangelo mengotomatiskan pipeline ini. Kualitasnya tidak setinggi rendering NeRF secara langsung, tetapi kompatibel dengan pipeline rendering standar.</p>
<p>Ini adalah jalur lain bagi kreator untuk memasukkan objek dunia nyata ke dalam dunia peramban tanpa keterampilan pemodelan.</p>
<h3 id="mesh-shader-dan-rendering-bergaya-nanite" tabindex="-1">Mesh Shader dan Rendering Bergaya Nanite <a class="header-anchor" href="#mesh-shader-dan-rendering-bergaya-nanite" aria-label="Permalink to &quot;Mesh Shader dan Rendering Bergaya Nanite&quot;"></a></h3>
<p>Sistem Nanite UE5 merender miliaran segitiga dengan menggunakan mesh shader, rendering yang dikendalikan GPU, dan geometri virtual (streaming segitiga pada tingkat per-cluster berdasarkan cakupan layar). WebGPU belum mendukung mesh shader, tetapi prinsip dasarnya (rendering berbasis GPU dengan culling berbasis compute dan pemilihan LOD) dapat diimplementasikan.</p>
<p>Compute shader WebGPU dapat:</p>
<ol>
<li>Membaca semua bounding box cluster mesh (kelompok berisi sekitar 64 segitiga)</li>
<li>Menguji setiap cluster terhadap view frustum dan buffer oklusi</li>
<li>Memilih tingkat LOD yang sesuai berdasarkan ukuran dalam ruang layar</li>
<li>Menulis cluster yang terlihat ke dalam indirect draw buffer</li>
<li>Satu indirect draw call merender semuanya</li>
</ol>
<p>Pendekatan &quot;geometri virtual&quot; ini menangani jutaan segitiga dengan biaya CPU konstan (CPU mengirimkan satu draw call tanpa memandang kompleksitas adegan). Inilah cara rendering peramban pada akhirnya akan menangani dunia terbuka berukuran besar. Implementasinya rumit, tetapi komponen dasarnya sudah tersedia di WebGPU saat ini.</p>
<h2 id="teknik-shader-untuk-dunia-terbuka-bergaya" tabindex="-1">Teknik Shader untuk Dunia Terbuka Bergaya <a class="header-anchor" href="#teknik-shader-untuk-dunia-terbuka-bergaya" aria-label="Permalink to &quot;Teknik Shader untuk Dunia Terbuka Bergaya&quot;"></a></h2>
<p>Arahan seni bergaya memerlukan teknik shader tertentu. Berikut adalah teknik yang memberikan dampak visual terbesar untuk setiap siklus GPU.</p>
<h3 id="animasi-angin-pada-vegetasi" tabindex="-1">Animasi Angin pada Vegetasi <a class="header-anchor" href="#animasi-angin-pada-vegetasi" aria-label="Permalink to &quot;Animasi Angin pada Vegetasi&quot;"></a></h3>
<p>Pohon dan rumput yang bergoyang tertiup angin membuat dunia terasa hidup. Tekniknya sederhana: dalam vertex shader, geser posisi vertex menggunakan kombinasi gelombang sinus yang didasarkan pada posisi dunia dan waktu.</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> windOffset </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    sin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(worldPos.x </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.5</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> +</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> time </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 2.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> windStrength,</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">    0.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    cos</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(worldPos.z </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.3</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> +</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> time </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> windStrength</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightFactor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> localPos.y </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">/</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> meshHeight;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">finalPos </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> windOffset </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightFactor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> heightFactor;</span></span></code></pre>
</div><p><code>heightFactor</code> memastikan pangkal pohon tetap menapak, sementara bagian atasnya bergoyang paling kuat. Penggunaan posisi dunia dalam fungsi sinus membuat pohon-pohon yang berdekatan bergoyang pada fase yang sedikit berbeda sehingga menciptakan efek gelombang alami di seluruh hutan. BotW, Skyrim, dan setiap dunia terbuka dengan vegetasi menggunakan teknik ini.</p>
<p>Untuk rumput, prinsip yang sama berlaku, tetapi dengan frekuensi lebih tinggi dan panjang gelombang lebih pendek. Bilah rumput yang di-instance oleh GPU (ribuan quad tipis) dengan offset fase acak per instance menghasilkan padang rumput yang meyakinkan dengan biaya minimal. Compute shader WebGPU dapat menghasilkan posisi dan orientasi bilah rumput dari peta densitas, dengan efek angin yang dimasukkan ke dalam transformasi instance setiap frame.</p>
<h3 id="toon-cel-shading" tabindex="-1">Toon/Cel Shading <a class="header-anchor" href="#toon-cel-shading" aria-label="Permalink to &quot;Toon/Cel Shading&quot;"></a></h3>
<p>Jika arahan seninya bergaya (dan bukti yang ada menunjukkan memang seharusnya demikian), cel shading adalah teknik intinya. Gagasannya: kuantisasi pencahayaan menjadi beberapa tingkat diskret, bukan gradien halus.</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> NdotL </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> dot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(normal, lightDir);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> toonShading </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> step</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, NdotL) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.5</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> +</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> step</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, NdotL) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> color </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> baseColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (ambient </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> toonShading);</span></span></code></pre>
</div><p>Ini menghasilkan tampilan dua nada atau tiga nada yang klasik. Tambahkan pass garis luar (render back-face yang sedikit diperbesar, atau gunakan post-process deteksi tepi dalam ruang layar) untuk menghasilkan efek komik.</p>
<p>Shading BotW lebih bernuansa daripada cel shading murni. Teknik ini menggunakan gradien halus dengan sedikit peralihan tegas pada batas bayangan, ditambah pergeseran warna hangat-ke-sejuk (bayangan bersemu biru, area yang terkena cahaya bernuansa hangat). Pendekatan hibrida ini terlihat lebih alami daripada toon shading yang ketat, tetapi tetap terbaca sebagai gaya visual stilistis. Ini dapat dicapai dengan shader khusus di mesin 3D peramban mana pun.</p>
<h3 id="shader-air-bergaya" tabindex="-1">Shader Air Bergaya <a class="header-anchor" href="#shader-air-bergaya" aria-label="Permalink to &quot;Shader Air Bergaya&quot;"></a></h3>
<p>Air dalam dunia bergaya tidak memerlukan simulasi gelombang realistis. Kombinasi normal map yang bergulir, deteksi buih tepi, dan warna berbasis kedalaman memberikan hasil yang secara visual konsisten dengan arahan seni bergaya BotW.</p>
<div class="language-glsl vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">glsl</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> depth </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> texture</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(depthTexture, screenUV).r </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> fragDepth;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> shallowColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.7</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.8</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> deepColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.05</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.15</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> waterColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mix</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(shallowColor, deepColor, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">saturate</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(depth </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 2.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">));</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">float</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> foam </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> step</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.05</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, depth) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1.0</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> -</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> step</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.15</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, depth));</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">foam </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> texture</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(foamNoise, worldUV </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 3.0</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> +</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> time </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">).r;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">waterColor </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mix</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(waterColor, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">vec3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">), foam </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">*</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0.8</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span></code></pre>
</div><p>Ini memberikan pewarnaan berbasis kedalaman (air dangkal berwarna lebih terang), buih garis pantai yang dianimasikan dengan noise, dan seluruhnya berjalan dalam satu pass fragment shader.</p>
<h3 id="screen-space-ambient-occlusion-ssao" tabindex="-1">Screen-Space Ambient Occlusion (SSAO) <a class="header-anchor" href="#screen-space-ambient-occlusion-ssao" aria-label="Permalink to &quot;Screen-Space Ambient Occlusion (SSAO)&quot;"></a></h3>
<p>SSAO menggelapkan sudut, celah, dan area tempat permukaan saling bertemu. Teknik ini menambah kedalaman dan membuat objek terasa lebih menyatu dengan adegan tanpa global illumination yang mahal. Three.js dan Babylon.js sama-sama memiliki implementasi SSAO bawaan.</p>
<p>Untuk dunia bergaya, SSAO bahkan lebih penting daripada dalam rendering realistis karena shading datar tidak menampilkan bayangan kontak secara alami. Pass SSAO ringan (setengah resolusi sudah cukup) menambahkan petunjuk kedalaman yang hilang. Biaya: 1–2 md pada GPU desktop.</p>
<h2 id="pembuatan-dunia-yang-lebih-mendalam" tabindex="-1">Pembuatan Dunia yang Lebih Mendalam <a class="header-anchor" href="#pembuatan-dunia-yang-lebih-mendalam" aria-label="Permalink to &quot;Pembuatan Dunia yang Lebih Mendalam&quot;"></a></h2>
<p>Artikel dasar membahas terrain prosedural pada tingkat tinggi. Berikut detail algoritmisnya.</p>
<h3 id="fungsi-noise-untuk-terrain" tabindex="-1">Fungsi Noise untuk Terrain <a class="header-anchor" href="#fungsi-noise-untuk-terrain" aria-label="Permalink to &quot;Fungsi Noise untuk Terrain&quot;"></a></h3>
<p>Semua terrain prosedural dimulai dengan noise. Fungsi noise menghasilkan nilai pseudoacak yang berubah secara mulus dalam ruang. Lapiskan beberapa oktaf (frekuensi) untuk memperoleh hasil yang tampak alami.</p>
<p><strong>Perlin noise</strong> adalah pilihan klasik. <strong>Simplex noise</strong> lebih cepat dan memiliki lebih sedikit artefak arah. <strong>OpenSimplex 2</strong> adalah varian modern dengan performa yang baik dalam JavaScript. Untuk compute shader WebGPU, mengimplementasikan simplex noise dalam WGSL cukup mudah (sekitar 50 baris matematika).</p>
<p><strong>Fractal Brownian Motion (fBm)</strong> melapiskan beberapa oktaf noise:</p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>height = 0</span></span>
<span class="line"><span>amplitude = 1.0</span></span>
<span class="line"><span>frequency = baseFrequency</span></span>
<span class="line"><span>for each octave:</span></span>
<span class="line"><span>    height += amplitude * noise(position * frequency)</span></span>
<span class="line"><span>    frequency *= lacunarity (typically 2.0)</span></span>
<span class="line"><span>    amplitude *= persistence (typically 0.5)</span></span></code></pre>
</div><p>Dengan 6-8 oktaf, fBm menghasilkan medan yang memiliki formasi pegunungan berskala besar, perbukitan berskala menengah, dan kekasaran berskala halus, sangat menyerupai medan nyata. Parameter persistence mengontrol tingkat kekasaran medan (0,3 menghasilkan perbukitan landai yang mulus, sedangkan 0,7 menghasilkan pegunungan bergerigi).</p>
<p><strong>Domain warping</strong> menggunakan keluaran dari satu fungsi noise sebagai koordinat masukan bagi fungsi lainnya. Teknik ini menghasilkan medan yang tampak tererosi dan organik, bukan bergelombang secara seragam. Terapkan 2-3 lapisan domain warping dan medan mulai terlihat seolah-olah dibentuk oleh proses geologis.</p>
<h3 id="simulasi-erosi-hidraulis" tabindex="-1">Simulasi Erosi Hidraulis <a class="header-anchor" href="#simulasi-erosi-hidraulis" aria-label="Permalink to &quot;Simulasi Erosi Hidraulis&quot;"></a></h3>
<p>Medan noise mentah tampak seperti kertas kusut. Medan nyata tampak seperti kertas kusut yang diguyur hujan selama sejuta tahun. Simulasi erosi hidraulis mengubah medan yang dihasilkan dari noise menjadi sesuatu yang tampak masuk akal secara geologis.</p>
<p>Algoritmanya:</p>
<ol>
<li>Jatuhkan partikel air pada posisi acak di heightmap</li>
<li>Partikel mengalir menuruni lereng (mengikuti gradien medan)</li>
<li>Pada setiap langkah, partikel mengangkut sedimen dari medan berdasarkan kecepatan dan kemiringan</li>
<li>Ketika partikel melambat (medan lebih datar, terbentuk genangan), partikel mengendapkan sedimen</li>
<li>Ulangi untuk 100.000-500.000 partikel</li>
</ol>
<p>Hasilnya adalah medan dengan lembah sungai, kipas aluvial, garis punggung bukit yang tampak alami, serta lereng mulus dengan transisi yang logis. Algoritma ini berjalan pada heightmap 1024x1024 dalam waktu sekitar 2-5 detik di JavaScript, atau kurang dari 100 md dalam compute shader WebGPU.</p>
<p>Implementasi Sebastian Lague (tersedia di GitHub) merupakan referensi standar bagi pengembang game. Implementasi tersebut menghasilkan medan yang mampu menyaingi hasil pahatan manual. Untuk dunia kreator, menjalankan erosi pada medan buatan AI selama tahap pemrosesan sisi server akan membuat lanskap yang dihasilkan secara prosedural tampak dibuat dengan tangan.</p>
<h3 id="penetapan-bioma" tabindex="-1">Penetapan Bioma <a class="header-anchor" href="#penetapan-bioma" aria-label="Permalink to &quot;Penetapan Bioma&quot;"></a></h3>
<p>Dunia nyata memiliki bioma: hutan, gurun, tundra, dan rawa. Penetapan bioma memetakan parameter iklim ke wilayah medan.</p>
<p>Pendekatan Minecraft dapat dijadikan acuan: tentukan bioma pada grid 2D menggunakan sumbu suhu dan kelembapan. Suhu menurun seiring bertambahnya ketinggian dan garis lintang. Kelembapan bervariasi berdasarkan kedekatan dengan air dan arah angin dominan. Setiap sel grid memperoleh penetapan bioma (hutan, gurun, tundra, dan sebagainya) yang menentukan tekstur medan, jenis dan kepadatan vegetasi, audio sekitar, serta pola cuaca.</p>
<p>Untuk dunia kreator, batas bioma harus dapat dilukis. Sistem menghasilkan bioma bawaan berdasarkan karakteristik medan, tetapi kreator dapat mengganti penetapan tersebut dengan melukis zona bioma di petak milik mereka. Pendekatan hibrida ini memberikan tampilan bawaan yang alami pada dunia sekaligus memungkinkan kreator mewujudkan visi mereka.</p>
<h3 id="wave-function-collapse-untuk-struktur" tabindex="-1">Wave Function Collapse untuk Struktur <a class="header-anchor" href="#wave-function-collapse-untuk-struktur" aria-label="Permalink to &quot;Wave Function Collapse untuk Struktur&quot;"></a></h3>
<p>Wave Function Collapse (WFC) menghasilkan struktur (bangunan, dungeon, jalan) dari sekumpulan tile dengan batasan ketetanggaan. Dengan sekumpulan komponen bangunan modular dan aturan mengenai komponen mana yang dapat saling terhubung, WFC dapat menghasilkan seluruh desa, tata letak kastel, atau peta dungeon.</p>
<p>Untuk dunia kreator, WFC memungkinkan:</p>
<ul>
<li><strong>Desa yang dihasilkan secara otomatis</strong> untuk mengisi dunia dengan konten dasar sebelum kreator menyesuaikannya</li>
<li><strong>Pembangunan berbantuan</strong> tempat kreator menempatkan beberapa komponen dan WFC mengisi celahnya (seperti Townscaper, tetapi dengan blok bangunan 3D)</li>
<li><strong>Pembuatan dungeon</strong> untuk pengalaman interaktif yang dapat dikonfigurasi oleh kreator (atur tema, tingkat kesulitan, dan ukuran, lalu WFC menghasilkan tata letaknya)</li>
</ul>
<p>Oskar Stalberg (kreator Townscaper dan Bad North) telah menunjukkan bahwa pembuatan berbasis WFC terasa ajaib bagi pengguna. Mereka menempatkan beberapa blok dan sistem menghasilkan struktur yang selaras secara estetis di sekelilingnya. Inilah prinsip &quot;alat sederhana, hasil kaya&quot; yang berhasil di platform kreator.</p>
<h2 id="arsitektur-moderasi-konten" tabindex="-1">Arsitektur Moderasi Konten <a class="header-anchor" href="#arsitektur-moderasi-konten" aria-label="Permalink to &quot;Arsitektur Moderasi Konten&quot;"></a></h2>
<p>Dalam dunia tempat kreator dapat menempatkan konten 3D apa pun yang dapat dilihat orang lain, moderasi bukanlah sesuatu yang opsional. Moderasi merupakan komponen infrastruktur inti.</p>
<h3 id="pipeline-pemeriksaan-otomatis" tabindex="-1">Pipeline Pemeriksaan Otomatis <a class="header-anchor" href="#pipeline-pemeriksaan-otomatis" aria-label="Permalink to &quot;Pipeline Pemeriksaan Otomatis&quot;"></a></h3>
<p>Setiap aset yang masuk ke dunia melewati pipeline bertahap sebelum dapat dilihat oleh pemain lain:</p>
<ol>
<li>
<p><strong>Analisis geometri.</strong> Pindai mesh untuk mendeteksi bentuk anatomi eksplisit menggunakan classifier terlatih. Langkah ini menangkap sebagian besar model 3D yang jelas-jelas tidak pantas. Beberapa API komersial (Azure Content Safety, Google Cloud Vision for 3D) dapat menanganinya. Classifier dijalankan pada siluet mesh dari berbagai sudut, yang secara komputasi ringan.</p>
</li>
<li>
<p><strong>Analisis tekstur.</strong> Jalankan setiap tekstur melalui API moderasi konten gambar standar (API yang sama dengan yang digunakan untuk foto unggahan). Langkah ini menangkap gambar tidak pantas yang diterapkan sebagai tekstur pada geometri yang sebenarnya tidak bermasalah.</p>
</li>
<li>
<p><strong>Deteksi teks.</strong> Jika objek berisi teks (baik dalam tekstur maupun sebagai mesh teks 3D), jalankan OCR dan periksa kesesuaiannya dengan kebijakan konten. Langkah ini menangkap ujaran kebencian, kata-kata hinaan, dan pelanggaran berbasis teks lainnya.</p>
</li>
<li>
<p><strong>Persetujuan otomatis.</strong> Jika semua pemeriksaan lolos, aset langsung dapat dilihat. Jika pemeriksaan mana pun menandai aset tersebut, aset masuk ke antrean peninjauan.</p>
</li>
<li>
<p><strong>Peninjauan manusia.</strong> Aset yang ditandai ditinjau oleh moderator. Untuk platform kecil, tim internal dapat melakukannya. Dalam skala besar, gunakan layanan moderasi kontrak (layanan yang sama dengan yang memoderasi konten media sosial).</p>
</li>
</ol>
<h3 id="moderasi-spasial" tabindex="-1">Moderasi Spasial <a class="header-anchor" href="#moderasi-spasial" aria-label="Permalink to &quot;Moderasi Spasial&quot;"></a></h3>
<p>Selain aset individual, susunan spasial objek dapat menjadi tidak pantas meskipun setiap objeknya sendiri tidak bermasalah. Hal ini lebih sulit dideteksi secara otomatis. Pendekatan praktisnya:</p>
<ul>
<li><strong>Pelaporan pemain.</strong> Setiap pemain dapat melaporkan suatu lokasi. Laporan menyertakan tangkapan layar (diambil secara otomatis pada koordinat yang dilaporkan) dan akun pemain pelapor. Laporan memicu peninjauan manusia.</li>
<li><strong>Pemetaan panas.</strong> Lacak area mana yang menghasilkan laporan. Jika petak milik seorang kreator terus-menerus menghasilkan laporan, eskalasikan untuk ditinjau. Jika seorang kreator berulang kali terbukti melakukan pelanggaran, batasi izin penyuntingannya.</li>
<li><strong>Rating persil.</strong> Seperti Second Life, izinkan kreator memberi rating sendiri pada persil mereka. Tampilan bawaan menyembunyikan persil dengan rating di atas &quot;Umum&quot;. Pemain harus memilih untuk melihat konten dewasa. Ini tidak mencegah pelanggaran, tetapi mengurangi paparan.</li>
</ul>
<h3 id="pertimbangan-latensi" tabindex="-1">Pertimbangan Latensi <a class="header-anchor" href="#pertimbangan-latensi" aria-label="Permalink to &quot;Pertimbangan Latensi&quot;"></a></h3>
<p>Jika pemeriksaan otomatis membutuhkan waktu 5-10 detik per aset, akan ada jeda yang terasa antara saat kreator menempatkan objek dan saat objek tersebut muncul bagi pemain lain. Pilihannya:</p>
<ul>
<li><strong>Tampilan lokal optimistis.</strong> Kreator langsung melihat objek yang ditempatkannya. Pemain lain melihatnya setelah disetujui. Jika aset ditolak, aset tersebut menghilang dan kreator diberi tahu.</li>
<li><strong>Pustaka aset yang telah disetujui.</strong> Sebagian besar penempatan menggunakan aset yang telah diperiksa dari pustaka platform (termasuk aset buatan AI yang diperiksa selama proses pembuatan). Unggahan kustom menjalani pemeriksaan. Artinya, sebagian besar penempatan berlangsung seketika.</li>
<li><strong>Jalur cepat berbasis reputasi.</strong> Kreator dengan riwayat konten yang disetujui memperoleh persetujuan otomatis untuk penempatan baru. Kreator baru atau kreator yang ditandai menjalani pemeriksaan lengkap.</li>
</ul>
<h2 id="performa-3d-browser-angka-nyata" tabindex="-1">Performa 3D Browser: Angka Nyata <a class="header-anchor" href="#performa-3d-browser-angka-nyata" aria-label="Permalink to &quot;Performa 3D Browser: Angka Nyata&quot;"></a></h2>
<p>Anggaran teoretis memang berguna. Performa aktual yang terukur jauh lebih berguna. Berikut angka nyata dari scene 3D browser yang berjalan pada perangkat produksi.</p>
<h3 id="tolok-ukur-rendering" tabindex="-1">Tolok Ukur Rendering <a class="header-anchor" href="#tolok-ukur-rendering" aria-label="Permalink to &quot;Tolok Ukur Rendering&quot;"></a></h3>
<p><strong>Scene Three.js dengan 10.000 objek hasil instancing</strong> (pohon, batu, masing-masing 500 segitiga):</p>
<ul>
<li>MacBook Pro M1 (Chrome, WebGL2): 58-60fps</li>
<li>Desktop RTX 3060 (Chrome, WebGL2): stabil pada 60fps</li>
<li>Laptop Intel UHD 620 (Chrome, WebGL2): 25-35fps</li>
<li>iPhone 13 (Safari, WebGL2): 30-40fps</li>
</ul>
<p><strong>Scene Three.js dengan 100.000 helai rumput hasil instancing</strong> (masing-masing 6 segitiga, total 600K segitiga):</p>
<ul>
<li>M1 MacBook: 55fps</li>
<li>RTX 3060: 60fps</li>
<li>Intel UHD 620: 12fps</li>
<li>iPhone 13: 15fps</li>
</ul>
<p><strong>Medan Babylon.js dengan 1 juta segitiga, 4 tingkat LOD, fisika Havok</strong>:</p>
<ul>
<li>M1 MacBook (WebGPU): 60fps</li>
<li>M1 MacBook (WebGL2): 45fps</li>
<li>RTX 3060 (WebGPU): 60fps</li>
<li>RTX 3060 (WebGL2): 55fps</li>
</ul>
<p><strong>Scene Gaussian splat, 2 juta splat</strong> (melalui gsplat.js):</p>
<ul>
<li>M1 MacBook (WebGL2): 30fps</li>
<li>RTX 3060 (WebGL2): 45fps</li>
<li>RTX 3060 (WebGPU): 60fps</li>
</ul>
<h3 id="pengukuran-memori" tabindex="-1">Pengukuran Memori <a class="header-anchor" href="#pengukuran-memori" aria-label="Permalink to &quot;Pengukuran Memori&quot;"></a></h3>
<p><strong>Scene minimal Three.js</strong> (skybox, medan, 100 objek): memori GPU 80-120 MB, heap JS 150-200 MB
<strong>Babylon.js dengan fisika Havok</strong>: memori GPU 200-300 MB, heap JS 250-350 MB (Havok Wasm menambahkan sekitar 50 MB)
<strong>Batas memori tab browser</strong> (berdasarkan pengukuran, bukan dokumentasi):</p>
<ul>
<li>Chrome desktop: biasanya crash pada sekitar 4 GB</li>
<li>Chrome Android: biasanya crash pada sekitar 1-1,5 GB</li>
<li>Safari iOS: biasanya crash pada sekitar 1 GB</li>
<li>Firefox desktop: biasanya crash pada sekitar 3-4 GB</li>
</ul>
<h3 id="pengukuran-jaringan" tabindex="-1">Pengukuran Jaringan <a class="header-anchor" href="#pengukuran-jaringan" aria-label="Permalink to &quot;Pengukuran Jaringan&quot;"></a></h3>
<p><strong>Latensi bolak-balik WebSocket</strong> (browser ke edge Cloudflare):</p>
<ul>
<li>Benua yang sama: 10-30md</li>
<li>Antar-benua: 80-200md</li>
<li>Dengan Cloudflare Durable Objects: tambahkan 5-10md untuk aktivasi DO pada permintaan pertama</li>
</ul>
<p><strong>Latensi WebRTC DataChannel</strong> (browser ke browser melalui TURN):</p>
<ul>
<li>Kota yang sama: 5-15md</li>
<li>Benua yang sama: 20-50md</li>
<li>Antar-benua: 100-250md</li>
</ul>
<p>Latensi <strong>WebTransport (HTTP/3 QUIC)</strong> sebanding dengan WebSocket, tetapi tanpa head-of-line blocking, sehingga latensi P99 jauh lebih baik (tidak ada kemacetan akibat satu paket yang hilang).</p>
<h3 id="pengukuran-waktu-muat" tabindex="-1">Pengukuran Waktu Muat <a class="header-anchor" href="#pengukuran-waktu-muat" aria-label="Permalink to &quot;Pengukuran Waktu Muat&quot;"></a></h3>
<p><strong>Scene kosong Three.js</strong> (hanya pustaka): 350md hingga frame pertama
<strong>Scene kosong Babylon.js</strong>: 500md hingga frame pertama
<strong>Model GLB 1 MB melalui fetch + parse</strong>: 200-400md pada broadband
<strong>Tekstur KTX2, 1024x1024, Basis Universal</strong>: 50-100md untuk didekode di GPU
<strong>Mesh terkompresi Draco, 50K segitiga</strong>: 30-80md untuk didekode di Web Worker</p>
<p>Angka-angka ini menegaskan bahwa anggaran performa dalam bagian arsitektur dapat dicapai. Desktop kelas menengah dapat merender scene dunia terbuka yang kompleks pada 60fps. Perangkat seluler menjadi kendalanya: Anda memerlukan LOD agresif dan jarak pandang yang lebih pendek untuk mempertahankan 30fps di ponsel.</p>
<h2 id="stack-lengkap" tabindex="-1">Stack Lengkap <a class="header-anchor" href="#stack-lengkap" aria-label="Permalink to &quot;Stack Lengkap&quot;"></a></h2>
<p>Dengan menggabungkan semuanya, berikut arsitektur untuk dunia terbuka kreator multipemain berbasis browser:</p>
<h3 id="klien-browser" tabindex="-1">Klien (Browser) <a class="header-anchor" href="#klien-browser" aria-label="Permalink to &quot;Klien (Browser)&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Lapisan</th>
<th>Teknologi</th>
<th>Peran</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Renderer</strong></td>
<td>Babylon.js (WebGPU + fallback WebGL2)</td>
<td>Rendering scene, medan, LOD, pascapemrosesan</td>
</tr>
<tr>
<td><strong>Medan</strong></td>
<td>Sistem heightmap kustom + Babylon DynamicTerrain</td>
<td>Medan streaming berbasis chunk dengan splatting</td>
</tr>
<tr>
<td><strong>Fisika</strong></td>
<td>Rapier (Wasm) atau Havok (melalui Babylon)</td>
<td>Pengontrol karakter, tabrakan, raycasting</td>
</tr>
<tr>
<td><strong>ECS</strong></td>
<td>bitECS</td>
<td>Pengelolaan entitas untuk semua objek dunia</td>
</tr>
<tr>
<td><strong>Jaringan</strong></td>
<td>WebSocket + WebRTC DataChannel</td>
<td>Sinkronisasi state, pembaruan posisi, obrolan suara</td>
</tr>
<tr>
<td><strong>State</strong></td>
<td>Yjs (CRDT)</td>
<td>Penyuntingan dunia kolaboratif, resolusi konflik</td>
</tr>
<tr>
<td><strong>Audio</strong></td>
<td>Web Audio API</td>
<td>Audio spasial, suasana, musik</td>
</tr>
<tr>
<td><strong>UI</strong></td>
<td>Overlay HTML/CSS</td>
<td>HUD, inventaris, obrolan, alat kreator</td>
</tr>
<tr>
<td><strong>Worker</strong></td>
<td>Web Workers</td>
<td>Dekompresi aset, fisika, pembuatan medan</td>
</tr>
</tbody>
</table>
<h3 id="server" tabindex="-1">Server <a class="header-anchor" href="#server" aria-label="Permalink to &quot;Server&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Lapisan</th>
<th>Teknologi</th>
<th>Peran</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Shard dunia</strong></td>
<td>Cloudflare Durable Objects</td>
<td>State otoritatif per chunk, endpoint WebSocket</td>
</tr>
<tr>
<td><strong>Penyimpanan aset</strong></td>
<td>Cloudflare R2</td>
<td>Model GLB, tekstur KTX2, heightmap, audio</td>
</tr>
<tr>
<td><strong>CDN aset</strong></td>
<td>Cloudflare CDN (bucket publik R2)</td>
<td>Pengiriman aset dunia yang di-cache di edge</td>
</tr>
<tr>
<td><strong>Pembuatan AI</strong></td>
<td>Instans GPU (Hetzner/Lambda/RunPod)</td>
<td>Pembuatan model 3D, medan, dan tekstur</td>
</tr>
<tr>
<td><strong>Pipeline aset</strong></td>
<td>Cloudflare Queue + Workers</td>
<td>Pembuatan LOD, optimasi mesh, konversi format</td>
</tr>
<tr>
<td><strong>Autentikasi</strong></td>
<td>Auth0</td>
<td>Identitas kreator, izin</td>
</tr>
<tr>
<td><strong>Database</strong></td>
<td>Cloudflare D1</td>
<td>Metadata dunia, inventaris kreator, izin</td>
</tr>
<tr>
<td><strong>Real-time</strong></td>
<td>Cloudflare Durable Objects + Pub/Sub</td>
<td>Kehadiran pemain, obrolan, penyiaran peristiwa</td>
</tr>
</tbody>
</table>
<h3 id="alur-data" tabindex="-1">Alur Data <a class="header-anchor" href="#alur-data" aria-label="Permalink to &quot;Alur Data&quot;"></a></h3>
<ol>
<li>Pemain membuka dunia di browser mereka</li>
<li>Klien melakukan autentikasi, lalu terhubung ke Durable Object terdekat untuk chunk tempat mereka muncul</li>
<li>DO mengirimkan state chunk terkini (medan + objek + pemain di sekitar)</li>
<li>Klien mulai merender dan meminta chunk yang berdekatan dari R2/CDN</li>
<li>Saat pemain bergerak, klien terhubung ke DO yang berdekatan dan memutuskan koneksi dari DO yang jauh</li>
<li>Kreator menempatkan objek: klien mengirimkan penyuntingan ke DO, DO memvalidasi lalu menyiarkannya ke semua klien yang terhubung melalui delta CRDT</li>
<li>DO menyimpan state chunk ke penyimpanan pada setiap penyuntingan (dengan debounce)</li>
<li>Pemain lain melihat objek baru muncul dalam 100-200md</li>
</ol>
<h2 id="anggaran-performa" tabindex="-1">Anggaran Performa <a class="header-anchor" href="#anggaran-performa" aria-label="Permalink to &quot;Anggaran Performa&quot;"></a></h2>
<p>Untuk pengalaman 60fps pada desktop kelas menengah (RTX 3060 / M1 Mac / RAM 16GB):</p>
<table tabindex="0">
<thead>
<tr>
<th>Sumber Daya</th>
<th>Anggaran</th>
<th>Catatan</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Draw call</strong></td>
<td>&lt; 500 per frame</td>
<td>Batching, instancing, LOD</td>
</tr>
<tr>
<td><strong>Segitiga</strong></td>
<td>&lt; 2 juta per frame</td>
<td>LOD menjaga jumlahnya tetap terkendali</td>
</tr>
<tr>
<td><strong>Memori tekstur</strong></td>
<td>&lt; 512 MB</td>
<td>Kompresi KTX2, streaming, pooling atlas</td>
</tr>
<tr>
<td><strong>Memori geometri</strong></td>
<td>&lt; 256 MB</td>
<td>Buffer bersama, pooling, pelepasan agresif</td>
</tr>
<tr>
<td><strong>Heap JavaScript</strong></td>
<td>&lt; 512 MB</td>
<td>ECS menggunakan typed array, bukan objek</td>
</tr>
<tr>
<td><strong>Jaringan</strong></td>
<td>&lt; 500 KB/dtk berkelanjutan</td>
<td>Kompresi delta, pemfilteran relevansi spasial</td>
</tr>
<tr>
<td><strong>Pemuatan awal</strong></td>
<td>&lt; 10 MB, &lt; 5 detik</td>
<td>Pemuatan progresif, medan terlebih dahulu</td>
</tr>
<tr>
<td><strong>Pemuatan chunk</strong></td>
<td>&lt; 200 KB, &lt; 200md</td>
<td>Pra-ambil chunk yang berdekatan</td>
</tr>
</tbody>
</table>
<h2 id="game-browser-sukses-dan-hal-yang-dibuktikannya" tabindex="-1">Game Browser Sukses dan Hal yang Dibuktikannya <a class="header-anchor" href="#game-browser-sukses-dan-hal-yang-dibuktikannya" aria-label="Permalink to &quot;Game Browser Sukses dan Hal yang Dibuktikannya&quot;"></a></h2>
<p>Game browser bukanlah pasar khusus. Game browser merupakan salah satu pasar game terbesar. Poki melayani lebih dari 100 juta pemain bulanan. CrazyGames, Newgrounds, dan itch.io melayani jutaan pemain lainnya. Game yang berhasil di browser memiliki pola arsitektur tertentu yang layak dipelajari.</p>
<h3 id="game-3d-browser-yang-tersedia-saat-ini" tabindex="-1">Game 3D Browser yang Tersedia Saat Ini <a class="header-anchor" href="#game-3d-browser-yang-tersedia-saat-ini" aria-label="Permalink to &quot;Game 3D Browser yang Tersedia Saat Ini&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/lCGlEgKAMbE" title="Gameplay Hordes.io" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Hordes.io: lebih dari 200 pemain dalam MMO browser 3D persisten. WebGL kustom, gaya low-poly, dimuat dalam waktu kurang dari 5 detik. Dibuat oleh satu pengembang.</div>
**Hordes.io** adalah MMO browser yang paling relevan. Dibuat oleh pengembang solo menggunakan rendering WebGL kustom, game ini menempatkan lebih dari 200 pemain dalam dunia 3D persisten dengan pertarungan waktu nyata, guild, kelas, dan PvP. Seluruh game dimuat dalam waktu kurang dari 5 detik. Dunianya dibagi menjadi beberapa zona dengan culling agresif. Model pemainnya sederhana (low-poly dengan flat shading), tetapi efek partikel dan animasinya membuat pertarungan terasa responsif. Hordes.io membuktikan tiga hal: MMO browser dapat menangani ratusan pemain serentak dalam satu scene, pengembang solo dapat membuatnya, dan grafis bergaya memiliki performa lebih baik daripada grafis realistis di browser.
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/559m0bR1fgg" title="Gameplay dan Editor Peta Krunker.io" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Krunker.io: 10 juta pemain bulanan, dibuat dengan Three.js, dilengkapi editor peta lengkap di dalam browser dan marketplace konten buatan pengguna.</div>
<p><strong>Krunker.io</strong> pernah mencapai lebih dari 10 juta pemain bulanan dan kemudian diakuisisi oleh FRVR. Ini adalah FPS berbasis browser dengan editor peta lengkap, mode permainan kustom, konten buatan pengguna, dan marketplace. Dibuat dengan Three.js, game ini berjalan pada 60fps+ bahkan di perangkat kelas bawah berkat gaya visual kotak-kotak dan optimasi agresif. Editor levelnya sangat relevan. Pemain membuat peta menggunakan sistem blok mirip voxel, membagikannya di marketplace, lalu pemain lain memainkannya. Ini adalah siklus dunia kreator dalam skala kecil: buat sesuatu, bagikan, lalu biarkan orang lain mengalaminya. Krunker membuktikan bahwa konten 3D buatan pengguna dapat berfungsi di browser jika alat pembuatannya cukup sederhana.</p>
<p><strong>ev.io</strong> adalah FPS browser yang dibuat dengan Babylon.js. Game ini berjalan baik di sebagian besar perangkat, mendukung peta kustom, dan menunjukkan bahwa renderer WebGL milik Babylon dapat menangani aksi 3D bertempo cepat di tab browser. Game ini menggunakan kompresi tekstur agresif dan lingkungan low-poly agar tetap sesuai dengan batas anggaran performa.</p>
<p><strong>Shell Shockers</strong> (lebih dari 5 juta pemain bulanan) adalah shooter multipemain 3D tempat Anda bermain sebagai telur. Dibuat dengan Three.js, game ini menangani multipemain waktu nyata dengan deteksi tembakan yang responsif di browser. Gaya visual kartunnya menjaga kebutuhan aset tetap minimal sekaligus tetap terlihat rapi.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/QtVkteAS15M" title="Trailer Townscaper" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Townscaper: klik untuk menempatkan bangunan, lalu sistem secara otomatis menghasilkan jalan, lengkungan, dan tangga. Tanpa menu, tanpa tujuan. Terjual lebih dari 1 juta kopi berkat kegembiraan berkreasi semata.</div>
<p><strong>Townscaper</strong> bukanlah game browser, tetapi pendekatannya terhadap pembangunan dunia sangat relevan. Pemain mengeklik untuk menempatkan bangunan di atas permukaan air. Game ini secara otomatis menghasilkan detail arsitektur, jalan, lengkungan, dan tangga berdasarkan pola penempatan. Tanpa menu, tanpa pengaturan, tanpa tujuan. Cukup klik dan bangun. Game ini terjual lebih dari 1 juta kopi. Pelajarannya: terkadang alat kreasi yang paling sederhana menghasilkan pengalaman yang paling menarik. Jika kita dapat membuat penempatan objek di dunia terasa selangsung Townscaper, kreator akan menghabiskan waktu berjam-jam untuk membangun.</p>
<p><strong>Pengalaman A-Frame / 8th Wall.</strong> A-Frame (dibuat dengan Three.js) mendukung ribuan pengalaman 3D berbasis web. 8th Wall, platform WebAR veteran yang diakuisisi Niantic, menunjukkan bahwa AR kompleks berbasis kamera dapat berjalan di browser seluler tanpa plugin, meskipun Niantic mengumumkan pada akhir 2025 bahwa layanan tersebut sedang dihentikan secara bertahap (pengalaman yang di-host akan tetap aktif hingga 2027). Ini bukan game, tetapi semuanya menunjukkan bahwa rendering 3D kompleks dengan fisika dan interaksi dapat berjalan di tab browser tanpa plugin. Banyak dari pengalaman ini dimuat dalam 2–3 detik dan berjalan di ponsel kelas menengah.</p>
<h3 id="vuntra-city-laboratorium-kota-prosedural-aktif" tabindex="-1">Vuntra City: Laboratorium Kota Prosedural Aktif <a class="header-anchor" href="#vuntra-city-laboratorium-kota-prosedural-aktif" aria-label="Permalink to &quot;Vuntra City: Laboratorium Kota Prosedural Aktif&quot;"></a></h3>
<p>Vuntra City adalah proyek native UE5, bukan game browser, sehingga bukan tolok ukur performa langsung untuk stack kita. Meski demikian, ini tetap menjadi salah satu studi kasus publik yang paling berguna bagi arsitektur dunia terbuka kita karena devlog-nya menjelaskan secara sangat spesifik kompromi desain sistem di bawah tekanan produksi nyata.</p>
<p>Salah satu pelajaran kuatnya adalah kebijakan detail yang mempertimbangkan kecepatan. Dalam video transportasi dan optimasi, pergerakan berkecepatan tinggi dialihkan ke atas atap, sementara detail dunia dikurangi seiring meningkatnya kecepatan agar pengelola streaming tidak kewalahan oleh pergantian interior (<a href="https://www.youtube.com/watch?v=KKeBElJS6-M" target="_blank" rel="noreferrer">transportasi cepat</a>, <a href="https://www.youtube.com/watch?v=aPuYXyJet38" target="_blank" rel="noreferrer">teknik optimasi</a>). Ini sangat sesuai dengan rencana browser kita, di mana kecepatan harus secara langsung mengontrol radius prefetch, jangkauan aktivasi interior, dan anggaran spawn per frame.</p>
<p>Pelajaran lainnya adalah pemisahan tegas antara data topologi dan objek yang dirender. Implementasi peta dan alamat menggunakan pengontrol topologi global yang dapat menjawab kueri lokasi dan alamat untuk wilayah yang belum dimuat (<a href="https://www.youtube.com/watch?v=6dLn1GQpu2c" target="_blank" rel="noreferrer">peta dan alamat</a>). Inilah pola yang kita perlukan untuk routing otoritatif server, pencarian POI, dan kueri tingkat dunia yang tidak boleh bergantung pada apa yang sedang dimiliki satu klien di memori.</p>
<p>Pengerjaan NPC-nya juga sangat relevan. Sistem sejuta NPC menghitung status jadwal kasar secara global, lalu hanya menyimulasikan perilaku mahal di ruang yang berdekatan dengan pemain (<a href="https://www.youtube.com/watch?v=nBV0yAAJUf0" target="_blank" rel="noreferrer">sejuta NPC persisten</a>, <a href="https://www.youtube.com/watch?v=eUi7DB1ar3s" target="_blank" rel="noreferrer">di balik layar</a>). Bagi kita, hal ini memperkuat model simulasi dua tingkat: status medan jauh yang murah dan deterministik, serta perilaku medan dekat yang kaya di dalam AOI.</p>
<p>Terakhir, desain lingkungan Vuntra City menegaskan sesuatu yang mudah dilupakan dalam perencanaan teknis: desain distribusi adalah desain konten. Proyek ini menghindari penempatan acak yang seragam, menggunakan pencilan berbobot untuk menghasilkan kejutan, dan mendorong eksplorasi melalui peta serta alamat diegetik alih-alih penanda minimap yang selalu hadir (<a href="https://www.youtube.com/watch?v=4MZ5-KQW3pc" target="_blank" rel="noreferrer">lingkungan prosedural tidak harus membosankan</a>, <a href="https://www.youtube.com/watch?v=ixR1hqZJlv4" target="_blank" rel="noreferrer">ke tujuan kita, kita tidak akan membutuhkan minimap</a>).</p>
<h3 id="game-browser-yang-menjadi-sangat-besar" tabindex="-1">Game Browser yang Menjadi Sangat Besar <a class="header-anchor" href="#game-browser-yang-menjadi-sangat-besar" aria-label="Permalink to &quot;Game Browser yang Menjadi Sangat Besar&quot;"></a></h3>
<p><strong>Agar.io</strong> (2015) membuktikan bahwa multipemain browser dapat menjangkau jutaan orang. Pada puncaknya, game ini memiliki lebih dari 100.000 pemain serentak di berbagai server. Game ini berbentuk 2D dan secara mekanis sederhana (tumbuh dengan menyerap sel yang lebih kecil), tetapi arsitektur jaringannya menangani konkurensi masif melalui partisi spasial. Setiap server menjalankan satu wilayah dunia game. Pemain hanya menerima pembaruan tentang entitas yang berada dalam pandangan mereka. Ini adalah pola pengelolaan relevansi yang sama dengan yang dibutuhkan dunia terbuka 3D, hanya saja dalam 2D.</p>
<p><strong>Slither.io</strong> mengembangkan keberhasilan Agar.io dan membuktikan bahwa model tersebut dapat diskalakan. Pada puncaknya, game ini memiliki 67 juta pengguna aktif bulanan. Game ini menggunakan WebSocket untuk sinkronisasi posisi waktu nyata dan partisi spasial guna membatasi lalu lintas jaringan. Satu detail yang patut diperhatikan: deteksi tabrakan sisi server Slither.io berjalan pada tick rate yang lebih rendah untuk pemain jauh (5 Hz) dibandingkan pemain di sekitar (30 Hz). Tick rate variabel berdasarkan jarak ini dapat diterapkan pada dunia terbuka 3D.</p>
<p><strong>Surviv.io</strong> adalah battle royale berbasis browser yang mencapai 50 juta pemain bulanan sebelum diakuisisi oleh Kongregate. Game ini menjalankan pertandingan battle royale penuh berisi 80 pemain sepenuhnya di browser, lengkap dengan fisika berjaringan waktu nyata, lingkungan yang dapat dihancurkan, dan pengambilan item. Petanya disusun secara prosedural dari templat bangunan yang telah dirancang sebelumnya, sebuah pola yang dapat kita gunakan untuk struktur yang ditempatkan kreator.</p>
<p><strong>Zombs Royale</strong> menjalankan battle royale 100 pemain di browser dengan waktu muat cepat dan jaringan responsif. Seperti Surviv.io, game ini membuktikan bahwa jumlah pemain besar dalam game browser waktu nyata layak secara komersial, bukan sekadar memungkinkan secara teknis.</p>
<p>Benang merah dari semua game browser sukses ini: semuanya dimuat dengan cepat (kurang dari 5 detik), berfungsi di perangkat apa pun, memiliki gaya visual sederhana tetapi konsisten, dan menggunakan jaringan yang dioptimalkan untuk gameplay spesifiknya (partisi spasial, laju pembaruan variabel, serta culling agresif terhadap status yang jauh).</p>
<h3 id="runescape-mmo-yang-beralih-ke-browser" tabindex="-1">RuneScape: MMO yang Beralih ke Browser <a class="header-anchor" href="#runescape-mmo-yang-beralih-ke-browser" aria-label="Permalink to &quot;RuneScape: MMO yang Beralih ke Browser&quot;"></a></h3>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/YX7VjGC-2q4" title="Trailer Peluncuran Old School RuneScape di Steam" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">RuneScape: MMO lengkap dengan konten selama lebih dari 20 tahun yang berjalan di tab browser. Protokol biner kustom, streaming berbasis tile, 2.000 pemain serentak per server. Bukti bahwa MMO browser berfungsi dalam skala besar.</div>
<p>RuneScape adalah studi kasus terpenting untuk dunia terbuka berbasis browser karena hal ini benar-benar telah dilakukan. Jagex memindahkan seluruh MMO dengan konten selama 20 tahun ke browser.</p>
<p>RuneScape awalnya berjalan sebagai applet Java. Ketika browser menghentikan dukungan Java, Jagex membangun ulang kliennya dalam C++ dan juga merilis klien HTML5/WebGL yang berfungsi penuh. Old School RuneScape (versi retro) kini berjalan sepenuhnya di browser melalui klien yang dikompilasi dengan Emscripten ke WebAssembly. Game ini menangani dunia persisten yang luas, multipemain waktu nyata dengan ratusan pemain per server, ekonomi dengan grand exchange (balai lelang) yang berfungsi, serta 23 skill dengan sistem progresi mendalam.</p>
<p><strong>Detail teknis yang penting:</strong></p>
<ul>
<li>Dunia dibagi menjadi petak peta (wilayah berukuran 64x64 tile). Klien memuat grid wilayah 13x13 di sekitar pemain (104x104 tile terlihat). Wilayah di luar grid ini di-cull sepenuhnya.</li>
<li>Medannya berbasis tile dengan nilai ketinggian di setiap sudut tile. Overlay medan (jalur, tepian air, transisi pantai) menggunakan sistem bentuk dengan 12 varian rotasi untuk setiap bentuk. Ini lebih terbatas daripada heightmap, tetapi sangat ringkas dan cepat untuk di-stream.</li>
<li>Protokol jaringannya berupa biner kustom melalui WebSocket. Setiap jenis paket memiliki struktur yang ditentukan. Pembaruan posisi pemain menggunakan 2 byte untuk koordinat petak peta dan encoding panjang variabel untuk jenis pergerakan. Peristiwa obrolan, perdagangan, dan pertarungan memiliki format biner ringkasnya sendiri. Seluruh protokol sangat dioptimalkan untuk meminimalkan bandwidth.</li>
<li>Rendering objek menggunakan sistem model, tempat server mengirimkan ID model dan klien merender model yang telah di-cache. Sebagian besar model dimuat sekali lalu digunakan kembali. Artinya, dunia di-stream sebagai metadata (model apa ditempatkan di mana), bukan dengan streaming geometri.</li>
<li>Setiap instance server menangani 2.000 pemain serentak di seluruh dunia game. Dunia ini tidak di-shard secara spasial. Satu proses server mengelola semua pemain, semua NPC, dan seluruh logika game pada game tick 600ms. Ini berfungsi karena logika game per tick sederhana: memproses tindakan pemain, memperbarui AI NPC, menyelesaikan pertarungan, dan menyiarkan perubahan status.</li>
</ul>
<p><strong>Yang dibuktikan RuneScape bagi kasus kita:</strong> MMO lengkap dengan status dunia persisten, ribuan pemain, sistem game kompleks, dan ekonomi nyata dapat berjalan di tab browser. Unduhan kliennya berukuran kurang dari 50 MB, dimuat dalam beberapa detik, dan berjalan di laptop. Jika MMO Java berusia 20 tahun dapat melakukan transisi tersebut, dunia browser yang sengaja dirancang untuk platform ini akan memiliki lebih sedikit kendala.</p>
<p><strong>Bagian pendekatan RuneScape yang tidak cocok:</strong> Rendering RuneScape bersifat isometrik dengan kamera tetap, bukan 3D orang pertama/ketiga. Fidelitas visualnya rendah menurut standar modern. Dunianya juga tidak dapat diedit oleh kreator. Namun, arsitektur jaringan, streaming berbasis tile, dan bukti bahwa MMO browser dapat mempertahankan pemain selama puluhan tahun semuanya sangat relevan.</p>
<h3 id="habbo-hotel-ruang-sosial-yang-bertahan-selama-25-tahun" tabindex="-1">Habbo Hotel: Ruang Sosial yang Bertahan Selama 25 Tahun <a class="header-anchor" href="#habbo-hotel-ruang-sosial-yang-bertahan-selama-25-tahun" aria-label="Permalink to &quot;Habbo Hotel: Ruang Sosial yang Bertahan Selama 25 Tahun&quot;"></a></h3>
<p>Habbo Hotel diluncurkan pada tahun 2000 dan masih berjalan hingga sekarang. Ini adalah dunia sosial isometrik 2D tempat pengguna membuat dan mendekorasi ruangan, mengunjungi ruangan milik orang lain, dan bersosialisasi. Pada puncaknya, Habbo memiliki 9 juta pengguna bulanan. Seluruh pengalaman ini berjalan di Flash (kini HTML5 setelah Flash dihentikan).</p>
<p>Habbo penting karena keberhasilannya mempertahankan komunitas kreator dalam waktu lama. Sistem ruangannya pada dasarnya adalah versi 2D dari apa yang sedang kita bangun: pengguna menempatkan objek furnitur pada grid, menyesuaikan tata letak, dan mengundang orang lain untuk berkunjung. Model ekonominya (pengguna membeli furnitur virtual dengan uang sungguhan) telah menghasilkan lebih dari $1 miliar dalam pendapatan sepanjang masa.</p>
<p><strong>Pelajaran dari Habbo:</strong></p>
<ul>
<li>Ruang berbasis ruangan dengan interior buatan pengguna dapat berfungsi sebagai platform sosial selama puluhan tahun jika alat kreasinya sederhana dan fitur sosialnya kuat.</li>
<li>Ekonomi furnitur virtual mempertahankan keterlibatan jangka panjang. Pengguna membeli, memperdagangkan, dan mengoleksi item. Item tersebut tidak memiliki kegunaan gameplay. Semuanya murni untuk ekspresi diri dan status.</li>
<li>Moderasi di ruang sosial memerlukan investasi berkelanjutan. Habbo telah mengalami beberapa krisis moderasi. Penyaringan konten otomatis, moderator manusia, dan pelaporan komunitas merupakan pendekatan minimum yang layak.</li>
<li>Transisi dari Flash ke HTML5 (selesai sekitar 2020–2021) membuktikan bahwa dunia sosial besar dapat memigrasikan teknologi rendering tanpa kehilangan komunitasnya. Pengguna peduli pada ruangan dan teman mereka, bukan teknologi yang mendasarinya.</li>
</ul>
<h3 id="among-us-dan-game-sosial-spasial" tabindex="-1">Among Us dan Game Sosial Spasial <a class="header-anchor" href="#among-us-dan-game-sosial-spasial" aria-label="Permalink to &quot;Among Us dan Game Sosial Spasial&quot;"></a></h3>
<p>Among Us bukanlah dunia terbuka, tetapi kesuksesannya mengungkapkan sesuatu yang penting tentang ruang multipemain: pemain ingin berada di suatu tempat bersama-sama, bukan sekadar berada dalam game yang sama. Mod obrolan berbasis kedekatan spasial yang menjadi viral menunjukkan bahwa berada di ruangan virtual yang sama dengan audio terarah mengubah multipemain dari mekanik game menjadi pengalaman sosial.
Fitur sosial spasial yang meningkatkan kualitas dunia kreator:</p>
<ul>
<li><strong>Obrolan suara berbasis kedekatan</strong> dengan volume yang meredup seiring bertambahnya jarak. Dekati seseorang untuk berbicara. Menjauhlah dan suaranya akan memudar. Ini menciptakan kelompok sosial alami tanpa memerlukan pengelolaan saluran suara.</li>
<li><strong>Sistem emote dan gestur</strong> memungkinkan pemain mengekspresikan diri tanpa suara. Lambaian tangan, tarian, gestur menunjuk. Fitur-fitur ini murah untuk diimplementasikan (animasi pada avatar pemain) dan meningkatkan interaksi sosial secara tidak proporsional.</li>
<li><strong>Aktivitas bersama</strong> yang berlangsung di dalam dunia (bukan melalui menu) mengubah sebuah ruang menjadi tempat berkegiatan. Jika dua kreator dapat duduk di meja virtual dan melihat model 3D bersama-sama, dunia tersebut memiliki alasan untuk hadir selain sekadar menampilkan konten statis.</li>
</ul>
<h3 id="game-browser-yang-berhasil-berkembang-di-poki-dan-crazygames" tabindex="-1">Game Browser yang Berhasil Berkembang di Poki dan CrazyGames <a class="header-anchor" href="#game-browser-yang-berhasil-berkembang-di-poki-dan-crazygames" aria-label="Permalink to &quot;Game Browser yang Berhasil Berkembang di Poki dan CrazyGames&quot;"></a></h3>
<p>Poki dan CrazyGames secara kolektif melayani lebih dari 150 juta pemain setiap bulan. Game yang berkinerja terbaik di platform-platform ini memberikan wawasan tentang hal-hal yang secara khusus berhasil di browser.</p>
<p><strong>Pola berkinerja terbaik di portal game browser:</strong></p>
<ul>
<li>Dapat langsung dimainkan (kurang dari 3 detik hingga interaktif). Tidak perlu masuk akun. Tidak perlu tutorial. Game harus dapat dipahami dalam waktu 5 detik setelah halaman dibuka.</li>
<li>Durasi sesi yang fleksibel. Pemain dapat bergabung selama 2 menit atau 2 jam. Game mengakomodasi keduanya. Untuk dunia kreator, ini berarti dunia harus dapat dijelajahi tanpa komitmen terhadap suatu sesi. Berjalan-jalan, melihat hal-hal menarik, lalu pergi. Atau tetap tinggal dan membangun selama berjam-jam.</li>
<li>Kompatibilitas seluler. Lebih dari 60% lalu lintas Poki berasal dari perangkat seluler. Dunia browser yang hanya berfungsi di desktop akan kehilangan mayoritas calon pengunjung.</li>
<li>Fitur sosial yang tidak mengharuskan pemain memiliki teman. Papan peringkat, reaksi terhadap konten pemain lain, dan fitur asinkron (melihat apa yang dibangun pemain lain tanpa harus online pada waktu yang sama).</li>
</ul>
<p>Game 3D paling sukses di portal-portal ini (seperti Shell Shockers, 1v1.LOL, dan Smash Karts) mempertahankan jumlah poligon yang rendah, tekstur yang sederhana, dan laju bingkai yang tinggi. Game-game tersebut membuktikan bahwa pemain menerima grafis sederhana jika pengalamannya mulus dan responsif.</p>
<h3 id="platform-kreator-berbasis-browser" tabindex="-1">Platform Kreator Berbasis Browser <a class="header-anchor" href="#platform-kreator-berbasis-browser" aria-label="Permalink to &quot;Platform Kreator Berbasis Browser&quot;"></a></h3>
<p><strong>Hubs dari Mozilla (kini dikelola komunitas).</strong> Ruang 3D multipengguna di browser yang dibangun menggunakan Three.js dan A-Frame. Mendukung obrolan suara, avatar, dan objek bersama. Bukan dunia terbuka (berbasis ruangan), tetapi arsitektur jaringan dan rendering-nya relevan. Mozilla menjadikannya sumber terbuka sebelum menghentikan layanan hosting-nya, sehingga seluruh basis kode tersedia untuk dipelajari. <a href="https://github.com/mozilla/hubs" target="_blank" rel="noreferrer">GitHub</a>.</p>
<p><strong>Hyperfy.</strong> Platform metaverse berbasis web yang berjalan sepenuhnya di browser. Menawarkan rendering Three.js, multipemain, kustomisasi avatar, dan pembangunan dunia. Lebih mendekati target kita daripada Hubs karena menekankan alat kreator. Dunia dimuat di tab browser tanpa perlu mengunduh apa pun. <a href="https://hyperfy.io" target="_blank" rel="noreferrer">hyperfy.io</a>.</p>
<p><strong>Ethereal Engine (sebelumnya XREngine).</strong> Mesin sumber terbuka untuk dunia multipengguna yang dibangun menggunakan Three.js dan bitECS. Mendukung WebXR, audio spasial, dan penyuntingan dunia. Memiliki arsitektur ECS, lapisan jaringan, dan alat editor bawaan. Ini adalah proyek sumber terbuka yang paling mendekati hal yang sedang kita gambarkan. Layak dipelajari untuk melihat cara mereka mengintegrasikan bitECS dengan Three.js dalam pengelolaan entitas serta cara jaringan mereka menangani status spasial. <a href="https://github.com/EtherealEngine/etherealengine" target="_blank" rel="noreferrer">GitHub</a>.</p>
<p><strong>Dusk (sebelumnya Rune).</strong> SDK game multipemain untuk game web. Menangani lapisan jaringan sehingga pengembang dapat berfokus pada gameplay. Pendekatan sinkronisasi statusnya menggunakan status terprediksi dengan rekonsiliasi server, yang merupakan model standar untuk multipemain yang responsif. SDK ini menyembunyikan kompleksitas netcode rollback. Layak dipelajari dari sisi pengalaman pengembangnya.</p>
<p><strong>Niantic Studio.</strong> Editor visual berbasis browser dan mesin game web (penerus perangkat 8th Wall) untuk membangun pengalaman 3D dan XR yang dapat dikunjungi orang lain melalui browser. Platform ini menunjukkan bahwa kreator nonteknis dapat membangun adegan 3D di browser jika alatnya mudah digunakan. (Niantic memisahkan pekerjaan geospasialnya menjadi Niantic Spatial dan menjual bisnis gamenya, termasuk Pokemon GO, kepada Scopely pada 2025.)</p>
<p><strong>PlayCanvas Editor.</strong> Bukan game, tetapi editor 3D berbasis cloud milik PlayCanvas menunjukkan bahwa alat pembangunan dunia kolaboratif dapat berjalan di browser. Beberapa anggota tim dapat menyunting adegan yang sama secara bersamaan. Editor menyampaikan perubahan melalui lapisan sinkronisasi waktu nyata. Inilah model kreasi kolaboratif yang kita perlukan, tetapi dengan dunia kita sebagai kanvas, bukan editor game.</p>
<h3 id="platform-kreator-native-pelajaran-untuk-browser" tabindex="-1">Platform Kreator Native (Pelajaran untuk Browser) <a class="header-anchor" href="#platform-kreator-native-pelajaran-untuk-browser" aria-label="Permalink to &quot;Platform Kreator Native (Pelajaran untuk Browser)&quot;"></a></h3>
<p>Platform-platform ini berjalan sebagai aplikasi native, tetapi keputusan desainnya mengenai alat kreator, persistensi dunia, dan dinamika sosial dapat diterapkan secara langsung.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/mUgtVhbSiNM" title="Platform Kreator Roblox" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Roblox: lebih dari 80 juta pengguna harian, $740 juta dibayarkan kepada kreator pada 2023. Kreasi dilakukan di dalam mesin. Penemuan konten bersifat sosial. Model bisnis yang membuktikan bahwa platform kreator dapat menopang dirinya sendiri.</div>
<p><strong>Roblox</strong> adalah referensi terpenting untuk sebuah dunia kreator. Lebih dari 80 juta pengguna aktif harian. Kreator membangun pengalaman 3D lengkap (game, ruang sosial, toko) yang dikunjungi pemain lain. Platform ini menangani hosting, jaringan, penemuan konten, dan monetisasi.</p>
<p>Hal-hal yang dilakukan Roblox dengan benar:</p>
<ul>
<li><strong>Kreasi dilakukan di dalam mesin.</strong> Roblox Studio adalah lingkungan yang sama dengan yang dialami pemain. Kreator dapat langsung menguji karya mereka. Tidak ada siklus ekspor/unggah/tunggu. Untuk dunia browser, editornya harus berupa dunia itu sendiri.</li>
<li><strong>Scripting mudah diakses.</strong> Lua (bahasa scripting Roblox) cukup sederhana untuk dipelajari anak-anak. Perilaku kompleks dimungkinkan, tetapi tidak wajib. Hambatan awalnya rendah dan batas kemampuannya tinggi.</li>
<li><strong>Penemuan konten bersifat sosial.</strong> Anda menemukan pengalaman karena teman sedang memainkannya. Halaman beranda menampilkan pengalaman yang sedang tren. Untuk dunia browser, dunia itu sendiri adalah sarana penemuan. Anda menjelajah dan menemukan berbagai hal dengan berjalan-jalan.</li>
<li><strong>Monetisasi berhasil.</strong> Kreator memperoleh uang sungguhan (Roblox membayarkan $740 juta kepada kreator pada 2023). Ini menarik upaya kreatif yang serius. Tanpa insentif ekonomi, platform kreator berubah menjadi proyek hobi yang perlahan ditinggalkan.</li>
<li><strong>Mesin rendering Roblox dibuat khusus</strong> dan berjalan di aplikasi native, bukan browser. Namun, anggaran aset per pengalaman tergolong sederhana menurut standar modern (maksimum yang direkomendasikan adalah 100 MB). Sebagian besar pengalaman Roblox yang sukses menggunakan seni low-poly bergaya, yang selaras dengan keterbatasan rendering browser.</li>
</ul>
<p><strong>Fortnite Creative / UEFN (Unreal Editor for Fortnite).</strong> Epic menghadirkan editor lengkap Unreal Engine bagi kreator Fortnite. Hasilnya adalah platform tempat orang membangun pulau (dunia mandiri) menggunakan alat kelas profesional. Fortnite menangani hosting, multipemain, dan distribusi.</p>
<p>Wawasan yang relevan:</p>
<ul>
<li><strong>Alat profesional menarik konten profesional.</strong> UEFN menghasilkan pengalaman visual yang memukau karena kreator memiliki akses ke seluruh kemampuan UE5. Konsekuensinya adalah kompleksitas. UEFN memiliki kurva pembelajaran yang curam.</li>
<li><strong>Instancing berbasis pulau</strong> (setiap kreasi merupakan dunia terpisah) menghindari masalah moderasi dan konflik yang muncul dalam satu dunia bersama. Namun, ini juga berarti kreator tidak menemukan karya satu sama lain secara alami melalui penjelajahan. Anda mengunjungi pulau melalui menu, bukan dengan berjalan kaki.</li>
<li><strong>Model bisnisnya berhasil.</strong> Program kreator Fortnite membayar berdasarkan interaksi. Kreator teratas menghasilkan jutaan dolar per tahun. Sekali lagi, insentif ekonomi mendorong kualitas.</li>
</ul>
<p><strong>Dreams (Media Molecule / PlayStation).</strong> Dreams memberi pemain konsol rangkaian alat kreasi 3D lengkap (pemodelan, animasi, musik, logika, desain level) serta platform untuk membagikan kreasi. Dalam hal kedalaman alat, ini adalah platform kreator paling ambisius yang pernah dibuat.</p>
<p>Wawasan yang relevan:</p>
<ul>
<li><strong>Pemodelan berbasis pahatan</strong>, bukan penyuntingan poligon. Kreator membentuk volume lunak menggunakan alat pindah/pegang/haluskan, mirip ZBrush tetapi lebih intuitif. Kurva pembelajarannya landai. Pendekatan ini sangat cocok untuk kreasi di browser karena tidak mengharuskan pengguna memahami vertex dan peta UV.</li>
<li><strong>Semuanya merupakan aset bersama.</strong> Jika seseorang membuat model pohon, siapa pun dapat menggunakannya dalam kreasi mereka sendiri (dengan atribusi). Ini menciptakan ekosistem kreatif majemuk, tempat setiap kreasi menambah nilai platform.</li>
<li><strong>Dreams kesulitan secara komersial</strong> meskipun mendapat pujian kritis. Masalahnya adalah distribusi: platform ini terbatas pada PlayStation, dan alat kreasinya begitu mendalam sehingga kebanyakan pemain tidak pernah beranjak dari sekadar mengonsumsi konten. Pelajarannya: alat kreasi harus cukup sederhana agar mayoritas pengguna mau mencobanya, meskipun hanya sebagian kecil yang menjadi pembangun serius.</li>
</ul>
<p><strong>Core (Manticore Games).</strong> Platform gratis untuk membuat dan memainkan game multipemain, dibangun menggunakan Unreal Engine dengan editor yang disederhanakan. Editor Core berjalan sebagai aplikasi native, tetapi filosofinya relevan. Templat dan skrip bersama dari komunitas memungkinkan pemula merakit game dari komponen siap pakai. Kreator tingkat lanjut dapat menulis skrip Lua untuk perilaku khusus. Core kesulitan menjangkau audiens besar, salah satunya karena game harus dimainkan melalui peluncur Core. Versi berbasis browser tidak akan mengalami hambatan ini.</p>
<p><strong>VRChat</strong> dan <strong>Rec Room</strong> adalah platform sosial tempat kreator membangun ruang yang dikunjungi orang lain. VRChat menggunakan Unity dan berjalan di PC/VR. Rec Room berjalan di semua perangkat, termasuk seluler. Keduanya membuktikan bahwa dunia 3D buatan pengguna dapat mempertahankan komunitas besar. VRChat lebih mengesankan secara teknis (shader khusus, avatar kompleks). Rec Room lebih mudah diakses (alat kreasi dalam aplikasi, grafis lebih sederhana, dukungan platform lebih luas). Untuk dunia browser, pendekatan Rec Room berupa alat kreasi sederhana dalam aplikasi lebih dapat diterapkan daripada alur kerja VRChat yang mengandalkan alat eksternal.</p>
<div class="video-embed">
<iframe src="https://www.youtube.com/embed/E5HCeVCjCXo" title="Second Life: Dunia Anda, Imajinasi Anda" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="game-caption">Second Life: diluncurkan pada 2003, masih beroperasi dengan lebih dari 200 ribu pengguna harian. Sepenuhnya dibuat oleh pengguna. Kepemilikan berbasis persil, ekonomi virtual bernilai sekitar $500 juta per tahun. Pelajaran selama 20 tahun tentang persistensi dan moderasi.</div>
<p><strong>Second Life</strong> adalah pelopor dari semua dunia kreator. Diluncurkan pada 2003, platform ini masih beroperasi dengan lebih dari 200.000 pengguna aktif harian. Seluruh dunianya dibuat oleh pengguna. Lahan dimiliki dan diperdagangkan. Kreator menjual objek, pakaian, dan bangunan. Bahasa scripting dalam dunianya (LSL) memungkinkan konten interaktif.</p>
<p>Hal-hal yang diajarkan Second Life setelah lebih dari 20 tahun:</p>
<ul>
<li><strong>Persistensi lebih penting daripada grafis.</strong> Visual Second Life sudah ketinggalan zaman, tetapi dunianya tetap bertahan. Kreasi tetap berada di tempat Anda meletakkannya. Hubungan dan sejarah terus terakumulasi. Persistensi inilah yang membuat orang terus kembali.</li>
<li><strong>Ekonomi mendorong kreasi.</strong> PDB Second Life diperkirakan mencapai $500 juta per tahun. Kreator membangun karena mereka dapat menjual hasilnya. Tanpa insentif ekonomi, volume dan kualitas konten kreator akan menurun.</li>
<li><strong>Konten buatan pengguna memerlukan infrastruktur moderasi.</strong> Second Life telah menghadapi tantangan moderasi selama 20 tahun. Platform apa pun yang memungkinkan pengguna menempatkan konten arbitrer di ruang bersama memerlukan pemindaian otomatis, alat pelaporan, dan peninjauan manusia.</li>
<li><strong>Organisasi spasial berbasis lahan berhasil.</strong> Second Life membagi dunianya menjadi persil yang dimiliki pengguna. Setiap persil memiliki batas prim (objek). Ini secara alami mencegah satu kreator menghabiskan seluruh sumber daya. Untuk dunia browser, pola yang setara adalah kepemilikan berbasis chunk dengan anggaran objek per chunk.</li>
</ul>
<h2 id="analisis-perbandingan-hal-yang-diajarkan-setiap-game-kepada-kita" tabindex="-1">Analisis Perbandingan: Hal yang Diajarkan Setiap Game kepada Kita <a class="header-anchor" href="#analisis-perbandingan-hal-yang-diajarkan-setiap-game-kepada-kita" aria-label="Permalink to &quot;Analisis Perbandingan: Hal yang Diajarkan Setiap Game kepada Kita&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Game</th>
<th>Pelajaran Utama</th>
<th>Teknologi yang Dapat Diterapkan</th>
<th>Risiko Jika Diabaikan</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Skyrim</strong></td>
<td>Streaming berbasis chunk dengan kisi sel</td>
<td>Medan heightmap, tingkatan LOD, pemisahan interior/eksterior</td>
<td>Dunia tidak muat dalam memori browser</td>
</tr>
<tr>
<td><strong>The Witcher 3</strong></td>
<td>Komposisi dunia berlapis oleh tim-tim terpisah</td>
<td>Streaming sadar konten, rendering impostor</td>
<td>Kreator tidak dapat bekerja secara independen</td>
</tr>
<tr>
<td><strong>Breath of the Wild</strong></td>
<td>Aturan sistemik lebih unggul daripada konten berskrip</td>
<td>Sistem interaksi material, gameplay berbasis fisika</td>
<td>Dunia terasa statis dan mati</td>
</tr>
<tr>
<td><strong>GTA V</strong></td>
<td>Kehidupan sekitar membuat dunia terasa nyata</td>
<td>Sistem perilaku NPC, lalu lintas, waktu dalam sehari</td>
<td>Dunia kreator terasa seperti museum kosong</td>
</tr>
<tr>
<td><strong>Elden Ring</strong></td>
<td>Variasi kepadatan dan penggunaan ulang aset</td>
<td>Pustaka aset modular, zona renggang + padat</td>
<td>Terlalu kosong atau terlalu mahal untuk diisi</td>
</tr>
<tr>
<td><strong>No Man's Sky</strong></td>
<td>Generasi prosedural untuk kanvas, konten kreator untuk jiwanya</td>
<td>Medan berbasis seed, model data markas yang ringkas</td>
<td>Medan tanpa batas tetapi membosankan</td>
</tr>
<tr>
<td><strong>Minecraft</strong></td>
<td>Dunia yang sepenuhnya dapat diedit, alat sederhana, kedalaman tanpa batas</td>
<td>Streaming chunk, kompresi palet, protokol pengeditan blok</td>
<td>Kreator tidak dapat membentuk ulang dunia itu sendiri</td>
</tr>
<tr>
<td><strong>Roblox</strong></td>
<td>Pembuatan berlangsung di dalam engine, ekonomi mendorong kualitas</td>
<td>Editor dalam dunia, monetisasi kreator</td>
<td>Tidak ada yang membangun karena tidak ada alasannya</td>
</tr>
<tr>
<td><strong>Krunker.io</strong></td>
<td>UGC browser dapat berjalan dalam skala besar dengan alat sederhana</td>
<td>Rendering Three.js, editor berbasis voxel, marketplace</td>
<td>Alat pembuatan terlalu rumit bagi kreator kasual</td>
</tr>
<tr>
<td><strong>Hordes.io</strong></td>
<td>200+ pemain dalam 3D di browser, layak dikembangkan oleh satu orang</td>
<td>WebGL kustom, spatial culling, gaya visual stilistis</td>
<td>Merekayasa lapisan multipemain secara berlebihan</td>
</tr>
<tr>
<td><strong>Vuntra City (referensi native)</strong></td>
<td>Streaming sadar kecepatan dan simulasi dunia dua tingkat menjaga kota prosedural yang sangat luas tetap koheren</td>
<td>Kebijakan LOD yang digabungkan dengan kecepatan, lapisan kueri topologi, simulasi jadwal medan jauh + perilaku medan dekat</td>
<td>Pergerakan berkecepatan tinggi menyebabkan pop-in dan lonjakan simulasi</td>
</tr>
<tr>
<td><strong>Agar.io / Slither.io</strong></td>
<td>Partisi spasial memungkinkan konkurensi masif</td>
<td>Tick rate yang berubah berdasarkan jarak, pengelolaan area relevansi</td>
<td>Jaringan kolaps pada skala besar</td>
</tr>
<tr>
<td><strong>Second Life</strong></td>
<td>Persistensi dan ekonomi menopang komunitas selama 20 tahun</td>
<td>Kepemilikan berbasis persil, anggaran objek, marketplace</td>
<td>Tidak ada retensi jangka panjang</td>
</tr>
<tr>
<td><strong>Dreams</strong></td>
<td>Pembuatan berbasis pahatan lebih intuitif daripada pengeditan poligon</td>
<td>Pemodelan berbasis volume, pustaka aset bersama</td>
<td>Alat pembuatan terasa seperti program CAD</td>
</tr>
<tr>
<td><strong>Fortnite Creative</strong></td>
<td>Alat profesional menarik konten profesional</td>
<td>Kemampuan editor lengkap di dalam platform</td>
<td>Batas atas kualitas konten terlalu rendah</td>
</tr>
<tr>
<td><strong>RuneScape</strong></td>
<td>MMO lengkap berjalan di browser melalui Wasm dan protokol biner</td>
<td>Emscripten, protokol WebSocket biner kustom, streaming tile</td>
<td>Meremehkan kemampuan browser</td>
</tr>
<tr>
<td><strong>Habbo Hotel</strong></td>
<td>Pembuatan ruangan sederhana menopang komunitas selama 25 tahun</td>
<td>Penempatan berbasis kisi, ekonomi furnitur virtual</td>
<td>Membuat alat pembuatan terlalu rumit</td>
</tr>
</tbody>
</table>
<p>Game yang paling penting untuk kasus khusus kita (berbasis browser, berfokus pada kreator, multipemain) adalah Minecraft (dunia yang dapat diedit, data ringkas), Roblox (pembuatan dalam engine, ekonomi), Krunker (UGC browser dalam skala besar), dan Hordes.io (arsitektur MMO browser). Judul-judul AAA (Skyrim, BotW, Witcher 3) mengajarkan rendering dan streaming. Game browser populer (Agar.io, Slither.io, Surviv.io) mengajarkan jaringan berskala besar. Platform kreator (Roblox, Dreams, Second Life) mengajarkan dinamika komunitas. Vuntra City menambahkan referensi terkini pada tingkat implementasi untuk streaming sadar kecepatan, navigasi diegetik, dan pola simulasi jutaan agen di kota prosedural modern.</p>
<h2 id="seperti-apa-skyrim-dan-the-witcher-jika-dibuat-untuk-browser" tabindex="-1">Seperti Apa Skyrim dan The Witcher Jika Dibuat untuk Browser <a class="header-anchor" href="#seperti-apa-skyrim-dan-the-witcher-jika-dibuat-untuk-browser" aria-label="Permalink to &quot;Seperti Apa Skyrim dan The Witcher Jika Dibuat untuk Browser&quot;"></a></h2>
<p>Mari kita bahas secara konkret. Jika Anda mengambil Whiterun dari Skyrim dan membangunnya ulang untuk disajikan melalui browser:</p>
<p><strong>Medan:</strong> Area di sekitar Whiterun kira-kira berukuran 2 km x 2 km. Dengan ukuran chunk kita (64 m), itu sekitar 32x32 = 1024 chunk. Dengan 2-4 KB untuk heightmap setiap chunk, jumlahnya menjadi 2-4 MB data medan. Tekstur medan (rumput, tanah, batu, salju) sebagai tile atlas KTX2 mungkin menambah 5 MB lagi. Total medan: kurang dari 10 MB untuk seluruh wilayah.</p>
<p><strong>Struktur:</strong> Whiterun sendiri mungkin memiliki 40-50 bangunan. Setiap bangunan dalam bentuk GLB yang dioptimalkan (3 tingkat LOD) mungkin berukuran 200-500 KB pada detail tertinggi. Namun, Anda hanya memerlukan detail penuh untuk 5-10 bangunan terdekat. Sisanya menggunakan LOD sedang atau rendah (masing-masing 50-100 KB). Total struktur yang terlihat pada satu waktu: 2-5 MB.</p>
<p><strong>Vegetasi:</strong> Pohon dan rumput Skyrim di sekitar Whiterun semuanya dirender sebagai instance. Anda mungkin memerlukan 10 model pohon unik (masing-masing 200 KB pada LOD penuh, 20 KB sebagai impostor billboard) dan sistem rumput yang menghasilkan bilah-bilah rumput dari peta kepadatan di GPU. Total aset vegetasi: 2-3 MB. Data instancing (posisi, rotasi, skala) untuk area chunk 5x5: kurang dari 500 KB.</p>
<p><strong>NPC:</strong> Whiterun memiliki sekitar 70 NPC bernama beserta para penjaga. Setiap avatar dengan kualitas sedang: 100-200 KB. Namun, hanya 10-20 yang terlihat pada satu waktu. Total data rendering NPC: 2-4 MB.</p>
<p><strong>Total keseluruhan untuk area seukuran Whiterun yang terlihat pada satu waktu: 15-25 MB.</strong> Itu sangat layak dijalankan di browser. Pemuatan awal akan menampilkan medan dan struktur utama dalam 3-5 detik melalui koneksi broadband, lalu detail akan terisi selama beberapa detik berikutnya.</p>
<p>Novigrad dalam The Witcher 3 lebih luas dan padat, tetapi prinsip yang sama tetap berlaku. Anda akan membutuhkan LOD dan streaming yang lebih agresif, tetapi total data yang terlihat pada satu waktu tetap berada dalam batas memori browser.</p>
<h2 id="yang-akan-kita-bangun-terlebih-dahulu" tabindex="-1">Yang Akan Kita Bangun Terlebih Dahulu <a class="header-anchor" href="#yang-akan-kita-bangun-terlebih-dahulu" aria-label="Permalink to &quot;Yang Akan Kita Bangun Terlebih Dahulu&quot;"></a></h2>
<p>Dunia terbuka penuh adalah proyek bertahun-tahun. Berikut jalur untuk menghadirkan sesuatu yang nyata ke tangan kreator dengan cepat:</p>
<p><strong>Fase 1: Pulau Bersama (3 bulan).</strong> Satu chunk medan (pulau berukuran 512x512 m) dengan medan heightmap, air, vegetasi dasar, dan siklus siang/malam. Multipemain melalui Durable Objects (hingga 50 pengguna bersamaan). Kreator dapat menempatkan aset 3D buatan AI dari pustaka Cinevva mereka yang sudah ada. Anggap saja sebagai diorama bersama.</p>
<p><strong>Fase 2: Dunia yang Dapat Diperluas (3 bulan).</strong> Streaming chunk untuk dunia berukuran 4x4 km. Persil milik kreator tempat mereka memiliki izin pengeditan. Sistem LOD untuk medan dan objek. Status dunia yang persisten. Hingga 200 pengguna bersamaan di seluruh dunia.</p>
<p><strong>Fase 3: Dunia yang Hidup (6 bulan).</strong> Pemahatan medan berbantuan AI. Vegetasi dan atmosfer prosedural. Sistem misi/acara agar kreator dapat membangun pengalaman interaktif, bukan sekadar adegan statis. Obrolan suara. Kustomisasi avatar. Dunia ini menjadi destinasi, bukan demo.</p>
<h2 id="pertanyaan-terbuka" tabindex="-1">Pertanyaan Terbuka <a class="header-anchor" href="#pertanyaan-terbuka" aria-label="Permalink to &quot;Pertanyaan Terbuka&quot;"></a></h2>
<p><strong>Gaya visual.</strong> Gaya stilistis (low-poly, cel-shaded) lebih murah untuk dirender dan lebih toleran terhadap aset buatan AI. Gaya realistis memerlukan aset berkualitas lebih tinggi dan anggaran rendering yang lebih besar. Skyrim tetap berhasil meskipun grafisnya sudah menua karena arahan visualnya konsisten. BotW tampak memukau di perangkat kelas tablet karena gaya cel-shaded menyamarkan jumlah poligon yang rendah. Minecraft menggunakan tekstur 16x16 dan merupakan salah satu game yang paling mudah dikenali sepanjang masa. Krunker.io dan Hordes.io sama-sama berhasil dengan grafis stilistis sederhana di browser. Bukti yang ada sangat mendukung arah stilistis untuk dunia browser. Kita perlu memilih identitas visual tertentu sejak awal dan menegakkan konsistensi di seluruh aset buatan AI.</p>
<p><strong>Persistensi dunia vs. instancing.</strong> Apakah semua orang berbagi satu dunia (seperti MMO atau Second Life), atau setiap kreator mendapatkan instance sendiri yang dapat dikunjungi orang lain (seperti server Minecraft atau Fortnite Islands)? Teknologinya mendukung keduanya, tetapi dinamika sosialnya benar-benar berbeda. Dunia persisten bersama milik Second Life menciptakan penemuan tak terduga (Anda menemukan karya orang lain saat berjalan-jalan). Pulau berbasis instance milik Fortnite memerlukan sistem menu atau portal untuk penemuan. Roblox menggunakan pendekatan berbasis hub: game terpisah, tetapi Anda menelusuri dan menemukannya melalui antarmuka bersama. Pendekatan hibrida mungkin berhasil: overworld persisten bersama tempat kreator memiliki persil (seperti persil Second Life), dengan opsi untuk memasuki pengalaman mandiri melalui portal.</p>
<p><strong>Kedalaman alat pembuatan.</strong> Dreams membuktikan bahwa alat pembuatan yang mendalam mengesankan kritikus tetapi mengintimidasi pengguna. Townscaper membuktikan bahwa alat minimal dapat terjual satu juta kopi. Roblox Studio berada di tengah: cukup sederhana untuk anak-anak, cukup mendalam untuk profesional. Editor voxel Krunker bahkan lebih sederhana. Untuk dunia browser, kita sebaiknya memulai dengan kesederhanaan setingkat Townscaper (tempatkan objek, lalu objek tersebut menempel dan terhubung secara otomatis) serta menambahkan kedalaman seiring waktu. Pengalaman awal untuk menempatkan objek pertama Anda di dunia seharusnya memakan waktu kurang dari 30 detik.</p>
<p><strong>Ekonomi.</strong> Roblox, Second Life, dan Fortnite Creative semuanya membuktikan bahwa insentif ekonomi adalah hal yang mengubah mainan menjadi platform. Tanpa cara bagi kreator untuk memperoleh penghasilan dari karya mereka, kreator paling berbakat akan berkarya di tempat lain. Ini tidak harus diluncurkan pada hari pertama, tetapi arsitekturnya harus mendukungnya (kepemilikan objek, pelacakan kunjungan, atribusi kreator).</p>
<p><strong>Perangkat seluler.</strong> WebGPU di perangkat seluler masih membutuhkan waktu bertahun-tahun sebelum dapat diandalkan. Pengalaman seluler perlu berupa versi yang disederhanakan: medan lebih sederhana, objek lebih sedikit, jarak pandang lebih pendek. Pendekatan Rec Room yang berjalan di semua perangkat dengan kualitas adaptif layak dipelajari. Atau kita merilis aplikasi native untuk perangkat seluler dan mempertahankan pengalaman penuh di browser.</p>
<p><strong>Moderasi.</strong> Dunia terbuka tempat siapa pun dapat menempatkan apa pun adalah mimpi buruk moderasi. Second Life telah menangani masalah ini selama 20 tahun. Setiap aset yang ditempatkan memerlukan peninjauan konten otomatis sebelum dapat terlihat oleh orang lain. Ini menambah latensi pada proses kreatif, tetapi tidak dapat ditawar. Kita juga perlu mempertimbangkan klasifikasi konten berbasis persil (seperti sistem General/Moderate/Adult milik Second Life) agar kreator dapat menentukan batas konten mereka.</p>
<p><strong>Interaksi sistemik.</strong> BotW dan Minecraft sama-sama menunjukkan bahwa sistem interaksi berbasis material menciptakan dunia yang jauh lebih menarik secara eksponensial daripada penempatan objek statis. Jika seorang kreator menempatkan jembatan kayu dan kreator lain menyalakan api di dekatnya, apakah jembatan itu harus terbakar? Jika seseorang menempatkan bendungan, apakah air harus menggenang di belakangnya? Interaksi ini membuat dunia terasa hidup, tetapi memerlukan aturan fisika dan material yang konsisten di seluruh konten kreator. Menentukan sejauh mana kita akan menerapkan desain sistemik merupakan keputusan arsitektur awal.</p>
<h2 id="kesimpulan-utama" tabindex="-1">Kesimpulan Utama <a class="header-anchor" href="#kesimpulan-utama" aria-label="Permalink to &quot;Kesimpulan Utama&quot;"></a></h2>
<p>Dunia terbuka 3D di browser sudah layak diwujudkan saat ini. Hordes.io menjalankan 200+ pemain dalam 3D di browser. Krunker.io pernah memiliki 10 juta pemain bulanan dengan editor peta 3D lengkap. Game .io membuktikan bahwa multipemain browser dapat diskalakan hingga jutaan pemain. Teknologinya bukan spekulasi.</p>
<p>Teknologi rendering sudah siap. Three.js dan Babylon.js menangani adegan 3D yang sebanding dengan game AAA awal 2010-an. WebGPU membuka akses ke compute shader untuk medan dan vegetasi. Engine fisika Wasm berjalan dengan performa hanya 2-3 kali lebih lambat daripada native. Area seukuran Whiterun dapat dimuat dalam 15-25 MB data yang terlihat.</p>
<p>Teknologi jaringan sudah siap. Cloudflare Durable Objects menyediakan server otoritatif per chunk di edge. CRDT menangani pengeditan kolaboratif tanpa konflik. Partisi spasial (yang telah dibuktikan oleh berbagai game, dari Agar.io hingga Skyrim) menjaga lalu lintas jaringan tetap terkendali untuk ratusan pemain bersamaan.</p>
<p>Dunia terbuka AAA (Skyrim, Witcher 3, BotW, Elden Ring, Minecraft, No Man's Sky) bukan sekadar tolok ukur grafis. Semua itu adalah buku ajar tentang streaming chunk, pengelolaan LOD, generasi prosedural, desain sistemik, dan komposisi dunia. Setiap teknik yang digunakannya memiliki padanan yang kompatibel dengan browser.</p>
<p>Platform kreator (Roblox, Second Life, Fortnite Creative, Dreams) mengajarkan pelajaran sosial dan ekonomi. Pembuatan harus berlangsung di dalam dunia, bukan di alat eksternal. Insentif ekonomi mendorong kualitas. Persistensi menciptakan keterikatan. Alat sederhana menjangkau lebih banyak kreator daripada alat yang canggih.</p>
<p>Pipeline kreatif adalah keunggulan Cinevva. Kita sudah menghasilkan aset 3D, tekstur, dan audio. Menghubungkan pipeline tersebut ke sistem penempatan dunia adalah bagian yang masih hilang. Konten buatan AI mengisi dunia. Kurasi dan penataan oleh kreator memberinya jiwa.</p>
<p>Hasil akhirnya bukanlah Skyrim di browser. Hasilnya lebih mendekati titik temu antara Minecraft (dunia yang dapat diedit), Roblox (ekonomi kreator), dan BotW (interaksi sistemik), yang berjalan di tab browser dengan alat pembuatan bertenaga AI. Teknologi untuk membangunnya sudah tersedia. Pertanyaannya adalah eksekusi.</p>
<h2 id="makalah-penelitian-dan-referensi-akademis" tabindex="-1">Makalah Penelitian dan Referensi Akademis <a class="header-anchor" href="#makalah-penelitian-dan-referensi-akademis" aria-label="Permalink to &quot;Makalah Penelitian dan Referensi Akademis&quot;"></a></h2>
<p>Teknik dalam panduan ini tidak diciptakan dari nol. Teknik-teknik tersebut berlandaskan penelitian selama puluhan tahun. Berikut makalah yang paling penting untuk setiap subsistem, beserta catatan mengenai penerapannya pada dunia terbuka browser.</p>
<h3 id="generasi-dan-rendering-medan" tabindex="-1">Generasi dan Rendering Medan <a class="header-anchor" href="#generasi-dan-rendering-medan" aria-label="Permalink to &quot;Generasi dan Rendering Medan&quot;"></a></h3>
<p><strong>&quot;Penyintesis Gambar&quot;</strong> -- Ken Perlin (SIGGRAPH 1985). <a href="https://doi.org/10.1145/325165.325247" target="_blank" rel="noreferrer">DOI</a>. Makalah yang memperkenalkan Perlin noise. Setiap generator medan prosedural di setiap game sejak 1985 berakar dari karya ini. Fungsi noise tersebut menghasilkan keacakan halus yang, ketika dilapiskan dalam oktaf (gerak Brown fraksional), menciptakan heightmap yang tampak alami. Simplex noise (Perlin, 2001) adalah penerusnya yang lebih cepat. Untuk pipeline medan kita, inilah fondasinya: generasi heightmap berbasis noise berjalan dalam compute shader WebGPU dengan kecepatan interaktif.</p>
<p><strong>&quot;Pemberian Tekstur dan Pemodelan: Pendekatan Prosedural&quot;</strong> -- Ebert, Musgrave, Peachey, Perlin, Worley (1994, edisi ke-3 2003). Buku ajar tentang generasi prosedural. Bab-bab Musgrave mengenai pemodelan medan, termasuk medan multifraktal dengan fitur menyerupai erosi, menjadi dasar langsung bagi generator medan game modern. Parameter fBm (lacunarity, persistence, jumlah oktaf) yang dijelaskan di sini sama dengan parameter yang akan kita sediakan kepada kreator untuk kustomisasi medan.</p>
<p><strong>&quot;Geometry Clipmaps: Rendering Medan Menggunakan Kisi Reguler Bersarang&quot;</strong> -- Losasso and Hoppe (SIGGRAPH 2004). <a href="https://doi.org/10.1145/1015706.1015799" target="_blank" rel="noreferrer">DOI</a>. Makalah ini memecahkan cara merender medan yang sangat luas pada kecepatan interaktif menggunakan cincin LOD konsentris (clipmap). Mesh medan berupa kumpulan tetap kisi bersarang yang berpusat pada kamera. Saat kamera bergerak, kisi-kisi tersebut bergeser dan diperbarui. Inilah teknik yang direkomendasikan dalam bagian medan kita untuk WebGL 2, dan teknik ini bekerja karena beban kerja GPU tetap konstan terlepas dari ukuran dunia. Implementasi aslinya dibuat sebelum WebGL, tetapi dapat dipetakan langsung ke WebGL.
<strong>&quot;Simulasi dan Visualisasi Erosi Hidraulis Cepat di GPU&quot;</strong> -- Mei, Decaudin, Hu (2007). <a href="https://hal.inria.fr/inria-00402079/document" target="_blank" rel="noreferrer">PDF</a>. Memindahkan erosi hidraulis dari proses luring yang dibatasi CPU menjadi komputasi GPU waktu nyata. Model simulasi air dangkal dalam makalah ini (memperlakukan air sebagai medan ketinggian dan menghitung aliran antar-sel kisi) berjalan dalam compute shader. Untuk pipeline kami, erosi GPU sisi server dapat mengubah medan yang dihasilkan dari noise menjadi lanskap yang masuk akal secara geologis dalam waktu kurang dari satu detik, sehingga medan buatan AI tampak dipahat dengan tangan.</p>
<p><strong>&quot;Rendering Waktu Nyata untuk Planet yang Dibuat Secara Prosedural&quot;</strong> -- Pendekatan hibrida dari presentasi GDC No Man's Sky dan penjelasan Sean Murray. Meski bukan satu makalah tunggal, presentasi GDC 2017 &quot;Membangun Dunia Menggunakan Matematika&quot; oleh Innes McKendrick (Hello Games) menjelaskan bagaimana No Man's Sky menghasilkan medan berskala planet menggunakan fungsi noise bertumpuk, representasi voxel dengan marching cubes, serta pembuatan di sisi GPU. Ini berkaitan langsung dengan pendekatan medan prosedural kami, khususnya untuk menghasilkan fitur medan yang tidak dapat direpresentasikan oleh heightmap (gua, lengkungan).</p>
<p><strong>&quot;C-DBLOD: LOD Hibrida untuk Rendering Medan&quot;</strong> -- Filip Strugar (2014). <a href="https://www.vertexasylum.com/CDLOD/cdlod_latest.pdf" target="_blank" rel="noreferrer">Makalah</a>. Penyempurnaan geometry clipmap yang menambahkan seleksi berbasis quadtree agar adaptivitas di sekitar posisi kamera menjadi lebih baik. Gagasan utamanya: alih-alih menggunakan cincin konsentris tetap, gunakan quadtree untuk memilih patch medan dengan resolusi berbeda-beda. Pendekatan ini menangani medan tidak beraturan (ketika area tertentu memerlukan lebih banyak detail daripada area lainnya) dengan lebih baik daripada clipmap murni. Dapat diimplementasikan di WebGL 2 dengan traversal quadtree kecil di sisi CPU.</p>
<h3 id="gaussian-splatting-3d-dan-rendering-neural" tabindex="-1">Gaussian Splatting 3D dan Rendering Neural <a class="header-anchor" href="#gaussian-splatting-3d-dan-rendering-neural" aria-label="Permalink to &quot;Gaussian Splatting 3D dan Rendering Neural&quot;"></a></h3>
<p><strong>&quot;Gaussian Splatting 3D untuk Rendering Medan Radiansi Waktu Nyata&quot;</strong> -- Kerbl, Kopanas, Leimkühler, Drettakis (SIGGRAPH 2023). <a href="https://repo-sam.inria.fr/fungraph/3d-gaussian-splatting/" target="_blank" rel="noreferrer">Halaman proyek</a>. Makalah yang memicu revolusi Gaussian splatting. Sebuah adegan direpresentasikan sebagai jutaan Gaussian 3D, masing-masing dengan posisi, kovarians (bentuk), opasitas, dan koefisien warna harmonik sferis. Proses rendering mengurutkan splat berdasarkan kedalaman dan merasterisasinya sebagai Gaussian 2D. Pendekatan ini 100–1.000 kali lebih cepat dilatih daripada NeRF dan dapat dirender secara waktu nyata. Tersedia beberapa implementasi WebGL/WebGPU. Untuk platform kami, ini memungkinkan kreator menangkap objek dunia nyata menggunakan foto dari ponsel dan menempatkannya di dunia browser.</p>
<p><strong>&quot;NeRF: Merepresentasikan Adegan sebagai Medan Radiansi Neural untuk Sintesis Sudut Pandang&quot;</strong> -- Mildenhall et al. (ECCV 2020). <a href="https://www.matthewtancik.com/nerf" target="_blank" rel="noreferrer">Halaman proyek</a>. Makalah dasar tentang representasi adegan neural. Jaringan neural memetakan koordinat 3D ke warna dan densitas, sehingga memungkinkan sintesis sudut pandang baru yang fotorealistis dari sekumpulan foto masukan. Meskipun NeRF terlalu mahal untuk dirender secara langsung di browser (memerlukan evaluasi jaringan per piksel), pipeline ekstraksi NeRF-ke-mesh (melatih NeRF, lalu menjalankan marching cubes pada medan densitas) menghasilkan mesh bertekstur berkualitas tinggi dari foto.</p>
<p><strong>&quot;Primitif Grafis Neural Instan dengan Enkode Hash Multiresolusi&quot;</strong> -- Müller, Evans, Schied, Keller (SIGGRAPH 2022). <a href="https://nvlabs.github.io/instant-ngp/" target="_blank" rel="noreferrer">Halaman proyek</a>. Mengurangi waktu pelatihan NeRF dari hitungan jam menjadi detik dengan menggunakan tabel hash multiresolusi untuk enkode spasial. Hal ini membuat NeRF praktis untuk penggunaan produksi. Teknik enkode hash tersebut juga dapat diterapkan pada data spasial lain di dunia browser (pencarian cepat dalam kumpulan data 3D berukuran besar).</p>
<p><strong>&quot;Neuralangelo: Rekonstruksi Permukaan Neural dengan Fidelitas Tinggi&quot;</strong> -- Li et al. (CVPR 2023). <a href="https://research.nvidia.com/labs/dir/neuralangelo/" target="_blank" rel="noreferrer">Halaman proyek</a>. Mengekstrak mesh segitiga berkualitas tinggi dari representasi neural menggunakan enkode hash multiresolusi dan gradien numerik untuk estimasi SDF (signed distance function/fungsi jarak bertanda). Mesh keluarannya dapat langsung digunakan dalam engine 3D browser. Untuk pipeline aset kami, Neuralangelo (atau alat serupa seperti NeuS2) dapat mengubah tangkapan NeRF menjadi berkas GLB siap web dengan geometri bersih dan tekstur yang telah di-bake.</p>
<h3 id="jaringan-multipemain-dan-sinkronisasi-state" tabindex="-1">Jaringan Multipemain dan Sinkronisasi State <a class="header-anchor" href="#jaringan-multipemain-dan-sinkronisasi-state" aria-label="Permalink to &quot;Jaringan Multipemain dan Sinkronisasi State&quot;"></a></h3>
<p><strong>&quot;Manajemen Kepentingan dalam Game Daring Multipemain Masif&quot;</strong> -- Boulanger, Kienzle, Verbrugge (2006). <a href="https://doi.org/10.1007/11558651_18" target="_blank" rel="noreferrer">DOI</a>. Survei komprehensif mengenai teknik pengelolaan area kepentingan (area of interest/AOI) untuk MMO. Membahas pendekatan berbasis kisi, berbasis aura, dan hibrida untuk memfilter pembaruan jaringan berdasarkan relevansi spasial. Pendekatan berbasis kisi (yang selaras dengan sistem chunk kami) paling efisien untuk dunia dengan densitas seragam. Pendekatan berbasis aura (radius pengaruh per entitas) bekerja lebih baik untuk densitas yang bervariasi. Rekomendasi kami untuk AOI berbasis chunk dengan laju pembaruan berbasis prioritas di dalam AOI berasal dari penelitian ini.</p>
<p><strong>&quot;Dead Reckoning: Menyembunyikan Latensi untuk Game Berjaringan&quot;</strong> -- Pantel dan Wolf (2002). <a href="https://doi.org/10.1145/566500.566510" target="_blank" rel="noreferrer">DOI</a>. Memformalkan dead reckoning (memprediksi posisi entitas berdasarkan kecepatan terakhir yang diketahui) untuk game berjaringan. Makalah ini mengukur komprominya: ambang prediksi yang lebih tinggi mengurangi bandwidth, tetapi meningkatkan kesalahan posisi yang terlihat saat koreksi. Untuk game browser dengan latensi 50–200 md, ambang prediksi 0,5–1,0 meter membuat koreksi tidak terlihat sekaligus memangkas bandwidth pembaruan posisi sebesar 60–80%.</p>
<p><strong>&quot;Tipe Data Tereplikasi Bebas Konflik&quot;</strong> -- Shapiro, Preguiça, Baquero, Zawirski (2011). <a href="https://doi.org/10.1007/978-3-642-24550-3_29" target="_blank" rel="noreferrer">DOI</a>. Makalah dasar CRDT. Mendefinisikan CRDT berbasis state dan berbasis operasi yang dapat berkonvergensi tanpa koordinasi. Untuk sistem pengeditan dunia kami, CRDT yang relevan adalah: LWW-Register (Last-Writer-Wins Register) untuk properti objek yang memiliki satu nilai (posisi, rotasi, warna), dan OR-Set (Observed-Remove Set) untuk kumpulan objek dalam sebuah chunk (menangani penambahan/penghapusan bersamaan tanpa konflik). Yjs mengimplementasikannya secara efisien dalam JavaScript.</p>
<p><strong>&quot;Time Warp: Mekanisme untuk Simulasi Terdistribusi&quot;</strong> -- Jefferson (1985). <a href="https://doi.org/10.1145/3916.3988" target="_blank" rel="noreferrer">DOI</a>. Makalah asli mengenai simulasi terdistribusi optimistis. Meskipun Time Warp sendiri terlalu kompleks untuk game browser, gagasan intinya (memproses kejadian secara optimistis dan melakukan rollback jika konflik datang dari node lain) menjadi dasar prediksi sisi klien modern dengan rekonsiliasi server. Beginilah cara kerja setiap game multipemain yang responsif: klien memprediksi secara lokal, mengirim tindakan ke server, lalu melakukan koreksi jika server tidak menyetujuinya.</p>
<p><strong>&quot;Model Jaringan Engine TRIBES&quot;</strong> -- Frohnmayer dan Gift (GDC 1999). Salah satu penjelasan praktis pertama mengenai jaringan game klien-server dengan manajemen kepentingan, pembaruan state berprioritas, dan penganggaran bandwidth. Konsep &quot;ghost manager&quot; (server mempertahankan tampilan per klien mengenai apa yang telah diketahui klien tersebut, lalu hanya mengirim delta dari tampilan itu) persis seperti yang diterapkan oleh arsitektur Durable Object berbasis chunk kami. Presentasi GDC ini merupakan leluhur intelektual sebagian besar jaringan game modern.</p>
<p><strong>&quot;Jaringan Multipemain Source&quot;</strong> -- Valve (2009). <a href="https://developer.valvesoftware.com/wiki/Source_Multiplayer_Networking" target="_blank" rel="noreferrer">Dokumentasi pengembang</a>. Dokumentasi Valve mengenai model jaringan engine Source (digunakan dalam Half-Life 2, CS:GO, Team Fortress 2). Membahas prediksi sisi klien, interpolasi entitas, kompensasi lag, serta sistem &quot;snapshot&quot; tempat server mengirim state dunia lengkap secara berkala sementara klien melakukan interpolasi antar-snapshot. Ini merupakan standar emas untuk jaringan server otoritatif dan dapat diterapkan langsung pada arsitektur kami.</p>
<h3 id="pembuatan-prosedural" tabindex="-1">Pembuatan Prosedural <a class="header-anchor" href="#pembuatan-prosedural" aria-label="Permalink to &quot;Pembuatan Prosedural&quot;"></a></h3>
<p><strong>&quot;Sintesis Model: Algoritma Pemodelan Prosedural Umum&quot;</strong> -- Merrell (2007). <a href="https://doi.org/10.1145/1289603.1289612" target="_blank" rel="noreferrer">DOI</a>. Salah satu pendahulu Wave Function Collapse. Menghasilkan struktur 3D dari model contoh dengan menyebarkan batasan lokal. Algoritma ini memastikan konsistensi global dengan secara iteratif meng-collapse sel yang memiliki kemungkinan paling sedikit (heuristik entropi minimum). Beginilah Townscaper dan generator serupa menghasilkan struktur yang koheren dari masukan pengguna yang sederhana.</p>
<p><strong>&quot;WaveFunctionCollapse&quot;</strong> -- Maxim Gumin (2016). <a href="https://github.com/mxgmn/WaveFunctionCollapse" target="_blank" rel="noreferrer">GitHub</a>. Bukan makalah tradisional, melainkan proyek sumber terbuka penting dengan dokumentasi ekstensif. Algoritma ini mengambil gambar contoh kecil atau tileset, lalu menghasilkan keluaran yang lebih besar dan secara lokal mirip dengan masukannya. Untuk dunia kreator, WFC dapat menghasilkan tata letak bangunan, jaringan jalan, peta dungeon, dan detail medan dari sekumpulan kecil aturan yang ditentukan kreator. Tersedia beberapa implementasi JavaScript.</p>
<p><strong>&quot;Wave Function Collapse adalah Pemecahan Batasan di Dunia Nyata&quot;</strong> -- Karth dan Smith (FDG 2017). <a href="https://doi.org/10.1145/3102071.3110566" target="_blank" rel="noreferrer">DOI</a>. Analisis akademis WFC yang memperjelas hubungannya dengan pemenuhan batasan serta menunjukkan cara menganalisis dan memperluasnya. Relevan untuk memahami keterbatasan WFC (algoritma ini dapat macet dan memerlukan backtracking) serta cara merancang tileset yang menghindari masalah tersebut.</p>
<p><strong>&quot;Teorema Superposisi dan Implikasinya bagi Pembuatan Konten Game Secara Prosedural&quot;</strong> -- Sandhu et al. (2022). Mengeksplorasi penggunaan konsep superposisi yang terinspirasi kuantum untuk pembuatan konten prosedural. Meskipun spekulatif, kerangka matematis untuk mempertahankan beberapa kemungkinan state sebelum &quot;meng-collapse&quot;-nya menjadi konfigurasi akhir sama persis dengan cara kerja WFC dan dapat menjadi landasan bagi sistem pembuatan yang lebih canggih.</p>
<h3 id="teknik-rendering-waktu-nyata" tabindex="-1">Teknik Rendering Waktu Nyata <a class="header-anchor" href="#teknik-rendering-waktu-nyata" aria-label="Permalink to &quot;Teknik Rendering Waktu Nyata&quot;"></a></h3>
<p><strong>&quot;Rendering Waktu Nyata&quot;</strong> -- Akenine-Möller, Haines, Hoffman (edisi ke-4, 2018). Buku teks standar. Bab 19 (Struktur Akselerasi), Bab 20 (Shading Efisien), dan Bab 21 (Realitas Virtual dan Tertambah) sangat relevan. Algoritma frustum culling, occlusion culling, dan LOD yang dijelaskan di sini adalah algoritma yang diimplementasikan oleh Three.js, Babylon.js, dan setiap engine game. Bukan makalah, tetapi merupakan referensi definitif.</p>
<p><strong>&quot;Survei tentang Baking Medan Radiansi Neural untuk Sintesis Sudut Pandang Waktu Nyata&quot;</strong> -- Reiser et al. (2023). <a href="https://doi.org/10.1111/cgf.14835" target="_blank" rel="noreferrer">DOI</a>. Meninjau berbagai metode untuk mengubah NeRF menjadi format yang dapat dirender secara waktu nyata (mesh, tekstur, kisi voxel renggang). Berkaitan langsung dengan pipeline aset kami, ketika penangkapan neural sisi server perlu menghasilkan keluaran yang dapat dirender di browser.</p>
<p><strong>&quot;Pencocokan Fitur Daring yang Skalabel dan Akurat Menggunakan Gaussian Splatting 3D&quot;</strong> -- Berbagai kelompok (2024–2025). Sejumlah makalah terbaru mengeksplorasi pengeditan, compositing, dan adegan dinamis dengan Gaussian splat. Hal ini relevan karena dunia kreator perlu menggabungkan beberapa adegan splat (objek hasil tangkapan setiap kreator) menjadi satu adegan yang koheren. Metode pengeditan splat (pewarnaan ulang, deformasi, compositing) merupakan bidang penelitian aktif.</p>
<p><strong>&quot;Ray Tracing Screen-Space GPU yang Efisien&quot;</strong> -- McGuire dan Mara (JCGT 2014). <a href="https://doi.org/10.2312/hpg.20141090" target="_blank" rel="noreferrer">DOI</a>. Makalah yang mendasari refleksi screen-space yang digunakan dalam bagian rendering air kami. Menelusuri sinar melalui depth buffer untuk menghasilkan perkiraan refleksi tanpa biaya ray tracing penuh. Varian &quot;hierarchical tracing&quot; (menggunakan mipmap kedalaman min-maks) berjalan secara efisien di WebGL 2.</p>
<p><strong>&quot;Menyimulasikan Air Laut&quot;</strong> -- Jerry Tessendorf (2001). <a href="https://people.computing.clemson.edu/~jtessen/reports/papers_files/coursenotes2004.pdf" target="_blank" rel="noreferrer">PDF</a>. Makalah dasar mengenai simulasi laut berbasis FFT. Menjelaskan spektrum Phillips (model statistik gelombang laut) dan cara mengubahnya menjadi peta perpindahan spasial melalui FFT invers. Digunakan oleh setiap game besar dengan laut realistis (Sea of Thieves, Assassin's Creed, Uncharted). Komputasi FFT dapat dipetakan dengan rapi ke compute shader WebGPU.</p>
<p><strong>&quot;Hamburan Atmosfer yang Diprakomputasi&quot;</strong> -- Bruneton dan Neyret (EGSR 2008). <a href="https://doi.org/10.1111/j.1467-8659.2008.01245.x" target="_blank" rel="noreferrer">DOI</a>. Makalah yang mendasari rendering langit akurat secara fisik. Melakukan prakomputasi hamburan atmosfer ke dalam tabel pencarian yang diambil sampelnya oleh fragment shader secara waktu nyata. Menghasilkan warna langit yang tepat, perspektif udara (objek jauh tampak kebiruan/berkabut), serta warna matahari terbenam/terbit berdasarkan prinsip dasar. Tabel hasil prakomputasinya berukuran kecil (beberapa ratus KB) dan shader runtime-nya ringan. Shader <code>Sky</code> milik Three.js dan langit prosedural Babylon.js merupakan versi sederhana dari pendekatan ini.</p>
<p><strong>&quot;Volume Oklusi Ambien&quot;</strong> -- McGuire (HPG 2010) dan <strong>&quot;Pengaburan Ambien yang Skalabel&quot;</strong> -- McGuire, Mara, Luebke (HPG 2012). <a href="https://research.nvidia.com/sites/default/files/pubs/2012-06_Scalable-Ambient-Obscurance/McGuire12SAO.pdf" target="_blank" rel="noreferrer">PDF</a>. Makalah yang mendasari implementasi SSAO modern. SAO adalah varian yang paling umum diimplementasikan dalam engine 3D browser karena efisien (satu sampel depth buffer per piksel) dan menghasilkan bayangan kontak yang masuk akal. Algoritma ini mengambil sampel depth buffer di sekitar setiap piksel untuk memperkirakan seberapa &quot;teroklusi&quot; piksel tersebut oleh geometri di dekatnya. Three.js dan Babylon.js sama-sama mengimplementasikan SSAO turunan SAO.</p>
<h3 id="rendering-dan-animasi-kerumunan" tabindex="-1">Rendering dan Animasi Kerumunan <a class="header-anchor" href="#rendering-dan-animasi-kerumunan" aria-label="Permalink to &quot;Rendering dan Animasi Kerumunan&quot;"></a></h3>
<p><strong>&quot;Rendering Kerumunan dengan GPU&quot;</strong> -- Dudash (2007) dan presentasi GDC/SIGGRAPH berikutnya mengenai rendering kerumunan terinstansiasi. Teknik intinya: bake frame animasi skeletal ke dalam tekstur (Vertex Animation Textures), lalu render kerumunan sebagai mesh terinstansiasi, dengan setiap instans membaca transformasi tulangnya dari tekstur animasi berdasarkan frame saat ini. Pendekatan ini memisahkan evaluasi animasi dari draw call, sehingga satu draw call terinstansiasi dapat merender ratusan karakter dengan animasi unik.</p>
<p><strong>&quot;Dinamika Berbasis Posisi&quot;</strong> -- Müller et al. (2007). <a href="https://doi.org/10.1016/j.jvcir.2007.01.005" target="_blank" rel="noreferrer">DOI</a>. Makalah dasar mengenai PBD, yaitu cara engine game modern menyimulasikan kain, rambut, dan benda lunak. Rapier (engine fisika Wasm yang kami rekomendasikan) menggunakan solver turunan PBD. Untuk kustomisasi avatar (jubah, rambut tergerai, pakaian longgar), PBD menyediakan simulasi responsif pada frame rate game. Implementasi Wasm menjaganya tetap berjalan di luar thread utama JavaScript.
<strong>&quot;FABRIK: Pemecah Cepat dan Iteratif untuk Masalah Kinematika Balik&quot;</strong> -- Aristidou dan Lasenby (2011). <a href="https://doi.org/10.1016/j.gmod.2011.05.003" target="_blank" rel="noreferrer">DOI</a>. Makalah yang mendasari pemecah IK yang direkomendasikan di bagian avatar kami. FABRIK bekerja dengan secara bergantian menjangkau dari efektor ujung ke akar dan dari akar ke efektor ujung, lalu mencapai konvergensi dalam 3–5 iterasi. Metode ini lebih cepat daripada IK berbasis Jacobian, menangani batasan sendi secara alami, dan mudah diimplementasikan (sekitar 50 baris kode untuk pemecah dasar). Implementasi IK Three.js dan Babylon.js sama-sama diturunkan dari FABRIK.</p>
<h3 id="dunia-virtual-dan-lingkungan-kolaboratif" tabindex="-1">Dunia Virtual dan Lingkungan Kolaboratif <a class="header-anchor" href="#dunia-virtual-dan-lingkungan-kolaboratif" aria-label="Permalink to &quot;Dunia Virtual dan Lingkungan Kolaboratif&quot;"></a></h3>
<p><strong>&quot;Gim Daring Multipemain Masif: Survei Perkembangan Terkini&quot;</strong> -- Yahyavi dan Kemme (2013). <a href="https://doi.org/10.1145/2522968.2522972" target="_blank" rel="noreferrer">DOI</a>. Survei komprehensif tentang arsitektur MMO yang mencakup model klien-server, pendekatan peer-to-peer, manajemen minat, model konsistensi, teknik skalabilitas, dan pencegahan kecurangan. Taksonomi model konsistensinya (ketat, eventual, kausal) sesuai dengan pendekatan berbasis CRDT kami (konsistensi eventual dengan pengurutan kausal melalui vector clock).</p>
<p><strong>&quot;Arsitektur Terdistribusi untuk Aplikasi Interaktif Multipemain di Internet&quot;</strong> -- Diot dan Gautier (1999). <a href="https://doi.org/10.1109/65.790947" target="_blank" rel="noreferrer">DOI</a>. Penelitian awal tentang lingkungan virtual terdistribusi yang mengidentifikasi pertentangan utama: konsistensi ketat memerlukan koordinasi (yang menambah latensi), sementara konsistensi lemah memungkinkan respons cepat tetapi berisiko menimbulkan inkonsistensi yang terlihat. Makalah ini mengusulkan &quot;local lag&quot; (menunda tampilan lokal dalam waktu singkat agar pembaruan jarak jauh sempat tiba) sebagai jalan tengah. Untuk pengeditan dunia (menempatkan objek), local lag 100–200 milidetik tidak terasa dan memberi server waktu untuk melakukan validasi.</p>
<p><strong>&quot;Grid Second Life: Arsitektur Dunia Virtual Sumber Terbuka yang Hampir Kontemporer&quot;</strong> -- Dokumentasi teknis Linden Lab dan rekayasa balik oleh komunitas. Meskipun bukan satu makalah tunggal, analisis teknis arsitektur Second Life didokumentasikan secara ekstensif. Wawasan utamanya: setiap wilayah berukuran 256x256 m berjalan pada instans server khusus. Objek disimpan sebagai pohon &quot;primitif&quot; (bentuk dasar dengan transformasi, tekstur, dan skrip). Penampil melakukan streaming deskripsi objek dan tekstur sesuai kebutuhan. Model berbasis persil dengan persistensi per objek ini merupakan arsitektur yang paling mendekati apa yang sedang kami bangun, dan pengoperasian Second Life selama lebih dari 20 tahun membuktikan bahwa arsitektur tersebut dapat diskalakan.</p>
<h3 id="grafis-web-dan-performa-browser" tabindex="-1">Grafis Web dan Performa Browser <a class="header-anchor" href="#grafis-web-dan-performa-browser" aria-label="Permalink to &quot;Grafis Web dan Performa Browser&quot;"></a></h3>
<p><strong>&quot;WebGPU: API Grafis Berperforma Tinggi untuk Web&quot;</strong> -- W3C GPU for the Web Working Group (2023–sekarang). <a href="https://www.w3.org/TR/webgpu/" target="_blank" rel="noreferrer">Spesifikasi</a>. Spesifikasi formal untuk WebGPU. Ini bukan makalah penelitian, tetapi merupakan dokumen teknis definitif untuk pemrograman GPU di browser. Spesifikasi compute shader (Bagian 23) sangat relevan untuk pembuatan medan, penyebaran vegetasi, dan sistem partikel yang dijelaskan di sepanjang panduan ini.</p>
<p><strong>&quot;WebAssembly: Kerangka Kerja untuk Menjalankan Kode Terkompilasi di Browser&quot;</strong> -- Haas dkk. (PLDI 2017). <a href="https://doi.org/10.1145/3062341.3062363" target="_blank" rel="noreferrer">DOI</a>. Makalah WebAssembly asli dari para vendor browser. Makalah ini menunjukkan bahwa performa Wasm berada dalam kisaran 2x dari performa native untuk beban kerja komputasi intensif. Hal ini mendukung rekomendasi kami untuk menggunakan mesin fisika yang dikompilasi ke Wasm (Rapier, Havok) bagi dunia terbuka di browser. Analisis performa dalam makalah tersebut menunjukkan bahwa overhead terutama berasal dari pemeriksaan batas dan pemanggilan fungsi tidak langsung, bukan dari model kompilasinya sendiri.</p>
<p><strong>&quot;Tidak Secepat Itu: Menganalisis Performa WebAssembly vs. Kode Native&quot;</strong> -- Jangda dkk. (USENIX ATC 2019). <a href="https://www.usenix.org/system/files/atc19-jangda.pdf" target="_blank" rel="noreferrer">PDF</a>. Tolok ukur ketat mengenai performa Wasm dibandingkan native. Hasilnya menunjukkan bahwa Wasm rata-rata berjalan 1,45x–1,55x lebih lambat daripada C native di seluruh rangkaian tolok ukur SPEC CPU. Khusus untuk fisika gim (banyak operasi floating-point, sedikit system call), overhead berada pada kisaran bawah (~1,3x). Hal ini menegaskan bahwa fisika Wasm di browser layak digunakan untuk beban kerja gim waktu nyata.</p>
<p><strong>&quot;Meningkatkan Kecepatan Web dengan WebAssembly&quot;</strong> -- Rossberg dkk. (2018). <a href="https://doi.org/10.1145/3192366.3192379" target="_blank" rel="noreferrer">DOI</a>. Menjelaskan dasar pertimbangan desain dan semantik formal WebAssembly. Hal yang sangat relevan: pembahasan jaminan keamanan memori (Bagian 3) menjelaskan mengapa modul Wasm dapat berbagi tab browser dengan JavaScript secara aman tanpa risiko keamanan seperti pada plugin native. Inilah yang membuat mesin fisika (yang secara tradisional berupa pustaka C++) aman dijalankan di browser.</p>
<h3 id="pembuatan-konten-berbasis-ai" tabindex="-1">Pembuatan Konten Berbasis AI <a class="header-anchor" href="#pembuatan-konten-berbasis-ai" aria-label="Permalink to &quot;Pembuatan Konten Berbasis AI&quot;"></a></h3>
<p><strong>&quot;Pembuatan Teks-ke-3D dengan Difusi Dua Arah Menggunakan Prior 2D dan 3D&quot;</strong> -- Berbagai kelompok (2023–2025). Sejumlah makalah terbaru (DreamFusion, Magic3D, ProlificDreamer, MVDream, Zero-1-to-3++) mengeksplorasi pembuatan aset 3D dari prompt teks dengan menggunakan model difusi 2D sebagai prior untuk pengoptimalan 3D. Kualitasnya meningkat drastis dari awal 2023 hingga 2025, dari bentuk menggumpal menjadi mesh yang mendetail dan bertekstur. Untuk platform kami, model-model ini (yang berjalan di GPU sisi server) menjadi tahap &quot;pembuatan dengan AI&quot; dalam pipeline aset kreator.</p>
<p><strong>&quot;DreamFusion: Teks-ke-3D Menggunakan Difusi 2D&quot;</strong> -- Poole dkk. (ICLR 2023). <a href="https://dreamfusion3d.github.io/" target="_blank" rel="noreferrer">Halaman proyek</a>. Makalah fundamental tentang Score Distillation Sampling (SDS), yang menggunakan model difusi 2D pralatih untuk memandu pengoptimalan 3D. Wawasan utamanya: Anda tidak memerlukan data pelatihan 3D jika Anda dapat mengevaluasi apakah tampilan hasil render dari objek 3D cocok dengan prompt teks menggunakan model 2D yang sudah ada. Pendekatan ini membuka jalan bagi pembuatan teks-ke-3D dan menjadi dasar bagi penelitian berikutnya (Magic3D, ProlificDreamer) yang meningkatkan kualitas dan kecepatan.</p>
<p><strong>&quot;LRM: Model Rekonstruksi Besar untuk Mengubah Satu Gambar Menjadi 3D&quot;</strong> -- Hong dkk. (ICLR 2024). <a href="https://yiconghong.me/LRM/" target="_blank" rel="noreferrer">Halaman proyek</a>. Merekonstruksi model 3D dari satu gambar dalam 5 detik pada satu GPU. Model ini menghasilkan representasi menyerupai NeRF yang dapat dikonversi menjadi mesh. Untuk dunia buatan kreator, ini berarti kreator dapat memotret objek apa pun di dunia nyata dan memperoleh model 3D dalam hitungan detik. Kecepatannya membuat teknologi ini layak digunakan sebagai alat interaktif, bukan sebagai proses batch.</p>
<p><strong>&quot;Pembuatan Konten Prosedural melalui Pembelajaran Mesin (PCGML)&quot;</strong> -- Summerville dkk. (2018). <a href="https://doi.org/10.1109/TG.2018.2846639" target="_blank" rel="noreferrer">DOI</a>. Survei penggunaan pembelajaran mesin untuk pembuatan konten prosedural dalam gim. Mencakup pembuatan level, item, narasi, dan dunia. Hal yang sangat relevan adalah pembahasan mengenai &quot;pembuatan yang dapat dikendalikan&quot;, ketika desainer menetapkan parameter tingkat tinggi dan model ML mengisi detailnya. Inilah paradigma pembangunan dunia berbantuan AI: kreator menetapkan maksud (&quot;buat area ini menjadi hutan menyeramkan&quot;), lalu AI mengisi geometri, tekstur, dan populasinya.</p>
<h3 id="hubungan-makalah-makalah-ini-dengan-arsitektur-kami" tabindex="-1">Hubungan Makalah-Makalah Ini dengan Arsitektur Kami <a class="header-anchor" href="#hubungan-makalah-makalah-ini-dengan-arsitektur-kami" aria-label="Permalink to &quot;Hubungan Makalah-Makalah Ini dengan Arsitektur Kami&quot;"></a></h3>
<p>Penelitian tersebut dipetakan ke arsitektur kami dalam beberapa lapisan:</p>
<p><strong>Pipeline medan:</strong> Noise Perlin/simplex (Perlin 1985, 2001) menghasilkan heightmap dasar. Erosi hidraulis (Mei dkk. 2007) menambahkan realisme geologis. Geometry clipmap (Losasso dan Hoppe 2004) atau CDLOD (Strugar 2014) merender medan secara efisien di browser. Hamburan atmosfer (Bruneton dan Neyret 2008) membuat medan di kejauhan terlihat tepat.</p>
<p><strong>Pipeline aset:</strong> Teks-ke-3D (DreamFusion dkk.) dan gambar-ke-3D (LRM) menghasilkan aset di sisi server. Gaussian splatting (Kerbl dkk. 2023) memungkinkan pengambilan fotogrametri. Neuralangelo (Li dkk. 2023) mengekstrak mesh bersih dari hasil tangkapan neural. Semua output diproses menjadi GLB/KTX2 yang siap digunakan di browser.</p>
<p><strong>Rendering:</strong> SSAO (McGuire 2012) menambahkan kedalaman. Refleksi screen-space (McGuire dan Mara 2014) menghasilkan efek air. Laut FFT (Tessendorf 2001) menyimulasikan air. Tekstur animasi vertex (Dudash 2007) merender kerumunan. FABRIK (Aristidou dan Lasenby 2011) menggerakkan IK karakter.</p>
<p><strong>Jaringan:</strong> Manajemen minat (Boulanger dkk. 2006) menyaring pembaruan berdasarkan relevansi spasial. Dead reckoning (Pantel dan Wolf 2002) mengurangi penggunaan bandwidth. CRDT (Shapiro dkk. 2011) menangani pengeditan kolaboratif. Prediksi klien dengan rekonsiliasi server (Jefferson 1985, Valve Source Networking) memberikan respons yang cepat.</p>
<p><strong>Pembuatan dunia:</strong> WFC (Gumin 2016, Karth dan Smith 2017) menghasilkan struktur dan tata letak. PCGML (Summerville dkk. 2018) menyediakan kerangka kerja untuk pembuatan berbantuan AI, ketika kreator menetapkan maksud dan model mengisi detailnya.</p>
<p>Penelitian di bidang ini sudah matang. Sebagian besar teknik tersebut telah digunakan dalam gim yang dirilis selama bertahun-tahun. Inovasi dalam membawanya ke browser bukan terletak pada algoritmanya, melainkan pada rekayasa agar semuanya bekerja dalam batasan memori, GPU, dan jaringan browser—dan itulah yang dibahas di bagian lain panduan ini.</p>
<h2 id="bacaan-lebih-lanjut" tabindex="-1">Bacaan Lebih Lanjut <a class="header-anchor" href="#bacaan-lebih-lanjut" aria-label="Permalink to &quot;Bacaan Lebih Lanjut&quot;"></a></h2>
<ul>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Gim Web pada 2026</a> membahas dasar-dasar WebGL, WebGPU, dan WebAssembly</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Perbandingan Mesin Gim Web</a> membandingkan mesin untuk distribusi melalui browser</li>
<li><a href="/id/guides/threejs-usdc-tech-report.html">Laporan Teknis Three.js + USDC</a> tentang pemuatan aset 3D di browser</li>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Terdepan</a> untuk pipeline pembuatan dengan AI</li>
<li><a href="/id/guides/co-op-game-design.html">Desain Gim Co-op</a> tentang pola desain multipemain yang mempertahankan keterlibatan pemain</li>
<li><a href="/id/guides/landscape-generation-browser.html">Pembuatan Lanskap untuk Dunia Terbuka di Browser</a> — rendering medan, erosi, dan vegetasi</li>
<li><a href="/id/tutorials/websocket-multiplayer-basics.html">Dasar-dasar multipemain WebSocket</a> — mulai membangun jaringan multipemain di browser</li>
<li><a href="/id/tutorials/webgpu-getting-started.html">Memulai dengan WebGPU</a> — API rendering untuk 3D browser generasi berikutnya</li>
<li><a href="/id/tutorials/streaming-asset-loading.html">Pemuatan aset secara streaming</a> — pola pemuatan progresif untuk dunia 3D berukuran besar</li>
</ul>
<BuildCta
  title="Coba dunia terbuka di browser Anda sekarang"
  desc="Masukkan satu kalimat, dapatkan dunia 3D yang bisa dijelajahi."
  prompt="Buat pulau dunia terbuka kecil yang dapat saya jelajahi dari sudut pandang orang ketiga" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/browser-3d-open-world-tech.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Desain Game Co-op pada 2026]]></title>
            <link>https://app.cinevva.com/id/guides/co-op-game-design</link>
            <guid>https://app.cinevva.com/id/guides/co-op-game-design</guid>
            <pubDate>Mon, 26 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Apa yang membuat game "friend slop" berhasil. Peak terjual 11 juta kopi. Inilah alasannya.]]></description>
            <content:encoded><![CDATA[<h1 id="desain-game-co-op-pada-2026" tabindex="-1">Desain Game Co-op pada 2026 <a class="header-anchor" href="#desain-game-co-op-pada-2026" aria-label="Permalink to &quot;Desain Game Co-op pada 2026&quot;"></a></h1>
<p>Ada sebuah istilah yang beredar dan bisa disukai atau dibenci oleh developer: &quot;friend slop.&quot;</p>
<p>Awalnya, istilah ini digunakan sebagai hinaan. Sebuah cara untuk meremehkan game co-op berbiaya rendah sebagai pabrik konten dangkal yang dirancang untuk menghasilkan klip viral. Namun, Peak kemudian terjual 11 juta kopi dalam dua bulan. R.E.P.O. mendominasi Steam. Dan tiba-tiba, para developer yang membuat game semacam ini mulai menerima julukan tersebut.</p>
<p>&quot;Kami sebenarnya menganggap friend slop sebagai istilah yang keren,&quot; kata Paige Wilson dari Aggro Crab, penerbit Peak. &quot;Istilah ini digunakan untuk menggambarkan game berbiaya rendah yang bisa dimainkan kapan saja bersama teman-teman untuk bersenang-senang, nongkrong, dan menikmati sedikit kekacauan teknis. Menurut saya, sebagian orang mungkin tidak memandangnya seperti ini, tetapi kami begitu!&quot;</p>
<p>Berikut yang saya pelajari tentang alasan game-game ini berhasil dan cara Anda dapat merancangnya.</p>
<h2 id="game-yang-mendefinisikan-2025" tabindex="-1">Game yang Mendefinisikan 2025 <a class="header-anchor" href="#game-yang-mendefinisikan-2025" aria-label="Permalink to &quot;Game yang Mendefinisikan 2025&quot;"></a></h2>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/Am4gM4b2UHw" title="Trailer Lethal Company" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p><strong>Lethal Company</strong> (2023) memulai gelombang ini. Developer solo Zeekerss membuat game horor co-op tempat Anda mengumpulkan barang rongsokan dari fasilitas terbengkalai sambil menghindari monster. Game ini terjual jutaan kopi dan melahirkan sebuah genre baru.</p>
<p><a href="https://store.steampowered.com/app/1966720/Lethal_Company/" target="_blank" class="campaign-link">Lihat Lethal Company di Steam →</a></p>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/oSfoK8eSeD8" title="Trailer Rilis R.E.P.O." frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p><strong>R.E.P.O.</strong> (2025) mengambil formula tersebut dan membuatnya lebih konyol. Avatar robot. Fisika yang dilebih-lebihkan. Para pemain bersumpah bahwa game ini &quot;begitu lucu sampai sulit merasa takut.&quot; Game ini menjadi salah satu game co-op terbesar pada 2025. Ketika Steam menerbitkan daftar game terlaris akhir tahunnya pada Desember 2025, R.E.P.O. menjadi game baru dengan penjualan unit terbanyak tahun itu, tepat diikuti oleh Peak. Game co-op friend slop langsung merebut posisi teratas, mengalahkan rilisan beranggaran besar yang biaya pembuatannya lima kali lipat.</p>
<p><a href="https://store.steampowered.com/app/3241660/REPO/" target="_blank" class="campaign-link">Lihat R.E.P.O. di Steam →</a></p>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/6BCdx7I1gz8" title="Penjelasan Peak" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p><strong>Peak</strong> (2025) membuktikan bahwa formula ini juga berhasil di luar genre horor. Mendaki gunung bersama teman. Terjatuh. Tertawa. Mencoba lagi. Terjual 11 juta kopi. Game ini dibuat dalam <a href="https://www.pcgamer.com/games/sim/peak-devs-say-the-hit-comedy-climber-was-pitched-in-a-swedish-hot-tub-and-developed-in-a-frantic-4-week-korean-game-jam-we-brought-our-computers-to-an-airbnb-in-hongdae-and-locked-tf-in-for-a-month/" target="_blank" rel="noreferrer">4 minggu selama sebuah game jam di Korea Selatan</a>, saat tim Landfall dan Aggro Crab berbagi Airbnb di distrik Hongdae, Seoul.</p>
<p>Peak terus menambahkan konten gratis setelah peluncuran, menghadirkan bioma Mesa baru secara bergilir pada Agustus 2025 dan mengadakan konser dalam game untuk waktu terbatas bersama rapper bbno$ pada Desember 2025. Game jam beranggaran rendah ini menjadi layanan live dalam segala hal kecuali namanya.</p>
<p><a href="https://store.steampowered.com/app/3527290/PEAK/" target="_blank" class="campaign-link">Lihat Peak di Steam →</a></p>
<h2 id="prinsip-utama-desain" tabindex="-1">Prinsip Utama Desain <a class="header-anchor" href="#prinsip-utama-desain" aria-label="Permalink to &quot;Prinsip Utama Desain&quot;"></a></h2>
<p>Setelah mempelajari game-game ini dan membaca wawancara para developernya, berikut kesamaan yang mereka miliki:</p>
<h3 id="_1-hambatan-masuk-yang-rendah" tabindex="-1">1. Hambatan Masuk yang Rendah <a class="header-anchor" href="#_1-hambatan-masuk-yang-rendah" aria-label="Permalink to &quot;1. Hambatan Masuk yang Rendah&quot;"></a></h3>
<div class="stat-box">
<strong>$8 atau kurang</strong><br>
Teori harga Peak: "Delapan dolar masih terasa seperti lima dolar. Belum terasa seperti sepuluh dolar."
</div>
<p>Harga game-game ini di bawah $20. Sebagian besar bahkan di bawah $10. Peak diluncurkan dengan harga $5, lalu menjadi $8. Para developernya memiliki teori lengkap tentang psikologi harga: &quot;Delapan dolar masih terasa seperti lima dolar. Tiga dolar terasa seperti dua dolar. Dua dolar pada dasarnya gratis.&quot;</p>
<p>Namun, ini bukan sekadar soal harga. Game-game tersebut mudah dipelajari. Anda tidak memerlukan pengalaman bermain game sebelumnya. Anda tidak perlu memahami sistem yang rumit. Teman-teman Anda yang bukan gamer pun bisa ikut bermain.</p>
<h3 id="_2-kegagalan-itu-lucu" tabindex="-1">2. Kegagalan Itu Lucu <a class="header-anchor" href="#_2-kegagalan-itu-lucu" aria-label="Permalink to &quot;2. Kegagalan Itu Lucu&quot;"></a></h3>
<p>Di Peak, saya belum pernah bertahan hingga akhir sesi permainan. Namun, saya tetap terus bermain.</p>
<p>Momen paling menghibur bukanlah kemenangan. Melainkan melihat teman Anda gagal melompat dan jatuh dari gunung. Memakan makanan beracun. Dikejar oleh pemimpin pramuka.</p>
<p>Rancang kondisi kegagalan yang lucu. Buat kematian tetap menarik untuk ditonton. Biarkan para pemain saling menertawakan.</p>
<h3 id="_3-obrolan-jarak-dekat" tabindex="-1">3. Obrolan Jarak Dekat <a class="header-anchor" href="#_3-obrolan-jarak-dekat" aria-label="Permalink to &quot;3. Obrolan Jarak Dekat&quot;"></a></h3>
<p>Hampir setiap game friend slop yang sukses memiliki obrolan suara berbasis jarak. Suara Anda semakin pelan saat menjauh dari rekan satu tim. Mulut karakter tersinkronisasi dengan ucapan Anda.</p>
<p>Hal ini menciptakan komedi secara alami. Seseorang berteriak meminta bantuan dari kejauhan. Percakapan berbisik. Kepanikan saat menyadari bahwa Anda telah berjalan terlalu jauh sendirian.</p>
<h3 id="_4-fisika-kacau-disengaja" tabindex="-1">4. Fisika Kacau (Disengaja) <a class="header-anchor" href="#_4-fisika-kacau-disengaja" aria-label="Permalink to &quot;4. Fisika Kacau (Disengaja)&quot;"></a></h3>
<p>Fisika yang goyah dan tidak dapat diprediksi itu bukan bug. Itu adalah fitur.</p>
<p>Ketika karakter Anda tiba-tiba menjadi ragdoll, itu lucu. Ketika objek memantul dengan cara aneh, hal itu menciptakan cerita. Kekacauan teknis tersebut adalah kontennya.</p>
<h3 id="_5-momen-yang-layak-dibagikan" tabindex="-1">5. Momen yang Layak Dibagikan <a class="header-anchor" href="#_5-momen-yang-layak-dibagikan" aria-label="Permalink to &quot;5. Momen yang Layak Dibagikan&quot;"></a></h3>
<p>Game-game ini dirancang untuk menghasilkan klip. Twitch. TikTok. YouTube Shorts.</p>
<p>Setiap sesi menghasilkan momen yang layak dibagikan. Algoritma menyukainya. Para pemain menjadi pemasar tanpa menyadarinya.</p>
<h2 id="perbedaannya-dari-game-co-op-tradisional" tabindex="-1">Perbedaannya dari Game Co-op Tradisional <a class="header-anchor" href="#perbedaannya-dari-game-co-op-tradisional" aria-label="Permalink to &quot;Perbedaannya dari Game Co-op Tradisional&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Co-op Tradisional</th>
<th>Friend Slop</th>
</tr>
</thead>
<tbody>
<tr>
<td>Menang adalah tujuan utama</td>
<td>Nongkrong adalah tujuan utama</td>
</tr>
<tr>
<td>Memerlukan keterampilan</td>
<td>Siapa pun bisa bermain</td>
</tr>
<tr>
<td>Mode solo tetap menyenangkan</td>
<td>Mode solo terasa menyedihkan</td>
</tr>
<tr>
<td>Digerakkan oleh cerita</td>
<td>Digerakkan oleh momen</td>
</tr>
<tr>
<td>$40-60</td>
<td>$5-20</td>
</tr>
<tr>
<td>Dipoles sempurna</td>
<td>Sengaja dibuat kacau</td>
</tr>
</tbody>
</table>
<p>Analisis The Verge merangkumnya dengan tepat: &quot;Dalam friend slop, tujuan utamanya adalah humor. Menang hanyalah hal sekunder.&quot;</p>
<h2 id="sudut-pandang-kesepian" tabindex="-1">Sudut Pandang Kesepian <a class="header-anchor" href="#sudut-pandang-kesepian" aria-label="Permalink to &quot;Sudut Pandang Kesepian&quot;"></a></h2>
<p>Ada satu hal yang dilewatkan para kritikus ketika mereka meremehkan game-game ini sebagai &quot;slop.&quot;</p>
<p>Kita sedang menghadapi epidemi kesepian. Orang-orang terisolasi. Kerja jarak jauh membuat kelompok pertemanan tersebar. Game-game ini memberi orang alasan untuk berkumpul secara virtual. Ini adalah ruang sosial yang tidak menuntut komitmen besar.</p>
<p>Seperti yang dikatakan seorang penulis: &quot;sebuah jalan nyata menuju keselamatan dari masa-masa yang memecah belah dan mengisolasi.&quot;</p>
<p>Itu bukan hal sepele.</p>
<h2 id="aspek-ekonomi" tabindex="-1">Aspek Ekonomi <a class="header-anchor" href="#aspek-ekonomi" aria-label="Permalink to &quot;Aspek Ekonomi&quot;"></a></h2>
<div class="stat-box">
<strong>4 minggu → 11 juta kopi</strong><br>
Peak dikembangkan selama game jam satu bulan di Korea Selatan.
</div>
<p>Game-game ini murah untuk dibuat. Tim kecil. Siklus pengembangan singkat. Grafis beresolusi rendah yang justru disukai pemain karena memiliki daya tarik tersendiri.</p>
<p>Content Warning dibuat oleh tim kecil dalam waktu minimal. Peak merupakan proyek game jam. R.E.P.O. berasal dari studio yang membuat game eksperimental.</p>
<p>Studio di balik game-game sukses ini tidak melambat. Aggro Crab, salah satu developer Peak, merilis game co-op berikutnya, Crashout Crew, pada 28 Mei 2026. Game ini adalah simulator gudang forklift yang kacau untuk satu hingga empat pemain dan diluncurkan di Steam serta Xbox Game Pass. Resep yang sama: tim kecil, kekacauan berbasis fisika, dan dirancang untuk dimainkan bersama teman.</p>
<p>Perhitungannya masuk akal: investasi rendah, potensi keuntungan tinggi, dan genre yang lebih menghargai keaslian daripada kesempurnaan.</p>
<h2 id="contoh-terkemuka" tabindex="-1">Contoh Terkemuka <a class="header-anchor" href="#contoh-terkemuka" aria-label="Permalink to &quot;Contoh Terkemuka&quot;"></a></h2>
<p><strong>Game Wajib:</strong></p>
<ul>
<li>Among Us (2018) - prototipenya</li>
<li>Phasmophobia (2020) - berburu hantu dengan obrolan jarak dekat</li>
<li>Lethal Company (2023) - penentu genre</li>
<li>Content Warning (2024) - merekam monster demi jumlah tayangan</li>
<li>Peak (2025) - kekacauan mendaki</li>
<li>R.E.P.O. (2025) - ekstraksi horor yang konyol</li>
<li>Crashout Crew (2026) - kekacauan co-op forklift dari Aggro Crab, salah satu developer Peak</li>
<li>Gamble With Your Friends (2026) - game pesta yang terjual satu juta kopi pada minggu pertamanya, membuktikan bahwa genre ini terus melaju hingga 2026</li>
</ul>
<p><strong>Eksperimen:</strong></p>
<ul>
<li>Guilty as Sock! - drama ruang sidang dengan boneka kaus kaki</li>
<li>Mage Arena - $2.99, melontarkan mantra dengan berteriak</li>
<li>Lockdown Protocol - Among Us bertemu simulator pekerjaan rumah</li>
<li>YAPYAP - para penyihir merusak sebuah menara</li>
</ul>
<h2 id="mengapa-game-web-sangat-cocok" tabindex="-1">Mengapa Game Web Sangat Cocok <a class="header-anchor" href="#mengapa-game-web-sangat-cocok" aria-label="Permalink to &quot;Mengapa Game Web Sangat Cocok&quot;"></a></h2>
<p>Di sinilah hal ini menjadi menarik bagi developer game berbasis browser.</p>
<p>Game friend slop memiliki dua persyaratan: hambatan masuk yang rendah dan multiplayer instan. Game web memenuhi keduanya dengan sempurna.</p>
<p>Tanpa unduhan. Tanpa instalasi. Bagikan tautan, dan semua orang sudah bermain dalam 30 detik. Itulah kondisi ideal untuk game co-op.</p>
<p>Tantangan teknisnya—multiplayer WebSocket, sinkronisasi fisika, dan obrolan suara—dapat diatasi. Ada alasan kami menyediakan <a href="/id/tutorials/websocket-multiplayer-basics.html">tutorial WebSocket</a>.</p>
<p>Pertanyaan yang lebih besar adalah soal desain. Bisakah Anda menciptakan momen yang layak dibagikan? Bisakah Anda membuat kegagalan terasa lucu? Bisakah Anda memberi teman-teman alasan untuk berkumpul di dalam game Anda?</p>
<h2 id="jika-anda-sedang-membuatnya" tabindex="-1">Jika Anda Sedang Membuatnya <a class="header-anchor" href="#jika-anda-sedang-membuatnya" aria-label="Permalink to &quot;Jika Anda Sedang Membuatnya&quot;"></a></h2>
<p><strong>Mulailah dengan loop sosial.</strong> Apa yang akan dibicarakan pemain setelahnya? Cerita apa yang akan mereka sampaikan? Rancang game untuk menciptakan momen-momen tersebut.</p>
<p><strong>Terima kekacauannya.</strong> Anda tidak memerlukan kesempurnaan kelas AAA. Pemain lebih menyukai daya tarik yang khas. Ragdoll adalah teman Anda.</p>
<p><strong>Tetapkan harga rendah.</strong> $5-10 adalah kisaran ideal. Anda ingin seluruh anggota kelompok pertemanan membelinya. Empat kopi seharga $8 lebih baik daripada satu kopi seharga $30.</p>
<p><strong>Tambahkan obrolan jarak dekat.</strong> Fitur ini praktis wajib ada. Pemain kini mengharapkannya.</p>
<p><strong>Buat game mudah dijadikan klip.</strong> Jika tidak ada yang membagikan klip game Anda, Anda kehilangan pemasaran gratis.</p>
<p><strong>Uji dengan kelompok pertemanan sungguhan.</strong> Pengujian solo tidak akan memberi tahu Anda apakah dinamika sosialnya berfungsi.</p>
<p>Game yang menang bukanlah yang paling sempurna. Melainkan game yang memberi teman-teman alasan untuk tertawa bersama.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-yang-membuat-sebuah-game-co-op-bagus" tabindex="-1">Apa yang membuat sebuah game co-op bagus? <a class="header-anchor" href="#apa-yang-membuat-sebuah-game-co-op-bagus" aria-label="Permalink to &quot;Apa yang membuat sebuah game co-op bagus?&quot;"></a></h3>
<p>Game co-op terbaik menciptakan situasi ketika para pemain saling membutuhkan, tetapi juga saling menghalangi. Anda memerlukan momen-momen kacau yang berubah menjadi cerita untuk diceritakan kembali nantinya. Batas keterampilan awal yang rendah membantu karena tidak ada yang ingin menjadi teman yang tidak bisa memahami kontrol. Kondisi kegagalan yang lucu lebih penting daripada yang Anda kira. Ketika kekalahan tetap menghibur, orang akan terus bermain. Obrolan suara berbasis jarak menambahkan lapisan pengalaman yang tidak dapat ditiru oleh obrolan teks. Selain itu, pertahankan durasi sesi tetap singkat, sekitar 15 hingga 30 menit, agar orang dapat memainkan beberapa ronde dalam satu malam tanpa terasa seperti sebuah komitmen.</p>
<h3 id="mengapa-game-co-op-begitu-populer-saat-ini" tabindex="-1">Mengapa game co-op begitu populer saat ini? <a class="header-anchor" href="#mengapa-game-co-op-begitu-populer-saat-ini" aria-label="Permalink to &quot;Mengapa game co-op begitu populer saat ini?&quot;"></a></h3>
<p>Beberapa hal terjadi secara bersamaan. Lethal Company membuktikan pada 2023 bahwa seorang developer solo dapat membuat game co-op dan menjual jutaan kopi. Kemudian, Peak mencapai 11 juta kopi pada 2025 sebagai game yang bermula dari proyek game jam. Aspek ekonominya menjadi sulit diabaikan. Game-game ini murah untuk dibuat, menyebar dengan sangat cepat melalui kelompok pertemanan, dan menghasilkan klip yang menjadi viral di media sosial. Genre &quot;friend slop&quot;, sebagaimana orang menyebutnya, lebih menghargai keaslian daripada kesempurnaan. Anda tidak memerlukan studio besar atau anggaran besar. Anda memerlukan momen lucu dan teman-teman yang ingin membagikannya.</p>
<h3 id="bisakah-anda-membuat-game-co-op-untuk-browser" tabindex="-1">Bisakah Anda membuat game co-op untuk browser? <a class="header-anchor" href="#bisakah-anda-membuat-game-co-op-untuk-browser" aria-label="Permalink to &quot;Bisakah Anda membuat game co-op untuk browser?&quot;"></a></h3>
<p>Tentu saja. Game browser sebenarnya sangat cocok untuk co-op karena hambatan terbesar dalam bermain bersama teman adalah memastikan semuanya siap. Dengan game web, Anda cukup membagikan tautan dan semua orang langsung masuk. Tanpa unduhan, tanpa perbedaan versi, tanpa &quot;tunggu, aku harus memperbaruinya dahulu.&quot; Komponen teknisnya—multiplayer WebSocket, sinkronisasi fisika, bahkan obrolan suara dasar melalui WebRTC—semuanya dapat dibuat di browser. Kami memiliki <a href="/id/tutorials/websocket-multiplayer-basics.html">tutorial multiplayer WebSocket</a> yang membahas aspek jaringannya.</p>
<hr>
<p><strong>Terkait:</strong></p>
<ul>
<li><a href="/id/tutorials/websocket-multiplayer-basics.html">Dasar-Dasar Multiplayer WebSocket</a></li>
<li><a href="/id/guides/steam-next-fest-strategy.html">Strategi Steam Next Fest</a></li>
<li><a href="/id/guides/kickstarter-for-indie-games.html">Kickstarter untuk Game Indie</a></li>
<li><a href="/id/tutorials/gamepad-api.html">Gamepad API</a> — co-op lokal dengan beberapa kontroler</li>
<li><a href="/id/guides/game-jams-hackathons.html">Game Jam &amp; Hackathon</a> — game co-op dari game jam memperoleh lebih banyak penilaian dan dibagikan lebih sering</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — game co-op browser berkembang pesat di itch.io</li>
</ul>
<BuildCta
  title="Buat prototipe ide co-op Anda sendiri"
  desc="Mulailah dengan mekanisme inti dua karakter dan uji loop teka-tekinya."
  prompt="Buat game teka-teki tempat saya mengendalikan dua karakter dan berganti di antara keduanya untuk menekan sakelar" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/co-op-game-design.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Kickstarter untuk Game Indie pada 2026]]></title>
            <link>https://app.cinevva.com/id/guides/kickstarter-for-indie-games</link>
            <guid>https://app.cinevva.com/id/guides/kickstarter-for-indie-games</guid>
            <pubDate>Mon, 26 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Apa yang sebenarnya ditunjukkan oleh data, siapa yang berhasil, siapa yang gagal, dan apakah urun dana masuk akal untuk game Anda.]]></description>
            <content:encoded><![CDATA[<h1 id="kickstarter-untuk-game-indie-pada-2026" tabindex="-1">Kickstarter untuk Game Indie pada 2026 <a class="header-anchor" href="#kickstarter-untuk-game-indie-pada-2026" aria-label="Permalink to &quot;Kickstarter untuk Game Indie pada 2026&quot;"></a></h1>
<p>Mari kita bahas apa yang sebenarnya terjadi dengan urun dana game saat ini, karena kesannya tidak sesuai dengan data.</p>
<p>Masa keemasannya sudah berakhir. Pada 2013, video game menggalang $51 juta di Kickstarter. Pada 2024, jumlahnya turun menjadi $25,2 juta dari jumlah kampanye yang kurang lebih sama. Kuenya menyusut separuh, tetapi jumlah orang yang memperebutkan potongannya hampir tidak berubah. Itulah perhitungan yang akan Anda hadapi.</p>
<p>Meski begitu, developer terus beralih ke Kickstarter. Penerbit mengatakan tidak. Investor menjadi waswas akibat gelombang PHK. Sekitar 15.000 pekerjaan di industri game lenyap pada 2024 saja, dan para pelacak mencatat bahwa jumlah sebenarnya kemungkinan lebih tinggi karena tidak semua pemangkasan dilaporkan. Bagi banyak tim, urun dana bukan lagi Rencana A. Ini adalah cadangan ketika semua opsi lain gagal.</p>
<h2 id="dua-kisah-dari-2025" tabindex="-1">Dua Kisah dari 2025 <a class="header-anchor" href="#dua-kisah-dari-2025" aria-label="Permalink to &quot;Dua Kisah dari 2025&quot;"></a></h2>
<h3 id="yang-berhasil" tabindex="-1">Yang Berhasil <a class="header-anchor" href="#yang-berhasil" aria-label="Permalink to &quot;Yang Berhasil&quot;"></a></h3>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/mrvpsBjg4nI" title="Trailer Elestrals Awakened" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p><strong>Elestrals Awakened</strong> menggalang lebih dari $1,3 juta dari lebih dari 9.000 pendukung, menjadikannya video game dengan pendanaan terbesar di Kickstarter pada 2025. Siapa tim di baliknya? Seorang mantan komentator Pokemon Championship dengan hampir satu juta pelanggan YouTube, serta dua Kickstarter sukses yang sudah mereka jalankan (sebuah game kartu koleksi dan versi digitalnya). Mereka memiliki audiens. Mereka memiliki rekam jejak. Mereka telah membangun komunitas selama bertahun-tahun sebelum meminta uang.</p>
<p><a href="https://www.kickstarter.com/projects/elestrals/elestrals-awakened" target="_blank" class="campaign-link">Lihat Kickstarter Elestrals Awakened →</a></p>
<h3 id="yang-tidak-berhasil" tabindex="-1">Yang Tidak Berhasil <a class="header-anchor" href="#yang-tidak-berhasil" aria-label="Permalink to &quot;Yang Tidak Berhasil&quot;"></a></h3>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/dAzaaBUqki4" title="Trailer Alzara Radiant Echoes" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p><strong>Alzara: Radiant Echoes</strong> menggalang €300.000 dari lebih dari 5.000 pendukung pada 2024. Salah satu kampanye video game dengan pendukung terbanyak pada tahun itu. Studionya, Camelia, ditutup pada April 2025. Tidak ada game. Tidak ada pengembalian dana. Tim tersebut memiliki demo yang bisa dimainkan, anggota senior, separuh pendanaan yang sudah terjamin, dan keberhasilan Kickstarter sebagai bukti minat pasar. Mereka melakukan presentasi di Tokyo Game Show, DICE, dan setiap acara industri yang bisa mereka temukan. Tidak ada yang tertarik.</p>
<blockquote>
<p>&quot;Ini merupakan bagian dari kenyataan pahit industri ini. Terkadang, bahkan konsep game yang menjanjikan dengan minat pasar yang sudah terbukti dan tim yang kuat pun tidak cukup.&quot;</p>
<p>— Studio Camelia, pembaruan terakhir kepada para pendukung</p>
</blockquote>
<p><a href="https://www.kickstarter.com/projects/studiocamelia/seed-a-vibrant-tribute-to-jrpg-classics" target="_blank" class="campaign-link">Lihat Kickstarter Alzara (diarsipkan) →</a></p>
<p>Dua kampanye. Keduanya &quot;sukses&quot; menurut definisi Kickstarter. Salah satunya tidak menghasilkan apa pun. Perbedaannya bukan pada uang yang digalang. Perbedaannya adalah segala hal yang terjadi sebelumnya.</p>
<h2 id="angka-angka-yang-penting" tabindex="-1">Angka-Angka yang Penting <a class="header-anchor" href="#angka-angka-yang-penting" aria-label="Permalink to &quot;Angka-Angka yang Penting&quot;"></a></h2>
<p>Data dari 17.000 kampanye Kickstarter sejak 2009 menunjukkan gambaran yang jelas:</p>
<p><strong>Besarnya target memprediksi keberhasilan.</strong> Tidak satu pun dari 15 kampanye yang menargetkan $2,5 juta atau lebih berhasil. Namun, game dengan target di bawah $500 ribu sering kali melampaui target. Shenmue 3 meminta $2 juta dan mendapatkan $6,3 juta. Bloodstained meminta $500 ribu dan mendapatkan $5,5 juta. Tetapkan target yang dapat didukung bersama oleh orang-orang, lalu lampaui dengan jauh.</p>
<p><strong>Waktu peluncuran berpengaruh.</strong> Desember adalah bulan terburuk untuk meluncurkan kampanye (tingkat keberhasilan 28%). Februari adalah yang terbaik (35%). Rata-rata keseluruhannya adalah 32%. Ya, dua pertiga kampanye gagal.</p>
<p><strong>Sebagian besar uang berasal dari kampanye berskala sederhana.</strong> Sebanyak 81,8% dari seluruh dana yang digalang berasal dari kampanye dengan target $500 ribu atau kurang. Sebanyak 68,1% berasal dari kampanye di bawah $250 ribu. Kampanye raksasa memang menjadi berita utama, tetapi kampanye berskala menengahlah yang benar-benar mendapatkan pendanaan.</p>
<p>Angka tahun 2025 kini telah tersedia, dan menunjukkan gambaran yang lebih kompleks daripada tren penurunan jangka panjang. Video game mencatat 443 kampanye sukses pada 2025, dengan dana yang digalang hanya sedikit di bawah sekitar $26 juta pada 2024. Perubahan menarik terjadi di tingkat teratas: 11 kampanye melampaui $500.000, jumlah terbanyak dalam kategori tersebut sejak 2015 dan lebih dari dua kali lipat jumlah pada 2024. Total dananya tidak bertambah, tetapi kampanye besar yang dipersiapkan dengan baik mulai kembali.</p>
<h2 id="apa-yang-sebenarnya-bisa-anda-dapatkan-dengan-50-000" tabindex="-1">Apa yang Sebenarnya Bisa Anda Dapatkan dengan $50.000 <a class="header-anchor" href="#apa-yang-sebenarnya-bisa-anda-dapatkan-dengan-50-000" aria-label="Permalink to &quot;Apa yang Sebenarnya Bisa Anda Dapatkan dengan $50.000&quot;"></a></h2>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/BoqbkWJqlVY" title="Trailer Kickstarter Space Chef" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p>Berikut adalah evaluasi pascaproyek dari tim <strong>Space Chef</strong>, yang menggalang $50.000 dari 1.119 pendukung:</p>
<blockquote>
<p>&quot;Untuk mendapatkan $50.000, kami harus menghabiskan lebih dari $20.000 untuk pemasaran, iklan, dan kreator. Trailernya membutuhkan waktu 3 bulan untuk dibuat. Kickstarter bukan uang gratis. Ini adalah komitmen bertahun-tahun kepada ratusan orang.&quot;</p>
</blockquote>
<p>Perhitungan mereka:</p>
<table tabindex="0">
<thead>
<tr>
<th>Komponen</th>
<th>Jumlah</th>
</tr>
</thead>
<tbody>
<tr>
<td>Dana yang digalang</td>
<td>$50.000</td>
</tr>
<tr>
<td>Pemasaran</td>
<td>-$20.000</td>
</tr>
<tr>
<td>Biaya &amp; pajak</td>
<td>-$4.000</td>
</tr>
<tr>
<td><strong>Tersisa untuk pengembangan</strong></td>
<td><strong>$26.000</strong></td>
</tr>
</tbody>
</table>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 380" role="img" aria-label="Alokasi dana 50.000 dolar yang digalang di Kickstarter: 50.000 dolar berhasil digalang, dikurangi 20.000 untuk pemasaran, dikurangi 4.000 untuk biaya dan pajak, menyisakan 26.000 dolar untuk pengembangan" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="380" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Alokasi sebenarnya dari dana $50.000</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Space Chef, $50.000 dari 1.119 pendukung. Sumber: evaluasi pascaproyek developer.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="11" fill="#5b6472">
    <g stroke="#ffffff" stroke-opacity="0.07">
      <line x1="70" y1="100" x2="690" y2="100"/>
      <line x1="70" y1="140" x2="690" y2="140"/>
      <line x1="70" y1="180" x2="690" y2="180"/>
      <line x1="70" y1="220" x2="690" y2="220"/>
      <line x1="70" y1="260" x2="690" y2="260"/>
    </g>
    <line x1="70" y1="300" x2="690" y2="300" stroke="#ffffff" stroke-opacity="0.16"/>
    <text x="60" y="104" text-anchor="end">$50k</text>
    <text x="60" y="144" text-anchor="end">$40k</text>
    <text x="60" y="184" text-anchor="end">$30k</text>
    <text x="60" y="224" text-anchor="end">$20k</text>
    <text x="60" y="264" text-anchor="end">$10k</text>
    <text x="60" y="304" text-anchor="end">$0</text>
  </g>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <g stroke="#9aa7b4" stroke-opacity="0.45" stroke-dasharray="4 4">
      <line x1="200" y1="100" x2="250" y2="100"/>
      <line x1="360" y1="180" x2="410" y2="180"/>
      <line x1="520" y1="196" x2="570" y2="196"/>
    </g>
    <rect x="90" y="100" width="110" height="200" rx="6" fill="#7dd3fc"/>
    <rect x="250" y="100" width="110" height="80" rx="6" fill="#fb7185"/>
    <rect x="410" y="180" width="110" height="16" rx="4" fill="#fb7185"/>
    <rect x="570" y="196" width="110" height="104" rx="6" fill="#6ee7b7"/>
    <g text-anchor="middle" font-weight="800" font-size="14">
      <text x="145" y="92" fill="#7dd3fc">$50.000</text>
      <text x="305" y="92" fill="#fb7185">&#8722;$20.000</text>
      <text x="465" y="172" fill="#fb7185">&#8722;$4.000</text>
      <text x="625" y="188" fill="#6ee7b7">$26.000</text>
    </g>
    <g text-anchor="middle" font-size="12.5" font-weight="700" fill="#e8edf5">
      <text x="145" y="322">Dana digalang</text>
      <text x="305" y="322">Pemasaran</text>
      <text x="465" y="322">Biaya &amp; pajak</text>
      <text x="625" y="322">Untuk pengembangan</text>
    </g>
  </g>
</svg>
<p>Dengan tarif $20/jam, jumlah itu setara dengan 1.300 jam. Sekitar 32 minggu. Sama sekali tidak cukup untuk menyelesaikan game mereka.</p>
<p>Pada akhirnya, mereka mendapatkan investasi dari penerbit untuk menyelesaikannya. Kickstarter tidak mendanai game tersebut. Kickstarter membuktikan bahwa game itu layak didanai.</p>
<p><a href="https://www.kickstarter.com/projects/bluegoogames/space-chef" target="_blank" class="campaign-link">Lihat Kickstarter Space Chef →</a></p>
<h2 id="kapan-kickstarter-masuk-akal" tabindex="-1">Kapan Kickstarter Masuk Akal <a class="header-anchor" href="#kapan-kickstarter-masuk-akal" aria-label="Permalink to &quot;Kapan Kickstarter Masuk Akal&quot;"></a></h2>
<p>Kickstarter efektif ketika Anda menggunakannya untuk validasi, bukan sebagai penyelamat.</p>
<p><strong>Alasan yang baik untuk menjalankan kampanye:</strong></p>
<ul>
<li>Anda memiliki audiens yang sudah meminta game Anda</li>
<li>Anda memerlukan bukti permintaan pasar untuk menarik penerbit</li>
<li>Anda ingin membangun komunitas yang secara harfiah berinvestasi dalam keberhasilan Anda</li>
<li>Anda memiliki rekam jejak (game sebelumnya, proyek sukses, keahlian yang terlihat)</li>
</ul>
<p><strong>Alasan yang buruk:</strong></p>
<ul>
<li>Anda membutuhkan uang untuk memulai pengembangan</li>
<li>Anda belum memiliki audiens</li>
<li>Anda berharap kampanye itu sendiri akan membangun kesadaran</li>
<li>Anda tidak mampu menanggung kegagalan</li>
</ul>
<h2 id="kenyataan-pahit" tabindex="-1">Kenyataan Pahit <a class="header-anchor" href="#kenyataan-pahit" aria-label="Permalink to &quot;Kenyataan Pahit&quot;"></a></h2>
<p><strong>Anda mungkin tidak bisa menyelesaikan game hanya dengan uang Kickstarter.</strong> Sebagian besar kampanye sukses hanya menutup 25–50% dari biaya pengembangan sebenarnya. Sisanya berasal dari penerbit, hibah, tabungan, atau pekerjaan utama.</p>
<p><strong>Pendukung Anda tidak bisa mendapatkan pengembalian dana jika Anda gagal.</strong> Mereka mengetahui hal ini. Mereka semakin skeptis terhadap kreator pemula. Studio yang sudah merilis game atau memiliki rekam jejak terbukti mendapatkan lebih banyak kepercayaan.</p>
<p><strong>Menjalankan kampanye adalah pekerjaan penuh waktu.</strong> Pembaruan setiap beberapa hari. Pesan dari pendukung. Menjangkau pers. Merencanakan target tambahan. Media sosial. Selama lebih dari 30 hari, Anda tidak membuat game. Anda memasarkannya.</p>
<p><strong>Tingkat keberhasilannya 32%.</strong> Artinya, 68% kampanye gagal. Jika meluncurkan kampanye tanpa persiapan, Anda hampir pasti termasuk dalam 68% tersebut.</p>
<h2 id="jika-anda-masih-ingin-melanjutkan" tabindex="-1">Jika Anda Masih Ingin Melanjutkan <a class="header-anchor" href="#jika-anda-masih-ingin-melanjutkan" aria-label="Permalink to &quot;Jika Anda Masih Ingin Melanjutkan&quot;"></a></h2>
<p>Lakukan ini sebelum meluncurkan kampanye:</p>
<ol>
<li>
<p><strong>Bangun audiens Anda terlebih dahulu.</strong> Kumpulkan 1.000–2.000 orang yang benar-benar menginginkan game Anda. Discord, milis, pengikut media sosial. Apa pun yang efektif.</p>
</li>
<li>
<p><strong>Miliki sesuatu yang bisa dimainkan.</strong> Demo, vertical slice, apa pun. Pemain sudah terlalu sering dikecewakan. Menunjukkan hasil lebih baik daripada memberi janji.</p>
</li>
<li>
<p><strong>Tetapkan target yang benar-benar bisa Anda capai.</strong> Mintalah jumlah yang dibutuhkan untuk menyelesaikannya, bukan jumlah yang ingin Anda miliki. Raih pendanaan dengan cepat, lalu kejar target tambahan.</p>
</li>
<li>
<p><strong>Rencanakan pekerjaan setelahnya.</strong> Pembaruan. Pemenuhan imbalan. Pengembangan bertahun-tahun dengan orang-orang yang terus mengawasi. Ini bukan transaksi. Ini adalah hubungan.</p>
</li>
</ol>
<p>Tim yang berhasil memperlakukan Kickstarter sebagai awal percakapan, bukan akhir dari masalah penggalangan dana. Yang lainnya memperlakukannya seperti tiket lotre.</p>
<p>Jangan menjadi tiket lotre.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apakah-kickstarter-masih-layak-untuk-game-indie" tabindex="-1">Apakah Kickstarter masih layak untuk game indie? <a class="header-anchor" href="#apakah-kickstarter-masih-layak-untuk-game-indie" aria-label="Permalink to &quot;Apakah Kickstarter masih layak untuk game indie?&quot;"></a></h3>
<p>Itu bergantung pada apa yang Anda miliki. Jika Anda mempunyai audiens, demo yang bisa dimainkan, dan ekspektasi realistis, Kickstarter dapat berhasil. Tingkat keberhasilan kampanye video game berada di kisaran 32%, yang bukan peluang bagus. Namun, tim dengan komunitas yang sudah ada dan rekam jejak sebelumnya meraih hasil yang jauh lebih baik daripada rata-rata tersebut. Pertanyaan sebenarnya adalah apakah Anda sudah melakukan persiapannya. Jika Anda meluncurkan kampanye dari nol tanpa pengikut, peluang Anda sangat kecil.</p>
<h3 id="berapa-banyak-uang-yang-digalang-game-indie-di-kickstarter" tabindex="-1">Berapa banyak uang yang digalang game indie di Kickstarter? <a class="header-anchor" href="#berapa-banyak-uang-yang-digalang-game-indie-di-kickstarter" aria-label="Permalink to &quot;Berapa banyak uang yang digalang game indie di Kickstarter?&quot;"></a></h3>
<p>Total dana untuk video game di Kickstarter terus menyusut. Jumlahnya mencapai puncak sekitar $51 juta pada 2013 dan turun menjadi sekitar $25,2 juta pada 2024. Sebagian besar kampanye sukses menggalang antara $10.000 dan $50.000. Hal yang sering dilupakan orang adalah seberapa banyak dana tersebut akan terpotong. Kickstarter mengambil sekitar 5%, pemrosesan pembayaran mengambil 3–5% lagi, lalu ada pemenuhan imbalan, pengiriman, dan pajak. Kampanye yang menggalang $50.000 mungkin hanya menyisakan $26.000 sebagai dana yang benar-benar bisa digunakan.</p>
<h3 id="berapa-persentase-kickstarter-game-yang-gagal" tabindex="-1">Berapa persentase Kickstarter game yang gagal? <a class="header-anchor" href="#berapa-persentase-kickstarter-game-yang-gagal" aria-label="Permalink to &quot;Berapa persentase Kickstarter game yang gagal?&quot;"></a></h3>
<p>Sekitar 68% kampanye video game di Kickstarter tidak mencapai target pendanaan. Angka tersebut cukup konsisten selama bertahun-tahun. Kampanye yang gagal biasanya memiliki beberapa kesamaan: tidak ada audiens yang sudah terbentuk, tidak ada demo yang bisa dimainkan, target pendanaan tidak realistis, atau diluncurkan pada periode yang padat tanpa cara untuk tampil menonjol.</p>
<hr>
<p><strong>Terkait:</strong></p>
<ul>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a></li>
<li><a href="/id/guides/game-jams-hackathons.html">Panduan Game Jam &amp; Hackathon</a></li>
<li><a href="/id/guides/steam-next-fest-strategy.html">Strategi Steam Next Fest</a> — membangun wishlist sebelum dan selama urun dana</li>
<li><a href="/id/guides/co-op-game-design.html">Desain Game Co-op</a> — game co-op mendorong pembagian organik di media sosial yang membantu kampanye</li>
</ul>
<BuildCta
  title="Pendukung mendanai yang bisa dimainkan, bukan yang baru dijanjikan"
  desc="Tautan demo langsung dalam presentasi Anda lebih meyakinkan daripada concept art."
  prompt="Buat level teaser yang bisa dimainkan untuk game eksplorasi yang nyaman" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/kickstarter-for-indie-games.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Strategi Steam Next Fest pada 2026]]></title>
            <link>https://app.cinevva.com/id/guides/steam-next-fest-strategy</link>
            <guid>https://app.cinevva.com/id/guides/steam-next-fest-strategy</guid>
            <pubDate>Mon, 26 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Apa kata data tentang wishlist, demo, dan pemilihan waktu untuk Steam Next Fest, berdasarkan angka nyata dari lebih dari 200 game serta faktor yang benar-benar mendorong visibilitas.]]></description>
            <content:encoded><![CDATA[<h1 id="strategi-steam-next-fest-pada-2026" tabindex="-1">Strategi Steam Next Fest pada 2026 <a class="header-anchor" href="#strategi-steam-next-fest-pada-2026" aria-label="Permalink to &quot;Strategi Steam Next Fest pada 2026&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<div class="stat-box">
<strong>Kalender 2026</strong><br>
Next Fest Juni 2026 berlangsung pada 15–22 Juni dan mencetak rekor dengan hampir 5.000 demo yang dapat dimainkan (<a href="https://partner.steamgames.com/doc/marketing/upcoming_events/nextfest/2026june" target="_blank">Steamworks</a>), yang makin menegaskan poin di bawah ini: di tengah persaingan sepadat itu, demo yang berhasil menonjol adalah demo yang sudah datang dengan audiens. Edisi berikutnya, <a href="https://partner.steamgames.com/doc/marketing/upcoming_events/nextfest/2026october" target="_blank">Oktober 2026</a>, berlangsung pada 19–26 Oktober. Ingat, sebuah game hanya boleh mengikuti satu Next Fest untuk selamanya, jadi pilih edisi yang sesuai dengan jadwal perilisan Anda.
</div>
<p>Begini masalahnya dengan Next Fest: semua orang memperlakukannya seperti lotre. Masukkan demo, silangkan jari, lalu berharap algoritma berpihak kepada Anda. Bukan begitu cara kerjanya.</p>
<p>Saya membaca laporan pascarilis secara obsesif. Ratusan laporan dari 2025 saja. Polanya begitu konsisten sampai nyaris membosankan: game yang &quot;menang&quot; di Next Fest bukan baru menemukan kesuksesan selama festival. Mereka memperbesar momentum yang sudah dibangun sebelumnya.</p>
<p>Mari saya tunjukkan maksudnya.</p>
<h2 id="rumus-yang-tidak-ingin-didengar-siapa-pun" tabindex="-1">Rumus yang Tidak Ingin Didengar Siapa Pun <a class="header-anchor" href="#rumus-yang-tidak-ingin-didengar-siapa-pun" aria-label="Permalink to &quot;Rumus yang Tidak Ingin Didengar Siapa Pun&quot;"></a></h2>
<div class="stat-box">
<strong>Wishlist Sebelum Festival × 2 = Wishlist yang Diperoleh</strong><br>
Rasio ini muncul berulang kali dalam berbagai laporan pascarilis.
</div>
<p>Eilean Mor memasuki Oktober 2025 dengan 2.117 wishlist. Game ini memperoleh 2.082 selama festival. Hampir tepat 2×.</p>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/jFv7SjsQEws" title="Trailer Eilean Mor: The Lost Keepers" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p>Dice of Kalma masuk dengan 335 wishlist. Game ini memperoleh 659. Sedikit di bawah 2×. Pengembangnya menulis: &quot;Wishlist kami hampir tiga kali lipat, dan itu luar biasa, tetapi masih banyak pekerjaan yang harus kami lakukan.&quot;</p>
<p>Itulah kenyataan yang tidak nyaman. Next Fest menggandakan apa yang sudah Anda miliki. Jika Anda tidak punya apa-apa, yang digandakan pun tetap tidak ada.</p>
<p><a href="https://store.steampowered.com/app/3871570/Eilean_Mor_The_Lost_Keepers/" target="_blank" class="campaign-link">Lihat Eilean Mor di Steam →</a></p>
<h2 id="jurang-2-000-wishlist" tabindex="-1">Jurang 2.000 Wishlist <a class="header-anchor" href="#jurang-2-000-wishlist" aria-label="Permalink to &quot;Jurang 2.000 Wishlist&quot;"></a></h2>
<p>Data dari 208 game pada Februari 2025 menunjukkan titik perubahan tajam pada angka 2.000 wishlist.</p>
<table tabindex="0">
<thead>
<tr>
<th>Wishlist Awal</th>
<th>Yang Terjadi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Di bawah 1.000</td>
<td>Anda tidak terlihat setelah hari ke-2. Tidak ada satu pun game yang naik tingkat.</td>
</tr>
<tr>
<td>1.000–2.000</td>
<td>Kenaikan sedang. Anda tetap di kelas yang sama.</td>
</tr>
<tr>
<td>2.000+</td>
<td>Algoritma mulai membantu Anda. Momentum nyata menjadi mungkin.</td>
</tr>
<tr>
<td>10.000+</td>
<td>Tingkat emas. Kemungkinan besar memperoleh kenaikan kuat.</td>
</tr>
<tr>
<td>100.000+</td>
<td>Tingkat berlian. Anda bersaing memperebutkan posisi di tangga teratas.</td>
</tr>
</tbody>
</table>
<p>Berikut perkataan seorang pengembang dari survei tersebut: &quot;Anda benar-benar mulai melihat bagaimana perolehan wishlist sebuah game melesat pada game yang sudah memiliki lebih dari 2.000 wishlist sebelum Steam Next Fest.&quot;</p>
<p>Sebenarnya ini bukan semata-mata soal algoritma. Ini soal validasi. Memiliki 2.000 wishlist berarti Anda sudah menemukan sesuatu yang efektif dalam pemasaran. Anda tahu cara menjangkau orang. Keahlian itu menghasilkan efek berlipat selama festival.</p>
<h2 id="hal-yang-dikonfirmasi-februari-2026" tabindex="-1">Hal yang Dikonfirmasi Februari 2026 <a class="header-anchor" href="#hal-yang-dikonfirmasi-februari-2026" aria-label="Permalink to &quot;Hal yang Dikonfirmasi Februari 2026&quot;"></a></h2>
<p>Next Fest Februari 2026 (23 Februari hingga 2 Maret) merupakan edisi paling padat saat itu, dengan lebih dari 3.500 demo. Makin banyak pesertanya, makin keras pula data meneriakkan hal yang sama.</p>
<p>How To Market A Game kemudian menyurvei 182 pengembang. Hubungan terkuat dalam data tersebut adalah antara jumlah wishlist sebuah game sebelum festival dan wishlist yang diperolehnya selama acara: analisis independen terhadap data survei menunjukkan korelasi Spearman sebesar 0,825. Sebagai perbandingan, sebagian besar korelasi pemasaran dalam data game indie berada di antara 0,2 dan 0,4. Tidak ada faktor lain yang mendekatinya.</p>
<p>Kesenjangannya brutal. Demo median memperoleh 806 wishlist. Persentil ke-70 mencapai 1.839. Anda membutuhkan 13.461 untuk menembus persentil ke-95, sementara peraih tertinggi memperoleh 57.074. Demo yang diluncurkan tanpa pemanasan dan tanpa basis pengikut kira-kira hanya memiliki peluang 1 banding 20 untuk mencapai 5% teratas. Festival ini menghargai momentum yang Anda bawa. Festival ini tidak menciptakannya.</p>
<p>Data waktu juga mendukung aturan untuk merilis demo lebih awal. Dari game yang memperoleh lebih dari 15.000 wishlist, lima sudah merilis demo berbulan-bulan sebelumnya, empat merilisnya sekitar sebulan sebelumnya, dan hanya satu yang merilis mendadak beberapa hari sebelum festival.</p>
<h2 id="_48-jam-pertama-menentukan-segalanya" tabindex="-1">48 Jam Pertama Menentukan Segalanya <a class="header-anchor" href="#_48-jam-pertama-menentukan-segalanya" aria-label="Permalink to &quot;48 Jam Pertama Menentukan Segalanya&quot;"></a></h2>
<p>Valve memberi semua peserta kesempatan pada hari ke-1 dan ke-2. Setelah itu, algoritma memutuskan siapa yang layak mendapatkan visibilitas lebih besar berdasarkan performa.</p>
<p>Game tingkat perunggu? Impresi mereka jatuh dari tebing pada hari ke-3. Game tingkat berlian? Impresi mereka naik tiga kali lipat.</p>
<div class="stat-box">
<strong>Hari ke-1–2:</strong> Kerahkan semuanya. Lakukan siaran langsung. Buat postingan. Berkoordinasilah dengan kreator.<br>
<strong>Hari ke-3 dan seterusnya:</strong> Algoritma sudah mengambil keputusan. Anda tinggal mengikuti arus.
</div>
<h2 id="game-yang-benar-benar-menang-pada-2025" tabindex="-1">Game yang Benar-Benar Menang pada 2025 <a class="header-anchor" href="#game-yang-benar-benar-menang-pada-2025" aria-label="Permalink to &quot;Game yang Benar-Benar Menang pada 2025&quot;"></a></h2>
<h3 id="do-no-harm-februari-2025" tabindex="-1">Do No Harm (Februari 2025) <a class="header-anchor" href="#do-no-harm-februari-2025" aria-label="Permalink to &quot;Do No Harm (Februari 2025)&quot;"></a></h3>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/GBlOHAL1LkY" title="Trailer Do No Harm" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p><strong>Angkanya:</strong> memperoleh 45.655 wishlist selama Next Fest. Memulai dengan 52.102.</p>
<p><strong>Yang mereka lakukan:</strong></p>
<ul>
<li>Trailer dirilis di GameTrailers pada 29 Januari (beberapa minggu sebelum Next Fest)</li>
<li>Penjangkauan PR diatur bertepatan dengan trailer</li>
<li>Demo dirilis pada 4 Februari</li>
<li>Iklan berbayar untuk memperkuat momentum organik</li>
</ul>
<p>Inilah strategi yang harus diikuti. Mereka tidak mengandalkan Next Fest agar ditemukan. Mereka menggunakan Next Fest untuk melipatgandakan perhatian yang sudah diperoleh.</p>
<p><a href="https://store.steampowered.com/app/3138780/Do_No_Harm/" target="_blank" class="campaign-link">Lihat Do No Harm di Steam →</a></p>
<h3 id="cairn-oktober-2025" tabindex="-1">Cairn (Oktober 2025) <a class="header-anchor" href="#cairn-oktober-2025" aria-label="Permalink to &quot;Cairn (Oktober 2025)&quot;"></a></h3>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/x6KWhvvk3bM" title="Trailer Tanggal Rilis Cairn" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p>Mencapai peringkat demo ke-5 pada hari pertama. Masuk dalam Sedang Tren Mendatang dan Demo Teratas pada hari ke-2.</p>
<p><strong>Yang mereka lakukan:</strong></p>
<ul>
<li>Demo diluncurkan pada Desember 2024 (10 bulan sebelum Next Fest mereka)</li>
<li>Memiliki 32.000 pengikut sebelum festival</li>
<li>Diterima di 18 festival sebelum Next Fest</li>
<li>The Game Bakers (Furi, Haven) — studio mapan dengan rekam jejak</li>
</ul>
<p>Mereka tidak membutuhkan Next Fest. Namun mereka tetap memanfaatkannya karena acara ini memberikan amplifikasi gratis setelah Anda menyelesaikan pekerjaannya.</p>
<p><a href="https://store.steampowered.com/app/1588550/Cairn/" target="_blank" class="campaign-link">Lihat Cairn di Steam →</a></p>
<h3 id="yapyap-oktober-2025" tabindex="-1">YAPYAP (Oktober 2025) <a class="header-anchor" href="#yapyap-oktober-2025" aria-label="Permalink to &quot;YAPYAP (Oktober 2025)&quot;"></a></h3>
<div class="video-embed">
<iframe width="560" height="315" src="https://www.youtube.com/embed/7d8Fd9XXAtQ" title="Gameplay Demo YAPYAP" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<p>Fenomena &quot;friend slop&quot;. Game horor kooperatif yang memungkinkan Anda bermain sebagai penyihir yang merusak sebuah menara. Menjadi viral di media sosial, lalu mendominasi Next Fest.</p>
<p>Trailer mereka dirilis pada 25 Agustus 2025 — satu bulan sebelum Next Fest. Trailer itu meraih 434 ribu tayangan. Itulah titik baliknya. Semua yang terjadi setelahnya hanyalah menunggangi gelombang tersebut.</p>
<p><a href="https://store.steampowered.com/app/3834090/YAPYAP/" target="_blank" class="campaign-link">Lihat YAPYAP di Steam →</a></p>
<h2 id="genre-yang-terus-menang" tabindex="-1">Genre yang Terus Menang <a class="header-anchor" href="#genre-yang-terus-menang" aria-label="Permalink to &quot;Genre yang Terus Menang&quot;"></a></h2>
<p>Dari tingkat berlian Februari 2025:</p>
<ul>
<li><strong>Horor</strong> (×2) — Steam menyukai horor. Selalu begitu.</li>
<li><strong>Strategi/Manajemen</strong> (×4) — nuansanya adalah &quot;merakit-membangun-simulasi&quot;</li>
<li><strong>Game kooperatif &quot;friend slop&quot;</strong> — Lethal Company membuka pintu air</li>
<li><strong>Point-and-click</strong> (×2) — tetapi keduanya merupakan sekuel dengan audiens yang sudah ada</li>
</ul>
<p>Hal tentang point-and-click ini menarik. Beholder: Conductor adalah game keempat dalam serinya. Duck Detective adalah sekuel. Keduanya memiliki audiens bawaan. Pengembang point-and-click pemula tidak mendapatkan hasil seperti itu.</p>
<h2 id="apa-kata-game-game-kecil" tabindex="-1">Apa Kata Game-Game Kecil <a class="header-anchor" href="#apa-kata-game-game-kecil" aria-label="Permalink to &quot;Apa Kata Game-Game Kecil&quot;"></a></h2>
<p>Tidak semua orang mengejar tingkat berlian. Berikut laporan pengembang dari skala yang lebih kecil pada Oktober 2025:</p>
<blockquote>
<p>&quot;Tingkat konversi dari kunjungan menjadi wishlist mencapai 62%. Halaman toko itu sendiri tampaknya berfungsi. Namun impresinya tinggi dan orang-orang tidak mengeklik. Gambar kapsul perlu diperbarui.&quot;</p>
</blockquote>
<blockquote>
<p>&quot;Sebanyak 57% pengunjung toko memainkan demo kami. Itu terdengar tinggi, bukan? Namun hanya 15% pemain yang juga memasukkannya ke wishlist. Ada sesuatu yang tidak memenuhi ekspektasi.&quot;</p>
</blockquote>
<blockquote>
<p>&quot;Saya diblokir permanen dari r/cozygames karena bertanya apakah mereka menganggap game kami cozy. Saya selalu berusaha mengikuti aturan, tetapi ini cukup mengejutkan.&quot;</p>
</blockquote>
<p>Perjuangannya nyata. Para pengembang ini menguji gambar kapsul, menyesuaikan tag, dan diblokir dari subreddit. Tidak ada sisi glamornya.</p>
<h2 id="strategi-yang-apa-adanya" tabindex="-1">Strategi yang Apa Adanya <a class="header-anchor" href="#strategi-yang-apa-adanya" aria-label="Permalink to &quot;Strategi yang Apa Adanya&quot;"></a></h2>
<p><strong>Beberapa bulan sebelum Next Fest:</strong></p>
<ol>
<li>Rilis demo Anda lebih awal. Jauh lebih awal. Para pemenang sudah merilis demo selama 6–12 bulan.</li>
<li>Ikuti festival genre yang lebih kecil terlebih dahulu. Gunakan sebagai kesempatan untuk memoles game.</li>
<li>Bangun hingga lebih dari 2.000 wishlist. Itulah ambang batas Anda yang sebenarnya.</li>
</ol>
<p><strong>Selama Next Fest:</strong></p>
<ol>
<li>Hari ke-1–2 menentukan keberhasilan atau kegagalan. Kerahkan semuanya.</li>
<li>Lakukan siaran langsung jika bisa. Ini akan ditampilkan sebagai &quot;live&quot; di halaman Anda.</li>
<li>Berkoordinasilah dengan streamer. Bayar mereka jika perlu.</li>
<li>Letakkan demo Anda di halaman Steam terpisah agar dapat mengumpulkan ulasan.</li>
</ol>
<p><strong>Setelah Next Fest:</strong></p>
<ol>
<li>Jangan langsung merilis game. Merilisnya beberapa minggu kemudian justru menghasilkan performa yang lebih baik.</li>
<li>Manfaatkan momentumnya untuk pemasaran perilisan game Anda yang sebenarnya.</li>
</ol>
<h2 id="kapan-sebaiknya-tidak-ikut" tabindex="-1">Kapan Sebaiknya Tidak Ikut <a class="header-anchor" href="#kapan-sebaiknya-tidak-ikut" aria-label="Permalink to &quot;Kapan Sebaiknya Tidak Ikut&quot;"></a></h2>
<p>Jujur saja: Next Fest bukan untuk semua orang.</p>
<p>Jangan ikut jika:</p>
<ul>
<li>Anda memiliki kurang dari 1.000 wishlist (Anda tidak akan terlihat pada hari ke-3)</li>
<li>Demo Anda belum dipoles (Anda hanya punya satu kesempatan untuk menciptakan kesan pertama)</li>
<li>Ini adalah festival pertama Anda (ikuti festival yang lebih kecil terlebih dahulu)</li>
<li>Anda akan langsung merilis game setelahnya (tunggu beberapa minggu)</li>
</ul>
<p>Ada puluhan festival kecil setiap bulan. Audiensnya lebih terarah. Persaingannya lebih rendah. Lihat daftarnya di <a href="https://howtomarketagame.com/festivals" target="_blank" rel="noreferrer">howtomarketagame.com/festivals</a>.</p>
<p>Next Fest menjadi pilihan standar karena Valve meminta semua orang untuk bergabung. Namun pemasaran terbaik bukanlah aktivitas yang disarankan kepada semua orang.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="berapa-banyak-wishlist-yang-anda-perlukan-untuk-steam-next-fest" tabindex="-1">Berapa banyak wishlist yang Anda perlukan untuk Steam Next Fest? <a class="header-anchor" href="#berapa-banyak-wishlist-yang-anda-perlukan-untuk-steam-next-fest" aria-label="Permalink to &quot;Berapa banyak wishlist yang Anda perlukan untuk Steam Next Fest?&quot;"></a></h3>
<p>Data menunjukkan sekitar 2.000 wishlist sebagai ambang batas ketika Next Fest mulai menguntungkan Anda. Di bawah angka itu, pada dasarnya Anda tidak akan terlihat pada hari ketiga. Algoritma mengutamakan game yang sudah mendapatkan daya tarik, jadi Anda perlu membawa momentum. Pola kasarnya dari festival Februari 2025 adalah: berapa pun jumlah wishlist Anda sebelum Next Fest, Anda bisa kira-kira menggandakannya selama acara. Jadi, jika masuk dengan 500, Anda mungkin keluar dengan 1.000. Masuk dengan 5.000, Anda bisa mencapai 10.000. Angka awal jauh lebih penting daripada yang disadari kebanyakan orang.</p>
<h3 id="kapan-sebaiknya-anda-merilis-demo-untuk-steam-next-fest" tabindex="-1">Kapan sebaiknya Anda merilis demo untuk Steam Next Fest? <a class="header-anchor" href="#kapan-sebaiknya-anda-merilis-demo-untuk-steam-next-fest" aria-label="Permalink to &quot;Kapan sebaiknya Anda merilis demo untuk Steam Next Fest?&quot;"></a></h3>
<p>Lebih awal daripada yang mungkin Anda kira. Game dengan performa terbaik dalam festival baru-baru ini sudah merilis demo selama 6 hingga 12 bulan sebelum Next Fest dimulai. Ini memberi Anda waktu untuk mengumpulkan masukan, memperbaiki masalah yang jelas, dan membangun wishlist secara organik sebelum festival melipatgandakan apa pun yang sudah Anda miliki. Merilis demo pada minggu berlangsungnya Next Fest adalah kesalahan umum. Anda bersaing dengan ratusan demo baru lainnya tanpa ulasan, tanpa siklus umpan balik, dan tanpa bekal apa pun.</p>
<h3 id="apakah-steam-next-fest-layak-diikuti-oleh-game-indie-kecil" tabindex="-1">Apakah Steam Next Fest layak diikuti oleh game indie kecil? <a class="header-anchor" href="#apakah-steam-next-fest-layak-diikuti-oleh-game-indie-kecil" aria-label="Permalink to &quot;Apakah Steam Next Fest layak diikuti oleh game indie kecil?&quot;"></a></h3>
<p>Bisa, tetapi hanya jika Anda siap. Game kecil yang masuk dengan kurang dari 1.000 wishlist dan demo yang belum dipoles biasanya cepat terkubur. Festival ini berlangsung selama seminggu dan ada ratusan game yang bersaing mendapatkan perhatian. Jika Anda masih berada di tahap awal pengembangan, festival kecil yang khusus untuk genre tertentu merupakan langkah pertama yang lebih baik. Festival semacam itu memiliki audiens yang lebih terarah dan persaingan yang lebih rendah. Simpan kesempatan mengikuti Next Fest sampai demo Anda benar-benar matang dan Anda sudah memiliki momentum.</p>
<hr>
<p><strong>Terkait:</strong></p>
<ul>
<li><a href="/id/guides/kickstarter-for-indie-games.html">Kickstarter untuk Game Indie</a></li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a></li>
<li><a href="/id/guides/co-op-game-design.html">Desain Game Kooperatif</a> — game kooperatif secara konsisten mencatat performa di atas rata-rata pada Next Fest</li>
<li><a href="/id/tutorials/analytics-web-games.html">Analitik untuk game web</a> — melacak performa demo dan metrik konversi</li>
<li><a href="/id/guides/game-jams-hackathons.html">Game Jam &amp; Hackathon</a> — membangun audiens sebelum festival pertama Anda</li>
</ul>
<BuildCta
  title="Latih daya pikat dalam 30 detik pertama"
  desc="Next Fest menguntungkan demo yang langsung memikat. Buat prototipe daya pikat itu sekarang."
  prompt="Buat level demo yang dapat dimainkan dengan daya pikat dalam 30 detik pertama" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/steam-next-fest-strategy.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Model AI Generatif Sumber Terbuka Terbaik untuk Game (2026)]]></title>
            <link>https://app.cinevva.com/id/guides/frontier-gen-ai-models</link>
            <guid>https://app.cinevva.com/id/guides/frontier-gen-ai-models</guid>
            <pubDate>Sat, 24 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Model AI generatif sumber terbuka terbaik pada 2026 untuk video, gambar, 3D, audio, ucapan, dan simulasi dunia, termasuk keunggulan masing-masing dan biaya untuk menjalankannya.]]></description>
            <content:encoded><![CDATA[<h1 id="model-ai-generatif-sumber-terbuka-terbaik-untuk-game-2026" tabindex="-1">Model AI Generatif Sumber Terbuka Terbaik untuk Game (2026) <a class="header-anchor" href="#model-ai-generatif-sumber-terbuka-terbaik-untuk-game-2026" aria-label="Permalink to &quot;Model AI Generatif Sumber Terbuka Terbaik untuk Game (2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Begini kenyataannya tentang AI generatif. Selama bertahun-tahun, model terbaik tersembunyi di balik kunci API dan harga yang tidak terduga. Anda membangun alur kerja dengan suatu alat, mulai terbiasa, lalu suatu pagi menerima email yang mengatakan bahwa harganya berubah. Atau lebih buruk lagi, perusahaannya mengubah arah sepenuhnya.</p>
<p>Hal itu berubah pada akhir 2024. Tencent, Alibaba, dan DeepSeek mulai merilis model yang benar-benar bisa Anda unduh. Model yang mampu menandingi alternatif tertutup. Dan tiba-tiba, kreator memiliki pilihan yang tidak bergantung pada model bisnis pihak lain.</p>
<p>Bagaimana jika Anda bisa menghasilkan video, aset 3D, musik, dan suara, semuanya dengan model yang Anda kendalikan? Itulah posisi kita sekarang. Panduan ini membahas apa yang benar-benar tersedia, apa yang berfungsi, dan apa yang bisa mulai Anda gunakan hari ini.</p>
<h2 id="pembuatan-video" tabindex="-1">Pembuatan Video <a class="header-anchor" href="#pembuatan-video" aria-label="Permalink to &quot;Pembuatan Video&quot;"></a></h2>
<p>Selama bertahun-tahun, pembuatan video identik dengan Runway atau Pika: platform tertutup, biaya langganan, dan batasan atas apa yang bisa Anda lakukan dengan hasilnya. Sekarang? Anda bisa menjalankan model sebanding di perangkat keras sendiri.</p>
<video controls autoplay loop muted playsinline style="width: 100%; border-radius: 8px;">
  <source src="https://cdn.cinevva.com/video/hunyuanvideo-demo.mp4" type="video/mp4">
</video>
<p><em>Pembuatan teks-ke-video HunyuanVideo, keluaran 720p dari model video sumber terbuka terdepan</em></p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Parameter</th>
<th>Spesifikasi</th>
<th>Perangkat keras</th>
<th>Biaya</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/Tencent-Hunyuan/HunyuanVideo" target="_blank" rel="noreferrer"><strong>HunyuanVideo</strong></a></td>
<td>Tencent</td>
<td>13B</td>
<td>720p, teks+gambar</td>
<td>80GB</td>
<td>~$0.20</td>
</tr>
<tr>
<td><a href="https://github.com/Tencent-Hunyuan/HunyuanVideo-1.5" target="_blank" rel="noreferrer"><strong>HunyuanVideo-1.5</strong></a></td>
<td>Tencent</td>
<td>8.3B</td>
<td>480p-1080p, teks+gambar</td>
<td>14GB</td>
<td>~$0.05</td>
</tr>
<tr>
<td><a href="https://github.com/genmoai/mochi" target="_blank" rel="noreferrer"><strong>Mochi 1</strong></a></td>
<td>Genmo</td>
<td>10B</td>
<td>480p@30fps</td>
<td>12GB+</td>
<td>~$0.10</td>
</tr>
<tr>
<td><a href="https://github.com/Lightricks/LTX-Video" target="_blank" rel="noreferrer"><strong>LTX-Video</strong></a></td>
<td>Lightricks</td>
<td>—</td>
<td>768x512, waktu nyata</td>
<td>12GB</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/Lightricks/LTX-2" target="_blank" rel="noreferrer"><strong>LTX-2</strong></a></td>
<td>Lightricks</td>
<td>19B</td>
<td>4K, <strong>audio tersinkronisasi</strong></td>
<td>Kelas atas</td>
<td>~$0.30</td>
</tr>
<tr>
<td><a href="https://github.com/Wan-Video/Wan2.1" target="_blank" rel="noreferrer"><strong>Wan 2.1</strong></a></td>
<td>Alibaba</td>
<td>1.3-14B</td>
<td>480p-720p</td>
<td>8GB+</td>
<td>~$0.03</td>
</tr>
<tr>
<td><a href="https://github.com/Wan-Video/Wan2.2" target="_blank" rel="noreferrer"><strong>Wan 2.2</strong></a></td>
<td>Alibaba</td>
<td>27B MoE (14B aktif)</td>
<td>720p, MoE</td>
<td>8GB+</td>
<td>~$0.03</td>
</tr>
<tr>
<td><a href="https://huggingface.co/zai-org/CogVideoX1.5-5B" target="_blank" rel="noreferrer"><strong>CogVideoX1.5-5B</strong></a></td>
<td>Tsinghua</td>
<td>5B</td>
<td>1360x768@16fps, hingga 10 dtk</td>
<td>12GB</td>
<td>~$0.04</td>
</tr>
<tr>
<td><a href="https://github.com/SkyworkAI/SkyReels-V3" target="_blank" rel="noreferrer"><strong>SkyReels-V3</strong></a></td>
<td>Skywork</td>
<td>14-19B</td>
<td>Digerakkan audio, referensi-ke-video, V2V</td>
<td>Kelas atas</td>
<td>~$0.10</td>
</tr>
<tr>
<td><a href="https://github.com/stepfun-ai/Step-Video-T2V" target="_blank" rel="noreferrer"><strong>Step-Video-T2V</strong></a></td>
<td>StepFun</td>
<td>30B</td>
<td>T2V terbuka terbesar, 204 bingkai</td>
<td>Kelas atas</td>
<td>~$0.15</td>
</tr>
<tr>
<td><a href="https://github.com/hpcaitech/Open-Sora" target="_blank" rel="noreferrer"><strong>Open-Sora 2.0</strong></a></td>
<td>HPC-AI</td>
<td>11B</td>
<td>Integrasi Flux</td>
<td>Kelas atas</td>
<td>~$0.20</td>
</tr>
</tbody>
</table>
<p>Bobot: <a href="https://huggingface.co/tencent/HunyuanVideo" target="_blank" rel="noreferrer">HunyuanVideo ↗</a> · <a href="https://huggingface.co/genmo/mochi-1-preview" target="_blank" rel="noreferrer">Mochi 1 ↗</a> · <a href="https://huggingface.co/Wan-AI/Wan2.1-T2V-14B" target="_blank" rel="noreferrer">Wan 2.1 ↗</a> · <a href="https://huggingface.co/hpcai-tech/Open-Sora-v2" target="_blank" rel="noreferrer">Open-Sora ↗</a></p>
<p><strong>Lihat contoh:</strong> <a href="https://aivideo.hunyuan.tencent.com/" target="_blank" rel="noreferrer">Galeri HunyuanVideo ↗</a> · <a href="https://www.genmo.ai/" target="_blank" rel="noreferrer">Contoh Mochi ↗</a> · <a href="https://github.com/THUDM/CogVideo#gallery" target="_blank" rel="noreferrer">Contoh CogVideoX ↗</a></p>
<h3 id="artinya-bagi-kreator" tabindex="-1">Artinya bagi kreator <a class="header-anchor" href="#artinya-bagi-kreator" aria-label="Permalink to &quot;Artinya bagi kreator&quot;"></a></h3>
<p><strong>HunyuanVideo</strong> mengungguli Runway Gen-3 dalam evaluasi profesional, dan sepenuhnya terbuka. Kekurangannya? Anda membutuhkan perangkat keras yang serius. A100 atau H100 dengan VRAM 80GB. Bagi kebanyakan dari kita, itu berarti menyewa GPU cloud saat dibutuhkan.</p>
<p><strong>HunyuanVideo-1.5</strong> mengubah perhitungan kebutuhan perangkat keras. Tencent merilisnya pada November 2025 sebagai model terbuka dengan 8,3 miliar parameter yang dapat berjalan pada GPU konsumen 14GB, dilengkapi teks-ke-video dan gambar-ke-video pada 480p/720p serta peningkatan resolusi opsional ke 1080p. Mekanisme Selective and Sliding Tile Attention (SSTA) baru membuat kecepatan inferensinya sekitar dua kali lipat dibandingkan HunyuanVideo asli. Jika Anda menginginkan kualitas HunyuanVideo tetapi tidak bisa membenarkan pembelian kartu 80GB, inilah versi yang benar-benar dapat Anda jalankan di rumah.</p>
<p><strong>Mochi 1</strong> adalah model yang benar-benar bisa Anda jalankan. GPU 12GB, setara kelas RTX 3060, dapat menanganinya dengan baik. Hasilnya benar-benar kreatif, dengan kualitas artistik yang khas. Ketepatannya belum menyamai HunyuanVideo, tetapi Anda mengendalikan prosesnya.</p>
<p><strong>LTX-2</strong> mulai menjadi sangat menarik untuk game. Ini adalah model terbuka pertama yang menghasilkan audio tersinkronisasi bersama video. Bayangkan adegan sinematik dengan suara yang langsung... cocok. Tanpa sinkronisasi pascaproduksi. Lightricks membuka bobot lengkap, kode inferensi, dan kode pelatihannya pada Januari 2026, dengan keluaran 4K native hingga 50fps dan audio tersinkronisasi hingga 20 detik. Ada satu catatan lisensi: bobot terbuka LTX-2 gratis untuk penggunaan akademis dan hanya gratis untuk penggunaan komersial oleh perusahaan dengan pendapatan tahunan di bawah $10 juta, jadi periksa ambang tersebut sebelum membangun bisnis di atasnya.</p>
<p><strong>SkyReels-V3</strong> (Skywork, Januari 2026) adalah lini terbuka baru yang patut diperhatikan. Ini merupakan model multimodal terpadu yang mampu membuat video berbasis audio, referensi-ke-video, dan video-ke-video dalam varian 14B dan 19B, sehingga sangat kuat ketika Anda membutuhkan karakter atau gambar referensi untuk mengarahkan pengambilan gambar. <strong>Step-Video-T2V</strong> (StepFun) adalah model teks-ke-video terbuka terbesar dengan 30B parameter dan dirilis di bawah lisensi MIT yang sederhana, layak diketahui jika lisensi permisif lebih penting bagi Anda daripada kemampuan menjalankannya pada GPU kecil.</p>
<p><strong>Wan 2.1</strong> dapat berjalan pada laptop gaming. GPU 8GB cukup untuk varian yang lebih kecil. Jika Anda ingin membuat prototipe dengan pembuatan video tetapi tidak bisa membenarkan kebutuhan perangkat kerasnya, inilah jalan masuk Anda.</p>
<p><strong>Wan 2.2</strong> (Alibaba, Juli 2025) adalah model video sumber terbuka pertama yang dibangun dengan desain Mixture-of-Experts: total 27B parameter dengan hanya 14B yang aktif pada setiap langkah. Model ini tersedia sebagai teks-ke-video (T2V-A14B), gambar-ke-video (I2V-A14B), dan varian hibrida 5B yang dapat berjalan pada GPU konsumen, semuanya di bawah Apache 2.0 untuk penggunaan komersial.</p>
<p>Ada satu hal yang perlu diketahui: Wan 2.2 masih menjadi versi Wan terbuka terakhir. Wan 2.5 (September 2025), 2.6 (Desember 2025), dan 2.7 (April 2026) yang lebih baru menambahkan audio tersinkronisasi, 1080p, dan kontrol bingkai yang lebih presisi, tetapi hanya tersedia melalui API tanpa bobot publik. Jika hosting mandiri penting bagi Anda, 2.2 adalah batas tertingginya. LTX-2 adalah model terbuka yang sebaiknya dipilih ketika Anda membutuhkan 4K dan audio tersinkronisasi.</p>
<p>Alur kerja yang masuk akal: Mochi 1 atau Wan 2.1 untuk membuat prototipe secara lokal. HunyuanVideo-1.5 atau LTX-2 pada GPU cloud ketika Anda membutuhkan kualitas akhir.</p>
<h2 id="pembuatan-gambar" tabindex="-1">Pembuatan Gambar <a class="header-anchor" href="#pembuatan-gambar" aria-label="Permalink to &quot;Pembuatan Gambar&quot;"></a></h2>
<p>Di bidang inilah sumber terbuka sudah menang. Model yang bisa Anda unduh hari ini benar-benar mampu bersaing dengan Midjourney. Bukan “hampir sama bagusnya”, tetapi benar-benar kompetitif.</p>
<p><img src="/img/ai-samples/flux-sample.png" alt="Contoh hasil FLUX.1">
<em>Contoh FLUX.1, kualitas fotorealistis dari model berlisensi Apache 2.0</em></p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Parameter</th>
<th>Fitur Utama</th>
<th>Lisensi</th>
<th>Biaya/gambar</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://huggingface.co/black-forest-labs/FLUX.1-schnell" target="_blank" rel="noreferrer"><strong>FLUX.1 [schnell]</strong></a></td>
<td>Black Forest Labs</td>
<td>Agu 2024</td>
<td>12B</td>
<td>Pembuatan 4 langkah, cepat</td>
<td>Apache 2.0</td>
<td>~$0.001</td>
</tr>
<tr>
<td><a href="https://huggingface.co/black-forest-labs/FLUX.1-dev" target="_blank" rel="noreferrer"><strong>FLUX.1 [dev]</strong></a></td>
<td>Black Forest Labs</td>
<td>Agu 2024</td>
<td>12B</td>
<td>Kualitas mendekati Pro</td>
<td>Nonkomersial</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://huggingface.co/stabilityai/stable-diffusion-3.5-large" target="_blank" rel="noreferrer"><strong>SD 3.5 Large</strong></a></td>
<td>Stability AI</td>
<td>Okt 2024</td>
<td>8B</td>
<td>Rendering teks, beragam gaya</td>
<td>Lisensi Stability</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://huggingface.co/stabilityai/stable-diffusion-3.5-large-turbo" target="_blank" rel="noreferrer"><strong>SD 3.5 Large Turbo</strong></a></td>
<td>Stability AI</td>
<td>Okt 2024</td>
<td>8B</td>
<td>4 langkah, cepat</td>
<td>Lisensi Stability</td>
<td>~$0.001</td>
</tr>
<tr>
<td><a href="https://huggingface.co/HiDream-ai/HiDream-I1-Full" target="_blank" rel="noreferrer"><strong>HiDream-I1</strong></a></td>
<td>HiDream.ai</td>
<td>Apr 2025</td>
<td>17B</td>
<td>Kualitas tinggi, varian Full/Dev/Fast</td>
<td>MIT</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://github.com/zai-org/CogView4" target="_blank" rel="noreferrer"><strong>CogView4</strong></a></td>
<td>Tsinghua / Zhipu</td>
<td>Mar 2025</td>
<td>6B</td>
<td>Teks Mandarin native, hingga 2048px</td>
<td>Apache 2.0</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://github.com/QwenLM/Qwen-Image" target="_blank" rel="noreferrer"><strong>Qwen-Image</strong></a></td>
<td>Alibaba</td>
<td>Agu 2025</td>
<td>20B</td>
<td>Rendering dan penyuntingan teks terbaik di kelasnya</td>
<td>Apache 2.0</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://bfl.ai/blog/flux-2" target="_blank" rel="noreferrer"><strong>FLUX.2</strong></a></td>
<td>Black Forest Labs</td>
<td>Nov 2025</td>
<td>32B</td>
<td>Teks+penyuntingan, 4MP, multireferensi</td>
<td>dev: Nonkomersial / klein 4B: Apache 2.0</td>
<td>~$0.003</td>
</tr>
<tr>
<td><a href="https://github.com/ideogram-oss/ideogram4" target="_blank" rel="noreferrer"><strong>Ideogram 4.0</strong></a></td>
<td>Ideogram</td>
<td>Jun 2026</td>
<td>9.3B</td>
<td>Pekerjaan desain, rendering teks, kontrol tata letak JSON</td>
<td>Nonkomersial</td>
<td>~$0.002</td>
</tr>
</tbody>
</table>
<p>Coba langsung: <a href="https://huggingface.co/spaces/black-forest-labs/FLUX.1-schnell" target="_blank" rel="noreferrer">Demo FLUX.1 schnell ↗</a> · <a href="https://huggingface.co/spaces/stabilityai/stable-diffusion-3.5-large" target="_blank" rel="noreferrer">Demo SD 3.5 Large ↗</a> · <a href="https://github.com/black-forest-labs/flux" target="_blank" rel="noreferrer">GitHub (FLUX) ↗</a></p>
<p><strong>Lihat contoh:</strong> <a href="https://flux1.ai/examples" target="_blank" rel="noreferrer">Galeri FLUX ↗</a> · <a href="https://flux1.ai/gallery" target="_blank" rel="noreferrer">Galeri FLUX LoRA ↗</a> · <a href="https://replicate.com/black-forest-labs/flux-schnell/examples" target="_blank" rel="noreferrer">Contoh Replicate ↗</a></p>
<h3 id="untuk-membuat-aset-game" tabindex="-1">Untuk membuat aset game <a class="header-anchor" href="#untuk-membuat-aset-game" aria-label="Permalink to &quot;Untuk membuat aset game&quot;"></a></h3>
<p><strong>FLUX.1 [schnell]</strong> adalah model yang perlu Anda kenal. Lisensi Apache 2.0 berarti Anda bisa merilis game komersial tanpa mencemaskan masalah lisensi. Model ini menghasilkan gambar hanya dalam 4 langkah, sehingga Anda dapat melakukan iterasi dengan cepat. Jelaskan yang Anda inginkan, lihat hasilnya, sesuaikan, lalu ulangi.</p>
<p><strong>SD 3.5 Large</strong> akhirnya mampu menangani rendering teks dengan benar. Versi sebelumnya merusak teks apa pun yang Anda coba sertakan. Hal ini penting untuk mockup UI, papan tanda dalam game, layar judul, dan di mana pun Anda membutuhkan kata-kata yang terbaca dalam gambar.</p>
<p><strong>FLUX.2</strong> (Black Forest Labs, November 2025) adalah penerus yang lebih besar: model 32B yang menangani teks-ke-gambar dan penyuntingan gambar dalam satu checkpoint, dengan konsistensi karakter/gaya multireferensi yang kuat serta rendering teks yang andal hingga 4 megapiksel. FLUX.2 [dev] berbobot terbuka menggunakan lisensi nonkomersial, tetapi FLUX.2 [klein] hasil distilasi ukuran (Januari 2026) merilis versi 4B di bawah Apache 2.0, menghasilkan gambar dalam waktu kurang dari satu detik, dan berjalan dengan sekitar 8GB VRAM. Jadi, tetap ada opsi yang aman secara komersial untuk merilis karya seni game. Gunakan klein 4B secara khusus: klein 9B yang lebih besar tetap berada di bawah lisensi FLUX nonkomersial. Pipeline terkuantisasi memungkinkan [dev] berjalan pada GPU 18-24GB.</p>
<p>Ada dua opsi terbuka lain yang patut diketahui. <strong>Chroma1-HD</strong> (8.9B, Apache 2.0) adalah turunan FLUX.1-schnell yang sepenuhnya terbuka, sehingga menjadi cara yang aman secara komersial untuk memperoleh kualitas keluarga FLUX tanpa lisensi [dev]. <strong>OmniGen2</strong> (Apache 2.0) adalah model terpadu yang menangani teks-ke-gambar sekaligus penyuntingan berbasis instruksi, sehingga menjadi jalur tercepat saat Anda mengiterasi aset yang sudah ada (“buat pedangnya bersinar biru”), alih-alih membuatnya dari awal.</p>
<p><strong>Qwen-Image</strong> (Alibaba, Agustus 2025) adalah model terbuka yang sebaiknya dipilih ketika karya seni Anda membutuhkan teks yang dapat dibaca, seperti papan tanda, UI, poster, atau label item. Ini adalah model 20B berlisensi Apache 2.0 dengan rendering teks terbaik di kelasnya dan varian penyuntingan berbasis instruksi yang kuat. Karena itu, model ini aman untuk penggunaan komersial dan sangat bagus dalam menangani hal yang masih sering gagal dilakukan sebagian besar model gambar. Pembaruan Desember 2025, <a href="https://huggingface.co/Qwen/Qwen-Image-2512" target="_blank" rel="noreferrer">Qwen-Image-2512</a>, meningkatkan realisme manusia dan tata letak teks serta tetap menggunakan lisensi Apache 2.0, jadi gunakan checkpoint tersebut jika Anda melakukan hosting mandiri. Qwen-Image-2.0 yang lebih baru (Februari 2026) hanya tersedia melalui API.</p>
<p><strong>Ideogram 4.0</strong> (Juni 2026) adalah rilis berbobot terbuka pertama dari Ideogram: diffusion transformer 9.3B yang dibuat untuk pekerjaan desain, dengan rendering teks multibahasa yang kuat serta kontrol eksplisit atas tata letak dan warna melalui prompt JSON terstruktur. Ada satu hal yang perlu diperhatikan sebelum Anda membangun sesuatu dengannya: kode inferensinya menggunakan Apache 2.0, tetapi bobotnya berada di bawah lisensi nonkomersial. Jadi, ini merupakan alat untuk riset dan pembuatan prototipe kecuali Anda membeli lisensi komersial.</p>
<p>Ekosistem di sekitar Stable Diffusion masih belum tertandingi. ControlNet untuk komposisi presisi. Inpainting untuk perbaikan. Fine-tuning LoRA untuk gaya khusus. FLUX mulai mengejar, tetapi jika Anda membutuhkan kustomisasi mendalam saat ini, kematangan perangkat SD memberi Anda lebih banyak pilihan.</p>
<p>Begini cara saya memandangnya: untuk tekstur dan sprite, keduanya bisa digunakan. Untuk concept art dengan persyaratan gaya tertentu, gunakan SD 3.5 dengan LoRA. Untuk kualitas murni dalam rilis komersial, gunakan FLUX schnell.</p>
<h2 id="pembuatan-3d" tabindex="-1">Pembuatan 3D <a class="header-anchor" href="#pembuatan-3d" aria-label="Permalink to &quot;Pembuatan 3D&quot;"></a></h2>
<p>Jika Anda pernah menghabiskan delapan jam untuk memodelkan properti yang hanya muncul selama tiga detik dalam game, bagian ini ditujukan untuk Anda. Pembuatan 3D telah beralih dari “riset menarik” menjadi alat produksi nyata sejak beberapa waktu lalu, dan pada 2026 model terbukanya benar-benar bagus. Anda dapat mengubah sketsa menjadi mesh bertekstur dalam waktu kurang dari satu menit.</p>
<p><img src="/img/ai-samples/trellis-sample.png" alt="Contoh pembuatan 3D TRELLIS">
<em>TRELLIS menghasilkan mesh 3D bertekstur dengan material PBR dari satu gambar</em></p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Fitur Utama</th>
<th>Keluaran</th>
<th>Biaya/mesh</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/microsoft/TRELLIS.2" target="_blank" rel="noreferrer"><strong>TRELLIS.2-4B</strong></a></td>
<td>Microsoft</td>
<td>Des 2025</td>
<td>4B parameter, PBR native, hingga 1536³</td>
<td>Mesh bertekstur dengan normal</td>
<td>~$0.03</td>
</tr>
<tr>
<td><a href="https://github.com/Tencent-Hunyuan/Hunyuan3D-2.1" target="_blank" rel="noreferrer"><strong>Hunyuan3D 2.1</strong></a></td>
<td>Tencent</td>
<td>Jun 2025</td>
<td>PBR siap produksi, bobot lengkap + kode pelatihan</td>
<td>Mesh bertekstur berketepatan tinggi</td>
<td>~$0.05</td>
</tr>
<tr>
<td><a href="https://github.com/facebookresearch/sam-3d-objects" target="_blank" rel="noreferrer"><strong>SAM 3D</strong></a></td>
<td>Meta</td>
<td>Nov 2025</td>
<td>Satu gambar ke 3D (objek + tubuh manusia)</td>
<td>Mesh dari satu foto</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/stabilityai/stable-fast-3d" target="_blank" rel="noreferrer"><strong>Stable Fast 3D</strong></a></td>
<td>Stability AI</td>
<td>Agu 2024</td>
<td>Satu gambar → mesh dalam ~0,5 dtk</td>
<td>Mesh bertekstur cepat</td>
<td>~$0.001</td>
</tr>
<tr>
<td><a href="https://github.com/VAST-AI-Research/TripoSG" target="_blank" rel="noreferrer"><strong>TripoSG</strong></a></td>
<td>VAST-AI</td>
<td>Mar 2025</td>
<td>Pembuatan bentuk rectified-flow 1.5B</td>
<td>Mesh berkualitas tinggi</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://github.com/VAST-AI-Research/TripoSR" target="_blank" rel="noreferrer"><strong>TripoSR</strong></a></td>
<td>Stability / Tripo</td>
<td>2024</td>
<td>Rekonstruksi cepat dari satu gambar</td>
<td>Mesh (tanpa tekstur)</td>
<td>~$0.001</td>
</tr>
<tr>
<td><a href="https://huggingface.co/VAST-AI/UniRig" target="_blank" rel="noreferrer"><strong>UniRig</strong></a></td>
<td>Tsinghua / Tripo</td>
<td>2025</td>
<td>Rig otomatis: kerangka + bobot skinning</td>
<td>Mesh dengan rig yang dapat dianimasikan</td>
<td>~$0.01</td>
</tr>
<tr>
<td>Coba langsung: <a href="https://huggingface.co/spaces/microsoft/TRELLIS.2" target="_blank" rel="noreferrer">demo TRELLIS.2 ↗</a> · <a href="https://huggingface.co/spaces/tencent/Hunyuan3D-2" target="_blank" rel="noreferrer">demo Hunyuan3D ↗</a> · <a href="https://huggingface.co/spaces/TencentARC/InstantMesh" target="_blank" rel="noreferrer">demo InstantMesh ↗</a></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<p><strong>Lihat contoh:</strong> <a href="https://microsoft.github.io/TRELLIS.2/" target="_blank" rel="noreferrer">halaman proyek TRELLIS.2 ↗</a> · <a href="https://www.3daistudio.com/Models/Trellis-2" target="_blank" rel="noreferrer">galeri 3D AI Studio ↗</a></p>
<h3 id="alur-kerja-yang-benar-benar-efektif" tabindex="-1">Alur kerja yang benar-benar efektif <a class="header-anchor" href="#alur-kerja-yang-benar-benar-efektif" aria-label="Permalink to &quot;Alur kerja yang benar-benar efektif&quot;"></a></h3>
<p>Pendekatan yang saat ini cocok bagi para kreator adalah merangkai beberapa model. Mulailah dengan sebuah gambar, baik hasil generasi maupun foto, tidak masalah. Proses gambar tersebut dengan Stable Zero123 atau Wonder3D untuk mendapatkan beberapa sudut pandang. Masukkan hasilnya ke InstantMesh atau TripoSR untuk membuat mesh. Kemudian gunakan TRELLIS.2 atau Hunyuan3D untuk menghasilkan material yang layak.</p>
<p><strong>TRELLIS.2</strong> dari Microsoft adalah pemimpin baru untuk aset siap produksi. Model ini mampu menangani geometri yang membuat model lain gagal: permukaan tipis, lubang, dan topologi kompleks. Versi dengan 4 miliar parameter menghasilkan mesh dengan tekstur PBR sungguhan, bukan sekadar warna verteks yang menyamar sebagai material.</p>
<p><strong>Stable Fast 3D</strong> mengutamakan kecepatan. Hanya perlu sekitar setengah detik untuk mengubah gambar menjadi mesh. Mesh-nya masih perlu dirapikan dan diberi tekstur, tetapi untuk membuat prototipe? Untuk mengetahui apakah sebuah ide layak sebelum Anda menghabiskan waktu berjam-jam? Tidak tertandingi. TripoSG adalah peningkatan berikutnya saat Anda menginginkan geometri yang lebih bersih dari satu gambar.</p>
<p><strong>Hunyuan3D 2.1</strong> adalah model terbuka Tencent yang patut digunakan: model ini menyediakan bobot lengkap dan kode pelatihan, beserta pembuatan tekstur PBR kelas produksi. Perhatikan penamaannya karena sering membingungkan orang. Hunyuan3D 2.5, 3.0, dan 3.1 memang ada, tetapi semuanya hanya tersedia melalui API tanpa bobot publik. Jadi, untuk hosting mandiri, generator dasarnya masih berhenti di versi 2.1. Tencent juga membuka dua ekstensi berguna yang dibangun di atas 2.1: Hunyuan3D-Omni menambahkan kendali multikondisi (point cloud, voxel, kerangka, bounding box), sedangkan Hunyuan3D-Part menguraikan mesh menjadi bagian-bagian yang dapat diedit. Lisensinya juga mengecualikan Uni Eropa, Britania Raya, dan Korea Selatan, jadi periksa ketentuannya sebelum merilis karya Anda di wilayah tersebut.</p>
<p><strong>SAM 3D</strong> (Meta, November 2025) adalah pendekatan terbaru: satu foto diubah menjadi mesh 3D, dengan model terpisah untuk objek dan tubuh manusia. Jika digabungkan dengan teknologi segmentasi Meta, Anda dapat mengisolasi suatu objek dalam gambar dan merekonstruksi objek itu saja.</p>
<p><strong>UniRig</strong> (Tsinghua dan Tripo, MIT) menutup celah yang langsung dihadapi semua orang setelah mendapatkan mesh: rigging. Model ini secara otomatis membuat kerangka yang valid dan bobot skinning untuk mesh masukan, sehingga karakter hasil generasi benar-benar dapat dianimasikan alih-alih hanya menjadi properti statis. Padukan dengan teknologi animasi otomatis SOMA-X dari NVIDIA, dan karakter yang sepenuhnya dihasilkan serta di-rig tidak lagi sekadar demo riset.</p>
<p>Berikut ekspektasi realistis bagi kreator indie: buat concept art dengan FLUX, proses menggunakan InstantMesh untuk memperoleh geometri, lalu buat teksturnya di Blender atau gunakan TRELLIS untuk PBR otomatis. Anda akan menghabiskan sekitar 30–60 menit per aset, bukan 4–8 jam. Bukan tanpa waktu sama sekali, tetapi perbedaannya nyata.</p>
<h2 id="audio-dan-musik" tabindex="-1">Audio dan Musik <a class="header-anchor" href="#audio-dan-musik" aria-label="Permalink to &quot;Audio dan Musik&quot;"></a></h2>
<p>Generasi audio belum menyamai perkembangan gambar dan video. Namun, teknologinya sudah cukup untuk mengubah cara Anda bekerja, terutama saat membuat prototipe dan efek suara.</p>
<audio controls style="width: 100%;">
  <source src="/img/ai-samples/music-sample.mp3" type="audio/mpeg">
</audio>
<p><em>Contoh musik hasil generasi AI. Jelaskan suasana yang Anda inginkan, lalu dapatkan musik yang sesuai</em></p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Fungsinya</th>
<th>Lisensi</th>
<th>Biaya/30 dtk</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/ace-step/ACE-Step-1.5" target="_blank" rel="noreferrer"><strong>ACE-Step 1.5</strong></a></td>
<td>StepFun/ACE Studio</td>
<td>Jan 2026</td>
<td>Musik hingga ~4 menit dengan cepat, 19 bahasa, kloning suara</td>
<td>MIT</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://stability.ai/stable-audio" target="_blank" rel="noreferrer"><strong>Stable Audio 3.0</strong></a></td>
<td>Stability AI</td>
<td>Mei 2026</td>
<td>Lagu hingga ~6 menit; model terbuka Small, Small-SFX, dan Medium</td>
<td>Stability Community</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://github.com/multimodal-art-projection/YuE" target="_blank" rel="noreferrer"><strong>YuE</strong></a></td>
<td>MAP</td>
<td>Jan 2025</td>
<td>Lagu lengkap dari lirik, vokal + iringan</td>
<td>Apache 2.0</td>
<td>~$0.05</td>
</tr>
<tr>
<td><a href="https://huggingface.co/facebook/musicgen-large" target="_blank" rel="noreferrer"><strong>MusicGen</strong></a></td>
<td>Meta</td>
<td>2023</td>
<td>Teks-ke-musik, dapat dikendalikan</td>
<td>kode MIT / bobot CC-BY-NC</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://github.com/ASLP-lab/DiffRhythm2" target="_blank" rel="noreferrer"><strong>DiffRhythm 2</strong></a></td>
<td>ASLP-lab</td>
<td>Feb 2026</td>
<td>Generasi lagu lengkap dengan cepat</td>
<td>Apache 2.0</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/google/magenta-realtime" target="_blank" rel="noreferrer"><strong>Magenta RealTime</strong></a></td>
<td>Google</td>
<td>Jun 2025</td>
<td>Musik real-time yang dapat diarahkan dengan prompt</td>
<td>kode Apache / bobot CC-BY</td>
<td>~$0.02</td>
</tr>
</tbody>
</table>
<p>Coba langsung: <a href="https://huggingface.co/spaces/facebook/MusicGen" target="_blank" rel="noreferrer">demo MusicGen ↗</a> · <a href="https://audiocraft.metademolab.com/musicgen.html" target="_blank" rel="noreferrer">arena eksperimen AudioCraft ↗</a></p>
<p><strong>Lihat contoh:</strong> <a href="https://replicate.com/meta/musicgen/examples" target="_blank" rel="noreferrer">contoh MusicGen ↗</a> · <a href="https://felixkreuk.github.io/audiogen/" target="_blank" rel="noreferrer">contoh AudioGen ↗</a></p>
<h3 id="yang-benar-benar-dapat-anda-gunakan-dalam-rilisan" tabindex="-1">Yang benar-benar dapat Anda gunakan dalam rilisan <a class="header-anchor" href="#yang-benar-benar-dapat-anda-gunakan-dalam-rilisan" aria-label="Permalink to &quot;Yang benar-benar dapat Anda gunakan dalam rilisan&quot;"></a></h3>
<p><strong>MusicGen</strong> dari Meta masih menjadi pilihan praktis untuk membuat prototipe audio gim. Jelaskan suasana yang Anda inginkan, dapatkan musik yang sesuai, dan model ini berjalan lancar pada GPU 12 GB. Ada satu hal penting terkait lisensi: kode MusicGen berlisensi MIT, tetapi bobot modelnya berlisensi CC-BY-NC (nonkomersial). Jadi, gunakan untuk membuat prototipe, lalu beralihlah ke model berlisensi komersial seperti ACE-Step atau Stable Audio untuk karya yang akan Anda rilis.</p>
<p><strong>Model efek suara terbuka Stable Audio (Small-SFX)</strong> mampu menangani suara langkah kaki, derit pintu, angin latar, dan suara mekanis. Model ini berjalan secara lokal dan dirilis dengan lisensi komunitas Stability, sehingga menjadi pilihan SFX terbuka saat Anda membutuhkan suara yang benar-benar dapat digunakan secara komersial. Model ini layak dipilih karena model SFX terbuka lainnya memiliki batasan: AudioGen dari Meta berlisensi CC-BY-NC dan TangoFlux menggunakan lisensi komunitas nonkomersial Stability, sehingga keduanya hanya cocok untuk prototipe gim yang nantinya akan dirilis.</p>
<p><strong>Magenta RealTime</strong> (Google) tampil unik dalam arti terbaik: ini adalah satu-satunya model berbobot terbuka yang dirancang untuk musik real-time dan dapat terus diarahkan dengan prompt. Alih-alih merender trek final, model ini menghasilkan musik secara langsung dan memungkinkan Anda mengarahkannya selagi diputar. Bentuknya sangat sesuai untuk soundtrack gim adaptif yang berubah mengikuti tindakan pemain. Kodenya berlisensi Apache 2.0 dan bobotnya CC-BY; keduanya dapat digunakan secara komersial.</p>
<p><strong>YuE</strong> benar-benar menarik. Ini adalah model terbuka pertama yang menghasilkan lagu lengkap dengan vokal. Lagu tema. Musik latar dengan nyanyian sungguhan. Kualitasnya bervariasi, tetapi jauh melampaui apa pun yang dapat Anda unduh dan jalankan sendiri.</p>
<p><strong>ACE-Step</strong> adalah model musik terbuka yang kini perlu Anda ketahui, dan perkembangannya sangat cepat: lini 1.5 (Januari 2026, dengan varian XL 5B yang lebih besar) menggantikan rilis awal Mei 2025 dan kini berlisensi MIT. Model ini dapat menghasilkan musik berdurasi beberapa menit dengan cepat, mendukung 19 bahasa, serta mampu menangani kloning suara, remix, dan penyuntingan lirik. Untuk pembuatan prototipe gim, model ini menutup banyak kekurangan yang masih ditinggalkan YuE dan MusicGen.</p>
<p><strong>Stable Audio 3.0</strong> (Mei 2026) merupakan pembaruan yang lebih besar untuk suara. Model ini dapat menghasilkan lagu berdurasi hingga sekitar enam menit, dan Stability merilis bobot terbuka untuk tiga dari empat variannya: Small dan model efek suara khusus Small-SFX dapat dijalankan langsung di perangkat, sedangkan Medium menawarkan struktur musik yang lebih baik dan durasi trek penuh. Hanya model Large yang tetap tersedia melalui API saja. Small-SFX kini menjadi opsi terbuka terkuat khusus untuk SFX gim. Seluruh keluarga model ini dilatih menggunakan data berlisensi, sehingga landasan hukumnya lebih jelas dibandingkan generator musik yang masih menghadapi sengketa hukum.</p>
<p>Pendapat jujurnya: kesenjangan antara model terbuka dan tertutup (Suno, Udio) memang menyempit, tetapi masih nyata untuk lagu vokal lengkap. Berbagai alat tertutup tersebut juga masih menghadapi sengketa terkait data pelatihan. Untuk efek suara, model terbuka—khususnya model SFX Stable Audio—benar-benar kompetitif. Untuk lagu yang ingin Anda rilis, bersiaplah melakukan banyak iterasi, atau libatkan musisi untuk produksi final dan gunakan alat-alat ini untuk semua kebutuhan lainnya.</p>
<h2 id="ucapan-dan-suara" tabindex="-1">Ucapan dan Suara <a class="header-anchor" href="#ucapan-dan-suara" aria-label="Permalink to &quot;Ucapan dan Suara&quot;"></a></h2>
<p>Generasi suara kini sudah jauh melampaui taraf &quot;cukup bagus untuk gim&quot;, dan hal itu mengubah apa yang dapat diwujudkan oleh tim kecil.</p>
<audio controls style="width: 100%;">
  <source src="/img/ai-samples/speech-sample.mp3" type="audio/mpeg">
</audio>
<p><em>Narasi gim hasil generasi AI dengan ucapan alami, tempo yang tepat, dan emosi</em></p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Fitur Utama</th>
<th>Lisensi</th>
<th>Biaya/menit</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/QwenLM/Qwen3-TTS" target="_blank" rel="noreferrer"><strong>Qwen3-TTS</strong></a></td>
<td>Alibaba</td>
<td>Jan 2026</td>
<td>Kloning suara dari 3 dtk, desain suara, 10 bahasa</td>
<td>Apache 2.0</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://huggingface.co/ResembleAI/chatterbox" target="_blank" rel="noreferrer"><strong>Chatterbox</strong></a></td>
<td>Resemble AI</td>
<td>2025</td>
<td>Kendali emosi, kloning dari ~5 dtk, 23 bahasa</td>
<td>MIT</td>
<td>~$0.003</td>
</tr>
<tr>
<td><a href="https://github.com/SesameAILabs/csm" target="_blank" rel="noreferrer"><strong>CSM</strong></a></td>
<td>Sesame AI</td>
<td>Mar 2025</td>
<td>Alur percakapan, jeda alami</td>
<td>Apache 2.0</td>
<td>~$0.005</td>
</tr>
<tr>
<td><a href="https://github.com/fishaudio/fish-speech" target="_blank" rel="noreferrer"><strong>Fish Speech 1.5</strong></a></td>
<td>Fish Audio</td>
<td>2024</td>
<td>Kloning zero-shot dari 10–30 dtk</td>
<td>kode Apache / bobot CC-BY-NC-SA</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://github.com/myshell-ai/OpenVoice" target="_blank" rel="noreferrer"><strong>OpenVoice V2</strong></a></td>
<td>MyShell/MIT</td>
<td>Apr 2024</td>
<td>Kendali emosi/aksen</td>
<td>MIT</td>
<td>~$0.003</td>
</tr>
<tr>
<td><a href="https://huggingface.co/coqui/XTTS-v2" target="_blank" rel="noreferrer"><strong>XTTS-v2</strong></a></td>
<td>Coqui (komunitas)</td>
<td>2024</td>
<td>17 bahasa, kloning suara</td>
<td>CPML (nonkomersial)</td>
<td>~$0.005</td>
</tr>
</tbody>
</table>
<p><strong>Dengarkan contoh:</strong> <a href="https://fish.audio/" target="_blank" rel="noreferrer">suara Fish Audio ↗</a> · <a href="https://huggingface.co/spaces/myshell-ai/OpenVoice" target="_blank" rel="noreferrer">demo OpenVoice ↗</a></p>
<h3 id="membuat-npc-terdengar-seperti-manusia" tabindex="-1">Membuat NPC terdengar seperti manusia <a class="header-anchor" href="#membuat-npc-terdengar-seperti-manusia" aria-label="Permalink to &quot;Membuat NPC terdengar seperti manusia&quot;"></a></h3>
<p><strong>CSM (Conversational Speech Model)</strong> dari Sesame dibuat khusus untuk dialog. Model ini menghasilkan jeda alami. Perubahan intonasi. Irama percakapan yang sesungguhnya. Sebagian besar TTS terdengar seperti seseorang sedang membaca naskah, dan Anda dapat langsung menyadarinya. CSM terdengar seperti seseorang yang benar-benar berbicara. Perbedaan itu lebih penting daripada yang mungkin Anda kira.</p>
<p><strong>Qwen3-TTS</strong> (Alibaba, Januari 2026) adalah pilihan utama untuk proyek komersial. Seluruh keluarga model ini berlisensi Apache 2.0, mampu mengkloning suara dari audio referensi berdurasi sekitar 3 detik, mendukung 10 bahasa, serta memungkinkan desain suara berbasis deskripsi. Dengan demikian, Anda dapat menentukan suara NPC menggunakan teks biasa tanpa harus mencari rekaman referensi. Model 0.6B dan 1.7B dapat dijalankan pada perangkat keras yang relatif sederhana.</p>
<p><strong>Chatterbox</strong> (Resemble AI) adalah pilihan untuk suara ekspresif, dan lisensi MIT-nya memungkinkan Anda menggunakannya dalam rilisan. Model ini dapat mengkloning suara dari audio berdurasi sekitar 5 detik, berjalan dengan latensi di bawah 200 md, mencakup 23 bahasa, dan menjadi model terbuka pertama yang menawarkan kendali penguatan emosi. Dengan begitu, NPC benar-benar dapat terdengar marah atau ketakutan alih-alih datar. Dua opsi lain berlisensi Apache 2.0 mengisi kebutuhan khusus: <strong>Orpheus</strong> (Canopy) menerima tag emosi inline seperti <code>&lt;laugh&gt;</code> dan <code>&lt;sigh&gt;</code> yang mudah dipetakan ke seruan singkat NPC, serta menyediakan varian 150M untuk perangkat keras kelas bawah; sementara <strong>Dia</strong> (Nari Labs) dirancang untuk dialog dengan banyak pembicara dan dapat menyertakan suara nonverbal seperti batuk dan tawa dalam satu proses.</p>
<p><strong>Fish Speech</strong> dan <strong>OpenVoice</strong> menangani kloning suara. Rekam suara pengisi suara selama 10–30 detik, lalu hasilkan dialog tanpa batas dengan suara tersebut. Bayangkan artinya: Anda dapat menyewa pengisi suara untuk dialog utama, lalu memperluas penampilannya hingga mencakup ratusan variasi dan dialog latar. Satu catatan lisensi untuk Fish Speech: kodenya terbuka, tetapi bobot versi 1.5 berlisensi CC-BY-NC-SA, sehingga hanya cocok sebagai alat pembuatan prototipe. Untuk gim yang akan dirilis, gunakan OpenVoice (MIT) atau Qwen3-TTS (Apache 2.0).</p>
<p><strong>NVIDIA ACE</strong> (tidak sepenuhnya terbuka, tetapi patut diketahui) kini mendukung Qwen3-8B untuk menjalankan NPC langsung di perangkat. LLM lokal + TTS lokal + sinkronisasi bibir, semuanya berjalan pada GPU konsumen. Inilah rangkaian teknologi untuk percakapan NPC real-time yang tidak memerlukan panggilan ke cloud.</p>
<p>Pendekatan yang masuk akal bagi kreator indie: pekerjakan pengisi suara untuk karakter utama dan dialog yang paling penting. Gunakan Qwen3-TTS atau OpenVoice untuk memperluas cakupan dialog latar, variasi, dan seluruh dialog insidental yang jika tidak akan dibiarkan tanpa suara atau terlalu mahal untuk diproduksi.</p>
<h2 id="model-dunia-dan-simulasi-gim" tabindex="-1">Model Dunia dan Simulasi Gim <a class="header-anchor" href="#model-dunia-dan-simulasi-gim" aria-label="Permalink to &quot;Model Dunia dan Simulasi Gim&quot;"></a></h2>
<p>Di sinilah segalanya menjadi benar-benar aneh sekaligus sangat menarik. Model-model ini tidak menghasilkan aset statis. Model ini menghasilkan pengalaman yang terasa seperti gim.</p>
<a href="https://oasis.decart.ai/" target="_blank" style="display: block; background: linear-gradient(135deg, #2d5a27 0%, #1a3d16 100%); padding: 20px; border-radius: 12px; text-align: center; text-decoration: none; color: white;">
  <strong style="font-size: 18px;">🎮 Mainkan Oasis: Minecraft Hasil Generasi AI</strong><br>
  <span style="opacity: 0.8;">Generasi dunia real-time tanpa game engine, hanya prediksi AI</span>
</a>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Fungsinya</th>
<th>Status</th>
<th>Biaya/frame</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/eloialonso/diamond" target="_blank" rel="noreferrer"><strong>DIAMOND</strong></a></td>
<td>Riset</td>
<td>2024</td>
<td>Model dunia berbasis difusi, simulasi Atari</td>
<td>Bobot terbuka</td>
<td>~$0.001</td>
</tr>
<tr>
<td><a href="https://github.com/etched-ai/open-oasis" target="_blank" rel="noreferrer"><strong>Oasis</strong></a></td>
<td>Decart/Etched</td>
<td>Okt 2024</td>
<td>Generasi Minecraft real-time</td>
<td>Bobot 500M terbuka</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://huggingface.co/microsoft/mineworld" target="_blank" rel="noreferrer"><strong>MineWorld</strong></a></td>
<td>Microsoft</td>
<td>Apr 2025</td>
<td>Minecraft real-time, alternatif terbuka untuk Oasis</td>
<td>MIT</td>
<td>~$0.002</td>
</tr>
<tr>
<td><a href="https://huggingface.co/tencent/Hunyuan-GameCraft-1.0" target="_blank" rel="noreferrer"><strong>Hunyuan-GameCraft</strong></a></td>
<td>Tencent</td>
<td>Agu 2025</td>
<td>Video gim interaktif, kendali keyboard/mouse</td>
<td>Tencent Community</td>
<td>~$0.005</td>
</tr>
<tr>
<td><a href="https://github.com/GameGen-X/GameGen-X" target="_blank" rel="noreferrer"><strong>GameGen-X</strong></a></td>
<td>Riset</td>
<td>2024</td>
<td>Generasi video dunia terbuka</td>
<td>Kode + dataset terbuka</td>
<td>~$0.005</td>
</tr>
<tr>
<td><a href="https://huggingface.co/nvidia/Cosmos-Predict2.5-2B" target="_blank" rel="noreferrer"><strong>NVIDIA Cosmos</strong></a></td>
<td>NVIDIA</td>
<td>Okt 2025</td>
<td>Simulasi AI fisik (Predict2.5)</td>
<td>NVIDIA Open Model License</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://github.com/SkyworkAI/Matrix-Game" target="_blank" rel="noreferrer"><strong>Matrix-Game 3.0</strong></a></td>
<td>Skywork</td>
<td>Mar 2026</td>
<td>Dunia interaktif 720p real-time, memori jangka panjang</td>
<td>Bobot terbuka</td>
<td>~$0.005</td>
</tr>
<tr>
<td><a href="https://deepmind.google/blog/genie-2-a-large-scale-foundation-world-model/" target="_blank" rel="noreferrer"><strong>Genie 2</strong></a></td>
<td>DeepMind</td>
<td>Des 2024</td>
<td>3D interaktif dari gambar</td>
<td>Tidak dirilis</td>
<td>N/A</td>
</tr>
<tr>
<td><a href="https://deepmind.google/blog/genie-3-a-new-frontier-for-world-models/" target="_blank" rel="noreferrer"><strong>Genie 3</strong></a></td>
<td>DeepMind</td>
<td>Agu 2025</td>
<td>Dunia 720p real-time, peristiwa dapat dipicu dengan prompt</td>
<td>Tertutup (Project Genie)</td>
<td>N/A</td>
</tr>
</tbody>
</table>
<p>Lihat risetnya: <a href="https://diamond-wm.github.io/" target="_blank" rel="noreferrer">halaman proyek DIAMOND ↗</a> · <a href="https://huggingface.co/blog/nvidia/cosmos-predict-and-transfer2-5" target="_blank" rel="noreferrer">blog Cosmos ↗</a>
<strong>Coba:</strong> <a href="https://oasis.decart.ai/starting-point" target="_blank" rel="noreferrer">Demo langsung Oasis ↗</a> · <a href="https://deepmind.google/blog/genie-2-a-large-scale-foundation-world-model/" target="_blank" rel="noreferrer">Contoh Genie 2 ↗</a></p>
<h3 id="mengapa-ini-penting-bagi-anda" tabindex="-1">Mengapa ini penting bagi Anda <a class="header-anchor" href="#mengapa-ini-penting-bagi-anda" aria-label="Permalink to &quot;Mengapa ini penting bagi Anda&quot;"></a></h3>
<p><strong>DIAMOND</strong> membuktikan sesuatu yang mengubah cara kita memandang AI untuk game. Anda dapat melatih agen sepenuhnya di dalam dunia yang dihasilkan. Tidak diperlukan mesin game sungguhan untuk pelatihan. AI bermain di dalam imajinasi model difusi, lalu mentransfer hasilnya ke game sungguhan. Implikasinya sangat besar.</p>
<p><strong>Oasis</strong> menjalankan dunia mirip Minecraft secara real-time. Bingkai demi bingkai. Tanpa mesin game, tekstur, atau aset siap pakai. Hanya transformer yang memprediksi apa yang terjadi berikutnya. Ini masih berupa bukti konsep, tetapi bayangkan ke mana arahnya. Versi dengan 500 juta parameter sudah tersedia secara terbuka.</p>
<p><strong>GameGen-X</strong> merilis set data terbesar untuk video game dunia terbuka. Jika ingin melatih model sendiri atau menyempurnakan model yang sudah ada agar menghasilkan konten seperti game, inilah titik awal Anda.</p>
<p><strong>NVIDIA Cosmos</strong> dibuat untuk robotika dan kendaraan otonom, tetapi model fondasi dunianya juga bisa digunakan untuk game. Model ini memahami fisika, kekekalan objek, dan hubungan spasial. Lini terbuka saat ini adalah Cosmos-Predict2.5, yang dirilis pada Oktober 2025 dengan NVIDIA Open Model License serta mengizinkan penggunaan komersial dan karya turunan.</p>
<p><strong>Hunyuan-GameCraft</strong> (Tencent, Agustus 2025) adalah model dunia terbuka yang bentuknya paling langsung menyerupai game. Model ini dilatih menggunakan lebih dari satu juta rekaman dari 100+ game AAA dan menyatukan input papan ketik serta tetikus ke dalam ruang kontrol bersama, sehingga menghasilkan video game interaktif yang benar-benar dapat Anda kendalikan, bukan sekadar ditonton. Model ini menggunakan Tencent Community License yang sama seperti Hunyuan3D, dengan pengecualian yang sama untuk Uni Eropa, Inggris Raya, dan Korea Selatan, jadi periksa persyaratannya sebelum merilis produk di wilayah tersebut. <strong>MineWorld</strong> (Microsoft, MIT) adalah padanan Oasis yang sepenuhnya permisif: model dunia Minecraft real-time yang dapat Anda unduh dan jalankan tanpa mesin game.</p>
<p><strong>Genie 3</strong> (DeepMind, diumumkan Agustus 2025) adalah lompatan yang patut diperhatikan: model dunia pertama dengan interaksi real-time, yang menghasilkan dunia 720p dan dapat dijelajahi pada 24 fps serta tetap konsisten selama beberapa menit, ditambah 'peristiwa dunia yang dapat dipicu dengan prompt' untuk mengubah cuaca atau menambahkan objek sesuai perintah. Model ini dibuka untuk publik sebagai Project Genie pada Januari 2026 bagi pelanggan Google AI Ultra di AS. Bobotnya masih tertutup, tetapi model ini menunjukkan arah perkembangan dunia hasil generatif yang dapat dimainkan.</p>
<p><strong>Matrix-Game 3.0</strong> (Skywork, Maret 2026) adalah jawaban terbuka terhadap Genie. Ini merupakan model dunia interaktif dengan dukungan memori yang menayangkan 720p pada 40 fps secara real-time dan mempertahankan konsistensi adegan sepanjang rangkaian berdurasi satu menit. Versi terdistilasi 5B menangani inferensi real-time, versi MoE 2x14B yang lebih besar meningkatkan kualitas, dan bobotnya tersedia di Hugging Face dengan lisensi Apache 2.0. Jika ingin bereksperimen dengan dunia hasil generatif yang dapat dimainkan sekarang juga alih-alih menunggu DeepMind, model inilah yang benar-benar bisa Anda unduh.</p>
<p>Untuk pengembangan game praktis saat ini, semua ini masih merupakan alat riset. Namun, jika Anda mengerjakan konten berbasis AI, generasi prosedural, atau sekadar memikirkan ke mana arah seluruh teknologi ini, inilah garis terdepannya.</p>
<h2 id="model-bahasa-besar" tabindex="-1">Model Bahasa Besar <a class="header-anchor" href="#model-bahasa-besar" aria-label="Permalink to &quot;Model Bahasa Besar&quot;"></a></h2>
<p>LLM mendukung dialog, pembuatan misi, dan logika game. Opsi terbuka sekarang benar-benar mampu bersaing dengan GPT-4. Dua tahun lalu, hal ini belum terjadi.</p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Ukuran</th>
<th>Paling Cocok Untuk</th>
<th>Lisensi</th>
<th>Biaya/1K token</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/deepseek-ai/DeepSeek-V3" target="_blank" rel="noreferrer"><strong>DeepSeek-V3</strong></a></td>
<td>DeepSeek</td>
<td>Des 2024</td>
<td>MoE 671B (37B aktif)</td>
<td>Penalaran, penggunaan umum</td>
<td>Permisif</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/deepseek-ai/DeepSeek-R1" target="_blank" rel="noreferrer"><strong>DeepSeek-R1</strong></a></td>
<td>DeepSeek</td>
<td>Jan 2025</td>
<td>Berdasarkan V3</td>
<td>Alur penalaran</td>
<td>Permisif</td>
<td>~$0.03</td>
</tr>
<tr>
<td><a href="https://huggingface.co/deepseek-ai/DeepSeek-V3.2" target="_blank" rel="noreferrer"><strong>DeepSeek-V3.2</strong></a></td>
<td>DeepSeek</td>
<td>Des 2025</td>
<td>Atensi renggang (DSA)</td>
<td>Penalaran + penggunaan alat</td>
<td>MIT</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/deepseek-ai/DeepSeek-V4-Pro" target="_blank" rel="noreferrer"><strong>DeepSeek-V4</strong></a></td>
<td>DeepSeek</td>
<td>Apr 2026</td>
<td>MoE 1.6T (49B aktif)</td>
<td>Penalaran terdepan, konteks 1M</td>
<td>MIT</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/zai-org/GLM-5" target="_blank" rel="noreferrer"><strong>GLM-5</strong></a></td>
<td>Zhipu / Z.ai</td>
<td>Feb 2026</td>
<td>MoE 744B (40B aktif)</td>
<td>Pemrograman, agen, penggunaan alat</td>
<td>MIT</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/openai/gpt-oss-120b" target="_blank" rel="noreferrer"><strong>GPT-OSS</strong></a></td>
<td>OpenAI</td>
<td>Agu 2025</td>
<td>MoE 120B / 20B</td>
<td>Penalaran, penggunaan alat, di perangkat</td>
<td>Apache 2.0</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://huggingface.co/moonshotai" target="_blank" rel="noreferrer"><strong>Kimi K2</strong></a></td>
<td>Moonshot</td>
<td>2025</td>
<td>MoE 1T (32B aktif)</td>
<td>Agen, pemrograman</td>
<td>MIT Termodifikasi</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://www.kimi.com/blog/kimi-k3" target="_blank" rel="noreferrer"><strong>Kimi K3</strong></a></td>
<td>Moonshot</td>
<td>Jul 2026</td>
<td>MoE 2.8T (~50B aktif)</td>
<td>Agen terdepan, pemrograman, konteks 1M, visi</td>
<td>Bobot terbuka (27 Jul)</td>
<td>~$0.03</td>
</tr>
<tr>
<td><a href="https://huggingface.co/blog/gemma3" target="_blank" rel="noreferrer"><strong>Gemma 3</strong></a></td>
<td>Google</td>
<td>2025</td>
<td>1B-27B</td>
<td>Di perangkat, 140 bahasa, visi</td>
<td>Gemma</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://github.com/QwenLM/Qwen3" target="_blank" rel="noreferrer"><strong>Qwen3</strong></a></td>
<td>Alibaba</td>
<td>2025</td>
<td>MoE 235B (22B aktif)</td>
<td>Multibahasa, kode</td>
<td>Apache 2.0</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://huggingface.co/Qwen/Qwen3-Coder-480B-A35B-Instruct" target="_blank" rel="noreferrer"><strong>Qwen3-Coder</strong></a></td>
<td>Alibaba</td>
<td>2025</td>
<td>MoE 480B (35B aktif)</td>
<td>Pemrograman berbasis agen, konteks 256K</td>
<td>Apache 2.0</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://huggingface.co/collections/meta-llama/llama-4" target="_blank" rel="noreferrer"><strong>Llama 4</strong></a></td>
<td>Meta</td>
<td>2025</td>
<td>Beragam</td>
<td>Agen, konteks hingga 10M</td>
<td>Llama Community</td>
<td>~$0.01</td>
</tr>
<tr>
<td><a href="https://github.com/QwenLM/Qwen3-VL" target="_blank" rel="noreferrer"><strong>Qwen3-VL</strong></a></td>
<td>Alibaba</td>
<td>2025</td>
<td>2B-235B</td>
<td>Visi + bahasa</td>
<td>Apache 2.0</td>
<td>~$0.02</td>
</tr>
<tr>
<td><a href="https://internvl.github.io/blog/2025-04-11-InternVL-3.0/" target="_blank" rel="noreferrer"><strong>InternVL3</strong></a></td>
<td>Shanghai AI Lab</td>
<td>2025</td>
<td>1B-78B</td>
<td>Visi, OCR, pemetaan UI</td>
<td>MIT</td>
<td>~$0.02</td>
</tr>
</tbody>
</table>
<p>Mulai di sini: <a href="https://huggingface.co/Qwen/Qwen3-8B" target="_blank" rel="noreferrer">Qwen3-8B di HuggingFace ↗</a> · <a href="https://huggingface.co/deepseek-ai/DeepSeek-V3" target="_blank" rel="noreferrer">DeepSeek-V3 di HuggingFace ↗</a> · <a href="https://huggingface.co/zai-org/GLM-5" target="_blank" rel="noreferrer">GLM-5 di HuggingFace ↗</a></p>
<h3 id="untuk-membuat-game" tabindex="-1">Untuk membuat game <a class="header-anchor" href="#untuk-membuat-game" aria-label="Permalink to &quot;Untuk membuat game&quot;"></a></h3>
<p><strong>Qwen3</strong> adalah pilihan praktis bagi sebagian besar penggunaan dalam game. Lisensi Apache 2.0 berarti integrasinya menjadi milik Anda. Dukungan multibahasanya kuat, sesuatu yang penting jika Anda mempertimbangkan lokalisasi. Model ini juga andal dalam mengikuti instruksi terstruktur. Varian 7B dan 14B dapat dijalankan secara lokal di GPU konsumen.</p>
<p><strong>DeepSeek-V3</strong> menyamai atau mengungguli GPT-4 dalam sebagian besar tolok ukur. Arsitekturnya cerdas: hanya 37B parameter yang aktif untuk setiap token meskipun totalnya 671B. Anda membutuhkan perangkat keras kelas berat (multi-GPU), tetapi kualitasnya berada di tingkat terdepan tanpa ketergantungan pada API.</p>
<p><strong>DeepSeek-V3.2</strong> (Desember 2025) menyatukan penalaran dan penggunaan alat dalam satu model serta memperkenalkan DeepSeek Sparse Attention (DSA) agar inferensi konteks panjang lebih murah, dengan varian Speciale berkomputasi tinggi yang ditujukan untuk tolok ukur penalaran teratas. Untuk logika dan dialog game, model ini merupakan pengganti langsung V3 yang lebih kuat dan lebih mampu beroperasi sebagai agen.</p>
<p><strong>DeepSeek-V4</strong> (April 2026) kembali memajukan batas terdepan model terbuka. V4-Pro adalah MoE dengan 1,6 triliun parameter, tetapi hanya 49B yang aktif per token, jendela konteks satu juta token, dan mode penalaran yang dapat dipilih, semuanya di bawah lisensi MIT. Varian V4-Flash (total 284B, 13B aktif) mempertahankan konteks 1M dalam paket yang tidak memerlukan klaster GPU penuh. Jika saat ini Anda memilih model terbuka untuk logika misi kompleks atau konteks status game yang panjang, inilah batas tertingginya.</p>
<p><strong>GLM-5</strong> (Zhipu AI, Februari 2026) adalah model terbuka yang harus dikalahkan untuk pemrograman dan pekerjaan berbasis agen, sementara pembaruan GLM-5.2 mendorong skor penggunaan alat dan perencanaan jangka panjangnya mendekati model tertutup terdepan. Ini adalah MoE dengan 744B parameter dan 40B aktif per token, konteks 200K token, serta lisensi MIT. Z.ai adalah perusahaan model fondasi pertama yang sahamnya diperdagangkan secara publik dan menawarkan API terkelola dengan harga agresif (sekitar $1,40 per satu juta token input), tetapi bobotnya tersedia di Hugging Face jika Anda lebih suka mengelolanya sendiri. Jika game Anda mengandalkan LLM untuk penulisan skrip misi, agen pemanggil alat, atau sistem berbasis kode, GLM-5 adalah alternatif OpenAI yang kuat dan sepenuhnya dapat Anda kendalikan.</p>
<p><strong>GPT-OSS</strong> (OpenAI, Agustus 2025) adalah rilis berbobot terbuka pertama dari OpenAI dan sangat sesuai dengan tema panduan ini. Model gpt-oss-120b mampu bernalar dan memanggil alat pada tingkat yang kurang lebih setara dengan o4-mini menggunakan satu GPU 80 GB, sedangkan gpt-oss-20b dapat berjalan di kartu konsumen 16 GB; keduanya menggunakan Apache 2.0. Jika Anda menginginkan model dari laboratorium Barat yang dapat dikelola sendiri untuk logika NPC atau agen pengguna alat, inilah pilihannya.</p>
<p><strong>Kimi K2</strong> (Moonshot) adalah model kelas berat berbasis agen terbuka lainnya, bersama GLM-5 dan DeepSeek. Ini merupakan MoE dengan satu triliun parameter dan 32B aktif, yang dioptimalkan secara intensif untuk pemrograman dan penggunaan alat. Lisensi MIT Termodifikasinya hanya menambahkan pembatasan di atas 100 juta pengguna bulanan, sehingga bagi pengembang indie lisensi ini pada praktiknya setara dengan MIT. Gunakan model ini ketika agen harus menyusun rencana dalam banyak langkah.</p>
<p><strong>Kimi K3</strong> (Moonshot, Juli 2026) adalah model berbobot terbuka terbesar yang pernah diumumkan dan lebih mendekati batas terdepan model tertutup dibandingkan model terbuka mana pun sebelumnya. Ini merupakan MoE dengan 2,8 triliun parameter, tetapi hanya sekitar 50B yang aktif per token (16 dari 896 pakar), konteks 1M token, serta kemampuan visi bawaan, yang dibangun di atas dua rancangan atensi baru bernama Kimi Delta Attention dan Attention Residuals. Berdasarkan angka Moonshot, model ini mengungguli Claude Opus 4.8 dan GPT-5.5 pada tolok ukur pemrograman dan agen, serta hanya tertinggal dari model proprieter terbaik. Kendalanya adalah skala: bobotnya tersedia pada 27 Juli 2026 dengan ukuran sekitar 1,4 TB dalam MXFP4, sehingga pengelolaan mandiri memerlukan klaster GPU multi-simpul, dan sebagian besar tim akan mengaksesnya melalui API dengan biaya $3 per satu juta token input dan $15 per satu juta token output. Untuk agen yang benar-benar dapat Anda jalankan sendiri, K2 tetap menjadi pilihan Moonshot yang praktis, tetapi K3 mendefinisikan ulang makna &quot;terbuka&quot; di kelas tertinggi.</p>
<p><strong>Gemma 3</strong> (Google) paling cocok ketika model harus berjalan di perangkat pemain atau ketika Anda membutuhkan lokalisasi yang luas. Model ini tersedia dalam ukuran 1B, 4B, 12B, dan 27B, sehingga dapat digunakan mulai dari kartu 8 GB ke atas, mendukung 140 bahasa, mampu melakukan pemanggilan fungsi, dan varian 4B ke atas juga dapat memahami gambar sehingga sekaligus berfungsi sebagai model visi kecil. Lisensi Gemma mengizinkan penggunaan komersial.</p>
<p><strong>Qwen3-Coder</strong> (Alibaba) adalah model pemrograman terbuka khusus yang menggantikan lini DeepSeek-Coder lama untuk sebagian besar penggunaan. Ini adalah MoE 480B dengan 35B aktif, konteks bawaan 256K (dapat diperpanjang hingga 1M), lisensi Apache 2.0, dan berada di kelas Claude-Sonnet dalam tolok ukur pemrograman berbasis agen. Jika game Anda menghasilkan atau menjalankan kode, inilah batas tertinggi model terbuka. Keluarga <strong>Mistral</strong> dari Eropa (Devstral untuk pemrograman, Mistral Small 3.x untuk penggunaan di perangkat, keduanya Apache 2.0) adalah alternatif yang solid dan dapat dikelola sendiri.</p>
<p><strong>Qwen3-VL</strong> menambahkan pemahaman visi, dengan ukuran dense dan MoE mulai dari 2B hingga 235B di bawah Apache 2.0. Berguna untuk game yang perlu menganalisis tangkapan layar, memahami konten buatan pemain dengan gambar tangan, atau memproses input kamera. Varian 8B dapat berjalan pada satu GPU. <strong>InternVL3</strong> (Shanghai AI Lab, MIT) adalah opsi visi-bahasa terbuka kuat lainnya, terutama andal dalam OCR dan pemetaan UI, yang penting jika alat Anda perlu membaca antarmuka game; <strong>Pixtral 12B</strong> dari Mistral (Apache 2.0) merupakan pilihan lebih ringan yang aman untuk penggunaan komersial.</p>
<p>Untuk NPC di perangkat, yaitu karakter yang merespons secara real-time tanpa panggilan cloud, <strong>Qwen3-8B</strong> melalui NVIDIA ACE adalah jalur paling praktis saat ini. Model ini berjalan bersama game Anda di perangkat keras pemain.</p>
<h2 id="model-utilitas" tabindex="-1">Model Utilitas <a class="header-anchor" href="#model-utilitas" aria-label="Permalink to &quot;Model Utilitas&quot;"></a></h2>
<p>Model-model ini tidak menghasilkan konten secara langsung, tetapi membuat alur kerja Anda berfungsi.</p>
<p><img src="/img/ai-samples/sam2-sample.jpg" alt="Segmentasi SAM 2">
<em>SAM 2 menyegmentasikan objek apa pun dalam gambar dan video. Klik sekali untuk mendapatkan mask yang sempurna</em></p>
<table tabindex="0">
<thead>
<tr>
<th>Model</th>
<th>Organisasi</th>
<th>Dirilis</th>
<th>Fungsinya</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://github.com/facebookresearch/sam2" target="_blank" rel="noreferrer"><strong>SAM 2</strong></a></td>
<td>Meta</td>
<td>Agu 2024</td>
<td>Menyegmentasikan apa pun dalam gambar dan video</td>
</tr>
<tr>
<td><a href="https://github.com/apple/ml-depth-pro" target="_blank" rel="noreferrer"><strong>Depth Pro</strong></a></td>
<td>Apple</td>
<td>Okt 2024</td>
<td>Kedalaman metrik dari satu gambar</td>
</tr>
<tr>
<td><a href="https://github.com/nerfstudio-project/gsplat" target="_blank" rel="noreferrer"><strong>gsplat</strong></a></td>
<td>Nerfstudio</td>
<td>2024+</td>
<td>Gaussian splatting dengan akselerasi CUDA</td>
</tr>
</tbody>
</table>
<p><strong>SAM 2</strong> menyegmentasikan objek dalam video secara real-time. Klik sesuatu untuk mendapatkan mask yang sempurna. Berguna untuk rotoscoping, compositing, atau mengekstrak objek dari rekaman agar dapat digunakan sebagai aset game. <a href="https://github.com/huggingface/sam2-studio" target="_blank" rel="noreferrer">Coba SAM 2 ↗</a></p>
<p><strong>Depth Pro</strong> dari Apple menghasilkan peta kedalaman metrik dari satu gambar dalam waktu kurang dari satu detik. Ini membuka banyak kemungkinan: mengubah ilustrasi 2D menjadi 2.5D dengan efek paralaks, menghasilkan data kedalaman untuk rekonstruksi 3D, dan membuat normal map dari gambar datar. <a href="https://huggingface.co/apple/DepthPro-hf" target="_blank" rel="noreferrer">Depth Pro di HuggingFace ↗</a></p>
<p><strong>gsplat</strong> adalah implementasi Gaussian splatting yang cepat. Jika Anda menangkap lingkungan nyata untuk game, baik melalui fotogrametri maupun pemindaian lingkungan, pustaka inilah yang membuatnya praktis.</p>
<h2 id="yang-benar-benar-akan-saya-gunakan" tabindex="-1">Yang Benar-Benar Akan Saya Gunakan <a class="header-anchor" href="#yang-benar-benar-akan-saya-gunakan" aria-label="Permalink to &quot;Yang Benar-Benar Akan Saya Gunakan&quot;"></a></h2>
<p>Jika Anda memulai proyek game sekarang, berikut susunan alat yang masuk akal:</p>
<p><strong>Tekstur dan sprite</strong>: FLUX.1 [schnell], Apache 2.0, iterasi cepat, kualitas yang layak dirilis</p>
<p><strong>Ilustrasi konsep</strong>: SD 3.5 Large dengan LoRA untuk mengendalikan gaya</p>
<p><strong>Aset 3D</strong>: Hunyuan3D 2.1 atau TRELLIS.2 untuk mesh bertekstur, SAM 3D jika titik awalnya adalah foto, lalu Blender untuk merapikannya</p>
<p><strong>Rigging otomatis</strong>: UniRig atau NVIDIA SOMA-X untuk membuat kerangka dan skin pada mesh hasil generatif (keduanya terbuka), alih-alih mengandalkan Mixamo</p>
<p><strong>Efek suara</strong>: Model terbuka Small-SFX dari Stable Audio, berjalan secara lokal, berlisensi komersial</p>
<p><strong>Musik</strong>: ACE-Step untuk prototipe, lalu libatkan komposer untuk produksi akhir</p>
<p><strong>Suara</strong>: Qwen3-TTS untuk kloning dan dialog latar (Apache 2.0), Chatterbox (MIT) ketika suatu dialog membutuhkan emosi yang nyata, dan pengisi suara untuk dialog yang benar-benar penting</p>
<p><strong>Dialog NPC</strong>: Qwen3-8B secara lokal, atau LLM cloud yang dapat dikelola sendiri (GLM-5 atau DeepSeek-V4) untuk penalaran kompleks dan penggunaan alat</p>
<p><strong>Video (cutscene)</strong>: Mochi 1 secara lokal, HunyuanVideo di cloud ketika Anda membutuhkan kualitas akhir</p>
<p>Inti dari semua ini adalah bahwa kesalahan umum yang sering terjadi ialah mencoba menggunakan AI untuk segalanya. Semua ini adalah alat, bukan pengganti. Alat-alat ini memangkas bagian yang membosankan, seperti iterasi, variasi, dan aset sementara, sehingga Anda dapat mencurahkan waktu untuk keputusan kreatif yang benar-benar penting. Bagian-bagian yang membuat game Anda menjadi milik Anda sendiri.</p>
<h2 id="pemeriksaan-realitas-perangkat-keras" tabindex="-1">Pemeriksaan Realitas Perangkat Keras <a class="header-anchor" href="#pemeriksaan-realitas-perangkat-keras" aria-label="Permalink to &quot;Pemeriksaan Realitas Perangkat Keras&quot;"></a></h2>
<p>Mari kita bicara jujur tentang apa yang benar-benar Anda butuhkan untuk menjalankan semua ini:</p>
<p><strong>VRAM 8 GB</strong> (RTX 3060, 4060): SD 1.5/SDXL, Wan 2.1 kecil, AudioGen, Fish Speech, LLM kecil (7B terkuantisasi). Ini adalah kelas laptop gaming dan sudah cukup untuk memulai.
<strong>VRAM 12GB</strong> (RTX 3080, 4070): SD 3.5, FLUX schnell, Mochi 1, MusicGen, TripoSR, Qwen 14B terkuantisasi. Pada kapasitas ini, semuanya mulai terasa nyaman. Sebagian besar model yang berguna dapat dijalankan di sini.</p>
<p><strong>VRAM 24GB</strong> (RTX 3090, 4090): Sebagian besar model pada presisi penuh, InstantMesh, dan LLM yang lebih besar. Jika Anda serius dengan alur kerja ini, kapasitas ini adalah pilihan ideal.</p>
<p><strong>VRAM 48-80GB</strong> (A100, H100): HunyuanVideo, LTX-2, DeepSeek-V3, dan pembuatan konten berskala produksi. Ini perangkat keras kelas perusahaan. Anda tidak akan membelinya, melainkan menyewanya.</p>
<p>Instans cloud di RunPod, Lambda Labs, atau Modal berbiaya $2-4/jam untuk A100. Untuk penggunaan sesekali, itu lebih murah daripada membeli perangkat keras. Jalankan instans saat Anda membutuhkan kualitas akhir, lalu matikan setelah selesai.</p>
<p><strong>Tentang perkiraan biaya dalam panduan ini</strong>: Biaya per pembuatan mengasumsikan inferensi yang dihosting sendiri pada GPU cloud dengan tarif sekitar $2-3/jam (A100) atau sekitar $0,40/jam (RTX 4090). Biaya sebenarnya bervariasi berdasarkan perangkat keras, optimasi, dan ukuran batch. Angka-angka ini merupakan perkiraan kasar untuk perencanaan, jadi hasil Anda mungkin berbeda.</p>
<h2 id="yang-baru-pada-2026" tabindex="-1">Yang Baru pada 2026 <a class="header-anchor" href="#yang-baru-pada-2026" aria-label="Permalink to &quot;Yang Baru pada 2026&quot;"></a></h2>
<p><strong>Baru-baru ini dirilis</strong>: LTX-2 dan LTX-2.3 menghadirkan pembuatan audio dan video tersinkronisasi secara terbuka dengan dukungan 4K native. TRELLIS.2 dari Microsoft (Desember 2025) menjadi model terbuka terdepan untuk img-to-3D, sementara SAM 3D dari Meta (November 2025) membuat rekonstruksi 3D dari satu foto menjadi praktis. FLUX.2 menggantikan FLUX.1 untuk pembuatan gambar, dan SOMA-X dari NVIDIA menghadirkan auto-rigging serta retargeting terbuka. Paruh pertama 2026 mempertahankan laju tersebut: Qwen3-TTS (Januari) menyediakan ekosistem Apache 2.0 yang layak untuk kloning suara, GLM-5 dari Zhipu (Februari) merilis model coding dan agentik terbuka berukuran 744B dengan lisensi MIT, Matrix-Game 3.0 dari Skywork (Maret) menyediakan model dunia interaktif waktu nyata dengan bobot terbuka, DeepSeek-V4 (April) mendorong LLM terbuka hingga konteks 1 juta token dengan lisensi MIT, Stable Audio 3.0 (Mei) merilis tiga model audio terbuka yang dilatih menggunakan data berlisensi, dan Ideogram merilis model gambar berbobot terbuka pertamanya (Juni). Kemudian pada Juli, Moonshot mengumumkan Kimi K3, model berbobot terbuka dengan 2,8 triliun parameter yang mengungguli Claude Opus 4.8 dan GPT-5.5 dalam tolok ukur agentik, dengan bobot model dirilis pada 27 Juli.</p>
<p><strong>Tren yang perlu diperhatikan</strong>: laboratorium-laboratorium terkemuka semakin sering membatasi model terbaru mereka hanya melalui API, meskipun versi sebelumnya bersifat terbuka. Wan menjadi tertutup mulai versi 2.5 dan tetap tertutup hingga 2.7, Qwen-Image menjadi tertutup mulai versi 2.0, dan Hunyuan3D mulai versi 2.5. Ekosistem terbuka tetap berkembang pesat dan dinamis, tetapi anggapan bahwa &quot;versi terbaru pasti terbuka&quot; tidak lagi aman. Jadi, periksa ketersediaan bobot sebelum membangun pipeline yang bergantung pada suatu model.</p>
<p>Arahnya jelas: setiap kemampuan yang tersedia dalam model tertutup akan muncul dalam model terbuka 6-12 bulan kemudian. Pertanyaannya bukan apakah model terbuka akan cukup bagus. Untuk sebagian besar penggunaan, model-model tersebut sudah cukup bagus. Pertanyaannya adalah seberapa cepat model terbuka menjadi pilihan utama.</p>
<p>Dan inilah artinya bagi para kreator: alat yang dahulu memerlukan anggaran perusahaan atau langganan bulanan kini menjadi sesuatu yang dapat Anda... jalankan begitu saja. Di perangkat keras Anda sendiri. Tanpa memerlukan izin siapa pun.</p>
<p>Itulah perubahannya. Itulah tujuan yang sedang kita bangun bersama.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-model-ai-sumber-terbuka-terbaik-untuk-membuat-aset-game" tabindex="-1">Apa model AI sumber terbuka terbaik untuk membuat aset game? <a class="header-anchor" href="#apa-model-ai-sumber-terbuka-terbaik-untuk-membuat-aset-game" aria-label="Permalink to &quot;Apa model AI sumber terbuka terbaik untuk membuat aset game?&quot;"></a></h3>
<p>Tergantung pada jenis asetnya. Untuk model 3D, Hunyuan3D adalah opsi terbuka terkuat pada 2026. Untuk karya seni 2D dan tekstur, FLUX memimpin dalam hal kualitas. Untuk efek suara dan musik, model audio terbuka telah mengejar ketertinggalannya dengan cepat. Tidak ada satu model &quot;terbaik&quot; karena game membutuhkan banyak jenis aset. Karena itu, sebagian besar kreator merangkai beberapa model alih-alih hanya mengandalkan satu model.</p>
<h3 id="apakah-model-ai-sumber-terbuka-cukup-bagus-untuk-menggantikan-api-tertutup" tabindex="-1">Apakah model AI sumber terbuka cukup bagus untuk menggantikan API tertutup? <a class="header-anchor" href="#apakah-model-ai-sumber-terbuka-cukup-bagus-untuk-menggantikan-api-tertutup" aria-label="Permalink to &quot;Apakah model AI sumber terbuka cukup bagus untuk menggantikan API tertutup?&quot;"></a></h3>
<p>Untuk sebagian besar pekerjaan aset game pada 2026, ya. Model terbuka kini menandingi API tertutup dalam pembuatan gambar, 3D, dan audio. Anda juga dapat menjalankannya di perangkat keras sendiri tanpa biaya per panggilan atau perubahan harga yang mengejutkan. Model tertutup masih unggul dalam beberapa tugas frontier seperti video berdurasi panjang, tetapi kesenjangan tersebut biasanya tertutup dalam waktu 6 hingga 12 bulan.</p>
<h3 id="bisakah-saya-menjalankan-model-ai-generatif-ini-di-gpu-sendiri" tabindex="-1">Bisakah saya menjalankan model AI generatif ini di GPU sendiri? <a class="header-anchor" href="#bisakah-saya-menjalankan-model-ai-generatif-ini-di-gpu-sendiri" aria-label="Permalink to &quot;Bisakah saya menjalankan model AI generatif ini di GPU sendiri?&quot;"></a></h3>
<p>Banyak di antaranya bisa. Model gambar dan audio dapat berjalan dengan nyaman pada satu GPU konsumen seperti RTX 4090. Model video dan 3D yang lebih besar membutuhkan lebih banyak VRAM dan sering kali memerlukan GPU cloud kelas A100. Bagian perangkat keras di atas mencantumkan kebutuhan setiap model agar Anda dapat membuat rencana sebelum memutuskan untuk menggunakannya.</p>
<h3 id="apakah-penggunaan-aset-buatan-ai-dalam-game-komersial-legal" tabindex="-1">Apakah penggunaan aset buatan AI dalam game komersial legal? <a class="header-anchor" href="#apakah-penggunaan-aset-buatan-ai-dalam-game-komersial-legal" aria-label="Permalink to &quot;Apakah penggunaan aset buatan AI dalam game komersial legal?&quot;"></a></h3>
<p>Secara umum, ya, untuk model sumber terbuka yang Anda jalankan sendiri. Namun, hal ini bergantung pada lisensi model dan asumsi Anda tentang data pelatihannya. Selalu periksa lisensi model tertentu dan ungkapkan penggunaan konten buatan AI jika platform Anda mewajibkannya. Lihat <a href="/id/ai-content.html">kebijakan konten buatan AI</a> kami untuk mengetahui cara kami menanganinya.</p>
<hr>
<h2 id="bacaan-lanjutan" tabindex="-1">Bacaan Lanjutan <a class="header-anchor" href="#bacaan-lanjutan" aria-label="Permalink to &quot;Bacaan Lanjutan&quot;"></a></h2>
<ul>
<li><a href="/id/blog/2026-01-18-ai-controversy-and-post-ai-economy.html">Kontroversi AI, kepercayaan, dan ekonomi pasca-AI</a> — posisi kami tentang AI dalam game</li>
<li><a href="/id/ai-content.html">Kebijakan konten buatan AI</a> — cara kami menangani pengungkapan penggunaan AI</li>
<li><a href="/id/guides/web-games-stack-2026.html">Tech Stack Game Web pada 2026</a> — WebGL, WebGPU, dan Wasm untuk game</li>
<li><a href="/id/guides/browser-3d-open-world-tech.html">Teknologi Dunia Terbuka 3D di Browser</a> — menggunakan aset 3D buatan AI dalam dunia browser</li>
<li><a href="/id/guides/landscape-generation-browser.html">Pembuatan Lanskap untuk Dunia Terbuka di Browser</a> — sintesis medan berbasis difusi</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — sumber aset tradisional sebagai pendamping pembuatan aset dengan AI</li>
<li><a href="/id/tutorials/agentic-code-tools.html">Alat coding AI agentik</a> — AI untuk menulis kode game, bukan hanya membuat aset</li>
</ul>
<BuildCta
  title="Lihat model-model ini membuat game, bukan sekadar aset"
  desc="Model generatif lebih menyenangkan saat hasilnya dapat dimainkan."
  prompt="Buat game tempat saya menjelajahi lanskap alien aneh yang dibuat oleh AI" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/frontier-gen-ai-models.jpg?v=4" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Penjelasan Lisensi Aset Game (CC0, CC-BY, Bebas Royalti)]]></title>
            <link>https://app.cinevva.com/id/guides/game-asset-licenses</link>
            <guid>https://app.cinevva.com/id/guides/game-asset-licenses</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara kerja lisensi aset game dalam bahasa sederhana - CC0, CC-BY, CC-BY-SA, bebas royalti, editorial, MIT, dan GPL - serta mana yang aman digunakan dalam game komersial.]]></description>
            <content:encoded><![CDATA[<h1 id="penjelasan-lisensi-aset-game-cc0-cc-by-bebas-royalti" tabindex="-1">Penjelasan Lisensi Aset Game (CC0, CC-BY, Bebas Royalti) <a class="header-anchor" href="#penjelasan-lisensi-aset-game-cc0-cc-by-bebas-royalti" aria-label="Permalink to &quot;Penjelasan Lisensi Aset Game (CC0, CC-BY, Bebas Royalti)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Lisensi aset game adalah aturan dari kreator mengenai cara Anda diizinkan menggunakan model 3D, tekstur, suara, atau musik mereka. Lisensi yang paling aman untuk game komersial adalah CC0 (domain publik, tidak perlu atribusi) dan bebas royalti (bayar sekali, lalu gunakan selamanya), yang keduanya mengizinkan penggunaan komersial tanpa biaya berkelanjutan. CC-BY juga dapat digunakan dalam game komersial selama Anda memberikan atribusi kepada kreatornya, sedangkan lisensi nonkomersial (CC-BY-NC) dan aset khusus editorial tidak boleh disertakan dalam game yang Anda jual. Panduan ini menjelaskan setiap lisensi dengan bahasa sederhana agar Anda dapat menggunakan aset gratis maupun berbayar dalam game tanpa masalah hukum.</p>
<h2 id="mengapa-lisensi-penting" tabindex="-1">Mengapa Lisensi Penting <a class="header-anchor" href="#mengapa-lisensi-penting" aria-label="Permalink to &quot;Mengapa Lisensi Penting&quot;"></a></h2>
<p>Setiap karya kreatif—model 3D, tekstur, suara, musik—dilindungi oleh hak cipta. Secara bawaan, kreator memiliki hak atas karya tersebut. <strong>Lisensi</strong> adalah izin dari kreator kepada Anda untuk menggunakan karya mereka berdasarkan ketentuan tertentu.</p>
<p><strong>Menggunakan aset tanpa memahami lisensinya dapat mengakibatkan:</strong></p>
<ul>
<li>Penghapusan game Anda akibat permintaan DMCA</li>
<li>Tindakan hukum dari pemegang hak cipta</li>
<li>Penghapusan paksa dari toko aplikasi</li>
<li>Kerugian finansial</li>
</ul>
<p><strong>Kabar baiknya:</strong> Sebagian besar aset game memiliki lisensi yang jelas dan permisif. Anda hanya perlu memahami apa yang diizinkan oleh lisensi tersebut.</p>
<hr>
<h2 id="referensi-singkat-lisensi" tabindex="-1">Referensi Singkat Lisensi <a class="header-anchor" href="#referensi-singkat-lisensi" aria-label="Permalink to &quot;Referensi Singkat Lisensi&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Lisensi</th>
<th>Penggunaan Komersial</th>
<th>Atribusi</th>
<th>Modifikasi</th>
<th>BerbagiSerupa</th>
<th>Penyedia</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>CC0</strong></td>
<td>✅ Ya</td>
<td>❌ Tidak</td>
<td>✅ Ya</td>
<td>❌ Tidak</td>
<td>Poly Haven, Kenney, Quaternius, AmbientCG, sebagian Freesound</td>
</tr>
<tr>
<td><strong>CC-BY</strong></td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>✅ Ya</td>
<td>❌ Tidak</td>
<td>Sketchfab, OpenGameArt, sebagian Freesound</td>
</tr>
<tr>
<td><strong>CC-BY-SA</strong></td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>OpenGameArt, sebagian Freesound</td>
</tr>
<tr>
<td><strong>CC-BY-NC</strong></td>
<td>❌ Tidak</td>
<td>✅ Wajib</td>
<td>✅ Ya</td>
<td>❌ Tidak</td>
<td>Sebagian Sketchfab, itch.io, sebagian Freesound</td>
</tr>
<tr>
<td><strong>CC-BY-NC-SA</strong></td>
<td>❌ Tidak</td>
<td>✅ Wajib</td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>Berbagai penyedia</td>
</tr>
<tr>
<td><strong>Bebas Royalti</strong></td>
<td>✅ Ya</td>
<td>❌ Biasanya tidak</td>
<td>✅ Ya</td>
<td>❌ Tidak</td>
<td>Synty, CGTrader, TurboSquid</td>
</tr>
<tr>
<td><strong>Khusus Editorial</strong></td>
<td>❌ Tidak*</td>
<td>Bervariasi</td>
<td>⚠️ Terbatas</td>
<td>❌ Tidak</td>
<td>TurboSquid (sebagian)</td>
</tr>
<tr>
<td><strong>MIT</strong></td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>✅ Ya</td>
<td>❌ Tidak</td>
<td>Three.js, pmndrs</td>
</tr>
<tr>
<td><strong>GPL</strong></td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>✅ Ya</td>
<td>✅ Wajib</td>
<td>Sebagian OpenGameArt</td>
</tr>
</tbody>
</table>
<p><strong>Catatan tentang Freesound:</strong> Freesound menggunakan campuran lisensi per suara. Setiap suara menggunakan CC0, CC-BY, CC-BY-SA, atau CC-BY-NC, jadi periksa setiap berkas sebelum mengunduhnya. Suara berlisensi CC-BY-NC tidak boleh disertakan dalam game komersial.</p>
<hr>
<h2 id="lisensi-creative-commons" tabindex="-1">Lisensi Creative Commons <a class="header-anchor" href="#lisensi-creative-commons" aria-label="Permalink to &quot;Lisensi Creative Commons&quot;"></a></h2>
<p>Lisensi Creative Commons (CC) merupakan lisensi yang paling umum untuk aset game gratis. Lisensi ini terstandardisasi, diakui secara internasional, dan mudah dipahami.</p>
<h3 id="cc0-dedikasi-domain-publik" tabindex="-1">CC0 - Dedikasi Domain Publik <a class="header-anchor" href="#cc0-dedikasi-domain-publik" aria-label="Permalink to &quot;CC0 - Dedikasi Domain Publik&quot;"></a></h3>
<p><strong>Lisensi yang paling permisif. Perlakukan seolah-olah tidak ada hak cipta.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>✅</td>
</tr>
<tr>
<td>Menggunakan dalam game sumber tertutup</td>
<td>✅</td>
</tr>
<tr>
<td>Memodifikasi, meremiks, mentransformasi</td>
<td>✅</td>
</tr>
<tr>
<td>Mendistribusikan dan membagikan</td>
<td>✅</td>
</tr>
<tr>
<td>Menggunakan tanpa mencantumkan kredit</td>
<td>✅</td>
</tr>
<tr>
<td>Mengakuinya sebagai karya Anda sendiri</td>
<td>⚠️ Secara hukum boleh, tetapi secara etika patut dipertanyakan</td>
</tr>
</tbody>
</table>
<p><strong>Dalam bahasa sederhana:</strong> Lakukan apa pun yang Anda inginkan. Tidak ada batasan. Tidak perlu atribusi.</p>
<p><strong>Penyedia yang menggunakan CC0:</strong></p>
<ul>
<li>Poly Haven (semua aset)</li>
<li>Kenney (semua aset)</li>
<li>Quaternius (semua aset)</li>
<li>AmbientCG (semua aset)</li>
<li>Sebagian aset di OpenGameArt, Freesound, dan Sketchfab</li>
</ul>
<p><strong>Contoh penggunaan:</strong> Unduh pesawat luar angkasa dari Kenney, modifikasi, jual game Anda seharga $20, dan jangan pernah menyebut Kenney di mana pun. Sepenuhnya legal.</p>
<p><strong>Mengapa kreator memilih CC0:</strong> Untuk memaksimalkan penggunaan. Banyak kreator ingin karya mereka digunakan secara luas dan tidak mempermasalahkan atribusi.</p>
<hr>
<h3 id="cc-by-atribusi" tabindex="-1">CC-BY - Atribusi <a class="header-anchor" href="#cc-by-atribusi" aria-label="Permalink to &quot;CC-BY - Atribusi&quot;"></a></h3>
<p><strong>Gunakan secara bebas, tetapi Anda wajib memberikan kredit.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>✅</td>
</tr>
<tr>
<td>Menggunakan dalam game sumber tertutup</td>
<td>✅</td>
</tr>
<tr>
<td>Memodifikasi, meremiks, mentransformasi</td>
<td>✅</td>
</tr>
<tr>
<td>Mendistribusikan dan membagikan</td>
<td>✅</td>
</tr>
<tr>
<td>Menggunakan tanpa mencantumkan kredit</td>
<td>❌ Wajib memberikan atribusi</td>
</tr>
</tbody>
</table>
<p><strong>Persyaratan atribusi:</strong></p>
<ol>
<li>Cantumkan nama kreator</li>
<li>Cantumkan nama lisensi (CC-BY 4.0)</li>
<li>Tautkan ke lisensi (jika memungkinkan)</li>
<li>Nyatakan jika ada perubahan yang dilakukan</li>
</ol>
<p><strong>Dalam bahasa sederhana:</strong> Gunakan sesuka Anda, tetapi berikan kredit kepada kreatornya.</p>
<p><strong>Tempat mencantumkan atribusi:</strong></p>
<ul>
<li>Layar kredit dalam game Anda</li>
<li>Berkas README atau CREDITS.txt</li>
<li>Bagian Tentang/Legal</li>
<li>Situs web game</li>
</ul>
<p><strong>Contoh atribusi:</strong></p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>"Model Pesawat Luar Angkasa" oleh John Artist</span></span>
<span class="line"><span>Dilisensikan berdasarkan CC-BY 4.0 (https://creativecommons.org/licenses/by/4.0/)</span></span>
<span class="line"><span>Dimodifikasi: Menyesuaikan skala dan menambahkan tekstur emisi</span></span></code></pre>
</div><p><strong>Penyedia yang menggunakan CC-BY:</strong></p>
<ul>
<li>Banyak model Sketchfab</li>
<li>Banyak aset OpenGameArt</li>
<li>Sebagian audio Freesound</li>
<li>BlendSwap</li>
</ul>
<p><strong>OGA-BY:</strong> OpenGameArt juga memiliki lisensi OGA-BY sendiri, yaitu varian CC-BY tanpa klausul DRM sehingga lebih ramah untuk game yang didistribusikan dengan perlindungan DRM. Perlakukan seperti CC-BY dan berikan kredit kepada kreatornya.</p>
<p><strong>Catatan tentang Sketchfab:</strong> Toko berbayarnya telah ditutup dan aktivitas penjualan dipindahkan ke lokapasar Fab milik Epic, tetapi unduhan Creative Commons dan CC0 gratis masih tersedia di Sketchfab saat ini. Sketchfab menyatakan bahwa mereka akan memberikan pemberitahuan sebelumnya apabila konten gratis yang dapat diunduh akan dihapus. Jadi, jika Anda mengambil model CC-BY atau CC0 dari sana, unduh dan arsipkan semua yang diperlukan daripada berasumsi bahwa tautannya akan tersedia selamanya.</p>
<hr>
<h3 id="cc-by-sa-atribusi-berbagiserupa" tabindex="-1">CC-BY-SA - Atribusi BerbagiSerupa <a class="header-anchor" href="#cc-by-sa-atribusi-berbagiserupa" aria-label="Permalink to &quot;CC-BY-SA - Atribusi BerbagiSerupa&quot;"></a></h3>
<p><strong>Gunakan secara bebas dengan kredit, tetapi karya turunan harus memakai lisensi yang sama.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>✅</td>
</tr>
<tr>
<td>Menggunakan dalam game sumber tertutup</td>
<td>✅ (game itu sendiri)</td>
</tr>
<tr>
<td>Memodifikasi, meremiks, mentransformasi</td>
<td>✅</td>
</tr>
<tr>
<td>Mendistribusikan dan membagikan</td>
<td>✅</td>
</tr>
<tr>
<td>Menggunakan tanpa mencantumkan kredit</td>
<td>❌ Wajib memberikan atribusi</td>
</tr>
<tr>
<td>Menjadikan karya turunan sebagai milik eksklusif</td>
<td>❌ Wajib menggunakan lisensi yang sama</td>
</tr>
</tbody>
</table>
<p><strong>Ketentuan &quot;BerbagiSerupa&quot;:</strong> Jika Anda memodifikasi aset dan mendistribusikan versi yang telah dimodifikasi, versi tersebut juga harus menggunakan CC-BY-SA.</p>
<p><strong>Penjelasan penting untuk game:</strong></p>
<ul>
<li><strong>Kode game</strong> Anda TIDAK harus bersumber terbuka</li>
<li><strong>Game</strong> Anda boleh bersifat komersial dan bersumber tertutup</li>
<li>Hanya <strong>aset itu sendiri</strong> (beserta turunannya) yang harus tetap menggunakan CC-BY-SA</li>
<li>Jika seseorang mengekstrak aset dari game Anda, mereka dapat menggunakannya berdasarkan CC-BY-SA</li>
</ul>
<p><strong>Dalam bahasa sederhana:</strong> Berikan kredit kepada kreator. Jika Anda membagikan versi aset yang telah dimodifikasi, aset tersebut tetap menggunakan CC-BY-SA.</p>
<p><strong>Kapan Anda harus berhati-hati:</strong></p>
<ul>
<li>Jika Anda membuat paket aset atau templat</li>
<li>Jika Anda mendistribusikan ulang aset dalam perangkat kerja</li>
<li>Jika game Anda memungkinkan pengguna mengekstrak aset mentah</li>
</ul>
<hr>
<h3 id="cc-by-nc-atribusi-nonkomersial" tabindex="-1">CC-BY-NC - Atribusi Nonkomersial <a class="header-anchor" href="#cc-by-nc-atribusi-nonkomersial" aria-label="Permalink to &quot;CC-BY-NC - Atribusi Nonkomersial&quot;"></a></h3>
<p><strong>Bebas digunakan dengan kredit, tetapi TIDAK untuk tujuan komersial.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>❌ Tidak</td>
</tr>
<tr>
<td>Menggunakan dalam game sumber tertutup</td>
<td>✅ (jika game gratis)</td>
</tr>
<tr>
<td>Memodifikasi, meremiks, mentransformasi</td>
<td>✅</td>
</tr>
<tr>
<td>Mendistribusikan dan membagikan</td>
<td>✅ (secara nonkomersial)</td>
</tr>
<tr>
<td>Menggunakan tanpa mencantumkan kredit</td>
<td>❌ Wajib memberikan atribusi</td>
</tr>
</tbody>
</table>
<p><strong>Apa yang dianggap &quot;komersial&quot;?</strong></p>
<ul>
<li>❌ Menjual game</li>
<li>❌ Pembelian dalam aplikasi</li>
<li>❌ Iklan di dalam game</li>
<li>❌ Pengembangan game yang didanai melalui Patreon</li>
<li>⚠️ Game gratis buatan perusahaan (wilayah abu-abu)</li>
<li>✅ Proyek hobi yang sepenuhnya gratis tanpa monetisasi</li>
</ul>
<p><strong>Dalam bahasa sederhana:</strong> Hanya gunakan dalam proyek yang sepenuhnya gratis dan tidak dimonetisasi.</p>
<p><strong>Rekomendasi:</strong> Hindari aset berlisensi NC untuk proyek apa pun yang mungkin menghasilkan pendapatan. Definisi &quot;komersial&quot; sangat luas dan masih diperdebatkan.</p>
<hr>
<h3 id="cc-by-nc-sa-atribusi-nonkomersial-berbagiserupa" tabindex="-1">CC-BY-NC-SA - Atribusi Nonkomersial BerbagiSerupa <a class="header-anchor" href="#cc-by-nc-sa-atribusi-nonkomersial-berbagiserupa" aria-label="Permalink to &quot;CC-BY-NC-SA - Atribusi Nonkomersial BerbagiSerupa&quot;"></a></h3>
<p><strong>Lisensi Creative Commons yang paling ketat.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>❌ Tidak</td>
</tr>
<tr>
<td>Menggunakan dalam game sumber tertutup</td>
<td>✅ (jika game gratis)</td>
</tr>
<tr>
<td>Memodifikasi, meremiks, mentransformasi</td>
<td>✅</td>
</tr>
<tr>
<td>Mendistribusikan dan membagikan</td>
<td>✅ (secara nonkomersial)</td>
</tr>
<tr>
<td>Menggunakan tanpa mencantumkan kredit</td>
<td>❌ Wajib memberikan atribusi</td>
</tr>
<tr>
<td>Menjadikan karya turunan sebagai milik eksklusif</td>
<td>❌ Wajib menggunakan lisensi yang sama</td>
</tr>
</tbody>
</table>
<p><strong>Dalam bahasa sederhana:</strong> Hanya untuk penggunaan nonkomersial, wajib mencantumkan kredit, dan semua karya turunannya juga harus menggunakan NC-SA.</p>
<p><strong>Rekomendasi:</strong> Secara umum, hindari lisensi ini untuk pengembangan game kecuali Anda yakin proyek Anda tidak akan pernah dimonetisasi dengan cara apa pun.</p>
<hr>
<h2 id="lisensi-bebas-royalti" tabindex="-1">Lisensi Bebas Royalti <a class="header-anchor" href="#lisensi-bebas-royalti" aria-label="Permalink to &quot;Lisensi Bebas Royalti&quot;"></a></h2>
<p>&quot;Bebas Royalti&quot; adalah model lisensi komersial, BUKAN varian Creative Commons.</p>
<h3 id="arti-sebenarnya-dari-bebas-royalti" tabindex="-1">Arti Sebenarnya dari &quot;Bebas Royalti&quot; <a class="header-anchor" href="#arti-sebenarnya-dari-bebas-royalti" aria-label="Permalink to &quot;Arti Sebenarnya dari &quot;Bebas Royalti&quot;&quot;"></a></h3>
<p><strong>Bebas Royalti ≠ Gratis</strong></p>
<p>&quot;Bebas Royalti&quot; berarti:</p>
<ul>
<li>Anda membayar <strong>satu kali</strong> (atau mendapatkannya secara gratis selama promosi)</li>
<li>Anda dapat menggunakannya <strong>tanpa batas</strong></li>
<li>Anda tidak membayar <strong>royalti per penggunaan</strong></li>
</ul>
<p><strong>Bandingkan dengan &quot;Hak Terkelola&quot; (alternatifnya):</strong></p>
<ul>
<li>Membayar untuk setiap penggunaan tertentu</li>
<li>Terbatas pada media, wilayah, dan jangka waktu tertentu</li>
<li>Lebih mahal dan lebih ketat</li>
</ul>
<h3 id="ketentuan-standar-bebas-royalti" tabindex="-1">Ketentuan Standar Bebas Royalti <a class="header-anchor" href="#ketentuan-standar-bebas-royalti" aria-label="Permalink to &quot;Ketentuan Standar Bebas Royalti&quot;"></a></h3>
<p>Sebagian besar lokapasar (Synty, CGTrader, TurboSquid) menggunakan ketentuan serupa:</p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial dalam game</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Menggunakan dalam beberapa proyek</td>
<td>✅ Ya (sering kali tanpa batas)</td>
</tr>
<tr>
<td>Memodifikasi dan mengadaptasi</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Memberikan kredit kepada kreator</td>
<td>❌ Biasanya tidak diwajibkan</td>
</tr>
<tr>
<td>Menjual kembali berkas aset mentah</td>
<td>❌ Tidak</td>
</tr>
<tr>
<td>Membiarkan pengguna mengekstrak aset</td>
<td>❌ Tidak</td>
</tr>
<tr>
<td>Mengalihkan lisensi kepada orang lain</td>
<td>❌ Tidak</td>
</tr>
</tbody>
</table>
<p><strong>Batasan utama:</strong></p>
<ol>
<li><strong>Tidak boleh mendistribusikan ulang</strong> - Tidak boleh memberikan atau menjual berkas aset</li>
<li><strong>Tidak boleh diekstrak</strong> - Aset harus &quot;diintegrasikan&quot; agar pengguna tidak dapat mengekstraknya dengan mudah</li>
<li><strong>Satu pemegang lisensi</strong> - Lisensi ditujukan untuk Anda/tim Anda dan tidak dapat dialihkan</li>
</ol>
<p><strong>Dalam bahasa sederhana:</strong> Gunakan dalam game Anda, tetapi jangan biarkan orang lain memperoleh berkas mentahnya.</p>
<h3 id="lisensi-synty-studios" tabindex="-1">Lisensi Synty Studios <a class="header-anchor" href="#lisensi-synty-studios" aria-label="Permalink to &quot;Lisensi Synty Studios&quot;"></a></h3>
<p>Synty kini menawarkan dua model lisensi: <strong>lisensi pembelian satu kali</strong> (hak permanen atas paket tertentu yang Anda beli) dan <strong>lisensi Langganan Standar</strong> (akses ke seluruh pustaka selama langganan Anda aktif). Setelah dibayar, keduanya bebas royalti untuk penggunaan komersial.</p>
<p>Ketentuan pembelian satu kali:</p>
<ul>
<li>✅ Digunakan dalam proyek komersial tanpa batas</li>
<li>✅ Bebas memodifikasi aset</li>
<li>✅ 5 seat (anggota tim) per pembelian (salinan dari Humble Bundle mencakup 1 seat)</li>
<li>❌ Tidak boleh menjual kembali, mendistribusikan ulang, atau membagikan aset kepada orang di luar anggota tim yang memiliki seat</li>
<li>❌ Tidak boleh digunakan untuk asset flipping (melakukan perubahan minimal lalu menjualnya kembali)</li>
<li>❌ Tidak boleh menggunakan nama atau logo Synty maupun mengaku telah membuat aset tersebut</li>
<li>❌ Tidak boleh menyertakan aset dalam set data pelatihan AI generatif, produk NFT/blockchain, atau produk metaverse (semuanya memerlukan lisensi khusus)</li>
</ul>
<h3 id="lisensi-bebas-royalti-cgtrader" tabindex="-1">Lisensi Bebas Royalti CGTrader <a class="header-anchor" href="#lisensi-bebas-royalti-cgtrader" aria-label="Permalink to &quot;Lisensi Bebas Royalti CGTrader&quot;"></a></h3>
<ul>
<li>✅ Penggunaan komersial dalam game, film, VR/AR</li>
<li>✅ Memodifikasi dan mengadaptasi</li>
<li>❌ Tidak boleh menjual atau memberikan berkas model</li>
<li>❌ Tidak boleh mengizinkan pengguna mengekstrak model</li>
<li>⚠️ Sebagian model diberi tanda &quot;No AI&quot; - tidak boleh digunakan untuk pelatihan ML</li>
</ul>
<h3 id="lisensi-model-3d-turbosquid" tabindex="-1">Lisensi Model 3D TurboSquid <a class="header-anchor" href="#lisensi-model-3d-turbosquid" aria-label="Permalink to &quot;Lisensi Model 3D TurboSquid&quot;"></a></h3>
<ul>
<li>✅ Penggunaan komersial (kecuali diberi tanda &quot;Editorial&quot;)</li>
<li>✅ Memodifikasi dan mengadaptasi</li>
<li>✅ Hingga 5 cetakan fisik untuk penggunaan pribadi/amal</li>
<li>❌ Tidak boleh mendistribusikan ulang berkas model</li>
<li>❌ Tidak boleh digunakan dalam logo/merek dagang</li>
<li>⚠️ Periksa label &quot;Editorial Only&quot;</li>
<li>⚠️ Periksa Kekayaan Intelektual yang Digambarkan (logo merek)</li>
</ul>
<hr>
<h2 id="khusus-penggunaan-editorial" tabindex="-1">Khusus Penggunaan Editorial <a class="header-anchor" href="#khusus-penggunaan-editorial" aria-label="Permalink to &quot;Khusus Penggunaan Editorial&quot;"></a></h2>
<p>Sebagian aset diberi tanda &quot;Editorial Use Only&quot;—hal ini penting untuk dipahami.</p>
<h3 id="artinya" tabindex="-1">Artinya <a class="header-anchor" href="#artinya" aria-label="Permalink to &quot;Artinya&quot;"></a></h3>
<p>Penggunaan &quot;editorial&quot; mencakup:</p>
<ul>
<li>Pelaporan berita</li>
<li>Konten pendidikan</li>
<li>Dokumenter</li>
<li>Komentar dan kritik</li>
</ul>
<p><strong>BUKAN penggunaan editorial:</strong></p>
<ul>
<li>Game komersial</li>
<li>Periklanan</li>
<li>Materi pemasaran</li>
<li>Produk yang dijual</li>
</ul>
<h3 id="mengapa-aset-mendapat-label-ini" tabindex="-1">Mengapa Aset Mendapat Label Ini <a class="header-anchor" href="#mengapa-aset-mendapat-label-ini" aria-label="Permalink to &quot;Mengapa Aset Mendapat Label Ini&quot;"></a></h3>
<p>Biasanya karena aset tersebut mengandung:</p>
<ul>
<li><strong>Merek dagang</strong> - Logo merek (Nike, Apple, dan sebagainya)</li>
<li><strong>Kemiripan rupa</strong> - Wajah orang sungguhan</li>
<li><strong>Desain berhak cipta</strong> - Desain mobil, desain produk</li>
<li><strong>Kekayaan intelektual</strong> - Karakter, benda yang mudah dikenali</li>
</ul>
<h3 id="contoh" tabindex="-1">Contoh <a class="header-anchor" href="#contoh" aria-label="Permalink to &quot;Contoh&quot;"></a></h3>
<p>Model 3D Ferrari mungkin diberi label &quot;Editorial Only&quot; karena:</p>
<ul>
<li>Desain Ferrari dilindungi</li>
<li>Penggunaannya dalam game dapat menyiratkan dukungan resmi</li>
<li>Penggunaan komersial memerlukan izin Ferrari</li>
</ul>
<p><strong>Rekomendasi:</strong> Hindari sepenuhnya aset &quot;Editorial Only&quot; untuk pengembangan game. Gunakan alternatif orisinal atau yang dilisensikan dengan semestinya.</p>
<hr>
<h2 id="lisensi-perangkat-lunak-mit-gpl-apache" tabindex="-1">Lisensi Perangkat Lunak (MIT, GPL, Apache) <a class="header-anchor" href="#lisensi-perangkat-lunak-mit-gpl-apache" aria-label="Permalink to &quot;Lisensi Perangkat Lunak (MIT, GPL, Apache)&quot;"></a></h2>
<p>Lisensi ini terutama berlaku untuk kode, tetapi terkadang juga mencakup aset.</p>
<h3 id="lisensi-mit" tabindex="-1">Lisensi MIT <a class="header-anchor" href="#lisensi-mit" aria-label="Permalink to &quot;Lisensi MIT&quot;"></a></h3>
<p><strong>Sangat permisif. Umum digunakan untuk kode dan aset yang berkaitan erat dengan kode.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Memodifikasi</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Mendistribusikan</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Menjadikannya milik eksklusif</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Atribusi</td>
<td>✅ Wajib (dalam berkas lisensi)</td>
</tr>
</tbody>
</table>
<p><strong>Persyaratan atribusi:</strong> Sertakan teks lisensi asli di suatu tempat dalam proyek Anda (biasanya dalam berkas LICENSES atau layar tentang).</p>
<p><strong>Contoh pemberitahuan MIT:</strong></p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>Lisensi MIT (MIT)</span></span>
<span class="line"><span>Hak Cipta (c) 2024 Penulis Asli</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Dengan ini, izin diberikan secara cuma-cuma kepada setiap orang yang memperoleh salinan...</span></span></code></pre>
</div><p><strong>Aset yang menggunakan MIT:</strong></p>
<ul>
<li>Contoh Three.js</li>
<li>Efek pmndrs/vanilla</li>
<li>Banyak paket npm yang menyertakan aset</li>
</ul>
<h3 id="gpl-gnu-general-public-license" tabindex="-1">GPL (GNU General Public License) <a class="header-anchor" href="#gpl-gnu-general-public-license" aria-label="Permalink to &quot;GPL (GNU General Public License)&quot;"></a></h3>
<p><strong>Lisensi copyleft. Karya turunan juga harus menggunakan GPL.</strong></p>
<table tabindex="0">
<thead>
<tr>
<th>Yang Dapat Anda Lakukan</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Menggunakan secara komersial</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Memodifikasi</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Mendistribusikan</td>
<td>✅ Ya</td>
</tr>
<tr>
<td>Menjadikannya milik eksklusif</td>
<td>❌ Tidak (jika didistribusikan)</td>
</tr>
<tr>
<td>Atribusi</td>
<td>✅ Wajib</td>
</tr>
</tbody>
</table>
<p><strong>Ketentuannya:</strong> Jika Anda mendistribusikan karya berlisensi GPL (atau karya turunannya), Anda harus:</p>
<ul>
<li>Menyediakan kode sumber</li>
<li>Melisensikannya berdasarkan GPL</li>
<li>Menyertakan teks lengkap lisensi GPL</li>
</ul>
<p><strong>Untuk game:</strong> Menggunakan aset berlisensi GPL dalam game yang didistribusikan merupakan hal yang rumit. Game itu sendiri mungkin harus menggunakan GPL. Konsultasikan dengan pengacara jika Anda tidak yakin.</p>
<p><strong>Rekomendasi:</strong> Hindari aset berlisensi GPL untuk game komersial kecuali Anda sepenuhnya memahami konsekuensinya.</p>
<hr>
<h2 id="pedoman-praktis" tabindex="-1">Pedoman Praktis <a class="header-anchor" href="#pedoman-praktis" aria-label="Permalink to &quot;Pedoman Praktis&quot;"></a></h2>
<h3 id="memilih-aset-berdasarkan-lisensi-urutan-yang-direkomendasikan" tabindex="-1">Memilih Aset Berdasarkan Lisensi (Urutan yang Direkomendasikan) <a class="header-anchor" href="#memilih-aset-berdasarkan-lisensi-urutan-yang-direkomendasikan" aria-label="Permalink to &quot;Memilih Aset Berdasarkan Lisensi (Urutan yang Direkomendasikan)&quot;"></a></h3>
<ol>
<li><strong>CC0</strong> - Tanpa batasan, tanpa kekhawatiran</li>
<li><strong>MIT</strong> - Sertakan teks lisensi, lalu Anda dapat menggunakannya</li>
<li><strong>Bebas Royalti</strong> - Ketentuan komersial standar, baca lisensi spesifiknya</li>
<li><strong>CC-BY</strong> - Wajib memberikan atribusi, tetapi selebihnya bebas</li>
<li><strong>CC-BY-SA</strong> - Atribusi + BerbagiSerupa, cocok untuk sebagian besar game</li>
<li><strong>CC-BY-NC</strong> - Hanya jika proyek Anda 100% nonkomersial</li>
<li><strong>GPL</strong> - Hindari kecuali Anda ingin game Anda bersumber terbuka</li>
<li><strong>Khusus Editorial</strong> - Jangan pernah digunakan dalam game</li>
</ol>
<h3 id="membuat-sistem-kredit" tabindex="-1">Membuat Sistem Kredit <a class="header-anchor" href="#membuat-sistem-kredit" aria-label="Permalink to &quot;Membuat Sistem Kredit&quot;"></a></h3>
<p>Bahkan untuk aset CC0, menyimpan catatan kredit merupakan praktik yang baik:</p>
<p><strong>1. Buat berkas CREDITS.md:</strong></p>
<div class="language-markdown vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">markdown</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold"># Kredit Aset</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold">## Model 3D</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Pesawat Luar Angkasa: Kenney (https://kenney.nl) - CC0</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Paket Pohon: Quaternius (https://quaternius.com) - CC0</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Karakter Robot: "RoboHelper" oleh @artist123 di Sketchfab - CC-BY 4.0</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  Dimodifikasi: Mengurangi jumlah poligon, mengubah warna</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold">## Tekstur</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Lantai Kayu: Poly Haven (https://polyhaven.com/a/wood_floor_01) - CC0</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Panel Logam: AmbientCG - CC0</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold">## Audio</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Suara Laser: "pew_laser" oleh sounduser di Freesound - CC-BY 3.0</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Musik Latar: Digubah oleh [Nama Anda] - Hak Cipta Dilindungi</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold">## Kode/Shader</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Bayangan Lembut: pmndrs/vanilla - Lisensi MIT</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Pascapemrosesan: Contoh Three.js - Lisensi MIT</span></span></code></pre>
</div><p><strong>2. Tambahkan layar kredit di dalam game:</strong></p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>KREDIT</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Model &#x26; Tekstur</span></span>
<span class="line"><span>- Poly Haven (polyhaven.com)</span></span>
<span class="line"><span>- Kenney (kenney.nl)</span></span>
<span class="line"><span>- Quaternius (quaternius.com)</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Audio</span></span>
<span class="line"><span>- Kontributor Freesound (lihat CREDITS.txt)</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Terima Kasih Khusus</span></span>
<span class="line"><span>- Tim Three.js</span></span>
<span class="line"><span>- Komunitas sumber terbuka</span></span></code></pre>
</div><h3 id="menangani-beragam-lisensi" tabindex="-1">Menangani Beragam Lisensi <a class="header-anchor" href="#menangani-beragam-lisensi" aria-label="Permalink to &quot;Menangani Beragam Lisensi&quot;"></a></h3>
<p>Ketika proyek Anda menggunakan aset dengan lisensi yang berbeda:</p>
<ol>
<li><strong>Catat semuanya</strong> - Kelola spreadsheet atau dokumen</li>
<li><strong>Gunakan atribusi paling ketat</strong> - Jika ada aset yang memerlukan kredit, sediakan bagian kredit</li>
<li><strong>Pisahkan penggunaannya</strong> - Jangan gunakan aset NC dalam proyek komersial</li>
<li><strong>Jika ragu, ganti</strong> - Tukar aset yang meragukan dengan aset berlisensi jelas</li>
</ol>
<h3 id="tanda-bahaya-yang-perlu-diwaspadai" tabindex="-1">Tanda Bahaya yang Perlu Diwaspadai <a class="header-anchor" href="#tanda-bahaya-yang-perlu-diwaspadai" aria-label="Permalink to &quot;Tanda Bahaya yang Perlu Diwaspadai&quot;"></a></h3>
<p>⚠️ <strong>Berhati-hatilah ketika:</strong></p>
<ul>
<li>Lisensi tidak dinyatakan dengan jelas</li>
<li>Aset terlihat terlalu profesional untuk dibagikan gratis (mungkin bajakan)</li>
<li>Aset merupakan karakter/merek yang mudah dikenali</li>
<li>Situs terlihat mencurigakan atau tidak resmi</li>
<li>Ketentuannya menyatakan &quot;hanya untuk penggunaan pribadi&quot;</li>
<li>Aset diambil dari sebuah game</li>
</ul>
<p>✅ <strong>Indikator tepercaya:</strong></p>
<ul>
<li>Platform yang sudah mapan (Poly Haven, Kenney, Sketchfab)</li>
<li>Lisensi yang jelas di halaman unduhan</li>
<li>Kreator memiliki portofolio/rekam jejak</li>
<li>Aset merupakan karya orisinal, bukan salinan</li>
</ul>
<hr>
<h2 id="kompatibilitas-lisensi" tabindex="-1">Kompatibilitas Lisensi <a class="header-anchor" href="#kompatibilitas-lisensi" aria-label="Permalink to &quot;Kompatibilitas Lisensi&quot;"></a></h2>
<p>Tidak semua lisensi dapat digabungkan. Berikut kombinasi yang dapat digunakan bersama:</p>
<h3 id="menggabungkan-aset-dalam-satu-proyek" tabindex="-1">Menggabungkan Aset dalam Satu Proyek <a class="header-anchor" href="#menggabungkan-aset-dalam-satu-proyek" aria-label="Permalink to &quot;Menggabungkan Aset dalam Satu Proyek&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Lisensi A</th>
<th>+</th>
<th>Lisensi B</th>
<th>=</th>
<th>Hasil</th>
</tr>
</thead>
<tbody>
<tr>
<td>CC0</td>
<td>+</td>
<td>Apa pun</td>
<td>=</td>
<td>✅ Aman</td>
</tr>
<tr>
<td>CC-BY</td>
<td>+</td>
<td>CC-BY</td>
<td>=</td>
<td>✅ Cantumkan kredit untuk keduanya</td>
</tr>
<tr>
<td>CC-BY</td>
<td>+</td>
<td>CC-BY-SA</td>
<td>=</td>
<td>✅ Cantumkan kredit untuk keduanya, SA berlaku pada aset tersebut</td>
</tr>
<tr>
<td>CC-BY</td>
<td>+</td>
<td>CC-BY-NC</td>
<td>=</td>
<td>⚠️ Proyek menjadi NC</td>
</tr>
<tr>
<td>CC-BY-SA</td>
<td>+</td>
<td>CC-BY-NC-SA</td>
<td>=</td>
<td>⚠️ Tidak kompatibel untuk karya turunan</td>
</tr>
<tr>
<td>MIT</td>
<td>+</td>
<td>CC-BY</td>
<td>=</td>
<td>✅ Sertakan lisensi MIT, cantumkan kredit CC-BY</td>
</tr>
<tr>
<td>GPL</td>
<td>+</td>
<td>Proprietary</td>
<td>=</td>
<td>❌ Bermasalah</td>
</tr>
</tbody>
</table>
<h3 id="aturan-utama" tabindex="-1">Aturan Utama <a class="header-anchor" href="#aturan-utama" aria-label="Permalink to &quot;Aturan Utama&quot;"></a></h3>
<p>Saat menggabungkan lisensi, ketentuan yang paling ketat berlaku pada karya akhir.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="dapatkah-saya-menggunakan-aset-cc-by-dalam-game-komersial" tabindex="-1">Dapatkah saya menggunakan aset CC-BY dalam game komersial? <a class="header-anchor" href="#dapatkah-saya-menggunakan-aset-cc-by-dalam-game-komersial" aria-label="Permalink to &quot;Dapatkah saya menggunakan aset CC-BY dalam game komersial?&quot;"></a></h3>
<p><strong>Ya.</strong> CC-BY mengizinkan penggunaan komersial. Anda hanya perlu menyertakan atribusi.</p>
<h3 id="apakah-saya-harus-menjadikan-game-saya-sumber-terbuka-jika-menggunakan-aset-cc-by-sa" tabindex="-1">Apakah saya harus menjadikan game saya sumber terbuka jika menggunakan aset CC-BY-SA? <a class="header-anchor" href="#apakah-saya-harus-menjadikan-game-saya-sumber-terbuka-jika-menggunakan-aset-cc-by-sa" aria-label="Permalink to &quot;Apakah saya harus menjadikan game saya sumber terbuka jika menggunakan aset CC-BY-SA?&quot;"></a></h3>
<p><strong>Tidak.</strong> Kode game Anda dapat tetap bersifat proprieter. Hanya aset tersebut (beserta modifikasinya) yang harus tetap menggunakan CC-BY-SA jika didistribusikan secara terpisah.</p>
<h3 id="bagaimana-jika-saya-memodifikasi-aset-cc-by-hingga-tidak-dapat-dikenali" tabindex="-1">Bagaimana jika saya memodifikasi aset CC-BY hingga tidak dapat dikenali? <a class="header-anchor" href="#bagaimana-jika-saya-memodifikasi-aset-cc-by-hingga-tidak-dapat-dikenali" aria-label="Permalink to &quot;Bagaimana jika saya memodifikasi aset CC-BY hingga tidak dapat dikenali?&quot;"></a></h3>
<p><strong>Tetap cantumkan atribusi.</strong> Jika Anda memulai dari karya orang lain, Anda harus memberi mereka kredit, terlepas dari seberapa banyak Anda mengubahnya. Hal ini lebih aman secara hukum sekaligus benar secara etis.</p>
<h3 id="dapatkah-saya-menggunakan-audio-freesound-dalam-game-komersial" tabindex="-1">Dapatkah saya menggunakan audio Freesound dalam game komersial? <a class="header-anchor" href="#dapatkah-saya-menggunakan-audio-freesound-dalam-game-komersial" aria-label="Permalink to &quot;Dapatkah saya menggunakan audio Freesound dalam game komersial?&quot;"></a></h3>
<p><strong>Tergantung pada suara tersebut.</strong> Setiap suara di Freesound memiliki lisensinya sendiri. Gunakan filter CC0 agar dapat digunakan tanpa kekhawatiran, atau CC-BY jika Anda dapat mencantumkan atribusi.</p>
<h3 id="apakah-game-gratis-dengan-iklan-termasuk-komersial" tabindex="-1">Apakah game gratis dengan iklan termasuk &quot;komersial&quot;? <a class="header-anchor" href="#apakah-game-gratis-dengan-iklan-termasuk-komersial" aria-label="Permalink to &quot;Apakah game gratis dengan iklan termasuk &quot;komersial&quot;?&quot;"></a></h3>
<p><strong>Ya.</strong> Segala bentuk monetisasi (iklan, pembelian dalam aplikasi, donasi, Patreon) umumnya dianggap komersial. Hindari aset berlisensi NC.</p>
<h3 id="dapatkah-saya-menggunakan-aset-cc0-lalu-menjualnya" tabindex="-1">Dapatkah saya menggunakan aset CC0 lalu menjualnya? <a class="header-anchor" href="#dapatkah-saya-menggunakan-aset-cc0-lalu-menjualnya" aria-label="Permalink to &quot;Dapatkah saya menggunakan aset CC0 lalu menjualnya?&quot;"></a></h3>
<p><strong>Secara teknis bisa, tetapi...</strong> Anda dapat menyertakan aset CC0 dalam produk yang Anda jual. Namun, Anda tidak boleh mengaku sebagai pembuatnya jika ditanya. Menjual kembali aset CC0 tanpa perubahan memang legal, tetapi patut dipertanyakan secara etis.</p>
<h3 id="bagaimana-dengan-aset-buatan-ai" tabindex="-1">Bagaimana dengan aset buatan AI? <a class="header-anchor" href="#bagaimana-dengan-aset-buatan-ai" aria-label="Permalink to &quot;Bagaimana dengan aset buatan AI?&quot;"></a></h3>
<p><strong>Rumit.</strong> Konsensus hukum saat ini masih belum jelas. Beberapa hal yang perlu dipertimbangkan:</p>
<ul>
<li>Gambar buatan AI mungkin tidak dapat dilindungi hak cipta (karena tidak memiliki pencipta manusia)</li>
<li>Lisensi data pelatihan masih diperdebatkan secara hukum</li>
<li>Beberapa marketplace (CGTrader) memiliki pembatasan &quot;Tanpa AI&quot;</li>
<li>Jika ragu, gunakan aset buatan manusia dengan lisensi yang jelas</li>
</ul>
<p>Khusus mengenai kelayakan perlindungan hak cipta, laporan Kantor Hak Cipta AS pada Januari 2025 tentang AI merupakan panduan paling jelas hingga saat ini: karya yang sepenuhnya dihasilkan oleh AI tidak dapat dilindungi hak cipta karena hak cipta mensyaratkan kepengarangan manusia, dan prompt saja (bahkan yang panjang dan mendetail) tidak membuat hasilnya menjadi milik Anda. Namun, AI yang digunakan sebagai alat, ketika manusia secara bermakna memilih, menyusun, atau memodifikasi hasilnya, dapat menghasilkan karya yang bisa dilindungi hak cipta, dengan penilaian berdasarkan setiap kasus. Jadi, tekstur buatan AI yang Anda gunakan tanpa perubahan kemungkinan tidak memiliki perlindungan hak cipta yang dapat Anda tegakkan, sedangkan adegan yang Anda bangun dan edit secara substansial dengan elemen AI dapat memiliki perlindungan tersebut.</p>
<h3 id="apakah-saya-memerlukan-pengacara" tabindex="-1">Apakah saya memerlukan pengacara? <a class="header-anchor" href="#apakah-saya-memerlukan-pengacara" aria-label="Permalink to &quot;Apakah saya memerlukan pengacara?&quot;"></a></h3>
<p><strong>Untuk sebagian besar game indie, tidak.</strong> Jika Anda menggunakan CC0, MIT, dan lisensi Bebas Royalti standar dari sumber tepercaya, Anda tidak akan bermasalah.</p>
<p><strong>Pertimbangkan nasihat hukum jika:</strong></p>
<ul>
<li>Game Anda berpotensi menghasilkan pendapatan signifikan</li>
<li>Anda menggunakan aset berlisensi GPL</li>
<li>Anda tidak yakin tentang lisensi tertentu</li>
<li>Anda membuat marketplace aset</li>
</ul>
<hr>
<h2 id="templat-atribusi" tabindex="-1">Templat Atribusi <a class="header-anchor" href="#templat-atribusi" aria-label="Permalink to &quot;Templat Atribusi&quot;"></a></h2>
<p>Salin dan sesuaikan templat berikut untuk proyek Anda.</p>
<h3 id="berkas-kredit-sederhana" tabindex="-1">Berkas Kredit Sederhana <a class="header-anchor" href="#berkas-kredit-sederhana" aria-label="Permalink to &quot;Berkas Kredit Sederhana&quot;"></a></h3>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>KREDIT ASET</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Game ini menggunakan aset dari sumber-sumber berikut:</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Model 3D</span></span>
<span class="line"><span>- Kenney.nl (CC0) - https://kenney.nl</span></span>
<span class="line"><span>- Quaternius (CC0) - https://quaternius.com</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Tekstur  </span></span>
<span class="line"><span>- Poly Haven (CC0) - https://polyhaven.com</span></span>
<span class="line"><span>- AmbientCG (CC0) - https://ambientcg.com</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Audio</span></span>
<span class="line"><span>- Freesound.org (berbagai lisensi CC)</span></span>
<span class="line"><span>  - "explosion.wav" oleh user123 (CC-BY 3.0)</span></span>
<span class="line"><span>  - "footstep.wav" oleh user456 (CC0)</span></span>
<span class="line"><span></span></span>
<span class="line"><span>Terima kasih kepada semua kreator yang membagikan karya mereka!</span></span></code></pre>
</div><h3 id="atribusi-mendetail-cc-by" tabindex="-1">Atribusi Mendetail (CC-BY) <a class="header-anchor" href="#atribusi-mendetail-cc-by" aria-label="Permalink to &quot;Atribusi Mendetail (CC-BY)&quot;"></a></h3>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>"Nama Aset" oleh Nama Kreator</span></span>
<span class="line"><span>Sumber: https://example.com/asset-url</span></span>
<span class="line"><span>Lisensi: Creative Commons Atribusi 4.0 Internasional (CC-BY 4.0)</span></span>
<span class="line"><span>URL Lisensi: https://creativecommons.org/licenses/by/4.0/</span></span>
<span class="line"><span>Modifikasi: [Jelaskan perubahan yang dibuat, atau "Tidak ada"]</span></span></code></pre>
</div><h3 id="penyertaan-lisensi-mit" tabindex="-1">Penyertaan Lisensi MIT <a class="header-anchor" href="#penyertaan-lisensi-mit" aria-label="Permalink to &quot;Penyertaan Lisensi MIT&quot;"></a></h3>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>Perangkat lunak ini menyertakan kode/aset yang dilisensikan berdasarkan Lisensi MIT:</span></span>
<span class="line"><span></span></span>
<span class="line"><span>---</span></span>
<span class="line"><span>[Teks hak cipta dan lisensi asli]</span></span>
<span class="line"><span>---</span></span></code></pre>
</div><hr>
<h2 id="ringkasan" tabindex="-1">Ringkasan <a class="header-anchor" href="#ringkasan" aria-label="Permalink to &quot;Ringkasan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Jika Anda Menginginkan...</th>
<th>Gunakan Lisensi Ini</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tanpa pembatasan sama sekali</td>
<td>CC0</td>
</tr>
<tr>
<td>Penggunaan komersial dengan kerepotan minimal</td>
<td>CC0, Bebas Royalti, MIT</td>
</tr>
<tr>
<td>Penggunaan komersial dan bersedia mencantumkan kredit</td>
<td>CC-BY</td>
</tr>
<tr>
<td>Hanya untuk proyek hobi gratis</td>
<td>Apa pun kecuali Editorial</td>
</tr>
<tr>
<td>Keamanan hukum maksimal</td>
<td>CC0 dari sumber tepercaya</td>
</tr>
</tbody>
</table>
<p><strong>Aturan utama:</strong></p>
<ol>
<li>Jika ragu, gunakan CC0</li>
<li>Selalu periksa lisensi sebelum mengunduh</li>
<li>Simpan catatan tentang sumber setiap aset</li>
<li>Sertakan berkas kredit meskipun tidak diwajibkan</li>
<li>Ganti aset yang meragukan daripada mengambil risiko</li>
</ol>
<hr>
<h2 id="sumber-referensi" tabindex="-1">Sumber Referensi <a class="header-anchor" href="#sumber-referensi" aria-label="Permalink to &quot;Sumber Referensi&quot;"></a></h2>
<ul>
<li><a href="https://creativecommons.org/choose/" target="_blank" rel="noreferrer">Pemilih Lisensi Creative Commons</a></li>
<li><a href="https://tldrlegal.com/" target="_blank" rel="noreferrer">TL;DR Legal</a> — penjelasan lisensi dalam bahasa yang mudah dipahami</li>
<li><a href="https://choosealicense.com/" target="_blank" rel="noreferrer">Pilih Lisensi</a> — untuk lisensi kode</li>
</ul>
<BuildCta
  title="Buat dengan aset yang sudah memiliki izin"
  desc="Semua yang ditempatkan Cinevva menggunakan CC0 atau dibuat untuk Anda, jadi lisensi bukan masalah."
  prompt="Buat game pertanian low-poly menggunakan properti CC0 gratis" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — penyedia, format, dan alat pencarian untuk setiap jenis aset</li>
<li><a href="/id/guides/game-dev-courses.html">Kursus Pengembangan Game Online</a> — kursus yang mengajarkan pembuatan aset di Blender dan alat lainnya</li>
<li><a href="/id/guides/game-jams-hackathons.html">Game Jam &amp; Hackathon</a> — paket aset dengan lisensi yang cocok untuk game jam</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/game-asset-licenses.jpg?v=4" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Tempat Menemukan Aset Game Gratis pada 2026 (20+ Sumber)]]></title>
            <link>https://app.cinevva.com/id/guides/game-assets-guide</link>
            <guid>https://app.cinevva.com/id/guides/game-assets-guide</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[20+ sumber aset game gratis pada 2026 - model 3D, tekstur, audio, sprite, animasi, dan shader, lengkap dengan penjelasan lisensi serta kegunaan terbaik setiap situs.]]></description>
            <content:encoded><![CDATA[<h1 id="tempat-menemukan-aset-game-gratis-pada-2026-20-sumber" tabindex="-1">Tempat Menemukan Aset Game Gratis pada 2026 (20+ Sumber) <a class="header-anchor" href="#tempat-menemukan-aset-game-gratis-pada-2026-20-sumber" aria-label="Permalink to &quot;Tempat Menemukan Aset Game Gratis pada 2026 (20+ Sumber)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Tempat menemukan aset game gratis berkualitas tinggi untuk game web Anda: model 3D, tekstur, sprite, audio, musik, animasi, dan shader. Sebagian besar penyedia ini dapat dicari langsung di dalam pustaka aset Cinevva (cari catatan &quot;Dapat Dicari di Cinevva&quot;), dan kami juga menyertakan sumber eksternal terbaik.</p>
<div class="info custom-block"><p class="custom-block-title">Coba Pencarian Aset Kami</p>
<p>Cari di semua sumber ini sekaligus melalui <a href="/id/assets.html">Pencarian Pustaka Aset</a>. Temukan model 3D, tekstur, audio, dan lainnya dari satu kotak pencarian.</p>
<p><strong>Baru:</strong> Aset dengan tautan unduhan langsung menampilkan ikon unduh pada ubin. Klik untuk langsung mengunduh tanpa meninggalkan hasil pencarian.</p>
<p><strong>Pencarian cepat berdasarkan sumber:</strong> <a href="/id/assets.html?providers=polyhaven">Poly Haven</a> · <a href="/id/assets.html?providers=sketchfab">Sketchfab</a> · <a href="/id/assets.html?providers=freesound">Freesound</a> · <a href="/id/assets.html?providers=kenney">Kenney</a> · <a href="/id/assets.html?providers=ambientcg">AmbientCG</a></p>
</div>
<div class="tip custom-block"><p class="custom-block-title">Memahami Lisensi</p>
<p>Tidak yakin apa arti CC0, CC-BY, atau Bebas Royalti? Baca panduan <a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> kami untuk uraian lengkap.</p>
</div>
<h2 id="referensi-cepat" tabindex="-1">Referensi Cepat <a class="header-anchor" href="#referensi-cepat" aria-label="Permalink to &quot;Referensi Cepat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kebutuhan</th>
<th>Penyedia Terbaik</th>
<th>Lisensi</th>
<th>Unduhan Langsung</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Model 3D (berkualitas tinggi)</strong></td>
<td>Poly Haven, Sketchfab, BlenderKit</td>
<td>CC0 / Beragam</td>
<td>✅ / Manual</td>
</tr>
<tr>
<td><strong>Model 3D (siap digunakan dalam game)</strong></td>
<td>Kenney, Quaternius</td>
<td>CC0</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Model 3D (low-poly bergaya)</strong></td>
<td>Synty POLYGON, Quaternius</td>
<td>Bebas Royalti / CC0</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Model 3D (lokapasar)</strong></td>
<td>CGTrader, TurboSquid</td>
<td>Bebas Royalti</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Tekstur (PBR)</strong></td>
<td>Poly Haven, AmbientCG, BlenderKit</td>
<td>CC0 / Beragam</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Sprite/2D</strong></td>
<td>Kenney, itch.io, OpenGameArt</td>
<td>CC0 / Beragam</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Efek Suara</strong></td>
<td>Freesound, Sonniss GDC, Kenney</td>
<td>Beragam / Bebas Royalti / CC0</td>
<td>⚠️ / ✅</td>
</tr>
<tr>
<td><strong>Musik</strong></td>
<td>Jamendo</td>
<td>CC untuk penggunaan pribadi / sinkronisasi berbayar untuk penggunaan komersial</td>
<td>⚠️</td>
</tr>
<tr>
<td><strong>Animasi Karakter</strong></td>
<td>Mixamo</td>
<td>Gratis untuk penggunaan komersial</td>
<td>Manual</td>
</tr>
<tr>
<td><strong>Shader/Efek</strong></td>
<td>Shadertoy, Three.js Examples</td>
<td>Beragam / MIT</td>
<td>Lihat kode</td>
</tr>
<tr>
<td><strong>Model Blender</strong></td>
<td>BlendSwap</td>
<td>CC-BY</td>
<td>Manual</td>
</tr>
</tbody>
</table>
<hr>
<h2 id="model-3d" tabindex="-1">Model 3D <a class="header-anchor" href="#model-3d" aria-label="Permalink to &quot;Model 3D&quot;"></a></h2>
<h3 id="poly-haven" tabindex="-1">Poly Haven <a class="header-anchor" href="#poly-haven" aria-label="Permalink to &quot;Poly Haven&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Model fotorealistis berkualitas tinggi, HDRI, dan tekstur PBR</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://polyhaven.com" target="_blank" rel="noreferrer">polyhaven.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (Domain Publik) - tidak memerlukan atribusi</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>2.200+ aset (520+ model, 780+ tekstur, 980+ HDRI)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF, Blend, FBX</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya - tidak memerlukan kunci</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>✅ Ya - resolusi 1K melalui CDN</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Kualitas profesional yang sesuai untuk proyek komersial</li>
<li>Semua aset berlisensi CC0 - gunakan sesuka Anda</li>
<li>Tersedia dalam berbagai resolusi (1K hingga 16K untuk tekstur)</li>
<li>Tautan unduhan langsung melalui API - ikon unduh di hasil pencarian</li>
</ul>
<p><strong>Paling cocok untuk menemukan:</strong></p>
<ul>
<li>Elemen arsitektur (perabot, bangunan)</li>
<li>Objek alami (bebatuan, tanaman, medan)</li>
<li>HDRI untuk pencahayaan</li>
<li>Tekstur material PBR</li>
</ul>
<hr>
<h3 id="kenney" tabindex="-1">Kenney <a class="header-anchor" href="#kenney" aria-label="Permalink to &quot;Kenney&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Aset low-poly siap pakai untuk game dengan gaya visual yang konsisten</p>
<figure class="sample-sheet">
<a href="/id/assets?providers=kenney"><img src="https://cdn.cinevva.com/guides/samples/samples-kenney-3d.jpg" alt="Contoh model 3D CC0 dari Kenney: mobil balap, pesawat antariksa, menara pengepungan, rumah, kapal bajak laut, kincir angin, UFO, dan truk pemadam kebakaran" loading="lazy"></a>
<figcaption>Delapan properti Kenney, semuanya CC0. <a href="/id/assets?providers=kenney">Jelajahi seluruh koleksi Kenney di pustaka aset</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://kenney.nl" target="_blank" rel="noreferrer">kenney.nl</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (Domain Publik)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>270+ paket (40.000+ aset individual)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLB, PNG, WAV, dan lainnya</td>
</tr>
<tr>
<td><strong>Katalog</strong></td>
<td>Tersedia katalog luring (pencarian instan)</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>✅ Ya - tautan menuju halaman paket aset</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Pustaka aset yang sangat besar dan berfokus pada game</li>
<li>Gaya visual yang konsisten dalam setiap paket</li>
<li>Semuanya siap digunakan dalam game dan dioptimalkan untuk performa</li>
<li>Menyediakan model, sprite, elemen UI, dan suara dalam satu tempat</li>
</ul>
<p><strong>Paket terbaik untuk memulai:</strong></p>
<ul>
<li><strong>Space Kit</strong> - Pesawat antariksa, asteroid, stasiun</li>
<li><strong>Platformer Kit</strong> - Karakter, ubin, rintangan</li>
<li><strong>Nature Kit</strong> - Pohon, bebatuan, rumput</li>
<li><strong>Furniture Kit</strong> - Properti dalam ruangan</li>
<li><strong>UI Pack</strong> - Tombol, ikon, elemen HUD</li>
</ul>
<hr>
<h3 id="quaternius" tabindex="-1">Quaternius <a class="header-anchor" href="#quaternius" aria-label="Permalink to &quot;Quaternius&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Model 3D low-poly bergaya</p>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-quaternius.jpg" alt="Contoh model low-poly CC0 dari Quaternius: monster, kapten bajak laut, mech, penyihir, pesawat antariksa, shiba inu, dan kesatria" loading="lazy"></a>
<figcaption>Karakter dan pesawat Quaternius, semuanya CC0 dan sebagian besar memiliki animasi. <a href="/id/assets">Cari semuanya di pustaka aset gratis</a>.</figcaption>
</figure>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://quaternius.com" target="_blank" rel="noreferrer">quaternius.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0 (Domain Publik)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>79 paket (~1.148 model)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF/GLB, FBX</td>
</tr>
<tr>
<td><strong>Katalog</strong></td>
<td>Tersedia katalog luring</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>✅ Ya - satu berkas ZIP per paket</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Estetika low-poly bergaya yang menggemaskan</li>
<li>Sangat cocok untuk game indie</li>
<li>Paket bertema yang tertata rapi</li>
<li>Jumlah poligon yang dioptimalkan</li>
</ul>
<p><strong>Paket populer:</strong></p>
<ul>
<li>Ultimate Modular Characters</li>
<li>Medieval Pack</li>
<li>Ultimate Spaceships</li>
<li>Ultimate Monsters</li>
<li>Nature Pack</li>
</ul>
<hr>
<h3 id="sketchfab" tabindex="-1">Sketchfab <a class="header-anchor" href="#sketchfab" aria-label="Permalink to &quot;Sketchfab&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Beragam model, termasuk model yang kompleks dan mendetail</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://sketchfab.com" target="_blank" rel="noreferrer">sketchfab.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam (periksa setiap model)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>4 juta+ model</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF, FBX, OBJ</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya - kunci opsional untuk batas yang lebih tinggi</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>⚠️ Tautan menuju halaman unduhan (memerlukan login)</td>
</tr>
</tbody>
</table>
<p><strong>Catatan:</strong> Store berbayar Sketchfab telah ditutup dan dipindahkan ke lokapasar <a href="https://www.fab.com" target="_blank" rel="noreferrer">Fab</a> milik Epic, tetapi model gratis dan model yang hanya dapat dilihat tetap tersedia di Sketchfab serta masih dapat diunduh pada 2026, sementara API unduhan dan penampilnya tetap berfungsi. Pemfilteran untuk model gratis yang dapat diunduh bekerja persis seperti sebelumnya. Ada satu hal yang perlu diketahui: hanya konten CC-BY dan Fab Standard yang dapat dipindahkan ke Fab, sedangkan model CC0, CC-BY-SA, CC-BY-NC, dan CC-BY-ND tetap tersedia secara eksklusif di Sketchfab. Anggap Sketchfab sebagai sumber CC0 yang masih berguna tetapi perlahan menyusut, dan unduh apa yang Anda butuhkan daripada menganggap asetnya akan selalu tersedia.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Pustaka model 3D terbesar</li>
<li>Pratinjau 3D sebelum mengunduh</li>
<li>Dapat difilter berdasarkan status &quot;dapat diunduh&quot; dan lisensi</li>
<li>Banyak seniman profesional</li>
</ul>
<p><strong>Kiat pencarian:</strong></p>
<ul>
<li>Tambahkan <code>downloadable:true</code> ke pencarian</li>
<li>Filter berdasarkan lisensi CC0 atau CC-BY</li>
<li>Periksa jumlah poligon untuk game web (&lt; 100 ribu lebih disarankan)</li>
<li>Cari tag &quot;game-ready&quot;</li>
</ul>
<div class="tip custom-block"><p class="custom-block-title">Dapat Dicari di Cinevva</p>
<p>Hasil Sketchfab muncul langsung di panel Aset Cinevva.</p>
</div>
<hr>
<h3 id="blenderkit" tabindex="-1">BlenderKit <a class="header-anchor" href="#blenderkit" aria-label="Permalink to &quot;BlenderKit&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Pustaka dalam aplikasi yang sangat besar berisi model, material, dan HDRI</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.blenderkit.com" target="_blank" rel="noreferrer">blenderkit.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas Royalti dan CC0 - periksa setiap aset</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan model, material, HDRI, dan kuas</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Blend, GLTF, FBX (bervariasi)</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya - tersedia tingkat gratis</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Salah satu pustaka aset terbesar dengan campuran konten gratis dan berbayar</li>
<li>Menyediakan model, material PBR, dan HDRI dalam satu tempat</li>
<li>Sangat cocok untuk properti lingkungan, material, dan penataan adegan</li>
<li>Dapat difilter berdasarkan lisensi sehingga Anda dapat tetap menggunakan CC0 saat diperlukan</li>
</ul>
<p><strong>Catatan:</strong> Aset gratis dan berbayar ditampilkan berdampingan, jadi filter berdasarkan tingkat gratis atau CC0 jika anggaran menjadi pertimbangan.</p>
<div class="tip custom-block"><p class="custom-block-title">Dapat Dicari di Cinevva</p>
<p>BlenderKit terintegrasi ke panel Aset Cinevva - cari bersama Poly Haven dan Sketchfab tanpa meninggalkan editor.</p>
</div>
<hr>
<h3 id="fab-epic-games" tabindex="-1">Fab (Epic Games) <a class="header-anchor" href="#fab-epic-games" aria-label="Permalink to &quot;Fab (Epic Games)&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Aset siap pakai untuk game dan Quixel Megascans gratis, semuanya dalam satu lokapasar</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.fab.com" target="_blank" rel="noreferrer">fab.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Standard (Personal/Professional) dan Creative Commons (sebagian CC0) - periksa setiap cantuman</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Model, material, lingkungan, VFX, audio, animasi, plugin</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Unreal Engine, Unity, glTF, dan lainnya</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Pendaftaran gratis, campuran konten gratis dan berbayar</td>
</tr>
</tbody>
</table>
<p>Fab adalah lokapasar konten terpadu milik Epic, penerus Unreal Engine Marketplace, ArtStation Marketplace, Sketchfab Store, dan Quixel Megascans. Daya tarik utamanya bagi pemburu aset adalah paket pemula Megascans yang gratis secara permanen, berisi lebih dari 1.500 aset pilihan, ditambah permukaan, decal, dan pemindaian 3D yang bebas digunakan di mesin game apa pun. Perlu diketahui bahwa masa ketika seluruh pustaka Megascans tersedia gratis telah berakhir pada 31 Desember 2024, dan katalog lengkap yang berisi sekitar 17.000 aset kini berbayar. Namun, Epic tetap menggratiskan paket pemula berisi 1.500 aset tersebut dan mengganti koleksi &quot;Limited-Time Free&quot; baru setiap dua minggu. Filter berdasarkan Creative Commons atau lisensi Standard gratis agar tetap hemat, dan periksa lisensi setiap cantuman sebelum merilis game.</p>
<hr>
<h3 id="blendswap" tabindex="-1">BlendSwap <a class="header-anchor" href="#blendswap" aria-label="Permalink to &quot;BlendSwap&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Model Blender kompleks yang dilengkapi material</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://blendswap.com" target="_blank" rel="noreferrer">blendswap.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam (umumnya CC-BY)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan model Blender</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Blend (konversikan ke GLTF)</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Konten berkualitas yang digerakkan oleh komunitas</li>
<li>Berkas Blender lengkap beserta material</li>
<li>Cocok untuk dipelajari atau dimodifikasi</li>
<li>Banyak model arsitektur dan kendaraan</li>
</ul>
<p><strong>Catatan:</strong> Biasanya perlu diekspor ke GLTF untuk digunakan di web.</p>
<p><strong>Pembaruan 2026:</strong> BlendSwap berganti kepemilikan dan diluncurkan kembali pada Mei 2026 dengan situs yang dibangun ulang dan lebih cepat. Pustakanya tetap utuh setelah pemindahan tersebut dan semuanya tetap gratis di bawah lisensi Creative Commons.</p>
<hr>
<h3 id="poly-pizza-icosa-gallery" tabindex="-1">Poly Pizza &amp; Icosa Gallery <a class="header-anchor" href="#poly-pizza-icosa-gallery" aria-label="Permalink to &quot;Poly Pizza &amp; Icosa Gallery&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Model 3D low-poly, penerus spiritual Google Poly</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://poly.pizza" target="_blank" rel="noreferrer">poly.pizza</a> · <a href="https://icosa.gallery" target="_blank" rel="noreferrer">icosa.gallery</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Sebagian besar CC-BY (atribusi), dengan sebagian koleksi CC0 di Poly Pizza</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Poly Pizza: 10.000+ model, termasuk arsip &quot;Poly by Google&quot; berisi sekitar 2.294 model</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>GLTF/GLB, OBJ</td>
</tr>
</tbody>
</table>
<p>Google Poly ditutup pada Juni 2021, tetapi katalog low-poly-nya tetap hidup. Poly Pizza menampung arsip koleksi &quot;Poly by Google&quot; beserta ribuan model komunitas baru, sementara Icosa Gallery yang bersifat sumber terbuka dan nirlaba melanjutkan misi aset terbuka tersebut. Sebagian besar model berlisensi CC-BY (cantumkan kredit kepada kreator), dengan sebagian lainnya berlisensi CC0. Sangat cocok untuk mendapatkan properti bergaya dengan cepat yang serasi dengan tampilan low-poly Kenney dan Quaternius.</p>
<hr>
<h3 id="synty-studios-polygon" tabindex="-1">Synty Studios (POLYGON) <a class="header-anchor" href="#synty-studios-polygon" aria-label="Permalink to &quot;Synty Studios (POLYGON)&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Aset low-poly bergaya profesional dengan gaya visual yang konsisten</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://syntystore.com" target="_blank" rel="noreferrer">syntystore.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas Royalti (5 seat per pembelian)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>100+ paket bertema</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, Unity, Unreal</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Berbayar (dengan paket pemula gratis)</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Estetika low-poly bergaya yang menjadi standar industri</li>
<li>Gaya visual yang konsisten di SEMUA paket (dapat dipadupadankan!)</li>
<li>Kualitas profesional, dioptimalkan untuk game</li>
<li>Karakter memiliki rig Mecanim (Unity)</li>
</ul>
<p><strong>Paket gratis yang tersedia:</strong></p>
<ul>
<li><strong>POLYGON Starter Pack</strong> - Contoh properti, karakter, dan elemen lingkungan</li>
<li><strong>POLYGON Santa Pack</strong> - Aset bertema liburan</li>
<li><strong>POLYGON Easter Pack</strong> - Dekorasi musiman</li>
<li><strong>POLYGON Xmas Pack</strong> - Aset Natal/musim dingin</li>
</ul>
<p><strong>Paket berbayar populer:</strong></p>
<ul>
<li>POLYGON City, Town, Fantasy, Sci-Fi</li>
<li>POLYGON Nature, Farm, Prototype</li>
<li>POLYGON Knights, Samurai, Pirates</li>
</ul>
<p><strong>Paling cocok untuk:</strong></p>
<ul>
<li>Game indie yang membutuhkan arahan visual terpadu</li>
<li>Pembuatan prototipe cepat dengan tampilan yang matang</li>
<li>Game seluler dan web (jumlah poligon yang dioptimalkan)</li>
</ul>
<p><strong>Catatan:</strong> Paket gratis sangat cocok untuk mencoba gayanya. Paket berbayar menawarkan nilai yang sangat baik dari segi jumlah dan kualitas.</p>
<hr>
<h3 id="cgtrader" tabindex="-1">CGTrader <a class="header-anchor" href="#cgtrader" aria-label="Permalink to &quot;CGTrader&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Lokapasar besar dengan banyak model gratis</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://cgtrader.com" target="_blank" rel="noreferrer">cgtrader.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas Royalti (per model)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>1 juta+ model (banyak yang gratis)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, OBJ, GLTF, Blend</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Tidak</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Beragam pilihan dari seniman profesional</li>
<li>Tersedia banyak model gratis</li>
<li>Dapat difilter berdasarkan harga dan format</li>
<li>Menyediakan model low-poly maupun model sangat mendetail</li>
</ul>
<p><strong>Ketentuan lisensi:</strong></p>
<ul>
<li>✅ Dapat digunakan dalam game/aplikasi komersial</li>
<li>✅ Dapat dimodifikasi dan diadaptasi</li>
<li>❌ Berkas model tidak boleh dijual kembali</li>
<li>❌ Pengguna tidak boleh diizinkan mengekstrak berkas model</li>
</ul>
<p><strong>Kiat pencarian:</strong></p>
<ul>
<li>Filter berdasarkan &quot;Free&quot; pada bagian harga</li>
<li>Periksa jumlah poligon</li>
<li>Cari tag &quot;game-ready&quot; atau &quot;low-poly&quot;</li>
<li>Pastikan formatnya kompatibel (GLTF lebih disarankan untuk web)</li>
</ul>
<p><strong>Kategori:</strong></p>
<ul>
<li>Kendaraan, Karakter, Arsitektur</li>
<li>Senjata, Perabot, Alam</li>
<li>Fiksi Ilmiah, Fantasi, Modern</li>
</ul>
<hr>
<h3 id="turbosquid" tabindex="-1">TurboSquid <a class="header-anchor" href="#turbosquid" aria-label="Permalink to &quot;TurboSquid&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Lokapasar model 3D profesional</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://turbosquid.com" target="_blank" rel="noreferrer">turbosquid.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas Royalti / Editorial (periksa setiap aset)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>1 juta+ model (banyak yang gratis)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, OBJ, MAX, Blend</td>
</tr>
<tr>
<td><strong>Kualitas</strong></td>
<td>Kelas profesional</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Model profesional berkualitas tinggi</li>
<li>Lokapasar yang telah mapan (sejak 2000)</li>
<li>Sertifikasi CheckMate untuk kualitas</li>
<li>Tersedia banyak model gratis</li>
</ul>
<p><strong>Ketentuan lisensi:</strong></p>
<ul>
<li>✅ Penggunaan komersial diizinkan (Bebas Royalti)</li>
<li>⚠️ Periksa label &quot;Editorial Only&quot; (penggunaan terbatas)</li>
<li>⚠️ Periksa Depicted IP (barang bermerek)</li>
<li>❌ Berkas model mentah tidak boleh didistribusikan ulang</li>
</ul>
<p><strong>Hal yang perlu diperhatikan:</strong></p>
<ul>
<li>Model &quot;Editorial Only&quot; tidak dapat digunakan secara komersial</li>
<li>Model dengan logo merek memerlukan izin tambahan</li>
<li>Model gratis mungkin memiliki perlindungan ganti rugi yang lebih terbatas</li>
</ul>
<p><strong>Kiat pencarian:</strong></p>
<ul>
<li>Filter berdasarkan &quot;Free&quot; dan format yang diinginkan</li>
<li>Hindari &quot;Editorial Use Only&quot; untuk proyek komersial</li>
<li>Periksa jumlah poligon untuk game web</li>
<li>Utamakan model tanpa kekayaan intelektual merek yang mudah dikenali</li>
</ul>
<hr>
<h3 id="poly-ronin" tabindex="-1">Poly Ronin <a class="header-anchor" href="#poly-ronin" aria-label="Permalink to &quot;Poly Ronin&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Paket low-poly bergaya dan bertema (saat ini luring)</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://polyronin.com" target="_blank" rel="noreferrer">polyronin.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>⚠️ Tidak pernah dinyatakan dengan jelas</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Paket low-poly bertema (senjata samurai dan viking, desa gurun, kios pasar, kendaraan kota)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX, GLB, OBJ</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Gratis</td>
</tr>
</tbody>
</table>
<div class="warning custom-block"><p class="custom-block-title">Status situs (Juli 2026)</p>
<p>Poly Ronin tidak merespons sejak Juli 2026, dan tampaknya situs tersebut telah offline. Ini adalah contoh bagus mengapa lisensi yang tidak jelas berisiko: paket-paketnya tidak pernah memiliki ketentuan penggunaan komersial yang terdokumentasi, dan sekarang tidak ada kreator yang bisa ditanyai. Jika Anda pernah mengunduh paketnya, gunakan hanya untuk prototipe. Untuk produksi, gunakan sumber dengan lisensi yang jelas seperti Kenney, Quaternius, atau Poly Pizza.</p>
</div>
<hr>
<h2 id="tekstur-material" tabindex="-1">Tekstur &amp; Material <a class="header-anchor" href="#tekstur-material" aria-label="Permalink to &quot;Tekstur &amp; Material&quot;"></a></h2>
<figure class="sample-sheet">
<a href="/id/assets?providers=polyhaven"><img src="https://cdn.cinevva.com/guides/samples/samples-polyhaven-textures.jpg" alt="Contoh material PBR CC0 dari Poly Haven yang dirender pada bola: bata, kayu, logam, batu bulat, kain, rumput, marmer, dan beton" loading="lazy"></a>
<figcaption>Pratinjau material Poly Haven: bata, kayu, logam, batu bulat, kain, rumput, marmer, dan beton, semuanya CC0. <a href="/id/assets?providers=polyhaven">Cari Poly Haven di pustaka aset</a>.</figcaption>
</figure>
<h3 id="poly-haven-tekstur" tabindex="-1">Poly Haven (Tekstur) <a class="header-anchor" href="#poly-haven-tekstur" aria-label="Permalink to &quot;Poly Haven (Tekstur)&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Tekstur PBR fotorealistis</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://polyhaven.com/textures" target="_blank" rel="noreferrer">polyhaven.com/textures</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>780+ set tekstur PBR</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>JPG, PNG, EXR</td>
</tr>
</tbody>
</table>
<p><strong>Mencakup:</strong></p>
<ul>
<li>Peta diffuse/albedo</li>
<li>Peta normal</li>
<li>Peta roughness</li>
<li>Peta displacement</li>
<li>Peta AO</li>
</ul>
<p><strong>Kategori umum:</strong></p>
<ul>
<li>Kayu, Logam, Batu, Beton</li>
<li>Kain, Kulit, Permukaan tanah</li>
<li>Bata, Ubin, Organik</li>
</ul>
<hr>
<h3 id="ambientcg" tabindex="-1">AmbientCG <a class="header-anchor" href="#ambientcg" aria-label="Permalink to &quot;AmbientCG&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Beragam material PBR CC0</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://ambientcg.com" target="_blank" rel="noreferrer">ambientcg.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>2.000+ material</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>JPG, PNG</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya—tidak memerlukan kunci</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>✅ Ya—ZIP resolusi 1K</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Kualitas serupa dengan Poly Haven</li>
<li>Lebih beragam dalam beberapa kategori</li>
<li>Tekstur yang dapat diulang</li>
<li>Berbagai resolusi (1K–8K)</li>
</ul>
<p><strong>Cocok untuk:</strong></p>
<ul>
<li>Tekstur permukaan tanah (rumput, tanah, kerikil)</li>
<li>Material bangunan</li>
<li>Kain dan pelapis furnitur</li>
<li>Permukaan logam</li>
</ul>
<hr>
<h2 id="sprite-seni-2d" tabindex="-1">Sprite &amp; Seni 2D <a class="header-anchor" href="#sprite-seni-2d" aria-label="Permalink to &quot;Sprite &amp; Seni 2D&quot;"></a></h2>
<figure class="sample-sheet">
<a href="/id/assets?providers=kenney"><img src="https://cdn.cinevva.com/guides/samples/samples-kenney-sprites.jpg" alt="Contoh sprite 2D CC0 dari Kenney: karakter astronaut, pesawat luar angkasa, tile piksel, emote hati, dan alien" loading="lazy"></a>
<figcaption>Sekilas ragam aset 2D Kenney: karakter, pesawat, tile, dan emote, semuanya CC0. <a href="/id/assets?providers=kenney">Jelajahi sprite Kenney di pustaka aset</a>.</figcaption>
</figure>
<h3 id="kenney-2d" tabindex="-1">Kenney (2D) <a class="header-anchor" href="#kenney-2d" aria-label="Permalink to &quot;Kenney (2D)&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Set UI dan sprite game yang lengkap</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>100+ paket 2D</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>PNG, SVG</td>
</tr>
</tbody>
</table>
<p><strong>Paket 2D unggulan:</strong></p>
<ul>
<li>Paket UI (tombol, jendela, ikon)</li>
<li>Paket Platformer (karakter, tile)</li>
<li>Paket Roguelike (tile ruang bawah tanah)</li>
<li>Paket Space Shooter</li>
<li>Paket Puzzle</li>
</ul>
<hr>
<h3 id="itch-io" tabindex="-1">itch.io <a class="header-anchor" href="#itch-io" aria-label="Permalink to &quot;itch.io&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Gaya seni unik dari kreator indie</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://itch.io/game-assets" target="_blank" rel="noreferrer">itch.io/game-assets</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam (periksa masing-masing)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>51.000+ paket aset gratis</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Beragam</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Ragam gaya seni yang luar biasa</li>
<li>Banyak paket gratis tersedia</li>
<li>Mendukung seniman indie</li>
<li>Dapat difilter berdasarkan &quot;Free&quot; dan jenis</li>
</ul>
<p><strong>Tips pencarian:</strong></p>
<ul>
<li>Filter berdasarkan harga: Gratis</li>
<li>Tag populer: pixel-art, sprites, tileset, characters</li>
<li>Periksa ketentuan lisensi dengan cermat</li>
</ul>
<hr>
<h3 id="opengameart" tabindex="-1">OpenGameArt <a class="header-anchor" href="#opengameart" aria-label="Permalink to &quot;OpenGameArt&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Seni 2D hasil kontribusi komunitas</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://opengameart.org" target="_blank" rel="noreferrer">opengameart.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam (CC0, CC-BY, GPL)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ribuan</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>PNG, SVG</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>⚠️ Tautan menuju halaman konten</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Komunitas aktif</li>
<li>Cocok untuk seni retro/piksel</li>
<li>Banyak set seni game lengkap</li>
<li>Juga menyediakan audio dan 3D</li>
</ul>
<p><strong>Kategori:</strong></p>
<ul>
<li>Seni 2D &gt; Tile, Karakter, UI</li>
<li>Tekstur</li>
<li>Seni Konsep</li>
</ul>
<hr>
<h2 id="audio-efek-suara" tabindex="-1">Audio &amp; Efek Suara <a class="header-anchor" href="#audio-efek-suara" aria-label="Permalink to &quot;Audio &amp; Efek Suara&quot;"></a></h2>
<h3 id="freesound" tabindex="-1">Freesound <a class="header-anchor" href="#freesound" aria-label="Permalink to &quot;Freesound&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Pustaka efek suara yang sangat besar</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://freesound.org" target="_blank" rel="noreferrer">freesound.org</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam lisensi CC untuk setiap suara (~52% CC0 per 2026)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>700.000+ suara</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV, MP3, FLAC</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya—memerlukan kunci API gratis</td>
</tr>
<tr>
<td><strong>Unduhan Langsung</strong></td>
<td>✅ Ya—pratinjau MP3 (dengan kunci API)</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Pustaka suara gratis terbesar</li>
<li>Filter pencarian canggih</li>
<li>Penilaian komunitas</li>
<li>Pratinjau bentuk gelombang</li>
</ul>
<p><strong>Tips:</strong></p>
<ul>
<li>Filter berdasarkan lisensi sebelum mengunduh (CC0 lebih disarankan untuk game)</li>
<li>Filter berdasarkan laju sampel (standar 44,1 kHz)</li>
<li>Banyak variasi suara umum</li>
<li>Sangat cocok untuk desain suara</li>
</ul>
<p><strong>Pencarian umum:</strong></p>
<ul>
<li>Langkah kaki, ledakan, klik UI</li>
<li>Loop ambience, suara latar</li>
<li>Efek suara/vokal</li>
<li>Alat musik</li>
</ul>
<hr>
<h3 id="kenney-audio" tabindex="-1">Kenney (Audio) <a class="header-anchor" href="#kenney-audio" aria-label="Permalink to &quot;Kenney (Audio)&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Paket efek suara yang siap digunakan dalam game</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC0</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>15+ paket audio</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV, OGG</td>
</tr>
</tbody>
</table>
<p><strong>Paket mencakup:</strong></p>
<ul>
<li>Audio UI (klik, hover, notifikasi)</li>
<li>Audio RPG (pertarungan, mantra, lingkungan)</li>
<li>Audio Fiksi Ilmiah (senjata, komputer, pintu)</li>
<li>Suara Benturan</li>
<li>Jingle Musik</li>
</ul>
<hr>
<h3 id="sonniss-gdc" tabindex="-1">Sonniss GDC <a class="header-anchor" href="#sonniss-gdc" aria-label="Permalink to &quot;Sonniss GDC&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Efek suara profesional bebas royalti dalam jumlah besar</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://sonniss.com/gameaudiogdc" target="_blank" rel="noreferrer">sonniss.com/gameaudiogdc</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Bebas royalti untuk penggunaan komersial (Sonniss GDC Game Audio Bundle)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ratusan gigabita efek suara profesional</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>WAV (kualitas penuh), pratinjau MP3/OGG</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Efek suara berkualitas studio yang direkam oleh desainer suara profesional</li>
<li>Bebas royalti, sehingga tidak memerlukan atribusi maupun biaya per penggunaan untuk game komersial</li>
<li>Dirilis setiap tahun sebagai bagian dari GDC Game Audio Bundle (edisi 2026 hadir pada Maret dengan 7 GB+ suara baru, sedangkan arsip tahun-tahun sebelumnya melampaui 200 GB)</li>
<li>Mencakup foley, ambience, senjata, makhluk, kendaraan, dan UI</li>
</ul>
<p><strong>Catatan:</strong> Lisensinya hanya mencakup produksi media (game, film, TV, proyek interaktif) dan secara tegas melarang penggunaan suara untuk pelatihan AI/ML. Pratinjau diputar sebagai MP3/OGG di dalam Cinevva, sedangkan WAV beresolusi penuh diunduh dari Sonniss.</p>
<div class="tip custom-block"><p class="custom-block-title">Dapat dicari di Cinevva</p>
<p>Sonniss terintegrasi ke dalam panel Aset Cinevva—cari bundel GDC tepat di samping Freesound.</p>
</div>
<hr>
<h2 id="musik" tabindex="-1">Musik <a class="header-anchor" href="#musik" aria-label="Permalink to &quot;Musik&quot;"></a></h2>
<h3 id="jamendo" tabindex="-1">Jamendo <a class="header-anchor" href="#jamendo" aria-label="Permalink to &quot;Jamendo&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Menemukan musik, bukan untuk penggunaan komersial gratis</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://www.jamendo.com" target="_blank" rel="noreferrer">jamendo.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>CC untuk didengarkan secara pribadi, lisensi sinkronisasi berbayar untuk proyek komersial</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>Ratusan ribu trek musik independen</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>MP3</td>
</tr>
<tr>
<td><strong>API</strong></td>
<td>Ya—memerlukan ID klien gratis</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Katalog besar musik independen dari semua genre</li>
<li>Sangat cocok untuk menemukan suasana atau artis sebelum membeli lisensi</li>
<li>Dapat dicari berdasarkan genre, suasana, dan tempo</li>
</ul>
<p><strong>Catatan:</strong> Jamendo sering membingungkan orang. Unduhan gratisnya ditujukan untuk didengarkan secara pribadi, dan penggunaan trek dalam game yang Anda jual memerlukan lisensi per trek dari Jamendo Licensing, program sinkronisasi berbayar mereka. Anggap Jamendo sebagai sumber berbayar dengan pratinjau gratis, bukan sumber gratis.</p>
<div class="tip custom-block"><p class="custom-block-title">Dapat dicari di Cinevva</p>
<p>Jamendo terintegrasi ke dalam panel Aset Cinevva untuk musik latar dan soundtrack.</p>
</div>
<hr>
<h2 id="animasi-karakter" tabindex="-1">Animasi Karakter <a class="header-anchor" href="#animasi-karakter" aria-label="Permalink to &quot;Animasi Karakter&quot;"></a></h2>
<figure class="sample-sheet">
<a href="/id/assets"><img src="https://cdn.cinevva.com/guides/samples/samples-characters.jpg" alt="Karakter low-poly CC0 yang siap di-rig: kesatria, shiba inu, prajurit tengkorak, astronaut, dan barbar" loading="lazy"></a>
<figcaption>Karakter CC0 siap di-rig dari KayKit, Quaternius, PolygonalMind, dan Kenney yang cocok dengan pustaka animasi ini. <a href="/id/assets">Ambil salah satunya dari pustaka aset</a>.</figcaption>
</figure>
<h3 id="mixamo" tabindex="-1">Mixamo <a class="header-anchor" href="#mixamo" aria-label="Permalink to &quot;Mixamo&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Animasi karakter profesional</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://mixamo.com" target="_blank" rel="noreferrer">mixamo.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Gratis untuk penggunaan komersial</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>2.446 animasi</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>FBX</td>
</tr>
<tr>
<td><strong>Akun</strong></td>
<td>Memerlukan akun Adobe</td>
</tr>
</tbody>
</table>
<div class="warning custom-block"><p class="custom-block-title">Catatan keandalan (2026)</p>
<p>Mixamo masih online dan gratis, tetapi Adobe tidak lagi memeliharanya secara aktif. Sejak gangguan login pada pertengahan 2025, halaman akun dan auto-rigger terkadang tidak berfungsi, dan dukungan Adobe telah memberi tahu pengguna bahwa layanan tersebut pada dasarnya tidak didukung. Mixamo belum ditutup, tetapi anggap sebagai sumber yang rapuh: unduh dan cadangkan animasi yang Anda perlukan daripada mengandalkannya untuk jangka panjang. Khusus untuk auto-rigging, model terbuka yang lebih baru seperti UniRig dan NVIDIA SOMA-X layak dipantau sebagai pengganti.</p>
</div>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Animasi berkualitas profesional</li>
<li>Dapat ditargetkan ulang ke karakter kustom</li>
<li>Pustaka animasi yang sangat besar</li>
<li>Juga menyediakan karakter yang sudah di-rig</li>
</ul>
<p><strong>Kategori:</strong></p>
<ul>
<li>Pergerakan (berjalan, berlari, melompat)</li>
<li>Pertarungan (meninju, menendang, pedang)</li>
<li>Tarian</li>
<li>Gestur</li>
<li>Aksi (duduk, memanjat, meraih)</li>
<li>Reaksi (terkena serangan, mati, jatuh)</li>
</ul>
<p><strong>Alur kerja:</strong></p>
<ol>
<li>Buat akun Adobe gratis</li>
<li>Unggah karakter Anda atau gunakan karakter mereka</li>
<li>Jelajahi/pratinjau animasi</li>
<li>Unduh sebagai FBX</li>
<li>Konversikan ke GLTF untuk web</li>
</ol>
<hr>
<h2 id="shader-efek" tabindex="-1">Shader &amp; Efek <a class="header-anchor" href="#shader-efek" aria-label="Permalink to &quot;Shader &amp; Efek&quot;"></a></h2>
<h3 id="shadertoy" tabindex="-1">Shadertoy <a class="header-anchor" href="#shadertoy" aria-label="Permalink to &quot;Shadertoy&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Inspirasi dan efek shader GLSL</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://shadertoy.com" target="_blank" rel="noreferrer">shadertoy.com</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>Beragam (periksa masing-masing)</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>70.000+ shader</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Kode sumber GLSL</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Efek visual yang menakjubkan</li>
<li>Pelajari teknik shader</li>
<li>Pratinjau waktu nyata</li>
<li>Komunitas aktif</li>
</ul>
<p><strong>Kategori populer:</strong></p>
<ul>
<li>Raymarching/fraktal</li>
<li>Efek pascapemrosesan</li>
<li>Tekstur prosedural</li>
<li>Sistem partikel</li>
<li>Air/api/asap</li>
</ul>
<p><strong>Catatan:</strong> Shader perlu diadaptasi untuk digunakan dengan Three.js/WebGL.</p>
<hr>
<h3 id="contoh-three-js" tabindex="-1">Contoh Three.js <a class="header-anchor" href="#contoh-three-js" aria-label="Permalink to &quot;Contoh Three.js&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Kode Three.js yang siap digunakan</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://threejs.org/examples" target="_blank" rel="noreferrer">threejs.org/examples</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>MIT</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>500+ contoh</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Sumber JavaScript</td>
</tr>
</tbody>
</table>
<p><strong>Keunggulan:</strong></p>
<ul>
<li>Contoh resmi</li>
<li>Siap disalin-tempel</li>
<li>Terdokumentasi dengan baik</li>
<li>Mencakup semua fitur</li>
</ul>
<p><strong>Contoh berguna:</strong></p>
<ul>
<li>Efek pascapemrosesan</li>
<li>Shader kustom</li>
<li>Integrasi fisika</li>
<li>Pemuat model</li>
<li>Sistem animasi</li>
</ul>
<hr>
<h3 id="pmndrs-vanilla" tabindex="-1">pmndrs/vanilla <a class="header-anchor" href="#pmndrs-vanilla" aria-label="Permalink to &quot;pmndrs/vanilla&quot;"></a></h3>
<p><strong>Paling cocok untuk:</strong> Material dan efek Three.js</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Situs web</strong></td>
<td><a href="https://github.com/pmndrs/vanilla" target="_blank" rel="noreferrer">github.com/pmndrs/vanilla</a></td>
</tr>
<tr>
<td><strong>Lisensi</strong></td>
<td>MIT</td>
</tr>
<tr>
<td><strong>Aset</strong></td>
<td>20+ efek</td>
</tr>
<tr>
<td><strong>Paket</strong></td>
<td><code>@pmndrs/vanilla</code></td>
</tr>
</tbody>
</table>
<p><strong>Mencakup:</strong></p>
<ul>
<li>MeshReflectorMaterial</li>
<li>MeshDistortMaterial</li>
<li>MeshWobbleMaterial</li>
<li>Kaustik</li>
<li>Kilauan</li>
<li>Bayangan lembut</li>
</ul>
<hr>
<h2 id="membuat-aset-dengan-ai" tabindex="-1">Membuat Aset dengan AI <a class="header-anchor" href="#membuat-aset-dengan-ai" aria-label="Permalink to &quot;Membuat Aset dengan AI&quot;"></a></h2>
<p>Pada 2026, membuat aset sering kali lebih cepat daripada berburu aset gratis yang tepat. Beberapa opsi yang layak diketahui:</p>
<ul>
<li><strong>Model 3D:</strong> Meshy dan Tripo mengubah teks atau gambar menjadi mesh bertekstur yang dapat di-rig. Output paket gratis Meshy berlisensi CC BY 4.0 (penggunaan komersial dengan atribusi), sedangkan hak komersial Tripo tersedia melalui paket berbayar, jadi periksa ketentuan setiap alat. Opsi terbuka yang dapat di-host sendiri mencakup Hunyuan3D 2.1 dari Tencent, TRELLIS.2 dari Microsoft, dan Cube 3D dari Roblox yang telah dijadikan sumber terbuka. Perhatikan bahwa lisensi Hunyuan3D mengecualikan Uni Eropa, Inggris Raya, dan Korea Selatan, jadi periksa ketentuannya sebelum merilis game.</li>
<li><strong>Tekstur dan gambar:</strong> model gambar terbuka seperti FLUX.2 dan Qwen-Image dapat membuat tekstur yang dapat diulang dan seni konsep; bobot yang bebas digunakan secara komersial adalah varian FLUX.2 klein 4B (Apache 2.0) dan Qwen-Image.</li>
<li><strong>Audio:</strong> Stable Audio 3.0 (termasuk model terbuka khusus efek suara) dan ACE-Step 1.5 mencakup musik dan SFX dengan bobot terbuka, sedangkan ElevenLabs merupakan opsi layanan ter-host paling kuat (hak komersial tersedia pada paket berbayar).</li>
</ul>
<p>Ketentuan lisensi untuk aset buatan AI masih terus berkembang, jadi pastikan ketentuan hak output model sebelum menggunakan apa pun secara komersial. Untuk pembahasan lengkap tentang model yang sebaiknya digunakan, baca panduan kami tentang <a href="/id/guides/frontier-gen-ai-models.html">model AI generatif sumber terbuka terbaik untuk game</a>. Cinevva memiliki fitur teks-ke-3D, teks-ke-gambar, musik, dan pembuatan skybox bawaan, sehingga Anda dapat membuat dan langsung memasukkan aset ke dalam game tanpa meninggalkan editor.</p>
<h2 id="ringkasan-cepat-jenis-aset" tabindex="-1">Ringkasan Cepat Jenis Aset <a class="header-anchor" href="#ringkasan-cepat-jenis-aset" aria-label="Permalink to &quot;Ringkasan Cepat Jenis Aset&quot;"></a></h2>
<h3 id="saya-membutuhkan-pesawat-luar-angkasa" tabindex="-1">Saya membutuhkan pesawat luar angkasa <a class="header-anchor" href="#saya-membutuhkan-pesawat-luar-angkasa" aria-label="Permalink to &quot;Saya membutuhkan pesawat luar angkasa&quot;"></a></h3>
<ol>
<li><strong>Cepat &amp; mudah:</strong> Kenney Space Kit (CC0)</li>
<li><strong>Bergaya:</strong> Quaternius Ultimate Spaceships (CC0)</li>
<li><strong>Bergaya profesional:</strong> Synty POLYGON Sci-Fi (Bebas Royalti, berbayar)</li>
<li><strong>Terperinci:</strong> Cari &quot;spaceship downloadable&quot; di Sketchfab (periksa lisensi)</li>
</ol>
<h3 id="saya-membutuhkan-gaya-seni-yang-konsisten-untuk-seluruh-game" tabindex="-1">Saya membutuhkan gaya seni yang konsisten untuk seluruh game <a class="header-anchor" href="#saya-membutuhkan-gaya-seni-yang-konsisten-untuk-seluruh-game" aria-label="Permalink to &quot;Saya membutuhkan gaya seni yang konsisten untuk seluruh game&quot;"></a></h3>
<ol>
<li><strong>Synty POLYGON</strong>—Semua paket memiliki estetika yang sama dan dapat dipadupadankan dengan bebas</li>
<li><strong>Kenney</strong>—CC0, gaya kohesif siap pakai dalam game di setiap paket</li>
<li><strong>Quaternius</strong>—CC0, gaya low-poly yang imut</li>
</ol>
<h3 id="saya-membutuhkan-tekstur-realistis" tabindex="-1">Saya membutuhkan tekstur realistis <a class="header-anchor" href="#saya-membutuhkan-tekstur-realistis" aria-label="Permalink to &quot;Saya membutuhkan tekstur realistis&quot;"></a></h3>
<ol>
<li><strong>Poly Haven</strong>—Kualitas terbaik, CC0</li>
<li><strong>AmbientCG</strong>—Lebih beragam, CC0</li>
</ol>
<h3 id="saya-membutuhkan-efek-suara" tabindex="-1">Saya membutuhkan efek suara <a class="header-anchor" href="#saya-membutuhkan-efek-suara" aria-label="Permalink to &quot;Saya membutuhkan efek suara&quot;"></a></h3>
<ol>
<li><strong>Paket Audio Kenney</strong>—Suara game yang cepat digunakan, CC0</li>
<li><strong>Freesound</strong>—Suara spesifik, beragam lisensi</li>
</ol>
<h3 id="saya-membutuhkan-animasi-karakter" tabindex="-1">Saya membutuhkan animasi karakter <a class="header-anchor" href="#saya-membutuhkan-animasi-karakter" aria-label="Permalink to &quot;Saya membutuhkan animasi karakter&quot;"></a></h3>
<ol>
<li><strong>Mixamo</strong>—Kualitas profesional, memerlukan akun Adobe (tetapi lihat catatan keandalan 2026 di atas; cadangkan semua yang Anda unduh)</li>
</ol>
<h3 id="saya-membutuhkan-seni-piksel" tabindex="-1">Saya membutuhkan seni piksel <a class="header-anchor" href="#saya-membutuhkan-seni-piksel" aria-label="Permalink to &quot;Saya membutuhkan seni piksel&quot;"></a></h3>
<ol>
<li><strong>itch.io</strong>—Filter berdasarkan &quot;pixel-art&quot; dan &quot;Free&quot;</li>
<li><strong>OpenGameArt</strong>—Kategori Seni 2D</li>
<li><strong>Kenney</strong>—Paket 2D</li>
</ol>
<h3 id="saya-membutuhkan-elemen-ui" tabindex="-1">Saya membutuhkan elemen UI <a class="header-anchor" href="#saya-membutuhkan-elemen-ui" aria-label="Permalink to &quot;Saya membutuhkan elemen UI&quot;"></a></h3>
<ol>
<li><strong>Kenney UI Pack</strong>—Set lengkap, CC0</li>
<li><strong>itch.io</strong>—Cari &quot;UI&quot; atau &quot;GUI&quot;</li>
</ol>
<h3 id="saya-membutuhkan-beragam-model-acak" tabindex="-1">Saya membutuhkan beragam model acak <a class="header-anchor" href="#saya-membutuhkan-beragam-model-acak" aria-label="Permalink to &quot;Saya membutuhkan beragam model acak&quot;"></a></h3>
<ol>
<li><strong>CGTrader</strong>—Filter berdasarkan &quot;Free&quot;, sangat beragam</li>
<li><strong>TurboSquid</strong>—Kualitas profesional, periksa jenis lisensi</li>
<li><strong>Sketchfab</strong>—4 juta+ model, filter berdasarkan model yang dapat diunduh</li>
</ol>
<hr>
<h2 id="panduan-lisensi" tabindex="-1">Panduan Lisensi <a class="header-anchor" href="#panduan-lisensi" aria-label="Permalink to &quot;Panduan Lisensi&quot;"></a></h2>
<h3 id="cc0-domain-publik" tabindex="-1">CC0 (Domain Publik) <a class="header-anchor" href="#cc0-domain-publik" aria-label="Permalink to &quot;CC0 (Domain Publik)&quot;"></a></h3>
<ul>
<li>✅ Dapat digunakan secara komersial</li>
<li>✅ Dapat dimodifikasi</li>
<li>✅ Tidak memerlukan atribusi</li>
<li>✅ Tanpa batasan</li>
</ul>
<p><strong>Penyedia:</strong> Poly Haven, Kenney, Quaternius, AmbientCG</p>
<h3 id="lisensi-bebas-royalti" tabindex="-1">Lisensi Bebas Royalti <a class="header-anchor" href="#lisensi-bebas-royalti" aria-label="Permalink to &quot;Lisensi Bebas Royalti&quot;"></a></h3>
<ul>
<li>✅ Dapat digunakan secara komersial (dalam game/aplikasi Anda)</li>
<li>✅ Dapat dimodifikasi dan diadaptasi</li>
<li>✅ Tanpa royalti berkelanjutan</li>
<li>❌ Tidak boleh menjual kembali file model mentah</li>
<li>❌ Tidak boleh mengizinkan pengguna mengekstrak model</li>
</ul>
<p><strong>Penyedia:</strong> Synty POLYGON, CGTrader, TurboSquid</p>
<p><strong>Catatan:</strong> &quot;Bebas Royalti&quot; berarti Anda membayar sekali (atau mendapatkannya secara gratis) dan dapat menggunakannya tanpa membayar biaya per penggunaan. Ini TIDAK berarti aset tersebut berada dalam domain publik.</p>
<h3 id="cc-by-atribusi" tabindex="-1">CC-BY (Atribusi) <a class="header-anchor" href="#cc-by-atribusi" aria-label="Permalink to &quot;CC-BY (Atribusi)&quot;"></a></h3>
<ul>
<li>✅ Boleh digunakan secara komersial</li>
<li>✅ Boleh dimodifikasi</li>
<li>⚠️ Wajib mencantumkan kredit kepada pembuat</li>
<li>✅ Selain itu tidak dibatasi</li>
</ul>
<p><strong>Penyedia:</strong> Banyak aset di Sketchfab, BlendSwap, OpenGameArt</p>
<h3 id="cc-by-sa-berbagi-serupa" tabindex="-1">CC-BY-SA (Berbagi Serupa) <a class="header-anchor" href="#cc-by-sa-berbagi-serupa" aria-label="Permalink to &quot;CC-BY-SA (Berbagi Serupa)&quot;"></a></h3>
<ul>
<li>✅ Boleh digunakan secara komersial</li>
<li>✅ Boleh dimodifikasi</li>
<li>⚠️ Wajib mencantumkan kredit kepada pembuat</li>
<li>⚠️ Karya turunan wajib menggunakan lisensi yang sama</li>
</ul>
<h3 id="cc-by-nc-nonkomersial" tabindex="-1">CC-BY-NC (Nonkomersial) <a class="header-anchor" href="#cc-by-nc-nonkomersial" aria-label="Permalink to &quot;CC-BY-NC (Nonkomersial)&quot;"></a></h3>
<ul>
<li>❌ Tidak boleh digunakan secara komersial</li>
<li>✅ Boleh digunakan dalam game gratis</li>
<li>⚠️ Periksa kembali jika game Anda memiliki iklan/IAP</li>
</ul>
<h3 id="hanya-untuk-penggunaan-editorial" tabindex="-1">Hanya untuk Penggunaan Editorial <a class="header-anchor" href="#hanya-untuk-penggunaan-editorial" aria-label="Permalink to &quot;Hanya untuk Penggunaan Editorial&quot;"></a></h3>
<ul>
<li>❌ Tidak boleh digunakan secara komersial</li>
<li>✅ Hanya untuk berita, pendidikan, dan ulasan</li>
<li>⚠️ Umum ditemukan di TurboSquid untuk item bermerek</li>
</ul>
<p><strong>Tips:</strong> Jika memungkinkan, pilih CC0 agar Anda tidak perlu mencantumkan atribusi dalam kredit game. Royalty-Free juga aman untuk game komersial.</p>
<hr>
<h2 id="tips-alur-kerja" tabindex="-1">Tips Alur Kerja <a class="header-anchor" href="#tips-alur-kerja" aria-label="Permalink to &quot;Tips Alur Kerja&quot;"></a></h2>
<h3 id="_1-periksa-lisensinya-terlebih-dahulu" tabindex="-1">1. Periksa lisensinya terlebih dahulu <a class="header-anchor" href="#_1-periksa-lisensinya-terlebih-dahulu" aria-label="Permalink to &quot;1. Periksa lisensinya terlebih dahulu&quot;"></a></h3>
<p>Sebelum mengunduh, pastikan lisensinya mengizinkan penggunaan yang Anda maksud.</p>
<h3 id="_2-optimalkan-untuk-web" tabindex="-1">2. Optimalkan untuk web <a class="header-anchor" href="#_2-optimalkan-untuk-web" aria-label="Permalink to &quot;2. Optimalkan untuk web&quot;"></a></h3>
<ul>
<li>Pertahankan model di bawah 100 ribu poligon</li>
<li>Gunakan tekstur terkompresi (JPG untuk diffuse, PNG untuk transparansi)</li>
<li>Audio: Gunakan MP3 atau OGG, bukan WAV untuk produksi</li>
</ul>
<h3 id="_3-atur-aset-anda" tabindex="-1">3. Atur aset Anda <a class="header-anchor" href="#_3-atur-aset-anda" aria-label="Permalink to &quot;3. Atur aset Anda&quot;"></a></h3>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>assets/</span></span>
<span class="line"><span>├── models/</span></span>
<span class="line"><span>│   ├── characters/</span></span>
<span class="line"><span>│   └── props/</span></span>
<span class="line"><span>├── textures/</span></span>
<span class="line"><span>│   ├── environment/</span></span>
<span class="line"><span>│   └── ui/</span></span>
<span class="line"><span>├── audio/</span></span>
<span class="line"><span>│   ├── music/</span></span>
<span class="line"><span>│   └── sfx/</span></span>
<span class="line"><span>└── sprites/</span></span></code></pre>
</div><h3 id="_4-simpan-catatan-atribusi" tabindex="-1">4. Simpan catatan atribusi <a class="header-anchor" href="#_4-simpan-catatan-atribusi" aria-label="Permalink to &quot;4. Simpan catatan atribusi&quot;"></a></h3>
<p>Bahkan untuk CC0, sebaiknya tetap catat asal aset:</p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>CREDITS.md</span></span>
<span class="line"><span>- Spaceship model: Quaternius (CC0)</span></span>
<span class="line"><span>- Wood texture: Poly Haven (CC0)</span></span>
<span class="line"><span>- Laser sound: Freesound user "xyz" (CC-BY)</span></span></code></pre>
</div><h3 id="_5-uji-performa" tabindex="-1">5. Uji performa <a class="header-anchor" href="#_5-uji-performa" aria-label="Permalink to &quot;5. Uji performa&quot;"></a></h3>
<p>Muat aset ke dalam game sejak awal untuk memeriksa:</p>
<ul>
<li>Ukuran file (memengaruhi waktu pemuatan)</li>
<li>Jumlah poligon (memengaruhi FPS)</li>
<li>Resolusi tekstur (memengaruhi memori)</li>
</ul>
<hr>
<h2 id="tabel-ringkasan" tabindex="-1">Tabel Ringkasan <a class="header-anchor" href="#tabel-ringkasan" aria-label="Permalink to &quot;Tabel Ringkasan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Penyedia</th>
<th>Jenis</th>
<th>Lisensi</th>
<th>Paling Cocok Untuk</th>
<th style="text-align:center">Di Cinevva</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Poly Haven</strong></td>
<td>Model, Tekstur, HDRI</td>
<td>CC0</td>
<td>Kualitas profesional</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Kenney</strong></td>
<td>Model, Sprite, Audio, UI</td>
<td>CC0</td>
<td>Aset siap pakai untuk game</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Quaternius</strong></td>
<td>Model</td>
<td>CC0</td>
<td>Low-poly bergaya</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Poly Pizza / Icosa</strong></td>
<td>Model</td>
<td>CC-BY / CC0</td>
<td>Low-poly, arsip Google Poly</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>Synty POLYGON</strong></td>
<td>Model, Karakter</td>
<td>Royalty-Free</td>
<td>Gaya visual yang konsisten</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Sketchfab</strong></td>
<td>Model</td>
<td>Beragam</td>
<td>Pilihan yang sangat beragam</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>BlenderKit</strong></td>
<td>Model, Material, HDRI</td>
<td>Royalty-Free / CC0</td>
<td>Pustaka besar dalam aplikasi</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Fab (Epic)</strong></td>
<td>Model, Material, VFX, Audio</td>
<td>Standar / CC</td>
<td>Megascans gratis, aset siap pakai untuk game</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>CGTrader</strong></td>
<td>Model</td>
<td>Royalty-Free</td>
<td>Pilihan marketplace yang beragam</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>AmbientCG</strong></td>
<td>Tekstur, HDRI</td>
<td>CC0</td>
<td>Material PBR</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>OpenGameArt</strong></td>
<td>2D, Audio, Tekstur</td>
<td>Beragam</td>
<td>Konten komunitas</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Freesound</strong></td>
<td>Audio</td>
<td>Beragam</td>
<td>Efek suara</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Sonniss GDC</strong></td>
<td>Audio</td>
<td>Royalty-Free</td>
<td>Paket besar efek suara profesional</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>Jamendo</strong></td>
<td>Musik</td>
<td>CC pribadi / sinkronisasi berbayar</td>
<td>Menemukan musik (berbayar untuk penggunaan komersial)</td>
<td style="text-align:center">✅</td>
</tr>
<tr>
<td><strong>TurboSquid</strong></td>
<td>Model</td>
<td>Royalty-Free</td>
<td>Kualitas profesional</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>Mixamo</strong></td>
<td>Animasi</td>
<td>Gratis</td>
<td>Animasi karakter</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>itch.io</strong></td>
<td>Sprite, Beragam</td>
<td>Beragam</td>
<td>Gaya visual indie</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>BlendSwap</strong></td>
<td>Model Blender</td>
<td>Beragam</td>
<td>Model kompleks</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>Three.js Examples</strong></td>
<td>Kode/Shader</td>
<td>MIT</td>
<td>Fitur Three.js</td>
<td style="text-align:center">-</td>
</tr>
<tr>
<td><strong>Shadertoy</strong></td>
<td>Shader</td>
<td>Beragam</td>
<td>Efek visual</td>
<td style="text-align:center">-</td>
</tr>
</tbody>
</table>
<hr>
<p>Penyedia yang ditandai ✅ dapat dicari langsung melalui pustaka aset terintegrasi Cinevva. Buka panel Aset untuk mencari di seluruh penyedia tersebut sekaligus. Sisanya merupakan sumber eksternal yang layak disimpan sebagai bookmark untuk menemukan aset yang belum diindeks Cinevva.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="di-mana-saya-bisa-menemukan-model-3d-gratis-untuk-game" tabindex="-1">Di mana saya bisa menemukan model 3D gratis untuk game? <a class="header-anchor" href="#di-mana-saya-bisa-menemukan-model-3d-gratis-untuk-game" aria-label="Permalink to &quot;Di mana saya bisa menemukan model 3D gratis untuk game?&quot;"></a></h3>
<p>Poly Haven, Kenney, dan Quaternius adalah titik awal terbaik untuk menemukan model 3D gratis yang siap digunakan dalam game. Semuanya menggunakan lisensi CC0, sehingga Anda dapat menggunakannya secara komersial tanpa atribusi. Untuk pilihan yang lebih beragam, Sketchfab dan BlendSwap memiliki pustaka besar dengan berbagai jenis lisensi. Selalu periksa lisensi setiap model sebelum merilis game.</p>
<h3 id="apakah-aset-game-gratis-boleh-digunakan-dalam-game-komersial" tabindex="-1">Apakah aset game gratis boleh digunakan dalam game komersial? <a class="header-anchor" href="#apakah-aset-game-gratis-boleh-digunakan-dalam-game-komersial" aria-label="Permalink to &quot;Apakah aset game gratis boleh digunakan dalam game komersial?&quot;"></a></h3>
<p>Sebagian besar boleh, tetapi tergantung pada lisensinya. Aset CC0 (Poly Haven, Kenney, Quaternius, AmbientCG) berada di domain publik dan bebas digunakan secara komersial tanpa atribusi. CC-BY mewajibkan Anda mencantumkan kredit kepada pembuat. Aset CC-BY-NC dan Editorial-Only tidak boleh digunakan dalam game komersial. Bagian Panduan Lisensi di atas menjelaskan masing-masing lisensi.</p>
<h3 id="apa-situs-terbaik-untuk-efek-suara-game-gratis" tabindex="-1">Apa situs terbaik untuk efek suara game gratis? <a class="header-anchor" href="#apa-situs-terbaik-untuk-efek-suara-game-gratis" aria-label="Permalink to &quot;Apa situs terbaik untuk efek suara game gratis?&quot;"></a></h3>
<p>Freesound memiliki pustaka efek suara gratis terbesar, meskipun lisensinya berbeda-beda untuk setiap klip, jadi periksa satu per satu. Kenney menawarkan paket audio yang lebih kecil tetapi sepenuhnya berlisensi CC0, sehingga aman untuk proyek komersial apa pun tanpa kewajiban atribusi.</p>
<h3 id="di-mana-saya-bisa-mendapatkan-animasi-karakter-gratis" tabindex="-1">Di mana saya bisa mendapatkan animasi karakter gratis? <a class="header-anchor" href="#di-mana-saya-bisa-mendapatkan-animasi-karakter-gratis" aria-label="Permalink to &quot;Di mana saya bisa mendapatkan animasi karakter gratis?&quot;"></a></h3>
<p>Mixamo adalah sumber utama untuk animasi karakter dan auto-rigging gratis. Unggah atau pilih karakter, pilih dari ribuan animasi motion capture, lalu ekspor dalam format yang siap digunakan di engine Anda. Semuanya gratis dengan akun Adobe.</p>
<BuildCta
  title="Atau jelaskan gamenya dan biarkan aset ditempatkan untuk Anda"
  desc="Cinevva mencari paket CC0 gratis dan menempatkan prop ke dalam adegan yang dapat dimainkan."
  prompt="Buat game dungeon crawl low-poly menggunakan prop 3D gratis dengan obor dan harta karun" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/free-3d-model-sites.html">Situs Model 3D Gratis Terbaik untuk Game</a> — pembahasan mendalam tentang sumber 3D</li>
<li><a href="/id/guides/free-2d-sprites-tilesets.html">Sprite 2D, Pixel Art, dan Tileset Gratis</a> — pembahasan mendalam tentang sumber 2D</li>
<li><a href="/id/guides/free-textures-hdris-materials.html">Tekstur PBR, Material, dan HDRI Gratis</a> — pembahasan mendalam tentang sumber tekstur</li>
<li><a href="/id/guides/free-sound-effects-music.html">Efek Suara dan Musik Gratis untuk Game</a> — pembahasan mendalam tentang sumber audio</li>
<li><a href="/id/guides/free-character-animations-rigging.html">Animasi Karakter dan Auto-Rigging Gratis</a> — Mixamo dan alternatifnya</li>
<li><a href="/id/guides/ai-3d-model-generators.html">Generator Model 3D AI Terbaik</a> — buat model alih-alih mencarinya</li>
<li><a href="/id/guides/vibe-coding-game-prompts.html">100 Ide Prompt Game AI yang Bisa Anda Buat dengan Sekali Klik</a> — ambil sebuah ide dan jadikan game yang dapat dimainkan dalam waktu sekitar satu menit</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — memahami CC0, CC-BY, Royalty-Free, dan lisensi lainnya</li>
<li><a href="/id/guides/game-dev-courses.html">Kursus Pengembangan Game Online</a> — kursus tentang pemodelan 3D di Blender dan seni game</li>
<li><a href="/id/tutorials/pixel-art-rendering.html">Rendering pixel art</a> — merender sprite sheet dan pixel art di browser</li>
<li><a href="/id/tutorials/streaming-asset-loading.html">Pemuatan aset secara streaming</a> — memuat dan menyimpan aset ke cache secara bertahap</li>
<li><a href="/id/guides/threejs-usdc-tech-report.html">Three.js + USDC di Browser</a> — memuat aset 3D USD di Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/game-assets-guide.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Panduan Kursus Pengembangan Game Online]]></title>
            <link>https://app.cinevva.com/id/guides/game-dev-courses</link>
            <guid>https://app.cinevva.com/id/guides/game-dev-courses</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Kursus online untuk pengembangan game — engine, desain, seni, dan audio lengkap dengan analisis kredibilitas, ulasan, dan harga]]></description>
            <content:encoded><![CDATA[<h1 id="panduan-kursus-pengembangan-game-online" tabindex="-1">Panduan Kursus Pengembangan Game Online <a class="header-anchor" href="#panduan-kursus-pengembangan-game-online" aria-label="Permalink to &quot;Panduan Kursus Pengembangan Game Online&quot;"></a></h1>
<p>Kursus online untuk mempelajari pengembangan game. Panduan ini membahas kursus khusus engine, teori desain game, keahlian khusus (seni, audio), dan perbandingan platform, lengkap dengan penilaian kredibilitas, ulasan peserta, dan detail harga.</p>
<div class="tip custom-block"><p class="custom-block-title">Mencari Aset Gratis?</p>
<p>Lihat panduan <a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> kami untuk model 3D, tekstur, audio, dan banyak lagi.</p>
</div>
<h2 id="referensi-cepat" tabindex="-1">Referensi Cepat <a class="header-anchor" href="#referensi-cepat" aria-label="Permalink to &quot;Referensi Cepat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Tujuan</th>
<th>Pilihan Terbaik</th>
<th>Kisaran Harga</th>
<th>Peringkat</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Pemula Unity</strong></td>
<td>GameDev.tv Complete Unity 3D (Udemy)</td>
<td>$12–30 (diskon)</td>
<td>⭐ 4.7/5</td>
</tr>
<tr>
<td><strong>Kredensial Formal Unity</strong></td>
<td>Spesialisasi Michigan State (Coursera)</td>
<td>$49/bulan</td>
<td>⭐ 4.7/5</td>
</tr>
<tr>
<td><strong>C++ Unreal Engine</strong></td>
<td>Kursus UE5 Stephen Ulibarri (Udemy)</td>
<td>$15–30 (diskon)</td>
<td>⭐ 4.8/5</td>
</tr>
<tr>
<td><strong>Engine Godot</strong></td>
<td>Paket GDQuest</td>
<td>$84–216</td>
<td>⭐ 4.8/5</td>
</tr>
<tr>
<td><strong>Teori Desain Game</strong></td>
<td>Harvard CS50 Game Dev (diarsipkan, gratis)</td>
<td>Gratis</td>
<td>⭐ 4.6/5</td>
</tr>
<tr>
<td><strong>Pemodelan 3D untuk Game</strong></td>
<td>Complete Blender Creator (Udemy)</td>
<td>$15–30 (diskon)</td>
<td>⭐ 4.7/5</td>
</tr>
<tr>
<td><strong>Audio Game</strong></td>
<td>Sertifikat Audio Game Berklee</td>
<td>~$4,500</td>
<td>⭐ 4.8/5</td>
</tr>
<tr>
<td><strong>Pelatihan Resmi Gratis</strong></td>
<td>Jalur Pembelajaran Unity Learn</td>
<td>Gratis</td>
<td>⭐ 4.5/5</td>
</tr>
</tbody>
</table>
<hr>
<h2 id="kursus-engine-game" tabindex="-1">Kursus Engine Game <a class="header-anchor" href="#kursus-engine-game" aria-label="Permalink to &quot;Kursus Engine Game&quot;"></a></h2>
<h3 id="unity" tabindex="-1">Unity <a class="header-anchor" href="#unity" aria-label="Permalink to &quot;Unity&quot;"></a></h3>
<h4 id="gamedev-tv-complete-unity-developer-3d" tabindex="-1">GameDev.tv Complete Unity Developer 3D <a class="header-anchor" href="#gamedev-tv-complete-unity-developer-3d" aria-label="Permalink to &quot;GameDev.tv Complete Unity Developer 3D&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pemula yang menginginkan pembelajaran praktik berbasis proyek</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Udemy</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Harga normal $139 / <strong>$12–30 saat diskon</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~27 jam video + proyek</td>
</tr>
<tr>
<td><strong>Peringkat</strong></td>
<td>⭐ 4.7/5 (460.000+ peserta)</td>
</tr>
<tr>
<td><strong>Terakhir Diperbarui</strong></td>
<td>Unity 6 (2025)</td>
</tr>
</tbody>
</table>
<p><strong>Yang Akan Anda Buat:</strong></p>
<ul>
<li>5 game lengkap dari nol</li>
<li>Dasar-dasar pemrograman C#</li>
<li>Fisika 3D, AI, dan mekanika game</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Sangat baik untuk pemula tanpa pengalaman</li>
<li>✅ Pembelajaran berbasis proyek (Anda membuat game sungguhan)</li>
<li>✅ Komunitas besar untuk dukungan tanya jawab</li>
<li>✅ Diperbarui secara berkala untuk versi baru Unity</li>
<li>✅ Akses seumur hidup setelah dibeli</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Beberapa bagian mungkin terasa lambat</li>
<li>⚠️ Harga normal terlalu mahal (selalu beli saat diskon)</li>
<li>⚠️ Kurang mendalam untuk topik lanjutan seperti optimisasi</li>
</ul>
<p><strong>Ulasan Peserta:</strong></p>
<blockquote>
<p>&quot;Kursus yang bagus untuk pemula. Saya memulai tanpa pengetahuan apa pun dan akhirnya memiliki portofolio game.&quot; — Reddit r/unity</p>
</blockquote>
<blockquote>
<p>&quot;Instruktur menjelaskan konsep dengan jelas. Pendekatan berbasis proyek membuat Anda tetap termotivasi.&quot; — Ulasan Udemy</p>
</blockquote>
<p><strong>Kredibilitas:</strong> GameDev.tv adalah salah satu penyedia pendidikan pengembangan game paling mapan. Didirikan oleh Ben Tristem dan Rick Davidson, mereka telah melatih lebih dari 2 juta peserta. Mereka transparan dalam menghentikan kursus yang sudah usang serta mengelola forum komunitas yang aktif.</p>
<hr>
<h4 id="spesialisasi-game-design-and-development-with-unity-dari-michigan-state" tabindex="-1">Spesialisasi Game Design and Development with Unity dari Michigan State <a class="header-anchor" href="#spesialisasi-game-design-and-development-with-unity-dari-michigan-state" aria-label="Permalink to &quot;Spesialisasi Game Design and Development with Unity dari Michigan State&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Mereka yang menginginkan kredensial universitas dan pembelajaran terstruktur</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Coursera</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Gratis untuk mengikuti tanpa sertifikat / <strong>$49/bulan untuk sertifikat</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~2 bulan (10 jam/minggu)</td>
</tr>
<tr>
<td><strong>Peringkat</strong></td>
<td>⭐ 4.7/5</td>
</tr>
<tr>
<td><strong>Institusi</strong></td>
<td>Michigan State University</td>
</tr>
</tbody>
</table>
<p><strong>Kurikulum (lima kursus, dibuat dengan Unity):</strong></p>
<ul>
<li>Game Design and Development 1: Shooter 2D</li>
<li>Game Design and Development 2: Platformer 2D</li>
<li>Game Design and Development 3: Shooter 3D</li>
<li>Game Design and Development 4: Platformer 3D</li>
<li>Proyek Akhir</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Kredensial yang didukung universitas</li>
<li>✅ Praktis: Anda membuat lima proyek game Unity lengkap</li>
<li>✅ Dapat diikuti secara gratis tanpa sertifikat</li>
<li>✅ Pendekatan akademis yang ketat</li>
<li>✅ Mencakup modul bisnis/kewirausahaan</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Temponya lebih lambat daripada kursus Udemy</li>
<li>⚠️ Porsi praktik coding lebih sedikit daripada pilihan lain</li>
<li>⚠️ Sertifikat memerlukan langganan berbayar</li>
</ul>
<p><strong>Paling Cocok untuk:</strong> Mereka yang ingin beralih karier dan membutuhkan kredensial formal, atau yang lebih menyukai pembelajaran akademis terstruktur.</p>
<hr>
<h4 id="jalur-pembelajaran-unity-learn" tabindex="-1">Jalur Pembelajaran Unity Learn <a class="header-anchor" href="#jalur-pembelajaran-unity-learn" aria-label="Permalink to &quot;Jalur Pembelajaran Unity Learn&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Peserta dengan anggaran terbatas yang menginginkan pelatihan resmi Unity</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Unity Learn (learn.unity.com)</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td><strong>Gratis</strong></td>
</tr>
<tr>
<td><strong>Jalur</strong></td>
<td>Junior Programmer, Creative Core, VR Development</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Tutorial mandiri + proyek</td>
</tr>
</tbody>
</table>
<p><strong>Jalur yang Tersedia:</strong></p>
<ul>
<li><strong>Junior Programmer</strong> — Dari pemula hingga siap kerja</li>
<li><strong>Creative Core</strong> — Berfokus pada seni dan desain</li>
<li><strong>Unity Essentials</strong> — Tinjauan singkat dasar-dasar</li>
<li><strong>VR Development</strong> — Spesialisasi realitas virtual</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Sepenuhnya gratis</li>
<li>✅ Konten resmi Unity (selalu mutakhir)</li>
<li>✅ Berbasis proyek dengan karya untuk portofolio</li>
<li>✅ Pelacakan progres bawaan</li>
<li>✅ Tersedia sertifikasi Unity</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Kurang menarik dibandingkan kursus video</li>
<li>⚠️ Memerlukan lebih banyak disiplin diri</li>
<li>⚠️ Dukungan komunitas tidak seaktif kursus berbayar</li>
</ul>
<hr>
<h3 id="unreal-engine" tabindex="-1">Unreal Engine <a class="header-anchor" href="#unreal-engine" aria-label="Permalink to &quot;Unreal Engine&quot;"></a></h3>
<h4 id="kursus-ue5-c-developer-dari-stephen-ulibarri" tabindex="-1">Kursus UE5 C++ Developer dari Stephen Ulibarri <a class="header-anchor" href="#kursus-ue5-c-developer-dari-stephen-ulibarri" aria-label="Permalink to &quot;Kursus UE5 C++ Developer dari Stephen Ulibarri&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Developer serius yang ingin menguasai C++</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Udemy</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Harga normal $175 / <strong>$15–30 saat diskon</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~50+ jam</td>
</tr>
<tr>
<td><strong>Peringkat</strong></td>
<td>⭐ 4.8/5</td>
</tr>
<tr>
<td><strong>Proyek</strong></td>
<td>Action RPG lengkap</td>
</tr>
</tbody>
</table>
<p><strong>Yang Akan Anda Pelajari:</strong></p>
<ul>
<li>Unreal Engine 5 dari nol</li>
<li>Pemrograman C++ untuk game</li>
<li>Scripting visual dengan Blueprints</li>
<li>Sistem gameplay tingkat lanjut (pertarungan, AI, inventaris)</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Pembahasan C++ yang mendalam (jarang ditemukan dalam kursus pengembangan game)</li>
<li>✅ Menghasilkan proyek portofolio yang substansial</li>
<li>✅ Tempo yang baik untuk peserta tingkat menengah</li>
<li>✅ Membahas Blueprints DAN C++</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Mengasumsikan adanya latar belakang pemrograman</li>
<li>⚠️ Kursus sangat panjang (memerlukan komitmen)</li>
<li>⚠️ Versi UE sering berubah</li>
</ul>
<p><strong>Ulasan Peserta:</strong></p>
<blockquote>
<p>&quot;Kursus Unreal terbaik yang pernah saya temukan. Stephen menjelaskan 'mengapa', bukan hanya 'apa'.&quot; — Udemy</p>
</blockquote>
<blockquote>
<p>&quot;Akhirnya saya memahami C++ di Unreal setelah kesulitan dengan sumber belajar lain.&quot; — Reddit r/unrealengine</p>
</blockquote>
<hr>
<h4 id="spesialisasi-coursera-unreal-engine-for-beginners" tabindex="-1">Spesialisasi Coursera Unreal Engine for Beginners <a class="header-anchor" href="#spesialisasi-coursera-unreal-engine-for-beginners" aria-label="Permalink to &quot;Spesialisasi Coursera Unreal Engine for Beginners&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pemula tanpa pengalaman yang menginginkan pengantar terstruktur</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Coursera</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>$199 (diskon) / $399 harga normal</td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>3 kursus, masing-masing ~4 minggu</td>
</tr>
<tr>
<td><strong>Sertifikat</strong></td>
<td>Ya</td>
</tr>
</tbody>
</table>
<p><strong>Urutan Kursus:</strong></p>
<ol>
<li>Membangun Dunia di Unreal</li>
<li>Karakter &amp; Interior</li>
<li>Kamera &amp; Produksi</li>
</ol>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Ramah bagi pemula (awalnya tidak memerlukan coding)</li>
<li>✅ Berfokus pada aspek visual/kreatif</li>
<li>✅ Cocok untuk seniman yang mulai terjun ke pengembangan game</li>
<li>✅ Sertifikat bergaya universitas</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Pemrograman dibahas kurang mendalam</li>
<li>⚠️ Lebih mahal daripada alternatif di Udemy</li>
<li>⚠️ Lebih cocok untuk seniman lingkungan daripada programmer</li>
</ul>
<hr>
<h4 id="linkedin-learning-unreal-engine-5-essential-training" tabindex="-1">LinkedIn Learning: Unreal Engine 5 Essential Training <a class="header-anchor" href="#linkedin-learning-unreal-engine-5-essential-training" aria-label="Permalink to &quot;LinkedIn Learning: Unreal Engine 5 Essential Training&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Menyegarkan keterampilan dengan cepat</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>LinkedIn Learning</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Langganan (~$30/bulan) / Tersedia uji coba gratis</td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~3 jam</td>
</tr>
<tr>
<td><strong>Peringkat</strong></td>
<td>⭐ 4.8/5</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Kualitas produksi tinggi</li>
<li>✅ Sangat baik untuk tinjauan singkat</li>
<li>✅ Membahas fitur UE5.6</li>
<li>✅ Sertifikat dapat ditambahkan ke profil LinkedIn</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Terlalu singkat untuk pembelajaran mendalam</li>
<li>⚠️ Model langganan (bukan akses seumur hidup)</li>
<li>⚠️ Lebih cocok sebagai pelengkap daripada sumber belajar utama</li>
</ul>
<hr>
<h3 id="engine-godot" tabindex="-1">Engine Godot <a class="header-anchor" href="#engine-godot" aria-label="Permalink to &quot;Engine Godot&quot;"></a></h3>
<h4 id="program-pembelajaran-gdquest" tabindex="-1">Program Pembelajaran GDQuest <a class="header-anchor" href="#program-pembelajaran-gdquest" aria-label="Permalink to &quot;Program Pembelajaran GDQuest&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Peserta serius yang ingin mempelajari Godot secara terstruktur</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>school.gdquest.com</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>$84–216 (paket)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Kursus interaktif + komunitas</td>
</tr>
<tr>
<td><strong>Peringkat</strong></td>
<td>⭐ 4.8/5</td>
</tr>
</tbody>
</table>
<p><strong>Paket yang Tersedia:</strong></p>
<ul>
<li><strong>Starter Kit</strong> (~$84) — Dasar-dasar 2D dan 3D</li>
<li><strong>From Zero to Pro</strong> (~$216) — Jalur pembelajaran lengkap</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Kursus khusus Godot dengan kualitas tertinggi</li>
<li>✅ Latihan interaktif (bukan hanya video)</li>
<li>✅ Diperbarui untuk Godot 4.x</li>
<li>✅ Komunitas Discord yang aktif</li>
<li>✅ Dibuat oleh kontributor Godot ternama</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Lebih mahal daripada alternatif di Udemy</li>
<li>⚠️ Komunitas lebih kecil daripada kursus Unity/Unreal</li>
</ul>
<p><strong>Kredibilitas:</strong> Tim GDQuest merupakan kontributor dan pengajar Godot yang diakui. Mereka telah membuat dokumentasi resmi Godot dan disegani oleh komunitas.</p>
<hr>
<h4 id="complete-godot-4-beginner-course-udemy" tabindex="-1">Complete Godot 4 Beginner Course (Udemy) <a class="header-anchor" href="#complete-godot-4-beginner-course-udemy" aria-label="Permalink to &quot;Complete Godot 4 Beginner Course (Udemy)&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pemula dengan anggaran terbatas</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Udemy</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Harga normal $80–100 / <strong>$15–25 saat diskon</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~20 jam</td>
</tr>
<tr>
<td><strong>Proyek</strong></td>
<td>Shooter luar angkasa, platformer, game zombi tampak atas</td>
</tr>
</tbody>
</table>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Terjangkau saat diskon</li>
<li>✅ Membuat 3 game lengkap</li>
<li>✅ Berfokus pada GDScript (bahasa asli Godot)</li>
<li>✅ Cocok untuk pemula tanpa pengalaman</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Tidak sedalam GDQuest</li>
<li>⚠️ Komunitas dukungan lebih kecil</li>
</ul>
<hr>
<h4 id="godot-dev-academy" tabindex="-1">Godot Dev Academy <a class="header-anchor" href="#godot-dev-academy" aria-label="Permalink to &quot;Godot Dev Academy&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Peserta berkelanjutan yang menginginkan akses langganan</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>godotdevacademy.com</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td><strong>$19.99/bulan</strong></td>
</tr>
<tr>
<td><strong>Akses</strong></td>
<td>Semua kursus disertakan</td>
</tr>
</tbody>
</table>
<p><strong>Mencakup:</strong></p>
<ul>
<li>Kursus platformer 2D</li>
<li>Pengembangan RPG</li>
<li>Pengembangan game seluler</li>
<li>Tersedia kursus gratis untuk pemula</li>
</ul>
<p><strong>Paling Cocok untuk:</strong> Mereka yang berencana mengikuti beberapa kursus dari waktu ke waktu. Menawarkan nilai yang baik jika Anda berkomitmen mempelajari Godot dalam jangka panjang.</p>
<hr>
<h2 id="teori-desain-game" tabindex="-1">Teori Desain Game <a class="header-anchor" href="#teori-desain-game" aria-label="Permalink to &quot;Teori Desain Game&quot;"></a></h2>
<h3 id="harvard-cs50-s-introduction-to-game-development" tabindex="-1">Harvard CS50's Introduction to Game Development <a class="header-anchor" href="#harvard-cs50-s-introduction-to-game-development" aria-label="Permalink to &quot;Harvard CS50's Introduction to Game Development&quot;"></a></h3>
<p><strong>Terbaik untuk:</strong> Memahami konsep dasar pemrograman game</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>cs50.harvard.edu/games (diarsipkan)</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td><strong>Gratis</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>12 minggu</td>
</tr>
<tr>
<td><strong>Status</strong></td>
<td>Diarsipkan (materi tersedia, tidak menerima pengumpulan tugas baru)</td>
</tr>
</tbody>
</table>
<p><strong>Yang Akan Anda Pelajari:</strong></p>
<ul>
<li>Dasar-dasar grafis 2D dan 3D</li>
<li>Animasi dan desain suara</li>
<li>Deteksi tabrakan dan fisika</li>
<li>Berbagai engine: LÖVE2D, Unity, Lua</li>
</ul>
<p><strong>Game yang Akan Anda Kloning:</strong></p>
<ul>
<li>Pong, Flappy Bird, Breakout</li>
<li>Super Mario Bros., Legend of Zelda</li>
<li>Angry Birds, Pokémon</li>
<li>Game helikopter 3D, Portal</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Pengajaran berkualitas Harvard</li>
<li>✅ Sepenuhnya gratis</li>
<li>✅ Teori dan dasar-dasar yang sangat baik</li>
<li>✅ Mengenalkan berbagai engine</li>
<li>✅ Semua materi masih dapat diakses</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Kursus resmi dihentikan (Juni 2024)</li>
<li>⚠️ Tidak ada sertifikat atau penilaian baru</li>
<li>⚠️ Beberapa teknologinya sudah usang (versi Unity lama)</li>
<li>⚠️ Memerlukan kemandirian belajar</li>
</ul>
<p><strong>Catatan:</strong> Harvard telah meluncurkan kursus baru, CS50's Introduction to 2D Game Development (CS50 2D), sebagai pengganti versi yang dihentikan. Kursus ini berfokus pada game 2D yang dibuat dengan Lua dan framework LOVE 2D (Pong, Flappy Bird, Breakout, Match 3, Super Mario Bros., Legend of Zelda, Angry Birds, Pokemon). Materi kuliah dipublikasikan di YouTube dan Anda dapat mendaftar untuk mendapatkan sertifikat di cs50.edx.org/2d. Sesi diselenggarakan secara berkala, jadi periksa halaman kursus untuk mengetahui tanggal terbaru.</p>
<p><strong>Ulasan Peserta:</strong></p>
<blockquote>
<p>&quot;Salah satu pengantar pemrograman game terbaik yang pernah saya lihat. Membahas dasar-dasar yang dapat diterapkan ke engine apa pun.&quot; — Reddit r/cs50</p>
</blockquote>
<blockquote>
<p>&quot;Bahkan tanpa sertifikat, pengetahuan yang diperoleh tetap sangat berharga.&quot; — Ulasan kursus</p>
</blockquote>
<hr>
<h3 id="m-a-online-dalam-desain-game-dari-west-virginia-university" tabindex="-1">M.A. Online dalam Desain Game dari West Virginia University <a class="header-anchor" href="#m-a-online-dalam-desain-game-dari-west-virginia-university" aria-label="Permalink to &quot;M.A. Online dalam Desain Game dari West Virginia University&quot;"></a></h3>
<p><strong>Terbaik untuk:</strong> Pendidikan pascasarjana formal</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>WVU Online</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Total ~$22,650</td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>2 tahun (fleksibel)</td>
</tr>
<tr>
<td><strong>Format</strong></td>
<td>Sepenuhnya online dan asinkron</td>
</tr>
<tr>
<td><strong>Kredensial</strong></td>
<td>Gelar Magister</td>
</tr>
</tbody>
</table>
<p><strong>Sorotan Kurikulum:</strong></p>
<ul>
<li>Teori Game (analisis budaya dan estetika)</li>
<li>Narasi dan Penceritaan Game</li>
<li>Desain Pengalaman Pemain</li>
<li>Purwarupa game untuk proyek akhir</li>
</ul>
<p><strong>Paling Cocok untuk:</strong> Mereka yang mencari kredensial akademis untuk posisi pengajaran, penelitian, atau kepemimpinan dalam pengembangan game.</p>
<hr>
<h2 id="keahlian-khusus" tabindex="-1">Keahlian Khusus <a class="header-anchor" href="#keahlian-khusus" aria-label="Permalink to &quot;Keahlian Khusus&quot;"></a></h2>
<h3 id="pemodelan-3d-untuk-game" tabindex="-1">Pemodelan 3D untuk Game <a class="header-anchor" href="#pemodelan-3d-untuk-game" aria-label="Permalink to &quot;Pemodelan 3D untuk Game&quot;"></a></h3>
<h4 id="complete-blender-creator-gamedev-tv" tabindex="-1">Complete Blender Creator (GameDev.tv) <a class="header-anchor" href="#complete-blender-creator-gamedev-tv" aria-label="Permalink to &quot;Complete Blender Creator (GameDev.tv)&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pemula yang mempelajari Blender untuk membuat aset game</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Udemy</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Harga normal $140 / <strong>$15–30 saat diskon</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~30 jam</td>
</tr>
<tr>
<td><strong>Peringkat</strong></td>
<td>⭐ 4.7/5 (200.000+ peserta)</td>
</tr>
<tr>
<td><strong>Diperbarui</strong></td>
<td>Blender 4.4 (2025)</td>
</tr>
</tbody>
</table>
<p><strong>Yang Akan Anda Pelajari:</strong></p>
<ul>
<li>Dasar-dasar Blender</li>
<li>Teknik pemodelan 3D</li>
<li>UV unwrapping dan pemberian tekstur</li>
<li>Animasi dasar</li>
<li>Mengekspor ke engine game</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Komunitas peserta yang sangat besar</li>
<li>✅ Pendekatan berbasis proyek</li>
<li>✅ Diperbarui secara berkala untuk versi baru Blender</li>
<li>✅ Sangat cocok untuk pemula tanpa pengalaman</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Sangat umum (bukan pipeline khusus game)</li>
<li>⚠️ Memerlukan komitmen untuk kursus yang panjang</li>
</ul>
<hr>
<h4 id="blender-3d-modeling-for-games-—-complete-workflow-udemy" tabindex="-1">Blender 3D Modeling for Games — Complete Workflow (Udemy) <a class="header-anchor" href="#blender-3d-modeling-for-games-—-complete-workflow-udemy" aria-label="Permalink to &quot;Blender 3D Modeling for Games — Complete Workflow (Udemy)&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pipeline aset khusus game</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Udemy</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>$15–40 saat diskon</td>
</tr>
<tr>
<td><strong>Fokus</strong></td>
<td>Alur kerja aset siap pakai untuk game</td>
</tr>
</tbody>
</table>
<p><strong>Yang Akan Anda Pelajari:</strong></p>
<ul>
<li>Dari block-out hingga aset akhir</li>
<li>Topologi yang dioptimalkan untuk game</li>
<li>Tekstur dan material</li>
<li>Alur kerja ekspor ke engine</li>
</ul>
<p><strong>Paling Cocok untuk:</strong> Mereka yang secara khusus ingin membuat aset game, bukan sekadar mempelajari keterampilan Blender secara umum.</p>
<hr>
<h3 id="audio-game-desain-suara" tabindex="-1">Audio Game &amp; Desain Suara <a class="header-anchor" href="#audio-game-desain-suara" aria-label="Permalink to &quot;Audio Game &amp; Desain Suara&quot;"></a></h3>
<h4 id="berklee-online-game-audio-design-certificate" tabindex="-1">Berklee Online: Game Audio Design Certificate <a class="header-anchor" href="#berklee-online-game-audio-design-certificate" aria-label="Permalink to &quot;Berklee Online: Game Audio Design Certificate&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pelatihan audio game tingkat profesional</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Berklee Online</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Total $4,725 (atau $4,253 jika dibayar penuh) / $1,575 per kursus, ditambah biaya pendaftaran $175</td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>3 kursus, masing-masing 12 minggu</td>
</tr>
<tr>
<td><strong>Tanggal Mulai</strong></td>
<td>Pendaftaran berbasis periode akademik (sesi diselenggarakan secara berkala, periksa halaman kursus untuk tanggal terbaru)</td>
</tr>
</tbody>
</table>
<p><strong>Kurikulum:</strong></p>
<ul>
<li>Game Audio 101 — Dasar-dasar</li>
<li>Produksi suara dan dialog</li>
<li>Integrasi audio dan scoring interaktif dengan Wwise</li>
<li>Membuat demo reel profesional</li>
</ul>
<p>Sertifikat Berklee kini disusun menjadi tiga kursus: Game Design Principles, Game Audio 101, dan Game Audio Production with Wwise (total 9 kredit).</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Kredensial yang diakui industri</li>
<li>✅ Mempelajari alat standar industri (Wwise, FMOD)</li>
<li>✅ Reputasi Berklee dalam pendidikan musik</li>
<li>✅ Berfokus pada pembangunan portofolio</li>
</ul>
<p><strong>Kekurangan:</strong></p>
<ul>
<li>⚠️ Mahal</li>
<li>⚠️ Memerlukan banyak waktu (komitmen profesional)</li>
</ul>
<p><strong>Paling Cocok untuk:</strong> Mereka yang ingin meniti karier dalam bidang audio game.</p>
<hr>
<h4 id="game-audio-essentials-udemy" tabindex="-1">Game Audio Essentials (Udemy) <a class="header-anchor" href="#game-audio-essentials-udemy" aria-label="Permalink to &quot;Game Audio Essentials (Udemy)&quot;"></a></h4>
<p><strong>Terbaik untuk:</strong> Pengantar audio game yang ramah anggaran</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Udemy</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>Harga normal $50–100 / <strong>$15–25 saat diskon</strong></td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~10 jam</td>
</tr>
<tr>
<td><strong>Diperbarui</strong></td>
<td>Juli 2025</td>
</tr>
<tr>
<td><strong>Yang Akan Anda Pelajari:</strong></td>
<td></td>
</tr>
</tbody>
</table>
<ul>
<li>Pembuatan foley dan efek suara</li>
<li>Integrasi audio di Unity/Unreal/Godot</li>
<li>Audio berulang dan spasial</li>
<li>Teknik desain suara praktis</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>✅ Terjangkau</li>
<li>✅ Keterampilan praktis langsung</li>
<li>✅ Mencakup beberapa engine game</li>
<li>✅ Cocok untuk developer indie</li>
</ul>
<hr>
<h4 id="domestika-merancang-musik-latar-video-game" tabindex="-1">Domestika: Merancang Musik Latar Video Game <a class="header-anchor" href="#domestika-merancang-musik-latar-video-game" aria-label="Permalink to &quot;Domestika: Merancang Musik Latar Video Game&quot;"></a></h4>
<p><strong>Paling cocok untuk:</strong> Komposer yang ingin memasuki industri musik game</p>
<table tabindex="0">
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Platform</strong></td>
<td>Domestika</td>
</tr>
<tr>
<td><strong>Harga</strong></td>
<td>$10–60 (bervariasi saat ada diskon)</td>
</tr>
<tr>
<td><strong>Durasi</strong></td>
<td>~3 jam</td>
</tr>
<tr>
<td><strong>Fokus</strong></td>
<td>Komposisi musik untuk game</td>
</tr>
</tbody>
</table>
<p><strong>Paling Cocok Untuk:</strong> Musisi yang ingin beralih ke komposisi musik latar game.</p>
<hr>
<h2 id="tautan-platform" tabindex="-1">Tautan Platform <a class="header-anchor" href="#tautan-platform" aria-label="Permalink to &quot;Tautan Platform&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Platform</th>
<th>URL</th>
<th>Paling Cocok Untuk</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Udemy</strong></td>
<td><a href="https://www.udemy.com/" target="_blank" rel="noreferrer">udemy.com</a></td>
<td>Kursus terjangkau saat diskon, banyak pilihan</td>
</tr>
<tr>
<td><strong>Coursera</strong></td>
<td><a href="https://www.coursera.org/" target="_blank" rel="noreferrer">coursera.org</a></td>
<td>Kursus universitas, kredensial formal</td>
</tr>
<tr>
<td><strong>Unity Learn</strong></td>
<td><a href="https://learn.unity.com/" target="_blank" rel="noreferrer">learn.unity.com</a></td>
<td>Pelatihan resmi Unity gratis</td>
</tr>
<tr>
<td><strong>GDQuest</strong></td>
<td><a href="https://school.gdquest.com/" target="_blank" rel="noreferrer">school.gdquest.com</a></td>
<td>Kursus yang berfokus pada Godot dari kontributor inti</td>
</tr>
<tr>
<td><strong>Pluralsight</strong></td>
<td><a href="https://www.pluralsight.com/" target="_blank" rel="noreferrer">pluralsight.com</a></td>
<td>Materi teknis mendalam, penilaian keterampilan</td>
</tr>
<tr>
<td><strong>Skillshare</strong></td>
<td><a href="https://www.skillshare.com/" target="_blank" rel="noreferrer">skillshare.com</a></td>
<td>Fokus kreatif/desain, langganan terjangkau</td>
</tr>
<tr>
<td><strong>Berklee Online</strong></td>
<td><a href="https://online.berklee.edu/" target="_blank" rel="noreferrer">online.berklee.edu</a></td>
<td>Sertifikasi audio game profesional</td>
</tr>
<tr>
<td><strong>edX / Harvard CS50</strong></td>
<td><a href="https://cs50.harvard.edu/games/" target="_blank" rel="noreferrer">cs50.harvard.edu/games</a></td>
<td>Dasar-dasar pengembangan game gratis</td>
</tr>
<tr>
<td><strong>Domestika</strong></td>
<td><a href="https://www.domestika.org/" target="_blank" rel="noreferrer">domestika.org</a></td>
<td>Kursus kreatif yang terjangkau</td>
</tr>
<tr>
<td><strong>LinkedIn Learning</strong></td>
<td><a href="https://www.linkedin.com/learning/" target="_blank" rel="noreferrer">linkedin.com/learning</a></td>
<td>Pengembangan profesional, Unreal Engine</td>
</tr>
<tr>
<td><strong>Blender</strong></td>
<td><a href="https://www.blender.org/" target="_blank" rel="noreferrer">blender.org</a></td>
<td>Perangkat lunak pemodelan 3D gratis</td>
</tr>
</tbody>
</table>
<hr>
<h2 id="perbandingan-platform" tabindex="-1">Perbandingan Platform <a class="header-anchor" href="#perbandingan-platform" aria-label="Permalink to &quot;Perbandingan Platform&quot;"></a></h2>
<h3 id="udemy" tabindex="-1"><a href="https://www.udemy.com/" target="_blank" rel="noreferrer">Udemy</a> <a class="header-anchor" href="#udemy" aria-label="Permalink to &quot;[Udemy](https://www.udemy.com/)&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Kelebihan</th>
<th>Kekurangan</th>
</tr>
</thead>
<tbody>
<tr>
<td>✅ Pilihan kursus sangat banyak</td>
<td>⚠️ Kualitas sangat bervariasi</td>
</tr>
<tr>
<td>✅ Akses seumur hidup</td>
<td>⚠️ Harga normal terlalu tinggi</td>
</tr>
<tr>
<td>✅ Sering ada diskon ($10–30)</td>
<td>⚠️ Beberapa kursus menjadi usang</td>
</tr>
<tr>
<td>✅ Kebijakan pengembalian dana 30 hari</td>
<td>⚠️ Tidak ada kredensial formal</td>
</tr>
<tr>
<td>✅ Komunitas tanya jawab besar</td>
<td>⚠️ Tidak ada pengajaran langsung</td>
</tr>
</tbody>
</table>
<p><strong>Tips Membeli:</strong> JANGAN PERNAH membayar harga penuh di Udemy. Diskon 80–90% biasanya tersedia setiap beberapa minggu.</p>
<hr>
<h3 id="coursera" tabindex="-1">Coursera <a class="header-anchor" href="#coursera" aria-label="Permalink to &quot;Coursera&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Kelebihan</th>
<th>Kekurangan</th>
</tr>
</thead>
<tbody>
<tr>
<td>✅ Kemitraan dengan universitas</td>
<td>⚠️ Model langganan untuk sertifikat</td>
</tr>
<tr>
<td>✅ Kredensial formal</td>
<td>⚠️ Tempo lebih lambat</td>
</tr>
<tr>
<td>✅ Opsi mengikuti kursus gratis tanpa sertifikat</td>
<td>⚠️ Tidak sepraktis Udemy</td>
</tr>
<tr>
<td>✅ Jalur pembelajaran terstruktur</td>
<td>⚠️ Bisa lebih mahal</td>
</tr>
<tr>
<td>✅ Ketelitian akademis</td>
<td></td>
</tr>
</tbody>
</table>
<p><strong>Paling Cocok Untuk:</strong> Mereka yang memerlukan kredensial untuk pekerjaan atau lebih menyukai pembelajaran akademis yang terstruktur.</p>
<hr>
<h3 id="pluralsight" tabindex="-1">Pluralsight <a class="header-anchor" href="#pluralsight" aria-label="Permalink to &quot;Pluralsight&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Kelebihan</th>
<th>Kekurangan</th>
</tr>
</thead>
<tbody>
<tr>
<td>✅ Materi teknis mendalam</td>
<td>⚠️ Hanya tersedia melalui langganan (~$29/bulan)</td>
</tr>
<tr>
<td>✅ Jalur pembelajaran dengan penilaian</td>
<td>⚠️ Beberapa konten sudah usang</td>
</tr>
<tr>
<td>✅ Bermitra dengan Unity</td>
<td>⚠️ Kurang ramah bagi pemula</td>
</tr>
<tr>
<td>✅ Penilaian keterampilan</td>
<td>⚠️ Interaksi komunitas lebih sedikit</td>
</tr>
</tbody>
</table>
<p><strong>Paling Cocok Untuk:</strong> Developer tingkat menengah yang menginginkan materi teknis mendalam dan jalur pembelajaran berorientasi karier.</p>
<hr>
<h3 id="skillshare" tabindex="-1">Skillshare <a class="header-anchor" href="#skillshare" aria-label="Permalink to &quot;Skillshare&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Kelebihan</th>
<th>Kekurangan</th>
</tr>
</thead>
<tbody>
<tr>
<td>✅ Terjangkau (~$168/tahun)</td>
<td>⚠️ Kualitas kursus bervariasi</td>
</tr>
<tr>
<td>✅ Berfokus pada kreativitas/desain</td>
<td>⚠️ Materi teknis kurang mendalam</td>
</tr>
<tr>
<td>✅ Cocok untuk pemula</td>
<td>⚠️ Tidak ada kredensial formal</td>
</tr>
<tr>
<td>✅ Kursus singkat dan mudah dipahami</td>
<td>⚠️ Ada laporan keluhan terkait langganan</td>
</tr>
</tbody>
</table>
<p><strong>Paling Cocok Untuk:</strong> Penghobi dan pelajar yang berfokus pada kreativitas serta ingin menjelajahi berbagai topik.</p>
<hr>
<h3 id="unity-learn" tabindex="-1">Unity Learn <a class="header-anchor" href="#unity-learn" aria-label="Permalink to &quot;Unity Learn&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Kelebihan</th>
<th>Kekurangan</th>
</tr>
</thead>
<tbody>
<tr>
<td>✅ Sepenuhnya gratis</td>
<td>⚠️ Format kurang menarik</td>
</tr>
<tr>
<td>✅ Resmi dan selalu mutakhir</td>
<td>⚠️ Memerlukan disiplin diri</td>
</tr>
<tr>
<td>✅ Jalur sertifikasi Unity</td>
<td>⚠️ Dukungan komunitas terbatas</td>
</tr>
<tr>
<td>✅ Berbasis proyek</td>
<td></td>
</tr>
</tbody>
</table>
<p><strong>Paling Cocok Untuk:</strong> Pelajar mandiri dengan anggaran terbatas yang menginginkan pelatihan resmi Unity.</p>
<hr>
<h2 id="panduan-kredibilitas-instruktur" tabindex="-1">Panduan Kredibilitas Instruktur <a class="header-anchor" href="#panduan-kredibilitas-instruktur" aria-label="Permalink to &quot;Panduan Kredibilitas Instruktur&quot;"></a></h2>
<h3 id="instruktur-yang-sangat-bereputasi" tabindex="-1">Instruktur yang Sangat Bereputasi <a class="header-anchor" href="#instruktur-yang-sangat-bereputasi" aria-label="Permalink to &quot;Instruktur yang Sangat Bereputasi&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Instruktur</th>
<th>Platform</th>
<th>Spesialisasi</th>
<th>Alasan Tepercaya</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Ben Tristem / GameDev.tv</strong></td>
<td>Udemy</td>
<td>Unity, Unreal, Blender</td>
<td>Lebih dari 1 juta siswa, transparan mengenai pembaruan kursus</td>
</tr>
<tr>
<td><strong>Stephen Ulibarri</strong></td>
<td>Udemy</td>
<td>Unreal C++</td>
<td>Pengetahuan teknis mendalam, penjelasan sangat baik</td>
</tr>
<tr>
<td><strong>Tim GDQuest</strong></td>
<td>GDQuest</td>
<td>Godot</td>
<td>Kontributor resmi Godot</td>
</tr>
<tr>
<td><strong>Pengajar Michigan State</strong></td>
<td>Coursera</td>
<td>Desain Game</td>
<td>Kredensial akademis, latar belakang penelitian</td>
</tr>
<tr>
<td><strong>Pengajar Berklee</strong></td>
<td>Berklee Online</td>
<td>Audio Game</td>
<td>Profesional industri, reputasi Berklee</td>
</tr>
</tbody>
</table>
<h3 id="tanda-bahaya-yang-perlu-diwaspadai" tabindex="-1">Tanda Bahaya yang Perlu Diwaspadai <a class="header-anchor" href="#tanda-bahaya-yang-perlu-diwaspadai" aria-label="Permalink to &quot;Tanda Bahaya yang Perlu Diwaspadai&quot;"></a></h3>
<ul>
<li>❌ Kursus tidak diperbarui selama lebih dari 2 tahun</li>
<li>❌ Peringkat rendah dengan keluhan spesifik mengenai konten yang usang</li>
<li>❌ Instruktur tanpa portofolio atau kredensial yang terlihat</li>
<li>❌ Pemasaran agresif tanpa substansi</li>
<li>❌ Kursus yang menjanjikan &quot;penguasaan menyeluruh&quot; dalam waktu yang tidak realistis</li>
</ul>
<hr>
<h2 id="rekomendasi-jalur-pembelajaran" tabindex="-1">Rekomendasi Jalur Pembelajaran <a class="header-anchor" href="#rekomendasi-jalur-pembelajaran" aria-label="Permalink to &quot;Rekomendasi Jalur Pembelajaran&quot;"></a></h2>
<h3 id="pemula-sepenuhnya-→-siap-kerja-unity" tabindex="-1">Pemula Sepenuhnya → Siap Kerja (Unity) <a class="header-anchor" href="#pemula-sepenuhnya-→-siap-kerja-unity" aria-label="Permalink to &quot;Pemula Sepenuhnya → Siap Kerja (Unity)&quot;"></a></h3>
<ol>
<li><strong>Mulai:</strong> Jalur Junior Programmer Unity Learn (Gratis)</li>
<li><strong>Bangun Keterampilan:</strong> GameDev.tv Complete Unity 3D ($20)</li>
<li><strong>Ambil Spesialisasi:</strong> Pilih bidang fokus (2D, 3D, mobile)</li>
<li><strong>Portofolio:</strong> Buat 3–5 game lengkap</li>
<li><strong>Kredensial (Opsional):</strong> Sertifikasi Unity atau Spesialisasi Coursera</li>
</ol>
<p><strong>Perkiraan Biaya:</strong> $20–150<br>
<strong>Jangka Waktu:</strong> 6–12 bulan (paruh waktu)</p>
<hr>
<h3 id="seniman-→-developer-game" tabindex="-1">Seniman → Developer Game <a class="header-anchor" href="#seniman-→-developer-game" aria-label="Permalink to &quot;Seniman → Developer Game&quot;"></a></h3>
<ol>
<li><strong>Mulai:</strong> Complete Blender Creator (Udemy) — $20</li>
<li><strong>Pipeline Game:</strong> Kursus alur kerja Blender for Games — $20</li>
<li><strong>Dasar-Dasar Engine:</strong> Kursus pemula Unity/Unreal — $20</li>
<li><strong>Integrasi:</strong> Pelajari cara mengimpor dan menggunakan aset di dalam engine</li>
</ol>
<p><strong>Perkiraan Biaya:</strong> $60–100<br>
<strong>Jangka Waktu:</strong> 4–8 bulan</p>
<hr>
<h3 id="programmer-→-developer-game" tabindex="-1">Programmer → Developer Game <a class="header-anchor" href="#programmer-→-developer-game" aria-label="Permalink to &quot;Programmer → Developer Game&quot;"></a></h3>
<ol>
<li><strong>Mulai:</strong> Pilih engine (Unity C# atau Unreal C++)</li>
<li><strong>Fondasi:</strong> Kursus engine tingkat menengah</li>
<li><strong>Pelajari Lebih Mendalam:</strong> Sistem gameplay lanjutan</li>
<li><strong>Portofolio:</strong> Bangun proyek game yang substansial</li>
</ol>
<p><strong>Perkiraan Biaya:</strong> $40–100<br>
<strong>Jangka Waktu:</strong> 3–6 bulan (jika sudah bisa memprogram)</p>
<hr>
<h3 id="penghobi-dengan-anggaran-terbatas" tabindex="-1">Penghobi dengan Anggaran Terbatas <a class="header-anchor" href="#penghobi-dengan-anggaran-terbatas" aria-label="Permalink to &quot;Penghobi dengan Anggaran Terbatas&quot;"></a></h3>
<ol>
<li><strong>Mulai:</strong> Unity Learn atau CS50 Game Dev (Gratis)</li>
<li><strong>Langkah Berikutnya:</strong> Tunggu diskon Udemy, beli satu kursus yang terfokus ($15)</li>
<li><strong>Latihan:</strong> Buat game kecil, ikuti game jam</li>
<li><strong>Komunitas:</strong> Bergabunglah dengan server Discord untuk mendapatkan masukan</li>
</ol>
<p><strong>Perkiraan Biaya:</strong> $0–30<br>
<strong>Jangka Waktu:</strong> Belajar sesuai kecepatan Anda sendiri</p>
<hr>
<h2 id="ringkasan-perbandingan-harga" tabindex="-1">Ringkasan Perbandingan Harga <a class="header-anchor" href="#ringkasan-perbandingan-harga" aria-label="Permalink to &quot;Ringkasan Perbandingan Harga&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Platform</th>
<th>Model</th>
<th>Biaya Umum</th>
<th>Penilaian Manfaat</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Unity Learn</strong></td>
<td>Gratis</td>
<td>$0</td>
<td>⭐⭐⭐⭐⭐</td>
</tr>
<tr>
<td><strong>CS50 Games</strong></td>
<td>Gratis (diarsipkan)</td>
<td>$0</td>
<td>⭐⭐⭐⭐</td>
</tr>
<tr>
<td><strong>Udemy</strong></td>
<td>Sekali bayar (saat diskon)</td>
<td>$12–30</td>
<td>⭐⭐⭐⭐⭐</td>
</tr>
<tr>
<td><strong>GDQuest</strong></td>
<td>Sekali bayar</td>
<td>$84–216</td>
<td>⭐⭐⭐⭐</td>
</tr>
<tr>
<td><strong>Skillshare</strong></td>
<td>Langganan</td>
<td>$168/tahun</td>
<td>⭐⭐⭐</td>
</tr>
<tr>
<td><strong>Pluralsight</strong></td>
<td>Langganan</td>
<td>$349/tahun</td>
<td>⭐⭐⭐</td>
</tr>
<tr>
<td><strong>Coursera</strong></td>
<td>Langganan + kursus</td>
<td>$49/bulan</td>
<td>⭐⭐⭐⭐</td>
</tr>
<tr>
<td><strong>LinkedIn Learning</strong></td>
<td>Langganan</td>
<td>$360/tahun</td>
<td>⭐⭐⭐</td>
</tr>
<tr>
<td><strong>Berklee Online</strong></td>
<td>Per kursus</td>
<td>$1,500+</td>
<td>⭐⭐⭐⭐ (profesional)</td>
</tr>
<tr>
<td><strong>Gelar Universitas</strong></td>
<td>Program gelar</td>
<td>$20,000+</td>
<td>Bergantung pada karier</td>
</tr>
</tbody>
</table>
<hr>
<h2 id="tips-memilih-kursus" tabindex="-1">Tips Memilih Kursus <a class="header-anchor" href="#tips-memilih-kursus" aria-label="Permalink to &quot;Tips Memilih Kursus&quot;"></a></h2>
<h3 id="_1-periksa-tanggal-terakhir-diperbarui" tabindex="-1">1. Periksa Tanggal &quot;Terakhir Diperbarui&quot; <a class="header-anchor" href="#_1-periksa-tanggal-terakhir-diperbarui" aria-label="Permalink to &quot;1. Periksa Tanggal &quot;Terakhir Diperbarui&quot;&quot;"></a></h3>
<p>Engine game berkembang dengan cepat. Kursus Unity 2020 pada tahun 2026 akan memiliki perbedaan signifikan dari versi terkini. Carilah kursus yang diperbarui dalam 12 bulan terakhir.</p>
<h3 id="_2-tonton-konten-pratinjau-gratis" tabindex="-1">2. Tonton Konten Pratinjau Gratis <a class="header-anchor" href="#_2-tonton-konten-pratinjau-gratis" aria-label="Permalink to &quot;2. Tonton Konten Pratinjau Gratis&quot;"></a></h3>
<p>Sebagian besar platform menawarkan pratinjau gratis. Evaluasi:</p>
<ul>
<li>Gaya dan tempo mengajar</li>
<li>Kualitas audio/video</li>
<li>Apakah penjelasannya masuk akal bagi Anda</li>
</ul>
<h3 id="_3-baca-ulasan-terbaru" tabindex="-1">3. Baca Ulasan Terbaru <a class="header-anchor" href="#_3-baca-ulasan-terbaru" aria-label="Permalink to &quot;3. Baca Ulasan Terbaru&quot;"></a></h3>
<p>Urutkan ulasan berdasarkan yang terbaru. Ulasan bintang 5 yang lama tidak mencerminkan kualitas konten saat ini.</p>
<h3 id="_4-periksa-kualitas-proyek" tabindex="-1">4. Periksa Kualitas Proyek <a class="header-anchor" href="#_4-periksa-kualitas-proyek" aria-label="Permalink to &quot;4. Periksa Kualitas Proyek&quot;"></a></h3>
<p>Lihat apa yang dibuat oleh para siswa. Apakah proyeknya mengesankan? Apakah layak dimasukkan ke dalam portofolio?</p>
<h3 id="_5-pertimbangkan-komunitas" tabindex="-1">5. Pertimbangkan Komunitas <a class="header-anchor" href="#_5-pertimbangkan-komunitas" aria-label="Permalink to &quot;5. Pertimbangkan Komunitas&quot;"></a></h3>
<p>Kursus dengan bagian tanya jawab aktif, server Discord, atau forum memberikan dukungan yang lebih baik saat Anda mengalami kesulitan.</p>
<h3 id="_6-sesuaikan-dengan-gaya-belajar-anda" tabindex="-1">6. Sesuaikan dengan Gaya Belajar Anda <a class="header-anchor" href="#_6-sesuaikan-dengan-gaya-belajar-anda" aria-label="Permalink to &quot;6. Sesuaikan dengan Gaya Belajar Anda&quot;"></a></h3>
<ul>
<li><strong>Pelajar visual:</strong> Kursus video (Udemy, YouTube)</li>
<li><strong>Pembaca:</strong> Dokumentasi Unity, tutorial tertulis</li>
<li><strong>Praktik langsung:</strong> Kursus berbasis proyek, game jam</li>
<li><strong>Terstruktur:</strong> Kursus universitas, spesialisasi</li>
</ul>
<hr>
<h2 id="tabel-ringkasan" tabindex="-1">Tabel Ringkasan <a class="header-anchor" href="#tabel-ringkasan" aria-label="Permalink to &quot;Tabel Ringkasan&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Kursus</th>
<th>Platform</th>
<th>Harga</th>
<th>Paling Cocok Untuk</th>
<th>Peringkat</th>
</tr>
</thead>
<tbody>
<tr>
<td>GameDev.tv Unity 3D</td>
<td>Udemy</td>
<td>$12–30</td>
<td>Pemula Unity</td>
<td>⭐ 4.7</td>
</tr>
<tr>
<td>Spesialisasi Michigan State</td>
<td>Coursera</td>
<td>$49/bln</td>
<td>Kredensial formal</td>
<td>⭐ 4.7</td>
</tr>
<tr>
<td>Jalur Unity Learn</td>
<td>Unity</td>
<td>Gratis</td>
<td>Pelajar dengan anggaran terbatas</td>
<td>⭐ 4.5</td>
</tr>
<tr>
<td>Stephen Ulibarri UE5</td>
<td>Udemy</td>
<td>$15–30</td>
<td>Unreal C++</td>
<td>⭐ 4.8</td>
</tr>
<tr>
<td>Spesialisasi UE Coursera</td>
<td>Coursera</td>
<td>$199</td>
<td>Pemula UE</td>
<td>⭐ 4.6</td>
</tr>
<tr>
<td>Paket GDQuest</td>
<td>GDQuest</td>
<td>$84–216</td>
<td>Pelajar Godot</td>
<td>⭐ 4.8</td>
</tr>
<tr>
<td>Kursus Pemula Godot</td>
<td>Udemy</td>
<td>$15–25</td>
<td>Godot dengan anggaran terbatas</td>
<td>⭐ 4.5</td>
</tr>
<tr>
<td>Harvard CS50 Games</td>
<td>edX (diarsipkan)</td>
<td>Gratis</td>
<td>Dasar-dasar</td>
<td>⭐ 4.6</td>
</tr>
<tr>
<td>Complete Blender Creator</td>
<td>Udemy</td>
<td>$15–30</td>
<td>Pemodelan 3D</td>
<td>⭐ 4.7</td>
</tr>
<tr>
<td>Berklee Game Audio</td>
<td>Berklee Online</td>
<td>$4,500</td>
<td>Audio profesional</td>
<td>⭐ 4.8</td>
</tr>
<tr>
<td>Game Audio Essentials</td>
<td>Udemy</td>
<td>$15–25</td>
<td>Audio dengan anggaran terbatas</td>
<td>⭐ 4.4</td>
</tr>
</tbody>
</table>
<hr>
<p>Siap mulai belajar? Pilih kursus yang sesuai dengan anggaran, tingkat keterampilan, dan engine pilihan Anda. Langkah terpenting adalah <strong>mulai membuat game</strong>. Kursus hanyalah alat untuk membantu Anda mencapainya dengan lebih cepat.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-kursus-pengembangan-game-gratis-terbaik" tabindex="-1">Apa kursus pengembangan game gratis terbaik? <a class="header-anchor" href="#apa-kursus-pengembangan-game-gratis-terbaik" aria-label="Permalink to &quot;Apa kursus pengembangan game gratis terbaik?&quot;"></a></h3>
<p>Dua pilihan gratis terbaik adalah jalur Unity Learn dan kursus pengembangan game CS50 dari Harvard. Jalur Junior Programmer dan Creative Core di Unity Learn bersifat resmi, selalu mutakhir, dan berbasis proyek, membawa Anda dari tingkat pemula menuju kesiapan kerja tanpa biaya. CS50 Introduction to Game Development dari Harvard mengajarkan dasar-dasar yang dapat diterapkan pada engine apa pun, dan materinya tetap gratis meskipun kursus aslinya telah diarsipkan dan digantikan oleh kursus CS50 2D yang baru. Keduanya benar-benar gratis, bukan sekadar masa uji coba.</p>
<h3 id="apakah-gelar-pengembangan-game-layak-diambil-pada-tahun-2026" tabindex="-1">Apakah gelar pengembangan game layak diambil pada tahun 2026? <a class="header-anchor" href="#apakah-gelar-pengembangan-game-layak-diambil-pada-tahun-2026" aria-label="Permalink to &quot;Apakah gelar pengembangan game layak diambil pada tahun 2026?&quot;"></a></h3>
<p>Itu bergantung pada tujuan Anda. Gelar formal seperti M.A. online dalam Desain Game dari WVU (sekitar $22,650) masuk akal jika Anda menginginkan kredensial akademis untuk peran pengajaran, penelitian, atau kepemimpinan. Untuk mendapatkan pekerjaan sebagai developer, keputusan perekrutan biasanya bergantung pada portofolio Anda. Anda dapat membangun portofolio melalui kursus Udemy yang sedang didiskon ($12 hingga $30), jalur Unity Learn gratis, dan proyek yang telah dirilis dengan biaya yang jauh lebih kecil dibandingkan biaya gelar. Gelar memberikan struktur dan kredensial, bukan jaminan pekerjaan.</p>
<h3 id="berapa-lama-waktu-yang-diperlukan-untuk-mempelajari-pengembangan-game" tabindex="-1">Berapa lama waktu yang diperlukan untuk mempelajari pengembangan game? <a class="header-anchor" href="#berapa-lama-waktu-yang-diperlukan-untuk-mempelajari-pengembangan-game" aria-label="Permalink to &quot;Berapa lama waktu yang diperlukan untuk mempelajari pengembangan game?&quot;"></a></h3>
<p>Rencanakan upaya konsisten selama beberapa bulan, bukan hanya beberapa minggu. Jalur pembelajaran di sini memperkirakan seorang pemula sepenuhnya memerlukan sekitar 6 hingga 12 bulan secara paruh waktu untuk belajar Unity dari nol hingga siap kerja. Jika Anda sudah bisa memprogram, 3 hingga 6 bulan adalah target yang realistis. Jika Anda berasal dari bidang seni, siapkan waktu 4 hingga 8 bulan untuk menambahkan keterampilan engine dan pipeline. Cara tercepat untuk maju adalah melalui pembelajaran berbasis proyek: buat game kecil dan ikuti game jam, alih-alih hanya menonton materi kuliah.</p>
<h3 id="haruskah-saya-mempelajari-unity-atau-unreal-terlebih-dahulu" tabindex="-1">Haruskah saya mempelajari Unity atau Unreal terlebih dahulu? <a class="header-anchor" href="#haruskah-saya-mempelajari-unity-atau-unreal-terlebih-dahulu" aria-label="Permalink to &quot;Haruskah saya mempelajari Unity atau Unreal terlebih dahulu?&quot;"></a></h3>
<p>Bagi kebanyakan pemula, Unity adalah titik awal yang lebih mudah. Unity menggunakan C#, memiliki kumpulan kursus pemula terlengkap (GameDev.tv, spesialisasi Michigan State, dan jalur Unity Learn gratis), serta komunitas besar yang dapat membantu saat Anda mengalami kesulitan. Unreal layak dipilih sebagai titik awal jika Anda mengincar visual 3D berkualitas tinggi atau bergaya konsol, atau jika Anda sudah menguasai C++. Kursus UE5 dari Stephen Ulibarri adalah pilihan unggulan untuk Unreal, meskipun kursus tersebut mengasumsikan Anda sudah memiliki sedikit pengalaman pemrograman. Keduanya sama-sama pilihan yang baik, jadi pilihlah engine dengan kursus dan jenis game target yang paling sesuai dengan apa yang ingin Anda buat.</p>
<p>Untuk sumber daya lainnya, lihat:</p>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a></li>
<li><a href="/id/guides/game-jams-hackathons.html">Panduan Game Jam &amp; Hackathon</a> — cara terbaik untuk belajar adalah merilis game di bawah tekanan</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a></li>
<li><a href="/id/guides/web-game-engines-comparison.html">Perbandingan Engine Game Web</a> — memilih engine yang tepat sebelum menentukan kursus</li>
<li><a href="/id/guides/game-asset-licenses.html">Penjelasan Lisensi Aset Game</a> — memahami lisensi sebelum menggunakan aset dari kursus</li>
<li><a href="/id/tutorials/canvas-2d-game-loop.html">Game loop Canvas 2D</a> — mulai membuat game tanpa kursus melalui tutorial gratis</li>
</ul>
<BuildCta
  title="Pelajaran pertama terbaik adalah merilis sesuatu"
  desc="Buat game hari ini, lalu ikuti kursus untuk memahami apa yang terjadi."
  prompt="Buat game pertama saya: labirin bola menggelinding dengan tiga level" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/game-dev-courses.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Panduan Game Jam & Hackathon]]></title>
            <link>https://app.cinevva.com/id/guides/game-jams-hackathons</link>
            <guid>https://app.cinevva.com/id/guides/game-jams-hackathons</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Panduan lengkap tentang game jam dan hackathon - apa itu, acara utama, alasan game web unggul, dan bagaimana Cinevva membantu Anda meluncurkan game jam]]></description>
            <content:encoded><![CDATA[<h1 id="panduan-game-jam-hackathon" tabindex="-1">Panduan Game Jam &amp; Hackathon <a class="header-anchor" href="#panduan-game-jam-hackathon" aria-label="Permalink to &quot;Panduan Game Jam &amp; Hackathon&quot;"></a></h1>
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:8px;margin:1.5rem 0">
<iframe src="https://www.youtube.com/embed/btOlp4_d1tc" style="position:absolute;top:0;left:0;width:100%;height:100%;border:0" allow="accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture" allowfullscreen></iframe>
</div>
<p style="font-size:0.9rem;color:var(--vp-c-text-2);margin-top:-0.5rem">5 kiat untuk memenangkan game jam seperti GMTK dan Ludum Dare</p>
<p>Game jam adalah tempat lahirnya game indie. Anda membuat game dalam 48–72 jam, langsung mendapatkan masukan dari ribuan pemain, dan terkadang meluncurkan sesuatu yang kemudian menjadi hit sungguhan. Panduan ini membahas semua yang perlu Anda ketahui.</p>
<h2 id="apa-itu-game-jam" tabindex="-1">Apa Itu Game Jam? <a class="header-anchor" href="#apa-itu-game-jam" aria-label="Permalink to &quot;Apa Itu Game Jam?&quot;"></a></h2>
<p>Game jam adalah acara berbatas waktu tempat Anda membuat game dari nol, biasanya berdasarkan tema yang diumumkan saat acara dimulai. Anggap saja sebagai hackathon untuk pengembang game. Acara ini biasanya berlangsung selama 48 jam hingga 30 hari, dengan tim beranggotakan satu hingga empat orang, dan tujuannya adalah menghasilkan prototipe yang dapat dimainkan.</p>
<p>Game jam bukan tentang membuat produk komersial yang sempurna. Acara ini berfokus pada eksperimen, pemecahan masalah secara kreatif di tengah berbagai batasan, dan membuat sesuatu yang menyenangkan dalam waktu singkat.</p>
<h2 id="mengapa-game-jam-penting" tabindex="-1">Mengapa Game Jam Penting <a class="header-anchor" href="#mengapa-game-jam-penting" aria-label="Permalink to &quot;Mengapa Game Jam Penting&quot;"></a></h2>
<p>Bagi pengembang baru, tidak ada yang lebih baik daripada benar-benar merilis sebuah game utuh, meskipun kecil. Ketidaksempurnaan memang sudah diperkirakan, jadi Anda bebas bereksperimen. Peserta lain akan memainkan dan menilai game Anda sehingga Anda langsung mendapatkan masukan. Game jam yang selesai juga membuktikan bahwa Anda mampu mengeksekusi ide, bukan sekadar membicarakannya.</p>
<p>Bagi pengembang berpengalaman, game jam memungkinkan Anda menguji ide dengan cepat dan memvalidasi konsep sebelum menginvestasikan waktu berbulan-bulan. Batasan memicu kreativitas dan mengatasi kebuntuan kreatif. Anda dapat bertemu calon kolaborator, penerbit, dan pemain. Banyak game indie sukses juga bermula sebagai karya game jam.</p>
<p>Celeste bermula sebagai game Ludum Dare. Superhot dimulai sebagai prototipe 7 hari. Hollow Knight berkembang dari konsep game jam. Minit berasal dari game jam selama 48 jam. Papers, Please dibuat untuk Ludum Dare 29.</p>
<h2 id="game-jam-utama-pada-2026" tabindex="-1">Game Jam Utama pada 2026 <a class="header-anchor" href="#game-jam-utama-pada-2026" aria-label="Permalink to &quot;Game Jam Utama pada 2026&quot;"></a></h2>
<h3 id="acara-global" tabindex="-1">Acara Global <a class="header-anchor" href="#acara-global" aria-label="Permalink to &quot;Acara Global&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Acara</th>
<th>Waktu</th>
<th>Format</th>
<th>Catatan</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Global Game Jam</strong></td>
<td>Akhir Januari</td>
<td>48 jam, lokasi fisik &amp; jarak jauh</td>
<td>Game jam terbesar dengan lebih dari 40.000 peserta di seluruh dunia. Edisi 2026 (26 Jan–1 Feb) menjadi momen ketika total peserta GGJ sejak pertama kali diselenggarakan melampaui 500.000 orang, di sekitar 800 lokasi dalam lebih dari 100 negara.</td>
</tr>
<tr>
<td><strong>Ludum Dare</strong></td>
<td>April, Oktober (perkiraan)</td>
<td>48 jam solo / 72 jam tim</td>
<td>Salah satu game jam tertua dan paling dihormati</td>
</tr>
<tr>
<td><strong>GMTK Game Jam</strong></td>
<td>Musim panas</td>
<td>48 jam</td>
<td>Jumlah penonton sangat besar, biasanya menerima lebih dari 7.000 karya</td>
</tr>
<tr>
<td><strong>js13kGames</strong></td>
<td>Agustus–September</td>
<td>Batas 13 KB, 30 hari</td>
<td>Terbaik untuk pengembang web</td>
</tr>
<tr>
<td><strong>Gamedev.js Jam</strong></td>
<td>13–26 April 2026</td>
<td>13 hari, khusus HTML5</td>
<td>Berhadiah, dengan format yang mudah diikuti</td>
</tr>
</tbody>
</table>
<h3 id="game-jam-berkelanjutan-rutin-di-itch-io" tabindex="-1">Game Jam Berkelanjutan &amp; Rutin di itch.io <a class="header-anchor" href="#game-jam-berkelanjutan-rutin-di-itch-io" aria-label="Permalink to &quot;Game Jam Berkelanjutan &amp; Rutin di itch.io&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Game Jam</th>
<th>Deskripsi</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Brackeys Game Jam 2026.2</strong></td>
<td>7 hari, ribuan peserta, 23–30 Agustus 2026</td>
</tr>
<tr>
<td><strong>Pirate Software Game Jam 18</strong></td>
<td>14 hari, sekitar 600+ peserta</td>
</tr>
<tr>
<td><strong>Finally Finish Something 2026</strong></td>
<td>Januari, untuk menyelesaikan proyek yang masih dalam pengerjaan</td>
</tr>
<tr>
<td><strong>2026 Annual Jam</strong></td>
<td>Berlangsung sepanjang tahun, dengan aturan santai</td>
</tr>
<tr>
<td><strong>Retro Game Jam 2026</strong></td>
<td>8–14 Feb, berfokus pada estetika retro</td>
</tr>
</tbody>
</table>
<p><strong>Temukan lebih banyak:</strong> <a href="https://itch.io/jams" target="_blank" rel="noreferrer">itch.io/jams</a> mencantumkan ratusan game jam aktif dan mendatang.</p>
<hr>
<h2 id="mengapa-game-web-unggul-dalam-game-jam" tabindex="-1">Mengapa Game Web Unggul dalam Game Jam <a class="header-anchor" href="#mengapa-game-web-unggul-dalam-game-jam" aria-label="Permalink to &quot;Mengapa Game Web Unggul dalam Game Jam&quot;"></a></h2>
<p>Jika Anda dapat membuat game yang bisa dimainkan di browser, Anda memiliki keunggulan besar.</p>
<h3 id="tanpa-hambatan" tabindex="-1">Tanpa Hambatan <a class="header-anchor" href="#tanpa-hambatan" aria-label="Permalink to &quot;Tanpa Hambatan&quot;"></a></h3>
<p>Juri game jam memainkan puluhan game. Untuk game yang harus diunduh, mereka perlu mengeklik unduh, menunggu, mengekstrak atau menginstalnya, mencari berkas yang dapat dijalankan, lalu membukanya. Itu memerlukan 5–10 menit bahkan sebelum mereka mulai bermain. Dengan game web, mereka cukup mengeklik main dan menunggu 2–5 detik. Mereka langsung bermain.</p>
<p>Setiap detik hambatan dapat mengurangi jumlah pemain, penilaian, dan peringkat Anda.</p>
<h3 id="berfungsi-di-mana-saja" tabindex="-1">Berfungsi di Mana Saja <a class="header-anchor" href="#berfungsi-di-mana-saja" aria-label="Permalink to &quot;Berfungsi di Mana Saja&quot;"></a></h3>
<p>Game web berjalan di Windows, Mac, Linux, dan ChromeOS. Game juga dapat berjalan di perangkat seluler jika Anda mendukung kontrol sentuh. Anda tidak perlu menulis “Maaf, hanya untuk Windows” dalam deskripsi. Dengan demikian, Anda memaksimalkan potensi audiens.</p>
<h3 id="mudah-dibagikan" tabindex="-1">Mudah Dibagikan <a class="header-anchor" href="#mudah-dibagikan" aria-label="Permalink to &quot;Mudah Dibagikan&quot;"></a></h3>
<p>Anda mendapatkan tautan langsung untuk bermain. Anda dapat menyematkannya dalam twit, Discord, dan blog. Tidak ada tautan mencurigakan seperti “Unduh dari Google Drive”. Ini juga lebih baik untuk potensi viral di media sosial.</p>
<h3 id="pembaruan-instan" tabindex="-1">Pembaruan Instan <a class="header-anchor" href="#pembaruan-instan" aria-label="Permalink to &quot;Pembaruan Instan&quot;"></a></h3>
<p>Memperbaiki bug? Deploy dalam hitungan detik. Menemukan masalah keseimbangan? Terapkan perbaikan secara langsung. Tidak perlu pesan “v1.1 sudah diunggah, silakan unduh ulang”.</p>
<h3 id="kemampuan-teknis" tabindex="-1">Kemampuan Teknis <a class="header-anchor" href="#kemampuan-teknis" aria-label="Permalink to &quot;Kemampuan Teknis&quot;"></a></h3>
<p>WebGL dan WebGPU menyediakan grafis yang diakselerasi GPU. Web Audio API memberikan dukungan suara penuh. LocalStorage dan IndexedDB memungkinkan Anda menyimpan progres game tanpa server. Service Workers memungkinkan game dimainkan secara offline. WebSockets mendukung multipemain.</p>
<h2 id="membantu-orang-menemukan-game-jam-anda" tabindex="-1">Membantu Orang Menemukan Game Jam Anda <a class="header-anchor" href="#membantu-orang-menemukan-game-jam-anda" aria-label="Permalink to &quot;Membantu Orang Menemukan Game Jam Anda&quot;"></a></h2>
<p>Game jam menghasilkan ribuan game. Setelah game jam berakhir, game Anda bersaing dengan ribuan karya lain di itch.io, halaman “Baru” yang membanjiri pemain, serta pemain dengan waktu terbatas yang hanya melihat sekilas.</p>
<p>Solusi tradisional tidak terlalu efektif. Tangkapan layar tidak memperlihatkan gameplay. Trailer membutuhkan waktu berjam-jam untuk dibuat ketika Anda sudah kelelahan. Pemasaran memerlukan energi yang mungkin sudah tidak Anda miliki.</p>
<h3 id="gameplay-berdurasi-pendek-efektif" tabindex="-1">Gameplay Berdurasi Pendek Efektif <a class="header-anchor" href="#gameplay-berdurasi-pendek-efektif" aria-label="Permalink to &quot;Gameplay Berdurasi Pendek Efektif&quot;"></a></h3>
<p>Rekam gameplay selama 15 detik yang menampilkan momen terbaik, loop inti, atau daya tarik utama. Unggah sebagai video pendek di TikTok, Reels, atau YouTube Shorts, lalu tautkan kembali ke tempat game dapat dimainkan. Pemain menggulir, menonton, mengeklik, dan langsung bermain, terutama jika game tersebut berjalan di browser.</p>
<p>Game Anda dinilai berdasarkan gameplay-nya, bukan keterampilan pemasaran Anda. Anda tidak memerlukan waktu untuk membuat trailer karena klip 15 detik sudah cukup. Anda tidak perlu bersaing dengan pemasaran game AAA karena gameplay dapat menunjukkan kualitasnya sendiri. Pemain juga tidak perlu mengunduh apa pun karena game web dapat langsung dimainkan.</p>
<h3 id="alur-kerja" tabindex="-1">Alur Kerja <a class="header-anchor" href="#alur-kerja" aria-label="Permalink to &quot;Alur Kerja&quot;"></a></h3>
<p>Selama game jam, fokuslah membuat game. Jika Anda berpacu dengan waktu atau ingin segera memiliki fondasi yang dapat dimainkan, Cinevva dapat mengubah prompt menjadi game web 3D yang dapat dimainkan di browser, lalu Anda publikasikan sebagai tautan yang bisa dibagikan, disematkan, atau ditautkan dari halaman itch.io Anda. Pada satu jam terakhir, rekam 2–3 klip gameplay singkat.</p>
<p>Setelah mengirimkan karya, daftarkan game Anda ke game jam seperti biasa, unggah klip ke media sosial, bagikan tautan bermain langsung, lalu saksikan pemain sungguhan menemukan dan memainkan game Anda.</p>
<h2 id="strategi-sukses" tabindex="-1">Strategi Sukses <a class="header-anchor" href="#strategi-sukses" aria-label="Permalink to &quot;Strategi Sukses&quot;"></a></h2>
<h3 id="sebelum-game-jam" tabindex="-1">Sebelum Game Jam <a class="header-anchor" href="#sebelum-game-jam" aria-label="Permalink to &quot;Sebelum Game Jam&quot;"></a></h3>
<p>Siapkan peralatan Anda. Uji engine, IDE, dan alat pembuat aset. Siapkan kontrol versi dengan Git. Miliki templat proyek yang siap digunakan. Berlatihlah mengimpor aset dan membuat mekanik dasar.</p>
<p>Persiapkan diri Anda. Tidurlah dengan cukup pada malam sebelumnya. Siapkan makanan dan minuman. Kosongkan jadwal. Beri tahu keluarga atau teman serumah bahwa Anda akan sibuk.</p>
<p>Jika Anda memiliki tim, sepakati sarana komunikasi (Discord sangat cocok), tentukan pembagian peran secara umum, dan samakan ekspektasi mengenai ketersediaan setiap anggota.</p>
<h3 id="selama-game-jam" tabindex="-1">Selama Game Jam <a class="header-anchor" href="#selama-game-jam" aria-label="Permalink to &quot;Selama Game Jam&quot;"></a></h3>
<p>Dalam 2 jam pertama, lakukan curah pendapat dan susun rencana. Hasilkan beberapa ide dan pilih yang paling realistis untuk diselesaikan. Batasi cakupan tanpa ragu dan pangkas hingga 50%. Dokumentasikan loop inti. Sepakati gaya visual.</p>
<p>Dari jam ke-2 hingga ke-20, buat bagian inti. Pastikan mekanik utama berfungsi terlebih dahulu. Aset sementara tidak masalah. Jangan melakukan pemolesan sebelum bagian inti berfungsi. Lakukan commit secara rutin.</p>
<p>Dari jam ke-20 hingga ke-40, buat game benar-benar dapat dimainkan. Tambahkan konten seperti level dan musuh. Buat UI dasar dengan menu dan layar game over. Tambahkan efek suara dan musik. Terus lakukan pengujian.</p>
<p>Dalam 8 jam terakhir, poles dan rilis. Perbaiki hanya bug kritis. Lakukan pemolesan visual terakhir. Tulis deskripsi Anda. Ambil tangkapan layar dan buat GIF. Kirimkan karya lebih awal agar tidak melewatkan tenggat waktu.</p>
<h3 id="setelah-game-jam" tabindex="-1">Setelah Game Jam <a class="header-anchor" href="#setelah-game-jam" aria-label="Permalink to &quot;Setelah Game Jam&quot;"></a></h3>
<p>Segera beristirahat karena Anda layak mendapatkannya. Bagikan game di media sosial. Ucapkan terima kasih kepada rekan satu tim.</p>
<p>Dalam waktu satu minggu, mainkan dan nilai karya peserta lain, tanggapi komentar, kumpulkan masukan, dan rekam klip gameplay.</p>
<p>Setelah itu, putuskan apakah Anda ingin melanjutkan pengembangan, tulis devlog evaluasi pascaproyek, dan jalin hubungan dengan orang-orang yang Anda temui.</p>
<h3 id="kesalahan-umum" tabindex="-1">Kesalahan Umum <a class="header-anchor" href="#kesalahan-umum" aria-label="Permalink to &quot;Kesalahan Umum&quot;"></a></h3>
<p>Pembengkakan cakupan terjadi akibat antusiasme. Tulis daftar fitur sejak awal dan patuhi daftar tersebut. Game tanpa suara terjadi ketika Anda menundanya hingga akhir. Tambahkan suara sementara sejak dini. Kontrol yang tidak jelas muncul karena pengembang sudah terlalu terbiasa dengan gamenya sendiri. Sertakan petunjuk dan lakukan pengujian bersama orang lain. Build yang rusak terjadi akibat terburu-buru. Uji proses ekspor sejak awal game jam. Deskripsi buruk muncul akibat kelelahan. Buat drafnya sebelum Anda terlalu lelah.</p>
<h2 id="membuat-game-web-untuk-game-jam" tabindex="-1">Membuat Game Web untuk Game Jam <a class="header-anchor" href="#membuat-game-web-untuk-game-jam" aria-label="Permalink to &quot;Membuat Game Web untuk Game Jam&quot;"></a></h2>
<p>Untuk game 2D, Phaser adalah framework game HTML5 paling populer. Pixi.js adalah renderer 2D cepat yang dapat dipadukan dengan logika buatan Anda sendiri. Godot memiliki fitur ekspor HTML5 yang sangat baik.</p>
<p>Untuk game 3D, Three.js adalah pustaka WebGL yang paling fleksibel. Babylon.js adalah engine 3D dengan fitur lengkap. PlayCanvas bersifat web-native dan dilengkapi editor bawaan.</p>
<p>Untuk pendekatan no-code atau low-code, GDevelop adalah pembuat game visual dengan fitur ekspor web. Construct memungkinkan Anda membuat game HTML5 no-code yang canggih.</p>
<h3 id="pengoptimalan" tabindex="-1">Pengoptimalan <a class="header-anchor" href="#pengoptimalan" aria-label="Permalink to &quot;Pengoptimalan&quot;"></a></h3>
<p>Jaga waktu pemuatan di bawah 10 detik dengan mengompresi aset dan menerapkan lazy loading. Tampilkan progres pemuatan agar pemain tidak pergi. Uji di Chrome, Firefox, dan Safari karena setiap browser memiliki keunikannya sendiri. Jika memungkinkan, optimalkan untuk perangkat seluler dengan kontrol sentuh dan tata letak responsif. Sediakan tombol layar penuh untuk meningkatkan imersi. Sertakan tombol untuk menonaktifkan suara karena tidak semua orang dapat menyalakannya.</p>
<p>Untuk pengaturan sematan itch.io, gunakan lebar 960 px (atau resolusi asli Anda), tinggi 540 px untuk rasio 16:9, aktifkan opsi ramah perangkat seluler jika game responsif, aktifkan tombol layar penuh, dan nonaktifkan bilah gulir.</p>
<h2 id="setelah-game-jam-1" tabindex="-1">Setelah Game Jam <a class="header-anchor" href="#setelah-game-jam-1" aria-label="Permalink to &quot;Setelah Game Jam&quot;"></a></h2>
<p>Pada minggu pertama, tanggapi semua masukan untuk membangun hubungan baik dan belajar. Mainkan dan nilai karya peserta lain karena komunitas itu penting. Unggah devlog yang menceritakan pengalaman Anda serta hal-hal yang berhasil maupun tidak. Unggah klip gameplay agar lebih banyak orang melihat game Anda.</p>
<p>Pada bulan pertama, perbaiki bug yang dilaporkan pemain, lakukan pemolesan kecil yang tidak memerlukan banyak usaha tetapi berdampak besar, dan bagikan kisah game jam Anda di media sosial menggunakan GIF.</p>
<p>Untuk jangka panjang, jika game tersebut memiliki potensi, kelompokkan tema masukan untuk melihat hal-hal yang secara konsisten disukai atau tidak disukai pemain. Nilai apakah konsep tersebut dapat dikembangkan menjadi game yang lebih besar. Rencanakan versi pascagame jam yang lebih luas dan lebih halus. Pertimbangkan monetisasi melalui PWYW di itch.io atau perilisan di Steam.</p>
<p>Tanda-tanda bahwa game jam Anda dapat dikembangkan lebih lanjut: pemain meminta lebih banyak konten, streamer mulai memainkannya, penilaian tinggi dibandingkan game serupa, Anda masih bersemangat mengerjakannya beberapa minggu kemudian, dan tersedia jalur yang jelas untuk membuat kontennya 10 kali lebih banyak.</p>
<h2 id="sumber-daya" tabindex="-1">Sumber Daya <a class="header-anchor" href="#sumber-daya" aria-label="Permalink to &quot;Sumber Daya&quot;"></a></h2>
<p>Untuk komunitas, kunjungi <a href="https://reddit.com/r/gamejams" target="_blank" rel="noreferrer">r/gamejams</a> untuk diskusi aktif tentang game jam, <a href="https://reddit.com/r/ludumdare" target="_blank" rel="noreferrer">r/ludumdare</a> untuk pembahasan khusus LD, <a href="https://itch.io/jams" target="_blank" rel="noreferrer">Game Jam itch.io</a> untuk menemukan dan mengikuti game jam, serta <a href="https://gamedevjs.com" target="_blank" rel="noreferrer">Gamedev.js</a> untuk komunitas pengembang game JavaScript.</p>
<p>Untuk peralatan, <a href="https://kenney.nl" target="_blank" rel="noreferrer">Kenney Assets</a> menyediakan aset game gratis, <a href="https://opengameart.org" target="_blank" rel="noreferrer">OpenGameArt</a> menyediakan gambar dan audio berlisensi CC, <a href="https://freesound.org" target="_blank" rel="noreferrer">Freesound</a> menyediakan efek suara, dan <a href="https://itch.io/docs/butler/" target="_blank" rel="noreferrer">itch.io Butler</a> adalah CLI untuk mengunggah dengan cepat.</p>
<p>Untuk belajar, lihat <a href="/id/tutorials/">Tutorial Cinevva</a> untuk panduan pengembangan game web, <a href="/id/guides/web-game-engines-comparison.html">Perbandingan Engine Game Web</a> untuk memilih peralatan, dan <a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game di itch.io</a> untuk mengoptimalkan halaman game Anda.</p>
<h2 id="game-jam-anda-berikutnya" tabindex="-1">Game Jam Anda Berikutnya <a class="header-anchor" href="#game-jam-anda-berikutnya" aria-label="Permalink to &quot;Game Jam Anda Berikutnya&quot;"></a></h2>
<p>Sebelum game jam, instal dan uji peralatan Anda, siapkan proyek templat, kumpulkan paket aset jika diizinkan, bentuk tim atau putuskan untuk berpartisipasi sendiri, dan kosongkan kalender Anda.</p>
<p>Selama game jam, lakukan curah pendapat berdasarkan tema selama maksimal 30 menit, buat prototipe mekanik inti terlebih dahulu, lakukan pengujian sejak awal dan sesering mungkin, tambahkan suara sebelum hari terakhir, serta sisakan setidaknya satu jam untuk mengirimkan karya.</p>
<p>Setelah game jam, kirimkan karya ke halaman game jam, unggah klip gameplay, mainkan dan nilai karya peserta lain, tanggapi masukan, serta tulis devlog tentang pengalaman Anda.</p>
<h2 id="mulai-sekarang" tabindex="-1">Mulai Sekarang <a class="header-anchor" href="#mulai-sekarang" aria-label="Permalink to &quot;Mulai Sekarang&quot;"></a></h2>
<p>Jelajahi game jam mendatang di <a href="https://itch.io/jams" target="_blank" rel="noreferrer">itch.io/jams</a>. Pilih yang sesuai dengan jadwal dan minat Anda. Siapkan peralatan menggunakan panduan ini. Buat sesuatu yang luar biasa dalam 48–72 jam. Bagikan dan saksikan pemain menemukannya.</p>
<p>Game jam adalah tempat lahirnya game indie. Game jam Anda berikutnya bisa menjadi awal dari sesuatu yang besar.</p>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="game-jam-mana-yang-paling-cocok-untuk-pemula" tabindex="-1">Game jam mana yang paling cocok untuk pemula? <a class="header-anchor" href="#game-jam-mana-yang-paling-cocok-untuk-pemula" aria-label="Permalink to &quot;Game jam mana yang paling cocok untuk pemula?&quot;"></a></h3>
<p>Mulailah dengan game jam yang memiliki komunitas besar dan ramah serta aturan fleksibel, karena karya pertama yang masih kasar akan lebih mudah diterima di sana. Global Game Jam adalah pilihan awal yang paling ramah, dengan lokasi fisik dan jarak jauh, mentor yang siap membantu, serta tanpa tuntutan untuk menghasilkan game yang sempurna. Ludum Dare hampir sama ramahnya bagi pemula dan diselenggarakan dua kali setahun, dengan basis pemain besar yang menilai setiap karya. Jika Anda seorang pengembang web, Gamedev.js Jam dan js13kGames memberikan waktu yang cukup longgar serta hanya menerima HTML5, sedangkan “Finally Finish Something” di itch.io berfokus pada menyelesaikan sesuatu alih-alih menang. Untuk game jam pertama, pilih acara dengan durasi lebih panjang agar Anda tidak harus berpacu dengan waktu sambil masih belajar.</p>
<h3 id="berapa-lama-game-jam-berlangsung" tabindex="-1">Berapa lama game jam berlangsung? <a class="header-anchor" href="#berapa-lama-game-jam-berlangsung" aria-label="Permalink to &quot;Berapa lama game jam berlangsung?&quot;"></a></h3>
<p>Durasinya berkisar dari beberapa jam hingga satu bulan penuh, tetapi game jam terkenal biasanya berlangsung selama akhir pekan. Global Game Jam dan GMTK berlangsung selama 48 jam, sedangkan Ludum Dare memberi Anda waktu 48 jam untuk solo atau 72 jam sebagai tim. Format lebih panjang tersedia jika Anda menginginkan waktu yang lebih longgar: Pirate Software Game Jam berlangsung selama 14 hari, js13kGames selama 30 hari, dan beberapa game jam itch.io merupakan acara santai sepanjang tahun. Sesuaikan durasi dengan jadwal dan pengalaman Anda karena sprint 48 jam dan game jam dua minggu memerlukan ritme kerja yang sangat berbeda.</p>
<h3 id="apakah-game-dari-game-jam-benar-benar-mendapatkan-pemain" tabindex="-1">Apakah game dari game jam benar-benar mendapatkan pemain? <a class="header-anchor" href="#apakah-game-dari-game-jam-benar-benar-mendapatkan-pemain" aria-label="Permalink to &quot;Apakah game dari game jam benar-benar mendapatkan pemain?&quot;"></a></h3>
<p>Ya, lebih banyak dari yang Anda bayangkan selama periode penilaian. Dalam jam dengan ribuan peserta, semua orang memainkan dan menilai karya satu sama lain, sehingga game yang solid bisa memperoleh ratusan kali dimainkan pada minggu pertama tanpa pemasaran dari luar. Game web paling unggul dalam situasi ini karena juri cukup mengeklik sekali lalu langsung bermain, tanpa perlu mengunduh. Namun, perhatian cepat mereda setelah periode penilaian berakhir. Jadi, jumlah pemain yang Anda dapatkan bergantung pada pengumpulan karya tepat waktu, penilaian terhadap karya lain agar game Anda ikut dilihat, dan publikasi klip gameplay singkat selagi jam masih hangat. Banyak game populer berawal dengan cara ini, dari Celeste hingga Superhot.</p>
<h3 id="engine-apa-yang-sebaiknya-anda-gunakan-untuk-jam-48-jam" tabindex="-1">Engine apa yang sebaiknya Anda gunakan untuk jam 48 jam? <a class="header-anchor" href="#engine-apa-yang-sebaiknya-anda-gunakan-untuk-jam-48-jam" aria-label="Permalink to &quot;Engine apa yang sebaiknya Anda gunakan untuk jam 48 jam?&quot;"></a></h3>
<p>Gunakan engine yang sudah Anda kuasai. Jam 48 jam lebih menghargai keakraban daripada kemampuan mentah, jadi akhir pekan ini bukan waktu yang tepat untuk mempelajari engine baru. Apa pun pilihan Anda, utamakan engine yang dapat mengekspor build web dengan baik karena karya yang bisa dimainkan di browser akan memperoleh jauh lebih banyak pemain dan penilaian dibandingkan game yang harus diunduh. Untuk 2D, Godot, Phaser, dan Pixi.js dapat mengekspor ke web dengan baik. Untuk 3D, Three.js, Babylon.js, dan PlayCanvas adalah pilihan yang solid. Jika Anda tidak ingin menulis kode, GDevelop dan Construct dapat membuat game HTML5 tanpa kode, sedangkan alat berbasis prompt seperti Cinevva dapat menghasilkan game web 3D siap dimainkan yang bisa Anda kembangkan lebih lanjut dalam hitungan menit.</p>
<BuildCta
  title="Latih kecepatan jam Anda sekarang juga"
  desc="Prototipe siap dimainkan dalam hitungan menit adalah pemanasan yang bagus untuk jam 48 jam."
  prompt="Buat prototipe game jam dengan gravitasi yang berbalik setiap 10 detik" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — paket aset CC0 yang siap digunakan untuk game jam</li>
<li><a href="/id/tutorials/agentic-code-tools.html">Alat kode AI agentik</a> — menggunakan Claude Code, Cursor, dan Copilot untuk membangun game lebih cepat selama jam</li>
<li><a href="/id/guides/kickstarter-for-indie-games.html">Kickstarter untuk Game Indie</a> — mengembangkan game jam yang sukses menjadi proyek yang didanai</li>
<li><a href="/id/guides/co-op-game-design.html">Desain Game Kooperatif</a> — game jam kooperatif mendapatkan lebih banyak perhatian dan penilaian</li>
<li><a href="/id/tutorials/canvas-2d-game-loop.html">Game loop Canvas 2D</a> — fondasi paling sederhana untuk game jam 48 jam</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/game-jams-hackathons.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Cara Meluncurkan Game Anda di itch.io (Panduan 2026)]]></title>
            <link>https://app.cinevva.com/id/guides/itch-io-launch-guide</link>
            <guid>https://app.cinevva.com/id/guides/itch-io-launch-guide</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara meluncurkan, memasarkan, dan mengembangkan game indie Anda di itch.io pada 2026 - penyiapan halaman, penetapan harga, tag, devlog, dan cara agar ditemukan.]]></description>
            <content:encoded><![CDATA[<h1 id="cara-meluncurkan-game-anda-di-itch-io-panduan-2026" tabindex="-1">Cara Meluncurkan Game Anda di itch.io (Panduan 2026) <a class="header-anchor" href="#cara-meluncurkan-game-anda-di-itch-io-panduan-2026" aria-label="Permalink to &quot;Cara Meluncurkan Game Anda di itch.io (Panduan 2026)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Panduan ini membahas semua yang telah saya pelajari tentang meluncurkan game di itch.io. Mulai dari penyiapan halaman hingga penetapan harga dan visibilitas, inilah strategi yang benar-benar efektif.</p>
<h2 id="mengapa-itch-io" tabindex="-1">Mengapa itch.io? <a class="header-anchor" href="#mengapa-itch-io" aria-label="Permalink to &quot;Mengapa itch.io?&quot;"></a></h2>
<p>itch.io adalah tempat game indie berkembang. Hampir tidak ada pembatasan akses, sehingga siapa pun dapat menerbitkan game, dengan satu hal penting yang perlu diketahui sejak awal: sejak pertengahan 2025, itch.io memperketat penanganan konten dewasa/NSFW. Di bawah tekanan pemroses pembayarannya, itch.io menghapus konten dewasa dari indeks pada Juli 2025 dan kini mewajibkan halaman NSFW menambahkan peringatan konten agar dapat ditemukan lewat pencarian, sementara konten dewasa berbayar masih dibatasi. Bagi sebagian besar game nondewasa, semua ini tidak berlaku dan penerbitan tetap seterbuka sebelumnya. Penetapan harganya fleksibel: gratis, harga tetap, atau bayar sesuka hati. Anda menentukan sendiri bagi hasilnya, bahkan 0% jika ingin menyimpan seluruh pendapatan. Game web berjalan langsung di browser. Komunitasnya aktif mencari game indie. Selain itu, ekosistem game jam memberikan visibilitas dan umpan balik bawaan.</p>
<p>itch.io bukan Steam, dan memang itulah intinya. itch.io menghargai eksperimen serta developer yang berinteraksi dengan komunitas.</p>
<h2 id="sebelum-menerbitkan" tabindex="-1">Sebelum Menerbitkan <a class="header-anchor" href="#sebelum-menerbitkan" aria-label="Permalink to &quot;Sebelum Menerbitkan&quot;"></a></h2>
<p>Ada beberapa hal yang perlu disiapkan sebelum Anda menekan tombol terbitkan. Setidaknya, Anda memerlukan game yang dapat dimainkan (dapat diunduh atau dimainkan di browser), gambar sampul berukuran 630×500 piksel, minimal 3 tangkapan layar, deskripsi, serta genre/tag yang telah dipilih.</p>
<p>Untuk peluncuran yang lebih baik, tambahkan trailer atau GIF gameplay, deskripsi mendetail beserta fitur, press kit, akun media sosial, dan bila perlu server Discord.</p>
<p>Untuk hasil terbaik, rencanakan postingan devlog terlebih dahulu, siapkan daftar influencer dan media yang akan dihubungi, buat draf pengumuman peluncuran, dan bangun komunitas sebelum meluncurkan game.</p>
<h2 id="halaman-anda-adalah-etalase-anda" tabindex="-1">Halaman Anda Adalah Etalase Anda <a class="header-anchor" href="#halaman-anda-adalah-etalase-anda" aria-label="Permalink to &quot;Halaman Anda Adalah Etalase Anda&quot;"></a></h2>
<p>Halaman inilah tempat orang memutuskan apakah mereka akan memainkan game Anda. Setiap elemennya penting.</p>
<h3 id="gambar-sampul" tabindex="-1">Gambar Sampul <a class="header-anchor" href="#gambar-sampul" aria-label="Permalink to &quot;Gambar Sampul&quot;"></a></h3>
<p>Gambar sampul adalah visual terpenting Anda. Gambar ini muncul di halaman penelusuran, hasil pencarian, koleksi, dan sematan media sosial. Dengan ukuran 630×500 piksel (atau minimal 315×250), gambar tersebut harus tetap efektif saat ditampilkan sebagai gambar mini.</p>
<p>Pastikan gambar tetap mudah dibaca dalam ukuran kecil. Ujilah dalam skala gambar mini. Tampilkan nuansa game Anda melalui gaya visual, suasana, dan petunjuk genre. Sertakan judul dan pastikan mudah dibaca. Gunakan warna berani dan titik fokus yang jelas agar menonjol di antara kisi-kisi game lain.</p>
<h3 id="tangkapan-layar-dan-media" tabindex="-1">Tangkapan Layar dan Media <a class="header-anchor" href="#tangkapan-layar-dan-media" aria-label="Permalink to &quot;Tangkapan Layar dan Media&quot;"></a></h3>
<p>Anda memerlukan setidaknya 3-5 tangkapan layar agar terlihat meyakinkan. GIF yang menampilkan gameplay bergerak akan sangat membantu. Untuk peluncuran serius, tambahkan trailer berdurasi 30-90 detik.</p>
<p>Untuk tangkapan layar, tampilkan gameplay sebenarnya, bukan menu. Abadikan momen-momen seru. Gunakan rasio aspek yang konsisten. Sertakan UI jika tampilannya menarik.</p>
<p>Untuk GIF, targetkan aksi berdurasi 5-15 detik. Jaga ukurannya di bawah 10MB agar cepat dimuat. Tampilkan alur gameplay inti. Pastikan perulangannya mulus.</p>
<h3 id="deskripsi" tabindex="-1">Deskripsi <a class="header-anchor" href="#deskripsi" aria-label="Permalink to &quot;Deskripsi&quot;"></a></h3>
<p>Susun deskripsi untuk orang yang hanya membaca sekilas. Awali dengan kalimat singkat dan menarik yang memikat mereka. Lanjutkan dengan kalimat yang menjelaskan genre, apa yang dilakukan pemain, dan tujuannya. Tambahkan 2-3 kalimat yang mengembangkan konsep tersebut. Setelah itu, cantumkan fitur, kontrol, dan kredit.</p>
<p>Jangan menulis paragraf yang terlalu padat. Jangan memulai dengan &quot;Ini game pertama saya...&quot; atau bersikap terlalu merendah. Jangan lupa menjelaskan game tersebut sebenarnya tentang apa. Orang perlu memahami apa yang akan mereka mainkan.</p>
<h3 id="tag" tabindex="-1">Tag <a class="header-anchor" href="#tag" aria-label="Permalink to &quot;Tag&quot;"></a></h3>
<p>Tag menentukan tempat game Anda muncul di Telusuri. Gunakan semua tag yang relevan. Buat secara spesifik: jangan hanya &quot;action&quot;, tetapi &quot;top-down-shooter&quot;. Sertakan tag aksesibilitas jika berlaku. Tambahkan tag multiplayer atau local-coop jika relevan. Gunakan tag populer yang benar-benar sesuai dengan game Anda.</p>
<p>Tag bernilai tinggi yang patut dipertimbangkan: genre spesifik seperti roguelike, metroidvania, atau visual-novel. Gaya visual seperti pixel-art, low-poly, atau hand-drawn. Tema seperti horror, cozy, atau atmospheric. Mode multiplayer seperti local-multiplayer atau online-co-op. Fitur aksesibilitas seperti colorblind-friendly atau one-button.</p>
<h3 id="metadata" tabindex="-1">Metadata <a class="header-anchor" href="#metadata" aria-label="Permalink to &quot;Metadata&quot;"></a></h3>
<p>Isi semuanya. Genre, engine/peralatan yang digunakan, sebanyak mungkin tag relevan, semua bahasa yang didukung, fitur aksesibilitas seperti kontrol yang dapat dikonfigurasi, serta mode multiplayer (pemain tunggal, lokal, daring). Semakin lengkap metadata Anda, semakin mudah game Anda ditemukan.</p>
<h2 id="penetapan-harga" tabindex="-1">Penetapan Harga <a class="header-anchor" href="#penetapan-harga" aria-label="Permalink to &quot;Penetapan Harga&quot;"></a></h2>
<p>itch.io menyediakan tiga model harga: gratis, bayar sesuka hati, dan harga tetap. Masing-masing cocok untuk situasi yang berbeda.</p>
<p>itch.io menjalankan model bagi hasil terbuka: potongan bawaannya sekitar 10%, tetapi Anda dapat memilih persentasenya, mulai dari 0% hingga 100%. Beberapa kali dalam setahun, itch.io juga mengadakan Creator Day, acara 24 jam ketika biaya platform ditiadakan sepenuhnya sehingga Anda memperoleh 100% hasil penjualan (setelah biaya pemroses pembayaran dan pajak). Menyesuaikan waktu diskon atau pengumuman peluncuran dengan acara ini patut dipertimbangkan. Acara terakhir berlangsung pada 28 November 2025.</p>
<h3 id="bayar-sesuka-hati-paling-efektif-untuk-sebagian-besar-game" tabindex="-1">Bayar Sesuka Hati Paling Efektif untuk Sebagian Besar Game <a class="header-anchor" href="#bayar-sesuka-hati-paling-efektif-untuk-sebagian-besar-game" aria-label="Permalink to &quot;Bayar Sesuka Hati Paling Efektif untuk Sebagian Besar Game&quot;"></a></h3>
<p>PWYW dengan batas minimum $0 umumnya mengungguli harga tetap untuk game indie. Developer yang membagikan angka mereka dalam laporan pascapengembangan secara konsisten melaporkan jumlah unduhan beberapa kali lebih banyak dibandingkan harga tetap, dengan sekitar sepersepuluh hingga sepertiga pengunduh memilih untuk membayar. Total pendapatan sering kali tetap lebih tinggi meskipun rata-rata per pembelinya lebih rendah. Ini adalah pola dari berbagai laporan pascapengembangan yang dibagikan, bukan statistik resmi itch.io, jadi anggaplah sebagai panduan, bukan jaminan.</p>
<p>Untuk mengoptimalkan PWYW, tetapkan harga yang disarankan guna membentuk ekspektasi. Untuk game pendek di bawah 30 menit, sarankan $2-5. Untuk game berdurasi sedang sekitar 1-3 jam, sarankan $5-10. Untuk game lengkap berdurasi lebih dari 5 jam, sarankan $10-20.</p>
<p>Jelaskan manfaat dukungan tersebut. Misalnya, &quot;Game ini menggunakan sistem bayar sesuka hati! Dukungan apa pun membantu saya membuat lebih banyak game dan terus menghadirkan pembaruan.&quot; Tawarkan juga insentif untuk membayar: konten bonus, soundtrack, PDF di balik layar, atau nama di bagian kredit.</p>
<h3 id="kapan-harga-tetap-cocok-digunakan" tabindex="-1">Kapan Harga Tetap Cocok Digunakan <a class="header-anchor" href="#kapan-harga-tetap-cocok-digunakan" aria-label="Permalink to &quot;Kapan Harga Tetap Cocok Digunakan&quot;"></a></h3>
<p>Gunakan harga tetap jika Anda telah memiliki audiens, game tersebut sangat dipoles, kontennya cukup banyak (5+ jam), atau Anda memerlukan pendapatan yang dapat diprediksi.</p>
<p>Untuk tingkat harga, $2-5 cocok bagi game pendek dan prototipe. $5-10 untuk game berdurasi sedang dengan daya tarik khusus. $10-20 untuk game lengkap yang sangat dipoles. $20+ untuk game besar dari developer yang sudah mapan.</p>
<h3 id="game-gratis-tetap-menghasilkan-uang" tabindex="-1">Game Gratis Tetap Menghasilkan Uang <a class="header-anchor" href="#game-gratis-tetap-menghasilkan-uang" aria-label="Permalink to &quot;Game Gratis Tetap Menghasilkan Uang&quot;"></a></h3>
<p>Untuk karya portofolio, entri game jam, proyek eksperimental, atau membangun audiens bagi game berbayar mendatang, model gratis masuk akal. Namun, game gratis pun tetap mendapatkan donasi. itch.io pernah menyatakan bahwa sebagian berarti dari pengeluaran di platform berasal dari orang-orang yang membayar di atas harga minimum, jadi tetap buka opsi donasi.</p>
<h2 id="agar-game-ditemukan" tabindex="-1">Agar Game Ditemukan <a class="header-anchor" href="#agar-game-ditemukan" aria-label="Permalink to &quot;Agar Game Ditemukan&quot;"></a></h2>
<p>itch.io tidak memiliki promosi algoritmik seperti Steam. Anda sendirilah yang mendorong visibilitas game.</p>
<p>Penemuan berlangsung melalui pencarian (dipengaruhi tag, judul, dan deskripsi), Telusuri Populer (dipengaruhi unduhan, penilaian, dan kebaruan), Telusuri Terbaru (dipengaruhi tanggal penerbitan), koleksi (pemain menambahkan game Anda), devlog (pembaruan Anda), dan sesekali sorotan editorial (pilihan staf, sebagian besar bergantung pada keberuntungan).</p>
<h3 id="masuk-ke-indeks" tabindex="-1">Masuk ke Indeks <a class="header-anchor" href="#masuk-ke-indeks" aria-label="Permalink to &quot;Masuk ke Indeks&quot;"></a></h3>
<p>Game Anda harus masuk ke indeks agar muncul dalam pencarian dan penelusuran. Game harus diterbitkan secara publik (bukan tidak tercantum), memiliki konten yang dapat dimainkan atau diunduh, memiliki gambar sampul, bukan sekadar halaman pengganti, dan mematuhi panduan konten.</p>
<p>Hal-hal yang mencegah pengindeksan: halaman yang hanya berisi tautan eksternal, tidak ada unduhan atau konten yang dapat dimainkan, pengaturan visibilitas tidak tercantum, serta gambar sampul yang tidak tersedia. Jika game Anda diberi tag dewasa/NSFW, ada langkah tambahan: sejak 2025, itch.io mewajibkan halaman tersebut menambahkan peringatan konten agar dapat diindeks, dan konten dewasa berbayar saat ini tidak disertakan dalam pencarian selama itch.io bekerja sama dengan pemroses pembayaran. Game nondewasa tidak terpengaruh.</p>
<p>Satu hal lagi jika Anda baru pertama kali berjualan: akun penjual baru akan melalui antrean peninjauan singkat sebelum proyek berbayar pertamanya diindeks, biasanya selama beberapa hari kerja. Penjual yang sudah mapan tidak melalui proses ini. Jika tanggal peluncuran penting, terbitkan atau siapkan akun penjual Anda cukup awal agar sempat melewati antrean.</p>
<h3 id="dorongan-paling-baru" tabindex="-1">Dorongan &quot;Paling Baru&quot; <a class="header-anchor" href="#dorongan-paling-baru" aria-label="Permalink to &quot;Dorongan &quot;Paling Baru&quot;&quot;"></a></h3>
<p>Saat pertama kali menerbitkan game, Anda akan muncul di &quot;Paling Baru&quot;, yang memberikan sedikit dorongan visibilitas. Ini hanya terjadi sekali, jadi waktunya penting.</p>
<p>Terbitkan ketika halaman Anda sudah lengkap. Jangan menerbitkannya terlalu awal lalu memperbaruinya karena Anda hanya mendapatkan satu kali dorongan sebagai game &quot;baru&quot;. Hindari akhir pekan ketika lebih banyak game dirilis. Pertimbangkan zona waktu audiens target Anda.</p>
<h3 id="devlog-adalah-senjata-rahasia-anda" tabindex="-1">Devlog Adalah Senjata Rahasia Anda <a class="header-anchor" href="#devlog-adalah-senjata-rahasia-anda" aria-label="Permalink to &quot;Devlog Adalah Senjata Rahasia Anda&quot;"></a></h3>
<p>Devlog muncul di feed pengikut, tampil di bagian &quot;Devlog Terbaru&quot;, menandakan pengembangan yang aktif, membangun kepercayaan komunitas, dan membantu SEO.</p>
<p>Buat postingan selama pengembangan untuk membangun antusiasme. Buat postingan saat peluncuran sebagai pengumuman. Buat postingan setelah peluncuran untuk pembaruan dan fitur baru. Targetkan 1-2 postingan per bulan selama pengembangan aktif.</p>
<p>Topik yang baik mencakup proses di balik layar, fitur dan konten baru, tanggapan terhadap umpan balik pemain, tantangan teknis yang berhasil Anda selesaikan, pameran visual dan musik, serta pencapaian penjualan (ucapkan terima kasih kepada pemain Anda).</p>
<h2 id="game-jam" tabindex="-1">Game Jam <a class="header-anchor" href="#game-jam" aria-label="Permalink to &quot;Game Jam&quot;"></a></h2>
<p>Game jam adalah cara terbaik untuk mendapatkan visibilitas di itch.io. Anda memperoleh audiens bawaan dengan ribuan penayangan dalam hitungan hari, galeri khusus tempat game dapat ditelusuri, umpan balik melalui penilaian dan komentar, kesempatan berjejaring dengan developer lain, karya portofolio yang menunjukkan kemampuan Anda, serta ruang berisiko rendah untuk membuat prototipe secara bebas.</p>
<h3 id="strategi-game-jam" tabindex="-1">Strategi Game Jam <a class="header-anchor" href="#strategi-game-jam" aria-label="Permalink to &quot;Strategi Game Jam&quot;"></a></h3>
<p>Saat memilih jam, acara besar seperti Ludum Dare dan GMTK mendatangkan lebih banyak trafik, tetapi juga lebih banyak persaingan. Jam kecil atau khusus memberi Anda peluang lebih baik untuk menonjol. Jam dengan tema yang sesuai memungkinkan Anda memaksimalkan keunggulan Anda.</p>
<p>Selama jam berlangsung, bagikan perkembangan di media sosial, gunakan tagar jam, dokumentasikan proses Anda, dan berinteraksilah dengan peserta lain.</p>
<p>Untuk halaman jam Anda, poles tampilannya meskipun hanya untuk game jam. Tangkapan layar yang bagus tetap penting. Tulis deskripsi yang menjelaskan game secara jelas. Sertakan kontrol.</p>
<p>Setelah jam berakhir, mainkan dan beri penilaian pada entri lain untuk berjejaring. Tanggapi semua umpan balik. Pertimbangkan pembaruan pascajam. Tulis devlog tentang hal yang Anda pelajari.</p>
<p>Jika Anda mengadakan jam sendiri, editor tema jam mendapat peningkatan besar pada Juli 2026: Google Fonts, warna tombol dan tautan yang dapat diatur secara terpisah, kontrol radius sudut dan gambar latar, serta tema yang dapat disalin antargame jam sebagai JSON. Kini, halaman jam yang Anda selenggarakan dapat terlihat sepolished halaman game.</p>
<h3 id="game-jam-dapat-menjadi-game-sungguhan" tabindex="-1">Game Jam Dapat Menjadi Game Sungguhan <a class="header-anchor" href="#game-jam-dapat-menjadi-game-sungguhan" aria-label="Permalink to &quot;Game Jam Dapat Menjadi Game Sungguhan&quot;"></a></h3>
<p>Banyak game indie sukses bermula sebagai entri jam. Celeste dimulai sebagai game jam. Superhot berawal sebagai prototipe 7 hari. Hollow Knight berkembang dari konsep jam.</p>
<p>Jalurnya adalah: kumpulkan umpan balik, kenali hal yang berhasil, poles dan perluas, lalu rilis ulang sebagai game mandiri.</p>
<h2 id="pemasaran-tanpa-modal" tabindex="-1">Pemasaran Tanpa Modal <a class="header-anchor" href="#pemasaran-tanpa-modal" aria-label="Permalink to &quot;Pemasaran Tanpa Modal&quot;"></a></h2>
<p>Anda tidak memerlukan anggaran untuk memasarkan game di itch.io. Anda memerlukan konsistensi.</p>
<h3 id="media-sosial" tabindex="-1">Media Sosial <a class="header-anchor" href="#media-sosial" aria-label="Permalink to &quot;Media Sosial&quot;"></a></h3>
<p>Gunakan Twitter/X untuk menjangkau komunitas gamedev terbesar. Gunakan Reddit, khususnya r/indiegaming, r/playmygame, dan subreddit yang sesuai dengan genre. Cobalah TikTok untuk klip gameplay pendek. Bangun server Discord dan bergabunglah dengan komunitas yang relevan. Unggah devlog dan trailer di YouTube.</p>
<p>Untuk kalender konten, buat postingan mingguan untuk Screenshot Saturday dan pembaruan perkembangan. Unggah devlog setiap dua minggu. Umumkan pencapaian yang lebih besar setiap bulan.</p>
<p>Bagikan GIF gameplay, proses di balik layar, tantangan pengembangan, perbandingan sebelum/sesudah, meme tentang game Anda, dan reaksi pemain.</p>
<h3 id="menghubungi-influencer" tabindex="-1">Menghubungi Influencer <a class="header-anchor" href="#menghubungi-influencer" aria-label="Permalink to &quot;Menghubungi Influencer&quot;"></a></h3>
<p>Mikroinfluencer dengan 1K-50K pengikut adalah teman Anda. Temukan mereka dengan mencari &quot;[genre Anda] game indie&quot; di YouTube, mencari streamer yang memainkan game serupa, dan memeriksa siapa yang meliput game seperti milik Anda.</p>
<p>Saat menghubungi mereka, sesuaikan setiap surel secara pribadi. Tunjukkan bahwa Anda mengenal konten mereka. Permudah dengan menyertakan semua tautan. Sampaikan secara singkat. Jangan mengirim surel massal, jangan menuntut liputan, dan jangan mendesak soal waktu. Lakukan tindak lanjut satu kali dengan sopan.</p>
<p>Templat sederhana sudah cukup: perkenalkan diri Anda, sebutkan bahwa Anda melihat mereka meliput genre Anda, jelaskan game Anda dalam satu kalimat, terangkan apa yang membuatnya unik, tawarkan key gratis tanpa tekanan, lalu sertakan tautan ke halaman dan press kit Anda.</p>
<h3 id="media" tabindex="-1">Media <a class="header-anchor" href="#media" aria-label="Permalink to &quot;Media&quot;"></a></h3>
<p>Untuk peluncuran yang lebih besar, hubungi media game indie seperti IndieGamesPlus, Rock Paper Shotgun, rubrik indie Kotaku, dan situs khusus genre. Prinsipnya sama seperti menghubungi influencer: sesuaikan secara pribadi, sampaikan dengan singkat, dan permudah pekerjaan mereka.</p>
<h2 id="linimasa-peluncuran" tabindex="-1">Linimasa Peluncuran <a class="header-anchor" href="#linimasa-peluncuran" aria-label="Permalink to &quot;Linimasa Peluncuran&quot;"></a></h2>
<p>Tiga hingga enam bulan sebelum peluncuran, mulai bangun kehadiran di media sosial, bergabunglah dengan komunitas yang relevan, mulailah memposting devlog, dan bangun basis pengikut.</p>
<p>Satu hingga dua bulan sebelumnya, selesaikan aset halaman seperti tangkapan layar dan trailer, siapkan press kit, buat draf daftar influencer dan media, lalu umumkan tanggal rilis.</p>
<p>Satu hingga dua minggu sebelumnya, kirim key kepada influencer dan media, jadwalkan postingan peluncuran, siapkan devlog peluncuran, dan berikan sentuhan akhir pada halaman Anda.</p>
<p>Pada hari peluncuran, terbitkan game, bagikan pengumuman peluncuran di semua kanal, tanggapi semua komentar, pantau bug, dan ucapkan terima kasih kepada pemain awal.</p>
<p>Selama minggu pertama setelah peluncuran, tanggapi semua umpan balik, segera perbaiki bug kritis, unggah devlog pembaruan, dan bagikan ulasan positif.</p>
<p>Setelah peluncuran, terus rilis pembaruan rutin, berinteraksilah dengan komunitas, rencanakan konten mendatang, serta pertimbangkan diskon dan bundel.</p>
<h2 id="kesalahan-umum" tabindex="-1">Kesalahan Umum <a class="header-anchor" href="#kesalahan-umum" aria-label="Permalink to &quot;Kesalahan Umum&quot;"></a></h2>
<p>Untuk kesalahan halaman, jangan terbitkan sebelum halaman Anda siap. Jangan melewatkan gambar sampul atau menggunakan gambar yang buruk. Jangan menulis deskripsi berupa blok teks panjang. Jangan meluncurkan game tanpa tangkapan layar. Jangan menggunakan tag yang salah atau tidak lengkap.</p>
<p>Untuk kesalahan pemasaran, jangan menunggu hingga peluncuran untuk mulai memasarkan. Jangan hanya sekali memposting &quot;game sudah dirilis&quot;. Berinteraksilah dengan komunitas. Jangan mengharapkan itch.io melakukan pemasaran untuk Anda. Jangan abaikan umpan balik.</p>
<p>Untuk kesalahan harga, jangan menetapkan harga tinggi tanpa audiens yang sudah terbentuk. Jangan meremehkan nilai karya Anda dengan harga $0.99 untuk konten berdurasi 10+ jam. Selalu tetapkan harga yang disarankan pada PWYW. Adakan diskon sesekali.
Untuk kesalahan pengembangan, jangan biarkan perluasan cakupan menunda peluncuran Anda selamanya. Jangan menunggu semuanya &quot;sempurna&quot; alih-alih merilisnya. Kumpulkan masukan sejak awal. Jangan meninggalkan game setelah diluncurkan.</p>
<h2 id="analitik" tabindex="-1">Analitik <a class="header-anchor" href="#analitik" aria-label="Permalink to &quot;Analitik&quot;"></a></h2>
<p>Pantau tampilan halaman (berapa banyak orang yang menemukan halaman Anda), unduhan (berapa banyak orang yang mencoba game Anda), tingkat konversi (tampilan menjadi unduhan), jumlah penilaian (tingkat keterlibatan), rata-rata penilaian (persepsi kualitas), pendapatan, dan perujuk (dari mana asal lalu lintas).</p>
<h3 id="mendiagnosis-masalah" tabindex="-1">Mendiagnosis Masalah <a class="header-anchor" href="#mendiagnosis-masalah" aria-label="Permalink to &quot;Mendiagnosis Masalah&quot;"></a></h3>
<p>Jika tampilan Anda rendah, itu masalah pemasaran. Posting lebih banyak di media sosial, coba komunitas baru, gunakan tagar yang lebih baik, dan tulis lebih banyak devlog.</p>
<p>Jika tampilan Anda tinggi tetapi unduhan rendah, itu masalah halaman. Tingkatkan kualitas gambar sampul, gunakan tangkapan layar yang lebih baik, tulis deskripsi yang lebih jelas, dan periksa harga Anda.</p>
<p>Jika unduhan Anda tinggi tetapi penilaian rendah, itu masalah kualitas game. Perbaiki bug, tingkatkan tutorial dan proses orientasi pemain, serta tangani keluhan yang umum.</p>
<h2 id="pertumbuhan-jangka-panjang" tabindex="-1">Pertumbuhan Jangka Panjang <a class="header-anchor" href="#pertumbuhan-jangka-panjang" aria-label="Permalink to &quot;Pertumbuhan Jangka Panjang&quot;"></a></h2>
<h3 id="membangun-audiens" tabindex="-1">Membangun Audiens <a class="header-anchor" href="#membangun-audiens" aria-label="Permalink to &quot;Membangun Audiens&quot;"></a></h3>
<p>Pengikut itch.io sangat berharga. Mereka mendapatkan notifikasi tentang rilis baru, melihat devlog Anda, dan kemungkinan besar akan membeli game Anda di masa mendatang.</p>
<p>Tambah pengikut dengan mengajak pemain mengikuti Anda di akhir game, menyebutkannya dalam devlog, menautkannya dari media sosial, dan mengutamakan kualitas daripada kuantitas.</p>
<p>Jika Anda menjalankan Patreon, integrasi Patreon itch.io dibangun ulang pada Juli 2026 menggunakan API Patreon yang lebih baru. Akses ke game Anda kini diberikan berdasarkan tingkat keanggotaan, bukan jumlah donasi, sehingga mengatasi masalah ketidakcocokan mata uang yang lama. Ini merupakan cara praktis untuk memberikan build awal kepada pendukung secara langsung melalui itch.io.</p>
<h3 id="katalog-anda-menghasilkan-pertumbuhan-berlipat" tabindex="-1">Katalog Anda Menghasilkan Pertumbuhan Berlipat <a class="header-anchor" href="#katalog-anda-menghasilkan-pertumbuhan-berlipat" aria-label="Permalink to &quot;Katalog Anda Menghasilkan Pertumbuhan Berlipat&quot;"></a></h3>
<p>Game kedua Anda lebih mudah diluncurkan daripada game pertama. Anda sudah memiliki pengikut, dapat melakukan promosi silang antar-game, telah membangun reputasi, dan sudah memperoleh berbagai keterampilan.</p>
<p>Strateginya adalah: luncurkan game pertama dan kumpulkan pengikut, promosikan game kedua kepada pemain game pertama, bundel game-game tersebut, dan biarkan setiap game memperbesar audiens Anda.</p>
<h3 id="diskon-dan-bundel" tabindex="-1">Diskon dan Bundel <a class="header-anchor" href="#diskon-dan-bundel" aria-label="Permalink to &quot;Diskon dan Bundel&quot;"></a></h3>
<p>Untuk mengadakan diskon, potongan sebesar 20–50% umum digunakan. Jadwalkan bertepatan dengan hari libur. Umumkan di media sosial. Perbarui devlog Anda.</p>
<p>Program diskon musiman di seluruh situs juga layak diikuti. Sejak Summer Sale 2026, itch.io menyediakan Sale Explorer yang memungkinkan pemain menjelajahi game yang sedang didiskon menggunakan filter harga, pengecualian tag, pilihan staf, dan rekomendasi yang dipersonalisasi. Artinya, mengikuti program diskon benar-benar membantu game Anda ditemukan saat pemain menjelajah. Anda dapat bergabung dengan satu klik: dasbor kreator menyediakan tautan yang sudah diisi untuk menambahkan promosi selama program diskon seluruh situs berlangsung.</p>
<p>Mengikuti bundel dapat meningkatkan eksposur, mendatangkan pemain baru, dan sangat cocok untuk game lama. itch.io terkadang mengadakan bundel amal yang layak diikuti. Fitur penyelenggaraan bundel mengalami pembaruan besar pada Juli 2026: penyelenggara dapat mengimpor banyak game sekaligus dari URL jam atau koleksi serta mengurutkan ulang proyek dengan seret dan lepas, sehingga bundel komunitas kini lebih mudah diselenggarakan daripada sebelumnya.</p>
<h2 id="game-web-di-itch-io" tabindex="-1">Game Web di itch.io <a class="header-anchor" href="#game-web-di-itch-io" aria-label="Permalink to &quot;Game Web di itch.io&quot;"></a></h2>
<p>Game HTML5 dan WebGL memiliki keunggulan di itch.io. Game dapat langsung dimainkan tanpa hambatan unduhan. Ramah perangkat seluler jika mendukung kontrol sentuh. Mudah dibagikan melalui tautan langsung. Sangat cocok untuk jam karena dapat dicoba dengan cepat.</p>
<p>Untuk pengoptimalan, waktu pemuatan itu penting, jadi usahakan muatan awal tetap kecil. Tampilkan bilah pemuatan atau persentase. Uji di Chrome, Firefox, Safari, dan Edge. Tambahkan dukungan sentuh jika memungkinkan. Sediakan tombol layar penuh.</p>
<p>Untuk pengaturan sematan, gunakan lebar 960px (atau ukuran asli game Anda) dan tinggi 540px untuk rasio 16:9. Aktifkan opsi ramah perangkat seluler jika game responsif. Aktifkan tombol layar penuh. Nonaktifkan bilah gulir.</p>
<p>Ketahui batas unggahan sebelum membuat build. Berkas zip HTML5 Anda setelah diekstrak tidak boleh berisi lebih dari 1.000 berkas, berukuran total lebih dari 500MB, atau memiliki satu berkas berukuran lebih dari 200MB. Jika build Anda jauh melampaui batas tersebut, pangkas aset atau muat konten berat secara tunda alih-alih meminta peningkatan batas.</p>
<p>Untuk performa, muat aset secara tunda, kompres tekstur, perkecil ukuran bundel JavaScript, gunakan WebGL secara efisien, dan uji pada perangkat kelas bawah.</p>
<h2 id="sumber-daya" tabindex="-1">Sumber Daya <a class="header-anchor" href="#sumber-daya" aria-label="Permalink to &quot;Sumber Daya&quot;"></a></h2>
<p>Untuk dokumentasi resmi, baca <a href="https://itch.io/docs/creators/" target="_blank" rel="noreferrer">Dokumentasi Kreator itch.io</a>, <a href="https://itch.io/docs/creators/getting-indexed" target="_blank" rel="noreferrer">panduan Agar Terindeks</a>, dan <a href="https://itch.io/docs/creators/pricing" target="_blank" rel="noreferrer">Panduan Penetapan Harga</a>.</p>
<p>Untuk komunitas, kunjungi <a href="https://itch.io/community" target="_blank" rel="noreferrer">Forum Komunitas itch.io</a>, <a href="https://reddit.com/r/itchio" target="_blank" rel="noreferrer">r/itchio</a>, <a href="https://reddit.com/r/indiegaming" target="_blank" rel="noreferrer">r/indiegaming</a>, dan <a href="https://reddit.com/r/IndieDev" target="_blank" rel="noreferrer">r/IndieDev</a>.</p>
<p>Untuk alat bantu, <a href="https://itch.io/docs/butler/" target="_blank" rel="noreferrer">itch.io Butler</a> menangani unggahan menggunakan perbedaan berbasis patch, sehingga pembaruan hanya mentransfer bagian yang berubah. Sejak Mei 2026, Anda bahkan tidak memerlukan baris perintah: aplikasi itch (versi 26.12.0 atau yang lebih baru) memiliki bagian Upload yang membungkus butler dalam GUI, lengkap dengan pratinjau berkas yang berubah sebelum setiap push. <a href="https://dopresskit.com/" target="_blank" rel="noreferrer">Presskit()</a> menghasilkan kit pers.</p>
<h2 id="versi-singkat" tabindex="-1">Versi Singkat <a class="header-anchor" href="#versi-singkat" aria-label="Permalink to &quot;Versi Singkat&quot;"></a></h2>
<p>Sebelum peluncuran, pastikan game Anda dapat dimainkan dan sudah cukup dipoles, halaman Anda memiliki gambar sampul yang menarik, Anda memiliki setidaknya 3 tangkapan layar dan idealnya sebuah GIF atau trailer, deskripsi Anda jelas dan mudah dipindai, semua tag yang relevan sudah dipilih, harga sudah ditentukan, kehadiran Anda di media sosial sudah dimulai, dan Anda telah memposting devlog.</p>
<p>Saat peluncuran, halaman Anda harus 100% lengkap, dipublikasikan secara terbuka, diumumkan di semua kanal, dan Anda harus aktif menanggapi komentar.</p>
<p>Setelah peluncuran, tanggapi masukan, perbaiki bug dengan cepat, terus posting devlog, dan mulai membangun rilis berikutnya.</p>
<p>Sebagian besar game indie yang sukses membutuhkan waktu bertahun-tahun dan beberapa kali rilis untuk menemukan audiensnya. Game pertama Anda mungkin tidak akan langsung sukses, dan itu tidak masalah. Setiap rilis memberi Anda pelajaran, memperbesar audiens, dan membawa Anda lebih dekat ke game yang akhirnya meraih kesuksesan besar.</p>
<p>Rilis. Pelajari. Ulangi.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="bagaimana-cara-membuat-game-saya-dikenal-di-itch-io" tabindex="-1">Bagaimana cara membuat game saya dikenal di itch.io? <a class="header-anchor" href="#bagaimana-cara-membuat-game-saya-dikenal-di-itch-io" aria-label="Permalink to &quot;Bagaimana cara membuat game saya dikenal di itch.io?&quot;"></a></h3>
<p>Tag adalah sarana paling berpengaruh yang diabaikan kebanyakan orang. Halaman penjelajahan itch.io disusun berdasarkan tag, dan begitulah sebagian besar pemain menemukan karya baru. Pilih semua tag yang relevan, bukan hanya yang paling jelas. Setelah itu, manfaatkan devlog. Setiap postingan devlog mendorong game Anda naik di linimasa dan menyediakan lebih banyak konten untuk diindeks oleh mesin pencari. Ikuti juga game jam karena itulah cara tercepat untuk menarik perhatian saat Anda memulai dari nol. Pastikan gambar sampul Anda efektif. Itulah hal pertama yang dilihat orang saat menggulir, dan kebanyakan dari mereka memutuskan dalam waktu kurang dari sedetik apakah akan mengekliknya.</p>
<h3 id="bisakah-anda-menghasilkan-uang-di-itch-io" tabindex="-1">Bisakah Anda menghasilkan uang di itch.io? <a class="header-anchor" href="#bisakah-anda-menghasilkan-uang-di-itch-io" aria-label="Permalink to &quot;Bisakah Anda menghasilkan uang di itch.io?&quot;"></a></h3>
<p>Bisa, tetapi sesuaikan ekspektasi Anda. itch.io secara default menggunakan model &quot;bayar sesuka Anda&quot;, dan platform ini memungkinkan Anda menyimpan hingga 100% pendapatan (Anda menentukan jumlah yang ingin dibagikan). Beberapa pengembang meraih hasil yang baik dengan game premium seharga $5–15, terutama setelah membangun audiens melalui rilis gratis dan entri jam. Platform ini tidak akan membuat Anda kaya dalam semalam, tetapi itch.io adalah salah satu dari sedikit tempat yang memberi Anda kendali penuh atas harga dan pembayaran, nyaris tanpa pembatasan akses.</p>
<h3 id="apakah-itch-io-cocok-untuk-game-browser" tabindex="-1">Apakah itch.io cocok untuk game browser? <a class="header-anchor" href="#apakah-itch-io-cocok-untuk-game-browser" aria-label="Permalink to &quot;Apakah itch.io cocok untuk game browser?&quot;"></a></h3>
<p>Sejujurnya, itch.io adalah salah satu tempat terbaik untuk game browser. Game browser lebih sering dimainkan di itch.io karena tidak ada hambatan unduhan. Pemain mengeklik dan langsung bermain. Platform ini mendukung sematan HTML5/WebGL secara native, sehingga game Anda langsung muncul di halaman. Khususnya untuk game jam, game browser mendapatkan jauh lebih banyak penilaian daripada game yang harus diunduh karena juri dapat langsung mencobanya. Jaga muatan awal di bawah beberapa MB dan tampilkan bilah progres, maka Anda akan mempertahankan lebih banyak pemain daripada yang mungkin Anda perkirakan.</p>
<hr>
<BuildCta
  title="Butuh sesuatu untuk diluncurkan?"
  desc="Buat game web dan ekspor sebagai build HTML5 mandiri untuk itch.io."
  prompt="Buat game endless runner yang dipoles dan dapat saya ekspor serta publikasikan di itch.io" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/game-jams-hackathons.html">Game Jam &amp; Hackathon</a> — jam adalah cara tercepat untuk membangun audiens di itch.io</li>
<li><a href="/id/tutorials/iframe-embedding-games.html">Menyematkan game dengan iframe</a> — panduan teknis untuk menyematkan game browser dalam iframe</li>
<li><a href="/id/tutorials/ship-web-game-fast.html">Rilis game web yang dimuat dengan cepat</a> — optimalkan waktu pemuatan untuk sematan itch.io</li>
<li><a href="/id/guides/steam-next-fest-strategy.html">Strategi Steam Next Fest</a> — jika Anda mempertimbangkan peluncuran lintas platform</li>
<li><a href="/id/guides/web-game-monetization.html">Monetisasi Game Web: Apa yang Sebenarnya Dikatakan Data</a> — data pendapatan yang jujur dari itch.io dan berbagai portal</li>
<li><a href="/id/guides/publish-game-poki.html">Cara Memasukkan Game Anda ke Poki</a> — jalur portal terkurasi, dibandingkan dengan pendekatan terbuka itch.io</li>
<li><a href="/id/guides/publish-game-crazygames.html">Cara Menerbitkan Game Anda di CrazyGames</a> — portal terkurasi besar lainnya untuk menjangkau audiens di luar itch.io</li>
<li><a href="/id/guides/publish-game-discord-activities.html">Cara Menerbitkan Game di Discord Activities</a> — merilis build web yang sama ke Discord</li>
<li><a href="/id/guides/web-game-engines-comparison.html">Perbandingan Engine Game Web</a> — memilih engine yang dapat mengekspor build web dengan baik</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/itch-io-launch-guide.jpg?v=4" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Three.js + USDC di Browser]]></title>
            <link>https://app.cinevva.com/id/guides/threejs-usdc-tech-report</link>
            <guid>https://app.cinevva.com/id/guides/threejs-usdc-tech-report</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Cara memuat file biner USD di Three.js tanpa WASM atau kode native]]></description>
            <content:encoded><![CDATA[<h1 id="three-js-usdc-di-browser" tabindex="-1">Three.js + USDC di Browser <a class="header-anchor" href="#three-js-usdc-di-browser" aria-label="Permalink to &quot;Three.js + USDC di Browser&quot;"></a></h1>
<p>Jadi, Anda memiliki file <code>.usdc</code> dari Maya atau Houdini dan ingin menampilkannya dalam scene Three.js. Saya pernah mengalaminya. Sampai baru-baru ini, pilihan yang tersedia kurang ideal. Anda bisa mengonversinya ke glTF secara offline, menyiapkan build WASM dari OpenUSD, atau menyerah dan menggunakan format lain.</p>
<p>Panduan ini menunjukkan cara mengurai USDC secara langsung di JavaScript menggunakan <code>@cinevva/usdjs</code>, serta cara memasukkan data tersebut ke Three.js.</p>
<h2 id="apa-itu-usdc" tabindex="-1">Apa Itu USDC? <a class="header-anchor" href="#apa-itu-usdc" aria-label="Permalink to &quot;Apa Itu USDC?&quot;"></a></h2>
<p>File USD hadir dalam tiga jenis. USDA adalah versi teks yang mudah dibaca manusia dan mudah di-debug, tetapi panjang. USDC (terkadang disebut &quot;Crate&quot;) adalah format biner yang benar-benar digunakan oleh pipeline produksi karena ringkas dan cepat dimuat dalam alat native. USDZ adalah arsip zip yang berisi USDC beserta tekstur, yang digunakan Apple untuk AR Quick Look.</p>
<p>Masalahnya: USDC adalah format biner proprieter. Pixar menulis implementasi referensinya dalam C++, dan hingga kini belum ada cara berbasis JavaScript murni untuk membacanya. Hal itu mulai berubah: pada Desember 2025, Alliance for OpenUSD menerbitkan Core Specification 1.0, standar pertama yang diratifikasi untuk mendokumentasikan cara data scene OpenUSD disusun, dikomposisikan, dan dipertukarkan, sementara revisi 1.1 sudah dalam proses pengerjaan. Namun, implementasi referensinya masih berada dalam basis kode C++ milik Pixar, sehingga pembaca terpisah tetap menjadi cara praktis untuk mengakses format tersebut dari JavaScript.</p>
<h2 id="mengapa-ini-mungkin-penting-bagi-anda" tabindex="-1">Mengapa Ini Mungkin Penting bagi Anda <a class="header-anchor" href="#mengapa-ini-mungkin-penting-bagi-anda" aria-label="Permalink to &quot;Mengapa Ini Mungkin Penting bagi Anda&quot;"></a></h2>
<p>Jika Anda membuat aplikasi web 3D yang perlu bekerja dengan konten dari pipeline film atau VFX, Anda akan berhadapan dengan USD. Seniman mengekspor dari Maya, Houdini, atau Blender, dan hasil ekspor tersebut sering kali berupa USDC.</p>
<p>Sebelum <code>@cinevva/usdjs</code>, Anda memiliki tiga pilihan. Anda bisa menjalankan <code>usdcat</code> untuk mengonversi USDC ke format teks, yang menambahkan satu langkah build dan menghilangkan keringkasan format binernya. Anda bisa mengompilasi OpenUSD atau TinyUSDZ ke WebAssembly, yang menambahkan beberapa megabita ke bundle dan memerlukan header server khusus untuk threading. Atau Anda bisa menggunakan USDLoader bawaan Three.js, yang menangani USDZ tetapi memiliki dukungan USDC terbatas dan komposisi minimal.</p>
<p>Sekarang ada pilihan keempat: mengurai USDC secara native di JavaScript.</p>
<h2 id="cara-kerjanya" tabindex="-1">Cara Kerjanya <a class="header-anchor" href="#cara-kerjanya" aria-label="Permalink to &quot;Cara Kerjanya&quot;"></a></h2>
<p>Library <code>@cinevva/usdjs</code> mengimplementasikan ulang fungsionalitas inti USD dalam TypeScript. Saya membuat parser USDC dengan membaca kode sumber C++ milik Pixar dan menerjemahkan spesifikasi format Crate ke JavaScript. Jika terdapat ambiguitas dalam perilakunya, kami mengikuti cara kerja OpenUSD.</p>
<p>Dalam praktiknya, penggunaannya terlihat seperti ini:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { parseUsdcToLayer } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> '@cinevva/usdjs'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Fetch the USDC file</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> response</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> await</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fetch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'/model.usdc'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> buffer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> response.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">arrayBuffer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Parse it</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> layer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> parseUsdcToLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(buffer, { identifier: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'model.usdc'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> });</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Now you have a structured layer with prims, properties, and metadata</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(layer.pseudoRoot.children);</span></span></code></pre>
</div><p>Tanpa WASM. Tanpa kode native. Hanya JavaScript yang membaca byte dan membangun representasi terstruktur.</p>
<h2 id="menghubungkannya-ke-three-js" tabindex="-1">Menghubungkannya ke Three.js <a class="header-anchor" href="#menghubungkannya-ke-three-js" aria-label="Permalink to &quot;Menghubungkannya ke Three.js&quot;"></a></h2>
<p>Mengurai USD hanyalah separuh dari persoalan. Anda juga perlu mengonversi konsep USD (prim, transformasi, dan skema mesh) menjadi objek Three.js.</p>
<p>Berikut contoh minimal yang memuat file USDC dan membuat mesh Three.js:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> *</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> as</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> THREE </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'three'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { UsdStage, parseUsdcToLayer } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> '@cinevva/usdjs'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">async</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> loadUsdcToThree</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">url</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">scene</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> THREE</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">Scene</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // 1. Fetch and parse</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> buffer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> await</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fetch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(url).</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">then</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">r</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> r.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">arrayBuffer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">());</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> layer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> parseUsdcToLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(buffer, { identifier: url });</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // 2. Create a stage (handles composition if there are references)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> stage</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> UsdStage.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">open</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(layer);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // 3. Walk the prim tree</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  for</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> prim</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> of</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> stage.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">traverse</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()) {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // Skip non-geometry</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (prim.typeName </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">!==</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'Mesh'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">continue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // Get geometry data</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> points</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> prim.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getAttribute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'points'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)?.value;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> faceVertexIndices</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> prim.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getAttribute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'faceVertexIndices'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)?.value;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> faceVertexCounts</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> prim.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getAttribute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'faceVertexCounts'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)?.value;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">!</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">points </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">||</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> !</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">faceVertexIndices </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">||</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> !</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">faceVertexCounts) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">continue</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // Convert to Three.js geometry</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> geometry</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> THREE</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">BufferGeometry</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    geometry.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setAttribute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'position'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> THREE</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">Float32BufferAttribute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(points.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">flat</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(), </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    );</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // USD uses faceVertexCounts + faceVertexIndices, Three.js wants a flat index array</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // For triangulated meshes, this is straightforward:</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    geometry.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setIndex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(Array.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">from</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(faceVertexIndices));</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    geometry.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">computeVertexNormals</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // Create mesh</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> material</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> THREE</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">MeshStandardMaterial</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({ color: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0x888888</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> });</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> mesh</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> THREE</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">Mesh</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(geometry, material);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // Apply transform</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> xform</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> getWorldTransform</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(prim);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    mesh.matrix.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">fromArray</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(xform);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    mesh.matrixAutoUpdate </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    </span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    scene.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">add</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(mesh);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> getWorldTransform</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">prim</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[] {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Simplified: in practice you'd compose parent transforms</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> xformOp</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> prim.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getAttribute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'xformOp:transform'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (xformOp?.value) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> xformOp.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">flat</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">];</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Contoh ini disederhanakan. Kode nyata perlu menangani penumpukan transformasi (prim USD dapat memiliki beberapa atribut <code>xformOp</code> yang dikomposisikan bersama), subdivision surface (mesh dengan subdivisi <code>catmullClark</code> memerlukan proses subdivisi yang sebenarnya), material (parameter <code>UsdPreviewSurface</code> dipetakan ke <code>MeshStandardMaterial</code> milik Three.js), tekstur (path aset perlu di-resolve dan dimuat), serta animasi skeletal (binding <code>UsdSkel</code> perlu dikonversi menjadi <code>SkinnedMesh</code>).</p>
<p>Jika Anda ingin melihat bagaimana semua ini bekerja bersama, lihat <code>@cinevva/usdjs-viewer</code>. Ini adalah implementasi referensi yang lengkap.</p>
<h2 id="komposisi-lebih-penting-daripada-yang-anda-kira" tabindex="-1">Komposisi Lebih Penting daripada yang Anda Kira <a class="header-anchor" href="#komposisi-lebih-penting-daripada-yang-anda-kira" aria-label="Permalink to &quot;Komposisi Lebih Penting daripada yang Anda Kira&quot;"></a></h2>
<p>Mengurai satu file USDC adalah bagian yang mudah. Scene USD di dunia nyata menggunakan komposisi, yang berarti sublayer, referensi, payload, dan varian bekerja bersama.</p>
<p>Bayangkan sebuah model mobil. Bodi mereferensikan <code>body.usdc</code>, roda mereferensikan <code>wheel.usdc</code>, dan tersedia varian untuk konfigurasi &quot;sport&quot; serta &quot;sedan&quot;. Scene akhir dirakit dari semua bagian tersebut saat runtime.</p>
<p>Berikut cara menanganinya:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { UsdStage, parseUsdcToLayer, FetchResolver } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> '@cinevva/usdjs'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Create a resolver that knows how to fetch referenced files</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> resolver</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> FetchResolver</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  baseUrl: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'/assets/'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">});</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Open with composition</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> stage</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> UsdStage.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">open</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(rootLayer, { resolver });</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Set a variant selection</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">stage.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setVariantSelection</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'/Car'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'bodyStyle'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'sport'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Now traverse the composed scene</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">for</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> prim</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> of</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> stage.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">traverse</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()) {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // You'll see resolved references and the selected variant</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Resolver mengambil file USDC yang direferensikan sesuai kebutuhan. Komposisi berlangsung di JavaScript dan menghasilkan scene yang telah diratakan, seperti yang akan Anda dapatkan dari <code>usdcat --flatten</code>.</p>
<h2 id="performa" tabindex="-1">Performa <a class="header-anchor" href="#performa" aria-label="Permalink to &quot;Performa&quot;"></a></h2>
<p>Mari jujur: mengurai USDC di JavaScript lebih lambat daripada C++ native. Itulah kompromi karena tidak menggunakan WASM dan langkah build tambahan.</p>
<p>Dalam praktiknya, untuk kasus penggunaan web umum dengan model berukuran di bawah 10 MB dan kurang dari 100 ribu segitiga, proses parsing memerlukan 50–200 md pada perangkat keras modern. Waktu tersebut masih wajar untuk pemuatan awal jika Anda menampilkan indikator pemuatan.</p>
<p>Anda dapat mempercepatnya. Jangan memuat seluruh scene di awal. Muat layer root, render apa yang tersedia, lalu ambil payload sesuai kebutuhan. Pindahkan proses parsing ke Web Worker agar UI tetap responsif. Cache layer yang telah diurai di IndexedDB agar kunjungan berikutnya berlangsung seketika. Tampilkan pratinjau beresolusi rendah selagi scene lengkap di-stream.</p>
<p>Berikut konfigurasi Web Worker:</p>
<div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// worker.ts</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { parseUsdcToLayer } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> '@cinevva/usdjs'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">self.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">onmessage</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> async</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">e</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">buffer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">identifier</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> e.data;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> layer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> parseUsdcToLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(buffer, { identifier });</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Serialize layer data (not the methods)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> serializeLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(layer);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  self.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">postMessage</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(data);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">};</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// main.ts</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> worker</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Worker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> URL</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'./worker.ts'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">meta</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">.url));</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">worker.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">postMessage</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({ buffer, identifier: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'model.usdc'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> });</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">worker.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">onmessage</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">e</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> layerData</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> e.data;</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Build Three.js scene from layerData</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">};</span></span></code></pre>
</div><h2 id="apa-yang-berfungsi-dan-apa-yang-tidak" tabindex="-1">Apa yang Berfungsi dan Apa yang Tidak <a class="header-anchor" href="#apa-yang-berfungsi-dan-apa-yang-tidak" aria-label="Permalink to &quot;Apa yang Berfungsi dan Apa yang Tidak&quot;"></a></h2>
<p>Sebagian besar hal umum sudah berfungsi. Geometri (mesh, titik, dan kurva) diurai dengan benar, termasuk array vertex terkompresi. Transformasi berfungsi dengan penumpukan <code>xformOp</code> penuh. Material dipetakan dari <code>UsdPreviewSurface</code> ke PBR. Komposisi menangani sublayer, referensi, payload, varian, dan pewarisan. Tekstur dapat di-resolve dan dimuat jika Anda menyediakan resolver. Animasi skeletal dasar berfungsi untuk rig karakter umum.</p>
<p>Namun, masih ada kekurangan. Ini bukan implementasi Hydra, jadi Anda bertanggung jawab mengonversi data USD ke mesin rendering apa pun yang digunakan. Tidak tersedia API skema bertipe seperti <code>UsdGeomMesh</code> dengan berbagai metode praktis. Anda bekerja dengan prim dan atribut generik. Beberapa fitur komposisi seperti specializes, relocates, dan value clips belum diimplementasikan. Jaringan material kompleks di luar <code>UsdPreviewSurface</code> sederhana memerlukan penanganan khusus.</p>
<h2 id="kapan-sebaiknya-menggunakan-ini" tabindex="-1">Kapan Sebaiknya Menggunakan Ini <a class="header-anchor" href="#kapan-sebaiknya-menggunakan-ini" aria-label="Permalink to &quot;Kapan Sebaiknya Menggunakan Ini&quot;"></a></h2>
<p>Solusi ini cocok ketika Anda perlu memuat file USD dalam aplikasi web tanpa langkah build WASM, ketika pipeline Anda menghasilkan USDC dan Anda tidak ingin mengonversinya ke glTF, ketika Anda membuat penampil atau editor USD untuk browser, atau ketika Anda ingin memeriksa struktur USD alih-alih sekadar merendernya.</p>
<p>Gunakan solusi lain jika Anda memerlukan kesetaraan penuh dengan OpenUSD untuk setiap kasus khusus, jika scene Anda sangat besar (100 MB+) dan memerlukan performa native, atau jika Anda sudah menggunakan build WASM dan kompleksitasnya masih dapat diterima untuk proyek Anda.</p>
<h2 id="sumber-daya" tabindex="-1">Sumber Daya <a class="header-anchor" href="#sumber-daya" aria-label="Permalink to &quot;Sumber Daya&quot;"></a></h2>
<p>Ketiga paket tersebut adalah <code>@cinevva/usdjs</code> untuk parsing dan komposisi inti, <code>@cinevva/usdjs-viewer</code> untuk penampil browser berbasis Three.js, serta <code>@cinevva/usdjs-renderer</code> untuk rendering PNG headless dalam pengujian.</p>
<p>Untuk dokumentasi, lihat <a href="https://cinevva-engine.github.io/usdjs/API" target="_blank" rel="noreferrer">Referensi API usdjs</a>, <a href="https://openusd.org/release/index.html" target="_blank" rel="noreferrer">Spesifikasi OpenUSD Pixar</a>, dan <a href="https://threejs.org/docs/" target="_blank" rel="noreferrer">Dokumentasi Three.js</a>.</p>
<p>Jika Anda ingin memahami bagaimana parser USDC dipetakan ke implementasi Pixar, lihat <code>src/usdc/PIXAR_PARITY.md</code> di repositori usdjs.</p>
<h2 id="cobalah" tabindex="-1">Cobalah <a class="header-anchor" href="#cobalah" aria-label="Permalink to &quot;Cobalah&quot;"></a></h2>
<p>Cara tercepat untuk melihatnya bekerja adalah dengan mengunjungi <a href="https://cinevva-engine.github.io/usdjs-viewer/" target="_blank" rel="noreferrer">demo usdjs-viewer</a> dan meletakkan file USDC di sana.</p>
<p>Untuk mengintegrasikannya ke proyek Anda sendiri, instal paket tersebut dan mulai dengan contoh kode di atas:</p>
<div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> install</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> @cinevva/usdjs</span></span></code></pre>
</div><p>USD di browser itu memungkinkan. Ini tidak selalu menjadi pilihan yang tepat, tetapi saat Anda membutuhkannya, parsing JavaScript murni berarti satu langkah build dan satu dependensi lebih sedikit untuk dipikirkan.</p>
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/tutorials/webgl-fundamentals-for-games.html">Dasar-dasar WebGL untuk pengembang game</a> — API rendering yang menggerakkan scene Three.js</li>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Game Web pada 2026</a> — posisi Three.js dalam lanskap WebGL/WebGPU/Wasm</li>
<li><a href="/id/guides/browser-3d-open-world-tech.html">Teknologi Dunia Terbuka 3D di Browser</a> — streaming aset 3D, termasuk USD, untuk dunia terbuka</li>
<li><a href="/id/guides/game-assets-guide.html">Tempat Menemukan Aset Game Gratis</a> — sumber model 3D yang kompatibel dengan Three.js</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/threejs-usdc-tech-report.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[11 Engine Game Web Terbaik untuk 2026, Diperingkat dan Dibandingkan]]></title>
            <link>https://app.cinevva.com/id/guides/web-game-engines-comparison</link>
            <guid>https://app.cinevva.com/id/guides/web-game-engines-comparison</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Kami membandingkan 11 engine game web berdasarkan ukuran build, waktu muat, 2D vs 3D, WebGPU, dan biaya. Lihat mana yang terbaik untuk proyek Anda, dari Unity dan Godot hingga PlayCanvas, Defold, dan Phaser.]]></description>
            <content:encoded><![CDATA[<h1 id="engine-game-web-terbaik-untuk-2026-dibandingkan" tabindex="-1">Engine Game Web Terbaik untuk 2026 (Dibandingkan) <a class="header-anchor" href="#engine-game-web-terbaik-untuk-2026-dibandingkan" aria-label="Permalink to &quot;Engine Game Web Terbaik untuk 2026 (Dibandingkan)&quot;"></a></h1>
<p><em>Terakhir diperbarui: Juli 2026.</em></p>
<p>Ingin membuat game untuk web? Pilihan engine Anda menentukan segalanya: ukuran build, waktu muat, fidelitas visual, dan seberapa banyak audiens Anda yang benar-benar dapat memainkannya.</p>
<p>Panduan ini membandingkan engine game web terbaik yang tersedia pada 2026, dari engine berfitur lengkap seperti Unity dan Godot hingga framework JavaScript ringan seperti Phaser dan PixiJS.</p>
<p><strong>Yang berubah pada 2026:</strong> WebGPU akhirnya dapat digunakan secara luas di semua platform. Safari 26 (September 2025) menambahkan WebGPU di macOS, iPadOS, iOS, dan visionOS, menutup celah dukungan besar terakhir, sehingga saran lama &quot;tetap gunakan WebGL karena Safari&quot; sudah tidak berlaku. Three.js menyediakan renderer WebGPU tanpa konfigurasi dengan fallback WebGL2 otomatis, dan PlayCanvas memiliki jalur WebGPU paling matang di antara semuanya. Namun, ekspor web Godot masih hanya menargetkan WebGL 2.0, meskipun Godot 4.7 (Juni 2026) menambahkan ekspor wasm64 yang menghapus batas memori lama sebesar 4 GB. WebGPU masih bersifat opsional atau eksperimental di sebagian besar engine alih-alih menjadi pilihan default, tetapi dukungan browser yang sebelumnya menghambatnya kini sudah tersedia.</p>
<BuildCta
  title="Hanya ingin membuat game, bukan mempelajari engine?"
  desc="Ketik satu kalimat dan Cinevva akan membuat game web 3D yang dapat dimainkan berdasarkan kalimat tersebut sementara Anda membaca panduan ini."
  prompt="Buat platformer 3D dengan platform bergerak dan pengatur waktu" />
<h2 id="engine-game-web-terbaik-untuk-2026-pilihan-cepat" tabindex="-1">Engine Game Web Terbaik untuk 2026: Pilihan Cepat <a class="header-anchor" href="#engine-game-web-terbaik-untuk-2026-pilihan-cepat" aria-label="Permalink to &quot;Engine Game Web Terbaik untuk 2026: Pilihan Cepat&quot;"></a></h2>
<p>Tidak punya banyak waktu? Berikut keunggulan masing-masing engine pada 2026.</p>
<h3 id="engine-game-web-3d-terbaik" tabindex="-1">Engine game web 3D terbaik <a class="header-anchor" href="#engine-game-web-3d-terbaik" aria-label="Permalink to &quot;Engine game web 3D terbaik&quot;"></a></h3>
<p>PlayCanvas memimpin untuk 3D yang mengutamakan browser: runtime 1-2 MB, renderer WebGPU paling siap produksi di antara semua engine web, dan editor cloud kolaboratif. Godot dan Cocos Creator merupakan alternatif gratis yang kuat, sedangkan Unity WebGL cocok jika Anda juga memerlukan build native dan dapat menerima unduhan berukuran 8 MB atau lebih.</p>
<h3 id="engine-game-2d-terbaik-untuk-2026" tabindex="-1">Engine game 2D terbaik untuk 2026 <a class="header-anchor" href="#engine-game-2d-terbaik-untuk-2026" aria-label="Permalink to &quot;Engine game 2D terbaik untuk 2026&quot;"></a></h3>
<p>Defold dan Phaser adalah pilihan utama untuk 2D. Defold menghasilkan build terkecil (~1,14 MB) dan memuat paling cepat; Phaser memberi Anda framework lengkap siap pakai dengan komunitas terbesar. Bagi nonprogrammer, Construct dan GDevelop memungkinkan pembuatan game 2D secara visual tanpa pemrograman. Untuk pembahasan lengkap, lihat <a href="/id/guides/best-2d-game-engines-2026.html">engine game 2D terbaik untuk 2026</a>.</p>
<h3 id="engine-game-wasm-terbaik" tabindex="-1">Engine game Wasm terbaik <a class="header-anchor" href="#engine-game-wasm-terbaik" aria-label="Permalink to &quot;Engine game Wasm terbaik&quot;"></a></h3>
<p>Jika performa WebAssembly menjadi prioritas, Godot (Wasm + SIMD secara default), Defold (runtime Wasm), dan Cocos Creator (fisika Wasm dengan peningkatan 5-9x) dapat dikompilasi menjadi build web yang cepat dan ringkas. Wasm memungkinkan engine-engine ini berjalan dengan kecepatan mendekati native di dalam browser.</p>
<h3 id="engine-game-web-gratis-dan-sumber-terbuka-terbaik" tabindex="-1">Engine game web gratis dan sumber terbuka terbaik <a class="header-anchor" href="#engine-game-web-gratis-dan-sumber-terbuka-terbaik" aria-label="Permalink to &quot;Engine game web gratis dan sumber terbuka terbaik&quot;"></a></h3>
<p>Godot, Phaser, PixiJS, Defold, dan Excalibur.js semuanya gratis dan bersumber terbuka, sehingga tidak ada biaya lisensi atau ambang pendapatan. Godot adalah engine gratis paling lengkap untuk 2D maupun 3D.</p>
<h2 id="peringkat" tabindex="-1">Peringkat <a class="header-anchor" href="#peringkat" aria-label="Permalink to &quot;Peringkat&quot;"></a></h2>
<p>Urutan ini dikhususkan untuk proyek yang mengutamakan web, dengan mempertimbangkan ukuran build, waktu muat, dan seberapa native terhadap web masing-masing engine. Jika proyek Anda mengutamakan platform native, seluler, atau konsol, urutannya akan berubah dan engine yang lebih berat akan naik peringkat.</p>
<ol>
<li><strong>PlayCanvas</strong>: terbaik untuk 3D yang mengutamakan browser, dengan runtime terkecil dan jalur WebGPU paling matang.</li>
<li><strong>Defold</strong>: terbaik untuk build web terkecil dengan waktu muat tercepat.</li>
<li><strong>Phaser</strong>: terbaik untuk pengembangan 2D berbasis kode dengan komunitas HTML5 terbesar.</li>
<li><strong>Godot</strong>: terbaik sebagai engine gratis dan sumber terbuka untuk 2D maupun 3D.</li>
<li><strong>Cocos Creator</strong>: terbaik untuk mini-game dan pasar web Asia.</li>
<li><strong>Construct</strong>: terbaik untuk 2D tanpa kode yang tetap menghasilkan build web bersih.</li>
<li><strong>GDevelop</strong>: terbaik untuk pengembangan tanpa kode yang gratis dan sumber terbuka, mencakup 2D serta 3D ringan.</li>
<li><strong>PixiJS</strong>: terbaik untuk rendering 2D khusus dengan jejak terkecil.</li>
<li><strong>Excalibur.js</strong>: terbaik untuk game 2D TypeScript dengan struktur lebih lengkap daripada renderer dasar.</li>
<li><strong>Unity</strong>: terbaik ketika web menjadi platform sekunder setelah desktop, seluler, atau konsol.</li>
<li><strong>Unreal</strong>: terbaik untuk visualisasi dengan fidelitas tinggi melalui Pixel Streaming, bukan game web sungguhan.</li>
</ol>
<h2 id="tabel-referensi-cepat" tabindex="-1">Tabel Referensi Cepat <a class="header-anchor" href="#tabel-referensi-cepat" aria-label="Permalink to &quot;Tabel Referensi Cepat&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Engine</th>
<th>Jenis</th>
<th>Teknologi Web</th>
<th>Ukuran Build (kosong)</th>
<th>Terbaik Untuk</th>
<th>Biaya</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="https://unity.com/" target="_blank" rel="noreferrer"><strong>Unity</strong></a></td>
<td>Engine lengkap</td>
<td>WebGL</td>
<td>~8 MB</td>
<td>Game 3D, lintas platform</td>
<td>Gratis &lt; $200K; Pro $2.310/tahun</td>
</tr>
<tr>
<td><a href="https://godotengine.org/" target="_blank" rel="noreferrer"><strong>Godot</strong></a></td>
<td>Engine lengkap</td>
<td>WebGL + Wasm</td>
<td>~9 MB (24 MB tanpa kompresi)</td>
<td>Game indie 2D/3D</td>
<td>Gratis (MIT)</td>
</tr>
<tr>
<td><a href="https://www.unrealengine.com/" target="_blank" rel="noreferrer"><strong>Unreal</strong></a></td>
<td>Engine lengkap</td>
<td>Hanya Pixel Streaming</td>
<td>T/A (sisi server)</td>
<td>Visualisasi dengan fidelitas tinggi</td>
<td>Gratis untuk pendapatan &lt; $1 juta</td>
</tr>
<tr>
<td><a href="https://www.cocos.com/en/creator" target="_blank" rel="noreferrer"><strong>Cocos Creator</strong></a></td>
<td>Engine lengkap</td>
<td>WebGL + WebGPU + Wasm</td>
<td>~2-4 MB</td>
<td>2D/3D, mini-game (Asia)</td>
<td>Gratis</td>
</tr>
<tr>
<td><a href="https://playcanvas.com/" target="_blank" rel="noreferrer"><strong>PlayCanvas</strong></a></td>
<td>3D yang mengutamakan web</td>
<td>WebGL2 + WebGPU</td>
<td>~1-2 MB</td>
<td>3D interaktif, aplikasi web</td>
<td>Paket gratis; paket berbayar</td>
</tr>
<tr>
<td><a href="https://defold.com/" target="_blank" rel="noreferrer"><strong>Defold</strong></a></td>
<td>2D/3D yang mengutamakan web</td>
<td>WebGL + Wasm</td>
<td>~1,14 MB</td>
<td>Game web kasual/seluler</td>
<td>Gratis</td>
</tr>
<tr>
<td><a href="https://www.construct.net/" target="_blank" rel="noreferrer"><strong>Construct</strong></a></td>
<td>2D visual</td>
<td>WebGL + WebGPU</td>
<td>~1-2 MB</td>
<td>Game 2D, nonprogrammer</td>
<td>Langganan</td>
</tr>
<tr>
<td><a href="https://gdevelop.io/" target="_blank" rel="noreferrer"><strong>GDevelop</strong></a></td>
<td>2D/3D visual</td>
<td>WebGL</td>
<td>~2-3 MB</td>
<td>Pemula, pembuatan prototipe cepat</td>
<td>Paket gratis; paket berbayar</td>
</tr>
<tr>
<td><a href="https://phaser.io/" target="_blank" rel="noreferrer"><strong>Phaser</strong></a></td>
<td>Framework JS</td>
<td>WebGL/Canvas</td>
<td>~500 KB</td>
<td>Game 2D, pembuatan prototipe cepat</td>
<td>Gratis (MIT)</td>
</tr>
<tr>
<td><a href="https://pixijs.com/" target="_blank" rel="noreferrer"><strong>PixiJS</strong></a></td>
<td>Renderer JS</td>
<td>WebGL</td>
<td>~200 KB</td>
<td>Rendering 2D khusus</td>
<td>Gratis (MIT)</td>
</tr>
<tr>
<td><a href="https://excaliburjs.com/" target="_blank" rel="noreferrer"><strong>Excalibur.js</strong></a></td>
<td>Framework JS</td>
<td>WebGL</td>
<td>~300 KB</td>
<td>Game 2D TypeScript</td>
<td>Gratis (BSD)</td>
</tr>
</tbody>
</table>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 452" role="img" aria-label="Ukuran build web kosong berdasarkan engine, dari yang terkecil hingga terbesar: PixiJS sekitar 0,2 MB, Excalibur.js 0,3 MB, Phaser 0,5 MB, Defold 1,14 MB, PlayCanvas dan Construct 1 hingga 2 MB, GDevelop 2 hingga 3 MB, Cocos Creator 2 hingga 4 MB, Unity sekitar 8 MB, Godot sekitar 9 MB dengan gzip" style="width:100%;height:auto;max-width:720px;margin:1.5rem auto;display:block;border-radius:14px">
  <rect width="720" height="452" rx="14" fill="#0b1020"/>
  <text x="32" y="44" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="20" font-weight="800" fill="#e8edf5">Ukuran build kosong berdasarkan engine</text>
  <text x="32" y="68" font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif" font-size="13" fill="#9aa7b4">Ukuran merupakan perkiraan unduhan build kosong berdasarkan dokumentasi engine dan pengukuran komunitas.</text>
  <g font-family="Inter,Segoe UI,Helvetica,Arial,sans-serif">
    <text x="180" y="115" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">PixiJS</text>
    <rect x="190" y="100" width="10" height="20" rx="5" fill="#6ee7b7"/>
    <text x="208" y="115" font-size="12" font-weight="700" fill="#9aa7b4">~0,2 MB</text>
    <text x="180" y="147" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Excalibur.js</text>
    <rect x="190" y="132" width="16" height="20" rx="5" fill="#6ee7b7"/>
    <text x="214" y="147" font-size="12" font-weight="700" fill="#9aa7b4">~0,3 MB</text>
    <text x="180" y="179" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Phaser</text>
    <rect x="190" y="164" width="26" height="20" rx="5" fill="#6ee7b7"/>
    <text x="224" y="179" font-size="12" font-weight="700" fill="#9aa7b4">~0,5 MB</text>
    <text x="180" y="211" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Defold</text>
    <rect x="190" y="196" width="60" height="20" rx="5" fill="#7dd3fc"/>
    <text x="258" y="211" font-size="12" font-weight="700" fill="#9aa7b4">~1,14 MB</text>
    <text x="180" y="243" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">PlayCanvas</text>
    <rect x="190" y="228" width="78" height="20" rx="5" fill="#7dd3fc"/>
    <text x="276" y="243" font-size="12" font-weight="700" fill="#9aa7b4">~1-2 MB</text>
    <text x="180" y="275" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Construct</text>
    <rect x="190" y="260" width="78" height="20" rx="5" fill="#7dd3fc"/>
    <text x="276" y="275" font-size="12" font-weight="700" fill="#9aa7b4">~1-2 MB</text>
    <text x="180" y="307" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">GDevelop</text>
    <rect x="190" y="292" width="131" height="20" rx="5" fill="#c8a8ff"/>
    <text x="329" y="307" font-size="12" font-weight="700" fill="#9aa7b4">~2-3 MB</text>
    <text x="180" y="339" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Cocos Creator</text>
    <rect x="190" y="324" width="157" height="20" rx="5" fill="#c8a8ff"/>
    <text x="355" y="339" font-size="12" font-weight="700" fill="#9aa7b4">~2-4 MB</text>
    <text x="180" y="371" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Unity</text>
    <rect x="190" y="356" width="418" height="20" rx="5" fill="#fb7185"/>
    <text x="616" y="371" font-size="12" font-weight="700" fill="#fb7185">~8 MB</text>
    <text x="180" y="403" text-anchor="end" font-size="13" font-weight="700" fill="#e8edf5">Godot</text>
    <rect x="190" y="388" width="470" height="20" rx="5" fill="#fb7185"/>
    <text x="652" y="403" text-anchor="end" font-size="12" font-weight="800" fill="#0b1020">~9 MB dengan gzip</text>
  </g>
</svg>
<h2 id="engine-game-berfitur-lengkap" tabindex="-1">Engine Game Berfitur Lengkap <a class="header-anchor" href="#engine-game-berfitur-lengkap" aria-label="Permalink to &quot;Engine Game Berfitur Lengkap&quot;"></a></h2>
<h3 id="unity-webgl" tabindex="-1"><a href="https://unity.com/" target="_blank" rel="noreferrer">Unity</a> (WebGL) <a class="header-anchor" href="#unity-webgl" aria-label="Permalink to &quot;[Unity](https://unity.com/) (WebGL)&quot;"></a></h3>
<p>Andalan industri. Ekspor WebGL Unity menghasilkan build web yang dapat dimainkan, tetapi dengan kompromi signifikan. Unity 6.5 (Juni 2026) adalah rilis terkini, dan versi ini menghentikan penggunaan Built-in Render Pipeline lama (didukung hingga Unity 6.7 LTS), sehingga proyek baru sebaiknya dimulai dengan URP.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Ekosistem matang dengan Asset Store yang luas</li>
<li>Alat rendering, fisika, dan animasi tingkat lanjut</li>
<li>Dokumentasi dan komunitas yang kuat</li>
<li>Lintas platform: basis kode yang sama dapat diterapkan ke desktop, seluler, konsol, dan web</li>
</ul>
<p><strong>Keterbatasan Web:</strong></p>
<ul>
<li>Ukuran build besar (minimum ~8+ MB)</li>
<li>Waktu muat lebih lambat dibandingkan engine yang native terhadap web</li>
<li>Performa tertinggal dari build native</li>
<li>Backend WebGPU masih eksperimental pada Unity 6.5, dinonaktifkan secara default, dan belum siap produksi</li>
<li>Overhead memori dapat menjadi masalah di browser seluler</li>
</ul>
<p><strong>Harga (2026):</strong></p>
<ul>
<li>Personal: Gratis untuk pendapatan hingga $200K</li>
<li>Pro: $2.310/kursi/tahun (kenaikan 5% berlaku pada Januari 2026)</li>
<li>Biaya runtime dibatalkan pada akhir 2024</li>
</ul>
<p><strong>Kapan digunakan:</strong> Anda membuat game 3D kompleks yang juga harus dirilis di platform lain. Web menjadi platform sekunder.</p>
<p><strong>Tautan:</strong> <a href="https://unity.com/" target="_blank" rel="noreferrer">Unity</a> · <a href="https://docs.unity3d.com/Manual/webgl.html" target="_blank" rel="noreferrer">Dokumentasi WebGL</a> · <a href="https://assetstore.unity.com/" target="_blank" rel="noreferrer">Asset Store</a></p>
<hr>
<h3 id="godot-html5" tabindex="-1"><a href="https://godotengine.org/" target="_blank" rel="noreferrer">Godot</a> (HTML5) <a class="header-anchor" href="#godot-html5" aria-label="Permalink to &quot;[Godot](https://godotengine.org/) (HTML5)&quot;"></a></h3>
<p>Bersumber terbuka dan berkembang pesat. Godot 4.7 (Juni 2026) adalah rilis stabil terkini, dan versi ini menyertakan WebAssembly SIMD secara default serta opsi ekspor web wasm64 baru, yang meningkatkan performa tanpa perubahan kode.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Sepenuhnya gratis dan bersumber terbuka (lisensi MIT)</li>
<li>Editor ringan</li>
<li>Dukungan 2D sangat baik dengan renderer khusus</li>
<li>GDScript mudah dipelajari pemula</li>
<li>WebAssembly + SIMD untuk performa lebih baik</li>
<li>Komunitas aktif yang terus berkembang</li>
</ul>
<p><strong>Keterbatasan Web:</strong></p>
<ul>
<li>Proyek C# tidak dapat diekspor ke web (hanya GDScript)</li>
<li>Ekspor web hanya mendukung WebGL 2.0 (renderer Compatibility); Forward+/Mobile dan WebGPU tidak didukung di browser (fork WebGPU komunitas tersedia dalam beta publik, tetapi tidak resmi)</li>
<li>Dukungan Safari/iOS bermasalah</li>
<li>Build kosong berukuran ~24 MB tanpa kompresi (~9 MB dengan gzip)</li>
<li>Beberapa fitur rendering 3D tertinggal dari Unity</li>
</ul>
<p><strong>Threading:</strong></p>
<ul>
<li>Memerlukan header COOP/COEP untuk SharedArrayBuffer</li>
<li>Single-threaded kini menjadi default (menghindari kerumitan header)</li>
</ul>
<p><strong>Kapan digunakan:</strong> Anda menginginkan sumber terbuka, memprioritaskan 2D, atau menginginkan kendali penuh tanpa kekhawatiran lisensi.</p>
<p><strong>Tautan:</strong> <a href="https://godotengine.org/" target="_blank" rel="noreferrer">Godot Engine</a> · <a href="https://docs.godotengine.org/en/stable/tutorials/export/exporting_for_web.html" target="_blank" rel="noreferrer">Dokumentasi Ekspor Web</a> · <a href="https://github.com/godotengine/godot" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h3 id="unreal-engine-5" tabindex="-1"><a href="https://www.unrealengine.com/" target="_blank" rel="noreferrer">Unreal Engine 5</a> <a class="header-anchor" href="#unreal-engine-5" aria-label="Permalink to &quot;[Unreal Engine 5](https://www.unrealengine.com/)&quot;"></a></h3>
<p>Unreal menghentikan ekspor HTML5 native sejak UE 4.24. Di UE5, pengiriman melalui browser memerlukan <strong>Pixel Streaming</strong>, yang ditulis ulang sebagai Pixel Streaming 2 di UE 5.7. UE 5.8 (Juni 2026), rilis UE5 terakhir yang direncanakan sebelum UE6, tidak mengubah situasi dukungan web.</p>
<p><strong>Cara Kerja Pixel Streaming:</strong></p>
<ul>
<li>Game berjalan di server dengan GPU</li>
<li>Frame dialirkan ke browser melalui WebRTC</li>
<li>Input dikirim kembali dari browser</li>
<li>Umumnya diperlukan satu instans UE per pengguna</li>
</ul>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Fidelitas visual UE5 penuh di browser</li>
<li>Tidak ada persyaratan perangkat keras di sisi klien</li>
<li>Berfungsi di perangkat apa pun yang memiliki browser</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Memerlukan infrastruktur server (mahal untuk diskalakan)</li>
<li>Latensi bergantung pada jaringan</li>
<li>Artefak kompresi video</li>
<li>Tidak cocok untuk &quot;game web&quot; tradisional: lebih sesuai untuk visualisasi, konfigurator, dan etalase</li>
</ul>
<p><strong>Upaya HTML5 komunitas tersedia</strong> (fork WebAssembly/WebGPU seperti SimplyStream), tetapi masih eksperimental dan terbatas.</p>
<p><strong>Kapan digunakan:</strong> Visualisasi arsitektur atau konfigurator produk dengan fidelitas tinggi ketika biaya server dapat diterima. Tidak praktis untuk game yang menargetkan audiens web massal.</p>
<p><strong>Tautan:</strong> <a href="https://www.unrealengine.com/" target="_blank" rel="noreferrer">Unreal Engine</a> · <a href="https://dev.epicgames.com/documentation/en-us/unreal-engine/pixel-streaming-in-unreal-engine" target="_blank" rel="noreferrer">Dokumentasi Pixel Streaming</a></p>
<hr>
<h3 id="cocos-creator" tabindex="-1">Cocos Creator <a class="header-anchor" href="#cocos-creator" aria-label="Permalink to &quot;Cocos Creator&quot;"></a></h3>
<p>Engine berfitur lengkap dengan dukungan luar biasa untuk web dan platform mini-game, khususnya populer di Asia.
<strong>Kelebihan:</strong></p>
<ul>
<li>Arsitektur dual-core: inti Web3D (TypeScript) yang dioptimalkan untuk web/mini-game</li>
<li>Dukungan WebGPU (masih eksperimental pada versi 3.8.8, Des 2025; memerlukan pipeline render kustom baru, dan 3.8.8 menambahkan WebGPU MSAA)</li>
<li>WebAssembly untuk fisika (Box2D, Bullet) dengan peningkatan performa 5-9×</li>
<li>Dukungan luar biasa untuk platform mini-game (WeChat, TikTok, Taobao)</li>
<li>Custom Render Pipeline (CRP) untuk mengendalikan optimasi</li>
<li>Dukungan Spine 4.2 dengan runtime WASM</li>
<li>Pemangkasan ukuran paket dan kompresi Brotli</li>
<li>Sepenuhnya gratis</li>
</ul>
<p><strong>Keterbatasan Web:</strong></p>
<ul>
<li>Komunitas Barat lebih kecil (dokumentasi terutama dalam bahasa Mandarin)</li>
<li>Pemuatan awal bisa berat jika semua fitur diaktifkan</li>
<li>Fallback ke WebGL1/asm.js pada browser lama menurunkan performa</li>
</ul>
<p><strong>Penambahan terbaru (2025-2026):</strong></p>
<ul>
<li>Backend WebGPU</li>
<li>Modul fisika WASM secara default</li>
<li>Custom Render Pipeline melalui RenderGraph</li>
<li>Kompresi tekstur ASTC untuk mini-game</li>
<li>Pengurangan ukuran paket yang signifikan</li>
</ul>
<p><strong>Kapan digunakan:</strong> Platform mini-game (WeChat, TikTok), game web seluler yang menargetkan pasar Asia, atau ketika Anda memerlukan performa web 2D/3D yang kuat dengan engine gratis.</p>
<p><strong>Tautan:</strong> <a href="https://www.cocos.com/en/creator" target="_blank" rel="noreferrer">Cocos Creator</a> · <a href="https://docs.cocos.com/creator/manual/en/" target="_blank" rel="noreferrer">Dokumentasi</a> · <a href="https://github.com/cocos/cocos-engine" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h2 id="engine-yang-mengutamakan-web" tabindex="-1">Engine yang Mengutamakan Web <a class="header-anchor" href="#engine-yang-mengutamakan-web" aria-label="Permalink to &quot;Engine yang Mengutamakan Web&quot;"></a></h2>
<p>Engine berikut dibuat secara khusus untuk distribusi melalui web.</p>
<h3 id="playcanvas" tabindex="-1"><a href="https://playcanvas.com/" target="_blank" rel="noreferrer">PlayCanvas</a> <a class="header-anchor" href="#playcanvas" aria-label="Permalink to &quot;[PlayCanvas](https://playcanvas.com/)&quot;"></a></h3>
<p>Engine 3D berbasis cloud yang sejak awal dirancang untuk web.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Dukungan WebGL2 + WebGPU (beta)</li>
<li>Editor cloud kolaboratif</li>
<li>Runtime kecil (~1-2 MB)</li>
<li>Rendering PBR, pascapemrosesan, partikel GPU</li>
<li>Compute shader melalui WebGPU</li>
<li>Dukungan 3D Gaussian Splatting</li>
<li>Kompresi aset yang efisien (Basis Universal, WebP)</li>
</ul>
<p><strong>Penambahan terbaru (2025-2026):</strong></p>
<ul>
<li>Engine V2 dengan dukungan WebGPU</li>
<li>Compute shader</li>
<li>Multi-draw untuk mengurangi overhead draw call</li>
<li>Dukungan HDR di penampil</li>
<li>Ekspor glTF yang ditingkatkan</li>
<li>Engine v2.20 (kini v2.20.6, Juli 2026) memperluas renderer WebGPU berperforma tinggi, termasuk jalur WebGPU berbasis komputasi untuk 3D Gaussian splat</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>WebGPU masih dalam tahap beta (beberapa fitur seperti lightmapping saat runtime belum tersedia)</li>
<li>Alur kerja berbasis cloud mungkin tidak cocok untuk semua tim</li>
<li>Kurang cocok untuk game 2D yang kompleks</li>
</ul>
<p><strong>Harga:</strong></p>
<ul>
<li>Tersedia paket gratis</li>
<li>Paket berbayar untuk proyek privat, penyimpanan, dan dukungan</li>
</ul>
<p><strong>Kapan digunakan:</strong> Pengalaman web 3D interaktif, konfigurator produk, dan game berbasis web yang mengutamakan ukuran unduhan kecil.</p>
<p><strong>Tautan:</strong> <a href="https://playcanvas.com/" target="_blank" rel="noreferrer">PlayCanvas</a> · <a href="https://developer.playcanvas.com/" target="_blank" rel="noreferrer">Dokumentasi</a> · <a href="https://github.com/playcanvas/engine" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h3 id="defold" tabindex="-1"><a href="https://defold.com/" target="_blank" rel="noreferrer">Defold</a> <a class="header-anchor" href="#defold" aria-label="Permalink to &quot;[Defold](https://defold.com/)&quot;"></a></h3>
<p>Engine ringan dari King (Candy Crush) dengan performa web yang luar biasa. Defold 1.13.0 (Juni 2026) menghentikan target asm.js (js-web) lama, sehingga build web kini hanya menggunakan Wasm, serta menambahkan morph target glTF sebagai bagian dari rangkaian fitur 3D yang terus berkembang.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Runtime sangat kecil: ~1,14 MB (gzip, build kosong)</li>
<li>WebAssembly secara default</li>
<li>Waktu pemuatan luar biasa</li>
<li>Publikasi bawaan ke Poki dan platform lain</li>
<li>Profiler performa HTML5</li>
<li>GPU skinning dengan peningkatan performa 30-50% pada versi terbaru</li>
<li>Dukungan WebGPU eksperimental</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Komunitas lebih kecil daripada Godot/Unity</li>
<li>Build debug jauh lebih lambat</li>
<li>Heap default 256 MB (perlu disesuaikan untuk game yang lebih besar)</li>
<li>Kurva belajar untuk scripting Lua</li>
</ul>
<p><strong>Perbandingan performa:</strong></p>
<ul>
<li>Build kosong: Defold ~1,14 MB vs Unity ~8 MB vs Godot ~9 MB</li>
<li>Termasuk engine dengan waktu pemuatan tercepat dalam studi terhadap game web populer</li>
</ul>
<p><strong>Kapan digunakan:</strong> Game web yang mengutamakan perangkat seluler, game kasual, dan proyek apa pun yang sangat mementingkan waktu pemuatan.</p>
<p><strong>Tautan:</strong> <a href="https://defold.com/" target="_blank" rel="noreferrer">Defold</a> · <a href="https://defold.com/manuals/html5/" target="_blank" rel="noreferrer">Dokumentasi HTML5</a> · <a href="https://github.com/defold/defold" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h3 id="construct" tabindex="-1"><a href="https://www.construct.net/" target="_blank" rel="noreferrer">Construct</a> <a class="header-anchor" href="#construct" aria-label="Permalink to &quot;[Construct](https://www.construct.net/)&quot;"></a></h3>
<p>Pengembangan visual berbasis event. Sempurna bagi nonprogrammer.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Tidak memerlukan coding (event sheet)</li>
<li>Renderer WebGPU diaktifkan secara default (jika didukung)</li>
<li>Iterasi dan pembuatan prototipe yang cepat</li>
<li>55 rilis selama 2025 saja</li>
<li>Dukungan TypeScript di editor</li>
<li>Browser aset bawaan dan peningkatan debugger</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Berfokus pada 2D (dukungan 3D minimal)</li>
<li>Model berlangganan</li>
<li>Kontrol lebih terbatas daripada engine berbasis kode</li>
<li>Dapat menemui batasan pada logika game yang kompleks</li>
</ul>
<p><strong>Kapan digunakan:</strong> Game 2D, pembuatan prototipe cepat, pendidikan, atau jika Anda bukan programmer.</p>
<p><strong>Tautan:</strong> <a href="https://www.construct.net/" target="_blank" rel="noreferrer">Construct</a> · <a href="https://www.construct.net/en/make-games/manuals/construct-3" target="_blank" rel="noreferrer">Dokumentasi</a></p>
<hr>
<h3 id="gdevelop" tabindex="-1"><a href="https://gdevelop.io/" target="_blank" rel="noreferrer">GDevelop</a> <a class="header-anchor" href="#gdevelop" aria-label="Permalink to &quot;[GDevelop](https://gdevelop.io/)&quot;"></a></h3>
<p>Engine game visual sumber terbuka dengan dukungan 3D yang terus berkembang.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Pengembangan berbasis event tanpa kode</li>
<li>Dukungan 3D native (ditambahkan pada 5.3)</li>
<li>Editor 3D real-time (5.6)</li>
<li>Jolt Physics untuk 3D</li>
<li>Profiler bawaan</li>
<li>Dukungan multipemain real-time (2-8 pemain)</li>
<li>Tersedia paket gratis</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Kode hasil ekspor menyertakan pustaka engine (Pixi.js, Three.js, Howler.js)</li>
<li>Ukuran build lebih besar daripada framework minimal</li>
<li>Editor dapat melambat jika memiliki banyak objek/scene</li>
<li>Performa sangat bergantung pada teknik optimasi</li>
</ul>
<p><strong>Kapan digunakan:</strong> Pemula, konteks pendidikan, pembuatan prototipe cepat, dan game 2D/3D berskala kecil.</p>
<p><strong>Tautan:</strong> <a href="https://gdevelop.io/" target="_blank" rel="noreferrer">GDevelop</a> · <a href="https://wiki.gdevelop.io/" target="_blank" rel="noreferrer">Dokumentasi</a> · <a href="https://github.com/4ian/GDevelop" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h2 id="framework-javascript" tabindex="-1">Framework JavaScript <a class="header-anchor" href="#framework-javascript" aria-label="Permalink to &quot;Framework JavaScript&quot;"></a></h2>
<p>Untuk developer yang menginginkan kontrol maksimal dengan overhead minimal.</p>
<h3 id="phaser-v4" tabindex="-1"><a href="https://phaser.io/" target="_blank" rel="noreferrer">Phaser</a> (v4) <a class="header-anchor" href="#phaser-v4" aria-label="Permalink to &quot;[Phaser](https://phaser.io/) (v4)&quot;"></a></h3>
<p>Framework game HTML5 terpopuler. Versi 4 dirilis stabil pada April 2026, dibangun ulang dari awal untuk renderer WebGL dengan arsitektur render berbasis node yang baru, sekaligus mempertahankan API v3. Rilis minor menyusul dengan cepat sejak saat itu, dengan v4.2 &quot;Giedi&quot; hadir pada Juni 2026 dan patch 4.2.1 pada Juli. Perlu diingat bahwa Phaser 4 merupakan penulisan ulang berbasis WebGL2, bukan engine WebGPU; WebGPU baru menjadi landasan untuk masa depan, bukan fitur yang sudah dirilis.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Framework game lengkap: fisika, input, audio, scene, pemuatan aset</li>
<li>Arcade Physics dan Matter.js tersedia secara bawaan</li>
<li>Komunitas, tutorial, dan contoh yang sangat besar</li>
<li>Renderer WebGL + Canvas</li>
<li>Template untuk bundler dan wrapper desktop</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Bundle lebih besar daripada pustaka minimal (~500 KB)</li>
<li>Performa pada skenario dengan banyak sprite tertinggal dari PixiJS</li>
<li>Arsitektur lebih kaku dan terarah</li>
</ul>
<p><strong>Kapan digunakan:</strong> Game 2D standar ketika Anda menginginkan fitur lengkap siap pakai, tetapi tetap ingin menulis kode.</p>
<p><strong>Tautan:</strong> <a href="https://phaser.io/" target="_blank" rel="noreferrer">Phaser</a> · <a href="https://phaser.io/learn" target="_blank" rel="noreferrer">Dokumentasi</a> · <a href="https://github.com/phaserjs/phaser" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h3 id="pixijs-v8" tabindex="-1"><a href="https://pixijs.com/" target="_blank" rel="noreferrer">PixiJS</a> (v8) <a class="header-anchor" href="#pixijs-v8" aria-label="Permalink to &quot;[PixiJS](https://pixijs.com/) (v8)&quot;"></a></h3>
<p>Pustaka rendering 2D berperforma tinggi.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Performa rendering yang luar biasa</li>
<li>Ukuran sangat kecil (~200 KB)</li>
<li>Pipeline rendering WebGL yang canggih</li>
<li>Sangat cocok untuk rendering kustom dan visualisasi</li>
<li>Format scene &quot;gl2D&quot; baru dan pustaka engine game sedang dikembangkan</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Bukan engine game: tidak memiliki fisika, audio, atau pengelolaan scene</li>
<li>Memerlukan lebih banyak penyiapan</li>
<li>Anda harus membuat (atau mengintegrasikan) logika game sendiri</li>
</ul>
<p><strong>Kapan digunakan:</strong> Aplikasi dengan grafis intensif, kebutuhan rendering kustom, proyek yang sangat mementingkan performa, atau ketika membuat engine sendiri.</p>
<p><strong>Tautan:</strong> <a href="https://pixijs.com/" target="_blank" rel="noreferrer">PixiJS</a> · <a href="https://pixijs.com/guides" target="_blank" rel="noreferrer">Dokumentasi</a> · <a href="https://github.com/pixijs/pixijs" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h3 id="excalibur-js" tabindex="-1"><a href="https://excaliburjs.com/" target="_blank" rel="noreferrer">Excalibur.js</a> <a class="header-anchor" href="#excalibur-js" aria-label="Permalink to &quot;[Excalibur.js](https://excaliburjs.com/)&quot;"></a></h3>
<p>Engine game 2D yang mengutamakan TypeScript dengan arsitektur ECS.</p>
<p><strong>Kelebihan:</strong></p>
<ul>
<li>Dibuat dengan TypeScript</li>
<li>Arsitektur Entity-Component-System</li>
<li>Tilemap, sprite nine-slice, partikel GPU</li>
<li>UI berbasis HTML yang menyesuaikan skala dengan canvas</li>
<li>Keseimbangan yang baik antara fitur dan kontrol</li>
</ul>
<p><strong>Keterbatasan:</strong></p>
<ul>
<li>Belum mencapai versi 1.0 (beberapa API mungkin berubah)</li>
<li>Ekosistem lebih kecil dan tutorial lebih sedikit</li>
<li>Fisika dan pencahayaan masih terus dikembangkan</li>
</ul>
<p><strong>Kapan digunakan:</strong> Developer TypeScript yang membuat game 2D dan menginginkan struktur lebih lengkap daripada PixiJS, tetapi dengan overhead lebih rendah daripada Phaser.</p>
<p><strong>Tautan:</strong> <a href="https://excaliburjs.com/" target="_blank" rel="noreferrer">Excalibur.js</a> · <a href="https://excaliburjs.com/docs/" target="_blank" rel="noreferrer">Dokumentasi</a> · <a href="https://github.com/excaliburjs/Excalibur" target="_blank" rel="noreferrer">GitHub</a></p>
<hr>
<h2 id="panduan-memilih" tabindex="-1">Panduan Memilih <a class="header-anchor" href="#panduan-memilih" aria-label="Permalink to &quot;Panduan Memilih&quot;"></a></h2>
<h3 id="berdasarkan-jenis-proyek" tabindex="-1">Berdasarkan Jenis Proyek <a class="header-anchor" href="#berdasarkan-jenis-proyek" aria-label="Permalink to &quot;Berdasarkan Jenis Proyek&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Proyek</th>
<th>Engine yang Direkomendasikan</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Game web seluler 2D kasual</strong></td>
<td>Defold, Phaser, Construct</td>
</tr>
<tr>
<td><strong>Game 2D kompleks dengan kebutuhan kustom</strong></td>
<td>PixiJS, Excalibur.js</td>
</tr>
<tr>
<td><strong>Game web 3D</strong></td>
<td>PlayCanvas, Godot (Compatibility), Cocos Creator</td>
</tr>
<tr>
<td><strong>Lintas platform (web + native)</strong></td>
<td>Unity, Godot, Cocos Creator</td>
</tr>
<tr>
<td><strong>Platform mini-game (WeChat, TikTok)</strong></td>
<td>Cocos Creator</td>
</tr>
<tr>
<td><strong>Visualisasi fidelitas tinggi</strong></td>
<td>Unreal (Pixel Streaming), PlayCanvas</td>
</tr>
<tr>
<td><strong>Tanpa kode / pemula</strong></td>
<td>Construct, GDevelop</td>
</tr>
<tr>
<td><strong>Wajib sumber terbuka</strong></td>
<td>Godot, Phaser, PixiJS, Excalibur.js, Cocos (engine)</td>
</tr>
</tbody>
</table>
<h3 id="berdasarkan-prioritas" tabindex="-1">Berdasarkan Prioritas <a class="header-anchor" href="#berdasarkan-prioritas" aria-label="Permalink to &quot;Berdasarkan Prioritas&quot;"></a></h3>
<table tabindex="0">
<thead>
<tr>
<th>Prioritas</th>
<th>Pilihan Terbaik</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Ukuran build terkecil</strong></td>
<td>Defold, PixiJS, Excalibur.js</td>
</tr>
<tr>
<td><strong>Waktu pemuatan tercepat</strong></td>
<td>Defold, Phaser, JavaScript vanilla</td>
</tr>
<tr>
<td><strong>Dukungan 3D terbaik</strong></td>
<td>PlayCanvas, Unity, Cocos Creator</td>
</tr>
<tr>
<td><strong>Dukungan 2D terbaik</strong></td>
<td>Godot, Phaser, Construct, Cocos Creator</td>
</tr>
<tr>
<td><strong>Gratis &amp; sumber terbuka</strong></td>
<td>Godot, Phaser, PixiJS, Defold, Cocos (engine)</td>
</tr>
<tr>
<td><strong>Dukungan WebGPU</strong></td>
<td>PlayCanvas (paling matang), Three.js (opsional), Construct, Cocos Creator</td>
</tr>
<tr>
<td><strong>Performa browser seluler</strong></td>
<td>Defold, Phaser, PlayCanvas, Cocos Creator</td>
</tr>
<tr>
<td><strong>Platform mini-game</strong></td>
<td>Cocos Creator</td>
</tr>
</tbody>
</table>
<hr>
<h2 id="realitas-performa-game-web" tabindex="-1">Realitas Performa Game Web <a class="header-anchor" href="#realitas-performa-game-web" aria-label="Permalink to &quot;Realitas Performa Game Web&quot;"></a></h2>
<p>Apa pun engine yang Anda pilih, faktor-faktor berikut lebih penting:</p>
<ol>
<li><strong>Ukuran aset</strong>: Kompres tekstur dan audio, serta minimalkan dependensi</li>
<li><strong>Scene pertama</strong>: Buat unduhan awal tetap kecil, lalu streaming sisanya</li>
<li><strong>Draw call</strong>: Batch sprite dan gunakan atlas tekstur</li>
<li><strong>Pengujian perangkat</strong>: Uji pada perangkat seluler sungguhan, bukan hanya Chrome desktop</li>
</ol>
<p>Mulai di sini: <a href="/id/tutorials/ship-web-game-fast.html">Rilis game web yang dimuat dengan cepat</a></p>
<hr>
<h2 id="catatan-kompatibilitas-browser" tabindex="-1">Catatan Kompatibilitas Browser <a class="header-anchor" href="#catatan-kompatibilitas-browser" aria-label="Permalink to &quot;Catatan Kompatibilitas Browser&quot;"></a></h2>
<table tabindex="0">
<thead>
<tr>
<th>Fitur</th>
<th>Chrome</th>
<th>Firefox</th>
<th>Safari</th>
<th>Seluler</th>
</tr>
</thead>
<tbody>
<tr>
<td>WebGL 2.0</td>
<td>✅</td>
<td>✅</td>
<td>✅</td>
<td>✅</td>
</tr>
<tr>
<td>WebGPU</td>
<td>✅</td>
<td>✅ Windows/macOS</td>
<td>✅ Safari 26+</td>
<td>✅ iOS/iPadOS 26+</td>
</tr>
<tr>
<td>SharedArrayBuffer</td>
<td>✅ (COOP/COEP)</td>
<td>✅ (COOP/COEP)</td>
<td>⚠️</td>
<td>⚠️</td>
</tr>
<tr>
<td>Wasm SIMD</td>
<td>✅</td>
<td>✅</td>
<td>✅</td>
<td>✅</td>
</tr>
</tbody>
</table>
<p>Safari 26 (September 2025) akhirnya menghadirkan WebGPU di macOS, iPadOS, iOS, dan visionOS, sehingga WebGPU lintas browser kini menjadi kenyataan dan bukan lagi fitur khusus Chrome. Firefox masih tertinggal: WebGPU dirilis di Windows pada Firefox 141 dan hadir di macOS pada Firefox 145, tetapi build Linux dan Android masih hanya menyediakannya di Nightly, dengan Mozilla menargetkan keduanya untuk 2026. SharedArrayBuffer masih menjadi dependensi yang lebih rumit di Safari, jadi selalu lakukan pengujian pada Safari/iOS jika Anda mengandalkan threading atau menargetkan audiens luas.</p>
<hr>
<h2 id="pertanyaan-umum" tabindex="-1">Pertanyaan Umum <a class="header-anchor" href="#pertanyaan-umum" aria-label="Permalink to &quot;Pertanyaan Umum&quot;"></a></h2>
<h3 id="apa-engine-game-terbaik-untuk-game-browser" tabindex="-1">Apa engine game terbaik untuk game browser? <a class="header-anchor" href="#apa-engine-game-terbaik-untuk-game-browser" aria-label="Permalink to &quot;Apa engine game terbaik untuk game browser?&quot;"></a></h3>
<p>Tidak ada satu jawaban karena semuanya bergantung pada apa yang Anda buat. Untuk game 2D, Phaser dan Defold sulit dikalahkan. Keduanya ringan, terdokumentasi dengan baik, dan menghasilkan build kecil yang dimuat dengan cepat. Untuk 3D di browser, PlayCanvas dan Three.js memberi Anda kontrol paling besar tanpa beban berlebih dari engine desktop lengkap. Jika Anda memerlukan dukungan lintas platform dan web hanya menjadi target sekunder, Unity atau Godot dapat mengekspor ke WebGL, tetapi ukuran unduhannya lebih besar. Kami membuat <a href="/id/engine.html">Cinevva Engine</a> di atas Three.js karena sejak awal kami menginginkan sumber terbuka dan pendekatan yang mengutamakan web.</p>
<h3 id="bisakah-unity-mengekspor-ke-web" tabindex="-1">Bisakah Unity mengekspor ke web? <a class="header-anchor" href="#bisakah-unity-mengekspor-ke-web" aria-label="Permalink to &quot;Bisakah Unity mengekspor ke web?&quot;"></a></h3>
<p>Ya, Unity dapat mengekspor build WebGL. Fitur ini berfungsi, tetapi memiliki konsekuensi. Ukuran build minimalnya sekitar 8 MB bahkan untuk proyek kosong, waktu pemuatannya terasa lebih lambat daripada engine web-native, dan dukungan browser seluler bisa kurang konsisten karena overhead memori. Jika game Anda sudah dibuat dengan Unity dan Anda menginginkan versi web, pilihan ini cukup layak. Jika Anda memulai dari awal dan secara khusus menargetkan web, engine web-native akan memberikan hasil yang lebih baik.</p>
<h3 id="apakah-godot-cocok-untuk-game-web" tabindex="-1">Apakah Godot cocok untuk game web? <a class="header-anchor" href="#apakah-godot-cocok-untuk-game-web" aria-label="Permalink to &quot;Apakah Godot cocok untuk game web?&quot;"></a></h3>
<p>Ekspor HTML5 Godot sudah solid dan terus meningkat. Engine ini gratis dan bersifat sumber terbuka, yang menjadi daya tarik besar. Ukuran build dimulai dari sekitar 9 MB tanpa kompresi (lebih kecil dengan gzip), dan Anda memperoleh dukungan 2D serta 3D yang memadai. Kendala utamanya adalah SharedArrayBuffer, yang memerlukan header server tertentu dan dapat menimbulkan masalah pada beberapa konfigurasi hosting. Bagi developer indie yang menginginkan satu basis kode untuk desktop dan web, Godot merupakan pilihan yang kuat.</p>
<h3 id="apa-engine-game-web-terkecil" tabindex="-1">Apa engine game web terkecil? <a class="header-anchor" href="#apa-engine-game-web-terkecil" aria-label="Permalink to &quot;Apa engine game web terkecil?&quot;"></a></h3>
<p>Ukuran PixiJS sekitar 200 KB, yang sangat kecil. Namun, ini adalah renderer 2D, bukan engine lengkap, sehingga Anda perlu menulis lebih banyak kode sendiri. Excalibur.js berukuran sekitar 300 KB dengan lebih banyak fitur game bawaan. Phaser berukuran sekitar 500 KB dan menyediakan framework game 2D lengkap. Untuk 3D, PlayCanvas dan Defold berada di kisaran 1-2 MB. Namun, pertanyaan sebenarnya bukan sekadar ukuran engine. Yang terpenting adalah ukuran total build termasuk aset Anda, dan di sinilah optimasi lebih penting daripada pilihan engine.</p>
<h3 id="manakah-engine-game-terbaik-untuk-2026" tabindex="-1">Manakah engine game terbaik untuk 2026? <a class="header-anchor" href="#manakah-engine-game-terbaik-untuk-2026" aria-label="Permalink to &quot;Manakah engine game terbaik untuk 2026?&quot;"></a></h3>
<p>Itu bergantung pada apa yang Anda rilis. Untuk 3D yang mengutamakan web, PlayCanvas merupakan pilihan terkuat pada 2026. Untuk 2D, Defold dan Phaser unggul dalam waktu pemuatan dan komunitas. Jika Anda memerlukan satu basis kode untuk web dan native, Godot (gratis) atau Unity (build lebih besar) merupakan pilihan yang masuk akal. Tidak ada engine &quot;terbaik&quot; yang berlaku universal, hanya engine yang paling sesuai dengan ukuran build, platform, dan tingkat keahlian Anda. Kami membuat <a href="/id/engine.html">Cinevva Engine</a> di atas Three.js karena sejak awal kami menginginkan sumber terbuka dan pendekatan yang mengutamakan web.</p>
<h3 id="apa-saja-engine-game-2d-terbaik-untuk-2026" tabindex="-1">Apa saja engine game 2D terbaik untuk 2026? <a class="header-anchor" href="#apa-saja-engine-game-2d-terbaik-untuk-2026" aria-label="Permalink to &quot;Apa saja engine game 2D terbaik untuk 2026?&quot;"></a></h3>
<p>Defold, Phaser, dan Construct merupakan engine 2D terbaik untuk web pada 2026. Defold menghasilkan build terkecil dengan waktu pemuatan tercepat. Phaser adalah framework HTML5 terpopuler dengan ekosistem terbesar. Construct memungkinkan Anda membuat game 2D secara visual tanpa kode. Untuk rendering kustom, PixiJS dan Excalibur.js memberi Anda lebih banyak kontrol dengan ukuran lebih kecil.</p>
<h3 id="apa-itu-engine-game-wasm" tabindex="-1">Apa itu engine game Wasm? <a class="header-anchor" href="#apa-itu-engine-game-wasm" aria-label="Permalink to &quot;Apa itu engine game Wasm?&quot;"></a></h3>
<p>Engine game Wasm mengompilasi game Anda ke WebAssembly, format biner tingkat rendah yang berjalan di browser dengan kecepatan mendekati native. Godot, Defold, dan Cocos Creator semuanya menggunakan WebAssembly untuk ekspor web mereka, sehingga performanya jauh lebih baik daripada engine lama yang hanya menggunakan JavaScript. Wasm kini menjadi standar untuk game browser serius pada 2026.</p>
<h3 id="apa-saja-engine-game-terpopuler-pada-2026" tabindex="-1">Apa saja engine game terpopuler pada 2026? <a class="header-anchor" href="#apa-saja-engine-game-terpopuler-pada-2026" aria-label="Permalink to &quot;Apa saja engine game terpopuler pada 2026?&quot;"></a></h3>
<p>Berdasarkan jumlah pengguna dan permintaan pekerjaan, Unity dan Unreal merupakan engine standar industri pada 2026, sementara Godot menjadi alternatif sumber terbuka dengan pertumbuhan tercepat. Untuk game yang berjalan di browser, Phaser adalah framework 2D paling populer dan PlayCanvas memimpin di ranah 3D yang mengutamakan web. Komunitas yang lebih besar berarti lebih banyak tutorial, plugin, dan jawaban saat Anda mengalami kesulitan. Namun, engine terpopuler tidak selalu paling cocok untuk proyek web karena ukuran build dan waktu muat menentukan siapa yang benar-benar dapat bermain.</p>
<h3 id="apa-saja-engine-game-gratis-terbaik-pada-2026" tabindex="-1">Apa saja engine game gratis terbaik pada 2026? <a class="header-anchor" href="#apa-saja-engine-game-gratis-terbaik-pada-2026" aria-label="Permalink to &quot;Apa saja engine game gratis terbaik pada 2026?&quot;"></a></h3>
<p>Godot adalah engine gratis paling lengkap untuk 2026. Godot sepenuhnya bersifat sumber terbuka di bawah lisensi MIT, tanpa batas pendapatan atau biaya per pengguna, serta mendukung 2D dan 3D. Khusus untuk web, Phaser, PixiJS, Defold, dan Excalibur.js juga gratis dan bersifat sumber terbuka. Unity dan Construct memiliki paket gratis dengan sejumlah batasan, sedangkan Unreal gratis hingga pendapatan mencapai $1 juta. Jika Anda menginginkan pilihan tanpa biaya dan tanpa syarat tersembunyi, pilih Godot atau salah satu framework JavaScript sumber terbuka.</p>
<h3 id="apa-engine-game-terbaik-untuk-pemula-pada-2026" tabindex="-1">Apa engine game terbaik untuk pemula pada 2026? <a class="header-anchor" href="#apa-engine-game-terbaik-untuk-pemula-pada-2026" aria-label="Permalink to &quot;Apa engine game terbaik untuk pemula pada 2026?&quot;"></a></h3>
<p>Untuk pemula pada 2026, GDevelop dan Construct adalah titik awal termudah karena Anda dapat membuat game secara visual dengan sedikit atau tanpa kode. Jika Anda ingin belajar pemrograman sekaligus desain game, Godot memiliki bahasa skrip yang mudah dipelajari dan koleksi tutorial gratis yang sangat besar. Khusus untuk game web 2D, Phaser cukup mudah digunakan setelah Anda memahami dasar-dasar JavaScript. Mulailah dengan engine yang sesuai dengan seberapa banyak kode yang ingin Anda tulis, lalu beralih ke opsi yang lebih canggih seiring berkembangnya proyek Anda.</p>
<hr>
<h2 id="ringkasan" tabindex="-1">Ringkasan <a class="header-anchor" href="#ringkasan" aria-label="Permalink to &quot;Ringkasan&quot;"></a></h2>
<ul>
<li><strong>Untuk sebagian besar game web</strong>: Mulailah dengan Defold, Phaser, atau PlayCanvas, tergantung kebutuhan 2D atau 3D</li>
<li><strong>Untuk lintas platform</strong>: Unity, Godot, atau Cocos Creator, dengan konsekuensi ukuran build yang lebih besar</li>
<li><strong>Untuk platform mini-game</strong>: Cocos Creator (WeChat, TikTok, Taobao)</li>
<li><strong>Untuk kendali maksimal</strong>: PixiJS atau Excalibur.js</li>
<li><strong>Untuk nonprogrammer</strong>: Construct atau GDevelop</li>
<li><strong>Untuk 3D dengan fidelitas tinggi</strong>: PlayCanvas atau Pixel Streaming</li>
</ul>
<p>Engine terbaik adalah engine yang membantu Anda merilis game. Mulailah dari proyek kecil, lakukan profiling sejak dini, dan prioritaskan pengoptimalan waktu muat di atas segalanya.</p>
<BuildCta
  title="Tidak ingin memilih engine sama sekali?"
  desc="Jelaskan game Anda dalam satu kalimat dan mainkan sekitar satu menit kemudian, gratis."
  prompt="Buat platformer 3D dengan platform bergerak dan penghitung waktu" />
<h2 id="terkait" tabindex="-1">Terkait <a class="header-anchor" href="#terkait" aria-label="Permalink to &quot;Terkait&quot;"></a></h2>
<ul>
<li><a href="/id/guides/vibe-coding-game-prompts.html">100 Ide Prompt Game AI yang Dapat Anda Buat dengan Sekali Klik</a> — ambil sebuah ide dan jadikan dapat dimainkan sekitar satu menit kemudian</li>
<li><a href="/id/guides/godot-vs-unity-web-games.html">Godot vs Unity untuk Game Web</a> — perbandingan langsung dua engine lengkap terbesar untuk web</li>
<li><a href="/id/guides/unity-alternatives-web-games.html">Alternatif Unity untuk Game Web</a> — meninggalkan Unity? pilih engine web berdasarkan alasan Anda beralih</li>
<li><a href="/id/guides/open-source-game-engines-2026.html">Engine Game Sumber Terbuka Terbaik untuk 2026</a> — engine gratis tanpa biaya yang dapat Anda fork dan gunakan untuk merilis game</li>
<li><a href="/id/guides/best-2d-game-engines-2026.html">Engine Game 2D Terbaik untuk 2026</a> — jika game Anda 2D, mulailah dari sini</li>
<li><a href="/id/guides/playcanvas-vs-threejs.html">PlayCanvas vs Three.js</a> — engine vs pustaka untuk 3D web</li>
<li><a href="/id/guides/threejs-vs-babylonjs.html">Three.js vs Babylon.js</a> — dua pustaka 3D web terbesar</li>
<li><a href="/id/guides/construct-vs-gdevelop.html">Construct vs GDevelop</a> — perbandingan dua platform 2D tanpa kode</li>
<li><a href="/id/guides/web-games-stack-2026.html">Stack Teknologi Game Web pada 2026</a> — WebGL vs WebGPU vs Wasm pada tingkat API</li>
<li><a href="/id/tutorials/canvas-2d-game-loop.html">Game loop Canvas 2D</a> — buat game tanpa engine apa pun</li>
<li><a href="/id/guides/game-jams-hackathons.html">Game Jam &amp; Hackathon</a> — memilih engine untuk keterbatasan game jam 48 jam</li>
<li><a href="/id/tutorials/game-physics-libraries.html">Pustaka fisika game</a> — engine fisika yang dapat dipasang ke framework mana pun di atas</li>
<li><a href="/id/guides/frontier-gen-ai-models.html">Model AI Generatif Sumber Terbuka Terbaik untuk Game</a> — model AI untuk menghasilkan aset 3D, seni, dan audio bagi engine apa pun yang Anda pilih</li>
<li><a href="/id/guides/itch-io-launch-guide.html">Cara Meluncurkan Game Anda di itch.io</a> — distribusi game web setelah Anda memilih engine</li>
</ul>
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/web-game-engines-comparison.jpg?v=2" length="0" type="image/jpg"/>
        </item>
        <item>
            <title><![CDATA[Stack Teknologi Game Web pada 2026]]></title>
            <link>https://app.cinevva.com/id/guides/web-games-stack-2026</link>
            <guid>https://app.cinevva.com/id/guides/web-games-stack-2026</guid>
            <pubDate>Sun, 18 Jan 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Panduan praktis tentang WebGL, WebGPU, dan WebAssembly untuk pengembang game web, lengkap dengan contoh kode nyata dan kerangka pengambilan keputusan.]]></description>
            <content:encoded><![CDATA[<h1 id="stack-teknologi-game-web-pada-2026" tabindex="-1">Stack Teknologi Game Web pada 2026 <a class="header-anchor" href="#stack-teknologi-game-web-pada-2026" aria-label="Permalink to &quot;Stack Teknologi Game Web pada 2026&quot;"></a></h1>
<p>Tiga teknologi menggerakkan game web: WebGL, WebGPU, dan WebAssembly. Masing-masing menyelesaikan masalah yang berbeda dan memiliki kompromi tersendiri. Panduan ini membantu Anda memilih berdasarkan apa yang benar-benar sedang Anda buat, bukan apa yang paling ramai dibicarakan.</p>
<h2 id="jawaban-singkat" tabindex="-1">Jawaban Singkat <a class="header-anchor" href="#jawaban-singkat" aria-label="Permalink to &quot;Jawaban Singkat&quot;"></a></h2>
<p>WebGL 2.0 berfungsi di mana-mana dan mampu menangani sebagian besar game dengan baik. Gunakan saat Anda membutuhkan kompatibilitas luas, terutama di perangkat seluler. WebGPU menyediakan compute shader dan performa yang lebih baik, tetapi Anda akan kehilangan pengguna yang memakai browser dan perangkat lama. WebAssembly mempercepat kode CPU, sehingga berguna untuk fisika dan pencarian jalur, tetapi tidak akan membantu jika hambatannya ada pada GPU.</p>
<p>Pada 2026, sebagian besar game dirilis dengan WebGL dan menyediakan WebGPU sebagai opsi untuk browser yang mendukungnya. Wasm digunakan secara selektif untuk bagian kode yang paling intensif, bukan untuk keseluruhan game.</p>
<h2 id="webgl-2-0-pilihan-membosankan-yang-berfungsi" tabindex="-1">WebGL 2.0: Pilihan Membosankan yang Berfungsi <a class="header-anchor" href="#webgl-2-0-pilihan-membosankan-yang-berfungsi" aria-label="Permalink to &quot;WebGL 2.0: Pilihan Membosankan yang Berfungsi&quot;"></a></h2>
<p>WebGL 2.0 telah stabil sejak 2017. Semua browser modern mendukungnya. Game Anda dapat berjalan di Chrome, Firefox, Safari, dan Edge, termasuk versi dari lebih dari 5 tahun lalu. Teknologi ini berfungsi di iOS Safari 15+, Chrome untuk Android, dan Samsung Internet. Bahkan browser konsol seperti Xbox Edge dan browser PlayStation juga dapat menjalankannya.</p>
<p>Berikut tampilan konfigurasi dasar WebGL 2:</p>
<div class="language-javascript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> canvas</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> document.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getElementById</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'game'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> gl</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> canvas.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getContext</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgl2'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">!</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">gl) {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Fallback to WebGL 1 or show error</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> gl1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> canvas.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getContext</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgl'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">!</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">gl1) {</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    showError</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Browser Anda tidak mendukung WebGL.'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Now you have a GL context</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">gl.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">clearColor</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">gl.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">clear</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(gl.</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">COLOR_BUFFER_BIT</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span></code></pre>
</div><h3 id="yang-anda-dapatkan" tabindex="-1">Yang Anda Dapatkan <a class="header-anchor" href="#yang-anda-dapatkan" aria-label="Permalink to &quot;Yang Anda Dapatkan&quot;"></a></h3>
<p>WebGL 2 menyediakan instanced rendering sehingga Anda dapat menggambar ribuan objek dengan satu draw call. Tersedia transform feedback untuk sistem partikel dan simulasi di sisi GPU. Anda juga mendapatkan beberapa render target untuk deferred rendering dan G-buffer, tekstur 3D untuk efek volumetrik, serta tekstur integer untuk penyimpanan data yang presisi.</p>
<div class="language-javascript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">gl.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">drawArraysInstanced</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(gl.</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">TRIANGLES</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, vertexCount, instanceCount);</span></span></code></pre>
</div><h3 id="yang-tidak-anda-dapatkan" tabindex="-1">Yang Tidak Anda Dapatkan <a class="header-anchor" href="#yang-tidak-anda-dapatkan" aria-label="Permalink to &quot;Yang Tidak Anda Dapatkan&quot;"></a></h3>
<p>Anda tidak dapat menjalankan compute shader untuk komputasi GPU serbaguna. Tidak ada bindless texture, sehingga Anda dibatasi oleh jumlah unit tekstur. Tidak ada persistent mapping atau kontrol memori eksplisit. Tidak ada mesh shader atau pipeline geometri modern.</p>
<p>Untuk sebagian besar game 2D dan banyak game 3D, keterbatasan ini tidak menjadi masalah. Beberapa game web paling sukses yang pernah dibuat dirilis menggunakan WebGL 2.</p>
<h2 id="webgpu-saat-anda-membutuhkan-lebih-banyak" tabindex="-1">WebGPU: Saat Anda Membutuhkan Lebih Banyak <a class="header-anchor" href="#webgpu-saat-anda-membutuhkan-lebih-banyak" aria-label="Permalink to &quot;WebGPU: Saat Anda Membutuhkan Lebih Banyak&quot;"></a></h2>
<p>WebGPU dirancang berdasarkan cara kerja GPU modern yang sebenarnya. Chrome merilis dukungannya pada Mei 2023, dan pada akhir 2025 semua browser utama telah mendukungnya. Chrome 113+, Safari 26+, dan Edge 113+ dapat menggunakannya, sementara Firefox mengaktifkannya pada versi 141+ di Windows (sejak Juli 2025) dan versi 145 untuk macOS dengan Apple Silicon, dengan dukungan untuk Linux dan Android yang masih diluncurkan secara bertahap. Chrome Android mendukungnya pada perangkat terbaru, begitu pula iOS Safari 26+.</p>
<p>Kendalanya adalah perangkat dan browser lama tidak mendukungnya, sehingga Anda memerlukan strategi fallback.</p>
<h3 id="yang-anda-dapatkan-1" tabindex="-1">Yang Anda Dapatkan <a class="header-anchor" href="#yang-anda-dapatkan-1" aria-label="Permalink to &quot;Yang Anda Dapatkan&quot;"></a></h3>
<p>Compute shader memungkinkan Anda menjalankan komputasi GPU serbaguna untuk fisika, partikel, AI, dan pemrosesan gambar.</p>
<div class="language-javascript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// A compute shader that processes data in parallel</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> computeShaderCode</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> `</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">@group(0) @binding(0) var&#x3C;storage, read_write> data: array&#x3C;f32>;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">@compute @workgroup_size(64)</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">fn main(@builtin(global_invocation_id) id: vec3&#x3C;u32>) {</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  data[id.x] = data[id.x] * 2.0;</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">}</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span></code></pre>
</div><p>Anda juga mendapatkan pengelolaan resource secara eksplisit, yang berarti lebih sedikit kejutan dalam performa, render bundle untuk merekam draw call terlebih dahulu agar dapat digunakan berulang kali, serta WGSL sebagai bahasa shader modern yang dirancang untuk GPU, bukan sekadar solusi tambal-sulam bergaya C.</p>
<h3 id="konfigurasi-webgpu-yang-praktis" tabindex="-1">Konfigurasi WebGPU yang Praktis <a class="header-anchor" href="#konfigurasi-webgpu-yang-praktis" aria-label="Permalink to &quot;Konfigurasi WebGPU yang Praktis&quot;"></a></h3>
<p>Berikut cara menginisialisasi WebGPU dengan fallback ke WebGL:</p>
<div class="language-javascript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">async</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> initGraphics</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">canvas</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Try WebGPU first</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (navigator.gpu) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> adapter</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> navigator.gpu.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">requestAdapter</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (adapter) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> device</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> adapter.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">requestDevice</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> context</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> canvas.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getContext</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgpu'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      </span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      context.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">configure</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        device,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        format: navigator.gpu.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getPreferredCanvasFormat</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(),</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      });</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      </span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgpu'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, device, context };</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Fall back to WebGL 2</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> gl</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> canvas.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getContext</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgl2'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (gl) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgl2'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, gl };</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  </span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">  // Last resort: WebGL 1</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> gl1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> canvas.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getContext</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgl'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (gl1) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'webgl'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, gl: gl1 };</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  </span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  throw</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Error</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Tidak ada API grafis yang tersedia'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><h3 id="kapan-teknologi-ini-benar-benar-membantu" tabindex="-1">Kapan Teknologi Ini Benar-Benar Membantu <a class="header-anchor" href="#kapan-teknologi-ini-benar-benar-membantu" aria-label="Permalink to &quot;Kapan Teknologi Ini Benar-Benar Membantu&quot;"></a></h3>
<p>WebGPU sangat unggul ketika Anda membutuhkan compute shader untuk memperbarui jutaan partikel tanpa bolak-balik ke CPU, deteksi tabrakan dan simulasi kain yang diakselerasi GPU, pembuatan prosedural untuk medan, tekstur, atau mesh, efek pascapemrosesan kompleks seperti SSAO, bloom, dan depth of field, atau saat Anda ingin menjalankan model terlatih untuk perilaku NPC atau efek gambar.</p>
<p>Jika Anda membuat game teka-teki atau novel visual, WebGPU tidak akan banyak membantu. Jika Anda membuat game aksi dengan banyak partikel atau dunia 3D yang kompleks, peningkatan ini mungkin sepadan dengan kompromi kompatibilitasnya.</p>
<h2 id="webassembly-kode-cpu-yang-cepat" tabindex="-1">WebAssembly: Kode CPU yang Cepat <a class="header-anchor" href="#webassembly-kode-cpu-yang-cepat" aria-label="Permalink to &quot;WebAssembly: Kode CPU yang Cepat&quot;"></a></h2>
<p>WebAssembly menjalankan kode terkompilasi dengan kecepatan mendekati native. Teknologi ini bukan tentang grafis, melainkan tentang mempercepat kode CPU Anda.</p>
<h3 id="kapan-teknologi-ini-membantu" tabindex="-1">Kapan Teknologi Ini Membantu <a class="header-anchor" href="#kapan-teknologi-ini-membantu" aria-label="Permalink to &quot;Kapan Teknologi Ini Membantu&quot;"></a></h3>
<p>Wasm cocok digunakan untuk engine fisika (Box2D, Bullet, dan Rapier semuanya memiliki build Wasm), pencarian jalur pada grid besar, dekompresi aset, emulasi konsol game lama, serta memindahkan codebase C++ atau Rust yang sudah ada ke web.</p>
<h3 id="kapan-teknologi-ini-tidak-membantu" tabindex="-1">Kapan Teknologi Ini Tidak Membantu <a class="header-anchor" href="#kapan-teknologi-ini-tidak-membantu" aria-label="Permalink to &quot;Kapan Teknologi Ini Tidak Membantu&quot;"></a></h3>
<p>GPU tidak peduli apakah draw call berasal dari JavaScript atau Wasm, sehingga rendering tidak akan menjadi lebih cepat. Kode yang dibatasi oleh I/O, seperti pengambilan aset atau permintaan jaringan, juga tidak akan mendapatkan manfaat. Jika JavaScript Anda sudah berjalan dalam waktu kurang dari satu milidetik, Wasm pun tidak akan banyak membantu.</p>
<h3 id="contoh-wasm-yang-praktis" tabindex="-1">Contoh Wasm yang Praktis <a class="header-anchor" href="#contoh-wasm-yang-praktis" aria-label="Permalink to &quot;Contoh Wasm yang Praktis&quot;"></a></h3>
<p>Berikut fungsi Rust minimal yang dikompilasi menjadi Wasm untuk fisika:</p>
<div class="language-rust vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">rust</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// src/lib.rs</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">#[no_mangle]</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">pub</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> extern</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> "C"</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> fn</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> step_physics</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(dt</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> f32</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) {</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">    // Your physics code here</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><p>Kompilasi dengan:</p>
<div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">wasm-pack</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> build</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> --target</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> web</span></span></code></pre>
</div><p>Gunakan dalam JavaScript:</p>
<div class="language-javascript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> init, { step_physics } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> './physics_bg.wasm'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">await</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> init</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> gameLoop</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">dt</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) {</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">  step_physics</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(dt); </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D">// Runs at near-native speed</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">  render</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">();</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">  requestAnimationFrame</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(gameLoop);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span></code></pre>
</div><h3 id="threading-menjadi-rumit" tabindex="-1">Threading Menjadi Rumit <a class="header-anchor" href="#threading-menjadi-rumit" aria-label="Permalink to &quot;Threading Menjadi Rumit&quot;"></a></h3>
<p>Wasm dapat menggunakan thread untuk pemrosesan paralel, tetapi hal ini memerlukan <code>SharedArrayBuffer</code>, yang berarti Anda perlu memasang header isolasi lintas origin di server:</p>
<div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span>Cross-Origin-Opener-Policy: same-origin</span></span>
<span class="line"><span>Cross-Origin-Embedder-Policy: require-corp</span></span></code></pre>
</div><p>Header ini dapat merusak berbagai hal. iframe pihak ketiga tanpa header CORP berhenti berfungsi, beberapa skrip analitik bermasalah, dan popup OAuth dapat gagal. Anda dapat menggunakan <code>credentialless</code> sebagai pengganti <code>require-corp</code> untuk mengurangi dampaknya, tetapi penerapannya tetap merepotkan.</p>
<p>Jika Anda tidak dapat mengatur header ini karena menggunakan shared hosting atau itch.io, Anda tidak dapat memakai thread Wasm. Namun, Wasm single-thread tetap berfungsi dengan baik.</p>
<h2 id="keputusan-nyata-untuk-game-nyata" tabindex="-1">Keputusan Nyata untuk Game Nyata <a class="header-anchor" href="#keputusan-nyata-untuk-game-nyata" aria-label="Permalink to &quot;Keputusan Nyata untuk Game Nyata&quot;"></a></h2>
<p>Jika Anda membuat platformer 2D, gunakan WebGL 2 melalui sesuatu seperti Phaser atau PixiJS. Lewati WebGPU karena terlalu berlebihan, dan lewati Wasm karena JavaScript sudah cukup cepat untuk fisika 2D. Kompatibilitas luas lebih penting daripada fitur terbaru, dan hambatan Anda adalah konten, bukan teknologi.</p>
<p>Jika Anda membuat dunia terbuka 3D, mulailah dengan WebGL 2, tetapi rancang jalur peningkatan ke WebGPU. Pertimbangkan Wasm untuk fisika menggunakan Rapier atau Bullet. Saat ini Anda menginginkan jangkauan seluas mungkin, tetapi compute shader nantinya akan membantu untuk vegetasi, partikel, dan LOD. Fisika dalam Wasm menjaga penggunaan CPU tetap rendah.</p>
<p>Jika Anda memindahkan engine C++, gunakan Wasm melalui Emscripten. Grafis akan menggunakan WebGL 2 secara default, atau WebGPU jika engine Anda mendukungnya. Kodenya sudah tersedia dan Emscripten menangani proses penerjemahannya.</p>
<p>Jika Anda membuat game teka-teki, gunakan Canvas 2D atau WebGL 2 melalui Phaser. Lewati yang lainnya. Game sederhana sebaiknya tetap sederhana.</p>
<p>Jika Anda benar-benar membutuhkan performa maksimum dan bersedia kehilangan sebagian pengguna dengan browser lama, pilih WebGPU ditambah Wasm. Pastikan Anda mengukur dampak sebenarnya terhadap audiens sebelum berkomitmen.</p>
<h2 id="hal-yang-benar-benar-membuat-game-menjadi-cepat" tabindex="-1">Hal yang Benar-Benar Membuat Game Menjadi Cepat <a class="header-anchor" href="#hal-yang-benar-benar-membuat-game-menjadi-cepat" aria-label="Permalink to &quot;Hal yang Benar-Benar Membuat Game Menjadi Cepat&quot;"></a></h2>
<p>Berikut faktor yang menentukan apakah game web Anda berjalan dengan baik, berdasarkan urutan kepentingannya.</p>
<p>Ukuran aset menyumbang sekitar setengah dari performa yang dirasakan. Game berukuran 2 MB yang dimuat dalam 1 detik terasa lebih cepat daripada game 50 MB dengan FPS yang lebih baik. Kompres semuanya. Muat secara bertahap apa pun yang memungkinkan.</p>
<p>Draw call sangat berpengaruh untuk game 3D, mungkin sekitar 30% dari anggaran performa Anda. Gabungkan geometri Anda dalam batch. Gunakan atlas tekstur. Gunakan instancing untuk objek berulang. Hal ini jauh lebih penting daripada perbandingan WebGL dengan WebGPU.</p>
<p>Performa JavaScript mungkin menyumbang sekitar 15%. Hindari alokasi dalam loop intensif. Gunakan typed array. Lakukan profiling sebelum mengoptimalkan.</p>
<p>Pilihan API grafis? Sejujurnya, mungkin hanya 5%. Untuk sebagian besar game, pilihan API tidak sepenting cara Anda menggunakannya.</p>
<p>Jika game Anda lambat, periksa apakah Anda memuat terlalu banyak hal di awal. Kemudian periksa apakah Anda mengirim terlalu banyak draw call. Setelah itu, periksa apakah JavaScript Anda melakukan sesuatu yang tidak efisien di dalam game loop. Hanya setelah semua itu, Anda perlu mempertimbangkan apakah API grafis lain dapat membantu.</p>
<h2 id="yang-sebenarnya-akan-saya-gunakan" tabindex="-1">Yang Sebenarnya Akan Saya Gunakan <a class="header-anchor" href="#yang-sebenarnya-akan-saya-gunakan" aria-label="Permalink to &quot;Yang Sebenarnya Akan Saya Gunakan&quot;"></a></h2>
<p>Untuk game web baru yang mulai dibuat hari ini, saya akan menggunakan Three.js atau Babylon.js untuk rendering karena keduanya mengabstraksikan WebGL dan WebGPU. Untuk fisika, saya akan menggunakan Rapier (Rust yang dikompilasi menjadi Wasm) jika membutuhkan fisika 3D, atau cukup menggunakan fisika 2D bawaan engine untuk game yang lebih sederhana. Howler.js atau Web Audio API secara langsung untuk audio. Vite untuk proses build karena cepat saat pengembangan dan menghasilkan build produksi yang baik. Lalu hosting statis di Netlify, Vercel, GitHub Pages, atau itch.io.</p>
<p>Stack ini memungkinkan Anda merilis game yang berfungsi di lebih dari 98% perangkat sekaligus siap menggunakan WebGPU ketika teknologi tersebut menjadi standar.</p>
<h2 id="uji-sebelum-berkomitmen" tabindex="-1">Uji Sebelum Berkomitmen <a class="header-anchor" href="#uji-sebelum-berkomitmen" aria-label="Permalink to &quot;Uji Sebelum Berkomitmen&quot;"></a></h2>
<p>Sebelum menetapkan stack teknologi, buat prototipe kecil dan benar-benar ujilah. Periksa waktu pemuatan pada jaringan 3G menggunakan throttling Chrome DevTools. Game Anda seharusnya dapat dimainkan dalam waktu kurang dari 5 detik pada koneksi lambat. Uji performa pada ponsel Android kelas bawah, baik dengan meminjam perangkat maupun menggunakan BrowserStack. Jika dapat berjalan di sana, game tersebut dapat berjalan di mana saja. Uji secara khusus di Safari karena perbedaannya cukup besar untuk menimbulkan kejutan. Jika game Anda akan tersedia di Newgrounds atau Kongregate, ujilah di dalam iframe.</p>
<p>Pengujian ini menemukan lebih banyak masalah nyata dibandingkan perdebatan tentang WebGL versus WebGPU.</p>
<h2 id="bacaan-lebih-lanjut" tabindex="-1">Bacaan Lebih Lanjut <a class="header-anchor" href="#bacaan-lebih-lanjut" aria-label="Permalink to &quot;Bacaan Lebih Lanjut&quot;"></a></h2>
<p><a href="/id/guides/web-game-engines-comparison.html">Perbandingan Engine Game Web</a> membahas berbagai engine lengkap jika Anda tidak ingin membuat semuanya dari nol. <a href="/id/guides/threejs-usdc-tech-report.html">Three.js + USDC di Browser</a> menunjukkan cara memuat aset USD di Three.js. <a href="/id/guides/itch-io-launch-guide.html">Cara Merilis di itch.io</a> membahas proses penerbitan setelah Anda selesai membuat sesuatu.</p>
<p>Untuk tutorial praktik langsung yang membahas setiap API secara lebih mendalam:</p>
<ul>
<li><a href="/id/tutorials/webgl-fundamentals-for-games.html">Dasar-dasar WebGL untuk pengembang game</a> — shader, buffer, tekstur, dan render loop</li>
<li><a href="/id/tutorials/webgpu-getting-started.html">Memulai dengan WebGPU</a> — konfigurasi device, pipeline, dan shader WGSL</li>
<li><a href="/id/tutorials/web-workers-game-logic.html">Web Worker untuk logika game</a> — memindahkan pekerjaan ke thread latar belakang</li>
<li><a href="/id/tutorials/coop-coep-sharedarraybuffer.html">COOP/COEP dan SharedArrayBuffer</a> — header yang diperlukan untuk threading Wasm</li>
<li><a href="/id/tutorials/game-physics-libraries.html">Library fisika game</a> — Rapier, Cannon-es, Ammo.js, Matter.js, dan lainnya</li>
</ul>
<p>Stack teknologi yang tepat adalah stack yang memungkinkan Anda merilis game. Pilih yang Anda kuasai, uji sejak awal, dan optimalkan nanti.</p>
<BuildCta
  title="Lewati kerumitan stack, dapatkan hasilnya"
  desc="WebGL, fisika, dan pipeline aset sudah ditangani. Anda cukup mendeskripsikan gamenya."
  prompt="Buat arena bermain fisika 3D dengan tumpukan peti yang dapat dijatuhkan" />
]]></content:encoded>
            <enclosure url="https://cdn.cinevva.com/guides/web-games-stack-2026.jpg?v=2" length="0" type="image/jpg"/>
        </item>
    </channel>
</rss>