Webergonómiai írások magyar és nemzetközi weblapokról Rung Andrástól, aki az első ilyen témájú kutatást vezette a Budapesti Műszaki Egyetemen. Az egyetlen ilyen témájú magyar könyvét Kiss Orhideával a Gondolat Kiadó jelentette meg Felhasználóbarát honlapok címmel.
Rung András, webergonómiai tanácsadó
rungandras@gmail.com
06-30-3975008
Rung András a twitteren
Hosszas szünet után újraindul a blog az ergomania.eu cím alatt. Ezentúl itt jelennek meg az új bejegyzések, de linket itt is elhelyezek még egy ideig.
Az új blog rss feedjei:
A megújult blogban az első új bejegyzés az Egységesség a tervezésben címmel olvasható.
Ezúton megosztom a Használhatóság napján tartott előadásomat pdf és keynote formátumban.
Valamint a szövege itt is olvasható egyben:
Könnyebb javítani, mint alkotni?
A javítás veszélyei és nehézségei
Javítás egy ideális világban
A jó design hatása a társadalomra
A felhasználói élmény alappillérei
Adaptáció elviselhetetlen könnyűsége
Magyar kulturális sajtosságok
Magyar szituációs sajátosságok
A használhatóság világnapján a budapesti Bazaar Klubban (VII. kerület, Dohány u. 22-24.) fogok 2011. nov. 9.-én szerdán 19 órakor Áttervezés magyaroknak címmel előadást tartani, amely az alábbi gondolatmenetre lesz felfűzve:
Logikusan hangzik, hogy minden áttervezés jobbító szándékkal történik. Mi másért hajtanánk végre bármilyen változtatást, semmint hogy jobb legyen a weblap, az alkalmazás, mint előtte. De mennyire könnyű ez? Mennyiben más, mint a teljesen az alapoktól való tervezés? Ha jobbítunk, akkor milyen területekre kell figyelni? Létezik-e jó felhasználói élmény jó használhatóság nélkül? Vannak-e nekünk magyaroknak speciális igényeink, szokásaink a webbel kapcsolatban, amit figyelembe illik, sőt kell venni? Az előadás ezeket a kérdéseket feszegeti, ha kimerítő és végképp megnyugtató válaszokat nem is tud adni minden esetben.
Idén harmadszor is megrendezésre kerül Magyarországon is a használhatóság napja, hogy bekapcsolódjunk a nemzetközi áramlatokba is. Eseményünk ezúttal a kiemelt rendezvények közt szerepel. A használhatóság világnapját először a Használhatósági Szakértők Szövetsége (Usability Professionals’ Association) hirdette meg 2005-ben. Az esemény arra hívja fel a figyelmet, hogy a használhatóság mennyire fontos összetevője sikereinek, elégedettségünknek és ezért fontos időt, pénzt és energiát szánni kutatására és alkalmazására. A használhatóság napját minden november második hetében tartják számos országban.
De miért is fontos ez a nap? Céljainkat eszközökkel érjük el. Ha tárgyaink, eszközeink könnyen használhatóak, akkor mintegy észrevétlenül segítenek minket ahhoz, hogy életünkben több sikert érjünk el és örömtelibbek legyenek mindennapjaink. Az egyszerűség és a letisztult, átgondolt megvalósítás a hatékonyság magabiztosságát adja nekünk. A használhatóság célja, hogy az ajtó könnyedén és egyértelműen nyíljon, az autóban minden kézre álljon, a weblapon zökkenőmentesen intézhessük ügyeink. A használhatóság azonban nem magától értetődő, ezért kell rajta nap mint nap dolgoznunk, eszközeinket egyre tökéletesebbé, emberbarátabbá tennünk.
Az este időpontja: 2011 november 9., délután 6 óra.
Az este helyszíne: Bazaar Klub (Budapest, VII. ker. Dohány u. 22-24.)
Az esemény facebook oldala, ahol a legfontosabb információk követhetők.
Az este programja:
Rövid, 10-10 perces előadásokat tervezünk, utána lehetőség lesz a kötetlen tapasztalatcserére.
Előadások és előadók:
Almásy Csilla - Irodai ergonómia tanácsadás - "Hardver" amortizáció és megelőzése
Limbacher Tivadar - Élő szemkamera-bemutató
Rung András - Áttervezés magyaroknak
Kovács Zsuzsanna - Kultúra és használhatóság - hogyan befolyásolja a kulturális háttér a használhatóságot és a dizájnt
Pataki Máté - Mindenki fogyatékos
Paul Toderas - Felhasználók szerepe a játékfejlesztésben
Bittera Gábor - Felhasználóközpontú lokalizáció
Eric Reiss - Closing keynote
Katona Zsuzsa - Analytics - a használhatóbb oldalakért
Limbacher Tivadar - Szemkamerás kutatás
Polgár Péter Balázs - TeaMese: Használhatósági elvek és módszerek alkalmazása készségfejlesztő szoftverekre
Polgár Péter Balázs, Pásztor Dávid és Kovács Zsuzsanna : Kerekasztal - UX kutatás
Herend Csilla - Mik azok a kognitív sémák és mire megy velük a usability kutató?
Szakmai bemutatók
az előadások előtt és után
Élő szemkamera-bemutató - Limbacher Tivadar (Atreo Research)
Kognitív sémák és webergonómia (poszter) - Herendy Csilla (Budapesti Corvinus Egyetem)
Téma
Az idei Használhatósági világnap rendezvényeinek fő témája, hogy miképp lehet áttervezni interakciós felületeket, interakciókat jobbító szándékkal, illetve hogy a kultúra fogalma és maguk a kultúrák milyen hatással vannak a használhatóságra.
Fő támogató: FatDUX
Szakmai partner: MeetOFF
Támogatók
Wildom Kft, Gal6, HVG Könyvek, Typotex, L'Harmattan
Szervezők
Pónya Judit (UX specialista, FatDUX)
Rung András (Használhatósági szakértő, független)
Polgár Péter Balázs (UX munkatárs, Prezi)
Herendy Csilla (Budapesti Corvinus Egyetem)
Fehér Katalin (New Media Researcher, BGF)
Ezzel a címmel jelent meg egy interjú a szigszalagmarketing.hu-n velem annak kapcsán, hogy a HVG online marketing szemináriumon is szerepelni fogok április 7-én nem meglepő módon ergonómiai előadással. Olvassátok a riportot, jöjjetek a szemináriumra! Jó lesz a program itt látható:
12:30 – 12:45 Bemutatkozás, bevezetés
Sikeres marketing 3 lépésben
Szurop István
http://www.taktikon.hu/
12:45 – 13:05 Fókusz: Miért szűkítsük le a piacunkat? Kik azok az ideális ügyfelek? Mit kérdezzünk, és milyen eszközöket használjunk piackutatáshoz?
13:05 – 13:25 Különbség: Miért és hogyan különböztessük meg magunkat a versenytársainktól? Mire jó márka és hogyan alakítsuk tudatosan?
13:25 – 13:45 Folyamat: Mi az a Marketing Homokóra? Hogyan lesznek visszatérő ügyfeleink? Eladás helyett információ-adás.
Online marketing a köbön
13:45 – 14:40 Webdizájn, webergonómia: Milyen a jó honlap? Kivel és hogyan készíttessünk honlapot?
Rung András
http://ergomania.blog.hu/
14:40 – 15:00 Kávészünet
15:00 – 15:45 Közösségi média: Mi az és hogyan használjuk marketing célokra a közösségi médiát (Facebook, Twitter és a többiek)?
Berényi Konrád
http://onlinemarketing.blog.hu/
15:45 – 16:30 Keresőmarketing: Mi az a keresőoptimalizálás? Hogyan szerezzünk linkeket?
Bánóczy Zoltán
http://seo.blog.hu/2009/11/01/banoczy_zoltan
16:30 – 17:00 Email marketing: Melyek a legismertebb hírlevélküldő / email marketing szoftverek és mire képesek? Milyen módszereket használhatunk listaépítésre? Email marketing etikett.
Forgács Mariann
http://www.marketingmorzsak.com/
A kevésbé aktív elmúlt hetekért szeretném kárpótolni olvasóimat azzal, hogy most ingyen letölthetnek egy dokumentumot, ami azzal kapcsolatban tartalmaz irányelveket, hogy hogyan lehet barátságos, hatékony webshopokat tető alá hozni.
Webshop ergonómiai elvek (pdf, 1,2 Mb)
Jó olvasást mindenkinek, a visszajelzéseknek örülök kommentek formájában. A szöveg szabadon használható, de ilyenkor is illik rám hivatkozni.
Két hete tartottam egy előadást a Metoff-on (Online Fejlesztők és felhasználók: Ergonómia és használhatóság, user experience - egy szebb katarzis) Gördülékeny fizetés címmel, ami itt letölthető. A szöveg álljon itt annak, aki csak át akarja futni:
FŐBB PONTJAIM
.png)
MEGÉRI AZ ERGONÓMIA?
HATÉKONYSÁGJAVULÁS
.png)
Kék = 2003 Piros = 2008
KONVERZIÓNÖVELÉS EGYSZERŰEN
MIRŐL SZÓL A FIZETÉS?
MIRŐL NEM SZÓL?
.png)
A FIZETÉS EGY FORM
REGISZTRÁCIÓ MEGAKASZT
EGYÉRTELMŰSÉG
ELRENDEZÉS
ÁLLAPOTJELZÉS
GOMBOK A GYORS BEFEJEZÉSHEZ
Mint korábban utaltam rá a formokat senki sem szereti, mert a rajtuk keresztül lefolytatott kommunikáció nehézkes, nem természetes. Törekedjünk ezért, hogy kérdéseink egyértelműek legyenek, és ne kelljen a felhasználónak a fejét azon törnie, hogy mire is kérdeztünk rá tulajdonképen, így pl. ha egy nemzetközi banki átutalást kell végrehajtani, akkor a SWIFT kód címke helyett sokkal hatásosabb, ha az írjuk az Ön bankjának SWIFT kódja. Ebből a felhasználó rögtön tudni fogja, hogy ezt a bank oldalán kell keresnie, és nem feltétlenül a saját személyes papírjai közt kell turkálnia, ami egy sima SWIFT kód címke alapján egyáltalán nem lenne egyértelmű.
Talán nem szükséges ennyire kifejtenünk mindent, de a kép jól mutatja, hogy mire gondolok.
Adjunk nevet formunknak, ami egyértelműen kommunikálja, hogy mire is való tulajdonképpen. Fontos, hogy ez a név összhangban álljon azzal a linkkel, ahonnan ide küldtük az embereket. Ha pl. valaki a vásárlás gombra kattintott, akkor nem örül egy regisztráció fejlécű formnak (mégha valahol lelke mélyén tudja is, hogy ez előbb utóbb leselkedni fog rá). Nevezzük ezt Vásárláshoz szükséges adatok megadása vagy valami hasonlónak, de a legjobban azzal járunk, ha mindenféle regisztrációt kihagyunk a vásárlási folyamatainkból, hisz a szükséges adatokat a kellemetlen regisztráltatási folyamat nélkül is megszerezhetjük. Ha speciális adatok bekérésére van szükség (személyi szám, szerződés szám stb.), akkor arra időben figyelmeztessük emberünket a form kitöltésének elején.
Strukturáljuk az oldalainkat tematikus tömbökbe, csoportokba olyan módon, hogy a vizuális komplexitást ne növeljük meg túlzottan. Az azonos tematika alá tartozó részeket célszerű összefoglalóan elnevezni, és ezeket kiemelni valamilyen módon (nagybetű használata mondat elején). Ha kérdéseink egy nagyobb téma körül rendeződnek, vagy több kisebb körül, akkor érdemes őket egy oldalon bemutatni őket. Ha azonban számos kérdésünk van és ezek csak több csoportba oszthatók, akkor a felhasználók több oldalra bontva könnyebben fogadják be őket. Mint az alábbi képen is jól látható, fontos, hogy legyen egy határozott vonal, ami mentén a címkék összeolvashatóak, és aminek a végén egy gomb mutatja az elvárt akciót. Így a felhasználó gyorsan képet tud alkotni arról, hogy mi vár rá. Az egyes mezők közt a mező magasságának 50-75%-át hagyjuk ki, így viszonylag jól elkülönülnek egymástól.
tematikus blokkok a formban
A formok esetében, főleg, ha vásárlásról vagy más kritikus folymatról van szó, akkor tüntessünk el mindent, ami elvonja a figyelmet. Így is elég nehéz kitölteni, ne toljunk mást még az előtérbe.
Vásárlási formoknál vagy más több oldalas formokban való eligazodásban kifejezetten hasznosak a progress indikátorok. Ezek segítségével láthatjuk azt, hogy mi van már végrehajtva, és mi vár ránk. Vigyázzunk azonban, hogy amit egy lépésként kommunikálunk, az valóban egy lépés legyen! Meglehetősen idegesítő, hogyha a személyes információk megadása egy oldalként van jelezve, de a valóságban több oldalon hajtjuk végre. Ha nincs meg az egy feladat egy oldal összhang, akkor a haladási jelzőben áltlaánosabb neveket adjunk meg, mint az amazon esetében.
facebook progress indikátor
Kiegészítő jellegű információinkat, ha lehet külön oldalon kérdezzük meg. Ennek van egy egyszerű lélektani oka. Ha már a felhasználók kitöltötték az ellenszenves formot, ami az igazi feladatuk utában állt, akkor szívesebben válaszolnak még egy két kérdésre, megtesznek nekünk ezt azt. Pl. maguktól feliratkoznak a hírlevelünkre, és nem kell ravaszkodnunk, hogy automatikusan felrakjuk őket, mert úgyse iratkoznak majd le. Azonban az is lehet, hogy pont ezekre a kiegészítő információkra nem szívesen válaszolnak (még), és emiatt semmilyen adatot sem kapnánk meg tőlük (mégha jelezzük is, hogy ezek csak opcionálisak). Ez különösen érzékenyen érinthet minket, ha emiatt egy vásárlás vagy egy ajánlatkérő űrlap nem jut el hozzánk. Ha egy szolgáltatás akarunk eladni, akkor sokkal jobban örülünk annak, ha 100 embertől csak egy email vagy egy telefonszám fut be és azt jelzi, hogy érdeklődik a termékünk iránt, mintha 20 alaposan kitöltött űrlapot kapunk a legelszántabb leendő ügyfeleinktől.
A formok akármilyen undok dolgok sokan vannak, így nem tekinthetünk el tőlük. Mindenütt az utunkba állnak, és miközben úgy tesznek, hogy segíteni akarnak bennünket feladataink végrehajtásában, inkább gátolnak. Luke Wroblewski tanúsága szerint átlagosan 10-40% javulás érhető el a fizetési formok áttervezésével, Jared Pool tanúsága szerint pedig egy nagyobb kereskedelmi oldal évente 300 millió dollár többletbevételhez jutott azzal, hogy a regisztrációs folyamatát eltávolította a vásárlók útjából, úgy, hogy a formokat csak némileg alakították át. Egyes elemzéseimben már beszéltem arról, hogy miképp lehet őket barátságosabbá tenni, de álljon itt most néhány alapelv összefoglalva (reményeim szerint a későbbiekben majd részletesebben visszatérek ezekre):
Csökkentsük a fájdalmat:
Ez az egész ergonómiának alapelve, de itt különösen fontos, hisz formot kitölteni rossz dolog. Mindannyiunk sok órát töltött már el okmányirodákban, töltött ki érthetetlen sablonokat. A weben se sokkal jobb a helyzet. Törekedjünk arra, hogy formunk a lehető legegyszerűbb legyen. Tartsuk észben, hogy ez senkinek sem okoz örömöt. Az adatokat begyűjteni muszáj, de ne kínozzuk feleslegesen az embereket.
Fény az alagút végén:
Kommunikáljuk tisztán és egyszerűen, hogy hogyan tud számunkra is kedvező módon megszabadulni a formunktól a felhasználó. A kommunikációban azonban csak a lényegre fókuszáljunk. Ne mondjunk el olyan dolgokat, amiket biztos tudnak, mert akkor a lényeges információinkra se fognak nagyon odafigyelni.
Vegyük figyelembe a környezetet:
Mit tudhatnak? Mit láthattak eddig? A formok gyakran alkalmaznak olyan rövidítéseket, kifejezéseket, amelyeket a kitöltők sose hallottak. Ezekkel kapcsolatban kellene neki válaszolni. Alkalmazzunk súgót, magyarázatot, vagy egyszerűen csak beszéljünk úgy, hogy megértsék az emberek. Ne kérjünk olyan dolgokat se a felhasználóktól, amikről úgy gondolhatják, hogy közünk nincs hozzá. Ha mégis fontosak ezek az adatok, akkor indokoljuk is akár meg.
Egységes kommunikáció:
Formjainkban úgy beszéljünk mintha egy cég lennénk. Egységes szóhasználat, kifejezéskészlet legyen a jellemző.
Domináns gombok:
A formok eredményét elküldő gombok gyakran kicsik és szürkék. Ezt a szerkesztési hibát azért emelem ki az inkább konceptuális alapelvek után, mert annyira gyakori a hazai oldalakon, hogy nem lehet szó nélkül hagyni. Nagy színes gombokra van szükségünk, amelyekre cselekvésre serkentő nyelven vannak ráírva a szövegek. Melyik gombtól várjuk vajon azt, hogy az emberek könnyebben felismerik, hogy mi a dolguk? Melyikhez hasonlóakat látunk gyakrabban? Ugye mind a kettőre könnyű a válasz...
A weblapok tesztelése igen fontos lépése a hatékony és felhasználóbarát honlapok kialakításának. Tökéletes eszköz arra, hogy hibákat azonosítsunk, amelyekre még a szakértők sem gondolnak, illetve, hogy a fejlesztés korai szakaszában kezeljünk olyan problémákat, amelyek megoldása már kész termékeknél a teszteléssel való kiszűrésnek a sokszorosába kerülhetne. Ennek az az oka, hogy könnyebb módosítani egy prototípust, átrajzolni drótvázakat, mint újraprogramozni a weblap bizonyos részeit. Nem is beszélve azokról az esetekről, amikor arra a következtetésre jutunk, hogy az egész weblapot el kellene dobni és csinálni egy újat. Hiába költöttünk rá akár milliókat is.
A weblap hatékony működésének felhasználókkal való tesztelésére több hasznos eszköz is van. A kártyaelrendezés (card sorting) vagy a papír-protípus tesztelés a legismertebbek közé tartozik, de most csak a legfontosabb módszerrel foglalkozok most, amikor egy olyan változatot tesztelünk, amely működőképes, és használható úgy mint egy weblap vagy magát a kész weblapot vizsgáljuk.
Alapos tesztelés nélkül még egy átgondoltan fejlesztett weblapunk is tele lesz olyan hibákkal, rosszul működő elgondolásokkal, melyek miatt használata nehézkes lesz a felhasználóknak. Tesztelés nélkül jövőbeni felhasználóinknak, vásárlóinknak akár jelentős részét is elveszthetjük, akik inkább olyan oldalakhoz fordulnak, amelyeknek könnyű a használata. Ha weblapunkat könnyen használhatónak tartjuk, még egyáltalán nem biztos, hogy felhasználóink is ezt gondolják.
A weblap tesztelés célja, hogy felmérjük egy weblap mennyire hasznos, mennyire könnyű és gyorsan tanulható a használata (ergonomikus), illetve a felhasználók milyen attitűdökkel rendelkeznek vele kapcsolatban. A weblap tesztelés során potenciális felhasználók végeznek tipikus feladatokat. A tesztelés alatt megfigyeljük, hogy a résztvevők milyen nehézségekkel szembesülnek a weboldalon, milyen hibákat vétenek, mi okoz nekik kellemetlenséget, és hogyan vélekednek egyes megoldásokról. A tesztelés eredményei alapján javaslatokat tesz az ergonómus arra, hogy miképp lehet a weboldalt úgy átalakítani, hogy céljainkat valóban szolgálja.
A weblap használhatósági tesztelése nem fókuszcsoportos vizsgálat. Nem azonos azzal, mintha beterelnénk egy csoportot, vagy egyenként kérdeznénk meg embereket arról, hogy mi is az oldalról a véleményük. Az emberek sokféle dolgot gondolnak, de ez nem biztos, hogy akár köszönő viszonyban is van azzal, amit egy valódi interakció során megtapasztalnának. A használhatósági tesztelés szintén különbözik attól az esettől, amikor profi tesztelőkkel végignézetjük az oldalt. Ők programozási hibákra, zavarokra vadásznak. Egészen más szemmel nézik az oldalt, mint egy népi felhasználó. Sokkal több mindenen át tudják verekedni magukat, amik egy átlagos felhasználónak akár komoly gondot is jelenthetnének. Az, hogy valami furmányos módon éppen működésre bírható nem azonos azzal, hogy jó a használhatósága.
Nézzük akkor, hogy a tesztelésnek pontosan milyen lépései vannak:
A teszteknek nem célszerű egy óránál hosszabbnak lenniük, mert meglehetősen igénybe veszi az emberek koncentrálóképességét. Ez alatt az egy óra alatt 3-4 feladatot lehet elvégezni. Egy webshopnál lehetnek ezek termékek keresése, összehasonlítása, kosárba tétel, vásárlási és regisztráció folyamat végigvitele, szállítási információk megtalálása stb. Minimum 4 emberre van szükségünk, de 8-10-nél nem kell több, mert ennyi emberrel már kijönnek a legfontosabb hibák. (Természetesen ha van rá keretünk érdemes még több embert is tesztelni.)
Felfedezett használhatósági hibák száma (függlőleges tengely) a teszt részvevők számának (vízszintes tengely) függvényében
A teszt során a felhasználó egy átlagos böngészővel dolgozik (olyannal, amit ismer), míg a tesztvezető jegyzetel, hogy milyen hibákat vét, mi okoz neki gondot. Célszerű mérni a feladatokra szánt időt, és azt is, hogy egyáltalán mennyire sikerült azokat megoldani. Lehet rögzíteni a képernyőn lévő folyamatokat, illetve a felhasználó kifejezéseit, kommentjeit is (pl. Camstudio, Snapz Pro stb.). Ez azonban az esetek többségében felesleges, elegendőek a jegyeztek. A teszt elején biztatnunk kell a felhasználót, hogy folyamatosan kommentálja, hogy mit csinál, hangosítsa ki érzéseit, gondolatait. A teszt során készített jegyzetek elemzése következik ezután. Összesítjük a hibákat, súlyozzuk őket. A lényegesnek ítélt hibák kezelésére pedig konkrét javaslatokat tehetünk. Fontos tudnunk, hogy ha egy hiba akár csak egy felhasználónál jött ki, akkor is fontos lehet, hisz kis mintával dolgoztunk. Ez a hiba ugyanúgy akár felhasználóink 10-20%-át is érintheti.
