Apple
Një dhomë e bardhë me një çelës të vetëm blu
Dizajni i Apple është një model përmbajtjeje: një kanavacë pothuajse e bardhë, hapësirë e bollshme e bardhë dhe një theks i vetëm blu i gjallë që e bën çdo veprim të duket i qëllimshëm. Fokusi kryesor është tipografia - SF Pro, me hapësirë negative shkronjash që zvogëlohet me rritjen e madhësisë, duke u dhënë titujve një qartësi arkitekturore pa qenë tepër e rëndë. Produkti ËSHTË dizajni: fotot e mëdha të produkteve dhe imazhet e stilit të jetesës dominojnë, ndërsa elementët e kromit tërhiqen në korniza të holla, navigim të tejdukshëm dhe vija delikate. Seksionet alternojnë në një sfond gri të çelët me blloqe me ngjyra të plota për materiale promovuese, duke krijuar ritëm përmes ndryshimeve në shkallë në vend të elementëve dekorativë.
Paraqitja e faqes është një faqe me gjerësi të plotë pa një gjerësi maksimale të caktuar të kontejnerit - seksionet shtrihen nga njëra anë në tjetrën, me blloqe teksti të përqendruara brenda në afërsisht 980px. Navigimi është një shirit i vetëm global i fiksuar me një nën-dosje shtesë për secilin produkt që shfaqet gjatë rrotullimit. Paraqitja kryesore është gjithmonë e përqendruar: një emër i madh produkti, një slogan me një rresht të vetëm, dy butona tabletash, pastaj një imazh produkti që mbush dritaren e mbetur të pamjes. Seksionet janë të grumbulluara vertikalisht me një ritëm vertikal bujar (64px+ midis seksioneve), duke alternuar #f5f5f7 dhe sfonde me ngjyra. Faqja e poshtme është një rresht i vetëm horizontal me karta shërbimesh me gjerësi të plotë (Apple TV+, Fitness+, Music, Arcade), secila një bllok fotosh me tekst mbivendosës dhe një buton tabletash. Pa shirita anësorë, pa paraqitje përmbajtjeje me shumë kolona, pa kompozime asimetrike - gjithçka është e përqendruar, e grumbulluar dhe simetrike.
Fotografia është gjuha vizuale mbizotëruese. Fotot e produkteve bëhen në një sfond të bardhë të pastër ose gri të butë, pa asnjë kontekst - pajisja ËSHTË ylli, e izoluar dhe e ndriçuar. Fotot e stilit të jetesës shfaqen në banderola me gjerësi të plotë, shpesh me objekte të prera fort. Gradientët e ngjyrave (blu pastel, rozë, jeshile) shërbejnë si sfond për seksionet e produkteve, jo si dekorim. Ikonografia është minimaliste dhe e bazuar në vija, 1-2px e trashë, në të njëjtën shkallë gri si teksti. Pa ilustrime, pa grafikë abstrakte, pa paraqitje 3D, përveç vetë fotove të produkteve.
Paletë
Markë
- Apple Blue
#0071e3— Butona veprimi të mbushur, gjendje të zgjedhura - e vetmja ngjyrë kromatike interaktive e përdorur me kursim për t'i dhënë kuptim çdo pamjeje. - Link Blue
#0066cc— Kufijtë e theksuar të veprimit, lidhjet e integruara - një ngjyrë më e ngopur se Apple Blue përdoret aty ku një tabletë e mbushur do të ishte shumë e ndezur. - Signal Blue
#2997ff— Korniza dekorative, skica imazhesh, kufij ikonash - ngjyra blu më e çelët në sistem, e përdorur për atmosferën dhe jo për ndërveprimin e përdoruesit.
Neutral
- Carbon
#1d1d1f— Teksti kryesor, kufijtë e titujve, vijat e navigimit, kufijtë e kartave - ngjyra mbizotëruese e bojës është pothuajse e zezë me një nuancë të lehtë ngrohtësie. - Frost
#f5f5f7— Kanavaca e faqes, sfondi i tekstit kryesor dhe sipërfaqja e fundit të faqes janë në ngjyrën gri të çelët, karakteristike e Apple, pak më të ftohtë se e bardha e pastër. - Ice
#f4f8fb— Mbushje ekspresive të sipërfaqes, nuanca delikate, tekst butoni në një sfond të errët - një nuancë delikate blu që e gjallëron seksionin pa e bërë atë të dallohet. - Smoke
#333333— Tekst dytësor, mbushje navigimi, kufij butonash - Një ngjyrë neutrale e gjithanshme për kufijtë dhe ikonat që kanë nevojë për më shumë shkëlqim sesa një gri e mesme. - Graphite
#474747— Teksti i navigimit, kufijtë e navigimit, kufijtë e lidhjeve - zë një pozicion të ndërmjetëm midis Karbonit dhe Tymit në hierarkinë e elementeve. - Ash
#707070— Teksti i fundit të faqes, kufijtë e listës, kufijtë e navigimit, teksti i trupit i heshtur - Një gri mesatare për përmbajtjen që duhet të jetë e pranishme, por jo e spikatur.
Tipografi
nga 12 në 56px · 8 hapa
- SF Pro Display — zëvendësim: Inter · skica 400, 600, 700 · Titujt dhe teksti i madh—madhësitë mbi 40px përdorin një format shfaqjeje për një aperturë më të ngushtë dhe gjurmim më të fortë negativ; 700 është i rezervuar për paraqitjet e reklamave dhe 400 është për emrat e produkteve në përmbajtjen editoriale.
- SF Pro Text — zëvendësim: Inter · skica 300, 400, 600 · Teksti i trupit, navigimi, butonat, nëntitujt — font funksional; 400 për tekstin e trupit, 300 për nëntitujt dhe etiketat e kualifikuara, 600 për elementët e navigimit dhe tekstin e butonave; hapësira midis shkronjave negative zvogëlohet në mënyrë proporcionale me madhësinë (nga -0.022em në 12px në -0.01em në 44px).
Intervalet dhe forma
| Qëllimi | Kuptimi |
|---|---|
| Dendësia | mesatare |
| Hapi bazë | 12px |
| Rrezja e butonit | 980px |
| Rrezja e kartës | 8px |
| Hijet | pa kufij në vend të hijeve |
| Midis seksioneve | 64px |
| Gjerësia e faqes | 1440px |
IA do ta ndërtojë faqen tuaj të internetit në stilin Apple dhe do ta mbushë atë
- Plotësoni me produkte dhe postime përmes linkut - Instagram, TikTok, Facebook.
- Transferoni përmbajtje nga faqja juaj e vjetër—thjesht specifikoni adresën.
- Dizajn modern në motorin më të mirë: React ( Next.js) me renderim të serverit dhe optimizim SEO që në fillim.
- Optimizim plotësisht i automatizuar i SEO-s për rezultatet e kërkimit dhe rekomandimet e rrjeteve nervore.
Stile të ngjashme
- Ui — plan klinik në letër mat
- ElevenLabs — Një ese me foto në tone të ngrohta krem me tituj delikatë. Një fletore në stilin Bauhaus - letër me ngjyrë lëvozhge veze, bojë e zezë dhe një theks i vetëm vjollcë dhe portokalli për shfaqjen e produktit.
- monopo saigon — Një shkëlqim i lëngshëm, iridescent pas heshtjes editoriale - një galeri editoriale monokrome që noton mbi dritën e shkrirë.
- Awesomic — Rrjetë zinku editoriale me shenja pikësimi portokalli që të kujtojnë konfeti
- Monad — revistë teknike editoriale mbi pergamenë të ngrohtë
- Dub — Paneli i kontrollit të letrës orizi mat të Link
- Seline Analytics — Një tabelë analitike e qetë në letër të ngrohtë
- Ventriloc — Një vëzhgim editorial i të dhënave në letër të ngrohtë - një prush i vetëm portokalli që nxjerr në pah saktësinë monokrome
- Duolingo — Maskota e klasës së gjallë në letër të bardhë
- Stripe — Një libër llogarish i shkruar me bojë indigo mbi xham të akullt
- Notion — Një fletore e ngrohtë letre në diellin e mesditës
- Hyer Aviation — Muzg në kabinën e pilotit mbi pergamenë. Qielli i zbehtë i agimit takohet me logon serif me madhësinë e trupit të avionit, dhe një theks i vetëm i ngrohtë prej balte thyen përmbajtjen monokrome.