twc-016 / Studi oleh Syafril · bukan proyek klien

Morrow Watch: Morrow Watch

Bengkel gambar jam fiktif dengan situs berupa satu lembar gambar, M—01. Layar pertama adalah gambar kerja: radio asli untuk tiga dial dan dua siluet tali di samping vektor orisinal yang diubahnya, lensa detail, dan SVG yang diekspornya. Tab berkas mengarah ke dua siluet di bawah satu dial dan ke versi tersimpan beserta SVG dan catatan TXT-nya.

Tangkapan layar desktop asli demo Morrow Watch.

BACA KEPUTUSAN DESAIN

Mengapa disusun seperti ini.

Tangkapan layar menunjukkan pembuka yang diimplementasikan. Catatan menghubungkan komposisinya dengan pengalaman yang berfungsi dan perilaku di ponsel.

Tangkapan layar website asli. Ikuti catatan bernomor.
  1. 01

    Gambarnya menjadi pembuka

    Tanpa slogan atau hero: layar pertama adalah lembar M—01 dan h1-nya nama gambar. Radio asli untuk dial dan tali berada di samping vektor yang diubahnya, dengan ekspor SVG di bawah baris status.

  2. 02

    Tab berkas, bukan bab

    Gambar kerja, Siluet tali, dan Versi tersimpan adalah tautan halaman sungguhan yang menggantung di atas lembar; yang terbuka ditandai sebagai halaman aktif. Di ponsel ketiganya berbagi satu baris.

  3. 03

    Lembar menyebut batasnya

    Kepala lembar menyebut dua berkas yang diberikannya (SVG / TXT); blok identitas di kakinya menyebut objek, kombinasi pada gambar, dan “Konsep visual · bukan gambar manufaktur”. 620 × 500 adalah kanvas SVG, bukan milimeter.

Sekilas desain

Tipografi judul
B612
Tipografi isi
DM Sans
Coba interaksi ini
Lembar gambar M—01: radio dial dan tali di samping vektor yang diekspornya
Latar#142a3d
Tinta#f1f2e9
Penanda#e7b66a
Permukaan pendukung#2b465b
Skema komposisi yang diimplementasikan.

YANG TERSEDIA / LANGKAH BERIKUTNYA

Pahami yang Anda pilih.

Gambar konsep untuk disusun, dibandingkan, dan dibawa ke diskusi desain.

Berfungsi pada demo ini

  • Radio dial dan tali dengan ekspor SVG yang sesuai
  • Dua siluet tali di bawah satu dial
  • Satu versi tersimpan dengan pemulihan dan catatan TXT di browser ini
  • Lensa detail dan studi lapisan
  • Geometri jam orisinal

Alat ini mencakup ruang kerja yang berfungsi dan buku komponen sendiri. Kontrolnya mengolah status lokal.

Integrasi produksi untuk didiskusikan

  • Informasi usaha nyata, aset merek berlisensi, serta layanan akun, pemesanan, atau transaksi memerlukan implementasi yang disepakati terpisah.

Ekspor dibuat di browser Anda. Tidak terhubung dengan akun, penyimpanan awan, atau layanan eksternal.

Batasan untuk direncanakan

Studi desain fiktif. Gambar ini konsep visual tanpa skala fisik, bukan gambar manufaktur; warna dan siluet tidak menentukan material, dan ekspor menjadi artefak perencanaan lokal.

Penyerahan & penyesuaian

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 ini

Gagasannya

Susun gambar jam dan ekspor SVG-nya. Konsep jam dibahas di atas gambar, jadi lembar gambar menjadi seluruh situs: papan nama bengkel, tab berkas, lembar dengan konfigurasi dan gambarnya, serta blok identitas yang menyebut gambar itu bukan apa.

Bahasa visual

Latar biru tinta, tinta gambar kapur, dan kuningan untuk pilihan dan keterangan; garis 1 px membingkai lembar, tabnya, dan blok identitas, dan gambar berada di grid teknis pucat. Geometri vektor orisinal menjadi subjek utama; tanpa foto atau kaca optik.

Tipografi

B612, yang dirancang untuk layar instrumen kokpit, membentuk wordmark, judul lembar, kombinasi, dan nomor objek seperti label gambar teknik. DM Sans membawa tab, radio, keterangan, dan catatan. Tanpa huruf monospace.

Tata letak & komposisi

Setiap halaman adalah satu lembar gambar: papan nama bengkel dengan nomor dokumen, tiga tab berkas (Gambar kerja, Siluet tali, Versi tersimpan), kepala lembar, kolom konfigurasi 290 px di samping bidang gambar, dan blok identitas selebar lembar. Di ponsel urutannya papan nama, tab, judul, pilihan dan ekspor, lalu gambar dan blok identitas.

Gerak & interaksi

Pilihan yang berubah menggambar ulang vektor dengan geser singkat; studi lapisan memisahkan lapisannya bila diminta. Reduced motion mengubah keduanya tanpa menggerakkan apa pun.

Di balik layar

Halaman Next.js statis dwibahasa dengan satu draf browser tervalidasi (kombinasi dan versi tersimpan), ekspor SVG dan TXT eksplisit, dan komponen berscope independen. Tanpa akun, pengiriman eksternal, atau transaksi produksi.

Dirancang untuk semua

Radio asli dengan nama lokal dan tanda ✓, tab berkas sebagai tautan halaman dengan halaman aktif ditandai, lensa detail bertombol tekan, dan setiap perubahan diucapkan di baris status. Fokus terlihat, target 44 px, tidak ada keadaan yang hanya dibedakan warna, reduced motion.

Di dalam pengalaman

  • Gambar kerja dengan radio dial dan tali asli
  • Ekspor SVG yang sesuai dengan kombinasi aktif
  • Dua siluet tali di bawah satu dial
  • Versi tersimpan dengan pemulihan dan catatan TXT
  • Lensa detail dan studi lapisan
  • Buku komponen dan status sendiri
  • Personalisasi merek lokal

Cocok untuk

  • Desainer jam dan aksesori independen yang menyajikan gambar konsep.
  • Kolaborator mereka: orang yang ingin mencoba kombinasi dan membawa gambarnya ke diskusi desain.

Di berbagai layar

Tangkapan layar desktop asli demo Morrow Watch.
Tangkapan layar desktop asli demo Morrow Watch.
Tangkapan layar ponsel asli demo Morrow Watch.
Tangkapan layar ponsel asli demo Morrow Watch.

Sudut pandang lain