I typed out a WHOLE EXPLANATION AND THEN THE SITE ATE IT. it is now midnight. i am very tired and mad, but mostly at myself. anyway.
Aim: To identify elements of rhythm, timing, and tempo that make up my visual novel's cutscene, and brainstorm ways to exploit them for narrative and visual purposes.
Method: Last week, Nick suggested that I try using less panels to avoid visual clutter. So, this time around I decided to focus solely on one panel, and use a mix of tweening and frame-by-frame animation to see if I could portray a whole sequence.
Result:
- Okay i'm gonna lightning round this for the time being and then polish this up later
- Timing in AGS is done via blocking functions. These come in two main forms:
-
Wait(): locks the game up for the specified amount of time, then moves things along. Creates a feeling of fluidity and lack of control: the player is not in charge of any actions blocked in this way.
-
WaitMouseKey(): Locks the game up, until the player presses a button. Creates a feeling of slowness, pause, and control: nothing moves until the player says so, giving them time to think about what's happening.
- The former is useful for having a lot of things happen in quick succession, or for when the player character is getting themselves in trouble with NPCs.
- (Sidenote: all dialog in the game waits for player input before progressing. Perhaps this expectation can be exploited later down the line?)
- As for tweening height/width of panels: these come w a variety of easing functions that can change the speed/bounciness/overall feeling of the motion. Super nerdy stuff, but actually very helpful for creating variety.
- Immediate problem: You can widen something by going left-to-right, and shorten it by going right-to-left. That part's fine. But you can't widen it by going right-to-left, or shorten it from left-to-right.
(Which means that fancy transition I have in the video only works in the way it's already shown.)
- Similar problem with expanding top-to-bottom.
- Attempted to bypass this in the first example by just having a second, still panel pop up at the end of the animation. If I'd gotten it positioned properly, it would've looked like the image had been cropped, creating some kind of unity between the motion of the cashier looking away and the player going through the door.
- But I couldn't quite get it looking right so instead it feels kinda janky and not good.
- It's also possible to change the graphic of the panel while it's expanding/retracting, or even animate it via frame-by-frame animation.
Discussion:
- Changing the panel graphic as its expanding/retracting: pretty satisfying. Makes it feel like the gesture has more movement to it, when in reality it's just one still image and some tweening.
- Saves on illustration work but still looks cool.
- Possible avenues of experimentation: transparent backgrounds on panels + tweening? Animated panels + tweening? End the animation when the tween stops? How can actual frame-by-frame animation tie into these other effects to create interesting sequences?