System Requirements Document for keen-kalkulator

1. Introduction

keen-kalkulator adalah aplikasi web satu halaman berbahasa Indonesia berjudul "Kalkulator Kadar Emas" yang memperkirakan kadar emas dan karat sebuah benda logam menggunakan metode berat jenis (specific gravity). Pengguna menimbang benda di udara dan di dalam air, memasukkan dua angka tersebut, memilih jenis logam campuran, lalu menerima bacaan persentase emas, perkiraan karat, berat emas, dan berat logam campuran.

Produk ini ditujukan untuk Pengguna Kalkulator Kadar Emas — pengrajin emas, pemilik toko perhiasan, dan pembeli emas bekas di Indonesia yang memegang benda kecil, menimbangnya, dan mempercayakan angka hasilnya untuk transaksi bernilai tinggi. Antarmuka dan seluruh teks produk berbahasa Indonesia.

2. System Overview

keen-kalkulator adalah aplikasi web klien-sisi murni tanpa backend, tanpa akun, dan tanpa penyimpanan data. Seluruh perhitungan berjalan di peramban pengguna. Produk terdiri dari dua halaman yang saling terhubung:

1. Landing — layar sampul anonim bertema emas batangan yang memperkenalkan estimasi kadar emas dan metode berat jenis, dengan tombol MULAI HITUNG untuk masuk ke kalkulator.
2. Kalkulator — halaman kerja yang memuat pemilihan jenis campuran, masukan pengukuran, perhitungan kadar emas, validasi, hasil rinci, dan reset.

Aktor: Satu persona manusia — Pengguna Kalkulator Kadar Emas. Tidak ada sistem, penyedia, atau layanan eksternal yang berinteraksi dengan produk.

Perilaku yang diterima: Perhitungan kadar emas berbasis model campuran dua komponen (emas + satu logam campuran), dengan pilihan tembaga (8,96 g/cm³), perak (10,49 g/cm³), timah (7,31 g/cm³), atau logam manual dengan berat jenis yang dimasukkan pengguna. Konstanta berat jenis emas murni adalah 19,32 g/cm³.

Pengecualian sempit: Produk hanya memakai model campuran dua komponen. Tidak ada model campuran tiga komponen atau lebih, tidak ada akun pengguna, tidak ada riwayat perhitungan, tidak ada ekspor/impor data, dan tidak ada integrasi perangkat timbangan.

2a. Product Interpretation and Delivery Boundary

keen-kalkulator adalah alat hitung mandiri yang seluruhnya berjalan di sisi klien. Pengguna membuka halaman, melihat layar sampul, menekan MULAI HITUNG, dan langsung bekerja di kalkulator tanpa perlu mendaftar, masuk, atau memberikan data apa pun. Tidak ada identitas aplikasi yang perlu dibangun karena tidak ada keadaan, komitmen, kepemilikan, atau nilai yang harus terikat pada pengguna tertentu antar sesi — setiap perhitungan bersifat sementara dan berakhir saat halaman ditutup atau formulir direset.

Kedua halaman dapat diakses tanpa autentikasi. Landing adalah permukaan masuk publik anonim; Kalkulator juga dapat diakses langsung tanpa gerbang identitas. Batas produk saat ini adalah perhitungan kadar emas dua komponen dan tampilan hasilnya. Tidak ada kemampuan masa depan yang direncanakan dalam sumber otoritatif.

2b. Source Content Inventory

Tidak ada direktif referensi dengan content_source dalam sumber otoritatif, sehingga inventaris konten tidak disertakan.

2c. Page Content and Component Coverage

Landing

Informasi dan keadaan:

• Judul layar sampul: "Estimasi Kadar Emas"
• Subjudul: "Hitung kadar & karat dengan metode berat jenis"
• Visual emas batangan bertumpuk (batangan utama berlabel "EMAS" dan batangan bawah sebagai bayangan)
• Latar gradien vertikal dari #992200 → #cc7700 → #ffc800

Aksi utama:

• Tombol MULAI HITUNG — memicu transisi keluar dari layar sampul dan menampilkan halaman Kalkulator

Aksi pendukung:

• Tidak ada

Entitas domain:

• Tidak ada entitas data; halaman ini murni presentasional

Tanggung jawab komponen:

• Kontainer splash layar penuh dengan transisi opacity 0,6 detik saat keluar
• Blok visual batangan emas (batangan utama + batangan bawah)
• Judul dan subjudul produk
• Tombol mulai dengan efek tekan (scale 0,96)

Keadaan:

• Loading: tidak berlaku (halaman statis)
• Empty: tidak berlaku
• Success: layar sampul tampil penuh; setelah tombol ditekan, opacity turun ke 0 selama 600 ms, lalu splash disembunyikan dan halaman Kalkulator ditampilkan
• Error: tidak berlaku
• Recovery: tidak berlaku

Kalkulator

Informasi dan keadaan:

• Judul halaman: "\xf0\x9f\xa5\x87 Kalkulator Kadar Emas"
• Pemilih Jenis Campuran dengan opsi: Emas + Tembaga, Emas + Perak, Emas + Timah, Emas + Manual
• Input Berat Jenis Logam Manual (hanya tampil saat metode "Emas + Manual" dipilih; contoh placeholder 8.50)
• Input Berat Timbang di Udara (gram) (contoh placeholder 2.77)
• Input Selisih Timbangan Dalam Air (gram) (contoh placeholder 0.17)
• Panel hasil yang menampilkan salah satu dari: teks awal, pesan validasi, pesan hasil tidak valid, atau hasil perhitungan lengkap

Aksi utama:

• Tombol HITUNG — menjalankan perhitungan secara eksplisit
• Perhitungan otomatis saat nilai Berat Timbang di Udara atau Selisih Timbangan Dalam Air diubah
• Perhitungan otomatis saat Jenis Campuran diubah

Aksi pendukung:

• Tombol RESET — mengosongkan berat, selisih, dan berat jenis manual; mengembalikan metode ke Emas + Tembaga; menyembunyikan input manual; mengembalikan teks hasil awal

Entitas domain:

• Jenis Campuran (tembaga | perak | timah | manual)
• Berat Timbang di Udara (gram, desimal)
• Selisih Timbangan Dalam Air (gram, desimal)
• Berat Jenis Logam Manual (g/cm³, desimal, > 0)
• Berat Dalam Air (turunan: berat − selisih)
• Berat Jenis Benda (turunan: berat / selisih)
• Persentase Emas (turunan)
• Karat (turunan: persen emas × 24 / 100)
• Berat Emas (turunan: berat × persen emas / 100)
• Persentase dan Berat Logam Campuran (turunan)

Tanggung jawab komponen:

• Panel kalkulator (kartu putih dengan sudut membulat dan bayangan lembut)
• Pemilih metode dengan penangan perubahan yang menampilkan/menyembunyikan input manual dan memicu perhitungan ulang
• Dua input pengukuran dengan penangan input yang memicu perhitungan otomatis
• Tombol HITUNG dan RESET
• Panel hasil dengan gaya berbeda untuk hasil valid (.emas, .karat) dan pesan peringatan (.warning)

Keadaan:

• Loading: tidak berlaku (perhitungan sinkron instan)
• Empty: panel hasil menampilkan teks awal "Masukkan berat di udara dan selisih dalam air."
• Success: panel hasil menampilkan metode, berat udara, selisih dalam air, berat dalam air otomatis, berat jenis benda, persentase emas, perkiraan karat, berat emas, serta persentase dan berat logam campuran
• Error:
  • Berat atau selisih kosong/tidak valid/nol/negatif → "Masukkan berat di udara dan selisih dalam air."
  • Selisih lebih besar dari berat (berat dalam air ≤ 0) → "⚠️ Selisih tidak boleh lebih besar dari berat."
  • Metode manual tanpa berat jenis logam valid → "Masukkan berat jenis logam manual."
  • Persentase emas di luar rentang 0–100 → "⚠️ HASIL TIDAK VALID" beserta rincian berat udara, selisih air, berat setelah dikurangi selisih, berat jenis, dan keterangan bahwa model campuran tidak cocok
• Recovery: Pengguna memperbaiki nilai masukan atau memilih metode lain; perhitungan otomatis berjalan ulang. Tombol RESET mengembalikan formulir ke keadaan awal.

3. Functional Requirements

FR-01 — Layar sampul dan masuk ke kalkulator [explicit] As a Pengguna Kalkulator Kadar Emas I should melihat layar sampul bertema emas batangan dengan judul "Estimasi Kadar Emas", subjudul "Hitung kadar & karat dengan metode berat jenis", dan tombol "MULAI HITUNG" so that saya dapat memulai sesi perhitungan.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Membuka aplikasi
• Hasil yang dapat diamati: Layar sampul tampil penuh; menekan "MULAI HITUNG" memicu transisi opacity 600 ms, menyembunyikan splash, dan menampilkan halaman Kalkulator
• Keadaan akses: Anonim, tanpa autentikasi
• Kegagalan/recovery: Tidak ada kegagalan yang didefinisikan
• Kelanjutan: Pengguna bekerja di halaman Kalkulator

