frosty-ai

byBang Jack

Buatkan saya sebuah AI siap pakai yang tidak atau sangat sedikit sensor dari semua kategori dan tanpa limit pemakaian

No preview

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirements Document for frosty-ai

1. Introduction

frosty-ai adalah sebuah AI siap pakai yang dapat langsung digunakan tanpa penyiapan apa pun oleh pengguna. Produk ini ditujukan untuk individu — bukan organisasi — yang ingin mengajukan pertanyaan atau permintaan dari kategori apa pun, dengan sensor seminimal mungkin atau tanpa sensor, dan tanpa batas pemakaian berupa kuota, penghitung pesan, atau pembatasan jumlah permintaan.

Inti produk adalah percakapan: pengguna menuliskan prompt, AI menjawab, dan percakapan itu tersimpan sehingga dapat ditinjau dan dilanjutkan kembali. Produk tidak menampilkan meteran kuota, tidak menampilkan ajakan peningkatan layanan, dan tidak membatasi jumlah permintaan yang dapat diajukan.

Audiens produk adalah pengguna perorangan dengan pertanyaan yang beragam dan bersifat pribadi, yang menginginkan alat yang tenang, tidak menggurui, dan tidak membatasi — digunakan kapan saja, termasuk pada dini hari.

Page 1 of 32

2. System Overview

frosty-ai adalah aplikasi web dengan antarmuka kustom milik aplikasi sendiri. Pengguna anonim dapat membaca halaman Landing yang menjelaskan janji produk. Untuk mulai memakai AI dan mempertahankan percakapan, pengguna mendaftar sendiri melalui halaman Sign Up, lalu memverifikasi kembali identitasnya melalui halaman Login pada kunjungan berikutnya. Setelah terverifikasi, pengguna bekerja di halaman Chat untuk mengirim prompt dan menerima tanggapan AI, serta di halaman Conversations untuk meninjau dan melanjutkan percakapan sebelumnya.

Aktor manusia tunggal yang diterima adalah Pengguna AI. Tidak ada aktor manusia lain, tidak ada peran administratif, dan tidak ada perbedaan hak akses antar-pengguna: setiap pengguna hanya melihat dan melanjutkan percakapan miliknya sendiri, dan pemisahan itu berasal dari kepemilikan data, bukan dari kontrol izin berbasis peran.

Kemampuan AI (pemrosesan prompt dan penghasilan tanggapan) dijalankan sebagai proses sistem di belakang antarmuka; pengguna tidak berinteraksi langsung dengan proses tersebut, melainkan melalui halaman Chat.

Batasan sempit yang berlaku saat ini:

  • Tidak ada meteran kuota, penghitung pemakaian, badge "sisa pesan", atau chrome apa pun yang menyiratkan adanya batas pemakaian.
  • Tidak ada alur peningkatan layanan berbayar, langganan, atau penagihan.
  • Tidak ada peran administratif, moderasi manual, atau antarmuka pengelolaan pengguna.
  • Tidak ada fitur di luar lima halaman yang ditetapkan pada kontrak halaman.
Page 2 of 32

2a. Product Interpretation and Delivery Boundary

Kepemilikan pengiriman. frosty-ai dikirim sebagai aplikasi web milik sendiri dengan antarmuka kustom. Identitas pengguna dimiliki oleh aplikasi: pendaftaran mandiri dan verifikasi kembali adalah prasyarat perjalanan yang membuat percakapan dapat dimiliki secara pribadi dan dilanjutkan kembali. Halaman Landing, Sign Up, dan Login dapat diakses tanpa identitas; halaman Chat dan Conversations hanya dapat diakses setelah identitas terverifikasi.

Batas saat ini. Semua perilaku yang dijelaskan dalam dokumen ini berlaku pada horizon saat ini: penjelasan produk di Landing, pendaftaran mandiri, verifikasi kembali, pengiriman prompt dan penerimaan tanggapan AI, serta peninjauan dan pelanjutan percakapan tersimpan.

Batas masa depan. Tidak ada persyaratan masa depan yang diterima pada thread ini. Setiap gagasan yang tidak disebutkan secara eksplisit oleh pengguna — termasuk langganan, kuota, peran administratif, atau integrasi pihak ketiga — berada di luar cakupan dan tidak boleh diimplementasikan.

Sensor dan batas pemakaian. Produk beroperasi dengan sensor minimal atau tanpa sensor di semua kategori permintaan, dan tanpa pembatasan kuota pemakaian. Kedua hal ini adalah janji produk yang harus tercermin dalam perilaku sistem dan dalam bahasa antarmuka: tidak ada penolakan berbasis kategori yang dapat dihindari, dan tidak ada penghitung atau pembatas jumlah permintaan.

2b. Source Content Inventory

Tidak ada direktif referensi dengan content_source pada thread ini, sehingga inventaris konten sumber tidak disertakan.

2c. Page Content and Component Coverage

Page 3 of 32

Landing

  • Informasi/state: Penjelasan anonim bahwa frosty-ai adalah AI siap pakai untuk semua kategori permintaan, dengan sensor minimal atau tanpa sensor, dan tanpa batas pemakaian. Tidak ada state yang memerlukan identitas.
  • Aksi utama: Menuliskan prompt pertama pada kolom prompt di hero; menuju Sign Up untuk mulai memakai AI; menuju Login bagi pengguna yang sudah memiliki akun.
  • Aksi pendukung: Membaca tiga paragraf singkat tentang "siap pakai", "sensor minimal", dan "tanpa batas".
  • Entitas domain: Tidak ada entitas persisten; halaman ini sepenuhnya anonim dan tidak menyimpan state pengguna.
  • Tanggung jawab komponen:
    • Wordmark 12px huruf besar FROSTY-AI dengan tracking 0.18em, warna muted.
    • Satu kalimat display light 300 pada clamp(40px, 7vw, 60px), sentence case, leading 1.15, rata kiri pada kolom 640px.
    • Kolom prompt putih selebar 720px dengan aturan 1px muted, radius 2px, placeholder 17px "Mulai menulis…", dan tombol kirim persegi 44px berwarna accent flush kanan di dalam kolom.
    • Tiga paragraf prosa pendek yang dipisahkan aturan rambut 1px, masing-masing dengan 120px udara di sekitarnya.
    • Satu band still-life selebar penuh sebagai pemisah bagian: foto dari atas selembar kertas kosong di atas permukaan abu-abu hangat, didesaturasi mendekati monokrom, tidak pernah di belakang teks.
    • Baris ajakan mendaftar menuju Sign Up, dan tautan menuju Login.
  • State loading: Tidak ada; halaman statis.
  • State kosong: Tidak berlaku; halaman selalu menampilkan konten penuh.
  • State sukses: Tidak berlaku untuk halaman itu sendiri. Jika pengguna mengirim prompt dari kolom hero tanpa identitas, sistem mengarahkannya ke Sign Up untuk menyelesaikan pendaftaran sebelum percakapan dimulai.
