Dockyard webáruház
Esettanulmány

Dockyard webáruház

Az Ügyfél

A Dockyard a hazai funkcionális- és sportruházati kereskedelem meghatározó szereplője, amely több regionális országban is aktív jelenléttel rendelkezik. A csak itthon 14 boltot számláló üzletlánc olyan neves márkák kizárólagos forgalmazója, mint a Columbia, Helly Hansen, Fundango, Timberland vagy az O’Neill. Kiemelkedő piaci jelenlétük és termékkínálatuk révén a Dockyard üzletek az egyik elsőszámú lelőhelyei a havas, vizes és szeles sportok, illetve a hozzájuk kapcsoló életstílust kedvelő aktív nők és férfiak kedvenc márkáinak. Offline jelenléte mellett a Dockyard évek óta aktív webes értékesítési tevékenységet végez és nagy örömünkre csapatunkat bízták meg idejét múlt webáruházuk újragondolására, új alapokon történő fejlesztésére.

Az online ruhaértékesítés az e-kereskedelem egyik legnagyobb forgalmú szegmense. Folyamatos növekedés jellemzi és Európa számos országában már a műszaki cikkek online eladási forgalmával vetekszik. Ugyanakkor egy rendkívül összetett, szubjektív döntési helyzetekkel tűzdelt vásárlási folyamat jellemzi, ahol a sikeres jelenlét követelménye a kínálat különböző csatornákon való egységes és összehangolt vásárlási élménnyé való formálása. A Dockyard korábbi webáruháza sem ergonómiai kialakításában, sem funkcionalitásában nem volt alkalmas egy integrált vásárlási élmény kiszolgálására, így Ügyfelünk online jelenléte teljes megújítása mellett döntött. A projekt egy igazi innovációs termékfejlesztésnek bizonyult, amelyben számos területen bizonyítanunk kellett alkalmasságunkat.

Dockyard mockup

A webáruház tervezése

A projekt kezdetén Ügyfelünk egy igen konkrét funkcionális igénycsomaggal érkezett hozzánk, amelyhez ergonómiai tervek is társultak, vagyis a Dockyard csapata nemcsak egy projekt vízióval rendelkezett a közös munka kezdetén, de igen pontosan tudták, hogy mit szeretnének megvalósítani. Ezen igényeket és elképzeléseket szakértőink segítségével közösen revideáltuk, és az ügyféllel folytatott tervezési termékműhely találkozók során kialakult a webáruház funkcionális specifikációja, integrációs műszaki leírása. Az OANDER tervezési metodikájának megfelelően a portál felületeinek kialakítása első körben user workflow rajzokkal és ergonómiai tervekkel kezdődött, ahol lefektettük az egyes oldaltípusok logikai alapjait és portálon belüli navigáció rendszerét. A layout-ok drótváz szintű megtervezését követte azok grafikai kimunkálása, amely egy iteratív, agilis megközelítésű tervezési folyamat keretében zajlott.

Dockyard drótvázak

Néhány minta a Dockyard webáruház wireframe tervei közül

A Dockyard ruhakereskedelmi tevékenységének jellemzője, hogy termékkínálatában számos márka, rengeteg típus, méret, és színválaszték van, maga a kínálat pedig igen szerteágazó viseleti célokat szolgál. A felületi tervezés fő kihívása az volt, hogy minél átláthatóbbá és könnyen felfedezhetővé tegyük ezt az igen színes kínálatot, valamint hogy az egyes termékek bemutató felületein ötvözzük a forgalmazott márkák életérzését a technikai specifikációk és funkciók ismertetésével. Ebből a célból a webáruház felületeit egy teljesen fluid, reszponzív grid rendszerre építettük fel, amely a full-width tartománytól egészen a legszűkebb mobil verzióig az adott eszköz kontextusának megfelelően rendezi el és jeleníti meg a user interface komponenseit. A készülő portál ráadásul nemcsak a Dockyard webáruháza lett, hanem egyben a vállalat hivatalos weboldala is. Így az e-kereskedelmi funkciók mellett egyazon website-on belül kellett megoldanunk a felhasználóknak kínált hasznos tartalmak, tanácsok, válogatások és a fizikai üzlethálózattal kapcsolatos információk megfelelő tálalását.

A projekt fő kihívásai