FR-02 — Pemilihan jenis campuran [explicit] As a Pengguna Kalkulator Kadar Emas I should memilih jenis campuran dari daftar Emas + Tembaga, Emas + Perak, Emas + Timah, atau Emas + Manual so that model perhitungan sesuai dengan logam campuran benda.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Mengubah nilai pemilih "Jenis Campuran"
• Hasil yang dapat diamati: Metode aktif berubah; perhitungan dijalankan ulang dengan konstanta berat jenis logam yang sesuai
• Keadaan akses: Anonim
• Kegagalan/recovery: Tidak ada
• Kelanjutan: Pengguna memasukkan pengukuran atau melihat hasil yang diperbarui

FR-03 — Input berat jenis logam manual [explicit] As a Pengguna Kalkulator Kadar Emas I should melihat input tambahan "Berat Jenis Logam Manual" (contoh 8.50) saat memilih "Emas + Manual" so that saya dapat memakai logam campuran yang tidak ada di daftar.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Memilih opsi "Emas + Manual"
• Hasil yang dapat diamati: Input berat jenis manual ditampilkan; memilih metode lain menyembunyikannya
• Keadaan akses: Anonim
• Kegagalan/recovery: Jika nilai manual tidak valid (kosong, bukan angka, atau ≤ 0), panel hasil menampilkan "Masukkan berat jenis logam manual."
• Kelanjutan: Pengguna memasukkan nilai berat jenis dan melanjutkan perhitungan

FR-04 — Input pengukuran berat [explicit] As a Pengguna Kalkulator Kadar Emas I should memasukkan berat timbang di udara (gram) dan selisih timbangan dalam air (gram) so that sistem dapat menghitung berat jenis benda.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Mengetik nilai pada input berat atau selisih
• Hasil yang dapat diamati: Nilai tersimpan di formulir; perhitungan otomatis dijalankan
• Keadaan akses: Anonim
• Kegagalan/recovery: Nilai kosong/tidak valid/nol/negatif memicu pesan validasi
• Kelanjutan: Pengguna melihat hasil atau memperbaiki masukan

FR-05 — Perhitungan eksplisit dan otomatis [explicit] As a Pengguna Kalkulator Kadar Emas I should menjalankan perhitungan lewat tombol "HITUNG" atau otomatis saat nilai berat/selisih diubah so that saya tidak perlu menekan tombol setiap kali mengubah angka.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Menekan "HITUNG", mengubah input berat, mengubah input selisih, atau mengubah jenis campuran
• Hasil yang dapat diamati: Panel hasil diperbarui sesuai keadaan saat ini
• Keadaan akses: Anonim
• Kegagalan/recovery: Masukan tidak valid menampilkan pesan validasi yang sesuai
• Kelanjutan: Pengguna membaca hasil atau mengubah masukan

FR-06 — Rumus perhitungan kadar emas [explicit] As a Pengguna Kalkulator Kadar Emas I should menerima perhitungan yang memakai berat jenis benda = berat / selisih, berat dalam air = berat − selisih, konstanta berat jenis emas 19,32 g/cm³, dan berat jenis logam campuran (tembaga 8,96; perak 10,49; timah 7,31; atau nilai manual) so that hasilnya konsisten dengan metode berat jenis.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Perhitungan dijalankan dengan masukan valid
• Hasil yang dapat diamati: Persentase emas dihitung sebagai ((1/BJ) − (1/BJlogam)) / ((1/19,32) − (1/BJlogam)) × 100
• Keadaan akses: Anonim
• Kegagalan/recovery: Hasil di luar 0–100 ditangani sebagai hasil tidak valid (FR-08)
• Kelanjutan: Hasil ditampilkan (FR-07)

FR-07 — Tampilan hasil perhitungan lengkap [explicit] As a Pengguna Kalkulator Kadar Emas I should melihat metode yang dipakai, berat udara, selisih dalam air, berat dalam air otomatis, berat jenis benda, persentase emas, perkiraan karat (persen emas × 24 / 100), berat emas dalam gram, serta persentase dan berat logam campuran so that saya dapat menilai kadar benda secara menyeluruh.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Perhitungan selesai dengan persentase emas dalam rentang 0–100
• Hasil yang dapat diamati: Panel hasil menampilkan seluruh besaran tersebut dengan format angka yang ditentukan (berat 2 desimal, berat jenis 3 desimal, persentase 2 desimal, berat emas 3 desimal, karat 2 desimal)
• Keadaan akses: Anonim
• Kegagalan/recovery: Tidak ada
• Kelanjutan: Pengguna dapat mengubah masukan atau menekan RESET untuk menghitung benda berikutnya

FR-08 — Penanganan hasil tidak valid [explicit] As a Pengguna Kalkulator Kadar Emas I should melihat pesan "⚠️ HASIL TIDAK VALID" beserta rincian berat udara, selisih air, berat setelah dikurangi selisih, berat jenis, dan keterangan bahwa model campuran tidak cocok so that saya tahu angka saya tidak sesuai dengan model yang dipilih.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Persentase emas terhitung di luar rentang 0–100
• Hasil yang dapat diamati: Panel hasil menampilkan pesan tidak valid dengan rincian lengkap; tidak ada angka kadar yang ditampilkan
• Keadaan akses: Anonim
• Kegagalan/recovery: Pengguna dapat mengganti jenis campuran atau memeriksa kembali angka timbangan
• Kelanjutan: Pengguna memperbaiki masukan dan menghitung ulang

