Introduction to Computer Graphics Chapter 1

Agenda Definition Environment for Interactive Graphics Computer Graphics Applications Classification of applications Image Types 2

Definition (1) Computer Graphics is an environment that allows to create, store and manipulate models and images of objects using interactive input devices. These models come from a diverse set of fields, and include physical, mathematical, engineering, architectural, and conceptual structures. 3

Definition (2) Manipulation includes adding, deleting and updating objects. Model is a simplified representation of the reality. Modeling is a process that permits to transform real-world facts into objects that are understandable by the computer. 4

Computer graphics is largely interactive: the user controls the contents, structure, and appearance of objects and of their displayed images by using input devices, such as a keyboard, mouse, or touch- sensitive panel on the screen. Application Model Application Program Graphics system CPU Input Devices Output Devices Users 5 Definition (3)

Environment for Interactive Graphics Computer Graphics (like any other computer system) has two aspects: Hardware aspect and Software aspect. At the hardware level, a computer receives input from interaction devices, and outputs images to a display device. 6

Environment for Interactive Graphics The software has three components: The application model The application program The graphics system 7

Application Model (1) The application model represents data or objects to be pictured on the screen. Models typically store descriptions of primitives (points, lines, circles and polygons in 2D and 3D) that define the shape of components of the object, object attributes such as line style, color, thickness, and connectivity relationships and positioning data that describe how the components fit together. 8

Application Model (2) Some graphics systems support some geometric models: lines, rectangles, polygons, circles, ellipses, and text in 2D, and polygons. Advanced graphics systems support additional primitives, including curves and surfaces defined by polynomials of higher degrees. 9

Application Program The application program creates, stores into and retrieves data from the first component, that is, application model. It also handles user input and sends views to the third component (Graphics system). 10

Graphics System The graphics system contains both a detailed geometric description of what is to be viewed and the attributes describing how the objects should appear. 11

Computer Graphics Applications 1)Graphs and Charts 2)Computer Aided Design 3)Virtual–Reality Environments 4)Data Visualizations 5)Education and Training 6)Computer Art 7)Entertainment 8)Image Processing 9)Graphical User Interface 10)Graphics Workstations and Viewing Systems 11)A Realistic Object With Illumination Effects 12)Modeling Characteristics of Object 13)Rendering 14)Modeling and Rending Stages in the Simulation 15)Color Model 12

1.1 Graphs and Charts 13 The display of simple data graphs Graphs are commonly used To summarize, financial, Statistical, Mathematical, scientific, engineering and economic data for research report, managerial summaries, consumer information bulletins, and other types of publications.

1.2 Computer Aided Design 14 Computer aided design are now used in the design of buildings, automobiles, aircraft, watercraft, spacecraft, computers, textiles, home appliances, and multitude of others products

1.3 Virtual–Reality Environments 15 The creation of virtual-reality environments in which the user can interact with the objects in a 3-dimensional scene.

1.4 Data Visualizations 16 Producing graphical representations for scientific, engineering, and medical data sets

Education and Training 17 Computer generated models of physical, financial, political, social, economic and other systems are often used as educational aids

1.6 Computer Art 18 Art and commercial art make use of computer graphics methods. Artists have available a variety of computer methods tools, including specialized hardware, commercial software package, symbolic mathematics program

1.7 Entertainment 19 TV productions, motion pictures, and music videos use computer graphics. Sometimes graphics images are combined with live actors and scenes, and sometimes the films are completely generated using computer rending and animation technique TV productions, motion pictures, and music videos use computer graphics. Sometimes graphics images are combined with live actors and scenes, and sometimes the films are completely generated using computer rending and animation technique

1.8 Image Processing 20 The modification or interpretation of existing pictures, such as photographs and TV scans, is called image processing.

1.9 Graphical User Interface 21 A major component of a graphical interface is a window manager that allows user to display multiple, rectangle screen areas, called display windows.

1.10 Graphics Workstations and Viewing Systems 22 The 360º viewing screen in the NASA airport control-tower simulator, called the Future Flight Central Facility.

1.11 A Realistic Object With Illumination Effects 23 Super-ellipsoids plotted with values for parameters s 1 and s 2 ranging from 0.0 to 2.5 and with r x = r y = r z.

1.12 Modeling Characteristics of Object 24 Modeling the characteristics of (a) cotton, (b) wool, and (c) polyester cotton using energy- function minimization.

Example of Modeling Characteristics of Object 25 Diffuse reflections from a spherical surface illuminated by a point source emitting white light, with values of the diffuse reflectivity coefficient in the interval 0 ≤ k d ≤ 1.

