190 likes | 365 Views
King Fahd University of Petroleum & Minerals College of Computer Science & Engineering. Information & Computer Science Department. ICS201 Lecture 11 : Gentle Introduction to Computer Graphics. Based on:
E N D
King Fahd University of Petroleum & Minerals College of Computer Science & Engineering Information & Computer Science Department ICS201 Lecture 11 : Gentle Introduction to Computer Graphics Based on: David Brogan’s “Introduction to Computer Graphics” Course Slides, University of Virginia Jack van Wijk’s “Computer Graphics” Course Slides, University of Eindhoven.
Outline • Graphics Applications • What is Computer Graphics • Representations in Graphics • Supporting Disciplines
Graphics Applications • Entertainment: Cinema A Bug’s Life (Pixar) Pixar: Monster’s Inc.
Graphics Applications • Medical Visualization The Visible Human Project MIT: Image-Guided Surgery Project
Graphics Applications • Scientific Visualization
Graphics Applications • Computer Aided Design (CAD)
Graphics Applications • Training Designing Effective Step-By-Step Assembly Instructions (Maneesh Agrawala et. al)
Graphics Applications • Games GT Racer 3 Polyphony Digital: Gran Turismo 3, A Spec
Graphics Applications • Games Circus Atari (Atari)
Graphics Applications • The major application that we will be dealing with extensively in the next coming lectures is that of developing graphical user interfaces • Windows • Menus • Buttons • Textboxes • ...
What is Computer Graphics? • Computer graphics: generating 2D images of a 3D world represented in a computer. • Main tasks: • modeling: (shape) creating and representing the geometry of objects in the 3D world • rendering: (light, perspective) generating 2D images of the objects • animation: (movement) describing how objects change in time
Representations in graphics Vector Graphics • Image is represented by continuous geometric objects: lines, curves, etc. Raster Graphics • Image is represented as a rectangular grid of colored pixels • PIXEL = PIcture ELement
Raster graphics • Generic • Image processing techniques • Geometric Transformation: loss of information • Relatively high processing time • in terms of the number of pixels • Realistic images, textures, ... • Examples: Paint, PhotoShop, ...
Sample Image Processing Techniques • Edge Detection • Image Denoising
Vector graphics • Graphics objects: geometry + color • Relatively low processing time • in terms of the number of graphic objects • Geometric transformation possible without loss of information (zoom, rotate, …) • Examples: PowerPoint, CorelDraw, SVG, ...
Scalable Vector Graphics (SVG) <?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="12cm" height="4cm" viewBox="0 0 1200 400" xmlns="http://www.w3.org/2000/svg" version="1.1"> <desc>Example polygon01 - star and hexagon</desc> <!-- Show outline of canvas using 'rect' element --> <rect x="1" y="1" width="1198" height="398" fill="none" stroke="blue" stroke-width="2" /> <polygon fill="red" stroke="blue" stroke-width="10" points="350,75 379,161 469,161 397,215 423,301 350,250 277,301 303,215 231,161 321,161" /> <polygon fill="lime" stroke="blue" stroke-width="10" points="850,75 958,137.5 958,262.5 850,325 742,262.6 742,137.5" /> </svg>
In Summary Image Analysis (pattern recognition) Math. Model Image Image Synthesis(Rendering) Modeling Image processing
Supporting Disciplines • Computer science (algorithms, data structures, software engineering, …) • Mathematics (geometry, numerical, …) • Physics (Optics, mechanics, …) • Psychology (Colour, perception) • Art and design