Popupok és modalok: Felhasználó gyilkosok, vagy konverzió bajnokok?

“Az internet hajnalán” – hogy modorossággal kezdjem a cikkem – a marketingesek hatékonyan tudták használni a felugró ablakokat az üzleti céljaik elérésére, ám nagyon hamar átestek a ló túlsó oldalára és az eszköz a web egyik legirritálóbb jelensége lett. Manapság a popup helyett egy új, de a viselkedést tekintve nagyon hasonló megoldás dívik, a modal.

Miközben a cikkhez kutatást végeztem, blog posztokat és podcasteket hallgattam, belefutottam jópár cikkbe, amelyek istenítik a popupokat. Például itt, ami konkrétan elég nagy csalódás volt, mert a User Testing Blog igen megbízható forrásnak számított.

Szóval eléggé kellemetlenül érintett, hogy a szerző voltaképpen azt üzeni a cikkében, hogy a popup a UX javítója lehet. Ezen a ponton úgy gondoltam még, hogy a popup (vagyis valójában a modal) használat legfeljebb szükséges rossz lehet, de semmiképpen sem jó a usernek (és hosszútávon az üzletnek sem).

Felhasználói oldalról tekintve a kérdést kicsit olyan ez például a hírlevél feliratkozó gyűjtő popupoknál, mintha valakivel találkoznál a való életben, és 1 perc ismertség után elkérné az elérhetőségeidet.

Viszont a UX and Growth Podcast-nek (kiváló podcast, nagyon ajánlom) készült egy epizódja a témában még 2015-ben, aminek a gondolatmenete eléggé megtetszett.

Főleg ebben az epizódban elhangzottakból inspirálódtam ezúttal.

Figyelmi válság

Gyakorlatilag napjainkban figyelmi válság uralkodik. A történelem során először fordul elő, hogy több tartalom érhető el az emberek számára, mint amennyit fel tudnának használni. Ennek megfelelőlen a webes tervezőknek meglehetősen küzdeniük kell ezzel a kihívással, vagyis a figyelmi válsággal és az idő hiányával, ami a userek viselkedését nagyban befolyásolja. Néhány webes tervezési megoldás, ami válaszként született a problémára átgondolt, innovatív, kreatív, és nem utolsó sorban a felhasználóknak is jó. Más megoldások nem igazán felelnek meg ezeknek az elvárásoknak mégis elterjedtek.

Popup és modal

A felkészülésem során az egyik megfigyelésem az volt, hogy a cikkekben rendre popupként hivatkoznak a modalra. A kettő hasonlít valóban, de kicsit mégis más, amivel manapság találkozunk az inkább modal. A rettegett előd a popup.

A felugró ablakok körülbelül addig működtek a gyakorlatban, amíg meg nem jelentek a popup blokkoló megoldások, ettől kezdve a popupok teljesen hatástalanná váltak. Sőt igazából ezért tenni sem kellett, mert a blokkolók beépültek a böngészőkbe.

Ekkora léptek színre a modalok, amelyek a popuppal szemben nem új ablakban jelennek meg, hanem a meglévő ablakon belül. Ami fontos tény, hogy még nincs megoldás a modalok blokkolására. A kérdés tehát a userek elfogadták-e, hogy a modalokkal együtt kell éni?

A fenti podcastban a srácok saját kutatásaik alapján (persze ez még nem feltétlenül elegendő bizonyíték, de HubSpotnál dolgoznak, így egészen nagy mintán kísérletezhetnek) nem ez a helyzet. A megfigyelésük szerint a userek amint találkoznak modallal, elindulnak az egérrel az X felé, és gyorsan kinyomják őket. Nem számít mennyire jó volt a tartalom, mindig kiikszelték másodperceken belül. Úgy tűnik a felhasználók tényleg utálják, ha megszakítják a munkamenetüket, legyen az akár modal, akár popup.

A hatékony modal

Tehát a legtöbb esetben a modal szükségtelen, mert általában user killer, de esetleg ha valaki ráfanyarodna, csak megfelelő tervezés után tegye. Vagy úgy is fogalmazhatnánk, hogy ha már modallal idegesíted halálra a felhasználóidat, legalább jól gondold át, és tervezd meg.

