Page 1 of 2
small "shaky-cam" effect
Posted: Wed Dec 21, 2011 6:00 pm
by Ryne
So, I'm trying to create a basic camera (this doesn't interact with the character at all yet).
Assume I have these variables:
Code: Select all
camera = {}
camera.x = 0
camera.y = 0
camera.speed = 10 -- this will probably be multiplied by dt
I'd like the camera to move about just a little bit on it's focal point, Basically whatever camera.x is, the camera can move about 5-10 pixels in any direction, at a low speed (10 * dt). I guess the movement could be random, but playing around in photoshop I found a "figure-8" shape would look pretty nice.
I've tried a few things myself but this seems like a math-based issue, of which I'm not really that great.
Any help is appreciated!, thanks guys.
* on a side note, I've made several updates to the game - which I won't tell because I wan a surprise you guys.
YOU KNOW TOO MUCH ALREADY.
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 6:24 pm
by Ellohir
I think you could have a table with differential positions and cycle through it. Something like:
Code: Select all
shpos = 1
shakey = {}
shakey[1] = {dx = 0, dy = 0}
shakey[2] = {dx = 3, dy = 0}
shakey[3] = {dx = 5, dy = 2}
shakey[4] = {dx = 3, dy = 2}
shakey[5] = {dx = 1, dy = 1}
shakey[6] = {dx = -2, dy = -3}
shakey[7] = {dx = -1, dy = -5}
shakey[8] = {dx = 1, dy = -1}
-- play around with this depending on the pixel "roughness" and speed of the moves
You can update sh_pos every few time on love.update and draw by "camera.x + shakey[sh_pos].dx" position. The vector should give a consistent "cycle" the eye can get used to, but it's probably easier to just make a "camera.x + math.random(10)" and shouldn't be too difficult, try that too and see what it's like. I don't know how your camera is done but I guess you can adapt it. Hope it helped
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 7:02 pm
by Robin
When I do shaky cam, I use a random offset, but if you want to use figure-eights, that can be easily accomplished.
Remember the sword-slinging in Simon? You'd use something similar to that:
Code: Select all
xoffset = xmagnitude * math.sin(time * speed * 2)
yoffset = ymagnitude * math.sin(time * speed)
for a standing 8
or
Code: Select all
xoffset = xmagnitude * math.sin(time * speed)
yoffset = ymagnitude * math.sin(time * speed * 2)
for a horizontal one.
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 7:45 pm
by Taehl
What kind of camera-shake are you looking for? Running "bouncing all over the place" shaking, getting hit "shove in one direction and re-center" shaking, earthquake shaking?
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 7:51 pm
by coffee
I'm looking this with attention, I would like add (perhaps nothing too fancy and math calcullated, just some pixels offset random shaking) a small "camera/map" shake when hero get hit.
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 7:55 pm
by Ryne
Robin wrote:When I do shaky cam, I use a random offset, but if you want to use figure-eights, that can be easily accomplished.
Remember the sword-slinging in Simon? You'd use something similar to that:
Code: Select all
xoffset = xmagnitude * math.sin(time * speed * 2)
yoffset = ymagnitude * math.sin(time * speed)
for a standing 8
or
Code: Select all
xoffset = xmagnitude * math.sin(time * speed)
yoffset = ymagnitude * math.sin(time * speed * 2)
for a horizontal one.
I'm not quite sure how to implement this, could you explain it a bit more?
Taehl wrote:What kind of camera-shake are you looking for? Running "bouncing all over the place" shaking, getting hit "shove in one direction and re-center" shaking, earthquake shaking?
The camera shake is simply to animate the screen when idle. the camera will just sway around a little bit, at a very slow rate.
coffee wrote:I'm looking this with attention, I would like add (perhaps nothing too fancy and math calcullated, just some pixels offset random shaking) a small "camera/map" shake when hero get hit.
haha, yeah. I've already planned for that, at least for what I have in mind for combat - the camera would zoom and focus on the player, where I would try and make the combat seem dynamic by playing with the camera.
EDIT: Here is a really UGLY version of what I have in mind. This is "kind of" what I want, except this looks really ridged. Please no comments on how bad the code is, I'm no programmer.
http://d.pr/23Cy
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 8:00 pm
by Robin
In love.update:
Code: Select all
camera.time = camera.time + dt
camera.x = camera.xmag * math.sin(camera.time * camera.speed * 2)
camera.y = camera.ymag * math.sin(camera.time * camera.speed)
in love.draw:
Code: Select all
love.graphics.push()
love.graphics.translate(math.floor(camera.x), math.floor(camera.y))
-- drawing code
love.graphics.pop()
camera.xmag and camera.ymag are how much the camera shakes horizontally and vertically respectively.
Is that a clear explanation?
Re: small "shaky-cam" effect
Posted: Wed Dec 21, 2011 8:55 pm
by coffee
Ryne wrote:
haha, yeah. I've already planned for that, at least for what I have in mind for combat - the camera would zoom and focus on the player, where I would try and make the combat seem dynamic by playing with the camera.
Well, I thought in more fancy effects like yours but then I remembered that would be an abuse/boring/repetitive do it all the times the player get's hit, so probably will stick for half-second/1 sec shake and nothing more.
About your demo (not critizing the code) I think would work great if faster and with more updates. Apply first Robin shaking pattern. It will work great for sure
Re: small "shaky-cam" effect
Posted: Thu Dec 22, 2011 4:27 am
by Ryne
Robin wrote:In love.update:
Code: Select all
camera.time = camera.time + dt
camera.x = camera.xmag * math.sin(camera.time * camera.speed * 2)
camera.y = camera.ymag * math.sin(camera.time * camera.speed)
in love.draw:
Code: Select all
love.graphics.push()
love.graphics.translate(math.floor(camera.x), math.floor(camera.y))
-- drawing code
love.graphics.pop()
camera.xmag and camera.ymag are how much the camera shakes horizontally and vertically respectively.
Is that a clear explanation?
worked great!, though now the camera doesn't start at my initial starting point.
Code: Select all
camera = {} -- camera code
camera.x = -290
camera.y = -370
camera.prex = camera.x
camera.prey = camera.y
camera.xmag = 4
camera.ymag = 4
camera.time = 2
camera.speed = 1
I define the starting coordinates here, but it doesn't set the camera in place before your function jumps in.
Re: small "shaky-cam" effect
Posted: Thu Dec 22, 2011 5:14 am
by osgeld
ahh new lovers ...
your overwriting the original values with the ones provided in the formula, = overwrites
so maybe (without looking at a single bit of code...)
camera.x = camera.x + (camera.xmag * math.sin(camera.time * camera.speed * 2))
camera.y = camera.y + (camera.ymag * math.sin(camera.time * camera.speed))
?