Apple (España)
Valkoisen tilan katedraali, jonka otsikot ovat tuskin kuultavissa. Valtava, kirkas sali, jossa valtavat 700-tiheyksiset fontit roikkuvat ilmassa, vain pastellivärien ja yhden sinisen langan koossa pitäminä.
Applen tuotesivujen kieli on typografisen runsauden tutkimus: valtavat SF Pro Display -otsikot leijuvat luonnonvalkoista taustaa vasten, ja niitä ympäröi laaja valkoinen tila, joka saa jokaisen sanan tuntumaan harkitulta. Paletti on lähes yksivärinen – tekstiä #1d1d1f-muodossa, kanvaasi vuorottelee #ffffff:n ja #f5f5f7:n välillä – ja yksi sininen aksentti (#0071e3) on varattu yksinomaan interaktiivisille hetkille. Värit ovat läsnä itse tuotekuvissa (pastellisävyinä), eivätkä koskaan koristeellisina käyttöliittymäelementteinä. Komponentit ovat reunuksettomia: pyöristettyjä kortteja, joiden säde on 28 pikseliä, pillerinmuotoiset painikkeet lähes koskettavat sivun reunoja, ilman näkyviä säiliöitä tai varjoja. Rytmi luodaan vuorottelevilla valkoisilla ja harmailla raidoilla, ei jakajilla tai reunoilla.
Osiot täyttävät sivun koko leveyden ja ulottuvat reunasta reunaan reunoilla ja niissä on reilusti täytettä (noin 40–100 sivua). Sisällön enimmäisleveys on käytännössä keskitetty kunkin nauhan sisään. Pääelementti on keskitetty pino: kulmakarvan muotoinen otsikko, suurennettu otsikko, yksi toimintakehotuspainike, hintarivi ja sitten tuotekuva, joka täyttää näyttöalueen alareunan. Osiot noudattavat toistuvaa kaavaa: vasemmalle tasattu otsikko nauhan sisällä, jota seuraa joko kaksisarakkeinen asettelu tuotekuvauksineen (teksti vasemmalla/kuva oikealla tai vuorotellen), kolmisarakkeinen korttiruudukko tai keskitetty visuaalinen esittely. Sisällön rytmiä ohjataan kokonaan vuorottelevilla valkoisilla ja kolmivärisillä taustoilla, joissa on 100–100 cm:n pystysuorat välit – ei jakajia, ei elementtejä sisältäviä kortteja. Yleinen navigointi on yksi kiinteä palkki. Tuotetietojen osioissa käytetään täysleveitä kaistoja, joissa on reilu täyte, ja teksti on keskitetty kapeisiin sarakkeisiin (~560 pikseliä) leveämpää visuaalista aluetta vasten.
Applen visuaalinen kieli on ensisijaisesti tuotevalokuvausta: lähikuvia laitteistosta puhtaan valkoista tai värillistä taustaa vasten ilman elämäntyylikontekstia tai lavastettuja kohtauksia. Pääkuvassa kädet pitelevät pastellinvihreää MacBook Neoa – inhimillinen elementti on toissijainen, ja se havainnollistaa mittakaavaa ja tekstuuria pikemminkin kuin tunteita. Tuotevarianttiosioissa kaksi laitetta esitetään vierekkäin samanväristen kehysten (pinkki, vihreä, hopea, taivaansininen) taustaa vasten, jokainen kortti on tasainen värikenttä, jonka keskellä on tuote. Yksityiskohtakuvissa käytetään äärimmäisiä lähikuvia (kannettavan sarana, kameramoduuli) neutraalia taustaa vasten. Kuvituksia, abstrakteja grafiikoita tai koristeellisia kuvia ei ole – itse tuote on visuaalinen elementti. Ikonografiaa on kaikkialla – yksivärisiä viivakuvakkeita SF Symbols -tyyliin, 1,5–2 pikseliä paksuina, otettu Applen järjestelmäkuvakejoukosta. Valokuvaus on aina tehty selkeästi: tasainen, varjoton valaistus, joka pelkistää tuotteen graafiseen muotoon kolmiulotteisen objektin sijaan.
Paletti
Merkki
- Electric Blue
#0071e3— Täytetyt toimintopainikkeet ovat käyttöliittymän ainoa värillinen korostus, jota käytetään säästeliäästi toimintakehotuksissa. - Link Blue
#0066cc— Tekstiin upotetut linkit, linkit nuolilla ja nuoliviivoilla. - Citrus Gradient
#3b3b23— Vaihtoehtoinen viimeistely, josta on tullut tuotteen tunnusomainen ominaisuus, on tumma pohja, joka haalistuu kellertävänvihreiksi kohokohdiksi.
Neutraali
- Primary Ink
#1d1d1f— Otsikot, leipäteksti ja painikkeiden otsikot ovat hallitseva etualan sävy kaikilla pinnoilla; päätuotekuvan tausta muuttuu tasaisesti yläreunan kiinteästä #1d1d1f-sävystä kromaattiseksi siniseksi. - Mid Gray
#707070— Toissijainen teksti, passiivinen navigointitila, mykistetyt käyttöliittymän otsikot - Deep Gray
#474747— Navigointiteksti ja kuvakkeet ovat keskikokoisella fontilla. - Hairline
#d6d6d6— Ohuet rajat osioiden ja käyttöliittymäelementtien välillä. - Canvas
#f5f5f7— Vuorottelevat osioiden taustat - harmaa raita, joka erottaa valkoiset alueet. - Paper
#ffffff— Kortin pinta, pääsivun tausta, painikkeen teksti tummalla taustalla.
Typografia
12:sta 96 pikseliin · 10 askelta
- SF Pro Display — korvaava: Inter · ääriviivat 600, 700 · Näytettävät pääotsikot ja alaotsikot — 700-paino 80–96 pikselin koossa ja negatiivisella kirjainvälillä -1,44 pikseliä luo Applelle tyypillisen "massiivisen valkoisena kelluvan otsikon". Korvaavat: Inter, system-ui
- SF Pro Display — korvaava: Inter · ääriviivat 600 · Osioiden otsikot, korttien otsikot, alaotsikot – 600-pisteen fontti ja hieman positiivinen kirjainväli tuntuvat keskikokoisina lämpimiltä ja ystävälliseltä, toisin kuin yllä olevat lyhyet otsikot.
- SF Pro Text — korvaava: Inter · ääriviivat 400, 500, 600 · Leipätekstissä, navigoinnissa, kappaleissa ja pienissä kuvateksteissä ensisijainen fontti on fontti, jonka indeksi on 400 ja koko 17 pikseliä. Negatiivinen kirjainvälistys mahdollistaa ytimekkäämmän päätekstin paljon tietoa sisältävillä sivuilla.
Intervallit ja muoto
| Tarkoitus | Merkitys |
|---|---|
| Tiheys | tiheä |
| Perusvaihe | 8-10px |
| Painikkeen säde | 980px |
| Kortin säde | 28px |
| Varjot | ei - reunoja varjojen sijaan |
| Osioiden välillä | 100-120px |
| Sivun leveys | 1200px |
Tekoäly rakentaa verkkosivustosi Apple (España) -tyyliin ja täyttää sen
- Täytä tuotteilla ja julkaisuilla linkin kautta - Instagram, TikTok, Facebook.
- Siirrä sisältöä vanhalta sivustoltasi – määritä vain osoite.
- Moderni design parhaalla hakukonemoottorilla: React ( Next.js) palvelinrenderöinnillä ja SEO-optimoinnilla suoraan paketista.
- Täysin automatisoitu hakukoneoptimointi hakutuloksille ja neuroverkkosuosituksille.
Samankaltaisia tyylejä
- Airbnb — Hiljainen valkoinen galleriaseinä ja yksi korallinpunainen kirjanmerkki
- Peak Design — Galleriaseinä, osittain valaistu
- Ramp — Toimituksen talousosasto, mustavalkoisia sivuja yhdellä neontussilla. Julkaisun käytännössä yksivärinen pinta, jossa yksi kirkkaan limenvihreä viiva muuttaa jokaisen vuorovaikutuksen rahapoliittiseksi signaaliksi.
- 099 SUPPLY — Mustavalkoisilla esineillä täytetty gallerian seinä
- Orderful — Teollisuuden logistiikan ohjauspaneeli - Painettu logistiikan lähettäjän tarkistuslista, joka on tehty mustalla musteella ja kirurginpunaisella värillä. Jokainen sivu on niin huomaamaton, että yksi operaattori voi huutaa jotain tärkeää.
- Apple (España) — valkoinen galleriavitriini
- teenage engineering — Teollisuuskuvasto studiovalaistuksessa - tuote on sivun ainoa merkittävä kohde, ja kaikkea muuta käsitellään sen ympärillä
- Apple (España) — Galleriaikkuna aamun sumussa
- Lightship — Elokuvamainen dioraama avoimesta maantiestä. Lämpimän kermanvärisiä gallerian seiniä koristavat tiheästi kiinnitetyt suuret maisemavalokuvat, ohuet mustat fontit tuskin erottuvat kehyksissä, ja yksittäinen kirkkaan oranssi korostus rikkoo yksivärisyyden kuin nuotio niityllä.
- Custo — Metallinvärinen galleria, jossa on monoliittinen fontti. Vaimennettujen harmaanvihreän sävyjen näyttelytila, jossa yksi tumma esine ja 57px:n fontti puhuvat puolestaan.
- Silencio — Valkoinen huone, jossa leijuu esineitä. Lämpimästä paperista tehty gallerianäyttely, jossa jokainen elementti on sijoitettu omalle paikalleen negatiivisen volyymin taustaa vasten ja hiljaisuus on harkittu suunnitteluratkaisu.
- ORYZO AI — Valokuvaessee pimiöstä. Yksinäinen esine leijuu lämpimässä pimeydessä, kermanvärinen fontti ainoana koristeena.