Graphics. … Can be immersive and capture imaginations. Largest Photographs In The World.

Slides:



Advertisements
Similar presentations
Raster Graphics 2.01 Investigate graphic image design.
Advertisements

Web Design Vocab 3 PNG, JPG, GIF, MP3, MPEG.
Droddy.  “Pixel” is short for two words: Picture and Element. Pixels (tiny squares) combine to form the image the human eye perceives Too small for the.
Adobe Flash CS4 – Illustrated Unit E: Optimizing and Publishing a Movie.
Multimedia for the Web: Creating Digital Excitement Multimedia Element -- Graphics.
Graphics CS 121 Concepts of Computing II. What is a graphic? n A rectangular image. n Stored in a file of its own, or … … embedded in another data file.
Introduction to Computer Graphics
Graphics and Animation Chapter 8. 8 Graphics in Multimedia Graphics are an element that virtually all multimedia applications include.
8.2 PICTURE IT Graphic Types and Their Uses. What Are Graphics?  Graphics are pictures/images  They could be images taken on a digital camera or scanned.
Ann Ware Digital Imaging 101. Digital Image Categories BITMAPVECTOR A bitmap is an image created with pixels (small squares of color) The number of pixels.
Image and Sound Editing Raed S. Rasheed Image Image. Digital image. – Raster images. – Vector Images. – Stereo Images. – Image File Formats Lossless.
Part A Multimedia Production Rico Yu. Part A Multimedia Production Ch.1 Text Ch.2 Graphics Ch.3 Sound Ch.4 Animations Ch.5 Video.
Minard Saladino By:. Introduction: Illustrator is a vector-based imaging program. Unlike PhotoShop, which deals in pixels (raster images), this one deals.
Zinnia Bell. RAWimages are image files that have not yet processed, they contain minimally processed data from the image sensor of either a image scanner,
Chapter 3 Adding Images in HTML. Agenda Understanding Web Page Images Prepare Your Images for the Web Insert an Image Specify an Image Size Add Alternative.
1 Creating Web Graphics Outline 2.1 Graphics Types 2.2 Vector Graphics 2.3Bitmapped Graphics 2.4Graphics for the Web 2.5 GIF (Graphics Interchange Format)
Prepared by George Holt Digital Photography BITMAP GRAPHIC ESSENTIALS.
GRAPHICS/IMAGES INFSCI Source: Learning Web Design by Jennifer Niederst RobbinsJennifer Niederst Robbins Creating Images:  Scanning  Be aware.
Module Code: CU0001NI Technical Information on Digital Images Week -2.
Simple Graphics. Graphics Used in PowerPoint, Web pages and others Basic Knowledge drawing change of colour, shape and others acquiring, video camera,
Image Storage Bitmapped Graphics – in which an image is represented as a collection of dots Vector Graphics – in which an image is represented as a set.
Presentation Design: Graphics. More About Color “Bit depth” of colors -- This is based on the smallest unit of information that a computer understands.
Graphics and Animation Multimedia Projects Part 2.
Common file formats  Lesson Objective: Understanding common file formats and their differences.  Learning Outcome:  Describe the type of files which.
Graphics and Images Communicating Information : Documents and Publications.
Image Representation. Objectives  Bitmaps: resolution, colour depth and simple bitmap file calculations.  Vector graphics: drawing list – objects and.
Digital Image Formats: An Explanation Guilford County SciVis V
Information Processes and Technology Multimedia: Graphics.
Image formats. Basic terminologies… Pixels: Pixels are the building blocks of every digital image. a pixel is a single point in a graphic image. Resolutions:
Computer Images Can store color info about each pixel, but makes file BIG Compression for Web 15.
Graphics workshop Library and Information Services University of St Andrews.
Working with Images William Pegram April 1, 2013.
Lecture 16 Image Document Formats. Bitmap vs. Vector Images Bitmaps do not generally.
2D Graphics Theory & Principles. Single Point Smallest addressable area on screen or digital image.
File Formats and Vector Graphics. File Types Images and data are stored in files. Each software application uses different native file types and file.
Multimedia def. Many forms. Multimedia Text Hyperlinks Images Audio Animation Video Text Hyperlinks Images Audio Animation Video.
Graphics An image is made up of tiny dots called pixels (“picture elements”) The resolution determines the.
FILE TYPES FOR WEB DESIGN 1 HOW SHOULD I SAVE?. GRAPHICS INTERCHANGE FORMAT (GIF) Best used for flat-color, sharp-edged art or text Clip art, logos Compression.
Raster Graphics 2.01 Investigate graphic image design.
Media Types Information Systems can contain the following types of media: Sound, graphics, video & text.
Image File Formats. What is an Image File Format? Image file formats are standard way of organizing and storing of image files. Image files are composed.
Graphics Concepts Presentation
Introduction to Images & Graphics JMA260. Objectives Images introduction Photoshop.
Digital Graphics for Computer Games Pixels Types of Digital Graphics (Raster and Vector) Compression.
Image File Formats Harrow Computer Club – Wed, 1 Dec 2010 Bob Watson MA CMath MIMA MBCS.
Digital Image Formats: An Explanation Guilford County SciVis V
WEB GRAPHICS EXPLORING COMPUTER SCIENCE - LESSON 3-4.
Graphics and Image Data Representations 1. Q1 How images are represented in a computer system? 2.
Information Systems Design and Development Media Types Computing Science.
Computer Graphics Lesson 2 July 12, 2005 Image Formats What are some formats you are familiar with? There are 4 basic image format types: Uncompressed.
13 June – Session : Graphics Different types of Graphics for the web Features of image editing software Good practice for image editing.
Efficient Game Graphics From Flash MX 2004 Game Design Demystified.
Common Bitmap Image File Types
Digital Imaging 101 Ann Ware.
Computer Science Higher
Introduction to raster graphics
Graphics Bitmap Vector
2.01 Investigate graphic image design.
Digital Images.
Chapter 3:- Graphics Eyad Alshareef Eyad Alshareef.
Graphics.
Digital Image Formats: An Explanation
Graphics and Animation
Graphics Basic Concepts.
Web Design and Development
2.01 Investigate graphic image design.
Final Study Guide Arts & Communications.
2.01 Investigate graphic image design.
Graphics and Animation
Presentation transcript:

