iSTYLE webáruházak
Esettanulmány

iSTYLE webáruházak

Bevezető

Az iSTYLE márkanevet minden bizonnyal senkinek nem kell bemutatni, hiszen Közép-Európa és a Közel-Kelet meghatározó Apple Premium Reseller hálózata. Hazánkban 5 boltja és aktív webes megjelenése (webáruház, microsite-ok, iMagazin) mellett az Apple termékekhez kapcsolódó edukációs és B2B szolgáltatásairól is jól ismert. Az iSTYLE elsősorban Apple termékek forgalmazójaként tett szert népszerűségére, ám kínálatában rengeteg további jól ismert márka termékei is megtalálhatóak, így az Apple-kompatibilis műszaki cikkek teljes ökoszisztémáját forgalmazza.

Apple kollekció

A webáruház sajátosságai és a Magento 2-es átállás

Az iSTYLE az Oander egyik legrégebbi e-kereskedelmi ügyfele, 2014 óta dolgozunk vállvetve együtt. Mivel jelenleg a régió 9 országában vannak jelen és terjeszkedésük folyamatos, ezért mára az iSTYLE Közép-Európa egyik legnagyobb Magento alapú webáruházává nőtte ki magát. Az egyes piacok kiszolgálása egy közös Magento installációból történik, ahol egy igen komplex funkciókészlettel és sokféle külső integrációval rendelkező webáruházról beszélünk.

A projekt átvételekor, 5 évvel ezelőtt a portál még Magento 1-en futott, ami egy legacy kódbázis volt. 2018-ban a Magento 2-re való váltással együtt történt meg a kódbázis lecserélése, mely fokozatosan, webshoponként történt meg, éppen ezért közel háromnegyed évig két rendszer szupportálását kellett kiszolgálnunk, maga a teljes átállás pedig tulajdonképpen 9 webáruház élesítésével és annak minden feladatával járt együtt.

A 2018-ban elindult, megújult webáruház

A párhuzamosított munkálatok alapos szervezést és körültekintő tervezést igényeltek, hiszen a webshop sajátossága, hogy gyakran futtatnak rajta nagy terheltséggel járó kampányokat (például: új Apple termékek bevezetése, iPhone launchok, Black Friday, stb.), így erősen performance optimalizált kódbázist kellett szállítanunk, ami igen jól teljesített a 2018-as kampány időszakban, egyúttal a projekt magas rendelkezésre állást is kíván miattuk.

Online és Offline retail “házassága”

Aki ismeri az iSTYLE-t, az tudja, hogy a vállalat az online jelenlét mellett nagyon erős offline lábbal is rendelkezik. Ilyen projekteknél kiemelt szerepe van az online és a retail omnichannel jellegű összehangolásának. A Magento 2-es átállás során fel kellett készíteni a webshopot sok raktárkészlet egyidejű, párhuzamos szálon való kezelésére, az állandóan változó készletadatok gyors aggregálására és újrakalkulására, valamint a készlet elérhetőségből származó üzleti logikák kiépítésére. Az online és az offline retail kapcsolatának átjárhatóságát számos modul is támogatja (például bármelyik irányból kezdődhetnek folyamatok, melyek online vagy offline fejeződnek be). Ezek célja, hogy az online és offline kereskedelmi tevékenység egymást erősítsék.

Agilis módszertan

A 2018-as átállás, illetve a projekt azt követő rendszertámogatása teljes egészben agilis megközelítésben történt és jelenleg is így zajlanak fejlesztéseink. A módszertannal együtt járó fejlesztési metodikánk gyors és iteratív átadási ciklusokat tesz lehetővé, melyben az ügyfél is aktív résztvevő. A Scrum bevezetése a megrendelő edukálásával történt, fel kellett készítenünk az agilitásra, így sok módszertani oktatás és workshop zajlott menet közben. Ennek a körültekintő bevezetésnek köszönhető, hogy az iSTYLE csapata megkedvelte a scrum módszertant, látja az előnyeit és sikerrel alkalmazza is azokat.

Ma már a projekt kulcsszereplői kéthetente részt vesznek a fejlesztő kollégák demozásán, együttesen planningelnek, illetve gyakoriak a közös groomingok is. Ennek a közös együtt gondolkodásnak és tervezésnek, illetve a dedikált fejlesztő csapatnak köszönhető, hogy szoros napi kapcsolat alakult ki a megrendelő és az Oanderes kollégák között.

