Borði fyrir 1. sæti á Splash Awards

Transgourmet - headless fjölsíðulausn

Atvinnugrein
Smásala
Lausn
Vefverslanir, Fjölsíðukerfi
Tækni
Drupal, React, React Native, Elasticsearch, Design system, Web components

ÁSKORUNIN

Transgourmet stefndi að því að sameina vefsíður sínar, netverslanir og öpp fyrir öll vörumerki og fyrirtæki sín í Evrópu í eitt markaðs- og netverslunarkerfi. Markmiðið var að auka skilvirkni í stjórnun vefsíðna fyrirtækisins með því að fækka mismunandi tæknilausnum og þar með lækka kostnað. Einnig vildu þeir veita neytendum samræmda vörumerkjavitund og góða notendaupplifun til að straumlínulaga kaupferlið.

LAUSNIN

Drupal var valinn sem vefkerfi vegna virkni hans fyrir stór fyrirtæki og vegna þess að hann er opinn hugbúnaður og án leyfis kostnaðar. Fyrir netverslunina var Commercetools, headless lausn valin. Örþjónustu arkitektúr samþættir innkaup á einfaldan hátt við vefsíðuna, sem gerir notendum kleift að fara á milli markaðs efnis og innkaupa án þess að skipta um vefsvæði. Til að tryggja samræmi vörumerkis voru allir sýnilegir þættir búnir til í sameiginlegu hönnunarkerfi.

ÚTKOMAN

Fjölsíðulausnin og netverslunarkerfið jók verulega skilvirkni í stjórnun á fjölmörgum vefsíðum fyrirtækisin. Hönnunarkerfi sem nota vefíhluti eru hluti af hönnunarkerfi Transgourmet, sem tryggir sameinað sjónrænt útlit allra vefumsjónarkerfa og vefversluna. Þessi sameinaða tækni knýr einnig áfram bakenda Native Apps sem þjónustar bæði B2B og B2C viðskiptavini. Transgourmet náði einnig að efla markaðsstarf sitt til muna og uppskar verulega tekjuaukningu með netsölu.

VIÐSKIPTAVINURINN

Transgourmet Deutschland GmbH & Co. OHG

Transgourmet Deutschland GmbH & Co. OHG (Transgourmet) er heildsala með matvæli fyrir veitingastaði, hótel- og stór kaupendur, með veltu upp á meira en 3 milljarða evra á ári.

Fyrirtækið er hluti af Transgourmet Holding, sem aftur er hluti af Coop Group. Transgourmet Deutschland GmbH & Co. OHG þjónar stórum viðskiptavinahópi, þar á meðal veitingastöðum, hótelum, mötuneytum og veitingasölum. Eitt af þekktari vörumerkjum á heildsölumarkaði, í Þýskalandi og öðrum löndum, er Selgros Cash & Carry, en vöruframboð þeirra á netinu telur rúmlega 60.000 vörur.

Viðskiptavinir okkar í dag eru Transgourmet Deutschland GmbH & Co. OHG, þar á meðal Selgros Cash & Carry, auk dótturfélaga Transgourmet eins og Frische Paradies og Niggemann.

Video file
Video thumbnail
VERKEFNIÐ

Stefna í vefmálum Transgourmet

Árið 2018 var 1xINTERNET beðið um að endurskoða allar vefsíður Transgourmet og vörumerkis þess, Selgros Cash and Carry, til að búa til sömu tæknikröfur og staðla fyrir þær vefsíður. Verkefnið var að búa til samræmda og sveigjanlega lausn sem myndi gera þeim kleift að uppfæra allar vefsíður fyrirtækisins. Það var mikilvægt að nota öflugt, öruggt og skilvirkt  vefumsjónarkerfi, þar sem hægt var að huga að þróun og viðhaldi með tímanum. Fyrir fyrirtæki eins og Transgourmet var verkefni sem þetta nauðsynlegt fyrir árangursríka innleiðingu stafrænnar stefnu.

Transgourmet er með fjölda mismunandi vefsíðna og vörumerkja í mismunandi löndum. Meðal þessara eru:

Áður voru þetta til sem einstakar vefsíður með mismunandi virkni og hönnun og ótengdar hvor annarri þegar kom að rekstri.

Í fyrstu voru allar vefsíðurnar sameinaðar í eitt tækniumhverfi. Vefverslunar virkni var búin til, samþætt við vefsíðurnar og rúllað út til viðeigandi vörumerkja og landa.

Að lokum voru kerfin sem búin voru til síðan endurnotuð til að útvega nauðsynleg gögn til að endurvekja B2B og B2C native öpp.

