Archive for category Tutorials
The Graphic Novel Project
Posted by Jerlyn in General, Inspiration, Tutorials on August 26, 2010
I’ve been really into Graphic Novels lately because I discussed a project with some of my close friends and they thought it was brilliant. I decided to work on a graphic novel (to add to my other millions of projects — I intend to complete something before I’m 30 so have patience with me) because I love to draw and I might consider having a gallery show out of it. This also means that I also get to write – Joy! The novel will have 14-15 short stories, the great part is that they are quite humorous to tell (I just hope they translate well with drawings).
I really enjoy drawing (the following image is a pen drawing from the Design Lady NYC fan page ) and I enjoy telling stories so I’m pretty excited. The only thing I will dread is writing everything — it’s difficult enough to blog.
By the way, don’t you just love the internet? I searched for How to make a graphic novel and these two links came up:
1. How to Make a Graphic Novel on EHow
2. How to Create a Graphic Novel on WikiHow
However, books aren’t a bad idea either.
——————–
I found a document by Ruth McNally Barshaw, author of the Ellie McDoodle books – www.ruthexpress.com
1. Write a story. For best results it should be a really good story, revised and honed until it’s great. Script form is best. Pretend you’re writing a movie. Think about stage directions and character movements.
2. Create character sheets so you know what the characters look like from all sides. Keep them consistent from page to page (a sure sign of professionalism).
3. Decide on the look of your graphic novel. This is entirely up to you. Realistic – cartoony – abstract – superhero – manga – there are a million styles. Do what you love, and what’s easy for you to do, since a GN is a huge undertaking and you want to still be interested in it when you’re in the middle of it.
4. The lettering: Use a nice font on the computer or learn to hand letter. Legibility is what matters most. Decorative fonts are hard to read.
5. The layouts: Use variety to your advantage (if the tone is supposed to be boring, then it’s ok to use boring art). Dynamic camera angles keep the reader wanting to see more.
6. Drawing skills: Even the pros still take art lessons sometimes. Push yourself to do your best. Push yourself to always improve, even if you’re already great. Draw from life. Draw people, animals, plants, everyday things. Draw scenery. Try to take things down to their essence using the fewest number of lines possible.
7. Roughs: Draw in pencil to start. Don’t ink until your book is completely done and you’ve thought about revisions.
8. Intended audience: Your audience is your first concern. Make sure they understand what you’re saying.
9. The hook: The thing that reaches out and grabs the audience. Hook them early and give the audience a reason to read beyond the first page – and a reason to keep turning the pages.
10. Pacing: Give the appropriate amount of time to what needs to be said or accomplished. Example: Person is running to the store. Do you show every frame in a series of panels? Do you show him running in one panel? Do you just use narration and no picture? It depends on how important the action is to the story.
11. Action: If you can show it in pictures, don’t say it in the words.
Keep your characters moving, keep the plot moving forward.
Once you have all that mastered, try this:
Spice it up with quirky stuff.
Use fun words and lots of expression in the characters’ faces.
Use metaphors and similies and symbolism.
Be yourself. Do what only you can do.
Play with contrast. On a white field, the eye is drawn first to black, and vice versa.
Repeated motifs or themes or callbacks are fun for the audience to notice and remember.
——————–
I’m currently reading AYA of Yop City by Marguerite Abouet illustrated by Clement Oubrerie. I read the first volume and decided to check out the other two.

(images from Amazon.com)

