WEBOVÁ APLIKACE, 2019
Antonie Emma
Sestavte si průlezky online. V konfigurátoru, který má nekonečno možností.
We design the future
01
PŘEDSTAVENÍ
Dětské hřiště ve vašem obýváku.
Nekonečnou zásobu součástek vám nikdo nedá, ale my to vyřešili jinak. Vytvořili jsme 3D konfigurátor, kde si můžete celé dílo postavit virtuálně.
AntonieEmma se už několik let zabývá výrobou dřevěných průlezek. Díly se dají skládat podle libosti. Výsledné dílo limituje jen fantazie a gravitace. Zádrhel je v tom, že s metodou stavby pokus-omyl začnou právě díly brzo chybět. Konfigurátor toto řeší bravurně. Navíc poslouží jako návod ke stavění a všechny použité díly se automaticky umisťují do košíku, takže se na nic nezapomene.
Přihlášení
Dashboard
3D Konfigurátor
Detail modelu
Nastevení profilu
02
MISE
Připravili jsme konfigurátor, kde si můžete sestavit průlezky nejdříve virtuálně a z něj rovnou odeslat objednávku použitých dílů.
Interaktivní konfigurátor
Přehled dílů, které už zákazník nakoupil
Inspirace stavbami ostatních uživatelů
03
PŘEKÁŽKY
S čím jsme se potýkali
01
Ovládání 3D konfigurátoru.
3D konfigurátor ovládání by toho měl umět hodně a zároveň být jednoduchý na ovládání.
02
Mechanika součástek.
Skládání částí na sebe není žádný med. Navazovat mají jen určité části stavebnice. Zbytek by neměl jít nasadit vůbec a nebo jen po otočení.
03
Optimalizace 3D modelů.
Vzhledem k tomu, že doba, po kterou uživatel udržuje pozornost se čím dál více zkracuje, museli jsme naít správné vyvážení mezi kvalitou 3D modelu a rychlostí načítání.
04
ŘEŠENÍ
Jak jsme situaci vyřešili
01
Využivali jsme standardní mechaniku a chování.
Uživatelé jsou na ni zvyklí z ostatních platforem, kde se rovněž pohybují v 3D prostoru. K tomuto řešení jsme přidali prvky pro ovládání stavebnice.
02
Každý díl ví, s kým se může dát dohromady.
V miniaplikaci je seznam veškerých dílů, se kterými uživatel přijde do styku a ty mají definováno, jak je lze propojit s ostatními.
03
3D modely vykreslujeme pomocí ThreeJS.
Tato oblíbená knihovna umožňuje zobrazení 3D modelů ve webovém rozhraní, jejich snadnou ovladatelnost a malou velikost zároveň.
05
NA ČEM APLIKACE STOJÍ
Technologické pozadí.
01
NodeJS & React native.
Aplikace běží na prověřených technologiích Node.js a React.js.
02
3D modely v ThreeJS
Tato knihovna je skoro must-have pro jakoukoli práci s 3D modely na webu a my si to plně uvědomujeme.
