Ötlettár a szűrés hatékonyabbá tételéhez - II. rész

Ez a Szűrésről szóló cikksorozat második, befejező része. Az első rész itt olvasható.

Egy webáruház egyik legkritikusabb feladata, hogy a vevők a lehető leghatékonyabban megtalálhassák a számukra megfelelő termékeket. Ebben a legtöbb segítséget nyújtani képes megoldás a szűrés művelete. Röviden: a terméklistázásoknál (pl. egy kategória oldalon) biztosítsuk a látogatók számára, hogy több logika mentén is leszűkíthessék a terméklistát a nekik megfelelő termékekre. Habár ez logikusnak hangzik, de a szűrés konkrét megjelenési módja már közel sem triviális, és ezen rendkívül egyszerűnek tűnő funkciót számtalan ponton el lehet (és szokás) rontani.

A következőkben megpróbálok a teljesség igénye nélkül néhány tippet és tudnivalót bemutatni, amelyek segítenek abban, hogyan tegyük hatékonyabbá a webáruházunk szűrését, és érjük el azt, hogy a drága pénzen kifejlesztett funkciónk ne legyen használhatatlan néhány figyelmetlenség miatt.

A szűrő legfontosabb feladata az, hogy segítse a vásárlót a számára legmegfelelőbb termék(ek) megtalálásában egy adott kategóriában (ezen cikk nem tér ki a keresések finomításának ergonómiájára). Ezt úgy éri el, hogy néhány főbb terméktulajdonságot kiválasztva a terméklistánkat használható méretűre szűkíti, így vásárlónk sokkal kevesebb termék közül tud gyorsan és kényelmesen választani. Ennek alapján a szűrő legfontosabb tulajdonságai a következők legyenek:

• A vásárló folyamatosan lássa, milyen tulajdonságokat választott ki: a kiválasztott szűrőfeltételeket könnyen áttekinthetővé teszi, ha azokat a pathway-be, az aktuális pozíciót jelző oldalalembe gyűjtjük össze.
• A szűrőfeltételek könnyen hozzáadhatóak és eltávolíthatóak legyenek.
• A szűrő jelezze a vásárlónak, hogy az újabb és újabb szűrőfeltételek kiválasztásával egyre közelebb jut a tökéletes termékhez: ennek egyik legjobb módja az, ha az egyes szűrőfeltételek mögött jelezzük, hogy a kiválasztásukkal hány termék marad a listában, valamint a törlésükkel hány termékkel lesz több. Előbbi persze csak akkor hatásos, ha a vevő tisztában van a termékek aktuális mennyiségével, de ez alapvető kell, hogy legyen.
• A szűrőfeltételek kiválasztása után a szűrt terméklista gyorsan jelenjen meg: egy szűrőfeltétel beállítása után a szűrt terméklista megjelenítése ideális esetben 2-3 másodperc, vagy még rövidebb idő alatt megtörténik.
• Kerüljük az üres terméklistát: a szűrő működése során a vásárló ne kerülhessen olyan helyzetbe, amikor üres terméklistát lát. Erre a legjobb módszer az, ha azon szűrőfeltételek, amelyek a már kiválasztottakkal együtt üres listát eredményeznének, eltűnnek, vagy inaktívvá, nem választhatóvá válnak. Ez utóbbit vizuálisan is jelezni kell, pl. a feltétel és a jelölőnégyzet fakítása által.

A Zappos.com webáruházban a fentiek szépen érvényesülnek. Mint látható, itt a kategóriák kiválasztása is szűrőfeltételként történhet meg (erre azért van lehetsőség, mivel a Zappos termékkínálata közel homogén, nincsenek a különféle kategóriáknak más-más paraméterei). Fent láthatóak és törölhetőek az eddig kiválasztott feltételek.

Ez rövid fejezet lesz, mivel a szűrőfeltételeknek alapvetően mindössze két típusuk van:

Szöveges tulajdonságok: azon értékek, amelyeket nem lehet numerikusan megfogni. Ilyen pl. egy szín, hogy rendelkezik-e a termék valamely funkcióval (pl. van-e a TV-ben HDMI csatlakozó, van-e a biciklin csomagtartó), egy váza vagy bútor anyaga.

Mennyiségek: értelemszerűen ezek azok a terméktulajdonságok, amelyeket számmal fejezünk ki. Mennyi a termék ára, mekkora a memória merevlemeze, a bútor szélessége, hosszúsága, a telefon képátlója, stb. Ez utóbbi szűrőfeltételeknél lehet, és gyakran kell is olyan megoldásokat alkalmazni, amelyeket normál tulajdonságok esetén nem.

A terminológia szükségszerűen pontatlan, és nagyvonalú, ugyanis a lenti feltételek között is vannak olyanok, amelyeket néha jobb sima tulajdonságként alkalmazni, pl. a számítógépek memóriaméretei, amelyek számmal kifejezhetőek ugyan, de sima tulajdonságként is átlátható feltételcsoportot alkotnak.

A tulajdonságok olyan értékek, amelyeket nem lehet számmal kifejezni. Ennél fogva azok egymástól ekülönülő tulajdonságok lesznek, amelyek kattintással választhatók. Erre több lehetőségünk van: linkek, legördülők és jelölőnégyzetek által.

Én ez utóbbira szavazok, a jelölőnégyzetek esetén ugyanis konvencionális megoldás van arra, hogyan kell a szűrőfeltételek ki és bekapcsolt állapotát jelezni, míg ha linkeket alkalmazunk, akkor ezen megoldásokat nekünk kell kidolgoznunk és tesztelnünk. Bizonyos esetekben a legördülők használata is megfontolandó lehet, ezek esetében ugyanis a konvenciók ugyanúgy adottak, és kevés helyet foglalnak el. Hátrányuk az, hogy egyszerre csak egy tulajdonság választható ki velük.

Vigyázzunk azonban, hogy ne zsúfoljunk a felületre túl sokféle tulajdonságot, ugyanis az nehezen áttekinthetővé válhat. Ha nincs más választásunk - mert az egyik tulajdonságcsoportunk ezt megköveteli - akkor a legnépszerűbb 3-5 tulajdonságot vegyük előre, a többit pedig egy link segítségével tegyük elérhetővé.

Az Amazon.com kedvelt példám, mert jól csinálják. Mint látható, ők is a jelölőnégyzetes megoldást alkalmazzák leginkább, az áttekinthetetlen tulajdonságlistát pedig a "See more" ("Nézze meg a többit") linkkel oldották meg.

A mennyiségek szűrésére számos megoldás létezik. Az első az, amikor a konkrét mennyiségek alkotnak külön tulajdonságokat, amelyeket aztán azzal megegyező módon választhatunk ki. Ezt láttuk pl. a számítógépek memóriájának kérdéskörénél is, de ilyen pl. a kerékpároknál a lehetséges fokozatok száma: nincs túl sokféle értéke, tehát egy is kezelhető. Ezen megoldás hátránya persze az, hogy így intervallumok kezelésére csak bonyolult mód van: a kívánt intervallum összes tulajdonságát ki kell választani.

Ha a mennyiségünk sokféle értéket is felvehet (pl. ár, méret, stb.), azt is megtehetjük, hogy előre definiált intervallumokat állítunk be, amelyek tulajdonságokként teszik ezeket kezelhetővé. A kérdés az, hogy ezen tulajdonságokat hogyan határozzuk meg:

• Automatikusan: ez a megoldás az árak esetén eléggé ad-hoc, és nehezen értelmezhető értékeket eredményezhet, ha nem megfelelő (pl. 23224 Ft - 67512 Ft).
• Az egész boltra vonatkozóan: ez esetben - ha széles körű a termékkörünk - sok intervallum értelmezhetetlen lesz egyes kategóriákban, tehát ezt nehéz általánosan jól, és használhatóan meghatározni.
• Kategóriánként: nehezen menedzselhető, de nagyon jól használható értékeket biztosít.

Mint látjuk, minél nehezebben menedzselhető megoldást választunk, annál könnyebb dolga lesz a látogatóinknak.

Lehetséges megoldás a csúszka, ahol kis fülekkel állíthatjuk be a kívánt kezdő és végértéket. Itt ugyanis az intervallum beállítás a lehető legkönyebben, és leggyorsabban zajlik, árak szűrésére nem nagyon láttam még jó megoldást. Nyakló nélkül alkalmazni viszont ezt sem lehet: egy konkrét érték beállítása meglehetősen nehéz vele, és túl kicsi intervallumok esetén nehezen kezelhetővé válik.

A Crutchfieldnél a csúszkás árszűrőre találunk szép megoldást.

Létezik egy olyan megoldás is, hogy a látogató kézzel írja be az intervallum kezdő és végértékét, ez esetben kezelnünk kell a lehetséges szintaktikai (számot írt-e be) és szemantikai (pl. nem-e nagyobb az első szám, mint a második) tévedéseket, és maga a funkció korántsem lesz olyan magától értetődő, tehát én - hacsak nem keresési találatokat akarunk vele finomítani - nem szoktam javasolni. 

Azért hagytam utoljára az Árukereső felületét, mert több fenti témában is szép megoldásokat alkalmaznak. Látható itt az, hogy egy feltétel kiválasztásával hogyan változik a megjelenített termékek száma, beállítható az árhoz fix intervallum, és gyönyörűen látszanak az eddig kiválasztott szűrőfeltételek. Még szöveges keresővel is kiegészítették a szűrhető feltételek körét, ez tehát egyfajta hibrid megoldás. Az egyetlen fájdalmam, hogy kivették a csúszkás árszűrőt, de ez persze szubjektív.

TIPP:

• Ha szeretnél látni egy hatékony szűrési rendszert a gyakorlatban, úgy kattints ide !
• Ha szeretnéd mindezt kipróbálni, hogy hogyan működik a háttérben, hogyan lehet ezt menedzselni, stb., úgy igényelj hozzá egy próbaidőszakot ide kattintva !

Kihagytam valamit, dícsérnél vagy vitatkoznál? Tedd meg a kommentboxban!