Company Logo

Migracija na Magento 2 s prilagođenim UX-om

Novi Magento 2 web trgovina s prilagođenim UX-om za grupu ljekarni Ljekarne Joukhadar, koja je prethodno imala samo prezentacijsku web stranicu.

DETALJI PROJEKTA

Industrija

Ljepota i zdravlje

Tržište

Hrvatska

Datum lansiranja

5. siječnja 2023

Profil

Iako je poslovanje funkcioniralo uspješno, naš klijent odlučio je slijediti trend digitalizacije poslovanja i kreirati prva web trgovina Joukhadar ljekarni. Obratili su nam se u potrazi za pouzdanim partnerom koji će njihove ideje i zahtjeve pretvoriti u stvarnost, što smo s veseljem prihvatili.

Danas, nekoliko mjeseci kasnije, naš klijent ima potpuno funkcionalan Magento webshop koji (s ponosom možemo reći) nadmašuje postavljena očekivanja. U nastavku pročitajte sve o specifičnostima ovog projekta i zavirite u naše putovanje s Joukhadar Ljekarnama.

Dizajn

Dobra reprezentacija zdravstvenih i proizvoda ljepote bila je ključna za naš dizajn. Ova kategorija uključuje kozmetiku, dodatke prehrani itd. Razgovarajući s klijentom, postalo nam je jasno da će biti potrebno jasno definirati vizualni identitet. Klijent je prethodno imao logo, zelenu boju i dizajn za karticu vjernosti, no odlučili smo da taj dizajn nećemo koristiti za projekt. Nova web trgovina odražavat će minimalistički, čist i moderan dizajn, za razliku od razigranog i šarenog dizajna kartice vjernosti.

Kao simbol povjerenja i sigurnosti, zadržali smo zelenu boju, koja je uobičajena u ovoj industriji. Kako bismo nadopunili klijentovu zelenu boju, dodali smo nijansu svijetlosmeđe i tirkizno plave boje. Paleta boja inspirirana je prirodom – tirkizna dolazi iz mora, smeđa iz pijeska, a zelena iz biljaka. Sve je postavljeno tako da predstavlja prirodne i zdrave proizvode koje klijent prodaje. Na kraju smo odabrali serifnu tipografiju i pripremili vodič koji pomaže klijentu da ostane dosljedan svom vizualnom identitetu, što se najbolje uklopilo s elegancijom kozmetike.

Naš UX dizajner nastavio je s istraživanjem i odlučivanjem o segmentima i funkcionalnostima web trgovine koja bi kupcima olakšala pronalazak onoga što traže. Zaglavlje sadrži kategorije proizvoda najviše razine, usmjeravajući kupca kroz razgranato stablo kategorija. Koristeći ElasticSearch rješenje i našu ekstenziju Search Preview, kupci mogu vidjeti pregled rezultata dok tipkaju pojam u tražilicu.

Sekundarna navigacija također kupcima pruža informacije poput često postavljenih pitanja, kontaktnih podataka, lokatora trgovina i bloga. Za kupce koji su završili na određenoj stranici proizvoda, tu su breadcrumbi koje osiguravaju da klijent lako pronađe proizvode iz iste kategorije ili slične proizvode. Također, ako kupac preferira brend proizvoda na čijoj se stranici našao, pored SKU-a nalazi se poveznica na sve proizvode tog brenda.

Što se tiče početne stranice, dojmljive glavne slike (hero images) prate odabrani proizvodi, istaknuti brendovi, istaknute kategorije, preporuke i blogovi.

Kroz pažljivo dizajniran lokator trgovine Joukhadar, kupac jednostavno može pronaći sebi najbližu ljekarnu. Lokator također nudi dodatne informacije kupcima, o čemu ćemo detaljnije govoriti u nastavku.

Glavne funkcionalnosti

Razvijajući ovaj projekt od nule, morali smo osigurati da rješenje koje isporučujemo u potpunosti odgovara potrebama našeg klijenta. Najvažnije, trebali smo razviti rješenje koje se savršeno uklapa u postojeće poslovne procese.

Naša uobičajena osnova za projekte je Inchoo Flavored Magento, a ni ovaj put nije bilo drugačije. Inchoo Flavored Magento dodatno je prilagođen specifičnim potrebama klijenta. Uključili smo mnoge naše module, ali ćemo se usredotočiti na najvažnije.

