Apple
Bitta ko'k tugmachali oq xona
Apple dizayni o'zini tuta bilish modelidir: deyarli oq rangli kanvas, keng oq bo'shliq va har bir harakatni ataylab qilingandek his qilishiga imkon beradigan bitta yorqin ko'k aksent. Asosiy e'tibor tipografiyaga qaratilgan - SF Pro, o'lchami kattalashgan sari kamayib boradigan salbiy harflar oralig'i bilan, sarlavhalarga haddan tashqari og'ir bo'lmasdan me'moriy ravshanlik bag'ishlaydi. Mahsulot dizayndir: katta mahsulot fotosuratlari va turmush tarzi tasvirlari ustunlik qiladi, xrom elementlari esa yupqa ramkalarga, shaffof navigatsiyaga va nozik chiziqlarga aylanadi. Bo'limlar och kulrang fonda almashinib turadi va reklama materiallari uchun to'liq rangli bloklar bilan bezatilgan elementlar o'rniga masshtab o'zgarishi orqali ritm yaratadi.
Sahifa joylashuvi to'liq kenglikdagi sahifa bo'lib, maksimal konteyner kengligi qat'iy belgilanmagan — bo'limlar chekkadan chekkaga cho'zilgan, matn bloklari taxminan 980 piksel ichida markazlashtirilgan. Navigatsiya — bu har bir mahsulot uchun qo'shimcha pastki papkaga ega bo'lgan bitta, qat'iy global satr bo'lib, u aylantirishda ko'rsatiladi. Asosiy joylashuv har doim markazlashtirilgan: katta mahsulot nomi, bitta qatorli shior, ikkita tugmacha, keyin qolgan ko'rish maydonini to'ldiradigan mahsulot tasviri. Bo'limlar vertikal ravishda keng vertikal ritm (bo'limlar orasida 64 piksel+) bilan, #f5f5f7 va rangli fonlarni almashtirib, ustma-ust qo'yilgan. Pastki sahifada to'liq kenglikdagi xizmat kartalarining (Apple TV+, Fitness+, Music, Arcade) bitta gorizontal qatori joylashgan bo'lib, ularning har biri ustiga matn va tugmachali foto blokdan iborat. Yon panellar yo'q, ko'p ustunli kontent joylashuvi yo'q, assimetrik kompozitsiyalar yo'q — hamma narsa markazlashtirilgan, ustma-ust qo'yilgan va simmetrik.
Fotografiya dominant vizual tildir. Mahsulot fotosuratlari sof oq yoki yumshoq kulrang fonda, hech qanday kontekstsiz olinadi — qurilma yulduzdir, izolyatsiya qilingan va yoritilgan. Turmush tarzi fotosuratlari to'liq kenglikdagi bannerlarda, ko'pincha mahkam kesilgan obyektlar bilan namoyish etiladi. Rang gradientlari (pastel ko'k, pushti, yashil) mahsulot bo'limlari uchun bezak sifatida emas, balki fon sifatida xizmat qiladi. Ikonografiya minimalist va chiziqli, 1-2 piksel qalinlikda, matn bilan bir xil kulrang shkalada. Mahsulot fotosuratlarining o'zidan tashqari, hech qanday illyustratsiyalar, mavhum grafikalar, 3D tasvirlar yo'q.
Palitra
Brend
- Apple Blue
#0071e3— To'ldirilgan harakat tugmalari, tanlangan holatlar - har bir ko'rinishni mazmunli qilish uchun kamdan-kam ishlatiladigan yagona interaktiv xromatik rang. - Link Blue
#0066cc— Belgilangan harakat chegaralari, o'rnatilgan havolalar - to'ldirilgan planshet juda yorqin ko'rinadigan joyda Apple Blue rangidan ko'ra to'yinganroq rang. - Signal Blue
#2997ff— Dekorativ ramkalar, tasvir konturlari, belgi chegaralari - tizimdagi eng och ko'k rang, foydalanuvchi bilan o'zaro aloqa uchun emas, balki atmosfera uchun ishlatiladi.
Neytral
- Carbon
#1d1d1f— Asosiy matn, sarlavha chegaralari, navigatsiya chiziqlari, karta chegaralari - asosiy siyoh rangi deyarli qora bo'lib, ozgina iliqlik hissi bilan ajralib turadi. - Frost
#f5f5f7— Sahifa kanvasi, asosiy matn foni va pastki qism Apple’ning o‘ziga xos och kulrang rangida bo‘lib, sof oq rangdan biroz sovuqroq. - Ice
#f4f8fb— Ifodali sirt to'ldiruvchilari, nozik ranglar, qorong'i fonda tugmachali matn — qismni ajratib turmasdan, uni jonlantiradigan nozik ko'k rang. - Smoke
#333333— Ikkilamchi matn, navigatsiya to'ldirish, tugma chegaralari - O'rtacha kulrangdan ko'ra ko'proq aniqlikni talab qiladigan chegaralar va piktogrammalar uchun ko'p qirrali neytral rang. - Graphite
#474747— Navigatsiya matni, navigatsiya chegaralari, havola chegaralari - elementlar ierarxiyasida uglerod va tutun o'rtasida oraliq pozitsiyani egallaydi. - Ash
#707070— Pastki matn, ro'yxat chegaralari, navigatsiya chegaralari, ovozsiz asosiy matn - Mavjud bo'lishi kerak bo'lgan, ammo ko'zga tashlanmaydigan kontent uchun o'rtacha kulrang.
Tipografiya
12 dan 56 pikselgacha · 8 qadam
- SF Pro Display — almashtirish: Inter · konturlar 400, 600, 700 · Sarlavhalar va katta matn — 40 pikseldan ortiq oʻlchamlar torroq diafragma va kuchliroq salbiy kuzatuv uchun displey formatidan foydalanadi; 700 reklama maketlari uchun va 400 tahririyat tarkibidagi mahsulot nomlari uchun ajratilgan.
- SF Pro Text — almashtirish: Inter · konturlar 300, 400, 600 · Asosiy matn, navigatsiya, tugmalar, kichik sarlavhalar — ishlaydigan shrift; Asosiy matn uchun 400, kichik sarlavhalar va malakali yorliqlar uchun 300, navigatsiya elementlari va tugma matni uchun 600; salbiy harflar oralig'i o'lchamga mutanosib ravishda kamayadi (-0.022em dan 12px gacha, -0.01em dan 44px gacha).
Intervallar va shakl
| Maqsad | Ma'nosi |
|---|---|
| Zichlik | o'rtacha |
| Asosiy qadam | 12px |
| Tugma radiusi | 980px |
| Karta radiusi | 8px |
| Soyalar | soyalar o'rniga chegaralar yo'q |
| Bo'limlar orasida | 64px |
| Sahifa kengligi | 1440px |
Sun'iy intellekt veb-saytingizni Apple 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
- Ui — mat qog'ozdagi klinik reja
- ElevenLabs — Iliq krem tusli, nozik sarlavhali fotoinsho. Bauhaus uslubidagi daftar — tuxum qobig'i rangli qog'oz, qora siyoh va mahsulotni namoyish qilish uchun bitta binafsha va to'q sariq rangli aksent.
- monopo saigon — Tahririyat sukunati ortidagi suyuq, kamalaksimon nur — erigan yorug'likda suzib yuruvchi monoxrom tahririyat galereyasi
- Awesomic — Konfetini eslatuvchi to'q sariq tinish belgilari bilan bezatilgan rux to'ri
- Monad — Issiq pergamentdagi tahririyat texnik jurnali
- Dub — Linkning mat guruch qog'ozi boshqaruv paneli
- Seline Analytics — Issiq qog'ozda jimgina analitik stol
- Ventriloc — Issiq qog'ozdagi ma'lumotlarning tahririyat rasadxonasi - monoxrom aniqlikni ta'kidlaydigan bitta to'q sariq rangli cho'g'
- Duolingo — Oq qog'ozda o'ynoqi sinf maskoti
- Stripe — Muzlatilgan oynaga indigo siyohida yozilgan hisob kitobi
- Notion — Peshin quyoshida iliq qog'oz daftar
- Hyer Aviation — Pergament ustida kabinada shom qorong'i. Och rangli tong osmoni fyuzelyaj o'lchamidagi serif logotipi bilan uchrashadi va bitta iliq loy aksenti monoxrom chegarani buzadi.