SlideShare a Scribd company logo
1 of 14
ELEMENTS OF DESIGN
REPORTER: Rey, Laizel R. -DMAD 3A1
Objective:
> To understand the different Elements of Design.
> To know the different types of Lines.
> The negative and white space of a Shape.
> Volume and Values of Elements of Design.
> To gain knowledge about Colour.
> Textures.
Lines
Lines are strokes connecting two points, and the most basic element of visual design.
We can use them to create shapes, and when we repeat them, we can form patterns that
create textures.
Although simple, lines can possess a large variety of properties that allow us to
convey a range of expressions. For example, lines can be thick or thin, straight or curved,
have uniform width or taper off, be geometric (i.e., look like they are drawn by a ruler or
compass) or organic (i.e., look like they are drawn by hand).
A line can also be implied: that is, suggested
by forming an invisible connection between
other elements. In the logo of the
Interaction Design Foundation, for instance,
the words “Interaction Design Foundation”
around the tree connect to create a
semicircular implied line.
SHAPE
Shapes are self-contained areas, usually formed by lines (although they may also be
formed by using a different colour, value or texture). A shape has two dimensions:
length and width.
We tend to identify objects by their basic shapes, and only focus on the details (such
as lines, values, colours and textures) on closer inspection. For this reason, shapes are
crucial elements that we designers use for quick and effective communication.
Negative and White space
Negative space (also known as white space) is the empty area around a (positive)
shape. The relation between the shape and the space is called figure/ground, where the
shape is the figure and the area around the shape is the ground. We should be aware
that when designing positive shapes, we are also designing negative spaces at the same
time. Negative space is just as important as the positive shape itself — because it helps
to define the boundaries of the positive space and brings balance to a composition.
Some designs make use of negative space to create interesting visual effects. For
example, the famous World Wide Fund for Nature (WWF) logo makes use of the
confusion between positive shape and negative space to create the image of a panda.
Volume
Volume applies to visuals that are three-dimensional and have length, width and
depth. We rarely use volume in visual design, because most digital products end up
being viewed on a 2D screen, although some apps and websites do use 3D models
and graphics. (Technically, though, 3D images viewed on a 2D screen are still 2D
images.)
Volume has 3 dimensions: length, width and depth. This image is a simulation of volume
in 2D graphics.
Value
Value, quite simply, describes light and dark.
Light value vs. dark value: value describes lightness and darkness.
A design with a high contrast of values (i.e., one which makes use of light and dark
values) creates a sense of clarity, while a design with similar values creates a sense of
subtlety. We can also use value to simulate volume in 2D, for instance, by using lighter
values where the light hits the object and darker values for shadows.
Differences in values create clear designs, while designs using similar values tend to look
subtle.
Color
Colour is an element of light. Colour theory is a branch of design focused on the
mixing and usage of different colours in design and art. In colour theory, an
important distinction exists between colours that mix subtractively and colours that
mix additively.
In paint, colours mix subtractively because the pigments in paints absorb light.
When different pigments are mixed together, the mixture absorbs a wider range of
light, resulting in a darker colour. A subtractive mix of cyan, magenta and yellow will
result in a black colour. A subtractive mix of colours in paint and print produces the
CMYK (i.e., Cyan, Magenta, Yellow and blacK) colour system.
In digital design, where the product shows up on a screen, colours mix additively,
since the screen emits light and colours add to one another accordingly. When
different colours are mixed together on a screen, the mixture emits a wider range of
light, resulting in a lighter colour. An additive mix of red, blue and green colours on
screens will produce white light. An additive mix of colours on digital screens
produces the RGB (i.e., Red, Green, Blue) colour system.
We use colours in visual design to convey emotions in and add variety and
interest to our designs, separate distinct areas of a page, and differentiate our work
from the competition.
Texture
Texture is the surface quality of an object.
Texture can be created by a repeated pattern of lines, or by using tiled images of textures. Above, the
diagonal lines add a ‘grip’ effect to an otherwise ‘smooth’ rectangle.
As a designer, you can work with two types of textures: tactile textures, where you can feel the
texture, and implied textures, where you can only see — i.e., not feel — the texture. Most visual designers
will work with implied textures, since screens (at least as far as the state of the art had pushed them by
the mid-2010s) are unable to produce tactile textures.
The app icon designs in iOS 6 and earlier mimic the glossy texture of glass to incite users to tap them.
Later, Apple (in)famously introduced a linen fabric texture to much of its user interface. With the
popularity of flat design (a minimalist style that features clean spaces and two-dimensional, flat
illustrations), the use of textures in visual design would greatly decrease by the mid-2010s — although
they can still be very useful.
THANK YOU

