Programmable Media

Transformation and optimization tutorials

Last updated: Sep-26-2023

This page offers a library of short video tutorials introducing you to image and video transformations and optimizations.

Get started with transformations

Transformation Basics
Learn the basics of a transformation URL
Optimization Tips
Tips for delivering optimized images
Gravity Crops for Images
Indicate which areas to keep when cropping
Content-aware Video Cropping
Smartly crop a video using content-aware AI
Videos to Animated Images
Convert videos to animated image formats on the fly
Transformation Overlays
Add transformation overlays to assets on the fly using the Node.js SDK

Advanced transformation features

Text Overlays
Place text on top of your images using the transformation editor
Complex Transformations
Combine transformations to generate a 3D canvas
Named Transformations
Simplify & standardize complex delivery URLs
Named Transformations using TX Builder
Create re-usable transformations with the Transformation Builder UI
Advanced Image Components
SDK components to improve your user's experience
Trim Videos in Node.js
Trim videos using the Node.js SDK
Splice Videos in Node.js
Splice two videos together using the Node.js SDK
Zoompan Effect
Apply the Ken Burns effect to zoom and pan on an image
Video Transformations
Build an e-commerce video showcasing products, in Node.js
Optimize Images with Nuxt
Optimize Images in Nuxt with Nuxt Cloudinary
Crop and Resize Videos in React
Crop and resize a video using React with Cloudinary
Optimize Videos in React
Optimize delivery of videos in a React app
Optimize Videos in Next.js
Optimize delivery of videos in a Next.js app
Transform and Optimize Images in Svelte
Transform and optimize images delivered in a Svelte app

Transformations for social media

Create Social Media Cards
Dynamically create social media image cards using Next.js

✔️ Feedback sent!

Rate this page: