Electronic Materials Office
Bara geni sing murub ing galeri sing dihias nganggo areng
Kantor Bahan Elektronik kuwi bengkel sing dianakake ing wayah wengi: kanvas ireng legam sing matte, bara oranye sing sumunar siji, lan jinis huruf sing bisik-bisik tinimbang ngumumake. Antarmuka kasebut nganggep saben layar kaya studio sing peteng—foto keyboard minangka siji-sijine sumber cahya sing nyata, lan UI manut karo iku. Judhul utama, sing disetel ing GT-Flexa bobot 200, ngambang ing ruang negatif sing jembar; salinan awak sengaja cilik lan humanistik (Times). Werna diukur: putih murni kanggo jinis, ungu sing diredam (#9e9eff) kanggo pranala, lan siji ajakan tumindak oranye (#f45500) ing kaca sing sumunar kanthi cahya 30px dhewe. Komponen pas rapet ing radius 20px, wates meh ora katon ing #9d9d9d, lan siji-sijine bayangan ing sistem yaiku rong halo warna ing sekitar tumindak utama.
Kanvas areng ambane lengkap kanthi konten ambane maksimal ing tengah (~1200px). Layar utama diwiwiti nganggo kertu media radius 20px sing ngemot video produk, ngenggoni kira-kira 80% saka ambane viewport, langsung diterusake karo judhul GT-Flexa 200 multi-baris sing mbungkus meh ambane konten lengkap. Ritme bagean: bagean deskripsi produk siji kanthi huruf kapital gaya Tobias, diterusake karo kothak 2x2 (ing desktop) kertu deskripsi produk. Kertu nggunakake wates 1px #9d9d9d lan talang 24px ing antarane. Nafas vertikal sing akeh—bagean dipisahake dening ruang negatif areng 48–128px tinimbang pembagi. Navigasi minangka panel transparan tunggal sing dipasang ing sisih ndhuwur, kanthi klompok pranala sing didhelikake lan ajakan tumindak Ember siji. Ora ana sidebar, ora ana mega-menu, ora ana navigasi sekunder.
Gambar-gambar iki mung kanggo tujuan demonstrasi produk—foto makro close-up keyboard Altar I kanthi latar mburi ireng kabeh, kanthi lampu latar saka ndhuwur, sing nyebabake casing sumunar lan keycaps mantulkan cahya ing pinggir-pinggire. Ora ana gaya urip, ora ana tangan manungsa, ora ana konteks lingkungan. Gambar kasebut kontras dhuwur lan peteng; siji-sijine warna ing njaba palet monokrom yaiku saklar daya oranye ing keyboard kasebut, sing nggambarake ajakan tumindak Ember Orange. Gambar kasebut kothak utawa 16:9, tansah diselehake ing kertu kanthi radius 20px lan ngluwihi pinggir kertu (ora ana bantalan ing sekitar foto, lan teks ana ing ngisor pinggir). Gaya ikon: siji-sijine ikonografi yaiku bunderan cilik sing diisi (●) sadurunge logo—titik oranye siji, kandele ~6px.
Palet
Merek
- Ember Orange
#f45500— Tombol aksi utama kanthi isian minangka siji-sijine permukaan kromatik ing UI, tansah diiringi halo oranye 30px, saengga sumunar kaya filamen; sumunar njaba 30px ing tombol panggilan utama nduplikasi simbol heksagon Ember Orange, nanging ana minangka bayangan tinimbang isian, saengga tombol kasebut katon madhangi saka njero.
Netral
- Studio Charcoal
#202020— Lumahing kanvas lan kardus kuwi kaya lantai galeri sing peteng, ora tau ireng blas, saengga mripat bisa ndeleng pinggiran sing alus. - Bone White
#ffffff— Teks utama, wates tipis ing gambar, lan permukaan sing langka diwalik. Kabeh hirarki font dijaga kanthi mandiri. - Ash Gray
#9d9d9d— Teks sing ora kalem, wates kertu sing alus, lan keterangan sing ora aktif minangka siji-sijine warna abu-abu ing skema warna, sing digunakake nalika putih banter banget. - Mid Felt
#eaeaea— Sapuan permukaan entheng kanggo panel kuwalik utawa kisi modal - warna putih sing ana ing antarane kanvas beige lan peteng. - Carbon
#000000— Aksen sing paling narik kawigaten yaiku kanggo goresan ikon lan pigura sing kontras ing ngendi kanvas areng kasebut kepanasen kanggo nahan bentuke kanthi apik. - Lavender Link
#9e9eff— Werna pranala sing dipasang lan garis luar pigura aksi tambahan minangka kontras sing kalem lan adhem karo oranye anget, sing njamin aksi kasebut bisa diwaca kanthi latar mburi areng.
Tipografi
saka 16 nganti 86px · 8 langkah
- GT-Flexa — panggantos: Inter (200/400) or Manrope (200/400) · garis besar 200, 400 · Font utama kanggo judhul lan unsur dekoratif. Bobot 200 ngidini saben judhul ing ndhuwur 24px—iki minangka gaya khas: ing 68px lan 86px, huruf-huruf kasebut katon larut ing atmosfer tinimbang mbengok. Bobot 400 cocok kanggo subjudul lan keterangan kertu, ing ngendi meh ora bisa dirungokake. Jarak baris dikurangi dadi 1.0 ing ukuran paling gedhe, mula font dekoratif numpuk siji ing ndhuwur liyane kaya kolom udara.
- Tobias-light — panggantos: Söhne Buch or Inter Tight · garis besar 400 · Gaya tipografi sekunder kanggo judhul bagean lan logo footer. Iki digunakake siji langkah ing ngisor GT-Flexa 200 kanggo nggawe kontras tonal—Tobias nduweni nuansa arsitektural lan ekspresif sing luwih, dene GT-Flexa luwih atmosferik. Jarak huruf negatif nyuda proporsi Tobias Light sing amba.
- Times — panggantos: Source Serif 4 or PT Serif · garis besar 400 · Teks awak lan paragraf judhul minangka tandingan sing disengaja kanggo font geometris lan dekoratif, nggunakake serif. Serif nambahake kehangatan lan otoritas editorial kanggo deskripsi produk tanpa ngluwihi ukuran teks awak.
Interval lan wujud
| Tujuan | Tegese |
|---|---|
| Kapadhetan | padhet |
| Langkah dhasar | 4-8px |
| Radius tombol | 20px |
| Radius kertu | 20px |
| Bayangan | ora ana wates tinimbang bayangan |
| Antarane bagean | 48-128px |
| Ambane kaca | 1200px |
AI bakal mbangun situs web sampeyan nganggo gaya Electronic Materials Office lan ngisi situs kasebut
- Isi nganggo produk lan kiriman liwat pranala - Instagram, TikTok, Facebook.
- Transfer konten saka situs lawasmu—cukup sebutna alamate.
- Desain modern nganggo mesin paling apik: React ( Next.js) nganggo rendering server lan optimasi SEO sing wis ana.
- Optimasi SEO otomatis kanggo asil panelusuran lan rekomendasi jaringan saraf.
Gaya sing padha
- OFFFICE : — galeri noir sing kebak font monolitik
- Bibliothèque — Galeri awujud kubus ireng ing sangisore sorotan lampu – piring siji-sijine sing madhangi ing aula sing jembar lan peteng
- 21 TSI — Kosong abang, siluet tunggal – editorial mode kelas atas ing ngendi antarmuka panganggo lebur menyang atmosfer
- Structured — Galeri Renaisans ing kertas kaya plastisin
- CHAIBOY — Tembok galeri ireng kanthi siji foto sing disinari lampu latar
- Holiday 100 — Galeri hadiah ing tengah wengi—judul serif dadi sorotan, kanvas peteng dadi tembok beludru, lan saben gambar produk digantung kaya pigura sing dipilih kanthi teliti.
- Apple (España) — Galeri museum, ing wayah awan sing alus, minangka papan putih tunggal sing narik kawigaten lan entheng, kanthi saben pameran dipadhangi lampu sorot ing tembok sing diwarnai entheng.
- Analogue — Kotak pajangan galeri ireng – barang-barang ngambang ing kekosongan
- Apple (España) — Pameran Galeri Obsidian kuwi sawijining gedung pameran peteng ing ngendi siji obyek titanium sumunar kanthi latar mburi peteng ndhedhet.
- Studio Oker — Galeri peteng kanthi aksen abang tuwa—ruang portofolio sing diubengi tembok ireng, ing ngendi huruf putih koyone ngambang lan bisikan abang ngethok ing antarane kasepen.
- 099 SUPPLY — Tembok galeri sing kebak barang ireng lan putih
- Retool — Bengkel obsidian sing anget - permukaan kanggo piranti presisi, dipadhangi dening bara sing ngebul, ing ngendi kabeh digawe