Why You Should Share a 3D Model of Your Hardware Product
We recently released an online 3D model of our Form 2 3D printer, in conjunction with a pictorial glossary. This resource aids both our Customer Care team and our users in diagnosing and solving problems with their machines.
3D in the web, or WebGL, is relatively new, and not many hardware companies have incorporated it in troubleshooting workflows. Integrating this rich media content with our traditional troubleshooting documentation enables us to augment all aspects of our support process by offering our Customer Care agents and Knowledge Management personnel the ability to show complex relationships between parts and create “photographs” of components to integrate into Help Center articles.
With this resource, we’re enabling our customers to explore the inner workings of their machine without having to take it apart by hand, allowing them to be more confident when repairing internal issues.
While some e-commerce companies have started using 3D models to help drive sales (here’s one example), not many hardware startups have taken advantage of this format for support. This post will discuss the benefits we hope this 3D model will provide our users and team, as well as the process we used to create the model itself.
Why Share a 3D Model Online?
Typically, support documentation is either printed or posted online, in video or text format. What users of technology once found in instructional manuals is now found online.
Good text manuals, like standard help center content or manuals shipped with a product, are worth their weight in gold. However, they often struggle to convey a concept — the most oft-repeated example is an IKEA furniture assembly guide. I’ve watched friends put parts on backwards, leading to funny but frustrating end results.
Online manuals are easier for support teams to keep updated than physical collateral, and they can be enriched with rich video content.
At Formlabs, we’ve found short .WEBM videos very helpful for explaining operations to users. For example, in our Help Center, we’ve included .WEBM animations in articles like “Set Up Your Form 2”. We can also bolster this content with fully-voiced video tutorials.
However, producing these videos, even short clips, takes a lot of work and coordination between departments. To produce professional videos and photos, we have to coordinate with our creative and marketing teams. Creating a model that’s easy to take screenshots of puts the power directly in the support team’s hands.
By using a 3D model, support agents can create their own images from anywhere, and don’t have to organize time with the content teams or photographers to set up the printer in a white box area. We don’t have to reserve photo booth time, and “reshoots” are a breeze.
The 3D model of the Form 2 also allows us to create animated walkthroughs of various procedures. Within any of our troubleshooting guides, we can now include a link to an animated model that shows the disassembly — which customers can see from any angle. This addresses not just time constraints but also the “IKEA manual” issue, enabling users to zoom into question areas if something isn’t immediately visible from the traditional zoomed-out view of a real life camera.
From CAD Model to Online Glossary
Now that I’ve explained why we opted to post this model online, let’s delve into how we prepared the model for posting on Sketchfab.
Optimize the Model
It all started with the original CAD model of the Form 2. This was extremely heavy, with lots of extra parts — the folks in engineering certainly do their homework!
The first issue we ran into was the exhaustive detail of the model, which made it difficult to work with. We worked to remove or hide excess geometry that wasn’t essential to troubleshooting. We also hid geometry in the scene that we weren’t working on. This saved graphical memory and allowed us to work smoothly on items that we were focused on.
The second issue we had was that we needed to make at least an attempt at optimizing the mesh. Sketchfab is a real-time render engine, and the less polygons in the mesh, the faster it will load and the smoother it will render.
However, SolidWorks (the software used by our team) uses B-Rep solids and NURBS surfaces. The only way to convert the former to the latter is to use the “Export as .STL” command, but this creates geometry too polygon-heavy to be reliably displayed in a web browser.
We navigated around the geometry detail issue by rebuilding a core list of components in CAD as simpler geometry: removing bumps and divots, screws, and many smaller details not readily apparent or necessary to convey what the component does. We then exported these models as .STLs using the lowest possible resolution.
Any software that can read B-REP models can be used for this, such as SolidWorks, Fusion360, Onshape, etc. and all modeling software can export to either .STL or .OBJ (another type of tessellated 3D poly format).
This process allows us to put mostly accurate CAD data online without worrying about any design secrets leaking out into the open (though realistically, any user could probably just open the machine and take measurements, it’s still good to be careful).
Annotate the Model
Once the .STLs were exported, we brought them into a single scene using Modo, a computer graphics application similar to Maya. There, we created several labeled sub-objects, and moved each component’s polymesh geometry into those sub-objects for organizational purposes.
As all of this progressed, we also created material definitions for each component. This basically involved selecting the component and adding a material such as “Black Metal,” “Black Plastic,” or “PCB.” Sketchfab uses these material definitions to give each component color.
Once we simplified, exported, then imported and assigned materials to all of the components, we worked on creating the wiring. For this, we used Modo’s spline tool: similar to a 3D NURBS spline. By positioning the splines manually from port to plug, we were able to create a realistic wiring setup, which was important to give users a sense of what they were looking at (since the real machine, of course, contains lots of wiring).
Animate the Model
Finally, it was time to animate the model. For this, we also used Modo. The printer started in the closed state, then we created keyframes along a timeline for the new location of each part. Fine control over the movement of each component was provided by adjusting movement splines in the graph editor.
Upload the Model
Once this was all completed, we exported the model as a .FBX with its animation, then loaded it into Sketchfab. There, we used Sketchfab’s material system to assign colors, reflectiveness values, etc. to all of the material definitions we had created earlier. The last step was to create notations using Sketchfab’s editor.
The Future of Hardware Support
By taking advantage of the benefits of WebGL and web 3D displays, we created a more detailed, informative, and helpful manual than ever before. Our support team is more empowered, our knowledge management systems are easier to work with, and our customers have a new way to build confidence before attempting repair procedures on our machines.
Hardware support gained a huge boost from the introduction of web-based manuals, followed by easily accessible explanatory videos. Interactive web-based 3D is the next evolution of hardware support content.
