Shopify
Կեսգիշերային ջերմոց - Առևտրային նշանները ծաղկում են մուգ փիրուզագույն ֆոնի վրա, լուսավորված անանուխի մեկ կայծով
Shopify-ի դիզայնի համակարգը կեսգիշերային արհեստանոց է առևտրի համար. գրեթե սև կտավ՝ ներկված խորը փիրուզագույն կանաչով, լայն, վստահ sans-serif տառատեսակ և մեկ վառ անանուխի շեշտադրում, որը ակտիվացնում է ինտերակտիվ պահերը: Ինտերֆեյսը նման է մութ սենյակի, որտեղ ապրանքներն ու ապրանքանիշերը լույսի աղբյուր են. լուսանկարներն ու խանութների ցուցափեղկերը փայլում են գրեթե սև մակերեսների ֆոնին, մինչդեռ քրոմապատ տարրերը նահանջում են: Բաղադրիչները երկրաչափական են, բայց մեղմ. 12px շառավղով քարտեր՝ բարակ եզրերով, հաբի ձև ունեցող կոճակներ և 330 կշռող տառատեսակ, որը շշնջում է մասշտաբը, այլ ոչ թե գոռում: Հղումների, պիտակների և ֆոկուսային վիճակների վրա խնայողաբար օգտագործվում է մեկ քրոմատիկ կետադրական նշան (#36f4a4), գույնը պահելով ֆունկցիոնալ պահերի համար՝ ապահովելու համար, որ վաճառականների պատմությունները մնան տեսողական կիզակետը:
Առավելագույն լայնությունը մոտ 1280px է, կենտրոնացված, լրիվ լայնությամբ ցուցադրական բլոկներով, որոնք տարածվում են լուսանկարների տարայից այն կողմ: Էջի ռիթմը հերթագայում է՝ (1) լրիվ լայնությամբ մուգ ցուցադրական էջ՝ վերադրված վերնագրով և գործողության կոչ անող կոճակներով, (2) հարմարավետ մուգ հատվածներ՝ առավելագույն լայնությամբ տեքստային և պատկերային բլոկներով 2 սյուներով կամ պատկերային ցանցերով՝ 3 սյուներով, (3) ինտերակտիվ ցուցադրական վահանակներ (արտադրանքի քարտ, առաքման հաշվիչ, աշխարհի քարտեզ), որոնք ցուցադրվում են որպես բարձրացված քարտեր ավելի խորը կտավի վրա: Նավիգացիան ֆիքսված վերին գոտի է՝ լոգոյով + 3 նավիգացիոն տարրերով + երկրորդական հղումներով + գործողության կոչ անող հիմնական կոճակով, որոնք բոլորը դասավորված են աջ կողմում: Ուղղահայաց ռիթմը օգտագործում է 80px բացեր հատվածների միջև՝ հարթ անցումով. մուգ հատվածների միջև բաժանարարներ չկան, միայն մակերեսի երանգի փոփոխություն:
Տեսողական դիզայնը հիմնականում կենտրոնացած է մանրածախ վաճառողի վրա. լիարժեք չափի ապրանքների լուսանկարները և ապրանքանիշի միջոցառումների լուսանկարները կրում են տեսողական կշռի հիմնական մասը, հաճախ սպիտակ տեքստով ծածկված մեծ ֆոնի տեսքով: Պատկերները խիստ կտրված են, բարձր կոնտրաստով և տոնական բնույթի (Nasdaq-ի զանգը, խմբային ողջույնները, ձեռքում գտնվող ապրանքների խոշորացված պատկերները): Մուգ ֆոնը ստեղծում է տպավորություն, որ այս լուսանկարները լուսավորված են լուսարձակներով: Նկարազարդումները մինիմալիստական են. հիմնական բացատրական աշխատանքը կատարվում է ներդրված ապրանքների պատկերներով և խանութների ցուցափեղկերի էկրանի պատկերներով: Պատկերակները մոնոխրոմ են, 1.5–2px գծի լայնությամբ, սովորաբար սպիտակ կամ #36f4a4՝ ակտիվ վիճակների համար:
Պալիտրա
Բրենդ
- Shopify Mint
#36f4a4— Ակտիվ նավիգացիայի ցուցիչները, ֆոկուսի օղակները, պիտակների ընդգծումները և հղումների վրա մկնիկի կուրսորը պահելու ընդգծումները միակ քրոմատիկ փայլն են, որը մուգ ֆոնի վրա ստեղծում է ակտիվացված ինտերակտիվության զգացողություն։
Չեզոք
- Midnight Forest
#02090a— Էջի կտավ, վերնագրի ֆոնային պատկերներ, բաժնի ֆոնային պատկերներ - Deep Lichen
#061a1c— Հիմնական քարտի մակերեսներ, բարձրացված վահանակներ, բովանդակության բլոկներ։ - Shaded Fern
#072720— Նավիգացիոն վահանակ, լրացուցիչ քարտեր, վահանակի հազիվ նկատելի բարձրացում։ - Spruce Border
#1e2c31— Քարտերի, բաժանարար գծերի, մուտքագրման դաշտերի ուրվագծերի բարակ եզրագծեր։ - Abyss Indigo
#000a1e— Լրացուցիչ մակերես՝ արտադրանք/ցուցադրություններ տեղադրելու համար, վահանակներ՝ գործառույթների նկարագրություններով։ - Pure White
#ffffff— Հիմնական տեքստ, կոճակի լրացում, վերնագիր, լոգոներ։
Տպագրություն
12-ից մինչև 70px · 8 քայլ
- Neue Haas Grotesk — փոխարինում: Inter · ուրվագծեր 330, 400, 500, 550, 600 · Հիմնական տպագրական համակարգը բաղկացած է 70–96px (330–400) տառատեսակի կշռով վերնագրերից, որոնք ավելի նուրբ են, քան բարձր, հիմնական տեքստից՝ 16–18px (400–500) տառատեսակի կշռով, և նավիգացիայից ու օգտագործողի ինտերֆեյսից՝ 14–16px (500–550) տառատեսակի կշռով։ Մեծ էկրանների չափերի դեպքում 330 գերթեթև տառատեսակի կշռը առանձնահատուկ առանձնահատկություն է. այն վստահություն է հաղորդում զսպվածության, այլ ոչ թե ծավալի միջոցով։
- Inter Variable — փոխարինում: Inter · ուրվագծեր 400, 420, 450, 550 · Երկրորդական տառատեսակ, որն օգտագործվում է նավիգացիոն ինտերֆեյսի տարրերում, փոքր նշումներում, ներդիրների կառավարման վահանակներում և ստորին էջերի միկրոտեքստում: Դրա փոքր-ինչ ավելի մեծ փոքրատառերը և տառերի միջև ավելի ստանդարտ հեռավորությունը այն ավելի ընթեռնելի են դարձնում կոմպակտ չափսերով: Այն նաև հարմար է այն դեպքերի համար, երբ 420 կշռող տառատեսակը լրացնում է սովորական և միջին չափի տառատեսակների միջև եղած բացը:
Ժամանակահատվածներ և ձև
| Նպատակ | Նշանակություն |
|---|---|
| Խտություն | միջին |
| Հիմնական քայլ | 12px |
| Կոճակի շառավիղ | 9999px |
| Քարտի շառավիղ | 12px |
| Ստվերներ | ստվերների փոխարեն՝ առանց սահմանների |
| Բաժինների միջև | 80px |
| Էջի լայնությունը | 1280px |
Արհեստական բանականությունը կկառուցի ձեր կայքը Shopify ոճով և կլրացնի այն
- Լրացրեք ապրանքներով և գրառումներով՝ հղումով - Instagram, TikTok, Facebook:
- Տեղափոխեք բովանդակությունը ձեր հին կայքից՝ պարզապես նշեք հասցեն։
- Ժամանակակից դիզայն լավագույն շարժիչի վրա՝ React ( Next.js)՝ սերվերի ռենդերինգով և SEO օպտիմիզացիայով՝ անմիջապես։
- Լիովին ավտոմատացված SEO օպտիմալացում որոնման արդյունքների և նեյրոնային ցանցերի առաջարկությունների համար։
Նմանատիպ ոճեր
- Retool — Ջերմ օբսիդիանի արհեստանոց՝ ճշգրիտ գործիքների համար նախատեսված մակերես, լուսավորված մոխիրներով, որտեղ ամեն ինչ ստեղծվում է
- Elektron — Կեսգիշերին սարքավորումների կառավարման վահանակը գրեթե սև կտավ է, որտեղ փայլում են արտադրանքի լուսանկարները, մինչդեռ ինտերֆեյսը մնում է գործնականում անտեսանելի։
- REKKI — Թռիչքի կառավարման վահանակ լուսանկարչական լաբորատորիայում
- OFFFICE : — նուար պատկերասրահ, որը ծածկված էր մոնոլիտ տառատեսակով
- Clyde — Ցուցասրահը, իր միակ լուսարձակով, գրեթե մութ պատկերասրահ է, որտեղ սենյակում միակ գույնը տաք գրադիենտային գունդն է։
- Channel Studio — Ստուդիական լուսանկարչական լաբորատորիա մեկ մարջանագույն լամպի վարագույրով
- Electronic Materials Office — Փայլող ածուխ ածուխով զարդարված պատկերասրահում
- ORYZO AI — Լուսանկարչական էսսե մութ սենյակի մասին։ Միայնակ առարկա, որը սավառնում է տաք մթության մեջ, որի միակ զարդարանքը կրեմագույն տառատեսակն է։
- Factory — «Պատերազմի սենյակի» տերմինալը կեսգիշերին։ «Գործարանը» կոշտ սև կառավարման վահանակ է, որտեղ մեկ սպիտակ քարտ է հայտնվում՝ ինչպես լապտերի լուսավորությամբ դիսպետչեր. սենյակում միակ առարկան աշխատանքն է։
- Hungry Tiger — Թանդուրի պատին քրքումի պես պայծառ գրաֆիտի։ Ոսկեգույնի և ժանգոտ շագանակագույնի միասնական պալիտրա, այնքան մեծ տառատեսակով, որ ավելի շատ համեմունքների շուկայի ցուցանակի է նման, քան կայքի։
- Bibliothèque — Սև խորանարդաձև պատկերասրահ լուսարձակի տակ՝ միայնակ լուսավորված ափսե հսկայական, մութ դահլիճում
- Apple (España) — սև թատրոն լուսավորված սարքավորումներով