Sfoglia categorie
Esplora
Fiverr Pro
Italiano
$
USD
Costruirò un configuratore di prodotti 3D e un visualizzatore interattivo usando threejs
julius F
Informazioni su questo servizio
Traduzione automatica.
Permetti ai tuoi clienti di vedere esattamente cosa stanno acquistando in full 3D, prima di cliccare su "aggiungi al carrello".
Costruisco configuratori di prodotti 3D personalizzati e visualizzatori interattivi usando Three.js e React Three Fiber, applicazioni WebGL in tempo reale che permettono ai clienti di ruotare, zoomare e personalizzare il tuo prodotto dal vivo nel browser. Nessuna installazione di app, nessun limite di plugin, nessuna restrizione sui template. Solo codice personalizzato costruito intorno al tuo prodotto, alle tue opzioni e al tuo brand.
Stack tecnologico:
- Three.js
- React Three Fiber (R3F)
- Drei
- WebGL / GLSL
- GLTF / GLB / USDZ
- WebGI
- GSAP
- Next.js
- PlayCanvas
Caratteristiche del configuratore che costruisco:
Switching di colore e materiale in tempo reale cliccando su una tavolozza, visualizza subito l'aggiornamento del modello 3D
Toggle di visibilità delle parti per mostrare/nascondere componenti (add-on, accessori, varianti)
Mapping delle texture: applica texture, pattern o decalcomanie personalizzate sulla superficie 3D in tempo reale
Controlli orbitanti a 360°: trascina con mouse/touch per ruotare, pizzica per zoomare
Illuminazione ambientale HDRI: illuminazione realistica che si aggiorna con le modifiche ai materiali
Modalità vista esplosa: separa le parti del prodotto per mostrare i componenti interni
Transizioni animate: movimenti fluidi della telecamera tra stati di configurazione
Pulsante screenshot/condividi
Rispettare i diritti di terzi
Ricorda che è contrario alle politiche di Fiverr per i freelance includere temi, modelli o qualsiasi altro elemento che violi i diritti di terzi o le leggi applicabili nell'opera consegnata. Per saperne di più, consulta Guida alla creazione digitale responsabile.
Scopri di più su julius F
julius F
I create stunning, high performance Framer websites with modern UIUX
- DaStati Uniti
- Membro dadic 2025
- Tempo di risposta medio1 ora
Lingue
Inglese, Spagnolo
Hi, I’m a Framer website designer focused on building visually stunning, high-performance websites for startups, SaaS products, and personal brands. I turn ideas into modern, interactive, and conversion-ready websites using Framer.
I combine UI/UX design expertise with Framer’s advanced animations and components to create websites that are fast, responsive, and easy to edit—no coding required.
Traduzione automatica.
FAQ
Traduzione automatica.
Tipi di prodotti che ho configurato:
Mobili · Calzature / scarpe · Orologi · Gioielli · Abbigliamento · Elettronica · Veicoli / biciclette · Imballaggi · Attrezzature industriali · Regali personalizzabili
Competenze del venditore
Three.js React Three Fiber WebGL / GLSL Configuratore di prodotti 3D Ottimizzazione GLTF / GLB Next.js / React Animazione GSAP PlayCanvas WebGI USDZ / AR Quick Look Integrazione Shopify Ottimizzazione delle prestazioni
Parole Chiave di Ricerca
Configuratore di prodotti · configuratore 3D · threejs · webgl · react three fiber · visualizzatore 3D · interattivo 3D · sito web 3D · modello 3D · configuratore · three js · glb · usdz · interattivo 3D · configuratore webgl · webgi · prodotto 3D · playcanvas · design di prodotti 3D · animazione gsap · configurazione 3D
In quale formato deve essere il mio modello 3D?
Preferisco GLTF o GLB — sono il formato nativo per Three.js e R3F e offrono le migliori prestazioni sul web. Accetto anche FBX, OBJ, STL e file Blender .blend che converto e ottimizzo come parte del processo di build.
Puoi gestire un prodotto con decine di opzioni e combinazioni di configurazione?
Sì — le matrici di configurazione complesse sono pienamente supportate. Uso un approccio a macchina a stati: ogni parte configurabile ha un insieme definito di stati, e cambiare un'opzione attiva uno scambio di materiale, mesh o toggle di visibilità sull'oggetto 3D corrispondente. Per prodotti con centinaia di combinazioni
Come funziona l'integrazione nel carrello con Shopify?
Quando un cliente finalizza la sua configurazione, mappo le sue scelte agli ID delle varianti di prodotto Shopify usando l'API Storefront. La configurazione selezionata (colore, materiale, scelte delle parti) viene codificata come metadati delle varianti o proprietà dell'elemento e passata al carrello con la chiamata API di aggiunta al carrello
Cos'è USDZ e serve funzionalità AR?
USDZ è il formato di file 3D di Apple per AR Quick Look — quando un utente iOS tocca il pulsante AR, il prodotto si apre nella visuale della fotocamera alla scala reale usando LiDAR o ARKit del telefono. È uno strumento potente per mobili, calzature e articoli per la casa, dove la percezione delle dimensioni è importante per gli acquirenti. Andr
Il configuratore sarà abbastanza veloce sui dispositivi dei clienti medi?
Sì — l'ottimizzazione delle prestazioni è integrata nell'architettura, non aggiunta in fase finale. Uso la compressione geometrica DRACO (tipicamente riduzione del 70–90% delle dimensioni del file), compressione delle texture KTX2, materiali istanziati per evitare di moltiplicare le chiamate di disegno, e caricamento progressivo per mantenere l'interfaccia fluida.
Puoi aggiungere una funzione "screenshot e condivisione" così i clienti possono salvare la loro configurazione?
Sì — questa è una funzione Premium ed è disponibile come aggiunta Standard. La funzione screenshot rende il canvas 3D corrente in PNG usando renderer.domElement.toDataURL() di Three.js — cattura esattamente ciò che è sullo schermo in alta risoluzione. Per URL condivisibili, lo stato della configurazione corrente viene codificato
