Apple
Bijela soba s jednim plavim prekidačem
Appleov dizajn je model suzdržanosti: gotovo bijelo platno, obilje bijelog prostora i jedan, živopisni plavi naglasak koji svaku radnju čini promišljenom. Primarni fokus je tipografija - SF Pro, s negativnim razmakom između slova koji se smanjuje s povećanjem veličine, dajući naslovima arhitektonsku jasnoću bez prevelike težine. Proizvod JEST dizajn: dominiraju velike fotografije proizvoda i slike životnog stila, dok se kromirani elementi povlače u tanke okvire, prozirnu navigaciju i suptilne linije. Dijelovi se izmjenjuju na svijetlosivoj pozadini s blokovima u punoj boji za promotivne materijale, stvarajući ritam promjenama u mjerilu, a ne dekorativnim elementima.
Izgled stranice je stranica pune širine bez fiksne maksimalne širine spremnika - dijelovi se protežu od ruba do ruba, s blokovima teksta centriranim unutar na približno 980 piksela. Navigacija je jedna, fiksna globalna traka s dodatnom podmapom za svaki proizvod koja se pojavljuje prilikom pomicanja. Glavni izgled je uvijek centriran: veliki naziv proizvoda, jednolinijski slogan, dva gumba za tablete, a zatim slika proizvoda koja ispunjava preostali dio prikaza. Dijelovi su složeni okomito s velikodušnim okomitim ritmom (64 piksela+ između dijelova), izmjenjujući se s #f5f5f7 i obojenim pozadinama. Donja stranica je jedan vodoravni red kartica usluga pune širine (Apple TV+, Fitness+, Glazba, Arkada), svaka s foto blokom s preklapajućim tekstom i gumbom za tablete. Nema bočnih traka, nema višestupnih rasporeda sadržaja, nema asimetričnih kompozicija - sve je centrirano, složeno i simetrično.
Fotografija je dominantan vizualni jezik. Fotografije proizvoda snimaju se na čisto bijeloj ili meko sivoj pozadini, bez ikakvog konteksta - uređaj JESTE zvijezda, izolirana i osvijetljena. Fotografije životnog stila prikazuju se u bannerima pune širine, često s usko izrezanim objektima. Gradijenti boja (pastelno plava, ružičasta, zelena) služe kao pozadina za odjeljke proizvoda, a ne kao dekoracija. Ikonografija je minimalistička i temelji se na linijama, debljine 1-2 piksela, u istoj sivoj skali kao i tekst. Nema ilustracija, nema apstraktne grafike, nema 3D prikaza, osim samih fotografija proizvoda.
Paleta
Robna marka
- Apple Blue
#0071e3— Ispunjeni akcijski gumbi, odabrana stanja - jedina interaktivna kromatska boja koja se štedljivo koristi kako bi svaki izgled bio smislen. - Link Blue
#0066cc— Istaknuti okviri radnji, ugrađene poveznice - zasićenija boja od Apple Blue koristi se tamo gdje bi ispunjeni tablet bio previše blještav. - Signal Blue
#2997ff— Dekorativni okviri, obrisi slika, rubovi ikona - najsvjetlija plava boja u sustavu, koristi se za atmosferu, a ne za interakciju s korisnikom.
Neutralno
- Carbon
#1d1d1f— Glavni tekst, okviri naslova, navigacijske linije, okviri kartica - prevladavajuća boja tinte je gotovo crna s blagim naznakama topline. - Frost
#f5f5f7— Platno stranice, pozadina glavnog teksta i površina podnožja su Appleove prepoznatljive svijetlosive boje, malo hladnije od čisto bijele. - Ice
#f4f8fb— Izražajne površinske ispune, suptilne nijanse, tekst gumba na tamnoj pozadini - suptilna plava nijansa koja oživljava odjeljak bez da ga ističe. - Smoke
#333333— Sekundarni tekst, ispuna navigacije, obrub gumba - Svestrana neutralna boja za obrub i ikone kojima je potrebna veća prodornost od srednje sive. - Graphite
#474747— Navigacijski tekst, navigacijski okviri, okviri poveznica - zauzima međupoložaj između ugljika i dima u hijerarhiji elemenata. - Ash
#707070— Tekst podnožja, obrubi popisa, obrubi navigacije, prigušeni tekst tijela - Srednje siva za sadržaj koji treba biti prisutan, ali ne i istaknut.
Tipografija
od 12 do 56px · 8 koraka
- SF Pro Display — zamjena: Inter · obrisi 400, 600, 700 · Naslovi i veliki tekst – veličine od 40px+ koriste format prikaza za uži otvor blende i jače negativno praćenje; 700 je rezervirano za izgled oglasa, a 400 za nazive proizvoda u uredničkom sadržaju.
- SF Pro Text — zamjena: Inter · obrisi 300, 400, 600 · Tekst u tijelu, navigacija, gumbi, podnaslovi — radni font; 400 za tekst u tijelu, 300 za podnaslove i kvalificirane oznake, 600 za navigacijske elemente i tekst gumba; negativni razmak između slova smanjuje se proporcionalno veličini (od -0,022em do 12px do -0,01em do 44px).
Intervali i forma
| Svrha | Značenje |
|---|---|
| Gustoća | prosjek |
| Osnovni korak | 12px |
| Radijus gumba | 980px |
| Radijus kartice | 8px |
| Sjene | ne - obrubi umjesto sjena |
| Između odjeljaka | 64px |
| Širina stranice | 1440px |
Umjetna inteligencija će izraditi vašu web stranicu u Apple stilu i ispuniti je
- Popunite proizvodima i objavama putem poveznice - Instagram, TikTok, Facebook.
- Prenesite sadržaj sa svoje stare web-lokacije - samo navedite adresu.
- Moderan dizajn na najboljem engineu: React ( Next.js) s renderiranjem na serveru i SEO optimizacijom odmah po instalaciji.
- Potpuno automatizirana SEO optimizacija za rezultate pretraživanja i preporuke neuronskih mreža.
Slični stilovi
- Studio — Galerijski zid u pokretu. Svaki ekran predstavlja tihu, sivu izložbenu površinu gdje se tipografski materijali i preklapajući kreativni radovi natječu za pažnju.
- Mollie — Kašmirski pult, tamna glavna knjiga. Ostavite dovoljno bijelog prostora za urednički dizajn oko crnog teksta, a zatim naglasite točke vezane uz proizvod toplim kremama, espresso smeđim nijansama i taktilnim fotografijama stvarnih načina plaćanja.
- Basis Theory — Platni terminali u dizajnerskom studiju. Bijeli tehnički papir, preklapajući prozirni slojevi transakcija i jedan tirkizni kontrolni element definiraju vizualni smjer.
- CleanShot X — Studio s plavo osvijetljenom radnom površinom. Stvorite miran bijeli prostor oko kompaktnog crnog teksta, a zatim neka bogate plave kontrole i slojevite slike Mac proizvoda zauzmu središnje mjesto.
- Modern Treasury — Glavna knjiga blagajne na milimetarskom papiru. Izradite stranice koje nalikuju tihom, bijelom operativnom listu, gdje su novčani tokovi prikazani tankim linijama, označenim čvorovima i preciznim, skrivenim kontrolama.
- Basha-Franklin — Galerijska mreža ispod bijelog dovratnika. Koristite toplu nijansu #f4ede6, suptilnu crnu strukturu i asimetrične stupove temeljene na fotografijama koje izgledaju kao otisnuti arhitektonski portfolio.
- Bajgart Office — Zid uredničke galerije. Koristite veliki bijeli prostor gdje suptilni serifni fontovi i fragmenti portfelja nose veću vizualnu težinu od kromiranih elemenata sučelja.
- Heptabase — Suncem obasjan stol. Tople površine poput papira, kontrole boje ugljena i plutajući prozori za istraživanje stvaraju osjećaj organiziranog radnog prostora, a ne softverske upravljačke ploče.
- Bejamas — Pidžama - kiselo-limeta kroz crno staklo. Stvorite mirne, svijetlosive uredničke stranice isprekidane očaravajućim crnim pločama gdje se zamagljene zelene pruge svjetlosti presijecaju preko površine.
- Baba — Bilješke s njegom na crvenom suncu. Stvorite široke crvene narativne pruge oko intimnih bijelih, ružičastih i krem informacijskih površina, koristeći fotografije ljudi kao emocionalno središte.
- Grafana Labs — Kontrolna soba signalne stanice Sunrise. Tihi sivo-bijeli radni prostor kombinira se sa širokim, četverobojnim gradijentom horizonta i preciznim plavim signalima sučelja.
- Kagi — Odvojena čitaonica. Stvorite otvoreni bijeli prostor oko podebljanog grafitnog teksta, koristeći suptilne ljubičaste akcente i tople pastelne površine kako biste razbili spokoj.