image

• An Image is a representation of

  the external form of

  a person or thing in art.
• Images may be 2-dimensional, such as a photograph or screen display, or 3-

  dimensional, such as a statue

  or hologram. They may be captured by

  optical devices - such as cameras,

  mirrors, lenses, telescopes, microscopes, etc. and natural objects and phenomena, such as the human eye or water.
• Graphics - are visual images or designs on

  some surface, such as a wall, canvas, screen,

  paper, or stone to inform, illustrate, or entertain
• Examples of graphics

  1. Photographs
  2. Drawings
  3. line art
  4. graphs
  5. typography
  6. numbers
  7. symbols
  8. geometric designs
  9. maps
  10. computer graphics
• Image format

  1. Joint Photographic Experts Group (JPEG) - does not support transparency and animation (jpeg or jpg)
  2. Graphics Interchange Format (GIF) - supports transparency and animation (.gif)
  3. Portable Networks Graphics (PNG) - supports transparency but not in animation (.png)
• Layout- is part of graphic design that

  deals in the arrangement of visual elements on a page.
• Infographics - Information graphics or infographics are used to represent information, statistical data, or knowledge in a graphical manner usually done in a creative way to attract the viewer's attention.
• Basic principles of graphics and layout

  1. Balance. The visual weight of objects, texture, colors, and space is evenly distributed on the screen.
  2. Emphasis. An area in the design that may appear different ni size, texture, shape or color to attract the viewer's attention.
  3. Movement. Visual elements guide the viewer's eyes around the screen.
• Basic principle of graphics and layout 4. Pattern. Builds course. It builds

  familiarity and

  organizes design for trouble-free

  viewing.

  5. Repetition. makes design aware. It brings consistency and flow to the design.

  6. Proportion.

  Conveys stability. It involves scaling of

  various elements to create a coherent

  design.
• Basic Principles of Graphics and Layout

  7. Harmony. Brings elements closer. It utilizes familiar traits of design elements and puts them into focus.

  8. Contrast. Addresses conflict. It highlights the difference and puts an emphasis to what is important.

  9. Variety. Reaps attention. It adds flavor to the design, making it

  more interesting and engaging.
• 5 PRINCIPLESINMAKINGANEFFECTIVE INFOGRAPHIC DESIGN:

  1. Be Unique
  2. Make It Simple
  3. Be Creative and Bold
  4. Less is More
  5. The Importance of Getting it Across
• Infographic Video - is

  a visual representation of data and knowledge in the form of an online video.
• 3 IMAGE MANIPULATION PRINCIPLES

  1. Choose the right file format. Try to make a real-life photograph into GIF to see the difference between PNG, GIF, and JPEG. Knowing the purpose is the key to finding out the best file format.
  2. Choose the right image size. A camera with 12 megapixels constitutes to a bigger image size. Monitors have a resolution limit, so even if you have a million megapixels, it wil not display everything.
  3. Caption it. Remember to put a caption on images whenever possible. If it is not related to the web page, then remove it.
• 9 IMAGE MANIPULATION TECHNIQUES

  1. Cropping. Cutting parts away to remove distracting or irrelevant elements.
  2. Color Balance. The ambience and the tone of light of the picture (ex. Warm or cool light)
  3. Brightness and Contrast. One of the most basic techniques in image editing, making the image darker or lighter.
• 9 IMAGE MANIPULATION TECHNIQUES

  4. Compression and

  Resizing. The higher the quality and the larger the photo is, the bigger the file size of the picture is.

  5. Filters. Making the image look sketched, grainy, classic black and white or even let it have neon colors. This gives your image a twist from its original look.

  6. Cloning. Copying or duplicating a part of an image.
• 9 IMAGE MANIPULATION TECHNIQUES

  7. Changing the Background. Adding background to make your image stand out.

  8. Removing the Color. Removing certain colors in your image or desaturating the color of the image.

  9. Combining Text, Graphics and Image. Adding multiple elements in your layout.
• Image hosting website

  • Google+ Photos

  • Flickr

  • Smugmug

  • Imgur

  • 500px

  • Photobucket

  • Amazon Prime Photos

  • DropBox

  • Chevereto

  •Imageshack