50 Clever Tutorials and Techniques on Traditional Drawing

 

Traditional drawing is certainly way harder than digital and it is true that people are able to progress much faster digitally, but one should learn the traditional type of drawing and painting before starting digital drawing, since it often lays out the foundation for screen design.

This article contains a mixture of traditional drawing tutorials, drawing techniques and some methods for transforming and preparing your creations for screen design. Some are intermediate level and some are advanced tutorials that include general theory, useful tips, comic inspired art, sketch a pencil drawing, coloring processing, character sketching, doodles, shapes, proportional, perspective and much more. We hope that drawing tutorials and techniques in this post will be a great help to you.

Traditional Drawing Tutorials 

Marilyn Portrait Tutorial A truly fantastic drawing tutorial to learn how to draw a portrait of Marilyn Monroe with pencil. Each step of the portrait is perfectly well explained and commented. This tutorial is very detailed, and requires a lot of patience.

Portrait tutorial This is a step by step tutorial on how to draw a realistic portrait. The artist assumes that you have a basic understanding of drawing and shading before attempting to draw a serious portrait. For this lesson he is drawing on 11”x14” Fabriano Hotpressed Watercolor Paper. He is using Derwent Graphic Pencils ranging from 2H to 7B. For more information on any of the drawing tools that he mention in this tutorial, visit the drawing materials page.

How to draw lips In this tutorial artist will explain how to draw the structure of the human lips.

How to Draw a Car For this tutorial the artist will show the different steps he takes in drawing a realistic looking car. He chose to draw an american classic, the Corvette. This tutorial will apply to any car though because for the most part, they are all the same. The key to drawing a car that will pop off the page is having a good balance of lights, midtones, and darks along with clean, sharp edges. He is using Derwent Graphic Pencils and Fabriano Artistico Bright White Watercolor Paper, he is also using mechanical pencils for small details.

How to Draw Optimus Prime From Transformers In this tutorial you will be learning how to draw one of the most popular of the Autobots, Optimus Prime. This drawing tutorial will show you in detail how to sketch, draw, and shade in this character that is popular around the world

Pet Portrait A very good tutorial about how to draw pet portraits with colored pencils. Basic process and tips. Medium : Prismacolor Colored Pencils.

How to Draw a Ninja This tutorial will show you how to draw a ninja step by step. This tutorial has easy to follow directions and steps making it that much more possible for anybody to tackle

Portrait tutorial Artist is going to show several step photos along the way on this one. Artist chose this photo because of it’s RICH content, and it’s HIGH amount of TONAL VALUES, CONTRAST as well as it being a high resolution file, Finding just the right photo is half the battle to a good drawing. NEVER EVER work with a low quality photo.

Hair drawing tutorial Drawing hair is definitely one of the trickiest part of almost every portrait. However, you will definitely like it if you acquire technique and skill in it. Therefore Artist introduce some easy and effective ways to draw wavy or straight hair or hair blowing in the wind. No matter how much chaotic the hair is, you’ll be able to draw it. This tutorial explains two techniques of drawing hair on four portraits.

Eye-drawing tutorial by Sarah A great and very detailed tutorial, to learn how to draw an eye in 30 steps

How to Draw a Realistic Eye Artist made this tutorial to show the different steps that he take in drawing a realistic eye.

How to Draw a mouth and teeth Artist made this tutorial to show the different steps that he take in drawing a realistic mouth, lips, and teeth.

TRADITIONAL SKETCH RENDERING At most design schools they teach you how to use a single wooden pencil to create an entire rendering, sometimes referred to as a “Prisma-rendering” due to the type of pencil usually used (Prismacolor wood pencils). These are fast and very pretty looking techniques, and they are fairly easy to master. This will be more of a walkthrough then a tutorial in the sense that artist won’t describe every pen stroke, more the basic steps and thoughts behind. Ok, let’s go!

Drawing Hands and Feet Some useful explainations and tips about how to draw hands and feet.

