Freelance Front-End/Client-Side UI Web Developer in Manchester, UK - John Kavanagh

A bold, captivating, and engaging website for Safe Start UK who develop educational packs for primary and secondary schools, educating children about safety online.

Apart from the site needing to be attractive and interesting to both young and adult visitors, it also includes a number of social/interactive areas to allow children to share their posters and in-class creations, and to enter competitions. The website also includes a Flash-based demo version of the games found in the DVD pack.

Richard G. Mitchell is a renowned composer for both television and film, I have been responsible for his websites and online presence for several years. His most recent website is something a little special for me - built on a custom PHP CMS, which I developed myself (!). The intention was to not only to roll out a completely new look but to also allow Richard to maintain the website and contents himself.

Everything is customisable through the backend and allthe videos and music tracks you see on the site have been uploaded by him and encoded automatically from the back end. The front-end is a mixture of HTML4, CSS, jQuery, and Flash for different multimedia types.

This interactive 3D environment was built as part of a pitch to the BBC just at the point in time where QTVRs were making an appearance online.

The 3D environment was built and rendered in Lightwave with the final renderings stitched together and published as interactive nodes. I also rendered out transition scenes which played between each node to give the feel of movement.

There was a number of interactive points within the world (powered by external JavaScript calls to the containing HTML) to integrate games and an explorative interactive feel.

The Transporters is a BAFTA-nominated series of 3D animated short films developed in partnership with the University of Cambridge and the NAS, putting the research of Professor Baron-Cohen into action to aid in teaching children with autism about human emotion and facial expressions.

Whilst working with Catalyst Pictures, I worked on all aspects of this project from 3D model and environment design through to video post-production and the accompanying website (which has since been changed significantly).

A WordPress build for a Guildford-based professional photographer.

Loosely based around - and heavily modified from - a basic template, the site includes full back end control over all content on-page: from the jQuery (and Flash alternative) slide shows to the footer contact details and the creation of custom flat pages.

When the Biker Mice from Mars TV series originally returned after ten years of abeyance, I was the guy taking the original US broadcast tapes and preparing them for European broadcast.

This primarily involved recording the US tapes into Avid, editing out the advertisement breaks (one every seven minutes!), audio levelling, recording back out onto new-format tapes, and distributing them to broadcasting stations across Europe in time for their air dates.

I also rebuilt the official Biker Mice From Mars website although this has since been changed considerably.

Looop is an auction-style marketplace which allows printers to sell high-quality and one-off options in the off-cuts and waste of their daily jobs: areas of print which would otherwise go to waste.

This reduces landfill and at the same time increases the printer's profits, as well as helping individuals who need short-run prints at great discounts.

I worked with the very talented Jamie Scott and Breeze Design on the development of this platform in CakePHP. Using Breeze's designs, I put together the xHTML/CSS views for the site whilst Jamie developed the backend system which makes everything work.

In 2006 whilst working for Catalyst Pictures we were offered the opportunity to produce a "Habbosode" for Habbo Hotel.

As part of the pitching process fourteen animation studios from across the world were invited to create a short animation using very specific characters and with a huge book of guidelines covering everything from environmental settings and music clips to character temperament. We were allowed to develop our own story line and cast our own voice artists.

To the left are some screenshots from our 3D short entitled 'The Duck Strangler', designed and developed in Lightwave and edited in Avid.

Be In Shape is an very successful weight-loss product on the continent so when they came to the UK, they looked to release a new website and rebrand to attract customers in this new market.

I worked alongside Breeze Design in building static xHTML, CSS and jQuery templates which the client could then integrate with their custom web application.

Screenshots to the left are of the template developments as I provided rather than of the .co.uk site in it's current part-integrated state (I haven't had anything to do with the integration of my templates with their site).

Built on top of WordPress in xHTML/CSS/jQuery, the final site includes a lot of customisation to customer requirements including a custom AJAX-powered contact form (with on-the-fly validation), homepage slideshow (fully customisable from the WordPress control panel) and Google Maps integration.

