computeralisasi art design 3D from "ASTO JIWO"2011

Computer Art Education

Computers are being used in various educational fields. People consider them fine mediums to impart knowledge. Computers are successfully applied in art education. There are many art institutes related to fashion, culinary skills, design and media arts that totally depend on the use of computers. Instructors consider them to be convenient, economical and interesting mediums.

There are colleges and institutes that offer courses to introduce students to computer applications in the field of art education. They emphasize on the use of the Internet as a communication and learning tool. Internet is also considered a creative art medium and a professional resource. Computer art education helps them to explore the use of digital-imaging hardware and software for individual creative expression. There are courses that teach ways to integrate the Internet and computer technology into school art programs.

Computer art education reflects the conviction that the computer is a tool that requires creative thinking and purpose in order to use it effectively. At the completion of the course, pre-service art education students are able to use digital imaging software and hardware, to create 2-D computer art and graphics in their chosen fields.

Students learn to incorporate text and graphics in electronic documents, for creative and instructional purposes. They produce computer animation and multimedia documents with the use of application software. The software is used as a communication tool, a creative medium and a professional resource.

Students learn applications of digital technologies in the field of art and art education. The technology can also be used for aesthetic, ethical and legal issues related to the use of digital technology in the visual arts and art education. There are a variety of instructional methods including, lectures, demonstrations, mutual learning and projects. Computer art education enables students to get actively involved in the learning process.

The Genesis of Computer Art-FORTRAN (Backus) a Computer Art Medium Creates a Mosaic Mona Lisa

Where did computer art, computer graphics and computer animation begin?

Written communication became sharable and pervasive once stone etchings were replaced with the mobility of paper and ink. Similarly once computer languages advanced from machine or assembly code to third generation computer languages, only then did computer output advance from simple alphanumerical (maybe mosaic) printouts to graphics and images with smooth curves and realism.

Computer graphical output got its humble start when alphanumeric characters hammered on TTY and line printers to represent X-Y graphs and even mosaic images. It was crude, but allowed for a more effective analysis of mathematical and scientific solutions. Computer programming languages like FORTRAN and BASIC made it easier to develop and program printers, plotters and CRT screens to display and print graphics and ultimately images.

The FORTRAN programming language - a personal and historic short review.

FORTRAN programming as an Art Medium?

So it was possible to create an alphanumeric printout picture of the famous Mona Lisa using FORTRAN print statements. This image of the Mona Lisa was done by printing and over-printing standard alphanumeric characters creating a mosaic art piece to form an image of that famous Leonardo da Vinci painting. Step back from this computer printout and you viewed a simple replica of Leonardo da Vinci's Mona Lisa.

Accomplishing this rudimentary computer art would be hours and days of tedious work involving the following steps:

1) You would need to take a copy of the original image and a grid (mapping to the 133 character width of a standard computer printout page) on a piece of transparency.

2) Place the grid transparency on top of the image and then fill in the grid cells over the image with alphanumeric characters that will depict a mosaic of the original image.

3) Highlight those grid cells that will be overprinted (bold type) to create shade and texture matching the original image.

4) Now you take each line of the grid and code it using FORTRAN print statements.

5) Like a brush to canvas the computer printout image of Mona Lisa will take form after many days of coding.

For a completed version of this process and a resulting computer mosaic of the Mona Lisa check out the Pisaca Web Albums images at: http://picasaweb.google.com/carl.chesal/MonaLisaComputerArtFortran

The search has begun for access to an 80 column punch card reader.

The FORTRAN code for the Mona Lisa Mosaic is on original 90-column punch cards. Getting access to an 80-column card reader could facilitate moving the Mona Lisa FORTRAN code from its analog state to a digital version. Using an online editor, I could once again deploy the power of FORTRAN to print copies of 'computer mosaic' Mona Lisa. Then 'Mosaic Mona' would be available for the world to enjoy.

The Art of Computer Programming

When it comes to programming, then one statement attributed to Confucius will always remain true - I do and I understand. While sitting in a classroom and learning the ideal way to program is obviously helpful, reading about computer programming concepts and trying out the real thing are 2 different ways of doing the same thing. What do you do then to quickly get yourself up and running to working with code?

The web is filled with clutter and some of this clutter are code snippets. While this may seem to be a bad idea, especially with all the wrong snippets of code lying all over the web, but immersing yourself into this world will give you plenty of ideas on how to solve programming challenges and get you up and running on some of the major programming languages, the common being JavaScript. JavaScript is one of the easiest languages to learn and the net is filled with client-side web scripts that can be accessed by simply accessing any web page, right-clicking and selecting "view source code". Check out ways that other programmers have used to resolve a particular programming challenge or how to do a certain task.

