twc-029 / Studi oleh Syafril · bukan proyek klien
Meja klien fiktif untuk agensi atau konsultan: pindahkan peluang melalui empat tahap, baca riwayat tiap kontak, jaga satu langkah berikutnya per peluang, dan hitung pipeline. Setiap orang, perusahaan, dan kesepakatan adalah contoh latihan di satu peramban; tanpa harga, nilai deal, email, atau akun nyata.
BACA KEPUTUSAN DESAIN
Tangkapan layar menunjukkan pembuka yang diimplementasikan. Catatan menghubungkan komposisinya dengan pengalaman yang berfungsi dan perilaku di ponsel.
Empat lajur bernomor menamai percakapan, bukan tumpukan kartu statistik. Di ponsel pemilih tahap berlabel menampilkan satu lajur; tidak ada yang mewajibkan geser horizontal.
Seret pegangannya, bawa dengan papan ketik, atau pakai Pindahkan ke…. Ketiganya melewati satu reducer domain, mengumumkan tahap dan posisi dengan kata, dan menyimpan satu urungkan untuk sesi.
Rail tinta 88px dengan tujuan berlabel memberi lebar untuk lajur; di ponsel empat tujuan pindah ke navigasi bawah dan sisanya tetap di menu header dan ⌘K.
#eef2f6#203b61#ccdef3#ffffff#f0ddb5YANG TERSEDIA / LANGKAH BERIKUTNYA
Putuskan percakapan klien mana yang bergerak berikutnya.
Alat ini mencakup ruang kerja yang berfungsi dan buku komponen sendiri. Kontrolnya mengolah status lokal.
Ekspor dibuat di browser Anda. Tidak terhubung dengan akun, penyimpanan awan, atau layanan eksternal.
Studi desain fiktif, bukan CRM operasional. Tanpa klien, harga, nilai deal, kontrak, email, kalender, atau pengingat nyata. Penyimpanan lokal tidak dibagi lintas perangkat, tanpa transaksi lintas tab, dan tidak terenkripsi; jangan memasukkan data klien sungguhan.
Cakupan halaman, aset merek, konten, serah terima, hosting, biaya, dan dukungan dibahas lewat konsultasi sebelum pengerjaan dimulai. Demo menjadi referensi untuk percakapan tersebut.
Siapkan brief untuk arah iniHubungan disimpan dalam map, bukan dashboard. Artefak Relasi adalah map klien: lembar kontak, kartu peluang berlidah indeks, tulang punggung riwayat, dan lembar tindak lanjut. Pembukanya langsung pipeline — Kenalan, Pemetaan, Proposal, Sepakat — sehingga tugas pertama adalah memutuskan percakapan mana yang bergerak berikutnya.
Biru tinta, kertas biru pucat, dan penanda gandum untuk hari acuan. Rail tinta ringkas 88px dan map bertepi lidah berjenjang membedakannya dari indeks buku bata Saku Dapur. Kartu bersudut lidah indeks 14px dan 3px di sisi lain; tanpa avatar foto, tumpukan kartu statistik, atau gradien.
Figtree 600 menulis wordmark, judul, nomor lajur, dan hitungan; Figtree 400 membawa kartu, tabel, label, dan teks baca. Keduanya WOFF2 Latin statis, satu bobot per berkas, dengan angka tabular tanpa bold atau italic tiruan. Commissioner 600 tetap cadangan tercatat yang tidak dipakai.
Rail tinta, header putih dengan nama meja, baris studi fiktif, lalu tugasnya. Pipeline dibuka dengan strip ringkasan bergaris dan empat lajur bernomor; pada 701–1100px papan menjadi dua kali dua, dan di ponsel pemilih tahap berlabel menampilkan satu lajur dengan navigasi bawah empat tujuan. Kontak terbuka sebagai map klien penuh dengan margin tindak lanjut 310px.
Kartu yang diangkat mengikuti pointer tanpa pegas atau miring; kartu yang ditaruh mengendap dalam 160ms dan laci detail bergeser dalam 180ms. Keduanya hilang pada reduced motion yang dibaca langsung. Tanpa confetti, bunyi, atau skeleton berkilau.
Halaman App Router statis dwibahasa. Satu record berversi, collection-relasi-crm-v1, divalidasi zod/mini pada setiap baca dan sebelum setiap tulis: 64 KiB sebelum parse, 20 kontak, 20 peluang, 60 entri riwayat, dan 20 tugas, objek ketat, tanggal kalender, dan pemeriksaan relasi. Seret, papan ketik, dan formulir Pindahkan ke… memakai satu reducer domain murni; perubahan tab lain ditawarkan, tidak diterapkan diam-diam.
Lajur adalah section berjudul dengan daftar kartu berurutan. Kartu diangkat dari pegangan berlabel dengan Spasi atau Enter, panah memilih tahap dan posisi, Home/End melompat, Enter menaruh, dan Escape mengembalikannya; setiap langkah diumumkan dengan kata. Pindahkan ke… selalu tersedia sebagai formulir. Dialog memerangkap dan memulihkan fokus, formulir memfokuskan kolom salah pertama, tabel mempertahankan caption dan status urut, dan kedua mode warna menjaga teks minimal 4,5:1.
Dari nota toko ke pekerjaan di baliknya.
Semangat independen. Karakter grafis yang tegas.