Computer Graphics:
• Graphics are building blocks for developing exciting and informative multimedia documents, presentations and publications.
2. Types of Computer Graphics:
Two types
1. Bitmap Graphics: Bitmaps which are some times called raster images, use colored dots called pixels arranged in a grid to define an image.
Pixels short for picture elements-are dots usually measured in pixels per inch or per centimeter
2. Vector Graphics: Vector graphics consists of lines and curves called vector paths that are defined by Mathematical objects called vectors.
Mathematical Objects: Circle, Square, Rectangle
3. Difference between Vector and Bitmap Graphics.
1. Vector files are usually smaller than the bitmap files because they consist of a series of Mathematical formulas rather than many pixels.
2. Vector images also retain their original definition and perspective when resized. Vector images displayed at different resolutions with out losing the quality.
3. Bitmaps tend to lose definition as they are resized, because the individual dots become visible.
Computer Graphics Programs:
1. Macromedia Flash
2. Macromedia Fire works
3. Adobe Illustrator
4. Photo Shop
5. Maya
6. Corel Draw
7. MS-Power Point
Common Graphics File Formats:
a. JPG (Joint PhotoGraphic Experts Group)
This format used for photographs and other high-color images.
b. GIF (Graphics Interchange Format)
This format is popular for World Wide Web. These are used for cartoons, logos.
c. BMP (Bitmap)
Microsoft graphics file format and is used frequently for bit map images.
d. WBMP (Wireless Bitmap)
This format is used for display images on wireless application protocol pages on mobile devices
e. TIF (Tagged Image File Format)
This format is commonly used in desktop publishing and other applications.
f. PSD (Photoshop)
This format used adobe photoshop graphics program
g. PICT (Apple Macintosh Computers )
This format run on apple macintosh computers
h. PNG (Portable network Graphics)
This format used for graphics on the World Wide Web.
i. WMF ( Windows Metafile Format)
1. Ms-Windows systems
2. Designed in 1990’s
3. May contain both vector and bitmap components.
j. SCT (Scitex Continuous Tone)
1. Raster image file format
2. used for pre-press imaging application
k. EPS ( encapsulated PostScript)
a. It is a standard file format for importing and exporting post script files.
b. Combinatiion of text, graphics and images.
l. DXF( Drawing interchange format/Drawing Exchange format)
CAD data file format.
Common Drawing tools.
1. Line tool
Use to Draw Straight lines.
2. Ellipse or Oval Tool
Use to draw ovals and circles
3. Rectangle Tool
Use to draw rectangles and squares
4. Rounded Rectangle Tool
Use to draw Rounded rectangles and rounded squares
5. Polygon Tool
Use to draw Multisided shapes and such as stars or octagons.
6. Pencil Tool
Use to draw freehand as if using a pencil.
7. Pen Tool
Use to draw precise lines and curves by plotting and connecting points.
8. Brush Tool
Use to draw as if using a paint brush
9. Eraser Tool
Use to remove objects parts of Objects from drawing.
10. Text Tool
Use to insert text in drawing.
11. Pointer or Selection tool.
Use to select objects in drawing.
Resolution.
Resolution is the quality or sharpness of an image. Usually measured in pixels per inch or per centimeter.
Pixel- short for picture elements- are dots used to define some images on a
Computer screen.
Drawing area
Drawing area is the area with in the document window where you draw and edit
The image. Some Programs refers to the drawing area as the canvas or stage.
Active File
In Graphics Program you can open more than one file at a time, although only one file is active. The Active file is the one in which you are currently working.
Objects.
An Object is any element such as a shape or line.
You use drawing tools to insert objects in the document window.
Stroke option.
Stroke which is some times called weight or tip size usually measured
In points. There are 72 Points in inch.
Stroke style may be specified by type, category or effect. For Example you may be choose a solid line, a dotted line, or a stroke that looks as if it were created using a heavy watercolor brush, a graphite pencil or a texture airbrush.
Panel
Which are elements similar to dialogue boxes that you can keep open
on your screen while you work.
Swatch
Most color palettes are a series of colored boxes that may be called swatch.
Toggles Command
Which means they are either on or off. Each time you select the command, it switches from on to off, or off to on.
ZOOM
Zooming increases or decreases the magnification of the drawing on your screen by a percentage of its original size.
PAN
Pan in the document window to shift the display you can see a different part of the drawing area.
View
The view is the way your file is displayed on the screen. With the view to get a different look at drawing.
Hexadecimal code in the color palette
Hexadecimal codes are standard alphanumeric values used to identify colors based on their components of red, green and blue.
Selection Handles
Small rectangles called selection handles are displayed around the shape.
These handles indicate that the shape is selected and you can drag one to
Resize the shape.
CHAPTER-2
(IIMPORTING AND EXPORTING GRAPHICS)
Import:
To use data produced by another application.
The ability to import data is very important in software applications because it means that one application can complement another.
Many programs, are designed to be able to import graphics in a variety of formats.
Import the pictures by using Scanner, Digital Camera and Clip Art.
Exporting,
• Exporting converts a copy of the file to a different format, while leaving
the original file intact.
• which refers to the ability of one application to format data for another application.
Clip art :
Which are images already saved in a graphics file format.
Many clip-art packages are available, some general and others specialized for a particular field.
Most clip-art packages provide the illustrations in several file formats so that you can insert them into various word-processing systems.
Example : www.Clip-art.com
www.3dflags.com
www.photos.com
Installation
In computer terminology, install usually refers to putting software on a computer (install the software), or adding hardware components to your computer (install the hardware).
To connect or set in position and prepare for use
Installing the software that comes with the device and making sure the device driver works.
driver
A program that controls a device. Every device, whether it be a printer, disk drive, or keyboard, must have a driver program.
Device Driver is a software program that enables your computer to communicate with hard ware device.
Digital Camera
Digital camera makes it easy to take original photo graphs that you can transfer as files to your computer.
Cameras can store pictures in format like JPEG or TIFF.
Most digital cameras come with cables for connecting to USB, serial, or other external ports on your computer.
The big advantage of digital cameras is that making photos is both inexpensive and fast because there is no film processing.
Kodak developed the Kodak PhotoCD format, which has become the de facto standard for storing digital photographs.
Most digital cameras use CCDs(Charge Couple Devices) to capture images, though some of the newer less expensive cameras use CMOS(Complimentary metal oxide Semiconductor) chips instead.
Features:
1. ZOOM
2. Auto Focus
3. Automatic Flash.
Resolution Range: 640 * 480 pixels to upwards of 1600 * 1200 pixels.
Scanner
Scanner is a hardware device that uses a light to capture a digital version of a picture which is then stored as a graphics file on your computer.
Types of scanners:
1. Photo scanner
2. Flatbed scanner
3. Handheld Scanner
TWAIN is the software language that is used to control the scanners;
You can probably import the image directly into the program of your choice.
File Format
File format is the way the data in file is stored.
Two types.
1. Native file format.
2. Compatible file format.
Native File Format
The default file format for particular program is called native file format.
Compatible Format
Is a one that a program can open, read and save even if it is not the default.
Optimization.
Optimizing Involves selecting options for the best combination of file size and Quality, depending on the Export format you select.
Optimizing Options.
1. Color palette
2. Color Depth
3. Dither
4. Loss Settings
Common Color Palettes
In Computer Graphics, a palette is either a given, finite set of colors for the management of digital images (that is, a color palette)
1. Adaptive - A custom palette that includes the actual
Colors that are in the file.
2. Web snap adaptive – An adaptive palette that converts actual colors to web safe colors.
3. Web 216- P palette of 216 web safe colors
4. Exact – It can contain no more than 256 colors and automatically converts to an adaptive palette when more than 256 colors present.
5. System- Palettes of 256 colors that are defined by the current computer system
6. Grayscale – A palette of up to 256 shades of gray.
7. Black & White – Two color palette consisting of black & white.
8. Uniform – A palette based on the RGB color system.
9. Custom – A palette that has been modified or imported from another source
Web safe color
Which are colors that are displayed in the same way in all web browsers.
Color Depth
Refers to the number of colors in an image or on a screen
Dithering
It is a process a program uses to approximate colors that are not part of its color palette.
Loss setting
Loss setting is used to control Compression. Increase the loss setting
to allow more compression which results in a smaller file but lower Quality.
Smoothing
Smoothing is the degree of sharpness in edges.
Wizard
A Wizard is a series of pages or dialog boxes that step you through a process that may otherwise be confusing or complicated.
Downloading
Downloading Copies the file from the web site to your computer.
Search site
A search site is a web site that helps you to locate a web page even if you
Don’t know the pages address.
Examples: www.google.com,www.yahoo.com, www.bing.com, www.altavista.com
CHAPTER -3
(MODIFYING GRAPHICS)
Basic principles include in modify graphics
Five basic principles are
1. Proportion
This describes the size and location of one object in relation to other objects in the image.
2. Balance
Which refers to the visual weight of objects and the way they are arranged.
3. Contrast
Which refer to the juxta position of different elements in order to create visual interest.
4. Variety
To create visual interest by incorporating different elements in an image.
5. Emphasis
Which is used to highlight or focus attention on a particular
aspect of an image.
Bounding box
Bounding box is a rectangle shape with selection handles displayed around the object.
Once object is selected, you can make basic changes such as moving it or resizing it.
Bitmap Image
A bitmap is made of dots – or pixels – you can make some changes to the image by changing the dots themselves.
You can change the colors of bitmaps by changing the colors of the dots.
You can erase the dots to remove parts of the image.
Tools used to work with bitmaps
1. Marquee
Use the Marquee to select rectangular area in a bitmap
2. Oval Marquee
Use the oval marquee to select an oval area in a bitmap.
3. Lasso
Use the lasso to select a free form area
4. Polygon Lasso
Use the polygon lasso to select straight sided free form area.
5. Magic wand
Use the magic wand to select pixels based on color
6. Brush
Use the brush tool to create new bitmap object.
7. Pencil
Use the pencil tool to draw a new bitmap object
8. Paint Bucket
Use the Paint bucket tool to fill selected areas with color.
9. Eraser
Use the eraser to remove pixels from a bitmap image
Gradient tool
That you can use to fill an area with a gradient color. Gradient color shades gradually from a dark hue to light hue.
Eyedropper Tool
You can use the eye dropper tool to make any color displayed on screen the current stroke or fill color.
Position
In some programs, if you want to position the object in a precise location you can set horizontal(X) and vertical (Y) coordinates.
Coordinates are specific points laid out in an invisible grid in the drawing area.
The grid starts in the top left corner, with coordinates of 0, 0. As you move an object to the right, the X coordinates increases. As you move down, the Y coordinates increases.
Align Object
An Object to adjust its position horizontally and vertically relative to the top, bottom, left and right of the drawing area.
Distribute Object
Distributing objects mean adjusts space between currently selected areas in the drawing.
Transform:
It is a term used to describe changes to the characteristics of an object or selection.
Transform ways
1. Scale
You can resize an object to make it larger or smaller.
2. Skew
You can skew an object to slant it along its horizontal or
Vertical axis
3. Distort
With distort Object you change its Height / Width with out
Maintaining the original proportions
4. Rotate and Flip
Flip an object horizontally or vertically to reverse the image
From left to right or top to bottom.
Layers:
Layers are used for creating complex images, animations and certain special effects.
Group and stack objects.
You can also group multiple objects.
Grouped objects can be selected and modified as one unit.
Many graphics also provide a tool with a name such as Sub Selection or Group Selection that allows you to select one or more items in a group without ungrouping all objects
.
Clip Board
• A temporary storage area in your computers memory.
The clipboard is a software facility that can be used for short-term data storage and/or data transfer between documents or applications, via copy and paste operations.
It is most commonly a part of a GUI environment and is usually implemented as an anonymous, temporary block of memory that can be accessed from most or all programs within the environment via defined programming interfaces
Cropping
Crop - cut short
• Cropping cuts out the portions of a file that you don’t want.
CHAPTER-4.
(ADDING TEXT TO GRAPHICS.)
Text block
To create a text block, and then key the text using your computer
Key board.
A selected text block has a bounding box and handles, similar to other selected
Objects in a graphics file.
You can resize, move, duplicate and otherwise modify a text block using many
of the same commands.
Types of Text blocks available
Two types
1. Fixed width text block.
2. Exandable text block.
Fixed-width text block
Here you specify the block size before you begin the keying text.
As you key text, it wraps within the block.
WRAP
Which means that when text reaches end of one line with in the text block it?
Moves Automatically to the beginning of the next line
Expandable text block
Text is entered on a single line which increases in width to accommodate as many characters as you enter.
Text edit
Move the insertion point within a text block and to make changes to the text. To position the insertion point in the text you can make changes.
Common text editing key strokes
• Up arrow, Down arrow, Left arrow , Right arrow
• Backspace, Delete, Enter AND Insert.
Spelling Checker
Spelling checker checks all text in the file. When the checker identifies a
Misspelled word, it highlights it.
Character Formatting
Character formatting determines the appearance and spacing of text characters.
Character formatting options:
1. Change the design
2. Size
3. Style of text.
Font formatting
Change the look of text using font formatting
Font
A font is the design of a set of characters including letters, numbers and
Symbols.
Font formatting Options
• you can change the font it self
• font size
• font style
Basic Types of Fonts
Two basic types:
1. Serif fonts
2. Sans Serif fonts
Serif Fonts:
Have short lines and curlicues at the ends of the lines that make
Up each character.
Serif fonts are generally easy to read and so are often used for lengthy paragraphs, reports and letters
Example: Times New roman, Garamond and Century
Sans Serif Fonts:
Have straight lines with out serifs and are often used for
Head lines and titles.
Examples: Arial, Impact and Tahoma.
Font-size
Font sizes are measured in points according to the height of an uppercase letter in the font set.
There are 72 Points in an inch.
Font style
Font Style is the slant and weight of characters in a font set such as bold and italic.
Font styles are used to call attention to the text.
Kerning
Kerning controls the space between pairs of characters.
Usually spacing is controlled by the font set. But sometimes when certain characters such as T and A or Y and O are next to each other you can clearly see uneven spacing.
This uneven space controlled by the kerning.
Kerning is measured as percentage of the default –or—normal—spacing.
The normal spacing setting is usually 0. To increase the spacing increase the kerning setting. To Decrease the spacing decrease the kerning setting.
Leading
Leading is the amount of space between the baseline –bottom –of one line of text and the baseline of the next line.
Leading is usually determined by the font.
Leading may be measured in pixels, points or as a percentage.
Two Text Directions
1. Orientation
2. Text flow
Orientation
Controls whether the text is displayed horizontally across the width of the block. Or vertically from the top to the bottom of the block
Text flow
Text flow determines whether text can be read from left to right or right to left.
Text Alignment
Alignment controls the position of text in relation to the edges of the text block.
Horizontally oriented text can be aligned with either the left or right edges or justified.
Justified means the space between words is adjusted so that the text aligns with both the left and right edges
Ttransform text
You can transform text block by scale, skew, distort, rotate and flip.
CHAPTER 5
(CREATING SPECIAL EFFECTS)
Hue
Color affects the way people view an image more than any other
Graphics effect. Color, also called Hue.
Color System
A Color system defines standard colors. It may also be called a color model.
Color Bar
A Color Bar displays a Spectrum of colors across a Rectangle from Left to right.
Color systems used in Graphics Programs.
The two main color systems for use in graphics programs are the RGB
Model, HSL System and CMY Model.
RGB Model : RGB( Red ,Green and Blue) System creates colors by combining
Different values of red, green and blue.
RGB Model is mostly used when graphics are to be displayed on devices that
Uses light to display colors, such as computer monitors.
CMY Model : CMY( Cyan , Magenta, Yellow) System creates colors by
Combining percentages of cyan, magenta and yellow
CMY Model used most often for drawings that are to be printed, either on a local
Printer or by a printing press.
HSL System: HSL (Hue, Saturation, Lightness) and Grayscale, which uses
Percentages of black to create shades of gray.
This color system allows you to key hexadecimal values to mix colors that will
Display the same way on all computer systems.
Use this color system when preparing graphics for web pages.
Options for creating color Effects.
1. Textures
2.Gradients
3.Patterns
Textures: Can be applied to fills or strokes to make an object look as if it is painted on a textured surface.
Patterns: Patterns are bitmap graphics applied as a fill
Gradients: Gradients are a type of patterns that blends colors to create different effects.
Tools for applying color correction effects to vector and bitmap Images
1. Value
2. Brightness
3. Contrast
4. Saturation
Opacity
Opacity controls the amount of transparency in a color. It is measured as a percentage, with 100% being completely opaque and 0% being completely transparent.
Bevel
Bevels also give an object a raised appearance. You can apply an inner
Bevel, which adds the effect with in the edges of the object, or an outer bevel,
Which adds the effect outside the edges.
Embossing
With Embossing make an object appear to be pressed into the drawing
Area.
Use of Shadows and Glows Effects.
Shadows and glows are effects that let you add depth ,dimension, and highlights to objects.
Use of sharpen and blur effects.
Use the sharpen and blur effects to adjust the focus or sharpness of an
image. The sharpen effect brings a blurred image into focus and the blur effect
Lessens the focus.
Define Mask? Explain different types of masks.
Answer: the mask Effects hides or accentuates a specific portion of an image.
There are two basic kinds of masks: Vector Masks and Bitmap Masks
Vector Mask: you use a vector graphic to define the shape of the mask. You can use any vector object, such as rectangle, polygon, or ellipse.
Vector masks are also called clipping masks in some programs.
Bitmap Masks: Bitmap masks are sometimes called layer masks Because they overlap and obscure underlying pixels.
6. Creating Animations
Animation: Graphics with motion called animation or movie.
Stage: where you place the content for the animation.
• Animation Programs include a timeline that holds frames for the animation.
Flash MX groups its features in panels (small floating windows)
Flash MX also includes a special panel called the Property inspector that appears below the stage by default.
The property inspector displays settings you can use to alter any object selected on the stage.
In graphics program tools used to create shapes, lines and text objects on the stage and format them with stroke and fill options just as in graphics program.
Frames: The frame holds the content the movie displays or plays at that point in time. So, to increase length of your movie, you have to add more frames. If you delete frames, you decrease the animations length.
Two types of frames.
1. Regular frames: simply hold content.
2. Key frames: Provides greater power. You can use a key frame to specify a change in the animation.
• You can delete key frames using a command such as Clear Key Frame.
Animation Program creates movies at 12 fps (frames per second) by default, inserting a key frame and changes every 12 frames results in a change in the action every second. A project with 60 frames results in a five second movie.
Play head: The vertical red marker in the timeline. To see how the animation progresses.
Path Animation: you draw a route or motion path the object should follow.
Here some of the actions you can perform by working with frames.
• Change the duration of the animation sequence
• Select multiple frames on layer
• Select multiple frames on multiple adjacent layers
• Move selected frames
• Copy selected frames
• Insert blank frames.
Onion Skin: This feature that enables you to view the contents of multiple frames on screen at once.
Two types of tweening
Shape Tween
A Shape Tween is a type of animation that is placed in a Layer and enables you to
Animate an objects Shape from one Shape to another.
Motion Tween
Motion Tweens is form of animation that enables you move an object around and change it's properties
Motion Guide Layers
A Motion Guide layer is similar to a Motion Tween but the guide layer gives you more flexibility in that the animation will follow the line drawn in the Guide Layer. The guide is not visible in the final Movie:
Symbols in Flash
Any object that is stored in your Flash Library is called a Symbol. Any time you need to repeatedly use an object such as a Button or a Graphic image you use a Symbol. A Symbol only downloads once no matter how many times you use it. In that way it is like a template. There are only three types of Symbol: Button, Graphic Symbol, and Movie Clip
7) ENHANCING ANIMATIONS.
Import sound files in two formats.
• WAV
• MP3
WAV can have the highest sound Quality, Larger in sound file.
You can use recording or conversion software that uses compression and results in a more compact audio file format called MP3.
MP3 files sound as good as wave files.
Microphone in or line in jack is used for recording voice or sound.
Sound-editing software can manipulate the wave forms to change a sound file in a variety forms.
Interactive controls allow the viewer or start a playback or exit the movie, among other functions.
Interactive control requires a script or program that carries out the specific action for the control.
Button: May be as simple as rectangle or oval formatted with an appropriate fill.
Button had three rollover states.
• Up
• Over
• Down
A button is a symbol that contains special frames for different button states, such as when the user’s mouse pointer is over the button or when the user clicks the button.
Flash rollover buttons are buttons that change appearance when a mouse hovers over them, and when they are clicked on.
Generally rollover buttons change appearances in both instances; however they can be made to do one or the other.
Action: Compact programming code that defines interactivity.
The most common scripting languages today is JavaScript. Flash MX and Adobe Programs support similar scripting language called Action Script.
Compression: Compression is the reduction in size of data in order to save space or transmission time.
Question: Why are MP3 files smaller than WAVE files for recordings of comparable lengths?
Streaming: Playing it while downloading.
Three key terms related to analyzing movie files are
• Bandwidth or connection speed,
• Play Back Rate and
• Streaming Rate
Bandwidth or connection speed: is the speed at which a network or modem transfers data.
Play back rate: is how quickly the computer plays the frames of the movie.
Streaming Rate: is how quickly the network or modem can download frames of the movie.
Macromedia Flash MX you can use the bandwidth profiler and show streaming options.
Warm Colors:
The phrase used to describe any color that is vivid or bold in nature. Warm colors are those that tend to advance in space and can be overwhelming.
Examples of warm colors include red and orange (think exciting fire and volcanoes).
Cool Colors:
The phrase used to describe any color that is calm or soothing in nature. Cool colors are not overpowering and tend to recede in space.
Examples of cool colors include white, gray, blue and green (think calming blue waters)
WAP(Wireless application Protocol)
Short for the Wireless Application Protocol, a secure specification that allows users to access information instantly via handheld wireless devices such as mobile phones, pagers, two-way radios, smart phones and communicators.
WAP supports most wireless networks. These include CDPD, CDMA, GSM, PDC, PHS, TDMA, FLEX, ReFLEX, iDEN, TETRA, DECT, DataTAC, and Mobitex.
WAP is supported by all operating systems. Ones specifically engineered for handheld devices include PalmOS, EPOC, Windows CE, FLEXOS, OS/9, and Java OS.
• WAP is the set of rules governing the transmission and reception of data by computer applications on or via wireless devices like mobile phones.
WAP allows wireless devices to view specifically designed pages from the Internet using only plain text and very simple black-and-white pictures.
WAP is a standardized technology for cross-platform, distributed computing very similar to the Internet's combination of Hypertext Markup Language (HTML) and Hypertext Transfer Protocol (HTTP), except that it is optimized for:
• low-display capability
• low-memory
• Low-band width devices, such as personal digital assistants (PDAs), wireless phones, and pagers.
WAP is designed to scale across a broad range of wireless networks like GSM, IS-95, IS-136, and PDC.
Wireless Bitmaps
A Wireless Bitmap (WBMP) is a graphic image format for use when sending Web content to handheld wireless devices.
Windows Sound Recorder
You can use Sound Recorder to record a sound and save it as an audio file on your computer. You can record sound from different audio devices, such as a microphone that's plugged into the sound card on your computer.
The types of audio input sources you can record from depend on the audio devices you have and the input sources on your sound card.
Windows Media format
