Use of Shapes in Graphic Design

A Presentation by: ADMEC Multimedia Institute

Use of Shapes in Layout Designing

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

Preface & Acknowledgment Dear Reader, ADMEC Multimedia Institute is growing institute which is providing industry oriented training to the world at large. Being a multimedia institute we offer training for creating or designing content for information technology also.

This presentation is one of the best presentations from our study material for our weekly workshops which ADMEC conducts every week at the center. We want to share this with the world so that everyone can take benefits from our efforts.

This presentation contains very good information for “Use of Shapes in Graphic Design�.

We express thanks to many books and websites, specially Google for making it one of the best presentations of all the time.

Thanks Ravi Bhadauria, Instructor (Web and Visual Designing) Director ADMEC Multimedia Institute http://www.admecindia.co.in

Tough Words of the Today's Workshop You must know the meaning of the following words to understand the meaning and use of shapes in design properly. ●

Evolution

●

Rigidity

●

Direction

●

Stability

●

Conformity

●

Purpose

●

Peacefulness

●

Solidity

●

Fertility

●

Protection

●

Equality

●

Expansion

●

Infinity

●

Security

●

Transformation

●

Feminine

●

Strength

●

Mystical

●

Masculine

●

Movement

●

Intention

●

Rationale

●

Aggression

●

Projection

●

Trust

●

Spiritually

●

Trinity

●

Uniformity

●

Progression

●

Exudes

What are you going to learn today? ● ● ●

● ● ● ●

What is the Shape?

Meaning of Shapes Why Shapes are Important?

Types of Shapes Use of Shapes Use of Line Projects

The Meaning Of Shapes â—?

What do you feel when you see a circle? A square? A triangle? And A heart shape?

The Meaning of Shapes â—?

Are you affected the same when seeing an object with soft gentle curves as you are when seeing another object with sharp jagged edges?

The Meaning of Shapes â—?

Shapes have very special meanings and are an important building block in the visual grammar and visual thinking.

The Grammar of Shapes ●

●

●

● ●

Shape by definition is a portion of space delimited by the perimeter.

Shapes are two-dimensional areas with a recognizable boundary.

They can be open or closed, angular or round, big or small.

Shapes can be organic or inorganic.

They can be free-form or geometric and ordered.

How to Get a Shape? â—?

â—?

Shapes can be defined by their color or by the combination of lines that make up their edges.

Simple shapes can be combined to form complex shapes. Complex shapes can be abstracted to make simple shapes.

How to Get a Shape?

For Instance, following given basic geometric shapes can be used to create many shapes. I have created a girl.

How to Get a Shape?

How to Get a Shape?

Shapes are powerful to give universal messages.

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

The Line Lines are the simplest yet the most important element of Graphic Design.

What is the Line?

Line is a section connecting 2 points.

An Use of Line You would be amazed how many things you can communicate using just few lines.

Arrangement of lines is vital. It may help you to lead the viewer to the basic concept of the work.

An Use of Arrow in Real Design

The Line Styles Line can have variable width and styles such as solid and dashed.

The Line Types and Patterns A pattern is something that repeats in a design.

Repetitive but still interesting.

Please click for more samples: https://www.google.co.in/search?biw=13 66&bih=583&tbm=isch&sa=1&q=pattern+lin es&oq=pattern+lines&gs_l=img.3...35620 .36541.0.36688.8.7.0.0.0.0.167.296.0j2 .2.0....0...1c.1.64.img..6.2.295.54Bjt MlHZwY

The Line Endings Type The ending may be blunt, curved, and ragged.

Blunt

Curved

Ragged

Use of Line Lines can be used to create textures and shapes.

Use of Line

Lines can be used to create textures and shapes.

Use of Line Lines can be used in a design to manage the followings: Connect ● Separate ● Organize ● Create Movement ● Provide Texture ● Convey a Mood or Emotion ● Define Shapes ● Provide Emphasis ●

Use of Line Example of Separate:

Use of Line

1. Connect

Use of Line

2. Separate

Use of Line 3. Organize

Why Shapes are Useful? ●

●

●

The different characteristics of a shape convey different moods and meanings.

Changing the characteristics of a shape alter how we perceive that shape and make us feel differently about a design.

Shapes are a powerful way to communicate.

The Use of Shapes Designers use shapes to: ●

● ● ● ●

●

Organize information through connection and separation Symbolize different ideas Create movement, texture, and depth Convey mood and emotion Emphasize and create entry points and areas of interest Lead the eye from one design element to the next

Types of Shapes There are 3 basic types of shapes

Or Natural

Want to become an expert designer???

- Contact -

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED

- Visit Our Websites www.admecindia.co.in www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

1. Geometric Shapes Geometric shapes are what most people think of as shapes.

Circles, squares, triangles, diamonds are made up of regular patterns that are easily recognizable. This regularity suggests organization and efficiency. It suggests structure.