More Related Content

Similar to ELEMENTS-OF-DES-WPS-Office.ppt for collx

Elements and Principles of Design
Elements and Principles of DesignElements and Principles of Design
Elements and Principles of DesignRavi Bhadauria
 
fundamental of arch. element and principle of design.ppt
fundamental of arch. element and principle of design.pptfundamental of arch. element and principle of design.ppt
fundamental of arch. element and principle of design.pptBossGold
 
Principles of Design.pptx
Principles of Design.pptxPrinciples of Design.pptx
Principles of Design.pptxRomdelSmyth
 
Visual composition slideshow-Kyle.S
Visual composition slideshow-Kyle.SVisual composition slideshow-Kyle.S
Visual composition slideshow-Kyle.SCOM1005
 
User Interface that works | Sergiu Puscas | CodeWeek 2015
User Interface that works | Sergiu Puscas | CodeWeek 2015User Interface that works | Sergiu Puscas | CodeWeek 2015
User Interface that works | Sergiu Puscas | CodeWeek 2015YOPESO
 
Practical Lecture 3_Graphics Elements and Principles.pdf
Practical Lecture 3_Graphics Elements and Principles.pdfPractical Lecture 3_Graphics Elements and Principles.pdf
Practical Lecture 3_Graphics Elements and Principles.pdfRAYMONDELIUD
 
Graphic Design Colors
Graphic Design ColorsGraphic Design Colors
Graphic Design ColorsCalvin Nguyen
 
Lecture 1 Advance concept in Visual Graphics
Lecture 1 Advance concept in Visual GraphicsLecture 1 Advance concept in Visual Graphics
Lecture 1 Advance concept in Visual Graphicslucita cabral
 
Bt0077 multimedia systems
Bt0077 multimedia systemsBt0077 multimedia systems
Bt0077 multimedia systemsTechglyphs
 
Introduction to Graphic Design.pdf
Introduction to Graphic Design.pdfIntroduction to Graphic Design.pdf
Introduction to Graphic Design.pdfDigzignDigzign
 
Mahima chaudhary , interior design
Mahima chaudhary , interior designMahima chaudhary , interior design
Mahima chaudhary , interior designMahimaChaudhary41
 
UNIT-2 UI AND UX DESIGN.pptx
UNIT-2 UI AND UX DESIGN.pptxUNIT-2 UI AND UX DESIGN.pptx
UNIT-2 UI AND UX DESIGN.pptxSatishParasa1
 
Design 1 - Powerpoint 1
Design 1 - Powerpoint 1Design 1 - Powerpoint 1
Design 1 - Powerpoint 1tanyalangford
 
Design Overview
Design OverviewDesign Overview
Design OverviewSam Georgi
 
The elements n_principles_of_design new powerpoint with artists works
The elements n_principles_of_design new powerpoint with artists worksThe elements n_principles_of_design new powerpoint with artists works
The elements n_principles_of_design new powerpoint with artists worksrcurammeng1
 
Introduction to Design (Yearbook Class)
Introduction to Design (Yearbook Class)Introduction to Design (Yearbook Class)
Introduction to Design (Yearbook Class)Sam Georgi
 
Basic elements and principles of design
Basic elements and principles of designBasic elements and principles of design
Basic elements and principles of designQanita Tarique
 
1-1 Elements of Design lecture
1-1 Elements of Design lecture1-1 Elements of Design lecture
1-1 Elements of Design lectureDarla Hueske
 

Similar to ELEMENTS-OF-DES-WPS-Office.ppt for collx (20)

Elements and Principles of Design
Elements and Principles of DesignElements and Principles of Design
Elements and Principles of Design
 
fundamental of arch. element and principle of design.ppt
fundamental of arch. element and principle of design.pptfundamental of arch. element and principle of design.ppt
fundamental of arch. element and principle of design.ppt
 
Principles of Design.pptx
Principles of Design.pptxPrinciples of Design.pptx
Principles of Design.pptx
 
Visual composition slideshow-Kyle.S
Visual composition slideshow-Kyle.SVisual composition slideshow-Kyle.S
Visual composition slideshow-Kyle.S
 
User Interface that works | Sergiu Puscas | CodeWeek 2015
User Interface that works | Sergiu Puscas | CodeWeek 2015User Interface that works | Sergiu Puscas | CodeWeek 2015
User Interface that works | Sergiu Puscas | CodeWeek 2015
 
