2.

Fill out the Sign up page with the

IMAGING AND DESIGN information needed; alternatively, you can
FOR ONLINE connect with Google+ or Facebook.
3. Once you have created an account and
ENVIRONMENT logged in, click Create New on the upper
right hand corner of the screen, then select
EMPOWERMENT TECHNOLOGIES
infograhic, then a template that you want.
4. The Piktochart editor will open (may
BASIC PRINCIPLES OF GRAPHICS take a while depending on your Internet
AND LAYOUT connection). The Dashboard contains your
1. BALANCE - the visual weight of objects, previously created visuals. On the left hand
texture, and colors, and space is evenly corner contains your options of what visual
distributed on the screen. you want to create: Infographics,
2. EMPHASIS - area in the design that may presentations, or printables.
appear different in size, texture, shape of 5. While editing a block, you can use the
color to attract the viewers’ attention. various tools on the left side if the page:
3. MOVEMENT - visual element that guides a) Graphics - allows you to insert lines,
the viewer’s eyes around the screen. shapes, icons, and even photos.
4. PATTERN, REPETITION, AND RHYTHM - b) Uploads - allows you to browse and
the repeating visual element in an image or upload images from your local disk for your
layout to create unity in the layout or infographic.
image. Rhythm is achieved when visual c) Background - changes the background
elements create a sense of organized of a selected block
movement. d) Text - allows you to insert a text to
5. PROPORTION - visual element that your infographic with the option to add text
creates a sense of unity where they relate frames.
well with one another. e) Color Scheme - allows you to modify or
6. VARIETY - uses several design elements create new color schem of your infographic.
to draw viewers’ attention. f) Tools - allows you to create charts
similar to the ones in PowerPoint, maps (for
demographics), and videos.

INFOGRAPHICS EDITING TIPS:

 Double-click a textbox to edit its content.
Information graphics or infographics are  When working with objects, the toolbox
used to represent information, statistical on top of the block allow you to manipulate
data or knowledge in a graphical manner it.
usually done in a creative way to attract the  When working with the charts, double-
viewer’s attention. It makes complex data click the chart to open the database editor.
more visually appealing to an average user.  You may rename the title or your
infographic in the top toolbar.
CREATING INFOGRAPHICS USING
PIKTOCHART

1. Create a Piktochart account by

going to www.piktochart.com. Click sign
up on the upper right corner of the
page.
 efficient. PhotoScape is a good tool because
ONLINE IMAGE FILE it is feasible for beginners and advanced
FORMAT users alike.

Unlike images that are found in our

computer, you have to consider that
CREATING AND MANIPULATING
website images should be more IMAGES USING PHOTOSCAPE
compressed because data travels over the On PhotoScape’s main screen, you will see
internet and not everyone has a fast its various features that you can use for
internet connection. Consequently, we creating web content as follows:
have to use compressed images on our
websites. 1. Viewer: view photos in your folder;
create a slideshow
There are plenty of other image file formats 2. Editor: resizing, brightness and color
used in the web but most of the time you adjustment, white balance, backlight
will be using these three (jpeg, gif, png) correction, frames, balloons, mosaic mode,
because of their compatibility with all adding text, drawing pictures, cropping,
major web browsers. filters, red eye removal, blooming, paint
brush, clone stamp, effect brush
When inserting text to a web page, you can 3. Batch editor: batch edit multiple photos
simply copy a text to your HTML editor, or 4. Page: Merge multiple photos on the page
you can upload it on a website as a PDF file. frame to create one final photo
Most browsers support “add-ons” so that 5. Combine: Attach multiple photos
you can open PDF files without leaving the vertically or horizontally to create one final
browser. photo.
6. Animated GIF: use multiple photos to
create a final animated photo
PRINCIPLES AND BASIC 7. Print: Print portrait shots, carte de visites
(CDV), passport photos
TECHNIQUES OF IMAGE 8. Splitter: slice a photo into several pieces
MANIPULATION 9. Screen capture: capture your screenshot
and save it
Tips to help you edit your images for your 10. Color Picker: zoom in on images, search
websites: and pick a color
1. Choose the right file format. Try to make 11. Rename: change photo file names in
a real-life photograph into GIF to see the batch mode
difference between PNG, GIF, and JPEG. 12. Raw converter: convert RAW to JPG
Knowing the purpose is the key to finding 13. Paper print: pring lined, graph, music,
out the best file format. and calendar paper
2. Choose the right image size. A camera 14. Face search: find similar faces on the
with 12 megapixels constitutes to a bigger internet
image size. Monitors have resolution limit,
so even if you have a million megapixels, it
will not display everything.
3. Caption it. Remember to put a caption on
EDITOR EDIT
images whenever possible. If it is not
related to the web page, then remove it. 1. Open Photoscape then choose
"Editor."
There are plenty of image manipulation
tools, but if you are going to create a
website, you have to use the one which is
2. Choose the folder where the image 1. Select the folder where your photos are
you want to manipulate is located using located, then on the preview window, drag
the file explorer. the photos you want to be part or the batch
3. Once you have selected the file, you edit to work area (center).
2. Use the tools on the right to edit your
will see a preview of all the images
photo. This is similar to the options in edit
found on that folder at the bottom of
except the Crop and Tools tab which area
the file explorer. replaced by the Filters tab. Filters tab is
4. From the preview, select the images used to add filter that will apply to all your
you want to use. The image will now be photos.
shown on a much bigger preview inside 3. Resize the pictures so that they do not
your work area similar to what it is exceed 800 pixels in width. Add filters if you
shown. want.
5. Notice the property of the image, like 4. Click on Convert All button found on the
the file name, the image size (in pixels), upper right.
and the file size found on the bottom of 5. The Save dialog box will appear, which
will allow you to change the location, the
the preview
name of the images, and the file type.
6. Manipulate the images using the
tools on the bottom:
a) Home Tab - this is where you can
add a frame, resize, sharpen, and add INSERTING,
filters and effects to your image.
b) Object Tab - this is where you can
UPLOADING, AND
place a wide variety of images like texts, SHARING PHOTOS ON
shapes, and symbols.
c) Crop - this is where various tools THE INTERNET
can be found in order to properly crop
an image to a desirable size. Image hosts - are websites specializing in
d) Tools - includes other tools like red storing photographs. These photographs
eye correction, mole removal, mosaic can easily be embedded to a webpage or
effect, and brush tools. website.
7. Click Save located on the lower right
of the program. The Save As dialog box
will appear. Save it in your folder with
the file name editorexeryourname.jpg.
Check the file name and see how much
space you saved.

BATCH EDIT
Batch editing is one of the most useful tools
when trying to easily manipulate all images
at the same time. This is most useful when
you create a gallery of photos for a website.
You can make their sizes uniform to what
you have specified.