The domain name, although not my own personal first-choice, has proved extremely powerful in channelling visitors and new customers to the site.

QuidCodes was an online voucher site offering the visitor discounts against any number of online retailers. I built the original xHTML, CSS, and jQuery templates (integrated with the custom PHP back end) from design, optimised for high-traffic, cross-browser compatiblity, and quick load speeds.

The website was extremely popular and was eventually taken over by QuidCo who no longer run the original codebase I developed.

The Nice Pictures website is a combination of XHTML, CSS, jQuery and PHP to produce a slick, professional and activating website for this young film company to show off their movies and attract investors.

The intention of this site was to offer a slick and Flash-like experience without the sacrifices to SEO and third-party plug-ins that using Flash generally entails.

Designed by the very talented A-NT, I was responsible for all development, and the website has proved to be a great hit with fans and investors alike. There is intention to expand the website next year to coincide with their next cinematic release.

Piwik (now known as phpMyVisites) is an open-source, community-developed self-hosted analytics tool built on PHP and MySQL.

I worked as part of the original volunteer development team as a tester and front-end developer. My role in the platform essentially involved improving and refactoring the code base for corss-browser compatibility and usability using HTML, CSS, and jQuery.

2degrees is a networking site enabling companies to collaborate on sustainability and environmental issues.

I joined the 2degrees development team as their only client-side (front-end/UI) developer, it was my responsibility to implement and carry out a plan of redesign and rejuvenation of their platform.

Working to PSD design from the talented guys at effect digital, and with diverse requirements (including internationalisation), I rebuilt the front-end from scratch in xHTML/CSS using jQuery, and made a significant improvement on the platform's search engine rankings with on-page optimisation.

The Space Place was the natural continuation of the original Transporters project and followed a similar recipe: a series of 3D animated short films intended to aid children with autism in learning about emotions and facial expressions. In addition, The Space place also included an an entire NAS-accredited learning pack of games, cards, and exercises.

I worked on all aspects of this project from 3D design and development through to final post-production editing, as well as development of the .NET website with Flash-based games.

The I Made A Star website allowed users to create their own 3D music videos staring their favourite pop stars and to their own choreography.

My involvement with this project was in developing the original HTML4 and CSS templates which were later integrated with their backend system. Aside from HTML, CSS, and jQuery, this also included a significant amount of interaction between the DOM and Flash elements within each page, particularly within the process of creating characters with props and environments.

Built in HTML4 and CSS from beautiful PSD design (from the talented A-NT), this was intended as a complete replacement for the old, slow, and buggy intranet of the marketing agency that I worked with at the time.

Sadly the project never made it past the front-end prototype stage as it was always a 'down time' project and the plug was pulled after the studio workload increased.

During 2006 and 2007 I worked on a wide variety of different educational Flash and HTML builds for the BBC Jam project. As I was working for a multimedia studio at the time, production on these projects consisted of anything and everything from live action shoots, to voice-over sessions, 3D animation, video editing, and of course: web development in both HTML markup and in Flash. The service was sadly shut down midway through 2007.

The screenshots to the left are from just one of the projects I worked on, innumerable others have sadly been lost in time.

Guy Meachin is a freelance British photographer. This website showcases his work and chronicles his 12,000 mile journey by land and sea using a Leica rangefinder.

A very quick and simple site, it is built in HTML5 and uses custom @font-face and jQuery for additional interface enhancements. The slideshow use a custom installation of SlideShowPro which uses their RSS feeds, allowing Guy to maintain the slideshows as well as remove and add new ones whenever he gets chance.

Optimised for mobile devices the site also uses the same feeds to display a JavaScript and CSS alternative slideshow for those without Flash.

A relatively simple xHTML/CSS template build with additional UI development in jQuery.

With a very striking (and bandwidth intensive) appearance, the Ziboo site was built specifically for optimisation and performance despite the graphic-heavy design; and integrated with a CakePHP (views) based content management system.

It is worth mentioning that the products section of the site is a more recent addition which I did not develop.