corenominal

Full stack web developer, interested in all the things, but especially the web, code, design, Linux, OS X, PHP, WordPress, JavaScript & robots.

Snippet Language: javascript

SVG logo animation: Man on a rock, floating in space, waving

I was looking at my site’s SVG logo and I thought to myself, it’d be cool if the little dude would offer up a little waving arm. So, I played around with some JavaScript and came up with the following pen.

See the Pen Man on a rock, floating in space, waving by Philip Newborough (@corenominal) on CodePen.

I’ve got no idea if the above is a valid method for animating a SVG, but it seems to work and I think it looks cool. I’ll probably use it with the mouseover and mouseout events, like the following pen.

See the Pen Man on a rock, floating in space, waving: hover by Philip Newborough (@corenominal) on CodePen.

HTML5 Canvas Particle Emitter

A while back, I had a lot of fun creating some basic HTML5 canvas particle emitters. I don’t know why, but I love hacking on these things. They’re not particularly useful, but they are kind of mesmerising. Below is the first one I created — view full screen here.

See the Pen HTML5 Canvas Particle Emitter by Philip Newborough (@corenominal) on CodePen.

HTML5 Canvas Sprite Animation – Alien

Tonight, I made an attempt at creating a HTML5 Canvas sprite animation. The process is actually quite simple, if not a little fiddly. I figure that I’ll need to get good at this, if I want to finish my game. Anyhow, an example of one of the sprites I created can be seen below. The sprite loops through 4 states, using a spritemap to show a different alien for each state. I’m thinking of using this one as part of my game’s intro.

See the Pen Canvas Sprite – Alien Loop by Philip Newborough (@corenominal) on CodePen.

HTML5 Canvas Blocks #4

The thought of having to choose a colour for something does not sit comfortably with me. I have read all about colour theory, like a million times, but I still feel mentally paralysed when faced with having to pluck a colour from the rainbow. It’s a sickness, I tell you.

So, anyhow, I currently find myself in said position. Normally, my first line of defence is to revert to good old black ‘n’ white, however, this time I’ve made a mental promise to myself to go wild and choose some actual colours. To be clear, I’m not planning on using the colours below. I think they’re a little too wild, but I do the like the combination. The colours are those featured on the Beastie Boys album art for Hot Sauce Committee Part Two.

See the Pen HTML5 Canvas Blocks #4 by Philip Newborough (@corenominal) on CodePen.

Or maybe I should?

HTML5 Canvas Stripes #2

This is the HTML5 canvas animation that I’m currently using in the header of this site. I’m not sure how long it will last on this site, so here is the CodePen. The animation is supposed to look like a giant barcode. It is randomly generated, so the chances of seeing the same barcode twice are quite slim. Anyhow, I love playing around with the canvas element :)

See the Pen HTML5 Canvas StripyWipy #2 by Philip Newborough (@corenominal) on CodePen.