LayananPaketPortofolioMarketplaceCara KerjaFAQ
Mulai project →Akun0813 4079 780
Mini App

Etalase Studio

Foto HP jadi foto katalog marketplace. Label BPOM dan halal tetap piksel asli.

Versi 1.0.1Diperbarui 30 September 202613 screenshot

Studio meja putarPanggung 3D dengan dial putar kamera dan arah cahaya, 10 adegan di kiri, antrean SKU di kanan. Kalimat di bawah panggung adalah yang dikirim ke model.1 / 13
Studio meja putar1 / 13
Etalase Studio — Studio meja putar

Panggung 3D dengan dial putar kamera dan arah cahaya, 10 adegan di kiri, antrean SKU di kanan. Kalimat di bawah panggung adalah yang dikirim ke model.

Ringkasan

Aplikasi studio foto produk untuk penjual Shopee, Tokopedia, dan TikTok Shop. Produk dipotong dari foto HP, latar dibuat dari panggung 3D atau model gambar, lalu piksel kemasan asli ditempel kembali dan diperiksa piksel demi piksel. Antrean SKU dari CSV, stiker promo berbahasa Indonesia, dan ekspor 6 ukuran kanal dalam satu ZIP per SKU.

Masalah yang diselesaikan

Foto produk yang rapi menentukan klik, tapi sewa studio mahal dan tiap SKU harus difoto ulang tiap kampanye. Generator foto AI biasa menggambar ulang produknya: tulisan komposisi jadi acak, nomor BPOM bergeser, cap halal berubah bentuk, dan listing bisa diturunkan karena gambar menyesatkan. Belum lagi ukuran yang berbeda untuk foto utama, feed, Story, dan iklan, stiker promo yang harus diketik ulang di Canva, dan biaya model yang tidak kelihatan sampai tagihan datang.

Cocok untuk
  • Penjual marketplace dengan puluhan sampai ratusan SKU makanan, minuman, dan kosmetik
  • Reseller dan dropshipper yang butuh foto seragam satu katalog
  • Agensi kecil dan studio foto yang mengerjakan katalog klien
  • Developer yang ingin menjual jasa foto produk dengan merek sendiri
Hasil yang kamu dapat
  • Kemasan tidak pernah digambar model: piksel asli ditempel, lalu dibuktikan dengan cek beda piksel
  • Sudut kamera dan arah cahaya diatur di meja putar 3D, sama untuk seluruh batch
  • Antrean SKU dari CSV, beberapa sudut per SKU, ulang otomatis maksimal 2 kali
  • Setujui massal hanya untuk foto yang labelnya utuh; tidak ada yang terbit sendiri
  • 6 ukuran kanal dirender ulang pada piksel persis, satu ZIP bernama SKU
  • Tiga cara memakai model: kunci API Anda sendiri di browser, secret di Cloudflare Worker Anda, atau .env server; kami tidak menyediakan atau menagih biaya model
Bahasa desain
Sofia Sans Extra Condensed + Work Sans · meja studio penjual marketplace: label harga tebal, presisi piksel

Fitur

Panggung 3D

  • Meja putar three.js dengan skala derajat, diputar dengan seret atau dial
  • Tiga tinggi kamera: sejajar mata, atas 45°, flat lay
  • Dial arah cahaya + tinggi cahaya, bayangan lunak bergeser halus
  • 10 adegan: studio putih, meja jati, marmer, dapur, anyaman pandan, batu alam, Lebaran, Harbolnas 11.11, 17 Agustus, Imlek
  • Pengaturan diterjemahkan jadi kalimat yang ditampilkan dan dikirim ke model
  • Tanpa WebGL: gambar sudut statis, aplikasi tetap jalan

Kemasan tetap asli

  • Potong produk dari foto berlatar polos di browser
  • Latar kosong dirender terpisah, produk ditempel dengan bayangan sesuai arah cahaya
  • Cek beda piksel di seluruh badan produk, peta merah untuk bagian yang berubah
  • Mode aman label otomatis untuk makanan, minuman, kosmetik
  • Mode AI penuh (harmonisasi cahaya) tetap diperiksa dan ditandai
  • Stiker yang menutupi kemasan ikut tertangkap

Antrean & tinjau

  • Impor CSV + foto, pemeriksaan per baris dengan pesan Indonesia
  • Tambah satu produk dengan persetujuan UU PDP
  • Konkurensi, ulang maksimal 2 kali dengan variasi baru, lanjut setelah muat ulang
  • Lembar kontak dengan saringan status
  • Setujui, tolak, ulang per foto; setujui massal hanya yang lolos cek

Ekspor & listing

  • Foto utama latar putih 1080×1080, galeri, feed 1080×1350, Story 1080×1920 dengan zona aman, iklan 1200×628, banner 1200×400
  • 8 templat stiker: diskon + harga coret, gratis ongkir, produk baru, flash sale 12.12, Lebaran, bundling, COD
  • JPEG dikompres sampai di bawah target berat per kanal
  • ZIP per SKU berisi semua ukuran + listing.txt
  • Judul Shopee/Tokopedia/TikTok Shop dengan batas karakter, deskripsi, hashtag
  • Penanda klaim terlarang: menyembuhkan, 100% aman, memutihkan permanen, dijamin, nomor 1

