Imaging and Design for
Online Environment
What’s In
The most important part of capturing product photos is the work that happens
AFTER they’re shot. Post-processing can both make up for effects you couldn’t create
during the shoot and enhance the beautiful feature you did capture. It’s essentially the
icing on the cake.
Photo editing encompasses the processes of altering images, whether they are digital
photographs, traditional photo chemical photographs, or illustrations. Traditional analog
image editing is known as photo retouching, using tools such as an airbrush to modify
photographs, or editing illustrations with any traditional art medium.
(Notes taken from https://clippingpathindia.com/blogs/tips/what-is-photo-editing)
What’s New
Graphic software programs
Which can be broadly grouped into vector graphics editors, raster graphics
editors, and 3D modelers are the primary tools with which a user may
manipulate, enhance, and transform images. Many image editing programs are
also used to render or create computer art from scratch.
BASIC OF IMAGE EDITING
RASTER IMAGES are stored in a computer in the form of a grid of picture elements
or pixels.
VECTOR IMAGES such as Adobe Illustrator, Inkscape and etc. are used to
create and modify vector images, which are stored as descriptions of lines, Bezier
curves and text instead of pixels.
DIFFERENCE BETWEEN RASTER AND VECTOR IMAGES
Activity 1: What’s the difference
In your own words, describe the difference between vector format and raster
format.
______________________________________________________________
______________________________________________________________
______________________________________________________________
______________________________________________________________
What Is it
RASTER IMAGES use many colored pixels or individual building blocks to form a
complete image JPEGs, GIFs and PNGs are common raster image types. Almost all of
the photos found on the web and in print catalogs are raster images.
VECTOR IMAGES alternatively, allow for more flexibility. Constructed using
mathematical formulas rather than individual-colored blocks, vector file types such as
EPS, AI and PDF are excellent for creating graphics that frequently require resizing.
3D MODELING (OR MODELLING) is the process of developing a mathematical
representation of any three-dimensional surface of an object via specialized software.
The product is called a 3D model. It can be displayed as a two-dimensional image through
a process called 3D rendering or used in a computer simulation or physical phenomena.
The model can also be physically created using 3D printing devices.
IMAGE FORMATS
Ø JPEG is a commonly used method of lossy compression for digital images, particularly
for those images produced by a digital photography.
Ø PNG (PORTABLE NETWORK GRAPHICS) is a raster graphics file format that
supports lossless data compression.
Ø GIF a lossless format for image files that supports both animated and static images. Ø
BMP is a raster graphics image used to store bitmap digital images Ø EPS used in vectorbased images in Adobe Illustrator.
Ø SVG is an XML-based vector image format for two-dimensional graphics w/ support
for interactivity and animation
Ø .3ds is one of the file formats used by the Autodesk 3Ds Max 3D Modelling, animation
and rendering software.
Ø .fbx is an exchange format, in particular for interoperability between Autodesk products
and other digital content creation software
FEATURES OF IMAGE EDITORS
SELECTION One of the prerequisites for many of the app mentioned below is a method
of selecting part(s) of an image, thus applying a change selectively without affecting the
entire picture
Ø MARQUEE TOOL for selecting rectangular or other regular polygon-shaped regions
Ø LASSO TOOL for freehand selection of a region
Ø MAGIC WAND TOOL selects objects or regions in the image defined by proximity of
color or luminance
LAYERS which are analogous to sheets of transparent acetate, stacked on top of each
other, each capable of being individually positioned, altered and blended with the layers
below, w/o affecting any of the elements on the other layers.
IMAGE SIZE resizing images in a process often called image scaling, making them larger,
or smaller. High image resolution cameras can produce large images which are often
reduced in size for Internet use.
CROPPING creates a new image by selecting a desired
rectangular portion from the
image being cropped. The unwanted part of the image is discarded. Image cropping
does not reduce the resolution of the area cropped.
BEFORE
AFTER
CLONING uses the current brush to copy from an image or pattern. It has many uses:
one of the most important is to repair problem areas in digital photos.
IMAGE ORIENTATION – Image editors are capable of altering an image to be rotated in
any direction and to any degree. Mirror images can be created and images can be
horizontally flipped or vertically flopped. Rotated image usually requires cropping
afterwards, in order to remove the resulting gaps at the image edges.
SHARPENING AND SOFTENING– Sharpening makes images clearer. Too much
sharpening causes grains on the surface of the image. Softening makes images softer
that removes some of the highly visible flaws. Too much causes the image to blur.
SATURATION- is an expression for the relative bandwidth of the visible output from a
light source. As saturation increase, colors appear more “pure.’’ As saturation decreases,
colors appear more ‘’ washed-out.’’
CONTRAST AND BRIGHTENING
Contrast of images and brighten or darken the image. Underexposed images can be often
be improved by using this feature.
Brightening lightens the image so the photo brightens up. Brightness is a relative
expression of the intensity of the energy output of a visible light source.
Adjusting contrast means adjusting brightness because they work together to make a
better image.
PHOTO MANIPULATION
Photo manipulation involves transforming or altering a photograph using various methods
and techniques to achieve desired results. Some photo manipulations are considered
skillful artwork while others are frowned upon as unethical practices, especially when
used to deceive the public, such as hat used for political propaganda, or to make a product
or person look better.
DIFFERENCES
PHOTO EDITING – signifies the regular process used to enhance photos and to create
them ‘’Actual editing simple process’’. Also includes some of the regular programs used
for editing and expose how to use them.
PHOTO MANIPULATION – includes all simple editing techniques and have some
manipulation techniques like erasing, adding objects, adding some graphical effects,
background correction, creating incredible effect, change elements in an image, adding
styles, eliminating blemishes from a person’s face and changing the features of a person’s
body.
Infographics also known as data visualization, information design, and communication
design
•
It is any graphic that display and explains information, whether that be data
or words. When we use the term ‘’infographics’’, we’re using it as a general term
used to describe data presented in a visual way.
•
Infographics are important because they change the way people find and
experience stories. Infographics are being used to augment editorial content on
the web, it creates a new way of seeing the world of data, and they help
communicate complex ideas in a clear and beautiful way.
TYPES OF INFOGRAPHICS
1.
Statistical
2.
Process Flow
3.
Geographic
PROCESS OF MAKING INFOGRAPHICS
1.
Research
a) Know what is needed
b) Take a reference
c) Know the audience
d) Decide the type of infographics
2.
Brainstorm
a) Gather ideas
b) Build thought process
3. Design
Choose your tool and start designing
4. Review
Cross check the data to deliver flawless output
5.
Launch
a) Make it viral
b) Share on social network
BEST PRACTICES WHEN CREATING INFOGRAPHICS
a) Maintain a structure
b) Don’t use more than 3 color pallets
c) Typography matters a lot
d) Include source and references