Raise your hand if you’ve watched a movie or played a video game in the past 20 years. Keep those hands up if you’ve ever been in a car, or a building, or used a smartphone. Most of the modern world we live in, from the entertainment we consume to the products and spaces we use, has been designed using 3D technology. Although 3D tech permeates our existence, it has only recently gained traction as a creative tool on the web. It’s not yet commonplace, but evolutions in technology and bandwidth have been a catalyst for a boom in websites and apps utilizing 3D. And with the explosion of augmented and virtual reality devices, we are approaching a new dawn of interactive 3D experiences.
Perficient’s innovation lab team has been playing in the interactive 3D space for over five years and I thought it was time to share some of our learnings – why it’s effective, when to use it, and what we think is in store for the future of interactive 3D.
Interactive 3D 101
First a quick review of what it is, so we’re all on the same page. When I talk about interactive 3D, I’m talking about three-dimensional virtual objects rendered in a web browser or app. Usually the 3D objects are representing a space like a building or a product like a car, but we shouldn’t be limited by these constructs. Sometimes simple two-dimensional user interface elements are built in 3D in order to give flat objects a sense of depth. These experiences are often interactive and animation usually plays a role in the experience.
Interactive 3D experiences aren’t new. In fact, in technology years, they’ve been around forever. The first experiences were built back in the early days of the internet using a language called VRML. Flash was the next big technological advancement, giving the tools to build fairly impressive 3D websites to a wider audience, albeit at the expense of a plugin. We are now living in the era of WebGL, a web standard that renders 3D objects in the browser natively. Teams like mine use a Javascript framework called Three.js to build immersive 3D experiences, using a language we are well-versed in.
These experiences are certainly becoming more accessible and easier to build, but it begs the question: Why even build an interactive 3D experience in the first place?
Why 3D Is Effective
Though there has been a recent boom in websites that incorporate 3D elements, a vast majority of sites on the internet today are ‘flat’ – a collection of 2D components arranged in layouts, organized into pages or screens. This is the web most people think of: search engines, news sites, video sites, blogs, the list goes on.
Increased Dwell Time
Incorporating 3D on a site adds depth and visual quality that increases dwell time. Anecdotally, we have seen large spikes in time spent on sites we’ve built with 3D components. The richness generated by 3D elements elevates a site/app above competitors in the same way the features and styling of a luxury car distinguish it from a conventional car. Customers can tell the difference between a company that invests in its digital presence and one that doesn’t.
Representation of Reality and Fiction
As technology has advanced, the quality of interactive 3D has significantly increased. This makes 3D ideal for representing realism digitally. Photos and videos can only go so far. A customer can get a deeper understanding of your product if you let them interact with it: turn it, push buttons, expose inner-workings with exploded views.
3D is also one of the best ways to represent fiction: worlds that don’t exist, futuristic effects, things we can’t see in reality. Video games and movies have been using 3D objects to build fictional worlds for decades. In the same way, we can transport users to new worlds by building web/app-based 3D experiences.
Immersion
Everyone who creates a website or app wants their customer/user/reader to be immersed in their content. Brands want customers to identify with their story, consumer goods companies want people to connect with their product, and editors want readers to digest and remember their stories. 3D introduces depth that hints at something more around the corner or behind an object, encouraging users to keep exploring. Immersive 3D can have an enchanting effect on users. Look at how effective video games are at immersing a player in a world. This means users are spending more time with your story and etching a more memorable experience into their brains.
Innovative Navigation
Interactive 3D offers the possibility of unique methods of navigation. The web traditionally relies almost solely on top-level navigation and scrolling. With 3D, users can walk through a building, take a car for a spin, click and zoom to different areas on a map, and more. These experiences are not limited by the construct of a page. By designing innovative navigation, we can break free of the mouse wheel and lead users on a journey.
When to use 3D
Not every website or app calls for a 3D experience, but there are some specific cases where 3D can transform an average experience into an incredible experience.
Space Visualization/Exploration
Perhaps the most popular, 1:1 use case for 3D is spatial visualization and exploration. Creating a 3D digital representation of space is arguably the best way to give a user a realistic sense of actually being in that space when they can’t physically be there. Sometimes a 3D model is the only way a particular space can be represented. This was the case when we built the Park at Wrigley website (now Gallagher Way) – the park was under construction at the time, so there weren’t any photos available, but we found a way to showcase the features of the park using an interactive 3D map.
Potential use cases:
- Building/home showcase
- Historical place exhibits
- Visualizing the world of a film or video game
Product Visualization
Product companies like Apple have been using 3D to visualize their products for years. The amount of control 3D allows them is a huge benefit. Products can be presented to customers in a curated digital environment, breaking down physical barriers that may prevent a customer from considering a product. Giving users something they can spin, manipulate, and interact with connects them more closely to the product. And because these products exist in live code, they can be changed, transformed, and customized by producer and consumer alike.
Potential use cases:
- Car/truck configuration
- Virtual clothing model
- Exploded detail view of an industrial product
Builders
You’ve probably seen construction or home improvement tools that allow you to build a kitchen or try different paint options in a room. This type of experience can be particularly enhanced by interactive 3D when constructing complex parts – things that can’t easily be demonstrated in a 2D visualization. With 3D, a user can get a more realistic feel for how everything connects, the scale, and the qualities of parts.
Potential use cases:
- Home improvement how-tos
- Interior designer app
- Furniture assembly instructions
- Architecture massing
- STEM tools for kids
Data Visualization
One of the most exciting areas of exploration in interactive 3D is the visualization of data. We see this technique used frequently by news organizations to show data across geographic space. The visual third dimension allows data designers to add a corresponding data dimension that couldn’t otherwise have been seen.
We used this technique on the CNN Magic Wall. By entering a 3D view of a state, a user can view party voting data per county by color-coding, and demographic data by the height of the county. So one could quickly see that senior citizens voted more heavily Republican in rural counties, for instance. Giving users the ability to manipulate and view 3D data puts the power in the hands of the user and allows them to understand data in ways that make sense to them.
Potential use cases:
- News stories featuring complex data
- Digital annual reports
- Geographic data maps
Storytelling
Digital storytelling can take many forms – from long-format news articles to brand marketing. The dynamic nature of 3D content makes it an excellent addition to the storytelling toolkit. It’s a method for moving beyond the static 2D illustration or photograph. And unlike video, users can experience the entire space of the scene.
Interactive 3D is especially useful when telling stories about places, like we did with The Atlantic: Population Health article series. In collaboration with journalists at The Atlantic, we designed and built interactive articles about population health in three different locales. Each locale was represented as a 3D environment. As the user scrolled through the article, the 3D scene seamlessly transitioned to new locations within the city or pulled out to a birdseye view to visualize data mapped on the city landscape.
Locations aren’t the only subject matter for which 3D is an appropriate storytelling mechanism. Abstract concepts, scientific topics, products, and other subjects that require visual complexity or layers of information play out well in an interactive 3D experience.
Use cases:
- Telling a brand story
- Museum exhibits
- Web games
Wayfinding
Helping people understand and find their way through space is one of the best ways to use interactive 3D. 3D wayfinding is being used by millions of people every day in Google Maps and the like. The power of utilizing 3D in a wayfinding context is that people can make the cognitive connection between maps and reality much quicker. When extended by augmented reality, that connection becomes even faster and the walls between the virtual and real worlds are broken down.
Potential use cases:
- Wayfinding kiosks at trade shows
- Campus maps
- Tour apps
- Real estate apps
Simulation and Training
The combination of custom 3D environments and interactivity makes this technology extremely useful in simulation and training. Trainees can learn valuable in-the-moment lessons when they are placed in hypothetical scenarios and spaces, specifically those that simulate reality. Simulation isn’t a new concept – the military has been training people in this way for years. But recently, big companies like Walmart have recognized the value of interactive 3D experiences for both training and assessment purposes.
This technology works especially well in preparation for rare situations that can’t easily be replicated in reality. Trainees can first experience these scenarios in a controlled simulated environment, eliminating risk while they learn valuable lessons.
Potential use cases:
- Medical procedure simulation
- Employee training for emergency response careers
- Scientific simulation driven by AI
What Is the Future of Interactive 3D?
As the web becomes more sophisticated and bandwidth continues to increase, interactive 3D experiences will expand in prevalence, visual depth, and mobility. Creative tools will continue to evolve and become more accessible for designers and engineers to build immersive experiences more efficiently. Mobile technology enabling augmented reality will allow people to carry a 3D experience with them and ‘build’ it wherever they are. The growth of AR and VR headsets will continue to expand the market for 3D experiences beyond the arenas in which it has been traditionally used, like gaming. As 5G becomes more commonplace, bandwidth and filesize concerns will all but go away, enabling richer, more immersive experiences.
The trend of technology over time indicates that we will also begin to see more realism – life-like textures and animation powered by realistic physics. Alongside that comes the expansion of technology that can push reality into hyper-reality – effects and shaders that can elevate an experience to rival video games or films. All of these innovations mean more opportunity to make interactive 3D an important part of digital strategy.
But the future is not simply about advances in technology. In our current world of limited or non-existent interaction with physical spaces and people, 3D experiences on the web provide opportunities for people to experience space and connection virtually. It allows us to do things remotely that we cannot do in person. No, it’s not a replacement for walking the streets of your favorite city or going to a sold-out concert, but it can be a bridge both now and into the future.
If you’d like to learn more about how we create interactive 3D experiences or if you have a 3D idea you’d like to make a reality, reach out to us.
