Posts By: Mark

HTML5 Geolocation directions

Posted by & filed under Web Design.


This tutorial for Web Designer magazine shows how to access the HTML5 Geolocation api through Javascript. Once the current location is found, Google Maps API is queried and directions to a business are automatically brought back for the user. The point behind this is, if we can find out the location of the user, we […]

Edge Animate Interactive Features

Posted by & filed under Motion Graphic, Web Design.


This project was created as a tutorial for Web Designer magazine to show the recent interactive features that have been added to Adobe Edge Animate. As this tool is still in beta there is a slight bug in the output shown here, however this is making excellent progress. This tool will become an essential design […]

EaselJS Walk Cycles

Posted by & filed under Games, Images, Motion Graphic, Web Design.


This tutorial for Web Designer magazine was created to show how walk cycles can be created for the HTML5 canvas element with the EaselJS library. This fast and efficient library makes it very easy to add content to the Canvas element in a similar syntax to Flash’s ActionScript. This particular tutorial uses sprite sheets to […]

WebGL Simple Platform Game Demo with ThreeJS

Posted by & filed under Games, Web Design.

I’ve been playing with WebGL, not nearly as mush as I’d like to, but absolutely loving the ThreeJS framework. I thought I’d have a quick go at creating a simple platform game example. ‘Game’ is really an exaggeration but I wanted to keep this as simple as possible so that people can go further with […]

First try at WebGL

Posted by & filed under Motion Graphic, Web Design.

I’ve been reading up on WebGL for the last few weeks when I’ve had the time. I have decided that the best framework to use at the moment is Mr. doob’s excellent three.js framework. The code didn’t take too long to put together and the part that took the longest was actually just getting the […]

HTML5 Canvas EaselJS Video Tutorials

Posted by & filed under Games, Motion Graphic, Web Design.

Easel JS is a javascript framework for HTML5 Canvas that gives it a display list like you would find in Flash. Download EaselJS from here.

These tutorials have been designed to take you through the basics of using Easel JS, making a simple game that introduces interactivity and creating animated content.

Adobe Muse Tutorial for Web Designer magazine

Posted by & filed under Web Design.

There has been a lot of thoughts from the Web Design community about Adobe Muse because it’s a web design tool that allows users to author web content without the need to know HTML code. Not a bad thing you might think and rightly so, but the code it produces does give some non-semantic tags […]