Հետադարձ կապի ձևեր կայքի բջջային տարբերակում

Օգտատերերի 70% - ը կայքեր է մուտք գործում սմարթֆոններից, ուստի անհարմար, ծանրաբեռնված կամ ոչ ադապտացված հետադարձ կապի ձևը խախտում է երթևեկի ներգրավման բոլոր ջանքերը:

Մենք կվերլուծենք, թե ինչպես նախագծել բջջային ձևերը ՝ կենտրոնանալով օգտագործողի վարքի, դիզայնի առանձնահատկությունների և UX-ի համապատասխան պրակտիկայի վրա: Եվ միևնույն ժամանակ, մենք ձեզ կասենք, թե ինչպես է մեր qform պլատֆորմը հաղթահարում այդ խնդիրները:

Օգտագործողի վարքի առանձնահատկությունները շարժական սարքերում

Սմարթֆոնի վրա կայքի հետ շփվելիս մարդու պահվածքը մեծապես որոշվում է համատեքստով.նա կարող է լինել տրանսպորտում, հանդիպման ժամանակ, խանութում կամ պարզապես թերթել ժապավենը քնելուց առաջ: Պայմանները հեռու են իդեալական լինելուց ՝ քիչ ժամանակ, շեղումներ, փոքր էկրան և սահմանափակ ուշադրության ռեսուրս: Սա նշանակում է, որ ինտերֆեյսի յուրաքանչյուր տարր պետք է լինի հնարավորինս հասկանալի և ֆունկցիոնալ մի հայացքով:

Բջջային միջավայրում հատկապես կարևոր են ներբեռնման արագությունը, տրամաբանական կառուցվածքը և ձևի պարզությունը: Եթե \ u200b \ u200bինչ-որ բան լրացուցիչ ջանքեր է պահանջում, Օրինակ, դուք պետք է ոլորեք ձևը կողքից, երկար ժամանակ Մուտքագրեք տեքստը կամ փոխեք ստեղնաշարը, մեծ հավանականությամբ օգտագործողը պարզապես չի ավարտի մուտքագրումը: Այդ իսկ պատճառով բջջային ձևերը պետք է լինեն չափազանց ինտուիտիվ.մեկ հարց ՝ մեկ գործողություն, առանց ավելորդ նավիգացիայի ։

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

Սմարթֆոնների ձևերի ձևավորման ընդհանուր սկզբունքներ

Որքան քիչ են դաշտերը և բարդ տարրերը, այնքան մեծ է հավանականությունը, որ ձևը կլրացվի մինչև վերջ: Ցանկալի է, որ ձևը տեղավորվի մեկ էկրանին կամ տրամաբանորեն բաժանվի քայլերի: Ինտերֆեյսը պետք է հարմարեցվի մատի կառավարմանը ՝ մեծ կոճակներ, բավարար լիցք, հասկանալի ստորագրություններ։

Ձևը ստեղծելիս բոլոր տարրերը հարմարվում են բջջային չափերին, և կառուցվածքը կարող է կազմաձևվել drag-and-drop ինտերֆեյսի միջոցով հաշված րոպեների ընթացքում: qform-ը նաև թույլ է տալիս ստեղծել նոր ձև, որը թույլ է տալիս ստեղծել նոր ձև:

Հարմարվողական դասավորություն և UX մեխանիզմներ

Կայքի ձևը պետք է լինի լռելյայն պատասխանատու: Սա նշանակում է ոչ միայն ճիշտ ցուցադրում տարբեր սարքերի վրա, այլև տրամաբանության պահպանում.դաշտերը չեն փոխում կարգը, կոճակները չեն հեռանում, ոչինչ չի կտրվում:

Կարևոր է նաև հաշվի առնել Էկրանի ռոտացիան, ժեստերի հետ աշխատելը, հորիզոնական ոլորումը (ավելի լավ է խուսափել) և փոխազդեցության ուղղահայաց ուղղությունը: QForm-ում ձևերի դասավորությունը ավտոմատ կերպով հարմարվում է սարքին ՝ լինի դա սմարթֆոն, պլանշետ կամ նոութբուք:

Սմարթֆոնի ստեղնաշարի ինտեգրում

Ձևը պետք է" հաղորդակցվի " օգտագործողի ստեղնաշարի հետ: Input type \ u003d"tel" հեռախոսի համար, "email" էլ.փոստի համար և այլն: կարևոր են նաև առաջին դաշտի ավտոֆոկուսը, "առաջ" ստեղներով նավիգացիան, տվյալների ավտոմատ փոխարինումը ինքնալրացումից:

QForm-ն ի սկզբանե ապահովում է նման "սահուն փոխազդեցություն". անհրաժեշտ ստեղնաշարն ավտոմատ կերպով փոխարինվում է, ինքնալրացումն ապահովվում է, մուտքային դիմակները կիրառվում են առանց օգտագործողի կողմից ավելորդ գործողությունների:

Ինքնալրացում և հայրենի հուշումներ

Ժամանակակից բջջային բրաուզերները գիտեն, թե ինչպես փոխարինել տվյալները հիշողությունից, գլխավորն այն է, որ ձևը դա թույլ է տալիս: Ինքնալրացումը մի քանի անգամ կրճատում է լրացման ժամանակը, հատկապես, եթե խոսքը կրկնվող այցելությունների կամ կանոնավոր հաճախորդների մասին է:

Կարևոր է նաև օգտագործել placeholder-ի հուշումները, ավտոմատ անցումը հաջորդ դաշտին, ներկառուցված դիմակները և ձևաչափումը: QForm - ում Այս մանրամասները կարող են անհատականացվել յուրաքանչյուր ձևի համար ' անհատական հարցումից մինչև կորպորատիվ պատվեր:

Իրական ժամանակի հուշումներ և վավերացում

Լավ UX-ն այն է, երբ սխալն ընդգծվում է կոկիկ, խնդրի դաշտը կարևորվում է, և հաղորդագրությունը հասկանալի է և չի վախեցնում: Իդեալում, եթե ստուգումը տեղի է ունենում ընթացքում, նախքան սեղմելով Ուղարկել կոճակը.

QForm-ում վավերացումը իրականացվում է որպես ներկառուցված գործառույթ: Կարող եք սահմանել պարտադիր դաշտերը, ձևաչափի ստուգումը, captcha-ն, ինչպես նաև ծանուցումների տեքստը սխալների դեպքում: Ամեն ինչ աշխատում է ճիշտ եւ շարժական սարքերի համար.

Լավ հարմարվողական ձևերի օրինակներ

1. Quiz ծառայությունների ընտրության համար: Հարցերը բացվում են հերթով, ձևը հեշտությամբ լրացվում է մեկ ձեռքով: Վերջին հարցից հետո ' CTA բոնուսով: Այս ձևաչափը հեշտությամբ իրականացվում է QForm-ում:
2. Հետադարձ կապի ձևը կլինիկայի կայքում: Անուն, հեռախոս, զանգի հարմար ժամանակ: Օրինակ, որը հիմնված է qform-ի կաղապարի վրա, լուսանկար վերբեռնելու կամ ախտանիշներ ընտրելու հնարավորությամբ:
3. Մինի պատվեր առցանց խանութում: Ապրանքը արդեն ընտրված է.անհրաժեշտ է մուտքագրել միայն հեռախոսը և առաքման եղանակը: Հեռախոսի համարի դիմակը և առաջին դաշտի ավտոֆոկուսը արագացնում են գործընթացը:

Բջջային ձևերի մշակման հաճախակի սխալներ

• Դաշտերի չափազանց մեծ քանակ

Յուրաքանչյուր լրացուցիչ դաշտ նվազեցնում է ձևը ներկայացնելու հավանականությունը: Սա հատկապես կարևոր է սմարթֆոնի վրա:

Ինչ անել: թողեք միայն պահանջվող դաշտերը, Օգտագործեք առաջադեմ բացահայտում և խմբավորում (օրինակ ՝ երեքի փոխարեն մեկ "լրիվ անուն" դաշտ):

• Սխալ դասավորություն

Ձևը դուրս է գալիս էկրանից, կոճակները համընկնում են, լուսանցքները դժվար է կարդալ:

Ինչ անել: փորձարկեք ձեւերը 320 px-ից էկրանների վրա, Օգտագործեք պատասխանատու միավորներ եւ նվազագույնը 16px տեքստի համար:

• Ինքնալրացման և դիմակների բացակայություն

Օգտագործողը ստիպված է ձեռքով մուտքագրել տվյալները, ինչը սխալներ է առաջացնում:

Ինչ անել: Օգտագործեք դիմակներ հեռախոսների և ամսաթվերի համար, միացրեք զննարկչի ինքնալրացման աջակցությունը:

• Չափազանց փոքր սեղմելի տարրեր

Մատով դժվար է մտնել չեկի տուփ կամ հղում:

Ինչ անել: սեղմելի գոտու նվազագույն չափը 48×48 պիքսել է, տարրերի միջև հեռավորությունը առնվազն 8 պիքսել է:

• Ընդհանուր, ոչ տեղեկատվական սխալներ

"Սխալ մուտքագրումը" չի բացատրում, թե որն է խնդիրը:

Ինչ անել օգտագործեք հատուկ հուշումներ, ինչպիսիք են ՝ " էլ. փոստը պետք է պարունակի@", և մուտքագրման պահին ցույց տվեք սխալները:

Ինչպես խուսափել այս սխալներից ՝ առանց ավելորդ գլխացավի:

1. Ստուգեք ձևերը իրական շարժական սարքերի վրա, ոչ միայն աշխատասեղանի խմբագիրների վրա:
2. Օգտագործեք պատրաստի լուծումներ, ինչպիսիք են QForm-ը:

• բոլոր ձևանմուշները հարմարեցված են սմարթֆոններին,
• դիմակները և ինքնալրացումը աշխատում են տուփից դուրս,
• սեղմելի գոտիները համապատասխանում են UX ուղեցույցների առաջարկություններին

     3. Կիրառեք ջերմային քարտեզներ (Heatmaps) ՝ հասկանալու համար, թե որտեղ են օգտվողները "սայթաքում" կամ նետում մուտքը:

Եզրակացություն

Հետադարձ կապի ձևը ավելին է, քան տեխնիկական տարրը: Սա փոխգործակցության գործիք է, որը կամ հեշտացնում է օգտագործողի հետ շփումը, կամ դառնում է խոչընդոտ:

Բջջային ձևեր ստեղծելիս պետք է մտածել ոչ թե այն մասին, թե ինչ եք ուզում սովորել, այլ այն մասին, թե օգտագործողը պատրաստ է ձեզ տեղեկացնել: Կրճատեք ճանապարհը, ձևը պարզ դարձրեք, ցույց տվեք, որ դուք հոգ եք տանում նրա ժամանակի մասին:

Նրանք ավտոմատացնում են առօրյան, պահպանում են տվյալները, հարմարվում են օգտագործողի վարքագծին և խնայում են թիմի ռեսուրսները: Բացի այդ, qform — ի նման խելացի պլատֆորմները կարող են ավտոմատացնել աշխատանքը: Բայց նույնիսկ ամենահարմար գործիքի դեպքում ամեն ինչ սկսվում է ուշադիր ձևավորումից և օգտագործողի նկատմամբ հարգանքից: