Apple
Balta istaba ar vienu zilu slēdzi
Apple dizains ir atturības paraugs: gandrīz balts audekls, plaša balta telpa un viens, spilgti zils akcents, kas liek katrai darbībai justies apzinātai. Galvenā uzmanība ir pievērsta tipogrāfijai — SF Pro ar negatīvu burtu atstarpi, kas samazinās, palielinoties izmēram, piešķirot virsrakstiem arhitektonisku skaidrību, bet nebūdami pārāk smagnēji. Produkts IR dizains: dominē lieli produktu fotoattēli un dzīvesstila attēli, savukārt hroma elementi atgriežas plānos rāmjos, caurspīdīgā navigācijā un smalkās līnijās. Sadaļas mijas uz gaiši pelēka fona ar pilnkrāsu blokiem reklāmas materiāliem, radot ritmu, mainot mērogu, nevis dekoratīvus elementus.
Lapas izkārtojums ir pilna platuma lapa bez fiksēta maksimālā konteinera platuma — sadaļas stiepjas no malas līdz malai, un teksta bloki ir centrēti aptuveni 980 pikseļos. Navigācija ir viena, fiksēta globāla josla ar papildu apakšmapi katram produktam, kas tiek parādīts ritinot. Galvenais izkārtojums vienmēr ir centrēts: liels produkta nosaukums, vienas rindiņas sauklis, divas tabletes pogas un pēc tam produkta attēls, kas aizpilda atlikušo skata logu. Sadaļas ir vertikāli sakrautas ar dāsnu vertikālu ritmu (64 pikseļi+ starp sadaļām), pārmaiņus ar #f5f5f7 un krāsainiem foniem. Apakšējā lapa ir viena horizontāla pilna platuma pakalpojumu karšu rinda (Apple TV+, Fitness+, Mūzika, Arkāde), katra no tām ir fotoattēlu bloks ar pārklājuma tekstu un tabletes pogu. Nav sānu joslu, nav vairāku kolonnu satura izkārtojuma, nav asimetrisku kompozīciju — viss ir centrēts, sakrauts un simetrisks.
Fotogrāfija ir dominējošā vizuālā valoda. Produktu fotoattēli tiek uzņemti uz tīri balta vai maigi pelēka fona bez jebkāda konteksta — ierīce IR zvaigzne, izolēta un izgaismota. Dzīvesstila fotoattēli tiek attēloti pilna platuma baneros, bieži vien ar cieši apgrieztiem objektiem. Krāsu gradienti (pasteļzila, rozā, zaļa) kalpo kā fons produktu sadaļām, nevis dekorācija. Ikonogrāfija ir minimālistiska un veidota uz līnijām, 1–2 pikseļu biezumā, tādā pašā pelēktoņos kā teksts. Nav ilustrāciju, nav abstraktas grafikas, nav 3D renderējumu, izņemot pašus produktu fotoattēlus.
Palete
Zīmols
- Apple Blue
#0071e3— Aizpildītas darbību pogas, atlasītie stāvokļi — vienīgā interaktīvā hromatiskā krāsa, kas tiek izmantota taupīgi, lai katram izskatam būtu jēga. - Link Blue
#0066cc— Izceltas darbību robežas, iegultās saites — piesātinātāka krāsa nekā Apple Blue tiek izmantota vietās, kur aizpildīta planšetdatora krāsa būtu pārāk uzkrītoša. - Signal Blue
#2997ff— Dekoratīvi rāmji, attēlu kontūras, ikonu apmales — gaišākā zilā krāsa sistēmā, ko izmanto atmosfēras, nevis lietotāja mijiedarbības radīšanai.
Neitrāls
- Carbon
#1d1d1f— Galvenais teksts, virsrakstu apmales, navigācijas līnijas, karšu apmales — dominējošā tintes krāsa ir gandrīz melna ar nelielu siltuma pieskaņu. - Frost
#f5f5f7— Lapas audekls, galvenā teksta fons un kājenes virsma ir Apple raksturīgajā gaiši pelēkajā krāsā, nedaudz vēsākā nekā tīri balta. - Ice
#f4f8fb— Izteiksmīgi virsmas aizpildījumi, smalki toņi, pogu teksts uz tumša fona — smalks zils tonis, kas atdzīvina sadaļu, to neizceļot. - Smoke
#333333— Sekundārais teksts, navigācijas aizpildījums, pogu apmales — daudzpusīga neitrāla krāsa apmalēm un ikonām, kurām nepieciešams lielāks akcents nekā vidēji pelēkā krāsā. - Graphite
#474747— Navigācijas teksts, navigācijas robežas, saišu robežas — elementu hierarhijā ieņem starpposmu starp oglekļa un dūmu tekstu. - Ash
#707070— Kājenes teksts, sarakstu apmales, navigācijas apmales, klusināts pamatteksts — vidēji pelēka krāsa saturam, kam jābūt redzamam, bet ne tik izteiktam.
Tipogrāfija
no 12 līdz 56 pikseļiem · 8 soļi
- SF Pro Display — nomaiņa: Inter · kontūras 400, 600, 700 · Virsraksti un liels teksts — izmēri, kuru lielums pārsniedz 40 pikseļus, izmanto attēlošanas formātu šaurākai apertūrai un spēcīgākai negatīvajai izsekošanai; 700 pikseļi ir rezervēti reklāmas izkārtojumiem, bet 400 pikseļi — produktu nosaukumiem redakcionālā saturā.
- SF Pro Text — nomaiņa: Inter · kontūras 300, 400, 600 · Pamatteksts, navigācija, pogas, apakšvirsraksti — darba fonts; 400 pamattekstam, 300 apakšvirsrakstiem un kvalificētām etiķetēm, 600 navigācijas elementiem un pogu tekstam; negatīva burtu atstarpe samazinās proporcionāli izmēram (no -0,022em līdz 12 pikseļiem līdz -0,01em līdz 44 pikseļiem).
Intervāli un forma
| Mērķis | Nozīme |
|---|---|
| Blīvums | vidēji |
| Pamata solis | 12px |
| Pogas rādiuss | 980px |
| Kartes rādiuss | 8px |
| Ēnas | nē — robežas ēnu vietā |
| Starp sekcijām | 64px |
| Lapas platums | 1440px |
Mākslīgais intelekts izveidos jūsu vietni Apple stilā un aizpildīs to
- Aizpildiet ar produktiem un ierakstiem, izmantojot saiti — Instagram, TikTok, Facebook.
- Pārsūtiet saturu no savas vecās vietnes — vienkārši norādiet adresi.
- Moderns dizains uz labākā dzinēja: React ( Next.js) ar servera renderēšanu un SEO optimizāciju uzreiz pēc instalēšanas.
- Pilnībā automatizēta SEO optimizācija meklēšanas rezultātiem un neironu tīkla ieteikumiem.
Līdzīgi stili
- Studio — Galerijas siena kustībā. Katrs ekrāns attēlo klusu, pelēku izstādes virsmu, kur par uzmanību sacenšas tipogrāfiski materiāli un pārklājošies radošie darbi.
- Mollie — Kašmira lete, tumša grāmatvedības uzskaites lapa. Ap melno tekstu atstājiet pietiekami daudz baltas vietas redakcionālajam dizainam, pēc tam pastipriniet ar produktu saistītos punktus ar siltiem krēmkrāsas toņiem, espreso brūnajiem toņiem un taustāmām fotogrāfijām ar reāliem maksājumu veidiem.
- Basis Theory — Maksājumu termināļi dizaina studijā. Balts tehniskais papīrs, pārklājoši caurspīdīgi darījumu slāņi un viens tirkīza krāsas vadības elements nosaka vizuālo virzienu.
- CleanShot X — Studija ar zili apgaismotu darbvirsmu. Izveidojiet mierīgu baltu telpu ap kompaktu melnu tekstu un pēc tam ļaujiet piesātinātajām zilajām vadības ierīcēm un slāņotajiem Mac produktu attēliem ieņemt centrālo vietu.
- Modern Treasury — Valsts kases grāmatvedības virsgrāmata uz milimetru papīra. Izveidojiet lapas, kas atgādina klusu, baltu darbības lapu, kur naudas plūsmas tiek attēlotas ar smalkām līnijām, marķētiem mezgliem un precīzām, slēptām vadīklām.
- Basha-Franklin — Galerijas režģis zem baltas pārsedzes. Izmantojiet siltu #f4ede6 nokrāsu, neuzkrītošu melnu struktūru un asimetriskas kolonnas, kuru pamatā ir fotogrāfijas, kas izskatās kā drukāts arhitektūras portfolio.
- Bajgart Office — Redakcijas galerijas siena. Izmantojiet lielu baltu laukumu, kur smalki serif fonti un portfolio fragmenti piešķir lielāku vizuālo svaru nekā hromēti saskarnes elementi.
- Heptabase — Saules apspīdēts rakstāmgalds. Siltas, papīram līdzīgas virsmas, ogles krāsas vadības ierīces un peldoši logi pētniecībai rada organizētas darba vietas, nevis programmatūras vadības paneļa sajūtu.
- Bejamas — Pidžamas — skābais kaļķis caur melnu stiklu. Izveidojiet mierīgas, gaiši pelēkas redakcijas lappuses, ko pārtrauc valdzinoši melni paneļi, kur virsmu krusto izplūdušas zaļas gaismas svītras.
- Baba — Rūpes piezīmes sarkanā saules gaismā. Izveidojiet platas sarkanas naratīvas svītras ap intīmām baltām, rozā un krēmkrāsas informācijas virsmām, izmantojot cilvēku fotogrāfijas kā emocionālo centru.
- Grafana Labs — Saullēkta signālu stacijas vadības telpa. Klusa pelēkbalta darba telpa apvienojumā ar plašu, četrkrāsu horizonta gradientu un precīziem ziliem saskarnes signāliem.
- Kagi — Atsevišķa lasītava. Izveidojiet atvērtu baltu telpu ap treknraksta grafīta tekstu, izmantojot smalkus violetus akcentus un siltas pasteļkrāsas virsmas, lai pārtrauktu mieru.