Wednesday, April 15, 2015

Hayate The Combat Butler Chapter 489: Cliches Are Important -- Review And Synopsis

Do not sexualize the... oh for... go ahead! Nagi still looks cute either way. I want that bookmark!
Synopsis: Nagi is dreaming about the times she'd spent with Hayate when Hayate wakes her up and we find that she's actually fallen asleep in the middle of the downhill race from the previous chapter because it was so cold.

Hayate remarks how dangerous the downhill race is, but Nagi assures him that New Zealand is actually the perfect place since they can be rescued immediately in case something goes wrong and that there are no dangerous animals like brown bears or grizzlies here... at that moment, Hayate points to something behind her, which turns out to be a huge pedobear.
This is actually a realistic rendition of pedobear.

They make a run for it with the pedobear chasing them down, but suddenly, an avalanche covers up and the pedobear and Hayate is forced to grab Nagi and take a leap of faith to a cliff to the side to avoid it. 
Nagi has tons of faults, but lack of devotion to Hayate sure isn't one of them.
During the lull, Nagi remembers what Maria said and she asks Hayate if he'd quit or if he'd still be her butler even with the debt paid off, but she's interrupted when the ledge they were standing on collapses and they splash into some icy waters underneath. 

Inside the bus with the Hakuo Baka Trio, the number on the completers has gone down to 47 indicating that two more have quit. The bus arrives at the hotel they're staying at and it looks rather expansive and is made to look like a prison garrison.

Back to Nagi and Hayate, Nagi gets all melodramatic and says that she's going to die, fortunately, they're just a few feet away from a cliched mountain cabin... as per Hayate's words.

Inside the mountain cabin, the pair have taken their clothes off to dry and thus, we are treated with some Nagi fanservice. They talk about how this competition seems to be a bit overboard even with 150 million yen at stake.
You a cold man, Hayate.

Nagi also remembers that they were in a similar situation with both of them being together naked quite some time ago (it's only been a few months in the manga's timeline, actually.)

Nagi wonders if Hayate is feeling a bit nervous as well, only to catch him diligently hanging her underwear out to dry. She gets agitated and asks him why he's doing that so seriously, but Hayate says that he always does that.
It's been some time since we've seen this in the manga.
Ever the efficient butler, Hayate says that there's another cabin and the heater is on, so there might be someone who can help out or even a sauna in the back, so he goes off to check it out and tells Nagi to stay and warm up. Nagi complains that his clothes are wet too, but he says that he's used to being cold.

Nagi ponders out loud what he'd do if he gets the 150 million yen, to which, Ruri Tsugumi suddenly answers that his life would be over if he gets it.

Meanwhile, Hinagiku has found a sauna... which means that Hayate will inadvertently stumble in on her while she's half-naked in the next chapter.

Review: By the way, I saw this tweet from Hata.

Which basically says that it's been a while since he's drawn Nagi naked and I was like... wait, maybe it's just my terribad Japanese... so I ran it through a machine translator and it came up with the same results and I was like... no wai... and then I read this chapter and I was like. BASED HATA! You actually did it, you!
Look at your mistress, Hayate! LOOK AT HER! ... Ain't she cutieful? Also, pretty sure that the towel shouldn't be digging into her that way.

Well, this was a rather Nagi-tastic chapter in terms of fanservice. I liked seeing Nagi with her hair down and I like the little deja vu to the time when Hayate stumbled in on her in the bath. The title of this chapter is certainly appropriate.

Also worthy of note is Hayate rescuing Nagi with a sweetheart carry, which we haven't seen for years in this manga.
Probably not a good time for that, Nagi.
More importantly, it looks like Hata's building up some sort of team dynamics with the butler and mistress pair with Nagi clearly being the brains of the operation and being quite competent at it most of the time. If anything, this is the aspect of her personality that has been retained from the now de-canonized CTMEOY (btw, Nyarth, if you're reading this... your reaction on twitter amused me more than anything.) and I like it.

