Hello! It's nice to meet you. Welcome to my little corner of the web.

My name is Melissa Jane Magee and I'm a web designer and front-end developer. (I build awesome web sites.)

My favourite hobby (which, luckily enough, also happens to be my job) is to design and build web sites which look beautiful and perform beautifully. I specialise in building semantic, valid and accessible web sites to the W3C standard and I take a lot of pride in my work, creating sites which don't just look good but which work well too. I hand-code all my work to ensure my sites have strong, clean mark-up, and I work hard to make sure my sites are compatible with all major browsers, structuring them to degrade elegantly without technologies such as CSS and JavaScript.

Check out my portfolio to see some of my work, or find out more about me in the (appropriately named) 'about me' section below.

Looking for the design that was featured on InstantShift and OnePageLove.com? Click here to see the previous layout of my portfolio. (Go on! I dare you!)

Portfolio

Classic FM blog
Forth
  • Visual design
  • Front-end development
  • Cross-browser testing
  • Back-end development in Wordpress

The Classic FM blog is still in production but I couldn't wait to show off the visual design. We wanted to give the blog its own look and style while still keeping with the recognised brand of the main Classic FM web site, and I think it works well.

Concept art
Work done with Global Radio; November 2010
Be a Star
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing
  • Back-end development

The Be a Star at the Jingle Bell Ball campaign was terrific fun to work on. As the event was sponsored by Windows 7, we wanted to have a lot of Microsoft's colour and style in it while giving the site its own individual look, and we wanted to show off the capabilities of the new Internet Explorer 9 when it comes to great new technology like HTML5, while still having everything degrade elegantly for users whose systems can't support that. That wasn't out biggest challenge either: as the site had to sit in the style of several different radio stations (such as Capital FM, Galaxy, and the Hit Music Network) and it had to host user-uploaded videos and content, we had some pretty unique back-end challenges to face too!
After I designed and hand-built the front-end templates, I hand-built custom PHP and mySQL to handle the content of the site, like videos which can be filtered by most viewed, and added in a few fun additions like the random output of snow to add interest to the pages. I'm very proud of what we wound up with.

promo.musicradio.com/jingle-bell-ball-2010
Work done with Global Radio; October 2010
Lloyds TSB Offshore
Back Forth
  • Front-end development
  • Building templates and tools (mortgage calculators, saver tools, contact forms) in ASP C#
  • Cross-browser testing
  • Design work including banners

E-scape Interactive have been doing design, development, and analytical work for Lloyds TSB Offshore since 2004 and, in 2009, we were asked to completely redesign the web site with a more attractive, modern look. As head of front-end development, it was my responsibility to build and browser-test valid, accessible HTML and CSS templates, JavaScript using the jQuery framework to add a better, elegantly degrading user interface to the site, and then build ASP.net C# templates for the content management system. We have since gone on to do much more on the Lloyds TSB web site, branching into more interactive projects such as mortgage and budget calculators and online forms.

www.lloydstsb-offshore.com
Work done with E-scape Interactive; from August 2006
Go-Sail.je
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing

I am very proud of the design and development work I did on Go-Sail, especially the repeating header image at the top of the page, designed to stretch across any screen resolution.

www.go-sail.je
Work done with E-scape Interactive; April 2010
Aviation Beauport
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing

Aviation Beauport was a pleasure to design and work on. The client, a private air charter company based in the Channel Islands, wanted a site with a sophisticated, high-end feel to it. Along with the visual design, I did the front-end development for the site before passing everything over to the back-end team to move it into the SilverStripe content management system.

www.aviationbeauport.com
Work done with E-scape Interactive; December 2009
Global Interactive concept design
Back Forth
  • Visual design

This is a concept I came up with, redesigning Global Radio's Commercial Design portfolio to be a bit more corporate and in-keeping with the parent Global Radio web site.

Concept art
Work done with Global Radio; August 2010
Bruno's Bakery
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing

I really enjoyed working on Bruno's Bakery — although looking at gorgeous cakes all day is hungry work! I designed the web site (all except the illustrations on the site which were done by my very talented and very best friend L. Whyte), and built and tested the HTML templates and CSS for it.

www.brunosbakery.je
Work done with E-scape Interactive; October 2009
E-scape Interactive concept design
Back Forth
  • Visual design

This is a concept I came up with for a redesign of the E-scape Interactive web site which incorporated elements and themes from a promotional video we had made, as well as the video itself in a prominent spot on the homepage.

Concept art
Work done with E-scape Interactive; January 2010
Le Gallais Group
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing

Based on visuals designed by Jon Leverrier for the Le Gallais Self Storage site, I designed and built the HTML and CSS for the Le Gallais Group site, keeping it consistent and in-theme with the rest.

www.legallais.co.uk
Work done with E-scape Interactive; March 2010
Radio Sales concept design
Back Forth
  • Visual design

This is a concept design for a corporate web site for Global Radio's sales team, featuring easy-to-access and digest statistical information, blog-style news headlines about the company, and a showcase of work.

Concept art
Work done with Global Radio; November 2010
Radio Sales concept design
Back Forth
  • Visual design

This is a funkier, less corporate concept design I proposed for the new Global Radio sales team web site, bringing across the youthful and fun aspects of our radio stations.

Concept art
Work done with Global Radio; December 2010
Radio Sales concept design
Back Forth
  • Visual design

This is another concept design for the Global Radio sales team web site, incorporating the more corporate structure with some bright colours and fun textures to bring a fresher feel to it.

Concept art
Work done with Global Radio; December 2010
Reed Insurance
Back Forth
  • Front-end development
  • Cross-browser testing
  • Back-end development in ModX

I was given Jon Leverrier's quirky and colourful designs to make into valid and accessible CSS-based HTML templates which I took through the entire development process, moving the templates into ModX and building custom PHP forms and features such as the insurance quote enquiry forms. I also built a lot of custom code for the back-end of the site to make it as easy as possible for the client to change around large sections of the web site without needing to know how to code first.

www.reed-insurance.com
Work done with E-scape Interactive; March 2008
Voodoo Beans
Back Forth
  • Front-end development
  • Cross-browser testing

Voodoo Beans is the (frankly incredible) portfolio of my best friend L. Whyte. She designed the layout herself, injecting her unique sense of humour into every pixel (particularly the pixels making up the monocle on the Monoctopus, I think). I used a lot of jQuery on her site to create fade-in effects over the link hovers and smooth scrolling anchor links to move up and down the long single page. (Viva la smooth scroll!) I also built some custom JavaScript to pull through external code from the individual gallery pages and embed it into the main page, to create the pop up windows on the gallery.

www.voodoobeans.org
Freelance; February 2009
CSS Zen Garden
Back Forth
  • Visual design
  • Building CSS
  • Cross-browser testing

Last year, I submitted this design to the CSS Zen Garden, an institutional web design project which shows what can be achieved through pure CSS by asking developers to create different styling for the same piece of source code, not allowing them to make any changes to it. The project no longer seems to be updated but I thought it was a brilliant excercise and I really enjoyed the challenge of creating and building a working design reliant on someone else's work style and unchangeable code.

Click here to see the template design
Freelance; March 2009
Mange Tout
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing
  • Back-end development in ModX

Mange Tout is a chain of (wonderful!) coffee and sandwich shops based in Jersey in the Channel Islands and, as one of their biggest fans, I especially loved working on this project which I took from the design stage all the way through production and development. I decided to build Mange Tout in ModX, using a lot of custom PHP for the weekly 'Soup Letter' and the easy-to-amend menus. I also utilized JavaScript (using the jQuery library to keep file size down) to add a more interactive dynamic to the site.

www.mangetout.je
Freelance; October 2008
MJMagee.com
Back Forth
  • Visual design
  • Front-end development
  • Cross-browser testing