A Oander a fejlesztés mellett aktív consultancy szerepet lát el, közösen ötletelünk, a feladatokat sok esetben mi specifikáljuk, karban tartjuk a backlogot és az agilis metodika alapján bizonyos időközönként újra priorizáljuk azt. Mivel a projekt nemzetközi környezetben zajlik, nagyon sok stakeholder egyidejű bevonásával (országmenedzserek, sales-esek, webshop adminok), ezért ez nagy kihívást jelent a projekt minden résztvevője számára. Erre alkalmas azonban az agilis módszertan, ami a sok helyről származó és gyorsan változó igényeket rugalmasan tudja lekezelni.

Egyik példa a gyorsan változó igényekre és azok azonnali lekezelésére, a folyamatos monitoring, hőtérképes és GA elemzések, amik ugyancsak visszacsatolnak a termékhez és segítenek jobbá tenni azt. Az elemzésekből kieső visszajelzések állandó igényeket generálnak, vagy meglévő, korábbi igényeket írnak felül, ezt azonban szintén támogatja az agilis metodika.

Magento modulfejlesztések

A Magento 2-es átállás rengeteg az előző, Magento 1-es rendszerben használt funkció és üzleti folyamat új rendszerben való leképezését jelentette. Ezek az igények az átállással nem vesztek el, ezért már az MVP szakasz is több tucat komplex és egyedi modul fejlesztésével járt. Mára már a webáruház közel 120 Magento modult tartalmaz, ezek egy része központilag használt funkció, másik része az egyes országok és célpiacok speciális igényeit, üzleti folyamatait elégíti ki.

A modulok közel felét fejlesztette az Oander, másik fele viszont third party modulok telepítését jelentette. A sok külső gyártású modul implementálása és összehangolása ekkora volumenben kifejezetten nagy kihívás volt, de egyben az open-source jelleg nagy előnyét is alátámasztotta, hiszen széles modultárból lehet válogatni a speciális funkciók kielégítéséhez. Márpedig speciális igényekkel bőven rendelkezik a projekt, hiszen az egyes célpiacok eltérő elvárásokat támasztanak, például fizetési és szállítási mód integrációkból több tucat fut az áruházban.

A third party modulok mellett azonban nagyon sok egyedi üzleti folyamattal rendelkezik a webáruház, így sok modulfejlesztést végeztünk. Ezek egy része a kereskedelmi tranzakciókat támogatják, de készültek belső vállalati folyamatokat segítő vagy ügyfélszolgálati relációval is rendelkező Magento modul fejlesztéseink. Mindezek mellett kiemelt jelentőséget kaptak a magasabb szintű automatizálást végző modulok (például: kiajánló rendszerek, termékajánlók, kiszolgálási folyamatot érintő automatizmusok).

Különösen nagy modulfejlesztések és kihívások voltak például:

  • Az iSTYLE egyedi készletkezelési logikáját megvalósító modulrendszer, mely a Magento készletkezelő funkcióinak kibővítését jelentette. A termékek így a globális készlet helyett raktáranként kezelhetők weboldal-nézetenként, külön-külön. A modul kiiktatja a Magento natív készletkezelési logikáját és egy komplexebb, egy termékhez több raktárkészletet rendelő készletszámítást vezet be, ennek egyedi logikái pedig “végiggyűrűznek” a webshop teljes vásárlási folyamatán.
  • Feladatunk volt egy egyedi előrendelési folyamat fejlesztése, amelyet összetett ERP és CRM integráció is fűszerezett. A funkció lehetőséget biztosít arra, hogy a készleten nem lévő termékekre előjegyzést vegyünk fel, ezáltal könnyebben tudjuk kezelni az előrendeléseket az egyes termékekre, a folyamat kényelmesebb az ügyfelek számára, és az automatizáció révén időt spórolunk a webshop adminoknak.
  • Kialakítottuk a szervizbe való online időpontfoglalás lehetőségét ugyancsak ERP és CRM  integrációval. Egyes országokban időpontot is lehet foglalni a szervizbe a gyorsabb ügyintézés érdekében, illetve bizonyos országokban kötelező a szervizfolyamat elindításához. Az időpontfoglaló oldalt a Magento jeleníti meg és a kapott adatokat belső logikák alapján kezeli külső végpontokkal szikronizálva.
  • A széles piacnak köszönhetően teljesen egyedi árkijelzési logikák mentén épülnek fel az egyes site-ok, amelyek az egyes országok speciális eljárásaiból adódnak. Külön kihívás volt a Magento konfigurálható termék típusának alapos továbbfejlesztése, hogy megfeleljen az Apple-specifikus követelményeknek és a webáruház egyidejű megfeleltetése 9 ország törvényi előírásainak és iparági szabályozásainak.
  • A projekt során nagy hangsúlyt fektettünk a performanciára. Így kódoptimalizációk széles köre került bevezetésre (pl. különböző frontend és backend cache-ek, adatbázis indexelési eljárások, CDN, lazy load bevezetés, külső hosted search megoldások). Az Ügyfél elvárása volt a villámgyorsan működő (közel realtime) és biztonságos integráció kiépítése úgy, hogy a külső rendszerek és a webáruházak közötti igen komoly adatforgalom zajlik.

