Visual Message

Design
LESSON 13
KEYTERMS

 Infographics – short term for information graphics

which are visual representation of information,
data or knowledge intended to present
information quickly and clearly improves
understanding by using graphics.
 Data Visualization – visual representations of
numerical values (charts and graphs). It can be
very efficient by visualizing a large set of numbers
in a small space.
GUIDES ON MAKING INFOGRAPHICS

 Determine purpose of use

 Determine structure
 Determine color scheme
 Determine shape scheme
DETERMINE PURPOSE OR USE

a. Who is your audience?

b. What message do you want to
communicate?
c. What is your purpose?
DETERMINE STRUCTURE

a. Gather your data;

b. Organize data into thematic groups;
c. Decide what data you will use;
d. Think about the look and design for your
infographic and hand draw a rough
layout.
DETERMINE COLOR
SCHEME
a. You can choose specific
colors by using HEX or RGB
colors;
b. Colors should match
topics, purpose or use and
target group
c. Use five to six colors at
most.
d. Remember to keep it
simple.
DETERMINE SHAPE
SCHEME
 The shapes you use should also
follow a scheme;
 Constantlyuse the chosen
elements throughout your
infographics.
INFOGRAPHIC
SOFTWARE EXAMPLES
 PowerPoint
 Easel.ly
 Pictochart
 Infogr.am
 Adobe Illustrator
ONLINE FORMATS FOR
TEXTS AND IMAGES
Graphic Files

 Store
an image and are divided into two
basic types:
Raster-based
Vector-based
RASTER – BASED FILES

 Stores the image as a collection of pixels.

 Also referred to as bitmapped images.
 Cannot be scaled without distortion.
RASTER-BASED FILE FORMATS
JOINT PHOTOGRAPHIC EXPERTS GROUP (JPEG)
 Supports a wide range of colors that makes it
most popularly used on cameras and scanners.
 The format used in the Internet delivery and
photo sharing
 However, compressed, some details are
affected when producing a smaller file size.
 A great format for maximizing space on
camera’s memory card, posting online, or
sharing via e-mail.
JOINT PHOTOGRAPHIC EXPERTS GROUP
(JPEG2000)
 An improved version of the JPEG file, with a
better compression ratio producing higher-
quality images. Its design delivers lossless
compression
 JPEG 2000 offers a better output than JPEG
 JPEG 2000 is still in use but it’s one of the least
adopted image formats
 JPEG 2000 is not a universally accepted format
TAGGED IMAGE FILE FORMAT (TIFF)
 Usable with many different software programs
and are often the format of choice for high-
quality master image.
 Quality is always as perfect as the original.
 Huge file size.
 Greatly used when sending images to be
included on printed books, brochures or
magazines.
 Scanning format.
GRAPHICS INTERCHANGE FORMAT (GIF)
 Widely used on the Internet for graphics and
logos with areas of solid color.
 Produces a smaller file size with a limited
number of colors and has a transparent
background.
 Not accurately represented for photographs.
 Used for low-resolution animations.
PORTABLE NETWORK GRAPHICS (PNG)

 Designed to replace GIF

 Patent and license free and produces
higher quality files than GIF.
 Preferred for images that contain text or
line art, especially on the internet.
 PNG-8 and PNG-24
PORTABLE NETWORK
GRAPHICS (PNG)
 PNG-24 supports more
colors and partially
transparent pixels.
 Important if drop
shadow is added to an
image with
transparent
background
BITMAP (BMP)

 Relativelylow-quality files used most often

in word processing applications.
PHOTOSHOP DOCUMENT (PSD)

 Native file format of Adobe Photoshop.

 The default format of the layered images
that may be adjusted with graphic
elements.
 Images are flattened to save it to other
format.
VECTOR – BASED FILES
VECTOR – BASED FILES

 Type of file that stores an image as