Skjáskot af heimasíðu Transgourmet vefsíðunnar

Sameining vefsíðna

Áður en sameiningar verkefnið hófst voru mismunandi fyrirtækjavefsíður og örsíður innleiddar og viðhaldið af mismunandi teymum sem notuðu mismunandi CMS lausnir. Þetta leiddi til mikils þróunar- og viðhaldskostnaðar. Það var einnig erfitt fyrir ritstjórana að reka vefsíðurnar, þar sem kerfin voru mismunandi.

Fyrir utan kostnað og vandamál við rekstur var ekki hægt að viðhalda mismunandi vörumerkjum Transgourmet miðlægt. Transgourmet / Selgros og einnig önnur vörumerki fyrirtækisins hafa sterka arfleifð þegar kemur að vörumerkinu og háa staðla. Með svo mörgum mismunandi kerfum og teymum var ómögulegt að viðhalda samræmdri vörumerkjaupplifun á öllum vefsíðum.

​Því var ákveðið að nota eitt CMS kerfi til að samræma þróun, viðhald, rekstur, hýsingu og útlit allra vefsíðna. Drupal var valið sem kjarnatækni vegna þess hve vel það hentar fyrir stærri fyrirtæki en vefkerfið er opinn hugbúnaður og hefur því engin leyfisgjöld.

Meira um opinn hugbúnað á móti sérhugbúnaði

Drupal býður uppá framúrskarandi virkni til að reka margar vefsíður með sama frumkóða. Þetta er einnig nefnt a multisite virkni. Í dag keyra yfir 20 fyrirtækjavefsíður Transgourmet á Drupal, þar á meðal þær sem hafa mesta umferð og innihalda umfangsmiklar netverslanir.

Skjáskot af heimasíðum Transgourmet og Selgros vefsíðunnar

Betri netverslun

​Transgourmet/Selgros er heildsölufyrirtæki þar sem tilgangur vefsíðnanna er að efla verslun á netinu. Því var sett upp plan til að samþætta vefsíður og netverslanir, með það að markmiði að gestir gætu skoðað markaðsefni eins og vörulista, tilboð og uppskriftir, og síðan haldið áfram í kaupferli án þess að yfirgefa vefsíðuna.

Þetta var gert mögulegt með vali á Commercetools sem netverslunartækni, þar sem hún er "headless" lausn sem auðvelt er að samþætta við sameinaða vefsíðuna.

Auk þess voru öll birtinga element, bæði fyrir framenda vefsíðunnar og netverslunina þróuð í hönnunarkerfi byggðu á vefþáttum (web components), sem er notað fyrir báða framenda. Allir vörumerkja þættir eins og lógó, leturgerðir, útlit, takkar, kort, fyrirsagnir o.s.frv. eru þróaðir miðlægt og dreift sem íhlutasafni. Í mismunandi framendum eru þessir íhlutir notaðir til að birta efnið og þannig næst samræmt útlit.

Meira um hönnunarkerfi

Í dag, þegar þú heimsækir vefsíðurnar, er ekki hægt að greina hvort efnið kemur frá vefumsjónarkerfinu eða bakenda netverslunarinnar, og notandinn upplifir fullkomlega samþætt ferli frá því að skoða markaðsefni til þess að kaupa vörur.

Skjáskot sem sýnir viðmót vefverslunar á Transgourmet vefsíðunni

Farsímaforrit fyrir B2B og B2C viðskiptavini

Þar sem bæði vefumsjónarkerfið byggt í  Drupal og rafræna viðskiptalausnin Commercetools eru byggð á API-first hugmyndafræði, var mögulegt að nýta þau fyrir efni fyrir native öpp á Android og iOS.

Fyrir Transgourmet / Selgros er mikilvægt að bjóða upp á hágæða upplifun fyrir bæði B2B og B2C viðskiptavini sína. Því voru þróuð native öpp fyrir báða markhópa.

React Native var valin sem tækni vegna samlegðaráhrifa við núverandi veflausnir.

B2B appið var sett í loftið árið 2021 en helstu eiginleikar þess fyrir notendur eru:

  • Vöruskanni (EAN, QR)
  • Endurpöntun vara
  • Samfelld vafranotkun innan appsins til að skoða vefverslun
  • Tvíátta samskipti milli native hluta og vefþátta (bæta skönnuðum vörum í körfu, leit, auðkenning, halda áfram að versla)
  • Vörulisti á tækinu (með verði fyrir viðskiptavini)
  • Auðveld skoðun auglýsingabæklinga með vörulistum (PDF bæklingar)

