In this post I’ll feature some web designs that went viral on StumbleUpon/Digg/other social media sites and the lessons you can learn from them. As you browse the designs, I’m pretty sure you’ll find some common patterns I overlooked. If you see that, let me know in the comments :) For now, let’s get started.

One more thing before we start. The lessons I’ll share are just principles and observations that come from my 3+ experience in viral marketing and getting over a million people to my websites. Feel free to disagree with some of the principles and let me know why in the comments below. Now, let’s REALLY get started :)

1. Man in The Dark

What can we learn from this: People want control. That’s one of the reasons games are more engaging than videos. This animation makes use of that principle by giving people an incredible control over the flying man. Even if you move your mouse a little bit, you should get him flying immediately. The lesson here is: If you’re making a game or an animation people can control, ask yourself how can you make it so even a small move with the mouse (smallest effort people can possibly take while sitting on a computer) can produce a ‘wow’ results.

2. 10 Common Misonceptions Dispelled (Infographic)

What can we learn from this: Appeal to the general audience. Going niche doesn’t work if you want to go viral (except if the niche is fascinating for the general public, like astronomy). This infographic is a great example of appealing to the overall mass population. The name is ‘10 Common Misconceptions Dispelled’, not ‘10 Common Teeth Whitening’ or ‘10 Common Acne’ misconceptions. In viral, fun and entertainment are a priority over being informative.

3. Horses Singing

What can we learn from this: There are so many principles behind this viral flash ‘game’, but I think what’s most important here is unexpectedness; when horses open their mouth, you expect that awful and loud voice. But these horses can sing; and they can actually sing in chorus! Imagine real horses doing that; one of the most annoying things in the world? :)

4. Different Live Quotes

What can we learn from this: As a general rule of thumb, too much text doesn’t work in viral (see why in the next lesson). That doesn’t mean, however, that text doesn’t work at all. This example shows that. If you combine it with something insightful (like quotes), funny (once someone on Twitter made an account named “shit my dad says”), anything that brings emotions, you should have a good probability most people are going to like it.

5. TheOatMeal

What can we learn from this: I’ve actually known this OatMeal guy before he went viral on Digg. I expected his site to be great success, but never expected it would get viral to this extent! (his site is in the top 2500 most visited sites in the world according to Alexa). He taught me one very important thing with his designs. You see, there is a lot of text in some of his infographics. But it’s all illustrated, like a comics, and the text accompanies the graphic rather than the graphic accompanying the text. This is a very important distinction to make; if the text accompanies the graphic then you try to illustrate as many things as you can with the graphic, while the reverse is true with the graphic accompanying the text (like in this article, for example).

6. TypoOrganism ASCII (or, it’s Obama in ASCII!)

What can we learn from this: Ah, the power of associations. Combining technology + famous people = win. You could argue that we were making all these ‘associations’ in the previous examples as well (connecting pictures with emotions etc). But this is different. In this example, there is a politician, a celebrity. Some will like this and some will not. But they would both agree this is ‘fascinating’. A lesson/idea: You can take a present trend/famous person and make a creative design out of it. Like Bill Gates or Steve Jobs.

7. Drawing Example

What can we learn from this: Most people like drawings. If you’re a drawing master, why not try and submit your masterpiece on StumbleUpon? Or alternatively you can find a drawing group on Facebook and post it there and see what happens (just make sure the group/page has enough members!) Drawings go viral on StumbleUpon.

8. ShinyBinary – Oh, It’s So Beautiful!

What can we learn from this: People love beautiful stuff. Now, aren’t different things beautiful to different people? Not really. For example, if you show the 2 pictures above to different people. most will say they’re quite beautiful. Maybe 2 in 30 will say they don’t like the pictures. But the rest 28 will usually say positive stuff. And not surprisingly, beautiful things often go viral ! They appeal to most (remember the second principle, appeal with information? Well this is same just you’re appealing with beautiful stuff).

If you want to see whether something you designed is beautiful or not, try sending it to 5 people (but don’t tell them it’s your design) and hear what they think.

9. Fractal World Gallery

What can we learn from this: Making a showcase of beautiful pictures/designs used to work quite successfully on StumbleUpon. This isn’t the case anymore (they still work, but not so phenomenal like previously), not because of the pictures but other factors. If you show same things to people all the time, they’ll become accustomed to those things and they’ll lose they effectiveness. The things they see will become ordinary and ordinary is the enemy of viral and buzz. So why am I telling you this? Because you can make twists for these showcase posts and make them ‘not-so-ordinary’.

Most people just throw a bunch of pictures for a particular topic, name it ‘x beautiful [theme] pictures’ and that’s it. Boring. Imitation works for getting viral, but not for long. Here are some ideas on twists you can make:

‘10 Remarkably Similar, Yet Very Different [theme] Designs’

‘10 Designs and Their Ugly Counterparts’ (you can show similar designs here, first the ugly one, and then the beautiful one)

10. Iconscrabble

