Pearson aspire to be the world’s leading learning company. They believe in every kind of learning, for all kinds of people, wherever they are in the world. In the UK, Pearson have an educational heritage rooted in names like Longman, Heinemann, Prentice Hall, BTEC and the exam awarding body Edexcel.

In the UK and many other countries, Pearson have built a reputation for improving learning through innovation in education.  They are committed to continuing that process for years to come and henceforth their maxim “Always Learning” reflects just that.

Recent debate in the media has reflected on the quality of education and examinations in Britain. Pearson are leading the debate having recently developed a report tackling the very issue of examination standards in Britain. I was tasked with the design and build of a microsite to showcase the report and facilitate the debate around the subject. Visit Leading on Standards to join the debate.

Global Metal Talent

Band Profile Page

The band profile page is an important one in reflecting a bands style and ‘bio’ along with the presentation of ratings, reviews, tracks, video, and comments. From a functional point of view, bands also use this page as a dashboard to upload content and embed multimedia from places like SoundCloud and Vimeo.

Fan Profile Page

An essential element of the fan pages is that it promotes friendship, sharing, comment and debate. Several content feeds exist on this page either associated to the specific user, or general site activity updates relating to new bands. Of course fans need a profile too, and this enables them to be specific about their tastes and opinions enabling them receive musical suggestions based on their specific preferences.

Band Reviews Page

Reviews are written by the wide fan base on GMT as well as the Metal Hammer editorial staff and A&R music industry representatives.

Future Publishing

Future Publishing are one of the largest media publishers in London, selling 3.2 million magazines each month. One of their titles Metal Hammer, provides the latest information on heavy metal and hard rock. Metal Hammer’s proposal to launch a site for unsigned bands offered plenty of scope for innovation.

Engaging Music Fans with the Social Web

It’s safe to say that metal fans love sharing opinion and engaging in debate on the music, discussing elements such as the intricacies within the sound and the technicality of the musicianship. Taking inspiration from this point of interest with metal fans, coupled with the development of the ’social web’ in the last few years, we had the perfect recipe to develop a thriving social platform, Global Metal Talent (GMT).

The global element of the GMT site reflects the massive growth of the metal industry around the world in recent years, particularly within countries such as India, Indonesia, and more widely spread across South East Asia and South America. To demonstrate the widespread appeal to metal bands and fans alike, we encorporated a global Google map pintpointing new bands around the globe as they sign up. Whilst developing the concept of GMT I spent time developing rating and review systems for bands, enabling fans with the power to determine the fate of unsigned bands. Simultaneously the site also provides the opportunity for unsigned metal bands to gain recognition whilst enjoying the comments, reviews and ratings provided by a stimulated fan base. Not to forget, valuable exposure to A&R representatives of the metal music industry, provided by Metal Hammer.

Global Metal Talent Radio

To further the exposure of unsigned bands on GMT we developed a standalone media player which plays through the tracks of registered bands. The tracks played on the GMT radio really give a sense of the broad range of musical styles within metal sub genres as well as the global diversity of the platform. One minute it’s doom metal from Argentina and the next minute it’s death grindcore from India!

My Role…

My role throughout the assignment was to provide creative thinking around methods of engaging the metal fan base, defining the product specification, and designing the website.

Western Union teamed up with leading PR agency Blue Rubicon and development agency ideas.org to develop the brief. As Project Manager I worked with ideas.org founder Simon Grice and the talented team of designers and developers.

The initial concept contained many great ideas which resulted in 3 fundamental elements for the site including stories of Western Union’s history, an interactive representation of world economic data, and a Facebook Application which shows how globally networked you are.

Western Union World

Flat designs of the initial concept were developed in house at ideas.org and were met with keen approval by Western Union. It was then time to prepare for the build phase, the site was developed using Flash, embedded in HTML, and using XML, PHP, Javascript and a MySQL database to present requested information and data. We worked hard conceptually to engage users by promoting interaction and allowing data to be manipulated by site users.

The landing page embodies the three key elements of Western Union World, Western Union’s geography, history, and their diverse base of customers, the social element.

Western Union’s Historcal Timeline

Prior to working at Western Union we had no idea just how rich their history was. It’s a history which boasts some of the most progressive technological innovations of our time, from the first transcontinental telegraph, to the inventions of telegram, desktop fax, the credit card, microwave communications and launching the first commercial satellite in the US. With employees such as Thomas Edison, it’s no wonder Western Union maintained their status in leaders of technological innovations.

We worked closely with Western Union’s Communications team in the US to gather content and stories in order to depict their history on an animated timeline. The results are great and successfully tell the Western Union story, from 1851 right up to their latest innovation, the ability to transfer money over mobile and iPhone applications.

Western Union World – Economic Data

