41 Examples of Sketches and Drawings in Website Layouts




The trends for website designers have been constantly changing and adjusting over time. Sketches and illustrations are very common as background interfaces. But what about applying sketched/drawn elements into your common UI elements? These may include navigation links, buttons, ribbons, content headers, search bars, and lots of other possibilities.

In this showcase I have collected 41 specific examples which demonstrate these techniques. I’ve picked only websites which I feel exemplify the idea of sketched website layouts. It is my hope that other designers can learn from these techniques and possibly apply them into future ideas. This is a great resource for inspiration and should prove useful for mostly every website designer.

Toasted Digital

toasted digital website illustrations layout

Carnet Ordinaire

french website design layout specs illustration

Hugs for Monsters

hugs for monsters illustration website layout

Toucouleur

Toucouleur website watercolor layout design

Denise Chandler

teal blue website layout drawn sketches

Snailbird

snailbird blog layout illustration header forest

Art Attackk

art attackk website layout illustrations sketches

Lionite

lionite website sketches illustrated header

Kutztown University

kutztown university website layout design illustrations

Dax&Alice

dax and alice website illustrations graphics

Clever Craft

arts crafts website layout illustrations

Justdot

justdot website layout illustrations graphics

Natrashka

natrashka website illustrations graphics

Kez Human Jukebox

writing portfolio website kez jukebox musical

Draw For Joy

draw for joy website illustrations sketches

Legwork Studio

illustrated background effects graphics website studio design

Deborah Cavenaugh

deborah website portfolio layout designs icons

HTML5 Lab

html5 lab website portfolio studio

Joby

JOBY website interface graphics designs

Bord

Bord iPhone app website interface layout

Heather Sloane

heather sloane website portfolio design illustrations

Adeline

water flowers illustration website portfolio

Bootb

creative dark portfolio illustrations website

Boompa

watercolor illustration header website design

Dean Oakley

Dean Oakley website interface illustration design

Crayons Life

portfolio illustrations for Jesette Dayate Crayon blog design

RichPurple

10 words website interface illustrations rich purple

Robbin Waldemar

vimeo video streaming robbin waldemar sketching

Bowtie.

bowtie period studio website illustration design

High on Pixels

high pixels dark website portfolio theme

XHTML Cafe

xhtml cafe website design sketches illustration

Miki Mottes

Miki Mottes website portfolio illustrated graphics

Christian Sparrow

Christian Sparrow website illustrator designer portfolio

Sebastian Mrazek

classy light minimalist portfolio sketches mrazek

Me & Oli

meandoli website design illustrated layout sketch

Kevin Monger

Kevin Monger website portfolio design

Harry Ford

Harry Ford website illustration design layout

The Farmer & The Chef

graphics scene illustration cooker chef farming vegetables

Creativeweek

basic white minimalist sketches layout design interface

Beavory

Beavory website design sketches white black layouts

Marie Catribs

marie catribs


Jake Rocheleau

About the author:

Jake is a creative designer, illustrator, and web developer. He frequently writes articles involving new-age design concepts and freelance management skills. You can find him in Google or follow his tweets @jakerocheleau

Comments:

Scroll back to the top
Content


Receive the top stories from SpyreStudios and the Splashpress Media network every week, right in your Inbox. Relevant and timely content is yours for FREE!