FR-09 — Validasi masukan [explicit] As a Pengguna Kalkulator Kadar Emas I should menerima pesan validasi yang jelas untuk masukan yang tidak memenuhi syarat so that saya dapat memperbaiki kesalahan sebelum mempercayai hasil.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Masukan tidak valid
• Hasil yang dapat diamati:
  • Berat atau selisih kosong/tidak valid/nol/negatif → "Masukkan berat di udara dan selisih dalam air."
  • Selisih lebih besar dari berat → "⚠️ Selisih tidak boleh lebih besar dari berat."
  • Metode manual tanpa berat jenis logam valid → "Masukkan berat jenis logam manual."
• Keadaan akses: Anonim
• Kegagalan/recovery: Pesan diganti begitu masukan menjadi valid
• Kelanjutan: Pengguna memperbaiki masukan

FR-10 — Reset formulir [explicit] As a Pengguna Kalkulator Kadar Emas I should menekan tombol "RESET" untuk mengosongkan berat, selisih, dan berat jenis manual, mengembalikan metode ke Emas + Tembaga, menyembunyikan input manual, dan mengembalikan teks hasil awal so that saya dapat menghitung benda berikutnya dari keadaan bersih.

• Aktor: Pengguna Kalkulator Kadar Emas
• Pemicu: Menekan tombol "RESET"
• Hasil yang dapat diamati: Formulir kembali ke keadaan awal; panel hasil menampilkan "Masukkan berat di udara dan selisih dalam air."
• Keadaan akses: Anonim
• Kegagalan/recovery: Tidak ada
• Kelanjutan: Pengguna memasukkan pengukuran benda berikutnya

4. User Personas

Pengguna Kalkulator Kadar Emas

Konteks produk: Seseorang yang memegang benda logam kecil — perhiasan, koin, atau batangan bekas — dan perlu memperkirakan kadar emasnya sebelum mengambil keputusan bernilai tinggi seperti membeli, menjual, atau menerima titipan. Ia bekerja dengan timbangan presisi dan dua angka hasil timbangan: berat di udara dan selisih berat saat benda ditimbang di dalam air. Ia tidak selalu tahu komposisi logam campuran benda tersebut, sehingga ia perlu memilih model campuran yang paling masuk akal atau memasukkan berat jenis logam yang ia ketahui sendiri.

Tujuan utama: Mendapatkan perkiraan persentase emas dan karat yang dapat dipercaya dari dua angka timbangan, beserta rincian berat emas dan berat logam campuran, dalam satu sesi cepat tanpa perlu akun atau perangkat lunak tambahan.

Tanggung jawab yang diterima:

• Membuka layar sampul dan memulai sesi perhitungan
• Memilih jenis campuran logam yang sesuai (tembaga, perak, timah, atau manual)
• Memasukkan berat jenis logam manual ketika memilih model manual
• Memasukkan berat timbang di udara dan selisih timbangan dalam air
• Menjalankan perhitungan lewat tombol atau membiarkan perhitungan otomatis berjalan saat angka berubah
• Menafsirkan hasil: persentase emas, karat, berat emas, dan berat logam campuran
• Mengenali dan menindaklanjuti pesan validasi serta pesan hasil tidak valid
• Mengatur ulang formulir untuk menghitung benda berikutnya

Masukan dan keputusan: Angka berat di udara (gram) dan selisih dalam air (gram) dari timbangan; pilihan logam campuran; nilai berat jenis manual bila diperlukan. Keputusan utama adalah memilih model campuran yang tepat dan memutuskan apakah hasil yang ditampilkan cukup masuk akal untuk dipakai.

Interaksi dengan peserta lain: Tidak ada peserta manusia lain dalam produk ini. Persona ini adalah satu-satunya aktor manusia; seluruh interaksi terjadi antara dirinya dan antarmuka kalkulator.

Keberhasilan yang dapat diamati: Panel hasil menampilkan persentase emas dan perkiraan karat beserta rincian berat, atau pesan peringatan yang jelas ketika angka tidak valid sehingga ia tahu harus mengoreksi apa.

Yang membedakan peran ini: Ia bukan pengguna umum yang menjelajah aplikasi; ia adalah operator instrumen yang memasukkan dua bacaan timbangan dan mengharapkan satu bacaan kadar. Pekerjaannya berorientasi pada satu keputusan transaksi, bukan pada eksplorasi fitur, dan ia menilai produk dari apakah angkanya dapat dipercaya dan apakah kesalahan masukan dijelaskan dengan tepat.