Page 4 of 32
  • State error: Jika pengiriman prompt dari hero gagal karena identitas belum ada, tampilkan pesan tenang tanpa emoji dan tanpa tanda seru yang menjelaskan bahwa pendaftaran diperlukan untuk memulai percakapan, beserta tautan ke Sign Up.
  • Pemulihan: Pengguna dapat mengulang pengiriman setelah mendaftar; teks prompt yang sudah ditulis dipertahankan agar tidak hilang.
Page 5 of 32

Sign Up

  • Informasi/state: Formulir pendaftaran mandiri untuk membuat identitas aplikasi. Halaman dapat diakses tanpa identitas.
  • Aksi utama: Mengirimkan formulir pendaftaran untuk membuat akun dan langsung mulai memakai AI.
  • Aksi pendukung: Menuju Login bila pengguna sudah memiliki akun; kembali ke Landing.
  • Entitas domain: Akun pengguna (identitas aplikasi) dengan kredensial yang dapat diverifikasi.
  • Tanggung jawab komponen:
    • Judul halaman light 300, sentence case, tanpa bold.
    • Kolom input dengan radius 2px, aturan 1px muted, label 11px huruf besar dengan tracking 0.18em.
    • Tombol kirim sebagai blok padat warna primary (warm stone), bukan biru.
    • Tautan ke Login dan ke Landing.
  • State loading: Tombol kirim menunjukkan keadaan sedang memproses tanpa animasi yang mencolok; tidak ada spinner yang berkilau.
  • State kosong: Formulir kosong dengan placeholder tenang; tidak ada pesan menyambut yang berlebihan.
  • State sukses: Akun dibuat dan pengguna diarahkan ke Chat untuk memulai percakapan pertama.
  • State error: Jika pendaftaran gagal (misalnya kredensial tidak memenuhi syarat minimum atau sudah digunakan), tampilkan pesan kesalahan yang jelas di dekat kolom terkait, tanpa emoji dan tanpa tanda seru.
  • Pemulihan: Pengguna dapat memperbaiki isian dan mengirim ulang; isian yang sudah benar dipertahankan.
Page 6 of 32

Login

  • Informasi/state: Formulir verifikasi kembali untuk mengakses percakapan tersimpan dan melanjutkan konteks sebelumnya. Halaman dapat diakses tanpa identitas.
  • Aksi utama: Memverifikasi identitas untuk masuk dan melanjutkan ke percakapan.
  • Aksi pendukung: Menuju Sign Up bila belum memiliki akun; kembali ke Landing.
  • Entitas domain: Akun pengguna (identitas aplikasi) dan sesi terverifikasi.
  • Tanggung jawab komponen:
    • Judul halaman light 300, sentence case.
    • Kolom input kredensial dengan radius 2px dan aturan 1px muted.
    • Tombol masuk sebagai blok padat warna primary.
    • Tautan ke Sign Up dan ke Landing.
  • State loading: Tombol masuk menunjukkan keadaan sedang memverifikasi.
  • State kosong: Formulir kosong dengan placeholder tenang.
  • State sukses: Identitas terverifikasi dan pengguna diarahkan ke Conversations atau Chat untuk melanjutkan konteks tersimpan.
  • State error: Jika verifikasi gagal, tampilkan pesan kesalahan yang jelas dan tidak menyebutkan apakah akun ada atau tidak.
  • Pemulihan: Pengguna dapat mencoba lagi atau beralih ke Sign Up; isian kredensial yang salah dapat diperbaiki tanpa memuat ulang halaman.
Page 7 of 32

Chat

  • Informasi/state: Ruang kerja utama untuk mengirim prompt dan menerima tanggapan AI dalam sebuah percakapan. Memerlukan identitas terverifikasi. Menampilkan transkrip percakapan aktif, rel percakapan di kiri, dan kolom prompt di bawah.
  • Aksi utama: Menuliskan prompt dan mengirimkannya; menerima tanggapan AI dalam transkrip.
  • Aksi pendukung: Berpindah percakapan melalui rel kiri; membuka Conversations untuk meninjau daftar lengkap; memulai percakapan baru.
  • Entitas domain: Percakapan (conversation), pesan pengguna (prompt), pesan AI (tanggapan), urutan pesan dalam percakapan.
  • Tanggung jawab komponen:
    • Rel kiri selebar 240px berisi daftar percakapan yang dipisahkan aturan rambut 1px; baris aktif ditandai aturan accent 1px di tepi kirinya, bukan isian warna.
    • Transkrip terpusat pada 640px, prosa 17px dengan line-height 1.9.
    • Kolom prompt berupa bilah putih yang dipasang di bawah dengan aturan 1px di atasnya, radius 2px, dan tombol kirim persegi 44px accent.
    • Setiap pesan baru muncul dengan fade 200ms; dengan prefers-reduced-motion, fade dihilangkan sepenuhnya.
  • State loading: Saat prompt dikirim dan tanggapan AI sedang dihasilkan, tampilkan indikator tenang di dalam transkrip (misalnya penanda teks halus) tanpa animasi yang mencolok; kolom prompt tetap dapat digunakan sesuai perilaku yang diterima.
  • State kosong: Bila percakapan belum memiliki pesan, tampilkan transkrip kosong dengan satu kalimat tenang yang mengundang pengguna menuliskan prompt pertama; tidak ada kartu, tidak ada ikon fitur.
  • State sukses: Tanggapan AI muncul dalam transkrip sebagai pesan baru dengan fade 200ms, dan percakapan tersimpan sehingga dapat ditinjau kembali.
