Peak Design
Qismən işıqlandırılmış qalereya divarı
Peak Design qalereya keyfiyyətli kommersiya təcrübəsidir: redaksiya tipoqrafiyasının və məhsul fotoqrafiyasının bütün işləri gördüyü demək olar ki, monoxrom kətan. Sistem aydın ağ səthləri dərin, demək olar ki, qara panellərlə əvəz edir və bir tərəfdə kursiv şriftdə serif başlıq, digər tərəfdə isə tam ekran məhsulu və ya həyat tərzi şəklinin yerləşdirildiyi təəccüblü bölünmüş düzülüşlər yaradır. Tipoqrafiya brendin əsas səsidir: başlıqlar üçün hündür, sıxılmış, dekorativ serif şrift (Exposure üslubunda), istifadəçi interfeysi üçün neytral qrotesk şrift (Geist) və hərflər, qaşlar və düymələr üçün sıxılmış sans-serif şrift (bryant). İnterfeys təmiz qalır: xromatik UI elementləri, dekorativ qradiyentlər, kölgələr yoxdur - yalnız incə haşiyələr, iki künc radiusu (4 və 8) və vurğu üçün yalnız bəzən istifadə olunan tək qırmızı vurğu. Komponentlər dekorativdən daha düşüncəli görünür: nazik bölücülər, düz məhsul kartları, həb formalı filtrlər və memarlıq annotasiyaları kimi hiss olunan görünməz düymələr.
Tam enli səhifə bölmələri ağ və demək olar ki, qara arasında növbələşir; hər bölmə bütün baxış sahəsinin enini tutur və bölmə səviyyəsində maksimum en limiti yoxdur. Bölmələr daxilindəki məzmunun maksimum eni ~1440 pikseldir və mərkəzləşdirilib. Dominant başlıq naxışı 50/50 bölünmədir: bir tərəfdə mətn bloku (baxış + başlıq + alt mətn + düymələr), digər tərəfdə isə tam enli məhsul və ya həyat tərzi şəkli. Qatlanmanın altında, məhsul şəbəkəsi 24-32 piksellik geniş novları olan bərabər enli məhsul kartlarının dörd sütunundan istifadə edir. Kateqoriya filtri panelləri əsas naviqasiyanın birbaşa altında üfüqi "həblər" sırasında yerləşdirilir. Bölmələrin ritmi, bölmələr arasında 80 piksel şaquli girinti ilə növbələşən açıq/tünd zolaqlar ilə müəyyən edilir və redaksiya-jurnal ritmi yaradır. Naviqasiya, üstündə nazik reklam zolağı olan sabit üst zolaqdır.
Vizual dildə məhsul fotoqrafiyası üstünlük təşkil edir: çantalar, kəmərlər və kamera avadanlıqları gündəlik həyatın konteksti olmadan, təmiz ağ fonda, materialın teksturasını və aparat detallarını işıqlandırma ilə çəkilir. Gündəlik şəkillər yalnız tam ekranlı redaksiya bölmələrində görünür (məsələn, əllər kameraları dairə şəklində tutur) və bölünmüş panelin bir tərəfindəki baxış sahəsinin bütün enini tutur. Şəkillərin əsas şəkildə künc radiusu yoxdur (kənarları ilə eynidir) və kart şəklində künc radiusu yoxdur. Funksional UI nişanlarından başqa illüstrasiyalar, mücərrəd qrafika, ikon illüstrasiyaları yoxdur. Məhsul diqqət mərkəzindədir - studiya keyfiyyətli fotoşəkillər, ardıcıl bucaqlar, ardıcıl işıqlandırma və ardıcıl ağ fon - UI arxa plana keçir və obyektlərin özləri üçün danışmasına imkan verir.
Palitra
Neytral
- Carbon Ink
#1a211e— Əsas mətn, tünd yan panellər, əsas mətn, nişanlar, açıq səthlərdə çərçivələr - hər başlıq üçün əsas rolunu oynayan və bölünmüş hissələrin tünd fon panellərini təşkil edən demək olar ki, qara rəng. - Paper White
#ffffff— Gözə çarpmayan bir fon yaratmaq və hissələri ayırmaq üçün yüngül dəstəkləyici səth. Hərəkətə çağırış üçün əsas rəng kimi istifadə edilməməlidir. - True Black
#000000— Maksimum kontrastlı elementlər — ağ fonda başlıq doldurma, elan paneli, altbilgi dizaynı, bütöv işarə konturları — dizaynın ən aydın xətləri tələb etdiyi yerlərdə yerləşdirilir. - Obsidian
#0c0c0c— Dərin panel səthləri və şəkil örtükləri - əsl qara rəngdən bir qədər yumşaqdır, bütün ekran səthini tutan və bərk, lakin düz qara kimi sərt olmayan qaranlıq sahələr üçün istifadə olunur. - Fog
#eef1f0— Gözə çarpmayan bir fon yaratmaq və hissələri ayırmaq üçün yüngül dəstəkləyici səth. Hərəkətə çağırış üçün əsas rəng kimi istifadə edilməməlidir. - Mist
#e0e0e0— Bölgəçi xətlər, qeyri-aktiv vəziyyətlər, incə struktur bölücülər - ağ kətan üzərində hissələr arasındakı sərhədləri müəyyən edən orta-açıq boz rəng.
Tipoqrafiya
14-dən 80 pikselə qədər · 6 addım
- Geist — əvəzetmə: Inter · konturlar 400, 600, 700 · Əsas mətn, məhsul başlıqları, təsvirlər, forma sahələri, keçid mətni və altbilgi məzmunu. Şrift qalınlığı: Əsas mətn üçün 400, vurğulamalar üçün 600 və məhsul başlıqları və vacib sətirdaxili qeydlər üçün 700. Neytral Qrotesk şrifti Display Serif və Condensed Sans şriftlərinə brend stilini əks etdirməyə imkan verir, Geist isə funksionallıq və oxunaqlılıq təmin edir.
- Exposure-style serif (Exposure-10) — əvəzetmə: Playfair Display · konturlar 400 · Başlıqlar və əsas başlıqlar. Kursiv serif şriftində tək bir qalınlıq (400) redaksiya nüfuzu yaradır — bu sözlər brend tonunu müəyyən edir və səhifənin bütün enini əhatə edən tünd panellərdə və əsas hissələrin əvvəlində az istifadə olunur. Sıx hərf aralığı (-0.025 em) böyük hərflərin yüngül deyil, təmkinli görünməsinə imkan verir.
- Bryant-style condensed sans (bryant) — əvəzetmə: Druk Wide · konturlar 700 · Naviqasiya etiketləri, kateqoriya filtr düymələri, düymə mətni, "qaşlar", bölmə etiketləri və əlavə başlıqlar. Müsbət hərf aralığı ilə sıxılmış böyük hərflər sənaye, etiketə bənzər bir üslub yaradır - bu sözlər müəyyən edir və təlimat verir, lakin heç vaxt təsvir etmir.
İntervallar və forma
| Məqsəd | Mənası |
|---|---|
| Sıxlıq | orta |
| Əsas addım | 24px |
| Düymə radiusu | 4px |
| Kart radiusu | 8px |
| Kölgələr | kölgələr əvəzinə sərhədlər yoxdur |
| Bölmələr arasında | 80px |
| Səhifə eni | 1440px |
Süni intellekt veb saytınızı Peak Design üslubunda quracaq və onu dolduracaq
- Məhsullar və paylaşımlar ilə Instagram, TikTok, Facebook linkləri vasitəsilə tanış olun.
- Köhnə saytınızdan məzmunu köçürün — sadəcə ünvanı göstərin.
- Ən yaxşı mühərrikdə müasir dizayn: Server render və SEO optimallaşdırması ilə React ( Next.js).
- Axtarış nəticələri və neyron şəbəkə tövsiyələri üçün tam avtomatlaşdırılmış SEO optimallaşdırması.
Oxşar üslublar
- Arsenijs Fabrica — Redaksiya məzmununun daxili gözəlliyi qalereya işıqları altında ortaya çıxır. Qalereyanın aydın ağ divarları, monoxrom fonda narıncı rəngdə titrəyən tək isti stroboskop işığı, şüşə kimi nazik şrift və bol ağ məkan.
- 21 TSI — Qırmızımtıl boşluq, tək bir siluet – istifadəçi interfeysinin atmosferə hopduğu yüksək moda redaksiyası
- Aevi Wellness — Skandinaviya əczaçılıq üslubunda, çəkisiz şrift. Boz-mavi rəngli solğun vurğu, məhsul fotoşəkillərinin isti ağ fonda nazik haşiyəli kartların üzərinə qoyulduğu redaksiya materialının ümumi axromatik, havadar düzülüşünü pozur.
- Palmer — Yumşaq gün işığında keramika qalereyası – qarşılıqlı təsir divarla baş verir və əşyalar incəsənət əsəridir.
- PLATFORM — Ağ Kub Qalereyası diqqət mərkəzində
- Assembly Coffee London — Qaranlıq qovurma sexində kömürlər. İsti, zəif işıqlandırılmış məhsul fotoşəkilləri və kursiv serif yazıları olan demək olar ki, qara kətan — gecə yarısı samizdatda çap olunmuş xüsusi qəhvə menyusunun hissi.
- ARTWORLD — Moda jurnalının ağ kətan başlığı
- Structured — Plastilin kimi kağız üzərində İntibah dövrü qalereyası
- Airbnb — Tək mərcan qırmızı əlfəcinli sakit ağ qalereya divarı
- VISIONNAIRE — Ağ fonda küçə geyimləri redaksiya qalereyası. Brend çap olunmuş loqotip kitabı kimi davranır: düz ağ kətan, qara mürəkkəb və məhsulu və ya loqotipi nümayiş etdirmək üçün rəng bloku kimi istifadə edilən tək isti krem panel.
- Letter — Anbardan parıldayan artefaktları nümayiş etdirən özəl qalereya. Qalereyanın rəngli divarlarında xrom heykəllərin üzərində serif başlıqlarının üzdüyü qara divarlı sərgi sahəsi.
- Ramp — Redaksiya maliyyə şöbəsi, tək neon markerli ağ-qara səhifələr. Nəşrin demək olar ki, monoxrom səthi, burada tək bir parlaq yaşılımtıl xətt hər bir qarşılıqlı təsiri pul siqnalına çevirir.