Scribd Logo
Upload

Welcome to Scribd!

  • 1K views

    DEMOBasic Principles of Graphics and Layout.

    Uploaded by

    micai dpb
    The document discusses basic principles of graphics and layout for designing websites and online resources. It identifies key principles such as symmetry, asymmetry, use of text, images, proximity of elements, consistency, emphasis through size and color. It provides examples of layouts and discusses techniques for image manipulation like changing background color, combining multiple images, using shadows, proper sizing, color blending, adding textures and emphasis. The document emphasizes combining text, graphics and images effectively through use of transparent shapes, complementary fonts and shapes, alignment of text and background, and use of clean backgrounds.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd

    DEMOBasic Principles of Graphics and Layout.

    Uploaded by

    micai dpb
    1K views59 pages
    The document discusses basic principles of graphics and layout for designing websites and online resources. It identifies key principles such as symmetry, asymmetry, use of text, images, proximity of elements, consistency, emphasis through size and color. It provides examples of layouts and discusses techniques for image manipulation like changing background color, combining multiple images, using shadows, proper sizing, color blending, adding textures and emphasis. The document emphasizes combining text, graphics and images effectively through use of transparent shapes, complementary fonts and shapes, alignment of text and background, and use of clean backgrounds.

    Original Description:

    EMPOWERMENT TECHNOLOGY

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    The document discusses basic principles of graphics and layout for designing websites and online resources. It identifies key principles such as symmetry, asymmetry, use of text, images, proximity of elements, consistency, emphasis through size and color. It provides examples of layouts and discusses techniques for image manipulation like changing background color, combining multiple images, using shadows, proper sizing, color blending, adding textures and emphasis. The document emphasizes combining text, graphics and images effectively through use of transparent shapes, complementary fonts and shapes, alignment of text and background, and use of clean backgrounds.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Download as pptx, pdf, or txt
    1K views59 pages

    DEMOBasic Principles of Graphics and Layout.

    Uploaded by

    micai dpb
    The document discusses basic principles of graphics and layout for designing websites and online resources. It identifies key principles such as symmetry, asymmetry, use of text, images, proximity of elements, consistency, emphasis through size and color. It provides examples of layouts and discusses techniques for image manipulation like changing background color, combining multiple images, using shadows, proper sizing, color blending, adding textures and emphasis. The document emphasizes combining text, graphics and images effectively through use of transparent shapes, complementary fonts and shapes, alignment of text and background, and use of clean backgrounds.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Download as pptx, pdf, or txt
    of 59

    BASIC PRINCIPLES OF

    GRAPHICS AND LAYOUT


    OBJECTIVES

     Evaluate existing websites and online resources based on the


    principles of layout, graphic, and visual message design.
    Lesson Objectives:
    o identify the principles of graphics and layout
    o create an infographics or poster using the basic principles of
    graphics and layout
    o know the importance layout on imaging and designing for
    online environment
    JUMBLED WORDS
     Group into 3 with atleast 8 to 10 members and fall in line
     The first player will get the strip of paper and a marker on the
    table.
     Clue will flash on the screen
     Rearrange the jumbled letters correctly
     Write your answer on the strip of paper & paste it on the board
     The player should tap the hand of the 2nd player for the next word
     The next player will do the same
    MMSYETRILAC
    LACIRTEMMYSA
    TTXE
    AEIMG
    IXORPMIYT DAN YNOMRHA
    CYNOCSSINET
    LOOCR DNA PASHE
    HPEMSSIA
    Layout
     the process of
    planning and
    arranging
    graphics or text
    in a page or
    book
    SYMMETRICAL
    A layout may be symmetrical where there
    are equal weight of elements on both sides of
    the page.
    ASYMMETRICAL
    A layout may be asymmetrical where there is
    an artistic and different intensity on one side
    of the page.
    TEXT
    The text type
    should be legible,
    appropriate font face,
    and arranged either
    left justified, right
    justified, or centered.
    IMAGE
    The image should be
    proportionate, with
    sharp color and high
    resolution
    The images used
    should have captions
    PROXIMITY & HARMONY
     The elements
    should be closed
    together and not
    scattered and
    arranged apart
    from each other.
    CONSISTENCY
    There should
    be uniformity
    of theme on
    each page.
    COLOR AND SHAPE
     Use color to create
    interest by providing
    variety in design like
    the use of color
    contrast and shapes
    EMPHASIS
     There should be one
    point of interest in a
    page.
     The element to be
    emphasized should
    have a different size,
    color, shape, or
    background
    GROUP ACTIVITY
    Each group will create a poster,
    infographics, invitation card (bigger
    size)
     G1 – infographics
     G2 – invitation card
     G3 - poster
    SAMPLE:

    Poster
    Invitation card
    Infographics
    Group 1 – Invitation card
    Group 2 – Infograhics
    Group 3 – Poster
    Criteria:
    Required elements – 10pts
    Graphics relevance – 10pts
    Attractiveness -10pts
    Teamwork-5pts
    Timeliness-5pts
    FORMATIVE ASSESSMENT
    Hands on:
     Create a brochure about tourist
    attraction in Oriental Mindoro using
    MS Word/MS Publisher. Apply the
    basic principles of graphics and layout.
    PRINCIPLES AND BASIC
    TECHNIQUES OF IMAGE
    MANIPULATION
    TECHNIQUES OF IMAGE
    MANIPULATION
    Background color

     You can change the background if it does not


    match the image or the totality of the presentation

     You can also add effects to the background


    THANK YOU
    Multiple Images

     You can combine multiple images to make a


    point or use to highlight your message someone@example.com
    Shadow

     Using shadow effect will make the


    image realistic
    Proportion

     When combining images, resize the


    image to make it proportionate and
    realistic.
    Blending Color

     You can use color blending to match


    the background with the other
    elements in the page.
    Texture

     Adding texture allows you to blend


    different images.
     Textures add to the depth of your art.
     Blending will allow smooth transition
    on one image to another.
    Emphasis

     There should be a focal point to a


    page that will attract viewers.
     The element you want to emphasize
    should be sharp, big, and most vibrant
    in your design.
    COMBINING TEXT,
    GRAPHICS, AND IMAGES
    TRANSPARENT SHAPES

     Add simple shapes with a slight


    transparency behind your text to clearly
    see the text you want to emphasize.
    FONTS AND SHAPES
     Fonts and shapes should complement
    each other.
     You can use rounded shapes with
    rounded fonts and sharp shapes with
    sharp fonts
    TEXT AND BACKGROUND
     Text and background should be
    aligned to have an organized look.
     You can align text with shapes or
    geometric figures in the image.
    CLEAN AND CLEAR BACKGROUND

     Use clean and clear background for


    the message to be readable.
     Background should not washout your
    message.

    You might also like