Kit merek & biaya

  • Logo, 3 warna, huruf judul, nada tulisan, kata terlarang
  • Model dan harga dari .env server, kunci API tidak pernah ke browser
  • Perkiraan biaya sebelum antrean jalan, batas harian di browser dan di server
  • Latar hasil model disimpan di cache browser, tidak ditagih dua kali

Animasi 3D

Konsep

Produk berdiri di meja putar 3D sungguhan dengan dua dial di atas panggung: putar kamera dan arah cahaya, seperti kenop di studio foto. Set yang sama dirender tanpa produk pada ukuran ekspor persis dan menjadi latar (Mode demo) atau gambar panduan untuk model (mode nyata). Foto produk asli ditempel setelahnya, jadi 3D mengatur sudut dan bayangan tanpa pernah menyentuh piksel kemasan.

Tanpa WebGL / gerak dikurangi

Tanpa WebGL panggung diganti gambar sudut statis per tinggi kamera, dial cahaya tetap mengubah bayangan di hasil, dan latar dirender 2D. Dengan prefers-reduced-motion kamera dan cahaya langsung melompat ke posisi baru tanpa animasi.

Screenshot

  1. 01Studio meja putarPanggung 3D dengan dial putar kamera dan arah cahaya, 10 adegan di kiri, antrean SKU di kanan. Kalimat di bawah panggung adalah yang dikirim ke model.desktop
  2. 02Cek beda pikselMode AI penuh pada sambal: bagian kemasan yang berubah ditandai merah, lengkap dengan jumlah piksel. Tiga tampilan: beda piksel, hasil saja, banding foto HP. Foto seperti ini tidak ikut disetujui massal.desktop
  3. 03Adegan Lebaran, cahaya dari kananSet musiman dengan ketupat. Memutar dial cahaya memindahkan bayangan di panggung dan di semua foto antrean berikutnya.desktop
  4. 04Lembar kontakSemua hasil batch dalam satu layar: setujui, tolak, atau ulang per foto. Foto berlatar ramai gagal dengan alasan yang jelas.desktop
  5. 05Impor CSV dengan pemeriksaanCSV katalog diperiksa per baris sebelum masuk: SKU kembar, harga bukan angka, kategori dan promo tak dikenal, format foto.desktop
  6. 06Ekspor 6 ukuranFoto utama latar putih, galeri, feed 4:5, Story 9:16 dengan zona aman, iklan lanskap, banner toko. Stiker promo digambar kode.desktop
  7. 07Judul, deskripsi, dan klaim terlarangJudul per marketplace dengan penghitung karakter. Klaim seperti dijamin menyembuhkan ditandai beserta alasannya.desktop
  8. 08Kit merek & biayaLogo, warna, huruf, nada tulisan, kata terlarang, model yang dipakai, harga per gambar, dan batas biaya harian.desktop
  9. 09Banding foto HP dan hasilGeser pembatas (mouse, sentuh, atau tombol panah) untuk membandingkan foto HP asli dengan foto katalog. Pintasan J/K/S/X untuk meninjau cepat.desktop
  10. 10Studio di ponselPanggung dan dua dial tetap bisa dipakai dengan jempol. Adegan menjadi pita swatch yang digeser ke samping, jadi panggung tetap terlihat.mobile
  11. 11Hasil dan putusan label0 piksel kemasan berubah: tombol setujui, tolak, dan buat ulang di bawah foto.mobile
  12. 12Tinjau di ponselLembar kontak dua kolom dengan saringan status.mobile
  13. 13Pratinjau ekspor di ponselSemua ukuran kanal dan zona aman Story sebelum diunduh.mobile

Cara Pasang

  1. Pasang

    Ekstrak ZIP lalu pasang dependensi.

    npm install

  2. Jalankan Mode demo

    Web di http://localhost:4415, API di port 8415. Katalog contoh 6 SKU langsung bisa dicoba.

    npm run dev

  3. Aktifkan model gambar

    Salin .env.example ke .env, isi AI_API_KEY, cek id model dan harga Rupiah, jalankan ulang.

    cp .env.example .env

  4. Produksi di VPS

    Satu proses menyajikan antarmuka dan API. Contoh nginx ada di docs/INSTALL.md.

    npm run build && SERVE_STATIC=1 npm run server

Butuh kredensial

  • Kunci API penyedia gambar (milik Anda sendiri)Berbayar

    Buat kunci di dasbor penyedia kompatibel OpenAI (misalnya FlatKey atau OpenRouter). Pilih salah satu: tempel di panel Merek > Kunci API Anda sendiri (browser langsung ke penyedia), simpan sebagai secret Cloudflare Worker (wrangler secret put AI_API_KEY), atau isi AI_API_KEY di .env server. Tanpa kunci aplikasi tetap jalan di Mode demo.

