Vissza az esettanulmányokhoz
Building productsbuilding productsbike racks3d viewersite furnishings
Dero: kód nélkül beágyazott 3D kerékpártároló-konfigurátor
Dero·
A Dero egy minneapolisi (Minnesota) kerékpárparkoló-gyártó és a PlayCore vállalat tagja. Kereskedelmi és egyedi kerékpártárolókat, nyilvános kerékpár-javítóállomásokat, kerékpáros menedékeket, kerékpárszekrényeket, utcabútorokat és közterületi termékeket gyárt, és 1995 óta támogatja ügyfeleit – az egyetlen tárolót vásárló lakástulajdonosoktól kezdve a több száz kerékpáros számára kerékpártároló helyiséget tervező építészekig. Termékoldalain megtalálható mindaz, amit a specifikációk készítői keresnek: brosúrák, beadandó dokumentumok, telepítési útmutatók, CAD-, Revit- és SketchUp-fájlok, valamint CSI-specifikációk.
Ezen oldalak közül immár héten egy 3D kerékpártároló-konfigurátor is elérhető, amely a Simplio3D rendszerben készült, és egyszerűen 3D Viewer a címe. Szándékosan alapvető. A látogató kiválasztja a tároló rögzítési módját, hozzáadhat egy támasztórudat, ahol az adott tároló ezt lehetővé teszi, kipróbálhatja a különböző felületeket, és a tároló 3D-ben változik. Nincs ár, kosár vagy űrlap, és a dero.com oldalra való beillesztéshez elegendő volt egy beágyazási kódrészletet bemásolni, programozás nélkül.
A projekt áttekintése
| Tétel | Részletek |
|---|---|
| Ügyfél | Dero, Minneapolisból (Minnesota), a PlayCore vállalata: kerékpártartók, egyedi tartók, nyilvános kerékpár-javítás, kerékpártárolók, kerékpárszekrények, utcabútorok és utcaképi megoldások 1995 óta |
| Weboldal | dero.com, egy WordPress oldal a Dero saját áruházával és ajánlatkérési listájával |
| Termékek | Hét kereskedelmi kerékpártároló: Hoop Rack, Hoop Rack Heavy Duty, Downtown Rack, Arc Rack, Swerve Rack, Bike Hitch és Bike Bike Rack |
| Mire képes a 3D Viewer | A kiválasztott rögzítési móddal, a támasztórúddal be- vagy kikapcsolt állapotban – ahol a tároló rendelkezik ilyennel –, valamint a 22 felületkezelés bármelyikével 3D-ben jeleníti meg a tárolót, és összefoglalja a választásokat |
| Amit nem tartalmaz | Árak, kosár és űrlap. A vásárlás és az ajánlatkérés továbbra is a Dero termékoldalain már meglévő lehetőségeken keresztül történik |
| Beállítás | Rackenkként egy alap konfigurátor, amelyet a termékoldalon a „3D Viewer” cím alá illesztett kódrészlettel lehet beágyazni. Nincs szükség bővítményre, webshopintegrációra vagy programozásra. |
| Platform | A Simplio3D korábbi verziója |
Amire az ügyfélnek szüksége volt
Magának a racknek a felületkezelése
A Dero rackjei horganyzott, rozsdamentes acél vagy különféle porszórt színekben kaphatók. Egy kis színminta keveset árul el arról, hogyan mutat egy szín egy teljes racken.
Felületre szerelhető vagy földbe telepíthető
Mindegyik rack rögzíthető alaplemezekkel a talajhoz, vagy telepíthető a földbe, és a két megoldás eltérően néz ki ott, ahol a rack találkozik a padlóval.
Támasztórúd ott, ahol van belőle
A hét állvány közül négyhez választható támasztórúd tartozik, ezért az előnézetekben lehetőséget kellett biztosítani annak hozzáadására és eltávolítására.
Előnézet, nem egy második webshop
Minden termékoldalon már rendelkezésre álltak a vásárlási vagy árajánlatkérési lehetőségek. A 3D nézetnek csak a választásban kellett segítenie.
Egységes működés a teljes kínálatban
A hét állványnál ugyanazokra a választási lehetőségekre volt szükség ugyanazon a helyen, így aki már használta az egyik 3D Viewert, mindet ismeri.
Nincs szükség fejlesztési projektre
A megjelenítőknek a meglévő WordPress termékoldalakon kellett működniük bővítmény, fejlesztő vagy a webshop bármilyen módosítása nélkül.
A megoldás: 3D kerékpártároló-konfigurátor hét termékoldalon
A dero.com oldalon minden tárolónak saját termékoldala van leírással, dokumentumokkal és letöltésekkel, valamint a Dero saját vásárlási és ajánlatkérési lehetőségeivel. Ezek közül hét, a Dero által a kerékpárparkolás szabványának nevezett Hoop Racktől a kerékpár alakú Bike Bike Rackig, mostantól az oldal lejjebb található 3D Viewer szakaszával is rendelkezik.
Minden 3D Viewer egy egyszerű konfigurátor. A tároló világosszürke háttéren forgatható és nagyítható, a mellette lévő panelen pedig legfeljebb három választási lehetőség szerepel: a rögzítés, a támasztórúd és a felület. Semminek nincs ára, semmi nem kerül kosárba, és semmit nem küldenek el. Egyetlen feladata a tároló bemutatása, ezért olyan kevés beállítást igényelt.
Rögzítés, támasztórúd és felület 3D-ben, közvetlenül a tárolón
A három választási lehetőség azokat a jellemzőket érinti, amelyek meghatározzák a tároló megjelenését a telepítés után:
- Rögzítés. Egy legördülő menü Surface és In-Ground opciókkal. A Surface a tárolót a lecsavarozáshoz használt talplemezeken mutatja; az In-Ground ezeket a talajba kerülő hosszabb lábakra cseréli.
- Támasztórúd. Kapcsoló a Hoop Rack, Hoop Rack Heavy Duty, Downtown Rack és Arc Rack modelleken. Bekapcsolva egy vízszintes rúd jelenik meg a tárolón; a másik három tárolón a kapcsoló egyszerűen nem látható.
- Felület. 22 minta, minden tárolón ugyanaz: Galvanized és Stainless, majd Black, Flat Black, White, Light Gray, Red, Yellow, Bright Yellow, Orange, Blue, Sky Blue, Green, Light Green, Hunter Green, Sepia Brown, Bronze, Silver, Dark Purple, Wine Red, Beige és Iron Gray. A horganyzott minta a horganyzott acél foltos textúráját mutatja, nem pedig egyszínű felületet.
A panel alatti kis (i) gomb megnyitja a Configuration Summary nézetet, amely szövegesen sorolja fel a kiválasztott opciókat: például a Swerve Rack esetében Select Mount: Surface és Select Finish: Wine Red. A látogató innen közvetlenül továbbléphet ugyanazon az oldalon a vásárlási vagy ajánlatkérési lehetőségekhez.
Mit kínálnak az egyes 3D nézegetők
Hét állvány, mindegyik saját 3D nézegetővel a termékoldalán.
| Állvány | Ahogyan a Dero bemutatja | Választási lehetőségek a 3D nézegetőben |
|---|---|---|
| Hoop Rack | A kerékpárparkolás etalonja: vastag cső teljes ívű hajlítással; két kerékpár parkoltatására alkalmas | Felszerelhető, támasztórúd, 22 felületkezelés |
| Hoop Rack Heavy Duty | A szabványos Hoop Racknél nagyobb és vastagabb cső | Felszerelhető, támasztórúd, 22 felületkezelés |
| Downtown Rack | Vastag négyzetes cső és megnövelt szélesség a teljes megtámasztásért; két kerékpár tárolására alkalmas | Felszerelhető, támasztórúd, 22 felületkezelés |
| Íves kerékpártároló | Négyzetes cső letisztult geometriai vonalakkal; két kerékpár tárolására alkalmas | Felszerelhető, támasztórúd, 22 felületkezelés |
| Kanyargós kerékpártároló | Vastag cső a kerékpár vázát követő formában; két kerékpár tárolására alkalmas | Rögzítés, 22 felületkezelés |
| Kerékpártartó kampó | Egy oszlop és gyűrű teljes ívű hajlítással, karcsú megjelenéssel; két kerékpár tárolására alkalmas | Rögzítés, 22 felületkezelés |
| Kerékpár kerékpártároló | Kerékpár alakú tároló, amelyet funkcionális utcai műalkotásként írnak le; két–négy kerékpár számára biztosít helyet | Rögzítés, 22 felületkezelés |
Így állítható be egy Deroéhoz hasonló 3D-megjelenítő
Öt lépés, amelyek közül egyikhez sincs szükség kódolásra.
Töltse fel a 3D modellt
Adja hozzá a tároló modelljét egy új projekthez. A(z) Simplio3D támogatja a GLB, GLTF, FBX, OBJ, STL és DAE fájlokat.
Adja hozzá a rögzítési módot
Egy legördülő menü Surface és In-Ground opciókkal, amelyek mindegyike a modellhez illő talapzatot jeleníti meg.
Adja hozzá a támasztórudat
Egy kapcsoló, amely megjeleníti vagy elrejti a rudat azokon a kerékpártárolókon, amelyeken van ilyen.
Adja hozzá a felületkezeléseket
Felületkezelésenként egy minta: textúra a horganyzott acélhoz, valamint szín a többihez.
Illessze be a beágyazási kódrészletet
Másolja ki a konfigurátor iframe-kódrészletét, és illessze be a termékoldalra. A Simplio3D rendszerben később végzett módosítások az oldal újbóli szerkesztése nélkül jelennek meg.
Előnézet a Dero saját vásárlási és ajánlatkérési lehetőségei mellett
A Dero termékoldalai már eleve értékesítésre szolgálnak. Mindegyiken elérhetők a Dero saját vásárlási vagy ajánlatkérési opciói: felület, rögzítés és – ahol alkalmazható – támasztórúd, majd mennyiség, Add to cart és Add to quote; nagyobb mennyiségek esetén az ajánlatkérési lista használható. A 3D Viewer ugyanazon az oldalon helyezkedik el, és mindezt változatlanul hagyja.
Nincs saját ára, kosara vagy űrlapja, és nem küld adatot sehova. A látogató megnézi a tárolót a számára megfelelő rögzítéssel és felülettel, majd ugyanezeket a beállításokat választja ki a Dero opciói között. Éppen ez a kis terjedelem tette gyorsan élesíthetővé: nem kellett termékeket összekapcsolni, árakat szinkronban tartani, vagy űrlapokat bárkihez továbbítani.
Beágyazás programozás nélkül
Minden Simplio3D konfigurátorhoz tartozik megosztási link és másolható iframe-kódrészlet. Minden Dero termékoldalon ez a kódrészlet teljes szélességben, a 3D Viewer cím alatt szerepel. Nincs bővítmény, script vagy kapcsolat az áruházzal, így egy nézet élesítése mindössze egyetlen kódrészlet egyetlen oldalba való beillesztését jelentette.
Mivel az oldal csak ezt a kódrészletet tartalmazza, magát a 3D Viewert a Simplio3D rendszerben kezelik. Egy új felület vagy frissített modell ott módosítható, és a következő oldalbetöltéskor megjelenik a dero.com oldalon anélkül, hogy bárkinek szerkesztenie kellene a termékoldalt. További információ az ilyen nézetekről: a 3D termékmegjelenítő.
Eredmények
Minden kivitel az állványon megtekinthető
A látogatók mind a 22 kivitelt kipróbálhatják az éppen megtekintett állványon, a számukra szükséges rögzítéssel és Lean Barral, még vásárlás vagy árajánlatkérés előtt.
Ugyanaz az eszköz hét oldalon
A Hoop Racktől a Bike Bike Rackig minden 3D nézegető ugyanúgy működik, ugyanazzal a háromféle választási lehetőséggel és azonos kivitelekkel.
Nincs új karbantartási feladat a webhelyen
A termékoldalak csak egy beágyazási kódrészletet tartalmaznak. A módosítások a Simplio3D rendszerben történnek, az áruház és az ajánlatkérési lista pedig változatlanul működik tovább.
Amit a Dero mond
A Simplio3D segítségével könnyen megmutathattuk kerékpártárolóinkat úgy, ahogyan a telepítés után kinéznek. Minden 3D Viewer tartalmazza a rögzítési módot, ahol van, a támasztórudat, valamint teljes felületkezelési kínálatunkat, és a termékoldalra való felhelyezés csupán a beágyazási kód beillesztését jelentette. Nincs szükség fejlesztőre vagy bővítményre, az oldalak pedig továbbra is könnyen karbantarthatók.
Colin K.Tervező · Dero
Kérdések erről a projektről
Egy eszköz, amely 3D-ben mutatja meg a kerékpártárolót, és lehetővé teszi a vásárló számára, hogy módosítsa annak opcióit – például a rögzítési módot, a támasztórudat vagy a felületkezelést –, majd a rendelés előtt megtekintse az eredményt. A Dero megoldása szándékosan egyszerű: háromféle választási lehetőség és egy 3D nézet, árak és űrlap nélkül.
Hét kereskedelmi kerékpártároló: a Hoop Rack, a Hoop Rack Heavy Duty, a Downtown Rack, az Arc Rack, a Swerve Rack, a Bike Hitch és a Bike Bike Rack. Minden nézegető az adott kerékpártároló dero.com oldalon található termékoldalán érhető el.
A rögzítést (felületre szerelhető vagy földbe telepíthető), a döntőrudat azon a négy tárolón, amelynél ez elérhető, valamint a felületkezelést: 22 mintából választhatnak, köztük horganyzott acélból, rozsdamentes acélból és 20 színből. Az összefoglaló szövegesen felsorolja a választási lehetőségeket.
A Dero termékoldalai már saját lehetőségeket kínálnak a vásárlásra vagy árajánlat kérésére. A 3D nézegető csak a látogatók választását segíti, így egyszerű maradt a beállítása és könnyű a karbantartása.
Nem. Minden 3D nézegető egy iframe-kódrészlet, amelyet a(z) Simplio3D rendszerből másolnak ki, majd beillesztenek a termékoldalba. Nincs szükség bővítményre vagy az áruházhoz való kapcsolatra, és a(z) Simplio3D rendszerben végzett módosítások az oldal szerkesztése nélkül megjelennek az oldalon.
Igen. Egy Simplio3D konfigurátor feltételes szabályokkal, árazással, árajánlat- vagy kapcsolatfelvételi űrlappal, illetve kiterjesztett valósággal is bővíthető, amikor egy terméknek ezekre van szüksége. A következő rész bemutatja, mit egészíthetne ki ma egy ilyen projekt.
Mit nyújtana ma egy ilyen projekt?
Ennek a szakasznak egyik eleme sem része a fent ismertetett Dero 3D Viewereknek, amelyek a Simplio3D korábbi verzióján futnak. Egy kerékpártárolókat vagy utcabútorokat gyártó vállalat számára, amely most indul:
- A tároló ott, ahol majd állni fog. A kiterjesztett valóság telefonon, alkalmazás nélkül helyezi el a konfigurált tárolót a járdán vagy egy kerékpártároló helyiségben: AR Quick Look a iOS platformon, Scene Viewer a Android platformon, valamint QR-kód asztali böngészőből.
- Részletek a modellen. A hotspotok információs felugró ablakokkal ellátott jelölőket adnak hozzá, például a cső méretéről vagy a tárolható kerékpárok számáról, a Scenery pedig a hátteret és a kameranézetet módosítja.
- A megjelenítő és a rendelési űrlap összehangolva. A beágyazott konfigurátor minden módosítást böngészőeseményként jelez,
simplio3d:option.changed, így az ezt igénylő webhely néhány saját script-sorral előre kiválaszthatja a saját rendelési űrlapján ugyanazt a felületet és rögzítést. - A teljes kínálat gyorsabban. Egy másik tároló első konfigurátora írásos leírásból is létrehozható, a kategóriánkénti tömeges hozzáadás pedig a megosztott anyagkönyvtár felületválasztékát mintakészletté alakítja, anélkül hogy minden mintát kézzel kellene elkészíteni.
- Minden megjelenítő ellenőrzése. Az AI-asszisztens ellenőrizheti az opciók lefedettségét és a feltételes logikát – például azt, hogy minden felülethez tartozik-e anyag –, és javításokat javasolhat. Egy AI-kliens, például a Claude, amely MCP-n keresztül, korlátozott hatókörű kapcsolattal kapcsolódik a munkaterülethez, ugyanezeket az ellenőrzéseket futtathatja; az árak vagy SKU-k módosításai pedig mindig csak függőben lévő változtatásként érkeznek, amelyeket egy személy alkalmaz.
3D előnézet minden redőnyhöz
Hogyan biztosít az Evergreen Shutters minden árajánlatához az egyes redőnyökről generált 3D nézetet saját árajánlatkészítő rendszerében.
Színek és egy űrlap, semmi más
Hogyan helyezett el a Fanbedarf.de egy 3D dzsekikonfigurátort a WordPress weboldalán négy modellel, szövetszínekkel és egy érdeklődési űrlappal.
Termékmegjelenítő bármely katalógushoz
Jelenítse meg termékeit 3D-ben bármely weboldalon forgatással, nagyítással, animációkkal és megjegyzésekkel, bemutatóoldalakhoz és termékoldalakhoz.
Építsen, telepítsen és skálázzon 3D kereskedelmi megoldásokat.
Használjon saját 3D termékkonfigurátort az értékesítés ösztönzésére és árajánlatok közvetlen, webhelyéről történő készítésére
Kapcsolódó esettanulmányok
Tentest: 3D pop-up sátorkonfigurátor tervezőfelülettel minden panelen
A Scandipro Group észt pop-up sátorgyártója, a Tentest saját 3D konfigurátort készített: hat sátorméret, minden panelen logófeltöltést támogató tervezőfelület, AR és árajánlatkérés.
Fell & Frame: házon belül fejlesztett faablak-konfigurátor a(z) WooCommerce rendszerhez
A Carlisle-i asztalosipari vállalkozás, a Fell & Frame saját faablak-konfigurátort készített a(z) Simplio3D rendszerben. A vásárlók hatféle bukó-nyíló ablaktípust milliméter pontossággal méretezhetnek, majd a(z) WooCommerce kosarába helyezhetnek.
Evergreen Shutters: 3D zsalugáter-előnézetek egy belső árajánlatkészítő rendszerben
Az Evergreen Shutters Ltd-nek pontos látványtervekre volt szüksége több ezer zsalugáter-variációhoz a saját árajánlatkészítő platformján belül. Ahelyett, hogy 3D motort fejlesztettek volna, integrálták a(z) Simplio3D API megoldást, és minden árajánlathoz egy generált 3D nézetet adtak vissza.