Vacation Notice

Wedding bells are ringing ...

Please note that I will be on vacation from Saturday, July 29, 2006 through Friday, August 11, 2006. In the meantime, please feel free to browse my previous entries and enjoy the content in my selected portfolio.



Stay TOONed!

- Mike Cope

IN THE WORKS: Youth Net Hamilton Website (Part 3 - Official Launch)

In this blog, I provide some "behind the scene" looks at various cartooning and multimedia related projects that I'm currently working on (or have recently completed). My intentions here are to offer a few insights, however small, to aspiring young cartoonists and/or designers who may be interested in these sorts of things. For those projects in development, I title my posts, "IN THE WORKS."

In PART TWO, I gave you a sneak peak at the cartoon character designs that I was preparing for the new Youth Net Hamilton website (http://youthnethamilton.ca).

At this time, I'm very pleased to invite you to visit my client's new site and see how everything came together ...

Above: The NEW Youth Net Hamilton Website.
(click to visit)

If you have any questions or comments about this posting, please feel free to submit it using the "comments" link below, or you can contact me privately via e-mail by using the address provided on my contact page.

Stay TOONed!

- Mike Cope

IN THE WORKS: Youth Net Hamilton Website (Part 2 - Character Designs)

In this blog, I provide some "behind the scene" looks at various cartooning and multimedia related projects that I'm currently working on (or have recently completed). My intentions here are to offer a few insights, however small, to aspiring young cartoonists and/or designers who may be interested in these sorts of things. For those projects in development, I title my posts, "IN THE WORKS."

In PART ONE, I introduced you to the Youth Net Hamilton website that I'm currently designing. Since then, I'm happy to say that we've made a lot of progress and are preparing to launch the new website very soon!

But before we do, here's a sneak peak at the cartoon character designs that will be featured as part of the user interface.

From Rough Sketches to Clean-up & Colour ...

One of the great mysteries of cartooning is that journey known as the "creative process." Personally, I find it kind of fun to not only look at a final product, but also see how it evolved during the creation process. If you're reading this, I'm guessing that you do too!

My first step in designing the cartoon characters for this project was to have some idea of what my client was looking for. As I mentioned in PART ONE, Youth Net Hamilton is a community-based organization of youth and adults that promotes the mental health and well-being of youth. With that in mind, my client was looking for character designs that depicted the diversity of teen culture, but they didn't want the characters too ideal or bubbly.

And so, when I started rough sketching ideas, I was thinking, "Happy, healthy, and clean."

Since the website's interface randomly selects a character to display, our goal was to have six different options to choose from. The following snapshot is a rough model sheet of the character designs that were approved by my client ...

Above: Character Designs - Rough Model Sheet.
(click to enlarge)

With the rough sketches approved, my next step was to clean-up each drawing by inking them with my dip pens and ink.

Tools of the Trade ...

All of my favoured cartoon drawing tools are available at most local art supply stores.

Pen-wise, I currently use Hunt Globe Bowl Pointed pen nibs (#513EF and #512) to do most of my clean-up work. I dip these in black Indian Ink from Winsor & Newton. Personally, I like using "Koh-I-Noor" No. 127N pen holders -- their cork finger grips are pretty comfortable.

If I'm inking something with a special texture, I might switch to a brush to achieve a certain effect such as the character's hair in the following snapshot ...

Above: Inking and Cleanup - Pen Nibs vs. Brush.

I ink directly over my rough work (drawn using a 2H pencil) on sheets of Strathmore Bristol with a smooth surface. That said, ink isn't as forgiving as a pencil if/when you make a mistake, but I enjoy taking this risk. The real challenge is keeping your hand relaxed so that your clean-up lines flow naturally and don't become stiff or over calculated -- you might think of this as "controlled spontaneity."

My drawing board is actually a modified surveyor's drawing table, equipped with an animation drawing disc and backlight. By fixing the bristol with a few pieces of tape, I can rotate the drawing as required.

Above: With the aid of an animation drawing disc.

Once completed, the clean-up character designs were then sent back to my client for approval ...

Above: Character Designs - Clean-Up Model Sheet.
(click to enlarge)

The final step was to colour all of the characters and import them into the website's Flash interface. As I mentioned in PART ONE, there was a certain colour palette that I had to adhere to in this project so that all of the elements complemented one another.

The clean-up drawings were scanned into Adobe Photoshop at 1200 dpi resolution. After adjusting each image's brightness and contrast levels, I converted them into a 2 colour bitmap and reduced their resolution to 300 dpi. I coloured the majority of the characters by hand using my Wacom Graphire tablet, however, larger regions of colour were quickly filled using a single click of the paint bucket.

The following snapshot is of the full-colour Youth Net Hamilton character designs line-up sheet ...

Above: Youth Net Hamilton - Character Line-Up Sheet.
(click to enlarge)

The all new Youth Net Hamilton website is heading out to the launchpad and should be online very soon. I'll post an announcement when it's officially open for business.

If you have any questions or comments about this posting, please feel free to submit it using the "comments" link below, or you can contact me privately via e-mail by using the address provided on my contact page.

Stay TOONed!

- Mike Cope

Click to Continue ...
IN THE WORKS: Youth Net Hamilton Website
(Part 3 - Official Launch)

"Free Samples" Gag Cartoon in Reader's Digest Canada Magazine (August 2006)

The latest issue of Reader's Digest Canada Magazine arrived today.

This month, one of my gag cartoons is published in the As Kids See It department on Page 75 ... If you're not a subscriber, I encourage you to pickup a copy of the magazine!

Hmm ...

I wonder if Mr. Harper likes ice cream?

"Free Samples" in Reader's Digest Canada Magazine (August 2006).

Click the above image to see the full cartoon.

Stay TOONed!

- Mike Cope

IN THE WORKS: Youth Net Hamilton Website (Part 1 - Introduction)

In this blog, I provide some "behind the scene" looks at various cartooning and multimedia related projects that I'm currently working on (or have recently completed). My intentions here are to offer a few insights, however small, to aspiring young cartoonists and/or designers who may be interested in these sorts of things. For those projects in development, I've decided to title my posts "IN THE WORKS."

One project that I'm currently working on is designing a new website for Youth Net Hamilton, a community-based organization of youth and adults that promotes the mental health and well-being of youth. My client is affiliated with The City of Hamilton's Public Health Services and is also part of the larger "Youth Net" network that literally spans across Canada through cities such as Ottawa, Quebec, Toronto, and Vancouver.

The target audience for Youth Net Hamilton's website includes health professionals, teachers, parents, and (most importantly) youth -- especially youth who may either be looking for help, or looking to help others their own age. With all of that in mind, our project goal has been to design a website that is clean, easy to navigate, but also fun & welcoming.

Software-wise, I'm primarily using Macromedia Flash MX and Adobe Photoshop to design the website's user interface. Without getting too boring here with a bunch of techno-babble, what follows are a few highlights of the new design along with some web design tips & tricks for beginners ...

Colours, Fonts, and Resolution ...

As a web designer, one important thing that I try to keep in mind is how a web page looks on different computer monitors at different resolutions. Why? Because I don't know what sort of computer a visitor will be using to view my client's website. For example, a graphic that looks nice and large at 800x600 resolution becomes very tiny at 1280x1024.

After meeting with my client to discuss their website needs, we agreed to keep the colours and fonts consistent with the ones they're currently using on all of their printed promotional material. For example, the decorative “Jokerman” font, as seen in the following snapshot ...

Now, one of the nice things about a webpage designed in Macromedia Flash is its ability to be scaled proportionally within an Internet browser so that it fills the "entire" window. In other words, the bigger the window space, the bigger the webpage. That said, the text and graphics also need to be readable when scaled smaller. To help ensure this, one design trick is to assign colours that help the text "pop" from the background. Light on dark (or vice versa) is a good place to start. Another trick that may seem obvious, but is sometimes overlooked, is to test the design at different resolutions!

Youth Net Hamilton's new website will be compatible with resolutions as low as 800x600 on most CRT monitors, and upwards of 1280x1024 on an LCD screen.

Navigation Features ...

Designing a website in Macromedia Flash provides you with the opportunity to create a unique user interface that encourages visitors to explore (or play with) your website. This is great if you'd like to create a "game" experience, but in our fast-paced world of high-speed Internet and ADHD, most users need to find information ... FAST!

With that in mind, I'm designing the Youth Net Hamilton website so that it can be navigated in a variety of ways, however, all of these methods are common to most other websites. This means that a visitor doesn't need to waste time learning "how" to navigate. They only need to figure out "where" the links take them.

The primary purpose of my client's website is to provide information. Since they have a lot of important information to provide, this content has been divided into categories/sections. Keywords are written in blue to indicate links between related sections. When a visitor moves their mouse over a keyword, it is highlighted by a lighter blue rectangle, as shown in the above snapshot.

Initially, we were going to provide a text link for each section along a top navigation bar. However, after a few additional sections were created, these text links crowded the overall page layout. And so, after considering some other solutions, I designed an icon navigation bar instead.

The following snapshot shows a few of the icons that a visitor can click on to navigate by. Each icon's image (courtesy of the fonts "Webdings" and "Wingdings") relates to its corresponding section's title. The section that is currently displayed is highlighted with a selection box.

Bells and Whistles ...

The "Q-Wiki Fax" feature (shown above) was a suggestion I made after seeing my client's long list of facts/statistics on the health and well-being of youth. There were too many facts for us to list them all on the home page, but they seemed too important not to include. The "Q-Wiki Fax" feature is located along the bottom of the user interface and displays a randomly selected fact when a person visits the Youth Net Hamilton website (Made possible with a little bit of Flash Action Script programming). A visitor can click on the current "Q-Wiki Fax" to view another, or click on the "Facts" navigation icon to view the complete list.

As a web designer, I try to find a balance between the fancy bells & whistles (ex. animation) that make a website visually attractive while still meeting the basic needs of my client. In this case, I'm quite happy with the results.

But getting back to the navigation icons ... How does a visitor know what each one means?

As a visitor rolls their mouse over each navigation icon, the name of the highlighted section appears in a cartoon thought bubble. Some of you are probably wondering, "Why a cartoon thought bubble?" ... Well, when my client first approached me with their project requirements, they asked if I'd be able to design some cartoon characters to decorate the website ... Needless to say, being able to combine my love of cartooning with web designing has made this particular project quite enjoyable!

The cartoon characters are being designed to reflect youth diversity. Like the "Q-Wiki Fax" feature, a character will be randomly selected and displayed for each section visited. The cartoon thought bubbles add a little bit of "interactivity" between the characters and the site's visitors.

Unfortunately, the character designs are currently classified as "top secret" -- but if you visit again soon, you can see their development! For now, please enjoy the following sneak peak of the website's complete user interface ...

If you have any questions or comments about this posting, please feel free to submit it using the "comments" link below, or you can contact me privately via e-mail by using the address provided on my contact page.

Stay TOONed!

- Mike Cope

Click to Continue ...
IN THE WORKS: Youth Net Hamilton Website
(Part 2 - Character Designs)

UPDATED: My Selected Portfolio

As promised, I've started adding all new content to my selected portfolio. These first additions include gag cartoon illustrations, graphic and logo design work, as well as a few "goodies" for students & teachers ...

The currently featured gag cartoons include my W32.Dog.E Virus cartoon that was recently published in Reader's Digest Canada Magazine. On that note, I encourage Canadian readers to pickup a copy of the magazine's August 2006 issue when it's released ... Nudge nudge, wink wink, say no more!

Regarding the Student & Teacher Goodies ... These first additions are just a sample of resources that I designed during my student teaching blocks while enrolled in Brock University's Faculty of Education. All of these files were utilized in high school classroom settings that ranged from Communications Technology (Comm-Tech) to Computer and Information Science courses. The icons in this section currently link directly to the individual PDF documents, however, future updates will include HTML versions, as well as source files and student exemplars.

Speaking of students and teachers ...

Although all of the content on COPETOONS.COM is protected by copyright laws (see disclaimer at bottom of each page), I invite and encourage you to download and freely distribute any of the resources that I specifically provide for students and teachers. This means that you can download, print and/or photocopy these as much as you'd like. The only exception is if your intended use is commercial publication (print or online). In return, all that I ask is that you leave my name/URL credit on any resources and, most importantly, I ask for your feedback -- be it positive or negative! Did you find a resource helpful? How were you able to utilize it? Do you have any suggestions for making it better?

In closing, please keep in mind that all of the sections mentioned above are still under construction. There's plenty more fun still to arrive! In the meantime, your feedback is always welcome :)

Stay TOONed!

- Mike Cope

My inaugural post ...

Congratulations, oh intrepid cartoon explorer! You've just discovered my blog, aptly titled: At the Drawing Board.

Here you will find some "behind the scene" looks at various cartooning and multimedia related projects that I'm currently working on (or have completed) at my drawing board. You will also find highlights to content updates and/or new features available on my website.

Speaking of updates ... Today's a special day at COPETOONS.COM. You see, here in Canada, we traditionally celebrate "Canada Day" on July 1st. Being a Canadian cartoonist, I couldn't think of a better day to launch my website back in the year 2000. And so, when I decided to give my website a fresh look (and create this blog), I decided to officially re-launch on this anniversary.

Starting this next week, I'll be adding all new content to my portfolio section. In the meantime, I invite you to take a look around and test out my new user interface.

Your feedback is always welcome and appreciated. I invite you to submit any questions or critiques via the comments link found at the end of each blog post. Or, if you prefer to submit your message privately, please feel free to contact me via e-mail using the address provided on my contact page.

I hope you enjoy your visit at COPETOONS.COM ...

Stay TOONed!

-Mike Cope