Soliciting feedback from people who already have more knowledge about a computer programming language will also go a long way in helping you think along fresh lines or think about old ideas in new ways. How though, do you solicit for feedback? One way is to join a strong helpful community. These communities are all over the web. One good community is the Ruby-talk mailing list for Ruby language developers. Here you get to learn the culture, best practices for a particular language and you get to have your questions answered by experts.

Another way is to pair with another programmer and learn the ropes. This is fashionable practice that has gained respect through the rise of the agile development computer programming methodology where 2 people get to work together on a project. The potential value of pair programming is indisputably superior when compared to programming on your own.

Computer programming also requires following predefined steps if you are to avoid typing time-consuming and tedious code that will not do what it's supposed to do. Programmers start by prototyping their programs. This involves creating the program interface with all the windows, dialog boxes and pull-down menus without adding action to them. The next step involves choosing a programming language that will be easiest to write the program. The last step is to create mock-up instructions known as pseudocode that describe exactly how the program will work. Pseudocode is thus a valuable tool that you can use to outline the structure of your program and spot flaws in your logic. Now you are ready to get down to writing code and seeing it work.

Computer Art Software 101, What Does What

Computer Art 101. Introductory Basics.

Before you get started with computer graphics, you may want to take a good look at the basics under each and every image. I wish someone had shared these issues with me years ago when I was starting. Below is a list is what we will cover here. I suggest you read and experience the following before going on to our other segments and lessons. Here, we will cover;

What is a pixel?

Image size

Resolution

File Size

File Types

What is a Mega Pixel?

What is a pixel?

All images you see on the internet are made up of pixels. A pixel is defined as, "the smallest picture element." You can think of a pixel as one of many little squares in your picture.

On the right you see two images. I've zoomed in on the image so that you can see the little squares that make up the image. These little squares are called pixels. Each one has a different color.

Each pixel can be one of 16,700,000 colors. This is the number of colors that the human eye can see.

Pixels are coded with color. Each color is represented by a number. These are called RGB values. Red, Green and Blue. To come up with 16.7 million colors, RGB values use 255 numbers to assign a value.

This would mean, no red, no green, no blue. This is the absence of color, or perfect Black.

Example

Red = 0

Green = 0

Blue = 0

This would mean turn the red all the way up, turn the green all of the way up, and turn the blue all of the way up. This color would be White, the full presence of red, green and blue. Example

Red = 255

Green = 255

Blue = 255

There are many systems that assign colors to web pages. Another numbering system would be called Hexadecimal Values.

Hexadecimal values are made up of a base 16 system. We are used to a base 10 system.

Base 10 means we have 0 , 1,2,3,4,5,6,7,8,9.

Nine is the highest value.

Hexadecimals use 16 numbers, but because there are no numbers higher than 9, this systems uses letters after running out of numbers.

Base 16 means the following values are used;

0,1,2,3,4,5,6,7,8,9, a,b,c,d,e,f

In this system, F is the highest value. It would be as strong and powerful as 9 in the base ten system.

Hexadecimal values are used to assign colors to web pages and images. The values are displayed using six values. A pair of values for Red, a pair of values for Green and a pair of values for Blue. The total value would look like this;

00 00 00 or FF FF FF

00 00 00

would mean, no red, no green no blue, this would be perfect Black.

FF FF FF

would mean full red, full green, and full blue, the would represent perfect white.
So Who Cares About Numbers and Color Values?

Millions of graphic designers do. They must keep their colors consistent. If you look at the background color of this web page, notice that it is green. But there are about 300,000 shades of green. Which green is the color of this web page?

This web page color value is 33 99 99. I use this one color for many of my web page background colors.

More importantly, think of your favorite cartoon characters. They must be the same color for every show. The people that draw and animate the characters all know the color values of each character to that the character can be the same color in each episode.
Image Size. How Big is the Image?

Most of the time, an image is measured in inches, or pixels. An image may be 5 inches wide by 5 inches tall. Inches are usually used for designers that are working on images for print purposes. If an image is going into a newspaper or magazine, the designer will work in inches.

If a designer is a web site designer, they will set up the image size in pixels. For example, they may make an image 400 pixels wide and 400 pixels high.
Resolution

In almost every graphics application, when you create a new file, the program ask you what resolution would you like to use. Let's talk about resolution.

