GRAPHIC DESIGN

The art or skill of combining text and pictures in advertisements,

magazines, or books.
BASIC PRINCIPLES OF GRAPHICS AND LAYOUT
Graphic design is a highly sought-after skill. Society cares about the
way things look, and there is a constant need to produce high-quality
design, whether it’s for advertisements, websites, logos, videos, banners, or
web content. You don’t need to be a pro-designer to create highly
shareable content—especially when adding design elements to photos
you already have is as easy as a couple taps on your phone. Still slick tools
are only part of the puzzle; you still need to develop an eye for what works
visually and what detracts from your message. Here are eight basic
design principles to keep in mind when working with visuals and creating
graphics.

1. ALIGNMENT
Alignment is an important fundamental of design, since it helps
create a sharp, ordered appearance by ensuring the elements
have a pleasing connection with each other. Aligning objects
properly will clean up a design and eliminate the messiness or
sloppiness that can occur when elements are placed randomly.

2. HIERARCHY
When you have multiple elements in a design, you want to make
sure you’re giving extra weight visually to your most important
message. This is called hierarchy and it can be accomplished in a
variety of ways—larger or bolder fonts, placing your most important
message physically higher than other pieces of information, or using
shapes to frame the focal point.

3. CONTRAST
Contrast is an important principle of design because it lets you draw
out the most important elements of a design and add emphasis.
Contrast happens when two design elements are in opposition to
each other, like black and white, thick and thin, modern and
 traditional, etc. Contrast is what helps guide the viewer’s eyes to the
most important parts of your design and helps organize the
information in an easily digestible manner.

4. REPETITION
Repetition is an important design basic because it helps strengthen
the overall look of the design. It also ties together different elements
to help them remain organized and more consistent. Consistency
and repetition is especially important in branding because you want
your particular look to be instantly recognizable.

5. PROXIMITY
Proximity is also helpful in creating organization on a page, since
similar or related elements should be grouped together to create a
relationship between them. Ideally you might cluster the elements
together in a way that helps to declutter the overall design. The
elements don’t need to be clustered together for placement, either
— proximity could mean they are connected visually another way,
such as by color, font, type, size etc.

6. BALANCE
Balance gives a design its form and stability and helps to distribute
the elements evenly throughout your design; this even spacing will
offer an appearance that is professional and attractive instead of
being jumbled and messy. Balance doesn’t mean elements need to
be the same size, or that they must be distributed evenly across the
page — it can be symmetrical or asymmetrical. Symmetrical
balance weights the elements evenly on either sides of the design,
while asymmetrical uses contrast to even out the flow of design (i.e.
dark elements are balanced out by light ones).

7. COLOR
Color is a significant part of design and should be considered
carefully each time you start a new design. Colors are largely
responsible for dictating the mood of a design — each color has
something a little different to say. Green tends to make people think
 of non-profits or the environment, while red causes stormy emotions
like anger, blue is more calming and passive, and yellow creates a
sensation of happiness. You don’t need to study color theory to get
it right. To aid legibility, consider adding a gradient background
behind text, especially if your text color is at all similar. It will help
make your words pop.

8. SPACE
The parts of your design you choose to leave blank are just as
important as the ones you’re filling with colors, text and images.
Negative space creates shape and can help highlight the most
important pieces of information in your design. Never underestimate
the power of simplicity.

PRINCIPLES OF VISUAL MESSAGING DESIGN USING INFOGRAPHICS

INFOGRAPHICS
Information graphics or infographics are graphic visual
representations of information, data or knowledge intended to
present information quickly and clearly. They can improve cognition
by utilizing graphics to enhance the human visual system's ability to
see patterns and trends.

Over the past few years, infographics have become increasingly

popular due to their sharability and visual appeal. There are apps
and websites that style charts and pick fonts and color schemes, but
they're poor substitutes for real infographic design that's more than
just superficial styling. Over the past few years, we've built dozens
of infographics of various complexity for our clients. These best-
practices were developed to help you design outstanding
infographics of your own.

1. COMMUNICATE ONE CENTRAL IDEA

While you can create a beautiful infographic with a smattering of

data points (which might be better termed an infoposter), the most
 illuminating infographics communicate one central idea by layering
and sorting information. They usually require both analytic and
graphic design software, but the output is worth it. These graphics
help show sweeping trends at a glance. Having one central idea
also means having one central focal point on the page.

2. COMMUNICATE THE DATA CLEARLY

A great infographic minimizes the work the viewer needs to do to

understand an idea. That doesn’t mean that the viewer needs to
comprehend every nuance immediately—sometimes the data is
too complex and needs to be explored by the viewer. Nonetheless,
the designer should try and make the message as salient as possible.
In a true data visualization,, the viewer should be able to perceive
relationships in the data by sight alone.

3. CREATE LAYERS.

We like to think of infographics as having 3 layers: “must see,”