Unfortunately, of course, there were no actual developments for the  Hayate x Nagi ship. Hayate's still as oblivious as ever to her real feelings for him and circumstances have temporarily split the pair apart once again. Given the order of events in the manga, we'll definitely be seeing a Hina x Hayate chapter pretty soon with Hayate wandering in on her while she's in the bath.
I wish this Hayate x Nagi moment had gone on for a little bit longer.
Also, with Ruri Tsugumi once again dropping in and saying ominous things at the end of this chapter, it looks like Hata's really making her out to be some kind of villain or anti-villain for this chapter. I have no idea what she meant by Hayate's life being over if he gets the 150 million yen... with that aside, are you guys convinced that Nagi wasn't trying to prevent him from getting the 150 million yen yet? (exasperated)

Fanart Corner: Here's a quick one of Nagi in one of her season 2 outfits. This is actually the output of my "Draw Nagi Sanzen'in With Me" tutorial series. Her face came out a bit fat, but otherwise, I'm satisfied with how this drawing came out given that I simplified my style to make it easy for others to follow along with me and draw her.

Sunday, April 12, 2015

Draw Nagi Sanzenin With Me Part 2: Digital Lining And Coloring In Photoshop

Before we begin, I'd like to thank and acknowledge everyone who took part in the previous tutorial and showed me what they've done including mikey, kikered, denzil and quite surprisingly... my mother, who has never drawn anything more than a stick figure her whole life. Here are some of their works:
By Denzil

By my mother

Previous tutorials
1. Draw Nagi With Me (Harder Version)
2. Draw Nagi With Me (Easy Modo)

Looks like most of you did the easier part 1.5 tutorial... which is all well and good. For this tutorial however, I'll be using the more complicated Nagi sketch that we've done in the first "draw with me" tutorial. Naturally, you can apply these techniques if you drew the image for the 1.5 tutorial as well.

We're going to need the image either scanned in or just a digital photo taken with your cellphone camera or whatever you can use to get the sketch into your computer. Trust me, it doesn't matter if we're going digital. 

What You Will Need
Adobe Photoshop 7 or higher. I'll be using CS4 for this tutorial, but trust me when I say that Photoshop 7 will work for this as well. You can also apply the techniques you learn here using any tool of your choice. Also, you won't be needing a tablet for this tutorial.

Digital Lining
First of all, you'll need to open the image in photoshop... but even before that, you'll need to know how to manipulate the Pen tool. So in Photoshop, either press "P" on your keyboard or just click on the pen tool to activate it on your toolbox.

With the pen tool activated. Make two points on your canvass by left clicking on two separate areas of the canvass as shown here.
Now make a third point in between your two points. This is the node that you can use to bend and adjust the line.
In order to bend the line, you just hold down ctrl on your keyboard and then left-click and drag with your mouse and you'll notice that the line will bend in the direction that you drag... this is how you adjust lines with the pen tool in photoshop.
Notice those two small anchor points next to the larger node in the middle? You can use those to adjust the curvature of the line as well. Also, you can add another node to the line if you want to adjust it to have say an S curve. You can add as many nodes as you can fit in-between the line, but I would advise against this.

To make a new line elsewhere, just ctrl+left click on a blank part of the canvass.

Now, using this technique, we're going to do the lineart for our Nagi fanart.

With the image opened up in photoshop, make sure that you can see your layers/this window. You can see here that the drawing layer is automatically called your background layer. We're going to create another layer on top of that, which is where we'll be placing the digital lines.
Click on the icon to create new layer as shown here. The layer will be called "LAYER 1" by default but you can right click on the new layer and go to "layer properties" if you want to rename it to something else like "LINES."
Now we're going to apply the pen tool manipulation techniques that I taught you earlier to go over the lines of the image. When lining the hair, just make sure that you create separate lines for each line that you used for drawing her hair. You can use continuous lines for the rest of the drawing. Also, make sure that you do NOT line any shadings that you might have made. We're not going to trace the lines for her face just yet as well. You can press ctrl+ or ctrl- to zoom in/out while you're tracing the lines over. Do your best, and may the RSI be with you!

