Archive for the ‘Graphics’ Category

Computer Graphics – Assignment 1

January 22, 2009 2 comments

I’ve long thought that Computer Graphics has been the missing piece in my Web design toolbox. It always seemed that the best designs had good graphics: even sites with very few or subtle graphics have a certain quality to them that I was never able to really replicate just using CSS and my hacked together images. I can do some basic work in a tool like Paintshop Pro, and a few years ago when I found Xara Xtreme, a real time vector graphics tool, I was able to do better. Still I wasn’t happy with my abilities: I always thought that if I wanted to move to the next level, what I really needed was some Computer Graphics training.

Now with the vector graphics orientation of WPF, Silverlight, Expression Blend, and Expression Design, and as both Designer and Developer, I truly feel that my future success in this area depends on having at least rudimentary knowledge of graphics and design principles.  Towards this end, I enrolled in Computer Graphics I at the local community college for the current semester.  I thought that since I was doing this for .Net purposes, it would be interesting to share my experiences and (hopefully) my progress.

Computer Graphics I

The class is primarily a lab class, broken down into three sections that cover three of the major design tools.  We are currently learning Adobe Illustrator.  Later we will learn Photoshop followed by a tool whose name escapes me.  I discussed Expression Design with the instructor, but he had never heard of it, so I spent some time explaining WPF and why Vector art is becoming important to Windows developers.  He seemed genuinely intrigued by the concepts so I have promised to show him some of the software.

There is a text book, which seems to cover the basic concepts such as Composition, Alignment, Grouping, etc.  I don’t consider myself very artistic, but I have to say that most of the material seems pretty intuitive.  And, while frustrating at time, Illustrator has been easy to learn because I can relate much of it to the Expression tools.  Something I have been pleasantly surprised by is that the Expression tools are better than Illustrator.  Illustrator seems to hide many of it’s features, and while it is vector oriented, most of the changes you make are not real time.  All in all, it just feels clunky to me.

Assignment: Self Portrait

For the first assignment we were to use a digital image as a base and generate a self portrait.  The purpose of the exercise was to get comfortable and familiar with Illustrator and its tooling. It was very awkward at first, but by the end of it I felt comfortable with Bezier lines for the first time ever.  Other things like Anchor points and path altering are also starting to come into focus.

Here is the original image:

The original image

The original image

And here is my artwork:

My Illustrator generated artwork

My Illustrator generated artwork

I think this turned out pretty well, all things considered.  Color matching and things like that were not part of the assignment, but I learned a lot about how to construct a graphic from many parts.  According to the instructor, Layers are not very important in Illustrator, but are very important in Photoshop.  Even so, I found the use of layering and grouping and naming parts to be invaluable even in this small project.  When he reviewed my file he said he could see a very analytical approach to design because of the way I had everything laid out and precisely named.  Personally, I don’t see how you could get by doing it differently, but maybe that’s just the developer in me coming out.

I’ll keep posting updates throughout the semester.  I’m curious to see how this will add to my total WPF skill set.

Categories: Graphics