Apple
'n Wit kamer met 'n enkele blou skakelaar
Apple se ontwerp is 'n toonbeeld van terughoudendheid: 'n byna wit doek, ruim wit spasie en 'n enkele, helderblou aksent wat elke aksie doelbewus laat voel. Die primêre fokus is tipografie—SF Pro, met negatiewe letterspasiëring wat afneem met toenemende grootte, wat opskrifte 'n argitektoniese helderheid gee sonder om te swaar te wees. Die produk IS die ontwerp: groot produkfoto's en leefstylbeelde oorheers, terwyl chroomelemente terugtrek in dun rame, deurskynende navigasie en subtiele lyne. Afdelings wissel af teen 'n liggrys agtergrond met volkleurblokke vir promosiemateriaal, wat ritme skep deur veranderinge in skaal eerder as dekoratiewe elemente.
Die bladsyuitleg is 'n volwydte-bladsy sonder 'n vaste maksimum houerwydte—afdelings strek van rand tot rand, met teksblokke gesentreer binne ongeveer 980px. Die navigasie is 'n enkele, vaste globale balk met 'n bykomende subgids vir elke produk wat op die blaai verskyn. Die hoofuitleg is altyd gesentreer: 'n groot produknaam, 'n enkellyn-slaglyn, twee pilknoppies, dan 'n produkbeeld wat die oorblywende kykvenster vul. Afdelings word vertikaal gestapel met 'n ruim vertikale ritme (64px+ tussen afdelings), afwisselend #f5f5f7 en gekleurde agtergronde. Die onderste bladsy is 'n enkele horisontale ry volwydte-dienskaarte (Apple TV+, Fitness+, Music, Arcade), elk 'n fotoblok met oorlegteks en 'n pilknoppie. Geen sybalke, geen multikolom-inhouduitlegte, geen asimmetriese komposisies nie—alles is gesentreer, gestapel en simmetries.
Fotografie is die dominante visuele taal. Produkfoto's word teen 'n suiwer wit of sagte grys agtergrond geneem, sonder enige konteks—die toestel IS die ster, geïsoleerd en verlig. Leefstylfoto's word in volle breedte baniere vertoon, dikwels met diggesnyde voorwerpe. Kleurgradiënte (pastelblou, pienk, groen) dien as agtergrond vir die produkafdelings, nie as versiering nie. Die ikonografie is minimalisties en lyngebaseerd, 1-2px dik, in dieselfde grysskaal as die teks. Geen illustrasies, geen abstrakte grafika, geen 3D-weergawes nie, behalwe vir die produkfoto's self.
Palet
Handelsmerk
- Apple Blue
#0071e3— Gevulde aksieknoppies, geselekteerde toestande - die enigste interaktiewe chromatiese kleur wat spaarsamig gebruik word om elke voorkoms betekenisvol te maak. - Link Blue
#0066cc— Uitgeligte aksiegrense, ingebedde skakels - 'n meer versadigde kleur as Appelblou word gebruik waar 'n gevulde tablet te flitsend sou wees. - Signal Blue
#2997ff— Dekoratiewe rame, beeldomlyne, ikoongrense - die ligste blou kleur in die stelsel, word vir atmosfeer eerder as vir gebruikersinteraksie gebruik.
Neutraal
- Carbon
#1d1d1f— Die hoofteks, opskrifrande, navigasielyne, kaartrande - die oorheersende inkkleur is amper swart met 'n effense sweempie warmte. - Frost
#f5f5f7— Die bladsydoek, hoofteksagtergrond en voetskrifoppervlak is Apple se kenmerkende liggrys, 'n bietjie koeler as suiwer wit. - Ice
#f4f8fb— Ekspressiewe oppervlakvullings, subtiele kleure, knoppieteks op 'n donker agtergrond - 'n subtiele blou skakering wat die afdeling verlewendig sonder om dit te laat uitstaan. - Smoke
#333333— Sekondêre teks, navigasie-invulsel, knoppiegrense - 'n Veelsydige neutrale kleur vir grense en ikone wat meer krag benodig as 'n mediumgrys. - Graphite
#474747— Navigasieteks, navigasiegrense, skakelgrense - beklee 'n tussenposisie tussen Koolstof en Rook in die elementhiërargie. - Ash
#707070— Voetteks, lysrande, navigasierande, gedempte liggaamsteks - 'n Mediumgrys vir inhoud wat teenwoordig maar nie prominent moet wees nie.
Tipografie
van 12 tot 56px · 8 stappe
- SF Pro Display — vervanging: Inter · buitelyne 400, 600, 700 · Opskrifte en groot teks—groottes van 40px+ gebruik 'n vertoonformaat vir 'n nouer lensopening en sterker negatiewe dophou; 700 is gereserveer vir advertensie-uitlegte, en 400 is vir produkname in redaksionele inhoud.
- SF Pro Text — vervanging: Inter · buitelyne 300, 400, 600 · Liggaamsteks, navigasie, knoppies, subopskrifte — werkende lettertipe; 400 vir liggaamsteks, 300 vir subopskrifte en gekwalifiseerde etikette, 600 vir navigasie-elemente en knoppieteks; negatiewe letterspasiëring neem proporsioneel af tot die grootte (van -0.022em tot 12px tot -0.01em tot 44px).
Intervalle en vorm
| Doel | Betekenis |
|---|---|
| Digtheid | gemiddelde |
| Basiese stap | 12px |
| Knoppieradius | 980px |
| Kaartradius | 8px |
| Skaduwees | geen grense in plaas van skaduwees |
| Tussen afdelings | 64px |
| Bladsybreedte | 1440px |
KI sal jou webwerf in Apple -styl bou en dit vul
- Vul met produkte en plasings via die skakel - Instagram, TikTok, Facebook.
- Dra inhoud van jou ou webwerf oor – spesifiseer net die adres.
- Moderne ontwerp op die beste enjin: React ( Next.js) met bedienerweergawe en SEO-optimalisering reg uit die boks.
- Volledig outomatiese SEO-optimering vir soekresultate en neurale netwerkaanbevelings.
Soortgelyke style
- Studio — 'n Galerymuur in beweging. Elke skerm verteenwoordig 'n stil, grys uitstallingsoppervlak waar tipografiese materiale en oorvleuelende kreatiewe werke om aandag meeding.
- Mollie — ’n Kasjmiertoonbank, ’n donker grootboek. Laat genoeg wit spasie vir redaksionele ontwerp rondom die swart teks, en versterk dan produkverwante punte met warm roomys, espresso-bruins en tasbare foto's van werklike betaalmetodes.
- Basis Theory — Betaalterminale in die ontwerpateljee. Wit tegniese papier, oorvleuelende deurskynende transaksielae en 'n enkele turkoois beheerelement definieer die visuele rigting.
- CleanShot X — 'n Ateljee met 'n blouverligte lessenaar. Skep 'n kalm wit spasie rondom kompakte swart teks, en laat dan die ryk blou kontroles en gelaagde Mac-produkbeelde die middelpunt van die verhoog inneem.
- Modern Treasury — 'n Tesourie-grootboek op grafiekpapier. Skep bladsye wat soos 'n stil, wit bedryfsblad lyk, waar kontantvloei met fyn lyne, gemerkte nodusse en presiese, versteekte kontroles vertoon word.
- Basha-Franklin — 'n Galeryruiter onder 'n wit latei. Gebruik 'n warm #f4ede6-kleur, 'n subtiele swart struktuur en asimmetriese kolomme gebaseer op foto's wat soos 'n gedrukte argitektoniese portefeulje lyk.
- Bajgart Office — Redaksionele galerymuur. Gebruik 'n groot wit spasie waar subtiele serif-lettertipes en portefeuljefragmente meer visuele gewig dra as verchroomde koppelvlakelemente.
- Heptabase — ’n Sonverligte lessenaar. Warm, papieragtige oppervlaktes, houtskoolkleurige kontroles en swewende vensters vir navorsing skep die gevoel van ’n georganiseerde werkspasie eerder as ’n sagteware-kontrolepaneel.
- Bejamas — Pajamas—suur kalk deur swart glas. Skep kalm, liggrys redaksionele bladsye onderbreek deur boeiende swart panele waar vae groen ligstrepe die oppervlak sny.
- Baba — Sorgnotas in rooi sonlig. Skep wye rooi narratiewe strepe rondom intieme wit, pienk en roomkleurige inligtingsoppervlaktes, met foto's van mense as die emosionele middelpunt.
- Grafana Labs — Die beheerkamer van die Sonsopkoms-seinstasie. 'n Stil grys-en-wit werkruimte word gekombineer met 'n wye, vierkleurige horisongradiënt en presiese blou koppelvlakseine.
- Kagi — 'n Afsonderlike leeskamer. Skep 'n oop wit ruimte rondom vetgedrukte grafietteks, met behulp van subtiele pers aksente en warm pastelkleurige oppervlaktes om die rustigheid te breek.