5. Core User Flows

Alur 1 — Memulai sesi dari layar sampul

1. Konteks awal: Pengguna membuka keen-kalkulator di peramban. Halaman Landing tampil penuh dengan latar gradien emas, visual batangan emas, judul "Estimasi Kadar Emas", subjudul "Hitung kadar & karat dengan metode berat jenis", dan tombol "MULAI HITUNG".
2. Aksi: Pengguna menekan tombol MULAI HITUNG.
3. Hasil yang dapat diamati: Layar sampul memudar (opacity turun ke 0 selama 600 ms), lalu disembunyikan dan halaman Kalkulator ditampilkan.
4. Langkah berikutnya: Pengguna berada di halaman Kalkulator dengan panel hasil menampilkan teks awal "Masukkan berat di udara dan selisih dalam air."

Alur 2 — Menghitung kadar emas dengan logam campuran standar

1. Konteks awal: Pengguna berada di halaman Kalkulator. Panel hasil menampilkan teks awal. Metode default adalah Emas + Tembaga.
2. Aksi: Pengguna membuka pemilih Jenis Campuran dan memilih Emas + Perak (atau Tembaga/Timah) sesuai dugaan logam campuran benda.
3. Hasil yang dapat diamati: Metode aktif berubah; perhitungan dijalankan ulang dengan konstanta berat jenis logam yang sesuai (perak 10,49 g/cm³).
4. Aksi: Pengguna memasukkan Berat Timbang di Udara (misalnya 2,77 gram) dan Selisih Timbangan Dalam Air (misalnya 0,17 gram).
5. Hasil yang dapat diamati: Perhitungan otomatis berjalan setiap kali nilai berubah; pengguna juga dapat menekan tombol HITUNG untuk menjalankan perhitungan secara eksplisit.
6. Hasil yang dapat diamati: Panel hasil menampilkan metode yang dipakai, berat udara, selisih dalam air, berat dalam air otomatis, berat jenis benda, persentase emas, perkiraan karat, berat emas, serta persentase dan berat logam campuran.
7. Langkah berikutnya: Pengguna membaca hasil dan memutuskan apakah angka tersebut cukup masuk akal untuk dipakai, atau mengubah masukan untuk memeriksa skenario lain.

Alur 3 — Menghitung dengan logam campuran manual

1. Konteks awal: Pengguna berada di halaman Kalkulator dan mengetahui berat jenis logam campuran benda dari sumber lain, tetapi logam tersebut bukan tembaga, perak, atau timah.
2. Aksi: Pengguna memilih Emas + Manual pada pemilih Jenis Campuran.
3. Hasil yang dapat diamati: Input Berat Jenis Logam Manual muncul dengan placeholder "Contoh: 8.50".
4. Aksi: Pengguna memasukkan nilai berat jenis logam manual (misalnya 8,50).
5. Hasil yang dapat diamati: Perhitungan dijalankan ulang memakai nilai manual tersebut.
6. Kegagalan dan pemulihan: Jika nilai manual kosong, bukan angka, atau ≤ 0, panel hasil menampilkan "Masukkan berat jenis logam manual." Pengguna memasukkan nilai yang valid dan perhitungan berjalan kembali.
7. Langkah berikutnya: Pengguna membaca hasil lengkap seperti pada Alur 2.

Alur 4 — Menangani hasil tidak valid

1. Konteks awal: Pengguna telah memasukkan berat dan selisih yang valid secara format, tetapi kombinasinya tidak cocok dengan model campuran yang dipilih.
2. Aksi: Perhitungan dijalankan (otomatis atau lewat tombol HITUNG).
3. Hasil yang dapat diamati: Persentase emas terhitung di luar rentang 0–100, sehingga panel hasil menampilkan "⚠️ HASIL TIDAK VALID" beserta rincian berat udara, selisih air, berat setelah dikurangi selisih, berat jenis, dan keterangan bahwa model Emas + [logam] tidak cocok dengan angka tersebut. Tidak ada angka kadar yang ditampilkan.
4. Pemulihan: Pengguna mengganti jenis campuran ke logam lain atau memeriksa kembali angka timbangannya, lalu perhitungan berjalan ulang.
5. Langkah berikutnya: Pengguna memperoleh hasil valid atau menyimpulkan bahwa benda tersebut tidak sesuai dengan model dua komponen yang tersedia.

Alur 5 — Menangani kesalahan masukan