Graphics

… Can be immersive and capture imaginations. Largest Photographs In The World

Graphics  Graphics file types fall into two main categories: Bitmap Graphics and Vector Graphics. BitmapVector Referred to as paint graphics Can show color or black and white photographs/clipart Non-scalable without loss of quality Every pixel in the image adds to the overall file size Referred to as draw graphics Can show color or black and white solid fill/gradient image. Scalable without loss of quality File size is calculated by storing the positional points of the image and a generic fill color/pattern

Width 11 Pixels Height 11 Pixels GIF 8 bit (lets you choose from 256 colors that are premixed) JPG 24 bits (essentially mixes custom colors for each pixel on the fly!) PNG Portable Network Graphic supports true color 16 million colors. BMP Large uncompressed Windows universal file format Higher in Quality = Higher in File Size Bitmaps

Bitmaps - Animated GIF  An animated GIF is a sequence of GIF files all bonded together and displayed one after the other.  With enough panes, you can get very realistic animations. A minimum of 3 frames is necessary to create animation.  The total file size of an animated gif is the sum of the GIF files used to create the sequence, and that can add up quickly. Sample Create your own online

Bitmaps - JPEGs Sample For safe searches always look in trusted sites Flickr Alberta Education Online Reference Centre It has good compression characteristics on photographic data. It lets you adjust the amount of compression.

 An MPEG file tries to eliminate repetition between frames to significantly compress video information.  In addition it allows a soundtrack (which animated GIFs do not). Because a typical sequence has hundreds or thousands of frames, file sizes can still get quite large. Bitmaps - MPEG Compression

[position: 3.123; 48.52] [position: 10.03; 52.6] [position: 2.95; 86.52] [position: 11.04; 102.6] Bezier curve needs only four points! Vectors – Flexible and Overlapping

Vectors – Shockwave/Flash Shockwave/Flash provides a vector-based animation capability. Instead of specifying the color of every pixel, a Shockwave file specifies the coordinates of shapes (things like lines, rectangles, circles, etc.) as well as the color of each shape. Shockwave/Flash files can be extremely small. They allow animation and sound. The images are also scalable -- because they are vector-based, you can enlarge the image and it will still look like a fluid animation.

Lossless compression reduce file size as much as possible without losing image quality. Larger file size than images saved with lossy compression. This technique focuses on image quality as the main goal. Lossy compression Takes advantage of the limitations of the human eye and discard invisible information. Allows for variable quality levels (compression) and as these levels are increased, file size is reduced. Image Compression

Fun with Graphics Blabberize.com 3D animation What did you see? Free Online Paint And Draw Tools 3D-PC Games