Page 8 of 32
  • State error: Jika tanggapan AI gagal dihasilkan, tampilkan pesan kesalahan tenang di dalam transkrip di posisi tanggapan yang gagal, tanpa emoji dan tanpa tanda seru, dan tanpa menyiratkan adanya batas pemakaian.
  • Pemulihan: Pengguna dapat mengirim ulang prompt yang gagal; prompt asli tetap terlihat di transkrip sehingga dapat disalin atau dikirim kembali.

Conversations

  • Informasi/state: Daftar percakapan milik pengguna yang memungkinkan peninjauan dan pelanjutan konteks sebelumnya. Memerlukan identitas terverifikasi.
  • Aksi utama: Memilih percakapan untuk melanjutkannya di Chat.
  • Aksi pendukung: Meninjau judul dan waktu relatif setiap percakapan; memulai percakapan baru.
  • Entitas domain: Percakapan (conversation) dengan judul dan waktu aktivitas terakhir.
  • Tanggung jawab komponen:
    • Daftar satu kolom; setiap baris berisi satu baris judul dan timestamp muted, dipisahkan aturan rambut 1px.
    • Tidak ada kartu, tidak ada grid, tidak ada bayangan.
    • Baris aktif ditandai aturan accent 1px di tepi kiri.
  • State loading: Tampilkan daftar dalam keadaan memuat secara tenang tanpa kerangka berkilau.
  • State kosong: Bila belum ada percakapan, tampilkan satu kalimat tenang yang mengarahkan pengguna memulai percakapan pertama di Chat.
  • State sukses: Daftar menampilkan percakapan yang tersimpan; memilih satu baris membuka percakapan itu di Chat dengan konteks tersimpan.
  • State error: Jika daftar gagal dimuat, tampilkan pesan kesalahan tenang beserta cara mencoba lagi.
  • Pemulihan: Pengguna dapat memuat ulang daftar; percakapan yang sudah ada tidak hilang.
Page 9 of 32

3. Functional Requirements

FR-1 — AI siap pakai tanpa penyiapan As a Pengguna AI, I should dapat langsung memakai AI tanpa melakukan penyiapan apa pun, sehingga saya bisa mulai bertanya tanpa konfigurasi teknis.

  • Provenance: explicit
  • Actor: Pengguna AI
  • Trigger/input: Pengguna membuka produk dan menuliskan prompt.
  • Observable result: AI menerima prompt dan menghasilkan tanggapan tanpa langkah penyiapan tambahan dari pengguna.
  • Access state: Setelah identitas terverifikasi untuk percakapan tersimpan; halaman Landing dapat diakses anonim.
  • Failure/recovery: Jika tanggapan gagal dihasilkan, pengguna dapat mengirim ulang prompt.
  • Continuation: Pengguna dapat melanjutkan percakapan atau memulai percakapan baru.
  • Acceptance: Tidak ada langkah penyiapan wajib (konfigurasi model, pemilihan parameter, atau pengaturan teknis) yang harus diselesaikan pengguna sebelum prompt pertama dapat diproses.
Page 10 of 32

FR-2 — Cakupan semua kategori permintaan As a Pengguna AI, I should dapat mengajukan permintaan dari kategori apa pun, sehingga saya tidak dibatasi pada topik tertentu.

  • Provenance: explicit
  • Actor: Pengguna AI
  • Trigger/input: Prompt pengguna dari kategori apa pun.
  • Observable result: AI memproses prompt dan menghasilkan tanggapan untuk kategori tersebut.
  • Access state: Setelah identitas terverifikasi.
  • Failure/recovery: Jika tanggapan gagal, pengguna dapat mengirim ulang atau mengubah prompt.
  • Continuation: Percakapan berlanjut dalam konteks yang sama.
  • Acceptance: Tidak ada daftar kategori yang dikecualikan dari pemrosesan.

FR-3 — Sensor minimal atau tanpa sensor As a Pengguna AI, I should menerima tanggapan dengan sensor seminimal mungkin atau tanpa sensor di semua kategori, sehingga saya tidak menghadapi penolakan yang tidak perlu.

  • Provenance: explicit
  • Actor: Pengguna AI
  • Trigger/input: Prompt pengguna yang sebelumnya mungkin ditolak oleh penyaring berlebih.
  • Observable result: AI menghasilkan tanggapan yang dapat digunakan alih-alih penolakan berbasis kategori.
  • Access state: Setelah identitas terverifikasi.
  • Failure/recovery: Jika tanggapan tidak dapat dihasilkan, pengguna menerima pesan kesalahan tenang dan dapat mengirim ulang atau mengubah prompt.
  • Continuation: Pengguna dapat melanjutkan percakapan.
  • Acceptance: Penolakan hanya terjadi bila benar-benar tidak dapat dihindari; tidak ada penolakan berbasis kategori yang dapat dihindari.
Page 11 of 32

FR-4 — Tanpa batas pemakaian As a Pengguna AI, I should memakai AI tanpa batas pemakaian berupa kuota atau penghitung pesan, sehingga saya tidak perlu mengkhawatirkan sisa jatah.

  • Provenance: explicit
  • Actor: Pengguna AI
  • Trigger/input: Setiap prompt yang dikirim, berapa pun jumlahnya.
  • Observable result: Prompt diproses tanpa pembatasan jumlah dan tanpa penolakan karena kuota.
  • Access state: Setelah identitas terverifikasi.
  • Failure/recovery: Jika pemrosesan gagal karena sebab teknis, pengguna dapat mengirim ulang tanpa kehilangan jatah.
  • Continuation: Pengguna dapat terus mengirim prompt berikutnya.
  • Acceptance: Tidak ada meteran kuota, penghitung pemakaian, badge "sisa pesan", atau pembatas jumlah permintaan yang ditampilkan atau diberlakukan.