I've had some lovely comments about this design over the years, even getting a position on an InstantShift article spotlighting fresh portfolio designs. The idea behind the design was to hint at a fairy tale world like Wonderland using stock images which I cut out and manipulated to make them seem a little other-worldly, like the Cheshire Cat with the disproportinately large head.

Click here to see my previous portfolio design
Freelance; August 2008
Spike Productions
Back Forth
  • Front-end development
  • Cross-browser testing
  • Back-end development in Textpattern

Spike Productions was a very interesting challenge! I was given Jon Leverrier's (gorgeous) design to take all the way through production and development, moving it from a visual to a fully-functional web site. Production on a web site typically includes cutting up visual designs and optimising the images for use online, building valid, accessible, and search engine friendly code which degrades elegantly, and ensuring the code works across all major browsers and screen resolutions. Jon's unusual design on this project meant that Step One on this took a lot of trial and error! I'm happy with the end result, though. (And thankfully so is Spike Productions!)

www.spikeproductions.co.uk
Work done with E-scape Interactive; March 2007
E-scape Interactive
Back Forth
  • Front-end development
  • Cross-browser testing

We decided to spruce up the E-scape Interactive web site in 2008, giving it a fresh design and moving it into new CSS-based HTML templates. I built and browser-tested the HTML and CSS, and used the jQuery framework to create accordian menus and some fun fade-in effects for the navigational tabs to add a little something extra to the design.

www.e-scapeinteractive.co.uk
Work done with E-scape Interactive; October 2008
Blooming Direct blog
Back
  • Front-end development
  • Cross-browser testing
  • Back-end development in Textpattern

I set up the Blooming Direct blog in Textpattern, based on work the (genius) designer Jon Leverrier did on the main Blooming Direct site. Although different content appears on different pages, I managed to set up everything in only one template rather than cluttering and confusing things.

blog.bloomingdirect.com
Work done with E-scape Interactive; March 2007

About me

I won't lie to you, I'm the luckiest person in the world. I'm a web developer and designer and, as Ian Staunton puts it, that means I get to colour in the internet for a living — it's the best job there is!

Long before it was my career, web design was my hobby and, all in all, I've been coding and designing for over twelve years, from the moment I discovered the internet (and where they keep the crayons).

Professionally, I have worked in the web design industry for around seven years, including four years with the Jersey-based digital agency E-scape Interactive where I worked as Production Manager, in charge of front-end development and design. I'm currently working in London as a Developer and Designer on the commercial team at Global Radio, the mad geniuses behind Classic FM, Capital FM, Heart, Xfm, LBC, Galaxy, and just about every other radio station worth listening to (which I am in no way contractually obligated to tell you). With Global, I've had the chance to work with some incredible, clever people like Pedro Ramos and Jo Conlon, doing work for amazing clients including Microsoft, Ford, BT, and Sony Ericsson. I told you I was lucky.

I am...

  • twenty-six
  • a very fast learner
  • always happy to buy the first round
  • tremendously polite
  • an avid reader
  • a bit of a nerd
  • faster than a speeding bullet
  • the best there is at what I do, bub
  • Scottish
  • always taking initiative
  • easy to get along with
  • neutral in the war of PC versus Mac
  • a film buff
  • meticulous
  • a vegetarian
  • smarter than the average bear
  • what I yam and that's all what I yam

I rock at:

  • Building hand-crafted standards-compliant code
    • CSS
    • (X)HTML
    • JavaScript and AJAX (including frameworks like jQuery)
  • Graphic design
    • Web site design
    • Online banners and ads
  • Working with industry-standard tools and programs
    • Adobe Photoshop
    • Adobe Dreamweaver
  • Knowing and using the best Content Management Systems
    • SilverStripe
    • Wordpress
    • ModX
    • Textpattern
  • A little light programming
    • PHP
    • C#
    • ASP.net

You can find out more about me and what I rock at by downloading my résumé in .PDF format, by checking out my LinkedIn and DeviantArt accounts, or by following my 140 character ramblings on Twitter.