Mennyi animáció fér el egy webshopban? Így marad kényelmes a vásárlás

A webshopban mozgó figura könnyen elviszi a figyelmet. Ezt általában előnyként szokás eladni, pedig előbb azt kell tisztázni, honnan viszi el. Egy kevésbé fontos oldalrészről? A termékfotóról? Vagy éppen arról a gombról, amellyel a látogató szeretne rendelni? A szezonális dekoráció megtervezése ezért ugyanúgy használhatósági feladat, mint arculati döntés.

Szerintem az a jó beállítás, amely mellett a bolt karakteres marad, a látogató pedig zavartalanul elvégzi a dolgát. A beállításnál ezért a figurát és a körülötte lévő termékoldalt együtt nézném. Már egyetlen jól elhelyezett animációval is látványosan megváltozhat az oldal, miközben a vásárláshoz szükséges részek szabadon maradnak.

A figurát a boltodhoz és az alkalomhoz válaszd

Más megjelenés illik egy játékokat áruló webshophoz, egy prémium ruházati üzlethez és egy műszaki alkatrészbolthoz. Választáskor nézd meg a termékfotókat, a szövegek hangnemét és azt is, mennyi információt kell a vevőnek feldolgoznia az oldalon. Egy karakteres Halloween-figura lehet találó egy alkalmi kollekció mellett, de kérdéses egy bonyolult termékspecifikáció közepén.

Írd le egy mondatban, mit szeretnél: például „az ünnepi ajándékajánló legyen barátságosabb”. Ez használható cél. Az, hogy „minden mozogjon, mert látványos”, kevés támpontot ad a beállításhoz. A konkrét cél segít eldönteni, melyik oldalon jelenjen meg az effekt, és hol legyen nyugodtabb a felület.

A DG Dekorációban alkalomhoz illő figurák, szezonális effektek és kuponvadászat közül választhatsz. Ezekkel szezonális megjelenést és játékot adhatsz a boltodhoz. A termékek összehasonlíthatóságáról, az érthető árakról és a rendelési feltételekről közben külön is gondoskodj: az ünnepi környezetben ugyanúgy szüksége van ezekre a vevőnek.

A mozgás helyét is tervezd meg

Egy figura elhelyezését a valódi oldalon értékeld. Ami egy üres mintafelületen visszafogott, az a saját boltodban rákerülhet egy árra, méretválasztóra vagy értékelésre. Nézd meg rövid és hosszú terméknévvel, több sorba törő akciós szöveggel, valamint nyitott szűrővel is. Az oldal használat közben változik.

Görgetéskor külön figyeld az átmeneteket. Egy kép fölött maradó elem, egy sarokba helyezett figura és egy teljes oldalon mozgó jelenet eltérően viselkedik. Próbáld ki a termékkép nagyítását, a legördülő menüt és a keresőt. A megnyitott felületeken el kell tudni olvasni az információt, használni a gombokat és bezárni az ablakot. A figura ezek egyikét se takarja és az érintést se akadályozza.

Érdemes egyetlen feltűnő elemmel kezdeni. Mellé kerülhet finomabb háttérhangulat, ha együtt is rendezett az összkép. Ha egyszerre több, különböző helyen mozgó effektet kapcsoltál be, próbáld meg egyenként kikapcsolni őket. Közben ugyanazon a termékoldalon válassz változatot és nyisd meg a galériát. Így látod, melyik elem fér el kényelmesen a vásárláshoz szükséges felületek mellett.

Telefonon menj végig egy vásárlási feladaton

A mobilos ellenőrzés több legyen annál, hogy a főoldal elfér a kijelzőn. Nyiss meg egy terméket, válassz változatot, változtasd meg a darabszámot, majd tedd a kosárba. Közben görgess, fordítsd el a készüléket, és nyisd ki a menüt. Az animáció mellett minden lépésnek kényelmesen elvégezhetőnek kell maradnia.

A fejlesztő asztali gépe mellett olyan telefonon is próbáld ki az oldalt, amilyet a vásárlóid használnak. Nézd meg mobilinterneten, első betöltéssel és visszatéréskor. Ha a görgetés akadozik, a kezelőfelület késve reagál vagy egy figura túl nagy területet foglal, módosíts az intenzitáson és az elhelyezésen.

