
Apple
Egy fehér szoba egyetlen kék kapcsolóval
Az Apple formatervezése a visszafogottság mintaképe: szinte fehér vászon, bőséges fehér terület és egyetlen, élénk kék díszítés, amely minden mozdulatot átgondoltnak sugároz. A fő hangsúly a tipográfián van – az SF Pro negatív betűközzel, amely a méret növekedésével csökken, építészeti tisztaságot kölcsönözve a címsoroknak anélkül, hogy túlzottan nehézkesek lennének. A termék maga a dizájn: a nagyméretű termékfotók és életstílus-képek dominálnak, míg a krómozott elemek vékony keretekbe, áttetsző navigációba és finom vonalakba húzódnak. A világosszürke háttér előtti részek váltakoznak a promóciós anyagok teljes színű blokkjaival, a ritmust inkább a méretarányváltásokkal, mint a díszítőelemekkel teremtve.
Az oldal elrendezése teljes szélességű, rögzített maximális konténerszélesség nélkül – a szakaszok széltől szélig húzódnak, a szövegblokkok pedig körülbelül 980 képpontos középponttal vannak ellátva. A navigáció egyetlen, rögzített globális sáv, amelyen minden egyes termékhez egy további almappa található, amelyek görgetés közben megjelennek. A fő elrendezés mindig középre igazított: egy nagy terméknév, egy egysoros szlogen, két tabletta gomb, majd egy termékkép, amely kitölti a fennmaradó látómezőt. A szakaszok függőlegesen egymásra vannak halmozva, nagyvonalú függőleges ritmussal (64 képpont+ a szakaszok között), váltakozva a #f5f5f7 hashtagekkel és színes hátterekkel. Az alsó oldal egyetlen vízszintes sor teljes szélességű szolgáltatáskártyákkal (Apple TV+, Fitness+, Zene, Játékgép), mindegyik egy fotóblokk átfedő szöveggel és egy tabletta gombbal. Nincsenek oldalsávok, nincsenek többoszlopos tartalomelrendezések, nincsenek aszimmetrikus kompozíciók – minden középre igazított, egymásra halmozott és szimmetrikus.
A fénykép a domináns vizuális nyelv. A termékfotókat tiszta fehér vagy lágy szürke háttér előtt készítik, bármilyen kontextus nélkül – az eszköz A sztár, elszigetelten és megvilágítva. Az életstílusfotók teljes szélességű bannerekben jelennek meg, gyakran szorosan kivágott objektumokkal. A színátmenetek (pasztellkék, rózsaszín, zöld) a termékrészek háttereként szolgálnak, nem dekorációként. Az ikonográfia minimalista és vonalas, 1-2 képpont vastagságú, a szöveggel megegyező szürkeárnyalatos. Nincsenek illusztrációk, absztrakt grafika, 3D-s látványtervek, kivéve magukat a termékfotókat.
Paletta
Márka
- Apple Blue
#0071e3— Kitöltött akciógombok, kiválasztott állapotok – az egyetlen interaktív kromatikus szín, amelyet takarékosan használnak, hogy minden megjelenés értelmes legyen. - Link Blue
#0066cc— Kiemelt műveleti szegélyek, beágyazott linkek – az Apple Blue-nál telítettebb színt használnak ott, ahol egy kitöltött tablet túl feltűnő lenne. - Signal Blue
#2997ff— Dekoratív keretek, képkörvonalak, ikonszegélyek – a rendszer legvilágosabb kék színe, amelyet inkább a hangulat megteremtéséhez, mint a felhasználói interakcióhoz használnak.
Semleges
- Carbon
#1d1d1f— A fő szöveg, a címsorok szegélyei, a navigációs sorok, a kártyák szegélyei – a tinta domináns színe majdnem fekete, enyhe melegséggel. - Frost
#f5f5f7— Az oldalvászon, a fő szöveg háttere és a lábléc felülete az Apple jellegzetes világosszürkéje, ami egy kicsit hűvösebb a tiszta fehérnél. - Ice
#f4f8fb— Kifejező felületi kitöltések, finom színárnyalatok, gombszöveg sötét háttéren – egy finom kék árnyalat, amely élénkíti a részt anélkül, hogy az kitűnne. - Smoke
#333333— Másodlagos szöveg, navigációs kitöltés, gombszegélyek – Sokoldalú semleges szín szegélyekhez és ikonokhoz, amelyekhez nagyobb ütősségre van szükség, mint egy középszürke. - Graphite
#474747— Navigációs szöveg, navigációs szegélyek, hivatkozás szegélyek – az elemhierarchiában a Szén és a Füst között foglalnak el köztes helyet. - Ash
#707070— Lábléc szövege, listaszegélyek, navigációs szegélyek, elnémított szövegtörzs – Középszürke olyan tartalomhoz, amelynek jelen kell lennie, de nem feltűnőnek.
Tipográfia
12-től 56 képpontig · 8 lépésben
- SF Pro Display — csere: Inter · körvonalak 400, 600, 700 · Címsorok és nagyméretű szövegek – A 40 képpontnál nagyobb méretek keskenyebb rekesznyílást és erősebb negatív követést biztosító megjelenítési formátumot használnak; a 700 képpont a hirdetési elrendezésekhez, a 400 pedig a szerkesztői tartalmakban található terméknevekhez van fenntartva.
- SF Pro Text — csere: Inter · körvonalak 300, 400, 600 · Törzsszöveg, navigáció, gombok, alcímek – működő betűtípus; 400 a törzsszöveghez, 300 az alcímekhez és a minősített címkékhez, 600 a navigációs elemekhez és a gombok szövegéhez; a negatív betűköz a mérettel arányosan csökken (-0,022em-ről 12 képpontra, majd -0,01em-ről 44 képpontra).
Intervallumok és forma
| Cél | Jelentés |
|---|---|
| Sűrűség | átlagos |
| Alapvető lépés | 12px |
| Gomb sugara | 980px |
| Kártya sugara | 8px |
| Árnyékok | nincs - szegélyek árnyékok helyett |
| Szakaszok között | 64px |
| Oldal szélessége | 1440px |
A mesterséges intelligencia Apple stílusban fogja elkészíteni a weboldaladat, és kitölti azt.
- Töltsd fel termékeidet és posztjaidat a linkeken keresztül - Instagram, TikTok, Facebook.
- Tartalom átvitele régi webhelyéről – csak adja meg a címet.
- Modern dizájn a legjobb keresőmotoron: React ( Next.js) szerveralapú rendereléssel és SEO optimalizálással, azonnal használható formában.
- Teljesen automatizált SEO optimalizálás a keresési eredményekhez és a neurális hálózati ajánlásokhoz.
Hasonló stílusok
- Ui — klinikai terv matt papíron
- ElevenLabs — Meleg krémszínű fotóesszé visszafogott címekkel. Bauhaus stílusú jegyzetfüzet – tojáshéjszínű papír, fekete tinta és egyetlen lila és narancssárga díszítőelem a termékek bemutatásához.
- monopo saigon — Folyékony, irizáló fény a szerkesztői csend mögött – egy monokróm szerkesztői galéria olvadt fényben lebeg
- Awesomic — Szerkesztői cinkháló narancssárga írásjelekkel, konfettire emlékeztetve
- Monad — szerkesztőségi műszaki folyóirat meleg pergamenen
- Dub — Link matt rizspapír kezelőpanelje
- Seline Analytics — Egy csendes elemző asztal meleg papíron
- Ventriloc — Meleg papíron szerkesztett adatmegfigyelő állomás - egyetlen narancssárga parázs kiemeli a monokróm pontosságot
- Duolingo — Játékos osztály kabalafigura fehér papíron
- Stripe — Indigó tintával, matt üvegre írt számlakönyv
- Notion — Egy meleg papírfüzet a déli napsütésben
- Hyer Aviation — Alkonyat a pilótafülkében pergamen felett. A sápadt hajnali ég találkozik a törzs méretű, talpas logóval, és egyetlen meleg agyagdísz töri meg a monokróm visszafogottságot.