1. Konteks awal: Pengguna berada di halaman Kalkulator dan belum mengisi kedua angka timbangan, atau mengisi nilai yang tidak valid.
2. Aksi: Pengguna menekan HITUNG atau mengubah salah satu input.
3. Hasil yang dapat diamati:
   • Jika berat atau selisih kosong, bukan angka, nol, atau negatif → panel hasil menampilkan "Masukkan berat di udara dan selisih dalam air."
   • Jika selisih lebih besar dari berat → panel hasil menampilkan "⚠️ Selisih tidak boleh lebih besar dari berat."
   • Jika metode manual dipilih tanpa berat jenis valid → panel hasil menampilkan "Masukkan berat jenis logam manual."
4. Pemulihan: Pengguna memperbaiki nilai yang salah; pesan diganti dengan hasil perhitungan begitu masukan menjadi valid.
5. Langkah berikutnya: Pengguna melanjutkan ke pembacaan hasil.

Alur 6 — Mereset formulir untuk benda berikutnya

1. Konteks awal: Pengguna telah selesai membaca hasil untuk satu benda dan ingin menghitung benda berikutnya dari keadaan bersih.
2. Aksi: Pengguna menekan tombol RESET.
3. Hasil yang dapat diamati: Input berat, selisih, dan berat jenis manual dikosongkan; metode kembali ke Emas + Tembaga; input manual disembunyikan; panel hasil kembali menampilkan "Masukkan berat di udara dan selisih dalam air."
4. Langkah berikutnya: Pengguna memasukkan pengukuran benda berikutnya dan mengulangi Alur 2, 3, atau 4.

6. Visuals Colors and Theme

Muse: MARQ by Garmin — estetika instrumen mewah. Register emosionalnya adalah keyakinan terkendali: alat yang tampak mahal, tua, dan dapat dipercaya, bukan aplikasi konsumen yang ramah.

Headline arah: Presisi instrumen untuk menimbang emas.

Palet (dark mode)

Rasio kira-kira 70% ground gelap, 20% panel, 8% teks, 2% emas menyala. Kontras teks #F2EDE4 di atas #12100D jauh di atas ambang baca; emas #C9A227 hanya untuk angka besar, bukan untuk badan teks kecil.

Tipografi

• Headings: Saira Condensed 600–700, huruf kapital untuk judul dan label bacaan, tracking rapat pada angka besar dan tracking lebar pada label mikro.
• Body: Saira.
• Angka: Tabular figures agar tidak melompat saat nilai berubah.
• Skala: 1.25 dengan lompatan besar pada angka bacaan — 128/64/32/20/15/13.
• Judul hasil (persentase emas): elemen terbesar di halaman, clamp(48px, 12vw, 128px), dengan satuan '%' dan 'KARAT' ditulis kecil di sampingnya.
• Label mikro: 11px kapital tracking 0.16em.
• Badan teks: 15–16px.
• Nilai sekunder (berat jenis, berat emas): 20–32px.

Bahasa bentuk

Sudut tajam dan garis rambut 1px di mana-mana; tidak ada radius besar. Panel input dibentuk seperti pelat instrumen dengan garis aturan horizontal dan label di kiri, nilai di kanan. Bezel: cincin tipis emas 1px mengelilingi angka hasil utama, meniru bezel jam. Tombol berbentuk persegi panjang dengan sudut 2px dan garis emas 1px sebagai bingkai, bukan tombol pil. Gauge melingkar SVG untuk persentase emas dengan jarum tipis. Tidak ada blob, tidak ada kartu melayang dengan bayangan lembut.

Tata letak

Satu kolom sempit berpusat maksimal 720px di desktop, dengan dua zona: di atas, komposisi hero instrumen (judul besar + gauge melingkar + tombol mulai); setelah masuk, panel kalkulator dengan grid 12 kolom internal. Label di kolom kiri, input di kolom kanan, dipisahkan garis rambut horizontal — seperti lembar data teknis, bukan formulir web. Baris hasil disusun sebagai tabel bacaan: nama besaran, nilai, satuan, rata kanan dengan angka tabular. Ruang kosong lebar di sekitar panel agar panel tampak seperti alat yang diletakkan di meja gelap.

Gaya citra

Tidak ada foto orang dan tidak ada ilustrasi stok. Yang dipakai: vektor makro batangan emas dengan tepi tajam dan permukaan bertekstur (garis-garis halus, bukan gradien mengkilap), cincin bezel SVG, gauge melingkar dengan garis skala seperti dial jam, dan garis topografi tipis sebagai tekstur latar di area hero. Garis topografi dan tekstur logam adalah dekorasi dan boleh terpotong tepi viewport; tidak boleh menutupi teks atau kontrol.

7. Signature Design Concept