B2C appið var endurútgefið árið 2024, en helstu eiginleikar þess fyrir notendur eru:

  • Vöruskanni (EAN, QR)
  • Innkaupalisti
  • Push-tilkynningar
  • Sjálfvirkt tungumála val og þema stillingar
  • Leiðsagnarskjár (onboarding slider)
  • Samþykki fyrir rakningu og mat á appi
  • "Verða viðskiptavinur" ferli
  • Viðskiptavina kort
  • Afsláttarmiðar
  • Kynningarbæklingar
  • Sér verð fyrir viðskiptavini
  • Widget fyrir heimaskjá
Skjáskot sem sýnir Selgros farsímaforritið

Skilvirkt þróunarferli

Virkni vefsíðna og verslana er unnin í mismunandi teymum. Hægt er að skilgreina þau sem CMS teymi, netverslunar teymi og framenda teymi. 

CMS-teymið sér um virkni vefumsjónarkerfisins, Commerce teymið þróar lausnir með Commercetools, og framenda teymið býr til vefhlutabókasafn sem hin tvö teymin nýta sér.

Þróað var afar skilvirkt afhendingarferli sem gerir stjórnendum kleift að gefa út nýjar útgáfur af CMS-kerfinu, verslunar virkni og hönnunarkerfinu sjálfstætt.

Verkefnayfirlit

FRÁ KÚNNANUM

“Skalanleiki með samþjöppun...”

Mynd af Jens Friedrich

"Eftir því sem við höldum áfram að stækka netviðskipti okkar, höfum við áttað okkur á mikilvægi þess að samþætta tækni lausnir okkar. Með því að straumlínulaga rekstur okkar og sameina ýmis verkfæri í eitt samhæft kerfi, höfum við ekki aðeins aukið skilvirkni heldur einnig bætt getu okkar til að aðlagast breyttum þörfum markaðarins. Sameinað tæknikerfi okkar gerir okkur kleift að einbeita okkur að nýsköpun og veita viðskiptavinum okkar hnökralausa upplifun, sem að lokum knýr vöxt okkar áfram."

Jens Friedrich, yfirmaður rafrænna viðskipta, Transgourmet Þýskalandi

HÁPUNKTAR

Öflug tækni og notenda miðaðir eiginleikar

Samræmdir leitarmöguleikar

Leitarvirkni gerir notendum kleift að leita að vörum, uppskriftum eða öðru efni yfir mismunandi þjónustur og kerfi Transgourmet frá einu sameinuðum viðmóti.

Hýsing hjá Pantheon.io

Allar vefsíður eru hýstar hjá Pantheon.io. Hönnunarkerfið eða framendinn fyrir vefsíðurnar er hýst í sér geymslu (repository). Það er ein geymsla fyrir vefsíðuna sjálfa og önnur fyrir öll verkefni sem byggja á henni. Þetta gerir mögulegt að færa einstaka eiginleika auðveldlega yfir í önnur verkefni, hvort sem þau eru aðskilin eða samþætt.

Aðgerðir að fullu sjálfvirkar

Allar aðgerðir fara fram í gegnum að fullu sjálfvirk CI/CD kerfi frá GitLab og Azure. Breytingar á framenda eða prófíl eru sjálfkrafa settar upp á prófunarkerfum verkefnanna. Þessar uppfærslur verða síðan sjálfkrafa aðgengilegar á prófunarsíðum sem verið er að vinna með.

Skjáskot sem sýnir markaðssíður á Transgourmet vefsíðunni
Skjáskot sem sýnir vörubæklinga á Transgourmet vefsíðunni

Markaðssíður

Transgourmet sameinar fjölmarga matvælabirgja undir einu þaki. Hvort notandi hafi áhuga á ferskum fiski á Frischeparadies.de, vill heimsækja Niggemann.de eða Fruchthof.at fyrir hágæða ferskvöru eða langar að kíkja í næstu Selgros heildverslun  þá hefur Transgourmet réttu vefsíðuna fyrir þá.

Á hverri þessara vefsíðna geta notendur valið réttu verslunina handvirkt eða notað sína eigin staðsetningu til að finna næsta útibú. Selgros eitt og sér er með meira en 90 verslanir í Þýskalandi með mismunandi auglýsingar, efni og viðburði.

Vöruskrár

Auglýsingabæklingar og vörulistar sem má vafra gegna enn mikilvægu hlutverki í matvælaiðnaðinum í dag og hafa verið samþættir vefsíðunni. Sumir þessara vörulista eru búnir til á vefsíðunni sjálfri, aðrir eru veittir með utanaðkomandi hugbúnaði í gegnum API.  Til viðbótar við fjölda fjölmiðlaeigna sem myndast voru frekari metalýsingar og flokkunar eiginleikar innleiddir í CMS.

