Vodic za ugradnju
Kada vec imate 3D model proizvoda, postavljanje na sajt je resen problem: Google-ov model-viewer web komponent resava prikaz, rotaciju, zum i prelazak u AR u par linija koda. Teza pitanja su odakle dolaze GLB i USDZ fajlovi, ko ih hostuje i kompresuje, i ko ih odrzava kada se proizvod promeni. Ovaj vodic pokriva i uradi-sam put i vodjeni put, iskreno.
Tri stvari: GLB fajl proizvoda (standardni format za web i Android AR), opciono USDZ fajl istog proizvoda za iPhone AR (Quick Look koristi USDZ, ne GLB), i Google-ov model-viewer web komponent za prikaz. Nista drugo nije potrebno — model-viewer je jedan script tag i jedan custom HTML element.
Ucitajte model-viewer preko script taga koji pokazuje na Google-ov CDN build, zatim dodajte model-viewer element na stranicu sa src atributom koji pokazuje na vas GLB fajl, ios-src atributom koji pokazuje na vas USDZ fajl, ar i camera-controls atributima koji ukljucuju pokretanje AR-a i rotaciju povlacenjem, i poster atributom koji pokazuje na staticnu sliku dok se 3D fajl ucitava. To je cela ugradnja: jedan script tag, jedan custom element, cetiri do pet atributa.
Velicina fajla i kompresija: nekompresovan GLB direktno iz vecine 3D alata moze imati 20-50 MB, sto ce zaglaviti na mobilnom; Draco kompresija geometrije i kompresovane teksture obicno spuste modele namestaja na par megabajta bez vidljivog gubitka kvaliteta. Hosting i CORS: GLB i USDZ fajlovi moraju biti posluzeni sa ispravnim CORS zaglavljima ili model-viewer moze tiho da ne uspe da ih ucita sa drugog domena. Poster slike: bez postera, kupac na sporoj vezi vidi prazan pravougaonik dok se model ucitava, sto deluje kao da je pokvareno. Tacna razmera: AR ubedjuje samo ako je stvarna velicina modela tacna — sofa koja se prikaze u pogresnoj velicini narusava celu poentu prikazivanja u AR-u, pa izvorna geometrija mora imati tacnu sirinu, visinu i dubinu ugradjenu pre izvoza.
Na WordPress-u i WooCommerce-u mozete rucno upisati model-viewer kod u blok ili sablon, ili koristiti plugin koji to radi umesto vas — Augmenta AR plugin, na primer, dodaje shortcode, Gutenberg blok i Elementor widget koji ugradjuju hostovani pregledac bez da sami dirate GLB fajl. Na Shopify-u, nativna podrska za 3D medije znaci da mozete direktno otpremiti GLB u Media polje proizvoda u admin panelu, a Shopify ga prikazuje sopstvenim plejerom baziranim na model-viewer-u na stranici proizvoda, bez potrebe za aplikacijom. Na svakoj drugoj platformi, obican iframe koji pokazuje na stranicu sa model-viewer kodom radi svuda gde je script tag dozvoljen, sto pokriva veliku vecinu graditelja sajtova.
Da budemo fer prema uradi-sam putu: ako vec imate GLB i programera, ugradnja kosta gotovo nista. Ono sto vodjena usluga poput Augmente stvarno dodaje je korak pre ugradnje: pretvaranje fotografija proizvoda u 3D model (vecina prodavnica namestaja uopste nema GLB za ugradnju), izrada i GLB i USDZ iz istog izvora da bi iPhone AR radio, kompresija podesena za geometriju i materijale namestaja, CDN hosting da bi se fajlovi brzo ucitavali globalno, ponovno generisanje modela kada se promeni zavrsna obrada ili dimenzije proizvoda, i analitika pregleda i interakcija da znate koji proizvodi se stvarno rotiraju i pokrecu u AR-u. Nista od toga nije potrebno da ugradite jedan fajl koji vec imate — to je ono sto je potrebno da imate odrzavan katalog tacnih, brzih 3D modela.
Ako vec imate 3D izvorne fajlove (ili nacin da ih napravite) i programera koji moze da odrzava hosting, CORS, kompresiju i azuriranja, uradi-sam put sa model-viewer-om je sasvim u redu i ne kosta nista osim hostinga. Ako imate samo fotografije proizvoda, nemate 3D tim i nemate zelju da iznova gradite proces svaki put kada se SKU promeni, gotova usluga koja isporucuje zavrsen GLB/USDZ par plus hosting je brzi i trajniji put. Mnoge prodavnice pocnu sa jednim rucno ugradjenim glavnim proizvodom da nauce format, pa predju na vodjeni proces kada im zatreba za ceo katalog.
Uzivo
Cesta pitanja
Ili od 3D dizajnera ili CAD izvora ako postoji, ili od samostalnog alata za pretvaranje slike u 3D ako ste spremni sami da pregledate i popravite rezultat, ili od vodjene usluge koja generise i proverava kvalitet modela iz fotografija proizvoda umesto vas, kao sto radi Augmenta.
Samo ako zelite AR na iPhone-u. Apple-ov Quick Look AR pregledac zahteva USDZ; nece otvoriti GLB. Android-ov Scene Viewer i desktop/mobilni browseri rade direktno sa GLB, tako da je USDZ striktno dodatak za iOS AR, a ne zamena.
Ne ako je pravilno podesena. Ucitajte model lenjo (samo kada udje u vidno polje ili na interakciju), kompresujte GLB sa Draco kompresijom i kompresovanim teksturama, i uvek prikazite poster sliku da stranica ima nesto da prikaze odmah. Neoptimizovan GLB od desetina megabajta ucitan odmah na svaki pregled stranice je ono sto izaziva usporenje kojeg se ljudi plase, ne 3D sam po sebi.
Da, na oba. Shopify ima nativnu podrsku za 3D modele u Media polju proizvoda, bez potrebe za aplikacijom za osnovni prikaz. WordPress/WooCommerce zahteva ili rucno pisan model-viewer kod ili plugin — Augmenta AR plugin dodaje bas za to shortcode, Gutenberg blok i Elementor widget.
Da. Ar atribut u model-viewer-u pokrece ugradjeni AR pregledac svake platforme direktno iz browsera: Quick Look na iPhone-u i Scene Viewer na Android-u. Nijedna platforma ne zahteva preuzimanje aplikacije.
Jedan script tag koji ucitava model-viewer sa CDN-a, i jedan model-viewer element sa src koji pokazuje na vas GLB, ios-src koji pokazuje na vas USDZ, plus ar i camera-controls atributi. To je funkcionalna, rotirajuca, AR-sposobna ugradnja.
Pokazite kupcu kako proizvod izgleda u prostoru, zatim pratite da li se vraca ka prodavnici.