MARSHAL / PRACTICAL GUIDE
Updated
Does your website need 3D? Only where it shows what a photo cannot.
A 3D website is worth building when visitors need to see something a photograph or video cannot show well, such as a product turning in the hand, a space to walk through or a part that assembles. For most service businesses, a fast ordinary website does the job better. If you do add 3D, keep every word in normal HTML, give phones a lighter version and price the 3D as its own line on the quote. Marshal’s own homepage, built with three.js, is an example you can open on a laptop and then on a phone.
Open the Marshal homepage on a laptop, then on a phone ↗A practical guide from Marshal Studios. Explore the linked project examples and use the checklist for your own brief.
Know what counts as a 3D website
Here, a 3D website draws real three-dimensional objects in the browser, usually through WebGL with a library such as three.js or a tool such as Spline, using models in glTF or GLB format. Most projects use one of three patterns: a scene at the top of the page, a story that moves as the visitor scrolls, or a product viewer where the buyer turns, zooms or changes a finish. A product film rendered from 3D software is lighter: the visitor watches it rather than handling it.
Use 3D only where it answers a buying question
Write down the question the 3D will answer for a buyer: how a sofa looks from every side, how a flat is laid out before it is built, how a product folds or fits together. If the honest answer is “it makes us look premium”, strong photography or a short product film may do the same job with far less weight.
Keep every word in HTML, not inside the scene
A WebGL scene is drawn onto a canvas element as pixels, not text. Search engines and AI answer tools read the page’s HTML. Keep the headline, product details, prices, navigation and contact routes in normal HTML beside or over the scene, so the page still makes sense if the 3D never loads. On the Marshal homepage, all of the copy is ordinary page text and the WebGL scene draws behind it.
Plan the phone version first
Many visitors arrive on a phone over mobile data, so decide what a phone gets before design starts: a lighter model, a lower rendering resolution or a still image in place of the scene. Respect the phone’s reduce-motion setting by stopping auto-rotation and scroll animation. The Marshal homepage loads a static version, with a still image in the hero, on phones, on devices with limited memory or processor cores, and on browsers without WebGL 2. The content stays the same; only the scene is swapped.
Set a performance budget before the design is approved
Google’s Core Web Vitals give clear targets: the main content should appear within 2.5 seconds (Largest Contentful Paint), the page should respond to a tap within 200 milliseconds (Interaction to Next Paint), and layout shift should stay under 0.1. Google measures these on real visits, so a fast laptop demo proves little. Show a still poster image first, load the scene only when it scrolls into view, compress models and textures, and record each scene’s file size. After launch, check the Core Web Vitals report in Search Console.
Know where the models come from and who owns them
Models can come from a manufacturer’s CAD files, which usually need cleaning and simplifying for the web, or be modelled from photographs and measurements, which is separate work. Agree who supplies reference material, who approves colours and finishes, and what you receive at handover: editable source files, web-ready exports and a note on how to replace a model. A new colour or finish usually means exporting the model again.
Price the 3D as a separate line
Published starting prices for 3D work vary widely and often hide what is included. Ask every provider to split the quote into the website itself, modelling, the 3D build, the phone fallback, testing on real devices and handover, then compare like with like. At Marshal Studios, 3D work is scoped and priced per project, based on the number of scenes, where the models come from and how interactive each scene needs to be.
Choose the lightest format that answers the question
| Format | Good for | Weight on a phone | Who changes it later |
|---|---|---|---|
| Strong photography | Most products and services | Light when images are sized properly | Anyone who can update the website |
| Pre-rendered product video | Showing a product move, assemble or catch the light | Moderate; plays like any web video | Re-rendered in 3D or editing software |
| Product viewer with a GLB model | Letting a buyer turn and zoom one product | Depends on the model’s size | Swap the model file |
| Spline scene | A simple interactive scene in one section | Depends on the scene; less control over loading | A designer in the Spline editor |
| Custom three.js scene | Scroll stories, configurators, full control over loading | Depends on the build; plan a fallback | A developer, in code |
Check before a 3D page goes live
| Check | How to test it |
|---|---|
| Text is in HTML | Turn off JavaScript or view the page source: headline, details and links should still be there |
| Something appears at once | A poster image or still frame shows before the scene finishes loading |
| Phones get a lighter version | Open the page on a mid-range Android phone over mobile data, and on an iPhone |
| Reduce motion is respected | Turn on the device’s reduce-motion setting; rotation and scroll animation should stop |
| No-WebGL fallback works | The page still reads and the next step still works if the scene cannot start |
| Speed is measured | Run PageSpeed Insights before launch; check Search Console’s Core Web Vitals report once real visits arrive |
Published figures we found (checked 17 October 2026)
| Provider | Published figure | Notes | Source |
|---|---|---|---|
| BtechWaleTech (freelance developers, India) | From ₹10,000 for a site with one 3D scene; from ₹50,000 for a store with 3D product viewers; from ₹60,000 for a custom three.js build | Starting prices; states 2–3 weeks for one 3D scene and 6–12 weeks for a custom build | btechwaletech.in/3d-website-design |
| studiokalex, New Delhi | From ₹70,000 in India (US$1,500 elsewhere) for a 3D website | Stated to cover the site, 3D scenes and Blender models; configurators or CAD work cost more. 3–5 weeks for a scene on an existing site, 8–12 for a full 3D site | kalex.studio/services/3d-websites |
| Google Search Central | Core Web Vitals “good” thresholds: LCP 2.5 s, INP 200 ms, CLS 0.1 | Measured on real visits | developers.google.com/search/docs/appearance/core-web-vitals |
Before we start
Will a 3D website hurt my Google rankings?
Not by itself. Problems come from text locked inside the scene and slow loading on phones, both covered above.
Does Marshal build 3D websites?
Yes. Our own homepage uses three.js, with a static version for phones and low-powered devices. 3D work is scoped and priced per project.
LET’S MAKE IT
Tell us what you have in mind.
Based in Gurugram (Gurgaon), working with businesses across Delhi NCR, India and abroad. Business websites start from ₹50,000.