Tuesday, May 13, 2008

Character Design using Adobe Illustrator.



This lesson has two first's. A new instructor has stepped up to the mic: Mike MacNerland, AND this is CartoonSmart's first lesson with Adobe Illustrator (more to follow, I'm sure).

Here's the official "sales page" write up which will describe the lesson better than my rambling blog-speak....

This tutorial teaches character design using sweeping curves, unique angles, minimal shapes, and highly stylized, sometimes abstract forms. Cartoons like the Jetsons, and Flinstones are reference points for what this popular modern style grew out of. Ffor example look at the swooping continous line of Wilma Flinstone's hair, Fred and Barney's simple no-necked egg-shaped bodies, or the background art of the Jetson's signature curvilinear universe. A modern reference for this style would be shows like Dexter's Lab or Power Puff Girls that minimalized the classic Hannah Barbera look to the extreme. One major benefit of this simplified design style is that animation can be done much quicker than a more complicated realistic character. Guest instructor Mike Macnerland was brought into teach this lesson because of his background in the animation / illustration industry and his portfolio of character designs embody this re-invention of that classic 1960's cartoon look. The tutorial covers sketching characters for 30 minutes (with paper and pencil or on the computer with a Wacom), then tracing over his designs in Adobe Illustrator. This portion of the tutorial covers some of the basics of drawing with vector art in Illustrator. Mike also shares some personal tips to developing a career as a professional artist.

The total course time is 4 hours. Quicktime or Real Player will play the tutorial movies.


Still here? And interesting in buying. Please click here then.

Flash Components Lesson for Actionscript 3 !




Well this has been a heavily requested lesson, and one that I actually learned quite a bit from by teaching it...

"All About Components" (apt title right) It of course covers all of Flash CS3's User Interface Components. Which includes...

- CS3 Button Component - simple clickable button. This part also teaches how to change the text style of this component (and all others)
- CS3 CheckBox Component - simple checkbox, turns a value on or off
- CS3 ColorPicker Component -gives users a pallette to choose colors from. This part demos how to tint objects / text to that color
- CS3 ComboBox Component -basic pulldown menu
- CS3 DataGrid Component - displays tabular type data, This includes loading an XML file into a data grid (example file included)
- CS3 Label Component -simple label, often used with another component to describe it
- CS3 List Component -scrollable list
- CS3 NumericStepper Component - For clicking to step up or down a number at specified intervals
-CS3 ProgressBar Component - used for showing the loading progress of the current file or externally loaded content (examples for each)
-CS3 RadioButton Component - great for a multiple choice type quiz (includes an example quiz file, great for teachers)
-CS3 ScrollPane Component - scrollable container for content (images, movieclips, swfs, etc)
-CS3 Slider Component - simple slider device, could be used for moving objects onstages or changing values
-CS3 TextArea Component - used for a scrolling dynamic text
-CS3 TextInput Component - used for capturing user input
-CS3 TileList Component - perfect for loading a thumbnail gallery, or any series of full size images. Could be set as a grid or rows/columns
-CS3 UILoader Component - used for loading external image files (includes other swfs)
-CS3 UIScrollBar Component - used for a scrolling dynamic text, the example includes loading text from a .txt file online

During the lesson and in each example file we've demonstrated code for the most common uses of each component.
Trace statements in each file are used to output different example values that could be useful in your project. Of course watching the tutorial videos are your best learning source, but if you're in a hurry for a quick example of each component, these example files will be a handy reference and stepping stone for exploring each component's full uses.

Example files include a component already onstage and a runtime-created version of the component.

All code is written in Actionscript 3

Interested? Check out the sales page here.... All About Components

Thursday, April 24, 2008

Awesome XML and Actionscript 3 Image / Swf Gallery



Learn to Progam an Actionscript 3 XML Gallery Compatible with Flash CS3

This 2 hour Quicktime tutorial for Flash will teach you the Actionscript 3 Code to load an XML File, which will bring thumbnails into a scrollable pane. Thumbnails then link to corresponding images or swfs which load into the main area of the Flash file.

Cool Features...

In the XML file you can easily change thumbnail paths, pictures paths, picture titles and descriptions using XML.

You can also swap thumbnail layouts. The example on the site uses a single vertical column and single horizontal row of thumbnails to free up more screen real estate for the main images. You can also create thumbnail areas of any number of rows / columns.

Add links to open other XML files which can load up alternate galleries.

Code taught includes...

Functions
Enter Frame Listeners
Mouse Event Listeners
Scripted Motion Tweens
Tween Finish Listeners
Object Dragging and Release
Scoring and Math logic
If Statements
While Loops
Variables
Positioning and Scaling
General Button Code
ScrollPane Components

Grab it here...XML and Actionscript 3 Image / Swf Gallery

Blender Basics 2: Setting up a scene.




Oops, I forgot to blog this one last month! Well you CartoonSmarter's probably predicted this lesson would be out anyway. Here's a rundown of what's taught...

This lesson teaches

Create a basic rig (a skeleton)
Skin a rig 3 different ways
Lathe using the Spin tool
Use the Screw tool
Use multiple textures
Extrude along 2d and 3d bezier paths
Place an image using UV maps
Use procedural textures on materials
Use boolean modifiers on objects
Use layers
Use groups
Append from other files
Create new screens
and more tips on working with materials, meshes, objects, lights, and rendering

The link you ask? Click here

Wednesday, March 5, 2008

CartoonSmart 3D?! What's this...



When long-time student, John Nyquist asked if I had plans to teach Blender lessons, I said "huh? Blen-what?". So John explained to me what Blender was (er, an unbeliveably FREE 3D Program) and then showed me some of his samples, I said "John, how 'bout YOU teach this course!".

So CartoonSmart now has a new instructor AND hopefully many more lessons to come with John behind the helm. The first Blender lesson is an obvious one, "Basics of Blender". And slated in the near future will be a few more basic courses in the various aspects of 3D. This first course got as far as Modeling and Shading. (see the pic below)



If anyone wants to visit John's site, and contact him with some lesson suggestions or kudos for stepping up to the plate on this new subject, his web home is http://www.nyquist.net

Also if you haven't yet downloaded and installed Blender, it takes about about 2 minutes. Seriously. Visit http://www.blender.org/ for the details.

And lastly, consider buying his lesson here! CartoonSmart tutorials never really make big fat profits, but we will be donating some percent toward the Blender developers in the not-so-distant future.

Thanks.

Actionscript 3 Darts Tutorial!


Darts anyone??

So I finally got around to creating an Actionscript 3 game. Actually I've got a few more in my secret stash, but this one is now in the "taught" category. So its a pretty typical Flash dart game. Grab a dart, release when the floating target is over a number, and hope you released in time. Some features I added (that I noticed were missing in most Flash dart games), you can control both the speed of the target area, as well as the location of the board. So by adjust some sliders (pic below)....



...you can control how the board moves across or up and down the screen.

Also I figured most people would want to take a shot at creating their own variation of the usual dart scoring. So the second part of the tutorial starts off by demonstrating the scoring for a "Round the Clock" dart game, then with a few slight modifications, I show how to add in a "501" scoring setup. All within the same game / coding framework, so when students want to customize the scoring, they should be well prepared for how and where they need to do that in the Actionscript documents. And speaking of which, this lesson teaches using all external .as files. Little easier to keep up with what code is where.

Anyway, here's a final pic of the game. But why the heck are you still reading this blog. Click anyone of these images to go actually play it, and consider buying the lesson.



Later playa's!

Tuesday, January 22, 2008

Create Slick Email Forms Using Flash



Just released, 2 Hour video lesson which teaches Actionscript 3 Flash Email Forms (with "Flash Cookies")

Watch Step by Step Instructions for Creating the Form shown on the sales page, with these key features....


- Locally Shared Objects (basically, Flash "cookies") are created to save the form for filling in later.
For example, fill in some of the fields in the sales page. Press TAB or "Save Form", then close the window and come back. Upon return the information filled in previously will appear. This is a good feature for lengthy forms that might extend over multiple swfs.

- Restrict input text to specific characters. Also error messages can prompt users about typing restricted text. You can test this out in the Order # field on the sales page. If you type letters instead of numbers, an error prompt will show up.

- Prior to submitting the form, required fields can be tested for accurate info. For example, if you exclude the @ symbol or a period in the Email field, the form will prompt you to enter a valid email address

- Learn to use four common Components: Checkboxes, Label Buttons, Pulldown Menus, and Scrollbars. Also these components can workhttp://www.blogger.com/img/gl.link.gif together, for example certain pulldown menu's will switch the checkbox to being selected.

- Scripted Motion Tweens can be added to make user messages slide in instead of appearing abruptly. You can test this out in the Order # field. If you type letters instead of numbers, an error prompt will slide / fade in.

- Input and Dynamic Text boxes are taught extensively.
- The PHP file to send the form is also included and can be modified as well

To grab this video tutorial on