This is the first one that I read.
This is the final version.
What Graphic Novels are you into?
Have you ever created a graphic novel?
Avoid loading content in the first frame
This is one of the problems I answered on cookbooks.adobe.com please check it out and submit questions.
How do I get Embed to not load content in the first frame of my Flash CS4 document?
Problem
When using the Embed tag, [Embed(source="stuff.swf", symbol="a_mc")], it loads all embedded content in the first frame, even before my stage color loads. This renders my pre-loader useless. I make casual games and many game sites want all assets in one swf file, so I can’t use a separate swf as a pre-loader. I have gone into Publish settings and set “Export classes in frame” to 3 and that didn’t prevent all the content from loading in the first frame.
Solution
Create a listener to make sure that the movie has loaded, this is in AS2 (assumption because the question called for “a_mc” in the request). In AS3, this can be solved by creating your preloader then calling a function that adds the movie to the stage.
Tracing to a textfield on stage with AS3
You can download the example here: tracer
You can see trace statements in the output window within Flash. You can also use a debugger for this however what if you can’t install them or have no access to get them?
Here’s an option… tracing on stage. Create a text field and trace to the stage. I hope this is a good alternative to people who wouldn’t want to install anything else.
I may place this on the stage in an area that doesn’t interfere with the movie just to make sure the functions are being called.
I called the movieClip traceField.
within my function along with my trace statement:
trace("Tracing init function)";
I also added
traceField.text = "Tracing init function to stage";
That’s it. Seems to make my workflow easier.
stop();
init();
function init():void{
//Call trace statements
trace ("Init function has been called");
traceField.text = "Init function has been called";
var cbtn:MovieClip = new clickbtn();
cbtn.x = 140;
cbtn.y = 140;
addChild(cbtn);
cbtn.buttonMode = true;
cbtn.addEventListener(MouseEvent.CLICK, btnClick);
cbtn.addEventListener(MouseEvent.ROLL_OVER, btnRollOver);
cbtn.addEventListener(MouseEvent.ROLL_OUT, btnRollOut);
}
function btnClick(e:MouseEvent):void{
//Call trace statements
trace("Button has been Clicked");
traceField.text = "Button has been Clicked";
}
function btnRollOver(e:MouseEvent):void{
//Call trace statements
trace("Button rolled over");
traceField.text = "Button rolled over";
}
function btnRollOut(e:MouseEvent):void{
//Call trace statements
trace("Button rolled out");
traceField.text = "Button rolled out";
}
How to create a email form with AS3 & PHP
Download the emailer here it was made with lots of recycled code so really no credit is necessary.
I made two movieclips that I used as buttons: sendbtn and resetbtn.
I created input fields called: yourName, fromEmail, yourSubject and YourMsg.
They post the variables: name, from, subject and msg to the PHP.
/*************************************
Buttons
**************************************/
sendbtn.buttonMode = true;
sendbtn.addEventListener(MouseEvent.CLICK, submit);
resetbtn.buttonMode = true;
resetbtn.addEventListener(MouseEvent.CLICK, reset);
init();
/*************************************
Variables needed
**************************************/
var timer:Timer;
var varLoad:URLLoader = new URLLoader;
var urlRequest:URLRequest = new URLRequest( "mail.php" );
urlRequest.method = URLRequestMethod.POST;
/*************************************
Functions
**************************************/
function init():void{
//Set all fields to empty
yourName.text = "";
fromEmail.text = "";
yourSubject.text = "";
YourMsg.text = "";
}
function submit(e:MouseEvent):void{
//Check to see if any of the fields are empty
if( yourName.text == "" || fromEmail.text == "" ||
yourSubject.text == "" || YourMsg.text == "" )
{
valid.text = "All fields need to be filled.";
}
//Check if you're using a valid email address
else if( !checkEmail(fromEmail.text) )
{
valid.text = "Enter a valid email address";
}
else
{
valid.text = "Sending over the internet...";
var emailData:String = "name=" + yourName.text+ "&from="
+ fromEmail.text+ "&subject="
+ yourSubject.text+ "&msg="
+ YourMsg.text;
var urlVars:URLVariables = new URLVariables(emailData);
urlVars.dataFormat = URLLoaderDataFormat.TEXT;
urlRequest.data = urlVars;
varLoad.load( urlRequest );
varLoad.addEventListener(Event.COMPLETE, thankYou );
}
}
function reset(e:MouseEvent):void{
init(); //call the initial clear function
}
function checkEmail(s:String):Boolean{
//This tests for correct email address
var p:RegExp = /(\w|[_.\-])+@((\w|-)+\.)+\w{2,4}+/;
var r:Object = p.exec(s);
if( r == null )
{
return false;
}
return true;
}
function thankYou(e:Event):void{
var loader:URLLoader = URLLoader(e.target);
var sent = new URLVariables(loader.data).sentStatus;
if( sent == "yes" )
{
valid.text = "Thanks for your email!";
timer = new Timer(500);
timer.addEventListener(TimerEvent.TIMER, msgSent);
timer.start();
}
else{
valid.text = "Oh no! Something is wrong! Try again...";
}
}
function msgSent(te:TimerEvent):void
{
if( timer.currentCount >= 10 )
{
init();
timer.removeEventListener(TimerEvent.TIMER, msgSent);
}
}
————-
Then I created a PHP file called mail.php with the code:
<?php
$yourName = $_POST['name'];
// the variable needs to match your Actionscript
$fromEmail = $_POST['from'];
// the variable needs to match your Actionscript
$yourSubject = $_POST['subject'];
// the variable needs to match your Actionscript
$YourMsg = $_POST['msg'];
// the variable needs to match your Actionscript
if( $yourName == true )
{
$sender = $fromEmail;
$yourEmail = "yourEmailAddress@yourdomain.com";
// This will be your email address so please change this
$ipAddress = $_SERVER['REMOTE_ADDR']; // This gets the user's ip Address
$emailMsg = "Name: $yourName sent this from IP: $ipAddress \n\n
Return Email: $sender \n\nSubject: $yourSubject \n\nMessage: \n\n
$YourMsg \n\nThis email was sent using a form on your site";
$return = "From: $sender\r\n" . "Reply-To: $sender \r\n" .
"X-Mailer: PHP/" . phpversion();
if( mail( $yourEmail, "$yourSubject", $emailMsg, $return ) )
{echo "sentStatus=yes";}
else
{echo "sentStatus=no";}}
?>
New Illustration
Posted by Jerlyn in Illustrations, Tutorials on January 16, 2009
I was working on a new style these past weeks.
It started out with a photograph.

Brittani Smith
I took photos of this model, Brittani Smith and it was retouched from the original.

Illustration
These were final inked sketches that I made from pencil sketches. I printed the photograph first and traced sketches over on tracing paper.

Sketch
I made some vectors and cropped the image to create a silhouette.

Illustration Progress
This is how it ended up:

Final Illustration
Animated Favicon
Happy Halloween! On a sidenote: I downloaded a screensaver at inkymole. I love it. I really love her stuff!
So, I think this probably works on firefox alone, however my friend said it might work in Internet Explorer. I will check when I get home.
I decided to create an animated favicon. You know, those cute icons that appear in the browser address bar. Mine animates. It looks like the image on the left. If you go to my portfolio domain: jerlyn thomas. It should work if you are using firefox at least. So, how do you do it?
First off in the html code you want to include this in your header.
<link rel=“icon” type=“image/gif” href=“./favico.gif” />
I named mine favico.gif however I read that you can rename it to .ico and it should be fine.
It does not animate in other browsers so I suggest leaving it at a default first frame. For example, mine looks like this in safari. 
Well, good luck, let me see how yours turn out.








Recent Comments