Production Diary

Am I available?

Maybe, who knows?
I should, so get in touch over at Contact .

Fun with Canvas – Creating James Bond Intro

Duh duh, duuuuuum, duh duh d-duh duh duh! …and so on. Recently I’ve been looking to try out a few things I haven’t had chance to before, and playing with Canvas seemed like a fun idea. There’s incredible stuff you can do with Canvas & JavaScript, and this probably isn’t it, but it does shows … Continued

Playing with CSS Drawing & Animations

I’ve been playing around on CodePen again recently, and decided to try my hand on some CSS drawing and animations. Actually, the first animation I did was some ants exploring a magical sugar cube, and rather than drawing the ants themselves I used an SVG (nature is tough to draw). Ants Animation You can see … Continued

100m Sprint (Sass / jQuery) Experiment

Inspired by the Rio 2016 Olympics I started playing around in CodePen and ended up creating this little 100m Sprint simulation. The experiment makes use of both Sass and jQuery random functions to generate a realist (kinda) run across the screen to the finish line – with each race ending in a different result. The … Continued

Super Simple Responsive Progress Bar

Recently for a project I threw together a quick animated and responsive Progress Bar making use of the HTML5 data-attribute. It’s a nice and simple snippet which is easy to implement, though you’ll need jQuery. Example: HTML: <div class=”progress-wrap progress” data-progress-percent=”25″> <div class=”progress-bar progress”></div> </div> CSS: .progress { width: 100%; height: 50px; } .progress-wrap { … Continued

Installing Grunt on OS X and Windows 7

Coming primarily from a PC-based development background, I thought it might be useful to provide a step by step guide to installing Grunt on a Mac as well as a Windows 7 PC. Firstly, Grunt (currently v0.4.0 at the time of writing) is a JavaScript-based task runner; it allows for the automation of repetitive coding … Continued

Happy 2013!

Today you may have dragged yourself back to your day job after living it up over Xmas and New Year (I hope you had a good’n). As many people do, I’ve set myself some goals to achieve in 2013 both in work-time and spare-time. Outside of work I’m hoping to complete my first (and possibly … Continued

Crumbs theme – ‘A placeholder for payment’

I recently realised that a worrying number of clients I’ve worked with this year have been tardy with their invoice payments. This is nothing new, all freelancers have to go through the stress and annoyance of having to chase up late or non-paying clients, politely emailing and patiently waiting until the client decides to kick … Continued

“We’ve Thought Up The Next Facebook.”

The below text is an example of an email I – and I’m sure many of other Freelance Designers / Developers – get all too often. It goes a little something like this: Dear Sir / Madaaaam, We’ve just come across your work and we think you would be a good match to work on … Continued

Adding cropping support for WordPress medium thumbs

If you’re making the most out of WordPress’s media gallery for adding images and auto-lovely thumbnails to your site, you may notice there’s no option for cropping your medium sized thumbs. As of WordPress 3.0.2 and earlier, only the WordPress Thumbnail image property includes the functionality to crop the image down to the exact dimensions … Continued

Auto update WordPress plugins on localhost XAMPP on Mac OSX

Coming from a mainly PC background I rarely had any problems setting up a local version of a WordPress install through XAMPP, however, doing the same on a Mac seems far more problematic. The problem comes when trying to auto-update my local WordPress install along with its plugins on my Macbook (OSX 10.7.3). WordPress would … Continued

Removing inline img dimensions for responsive WordPress websites

This handy code snippet hooks into WordPress’s image_downsize function and removes the hardcoded img attributes width & height, allowing images to scale with responsive websites: In your functions.php file… /** * This is a modification of image_downsize() function in wp-includes/media.php * we will remove all the width and height references, therefore the img tag * … Continued

Don't Be Shy