I moved to a new URL! Check it out!

posts dated from: october 2015

Otter Example: Using Components

Otter Example: Using Components
Sometimes when making a video game you can end up with some pretty complicated classes. One way to try to counter act the giant behemoth of code that can easily creep up is to separate some of the functionality into components. In Otter an Entity can have a list of components to run each update.

It can be super useful to put things like movement patterns, weapon systems, health systems, and other stuff into different components and just compose Entities using these various components.

Image


This example goes into detail on how to use components in an Otter project. The example is nearly a game with a player character that can move around and shoot down targets. The example uses components for the movement system that the player uses, keeping track of health, input from the keyboard, using a weapon, and moving bullets fired from the weapon.

This is a pretty complex example compared to the others so far, but I hope it can shed some light on one of the possible ways to organize a bunch of code!

Doodle Post

Image

Otter Example: Shaders

Otter Example: Shaders
Welcome to shader town! One of the most exciting things about transitioning from flash to SFML was the use of GLSL shaders! Otter supports all the cool shader stuff that SFML does, and this example covers how to apply shaders to an image.

Check out some really quick example shaders being applied to a cool image of an otter.

Image

uniform sampler2D texture;

void main() {
vec4 pixel = texture2D(texture, gl_TexCoord[0].xy);
float gray = (pixel.r + pixel.g + pixel.b) / 3;

gl_FragColor = vec4(gray, gray, gray, pixel.a) * gl_Color;
}

Image

uniform sampler2D texture;

void main() {
vec4 pixel = texture2D(texture, gl_TexCoord[0].xy);

gl_FragColor = vec4(1 - pixel.r, 1 - pixel.g, 1 - pixel.b, pixel.a) * gl_Color;
}

Image

uniform sampler2D texture;

// A weird way to generate a random number with a vec2 seed I guess.
float rand(vec2 co){
return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);
}

void main() {
vec2 samplePos = gl_TexCoord[0].xy;
samplePos.x += rand(samplePos) * 0.05;
samplePos.y += rand(samplePos) * 0.05;
vec4 pixel = texture2D(texture, samplePos);

gl_FragColor = pixel * gl_Color;
}
Shaders are the best!

Doodle Post

Image

Otter Example: Surfaces

Otter Example: Surfaces
Another Otter example has washed ashore. This one deals with understanding how to use Surfaces. Check out the full example right here to see how to make pretty pictures using Surfaces.

Image


Image


Surfaces are essentially just wrappers for a render texture. I like to think of them as canvases that can be drawn to. Otter by default uses one big Surface the size of the game window to render the game. Surfaces can be a great way to add something like a minimap or HUD to your game, or make use of shaders. I often use multiple surfaces when making my games so that I can zoom in and out on the main Surface and keep things on the HUD unaffected by the zooming.

Doodle Post

Image