Drawing a Rose An excellent tutorial offered by Rachel, to learn how to draw a pink rose.

A Pseudo-Sugar Skull: From Start to Finish. Create a highly detailed sugar skull illustration by following this expert tutorial, with details on the process from sketch to final digital design.

Hair Amanda Tapping A step by step drawing showing amazing hair on a portrait of actress Amanda Tapping. The result is impressive realism. A must see!

From Sketch to Vector Illustration Create inspiring digital creations from hand drawn sketch using these helpful tips.

Manga Making Tutorial In this tutorial artist will show you the process of creating a complete Manga comic strip using traditional tools.

How to draw a fashion figure In this video tutorial you will learn how to use existing reference photo to trace a fashion inspired sketch.

How to Draw Dragons: Step-by-Step Instructions from Tooth to Tail Dragons aren’t real, but if we want them to look like something living in our reality, their design must obey certain rules. Dragon draw tutorial -  Game of Thrones, the Hobbit or Harry Potter series.

Leather Wings In this tutorial you can get ideas and techniques for drawing realistic wings stracture, Artist focuses at drawing wings.

Pencil Sketching by Max MaxBert Bertuzzi very comprehensive theoritical tutorial, this article will increase knowledge and power of your drawing skill

Drawing Hair in Pencil Some very useful tips for you on how to create extremely inspiring and realistic drawing hair in pencil work

Drawing Hands Follow these simple and easy tips to avoid the difficulty of recreation of hands in pencil drawing and to learn some great tips and techniques of drawing hands.

Clothing Tutorial An excellent roundup with plenty of tips and clothing tutorials. So, dress your characters in the best way by practicing these tips.

Comic Story Step by Step If you are looking for a comic story guideline, here is a perfect step by step guide for you that will guide you starting with sketching and moving on through the inking and digital processes.

How to draw Marlon Brando step by step It is now time to show you “how to draw Marlon Brando step by step” All the steps and instructions are laid out in the simplest format possible to help make this tutorial a breeze.

Face drawing: the heroic male In this tutorial we’ll draw a character face of a hero-like character. In the process we’ll review an optimal placement of the facial features and the best ways to emphasize the features of the face that will make our character look manly and heroic.

Evil skull drawing Looking for a terrifying evil skull drawing tutorial? Just follow the steps and you should be able to walk away with a scary skull to use in your scary projects (whatever they might be). Let’s start with the evil skull drawing tutorial!

Lone Wolf Pencil Drawing Here is a new miniature speed pencil drawing. Artist wanted to make this one different from my other ones. He combined two drawings in one to make a single image. The sunset and the single wolf. It gives the final image a different look and feeling.

How I making manga part 2 A step by step comprehensive and detailed tutorial about making manga.

Graphite Portrait This tutorial explains all steps to create a portrait of Zinedine Zidane in graphite pencil. Time to complete: 10 hours.

Dance of Spring Tutorial A step by step detailed tutorial that will help you with your Colored pencil.

Traditional Drawing Tips & Techniques #

How to Draw what you See: Techniques and Tips to Improve your Drawing Skills This article contains step-by-step images of the process Artist uses to create realistic looking drawings, as well as tips he have picked up over the years which anyone can use to improve their drawing skills.

Shading and Blending This brilliant tutorial is all about shading and blendng, so let start and get lot of tips and amazing techniques.

Tips for drawing hands In this tutorial Artist will include many tips about drawing hands he has picked up which are useful for getting better at drawing hands, including foreshortening, nails, and finger shapes.

Circulism Technique Circulism is a very interesting technique to create skin texture with pencil. With this great tutorial, learn how to acheive a realistic skin texture with circulism.

3 Dimensional Drawing Techniques To learn the basics of shape, perspective and shading in order to create depth in your work.

9 Steps to Creating Better Compositions Great compositions don’t just happen by accident. They take planning, patience, and a knowledge of all the visual elements at your disposal. The great thing is, no matter how much or how little talent you have, you’ll always be able to improve your art by sketching out a good composition before you begin.