Gauge melingkar ala dial jam sebagai elemen hero. Layar pertama adalah instrumen di atas meja gelap, bukan hero SaaS. Latar #12100D penuh. Di kiri bawah, judul 'KALKULATOR KADAR EMAS' ditulis dalam Saira Condensed kapital, clamp(40px, 9vw, 96px), dua baris, rata kiri, memakan sekitar 60% lebar viewport di desktop dan melebar penuh di mobile. Di kanan, satu objek dominan: gauge melingkar besar (diameter 320px di desktop, 220px di mobile) dengan cincin emas tipis, garis skala tiap 5%, jarum, dan angka persentase di tengah dalam Saira Condensed besar. Di bawah judul, satu baris kecil abu logam 'Metode berat jenis · emas 19,32 g/cm³' dan tombol persegi 'MULAI HITUNG' dengan bingkai emas 1px. Di belakang gauge, vektor batangan emas besar yang terpotong tepi kanan viewport, dirender sebagai bidang datar dengan garis tepi terang — bukan gradien berkilau. Tidak ada teks atau kontrol yang tertutup objek apa pun.

Signature moves:

• Gauge melingkar ala dial jam sebagai elemen hero: cincin emas 1px, garis skala tiap 5%, jarum tipis yang berputar ke posisi persentase emas saat hasil muncul, dengan angka persentase besar di tengah gauge.
• Angka hasil sebagai tipografi utama: persentase emas dirender clamp(48px, 12vw, 128px) dalam Saira Condensed tabular, dengan label 'EMAS' kecil kapital di bawahnya dan karat ditulis di baris terpisah dengan garis rambut di atasnya.
• Panel kalkulator sebagai lembar data teknis: setiap baris adalah pasangan label kiri / nilai kanan yang dipisahkan garis rambut horizontal, dan baris hasil memakai angka rata kanan dengan satuan abu logam kecil — bukan kartu-kartu terpisah.
• Vektor batangan emas bertekstur garis halus yang terpotong tepi kanan viewport di belakang hero, dengan garis topografi tipis sebagai tekstur latar; keduanya dekoratif dan tidak pernah menutupi teks atau kontrol.
• Transisi masuk dari layar sampul ke kalkulator: tombol 'MULAI HITUNG' memicu fade gelap 400ms di mana gauge mengecil ke posisi panel hasil, bukan fade putih atau slide kartu.

Avoid: Gradien emas mengkilap dan bayangan lembut bergaya tombol web; kartu putih dengan sudut membulat besar dan bayangan mengambang; font Arial, Inter, Roboto, atau system-ui untuk judul maupun badan teks; emoji sebagai ikon hasil (\xf0\x9f\xa5\x87,\x20\xf0\x9f\x94\xa9) — ganti dengan ikon garis tipis SVG; warna biru/indigo apa pun sebagai primer atau aksen; animasi bouncy, partikel, atau blob gradien; foto stok orang dan ilustrasi karakter; teks atau kontrol yang tertutup gauge, batangan, atau garis topografi.

8. Interaction Model & Motion Direction

Interaction Model: Animated Motion Tempo: restrained Hero Dimensionality: dimensional_css

Landing Hero Motion Brief

Focal subject: Gauge melingkar besar dengan cincin emas tipis, garis skala tiap 5%, dan jarum tipis, ditemani vektor batangan emas bertekstur yang terpotong tepi kanan viewport.

Input → transformation → outcome thesis: Saat pengguna menekan MULAI HITUNG, layar sampul memicu fade gelap 400ms di mana gauge mengecil ke posisi panel hasil, lalu halaman Kalkulator muncul. Setelah pengguna memasukkan angka dan perhitungan selesai, jarum gauge berputar ke posisi persentase dengan easing lambat dan angka persentase berhitung naik dari 0 ke nilai akhir dalam sekitar 700ms. Angka berat jenis dan berat emas muncul dengan fade pendek 150ms.

Motion vocabulary: Restrained sampai cinematic pada satu momen saja — putaran jarum gauge dan hitungan naik angka persentase. Tidak ada bounce, tidak ada partikel. Angka berat jenis dan berat emas muncul dengan fade pendek 150ms.

Composed first frame: Latar #12100D penuh. Judul 'KALKULATOR KADAR EMAS' dua baris rata kiri di kiri bawah. Gauge melingkar besar di kanan dengan jarum di posisi nol. Baris kecil abu logam 'Metode berat jenis · emas 19,32 g/cm³' dan tombol persegi 'MULAI HITUNG' dengan bingkai emas 1px di bawah judul. Vektor batangan emas terpotong tepi kanan viewport di belakang gauge. Tidak ada teks atau kontrol yang tertutup objek apa pun.

Reduced-motion state: Pada prefers-reduced-motion, jarum dan angka langsung berada di posisi akhir tanpa animasi; transisi masuk menjadi pergantian langsung tanpa fade.

9. Non-Functional Requirements

NFR-01 — Bahasa antarmuka [explicit] Seluruh antarmuka dan teks produk berbahasa Indonesia, termasuk judul, label, tombol, pesan validasi, dan pesan hasil.

