Art Tutorials

  • ButtonNode with enable

    This is a follow-up to my previous ButtonNode post.  In this update I will be adding additional functionality to the button to allow the button to be enabled and disabled.

    For this new functionality I want the ButtonNode to be able to do the following:

    • Maintain a boolean value indicating the current state of the button
    • Prevent the button from being clicked when it is disabled
    • Update the look of the button so that it appears to be disabled
    • Allow the button to toggled between the enabled and disabled state

    To start we will simply add a new public property that represents the enable state of the button

    @property (assign, nonatomic) BOOL enable;

    Defining this property will automatically synthesize the getter and setter methods. But, since we want to change how the button looks and behaves when it is disabled we need to be able to execute code whenever the buttons’s enable property is set. The simplest way to do this is to create our own setter method which will be used instead of the auto-synthised setter.

    // Setter for the enable property. Update the button based on the new state
    – (void)setEnable:(BOOL)enable {

    if (enable) {

    self.userInteractionEnabled = YES;
    self.alpha = 1.0;

    } else {

    self.userInteractionEnabled = NO;
    self.alpha = 0.5;

    }
    _enable = enable;

    }

    In the setter method, when the button is being disabled, we set the userInteractionEnabled to NO and apply an alpha of 0.5 to dim the button. When the button is enable we simply reset the alpha to 1 and re-enable user interaction. Finally we update the underlying _enabled variable to track the state of the button.

    The ButtonNode sample app, available on our github (ButtonNode) page, has been updated with this new functionality.

    You can find me on twitter @mellowcoder

  • How do you figure episode 3: Using Line of Action to identify Exaggeration Opportunities

    Today we’re building off of the concepts in a previous How do You Figure episode (see here) and will talk about using line of action to exaggerate our poses.

    I’m working off of a stock photo from Marcus J Ranum, a photographer who provides amazing resources for artists mostly for free, check out his deviantart for great stock photos.

    This character is swinging his axe, moving from left to right, I’m going to attempt to enhance the feeling of power in the axe swing.

    Line of action

    I’ll start by identifying the primary line of action, a curved line that shows the tension of the spine and the direction of the force. In my study drawing we can exaggerate the feeling of these forces by leaning the line further to the right and bending the line in the torso further

    LineofAction_2

    LineofAction_3

    I find it helpful to think of the other limbs as having their own lines of action, often providing counter motion to the primary line of action.

    LineofAction_4

    The exaggeration opportunity here is often in the squash and stretch, and their relationships with the primary line of action. Adjusting slightly to avoid right angles can make the pose feel more organic.

    From there the study is finished off using a few layers of sketching

    LineofAction_5

    block in

    LineofAction_6

    clean line

    LineofAction_7

    tones/painting.

    each of these other steps have their own shortcuts to get to a finished state more efficiently, but that’s for another blog post.

  • How Do You Figure: Episode 2, building shortcuts

    #timelapse #figure #drawing at the Jean Henry School of Art hosted by @mikeritch

    A video posted by @joshings on

    Figure drawing for illustration can be broken up into roughly 3 basic topics. Structure, Line and form. All three are intertwined, but each can be practiced independently. Today we’ll talk about the first two topics. In all of these things, generally you can start with a circle.

    1a_circle

    Professional artists can be deceptive in their work. When Eric Goldberg seems to wave his pencil like a magic wand and reveals perfectly placed lines almost every time, it can feel like that’s the way to start drawing characters. But the secret is that under the disturbingly perfect lines is a measured structural drawing he’s already worked out in his head. Goldberg has such a refined sense of proportion and motor control that he can jump straight to the lockdown line, especially on a character he’s spend multiple years drawing animation drawings of. But when he teaches you how to draw in his book Character Animation Crash Course! he starts with a circle

    1b_eric-g-42-sizing-web
    Seriously, just go buy the book, its amazing.

    1c_AndrewLoomis1

    1d_AndrewLoomis5

    Andrew Loomis gives a solid formula for constructing a generic white guy human head in his series of illustration books including Figure Drawing for All its Worth, and Drawing the Head and Hands. It should come as no surprise that he starts with a circle. The next 2 lines unlock the secret though. The center line of the face, and the brow line. These two lines provide the structure that you can build the rest of the face and head on and the head is the best way to measure out the rest of the body easily.

    The shortcut to drawing freehand is to be able to visualize the underlying structure before you put pen to paper. The downside is there is no shortcut to internalizing that structure, you have to practice. So draw people, but only draw the construction lines, circle, center, brow. Draw from life, draw from movies, draw from the mirror, get the proportions into your hands and head till it takes no effort.
    1e_Practice
    movie credits: Her, Hunger Games, Django Unchained

    And note, drawing final lines freehand shouldn’t even be your goal necessarily. Its a fun party trick, it can come in handy if you’re doing reportage, but many artists continue creating construction drawings before locking down the final line through their entire career. Case in point: Glen Keane, who seems to carve the shape from the paper, stroke by stroke, laying down construction lines whenever necessary before locking down.

  • Speed Painting Update

    Of late I’ve found myself to be very busy and have very little time. With that in mind I’ve been working on improving my speed painting. I’m approaching this process in three steps. Step one is doing single character speed painting with a focus on keeping each step of the process as tight as possible.

    This is a speed painting I did a couple weeks ago that took me about two hours from concept to completion. I like the idea but I didn’t get a chance to refine it as much as I wanted to.

    EnchantedMinitor

    Given the same time period, here is a speed painting finished last night.

    Stone

    I was able to get a much more finished looking piece by making some slight edits to my process. The first step was to spend more time concentrating on the silhouette. Even though I’m still sketching the character out in a construction style I’m blurring my eyes and looking at the over all shape. I’ve been doing quick silhouette studies through out the week to practice looking for shape of the positive and negative space.

    StoneSketch

    And secondly, I’m forcing my self to use a larger brush then I want to! I let myself make larger shapes and concentrate on getting the tone relationships in and then moving to a smaller brush as I get into the detail areas.

    The next step in this series of studies is to apply the silhouette study style I’ve been working on to designing an entire composition and not just a character. And the final step is to bring togeather the first two steps to increase the efficiency of speed painting full scenes at higher quality and in turn allowing me to increase the speed and quality of the paintings I spend more time on.

  • Working Outside Your Style

    togeather

    As your moving towards working as a professional artist you are often told how important it is to develop your own style. It’s very important for getting noticed and having your work stand out from the artists around you. Developing your style is very important and should not be overlooked by any aspiring artist, but there are many career paths in the art world where it is just as important to be able to work with in the style of the project you’ve been hired to develop.

    This could be as simple as the armor in the world your working on having exaggerated shoulders and specific decorations, or as complicated as the finishing has to match the body of work as exactly as possible following very specific guidelines and models. Whether the style is that of matching a known artist like Norman Rockwell, working with-in a game style, like Magic the Gathering, or working in the style of an animation like the Simpsons, you need to approach the project in a similar way.

    First and foremost, spend time studying the franchise and how it’s developed over time. when other people have worked in that style what are the key elements included that makes it stand out. The broad strokes are important, matching colors, brush strokes, and/or line weight, but it all comes down to the details. The angle of a jaw line, the direction of a hair part or the thickness of a lip can be the difference between nailing a character or having an audience know somethings wrong, even if they can’t place what it is.

    I find a good exercise is to take the base style you need to work in and your personal style and mash them together in order to let yourself find ways to use your own methods to express the style you need to.  Below are some studies I did for working on projects for American Dad! I worked with similar colors, character design and shading, but my own base features for eyes, noses, mouths and ears as well as exaggerated the line weights and I was a little more expressive with body shapes.

     

    Doc Girl Hare Convict

     

  • Ru’Bacom Tutorial Part One

    Ru”Bacom, Pedlar of Dragons.

    Today’s blog post is looking at the first step of my digital painting process. My first step is subdivided into three sub drawings as shown below. A construction sketch. This is laid down in Blue, Green and Red to build up the forms and get the basic shapes in place. I than put down a rough sketch in black establishing contours and basic shadows. In the third pass I lay in the basic highlights and usually add an under painting color wash just to start myself thinking about the palette I want to develop. The color I use is normally complimentary to the main feeling I want to express in the final image.

    001Ru'BacomConstruction002Ru'BacomRuffShadows

    003Ru'BacomRuffHighlightsThe last image in this post is to demonstrate how I set up my workspace as I begin to draw. I collect several reference images that I keep near by when working, Often including images from a book or on my Ipad set up as well depending on what I’m working on and how many details there are.

    In the next post we’ll look at the tight sketch process. Fixing some angles and details and planning the painting process.

    The next two process posts will include time laps and/or tutorial videos to demonstrate the process in more detail.

    FullScreenSetUp

     

  • How Do You Figure 1

     

    HDYF-Header-I1

    Hey! Welcome to ‘How do you Figure’ a bimonthly feature exploring the use of figure drawing in Illustration. All images are copyrights are reserved to their respective holders and are presented here for editorial and educational purposes.

    Series 1. I can see your model stand

    In sci-fi and fantasy illustration the human figure is often the most important element in a piece, serving a number of different roles. Whether cementing a sense of scale in the minds of the audience, providing an empathetic entry point into the fantastical scene or carrying the entirety of the story on its shoulders. To accomplish this the illustrator must strive for the illusion of life, a term coined in the halls of the disney animation studio to describe the ultimate goal of any character animation. While character animation and figurative illustration are not exactly the same in practice, many of the same underlying principles can be applied. One of the most common weaknesses of fantasy illustrators is to mistake surface refinement for the illusion of life.

    fig-1aCase in point, Boris Vallejo. Vallejo is an incredibly talented illustrator fig-1bwho has been working essentially non stop since he broke into the industry in the 1970’s, and rightfully so. He is truly a master of his medium, pushing paint into realms of the impossible in a way that challenges the imagination of the viewer. His images are most successful when the imaginary elements are primary (fig. 1a) or when the story telling is best served by a figure in repose (fig. 1b)

     

    His work is weakest when he must convey story through the movement of a figure. As a point of comparison we’ll be looking at the work of Frank Frazetta, no stranger to the figure in repose (fig. 1c). The primary difference being that Frank got his start drawing Thunda comics (fig. 1d), a job that demands the figure be as dynamic as possible while still being easily reproduced in stark black and white.

    fig-1cfic-1d

     

     

     

     

     

     

     

     

     

    For the first example we’ve got some muscles clashing with each other (Fig 2a). On the left is Frazetta’s piece and on the right is Vallejo. Both have strong silhouettes (fig 2b) that draw attention to the figure and emphasize the fight as the central focus. But lets look at the line of action (Fig 2c). In the Vallejo piece we have two nearly identical gestures offset only by size. The primary lines of action in the body and arms are nearly parallel with each other, this symmetry stiffens the composition and the figures within it. Imagine if the Giant figure had a contrasting line of action, similar to that of the frazetta piece (Fig 2d)

     

    Further, there are anatomical clues to the model stand that disconnect the figures from the fantasy of the moment. In both pieces the muscle bound men are flexing, ostensible to swing a weapon at a no doubt deserving target. In Frazetta the muscles of the arms and torso are roughly equal in their engagement. The biceps engage but are elongated, the whole character feels like a spring pulled back about to be released. (fig 3a). Vallejo on the other hand is clearly a figure posing to show off his muscles. There is no twist in the spine and the weight is centered between the feet. This is good for maintaining balance when on a model stand for longer poses, but does not convey movement particularly well. The biceps are extremely flexed, in a way only seen in bodybuilders in competition. If one were to swing a warhammer one handed like this, the biceps wouldn’t even engage this way. Its a masterful handling of the figure, but it looks more like he’s trying to win Mr. Universe than that he’s trying to knock out Mr Giant over there.  (fig 3b)

    Vallejo is one of the many spiritual successors to the style that Frazetta first established in his Conan illustrations in the 1960’s. As a result there are multitude of comparable pieces by Vallejo that clearly reference the Frazetta aesthetic, paint handling and subject matter. Take a look at these examples (frazetta on the left, Vallejo on the right) and try to see the model stand. Want to take it a step further? Try doing a paint over of the Vallejo half using the Frazetta gestures as guidance.

     

    FrankBoris_1

    FrankBoris_2

  • Pencil Made Brush Set

    The title of this post may be a little misleading. This is not a brush set of pencils. It’s a set of brushes that I’ve created for speed painting by using a HB pencil to draw the shape, then scanning them into Photoshop. I’ll be doing a speed painting with these brushes to post as soon as I get a chance.

    Right click the link and save to your computer. If you just click the link it tries to open it in your browser.

    Pencil Made Brush Set

    Brushes

     

    Edit:

    40 min speed painting. Not great, but not bad for under an hour.

    Willy

     

     

     

     

  • Dwarfs! Speed Paint and Process Work

    The last two weeks I’ve been extremely busy but I wanted to make sure I took an hour here and there to keep working on my process and speed painting. I also took the opportunity to explore a pallet I’ve extracted from a Paul Bonner painting that I’m using for one of the book covers I’m working on.

    I started with a blocky speed painting to warm up creating volumes quickly, about an hour.

    Barron

    Over the next week when ever I had a free couple hours I would work on this more developed character.

    SpearFishDwarfDetail

    SpearFishDwarfRough001

    SpearFishDwarfRough002

    SpearFishDwarfRough003

    SpearFishDwarf003

    Next week I’ll be going through the process of putting together page one for Gellini’s special gift.

  • Painting from colors of photos of paintings

    There is a common practice in digital painting these days of extracting the colors from a photograph in order to create a unified pallet. While this works quite well, as I’m been trying it I find it’s important to limit the amount of colors you pull from the photo to make sure the colors in your painting don’t get too busy. I have however discover that extracting colors from images of other paintings allows you to work with in that paintings color range. By no means should you just develop your pallets this way. If you don’t have experience with creating a color pallet I highly suggest reading “color and Light” by James Gurney. He does an excellent job laying out techniques for developing an oil painting pallet that translates easily to digital painting.  Below is a speed painting study of a character I’ve roughly rendered with color pallets extracted from still life photos. I’m finding for limited, moody pallets, classic still life paintings of fruit make an interesting place to start. (although, be aware that blues are more uncommon in this type of painting.)

     

    DrunkFisianColorTest copy

Leave a Reply

Your email address will not be published. Required fields are marked *