Přeskočit na obsah

Blog

Jak vytvořit plynulý uživatelský zážitek: Osvědčené postupy pro vícestránkové formuláře

Vícestránkové formuláře jsou jedním z nejzáludnějších prvků ve webdesignu. Žádají uživatele o investici času a pozornosti napříč několika kroky a každé další kliknutí je příležitostí, aby to někdo vzdal a odešel. V Kosmoweb jsme navrhli a přestavěli desítky vícekrokových formulářů pro klienty napříč odvětvími a zjistili jsme, že rozdíl mezi formulářem, který lidé dokončí, a takovým, který opustí, často závisí na několika promyšlených designových rozhodnutích.

Jeden projekt, který formoval naše uvažování, byl registrační proces pro pražskou konferenční platformu. Původní formulář nacpal 22 polí na jednu stránku. Míra dokončení se pohybovala kolem 29 %. Přestrukturovali jsme ho do čtyř zaměřených kroků, aplikovali níže uvedené principy a sledovali, jak dokončení stoupla na 53 % během šesti týdnů.

Držte to jednoduše

Každé pole, které do formuláře přidáte, je malá daň na trpělivost uživatele. Než začnete cokoli navrhovat, sedněte si s týmem a položte si u každého pole náročnou otázku: opravdu tuto informaci právě teď potřebujeme? Jednoduchost také znamená jasnost. Popisky by měly přesně popisovat, co potřebujete. Zástupný text by neměl nahrazovat popisky.

Používejte indikátory průběhu

Když uživatelé nevidí konec procesu, nastává úzkost. Indikátory průběhu to řeší zodpovězením dvou klíčových otázek: jak daleko jsem se dostal a kolik toho zbývá? Testovali jsme tři styly indikátorů průběhu pro formulář poptávky na nemovitosti. Vizuální krokový pruh s pojmenovanými fázemi překonal prostý textový indikátor o 15 % v míře dokončení.

Seskupujte související informace

Způsob, jakým organizujete pole v rámci každého kroku, ovlivňuje, jak kognitivně náročný formulář působí. Seskupení souvisejících informací dohromady snižuje mentální úsilí potřebné k přepínání kontextu mezi tématy.

Rozdělte to správně

Rozdělení dlouhého formuláře na více stránek je základní strategie, ale jak ho rozdělíte, záleží. Ideální krok obsahuje tři až šest polí, která sdílejí logické téma. Vyhněte se krokům, které obsahují pouze jedno nebo dvě pole, i krokům s více než sedmi nebo osmi poli.

Testujte důkladně

Žádné množství designové intuice nemůže nahradit sledování reálných uživatelů při interakci s Vaším formulářem. Testování použitelnosti odhaluje problémy, které se zpětně zdají samozřejmé, ale jsou z pohledu designéra neviditelné. Testujte i na mobilních zařízeních.

Optimalizujte pro rychlost

Výkon je součástí uživatelského zážitku. Pokud kliknutí na „Další“ spustí načítací spinner trvající déle než sekundu, uživatelé se začnou obávat, zda se jejich data neztratila. Každý přechod mezi kroky by měl působit okamžitě. Pro klienta provozujícího systém registrace na události jsme implementovali ukládání do local storage, takže pokud uživatel omylem zavřel záložku, mohl pokračovat tam, kde skončil. Tato funkce zachránila odhadem 8 % jinak ztracených registrací.

Poskytujte zpětnou vazbu

Uživatelé by nikdy neměli být ponecháni v nejistotě, zda něco udělali správně. Inline validace je nyní základním očekáváním. Navrhli jsme formulář pro dary, kde závěrečný krok ukázal personalizovaný souhrn: „Děkujeme, Martine. Chystáte se darovat 500 Kč měsíčně na podporu městské zeleně.“ Tento lidský dotek zvýšil potvrzené dary o 22 %.

Vícestránkové formuláře nikdy nebudou oblíbenou částí používání webu. Ale s pečlivou pozorností věnovanou struktuře, tempu, výkonu a komunikaci se mohou stát něčím, co uživatelé dokončí bez frustrace. V Kosmoweb je to standard, který si klademe: formuláře, které působí méně jako úřední papírování a více jako rozhovor.

Need Help With Your Project?

Let's talk about how we can bring your vision to life.

Získejte bezplatnou nabídku