Nyilvánvalóan a kontextus nagyban befolyásolja, hogy szóba jöhet-e az eszköz. Például edukatív céllal, mondjuk egy analitikai rendszernél modallal jó ötlet bemutatni a rendszert (ugyanígy a popup sem tűnt el teljesen, például Google bejelentkezéseknél találkozhatunk vele és ebben az esetben talán indokolt is a használat).

A következőkben felsorolom a hatékony modal megtervezésére vonatkozó irányelveket. Ezek, mint minden irányelv természetesen nem lehetnek kőbevésett igazságok, a közönség, a kontextus alapján testre kell szabni, elvetni, vagy tesztelni őket.

Ne használj modalt: Inkább kezdd azzal, hogy gondold végig nincs-e olyan más tervezési lehetőség, amivel segítheted a célok elérését. Például gondold újra a tartalom stratégiát, az információs architektúrát, szóval tedd lehetővé a felhasználó számára, hogy magától fedezze fel a siteot és jusson el az üzleti célig, gyakorlatilag természetes módon.

Tudd meg hányan használják a modalt: Mindenképpen mérd, hogy hányan használják a modalt, hányan lövik le, és milyen arányban okoz lemorzsolódást az adott oldalon. Gyakori hiba, hogy a modal konvertálásakor figyelmen kívül hagyják azt a többnyire meglehetősen nagy arányú látogató mennyiséget, akiknél nem működik (ez általános webanalitikai elemzési hiba szokott lenni, a konvertáló userek sokkal több figyelmet kapnak az elemzésekben, mint a nem konvertáló felhasználók).

Egyértelmű kilépés: Könnyen észrevehető és lekattintható X szükségeltetik. Külön kiemelném borzasztó példaként azokat a sticky megoldásokat, amikor a modal mozog, így téve kihívássá a kilépést. Ezt inkább ne tedd.

Ne hülyézd le a felhasználót: Talán meglepő, de erről is szót kell ejteni. Divatos jelenség a konverzió javítása érdekében a felhasználót gyakorlatilag lehülyézni (általában az ignoráló válasz esetén). Például (ez egyébként egy általam nagyrabecsült konverzió optimalizálási blog, de ez a primitív stílus nem nyerő):

Ezt nagyon ne tedd, még finom formában sem.

Mobil megoldás kidolgozása: Gyakori, hogy a modal nem működik jól mobilon, csúnyán elvágja a tartalmat, nem lehet tőle görgetni, nem lehet kiikszelni stb. Rossz működés elkerülése érdekében használj reszponzív modalt, vagy inkább mobilon ne használj modalt.

Felhasználói viselkedésre szabás: Amikor meghatározod, hogy mikor jelenjen meg a modal, mindig a felhasználói viselkedési adatokra támaszkodj. Például belépéskor ne ezzel bombázd a usert. De ha a kilépésről van szó, akkor sem az elvárt viselkedést kapja a user, hiszen ő kilépne az oldalról, ehelyett az arácba kap valami nem várt üzenetet vagy kérést. Csúnya példával a való életből: Teljesen mindegy, hogy a parkba be- vagy kilépéskor lépsz kutyagumiba.

Releváns tartalom: Kizárólag olyan tartalmat jeleníts meg, ami releváns a felhasználó számára az adott pillanatban. Ha például már feliratkozott a hírlevére, ne könyörögj neki újból.

Jó kódolás: A modaltól csak egy rosszabb dolog van, a rosszul kódolt modal. Győződj meg róla, hogy a modal az összes olyan platformon zökkenőmentesen működik, amit a célcsoportod használ.

Összességében mire eljutottam a gondolatmenet végére még mindig úgy látom, hogy a modal, vagy popup egy “lusta” módja a konverziók hajtásának, ami a felhasználók irritálása miatt hosszabb távon többet árt, mint használ. Ha mégis modal mellett döntesz,  jó ha  a fenti ajánlások figyelembevételével teszed.

Ugyanakkor az a kérdés is felmerül, hogy mi lesz a modal sorsa a jövőben? A popup halálát, illetve mostanában az adblockerek által végzett banner blokkolási hullámot látván nagy rá az esély, hogy a megoldás csak addig fog csak működni, amíg nem áll a felhasználók rendelkezésére olyan technológia, amivel meg tudják akadályozni a modalok megjelenítését.

Boros Norbert

Innovation Designer | Experience Research Leader in Finance

Üzleti problémák megoldásában segítek designeri gondolkodásmóddal.