Resolution means, "How many pixels will be in each inch of the image." There are two basic standards used to set resolution. The two basic standards are based upon where will the image be used. Will it be used in print (newspaper, magazine, poster, brochure), or will it be used in web development (web site pages).

Here is the basic rule of thumb. If you are working on a print job, set resolution at 300 dpi (dots per linier inch). This means that for every inch in the image, there are 300 little squares, of course those squares are called pixels.

The more pixels per inch, the more defined the image is.

When working on an image for a web page, the rule of thumb is 72 dpi ( dots per linier inch).

72 dpi is not as defined as 300 dpi ( in other words not as clear, not as beautiful).

The thing is, the higher the dpi, the larger the "file size" of the image. So now, lets talk about file size.
File Size, How much space on your computer will it take to save and store the image?

Think about this. If you have an image that is 5 inches by 5 inches at 300 dots per inch (dpi), then, your computer has to look at the color values (rgb or hexadecimal) and assign that color to each and every pixel in the picture. If you set dpi to 72, then, your computer has to do one third of the work.

When I put images on my website, I try to keep the file size below 50 k (kilobytes). This lets the image load quickly on your machine when you visit my website.

If I put images on my web site that are bigger than this, then the images load more slowly and some users get sick of waiting and leave my web site because the images where loading so slowly.
File Types

File types are mathematical formulas that help the computer read the colors in the file. There are hundreds of file types. I'm only going to talk about four of them. I would say that these are the ones to pay attention to.
Tiff Tagged Image File Format
Gif Graphic interchange format
Jpeg Joint Photographer's Expert Group
Png Portable Network Graphic

In every graphics application, when you save your file, the program ask you, "What file format would you like to save this as?"

In the land of print work, most designers will use the Tiff file format. They will create a Tiff file and save it at 300dpi. The Tiff file is a big file format. These files can be well above 120 megabytes ( that's more than 100 diskettes of information in the image).

This will make a beautiful image, but if you put that on the internet, it is going to load real, real slow. It's too big for the net.

In the land of web work, designers will use one of 3 file formats. The Gif, the Jpeg, or the Png. This are the only file formats you can put on a web page. Internet Explorer, Netscape and other web browsers don't understand the math behind other file formats.
Below are the very basic differences between the three file formats.
The Gif File

You know that the eye can see 16.7 million colors. Well if you take a picture with all of those colors and you want to put it on the internet, the file size will be huge.

To lower the file size, the Gif file only uses 256 total colors. The image doesn't look as good, but the file size is very low.
The Jpeg File

The Jpeg file uses 16.7 million colors, but to make the image small enough to get on a web page, the Jpeg file automatically throws millions of colors away to make the file size smaller. This is called , "lossy compression."

If you have a digital camera, and you are serious about your images, then save your files in your camera as a Tiff or Raw Data File. Then if you need to put the image on the net, convert the image to a Jpeg or Gif.
The Png File

The Png file is kind of like a gif jpeg combo. You can have a png file that uses 256 colors, similar to a Gif file, or you can create a png file that uses 16.7 million colors.

The Png file is from Macro Media. If you use Fireworks, and image manipulation program from Macro Media, when you open a new file, by default, it is a png file.

Png files are usually much larger than gifs or jpegs. Personally, I don't use them. That doesn't mean that you shouldn't. I just don't use them.
For You Digital Camera Users, What is a Mega Pixel?

For those of you that use digital cameras, and that is about everyone these days, you will constantly here the term ,"mega pixel." What the heck is a mega pixel?

Mega Pixel means one million pixels. If you have a camera that is a 3 mega pixel camera, that means that when you take a picture, your camera is bringing in 3 million pixels into your camera. If you have a 5 mega pixel camera, when you take a picture, your camera is bringing in 5 million pixels.

The more mega pixels, the better the image looks. Professional photographers have cameras that bring in 16 million pixels. These cameras cost a lot of money.

Most cameras costing 500 dollars will give you about 6 mega pixels or more.
Summary.

Above is a basic discussion of color, file size, file types and pixels. I perform presentations and teacher in-services that go in depth into each an every concept.

I wish that someone had sat me down and shared these concepts with me when I started working with computer graphics some 15 years ago.

computer art main page

sillybilly main page

contact us

call us: 415-839-0096

Dartmouth College and Ohio State Graduate, Bill Dallas Lewis has been writing and illustrating children's literature for more than fifteen years. You can see his work at sillybilly.com. Now, he tutors audlt computer graphics students in Flash, PhotoShop, DreamWeaver, html, css and Illustrator all over the USA and Canada via Web and Video Conferencing.