Apple
Una habitació blanca amb un únic interruptor blau
El disseny d'Apple és un model de moderació: un llenç gairebé blanc, un ampli espai blanc i un únic accent blau vibrant que fa que cada acció sembli deliberada. L'enfocament principal és la tipografia: SF Pro, amb un espaiat negatiu entre lletres que disminueix a mesura que augmenta la mida, donant als titulars una claredat arquitectònica sense ser massa pesats. El producte ÉS el disseny: dominen les fotos grans de productes i les imatges d'estil de vida, mentre que els elements cromats retrocedeixen en marcs prims, navegació translúcida i línies subtils. Les seccions alternen sobre un fons gris clar amb blocs a tot color per a materials promocionals, creant ritme a través de canvis d'escala en lloc d'elements decoratius.
El disseny de la pàgina és una pàgina d'amplada completa sense una amplada màxima fixa del contenidor: les seccions s'estenen de vora a vora, amb blocs de text centrats a aproximadament 980 px. La navegació és una única barra global fixa amb una subcarpeta addicional per a cada producte que apareix en desplaçar-se. El disseny principal sempre està centrat: un nom de producte gran, un eslògan d'una sola línia, dos botons de píndola i, a continuació, una imatge del producte que omple la finestra gràfica restant. Les seccions s'apilen verticalment amb un ritme vertical generós (més de 64 px entre seccions), alternant #f5f5f7 i fons de colors. La pàgina inferior és una única fila horitzontal de targetes de servei d'amplada completa (Apple TV+, Fitness+, Música, Arcade), cadascuna un bloc de fotos amb text superposat i un botó de píndola. No hi ha barres laterals, ni dissenys de contingut de diverses columnes, ni composicions asimètriques: tot està centrat, apilat i simètric.
La fotografia és el llenguatge visual dominant. Les fotos de productes es fan sobre un fons blanc pur o gris suau, sense cap context: el dispositiu ÉS l'estrella, aïllat i il·luminat. Les fotos d'estil de vida es mostren en bàners d'amplada completa, sovint amb objectes retallats. Els degradats de color (blau pastel, rosa, verd) serveixen de fons per a les seccions de productes, no com a decoració. La iconografia és minimalista i basada en línies, d'1-2 px de gruix, en la mateixa escala de grisos que el text. No hi ha il·lustracions, ni gràfics abstractes, ni representacions en 3D, excepte les fotos dels productes.
Paleta
Marca
- Apple Blue
#0071e3— Botons d'acció plens, estats seleccionats: l'únic color cromàtic interactiu utilitzat amb moderació per fer que cada aparença tingui sentit. - Link Blue
#0066cc— Vores d'acció ressaltades, enllaços incrustats: s'utilitza un color més saturat que el blau Apple on una tauleta plena seria massa cridanera. - Signal Blue
#2997ff— Marcs decoratius, contorns d'imatges, vores d'icones: el color blau més clar del sistema, utilitzat per a l'atmosfera en lloc de per a la interacció de l'usuari.
Neutral
- Carbon
#1d1d1f— El text principal, les vores dels encapçalaments, les línies de navegació, les vores de les targetes: el color de tinta predominant és gairebé negre amb un lleuger toc de calidesa. - Frost
#f5f5f7— El llenç de la pàgina, el fons del text principal i la superfície del peu de pàgina són del gris clar característic d'Apple, una mica més fred que el blanc pur. - Ice
#f4f8fb— Emplenaments superficials expressius, tons subtils, text de botons sobre un fons fosc: un to blau subtil que anima la secció sense fer-la destacar. - Smoke
#333333— Text secundari, farciment de navegació, vores de botons: un color neutre versàtil per a vores i icones que necessiten més impacte que un gris mitjà. - Graphite
#474747— Text de navegació, vores de navegació, vores d'enllaç: ocupa una posició intermèdia entre Carbon i Smoke en la jerarquia d'elements. - Ash
#707070— Text de peu de pàgina, vores de llista, vores de navegació, text del cos silenciat: un gris mitjà per al contingut que ha d'estar present però no destacat.
Tipografia
de 12 a 56 px · 8 passos
- SF Pro Display — reemplaçament: Inter · esquemes 400, 600, 700 · Titulars i text gran: les mides de més de 40 px utilitzen un format de visualització per a una obertura més estreta i un seguiment negatiu més fort; 700 es reserva per a dissenys publicitaris i 400 és per a noms de productes en contingut editorial.
- SF Pro Text — reemplaçament: Inter · esquemes 300, 400, 600 · Text del cos, navegació, botons, subtítols: font de treball; 400 per al text del cos, 300 per als subtítols i les etiquetes qualificades, 600 per als elements de navegació i el text dels botons; l'espaiat negatiu entre lletres disminueix proporcionalment a la mida (de -0,022em a 12px a -0,01em a 44px).
Intervals i forma
| Propòsit | Significat |
|---|---|
| Densitat | mitjana |
| Pas bàsic | 12px |
| Radi del botó | 980px |
| Radi de la targeta | 8px |
| Ombres | sense vores en comptes d'ombres |
| Entre seccions | 64px |
| Amplada de la pàgina | 1440px |
La IA crearà el vostre lloc web a l'estil Apple i l'omplirà.
- Omple amb productes i publicacions a través de l'enllaç: Instagram, TikTok, Facebook.
- Transfereix contingut del teu lloc web antic; només cal que especifiquis l'adreça.
- Disseny modern en el millor motor: React ( Next.js) amb renderització de servidor i optimització SEO des del primer moment.
- Optimització SEO totalment automatitzada per a resultats de cerca i recomanacions de xarxes neuronals.
Estils similars
- Ui — pla clínic en paper mat
- ElevenLabs — Un assaig fotogràfic en tons crema càlids amb titulars subtils. Un quadern d'estil Bauhaus: paper color closca d'ou, tinta negra i un únic detall morat i taronja per a la presentació del producte.
- monopo saigon — Una resplendor líquida i iridescent darrere del silenci editorial: una galeria editorial monocroma flotant sobre llum fosa
- Awesomic — Malla de zinc editorial amb signes de puntuació taronges que recorden confeti
- Monad — revista tècnica editorial en pergamí calent
- Dub — Tauler de control de paper d'arròs mat de Link
- Seline Analytics — Una taula analítica silenciosa sobre paper calent
- Ventriloc — Un observatori editorial de dades sobre paper calent: una única brasa taronja que destaca la precisió monocromàtica
- Duolingo — Mascota de classe divertida sobre paper blanc
- Stripe — Un llibre de comptes escrit amb tinta indi sobre vidre glaçat
- Notion — Un quadern de paper calent al sol del migdia
- Hyer Aviation — Crepuscle a la cabina sobre pergamí. El cel pàl·lid de l'alba es troba amb el logotip serif de la mida del fuselatge, i un únic detall d'argila càlida trenca la contenció monocromàtica.