Practical Lecture 3_Graphics Elements and Principles.pdf
Practical Lecture 3_Graphics Elements and Principles.pdfPractical Lecture 3_Graphics Elements and Principles.pdf
Practical Lecture 3_Graphics Elements and Principles.pdf
 
Graphic Design Colors
Graphic Design ColorsGraphic Design Colors
Graphic Design Colors
 
Lecture 1 Advance concept in Visual Graphics
Lecture 1 Advance concept in Visual GraphicsLecture 1 Advance concept in Visual Graphics
Lecture 1 Advance concept in Visual Graphics
 
Bt0077 multimedia systems
Bt0077 multimedia systemsBt0077 multimedia systems
Bt0077 multimedia systems
 
Introduction to Graphic Design.pdf
Introduction to Graphic Design.pdfIntroduction to Graphic Design.pdf
Introduction to Graphic Design.pdf
 
Principles and elements of design
Principles and elements of designPrinciples and elements of design
Principles and elements of design
 
Mahima chaudhary , interior design
Mahima chaudhary , interior designMahima chaudhary , interior design
Mahima chaudhary , interior design
 
UNIT-2 UI AND UX DESIGN.pptx
UNIT-2 UI AND UX DESIGN.pptxUNIT-2 UI AND UX DESIGN.pptx
UNIT-2 UI AND UX DESIGN.pptx
 
Design 1 - Powerpoint 1
Design 1 - Powerpoint 1Design 1 - Powerpoint 1
Design 1 - Powerpoint 1
 
Design Overview
Design OverviewDesign Overview
Design Overview
 
The elements n_principles_of_design new powerpoint with artists works
The elements n_principles_of_design new powerpoint with artists worksThe elements n_principles_of_design new powerpoint with artists works
The elements n_principles_of_design new powerpoint with artists works
 
Introduction to Design (Yearbook Class)
Introduction to Design (Yearbook Class)Introduction to Design (Yearbook Class)
Introduction to Design (Yearbook Class)
 
Basic elements and principles of design
Basic elements and principles of designBasic elements and principles of design
Basic elements and principles of design
 
IVC - Lesson 14
IVC - Lesson 14IVC - Lesson 14
IVC - Lesson 14
 
1-1 Elements of Design lecture
1-1 Elements of Design lecture1-1 Elements of Design lecture
1-1 Elements of Design lecture
 

More from AgripinoVerderaJr2

calculate for Lesson 4 Empower ment.pptx
calculate for Lesson 4 Empower ment.pptxcalculate for Lesson 4 Empower ment.pptx
calculate for Lesson 4 Empower ment.pptxAgripinoVerderaJr2
 
gamedevelopment-devbatch-slideshare-160523134658 (1).pptx
gamedevelopment-devbatch-slideshare-160523134658 (1).pptxgamedevelopment-devbatch-slideshare-160523134658 (1).pptx
gamedevelopment-devbatch-slideshare-160523134658 (1).pptxAgripinoVerderaJr2
 
mediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptxmediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptxAgripinoVerderaJr2
 
MIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptx
MIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptxMIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptx
MIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptxAgripinoVerderaJr2
 
INVENTING THE AVANT GARDEeeeeeeeeee.pptx
INVENTING THE AVANT GARDEeeeeeeeeee.pptxINVENTING THE AVANT GARDEeeeeeeeeee.pptx
INVENTING THE AVANT GARDEeeeeeeeeee.pptxAgripinoVerderaJr2
 
Graphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptx
Graphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptxGraphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptx
Graphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptxAgripinoVerderaJr2
 
FFP CONTINUES for Senior high school sub.
FFP CONTINUES for Senior high school sub.FFP CONTINUES for Senior high school sub.
FFP CONTINUES for Senior high school sub.AgripinoVerderaJr2
 
Sterio operationSTEREO-OPERATION-IN-THE-STUDIO.ppt
Sterio operationSTEREO-OPERATION-IN-THE-STUDIO.pptSterio operationSTEREO-OPERATION-IN-THE-STUDIO.ppt
Sterio operationSTEREO-OPERATION-IN-THE-STUDIO.pptAgripinoVerderaJr2
 
film and video production.pptx
film and video production.pptxfilm and video production.pptx
film and video production.pptxAgripinoVerderaJr2
 
htmltag-140317152334-phpapp01.pptx
htmltag-140317152334-phpapp01.pptxhtmltag-140317152334-phpapp01.pptx
htmltag-140317152334-phpapp01.pptxAgripinoVerderaJr2
 
mediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptxmediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptxAgripinoVerderaJr2
 