• Rasional: Konstrain eksplisit dalam sumber otoritatif.

NFR-02 — Perhitungan sisi klien [required_inference] Seluruh perhitungan berjalan di peramban pengguna tanpa panggilan jaringan, sehingga hasil muncul seketika saat masukan berubah.

• Rasional: Perhitungan otomatis saat input berubah (FR-05) memerlukan eksekusi lokal tanpa latensi jaringan.

NFR-03 — Ketepatan format angka [explicit] Format angka hasil mengikuti presisi yang ditentukan: berat 2 desimal, berat jenis 3 desimal, persentase 2 desimal, berat emas 3 desimal, karat 2 desimal.

• Rasional: Presisi tampilan angka adalah bagian dari perilaku yang diterima.

NFR-04 — Aksesibilitas gerak [required_inference] Pada prefers-reduced-motion, animasi jarum gauge dan hitungan naik angka dinonaktifkan; nilai langsung ditampilkan di posisi akhir.

• Rasional: Arah kreatif mensyaratkan keadaan gerak tereduksi yang dapat dipakai.

NFR-05 — Keterbacaan teks dan kontrol [required_inference] Judul, label, angka, dan kontrol tetap utuh di dalam viewport dan kontainernya pada 375px, 768px, dan 1280px, membungkus atau menskalakan (misalnya font-size: clamp(...)) agar muat; tidak ada elemen lain yang menutupi bagian mana pun dari teks atau kontrol yang dapat dibaca.

• Rasional: Arah kreatif mensyaratkan teks dan kontrol yang dapat dibaca tetap utuh di setiap viewport.

10. Tech Stack

• Frontend: Aplikasi web klien-sisi murni (HTML, CSS, JavaScript) tanpa framework backend. Seluruh logika perhitungan berjalan di peramban.
• Penyimpanan: Tidak ada. Produk tidak menyimpan data pengguna, riwayat perhitungan, atau keadaan antar sesi.
• Backend: Tidak ada.
• Autentikasi: Tidak ada.
• Deployment: Aplikasi web statis yang dapat dilayani dari hosting statis mana pun.

11. Assumptions and Constraints

Asumsi

• A-01 [required_inference] Pengguna memiliki akses ke timbangan presisi yang dapat mengukur berat di udara dan selisih berat di dalam air; produk tidak memvalidasi asal angka tersebut.
• A-02 [required_inference] Pengguna memahami bahwa hasil adalah estimasi berbasis model dua komponen dan bukan pengukuran laboratorium.
• A-03 [required_inference] Perhitungan berjalan seketika di peramban tanpa keadaan loading yang perlu ditampilkan.

Kendala

• C-01 [explicit] Perhitungan hanya memakai model campuran dua komponen: emas dengan satu logam campuran (tembaga, perak, timah, atau logam manual).
• C-02 [explicit] Hasil persentase emas di luar rentang 0–100 harus ditampilkan sebagai hasil tidak valid, bukan sebagai angka kadar.
• C-03 [explicit] Selisih timbangan dalam air tidak boleh lebih besar dari berat timbang di udara.
• C-04 [explicit] Berat jenis logam manual harus berupa angka lebih besar dari nol.
• C-05 [explicit] Antarmuka dan seluruh teks produk berbahasa Indonesia.
• C-06 [explicit] Konstanta berat jenis emas murni adalah 19,32 g/cm³; berat jenis logam campuran standar adalah tembaga 8,96, perak 10,49, dan timah 7,31 g/cm³.

12. Glossary

• Berat jenis (BJ): Rasio berat benda terhadap selisih beratnya saat ditimbang di udara dan di dalam air; dihitung sebagai berat / selisih.
• Berat dalam air: Berat benda setelah dikurangi selisih timbangan dalam air; dihitung sebagai berat − selisih.
• Berat timbang di udara: Berat benda yang diukur di udara, dalam gram.
• Selisih timbangan dalam air: Selisih antara berat di udara dan berat di dalam air, dalam gram.
• Karat: Ukuran kemurnian emas pada skala 24; dihitung sebagai persentase emas × 24 / 100.
• Logam campuran: Logam selain emas dalam model dua komponen (tembaga, perak, timah, atau logam manual).
• Metode berat jenis: Teknik estimasi kadar emas dengan membandingkan berat jenis benda terhadap berat jenis emas murni dan logam campuran.
• Persentase emas: Perkiraan proporsi emas dalam benda, dihitung dari berat jenis benda, berat jenis emas murni (19,32 g/cm³), dan berat jenis logam campuran.
• Hasil tidak valid: Keadaan ketika persentase emas terhitung di luar rentang 0–100, menandakan model campuran tidak cocok dengan angka timbangan.