Geometric shapes tend to be symmetrical further suggesting order.

Geometric Shapes Real Examples

Geometric Shapes Real Examples

Geometric Shapes Real Examples

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

2. Natural/ Organic Shapes They are irregular. They have more curves and are uneven. They tend to be pleasing and comforting. A good example can be a outline of tree leaf and ink blob also a natural Shape. All of shapes found in nature such as leaves, rocks, and clouds are organic shapes and these shapes add interest and reinforce themes.

2. Natural/ Organic Shapes

Often designers use natural shapes to improve and enrich the view of geometric shapes.

2. Natural/ Organic Shapes Real Example

2. Natural/ Organic Shapes Real Example

3. Abstract Shapes

Abstract shapes have a recognizable form, but are not real. They are stylized or simplified versions of organic shapes.

Icons are abstract shapes to represent ideas and concepts.

The Meaning of Shapes as Abstract There are truly an endless variety of shapes and combination of shapes, each communicating its own meaning and message.

Often the meaning behind shapes is cultural (a red octagon as a stop sign), particularly as shapes are combined.

The Meaning of Shapes as Abstract

Abstract Shapes Real Example

Abstract Shapes Real Example

Abstract Shapes Real Example

Negative and Positive Shapes Shapes can be either positive or negative. They can be figure or they can be ground.

Positive shapes occupy positive space. The area around positive shapes, the background, is negative space. A solid piece of layout occupies space, and makes the space around it come to life.

Role of Negative and Positive Shapes Positive and negative space play an important role in determining the overall composition in a work of art.

By understanding positive and negative space and applying your knowledge, you can become more successful in designing your compositions.

What is Positive and Negative Space?

Simply, positive space is best described as the areas in a work of art that are the subjects, or areas of interest.

Negative space is area around the subjects, or areas of interest.

What is Positive and Negative Space?

Mostly Negative Space

Balance of Positive and Negative space

Mostly Positive Space

Lets Talk about few Popular Shapes

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

Circle or Circular Shapes

Circles have no beginning or end. They represent the eternal whole and in every culture are a certain type of form representing the sun, the earth, the moon, the universe, and other celestial objects between.

Circles are used to suggest familiar objects such as wheels, balls, many kinds of fruit. They suggest well-roundedness and completeness.

Circles can be used in...

Circles have free movement. They can roll. Circles are graceful and their curves are seen as feminine. They are warm, comforting and give a sense of sensuality and love.

Their movement suggests energy and power. Their completeness suggests the infinite, unity, and harmony.

Circles can be used in...

Circles can be used in Logos and Posters

Circles can be used in...

Circles as a big logo getting all the attention to the studio’s name.

Circles can be used in...

Big circles thumbs to show you a bit of Jarad’s work.

Circles can be used in...

The logo is a circle and the same circular idea was used in the top left side of the header to draw attention to the artist’s bio.

Circles can be used in...

Beautiful circular elements all over the page. From foreground and background to navigation buttons.

Real Examples of the Use of Circles

Real Examples of the Use of Circles

Real Examples of the Use of Circles

Rectangle and Square Shapes

Squares and rectangles are stable. They’re familiar and trusted shapes and suggest honesty. They have right angles and represent order, mathematics, rationality, and formality. Rectangles are the most common geometric shape encountered. The majority of text we read is set in rectangles or squares.

Where can be Used

Squares and rectangles suggest conformity, peacefulness, solidity, security, and equality. They are generally not attention getters, but can be tilted to add an unexpected twist.

Every element on a web page is defined by a rectangle according to the css box model. Web pages are rectangles made up of smaller rectangles and squares.

Where can be Used All most all the texts presented to us are organized in squares and rectangles.

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

Squares and Rectangles can be used in

Two squares framing the main content.

Squares and Rectangles can be used in

Beautiful squared portfolio. Each square guests darker when you hover them.

Squares and Rectangles can be used in

Another good example of squared thumbs to organize content.

Squares and Rectangles can be used in

Different sided rectangles dispose the content in nice illustrated/images thumbs.

Squares and Rectangles can be used in

Big framed rectangle showing a nice image, getting the main attention of the page.

Squares and Rectangles can be used in

Rectangles to organize and display content.

Squares and Rectangles can be used in

Different sized rectangles to better organize content.

Squares and Rectangles can be used in

Combination of rectangle thumbnails and hover effect to organize the content and create a nice layout.

Squares and Rectangles can be used in

Elegant grid layout based on rectangle thumbnails.

Squares and Rectangles can be used in

Our eyes are drawn to the blocks because the shapes and the colors are attractive and interesting. Shape can certainly be one of the strongest design elements.

Squares and Rectangles can be used in

Squares and Rectangles can be used in

Squares and Rectangles can be used in

Squares and Rectangles can be used in

Triangle or Triangular Shapes

It expresses actions and dynamism. A triangle can convey either a sense of strength or conflict. By definition, a triangle is a simple shape with three sides and three points which exudes strength, movement and the future.