serverspaperpresentation-120107050051-phpapp01 (1).pptx
serverspaperpresentation-120107050051-phpapp01 (1).pptxserverspaperpresentation-120107050051-phpapp01 (1).pptx
serverspaperpresentation-120107050051-phpapp01 (1).pptxAgripinoVerderaJr2
 
presentation-template-sample.pptx
presentation-template-sample.pptxpresentation-template-sample.pptx
presentation-template-sample.pptxAgripinoVerderaJr2
 

More from AgripinoVerderaJr2 (19)

calculate for Lesson 4 Empower ment.pptx
calculate for Lesson 4 Empower ment.pptxcalculate for Lesson 4 Empower ment.pptx
calculate for Lesson 4 Empower ment.pptx
 
gamedevelopment-devbatch-slideshare-160523134658 (1).pptx
gamedevelopment-devbatch-slideshare-160523134658 (1).pptxgamedevelopment-devbatch-slideshare-160523134658 (1).pptx
gamedevelopment-devbatch-slideshare-160523134658 (1).pptx
 
mediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptxmediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptx
 
MIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptx
MIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptxMIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptx
MIL PART5mnbkn.,mn,nkjn,mbvjvkjkjblklk.pptx
 
INVENTING THE AVANT GARDEeeeeeeeeee.pptx
INVENTING THE AVANT GARDEeeeeeeeeee.pptxINVENTING THE AVANT GARDEeeeeeeeeee.pptx
INVENTING THE AVANT GARDEeeeeeeeeee.pptx
 
Graphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptx
Graphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptxGraphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptx
Graphic Designer VS Graphic FOR COLLEGE ONLY Artist.pptx
 
FFP CONTINUES for Senior high school sub.
FFP CONTINUES for Senior high school sub.FFP CONTINUES for Senior high school sub.
FFP CONTINUES for Senior high school sub.
 
Sterio operationSTEREO-OPERATION-IN-THE-STUDIO.ppt
Sterio operationSTEREO-OPERATION-IN-THE-STUDIO.pptSterio operationSTEREO-OPERATION-IN-THE-STUDIO.ppt
Sterio operationSTEREO-OPERATION-IN-THE-STUDIO.ppt
 
ANIMATION 2_1.pptx
ANIMATION 2_1.pptxANIMATION 2_1.pptx
ANIMATION 2_1.pptx
 
film and video production.pptx
film and video production.pptxfilm and video production.pptx
film and video production.pptx
 
LESSON 1 3D.pptx
LESSON 1 3D.pptxLESSON 1 3D.pptx
LESSON 1 3D.pptx
 
htmltag-140317152334-phpapp01.pptx
htmltag-140317152334-phpapp01.pptxhtmltag-140317152334-phpapp01.pptx
htmltag-140317152334-phpapp01.pptx
 
DSP 3rd Year.pptx
DSP 3rd Year.pptxDSP 3rd Year.pptx
DSP 3rd Year.pptx
 
BCD3RD YEAR.pptx
BCD3RD YEAR.pptxBCD3RD YEAR.pptx
BCD3RD YEAR.pptx
 
mediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptxmediaandinformationliteracycommunication-160628234720.pptx
mediaandinformationliteracycommunication-160628234720.pptx
 
Server.pptx
Server.pptxServer.pptx
Server.pptx
 
serverspaperpresentation-120107050051-phpapp01 (1).pptx
serverspaperpresentation-120107050051-phpapp01 (1).pptxserverspaperpresentation-120107050051-phpapp01 (1).pptx
serverspaperpresentation-120107050051-phpapp01 (1).pptx
 
presentation-template-sample.pptx
presentation-template-sample.pptxpresentation-template-sample.pptx
presentation-template-sample.pptx
 
FINAL RECORD BOOK.docx
FINAL RECORD BOOK.docxFINAL RECORD BOOK.docx
FINAL RECORD BOOK.docx
 

Recently uploaded

Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfsanyamsingh5019
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactdawncurless
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxiammrhaywood
 
Science 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its CharacteristicsScience 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its CharacteristicsKarinaGenton
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfSoniaTolstoy
 
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxContemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxRoyAbrique
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppCeline George
 
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdfssuser54595a
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Celine George
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Krashi Coaching
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformChameera Dedduwage
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersChitralekhaTherkar
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityGeoBlogs
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptxPoojaSen20
 

Recently uploaded (20)

Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdf
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
Science 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its CharacteristicsScience 7 - LAND and SEA BREEZE and its Characteristics
Science 7 - LAND and SEA BREEZE and its Characteristics
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
 
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxContemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website App
 
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of Powders
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptx
 

