IMAGING AND DESIGN FOR

ONLINE ENVIRONMENT
GROUP 10
STEM 11 - TEAL
Mapa, SHANEL
MARAVILLA, JOHN CARLO
NOL, RHENZ ARGEL enter
RETALO, BRYAN
OUTLINE

outline

Topics
Principles of Graphics and Design
Infographic
Image File Formats
Principles and Basic Techniques of Image Manipulation
Online Graphics Software
ImAGE HOSTING SITES

preview next
 Principles of
OUTLINE Graphics and
Design

Principles of Graphics and Design

Images and other visual elements are important factors in developing ICT content,
especially in sharing meaningful information. The following principles are followed to
standardize image creation and manipulation:

BALANCE
The distribution of the visual weight of objects, colors, texture, and space. If the
design was a scale, these elements should be balanced to make a design feel stable.
The three types of balance are symmetrical, asymmetrical, and radial.

MOVEMENT
It describes the flow of elements on the page.

UNITY
The principle that pulls together all the other elements that create balance and
harmony.
preview next
 Principles of
OUTLINE Graphics and
Design

Principles of Graphics and Design

REPETITION
It describes the consistent and balanced repetition of a design or element.

PROXIMITY
Describes the organization and relationship of elements included in the design, which
helps website users understand and organize information.

CONTRAST
It is the combination of opposing characteristics of an element. In design, we use
contrast to generate impact, highlight importance, create exciting graphics, and
create visual interest and dynamics.

WHITESPACE
It is the negative space or large margins that allow your design to breath
within the elements.
preview next
 Principles of
OUTLINE Graphics and INFOGRAPHIC
Design

INFOGRAPHIC
Also known as data visualization, is a visual image such as a chart or diagram that is
used to explain information or data. here are the principles and guidelines on how to
create an infographic:

Thesis/Story
The subject and the main idea of your infographic must be clear.

data
Help you communicate complex or compelling information in an
engaging and accessible way.

simplicity
as it requires simplifying data and design without sacrificing
meaning or quality. your style must be able to attract readers
so as not to make your infographic full of text.

preview next
 Principles of
OUTLINE Graphics and INFOGRAPHIC
Design

INFOGRAPHIC

sources
Statistics and facts serve as the content for infographics and can be obtained
from any number of sources, including census data and news reports. YOU MIGHT
also cite your sources to give credibility to your data.

BRANDING/SHAREABILITY
An Infographic is shareable only when it has something unique and innovative in it.

preview next
 Principles of IMAGE FILE
OUTLINE Graphics and INFOGRAPHIC FORMATS
Design

iMAGE FILE FORMATS

An image file format is a file format for a digital image. since the introduction of graphics
on the web, file formats also become an important aspect of the design stage
JPEG
JPEG OR JOINT PHOTOGRAPHIC EXPERTS GROUP is the most popular image format used on
the web. It's a standard image format for containing lossy and compressed image
data.

Gif
gif or graphics interchange format is limited to the 8-bit palette with only 256
colors. GIF is best used for diagrams, cartoons, and logos which use few colors and
are the chosen format for animation effects.

bmp
BMP or bitmap image file or device independent (dib) file format is the image file used
in the Microsoft Windows operating system. an image file format that can be used to
create and store computer graphics.

preview next
 Principles of IMAGE FILE
OUTLINE Graphics and INFOGRAPHIC FORMATS
Design

iMAGE FILE FORMATS

tiff
Tiff or tagged image file format is a type of raster image file format that is
commonly used for storing high-quality images.

png
png or portable network graphic is an image format developed by a group of
graphic software developers as a non-proprietary alternative to the gif format. The
PNG specification defines both a datastream and an associated file format for a
lossless, portable, compressed, raster (bit-mapped) image.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
Design IMAGE MANIPULATION

PRINCIPLES AND BASIC TECHNIQUES OF IMAGE MANIPULATION

