0% found this document useful (0 votes)
107 views

Lesson 5 Imaging and Design For Online Environment

Uploaded by

Kaizel Britos
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
107 views

Lesson 5 Imaging and Design For Online Environment

Uploaded by

Kaizel Britos
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

EMPOWERMENT TECHNOLOGIES

MODULE 5. THIRD QUARTER

“IMAGING AND DESIGN FOR ONLINE ENVIRONMENT”

SOURCES OF PHOTOS AND GRAPHICS


1. PERSONAL AND PROFESSIONAL PHOTOS
 Photos taken by amateur or professional photographers using digital cameras
2. SCANNED IMAGES
 Transfer from printed photos and graphics using scanning devices
3. STOCK PHOTO LIBRARY
 Photographs and created images that are available for smile come in CD or DVD format and royalty free (Can be
used without additional fees)
4. ONLINE STOCK PHOTOS
 Found in WWW, which is a dominant source of photos and graphics

ONLINE DIGITAL FILE FORMATS FOR IMAGES AND TEXT


FILE FORMATS  Uses suffixes that are added to the end of a file name (file name extensions)
1. Proprietary Formats – owned and controlled by individuals or corporation and not available to the public
2. Open formats –string digital info that are full can be used by the public and are not encumbered by copyrights or patents

CLASSFICATION OF DIGITAL FILE FORMAT


1. Uncompressed \ raw format - String original file format; flexible form but needs bigger memory to store
2. Lossless file format - Compressed to replicate the original quality but at a reduced file size; ideal for storing important
file
3. Lossy File Format - Compressed as an approximation of the original file but is good enough; better compression rate
requiring the least memory

IMAGE FILE FORMATS


1. RASTER IMAGE FILES (Bitmap Image)
 Means of representing digital images in bits of info. for storage which translate into pixels (smallest info. of an
image) when viewed on screen ; majority of raster files are lossy
TYPES OF RASTER IMAGE FORMATS
A. .bmp (Bitmap Image Bits) - Developed and used on Microsoft Window environment and is stored in a graphics
file format called DIB (Device Independent Bitmap).
B. .gif (Graphical Interchange Format) - very popular on WWW because of its portability (small file size) and support
for animation; supports only a small 8 bits per pixel color scheme
C. .jpg (JPEG – Joint Photographic Experts Group) - Common method for photographic images; supports 24 bits per
pixel color scheme
D. .png (Portable Network Graphics) - free open source bitmap image made to improve GIF; support 24 bits per pixel
color scheme and supports true color (16 million colors)
E. .psd (Photo Shop Download) - native file format for adobe photo shop which has the ability to read all file format

2. VECTOR IMAGE (Vector Graphics Files)


 lossless file created using mathematical geometric equations to represent images in digital computer graphics
TYPES OF VECTOR IMAGE FORMATS
A. .ai (Adobe Illustrator) - created using paths and lines converted by ay points instead of bitmaps
B. .drw (Drawing File) - generic drawing created an stored in a vector format that uses lines or paths to represent
images
C. .dxf (Drawing Exchange Format) - developed an introduced by Autodesk and used for CAD vector images
D. .ps (Postscript)- page description language (PDL) developed by Adobe, A language for printing documents on
laser printers and images setters (high resolution printers)
E. .svg (Scalable Vector Graphics)- most common vector graphics formats on the internet developed by the W3C
(WWW Consortium)

BASIC PRINCIPLES OF GRAPHICS AND LAYOUT


LAYOUT  process of planning and arranging graphics or text in a page or book
1. Symmetrical- equal weight of elements on both sides of the page
2. Asymmetrical- there is an artistic and different intensity on one side of the page
3. Text- the text should be legible, appropriate font face and arranged properly
4. Image- with sharp color, high resolution and should be proportionate
5. Proximity and Harmony- elements should be close together and not scattered; elements should not be cluttered and
not compete each other
6. Consistency- uniformity of theme each other
7. Color and Shape- using color contrast and shape variation to create interest
8. Emphasis- having one point of interest in a page

PRINCIPLES AND BASIC TECHNIQUES OF IMAGE MANIPULATION


PHOTO EDITING TOOLS  allow you to manipulate or edit images, apply effects, filters, add frame, crop, add text, change
background color, make photo collage, and photo album that you would like to do in an image.
1. Background Color – changing the background to match the image and effects to the totality of background
2. Multiple Images – by combining multiple images it make appoint or use to highlight the message
3. Shadow- this effect will make the image realistic
4. Proportion – when combining the images, resize the image to make it proportionate
5. Blending Color – using color blending to match the background with the other elements in the page
6. Texture – it allows to blend with different images and it add depth to the art
7. Emphasis – a focal point to a page that will attract viewers; the element should be sharp, big and most vibrant

BASIC IMAGE MANIPULATIONN USING OFFLINE OR OPEN SOURCE SOFTWARE


1. PICASA- Google’s free photo manager to edit and organize photos
2. PAINT.NET- windows based alternative to the MS Paint editor; a free and open source available in Windows
3. GOOGLE SKETCH UP- free, 3d modelling program with tools that allow you to create 3D models of houses and other
dimensional accuracy
4. AUTODESK PIXLR- free photo editing tool that is similar to photoshop and has more than 600 effects, overlays and
borders that you can use
5. ADOBE PHOTOSHOP- a tool to create, modify, combine and optimize digital photos and images; best in adjusting
brightness and contrast of the images, combines diff elements and keeps images organized
6. GIMP- GNU Image Manipulation Program, free and open source image and graphics editing program used for image
retouching and editing, free form drawing and painting and other specialized tasks

“Technology will not replace great teachers but technology in the hands of great teachers can be
transformational.”
-George Couros-

Prepared By:
Ms. Beverly Panganiban Cadacio, ECT

You might also like