Počinjemo s Breadcrumbima, čija je važnost u pružanju informacija o korisničkom putu kupca. Na taj način, kupci koji su završili na stranici određenog proizvoda mogu lako pronaći slične proizvode prateći breadcrumbe. Drugim riječima, kupci imaju potpunu informaciju o korisničkom putu. Ako je proizvod u više kategorija, trgovac ima veću kontrolu pri odabiru preferirane kategorije za breadcrumb.

Nadalje, Load More modul omogućuje korisnicima neprekidno pregledavanje sadržaja pritiskom na jasno vidljiv gumb. Ovo je nadogradnja na uobičajeni Magento Pager na popisu proizvoda, koji je zastarjela UX praksa.

Kako je prethodna web stranica sadržavala popis svih lokacija ljekarni, logično je bilo uključiti ovu funkcionalnost i u web trgovinu. Za tu svrhu koristili smo naš Store Locator modul. On omogućuje kupcima da pretraže najbližu fizičku trgovinu, pružajući im informacije o lokaciji, kontaktima i radnom vremenu.

Live Search View offers customers autocompleted search results for their queries. A search box dropdown displays a small preview of search suggestions with product name, image, and price included. We also included a blog, so you’ll get both suggestions when searching for terms contained in product and blog names.

For the theme, as in most of our projects, we used our Improved Base Theme theme with UX/UI improvements on the Magento default one.

Za kraj smo ostavili module koji su razvijeni zbog specifične situacije u kojoj Hrvatska prelazi s kune na euro. Zbog toga svaki trgovac mora prikazivati cijene u dualnim valutama i, kako bi se spriječila nekontrolirana inflacija, najnižu cijenu u posljednjih 30 dana.

Zbog toga smo razvili modul za dualno prikazivanje cijena i najnižu cijenu u poslijednjih 30 dana. Modul za dualan prikaz cijena je besplatan i dostupan na Magento Marketplaceu. Razvijen je na temelju službenog prijedloga hrvatske vlade i obveze prikazivanja cijena u obje valute tijekom prijelaznog razdoblja.

Glavne integracije

Prvo, morali smo osigurati da sve funkcionira besprijekorno. Kao rezultat toga, jedan od glavnih modula bio je za razmjenu podataka između Eskulap informacijskog sustava i web trgovine. Modul je postavljen tako da šalje nove narudžbe Eskulapu i obrađuje podatke koje Eskulap vraća web trgovini. Kada je ovo bilo spremno, nastavili smo s implementacijom metoda plaćanja. Za plaćanja karticama integrirali smo Monry Payment Gateway sustav. Osim kartica, kupci mogu birati i opcije plaćanja pouzećem ili bankovnim prijenosom.

Naš je klijent odabrao GLS kao pružatelja usluge dostave, pa smo dobili zadatak razviti proširenje jer ne postoji modifikacija za Hrvatsku. Ovaj modul omogućava administratoru stranice da poduzme sve potrebne radnje, poput definiranja iznosa za besplatnu dostavu, definiranja zemalja u koje je dostava dostupna itd.

Na kraju, implementirali smo Locodels. Locodels je usluga dostave unutar grada koja se fokusira na dostavu istog dana, od vrata do vrata, za web trgovinu i maloprodaju. Kako funkcionalnost za povezivanje ove usluge dostave ne postoji, razvili smo modul za njegovu integraciju s web trgovinom. I kupac i administrator imaju pristup statusu dostave. Ova metoda dostave trenutno je dostupna za glavni grad Hrvatske – Zagreb.

Još nismo gotovi


Naš rad na ovom projektu rezultirao je visoko funkcionalnom web trgovinom s modernim i prilagođenim dizajnom. Ali još nismo gotovi. S obzirom na dugoročne ciljeve našeg klijenta, sastavili smo popis prijedloga koji bi mogli biti implementirani u budućnosti. Sve u cilju poboljšanja korisničkog iskustva i, na kraju, povećanja profita. Kako još uvijek surađujemo s našim klijentom na podršci i održavanju, vjerujemo da najbolje tek dolazi. Također, želimo našem klijentu puno sreće!

Ako ste i vi zainteresirani za izradu web trgovine na Magento platformi, pošaljite nam osnovne informacije o svom projektu ispunjavanjem kontakt forme, a mi ćemo vam odgovoriti u što kraćem roku.

Novi dizajn za Lera Sport osmišljen je kako bi unaprijedio njihovu web prisutnost.

Pročitajte kako smo stvorili prilagođeni UX dizajn koji nosi (slatki) okus svijeta grickalica Atlantic Štarka.








    Zajamčena 100% privatnost.
    Vaši kontakt podaci neće biti
    dijeljeni trećim stranama.