Cosc 4735 Vector Graphics.

Slides:



Advertisements
Similar presentations
2.01 Investigate graphic image design.
Advertisements

CHS GRAPHICS GDP UNIT 01 FILE FORMATS Understanding File Formats.
Web Design Vocab 3 PNG, JPG, GIF, MP3, MPEG.
2.01 Understand Digital Raster Graphics
2.02 Understand Digital Vector Graphics
Vector Graphics 2.02 Understand Digital Vector Graphics.
Introduction to Graphic Arts Technology PRINT Versus WEB.
JRN 302: Introduction to Graphics and Visual Communication - File formats, conversion Tuesday, 8/4/15.
Chapter 3 Survival Techniques. Goals Discover that being an Illustrator artist is more than just knowing the tools Develop a basic understanding of the.
Graphic Images 101. Painted on a grid Drawn mathematically.
Minard Saladino By:. Introduction: Illustrator is a vector-based imaging program. Unlike PhotoShop, which deals in pixels (raster images), this one deals.
Computer Graphics Prepared by Dragon Lee 1 January 2003.
SOFTWARE TYPES Word processing Page layout Paint Draw.
TYPES OF GRAPHICS TECHNOLOGICAL DESIGN. GRAPHIC DESIGN DEFINITION Visual problem solving that utilizes shapes, images, text, color, etc. to communicate.
Web Image Basics Comp 140 December 2. Vector Graphics Can be repositioned or resized – Will not diminish output quality Typically stored in AI, EPS, PICT.
Module Code: CU0001NI Technical Information on Digital Images Week – 2 - Extra.
+ 5 Things you need to know about images* *Images for the web.
RASTER & VECTOR FILES. Raster images use many coloured pixels or individual building blocks to form a complete image. JPEG, BMP, TIFF, GIF are common.
File Formats Different applications (programs) store data in different formats. Applications support some file formats and not others. Open…, Save…, Save.
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.
Vector vs. Raster Objectives:
Digital Imaging 101 Ann Ware. Digital Image Categories BITMAP  A vector is created by using a series of mathematically defined lines and curves rather.
Digital Imaging 101 Ann Ware
PLACING AND LINKING GRAPHICS
What is GIS? GIS is an integrated system used to view and manage information about geographic places, analyze spatial relationships, and model spatial.
Raster Graphics 2.01 Investigate graphic image design.
Computer Graphics Unit 23 Computer Graphics. Computer Graphics Computer generated imagery can be categorized into several different types: Vector or Bitmap.
* Bitmap images are based on a grid of pixels * Each pixel is assigned a specific location and color value * Bitmaps contain a limited number of pixels,
21 st Century Technology. Painting Uses Pixels Quality of image Changes Drawing Uses Vectors or Lines Quality of Image Does NOT Change.
Vector vs. Raster What’s the difference between vector and raster file formats? The real difference between the two formats is how they are used.
Digital Graphics for Computer Games Pixels Types of Digital Graphics (Raster and Vector) Compression.
Flash Vector vs. Raster. Vector vs. Rastor Vector –Made up of points and vectors –Scalable –Low file size –Can appear smooth Rastor –Pixels of color –Scaling.
HTML5 and CSS3 Illustrated Unit F: Inserting and Working with Images.
Bitmap vs. Vector How computers work with photographs and drawings.
2.02 Understand Digital Vector Graphics
File Formats Different applications (programs) store data in different formats. Applications support some file formats and not others. Open…, Save…, Save.
Digital Imaging 101 Ann Ware.
Vector (Shapes) vs. Raster (Pixels)
Digital Illustration Chapter 6 File format.
2.02 Understand Digital Vector Graphics
2.02 Understand Digital Vector Graphics
Types of Graphics Technological Design.
What is SVG?.
Inserting and Working with Images
Introduction to raster graphics
Scalable vector graphics
RESEARCH AND APPLY GRAPHIC DESIGN TECHNIQUES #3
Bitmap vs. Vector.
ANM 100 ADOBE CREATIVE SUITE
Agenda 2/18/16 Surreal World Project: Turn in yourlastname-SW.jpeg,
Agenda 2/27/17 Sketch/write #30: Raster Vs. Vector Article
IMAGE SIZE AND RESOLUTION
2.02 Understand Digital Vector Graphics
ADOBE FIREWORKS.
Image Asset Vector Asset
Illustrator Interface
Some terms to become familiar with:
Graphics.
2.02 Understand Digital Vector Graphics
Introduction & Getting ready to work
Terms 1 Terms 2 Terms 3 Terms 4 Terms 5 1pt 1 pt 1 pt 1pt 1 pt 2 pt
Digital Image Creation & Editing
Vector (Shapes) vs. Raster (Pixels)
Introduction & Getting ready to work
PRODUCTION PHASES CHANGES
2.02 Understand Digital Vector Graphics
What is SVG?.
2.02 Understand Digital Vector Graphics
2.02 Understand Digital Vector Graphics
Presentation transcript:

Cosc 4735 Vector Graphics

What is Vector Graphics? Bitmap – A grid of pixels, each with its own color data Cannot be scaled or rotated cleanly JPG, PNG, GIF, etc. Vector – Path data between many connected nodes Scales and rotates without loss of clarity SVG, AI, PDF, EPS, etc. In the .SVG format, path data is saved as XML code

Android You starting in Android 5.0 (API 21+) you can define your images as vector drawables (eg vector graphics). Studio will then create the images needed anything before API 21, if you set the min below 21. This is really handy for FAB icons and other images. Studio has a large number of built in vg that you can use or create you own.

How To

How To (2)

Using the vg Same as you would use any graphic. Call for it like normal, so "@drawable/ic_garfield_the_cat" ImageView, ImageButton, wherever you’d be able to draw a bitmap Can determine size, color, angle, etc.

Making a custom VSG Can be made with programs like Inkscape, Adobe Illustrator, or found by searching the web Inkscape is free Make sure filename is all lowercase! Studio gets mad otherwise

References https://developer.android.com/training/material/drawables.html https://developer.android.com/studio/write/vector-asset-studio.html This a lot of information on supporting API 20 and below as well, the VectorDrawableCompat class.

Q A &