Page 12 of 32

FR-5 — Pendaftaran mandiri sebelum penggunaan pertama As a Pengguna AI, I should mendaftar sendiri sebelum penggunaan pertama, sehingga saya memiliki identitas yang memungkinkan percakapan saya tersimpan dan dapat dilanjutkan.

  • Provenance: required_inference
  • Actor: Pengguna AI
  • Trigger/input: Pengguna memilih untuk mulai memakai AI dari Landing atau mengirim prompt pertama tanpa identitas.
  • Observable result: Akun dibuat dan pengguna diarahkan ke Chat untuk memulai percakapan pertama.
  • Access state: Halaman Sign Up dapat diakses tanpa identitas.
  • Failure/recovery: Jika pendaftaran gagal, pengguna menerima pesan kesalahan yang jelas dan dapat memperbaiki isian lalu mengirim ulang.
  • Continuation: Setelah pendaftaran berhasil, pengguna langsung dapat mengirim prompt.
  • Acceptance: Pendaftaran tidak memerlukan undangan, provisioning, atau campur tangan pihak lain.
Page 13 of 32

FR-6 — Verifikasi kembali untuk melanjutkan konteks tersimpan As a Pengguna AI, I should memverifikasi kembali identitas saya sebelum mengakses percakapan tersimpan, sehingga percakapan saya tetap milik saya dan dapat dilanjutkan.

  • Provenance: required_inference
  • Actor: Pengguna AI
  • Trigger/input: Pengguna kembali ke produk dan membuka Chat atau Conversations.
  • Observable result: Identitas terverifikasi dan percakapan tersimpan dapat diakses serta dilanjutkan.
  • Access state: Halaman Login dapat diakses tanpa identitas; Chat dan Conversations memerlukan identitas terverifikasi.
  • Failure/recovery: Jika verifikasi gagal, pengguna menerima pesan kesalahan yang tidak mengungkap keberadaan akun, dan dapat mencoba lagi atau beralih ke Sign Up.
  • Continuation: Setelah verifikasi berhasil, pengguna melanjutkan percakapan yang tersimpan.
  • Acceptance: Percakapan tersimpan tidak dapat diakses tanpa verifikasi identitas yang benar.
Page 14 of 32

FR-7 — Mengirim prompt dan menerima tanggapan AI As a Pengguna AI, I should menuliskan prompt dan menerima tanggapan AI dalam sebuah percakapan, sehingga saya mendapatkan jawaban yang dapat digunakan.

  • Provenance: required_inference
  • Actor: Pengguna AI
  • Trigger/input: Prompt yang dituliskan pada kolom prompt di halaman Chat.
  • Observable result: Tanggapan AI muncul dalam transkrip sebagai pesan baru.
  • Access state: Memerlukan identitas terverifikasi.
  • Failure/recovery: Jika tanggapan gagal dihasilkan, pesan kesalahan tenang muncul di posisi tanggapan yang gagal dan prompt asli tetap terlihat untuk dikirim ulang.
  • Continuation: Pengguna dapat mengirim prompt berikutnya dalam percakapan yang sama.
  • Acceptance: Setiap prompt yang berhasil diproses menghasilkan tanggapan yang terlihat di transkrip.
Page 15 of 32

FR-8 — Meninjau dan melanjutkan percakapan sebelumnya As a Pengguna AI, I should meninjau daftar percakapan saya dan melanjutkan salah satunya, sehingga konteks sebelumnya tidak hilang.

  • Provenance: required_inference
  • Actor: Pengguna AI
  • Trigger/input: Pengguna membuka Conversations dan memilih satu baris percakapan.
  • Observable result: Percakapan terpilih terbuka di Chat dengan konteks tersimpan, dan baris aktif ditandai aturan accent 1px di tepi kiri.
  • Access state: Memerlukan identitas terverifikasi.
  • Failure/recovery: Jika daftar gagal dimuat, pengguna menerima pesan kesalahan tenang dan dapat memuat ulang tanpa kehilangan percakapan.
  • Continuation: Pengguna dapat melanjutkan percakapan atau kembali ke daftar untuk memilih yang lain.
  • Acceptance: Setiap percakapan yang tersimpan muncul sebagai satu baris dengan judul dan timestamp muted, dan dapat dibuka kembali.

4. User Personas

Page 16 of 32

Pengguna AI

Konteks produk. Pengguna AI adalah satu-satunya aktor manusia pada frosty-ai. Ia adalah individu — bukan bagian dari organisasi — yang datang dengan pertanyaan atau permintaan yang beragam dan sering bersifat pribadi. Ia memakai produk kapan saja, termasuk pada dini hari, dan menginginkan alat yang tenang serta tidak menggurui.

Tujuan utama. Mendapatkan tanggapan AI yang dapat digunakan untuk permintaan dari kategori apa pun, tanpa penyiapan, tanpa sensor yang berlebihan, dan tanpa batas pemakaian.

Tanggung jawab yang diterima.

  • Menuliskan prompt dan mengirimkannya untuk diproses AI.
  • Menerima dan membaca tanggapan AI dalam transkrip percakapan.
  • Mendaftar sendiri sebelum penggunaan pertama agar percakapan dapat dimiliki dan dilanjutkan.
  • Memverifikasi kembali identitasnya saat kembali, agar percakapan tersimpan tetap dapat diakses.
  • Meninjau daftar percakapan dan memilih satu untuk melanjutkan konteks sebelumnya.

Input dan keputusan. Input utamanya adalah teks prompt yang ia tuliskan; keputusan utamanya adalah apa yang ingin ditanyakan, kapan memulai percakapan baru, dan percakapan mana yang ingin dilanjutkan. Ia juga memutuskan untuk mendaftar atau memverifikasi kembali ketika diminta.

Interaksi dengan peserta lain. Tidak ada peserta manusia lain. Satu-satunya pihak lain dalam perjalanannya adalah sistem AI yang menghasilkan tanggapan; tanggapan itu adalah hasil yang ia amati dan gunakan.

