Apple
Bijela soba s jednim plavim prekidačem
Appleov dizajn je model suzdržanosti: gotovo bijelo platno, obilje bijelog prostora i jedan, živopisni plavi akcenat 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 JESTE dizajn: dominiraju velike fotografije proizvoda i slike životnog stila, dok se hromirani elementi povlače u tanke okvire, prozirnu navigaciju i suptilne linije. Dijelovi se izmjenjuju na svijetlosivoj pozadini s blokovima u punom koloru za promotivne materijale, stvarajući ritam promjenama u mjerilu, a ne dekorativnim elementima.
Izgled stranice je stranica pune širine bez fiksne maksimalne širine kontejnera - dijelovi se protežu od ruba do ruba, s blokovima teksta centriranim unutar na približno 980px. Navigacija je jedna, fiksna globalna traka s dodatnom podmapom za svaki proizvod koja se pojavljuje prilikom pomicanja. Glavni raspored je uvijek centriran: veliki naziv proizvoda, jednolinijski slogan, dva dugmeta za tablete, a zatim slika proizvoda koja ispunjava preostali dio prikaza. Dijelovi su vertikalno složeni s velikodušnim vertikalnim ritmom (64px+ između dijelova), naizmjenično s #f5f5f7 i obojenim pozadinama. Donja stranica je jedan horizontalni red kartica usluga pune širine (Apple TV+, Fitness+, Music, Arcade), svaka s foto blokom s preklapajućim tekstom i dugmetom za tablete. Nema bočnih traka, nema rasporeda sadržaja u više stupaca, 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 banerima pune širine, često s usko izrezanim objektima. Gradijenti boja (pastelno plava, ružičasta, zelena) služe kao pozadina za dijelove proizvoda, a ne kao dekoracija. Ikonografija je minimalistička i zasnovana na linijama, debljine 1-2px, u istoj sivoj skali kao i tekst. Nema ilustracija, nema apstraktne grafike, nema 3D prikaza, osim samih fotografija proizvoda.
Paleta
Brend
- Apple Blue
#0071e3— Ispunjeni akcijski dugmići, odabrana stanja - jedina interaktivna hromatska boja koja se štedljivo koristi kako bi svaki izgled bio smislen. - Link Blue
#0066cc— Istaknuti okviri za akcije, ugrađeni linkovi - zasićenija boja od Apple Blue se koristi tamo gdje bi ispunjen tablet bio previše blještav. - Signal Blue
#2997ff— Dekorativni okviri, obrisi slika, ivice ikona - najsvjetlija plava boja u sistemu, koristi se za atmosferu, a ne za interakciju s korisnikom.
Neutralno
- Carbon
#1d1d1f— Glavni tekst, okviri zaglavlja, 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 u Appleovoj prepoznatljivoj svijetlosivoj boji, malo hladnijoj od čisto bijele. - Ice
#f4f8fb— Izražajne površinske ispune, suptilne nijanse, tekst dugmadi na tamnoj pozadini - suptilna plava nijansa koja oživljava dio, a da ga ne ističe. - Smoke
#333333— Sekundarni tekst, ispuna navigacije, okviri dugmadi - Svestrana neutralna boja za okvire i ikone kojima je potrebna veća intenzivna boja od srednje sive. - Graphite
#474747— Navigacijski tekst, navigacijski okviri, okviri linkova - zauzimaju međupoziciju između ugljika i dima u hijerarhiji elemenata. - Ash
#707070— Tekst podnožja, okviri liste, okviri 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 rezervisano 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, dugmad, podnaslovi — radni font; 400 za tekst u tijelu, 300 za podnaslove i kvalificirane oznake, 600 za navigacijske elemente i tekst dugmadi; 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 dugmeta | 980px |
| Radijus kartice | 8px |
| Sjene | ne - okviri umjesto sjena |
| Između sekcija | 64px |
| Širina stranice | 1440px |
Vještačka inteligencija će izgraditi vašu web stranicu u Apple stilu i popuniti je
- Popunite proizvodima i objavama putem linka - Instagram, TikTok, Facebook.
- Prenesite sadržaj sa vaše stare stranice - samo navedite adresu.
- Moderan dizajn na najboljem engine-u: React ( Next.js) sa serverskim renderovanjem i SEO optimizacijom odmah po instalaciji.
- Potpuno automatizirana SEO optimizacija za rezultate pretrage 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 takmiče za pažnju.
- Mollie — Kašmirski pult, tamna knjiga poslova. Ostavite dovoljno bijelog prostora za urednički dizajn oko crnog teksta, a zatim naglasite detalje vezane za 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 istaknite bogate plave kontrole i slojevite slike Mac proizvoda.
- Modern Treasury — Glavna knjiga blagajne na milimetarskom papiru. Napravite stranice koje podsjećaju na tihi, bijeli operativni list, 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 zasnovane na fotografijama koje izgledaju kao odštampani arhitektonski portfolio.
- Bajgart Office — Zid uredničke galerije. Koristite veliki bijeli prostor gdje suptilni serifni fontovi i fragmenti portfolija nose veću vizualnu težinu od hromiranih elemenata interfejsa.
- Heptabase — Suncem obasjan sto. Tople površine poput papira, kontrole boje ugljena i plutajući prozori za istraživanje stvaraju osjećaj organiziranog radnog prostora, a ne softverske kontrolne ploče.
- Bejamas — Pidžama - kiselo-limeta kroz crno staklo. Stvorite mirne, svijetlosive uredničke stranice isprekidane očaravajućim crnim panelima gdje se zamagljene zelene pruge svjetlosti presijecaju s površinom.
- Baba — Bilješke s njegom na crvenoj sunčevoj svjetlosti. Napravite široke crvene narativne pruge oko intimnih bijelih, ružičastih i krem informacijskih površina, koristeći fotografije ljudi kao emocionalni centar.
- Grafana Labs — Kontrolna soba signalne stanice Sunrise. Tihi sivo-bijeli radni prostor kombinira se sa širokim, četverobojnim gradijentom horizonta i preciznim plavim signalima interfejsa.
- 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.