mathematical formulas to display and scale
the image without distortion.
A vector file is an image that can scale to any
size without losing its quality and clarity.
DRAWING EXCHANGE FORMAT or
DRAWING INTERCHANGE FORMAT (DXF)
Widely used in computer-aided design
software programs, used by engineers and
architects.
AutoCAD (Computer Assisted Drafting)
software
Encapsulated PostScript (EPS)

 Widely
used in desktop publishing software
programs.
Computer Graphics Metafile (CGM)

 Widely used in many image oriented

software programs (Photoshop) and offer
a high degree of durability.
TEXT FILES

 Mostoften created in word processing

software programs.
Common Text Files

 Proprietary formats such as Microsoft Word files, carry

the extension of the software
 RTF or Rich Text Format – supported by a variety of
applications and saved with formatting instructions
(page layout)
 Portable Document Format (PDF) – contain an image of
the page, including text and graphics.
 Used for read-only file sharing
 Adobe Acrobat
Video and Audio Files

 Files
contain moving images (digitized video,
animation) and sound data.
 QuickTime (.MOV)
 Windows Media Video (.WMV)
 Motion Picture Experts Group (.MPEG)
 MPEG Audio Layer 3(.MP3)
 Audio Video Interleave (.AVI)
 Waveform Audio File Format (.WAV)
The End!
PRINCIPLES AND BASIC
TECHNIQUES IN IMAGE
MANIPULATION
Lesson 14
PICKING STOCK IMAGES

• Refers to choosing the best photo or image that can

blend to other cropped images
• Consider first file format of the image – JPEG, PNG,
TIFF, etc.
• Consider the size and quality of the image.
• Not all images can be manipulated:
• Blurred images, bad angle, small file size
RENDERING

Manipulation or putting together of different

images into one cohesive image
Image synthesis
Some images are difficult to manipulate:
 Ruggededges, image with old or damaged
background, image with many minute details
SHADOW

Shadow adds realism.

Makes the image appear real or alive.
PROPORTION
Includes proper placement of your
images so that it will appear
realistic.
COLOR BLENDING
Colors should blend perfectly with
each other and should form a nice
clear work.
Area of main focus that draws viewer’s
attention.
 Vibrant, colorful, sharp area in the design

EMPHASIS ON DETAILS
Each image should complement each
other.
It enhances the look of the raw image if it
has a combination of multiple images for
background and foreground in a
separate editing layer.

COMBINING MULTIPLE IMAGES

ENHANCING A STOCK IMAGE

Stock images are plain.

Turn them into something more attractive.
OPEN SOURCE APPLICATIONS USED FOR IMAGE
MANIPULATION
 Pixelmator (Mac)
 Paint.net (Windows)
 Adobe Lightroom (bulk-managing photos)
 Aviary Photo Editor (best for mobile)
 PaintShop Pro
 Serif PhotoPlus7
 Pixlr
 Canva
BASIC TECHNIQUES IN IMAGE
MANIPULATION

• Filters
• Text and Color
FILTERS
● Enhance the beauty of the image and transform it
dramatically.
TEXT AND COLOR
● Emphasize the message of the image more and it
catches the attention of the people seeing it.
WHERE CAN WE USE THESE
TECHNIQUES, WE ACQUIRED FOR
IMAGE MANIPULATION?
IMAGE EDITING
SOFTWARE
● LICENSED
● OPEN SOURCE

17

17
Licensed Image Editing Software

• are softwares necessary to purchase before you

access the full feature of the software
ADOBE LIGHTROOM

• allows you to transform plain

images into creative and
stunning image.
ADOBE PHOTOSHOP

• comprises different editing tools

that may be used to add effects
and enhance the image.
ADOBE ILLUSTRATOR

• vector graphics
manipulation where
cartoon characters, 2D
graphics, even 3D
graphics may now be
edited in this software.
COREL PAINTER

stimulates the appearance of the

traditional media associated with
drawing, painting, and printmaking
as accurately as possible.
OPEN SOURCE IMAGE EDITING SOFTWARE

are those software that are not necessary to purchase

but the full features of the software are still accessible
GNU IMAGE MANIPULATION
PROGRAM (GIMP)