Az online ruhakereskedelem sajátossága, hogy a weben kiválasztott áruról nem dönthető el teljes bizonyossággal, hogy megfelelő lesz-e számunkra. Egy webshopon látható kabátról, nadrágról vagy cipőről nehezen dönthető el, hogy valóban jól fog-e állni rajtunk, amikor felpróbáljuk, valóban úgy passzol-e az ízlésünkhöz, ahogyan azt a monitor előtt ülve elképzeljük. A ruházati és divat-webshopok ezért nemcsak értékesítési, hanem erős vásárlási döntés előkészítő szereppel is bírnak: gyakori, hogy a felhasználók a potenciálisan megvásárolandó termékeket online választják ki, de maga a vásárlás az üzletben történik meg. Emellett a ruházati online kiskereskedelem rendelkezik egy másik sajátossággal is, amely komoly logisztikai és pénzügyi kihívást jelent a piaci szereplők számára. Sehol máshol nem olyan magas a visszáru aránya, mint ebben a szegmensben, terméktípustól függően ez akár a rendelések 30%-át is érintheti. Ennek oka ugyancsak az, hogy az online ruhapróbálás nem lehetséges, maga a ruha pedig egy olyan speciális áru, amelynek megfelelőségét számos weben nem előre látható szubjektív tényező befolyásolja (pl. kényelem, anyagminőség, tapintás, illik-e hozzánk, jól áll-e, stb.) A projekt során az egyik legnagyobb kihívásunk az volt, hogy egy olyan digitális ökoszisztémát hozzunk létre, amely hatékony az azonnali eladásban, segíti a látogatókat a vásárlási döntés-előkészítésben, illetve egy összehangolt élménnyé teszi az online-offline vásárlási folyamatot, amelyben a webáruház sok esetben a vásárlási folyamat kezdete, de nem feltétlenül a vége.

Mindennek támogatására a Dockyard webáruházában egy olyan megoldáscsomag került kialakításra, amely a hagyományos e-kereskedelmi funkciók (termékek online megrendelése) mellett lehetőséget biztosít a felhasználóknak a vásárlási folyamat online elindítására, majd offline befejezésére is. A klasszikus rendelési folyamat mellett a látogatók az egyes termékeket le tudják foglalni, illetve a hozzájuk legközelebb eső fizikai boltba történő átszállításukat is igényelhetik. Ezzel jelentősen csökkenthetővé vált a visszáruk aránya és növekedett az online felület hatékonysága a bizonytalan vásárlók boltok felé történő csatornázásában. A többféle rendelési opció nem utolsó sorban pedig jelentős kényelmi funkciót jelent a vásárlóknak.

A fenti hármas rendelési funkció (rendelés, foglalás és üzletbe szállítás) előfeltétele természetesen, hogy a felhasználók valamennyi termék valamennyi konfigurációjáról pontos, real-time készlet statisztikákat lássanak a webáruházban. Tekintve, hogy a Dockyard webáruháza – számos retail hálózathoz hasonlóan – az üzletek állandóan változó készleteit értékesíti, komoly informatikai tervezési feladatot jelentett a készlet-információk állandó és helyes összehangolása a webáruház és a vállalat központi kereskedelmi rendszere között. Az üzleti igény kiszolgálásához a projekt során egy egyedi middleware szoftvert fejlesztettünk. Ennek révén a hazai e-kereskedelmi piacon kiemelkedő precizitású és pontosságú integrációt értünk el a webáruház és az Ügyfél ERP szoftvere között, amely a készletmozgásokat, árlistákat, rendeléseket és fogyasztói adatokat átláthatóan és automatizáltan szinkronban tartja az egyes rendszerek között.

A ruházati kiskereskedelem további sajátossága – amely a Dockyard webáruház fejlesztése kapcsán műszaki kihívás elé állította csapatunkat – a termékkínálat szezonalitása. A ruhaipart évek óta meghatározza a „fast fashion” néven ismert trend, amelynek lényege, hogy a kínálat folyamatosan és igen gyorsan cserélődik. Ma már a divatmárkák komoly energiát szentelnek a piaci igényre való azonnali reagálásra, a vásárlók pedig a gyors kínálatváltozás hatására gyorsabban hoznak vásárlási döntéseket. Ez a trend a sportruházati szegmensben is egyre erősebben érzékelhető. A Dockyard-nak a növekedése biztosításához gyors reakcióképességre volt szüksége, amely azt jelentette, hogy a webáruház kínálatát egyik napról a másikra cserélniük kellett tudni. Ehhez a manuális termékszerkesztési funkciók fölé építve ki kellett fejlesztenünk egy olyan termékimportálási eljárást, amely révén rendkívül nagy mennyiségű adat forog be a webáruházba igen rövid idő leforgása alatt, lecserélve annak akár teljes kínálatát az online értékesítés megakasztása nélkül.

A Dockyard üzleti folyamataiban fontos szerepet játszanak továbbá a nagykereskedelmi partnerek, illetve a törzsvásárlói programban résztvevő vásárlók, amelyek mind egyedi árakon jutnak hozzá a termékekhez, ennek megfelelően a webáruház igen összetett felhasználó-kezeléssel rendelkezik. A műszaki követelmények része volt nemcsak ezen fogyasztói és partner információk migrálása az új rendszerbe, de az egyes vásárlói csoportokhoz tartozó egyedi árkezelési és fizetési eljárások kialakítása is. A fent említett üzleti integrációs feladatokon túl a projekt során banki integrációs megoldások szállítása és speciális regisztrációs, rendelésstátusz-követő modulok kiépítése is a feladatunk volt.

Műszaki megvalósítás

