Apple
Baltas kambarys su vienu mėlynu jungikliu
„Apple“ dizainas yra santūrumo pavyzdys: beveik balta drobė, daug baltos erdvės ir vienas ryškiai mėlynas akcentas, suteikiantis kiekvienam veiksmui apgalvoto įspūdį. Pagrindinis dėmesys skiriamas tipografijai – „SF Pro“ su neigiamu raidžių tarpu, kuris mažėja didėjant dydžiui, suteikiant antraštėms architektūrinį aiškumą, tačiau ne per daug sunkiasvorių. Produktas YRA dizainas: dominuoja didelės produktų nuotraukos ir gyvenimo būdo vaizdai, o chromo elementai pasitraukia į plonus rėmelius, permatomą navigaciją ir subtilias linijas. Skyriai kaitaliojasi šviesiai pilkame fone su spalvotais reklaminės medžiagos blokais, sukuriant ritmą keičiant mastelį, o ne dekoratyvinius elementus.
Puslapio išdėstymas yra viso pločio puslapis be fiksuoto maksimalaus konteinerio pločio – sekcijos tęsiasi nuo krašto iki krašto, o teksto blokai centruojami maždaug 980 pikselių atstumu. Navigaciją sudaro viena fiksuota visuotinė juosta su papildomu kiekvieno produkto poaplankiu, kuris rodomas slenkant. Pagrindinis išdėstymas visada yra centre: didelis produkto pavadinimas, vienos eilutės šūkis, du tabletės mygtukai ir produkto vaizdas, užpildantis likusį rodinio langą. Skyriai sukrauti vertikaliai, su dosniu vertikaliu ritmu (64 pikseliai ir daugiau tarp sekcijų), kaitaliojant #f5f5f7 ir spalvotus fonus. Apatiniame puslapyje yra viena horizontali viso pločio paslaugų kortelių eilutė („Apple TV+“, „Fitness+“, „Muzika“, „Arcade“), kiekviena iš jų yra nuotraukų blokas su perdengiamu tekstu ir tabletės mygtuku. Jokių šoninių juostų, jokių kelių stulpelių turinio išdėstymų, jokių asimetrinių kompozicijų – viskas yra centruota, sukrauta ir simetriška.
Fotografija yra dominuojanti vizualinė kalba. Produktų nuotraukos daromos grynai baltame arba švelniai pilkame fone, be jokio konteksto – įrenginys YRA žvaigždė, izoliuotas ir apšviestas. Gyvenimo būdo nuotraukos rodomos viso pločio reklaminiuose skydeliuose, dažnai su griežtai apkirptais objektais. Spalvų gradientai (pastelinė mėlyna, rožinė, žalia) tarnauja kaip produktų skyrių fonas, o ne kaip dekoracija. Ikonografija yra minimalistinė ir linijinė, 1–2 pikselių storio, to paties pilkos spalvos kaip ir tekstas. Jokių iliustracijų, abstrakčios grafikos, 3D vizualizacijų, išskyrus pačias produktų nuotraukas.
Paletė
Prekės ženklas
- Apple Blue
#0071e3— Užpildyti veiksmų mygtukai, pasirinktos būsenos – vienintelė interaktyvi chromatinė spalva, naudojama saikingai, kad kiekvienas vaizdas būtų prasmingas. - Link Blue
#0066cc— Paryškinti veiksmų rėmeliai, įterptosios nuorodos – sodresnė nei „Apple Blue“ spalva naudojama ten, kur užpildyta planšetė atrodytų pernelyg ryškiai. - Signal Blue
#2997ff— Dekoratyviniai rėmeliai, paveikslėlių kontūrai, piktogramų kraštinės – šviesiausia mėlyna spalva sistemoje, naudojama atmosferai, o ne vartotojo sąveikai sukurti.
Neutralus
- Carbon
#1d1d1f— Pagrindinis tekstas, antraščių rėmeliai, naršymo eilutės, kortelių rėmeliai – vyraujanti rašalo spalva yra beveik juoda su lengvu šilumos atspalviu. - Frost
#f5f5f7— Puslapio drobė, pagrindinis teksto fonas ir poraštės paviršius yra „Apple“ firminės šviesiai pilkos spalvos, šiek tiek šaltesnės nei gryna balta. - Ice
#f4f8fb— Išraiškingi paviršiaus užpildai, subtilūs atspalviai, mygtuko tekstas tamsiame fone – subtilus mėlynas atspalvis, kuris pagyvina skyrių jo neišsiskiriant. - Smoke
#333333— Antrinis tekstas, naršymo užpildymas, mygtukų rėmeliai – universali neutrali spalva rėmeliams ir piktogramoms, kurioms reikia daugiau ryškumo nei vidutinio pilkumo. - Graphite
#474747— Navigacijos tekstas, navigacijos rėmeliai, nuorodų rėmeliai – elementų hierarchijoje užima tarpinę vietą tarp anglies ir dūmų. - Ash
#707070— Poraštės tekstas, sąrašo rėmeliai, naršymo rėmeliai, prislopintas pagrindinis tekstas – vidutiniškai pilka spalva turiniui, kuris turi būti matomas, bet ne ryškus.
Tipografija
nuo 12 iki 56 pikselių · 8 žingsniai
- SF Pro Display — pakeitimas: Inter · kontūrai 400, 600, 700 · Antraštės ir didelis tekstas – 40 pikselių ir didesni dydžiai naudoja rodymo formatą, skirtą siauresnei diafragmai ir stipresniam neigiamam sekimui; 700 pikselių skirta reklamos maketams, o 400 – produktų pavadinimams redakciniame turinyje.
- SF Pro Text — pakeitimas: Inter · kontūrai 300, 400, 600 · Pagrindinis tekstas, naršymas, mygtukai, paantraštės – darbinis šriftas; 400 pagrindiniam tekstui, 300 paantraštėms ir kvalifikuotoms etiketėms, 600 naršymo elementams ir mygtukų tekstui; neigiamas raidžių tarpas mažėja proporcingai dydžiui (nuo -0,022 em iki 12 pikselių iki -0,01 em iki 44 pikselių).
Intervalai ir forma
| Tikslas | Reikšmė |
|---|---|
| Tankis | vidutinis |
| Pagrindinis žingsnis | 12px |
| Mygtuko spindulys | 980px |
| Kortelės spindulys | 8px |
| Šešėliai | ne – rėmeliai vietoj šešėlių |
| Tarp sekcijų | 64px |
| Puslapio plotis | 1440px |
Dirbtinis intelektas sukurs jūsų svetainę Apple stiliumi ir ją užpildys
- Užpildykite produktais ir įrašais per nuorodą – Instagram, TikTok, Facebook.
- Perkelkite turinį iš senos svetainės – tiesiog nurodykite adresą.
- Modernus dizainas geriausiame variklyje: React ( Next.js) su serverio atvaizdavimu ir SEO optimizavimu iš karto.
- Visiškai automatizuotas SEO optimizavimas paieškos rezultatams ir neuroninių tinklų rekomendacijoms.
Panašūs stiliai
- Studio — Judanti galerijos siena. Kiekvienas ekranas – tai tylus, pilkas parodos paviršius, kuriame dėl dėmesio varžosi tipografinės medžiagos ir persidengiantys kūrybiniai darbai.
- Mollie — Kašmyro prekystalis, tamsi apskaitos knyga. Aplink juodą tekstą palikite pakankamai baltos vietos redakciniam dizainui, tada su produktais susijusius aspektus pabrėžkite šiltais kreminiais dažais, espreso rudais dažais ir apčiuopiamomis realių mokėjimo būdų nuotraukomis.
- Basis Theory — Mokėjimo terminalai dizaino studijoje. Baltas techninis popierius, persidengiantys permatomi operacijų sluoksniai ir vienas turkio spalvos valdymo elementas apibrėžia vizualinę kryptį.
- CleanShot X — Studija su mėlynai apšviestu darbalaukiu. Sukurkite ramią baltą erdvę aplink kompaktišką juodą tekstą, tada leiskite sodriems mėlynos spalvos valdikliams ir sluoksniuotiems „Mac“ gaminių vaizdams užimti centrinę vietą.
- Modern Treasury — Iždo apskaitos knyga ant milimetrinio popieriaus. Sukurkite puslapius, kurie primena ramų, baltą operacijų lapą, kuriame pinigų srautai rodomi plonomis linijomis, pažymėtais mazgais ir tiksliais, paslėptais valdikliais.
- Basha-Franklin — Galerijos tinklelis po balta sąrama. Naudokite šiltą #f4ede6 atspalvį, subtilią juodą struktūrą ir asimetriškas kolonas, paremtas nuotraukomis, kurios atrodo kaip atspausdintas architektūros portfolio.
- Bajgart Office — Redakcijos galerijos siena. Naudokite didelę baltą erdvę, kurioje subtilūs serifiniai šriftai ir portfolio fragmentai vizualiai įgauna daugiau svorio nei chromuoti sąsajos elementai.
- Heptabase — Saulės apšviestas stalas. Šilti, popierių primenantys paviršiai, anglies spalvos valdikliai ir plaukiojantys tyrimų langai sukuria organizuotos darbo vietos, o ne programinės įrangos valdymo skydelio, įspūdį.
- Bejamas — Pižama – rūgštinės kalkės per juodą stiklą. Sukurkite ramius, šviesiai pilkus redakcinius puslapius, kuriuos pertraukia žavūs juodi skydeliai, kur paviršių kerta neryškūs žali šviesos ruožai.
- Baba — Rūpestingumo užrašai raudonoje saulės šviesoje. Sukurkite plačias raudonas pasakojimo juostas aplink intymius baltus, rožinius ir kreminius informacinius paviršius, naudodami žmonių nuotraukas kaip emocinį centrą.
- Grafana Labs — „Sunrise“ signalų stoties valdymo patalpa. Rami pilkai balta darbo vieta dera su plačiu keturių spalvų horizonto gradientu ir tiksliais mėlynos spalvos sąsajos signalais.
- Kagi — Atskira skaitykla. Sukurkite atvirą baltą erdvę aplink ryškų grafitinio teksto foną, naudodami subtilius violetinius akcentus ir šiltus pastelinius paviršius, kad suskaidytumėte ramybę.