● It has a large collection of professional-

level tools to assist you in editing and
filtering images.
INKSCAPE

It has an excellent support for

gradients, layers, and other controls
that you may find in the licensed
software mentioned.
KRITA

A linux photo editing software for

raster images.

Allows you to draw or create

graphics from scratch, can edit raw
images, and at the same time it can
give you numerous tools that you
can use in editing and creating such
graphics.
RAWTHERAPEE

supports all the images

captured on cameras
supported by DCRaw and
renders several file formats such
as JPEG, PNG, and TIFF.
WHAT IS THE DIFFERENCE BETWEEN
LICENSED IMAGE EDITING SOFTWARE
AND OPEN-SOURCE IMAGE EDITING
SOFTWARE?
 LICENSED EDITING SOFTWARE VS OPEN SOURCE EDITING SOFTWARE

Licensed Editing Software Open Source Editing Software

● with trial versions ● free of charge

● accessibility to full ● accessibility to full features
features when in full ● with unique features
Advantage version ● renders file formats that are
● commonly used by compatible with other
editors using Windows license software in the
Operating Systems and market
MacOS ● some can be used in various
● user-friendly operating systems (e.g.
Windows, MacOS, etc.)
 LICENSED EDITING SOFTWARE VS OPEN SOURCE EDITING SOFTWARE

Licensed Editing Software Open Source Editing Software

● has limited access to ● might take time for users

features when in trial to be familiar with
Disadvantage version ● user must have prior
● license expires knowledge in
● not compatible with manipulating such
open source software
operating systems (i.e.
Linux OS)
● costly
THE END!
Introduction to Online Platforms
Lesson 15
What is an
Online
Platform?
 Understanding Online Platforms

• Online Platforms refer to base systems that facilitate

the functions of applications or technologies on the
Internet.

• A digital service that facilitates interactions between

two or more distinct but interdependent sets of users
Websites

These platforms are created by

developers and can be customized by
users by adding the functions or features
of their choice.
Online Platform in Education
 Online Platform in Education

A wide range of online platforms offer

extensive assistance on education and
career advancement, which we refer to
as e-learning.
Positive Impacts of Online Platforms on Education

• Connectivity
• Flexibility
• Cooperation
• Personalisation
Positive Impacts of Online Platforms on Education

CONNECTIVITY
Educators are able to deliver their
lessons to reach learners across distant
places.
Positive Impacts of Online Platforms on Education

FLEXIBILITY
Learners are able to manage their
tasks and resources on their own terms
and environment.
Positive Impacts of Online Platforms on Education

COOPERATION

Sharing, collaboration, and mutual

benefit are possible for learners and
educators.
Positive Impacts of Online Platforms on Education

PERSONALISATION

Learners can learn lessons at their own pace

and determine the most effective method to
understand concepts and practice skills.
 Online Platforms for Academic Purposes

Digital learning platform is one of the

effective tools to deliver lessons to 21st
century learners.
Commonly Used Platforms for Academic Content
Development

• Social Media
• Blogging Platforms
• Video Hosting Platforms
• Social forum platforms
Social Media Platforms:

• Facebook
• Twitter
• Instagram
• Google+
• LinkedIn
Blogging Platforms:

• Blogger
• Vox
• Xanga
• WordPress
Video Hosting Platforms:

• YouTube
• Vimeo
• Vevo
• Dailymotion
• TikTok
Social Forum Platforms:

• Quora
• Digg
• Mashable
• Reddit
Content Management System
Content Management System

CMS is an application or software that

enables the user to modify and
manage components of a website
through templates, without the need for
technical coding.
Types of Content Management
System
Component Content Management System
Refers to CMS software wherein commands are
dependent on a set of functions from a central repository
working on website pages or tabs.

Manages content at a granular level (component) rather

than at the document level. Each component represents
a single topic, concept or asset (for example an image,
table, product description, a procedure).
Document Management System
Refers to CMS software with
which scanned physical or
digital paperwork is
managed on a cloud
system that enables
electronic workflow.
Enterprise Content Management System

