Masri.ID 2026 • Catatan Guru, AI, Seni Budaya, dan karya digital.

Uji ChatGPT, Gemini, dan Claude untuk Membuat App Quran Audio

Uji ChatGPT, Gemini, dan Claude untuk Membuat App Quran Audio
Eksperimen AI • App Quran Audio • HTML5

Uji Tiga AI untuk Membuat App Quran Audio: ChatGPT, Gemini, dan Claude

Saya mencoba tiga asisten AI populer untuk satu tugas yang sama: merancang aplikasi Quran Audio Mobile yang berisi 114 surah, audio MP3, ringkasan makna surah, jumlah ayat, serta keterangan Makkiyah dan Madaniyah. Tugasnya terlihat sederhana, tetapi seperti kabel charger di tas guru, begitu dicari ternyata ceritanya bisa panjang.

Ilustrasi uji tiga AI untuk membuat app Quran Audio Mobile
Ilustrasi cover artikel: eksperimen membandingkan ChatGPT, Gemini, dan Claude untuk app Quran Audio.
Catatan pembuka: artikel ini adalah catatan pengalaman pribadi, bukan penilaian resmi, bukan ranking mutlak, dan tentu bukan ajang membuat AI saling tatap sinis di ruang guru. Hasil bisa berbeda tergantung prompt, versi model, data yang diberikan, dan seberapa sabar kita memperbaiki instruksi.

Latar Belakang: Dari Ide Sederhana Menjadi App yang Lumayan Serius

Awalnya saya hanya ingin membuat daftar audio Quran dalam bentuk app sederhana: nama surah, tombol putar, selesai. Tapi setelah dipikir-pikir, kalau hanya begitu, rasanya seperti kopi tanpa gula bagi sebagian orang: tetap bisa diminum, tetapi ada yang kurang menghangatkan suasana.

Kemudian idenya berkembang. Setiap surah tidak cukup hanya ditampilkan sebagai nama dan file MP3, tetapi perlu dilengkapi ringkasan makna, jumlah ayat, serta keterangan apakah surah tersebut termasuk Makkiyah atau Madaniyah. Di sinilah pekerjaan mulai terasa seperti rapat kecil: kelihatannya sebentar, tetapi notulensinya bisa melebar.

Saya lalu menguji tiga AI: ChatGPT, Gemini, dan Claude. Ketiganya saya beri tantangan yang sama, yaitu membantu merancang app Quran Audio berbasis HTML5 yang mobile friendly, tidak memakai data dummy, dan tetap menjaga urutan audio agar tidak tertukar. Maklum, kalau Surah Al-Fatihah malah memutar file lain, itu bukan bug biasa, itu sudah masuk kategori perlu ngopi ulang.

Tantangan Utama: Bukan Sekadar Bisa Jalan, Tetapi Harus Tepat

Membuat app Quran Audio berbeda dengan membuat daftar lagu biasa. Urutan surah harus benar, nomor file harus sesuai, dan informasi tambahan seperti jumlah ayat serta kategori Makkiyah/Madaniyah harus ditampilkan dengan hati-hati. Singkatnya, ini bukan app asal klik-klik lalu "yang penting tampil", karena yang penting tampil itu biasanya hanya berlaku untuk foto profil sebelum diedit.

Dalam eksperimen ini, saya memakai pendekatan sederhana: satu halaman HTML5, tampilan mobile-first, daftar 114 surah, audio player, fitur pencarian, filter Makkiyah/Madaniyah, dan panel detail yang muncul saat salah satu surah diklik. Konsepnya seperti kartu informasi yang sopan: tidak langsung ramai, tetapi saat dibuka baru menjelaskan dengan tenang.

Saya juga menghindari klaim berlebihan. Artikel ini bukan untuk mengatakan satu AI paling sempurna dan lainnya harus pulang kampung. Tujuannya adalah melihat karakter output masing-masing AI dalam membantu pekerjaan kreatif dan teknis, karena kadang AI itu seperti rekan kerja: satu jago struktur, satu jago tampilan, satu lagi jago memberi catatan panjang sampai kita merasa sedang ikut seminar.

Data 114 surah, judul, jumlah ayat, jenis surah, ringkasan, dan link MP3.
Desain Mobile friendly, card/accordion, mini player, filter, dan search.
Ketepatan Nomor surah dan file audio tidak boleh bergeser, karena di sinilah disiplin diuji.

1. Uji ChatGPT: Rapi dalam Struktur dan Enak untuk Menyusun Data

Dalam pengujian saya, ChatGPT terasa kuat saat diminta menyusun struktur data dan menjelaskan alur aplikasi. Ketika diminta membuat data 114 surah, format JSON, dan rancangan UI, hasilnya cenderung runtut. Ini membantu ketika pekerjaan perlu dibagi antara data, tampilan, dan logika, mirip guru yang menata berkas sebelum supervisi, walaupun meja tetap saja punya misteri sendiri.

