Apple
Бела соба со еден син прекинувач
Дизајнот на Apple е модел на воздржаност: речиси бело платно, изобилство од бел простор и еден, живописен син акцент што прави секоја акција да изгледа намерна. Примарниот фокус е типографијата - SF Pro, со негативен растојание од буквите што се намалува со зголемување на големината, давајќи им на насловните страници архитектонска јасност без да биде премногу тежок. Производот Е дизајнот: доминираат големи фотографии од производи и слики од животен стил, додека хромираните елементи се повлекуваат во тенки рамки, проѕирна навигација и суптилни линии. Деловите се менуваат на светло сива позадина со блокови во боја за промотивни материјали, создавајќи ритам преку промени во размерот, а не преку декоративни елементи.
Распоредот на страницата е страница со полна ширина без фиксна максимална ширина на контејнерот - деловите се протегаат од раб до раб, со текстуални блокови центрирани внатре на приближно 980px. Навигацијата е една, фиксна глобална лента со дополнителна подпапка за секој производ што се појавува при скролување. Главниот распоред е секогаш центриран: големо име на производ, слоган од еден ред, две копчиња за таблети, потоа слика од производ што го исполнува преостанатиот прозорец за преглед. Деловите се наредени вертикално со дарежлив вертикален ритам (64px+ помеѓу деловите), наизменично #f5f5f7 и обоени позадини. Долната страница е еден хоризонтален ред картички за услуги со полна ширина (Apple TV+, Fitness+, Music, Arcade), секоја блок со фотографии со преклопен текст и копче за таблети. Нема странични ленти, нема распореди на содржина во повеќе колони, нема асиметрични композиции - сè е центрирано, наредено и симетрично.
Фотографијата е доминантен визуелен јазик. Фотографиите од производите се направени на чиста бела или мека сива позадина, без никаков контекст - уредот Е ѕвездата, изолиран и осветлен. Фотографиите од животниот стил се прикажани во банери со полна ширина, често со цврсто исечени објекти. Градиентите на бои (пастелно сина, розова, зелена) служат како позадина за деловите од производот, а не како декорација. Иконографијата е минималистичка и базирана на линии, дебела 1-2 пиксели, во иста сива скала како и текстот. Без илустрации, без апстрактна графика, без 3D рендери, освен самите фотографии од производот.
Палета
Бренд
- Apple Blue
#0071e3— Пополнети копчиња за акција, избрани состојби - единствената интерактивна хроматска боја што се користи ретко за да се направи секој изглед значаен. - Link Blue
#0066cc— Означени граници на дејството, вградени линкови - се користи позаситена боја од Apple Blue каде што исполнет таблет би бил премногу впечатлив. - Signal Blue
#2997ff— Декоративни рамки, контури на слики, граници на икони - најсветлата сина боја во системот, што се користи за атмосфера, а не за интеракција со корисникот.
Неутрално
- Carbon
#1d1d1f— Главниот текст, рамките на насловите, линиите за навигација, рамките на картичките - доминантната боја на мастилото е речиси црна со мала нота на топлина. - Frost
#f5f5f7— Платното на страницата, позадината на главниот текст и површината на подножјето се во препознатливата светло сива боја на Apple, малку поладна од чистата бела боја. - Ice
#f4f8fb— Експресивни површински пополнувања, суптилни нијанси, текст на копчиња на темна позадина - суптилна сина нијанса што го оживува делот без да го истакнува. - Smoke
#333333— Секундарен текст, пополнување навигација, рамки на копчиња - Разновидна неутрална боја за рамки и икони на кои им е потребно повеќе истакнување од средно сивата боја. - Graphite
#474747— Текст за навигација, граници за навигација, граници за врски - зафаќа средна позиција помеѓу Јаглерод и Чад во хиерархијата на елементите. - Ash
#707070— Текст во подножјето, граници на листата, граници за навигација, пригушен текст на телото - Средно сива боја за содржина што треба да биде присутна, но не и истакната.
Типографија
од 12 до 56px · 8 чекори
- SF Pro Display — замена: Inter · контури 400, 600, 700 · Наслови и голем текст - големини од 40px+ користат формат на приказ за потесен отвор на блендата и посилно негативно следење; 700 е резервирано за распореди на реклами, а 400 е за имиња на производи во уредувачката содржина.
- SF Pro Text — замена: Inter · контури 300, 400, 600 · Текст на телото, навигација, копчиња, поднаслови — работен фонт; 400 за текст на телото, 300 за поднаслови и квалификувани етикети, 600 за елементи за навигација и текст на копчиња; растојанието помеѓу негативните букви се намалува пропорционално на големината (од -0,022em на 12px до -0,01em на 44px).
Интервали и форма
| Намена | Значење |
|---|---|
| Густина | просек |
| Основен чекор | 12px |
| Радиус на копчето | 980px |
| Радиус на картичката | 8px |
| Сенки | без граници наместо сенки |
| Помеѓу деловите | 64px |
| Ширина на страницата | 1440px |
Вештачката интелигенција ќе ја изгради вашата веб-страница во стилот Apple и ќе ја пополни
- Пополнете со производи и објави преку линкот - Instagram, TikTok, Facebook.
- Пренесете содржина од вашата стара страница - само наведете ја адресата.
- Модерен дизајн на најдобриот мотор: React ( Next.js) со рендерирање на серверот и SEO оптимизација веднаш.
- Целосно автоматизирана SEO оптимизација за резултати од пребарување и препораки за невронски мрежи.
Слични стилови
- Studio — Галериски ѕид во движење. Секое платно претставува тивка, сива изложбена површина каде што типографските материјали и креативните дела што се преклопуваат се натпреваруваат за внимание.
- Mollie — Шалтер од кашмир, темна книга. Оставете доволно бел простор за уреднички дизајн околу црниот текст, а потоа зајакнете ги точките поврзани со производот со топли кремасти каши, еспресо кафеави каши и тактилни фотографии од вистинските начини на плаќање.
- Basis Theory — Терминали за плаќање во дизајнерското студио. Бела техничка хартија, преклопувачки проѕирни слоеви на трансакции и еден тиркизен контролен елемент ја дефинираат визуелната насока.
- CleanShot X — Студио со сино осветлена работна површина. Создадете мирен бел простор околу компактниот црн текст, а потоа дозволете богатите сини контроли и слоевитите слики од производите на Mac да бидат во центарот на вниманието.
- Modern Treasury — Книга за благајна на милиметарска хартија. Креирајте страници што личат на тивок, бел оперативен лист, каде што паричните текови се прикажани со фини линии, обележани јазли и прецизни, скриени контроли.
- Basha-Franklin — Галериска мрежа под бел надвратник. Користете топла нијанса #f4ede6, суптилна црна структура и асиметрични колони базирани на фотографии што изгледаат како печатено архитектонско портфолио.
- Bajgart Office — Ѕид на уредничката галерија. Користете голем бел простор каде што суптилните сериф фонтови и фрагментите од портфолио носат поголема визуелна тежина од хромираните елементи на интерфејсот.
- Heptabase — Сончево биро. Топли површини слични на хартија, контроли во боја на јаглен и лебдечки прозорци за истражување создаваат чувство на организиран работен простор, а не на контролен панел за софтвер.
- Bejamas — Пижами - кисела лимета низ црно стакло. Создадете мирни, светло сиви уреднички страници прекинати со привлечни црни панели каде што заматените зелени ленти светлина ја сечат површината.
- Baba — Белешки за грижа на црвена сончева светлина. Создадете широки црвени наративни ленти околу интимни бели, розови и кремасти информативни површини, користејќи фотографии од луѓе како емоционален центар.
- Grafana Labs — Контролната соба на сигналната станица „Изгрејсонце“. Тивок сиво-бел работен простор се комбинира со широк градиент на хоризонтот во четири бои и прецизни сини интерфејсни сигнали.
- Kagi — Одделна читална. Создадете отворен бел простор околу задебелен графитен текст, користејќи суптилни виолетови акценти и топли пастелни површини за да го разбиете спокојството.