Optimize and deliver UGC

Once your users' content has been uploaded, managed, and transformed, the final step is to optimize it for fast, high-quality delivery on every device. This page covers on-the-fly optimizations for images and videos, and using the Cloudinary Video Player to deliver uploaded videos.

Recommended features by use case

The table below shows which features we recommend (marked ✅) for each of the four example use cases followed throughout this guide: profile pictures, video reviews, marketplace products, and try before you buy.

On-the-fly optimizations

User-generated content is no different to pre-defined content when it comes to optimizing delivery of assets to different devices. You'll want to make the image or video as light as possible for fast page-load times. You can do this by automatically detecting the best format to deliver the media, automatically compressing the media to maintain appropriate quality, and resizing the media on the server side to its display dimensions on the client side.

Here's the profile picture, cropped to the right size for the display (ar_3:4,c_fill,g_face,h_300), delivered in the best format (f_auto) and optimal quality (q_auto):

Cloudinary Video Player

If users are uploading videos, you can take advantage of the Cloudinary Video Player to display them.

The Cloudinary Video Player is a versatile HTML5-based solution designed for seamless video delivery across devices. It supports responsive layouts, offers built-in controls, and allows for video transformations at both player and individual video levels. The player supports popular video formats, adaptive bitrate streaming, and can host multiple players with different configurations on the same page. Customization options include themes, captions, chapters, and seek thumbnails, along with AI-driven highlights and event triggers.

Here's an example of the video player, playing a video with highlighted captions, seek thumbnails and AI-based highlights graph: