Airbnb
Bitta marjon qizil xatcho'pli sokin oq galereya devori
Airbnb "oq kanvas" uslubida ishlaydi, bu yerda fotografiya ustunlik qiladi: deyarli har bir ekran tinch monoxrom ramka bo'lib, xususiyatlarning to'liq ekranli tasvirlariga umumiy taassurotni yetkazish imkonini beradi, harakatni bildiruvchi yagona rang belgisi sifatida bitta, boy marjon-qizil aksent (Rausch) mavjud. Shrift geometrik sans-serif (Airbnb Cereal VF) bo'lib, asosan kichik, ishonchli o'lchamlarda - asosiy matn, interfeys va bo'lim sarlavhalari (22-22) uchun - tor salbiy qator oralig'i va keng qator oralig'i bilan, zich matnli kartalarni o'qish mumkin qiladi. Interfeys tekis, ramkasiz va yumaloq: kartalar va boshqaruv elementlari ustida 12-3 radius, yumaloq tabletka shaklidagi tugmalar va faqat qidiruv paneli kabi ko'zga ko'ringan elementlar uchun yumshoq, qatlamli soyalar. Qolgan hamma narsa - kartalar, ro'yxat elementlari, havolalar - xrom aksentlariga emas, balki oq bo'shliq va mayda chiziqlarga tayanadi.
Maksimal kenglik chegarasi belgilanmagan to'liq kenglikdagi maket — kontent ko'rinadigan maydon ichida chekkadan chekkaga cho'ziladi, ish stolida har ikki tomonda taxminan 40 piksel gorizontal to'ldirish mavjud. Qahramon — bu neytral oq kanvasning markazida joylashgan, rasm yoki sarlavhasiz suzuvchi qidiruv kapsulasi — qidiruv satri — qahramon. Qidiruv ostida sahifa vertikal ravishda joylashtirilgan, gorizontal ravishda aylantiriladigan bo'limlarga o'tadi (to'rtta qator ko'rinadi: Tanlangan uylar, Ajoyib mehmonxonalar, Boshqa shahar, Keyingi oyda mavjud), har biri taxminan 320 piksel balandlikda, 48 piksel vertikal novlar bilan ajratilgan. Har bir bo'lim gorizontal toshib ketish va strelka navigatsiyasiga ega 7 kartali panjaradan foydalanadi. Pastki qism #f7f7f7 fonida havolalarning 3 ustunli panjarasi bo'lib, undan keyin mualliflik huquqi ma'lumotlari, til/valyuta parametrlari va ijtimoiy media piktogrammalari joylashgan pastki panel mavjud. Navigatsiya — bu markazlashtirilgan yorliq navigatsiyasi va o'ngga tekislangan boshqaruv elementlari bo'lgan qat'iy yuqori panel.
Fotografiya vizual tizimda ustunlik qiladi, ko'chmas mulk ro'yxatlarining to'liq ekranli tasvirlari asosiy kontent turi bo'lib xizmat qiladi. Barcha fotosuratlar haqiqiy uylar va mehmonxonalarning iliq, yaxshi yoritilgan ichki va tashqi suratlari bo'lib, tabiiy ranglarni to'g'rilash bilan ishlov beriladi (og'ir filtrlar yoki duotonlarsiz). Rasmlar ro'yxat kartalari uchun 1:1 tomonlar nisbati bilan mahkam kesilgan, kartaning chetini qon ketishlarsiz to'ldiradi. Interfeys bo'ylab piktogrammalar monoxrom konturga ega (chiziq qalinligi ~16–16), navigatsiya toifalari va UI boshqaruv elementlari uchun kamdan-kam ishlatiladi. Logotip yagona ko'p rangli grafik elementdir (Rausch). Hech qanday illyustratsiyalar, 3D renderlar, mavhum grafikalar yo'q - vizual til sof fotografiya va yumshoq oq kanvasdagi minimalist monoxrom ikonografiyadir.
Palitra
Brend
- Rausch
#ff385c— Qizil rang piktogrammalar, belgilar va kichik grafik detallar uchun dekorativ aksent sifatida ishlatiladi. U harakatga chaqiruvlar uchun asosiy rang sifatida ishlatilmasligi kerak. - Rausch 600
#e00b41— Hover/faol sirtlarda brend aksenti sifatida ishlatiladigan sirtlar uchun Rausch bo'yog'ining bosilgan va to'q rangli versiyasi.
Neytral
- Hof
#222222— Asosiy matn, asosiy matn, sarlavhalar, belgi konturlari va teskari fon qora rangga yaqin neytral rang bo'lib, butun axromatik tizim uchun asos bo'lib xizmat qiladi. - Foggy
#6a6a6a— Ikkilamchi matn, ovozsiz taglavhalar, yordamchi matn, o'chirilgan ikonka to'ldirish va karta sarlavhalari ostidagi maxfiy metama'lumotlar. - Grey 500
#c1c1c1— Matn oʻchirilgan, kiritish maydonlaridagi matn toʻldiruvchisi va holatga urgʻu berishni kamaytirish kerak boʻlgan joylarda ovozsiz belgi. - Bebe
#ebebeb— Yupqa chegaralar, tagiga chizilgan kiritish maydonlari, ro'yxat satrlari orasidagi ajratgichlar va nozik ajratuvchi chiziqlar. - Deco
#dddddd— Nofaol konteynerlar, joy egalari va o'chirilgan karta holatlari uchun karta fon rasmlari. - Faint
#f7f7f7— Sahifa kanvasining fon tasviri, pastki qismi va interaktiv elementlar uchun sichqonchani havoda ushlab turish holati yumshoq, kremsi rang bo'lib, bu sahifani sof oq kartalardan ajratib turadi.
Tipografiya
11 dan 28 pikselgacha · 5 qadam
- Airbnb Cereal VF — almashtirish: Circular · konturlar 400, 500, 600, 700 · Airbnb uchun mo'ljallangan maxsus geometrik sans-serif shrifti. Asosiy matn 14px/400, foydalanuvchi interfeysi yorliqlari 16px/500, bo'lim sarlavhalari 20px/600, 22px/500, harflar orasidagi masofa -0.02em va sahifa sarlavhalari 28px/700 o'lchamda joylashtirilgan. Manfiy harflar oralig'i kattalashgan sari kamayadi, bu katta ekran o'lchamlarida geometrik sans-serif shriftlariga xos xususiyatdir. "Tuz" alternativ glif xususiyatini yoqadi.
Intervallar va shakl
| Maqsad | Ma'nosi |
|---|---|
| Zichlik | zich |
| Asosiy qadam | 12px |
| Tugma radiusi | 9999px |
| Karta radiusi | 12px |
| Soyalar | yumshoq soyalar |
| Bo'limlar orasida | 48px |
| Sahifa kengligi | 1440px |
Sun'iy intellekt veb-saytingizni Airbnb uslubida yaratadi va uni to'ldiradi
- Mahsulotlar va postlarni Instagram, TikTok, Facebook havolalari orqali to'ldiring.
- Eski saytingizdan kontentni o'tkazing — shunchaki manzilni ko'rsating.
- Eng yaxshi dvigatelda zamonaviy dizayn: React ( Next.js) server renderlash va SEO optimallashtirish bilan darhol.
- Qidiruv natijalari va neyron tarmoq tavsiyalari uchun to'liq avtomatlashtirilgan SEO optimallashtirish.
O'xshash uslublar
- Apple (España) — oq galereya vitrinasi
- Silencio — Suzib yuruvchi artefaktlar bilan bezatilgan oq xona. Har bir element salbiy hajm fonida o'z o'rnini egallagan issiq qog'ozdan yasalgan galereya displeyi va sukunat ataylab qilingan dizayn qaroridir.
- Oakâme — Issiq toshdan o'yilgan quyosh nurlari ostidagi Provans ustaxonasi
- Nike — Sport yutuqlarining monoxrom galereyasi – oq devorlar, san'at asari sifatidagi mahsulot, fonda erigan xrom
- Arc — Yarim tunda suv ustidagi sanoat oq galereyasi
- Rivian — Galereyaning beton devoridagi elektr monolit. Rivian har bir transport vositasini ulkan oq makon fonida haykal sifatida taqdim etadi, tipografiya shunchalik kattaki, u me'moriy elementga aylanadi va monoxromatik atmosferani buzadigan bitta iliq sariq rang, xuddi mot yuzadagi quyosh nuri kabi.
- Analogue — Qora galereya vitrinasi – tovarlar bo'shliqda suzib yuradi
- ddna — ishlov berilmagan choyshab ustiga iliq muzey vitrinasi
- Zellerfeld — Oq marmar ustida haykaltaroshlik ustaxonasi — poydevorning monolit yuzalari, kobaltning bitta uchquni, poldan shiftgacha kichik harflarning pichirlashi
- UY Studio — Monastirning tosh galereyasi beton devorlari bo'lgan sokin makon bo'lib, u yerda atir idishlari oq plintlarda turibdi va bitta 400 vattli chiroq va to'rtta issiq kulrang lampochka bilan yoritilgan.
- Basic.Space — oq marmar ustidagi kuratorlik galereyasi
- COS — oq devorlarga ega zamonaviy galereya