Forums > Jitter

manually cross-fading through a series of images – any tips?

June 19, 2013 | 5:55 am

I’m building an interactive animation in which people will use changes in their heart rate to smoothly cross-fade smoothly through a *series* of time-lapse photos.

Basically I want to create a slideshow of around 20 images that can be ‘scrolled/scribbed’ through using input from a slider – that is controlled by heart rate.

The fading tutorials and examples I’ve looked at so far – seem to only cover x-fading with jit.xfade – which focusses on mixing between only 2 matrices.

Another variation would be to use the node object to mix images according to xy values.

Any tips re tutorials or suggested approaches would be greatly appreciated

All the best
George


June 19, 2013 | 6:18 am

This looks promising…

http://www.cycling74.com/docs/max5/tutorials/jit-tut/jitterchapter43.html

example in the Jitter tutorial…
43jYourVeryOwnSlab


June 19, 2013 | 6:43 am

So I’d need to edit the code in "43j-fourwaymix.jxs" to work with 20 matrices? assuming I want to cross fade accross 20 images?


June 19, 2013 | 6:55 am

You’re talking about 1 dimension of control using a single continuum of numbers, such as a changing heart rate or a changing slider position. Do you want to use that number to a) scroll through a series of 20 images, selecting one at a time based on position or b) scroll through a series of images including a mix (crossfade) of two adjacent images. You’re not really trying to blend all 20 images at the same time, right?


June 19, 2013 | 7:11 am

Hi Christopher – thanks for your question – that’s correct – I want to
b) scroll through a series of images including a mix (crossfade) of two adjacent images. I don’t need to blend all 20 images at the same time.


June 19, 2013 | 8:19 am

Hi George. Then you just need to crossfade between 2 textures. Let’s call them A and B.
I would do it like this:
1- Load image1 in A and image2 in B.
2- Crossfade from A to B.
3- Load image3 in A and crossfade to A.
4- Load image4 in B and crossfade to B.

With this "ping-pong" system, you can have as many images as you want…

<code>

– Pasted Max Patch, click to expand. –

</code>

Alternatively, if you want to be able to "jump" to any image at any time and play the sequence forward or in reverse, you could build a system with 3 textures: previous, current and next image. Then you would be able to easily crossfade to the previous or to the next image.


June 19, 2013 | 8:58 am

Just another approach: if you build a Quicktime movie from the individual images (QuickTime Pro and many other applications let you do it easily), you could use a very simple system like this:

<code>

– Pasted Max Patch, click to expand. –

</code>


June 23, 2013 | 5:43 am

Hi Pedro

Thanks for your example, here’s my update – it shows how you can then use a slider to move forwards and backwards through the slide show

<code>

– Pasted Max Patch, click to expand. –

</code>


Viewing 8 posts - 1 through 8 (of 8 total)