Goals for a 3D Model Viewer

My hopes and dreams for a 3D CAD model viewer may be nitpicky and particular, but they’re mine. I’m planning to write about CAD models, and I want to point to details in an interactive web viewer. I started a list of goals when I decided to begin with model-viewer, and I’ve added to it.

• annotations (hotspots)

  I need to be able to add a caption to a model feature and to move the camera to show a specific view of an annotation.

• component visibility

  I need to be able to hide or show specific components of a model. For instance, I need to be able to show and hide the lid of a box.

• show dimensions

  I need to be able to add the overall dimensions of a model.

• banana for scale

  This is silly, but I’d really like the ability to add a banana next to a model. Per Know Your Meme, the earliest instance of a person posting a photo online with a banana for scale was in 2005 on the blog Rock Dog Designs. Using the Wayback Machine, I found the original post. "I don’t know how big the screen is, we’re moving and I can’t find the tape measurer. But I do have a banana. For scale. Oh wait, my husband says it’s 19inches [sic]. Oh well, I’ll leave the banana for interest. Please be interested." Other folks have made an STL viewer with a banana for scale, and you can add a banana for scale in KiCad.

• Augmented Reality (AR) / Virtual Reality (VR)

  It’d be nice if it were easy to use a mobile device to see what a model looks like on a desk or in a visitor’s particular environment, and it’d be nice if it were easy to use a VR headset to interact with the model.

• rendering the models I want to use well

  There’s a lot I don’t know about 3D rendering, and a viewer that does great rendering shoes or models from video games might not automatically do well rendering the CAD models I want to show.

• open source

  I wrote more about why I want to use an open-source viewer in “Choosing a 3D CAD viewer”, but one reason is that I need to be able to modify the viewer.

• not reliant on centralized service or hosting

  I want to be able to host my own models and the viewer itself. If the viewer changes, I don’t want to be forced to quickly update my site. I wrote more about this in “Choosing a 3D CAD viewer”.

• quick to load

  Adding the viewer to a page shouldn’t make the page slower in a way that people can tell. Real-world web performance is more complicated than Lighthouse scores, but the viewer should still allow perfect Lighthouse scores on mobile and desktop.

• low page weight (data)

  If a visitor doesn’t interact with the viewer, the browser shouldn’t need to download much extra data.

• accessibility

  This isn’t a complete list, but it should work well for folks without JavaScript, with vision impairments or with a screen reader, with older browsers, with slower connections, with limited or metered data, and even to folks who like printing things.

• support progressive enhancement

  Adding a 3D viewer to a page shouldn’t break the page for folks who can’t use the viewer. One option has the an image with good alt text and a caption, and the interactive viewer seamlessly replaces the image. If the viewer doesn’t load, the visitor still gets the image.

§ Next Steps

Next, I’m going to load an example CAD model into model-viewer and see how it fares.

• 08 March 2024
• • web,
  • computers

If this was helpful or enjoyable, please share it! To get new posts, subscribe to the newsletter or the RSS/Atom feed. If you have comments, questions, or feedback, please email me.