animation Archive

Animating an Offset Value in SVG

In a little experiment I’m working on I recently found a bit of a show-stopping problem. After an APB on Twitter I got a rapid reply which helped me solve it, but it seems that I may be the first person to encounter this error, therefore it’s encumbent on me to document it. So this is that.

Read the full article


A Busted Neon Sign with CSS Animations

For no particular reason other than idle curiosity, I made a demo of a broken neon sign, using CSS Animations (you’ll need Firefox 5, Safari or Chrome to see it). It doesn’t degrade well at the moment, the root cause of which is down to what I think is a bug in Firefox’s implementation – I’ll need to confirm that.

One quick learning from making this: it would be really useful to have CSS Mixins when using a lot of repetitive keyframes, as I do in this animation. The W3C seem to be quite against them, however.


Firefox supports CSS Transitions

Support for the CSS Transitions module, originally proposed and implemented by the WebKit team, has just landed in the nightly builds of Firefox; it’s unsure whether this will make it into 3.6, as this is due to be released in the near future, but should be a feature in 3.7 at least.

The experimental feature will use the proprietary -moz- prefix; I’ve updated the demos in my previous post, Anime with CSS and WebKit, to reflect this.

After performing some brief tests there seem to be a few problems with the implementation; it’s not as smooth as it could be, and the third demo doesn’t work as it should. Update: Found an issue with the browser not recognising a value without a unit (e.g. 0 instead of 0%); fixed the demo, and filed a bug.


Anime with CSS and Webkit

Recently I’ve been thinking about Webkit’s CSS Animation module, and playing The World Ends With You on the Nintendo DS. TWEWY is a JRPG with lots of simple Anime-style cutscenes, and it occurred to me that they must be quite easy to recreate using CSS Animation; so, I have.

Read the full article


Aside

I’ve updated my Speaking page to include more conferences, more videos, and a little on my speaking requirements and preferences. I’m planning to cut down on the number of talks I give in 2014 (twelve is too many), but am always open to interesting offers and opportunities, so please get in touch if you’re organising an event.

[#] 1 Comment . More Asides.