# 3D na webu

URL: https://www.virtuex.cz/co-tvorime/3d-grafika/3d-na-webu
Slib: Interaktivní 3D přímo v prohlížeči.
Orientační cena: od 5 000 Kč (nejsme plátci DPH)

**Interaktivní 3D přímo v prohlížeči.**

Modely, které si zákazník otočí, konfigurátory produktů a weby postavené ve 3D. Propojujeme 3D tým s vývojem webu, takže model, animace i kód vznikají na jednom místě.

## Pro koho

- **Zákazník si chce produkt prohlédnout ze všech stran.** Foto ze čtyř úhlů neukáže detail ani poměry. Otočitelný 3D model odpoví na otázky dřív, než je zákazník položí, a snižuje počet vrácených objednávek.
- **Prodáváte konfigurovatelný produkt.** Barvy, materiály nebo sestavy se dají vybrat přímo na stránce a produkt se okamžitě mění. Zákazník vidí přesně to, co objedná.
- **Chcete web, který si lidé zapamatují.** Scrollovaný příběh nebo 3D scéna na úvodní stránce vytvoří zážitek. Takový web se sdílí a vyčnívá mezi konkurencí.

## Co dodáváme

- **3D prohlížeč produktu:** Model, který si návštěvník otočí, přiblíží a prohlédne. Funguje myší i dotykem a načte se rychle.
- **Konfigurátor barev a variant:** Přepínání barev, materiálů a doplňků s okamžitou změnou 3D modelu a ceny.
- **Scrollované 3D příběhy:** Scéna, která se mění podle posunu stránky. Vhodné pro představení produktu nebo značky.
- **Optimalizace modelů pro web:** Zmenšíme model i textury tak, aby se stránka načetla rychle a vypadala dobře i na slabších zařízeních.
- **Napojení na e-shop:** Vybraná varianta se přenese do košíku se správnou cenou a skladovou položkou. Funguje na běžných platformách.
- **Záložní statické verze pro slabší zařízení:** Pokud zařízení 3D nezvládne, stránka zobrazí kvalitní statický obrázek. Nikdo nezůstane s prázdnou plochou.

## Varianty a nástroje

- **Three.js:** Nejrozšířenější knihovna pro 3D v prohlížeči. Stará se o scénu, kameru, světlo a materiály a má velkou komunitu i množství rozšíření. (Scéna a kamera, Světlo a materiály, Rozšíření)
- **React Three Fiber:** Three.js zapsaný jako React komponenty. 3D scéna se tak skládá stejně jako zbytek webu a snadno se napojí na stav aplikace. (React komponenty, Drei, Next.js)
- **WebGL:** Technologie v prohlížeči, která využívá grafickou kartu. Na ní běží všechno ostatní, proto hlídáme výkon a kompatibilitu zařízení. (Grafická karta, Kontrola výkonu, Záložní režim)
- **Formát glTF:** Standardní formát 3D modelů pro web, někdy nazývaný „JPEG 3D“. Obsahuje geometrii, materiály i animace v malém souboru. (glTF / GLB, Draco komprese, Export z Blenderu)

## Časté otázky

**Zpomalí 3D web?**

Při správné optimalizaci ne. Model zmenšíme, načítáme ho až v potřebnou chvíli a do té doby ukážeme obrázek. Rychlost stránky měříme před spuštěním i po něm.

**Funguje to na mobilu?**

Ano. Scénu přizpůsobíme výkonu zařízení a na nejslabších telefonech zobrazíme záložní statickou verzi. Ovládání je upraveno pro dotyk.

**Napojíte konfigurátor na Shopify nebo WooCommerce?**

Ano. Vybraná varianta se přenese do košíku jako běžná položka s cenou a skladem. Postup se liší podle platformy a konkrétní konfigurace.

**Kolik to stojí?**

Interaktivní 3D na webu začíná od 5 000 Kč podle složitosti modelu a toho, jestli jde o prohlížeč, nebo konfigurátor. Přesnou nabídku pošleme po zhlédnutí podkladů.

---
Zdroj: https://www.virtuex.cz/co-tvorime/3d-grafika/3d-na-webu
Kontakt: info@virtuex.cz, +420 774 865 508
Další služby: https://www.virtuex.cz/llms.txt