“Our World” is aptly titled, it’s the element of the site presenting economic data for the world we live in, fundamentally in relation to Western Union’s operations. Our focus and key challenge in this exercise was to create methods of visualising a wide range of data in a compelling and engaging manner. The landing screen here enables users to control data sets on a world view. Each country has a 3 dimensional elevation depicting values for a chosen data set such as population, gdp, or value of imports and exports. The elevations on the world view allow users to compare and contrast between countries across the world at a glance, it’s interesting to see features such as the surge in GDP in the US in recent decades.

From the world view, users can click through to specific country views by clicking on the outline of a chosen country. This then presents a page containing a wide range of data pertaining to that particular country. There are several data sets which are of specific relevance to Western Union, one of which is the corridors, or routes that money travels in from one location to another, as depicted below.

Another interesting data set is shown in country 3D elevation, GDP Vs Remittances (as % of GDP). This shows the percentage of a countries total GDP that is made up from transfers (or remittances) made by Western Union customers. An interesting fact that depicts Western Union’s role in the economic growth of developing countries.

Your World – Western Union Facebook Application

How globally networked are you?

The third section of the Western Union World is the Facebook application. We built this to build Western Union’s online engagement with their customers across the globe. An interesting and compelling interactive app which we built using Facebook’s API, and presenting user network data in a stimulating way. The concept is relevant as it let’s users think globally and it’s often interesting to see how unexpectedly diverse your network can be.

The app was launched with a viral affect, experiencing 180,000 logins in the first week. Celebrities were chosen from a variety of countries to promote the app and at the same time allow us to see what a widely networked individuals visualisation would look like.

Again we included the option to select a particular country so that users can have a closer look and see what their network looks like in that country, identifying friends they have in each location.

The creative concept to visualise user networks as planets within an appearance of a galaxy was the input of the talented team at Blue Rubicon. Creating their vision combined with Western Union’s requirements was a real challenge, but it was thoroughly enjoyed by the team at ideas.org, resulting in a combined effort which everyone is proud of.

Visit Western Union World.

I recently worked in a small team to deliver a Facebook application for the fun, fearless and retro cosmetics brand Soap and Glory. Whilst S&G craft many shower and bath products, they wanted to develop a campaign to promote resourceful use of water, and the positive effects that saving water can have on the environment. Whilst S&G have a large fan base and high level of consumer engagement on social media platforms, where better to promote the campaign than Facebook?

I worked in a small team to aid the client with the creative strategy of the campaign and technical aspects of developing applications for Facebook. Whilst Facebook’s ever growing platform for developers increases in popularity, so does it’s rules and regulations for brands leveraging the platforms ability to interact with target markets. We worked closely with Facebook’s guidelines adhere to regulations without inhibiting the experience and it’s potential for social engagement.

My fundamental role was to provide Project Management and planning, including the wireframing and technical specification for the app. Many revisions were required to ensure the application was just right, from copyrighting to technical functionality and browser testing. Working with S&G on this project was a thoroughly enjoyable and insightful process with a wonderful outcome.

The 2 Minute Rinse

Marcia Kilgore, the entrepreneur who founded Soap and Glory was talking with a green expert who said that one of Britain’s biggest environmental challenges would soon be water shortage. From this the idea of the “2 minute rinse” was born. Effectively a shower which only uses 2 minutes of running water, which after research undertaken by S&G staff, was determined to be the minimum required amount.

User Journey

Once the idea was conceived S&G worked on the creative development of the concept, storyboarding the user journey and how the application would work. Features included an internal Facebook wall, downloadable water facts infographic, downloadable 2MR profile pics, a competition with data capture, and an interactive infographic which updates to depict total water saved by everyone who takes the pledge and logs their 2 minute rinse within the application.

Technical Build Phase

I worked with the talented Stephen Forster-Brass who developed the Facebook application using XHTML, CSS, PHP, AJAX and Javascript. The application runs from a MySQL database and sits in an iframe accessible from S&G’s Facebook page.

Untap.it are an innovative, self-sustaining not-for-profit enterprise with a passion to inspire people to use their hidden potential. Endorsed by Richard Branson, they have the innovative edge of an entrepreneurial business, but with the heart of a charity beating within it.

I recently built a microsite for Untap.it to showcase their company videos, one of which features Richard Branson’s explanation of what Untap.it do and how they plan to tap into the inner potential of the everyday person. The second video contained statistics and animations depicting both the necessity and the opportunities to tap into the vast potential locked inside every person.

In order to stage this video to the widest possible audience it was important to create a microsite that was compatible with every conceivable browser and device. In order to accomplish this I referred to Longtail Video who recently developed a Javascript embeddable version of their JW Player, playable in flash or via Javascript, on iPhones, iPads, Andriod mobile devices, a vast range of browsers, and even the latest HTML5.

Visit untap.it to view the video of Richard Branson explaining Untap.it’s mission and purpose.

Back in June I worked with new brand agency Aesop to develop a digital invitation to their launch party. Aesop are a unique brand agency who put emphasis on unearthing the valuable stories behind brands, defining them, and marketing them effectively to enhance consumer engagement.

It was this unique approach that brought the Aesop partners together to create a great story themselves, and since they are brand storytellers their own messaging and identity couldn’t be more appropriate. They have created their own set of universal branding guidelines and principals based upon the famous Aesop’s Fables, “little friends, may prove great friends” and “grasp the nettle” are familiar sayings that relate wonderfully to brands and storytelling.

I was called upon to design and build the digital invite for Aesop’s launch party. An entertaining digital animation based on Aesop’s brand identity, inspired by Terry Gilliam’s illustrative styling for Monty Python. The brief was to create an impactful microsite in which the user lands on a page displaying an old fashioned canon which instantly sparks to life with a burning fuse followed by a flashing explosion. Some illustrations are fired from the canon which the user can then explore by hovering over to view an animation, and clicking to view wonderfully ornate picture frames containing details on the launch party with an interactive RSVP form.

The site was created using hand coded HTML, CSS, Javascript and PHP. With the request to avoid using Flash (which is increasingly common these days) I achieved the required interactivity for the site using static images and Javascript classes to enable animated gifs on mouseover.

Aesop’s launch took place on 12th May at The Royal Institution of Great Britain. It was a wonderful evening hosting many of their exciting new clients, speeches from the company founders, and modern day storytelling and poetry from the talented Francesca Beard.

In May this summer I spent some time freelancing at the offices of Magazine Group, part of Dennis Publishing. Magazine Group are a supplier of over 600,000 individual magazine subscriptions and the biggest independent online subscription agent in the UK.

I joined the web design team to help with email marketing campaigns and promotions for leading magazine titles such as GQ, Time, Mens Health, Maxim, National Geographic, Elle, Cosmopolitan and many others. Targeting a wide base of subscribers I worked on 6 emailers for leading titles by preparing html layouts, sourcing content, designing icons and call to action buttons and building links to the Magazine Group website promotion pages.

Besides developing the range of marketing emails, I worked on designing banner adverts for websites and Magazine Group affiliates. The advertisements were produced in a wide range of sizes and dimensions in order to be placed within a variety of different website layouts. The main components of the adverts were to feature images of the titles, state the offer in headline format, and prompt click throughs using call to action buttons.

True Independent Content Production

I’ve just completed a freelance web design assignment for True Production, the creative agency of experienced television advertising producer Paul Fenton. Paul has spent a career within the television advertisement production industry, working with what seems like an endless list of blue chip companies who have competed to create the most memorable, persuasive and identifiable advertising campaigns to grace our television sets. After 20 years creating TV ads for companies including Barclays, BMW, Nike, Lego and Virgin Airlines (to name a few), True Production was launched as an independent agency to foster relationships within the advertising industry and provide a fresh approach to television advert production. I was fortunate enough to be enlisted by True Production with the task of designing and creating their new company website. It proved to be a thoroughly enjoyable and challenging process.

The Brief

What’s it like to work directly with creatively literate clients? That’s a question many freelance designers will be familiar with. True Production was formed by award winning Heads of Broadcast at top ten international agencies and creative hotshops, and it proved to be a great relationship. Paul Fenton worked closely with me throughout the creative process, with high expectations underpinned by an innate understanding of the challenges and restrictions presented by designers working with the web.

So once again the brief was simple, but that doesn’t mean it was going to be easy. Create a unique brand with an unconventional website layout. That sounded interesting to me already… but it didn’t stop there. The next request was to create the website using motion animation effects to create a site which looks like it was built using Adobe Flash, but isn’t.

Huh? …Okay so the rationale behind this was to recreate the smooth and elegant animation effects of Flash without the restrictions presented . Whilst Flash creates some great effects, it is not compatible with every web platform and browser. For instance Apple refuse to support Flash in any of their mobile iphone and ipad devices. It’s no secret however, see Apple’s Thought on Flash for their explanation and reasoning behind this. Furthermore whilst Flash is embedded onto a web page, search engine optimisation can suffer due to the absence of live content and text.

The Technology

The site was hard coded in XHTML and CSS, using Javascript and JQuery techniques to achieve the animation effects. Use of the CSS @font-face allowed me to offer True Production a much greater range of web embeddable fonts. Use of CSS gradients and the JQuery ’scrollTo’ command created the effect of a background colour fade whilst the page scrolls as the visitor clicks on items in the navigation menu. As the visitor navigates through the site, the pages gradually become darker moving from white on the homepage to a very dark shade of grey. A simple Javascript text fade transitions once the page scroll has been activated and the page lands, elegantly fading text onto each page… Just like Flash!

Whilst many of these effects work beautifully on our latest versions of Safari, Chrome and Firefox… Internet Explorer proves to be very difficult to work with as ever. Particularly the older versions such as IE6. Conditional comments and IE stylesheets were used to overcome these problems, creating alternate versions of the website whilst still making the most of these effects. Whilst the results in IE6 and 7 are still good, www.trueproduction.com is best viewed in WebKit powered browsers.

Visit www.trueproduction.co.uk