You can delete any wrong lines you might have made by ctrl+clicking on the line and then pressing delete on your keyboard. You can use the circle tool on your side toolbox. For tracing the button on her outfit. It looks like this.
Once you're done with tracing the lines, go to your layers window and make the "background layer" active by clicking on it and then create a new layer. Press G on your keyboard to activate the fill tool and fill the new layer that you've created with white by clicking on the canvass. Now you can see the lines that you've made so far and make any corrections that you see fit. Your work area should look something like this now.

Make sure that your lines layer or your "layer 1" if you didn't rename it is now the active layer by clicking on it. It should be highlighted in blue as shown here.

Change your foreground color to black. We're gonna use black to line the drawing although lighter colors such as red and brown are also good options.

Press B to make the brush your active tool. Make sure that it's set to 2px and 100% opacity like so:

Press P to make the pen tool your active tool. Now right click anywhere on your canvass area and click on "Stroke Path." A dialog box will appear. Make sure that it's set to "brush" and that "simulate pressure" is checked and click on OK. Now you've set the preliminary lines... but we're not done yet.

Press B to activate your brush tool again and this time, set the brush to 1px still at 100% opacity. Now press P to activate the pen tool and right click>stroke path again. This time, uncheck "simulate pressure" and click OK. Your lineart is done! Press delete once to get rid of the vector lines and your image should now look like this!