ChatGPT juga nyaman dipakai untuk menyusun artikel, prompt teknis, dan instruksi pengembangan. Dari sisi penjelasan, ia cukup mudah diarahkan agar output menjadi lebih naratif dan bisa dipahami pembaca umum. Kadang jawabannya panjang, tetapi setidaknya panjangnya masih bisa diedit, tidak seperti antrean fotokopi saat jam istirahat.

Secara resmi, ChatGPT diposisikan sebagai AI yang bisa digunakan untuk membantu mengeksplorasi ide, memecahkan masalah, dan belajar lebih cepat. Dalam konteks eksperimen ini, saya memanfaatkannya untuk merapikan rancangan, menyusun data, dan menyiapkan konsep HTML5 agar lebih siap dikembangkan.

Contoh tampilan hasil rancangan ChatGPT: mode landscape (kiri) dan portrait (kanan).
Video ilustrasi output ChatGPT

2. Uji Gemini: Menarik untuk Canvas dan Eksplorasi Tampilan

Gemini menarik karena punya ekosistem yang dekat dengan Google dan dapat membantu pekerjaan menulis, merencanakan, serta brainstorming. Untuk pembuatan app visual, Gemini Canvas bisa terasa menyenangkan karena hasil kode dapat dilihat dan diperbaiki secara interaktif. Rasanya seperti punya papan tulis digital yang tidak pernah kehabisan spidol, meski ide kita sendiri kadang tetap perlu dicas.

Dalam eksperimen app Quran Audio, Gemini cocok untuk menguji tampilan, memperbaiki layout, dan melihat hasil secara cepat. Kalau prompt sudah jelas, Gemini dapat membantu membentuk antarmuka yang lebih enak dipandang. Namun tetap perlu pengawasan pada detail data, karena tampilan bagus saja belum cukup; seperti spanduk kegiatan, desain boleh elegan, tetapi tanggal acara jangan sampai salah.

Hal yang saya suka dari pendekatan Gemini adalah proses visualnya. Untuk pekerjaan seperti app sederhana berbasis HTML5, Canvas dapat menjadi ruang eksperimen yang cepat. Namun saya tetap menyarankan data inti, seperti nomor surah dan link MP3, disiapkan secara rapi sejak awal agar AI tidak menebak-nebak seperti siswa menjawab pilihan ganda dengan "feeling B".

Contoh tampilan hasil rancangan Gemini Canvas: mode landscape (kiri) dan portrait (kanan).
Video ilustrasi output Gemini.

3. Uji Claude: Kuat untuk Penalaran dan Catatan Pengembangan

Claude dalam pengujian saya terasa kuat saat diminta berpikir sistematis, memberi catatan, dan menjaga alur logika. Untuk pekerjaan yang membutuhkan kehati-hatian, Claude sering memberi penjelasan yang rapi dan terasa seperti teman diskusi yang serius. Kadang terlalu serius, tetapi itu masih lebih baik daripada terlalu santai sampai tombol play lupa dibuat.

Claude juga cukup membantu untuk mengecek konsistensi instruksi, misalnya memastikan app tidak memakai data dummy, semua surah masuk, dan fitur yang diminta tidak hilang di tengah jalan. Dalam proyek kecil seperti ini, ketelitian semacam itu penting. Kalau tidak, nanti app terlihat cantik, tetapi saat diklik cuma diam, seperti murid yang ditanya PR.

Anthropic menjelaskan Claude sebagai AI untuk membantu menyelesaikan tantangan kompleks, menganalisis data, menulis kode, dan memikirkan pekerjaan yang sulit. Dalam eksperimen saya, karakter itu terasa saat Claude digunakan untuk membaca kebutuhan, menyusun logika, dan memberi masukan pengembangan agar app tidak hanya tampak jadi, tetapi juga lebih masuk akal untuk dirawat.

Contoh tampilan hasil rancangan Claude: mode landscape (kiri) dan portrait (kanan).
Video ilustrasi output Claude.

Perbandingan Hasil: Mana yang Paling Enak Dipakai?

Setelah dicoba, saya melihat ketiganya punya gaya berbeda. ChatGPT terasa kuat untuk menyusun konsep, data, artikel, dan instruksi pengembangan. Gemini menarik untuk eksplorasi visual melalui Canvas. Claude kuat untuk penalaran, konsistensi, dan catatan teknis. Jadi ini bukan soal siapa paling sakti, tetapi siapa paling cocok untuk bagian pekerjaan tertentu, seperti tim kecil yang semuanya penting, termasuk yang tugasnya mengingatkan "jangan lupa save".