Triangles can be stable when sitting on their base or unstable when not.

They represent dynamic tension, action, and aggression. Triangles have energy and power. They are balanced and can be a symbol for law, science, and religion.

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

Uses of Triangular Shapes Triangle Suggests

FUTURISTIC

ACTION Spiritually they represent the religious trinity.

The strength of triangles suggests masculinity. Their dynamic nature make them better suited to a growing high tech company than a stable financial institution when designing a logo. Triangles can be used to convey progression, direction, and purpose.

Use of Triangles

Use of Triangles

Use of Triangles

Use of Triangles

Use of Triangles

Use of Triangles

Use of Triangles

Please visit this url for more 50 examples: http://abduzeedo.com/50-awesome-examples-tria ngles-design

Shapes in Layout Design A Presentation by: Ravi Bhadauria

R

ADMEC MULTIMEDIA INSTITUTE Leader in Animation & Digital Media Education ISO 9001 : 2008 CERTIFIED www.admecindia.co.in | www.graphic-design-institute.com Phones: +91-9811-8181-22, +91-9911-7823-50

Spirals

Spirals are expressions of creativity. They are often found in the natural growth pattern of many organisms and suggest the process of growth and evolution. Spirals convey ideas of fertility, birth, death, expansion, and transformation.

They are cycles of time, life, and the seasons and are a common shape in religious and mystical symbolism.

Use of Spirals Spirals move in either direction and represent returning to the same point on life’s journey with new levels of understanding.

They represent trust during change, the release of energy and maintaining flexibility through transformation.

Clockwise spirals represent projection of an intention and counterclockwise spirals the fulfillment of an intention. Double spirals can be used to symbolize opposing forces.

Use of Spirals in Background Making

Use of Spirals in Vector Arts

Use of Spiral in Nature

Use of Spiral in Icons Making

Use of Spirals in Layouts

Crosses

Crosses symbolize spirituality and healing. They are seen as the meeting place of divine energies. The 4 points of a cross represent self, nature, wisdom, and higher power or being. Crosses suggest transition, balance, faith, unity, temperance, hope, and life.

They represent relationships and synthesis and a need for connection to something, whether that something is group, individual, self, or project related..

Use of Crosses As with lines vertical shapes are seen as strong and horizontal shapes are seen as peaceful. Most everything said about vertical and horizontal lines can be said about vertical and horizontal shapes.

Curved shapes offer rhythm and movement, happiness, pleasure and generosity. They are seen as more feminine than sharp shapes which offer energy, violence and, anger. Sharp shapes are lively and youthful and are seen as more masculine.

Tips for Using Shapes

We use shapes to add interest in a design. Shapes of different visual weight can be used to create focal points in a design and direct the flow of a design. Shapes organize elements by separating some and connecting others.

Tips for Using Shapes Shapes can be used to convey depth by varying their size and position within a design. Larger shapes will appear closer and smaller shapes will appear further away. Shapes that are located lower in a design will seem closer and those higher up further away. Overlapping shapes is another way to create a sense of one in front of the other to add depth to your design.

Tips for Using Shapes Shapes that lean toward a protagonist appear to be blocking or stopping progress. Shapes leaning away from the protagonist give the impression of aiding progress by opening up space. ●

●

●

Try to keep background shapes simple and large. Being large can help attract attention and simplicity can put the focus back to the foreground.

Try to use few shapes where possible. Don’t use 3 or 4 shapes to communicate when one shape will do.

Try to limit the number and size of shapes where possible for clarity in conveying your message.

Click to Explore More Use of Shapes in Web Design http://101webdesigns.com/2013/04/inspirational-examples-of-diagonal-web-design/

Click to explore more designs https://www.google.co.in/search?biw=1366&bih=583&tbm=isch&sa=1&q=broc hure+graphic+design&oq=brochure+graphic+design&gs_l=img.12...0.0.0.51 3367.0.0.0.0.0.0.0.0..0.0....0...1c..64.img..0.0.0.Cdch-iN4Hxg

Projects on Use of Shapes in Designing Theory: What are the shapes? ● Why shapes are so important for good designing? ● How many types of shapes are there? Please Explain with examples. ● What is a circle expresses and how it is useful for designers? ● Can you name out 10 brands' name using triangles? ● What are the differences between circle and triangle in designing? ● Collect 5-5 samples of design for at least 10 shapes. ●

Practical: Create a Poster or Web Template or Book Cover using one or more shapes. Don't forget to create all 3 layout phases.

Email me at: info@admecindia.co.in

Want to be an expert designer?

Contact Us

ADMEC MULTIMEDIA INSTITUTE Want to read more on visual designing, please visit http://www.graphic-design-institute.com

R Helpline 1: +91 9811-8181-22 Helpline 2: +91 9911-7823-50 URL: http://www.admecindia.co.in