Page 17 of 32

Keberhasilan yang terlihat. Ia menerima tanggapan AI yang dapat digunakan di dalam transkrip, dapat mengirim prompt berikutnya tanpa hambatan kuota, dan dapat membuka kembali percakapan sebelumnya dengan konteks yang utuh.

Yang membedakan perannya. Pekerjaannya bukan mengelola, mengonfigurasi, atau mengawasi sistem. Ia hanya mengajukan permintaan dan membaca hasilnya. Karena itu, seluruh antarmuka dirancang agar tidak menuntut pengetahuan teknis, tidak menampilkan kontrol administratif, dan tidak menampilkan chrome pembatas.

5. Core User Flows

Alur 1 — Memahami produk dan memulai pendaftaran (Pengguna AI)

  1. Pengguna AI membuka frosty-ai tanpa identitas dan mendarat di Landing.
  2. Ia membaca satu kalimat display di hero: "Tanya apa saja. Tanpa batas, tanpa banyak sensor."
  3. Ia membaca tiga paragraf pendek yang dipisahkan aturan rambut 1px, masing-masing tentang "siap pakai", "sensor minimal", dan "tanpa batas".
  4. Ia menuliskan pertamanya pada kolom prompt putih 720px di hero, atau memilih baris ajakan mendaftar.
  5. Karena identitas belum ada, sistem mengarahkannya ke Sign Up dan mempertahankan teks prompt yang sudah ia tulis.
  6. Lanjutan: ia menyelesaikan pendaftaran di Sign Up, lalu melanjutkan ke Chat dengan prompt yang masih utuh.
Page 18 of 32

Alur 2 — Mendaftar sendiri sebelum penggunaan pertama (Pengguna AI)

  1. Pengguna AI tiba di Sign Up dari Landing.
  2. Ia mengisi kolom pendaftaran dengan label 11px huruf besar dan tracking 0.18em.
  3. Ia mengirimkan formulir melalui tombol blok padat warna primary.
  4. Hasil yang terlihat: akun dibuat dan ia diarahkan ke Chat untuk memulai percakapan pertama.
  5. Kegagalan dan pemulihan: jika pendaftaran gagal, pesan kesalahan yang jelas muncul di dekat kolom terkait tanpa emoji dan tanpa tanda seru; isian yang sudah benar dipertahankan dan ia dapat mengirim ulang.
  6. Lanjutan: setelah berhasil, ia langsung dapat mengirim prompt pertamanya.

Alur 3 — Memverifikasi kembali dan melanjutkan konteks tersimpan (Pengguna AI)

  1. Pengguna AI kembali ke frosty-ai dan membuka Login.
  2. Ia memasukkan kredensialnya pada kolom dengan radius 2px dan aturan 1px muted.
  3. Ia mengirimkan formulir melalui tombol masuk.
  4. Hasil yang terlihat: identitas terverifikasi dan ia diarahkan ke Conversations atau Chat dengan percakapan tersimpannya.
  5. Kegagalan dan pemulihan: jika verifikasi gagal, pesan kesalahan yang tidak mengungkap keberadaan akun ditampilkan; ia dapat mencoba lagi atau beralih ke Sign Up tanpa memuat ulang halaman.
  6. Lanjutan: setelah berhasil, ia melanjutkan percakapan yang tersimpan.
Page 19 of 32

Alur 4 — Mengirim prompt dan menerima tanggapan AI (Pengguna AI)

  1. Pengguna AI berada di Chat dengan identitas terverifikasi.
  2. Ia menuliskan promptnya pada kolom prompt putih yang dipasang di bawah, di atas aturan 1px.
  3. Ia mengirimkan prompt melalui tombol kirim persegi 44px berwarna accent unglazed clay — satu-satunya elemen tersaturasi pada produk.
  4. Hasil yang terlihat: tanggapan AI muncul dalam transkrip terpusat 640px sebagai pesan baru dengan fade 200ms; dengan prefers-reduced-motion, fade dihilangkan dan pesan tampil statis.
  5. Ia membaca tanggapan tersebut dan mengirimkan prompt berikutnya dalam percakapan yang sama, berapa pun jumlahnya, tanpa meteran kuota atau penghitung pesan.
  6. Kegagalan dan pemulihan: jika tanggapan gagal dihasilkan, pesan kesalahan tenang muncul di posisi tanggapan yang gagal; prompt aslinya tetap terlihat di transkrip sehingga ia dapat mengirim ulang.
  7. Lanjutan: percakapan tersimpan dan dapat ditinjau kembali nanti.

Alur 5 — Meninjau dan melanjutkan percakapan sebelumnya (Pengguna AI)

  1. Pengguna AI membuka Conversations dengan identitas terverifikasi.
  2. Ia melihat daftar satu kolom; setiap baris berisi satu baris judul dan timestamp muted, dipisahkan aturan rambut 1px, tanpa kartu dan tanpa grid.
  3. Ia memilih satu baris percakapan.
  4. Hasil yang terlihat: percakapan terbuka di Chat dengan konteks tersimpan, dan baris aktif ditandai aturan accent 1px di tepi kirinya.
  5. Kegagalan dan pemulihan: jika daftar gagal dimuat, pesan kesalahan tenang ditampilkan beserta cara mencoba lagi; percakapan yang sudah ada tidak hilang.
  6. Lanjutan: ia melanjutkan percakapan tersebut atau kembali ke daftar untuk memilih yang lain.
Page 20 of 32

Alur 6 — Memulai percakapan baru dari keadaan kosong (Pengguna AI)

  1. Pengguna AI berada di Chat atau Conversations tanpa percakapan yang ada.
  2. Ia melihat satu kalimat tenang yang mengundangnya menuliskan prompt pertama; tidak ada kartu, tidak ada ikon fitur, tidak ada baris manfaat tiga kolom.
  3. Ia menuliskan prompt pertamanya dan mengirimkannya.
  4. Hasil yang terlihat: percakapan baru terbentuk dan tanggapan AI muncul dalam transkrip.
  5. Lanjutan: percakapan baru itu muncul di Conversations sebagai satu baris dengan judul dan timestamp muted.
