Animation Best Practices 2017 / Livecode 8

Visuals, audio, animation. Blended, not stirred. If LiveCode is part of your rich media production toolbox, this is the forum for you.

Moderators: Klaus, FourthWorld, heatherlaine, kevinmiller, robinmiller

Post Reply
whitebrick
Posts: 4
Joined: Wed Jul 02, 2014 12:36 pm

Animation Best Practices 2017 / Livecode 8

Post by whitebrick » Thu Oct 05, 2017 3:25 pm

Hi all,

long time hypertal- sorry Livecode hobbyist. Deep love for the language and development environment.

Currently coding a point and click adventure game for more daughter (she drew all the drawings and and was the 'Chris Roberts' behind the game's scope. I call her that because as she worked out what she wanted there was severe feature creep. )

I've written a half decent for me (but probably crappy by your standards) game engine that uses a card a room, loads in .PNG sequences as sprites which it stores in a database . Each room has 5 buttons set up as channels that will playback your selected PNG sequences as sprites - these can be updated by the room's mini-game loop & user interaction. I'll share the engine here when I finish it - hopefully before the end of the year ... or at least my daughter's 6th Birthday.

I've animated all the key moments of the story in After Effects because I work in TV so it's easier for me to play back an animation sequence than work out SCUMM style collision & A* pathfinding level of game complexity.

So let's say a character walks on the screen and stops in the middle of the screen as the intro to the current room, that's a 24 frame PNG sequence.

My database stores the ID number of each .PNG in the sequence and then uses 'send to me in x ticks' trick to flip through each frame incrementing the frame counter each time and refreshing the icon of the button.

Once the animation has reached frame 24, the game will move to the next event for the room - which could be to prompt the user. Char walks in, animation finishes, message panel displays "This room looks creepy" or something.

It's good in theory, but what I've found in practice is that the game races ahead of the sprite playback and moves to the next event. So both events are occurring at the same time. Once the framecount hits the end of the animation sequence I've made the next event to be a mandatory 'wait 1 seconds' which kind of brushes over the error reasonably good enough for a kid's point and click.

But there must be a more robust method for playing animated sprite sequences and moving to the next event once the playback is done?

Which leads me to my question...

TL/DR:

What's the best method for perfectly time sprite animations?
Are we still having to use buttons for sprites?
is 'send "event_handler" to me in x ticks' the best method for animation that keeps the input from the user channels open for interaction
How does one cue the next event to start only once a sprite finishes it's animated sequence instead of racing ahead so it appears on screen as though the events are concurrent ie: sprite 1A throws grenade, sprite 2 explodes once the grenade lands at its feet.

thanks for any suggestions!

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1970
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Animation Best Practices 2017 / Livecode 8

Post by richmond62 » Thu Oct 05, 2017 6:14 pm

As soon as someone mentions "Best Practices" I pack and head for the hills.

"Best Practices" is phrase "up there" on my shit list alongside "canonical" and "normal".

What works for you is what works . . .

I had a "major mental patch" re animations about 2 years ago: https://www.dropbox.com/sh/tyt4o1md51bf ... QGg7a?dl=0

whitebrick
Posts: 4
Joined: Wed Jul 02, 2014 12:36 pm

Re: Animation Best Practices 2017 / Livecode 8

Post by whitebrick » Thu Oct 05, 2017 10:41 pm

Thanks for the link I'll take a look.

I thought there might be someone (maybe from Livecode even) who had pushed the envelop beyond button icon flipbook

and what's working for me isn't working 100% to be honest. If icon cycling is still the "best practice" :P for cycling through a sprite animation , then I was wondering if there were any ideas on how to ensure that the next event cues at the end of the animation rather than racing ahead

for example a cut scene that plays back animated sprite sequences one after another

wizard walks to altar
wizard raises arms at altar
wizard cast spells and destroys the terms Best Practices, Canonical, Normal and Major Mental Patch

if one is just looking at the frame count value to cue the next animation then the code will leap ahead of the animation from my experience -- the wizard would be walking to the altar at the same time as there's a wizard at the altar raising his arms.

I'll check out your stacks though - thanks for sharing!

MaxV
Posts: 1362
Joined: Tue May 28, 2013 2:20 pm
Location: Italy
Contact:

Re: Animation Best Practices 2017 / Livecode 8

Post by MaxV » Fri Oct 06, 2017 3:28 pm

I prefer to use animated GIF.
Depending on what you need you can use image sequences or GIFs, see these examples:
Livecode Wiki: http://livecode.wikia.com
My blog: http://livecodeitalia.blogspot.it
To post code use this: http://tinyurl.com/ogp6d5w

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1970
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Animation Best Practices 2017 / Livecode 8

Post by richmond62 » Sat Oct 07, 2017 7:45 am

Personally I find the coding to work with animated GIF images way too fiddly.

If I have access to a series of static images stored off-screen I can then call them in
whatever order/sequence and at whatever rate I like.

By using a holder (either a graphic object or an empty image) one can do all sorts of
"clever" things using different sets of animation sequences.

bogs
Posts: 746
Joined: Sat Feb 25, 2017 10:45 pm

Re: Animation Best Practices 2017 / Livecode 8

Post by bogs » Sat Oct 07, 2017 12:23 pm

I would suspect which way to go would depend on the end result required. After all, if your only trying to get one thing to happen repeatedly, at the same rate every time, Max's suggestion would be by far the simplest way to achieve it.

On the other hand, if in one scene the character is walking into a room, and the next time that scene comes up he's flying in, then sure a series with enough images in it would be the way to go.

BTW Max, curious if you created those panoramic scenes yourself, they are quite lovely.
ImageImage

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1970
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Animation Best Practices 2017 / Livecode 8

Post by richmond62 » Thu Oct 12, 2017 7:38 pm

gryphon.jpg
Last edited by richmond62 on Sun Oct 15, 2017 11:30 am, edited 1 time in total.

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1970
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Animation Best Practices 2017 / Livecode 8

Post by richmond62 » Sun Oct 15, 2017 11:29 am

That is not much cop if one's finger gets stuck on an arrowKey, so here's a new version that avoids
that problem:

https://www.dropbox.com/s/d3jqt734e47n6 ... e.zip?dl=0
Screen Shot 2017-10-15 at 1.29.00 pm.png

bogs
Posts: 746
Joined: Sat Feb 25, 2017 10:45 pm

Re: Animation Best Practices 2017 / Livecode 8

Post by bogs » Sun Oct 15, 2017 11:38 am

I am such a problem child :twisted:
ImageImage

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1970
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Animation Best Practices 2017 / Livecode 8

Post by richmond62 » Sun Oct 15, 2017 11:46 am

Problem children stimulate problem parents to find
innovative ways to control the children :twisted:

bogs
Posts: 746
Joined: Sat Feb 25, 2017 10:45 pm

Re: Animation Best Practices 2017 / Livecode 8

Post by bogs » Sun Oct 15, 2017 1:23 pm

Now now, put down that whip.... :mrgreen:
ImageImage

Post Reply

Return to “Rich Media”