Next up, we're going to make her face on a separate layer just below the lines layer, so create a new layer underneath the lines layer like this. I've named the layer as "facelines"
Click on the "eye" icon next to the white background layer (which might be  called layer 1 or layer 2 depending on how you've named things) to make it invisible. Make sure that your "facelines" layer is still the active layer or the one highlighted in blue.

Now we're going to make the eyes and other facial features. Your foreground color should still be black. Use the pen tool (press P on your keyboard) and trace in the basic shapes of the lines you used for the eyes. Make sure that you are drawing complete shapes because we're not going to do "stroke path" this time. Make sure that you're making complete closed shapes with to trace the lines for the eyes like so.
You only need to trace the shapes of the lines in one eye for this because we're going to be using a "dirty shortcut" that a lot of digital anime/manga artists (myself included) like to use.

Ok now with your lines in place, CTRL+Click on an empty part of the canvass and right-click>fill path with following settings.
Click on OK and the eye should now be lined. Press "delete" on your keyboard to get rid of the paths. Your screen should look something like this.
Now for the "dirty trick." Press ctrl+J to make a copy of the "facelines" layer that you just finished lining. Now press ctrl+t and then right-click>flip horizontal on the image.

You'll notice that the "facelines copy" layer has now been inverted. Now all you have to do is press the right arrow key on your keyboard until you get the new inverted layer in the proper position based on your sketch.

Now line in her mouth and nose using the same method on the new facelines copy layer. Once you're done press ctrl+e once in order to merge the facelines and facelines copy layer. We're now done with the basic lineart. Click on the blank icon next to the white background layer to make it visible again so you can see what your new clean lineart looks like. We won't be needing the sketch anymore at this stage. Check that your work area now looks like this.

Laying Out The Flat Colors
Laying out the flat colors makes use of the same principles that I taught on lining the facial features. First, create a new layer for the haircolors, which I've named as "haircolors" right underneath the lines and facelines layers but above the white background layer.

Using the pen tool again, trace the entire shape of the hair (we're going to use "fill paths" again). And then choose a yellow foreground color and fill path when you're done. You should make one continuous shape with the pen tool like I've done here before you use "fill path"

After you've filled the path and deleted the paths that you've made. Nagi should now have her iconic blonde hair like so. Take note of the placement of the layers.
Create a new layer underneath the haircolors layer for her skin and repeat the process to color in her skin. The good news is that you can allow your paths to overlap the haircolors layer since your new skin layer is found underneath the haircolors layer. Like so...
Repeat the process of creating a new layer and coloring it in with the appropriate shade underneath each layer wherein a new color is required until you've finished coloring in all the flat colors on her. Once you've finished everything, your image should now look like this.
Adding Shadows
If you're not used to this, then you are probably getting mentally exhausted at this point. I'd suggest taking a little break and saving your work and coming back to this tutorial when you're mentally refreshed.

Ok, now for the shadows. It's quite simple. I'll use the hair as an example. Create a new layer on top of the hair layer and then right click on this new layer and click on "create clipping mask" so that the new layer is a clipping mask of the hair layer. This new layer will be your shadow layer. If you found that a bit hard to understand, then just refer to this image and make sure that this part of your layers area looks like this.
Now for the shadow color, choose a foreground color that is slightly darker than her current hair color. Use the pen tool again and create the shapes that you will be using for your shadows and then use "fill path" and her hair now has shading! When creating shadows, just be safe and make sure that you create shadows where you believe the light does not fall. Here's how I laid out the shadows on her hair.

At this point, you can also add in the highlights for her hair on the same shadow layer. I personally create another layer with a clipping mask just to be safe. Repeat the process for adding shadows to each individual color on the image and you should come out with something like this. Remember to be safe and just place shadows in areas where you're absolutely sure that light won't fall on. As a rule of thumb, don't place shadows if you're not sure.

Once you've finished adding in the shadows, you should have something that looks like this. Feel free to use my shadow placement and colors as reference.
Coloring In The Facial Features
For the final part of this tutorial, we're going to color in the facial features. First, you should make another new layer underneath your facelines layer as shown here. I've named the new layer "facecolors" for easy reference.
Now create paths to color in her eyes and choose the appropriate shade of green as your foreground color. Just use "fill path" when you're done. I'll be starting with the lightest color for her eyes. At this point, you can also color in her mouth with the appropriate shade of light-red. Again, take note of the active layers here.
Create a new layer and right-click "create clipping mask' on top of your facecolors layer and add in the darker green shadows still using the pen tool>fill path method. You may also want to add in some darker shadows for her mouth.
Create another new layer on top of your clipping mask layer and again, right click>create clipping mask and create some even darker shadows inside her eyes.

Now add in the lens flares by creating another layer on top of your current layer and right-click on the new layer>create clipping mask. Using the pen> right click>fill path method to create the appropriate shapes for the lens flares.  Her lens flares look something like this in season 2 of the anime.
Finally, we're in the home stretch. Create a new layer underneath the facecolors layer. I called mine eyewhites and use the pen>fill path method to fill in the whites of her eyes.Take note of the layer placement here once again.

Now we're going to add in the shadows. First, click on lock-transparent pixels, which is the little icon on top of the layers window as shown here.

With your eyewhites layer transparency-locked, simply choose the appropriate grey color and use the pen>fill path method to add in the shadows for the whites of her eyes.

You're done! Now you're image should look like this and we can add some optional finishing touches.

Finishing Touches (optional)
At this stage, this is completely optional. We're basically going to add dark outlines on the drawing real easily. First, make your white background layer invisible by clicking on that eye icon. Your work area should look like mine above with the image completely transparent and no white background. Save your PSD file and then go to file>save for web & devices and save the image as a PNG-24 file somewhere on your computer.

Once you're done, close the current PSD that you're working on and open the new PNG file that you've saved.

Go to layer>layer style>stroke... and a new dialog box should appear. The default settings should work, which should be 3px, outside, normal, opacity 100% with fill type>color and black as your color. Click on ok, and your image should now have some nifty black outlines like so.
We're done! I hope you found this tutorial both useful and enjoyable and if you were confused as to any steps I've put in here, feel free to ask me. I'm going to try to continue this "draw with me series" for as long as I can. Next time, we're going to go a little bit more basic with pencil drawings and sketching in shapes for total nubbycakes. 
She kinda looks like Etranger from Zettai Hero Project on the PSP, eh?

If you're interested in accessing the previous drawing tutorials, here they are:

Previous tutorials
1. Draw Nagi With Me (Harder Version)
2. Draw Nagi With Me (Easy Modo)