Apple
O cameră albă cu un singur întrerupător albastru
Designul Apple este un model de sobrietate: o pânză aproape albă, spațiu alb amplu și un singur accent albastru vibrant, care face ca fiecare acțiune să pară deliberată. Accentul principal este pus pe tipografie - SF Pro, cu spațiere negativă între litere care scade odată cu creșterea dimensiunii, conferind titlurilor o claritate arhitecturală fără a fi excesiv de greoaie. Produsul ESTE designul: fotografiile mari ale produselor și imaginile lifestyle domină, în timp ce elementele cromate se retrag în rame subțiri, navigare translucidă și linii subtile. Secțiunile alternează pe un fundal gri deschis cu blocuri pline de culoare pentru materiale promoționale, creând ritm prin schimbări de scară, mai degrabă decât prin elemente decorative.
Aspectul paginii este o pagină cu lățime completă, fără o lățime maximă fixă a containerului — secțiunile se întind de la o margine la alta, cu blocuri de text centrate în interior la aproximativ 980px. Navigarea este o singură bară globală fixă, cu un subfolder suplimentar pentru fiecare produs care apare la derulare. Aspectul principal este întotdeauna centrat: un nume mare de produs, un slogan pe o singură linie, două butoane tip pastilă, apoi o imagine a produsului care umple restul ferestrei de vizualizare. Secțiunile sunt stivuite vertical cu un ritm vertical generos (peste 64px între secțiuni), alternând #f5f5f7 și fundaluri colorate. Pagina de jos este un singur rând orizontal de carduri de servicii cu lățime completă (Apple TV+, Fitness+, Muzică, Arcade), fiecare un bloc foto cu text suprapus și un buton tip pastilă. Fără bare laterale, fără aspecte de conținut pe mai multe coloane, fără compoziții asimetrice — totul este centrat, stivuit și simetric.
Fotografia este limbajul vizual dominant. Fotografiile de produse sunt realizate pe un fundal alb pur sau gri pal, fără niciun context - dispozitivul ESTE vedeta, izolat și iluminat. Fotografiile de lifestyle sunt afișate în bannere pe toată lățimea, adesea cu obiecte decupate strâns. Gradienții de culoare (albastru pastel, roz, verde) servesc drept fundal pentru secțiunile de produse, nu ca decor. Iconografia este minimalistă și bazată pe linii, cu o grosime de 1-2 pixeli, în aceeași scară de gri ca și textul. Fără ilustrații, fără grafică abstractă, fără randări 3D, cu excepția fotografiilor de produs în sine.
Paletă
Marca
- Apple Blue
#0071e3— Butoane de acțiune umplute, stări selectate - singura culoare cromatică interactivă folosită cu moderație pentru a da sens fiecărei apariții. - Link Blue
#0066cc— Borduri de acțiune evidențiate, linkuri încorporate - se folosește o culoare mai saturată decât Apple Blue acolo unde o tabletă umplută ar fi prea strălucitoare. - Signal Blue
#2997ff— Rame decorative, contururi de imagini, chenaruri de pictograme - cea mai deschisă culoare albastră din sistem, folosită mai degrabă pentru atmosferă decât pentru interacțiunea cu utilizatorul.
Neutru
- Carbon
#1d1d1f— Textul principal, chenarele titlurilor, liniile de navigare, chenarele cardurilor - culoarea predominantă a cernelii este aproape neagră, cu o ușoară tentă de căldură. - Frost
#f5f5f7— Suprafața paginii, fundalul textului principal și subsolul sunt griul deschis, caracteristic Apple, puțin mai rece decât albul pur. - Ice
#f4f8fb— Umpluturi expresive de suprafață, nuanțe subtile, text pentru butoane pe un fundal închis - o nuanță subtilă de albastru care înviorează secțiunea fără a o face să iasă în evidență. - Smoke
#333333— Text secundar, umplere navigare, margini butoane - O culoare neutră versatilă pentru margini și pictograme care necesită mai multă forță decât un gri mediu. - Graphite
#474747— Text de navigare, chenarele de navigare, chenarele linkurilor - ocupă o poziție intermediară între Carbon și Smoke în ierarhia elementelor. - Ash
#707070— Text subsol, chenar listă, chenar navigare, text corp discret - Un gri mediu pentru conținut care trebuie să fie prezent, dar nu proeminent.
Tipografie
de la 12 la 56px · 8 pași
- SF Pro Display — înlocuire: Inter · contururi 400, 600, 700 · Titluri și text mare — dimensiunile de peste 40px utilizează un format de afișare pentru o diafragmă mai îngustă și o urmărire negativă mai puternică; 700 este rezervat pentru machete publicitare, iar 400 este pentru numele de produse din conținutul editorial.
- SF Pro Text — înlocuire: Inter · contururi 300, 400, 600 · Textul corpului, navigare, butoane, subtitluri — font de lucru; 400 pentru textul corpului, 300 pentru subtitluri și etichete calificate, 600 pentru elementele de navigare și textul butoanelor; spațierea negativă între litere scade proporțional cu dimensiunea (de la -0,022em la 12px la -0,01em la 44px).
Intervale și formă
| Scop | Sens |
|---|---|
| Densitate | medie |
| Pasul de bază | 12px |
| Raza butonului | 980px |
| Raza cardului | 8px |
| Umbre | fără - margini în loc de umbre |
| Între secțiuni | 64px |
| Lățimea paginii | 1440px |
Inteligența artificială vă va construi site-ul web în stilul Apple și îl va completa
- Completează cu produse și postări prin link - Instagram, TikTok, Facebook.
- Transferați conținut de pe vechiul site - specificați doar adresa.
- Design modern pe cel mai bun motor: React ( Next.js) cu randare pe server și optimizare SEO gata de utilizare.
- Optimizare SEO complet automatizată pentru rezultatele căutării și recomandări de rețele neuronale.
Stiluri similare
- Ui — plan clinic pe hârtie mată
- ElevenLabs — Un eseu foto în tonuri calde de crem, cu titluri subtile. Un caiet în stil Bauhaus — hârtie de culoarea cojii de ou, cerneală neagră și un singur accent violet și portocaliu pentru prezentarea produsului.
- monopo saigon — O strălucire lichidă, iridescentă, în spatele tăcerii editoriale — o galerie editorială monocromă plutind pe o lumină topită
- Awesomic — Plasă de zinc editorială cu semne de punctuație portocalii care amintesc de confetti
- Monad — revistă tehnică editorială pe pergament cald
- Dub — Panoul de control din hârtie de orez mată al lui Link
- Seline Analytics — O masă analitică liniștită pe hârtie caldă
- Ventriloc — Un observator editorial de date pe hârtie caldă - o singură jar portocalie evidențiază precizia monocromă
- Duolingo — Mascotă jucăușă a clasei pe hârtie albă
- Stripe — Un registru de conturi scris cu cerneală indigo pe sticlă mată
- Notion — Un caiet de hârtie cald în soarele de la amiază
- Hyer Aviation — Amurg în cockpit peste pergament. Cerul palid al zorilor întâlnește logo-ul serif de dimensiunea fuselajului, iar un singur accent cald de lut rupe reținerea monocromă.