Mindezen követelmény sikeres megvalósításához egy olyan szoftverkörnyezetre volt szükség, amely egyrészt stabil, rugalmasan alakítható, másrészt pedig „out-of-the-box” módon olyan gazdag e-kereskedelmi funkciókészlettel rendelkezik, amelyek révén a projekt költségvetése elsősorban az egyedi fejlesztések megvalósítására volt fordítható a webáruház alap funkciókészletének kifejlesztése helyett. A technológia kiválasztásakor fontos további szempont volt, hogy korszerű iparági szabványokra épülő e-commerce portálmotorra volt szükség, hiszen a webáruház megvalósítása többszintű rendszerintegrációt is igényelt egy zárt üzleti termékkel, a Dockyard központi kereskedelmi rendszerével (KKR).

A Magento webáruház engine kiemelkedően jó választásnak bizonyult mind továbbfejleszthetősége, mind a kiinduló funkciócsomag megfelelősége terén. Nyílt forráskódú jellegéből adódóan a Magento alapú webáruházhoz számos egyedi modult készítettünk, illetve a nemzetközi szoftverpiacról beszerzett modulokat is implementáltunk. A Magento különböző látogatói célcsoportokat képes célzott tartalmakkal, árszabályokkal kiszolgálni, ez ugyancsak fontos alap funkció volt a vásárlói csoportok kezelésének megvalósításához. A Magento „multistore” architektúrával rendelkezik, így Ügyfelünk egyazon installációra tudja építeni márka-specifikus és nemzetközi webáruházait, amelyek a közeljövőben debütálnak. Csapatunk 2015-ben Magento projektekhez egy egyedi fejlesztésű, Bootstrap-alapokra építkező frontend sablonrendszert is létrehozott, amely nagyban gyorsította a webshop reszponzív kialakítását.

A Dockyard webáruház és ERP rendszer közötti komplex integráció alapjául az Oander Connect névre keresztelt middleware termékünk szolgált, amelyet Symfony PHP keretrendszerben fejlesztettünk ki. Az Oander Connect egy köztes réteg, önálló szoftvertermék a webáruház és a vállalatirányítási rendszer között, saját adminisztrációs felülettel. Célja, hogy gyorsítsa a készletmozgások, rendelések és vásárlói információk szinkronizálását, valamint megvalósítsa a szezonálisan változó termékkínálattal együtt járó adattömeg webáruházba történő gyors betöltését, mindezt úgy, hogy leveszi a terhelést mind a webáruházról, mind az ERP rendszerről.

Mit is jelent a projektben alkalmazott „köztes réteg” kifejezés pontosan? Webáruház fejlesztési projektjeink során jellemző igény, hogy ügyfeleink belső ügyviteli rendszereikhez (számlázás, raktárkészlet kezelés, CRM funkciók, stb.) szeretnék integrálni a webáruházaikat úgy, hogy az “összekapcsolás” ne pusztán adatcserével járjon, hanem mindez adatok szegmentálásával, aggregálásával és egyéb, akár humán erőforrást is igénylő adminisztrációval társuljon. Általában elmondható, hogy ezen feladatokkal a már meglévő ERP rendszerek egyáltalán nem, vagy csak nagyon drágán bővíthetőek. Az Oander Connect termékünk ezen igényekre nyújtott megoldást a Dockyard webáruház fejlesztése során. A webshop és az ERP között elhelyezkedő köztes szoftverként kész funkcionalitást kínál az adatkommunikáció üzemeltetésére, naplózására, tesztelésére, másrészről rendelkezik egy olyan általános API eljárásgyűjteménnyel, melyekkel a webáruház üzleti folyamatai kevesebb fejlesztéssel, egységes irányelvek mentén igazíthatóak különféle ERP rendszerekhez, így például a Dockyard egyedi fejlesztésű KKR rendszeréhez.

Dockyard mockup

Eredmények

A Dockyard megújult webáruháza alapos tesztidőszakot követően 2016 januárjában indult el éles üzemben. Az átállás egy igen komplex folyamat volt, ugyanis Ügyfelünk nemcsak webáruházát újította meg, de annak indításával egy időben cserélte le központilag és az üzleteiben használt vállalatirányítási rendszerét is, így az élesítés alapos forgatókönyvet és több projekt szereplő összehangolását igényelte. Az élesítést követően a webáruház kereskedelmi funkciói kiemelkedően jól teljesítenek, csapatunk számára pedig nagy megtiszteltetés, hogy ügyfelünk hosszú távú bizalmat szavazott nekünk és immár a webshop továbbfejlesztésein dolgozhatunk. A projekt sikeréhez nélkülözhetetlen volt a Dockyard mögött álló, felkészült ügyféloldali szakmai team aktív részvétele és támogatása a projektben, így az elkészült rendszer mindenképpen „közös gyermek”. A Dockyard webáruház folyamatosan fejlődik, új funkciókkal bővül, így nemcsak a válogatott termékkínálat, de a hazai e-kereskedelem szereplői számára best practice értékű megoldások miatt is érdemes időről időre fellátogatni az oldalra. Kattints ide a webáruház megtekintéséhez!