AI Kesan Utama Cocok untuk Catatan
ChatGPT Struktur rapi, narasi kuat, dan mudah diarahkan. Menyusun data, artikel, prompt, dan kerangka app. Tetap perlu pengecekan data final, karena AI bukan pengganti ketelitian manusia, apalagi kalau sudah malam.
Gemini Menarik untuk eksperimen visual dan Canvas. Membuat prototype tampilan dan melihat hasil secara cepat. Prompt harus jelas agar data tidak bergeser, karena UI cantik tetap butuh isi yang benar.
Claude Teliti, sistematis, dan kuat dalam penalaran. Review logika, konsistensi fitur, dan catatan pengembangan. Kadang jawabannya sangat lengkap, cocok untuk yang tahan membaca sambil menyeruput kopi.

Kalau pertanyaannya "mana yang paling saya suka?", jawaban saya sementara adalah: tergantung tahap pekerjaan. Untuk menyusun ide dan narasi, saya nyaman dengan ChatGPT. Untuk menguji tampilan langsung, Gemini Canvas terasa praktis. Untuk menimbang logika dan konsistensi, Claude bisa jadi teman review yang sabar. Ini seperti memilih alat di bengkel: palu, obeng, dan kunci pas sama-sama berguna, asal jangan dipakai untuk mengaduk teh.

Eksperimen kecil ini mengingatkan saya bahwa AI terbaik bukan selalu yang paling ramai dibicarakan, tetapi yang paling cocok dengan kebutuhan, data, dan cara kerja kita.

Catatan Etis: AI Membantu, Manusia Tetap Mengarahkan

Dalam membuat app bertema Quran, saya merasa penting untuk tidak asal menyerahkan semua keputusan kepada AI. Ringkasan makna, kategori surah, dan data audio tetap perlu diperiksa. AI bisa membantu mempercepat pekerjaan, tetapi tanggung jawab akhir tetap pada manusia. Ibarat memasak rendang, kompor boleh canggih, tetapi rasa tetap harus dicicipi.

Karena itu, artikel ini tidak menyarankan pembaca menerima output AI mentah-mentah. Gunakan AI sebagai mitra kerja, bukan sebagai hakim terakhir. Untuk data keagamaan, rujukan yang lebih otoritatif tetap perlu diperhatikan. AI boleh cepat, tetapi kebenaran tidak boleh diburu seperti mengejar deadline desain malam Minggu.

Bagi saya, inilah bagian menariknya: teknologi bisa dipakai untuk membuat media belajar yang lebih mudah diakses, tetapi tetap harus diiringi adab, kehati-hatian, dan niat yang baik. Kalau tiga hal itu dijaga, app sederhana pun bisa menjadi karya yang bermanfaat, tidak sekadar file HTML yang numpang hidup di folder laptop.

Kesimpulan Sementara: Tiga AI, Tiga Karakter, Satu Tujuan

Dari uji ringan ini, saya melihat bahwa ChatGPT, Gemini, dan Claude sama-sama bisa membantu proses membuat app Quran Audio Mobile. Bedanya ada pada gaya kerja. ChatGPT kuat dalam struktur dan narasi, Gemini menarik untuk eksplorasi visual, sementara Claude membantu dalam penalaran dan konsistensi. Jadi kalau ketiganya digabung, hasilnya bisa lebih matang, asal manusianya tidak lupa memberi arahan yang jelas.

Eksperimen ini juga menjadi pengingat bahwa prompt yang baik adalah separuh dari pekerjaan. Semakin jelas data, aturan, dan tujuan yang diberikan, semakin kecil kemungkinan output AI melenceng. Kalau promptnya kabur, jangan heran kalau hasilnya ikut kabur, mirip foto dokumentasi acara yang diambil sambil lari.

Ke depan, app seperti ini bisa dikembangkan lebih jauh: ada bookmark surah, riwayat terakhir diputar, mode hafalan, pengelompokan surah pendek dan panjang, bahkan ringkasan tematik. Pelan-pelan saja, karena aplikasi yang baik tidak harus langsung megah; yang penting benar, nyaman, dan bisa dipakai. Sisanya tinggal kopi, revisi, dan sedikit doa agar bug tidak datang berjamaah.

Menurut Mitra, Output Mana yang Paling Menarik?

Saya akan lampirkan gambar dan video hasil dari ChatGPT, Gemini, dan Claude di kolom komentar. Silakan cek masing-masing output, lalu bantu pilih mana yang paling nyaman dilihat dan paling siap dikembangkan. Tenang, ini bukan pemilu AI, jadi tidak perlu kampanye akbar.

Tulis pilihan Mitra di komentar: ChatGPT, Gemini, atau Claude?

Lihat dan beri komentar
Sumber resmi yang saya rujuk:

Penutup: AI bukan pengganti proses belajar, tetapi bisa menjadi teman kerja yang mempercepat lahirnya ide. Tinggal bagaimana kita mengarahkan, memeriksa, dan menyempurnakan hasilnya. Kalau salah, jangan langsung marah ke AI; kadang prompt kita juga perlu disekolahkan dulu.