distortion

Audio-based Image Distortion Effects with WebGL – Website Design Article

From our sponsor: Market smarter with Mailchimp’s automated messaging tools. We’ve covered in the past how we can read data from Audio, using the p5.sound library and how we can use that data, to draw things in the canvas, using p5.js. Well, what if instead of drawing a sketch, we used audio to distort an image? Today we want to show you some demos that play around that idea. We’ve created some experiments using the theme of movie trailers where…

Read More

Audio-based Image Distortion Effects with WebGL – Website Design Article

From our sponsor: Market smarter with Mailchimp’s automated messaging tools. We’ve covered in the past how we can read data from Audio, using the p5.sound library and how we can use that data, to draw things in the canvas, using p5.js. Well, what if instead of drawing a sketch, we used audio to distort an image? Today we want to show you some demos that play around that idea. We’ve created some experiments using the theme of movie trailers where…

Read More

Text Distortion Effects using Blotter.js – Website Design Article

Some text distortion experiments using the Blotter.js library. The idea is to distort text as we scroll or move the mouse. Distortion effects have become quite popular over the past two years and now many extraordinary website designs have some unique form of this intriguing trend. Today we’d like to share two demos with you that show how to use Blotter, a three.js and Underscore.js powered API for drawing artsy text effects. We used it to distort text on scroll…

Read More