What's New

For the past few years, I’ve been walking the same 300 yards, past the same shops to the same Supermarket to make the same purchase – at least once a week. It was a routine, comfortable and easy and I could do it on autopilot.

A fortnight ago though, that all changed, and, in the words of Shaun Ryder, it is twistin’ my melon, man.

You see, the Tesco in Sevenoaks underwent a major refit. Whilst I appreciate the exciting new array of imported American candy, I’m not so enamoured with the layout which has left me wandering the aisles like a bewildered supermarket zombie, arms outstretched looking for a box of soya milk, groaning.

My pattern has been mixed up and my mental model ignored.

Mental Models

The idea of a mental model is, to put it simply, the notion of using real world familiarity to improve how they use a system. From a usability perspective, any interface should be designed to be consistent with people’s mental models about computers, environment and objects. It makes sense to make a calculator program or interface to share similar functionality and design to a physical, familiar hand-held calculator. By doing this, you create a sense of familiarity and security.

A simple example of this would be Apple OS X iPhoto Albums, which represent a real, physical photo album and works accordingly. Apple likes to term this as using ‘metaphors’ to shape apps and native programs – you can read more about Apple’s principles of UI design here.

But now, back to my increasingly desperate attempt to locate soya milk.

Previously and initially, instinctively, I was able to find the soya milk within the cereal aisle. Examining the mental model in place, if I wanted a bowl of cereal, I’d also be needing milk. Of course, through experience and a known pattern, we know that cow’s milk needs to be chilled and is usually alongside other dairy products and therefore isn’t likely to be found next to the cereal. Soya and other non dairy milk doesn’t need to be kept chilled, therefore it makes perfect sense for it to be next to or near the cereal.

Further to this, the cereal aisle was sandwiched between the home baking and tea/coffee aisle. It just made sense. It was roundabouts, within the same space as the mental model would expect.

As I sit here, writing this out now, I can’t actually remember where the soya milk I so yearn for is in the newly renovated and rearranged Sevenoaks Tesco - this after several attempts, each becoming gradually more infuriating. It isn’t where it used to be. It isn’t in the drinks aisle. It isn’t within the cartooned drinks, dairy or baking sections. It definitely isn’t anywhere near the tea or coffee. Where the heck is it!


I have found it on each of my previous visits but its location didn’t make enough sense for me to remember it from one time to the next, there is seemingly no reason or rationale for its current location, so I haven’t been able to create a pattern to recognise it. So, as a model or pattern, it is failing again, by not doing enough to make me understand or remember why it is where it is.

Despite cheery people dressed in yellow holding huge ‘Can I help You’ lollypop signs, being proud and British, I of course resist all attempts to help, instead relying on intuition, problem solving and the mental patterns my brain has built up to help me locate my goods. Except, they fail me and I instead resort to writing a meandering (although cathartic) blog post about my frustration.

So what can we, as designers, developers and architects learn from my disappointing soya milk experience – firstly, the importance of familiarity, be it of in-built models and patterns, plays an important role in how a user interacts with, and expects to be interacted with.  Secondly, if an expected pattern is not conformed to, or if a new pattern isn’t clearly signposted all that you leave your site visitor with is a sense of frustration and disappointment.

I’ll post an update on Twitter [@InsideWickedweb ] when I do track it down, so keep a milky eye out for that exciting piece of social media, but for now the morale of this story is, don’t just move something somewhere it fits. Put it somewhere it makes sense.

If your Twitter timeline or Facebook feed has seen a dramatic influx of colourful caricatures bearing a resemblance to your friends over the past fortnight, the chances are you’ve already heard of iMadeFace.

The new iOS app stormed to the top of the free charts on the App Store in multiple countries, including the UK and USA. The popular app, iMadeFace, helps turn its users into a cartoon in just a few minutes thanks to the wide variety of templated facial features.

The simple app design allows almost every part of the face to change with a simple swipe. iMadeFace users can scroll through a variety of hairstyles, pick one and then change the colour – and then share it with your friends. You don’t have to worry about lighting, background or photobombing to create the perfect digital you – and you’ll never have a digital hair out of place.

But iMadeFace is just the newest kid on a very big block.

The Family Tree

To understand the place of the pixel person, we need to begin by looking at the fixed square (usually less than 100 x 100px) that they were originally restricted to – the ‘avatar’. Whilst you might remember them as a gangly blue smurf alien, here we’re talking about the graphical representation of a user, their alter ego or personality originally used in the ambitious 1985 Lucasfilm videogame community, Habitat.

Avatars are common amongst virtual communities such as Habbo Hotel, Wee World and The Palace where research has shown that younger users often labour on the fun aspect of avatar creation, looking for the most amusing rather than the most accurate – in fact, younger users often use avatars to conceal their identity whereas older users look to create a more reflective representation of themselves, often spending money on extra clothes or that perfect pair of glasses.

The rise of Facebook, LinkedIn and before them, Bebo and MySpace, has seen a shift in popularity (and ease) towards real life photographs for avatars as the importance of recognition begins to play a more important role. Technology has played a role too, with users now able to upload and crop their own images.

Whether we like it or not, the web has become a more open place, bloggers jostle for the most traffic and work hard at building themselves into a trusted, recognisable source of information. We see more faces online now, than we have ever done in the past.

Will the digital avatar allow users to retain a level of anonymity? Can you imagine a world where your Facebook feed is filled with caricatures of your friends?

Unlike several braver, more athletic, members of the Wickedweb team who don capes, masks and utility belts out of hours to tackle crime in the leafy suburbs of Sevenoaks, or London’s gritty streets, I tend to spend my time designing and making statement jewellery and maintaining Little Moose – an online store selling bags and jewellery that I started with my partner 3 years ago.

In a way, I’m the embodiment of our team structure at Wickedweb. Acting as designer, developer, search, social and account manager for my own project – I’m able to draw on my day-to-day experience here at Wickedweb, across a variety of clients and collaborations and put them all into practice.

Keeping things as brief as possible, Little Moose was started as a place to sell products that my wife was designing for a large UK wholesaler, support emerging designers, and peddle our own wares. Although the prospect of stepping foot into the pool of rabid e-commerce stores and consumers was daunting, it was clear that an opportunity did exist.

The online shops we would be competing with initially were poorly optimised and we felt confident that with even a basic knowledge of SEO and Social Media, we could quickly start to make an impression. Little Moose came to life in August 2010 – to a little fanfare!

Creativity

Working on a brief that you’ve essentially set yourself is an interesting position to be in. We knew who we were, and we knew that for the most part, we represented our target audience. The freedom this afforded us was refreshing.  The creative style of Little Moose is a mix of cute, quirky and fashion. We’re definitely both inspired by amazing character illustrators like Tado, Peskimo and John Burgerman, with a healthy dose of the Far East thrown in. The site has only gone through gradual visual changes since inception, introducing slightly more sophisticated typography to appeal to more fashion led consumers and publications.

To be honest, the actual designing of products was until recently, not my domain. I was responsible for the Little Moose website and social media – as well as keeping an eye on Google Analytics and the search performance. Recently though, I’ve delved into producing my own statement necklaces and thoroughly enjoyed the experience. Just like designing a website, you have to consider trends (which are even faster moving in the fashion world), user experience, aesthetics and the target audience.

Knowledge

For me, one of the most enjoyable things about running Little Moose is the necessary understanding that has to go hand in hand with running an online business. Decisions have real time impacts and your brand is out there for all to see and comment on.

What with working at Wickedweb, and looking after Little Moose, I spend most of my time immersed in all things digital. Having a side-project allows me to knowledge share between the two. I have a real life working example to try out new techniques, be they UX, SEO or Social Media and experiences both at home and at work can help shape a project for the better.

Usability

I must confess, I hadn’t placed much thought into the checkout process of Little Moose, sticking to the method that essentially came out of the box. That all changed 6 months ago when a studio project required a complete overhaul of the e-commerce basket process. Having buried myself in the current basket trends, gone through a hundred or so working, live examples and absorbed conversion rate statistics until my brain started to hurt, it became clear that there was more that could be done to Little Moose to increase conversions.

Search

Perhaps the biggest challenge for any website, but particularly an e-commerce store, is the need to appear at the very top of Google. The best looking site in the world won’t make any money unless people can find it. Whilst I don’t profess to be any sort of SEO wizard, I’ve been working alongside the Wickedweb Search Team long enough to have had their ideal scenario drilled into me.

Whilst competing for general search times in a crowded market place (fashion) is a challenge, Little Moose performs well on a product basis thanks to optimised pages. Last year, we began a blog to enhance keywords and provide some added value, and recently I’ve started to introduce more cross linking between pages. One area we’re still trying to progress is the art of link building as with each passing Google algorhythm, its importance increases.

Social

Finding your tone of voice can be tricky; finding things to say can be even trickier. Social media and the engagement that you draw from it are of huge importance for any brand.

As with SEO, I’m certainly no Social Media guru, but over the course of the years I’ve followed what successful brands are doing and keep a keen eye out for any statistics. Did you know that Thursday evening is the best time for a fashion brand to post on Facebook? Neither did I, until recently.

As well as Twitter and Facebook, we’re developing a presence on Pinterest and Instagram. Particularly, the possible benefits of Pinterest are obvious – a visual sharing tool is huge when you are selling desirable items.

So why not head on over to Little Moose pick up some great gifts, bags or accessories, or of course, just say hello on Twitter or Facebook

Usually, whenever I write any New Year’s Resolutions, they’re quickly scrawled onto a scrap of paper, stuffed in a drawer and forgotten about – a task done out of a misplaced sense of duty and tradition rather than promise. Some day, I imagine finding them all and weeping to myself at everything I’ve failed to do.

Not this year though, this year, my design resolutions have been locked inside the unnerving eternity of ‘online’.

Explore More

An important part of the human psyche is to explore. Millennia ago, exploration sent a group of peoples from Africa throughout the continents, populating the world as we know it today. Captain Cook set sail, not knowing what may await him, during the ‘era of exploration’ and man set foot on the moon two hundred years later. Not content with visualising a future populated by tall blue smurf-aliens, James Cameron hopped into a solo submersible and went deeper into our ocean than anyone previously.  To this day, men inspired by Neil Armstrong and Buzz Aldrin are queuing up to board the first manned expedition to Mars.

That desire to explore also applies to design and how we approach new challenges. The best solutions are not the most obvious and we designers need to bravely tread new ground in the ever changing digital landscape.



Lose Weight

Or more specifically, trim down on the unnecessary fat. At our core, designers are problem solvers. We try to make a message as simple and easy to understand as possible and we enable someone to find something without them having to think about it – then we package all of that up as beautifully as we possibly can.

The more unnecessary garnish we lavish onto that process, the more difficult it is to remain true to those ideals. The days of elaborate flash intro pages have (rightly) long since passed, but there are many more ways to cloud the user experience with fussiness and overzealousness.

That isn’t to say we shouldn’t indulge ourselves every so often with a delicious steak, but it should be the finest steak available, cooked to perfection.

Achieve Zen

Striking the balance between beauty, technology, content and function is one of the biggest challenges, and headaches that designers face within the industry.

Increasingly, other factors are taking a wider and larger role in the final design output. Marrying a beautiful design to strong SEO to CMS to variable devices (and to a set deadline and budget) is something that can seem impossible at times – but it can be done, and should be strived for.

Visit the library

I talk about developing your own individual visual library a lot in the Wickedweb studio. A resource bank of images, quotes and more that help to shape and guide your way of thinking. No two will ever be the same, because we are all uniquely different people. By creating your own library, rather than relying on existing ones (such as popular design sharing communities) you can create a design in your own image, not someone else’s.

There is an awful lot out there from which to draw inspiration, it might be on a screen, on a page or in the garden, but it is out there and as designers, we owe it to ourselves to seek it out, and enjoy it – we’ll be better for it.

In between chomping into mince pies and glugging mulled wine on Christmas Eve, my mother confided in me that she held as much fear about the ritual of gathering around the Christmas tree on Christmas morning and gleefully unwrapping presents, as she did excitement. Not being one to ruin the magic of Christmas, I enquired further.

“I hate buying presents for you” she said, with an undercurrent of truth.

 “Why’s that” I enquired back, suspecting the reason wasn’t simply because she secretly hated me.

“Because I know you’ll look at it and think about how it could be improved” came her apologetic reply.

To a degree, she was right. After the initial rush of festive excitement and the post-dinner comedown, I found myself speculating about the design on a mug, the legibility of a DVD synopsis and the colouring and pattern of a fine piece of festive knitwear.

Now, this doesn’t make me some sort of ungrateful enfant terrible, I’ve done far worse to deserve that title. But that eye for detail and attention to ensuring that nothing is ever truly ‘finished’ is what makes all of us at Wickedweb the right people to ensure that your brand is working towards Digital Brand Engagement.

It also means we’re a collective nightmare at Christmas and birthdays, but alas, we all have foibles.

In this day and age, every brand has a website, so it simply isn’t enough just to be ‘digital’. Your online presence needs to work, and work hard, to ensure you aren’t just another one of the 644 trillion websites. But what exactly is Digital Brand Engagement?

Cracking

If you think about it, the humble Christmas cracker is perhaps, one of the finest examples of engagement there is.

The Christmas cracker, an ever-present at our dinner table, brings people together no matter if they are friends, family or even strangers. I would hazard a guess that if you went out in London on Christmas Eve with a sack full of Christmas crackers, you’d come back without any and a handful of toenail clippers.

At its heart, it is inclusive. A Christmas cracker won’t stop anyone from interacting with it for something as silly as the size of the table they’re sitting at or the language they speak. It has the ability to unite people from all walks of life and gives them a shared, positive experience. Apart from that initial moment of excitement as you wait for the ‘bang’, the Christmas cracker rewards its users with a gift – a paper hat you can all wear, a pack of mini playing cards and a bad joke you can tell over and over again.

Q. Where does Father Christmas go to recover after Christmas?
A. An elf farm.

So the next question is, how can we make a Christmas cracker digital and unfortunately the answer isn’t quite as simple as a party hat and a joke – although we do try and work a big ‘bang’ into every brand we work with.

Customers are now more empowered than ever to pick and choose which brands they interact and engage with and now, 50 years after the pioneering marketing theorist Wroe Alderson first suggested that businesses should organise around their customers and their needs, supplier-centric pathways are diminishing rapidly in the face of social media and ever changing digital technologies.

From my perspective, the role of design is to aid in promoting engagement and interactivity. Whilst the mechanisms for engagement itself will likely be a technical or social, design can assist in ensuring that the ability to engage is as simple and obstacle free as possible. Aside from promoting engagement, design has the ability to set, enforce or change a perception about a brand; this ability to create a mindset is an incredibly powerful tool to assist with engagement. If a customer visits a website and has a negative experience, their engagement is likely to be shaped by it – it is therefore essential to factor in design, usability and technology into the mix when discussing Digital Brand Engagement.

 For more information on how we can make your digital brand engaging, please contact anna.dixon@wickedweb.co.uk

As a follow up to my recent post on Instagram, I’ve turned my attention to another visual discovery network on the up and up: Pinterest. The premise behind Pinterest is relatively simple, you can create online pinboards and upload your images to them (be they something inspirational, a beautiful object or a favourite place) – these boards and images are then repinned and shared around the ever growing community – 70% of which are female.

Coincidentally, Pinterest rolled out its first attempt at brand specific pages last month, and whilst the differences between a brand and user profile are, so far, fairly minimal, the fact that Pinterest is willing to embrace brands hints at bigger things to come beyond a couple of social buttons and widgets currently available.

Are you ready to pin?

Clocking in with more than 10 million users, Pinterest is the fastest growing social media site in history, but it isn’t necessarily a bandwagon for you to jump on.

Pinterest is at its best for brands that have a more visual edge to them. The most popular content on Pinterest tends to be about recipes, weddings, crafting, fashion and interior design. Obviously, this content isn’t going to be easy to produce for a lot of brands – but if you can, you could soon find Pinterest becoming one of your largest referrers.

What works?

Presenting your company lifestyle and values is likely to illicit a much greater response from your followers than mindlessly posting up product images. If you care about recycling, sustainability or UK manufacturing, create a board about these topics and fill it with useful and interesting pins from around the web, not just from your own website. Likewise, an interior design company has a plethora of decorating tips, ideas and trends to report on, both from their own expertise and their own sources of news, tips and inspiration.

If you are a retail outlet, leave your product board until last; concentrate on building up a few boards which provide an essence for who you are and what you believe in. Once you’ve got those covered, create a board for your best selling or most popular products. Pinterest users are smart enough to recognise a board that is too self-serving so don’t be afraid to highlight content from elsewhere on the web. With Christmas just around the corner, a board about festive trends or gift ideas is a good way to feature your product catalogue without it feeling pushy.

Just like they might be on Facebook and Twitter, the true value of social networking remains in the ‘social’ aspect. Treat your followers like trusted friends rather than a statistic and a long term connection and brand loyalty can form.

And finally, if you want to see what may have been pinned already, try typing this into your address bar: pinterest.com/source/yourdomain.com

You might share the perception that Instagram, the popular Android and iPhone app, is the sepia-toned domain of hipsters and want-to-be photographers, but with 80+ million registered users, 5 million photos per day uploaded and traffic recently surpassing Twitter in daily mobile usage, is it really a channel that your brand can afford to ignore?

Before you dive headlong into adding a retro effect to each and every one of your products or awards, take a moment to set aside a plan and consider what you want to get out of Instagram. Are you looking to start a conversation or increase reach? Also, consider what it is that your audience are going to want to see from you. Instagram is a brand story-telling service, not just visual merchandising.

If you think Instagram might be an appropriate channel, here are a few ways that you can use it.

News and Press
A picture tells a thousand words, or so the saying goes, so why not use Instagram to announce some of your company news? If you have an article in an industry magazine, if you’ve won an award or got a daily special offer on, perhaps a new team member has joined... you’d be surprised what can lend itself to a quick visual snapshot.

Behind the Scenes
Instagram allows you to show the faces behind your company and the daily running of your business. Candid shots of a product photo shoot, images from behind the scenes at a conference, your Christmas party or staff events all add a touch of humanity to your business. If you make a complicated product, some behind-the-scenes of it in production or development are likely to be interesting. The key to this is showing your audience that your brand is more than just a product or service.

Your Product
If you offer a tangible product, don’t be afraid to share them on Instagram, particularly if they’re brand new or exclusives not yet available. Be careful though, don’t over promote and ensure that your audience are still getting value from your feed as a whole.

Be Creative
Instagram doesn’t have to be so simple. Look to use it creatively. You could use it to run a competition for example or invite other Instagram users to tag photos of themselves interacting with or using your brand/product and then share these pictures out to your followers.

Instagram Cheat Sheet

•    Share your pictures across other social channels

•    But don’t share everything across every channel [this goes for everything social!]. Your post is more than the image; it’s the context and the story.

•    Hashtag your images, definitely hashtag your #brand, #location and #keywords

•    Don’t be selfish, try liking and commentating on other photos if you think they relate to you and your brand. Show an interest.

•    Be compelling. If you’re taking a picture of a new range of shoes, an image of someone trying one on is more exciting than the sort of cut-out white background image you might use on your actual website.

•    Don’t stop posting!

You might have heard of the phrase ‘Retina Display’ cropping up in relation to the latest batch of Apple product releases. The phrase essentially means a digital screen which has a 300 dpi or greater screen resolution. This moves a digital display much closer to the quality of those luxurious print magazines that appear crisp, sharp and full of colour. We’re talking about 3 or 4 times the pixel density which is a significant jump in image bitmap quality.

What this means onscreen is that you could be packing all that sharpness and colour into the images you’re serving on your website, and we’re not just talking about a large photographic portfolio – this applies to your company logo as well.

You’ve no doubt noticed that, if your company has a text based logo, it doesn’t always appear as crisp as you might want it to. This is because when it gets scaled down and put on the page it loses clarity as the image processing tool used to shrink it (Photoshop for example) crams a lot of information into not enough space – thin curves are a particularly obvious example. This wouldn’t happen on a retina display, not to the point of it being widely noticeable at least. Text, be it in an image or on the page, would be as crisp as you are ever likely to need.

To add to the problem, these images look worse on a high density screen than they do on your standard desktop. At this moment in time, there is no easy or widely accepted way to manage the change from non-retina display devices to retina display devices. Web developers are scrambling around looking for a way to serve both the lush, pixel-packed images as well as an optimised version depending on the device. The most obvious challenge is that, although it might be easier to sit back and pack your website with super high resolution images which pack as much punch as a Mike Tyson right hand, these images will be significantly ‘heavier’ for someone to download. This is a real concern with the continuing rise in mobile web browsing – as well, of course, for bandwidth and disk space usages server side. The other intangible is that whilst Apple displays at a 2x pixel density, Android screens are currently packing a 1.5x pixel density.

One thing we can actively look to implement is to scrap icons as images and switch instead to embeddable icon fonts. Using an embedded font is resolution independent, the icon will scale with the display just as your H1, H2 etc should. As with every solution in discussion though, there is a trade off to be had – by implementing embeddable icon fonts you lose the pixel accuracy of an image format.

I’d love to finish off with a definitive list of things that can be done in the here and now, and while there are certainly developments and solutions being presented, they are, as yet not at a stage where they can be widely adopted with 100% confidence.

Rest assured, we’ll be working hard to adopt best practice solutions, as well as looking towards developing ideas of our own on the subject.

Let’s be clear from the outset, this isn’t an article about plaid, gingham or the craze that sweeps the Wickedweb studio every Friday, checked shirts – but rather an exploration into the design patterns which you and I have both come to recognise and seamlessly use and/or interact with – from forms to slideshows to navigational tools, instinctively we will probably know what to do.

First of all, what is a design pattern? Well, put simply, a design pattern is a recurring solution to a common problem.

Unlike rifling through your wardrobe of a morning, a design pattern saves time for both a website user and the designer. A recognised pattern reduces confusion allowing a user to continue along their journey, and can be implemented by a designer to solve similar problems. In a recent article on here, we looked at form design and the associated patterns within this field (pun very much intended). The patterns of form design are fairly well known and you need only read the article to see commonality and best practice – it is fairly easy to pick out a poorly designed form that ignores the common patterns – opting instead for a double denim outfit from the 1980’s.

However, just with your favourite striped vintage cotton loons, there comes a time when we need to be ready to wave goodbye to our tried and trusted patterns and look to something new and exciting, like a wild neon herringbone.

If you’re using Google Chrome right now, cast your eye up to the area where you would usually open up a new tab. Depending on your version, you may or may not see a small ‘+’ sign in the tab. At the turn of the year, Google removed this ‘+’ from the tab amidst much outrage from its community and cited its own internal reports which suggested users preferred the new ‘cleaner’ look.  Is this the birth of a new, better pattern, or just a pointless rejection of an old one? I wonder how many of you even noticed the slight change at all.

Thankfully, design patterns are not as fickle as the catwalk, but it does feel as if we are at a time when, with browsing technology developing almost exponentially, we can’t afford to simply follow the pattern and lazily pick out familiar, striped trousers. Instead of incrementally improving a solution, a pattern, sometimes we need to create a new one, a better one because our tried and tested methods are going to get left behind by gesture based controls. In the same way that the printed page cannot simply be transported onto our screens, pout 24” widescreen monitors cannot be shrunk down into a palm sized, touch-screen viewing screen and retain the same patterns and be expected to work as effectively.

As designers, we need to be wary of scrapping existing patterns simply to be purple leather clad revolutionaries, but we must also look at ways to better them amidst our changing landscape and greet challenges with an open mind and a willingness to explore new thinking. Breaking a rule is OK if we can come up with something better.

It is an exciting journey, some patterns will stick and stand the (relative) test of time until the next shift, and others will become the Global Hypercolour T-Shirts of the digital age, but it is time to refresh our digital wardrobe.

A few useful logs of design patterns:

http://ui-patterns.com/
http://developer.yahoo.com/ypatterns/

A dreary and wet week has come to pass. Let’s hope these sights and sounds from around the web will cheer you up for the weekend.

Burning House Project

This project aims to find the answer to the question ‘what would you take if your house was burning’. Users can submit their answers alongside a (usually) great photograph. A lot of people seem to value their cameras and Macbooks very highly!

Find out what other people would save here

960 Pieces of Vinyl

There’s something charming about stop motion animation but you wouldn’t find Aardman pairing Gromit with some dubstep. This incredible video sees a real life audio waveform created from bespoke cut vinyl.

Descriptive Camera

The saying goes that a picture tells a thousand words. Well, this camera can’t quite manage 1000, but it will happily describe any scene you point it at by using Amazon’s Mechanical Turk API. 

Take a more in-depth look at the descriptive camera here

That’s a Big Vehicle

Next time you curse someone’s poor attempt at parking a Chelsea tractor, take a look at the image below. The $100million Bagger 288 is 311 feet tall, 705 feet long and weighs 45,500 tons. The Bagger can excavate 240,000 tons of coal per day.

Take a wide-eyed look at this mechanical monster here

Another week has been and gone, so sit back and take a look at some of our less serious finds from the web this week.

Imaginawesome

Kids have a great imagination, but they don’t always have the skills to draw them out on paper. Imaginawesome takes a kids drawing and the artist behind the project will turn it into something a bit more polished. 

Take a look at loads more here

Jelly Bean Crazy!

Imagine spending 22 months of your life laying out jelly beans? That is just what went into this amazing (and sugary) music video for Kina Grannis’ song ‘In Your Arms’. 288,000 jelly beans, 1,357 hours, 22 months and 2,460 frames later and this is the incredible result.

Crumplestiltskin

Photographer Levi Mandel took some stealthy shots of passers by, printed them out, crumpled them up and rephotographed them to create a curious gallery of fascinating grotesques.

Cast your eye over more crumpled faces

T-Rex Trying

It turns out that, had Jurassic Park actually turned out to be real we wouldn’t have had too much to worry about. Artist Hugh Murphy shows us what would happen if T-Rex attempted a variety of mundane tasks such as riding a bike or using eye drops.

Find out what T-Rex can't do

The weekend is nearly upon us, so without further ado, here’s a few not so serious things from around the web.

Clipart Album Covers

The humble clipart, pioneer of desktop publishing is used here to create some iconic album covers. Marvel at them.

Take a look at some more

Hardly Work.in

It’s a Friday, and instead of doing some work you’re reading this. Really, you’d much rather be on Facebook or reading about Justin Bieber on Twitter but you need to look busy. Lucky for you, there’s Hardlywork.in, turn your tweets or Facebook feeds into an inconspicuous spreadsheet.

Get pretending

Incredibox

This groovy little web app gives us more vocally limited maestros the chance to create our own beatboxing masterpiece by conducting an ensemble of animated beatboxers.

Bust out some awesome tunes, man

Microwhat

This strangely hypnotic project elevates the microwavable meal to a new level of artistic value. See before and after shots of a variety of microwaved objects.

Don't try this at home

Alongside the spectacle of the Olympic events comes the spectacle of the Olympic 'artist series' posters. The first official poster having been produced for Stockholm 1912 by Olle Hjörtzberg. Since then, as with a good 4x400m relay race, the posters are as often hit as they are miss.

London 2012 has seen posters created by Turner Prize winning artists Chris Ofili and Rachel Whiteread, as well as household names like Tracey Emin.

We've cherry picked some of our favourites from the past 100 years.

The weekend is nearly upon us, so without further ado, here’s a few not so serious things from around the web.

If We Don’t, Remember Me

A collection of animated gifs and cinemagraphs from the world of Hollywood to make you smile.

Click here to view some more

Sleeveface

A wonderfully simple idea – just grab a record and use it to complete a picture. Some real crackers in here.

Follow the link to view more 

Comic Sans Project

Goodbye Helvetica, thank you for your years of service. Forget what you thought you knew about Comic Sans, turns out, it’s awesome.

View some more Comic Sans logos 

LEGO Album Covers

To finish up with, take a look at these rather splendid LEGO versions of iconic album covers.

View them all here

So, you want a sparkly new website right? You want it to work on your desktop obviously. And the laptop you use at home. And it’d be great if it looked the same on the netbook you tap away at on the train. And you’ve just got one of those fancy tablet things as well, so it’ll need to work on that. Oh, and your mobile, naturally. Your TV has internet browsing? So does your games console...

As web designers and developers, we’re used to change. We’ve long had to worry about intangibles that few other mediums would for years. Variable window sizes, screen resolutions, user preferences are just a few. And please, nobody dare mention IE6. Every couple of years we experience a new paradigm of thinking – and we adapt. But even in this industry, things are moving fast, very fast.

Over in Las Vegas this week at the Consumer Electronics Show, dozens of devices have been proudly displayed to the world for the first time, from mobiles to tablets to televisions. Devices of all different sizes and many which can be viewed both landscape and portrait.

The rapid influx of new browsing devices means that we are now at a point where it is impractical, both financially and otherwise, to try and keep up.

Thankfully, there is an alternative to supporting each and every user agent by creating bespoke versions of each and every website.

Responsive design is perfectly suited to the multi-platform world that we now find ourselves in. Simply put, responsive design is flexible, device independent design for the web. Even more simply put, the web content that you’re viewing will adjust itself to the size of the screen you’re browsing on. 

The primary appeal is to build a website which can look great on both your mobile and laptop, without having to create a mobile specific version. The size of the window is the key, not the device being used to view it. 10 years ago the notion of a 24” monitor being common place would have seemed almost unreal. Responsive design also allows us to go BIG. Banishing the ungainly white space which sits on either side of the web content and increasing the size of images and videos would dramatically change the user experience.

There are all sorts of clever tricks and tools that can be used by delivering media queries to enhance the user experience as well. On smaller screens or touch devices the ‘hit area’ of a link could be increased and typography can be spaced differently to improve legibility and much more. 

Responsive design is a technical mixture of fluid layouts, flexible images and media queries. Tackled from a design perspective, more than ever, the way in which content could be viewed is of huge importance and the way that content translates from one device to another is crucial to the success of a project. 

And for once, it really just might be about making the logo bigger. 

Picture this scene for a few months time if you will. Instead of sitting on the Underground listening to the rustling of newspaper pages as the tunnel dwellers flick through their fix of free gossip and lonely hearts you can expect shaking, spinning, flipping and tipping as excited readers tuck into their new eBook, Alice For the iPad.

This 52 page app features illustrations restored from Lewis Carroll's original book and promises that no journey through the timeless tale will ever be the same - tilting the iPad in a different way will make the Mad Hatter madder or grow Alice to the size of a house.

Take a look below.

Unfortunately I suspect you won't be able to pick up a used iPad on the Central Lines for the journey home though.

The internet is such a vast and wonderful place, full of sneezing pandas and Rickrolling that it's easy to miss some of its entangled strands of delight. Luckily, I'm going to post up a few things which you might like to ease away your midweek blues.

Twitter gets a new homepage

Twitter unveiled a new homepage on Thursday and I’ve got to say, it does a much better job at demystifying just what it is that the micro-blogging service is actually all about. As with the previous design, search is still a strong focus but a lot of the vagueness which surrounded the service has been given the boot.

For a few months, Twitter was so chic it didn’t need to actually tell anyone what it was about, instead relying on word of mouth and enthusiastic web agencies to pass on its message. Or that’s how it seemed to me at least. I can’t imagine that many curious business owners would’ve felt the need to create an account based on the previous homepage.

With the new web design, it’s far easier for a potential user to understand what Twitter is all about. A nifty algorithm plucks interesting tweets from the Twittersphere and places them front and centre on the page. Couple that with the block of brands and celebrities using the service and the decision to click ‘sign up’ seems a lot easier to make.

The Twitter Blog describes the change as:

“... our recent changes embrace the notion that Twitter is not just for status updates anymore. It's a network where information is exchanged and consumed at a rapid clip every second of the day. With so much being shared, we know that there's something of value for everyone. People who internalize the value of Twitter understand the power of this simple medium. But it hasn't been easy to make that value transparent or obvious for curious folks coming to Twitter for the first time.”

I think that sums it up nicely.

Album covers make great book covers

Something to inspire you next, a collection of album covers re-imagined as Penguin Classic books.

If Picasso had a netbook, this is what he’d be sat doing right now

Well, sort of.

This little project makes use of HTML 5 which will be rolling onto a browser near you in about ten years. This really is a glimpse into the future of what websites could be capable of.

One of the main features of HTML 5 is the dramatic reduction in the need for resource hogging, constantly updating, randomly crashing RIA proprietary plugins like Adobe Flash, Microsoft Silverlight and Java. HTML 5 will also mean that embedding a video is as easy as , and common CSS elements such as and will create much cleaner code for everyone involved.

The good news is that, although it isn’t expected that HTML 5 will become the norm for a few years yet, many aspects of it are currently stable and open for exploratory business. Watch this space...

Dexter has amazing opening credits

The title sequence for the US show Dexter is a work of art. Every time I watch it I am compelled to turn around to whoever is within earshot and tell them just how brilliant I think it is.

On my ‘top title sequences ever’ list, this sits at number one.

And finally...Even evil scientists tweet

In the style of a true James Bond villain, the gaggle of Nuclear physicists who are in charge of the world’s largest death ray [which they refer to as the Large Hadron Collider] over at CERN in Switzerland yesterday revealed that their plan for world domination was close to completion. And how did they decide to broadcast this proclamation of doom [and scientific revelry] I hear you cry... Twitter of course.

The one update I don't want from them is 'Oooops'.

Be sure to follow the end of the world in 140 characters or less.

Oh...You didn't click the Rick Astley link did you?