Drawing clothes techniques A less general point that the portrait seems to pose few problems is the representation of clothing. In this tutorial, clothing can be summarized in two points: the folds and textures.

Editing Drawings Editing Drawings by Cataclysm-X offers valuable tips for bringing out the best in your traditional drawings after they have lost their depth and luster due to scanning.I am sure this technique will help many traditional artists in the presentation of their work.

Detailed Hair This article contains high quality tutorials that will guide you how to create highly realistic and inspiring hair on your subjects.

Portraiture lesson To study draw a portrait using the ‘inside-out’ method.

Proportions Proportions in any drawing assignment hold great value; therefore we have come up with these five most helpful techniques that will help you getting grips with proportions in your drawings.

How to Draw Caricatures: The 5 Shapes This is a great collection of tips and techniques you can use to draw caricatures and learn the basic theory and 5 shapes of caricature design.

How to Draw Caricatures: Head Shapes Head shape is the most important part of a caricature and in this tutorial you will learn great techniques about it.

Horizontal Navigation Menus: Trends, Patterns And Best Practices

 

The horizontal navigation menu has become a mainstay in Web design. It is safe to say that nowadays most websites use some form of horizontal navigation to facilitate content browsing. The dominance of horizontal navigation over vertical (i.e. down a sidebar) is obviously due to the design and content limitations of the latter.

Notably, CNN discovered those limitations before switching from vertical to horizontal a few years back.

There are, however, many styles of horizontal navigation in modern Web design. Some offer usability advantages for certain types of websites, while others are aesthetically better.

 In this article, we will focus on a variety of techniques and best practices to improve the usability of horizontal navigation bars, and we will note less effective styles. We’ll also look at several trends that developers can choose from when working on the navigation design for their next project.

Use Familiar Names For Links 

Let’s start off with a usability tip that applies to any navigation bar. When a user visits a new website, one of their primary points of focus will be the navigation bar. If that element has been well designed, the user will look to it first for help with their task. Almost every website has certain sections that are “expected” by users, such as “About us,” “Services,” “Products,” and “Contact us.”

Impulse Development

Because of the nature of the Web, users get frustrated if they cannot immediately find the content they are looking for, even if the delay is momentary. So, the “About” link should be labeled “About” or “About us.” The “Services” link should be labeled “Services” or “Our services.” Being creative in this case detracts from usability.

Except in the most unusual circumstances, don’t call your “About” page “Company info.” Don’t call your “Services” page “What we do.” And don’t call your “Contact” page “How to reach us.” Users instantly look for recognizable terms when searching for content, and so avoiding any design or content that would slow them down ensures for them a positive experience.

Clearly Distinguish Primary And Secondary Sections 

Once you figure out what parts of your website are “primary” and what parts are “secondary,” you can establish a visual hierarchy that enhances usability.

Primary links (e.g. “About,” “Services,” etc.) should be clearly distinguishable from secondary page links, which are usually accessible from every page and located near the primary links. The designer’s job is to clearly indicate the difference so that users understand which parts of the website have the most important information.

Consider the following example:

Edwards & Hampson

Edwards & Hampson’s website has a nice clear horizontal bar that serves as the user’s primary means of navigating pages. While it includes the standard links (“About us,” “Our services,” “Products”), the bar has a number of other links that are not as “primary” but are important enough to include in a prominent area.

A similar example:

Deliciouslyorkshire

The Deliciouslyorkshire website links to primary sections (“Home,” “About,” “News and events”) next to what seem to be secondary sections (“Recipes,” “Promotions,” “Useful links”). Both types of links have the same tabbed style, with no indication of hierarchy.

If, in fact, some of these links are less important, then designing the section to reflect this hierarchy would have been wise. Of course, these companies may have compelling reasons for designing their navigation in this way, so these are not necessarily bad examples; they serve merely as case studies to illustrate the importance of a visual hierarchy in navigation bars.