ELEMENTS-OF-DES-WPS-Office.ppt for collx

  • 1. ELEMENTS OF DESIGN REPORTER: Rey, Laizel R. -DMAD 3A1
  • 2. Objective: > To understand the different Elements of Design. > To know the different types of Lines. > The negative and white space of a Shape. > Volume and Values of Elements of Design. > To gain knowledge about Colour. > Textures.
  • 3. Lines Lines are strokes connecting two points, and the most basic element of visual design. We can use them to create shapes, and when we repeat them, we can form patterns that create textures. Although simple, lines can possess a large variety of properties that allow us to convey a range of expressions. For example, lines can be thick or thin, straight or curved, have uniform width or taper off, be geometric (i.e., look like they are drawn by a ruler or compass) or organic (i.e., look like they are drawn by hand).
  • 4. A line can also be implied: that is, suggested by forming an invisible connection between other elements. In the logo of the Interaction Design Foundation, for instance, the words “Interaction Design Foundation” around the tree connect to create a semicircular implied line.
  • 5. SHAPE Shapes are self-contained areas, usually formed by lines (although they may also be formed by using a different colour, value or texture). A shape has two dimensions: length and width. We tend to identify objects by their basic shapes, and only focus on the details (such as lines, values, colours and textures) on closer inspection. For this reason, shapes are crucial elements that we designers use for quick and effective communication.
  • 6. Negative and White space Negative space (also known as white space) is the empty area around a (positive) shape. The relation between the shape and the space is called figure/ground, where the shape is the figure and the area around the shape is the ground. We should be aware that when designing positive shapes, we are also designing negative spaces at the same time. Negative space is just as important as the positive shape itself — because it helps to define the boundaries of the positive space and brings balance to a composition.
  • 7. Some designs make use of negative space to create interesting visual effects. For example, the famous World Wide Fund for Nature (WWF) logo makes use of the confusion between positive shape and negative space to create the image of a panda.
  • 8. Volume Volume applies to visuals that are three-dimensional and have length, width and depth. We rarely use volume in visual design, because most digital products end up being viewed on a 2D screen, although some apps and websites do use 3D models and graphics. (Technically, though, 3D images viewed on a 2D screen are still 2D images.) Volume has 3 dimensions: length, width and depth. This image is a simulation of volume in 2D graphics.
  • 9. Value Value, quite simply, describes light and dark. Light value vs. dark value: value describes lightness and darkness.
  • 10. A design with a high contrast of values (i.e., one which makes use of light and dark values) creates a sense of clarity, while a design with similar values creates a sense of subtlety. We can also use value to simulate volume in 2D, for instance, by using lighter values where the light hits the object and darker values for shadows. Differences in values create clear designs, while designs using similar values tend to look subtle.
  • 11. Color Colour is an element of light. Colour theory is a branch of design focused on the mixing and usage of different colours in design and art. In colour theory, an important distinction exists between colours that mix subtractively and colours that mix additively. In paint, colours mix subtractively because the pigments in paints absorb light. When different pigments are mixed together, the mixture absorbs a wider range of light, resulting in a darker colour. A subtractive mix of cyan, magenta and yellow will result in a black colour. A subtractive mix of colours in paint and print produces the CMYK (i.e., Cyan, Magenta, Yellow and blacK) colour system.
  • 12. In digital design, where the product shows up on a screen, colours mix additively, since the screen emits light and colours add to one another accordingly. When different colours are mixed together on a screen, the mixture emits a wider range of light, resulting in a lighter colour. An additive mix of red, blue and green colours on screens will produce white light. An additive mix of colours on digital screens produces the RGB (i.e., Red, Green, Blue) colour system. We use colours in visual design to convey emotions in and add variety and interest to our designs, separate distinct areas of a page, and differentiate our work from the competition.
  • 13. Texture Texture is the surface quality of an object. Texture can be created by a repeated pattern of lines, or by using tiled images of textures. Above, the diagonal lines add a ‘grip’ effect to an otherwise ‘smooth’ rectangle. As a designer, you can work with two types of textures: tactile textures, where you can feel the texture, and implied textures, where you can only see — i.e., not feel — the texture. Most visual designers will work with implied textures, since screens (at least as far as the state of the art had pushed them by the mid-2010s) are unable to produce tactile textures. The app icon designs in iOS 6 and earlier mimic the glossy texture of glass to incite users to tap them. Later, Apple (in)famously introduced a linen fabric texture to much of its user interface. With the popularity of flat design (a minimalist style that features clean spaces and two-dimensional, flat illustrations), the use of textures in visual design would greatly decrease by the mid-2010s — although they can still be very useful.