10 Beautiful, Magical “Hand-Drawn” Web Designs

I really love web designs that emulate natural, rough sketches, and simple, playful watercolors. Ever since it became easy to produce perfect type, absolutely straight lines, and unassailable right angles, we’ve become fascinated by the imperfect. Here is a collection of 14 of my favorite examples of websites using this principle.

1. Sojourner Farms All Natural Dog Food

http://www.sojos.com/affiliates.html

I just love the slightly rough, 1930’s style banner of this site, and the sweetness it creates. The use of CSS dotted lines to demarcate areas of the text, and the reddish brown color of the type, add to the effect very nicely.

Link: http://www.sojos.com/affiliates.html

2. Electric Pulp

http://electricpulp.com/

The two watercolor trees in the background are very nice! This firm has created a backdrop to highlight the various designs they have done for clients, where the frame is not too overpowering, but still allows them to express some of their personality.

Link: http://electricpulp.com/

3. Fuze Creative

http://www.fuzecreative.com/

Here is a very nice design, incorporating elements of “sloppiness,” with a clear layout gridl. The color and the feel of the brown background scan is echoed nicely in the color and pattern of the border lines, and the type. Once again, this conveys a sense of playfulness that is under the control of the designer. For me, this would inspire confidence that they were able to be creative, playful, and original, but also had a handle on what they were doing, and weren’t doing it just to show off.

Link: http://www.fuzecreative.com/

4. NoƩmie Chevaux-Tavernier

http://www.noemie-chevaux.com/

So playful and sweet. The black and white photo of the woman, that looks almost like it was cut out of a photo from an old scrapbook, and her look could almost suggest she was from a long time ago. I’m not sure if that was intended, but it creates a magical effect, for me.

Link: http://www.noemie-chevaux.com/

5. Nut and Bee

http://www.nutandbee.com/

This artist creates a wonderful series of characters, and sells them in the form of stickers, magnets, and so on. The design is a nice, simple backdrop for her various characters.

Link: http://www.nutandbee.com/

6. Orange Coat

http://www.orangecoat.com/

I just think this artist came up with a very cute logo, and utilized it well at the top of his/her site. The choice of Georgia for the type, and a sweet and soft brown color palette (with a turqoise secondary color) creates a very nice feel.

Link: http://www.orangecoat.com/

7. The Ditty Bops

http://www.thedittybops.com/

Along with being a great band, these women have a wonderful website. Check out the links within the site as well, as they are awesome as well. It’s kind of seeming like I like an almost post-Victorian sensibility in design, doesn’t it? That, combined with a penchant for the juvenile.

http://www.thedittybops.com/

8. The Pug Automatic

http://henrik.nyh.se/

I like this weird pen and ink drawing of a dog, and how it’s integrated into the banner of this blog. The drawing is just weird–there’s no chance of it looking like any other site! Coupled with that, he’s standing over an iBook, there are zeppelins flying overhead, and mysterious, organic-looking gears in the other corner.

http://henrik.nyh.se/

9. WhyTheLuckyStiff

http://whytheluckystiff.net/

I really like this guy, and he’s written a very good, extremely entertaining guide to the Ruby language. He’s a brilliant guy who’s not afraid to be weird (very weird), but is also sane. The banner is playful and silly, and integrates beautifully with the standard CSS elements of the site. When I was younger, I wanted to do things like this, but I never did, because I thought it would mean people wouldn’t take me seriously. But I think people do take him seriously, because he’s providing a lot of valuable information at the same time that he’s choosing to be silly.

http://whytheluckystiff.net/

10. Holly Hue DIY Clothing

http://www.hollyhue.com/

Here’s a brilliant site, that features an active text area comprised of a piece of brown burlap fabric, hand-stitched to the striped white and blue background fabric. The navigation buttons, too, are hand-stitched pieces of fabric. They become a deeper purple when you hover over them with your mouse. You really have to do something like this to discover what a feat it is! To make something this organic look seamless, no matter how long your text area may grow, or shrink, to. Nice work!

http://www.hollyhue.com/

These are some of the top sites I have found that have this sort of naturalistic, sweet flavor. Do you know of others? Please post them in the comments!

Leave a Reply