Meira um vörulista

Sérsniðnir borðar

Sérstakar vefsíður hafa B2B og B2C innkaupa virkni. Þessar síður krefjast sérsniðs til að birta tilboðin sem eru sérgerð fyrir markhópinn, sýna sérstök verðtilboð eða sérsniðna auglýsinga borða.

Skjáskot sem sýnir vörubæklinga á Transgourmet vefsíðunni
Skjáskot sem sýnir PatiChef eftirrétt stillingar á Transgourmet vefsíðunni

Stillanlegar uppskriftir

Stillingahæfar uppskriftir gera daglegt starf auðveldara fyrir viðskiptavini í matargerð, hótel bransanum og mötuneytum. Matreiðslumenn og kaupendur reikna út pöntunarmagn sitt fyrir matarinnkaup út frá fjölda fólks og laga uppskriftir sínar að því.

Verslunin með uppskriftagáttinni er þróun innanhúss sem næst með djúptengingum og er með beina “call to action” einingu sem stingur upp á krosssölu og sölu á tengdum vörum.

Meira um uppskriftagáttina

PatiChef - eftirréttir verða leikur einn

PatiChef einfaldar gerð eftirrétta og leysir áskoranir í eldhúsi, svo sem áætlunargerð, tíma og færni starfsmanna eldhússins. Það gerir patissierum kleift að búa til eftirrétti á netinu byggt á kröfum, fjárhagsáætlun, fyrirhöfn og magni.

Skjáskot sem sýnir atburði á Transgourmet vefsíðunni
Skjáskot af heimasíðu Transgourmet IT starfsmannasíðunnar

Skráning á viðburði

Transgourmet tengd fyrirtæki bjóða viðskiptavinum sínum upp á fjölbreytt úrval viðburða, vinnustofa og sýninga. Sumir þessara viðburða eru aðeins skipulagðir á tilteknum mörkuðum, aðrir á öllum mörkuðum. Af þessum sökum var búin til sérstök tegund efnis fyrir viðburði sem getur tekið mið af mismunandi viðburðaformum. Skráningar valmöguleiki er í boði fyrir hvern viðburð. Með þessu hefur Transgourmet tekist að færa viðburðastjórnun sína frá miklu magni af tölvupósti yfir í nútímalegt og skilvirkt vinnuflæði.

Nánar um skráningar á viðburði

Starfsmannablað

Transgourmet gefur út tímarit fyrir starfsmenn sína sem inniheldur fréttir úr fyrirtækinu, kynningar á starfsfólki og greinar tengdar atvinnugreininni.

Upplýsingagátt í upplýsingatækni

Á grundvelli vefumsjónarkerfisins var búin til netvettvangur þar sem hægt er að birta IT-störf hjá Transgourmet. Vettvangurinn var samþættur mannauðskerfi Transgourmet.

Meira um starfsgátt í upplýsingatækni

Verðlaunuð fyrir nýstárlega nálgun

Þegar fyrstu útgáfur af nýja tæknistaflanum voru gefnar út var verkefnið „Transgourmet Distribution - Multi-Website-CMS“ verðlaunað fyrir nýstárlega nálgun sína á Splash Awards Þýskalandi / Austurríki 2020.

Meira um vinningshafa Splash verðlaunanna 2023

AF HVERJU DRUPAL?

Hagkvæmni og góð fyrirtækjalausn

Skilyrði fyrir vali á vefumsjónarkerfi var hagkvæm og öflug lausn sem hentar fyrir stór fyrirtæki. Transgourmet þurfti mjög sveigjanlegt og sérhannað kerfi sem gæti vaxið með fyrirtækinu, fremur en að takmarka það með fyrirfram skilgreindum eiginleikum og umfangi. Drupal var einnig valið vegna þess að það er opinn hugbúnaður og fljótlega kom í ljós að allar kröfur gætu auðveldlega verið uppfylltar.

Önnur verkefni

Vefverslanir
Kjúklinga korma með grænmeti á borðinu

Eldum Rétt - flókin e-commerce lausn

Decoupled Drupal e-commerce samþætt við React Native app til að tryggja einstaka upplifun viðskiptavina og sveigjanleika.

Símaforrit
Einstaklingur með farsíma í ávaxtadeild verslunar

Selgros - notenda miðað markaðs app

Hönnun á notenda miðuðu appi til að styrkja tengsl við notendur og auka notkun fyrir leiðandi heildsölu fyrirtæki á matvörumarkaði.