Refers to CMS software with which an

organization, institution, or business
documents and information can be
accessed.
Web Content Management System

Refers to CMS software in which a

user can customize the interface
and features of a personal website.
Examples: Wix, Shopify, WordPress, Joomla
Digital Asset Management System

Refers to CMS software that manages

multimedia content in a library accessible
to users.

A type of software that companies use to

store, organize, find, and share digital
files.
Cloud Computing and File
Management Platforms
What is Cloud Computing?
Cloud Computing refers to computer
services and systems that are used as servers,
databases, and networks over the Internet.
Common Services Using Cloud Computing

● Create cloud applications

● Store, backup, and recover data
● Stream audio and video
● Deliver software on demand
● Test and build applications
● Analyze data
● Embed artificial intelligence
Benefits of Cloud Computing

COST
Expenditures are lessened because
external support from various systems or
developers is rarely needed.
Benefits of Cloud Computing

SPEED
Tasks or activities done with cloud
computing can provide instant output
and take less time.
Benefits of Cloud Computing

GLOBAL SCALE

Resources or content can be shared

across different locations anytime.
Benefits of Cloud Computing

PRODUCTIVITY

Activities learned by AI can be

accomplished by the service, which
aids individuals in producing more
efficient output.
Benefits of Cloud Computing

PERFORMANCE

Enhanced capabilities mirror the users’

needs for effective computing
functions.
Benefits of Cloud Computing

RELIABILITY

Data is stored by programs, allowing

recovery in case of errors.
Benefits of Cloud Computing

SECURITY

Information in the database is supported

safely against data theft and other threats.
Types of Cloud Computing

PUBLIC CLOUD
The infrastructure that users
can access using a web
browser is owned by a third-
party provider.
Types of Cloud Computing

PRIVATE CLOUD

A private network for an

organization accessible
only by members.
Types of Cloud Computing

HYBRID CLOUD

Accessible by both private and

public users, which allows
flexibility.
Types of Cloud Computing

MULTI-CLOUD

External vendors allow usage of visual servers and use multiple

public clouds.

An organization utilizes a combination of clouds, which can be

two or more public clouds, two or more private clouds, or a
combination of both public and private clouds.
There are different types of cloud computing
services that providers offer to their clients and
users depending on their resources or
activities.
TYPES OF CLOUD COMPUTING
 INFRASTRUCTURE AS A SERVICE

A cloud provider will allow a company to rent a

server or storage to employ their company’s set of
systems, strategies, or expertise.
 PLATFORM AS A SERVICE

A cloud provider will provide the resources to a

client or company rather than the server or
storage itself.
 SOFTWARE AS A SERVICE

An application is not installed on the user’s

device but can be accessed over the Internet.
 FUNCTION AS A SERVICE

Known as serverless computing. Components

of computing services will only be used when
needed.
File Management Platform
 Common Features of File Management Platform

● Create, modify, copy, move, and delete files

● View the details such as size and type
● Categorize data
● Access file organization tools
 Types of File Management Platforms

CLOUD-BASED
This online-based file management platform allows
the user to access files over the Internet.
 Types of File Management Platforms

DESKTOP-BASED
This file management platform is installed in
internal servers and can be accessed offline.
 Types of File Management Platforms

PORTABLE-BASED
This file management platform is stored in
compact or movable devices such as flashdisks
or hard drives.
 Benefits of File Management Platforms

● Reduced Storage Space – offers maximization and

cleaning up of storage
● Enhanced Security – allows user to encrypt and
trace data access
● Easier Retrieval – allows instant accessibility to data
through categorization or search
 Benefits of File Management Platforms

● Better Collaboration – enables monitoring among members

with access to the platform
● Better Backup and Disaster Recovery – improvements in file
management platforms show capability to retrieve lost or
corrupted files
● The “Intangibles”
can represent significant values in the users’ work principles
THE END!