LÖVE

Posted: **Sat Feb 03, 2018 10:41 am**

How are animatoins as for example in Stardew Valley done (when a player walks through grass or hits a tree they "wiggle"). I have three ideas:

- A sequence of frames is played where they drew each frame by hand s.t. it looks like wiggling (But does this scale in terms of how many sprites you have to draw and how many animations the computer has to draw if more then one player walk through grass etc?)
- They somehow produced gifs that play the full animation and just play that gif (same question as above)
- Something different, where they modify the sprite in runtime (forexample rotating it a bit to each side) s.t. it looks like wiggeling (does this have to do something with shaders?)

Many thanks and have a nice weekend

Posted: **Sat Feb 03, 2018 11:57 am**

This effect can be achieved by shearing the sprite.
love.graphics.draw last 2 optional arguments are 'kx' and 'ky'.

For this particular effect, only kx should be increased / decreased.
To see it in action you can try map it to a sine function.

Do note that for it to look good you will have to put the origin in the center bottom.
That is, ox is width/2, oy is height.

Code: Select all

local grass = love.graphics.newImage("grass.png")
grass:setFilter("nearest", "nearest")

love.graphics.setBackgroundColor(255, 255, 255)

function love.draw()
   local x, y   = love.graphics.getWidth() / 2, love.graphics.getHeight() / 2 - grass:getWidth() / 2
   local scale  = 4
   local ox, oy = grass:getWidth() / 2, grass:getHeight()
   local sx     = math.sin(love.timer.getTime()) * 0.35

   love.graphics.draw(grass, x, y, nil, scale, scale, ox, oy, sx)
end

Posted: **Sat Feb 03, 2018 6:52 pm**

I was intrigued with the idea of doing this with a shader and this is my attempt using moonshine.

It's way more complicated than sheering because the grass is a texture on a mesh. I just used the sketch filter and adjusted it slightly. I'm sure it can be tuned up a lot.

: grass_movement.gif (432.46 KiB) Viewed 3384 times

Posted: **Sun Feb 04, 2018 9:35 am**

thanks so much for both of your answers! I am using shearing for now and I will look at the shader solution as soon as I've read a bit about shaders

LÖVE

How are wiggle animations done?

How are wiggle animations done?

Re: How are wiggle animations done?

Re: How are wiggle animations done?

Re: How are wiggle animations done?