Isi Paket

  • src/: aplikasi React: studio, antrean, ekspor, kit merek, pemotong produk, cek piksel, stiker
  • src/three/: panggung meja putar dan render latar
  • server/: proxy Hono, adapter penyedia, batas biaya
  • public/samples/: katalog contoh fiktif (foto + CSV)
  • tests/: uji logika, e2e, skrip tangkapan layar
  • docs/: INSTALL, CUSTOMIZE, CARA-KERJA
  • design/: sistem desain, riset, iterasi
  • scripts/: pembuat foto contoh, poster, paket

Kustomisasi

  • Nama merek, logo, warna, huruf stiker, nada tulisan dari halaman Kit merek
  • Adegan baru (warna, lantai, properti) di presets.ts
  • Ukuran kanal dan target berat berkas
  • Teks templat stiker dan klaim terlarang
  • Id model, endpoint, harga Rupiah, dan batas harian di .env

AI in the loop

Yang dikerjakan AI

Model gambar membuat latar adegan (dan opsional menyatukan cahaya) dengan render 3D sebagai panduan sudut dan cahaya; model teks menulis draf judul dan deskripsi.

Kendali manusia

Semua hasil masuk lembar kontak sebagai draf. Anda menyetujui, menolak, atau mengulang per foto; setujui massal hanya untuk foto yang lolos cek beda piksel. Ekspor hanya memakai foto yang disetujui. Klaim terlarang ditandai, tidak dihapus diam-diam. Biaya diperkirakan sebelum jalan dan dibatasi per hari.

Penyedia model

Adapter kompatibel OpenAI, default FlatKey (router.flatkey.ai) dengan gemini-3.1-flash-image dan gemini-3.1-flash-lite-image; bisa diganti ke FLUX Kontext, Seedream, atau gpt-image lewat .env.

Hasil AI selalu berupa draf. Tidak ada yang terkirim atau tersimpan sebelum kamu menyetujuinya.

FAQ

Apakah tulisan kemasan dan nomor BPOM saya bisa berubah?

Di mode aman label (otomatis untuk makanan, minuman, kosmetik) tidak: piksel kemasan diambil langsung dari foto Anda. Setiap hasil diperiksa piksel demi piksel dan putusannya ditampilkan. Kalau ada yang berubah, misalnya tertutup stiker atau karena mode AI penuh, bagiannya ditandai merah.

Foto seperti apa yang harus saya ambil?

Foto HP biasa, produk di tengah di atas kertas, karton, atau kain polos, mengisi kira-kira sepertiga foto. Latar bermotif ditolak dengan pesan yang menjelaskan cara memperbaikinya.

Berapa biaya per foto di mode nyata?

Perkiraan default Rp 560 per draf dan Rp 1.100 per foto final (tarif Gemini 3.1 Flash Image dan Lite, kurs Rp16.500). Harga diatur di .env, ditampilkan sebelum antrean jalan, dan dibatasi per hari.

Apakah foto produk saya disimpan di server?

Tidak. Foto disimpan di browser Anda (IndexedDB). Server hanya meneruskan gambar panduan ke penyedia model dan tidak menyimpan apa pun.

Apakah ukuran ekspor sudah sesuai Shopee dan Tokopedia?

Titik awalnya 1080×1080 untuk foto utama (latar putih) dan galeri. Spesifikasi marketplace berubah, jadi semua ukuran ada di satu file konfigurasi agar mudah disesuaikan setelah Anda cek Seller Centre.

Bisa dipakai untuk foto model atau orang?

Aplikasi dirancang untuk produk. Formulir unggah meminta pernyataan izin bila ada wajah atau tubuh orang (UU PDP No. 27 Tahun 2022).

Bisa dijual sebagai layanan ke klien?

Lisensi mengizinkan satu produk akhir untuk Anda atau satu klien, termasuk dipakai komersial. Source code tidak boleh dijual ulang sebagai template.

Apakah harga produk sudah termasuk biaya AI?

Tidak. Produk dijual apa adanya dan tidak menyertakan kunci API. Anda memakai kunci dari akun penyedia sendiri, dan biaya tiap gambar ditagih penyedia langsung ke akun Anda. Meteran Rupiah dan batas harian di aplikasi membantu mengendalikannya.

Changelog

  1. v1.0.1
    30 September 2026
    • Kunci API sendiri: tempel kunci di panel Merek, browser memanggil penyedia langsung tanpa lewat server
    • Deploy ke Cloudflare Workers akun sendiri (wrangler.jsonc, secret AI_API_KEY, batas harian tersimpan di KV)
    • Logika validasi dan prompt dipakai bersama oleh server, Worker, dan browser
  2. v1.0.0
    26 September 2026
    • Rilis pertama: meja putar 3D, cek beda piksel, antrean SKU CSV, 6 ukuran kanal, stiker promo, listing, kit merek & biaya
Etalase Studio
Rp 449.000
Demo ↗