An Interactive 3D Portfolio for Coats Automotive
Coats
Coats is the world’s largest industrial thread company. One of their sector verticals is the development of innovative composite solutions for the automotive industry.
Coats’ agency: Vismedia
Vismedia is a creative agency specialized in immersive and interactive experiences. They have worked for major companies like Unilever, Ernst Young, and the Intercontinental Hotels Group.
Most recently, Vismedia has helped Coats to showcase their innovative products for the automotive industry, using an interactive 3D configurator developed on top of Sketchfab’s Viewer API.
Try the 3D product configurator here and watch the demo below:
Coats’ challenges
Coats develops composites and technologies for the automotive sector. These innovative products are hidden inside the car (e.g., in the seats and in the wheels). Consequently, traditional ‘passive’ content (such as images, PDFs, or videos) can make it difficult to demonstrate hidden innovations; it struggles to catch and hold consumers’ attention and is insufficient to showcase Coats’ expertise and quality.
“When organizations use ‘passive’ content to talk to their customers (like traditional videos, downloadable PDFs), they run into a problem: ‘passive’ can’t hold focus or attention.”
—Santi Sarapinas, Creative Director, Vismedia Agency
Goals
- Create an interactive web experience to showcase Coats’ portfolio of automotive products
- Catch and hold consumers’ attention
- Reveal the innovative features and components developed by Coats
- Make it easy to explore and interact with the product to educate prospects
- Generate more interest, leads, and clients
- Be able to share the experience with the largest possible audience
“We realized that traditional media was not the right solution for Coats and we needed to bring extra layers of interactivity to this project.”
—Santi Sarapinas, Creative Director, Vismedia Agency
Solution
An interactive 3D configurator
- Vismedia developed this 3D configurator for Coats using the Sketchfab Viewer API and Coats’ existing 3D models.
- The 3D configurator is directly accessible on the Coats website
Creation process
Step 1: Optimizing 3D models
Vismedia optimized the geometry and textures of the existing 3D models for web use.
Step 2: Choosing Sketchfab
Vismedia chose Sketchfab for the following reasons:
- Sketchfab’s platform provides the ability to:
- Host files and upload revisions quickly and reliably
- Easily share 3D models with clients without needing a specific software or plugin
- Have high-quality shaders, textures, and rendering
- Sketchfab’s API allows Vismedia to create:
- Custom and interactive experiences such as 3D configurators
- A 3D configurator developed using Sketchfab’s API:
- Is embeddable on any website
- Is accessible from any modern device and browser
- Maintains model texture quality on the web
“After extensive research, we settled on Sketchfab, which was a perfect solution for our business. We have had a great experience with Sketchfab support, especially with API implementation, and we managed to achieve our goals swiftly.”
—Santi Sarapinas, Creative Director, Vismedia Agency
Step 3: Hosting the 3D models on Sketchfab
Once optimized, Vismedia uploaded the 3D models to its Sketchfab account.
Step 4: Developing the 3D configurator using Sketchfab’s Viewer API
- Vismedia’s developers created a custom 3D Configurator using Sketchfab’s API.
“The Sketchfab API was intuitive and easy-to-use.”
—Santi Sarapinas, Creative Director, Vismedia Agency
- After multiple tests, Vismedia was satisfied with the product experience and delivered the 3D configurator to their client, Coats.
Results
- Coats’ 3D configurator is a powerful tool to engage with customers: it allows visitors to explore the different automotive components in 3D, zooming in and out.
“We knew that interactive web was the future.”
—Santi Sarapinas, Creative Director, Vismedia Agency
- The 3D configurator allows prospects to educate themselves on the hidden components layered beneath the surface of the car: they can hide or show geometry and remove different layers of the vehicle to reveal where and how Coats products are used.
- The menu on the right side of the configurator divides the guided tour of the car by key areas (front, wheel, door, seat, infotainment, floor, back) and provides detailed information on components.
“The interactive web experience has enabled us to educate customers better and ultimately increase sales. This interactive 3D solution allowed us to demonstrate our innovations to a wider audience using the web.”
— Carla Griffin, Global Head of Marketing Communications, Coats
June, 2020