1.13 Rendering 26 Rendering is the process of generating an image from a model (or models in what collectively could be called a scene file), by means of computer programs. Also, the results of such a model can be called a rendering. A scene file contains objects in a strictly defined language or data structure; it would contain geometry, viewpoint, texture, lighting, and shading information as a description of the virtual scene. Rendering is the process of generating an image from a model (or models in what collectively could be called a scene file), by means of computer programs. Also, the results of such a model can be called a rendering. A scene file contains objects in a strictly defined language or data structure; it would contain geometry, viewpoint, texture, lighting, and shading information as a description of the virtual scene.

Example of Rendering 27

1.14 Modeling and Rending Stages in the Simulation 28 Simulation is the imitation of the operation of a real-world process or system over time. The act of simulating something first requires that a model be developed; this model represents the key characteristics or behaviors/functions of the selected physical or abstract system or process. The model represents the system itself, whereas the simulation represents the operation of the system over time. Simulation is the imitation of the operation of a real-world process or system over time. The act of simulating something first requires that a model be developed; this model represents the key characteristics or behaviors/functions of the selected physical or abstract system or process. The model represents the system itself, whereas the simulation represents the operation of the system over time.

1.15 Color Model 29 The RGB color model is an additive color model in which red, green, and blue... palette of 216 RGB colors, defined by the Netscape Color Cube.

Classification of applications (1) There are three classifications for applications: The first classification is by type of the object (2D, 3D) to be represented and the kind of picture (line, color, shadow …) to be produced. The second classification is by type of interaction, which determines the user’s degree of control over the object and its image. With interactive plotting, the user can create new objects, using other existing components, and then moves around to get a desired view. 30

Classification of applications (2) The third classification is by the role of the picture, which determines whether the picture is an end in itself or a means to an end. Some pictures are end products while others are intermediate products to other products. 31

Image Types Three Types of image are commonly used: −GIF (Graphics Interchange Format) −JPG or JPEG (Joint Photographic Experts Group) −PNG (Portable Network Graphics) −TIF or TIFF (Tagged Image File Format) A new format, SVG (Scalable Vector Graphics), is not yet in common use

Properties of images (1)

Properties of images (2) Compression quality - Lossy for smallest files (JPG), or Lossless for best quality images (TIF, PNG). Full RGB color for photos (TIF, PNG, JPG), or Indexed Color for graphics (PNG, GIF, TIF). 16-bit color (48-bit RGB data) is sometimes desired (TIF and PNG). Transparency or Animation is used in graphics (GIF and PNG). Documents - line art, multi-page, text, fax, etc - this will be TIF. CMYK color is certainly important for commercial prepress (TIF).

GIF (Graphics Interchange Format) GIF uses a lossless compression technique, meaning that no color information is discarded when the image is compressed The color depth of GIF is 8-bit, allowing a palette of no more than 256 colors GIF excels at compressing and displaying flat color areas, making it the logical choice for line art and color graphics

GIF Transparency With GIF files, you can choose any color in an image to appear as transparent in the browser The background color or pattern will show through the areas that you have designated as transparent Using transparent areas allows you to create graphics that appear to have an irregular outside shape, rather than being bounded by a rectangle

Transparent and nontransparent GIFs

GIF Animation The GIF format lets you store multiple images and timing information about the images in a single file This means that you can build animations consisting of multiple static images that play continuously, creating the illusion of motion

JPG or JPEG (Joint Photographic Experts Group) JPG is best for photographs or continuous tone images JPGs are 24-bit RGB images that allow millions of colors JPGs use a “lossy” compression routine especially designed for photographic images – When the image is compressed, some color information is discarded, resulting in a loss of quality from the original image

JPG (continued) JPEG always uses lossy compression, but its degree is selectable, for higher quality and larger files, or lower quality and smaller files. JPG is for photo images, and is the worst possible choice for most graphics or text data. Digital cameras and web pages normally use JPG files.

PNG (Portable Network Graphics) A royalty-free file format that is intended to replace GIF This lossless format compresses 8-bit images to smaller file sizes than GIF PNG supports transparency and interlacing but not animation

TIF Image TIF is lossless which is considered the highest quality format for commercial work. TIF simply has no JPG artifacts, no additional losses or JPG artifacts to degrade and detract from the original. TIF is the most (versatile) adaptable, except that web pages don't show TIF files. TIF does most of anything you might want, from 1-bit to 48-bit color, RGB, CMYK, LAB, or Indexed color. Most any of the "special" file types (for example, camera RAW files, fax files, or multipage documents) are based on TIF format.

SVG (Scalable Vector Graphics) A new standard from the W3C A language for describing two- dimensional graphics using XML SVG graphics are scalable to different display resolutions and are printable Not yet supported by most browsers