Alat & integrasiPanduan
Tambahkan efek pixel-art ke game Anda dengan skill pixelfx
Pasang skill pixelfx di Claude Code, minta frost nova, dan lihat berapa biaya sesi itu pada model murah dengan tabel biaya langsung.
Anda ingin frost nova untuk game browser Anda, dan Anda lebih memilih tidak menggambar empat puluh frame secara manual. Skill pixelfx memungkinkan Claude Code melakukannya: pasang dengan dua perintah, jelaskan efeknya dalam satu kalimat, dan agen menulis kodenya. Berapa biaya sesi itu pada model murah bergantung pada berapa banyak langkah yang diambil, jadi tabel di bawah menghitungnya dengan harga langsung untuk asumsi yang dinyatakan.
Apa itu pixelfx#
pixelfx adalah pustaka berisi 244 efek pixel-art. Menurut README-nya (github.com/patch-gg/pixelfx, dibaca pada 4 November 2026), setiap efek adalah potongan kode kecil dalam src/, dan kategorinya mulai dari api, ledakan, air dan es hingga petir, melee, holy, shadow, status, cuaca, UI dan critters. Enam puluh satu efek menggunakan karakter, dan ada 12 gerakan penuh yang merangkai beberapa efek menjadi satu.
Dua cara menggunakannya, tergantung mesin Anda:
- Game browser: gunakan kode JavaScript secara langsung. Tanpa dependensi.
- Godot atau mesin lain: ekspor efek yang Anda inginkan sebagai sprite sheet PNG dengan JSON gaya Aseprite.
Repo juga berisi skill Claude Code terpisah yang membuat efek baru. Skill itulah yang menjadi fokus panduan ini. Jika Anda belum pernah membuka file skill, apa itu agent skill dan cara memeriksanya hanya butuh lima menit dan layak dibaca sebelum Anda memasang apa pun dari sebuah repo.
Pasang skill#
Anda perlu Claude Code yang sudah diarahkan ke CheapTokens. Jika belum, lakukan itu dulu: cara menghubungkan Claude Code ke CheapTokens berisi alamat dan variabelnya. Untuk kode game dengan file panjang, pilihan yang cocok adalah DeepSeek-V4-Flash (deepseek-): hingga 32.768 token per jawaban, jendela konteks 380K, dan satu harga kapan pun. Detailnya ada di halaman model DeepSeek.
README memberikan dua cara pemasangan. Jalur plugin adalah dua perintah di dalam Claude Code:
/plugin marketplace add patch-gg/pixelfx
/plugin install pixelfx@pixelfxJalur manual adalah menyalin folder skills/pixelfx dari repo ke ~/.
Urutkan
Urutkan penyiapan dengan benar
Seret item atau gunakan panah
- Hubungkan Claude Code ke kunci CheapTokens Anda
- Tambahkan marketplace pixelfx dengan /plugin marketplace add
- Pasang skill dengan /plugin install
- Minta efek dalam bahasa biasa
Minta satu efek#
Skill ini digerakkan oleh permintaan biasa: tambah, ekspor, ubah, atau buat efek. Contoh dari README sendiri adalah titik awal terbaik. Buka folder game Anda, jalankan claude, dan ketik sesuatu seperti:
Add a frost nova to my character's ultimate.Itu seluruh prompt-nya. Skill ini dirancang untuk permintaan seperti ini: ia mengajari Claude Code untuk menemukan, menggunakan, mengekspor, dan membuat efek, dan saat membuat efek baru ia bekerja sebagai loop draf, render, lihat, perbaiki (menurut README). Perkirakan beberapa langkah alih-alih satu balasan, seperti pada sesi agen mana pun: membaca file, lalu mengedit.
Jika Anda menggunakan Godot, minta hal lain yang dijelaskan README:
Export the fire and explosions categories as sprite sheets for Godot.Anda mendapatkan PNG dengan frame dalam grid plus JSON gaya Aseprite; menurut README, importer Aseprite untuk Godot dan Unity dapat membacanya.
Satu hal yang perlu diketahui sebelum mulai. Efek yang digambar pada tubuh ditulis untuk dummy standar 24x38, jadi karakter dengan ukuran berbeda memerlukan efek tersebut dibuat ulang.
Coba sendiriCoba: hero Anda berukuran 32x48 piksel. Apakah efek tubuh akan sejajar?Tampilkan jawaban
Tidak secara langsung. Efek tubuh digambar untuk dummy 24x38, jadi minta Claude Code membuat ulang efek itu untuk ukuran karakter Anda.
Berapa biaya satu sesi#
Inilah bagian yang mengejutkan orang. Efeknya sendiri adalah file kecil. Biayanya berasal dari agen yang bekerja: pada setiap langkah Claude Code mengirim ulang file proyek yang telah dibacanya, teks skill, dan percakapan sejauh ini.
Cek cepat
Sisi mana dari sesi Claude Code yang biasanya memuat sebagian besar token?
Tampilkan jawaban
Jawaban: Input yang dikirim ulang pada setiap langkah
Setiap langkah membawa seluruh konteks kerja, jadi input menumpuk dengan cepat, sementara setiap jawaban jauh lebih pendek (pada contoh di bawah, 1.500 token dibandingkan 30.000).
Berikut asumsi yang dapat Anda ubah untuk proyek Anda sendiri: katakanlah sesi memerlukan 20 langkah, setiap langkah mengirim sekitar 30.000 token input (file, teks skill, dan riwayat) dan model menulis sekitar 1.500 token. Pada DeepSeek-V4-Flash, satu langkah seperti itu berbiaya $0.0006, dan seluruh sesi 20 langkah ada di tabel. Tabel juga menampilkan OpenRouter di samping harga kami untuk setiap model, dihitung total dengan input dan output digabungkan.
| Model | Input $/1Jt | Output $/1Jt | Per permintaan | 20 permintaan | OpenRouter, 20 permintaan |
|---|---|---|---|---|---|
| GLM-5.3-Flash | $0.02 | $0.04 | $0.00066 | $0.0132 | $0.0226 |
| DeepSeek-V4-Flash | $0.015 | $0.10 | $0.0006 | $0.012 | $0.0462 |
| MiniMax-M2.7 | $0.05 | $0.15 | $0.0017 | $0.0345 | $0.414 |
30.000 token input dan 1.500 token output per permintaan. Harga per 1 juta token adalah harga saat ini dan berubah seiring tarif kami; kolom OpenRouter menunjukkan harga referensi untuk beban kerja yang sama.
Harga per 1 juta token saat ini: input $0.015, output $0.10. Untuk penyesuaian kecil pada efek yang sudah ada, GLM-5.3-Flash memiliki konteks 390K dan hingga 8.192 token per jawaban, yang cukup untuk menyesuaikan warna atau timing.
Untuk melihat bagaimana hari yang lebih panjang dengan agen menumpuk, cara membuat Claude Code lebih murah membahas kebiasaan yang mengurangi input.
Sebelum merilis#
Kode dan efeknya berlisensi MIT. Font Patch Pixel di gallery/fonts tidak tercakup MIT (lihat NOTICE.md di repo), dan beberapa efek mengadaptasi kode MIT oleh Hugo Duprez dan Hollow Crown. Jika game Anda menyertakan font tersebut, baca NOTICE.md terlebih dahulu.
Untuk memulai dengan kunci dan daftar model Anda sendiri, lihat dokumentasi CheapTokens dan halaman harga langsung.
