Dub
Panel kontrol kertas béas matte Link
Sistem visual Dub ngagaduhan estetika SaaS anu kaampeuh, ampir sapertos éditorial: kanvas anu ampir bodas anu dihijikeun ku wates ipis tinimbang unsur anu nonjol, kalayan tipografi monokrom anu padet anu nyayogikeun dukungan struktural sareng hiji warna biru caang (#2563eb) anu ngajantenkeun pernyataan. Permukaan tetep datar sareng tanpa pigura dina pandangan munggaran, tapi unggal wadah ngagaduhan margin 1px #e5e5e5, anu ngahudangkeun rasa dokumén anu dicitak. Kapribadian kahontal ngalangkungan sakumpulan aksen "pil" warna-warni (oranyeu, héjo, wungu) anu ngambang di luhur palet nétral, sareng header anu karasa percaya diri sareng modéren tanpa mencolok. Komponenna kompak sareng padet: talang 8px, radius kartu 12px, labél bentuk pil dina 9999px, sareng kontrol anu teu katingali tinimbang tombol anu beurat sareng dieusi.
Kaca ieu diwangun dina tata letak anu di tengah kalayan lébar maksimum sakitar 1200px. Unsur utama nyaéta blok téks anu di tengah kalayan tilu unsur ngambang (Program Afiliasi, Analitik Konversi, Tautan Pendek) anu diposisikan sacara horizontal di luhur tata letak produk anu ageung. Bagian-bagian disusun sacara vertikal kalayan talang 64px anu konsisten, silih genti antara kanvas bodas sareng kabut kertas #f5f5f5 pikeun pamisahan tonal. Bagian handap nganggo tata letak bentuk Z: téks éditorial di tengah dina sapertiluna tengah, sareng kartu UI anu ngambang di jangkar kana margin kénca sareng katuhu, nyiptakeun wirahma anu asimetris sapertos majalah. Awan logo mangrupikeun grid 5x2 anu saderhana, di tengah dina kaca. Navigasi mangrupikeun bilah luhur minimalis — logo di kénca, navigasi di tengah, sakelompok dua tombol (tombol "Login" hantu + tombol "Daftar" anu dieusi) di katuhu — tanpa ménu anu tetep atanapi mega-menu. Tata letak dasbor jandela utama nampilkeun tata letak aplikasi dua kolom klasik: bilah sisi anu tetep (sarupa sareng 240px) + area eusi anu nangtukeun kapadetan inpormasi produk pikeun pangunjung sateuacan aranjeunna mimiti ngagulung.
Visualna museur kana produk, sanés museur kana gaya hirup. Layar utama dipusatkeun dina cuplikan layar dasbor anu ageung, anu ngagambarkeun mockup produk dunya nyata kalayan navigasi sidebar, tabel data, sareng unsur UI anu ngambang, disusun salaku panel datar dina kanvas bodas. Logo klien ditampilkeun dina grid grayscale desaturated (beehiv, superpower, Chatbase, jsb.) pikeun ngaku kinerja média sosialna, dicabut warnana pikeun ngamungkinkeun aksen biru tunggal dina halaman tetep dominan. Kartu mitra anu ngambang (profil alit sareng ubin kalayan data pendapatan/pamayaran) ngalih di sakitar blok téks éditorial di handap, nyiptakeun rasa jero tanpa nganggo kalangkang dina téks éta sorangan. Pola latar grid titik-titik mangrupikeun fitur khas: deretan titik-titik alit ipis kalayan opacity anu handap pisan nyiptakeun tékstur sareng rasa sistem desain/permukaan gambar, nekenkeun posisi situs salaku "platform atribusi tautan modéren." Ikonografi minimal, kalayan garis luar sareng eusian, sareng nganggo palet aksen (jeruk jeruk keprok, wungu lavender, héjo mint) pikeun tag fitur. Teu aya poto, ilustrasi, atanapi modél 3D anu dianggo—antarmuka pangguna produk éta sorangan mangrupikeun basa visual.
Palet
Merek
- Electric Blue
#2563eb— Warna mérek utama—logo, tautan, indikator kinerja konci, kaayaan aktif, sareng aksen ikon—anu dianggo. Warna biru anu beunghar dina latar bodas nyiptakeun hiji-hijina daya tarik visual sistem. - Deep Sapphire
#1e40af— Latar tukang utama tombol aksi, eusian kandel tina ajakan pikeun aksi—hiji-hijina warna anu nunjukkeun tindakan—dianggo sacara hemat pikeun narik perhatian.
Nétral
- Canvas White
#ffffff— Latar tukang halaman, permukaan kartu, panel pop-up mangrupikeun pondasi mutlak unggal layar. - Paper Mist
#f5f5f5— Parobahan warna anu ngalayang sacara halus pikeun kartu anu disusun, panel tambahan, sareng eusian. - Ash
#e5e5e5— Wates ipis dina kartu, konektor input, sareng pembagi mangrupikeun garis struktural anu ngahijikeun sistem. - Smoke
#d4d4d4— Wates anu langkung seukeut pikeun wadah anu dipilih sareng garis luar tombol tambahan. - Pebble
#c8c8c8— Wates, garis kontrol, sareng pambagi struktural kalayan kontras sedeng. Warna ieu teu kedah dianggo salaku warna utama pikeun ajakan bertindak. - Midnight Ink
#0a0a0a— Téks utama tombol, tombol anu disorot, sareng téks navigasi ampir hideung pikeun kontras anu maksimal.
Tipografi
ti 11 dugi ka 48px · 9 léngkah
- Satoshi — panggantian: Inter (weight 500 · garis besar 500 · Judul Tampilan – ngan dianggo dina baris 36–48px pikeun judul sareng judul bagian. Beurat font – 500 (sedeng, henteu kandel): Judul katingalina percaya diri sareng modéren, tapi henteu pernah kaleuleuwihi. Proporsi géométri Satoshi masihan jinis huruf anu rada éditorial sareng modéren anu teu tiasa ditiru ku salinan awak Inter.
- Inter — panggantian: Inter (native) · garis besar 400, 500, 600 · Salinan awak, labél UI, navigasi, subjudul, sareng judul minor. Inter nyaéta kuda kerja utama, ngurus sagalana ti mikro-labél 11px dugi ka judul sekundér 30px. Beurat 400 nyaéta standar pikeun salinan awak, 500 pikeun unsur anu disorot sareng labél tombol, sareng 600 disimpen pikeun labél UI anu penting. 16px kalayan jangkungna garis 1,5 nyaéta ukuran léngkah tunggal anu paling sering kapanggih (1220 kajadian), mastikeun yén 16px nyaéta ukuran salinan awak kanonik.
- Geist Mono — panggantian: JetBrains Mono or IBM Plex Mono · garis besar 400, 500 · Cuplikan kode, metadata téknis, sareng token monospace anu dipasang dianggo dina blok kode dina ukuran 12–14px sareng dina unsur tampilan kode ageung dina ukuran 24px. Ieu mastikeun kredibilitas alat pamekar, saluyu sareng posisi produk Dub.
Interval sareng bentuk
| Tujuan | Hartina |
|---|---|
| Kapadetan | rata-rata |
| Léngkah dasar | 8px |
| Radius tombol | 8px |
| Radius kartu | 12px |
| Kalangkang | euweuh - wates tinimbang kalangkang |
| Antara bagian | 64px |
| Lebar kaca | 1200px |
AI bakal ngawangun situs wéb anjeun dina gaya Dub sareng ngeusianana
- Eusian ku produk sareng postingan ngalangkungan tautan - Instagram, TikTok, Facebook.
- Mindahkeun eusi tina situs lami anjeun—cukup sebutkeun alamatna.
- Desain modéren dina mesin pangsaéna: React ( Next.js) kalayan rendering server sareng optimasi SEO anu tos siap dianggo.
- Optimasi SEO otomatis pinuh pikeun hasil pamilarian sareng rekomendasi jaringan saraf.
Gaya anu sami
- ElevenLabs — Esai poto dina warna krim haneut kalayan judul anu lemes. Buku catetan gaya Bauhaus—kertas warna cangkang endog, tinta hideung, sareng hiji aksen wungu sareng oranyeu pikeun tampilan produk.
- Awesomic — Jaring séng éditorial kalayan tanda baca oranyeu anu ngingetkeun kana konféti
- Monad — jurnal téknis éditorial ngeunaan perkamen haneut
- Seline Analytics — Méja analitik anu sepi dina kertas haneut
- Notion — Buku catetan kertas anu haneut dina panonpoé tengah poé
- Anthropic — Jurnal lapangan ilmiah ngeunaan vellum haneut—permukaan gading anu tenang, judul éditorial serif, sareng aksen liat tunggal anu ngan ukur muncul nalika aya tindakan anu diperyogikeun.
- Calendly — Tinta biru poék dina marmer tiis
- Augen Pro — Presentasi bodas Apple nampilkeun warna biru listrik anu klinis, hampang, salaku hiji-hijina aksen dina rohangan monokrom.
- Antimetal — Kronik éditorial dina kertas krem—isuk anu sepi di jurnal ilmiah, dimana kateguhan nunjukkeun kapercayaan diri sareng serif ngalakukeun padamelan anu beurat
- Perk — Jeruk nipis dina kertas roti haneut
- Ditto — Bengkel anu disinari ku panonpoé pikeun nyieun conto kembang liar. Beungeut krim anu haneut, warna dasar konéng anu cerah, tinta biru laut anu jero, warna organik anu mekar di tukangeun karya seni.
- Officevibe — Majalah éditorial dina kertas warna krem haneut. Bayangkeun hiji éséy anu dipikirkeun kalawan saksama ngeunaan manajemen SDM, anu dipidangkeun salaku produk—huruf serif kursif anu ngaharéwos ngaliwatan antarmuka biru modéren.