Conversely, here are two examples of websites that show this visual distinction but still keep secondary links easily accessible:

Designers Couch

Designer’s Couch has primary navigation links along the main bar (“Home,” “Gallery,” “Jobs,” etc.) and then secondary links on the same bar to the right but kept visually distinct (“Find a designer,” “Get involved”).

J Taylor Design

J Taylor Design makes a similar distinction by placing secondary links below the main navigation bar and using a different color, font, and size. In these examples, the user has no trouble distinguishing between primary and secondary sections. Yet, the secondary links are not buried on the page or in drop-down menus. They’re still easy to access.

Put “Action” Links On Right 

If you’re building an e-commerce website or one that has shopping cart functionality, user registration or log-in, then putting links to those sections on the right side of the horizontal navigation bar (or somewhere else on the right, near the top) is best.

Here are a few examples of websites that visually separate “action” links, while keeping them in the main navigation bar:

Sharify

Xero

Sharify and Xero, above, put their “action” links on the same navigation bar as their primary links. But they maintain the hierarchy by pushing the secondary links to the far right.

Users expect to see these action links on the right side of the bar, so reversing the pattern would impair usability.

Include A Search Box #

Another common practice that improves usability is to include a search box on the right, as part of the navigation bar. The search box is like the functions mentioned earlier because it requires some sort of unique action from the user.

Users are accustomed to seeing this action-oriented functionality – including the search box – on the right side of the page, so allow sufficient room in this part of your design for a search bar, inside the main navigation bar if possible.

The J Taylor Design website above puts its search box on the right side of the navigation bar, as do these:

Washtenaw Community College

Westcoast Poppin

Avoid “Surprise” Drop-Down Menus 

Drop-down menus in horizontal bars are quite prevalent in modern design because they simplify cluttered layouts. Visually indicating whether a navigation link will reveal a drop-down menu when the user mouses over it is best practice. This is best accomplished with a simple downward-pointing triangle.

Below are some good examples of horizontal menus that visually indicate drop-down menus within them:

QN5 Music

Kinder-aktuell

Unfortunately, many websites do not feature this simple yet effective marker. Below are a few examples of “surprise” drop-down menus:

webstudios

billoneil.com

Various Trends And Styles 

Finally, here is a showcase of horizontal navigation bars, to give you an overview of the different styles on the Web and how they fit their layouts.

These examples do not necessarily represent best practices but are worth considering when designing your own horizontal navigation bar.

Tabbed Horizontal Navigation 

Owltastic

inkd

Horizontal Navigation Without Bar #

Full Cream Milk

My Favorite Thing

Horizontal Navigation Below Primary Page Header 

The Mindset Game

Lanbruk’s Gunya

Horizontal Navigation with Icons and Text #

Mission Bicycle Company

Horizontal Navigation with Numbered Links 

Glocal Ventures

Horizontal Navigation with Left-Aligned Link Text 

Twitshirt

Grouped Links Under Horizontal Navigation 

Render

Auditude

Semi-Transparent Horizontal Navigation Bar 

Wetaskiwin Regional Public Schools

Descriptive Text Under Horizontal Navigation Links 

Eyemagine

Liquid-Width Horizontal Bar with Centered Links 

Jupiter Underfloor Heating

Cambridge Shakespeare Festival

Horizontal Links Divided by Graphic 

Arca lui Noe Hotel

The Art of Non-Conformity

Horizontal Navigation at Bottom 

Lorem Ipsum

Conclusion 

The practices recommended in this article do not apply to every context and may not be right for every design, niche or industry. But they do highlight the need to give users a better experience and avoid potentially confusing navigational setups.

Web users usually behave based on learned habits. Creating a layout or pattern that unnecessarily disrupts those habits will only weaken your website’s conversion rates.

So, before you design a horizontal navigation menu, consider link names, section hierarchy and any other factors that could affect usability. In doing so, you will create a smooth user experience that allows visitors to find the information they want quickly and efficiently.