UX design és sablonfejlesztés

Az iSTYLE webáruház ergonómiai szerkezete az Oander Hodor alapsablonjára épült, ám attól igen nagymértékben eltérő, egyedi designt kapott. Az átalakítást komoly ergonómiai tervezés előzte meg, melyet az Oander készített el, a UI design-t pedig a megrendelő házon belül szállította le. Az M2-es átállással azonban nincs vége a megújulásnak, a sablon folyamatosan fejlődik az optimalizációnak köszönhetően. A hagyományos HTML / CSS mellett Vue.js alapú megoldások is vannak benne, így számos ponton túlnő a Magento sztenderd frontend eszközkészletén.

Néhány a webáruház számos drótváz terve közül

A webáruház felhasználói élményének érdekessége, hogy az egyes terméktípusok nagyon speciális kialakítású layout-okkal rendelkeznek, melyek sokkal komplexebbé tették a sablont. A termékoldalak a hagyományos webshopos értékesítésen túl, egy-egy termékcsalád összetett landing page-ei sok kiajánlóval, kalkulátorokkal és az Apple által megkövetelt tartalmi és design elemekkel. Mivel rendszeresen érkeznek új termékek és sok az egyedi kampány, egy rugalmasan alakítható sablont kellett kialakítanunk, amely előre nem látható landing page-ekkel könnyen gazdagítható. Ezeket ma már legtöbbször maga az ügyfél tervezi meg és illeszt be az oldalba, kihasználva ezzel a Magento layout felülírási képességeit.

Rendszerintegrációk

Ahogy korábban említettük, a 9 webáruház szoros integrációval rendelkezik több tucat külső rendszerrel. Ezek kialakítása részletes workshopok és az üzleti folyamatok felmérése után kezdődött meg, a fejlesztés pedig agilis metodikában zajlott úgy, hogy az integrációs réteg egyedi követelményeit a webáruházzal párhuzamosan fejlesztettük.

Végeredményben valamennyi ország önálló ERP installációval rendelkezik, így az egyes installáción belüli website-ok más-más – de azonos technológiájú – vállalatirányítási rendszerekkel kapcsolódik. Maga a webshop integrálva van az iSTYLE nagykereskedelmi partnere ERP-jével, illetve annak webáruházával is. Emellett elkészült a CRM integráció is, ahol tranzakciós adatok, vásárlói információk, affiliate és loyalty információk továbbítódnak a rendszerek között, valamint nem utolsó sorban, az előrendelések is itt történnek.

A webáruház mögött az integrációs folyamatokat az OANDER Connect nevű middleware termékünk szolgálja ki. A köztes réteg feladata, hogy menedzselje és rugalmasan bővíthetővé tegye a készletmozgások, rendelések, termékek és vásárlói információk szinkronizálását. Így az az egyes célszoftvereket (webáruház, ERP, CRM, stb.) nem közvetlenül egymással kapcsoljuk össze, hanem egy központi „hub-hoz” illesztjük.

A Magento oldal felőli integrációt egy kulcsrakész modulcsomagunk, az API Gateway biztosítja, mely segítségével lehetőségünk van gyorsan és hatékonyan betölteni a webshop működéséhez szükséges adatokat, legyen szó termékekről, hozzájuk kapcsolódó készlet és ár adatokról, de akár egyedi kosár árszabályokat is tudunk paraméterezni.

Üzemeltetés

A projekt jelentős mérete, a rendszeres és nagy terhelést jelentő kommunikációs kampányok miatt a megújításnál kulcskérdés volt az üzemeltetés kérdésköre. A téma körbejárása után a választás az Amazon Web Service-re (AWS) esett, az üzemeltetési szolgáltatást és monitoringot pedig a cloud-alapú infrastruktúra megoldások vezető hazai szakértője, az Eldacon nyújtja az iSTYLE részére. Az AWS lehetőségeit kihasználjuk, hogy rugalmasan alakítsuk a terhelés függvényében az infrastruktúra méretét, így kampány időszakokban a rendszer könnyedén skálázható akár az eredeti kapacitása sokszorosára. Ez különösen termék launch-ok és Black Friday esetén nyújt izgalmas lehetőségeket.