“should see,” and “can see.” Information in the “must see” layer is
vital to the comprehension of the graphic and needs to be made
obvious. Information in the “should see” category will help
comprehension and add an interesting layer of insight. Information
in the “can see” category is least important, but gives the viewer a
chance to explore the graphic in greater depth. This third layer can
transform the viewer’s experience dramatically by encouraging a
fun, non-linear exploration of the graphic. That pulls the viewer
deeper into the visualization.

4. MAKE IT EASY TO NAVIGATE.

Colors, layout, and typography should be used consistently to form

a hierarchy that makes the graphic easy to navigate and distinguish
different types of information. A strong legend can also help the
viewer find their way around the graphic efficiently.

5. Keep it beautiful.

There’s no reason data can’t be educational and inspiring. We

subscribe to the school of thought that good design is always
calming and engaging. The right fonts, the right iconography, great
 photography, a good balance of white space, and harmonious
colors all help create a soothing experience for your viewer.

FILE FORMATS FOR IMAGES AND TEXT

FILE FORMAT FOR IMAGES

1. TIFF (also known as TIF), file types ending in .tif

TIFF stands for Tagged Image File Format. TIFF images create very large file
sizes. TIFF images are uncompressed and thus contain a lot of detailed
image data (which is why the files are so big) TIFFs are also extremely
flexible in terms of color (they can be grayscale, or CMYK for print, or RGB
for web) and content (layers, image tags).

TIFF is the most common file type used in photo software (such as
Photoshop), as well as page layout software (such as Quark and
InDesign), again because a TIFF contains a lot of image data.

2. JPEG (also known as JPG), file types ending in .jpg

JPEG stands for Joint Photographic Experts Group, which created this
standard for this type of image formatting. JPEG files are images that
have been compressed to store a lot of information in a small-size file.
Most digital cameras store photos in JPEG format, because then you can
take more photos on one camera card than you can with other formats.

A JPEG is compressed in a way that loses some of the image detail during
the compression in order to make the file small (and thus called “lossy”
compression).

JPEG files are usually used for photographs on the web, because they
create a small file that is easily loaded on a web page and also looks
good.

JPEG files are bad for line drawings or logos or graphics, as the
compression makes them look “bitmappy” (jagged lines instead of
straight ones).

3. GIF, file types ending in .gif

GIF stands for Graphic Interchange Format. This format compresses
images but, as different from JPEG, the compression is lossless (no detail is
lost in the compression, but the file can’t be made as small as a JPEG).

GIFs also have an extremely limited color range suitable for the web but
not for printing. This format is never used for photography, because of the
limited number of colors. GIFs can also be used for animations.

4. PNG, file types ending in .png

PNG stands for Portable Network Graphics. It was created as an open

format to replace GIF, because the patent for GIF was owned by one
company and nobody else wanted to pay licensing fees. It also allows for
a full range of color and better compression.

It’s used almost exclusively for web images, never for print images. For
photographs, PNG is not as good as JPEG, because it creates a larger file.
But for images with some text, or line art, it’s better, because the images
look less “bitmappy.”

When you take a screenshot on your Mac, the resulting image is a PNG–
probably because most screenshots are a mix of images and text.

5. Raw image files

Raw image files contain data from a digital camera (usually). The files are
called raw because they haven’t been processed and therefore can’t be
edited or printed yet. There are a lot of different raw formats–each
camera company often has its own proprietary format.

Raw files usually contain a vast amount of data that is uncompressed.

Because of this, the size of a raw file is extremely large. Usually they are
converted to TIFF before editing and color-correcting.

FILE FORMAT FOR TEXTS

1. .docx
A .docx file is a Microsoft Word XML Format Document file, a kind of
Microsoft Word document. Starting in Microsoft Office 2007,
.docx files became the default file type.
2. .pdf
 A file format that provides an electronic image of text or text and
graphics that looks like a printed document and can be viewed,
printed, and electronically transmitted.
3. .txt
TXT is a file extension for a text file, used by a variety of text editors.
Text is a human-readable sequence of characters and the words
they form that can be encoded into computer-readable formats.
There is no standard definition of a text file,

BASIC IMAGE MANIPULATION

Demonstrate image manipulation using Adobe Photoshop CS4.
Combination of text, graphics and images is recommended.

REFERENCES:
GRAPHICS AND LAYOUT:
https://spark.adobe.com/blog/2016/07/27/8-basic-design-
principles-to-help-you-create-better-graphics/
INFOGRAPHICS
https://en.wikipedia.org/wiki/Infographic
https://infograph.venngage.com/p/221558/basic-principles-of-
graphics-and-layout
http://www.hypothesisgroup.com/blog/2014/11/13/5-principles-of-
great-infographic-design
ONLINE FILE FORMATS:
https://www.ivanexpert.com/blog/2010/05/the-5-types-of-digital-
image-files-tiff-jpeg-gif-png-and-raw-image-files-and-when-to-use-
each-one/
https://www.computerhope.com/issues/ch001789.htm
http://whatis.techtarget.com/fileformat/TXT-ASCII-text-formatted-
data
https://en.wikipedia.org/wiki/Portable_Document_Format
http://ats.immaculata.edu/faq/faq/index.php?action=artikel&cat=
8&id=340&artlang=en