Page 21 of 32

6. Visuals Colors and Theme

Arah kreatif bersifat otoritatif untuk bagian ini. Muse: Kenya Hara — kehampaan sebagai antarmuka. Headline arah: Emptiness as the interface.

Mode. Light mode sebagai mode utama. Tidak ada mode gelap yang ditentukan.

Warna (light mode).

PeranHexPenggunaan
Background#F7F5F0Kertas putih hangat, dari tepi ke tepi
Surface#FFFFFFKolom prompt, kartu percakapan
Text#23211EArang tanpa pemutih, bukan hitam murni
Primary#3A3833Blok padat untuk aksi utama — batu hangat, bukan biru
Accent#8C6E4FTanah liat tanpa glasir: tombol kirim, penanda percakapan aktif, aturan fokus tipis
Muted#B9B3A8Aturan rambut 1px dan metadata sekunder

Proporsi: sekitar 85% ground, 12% surface, 3% accent. Tidak ada gradien, tidak ada kaca, tidak ada glow.

Tipografi. Heading dan body: Zen Kaku Gothic New. Heading hanya Light 300 dan Regular 400 — tidak pernah bold. Tracking lebar 0.04em–0.12em pada heading kecil, sentence case. Baris display diset pada weight ringan agar kata-kata terasa ditempatkan, bukan diumumkan. Label dan metadata huruf besar 11–12px dengan tracking 0.18em.

Skala tipe. Modular 1.25: 12 / 15 / 19 / 24 / 30 / 38 / 48 / 60. Display clamp(40px, 7vw, 60px) pada hero Landing. Body 15–16px dengan line-height 1.85. Prosa chat 17px dengan line-height 1.9. Metadata 12px.

Page 22 of 32

Bahasa bentuk. Persegi dan hampir persegi saja: radius 2px pada input dan tombol, 0px pada panel dan kartu percakapan. Aturan tipis 1px berwarna muted memisahkan setiap wilayah — tanpa bayangan, tanpa border lebih tebal dari 1px, tanpa pil, tanpa blob. Satu-satunya pengecualian adalah kontrol kirim: persegi 44px dengan radius 2px. Ruang napas adalah bentuknya: padding vertikal 96–160px antar bagian di desktop, 56–72px di mobile.

Tata letak. Kolom tunggal terpusat, max-width 640px untuk prosa dan 720px untuk kolom prompt, dengan grid 12 kolom yang kolom luarnya tetap kosong di desktop. Landing adalah rangkaian ruang sunyi: hero hampir kosong (satu kalimat, satu kolom), lalu aturan tipis, lalu tiga paragraf pendek tentang "siap pakai / sensor minimal / tanpa batas" masing-masing dengan 120px udara, lalu baris pendaftaran. Chat: rel kiri 240px berisi percakapan yang dipisahkan aturan rambut, transkrip terpusat 640px, kolom prompt berupa bilah putih yang dipasang di bawah dengan aturan 1px di atasnya. Conversations: kolom tunggal baris, setiap baris satu baris judul plus timestamp muted, dipisahkan aturan rambut — tanpa kartu, tanpa grid.

Gaya citra. Tidak ada fotografi, ilustrasi, 3D, atau ikon selain satu panah kirim bergaris 1px dan satu caret tipis. Konten visualnya adalah kehampaan itu sendiri: bidang kertas putih yang luas, aturan tipis, dan tipografi. Satu-satunya "gambar" yang diizinkan adalah band still-life selebar penuh di Landing — foto dari atas selembar kertas kosong tanpa pemutih di atas permukaan abu-abu hangat, didesaturasi mendekati monokrom — dipakai sebagai pemisah bagian, tidak pernah di belakang teks.

Page 23 of 32