it's a process of transforming images to produce the optimum outcomes. By mastering the
fine art of image manipulation, you can be capable of revolving your photograph into a
masterpiece of art. Here are the basic techniques common to all editing programs:

Cropping
It is a process of removing unwanted parts of the image focusing
only on the subjects. In other words, cropping is the act of
improving an image by removing unnecessary parts.

Color balance
Color balance is an adjustment that affects the overall mixture
of colors in a photograph to achieve a true-to-life look.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
Design IMAGE MANIPULATION

PRINCIPLES AND BASIC TECHNIQUES OF IMAGE MANIPULATION

adjusting
Adjustments and adjustment layers can manipulate the picture's
hue and saturation, levels, contrast, curves, and color balance
as well as other more advanced points of manipulation.

Compression and resizing

If the images are both resized (reducing both the width and height)
and then compressed correctly (further reducing the file size) the
time it takes to transfer them is remarkably faster.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
Design IMAGE MANIPULATION

PRINCIPLES AND BASIC TECHNIQUES OF IMAGE MANIPULATION

color blending
Use the different special effects buttons available in different
image editing software. Use Blend modes to merge colors and
patterns between your background and foreground to create
cool effects and surprising new images.

Combining multiple images

compositions must be planned and conceptualized first so that
you will be able to render the best image and message possible.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC ONLINE GRAPHICS
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
SOFTWARE
Design IMAGE MANIPULATION

ONLINE GRAPHICS SOFTWARE

A graphics software program is a computer application used to create digital images.
Graphics software programs can be used to create both vector and raster images.
Common features of graphics software programs include the ability to create, edit, and
save images in a variety of formats.

picasa
It was designed to help users manage and edit their digital
photos and images on their computers. Picasa provided a
range of features for organizing, viewing, and enhancing
photos, making it a convenient tool for individuals and
photographers.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC ONLINE GRAPHICS
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
SOFTWARE
Design IMAGE MANIPULATION

ONLINE GRAPHICS SOFTWARE

Fotor
It is the web-based photo editing platform and designed for
manipulating and altering images. Fotor's image manipulation
capabilities enable users to create artistic compositions, enhance
photos, and apply creative effects to achieve their desired visual
results.

pixlr
Pixlr provides users with the ability to enhance, retouch, and
manipulate images using a variety of features and functions and
also offers both basic editing tools, such as cropping, resizing, and
rotating, as well as advanced editing options like adjusting colors,
exposure, and contrast.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC ONLINE GRAPHICS IMAGE HOSTING
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
SOFTWARE SITES
Design IMAGE MANIPULATION

IMAGE HOSTING SITES

An image hosting service allows you to upload images to a remote server for viewing
online. You can then display the images to users via your website or web application,
without having to allocate storage space for images on your web server.

IMGUR
Imgur is a FREE online image SITE WHERE YOU CAN UPLOAD IMAGES, VIEW
IMAGES, VIDEOS AND SHARE CONTENT FROM YOUR COMPUTER.

FLICKR
Flickr is an image hosting and video hosting service, as well as an
online community. YOU CAN SAVE AND MANAGE YOUR PHOTOS FOR IT
OFFERS A 1 TB STORAGE CAPACITY IN YOUR ACCOUNT.

preview next
 Principles of IMAGE FILE PRINCIPLES AND BASIC ONLINE GRAPHICS IMAGE HOSTING
OUTLINE Graphics and INFOGRAPHIC FORMATS TECHNIQUES OF
SOFTWARE SITES
Design IMAGE MANIPULATION

IMAGE HOSTING SITES

PHOTOBUCKET
Photobucket is an American image hosting and video hosting
website, web services suite, and online community.

SLICKPIC
the web's most versatile online photo sharing experience and offers
memberships with unlimited uploads, easy sharing and social media
options, drag and drop management and secure photo storage.

ZENFOLIO
AN ONLINE IMAGE-HOSTING SITE THAT offers unlimited storage for
photo uploads as well as cloud photo hosting and backup for
photographers.
preview END
THANK YOU FOR
LISTENING!
enter