Interactive Media Spots

The Limitations of Static Images and Video

The most familiar types of visual media content on the internet are images and videos, with GIF animations also coming to mind. All of these formats are natively supported by modern web browsers. However, are these formats sufficient for a comprehensive and engaging presentation of everything we want to share with our users?

Let’s explore several scenarios where we might need something more.

Gallery

Often, when representing a subject, we require a sequenced set of images that are organized and connected by a common context.

Certainly, we can place standard images on a page one after another. However, this approach can consume considerable space and discourage viewers from scrolling through an extensive list.

To address this challenge, gallery widgets are available. Below is a sleek and minimalist solution from our library:

Diff

When the essence of the demonstration lies in showing the differences between various states of a space or an object, there's nothing quite like utilizing a specialized widget:

This method allows us to showcase:

Variations in object coloring and the use of different materials
Landscapes across different seasons and weather conditions
Visible improvements following completed work
Changes that have occurred over time
Various interface design options (screenshots)
And much more...

Spinner

The most comprehensive representation of an object can only be achieved by viewing it from all angles:

This type of widget can be used for:

A more complete demonstration of products in online stores
Showcasing art and antiques, especially when access to real objects is limited
Situations where interactive polygonal 3D models cannot convey all nuances, and their creation is technically complex and more costly than photography
As part of visual aids in educational contexts
Demonstrating scientific artifacts
Creating interactive instructions and guides

Pano

Spherical panoramic images are what we most commonly associate with Google Street View. We propose significantly expanding the range of applications for similar content types through our widget:

This can be utilized for:

Showcasing spaces, interiors, and rooms
Presenting real estate properties
Displaying personal content captured with specialized action cameras that support 360-degree shooting
Exhibiting panoramic images created with AI

Video

Of course, classic video content is also an important part of full-fledged presentation. But it can also be a part of the wide common story, not the only option. For this purpose, we have created a widget that allows you to embed video content into your visual narrative:

IMS Features

All our widgets support:

Adaptive content loading to optimize traffic and enhance page loading speed
Adaptive DPI support
Full-screen display mode
Mobile device compatibility
Alpha channel support for transparent backgrounds and background settings
Easy universal integration using a custom HTML tag, without the need for JavaScript
On-demand dynamic loading of necessary dependencies
Simple and effective version management for widgets and required data
Direct data encoding within images for use with specialized CDNs
JSON for data and configuration transfer, both as static files and via API
Ability to override settings for each specific embed using HTML tag attributes
Flexible UI customization via standard CSS
Compatibility with all popular modern frameworks
Autogenerated URLs for used images to facilitate working with CDNs
Watermarking for copyright protection (coming soon)
Interactive hot spots for linking to other content, enabling the creation of more intricate and complex hypermedia stories (coming soon)
Audio accompaniment (coming soon)

IMS is supported by all current versions of popular browsers.

We plan to actively develop this project by adding features, improving documentation, and creating valuable new integrations.

IMS is released under the MIT license. You are free to use the project code as you wish, copy and adapt it for your needs, or contribute alongside us.

We welcome any feedback and stars on GitHub.

Project repository: https://github.com/rnd-pro/interactive-media-spots

CIT Integration

You can utilize the IMS library as an addition and integral component of our tool for cloud media asset management: Cloud Images Toolkit