2016 կայքի ձևավորման միտումները, որոնք պետք է դիտարկել նախքան ձեր կայքը ստեղծելը

dk new media կայքը 1

Մենք տեսել ենք, որ շատ ընկերություններ շարժվում են դեպի կայքի օգտագործողների ավելի մաքուր, պարզ փորձը: Անկախ նրանից ՝ դուք դիզայներ եք, մշակող կամ պարզապես սիրում եք կայքեր, դուք կարող եք ինչ-որ բան սովորել ՝ նայելով, թե ինչպես են դա անում: Պատրաստվեք ոգեշնչվելու:

  1. Շարժապատկերներ

Մնալով համացանցի վաղ, ահռելի օրերը, որոնք լի էին ցնցող գիֆերով, անիմացիոն բարերով, կոճակներով, սրբապատկերներով և պարող համստերներով, անիմացիան այսօր նշանակում է ստեղծել ինտերակտիվ, պատասխանատու գործողություններ, որոնք ուժեղացնում են հեքիաթների պատմությունը և տալիս են հարուստ օգտագործողի փորձ:

Հարուստ անիմացիայի օրինակներից են բեռնման անիմացիաները, նավիգացիան և ընտրացանկերը, սավառնել անիմացիաները, պատկերասրահներն ու սլայդ շոուները, շարժման անիմացիան, ոլորումը և ֆոնային անիմացիաներն ու տեսանյութերը: Տեսեք այս կայքը Beagle- ից ՝ առաջարկի կառավարման հարթակից.

Beagle անիմացիոն կայք

Կտտացրեք այն, որպեսզի տեսնեք Beagle- ի զարմանահրաշ JavaScript և CSS անիմացիաները, երբ նրանց էջը շարժվեք ներքև:

Հարուստ անիմացիան կարելի է տեսնել նաև միկրո փոխազդեցության մեջ: Օրինակ, LinkedIn- ում օգտվողը կարող է սավառնել քարտի վրա ընտրանքների նուրբ ելնող ցանկի համար, այնուհետև ընտրել պատմությունը բաց թողնելը կամ այլ գործողություններ կատարելը:

GIF անիմացիաները (ուրախությա՞մբ) վերակենդանացել են և կարող են օգտագործվել տարբեր նպատակների համար, ներառյալ կատակերգությունը, ցույցերը և նույնիսկ պարզապես զարդարման համար:

  1. Material Դիզայն

Material ԴիզայնGoogle- ի կողմից մշակված դիզայնի լեզուն հենվում է տպագրության վրա հիմնված ձևավորման տարրերի վրա `տիպագրություն, ցանցեր, տարածություն, մասշտաբ, գույն և պատկերների օգտագործում, ինչպես նաև արձագանքող անիմացիաներ և անցումներ, լիցքավորում և խորության էֆեկտներ, ինչպիսիք են լուսավորությունն ու ստվերները տրամադրել ավելի իրատեսական, գրավիչ և ինտերակտիվ օգտագործողի փորձ:

Material Design- ն օգտագործում է ստվեր, շարժում և խորություն `առաջարկելու մաքուր, ժամանակակից գեղագիտություն` կենտրոնանալով UX- ի օպտիմալացման վրա `առանց չափազանց շատ զանգերի և սուլիչների:

Նյութերի ձևավորման այլ օրինակներ են `ծայրից ծայր պատկերներ, լայնածավալ տպագրություն և դիտավորյալ սպիտակ տարածք:

Youtube Android- ի նյութերի դիզայնի վերափոխման հայեցակարգ

  1. հարթ Դիզայն

Չնայած Material Design- ը առաջարկում է մեկ մոտեցում մինիմալիզմի գաղափարին, հարթ դիզայնը մնում է դասական ընտրություն մաքուր գծերի սիրահարների համար: Այսինքն ՝ հարթ դիզայնը հաճախ դիտվում է որպես ավելի իրատեսական, իսկական և հարմարավետ թվային տեսք:

Տիեզերական ասեղ

Հիմնվելով սպիտակ տարածության, սահմանված եզրերի, վառ գույների և 2D կամ «հարթ» նկարազարդումների վրա, տափակ ձևավորումն առաջարկում է բազմակողմանի ոճ, որը հաճախ օգտագործում է գծերի պատկերագրության և երկար ստվերների տեխնիկա:

lander

  1. Պառակտված էկրաններ

Լավագույնն օգտագործվում է այն դեպքում, երբ դուք ունեք խթանելու երկու հավասարապես կարևոր ոլորտներ, կամ ցանկանում եք բովանդակություն առաջարկել լուսանկարների կամ լրատվամիջոցների կողքին, պառակտված էկրանները զվարճալի և համարձակ օգտվողի փորձառություն ապահովելու հիանալի նոր միջոց են:

ճաքած, վնասված էկրան

Թույլ տալով օգտվողներին ընտրել իրենց բովանդակությունն ու փորձը, դուք կարող եք ստեղծել պորտալ տիպի փորձ, որը գայթակղում է այցելուներին մուտք գործել:

պառակտված էկրան-օվկիանոս

  1. Նետում Chrome- ը

Բացի քրոմի բամպերներից և դասական մեքենաների զարդարանքներից, «քրոմը» վերաբերում է կայքի բեռնարկղերին ՝ ընտրացանկերին, վերնագրերին, տողատակերին և եզրագծերին, որոնք ամփոփում են հիմնական բովանդակությունը:

քրոմի ժամանակ

Սա կարող է շեղել ուշադրությունը, և շատ ընկերություններ նախընտրում են ազատվել բեռնարկղերից և ստեղծել մաքուր, եզրից եզր եզրագծեր ՝ առանց սահմանների, վերնագրերի և տողատակերի:

քրոմ-առաջ

 

  1. Մոռացեք ծալքը

«Theալքից վեր» թերթի ժարգոնն է թերթի առաջին էջի վերին կեսի համար: Քանի որ թերթերը հաճախ ծալվում և տեղադրվում են տուփերի և ցուցափեղկերի մեջ, ամենահրապարակիչ բովանդակությունը վեր է անցնում ծալքից ՝ նրանց ընթերցողին (և նրանց դրամապանակին) գրավելու լավագույն հնարավորությունը տալու համար:

Վեբ կայքի ձևավորումը վաղուց օգտագործել է ծալման գաղափարը այն սկզբունքով, որ ոլորումը ծանրաբեռնված էր: Բայց վերջերս լրիվ էկրանով պատկերներն ու բովանդակությունը ողջունում են օգտագործողին և խրախուսում ոլորումը ՝ լրացուցիչ, ավելի խորը բովանդակություն ներկայացնելու համար:

սերմնաբուծություն

  1. Ամբողջ էկրանով տեսանյութ

Տեսանյութը կարող է լինել այցելուների ուշադրությունը գրավելու հիանալի միջոց, և այն հաճախ նույնիսկ ավելի արդյունավետ է, քան տեսողական կամ տեքստային: Looping տեսանյութերը, ինչպիսիք են Apple- ը Apple Watch- ի համար օգտագործված, հնչերանգ հաղորդելու և այցելուներին ներքաշելու յուրօրինակ միջոց է:

DK New Media

Կտտացրեք ՝ տեսնելու համար DK New Mediaտեսանյութը նրանց գլխավոր էջում

Երբ խոսքը վերաբերում է վեբ ձևավորմանը, շատ հատուկ բաղադրիչներ կթելադրվեն ձեր արդյունաբերության, տեղանքի, նպատակային շուկայի և բովանդակության կողմից: Ձեր դասավորությունը կախված կլինի նրանից, թե ինչ կպատասխանեն այցելուները և ինչն է առավել իմաստալից ձեր հաղորդագրության համար: Բայց ձեռքի տակ ունենալով այս միտումները, դուք կունենաք այն ամենը, ինչ ձեզ հարկավոր է ստեղծելու գրավիչ կայք, որն անում է այն, ինչ ձեզ հարկավոր է, և դա ցույց է տալիս, որ դուք գիտեք, թե ինչպես հետևել ժամանակին:

Ինչ եք կարծում?

Այս կայքը օգտագործում է Akismet- ը սպամի նվազեցման համար: Իմացեք, թե ինչպես է ձեր տվյալները մշակվում.