Fishies 2.5D improvement

Hi there!

I wanted to modify the 3D effect to pivot around the center of the image.

I’ve modified it a bit to include a scale as well as some modifications to the yDelta.

You can replace the existing transition blocks with the one below:

Tell me what you think…

local scaleDelta = 1.15; local yDelta = halfW \* 0.6; transition.to( a.path, { x1=halfW, y1=-yDelta, x4=-halfW, y4=yDelta, x2=halfW, y2=yDelta, x3=-halfW, y3=-yDelta, time=1500, delay=1000, transition=easing.inExpo } ); transition.to( a, { xScale=scaleDelta, yScale=scaleDelta, time=1500, delay=1000, transition=easing.inExpo } ); transition.from( b.path, { x1=halfW, y1=yDelta, x4=-halfW, y4=-yDelta, x2=halfW, y2=-yDelta, x3=-halfW, y3=yDelta, time=1500, delay=2500, transition=easing.outExpo } ) transition.from( b, { xScale=scaleDelta, yScale=scaleDelta, time=1500, delay=2500, transition=easing.outExpo } );

Cool, I never thought about using yScale.

Another way to skin this cat is by varying the “y” offset for each corner:

[lua]

local y = 100

transition.to( a.path, { x1=halfW, y1=-y, x3=-halfW, y3=-y, 

                    x2=halfW,y2=y, x4=-halfW, y4=y,

                    time=1500, delay=1000, transition=easing.inExpo } )

transition.from( b.path, { x1=halfW, y1=y, x3=-halfW,y3=y,

                      x2=halfW, y2=-y, x4=-halfW,y4=-y,

                      time=1500, delay=2500, transition=easing.outExpo } )

[/lua]

In the original, only 2 of the corners had offsets for the y-direction. In the above, every corner has an offset in the y-direction — specifically a y-offset to corners 1 and 2 for ‘a’. And to corners 3 and 4 for ‘b’.

Cool, I never thought about using yScale.

Another way to skin this cat is by varying the “y” offset for each corner:

[lua]

local y = 100

transition.to( a.path, { x1=halfW, y1=-y, x3=-halfW, y3=-y, 

                    x2=halfW,y2=y, x4=-halfW, y4=y,

                    time=1500, delay=1000, transition=easing.inExpo } )

transition.from( b.path, { x1=halfW, y1=y, x3=-halfW,y3=y,

                      x2=halfW, y2=-y, x4=-halfW,y4=-y,

                      time=1500, delay=2500, transition=easing.outExpo } )

[/lua]

In the original, only 2 of the corners had offsets for the y-direction. In the above, every corner has an offset in the y-direction — specifically a y-offset to corners 1 and 2 for ‘a’. And to corners 3 and 4 for ‘b’.