Blog - Page: 106

Overview Ensuring our web pages load quickly is our duty as builders of the internet. By lazy loading our images, we are able to save valuable load time for our users. The challenge with lazy loading is pre-generating and storing low-quality placeholders for the full quality image. Let us learn…

CLOUDINARY CHROMA KEYING Introduction Editing videos to remove the background is a common task, especially if you want to use the video in creative ways on your website. Chroma keying, popularly known as “green screening,” allows for the replacement of the green-colored background. In this tutorial, not only will…

Working with PSD files can be complex as they are not natively supported by HTML. However, it is a widely used format globally by creators and professionals in various fields. Let us learn how we can preview the photoshop file and its content for our users. Codesandbox The final…

Introduction When building a content website, users will want to share assets such as links to already uploaded video content such as Netflix shows and Youtube videos. To provide an enjoyable user experience, we will want the users to see a thumbnail of the video as they share the link.

Media content makes up the majority of the internet and is the prominent source of performance issues. These issues are often overlooked even though they are the most approachable category of performance bottlenecks to fix. Auditing image performance is often overlooked because we build products on high-end devices that deliver…

This Mediajam showcases how to transform an image to gif as a fadeout using cloudinary API’s in combination with typescript Nextjs Codesandbox The final project can be viewed on Codesandbox. You can find the full source code on my Github repository. Project initialization and setup Initiatilization of next…

Introduction You have probably used those collage-making apps, either as a native app on your phone or a web app. In this short tutorial, we’ll be looking to achieve the same using some cleverly designed layouts, cloudinary and next.js. We’re going to be using Cloudinary transformations to…

Interactivity is a big part of today’s online pages. These responsibilities include gathering information on user involvement, processing form submissions, and controlling the interactivity of media assets. In this tutorial, we will discuss how to trigger a feedback form on video completion in Nuxt.js. Sandbox This project was completed in…

When brands like you adopt a direct–to-consumer (DTC) e-commerce approach with no involvement of retailers or marketplaces, you gain direct and timely insight into evolving shopping behaviors. DTC e-commerce is a business model where merchants sell their products and services directly to their customers online, bypassing intermediaries such as…