What can we learn from this: Simplicity helps a lot. Especially if you have a site where people are just trying to do 1 thing (like search for something). If you’ve noticed, all the previous examples are kinda simple, they don’t have any extra parts that take your attention. They make you focus on the ‘meat’ and don’t do much fluff.

11. Phong

What can we learn from this: When this animation started, something strange happened to me. I started associating the animation with the essence of life, the stars, the universe…and I bet most people also did that when they saw this. Can you do this with your design? Can you insert an element which will help visitors associate your design with the essence of life? Some objects that can help you accomplish this are: stars, galaxies, planets etc. But it’s not just about what you present, it’s about HOW you present it. Just take a look at this animation and its slow motion. Think on how you can present your static/animation design. Slow motion usually helps a lot in the ‘how to present it’ part.

12. LAB – Freestyle Creativity

What can we learn from this: At the end, it’s important to mention that there are not specific rules for going viral. There is a dose of randomness in the viral formula. The more viral designs you see, the more you can ’steal’ from them and then make your own ones. This is an example of what I call a ‘freestyle creativity’, the guy probably just said ‘I found this fascinating and other people will probably find it too’ and went with that design. There’s no rule that says you can’t do the same too.

Being a freelancer is a great way to work for a lot of designers and creatives. To be able to give your clients the best possible package though, you may have to look at doing things a bit differently. By considering to collaborate with other freelancers, you’ll have an even better chance to offer something great, along with getting more social in a job that often is quite lonely. Here are some of the reasons why working with others can be a great idea!

Being a freelancer means a lot of responsibility on your shoulders along with many “lonely” days at work. Being specialized in one field can definitely appeal to clients if you’re good at what you do, but today the ability to be versatile becomes more and more important. Clients know what they want and with all the designers and companies in the market, they can also afford to be a bit picky.

How to collaborate with others?

This can be done in different ways and you need to have a look at your options, who you know, who are available in your area and if they’re interested. A collaboration with other freelancers can mean to share office-space with them, have “unwritten” agreements on helping each other out with things you excel at and pointing clients in the direction of others when getting enquiries that involve projects that are a bit outside your comfort area.

Picture by Oliver Tam

The collaborations can be small or big depending on what you prefer. In many cases freelancers can take on bigger projects together, dividing parts of the work between them according to their different skills. As long as you’re able to find a way of billing and time-tracking that can be dealt with in a legal and correct way, you have many options.

Here are some reasons why you should consider working alongside other freelancers to get more clients by offering what they want!

Being able to compete better with bigger companies

Picture by Martin Boulanger

As companies with several designers also have more knowledge and a broader skill-range, collaborating can help you get up to that same level. This means that as you are more people doing the project, you can offer the skills and deadlines that usually are some of the benefits clients get when choosing to work with companies over freelancers.

Offering more

A bit of the same as the first point. If you are a web designer collaborating with a freelance writer, graphic artist or photographer, you will most likely be able to offer the client a more complete package. Clients love it when they don’t have to look around for many different people to work with. If you have a deal with others you can simply tell the client that you’re able to also take the pictures for the website, design the logo and so on.

More contacts

Picture by B S K

You have your contacts, others have theirs. By working together you have a much bigger network and a whole lot more potential clients and projects just by sticking our heads together. This can give more clients, better deals and a broader network.

Dividing costs

If you’re sharing office space with someone else it will eventually be cheaper. You’ll get to divide the rent, electricity bills and maybe even some of the equipment. This is not necessarily the main reason for choosing to do so, but definitely a great bonus, especially for those struggling economically.

Giving each other feedback

Picture by Laura Leavell

Getting feedback from others with similar skills can be great for you. This can help you becoming better at what you do and it never hurts to have someone to discuss different cases with. When you work completely alone it can feel easier to get a bit stuck sometimes. A fresh pair of eyes can do wonders to your work.

More social

One of the top things that freelancers miss is the social part of working in a bigger company. Having someone to have a coffee with and to talk with in between all the hard work can be a very positive experience.

Leaving a more professional impression

Picture by Jan Willem Geertsma

In general this will help you come across as a lot more professional. Your clients will like the fact that you have others that can work with you and if you have an office together this usually will look way better than meeting clients on your sofa at home. Some times this can be what gets you chosen over other options.

Someone that’ll have your back

If you for some reason need to have an unexpected day off, if you can’t answer the phone or just need a bit of help with something, this can help you out a lot. When you have someone else around you that you trust you will feel safer when unexpected situations occur. Even if you’re your own boss and have your responsibility, you can feel less alone by having someone there. Just remember that it has to be both ways.

Conclusion

Picture by Sachin Ghodke

These points are all good reasons to at least consider working with others. This doesn’t necessarily have to mean sharing offices, it might as well be having someone you can call when needed. The ways of collaborating are many and you will need to find out what works the best for you. Some areas have office buildings meant for this purpose, so make sure to check out your area to see what possibilities that are available for you. Remember though, that you have to try pick people who you thing you will work well with and be prepared for giving back in every way you can. Think through these things and you will find out of this can be for you. There are pros and cons of everything and some things have to be tried out.

We’d love to hear your feedback. Maybe you have some experiences and tips to share as well?

Good luck!