Az egérrel könnyen eltalálható figura telefonon még nehezen kezelhető lehet. Az apró, gyorsan mozgó elem mellett azt is nézd meg, elég hely marad-e az ujjadnak a szomszédos gombok között. Kuponjátéknál ezért külön ellenőrizd a figura érinthetőségét és a visszajelzést. A látogató értse, hogy sikerült a művelet, hány találatnál tart, és mi a következő lépés.

Csökkentett mozgással is lehessen vásárolni

A W3C az interakcióra induló animációkról szóló útmutatójában a szükségtelen mozgás kikapcsolhatóságát és a felhasználói beállítások figyelembevételét tárgyalja. A folyamatosan mozgó tartalmaknál külön szempont a szüneteltetés, megállítás vagy elrejtés lehetősége. Az útmutatók eltérő működést vizsgálnak, ezért az automatikus és a kattintásra vagy görgetésre induló effekteket külön próbáld ki. A teljes webshop akadálymentességéhez további feltételeket is ellenőrizni kell.

A DG Dekoráció figyelembe veszi a csökkentett mozgásra vonatkozó felhasználói beállítást. Kapcsold be ezt a saját készülékeden is a próba során. Nézd meg, hogy a termékinformációk, a navigáció és a vásárlási lehetőség így is érthető marad-e. Alapvető információt ne kizárólag egy mozgó jelenet közvetítsen.

Az erős villanásokat és a nagy képernyőterületet érintő változásokat külön kezeld. A bemutatóban nézd meg a jelenet egészét, majd döntsd el, hogyan illeszkedik a saját termékoldalaidhoz. Hosszabb műszaki leírás vagy részletes összehasonlítás mellett visszafogottabb beállítást választanék, hogy a vevő nyugodtan végig tudja olvasni az információt.

A kosár és a pénztár külön ellenőrzést igényel

A DG Dekoráció a felismert kosár-, pénztár- és fizetési oldalakon szünetelteti a dekorációt, és további kihagyandó útvonalak is megadhatók. Ezt a saját webshopodban ellenőrizni kell. Nyisd meg a saját kosaradat és a rendelés lépéseit is. Az egyedi oldalcím és az oldal tetején megnyíló kosár külön ellenőrzést igényelhet; a felugró kosár megnyitásakor például változatlan maradhat a böngésző címe.

Menj végig próbavásárlással a folyamaton, fizetés és valódi rendelés leadása nélkül, ameddig a rendszer ezt engedi. Figyeld a kedvezménykód mezőjét, a szállítás választását és az űrlaphibákat. Ha valamelyik effekt ezeket zavarja, az érintett területet zárd ki, majd ismételd meg a próbát.

Jegyezd fel, melyik beállítás vált be használat közben

Az, hogy tetszik a figura, jó kiindulás. A megtartásáról a saját boltodban szerzett használati tapasztalat alapján dönts. Jegyezd fel, milyen beállítást használtál, mely oldalakon jelent meg, és mikor futott. Nézd meg a webshop saját rendelési és kuponadatait, valamint a használat közben jelzett problémákat. Az értékesítési adatoknál azt is nézd meg, mi változott még ugyanebben az időszakban; a több rendelést önmagában az új figurának tulajdonítani túl korai lenne.

Ha változatokat hasonlítasz össze, lehetőleg csak egy lényeges dolgon módosíts: például a figura elhelyezésén vagy a mozgás erősségén. Közben a forgalmi források, az akció és a készlet is befolyásolhatják a rendeléseket. Kevés látogatás alapján még ne zárd le az összehasonlítást. Egy konkrét használati hibát viszont rögtön javíthatsz: például azt, ha a figura a kiválasztott méretet vagy a kosárgombot takarja.

Kezdésnek válassz egy alkalmat a DG Dekoráció demójában. Próbáld ki a figurákat telefonon, majd a kiválasztott megjelenéssel menj végig egy termékoldalon a saját boltodban is. Olyan beállítást érdemes megtartani, amelyet szívesen mutatsz meg, és amely mellett továbbra is egyszerű vásárolni.