Yang dihindari. Biru atau indigo (#0057FF, #2563EB, #6366F1 dan sekitarnya); meteran kuota, penghitung pemakaian, badge "sisa pesan", atau chrome apa pun yang menyiratkan batas; gradien, glassmorphism, blob buram, glow, dan drop shadow; Inter, Roboto, Arial, Helvetica, Poppins, Lato, Open Sans, atau system-ui untuk heading maupun body; kartu dengan hover-lift, tombol pil, dan sudut membulat di atas 2px; 3D, particle field, kanvas generatif, atau animasi hero apa pun di luar satu fade 600ms; grid ikon fitur dan baris manfaat tiga kolom; emoji, tanda seru, dan superlatif pemasaran dalam salinan UI.

Aksesibilitas teks dan kontrol. Headline, wordmark, label, angka, teks kartu, dan kontrol tetap utuh di dalam viewport dan kontainernya pada 375px, 768px, dan 1280px, membungkus atau menskalakan (misalnya font-size: clamp(...) dengan ukuran mobile-nya) agar muat, dan tidak ada elemen lain yang menutupi bagian mana pun darinya. Citra, dekorasi, dan gerak mengikuti arah kreatif: foto, karya, bentuk, tekstur, atau animasi boleh dipotong, meluber keluar tepi, diputar, ditumpuk, atau dipotong persis seperti yang diminta arah, selama tidak menutupi teks atau kontrol yang dapat dibaca. Dengan prefers-reduced-motion, sediakan susunan statis yang dapat digunakan.

Page 24 of 32

7. Signature Design Concept

Konsep: Ruang Sunyi dengan Satu Tanda.

Layar pertama Landing sengaja hampir kosong dan tidak mungkin disalahartikan sebagai hero SaaS. Ground adalah kertas putih #F7F5F0 dari tepi ke tepi. Di kiri atas, wordmark 12px huruf besar FROSTY-AI berwarna muted #B9B3A8 dengan tracking 0.18em. Di tengah viewport, sedikit di atas titik tengah sejati: satu kalimat pada weight 300, clamp(40px, 7vw, 60px), sentence case, leading 1.15, rata kiri pada kolom 640px yang dimulai dari kolom grid pertama — "Tanya apa saja. Tanpa batas, tanpa banyak sensor." Di bawahnya, 48px udara, lalu kolom prompt putih selebar 720px (aturan muted 1px, radius 2px, placeholder 17px "Mulai menulis…") dengan satu tombol kirim persegi 44px berwarna accent #8C6E4F flush kanan di dalam kolom. Tidak ada apa pun lagi di layar pertama — tanpa subheadline, tanpa butir fitur, tanpa baris tombol, tanpa gradien, tanpa blob, tanpa ilustrasi. Dramanya adalah skala kalimat terhadap kehampaan.

Page 25 of 32

Gerakan khas yang membawa konsep ini.

  • Hero kertas putih yang hampir kosong: kehampaan itu sendiri adalah pitch untuk "tanpa batas".
  • Aturan rambut 1px #B9B3A8 sebagai satu-satunya perangkat struktural: memisahkan setiap bagian, setiap baris percakapan, dan aturan di atas input chat, menggantikan semua kartu dan bayangan.
  • Blok accent persegi 44px #8C6E4F sebagai satu-satunya elemen tersaturasi di seluruh produk — kontrol kirim — sehingga "tanpa batas" terbaca sebagai satu tanda tenang, bukan penghitung atau badge.
  • Riwayat percakapan sebagai daftar satu kolom baris yang dipisahkan aturan rambut (judul + timestamp relatif muted), tidak pernah kartu, dengan baris aktif ditandai aturan accent 1px di tepi kirinya alih-alih isian warna.
  • Tipografi sebagai satu-satunya ornamen: kalimat display pada weight 300 dengan tracking 0.04em dan leading 1.15, mengambang dalam 120px udara vertikal, dengan semua label 11px huruf besar pada tracking 0.18em — tanpa bold di mana pun.

Konsep ini hanya menyusun ulang konten, state, dan kontrol yang sudah diterima; ia tidak menambah perilaku, halaman, atau tujuan baru.

Page 26 of 32

8. Interaction Model & Motion Direction

Interaction Model: Static (direction) Motion Tempo: still Hero Dimensionality: flat

Landing Hero Motion Brief

  • Subjek fokus: Kalimat display light 300 "Tanya apa saja. Tanpa batas, tanpa banyak sensor." dan kolom prompt putih 720px di bawahnya, mengambang dalam kehampaan kertas putih.
  • Tesis input → transformasi → hasil: Pada paint pertama, kalimat hero muncul melalui satu fade opacity 600ms yang lambat; setelah itu tidak ada gerakan lain. Ketika pengguna mengetikkan prompt dan mengirimkannya, teks itu berpindah dari kolom prompt ke transkrip sebagai pesan, dan tanggapan AI menyusul dengan fade 200ms. Tidak ada gerakan yang menyiratkan batas, antrean, atau penundaan.
  • Kosakata gerak: Fade opacity lambat 600ms pada paint pertama hero; fade 200ms saat pesan baru tiba; penanda aktif rel percakapan bergeser 1px dalam warna accent. Tidak ada yang memantul, tidak ada yang terangkat, tidak ada yang parallax.
  • Frame pertama yang tersusun: Kertas putih #F7F5F0 dari tepi ke tepi; wordmark 12px muted di kiri atas; satu kalimat display light 300 rata kiri pada kolom 640px; 48px udara; kolom prompt putih 720px dengan tombol kirim persegi 44px accent flush kanan. Tidak ada elemen lain.
  • State reduced-motion: prefers-reduced-motion menghapus fade sepenuhnya dan menampilkan semuanya statis — hero, pesan baru, dan penanda aktif rel semuanya tampil tanpa transisi.

Tidak ada permintaan 3D/WebGL eksplisit dari pengguna, dan dimensionalitas hero arah adalah flat, sehingga tidak ada Canvas/R3F/Drei yang diperlukan.

Page 27 of 32

9. Non-Functional Requirements

NFR-1 — Tidak ada chrome pembatas. Antarmuka tidak boleh menampilkan meteran kuota, penghitung pemakaian, badge "sisa pesan", atau elemen apa pun yang menyiratkan adanya batas pemakaian. Provenance: explicit (constraint pengguna "tanpa limit pemakaian"). Rationale: janji produk harus konsisten antara perilaku dan tampilan.

NFR-2 — Sensor minimal atau tanpa sensor. Pemrosesan prompt harus beroperasi dengan sensor seminimal mungkin atau tanpa sensor di semua kategori. Provenance: explicit (constraint pengguna). Rationale: ini adalah janji inti produk.

NFR-3 — Keutuhan teks dan kontrol. Headline, wordmark, label, angka, teks kartu, dan kontrol harus tetap utuh di dalam viewport dan kontainernya pada 375px, 768px, dan 1280px, membungkus atau menskalakan agar muat, dan tidak boleh ditutupi elemen lain. Provenance: explicit (arah kreatif). Rationale: keterbacaan dan keterjangkauan kontrol di semua viewport.

NFR-4 — Dukungan reduced-motion. Dengan prefers-reduced-motion, semua fade dihapus dan antarmuka menampilkan susunan statis yang dapat digunakan. Provenance: explicit (arah kreatif). Rationale: menghormati preferensi pengguna terhadap gerakan.

NFR-5 — Keamanan akses percakapan. Percakapan tersimpan hanya dapat diakses setelah verifikasi identitas yang benar, dan pesan kesalahan verifikasi tidak boleh mengungkap keberadaan akun. Provenance: required_inference. Rationale: percakapan bersifat pribadi dan harus tetap terikat pada pemiliknya.

Page 28 of 32

NFR-6 — Ketahanan state durabel. Percakapan dan pesan harus tersimpan secara durabel sehingga dapat ditinjau dan dilanjutkan kembali setelah verifikasi ulang. Provenance: required_inference (durable_state_required). Rationale: pelanjutan konteks sebelumnya adalah bagian dari perjalanan yang diterima.

NFR-7 — Tidak ada perbedaan izin berbasis peran. Tidak ada RBAC, visibilitas berbasis peran, atau kontrol izin yang ditentukan; pemisahan data antar-pengguna berasal dari kepemilikan percakapan, bukan dari peran. Provenance: required_inference. Rationale: hanya ada satu peran manusia yang diterima.

10. Tech Stack

  • Frontend: React (aplikasi web dengan antarmuka kustom).
  • Backend: Python/FastAPI, diperluas sebagai backend bersama untuk rute dan modul domain baru (autentikasi, percakapan, pesan, integrasi AI), menggunakan proses, port, dan deployment yang sama.
  • Penyimpanan: Penyimpanan persisten yang sesuai untuk akun, percakapan, dan pesan, agar state durabel dan pelanjutan konteks dapat dipenuhi.
  • Kontainerisasi: Docker dan docker-compose sebagai inventaris layanan yang dapat dijalankan; backend yang ada diperluas alih-alih menambah kontainer baru untuk API domain.
  • Orkestrasi: Kubernetes tidak diperlukan untuk deployment saat ini.

Pilihan teknologi yang disebutkan sumber dipertahankan apa adanya; tidak ada substitusi default.

Page 29 of 32

11. Assumptions and Constraints

Asumsi.

  • [Default — not specified by user] Aplikasi web diakses melalui browser modern di desktop dan mobile.
  • [Default — not specified by user] Satu pengguna memiliki satu akun aplikasi dengan kredensial yang dapat diverifikasi.
  • [Default — not specified by user] Judul percakapan diturunkan dari isi percakapan dan ditampilkan bersama timestamp aktivitas terakhir.
  • [Default — not specified by user] Tanggapan AI dihasilkan oleh proses sistem di belakang antarmuka; pengguna tidak berinteraksi langsung dengan proses tersebut.

Batasan.

Page 30 of 32
  • AI harus siap pakai: tidak ada langkah penyiapan wajib sebelum prompt pertama dapat diproses.
  • AI harus mencakup semua kategori permintaan.
  • AI harus beroperasi dengan sensor minimal atau tanpa sensor di semua kategori.
  • Tidak ada batas pemakaian berupa kuota, penghitung pesan, atau pembatasan jumlah permintaan.
  • Identitas dimiliki aplikasi: pendaftaran mandiri dan verifikasi kembali adalah prasyarat perjalanan.
  • Halaman Landing, Sign Up, dan Login dapat diakses tanpa identitas; halaman Chat dan Conversations memerlukan identitas terverifikasi.
  • Tidak ada peran administratif, moderasi manual, atau antarmuka pengelolaan pengguna.
  • Tidak ada alur peningkatan layanan berbayar, langganan, atau penagihan.
  • Palet, tipografi, bahasa bentuk, tata letak, dan gaya citra mengikuti arah kreatif yang diberikan; template SaaS indigo/biru-putih generik dilarang untuk proyek ini.
  • Tidak ada persyaratan masa depan yang diterima pada thread ini.
Page 31 of 32

12. Glossary

  • Pengguna AI — Satu-satunya aktor manusia pada frosty-ai; individu yang mengajukan permintaan dan menerima tanggapan AI.
  • Prompt — Teks permintaan yang dituliskan pengguna pada kolom prompt untuk diproses AI.
  • Tanggapan AI — Pesan hasil pemrosesan AI yang muncul dalam transkrip percakapan.
  • Percakapan (Conversation) — Rangkaian pesan antara pengguna dan AI yang tersimpan, memiliki judul dan waktu aktivitas terakhir, serta dapat ditinjau dan dilanjutkan.
  • Transkrip — Tampilan berurutan pesan pengguna dan tanggapan AI di dalam sebuah percakapan.
  • Sensor — Penyaringan atau penolakan konten yang dilakukan sistem terhadap prompt atau tanggapan; produk ini menargetkan sensor seminimal mungkin atau tanpa sensor.
  • Tanpa batas pemakaian — Tidak adanya kuota, penghitung pesan, atau pembatasan jumlah permintaan yang diberlakukan atau ditampilkan.
  • Identitas aplikasi — Akun yang dimiliki aplikasi, dibuat melalui pendaftaran mandiri dan diverifikasi kembali melalui Login, yang mengikat percakapan pada pemiliknya.
  • Rel percakapan — Daftar percakapan selebar 240px di sisi kiri halaman Chat, dipisahkan aturan rambut 1px, dengan baris aktif ditandai aturan accent 1px di tepi kiri.
  • Aturan rambut (hairline rule) — Garis 1px berwarna muted #B9B3A8 yang menjadi satu-satunya perangkat struktural pemisah wilayah pada produk.
Page 32 of 32

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: Read product promise
Landing: Write first prompt
Landing: View redirect notice
Sign Up: Fill registration form
Sign Up: 1. Submit registration
Sign Up: 2. Fix error and resubmit
Chat: Send preserved prompt
Chat: 1. Receive AI response
Chat: 2. View failed response error
Chat: 3. Resend failed prompt
Chat: 4. Send next prompt
Landing: Go to login
Login: 1. Enter credentials
Login: 2. Submit verification
Login: 3. Retry failed verification
Conversations: 5. View conversation list
Conversations: 6. Select conversation
Chat: 7. Continue selected conversation
Conversations: 8. Reload failed list
Conversations: 9. View empty state
Chat: 10. Start new conversation
Conversations: View new conversation row

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: Read product promise
Landing: Write first prompt
Landing: View redirect notice
Sign Up: Fill registration form
Sign Up: 1. Submit registration
Sign Up: 2. Fix error and resubmit
Chat: Send preserved prompt
Chat: 1. Receive AI response
Chat: 2. View failed response error
Chat: 3. Resend failed prompt
Chat: 4. Send next prompt
Landing: Go to login
Login: 1. Enter credentials
Login: 2. Submit verification
Login: 3. Retry failed verification
Conversations: 5. View conversation list
Conversations: 6. Select conversation
Chat: 7. Continue selected conversation
Conversations: 8. Reload failed list
Conversations: 9. View empty state
Chat: 10. Start new conversation
Conversations: View new conversation row