Presentation is loading. Please wait.

Presentation is loading. Please wait.

Universal Principles of Design Design for Technologists By Misty La Rosa.

Similar presentations

Presentation on theme: "Universal Principles of Design Design for Technologists By Misty La Rosa."— Presentation transcript:

1 Universal Principles of Design Design for Technologists By Misty La Rosa

2 1.Advanced Organizers 2.Alignment 3.Cognitive Dissonance 4.Defensible Space 5.Fibonacci Sequence 6.Mnemonic Devices 7.Operant Conditioning 8.Veblen Effect Eight principles of design have been highlighted in this presentation. More principles of design can be found in the Universal Principles of Design reference book by William Lidwell, Kritina Holden, and Jill Butler. The most recent edition published was in 2010.


4 Advanced Organizer Definition & The Reasons Why they are Important Advance Organizers... are statements, activities, or graphic organizers that help the learner anticipate and organize new information. are used at the beginning of lessons in which new information is to be learned. often call on prior knowledge, to connect new learning to an existing cognitive structure. indicate to the learner what information from a lesson will be important.

5 Advanced Organizers provide a road map for students that help guide them along their path of learning. It sets the stage for the upcoming instruction to hold more meaning for the student and enables the student to more easily grasp and retain the concepts they will be learning. What are the different types of Advanced Organizers? Expository describes the new content Narrative presents new information in a story format Skimming skim material before reading Graphical Organizers pictographs, descriptive, patterns, concept patterns and more…

6 How to Use Graphic Organizers

7 There are an abundance of Advanced Organizer resources available on the world wide web. Here are a few, most of them free, resources that provide excellent advanced organizers that will help students draw upon their prior knowledge and create a hook for the lesson to come. Please take a few minutes to look over some of the links to see the many resources they provide. Advanced Organizers Online Resources Daily Teaching Tools Ed Helper Eduplace Enchanted Learning Freeology Teacher Printables Teacher Vision Teach-nology Student Handouts Super Teacher Worksheets


9 Alignment Alignment prevents there from being chaos in the design. Type and graphics should be aligned in relation to each other in a way that makes your layout easier to read, establishes familiarity and consistency and creates excitement. A design should look clean, neat, and orderly.

10 Example of Improper Alignment of a Business card. There is no left, right, or center alignment of the text and images. Correct Alignment: The business card is now edge aligned both left and right and the name is center aligned. The logo has been enlarged, is centered and is applied as a water mark. The composition is balanced and like information is grouped together such as the contact information.


12 4 Types of Horizontal Alignment CenterLeft RightJ U S T I F I E D

13 Long paragraphs need to be left aligned so that it is easier for the eye to follow the edge line. Center Alignment is good for a few lines of text, but should not be used for long paragraphs.

14 Visual Alignment is another way to use alignment. This is aligning elements based on the way it looks. Hanging punctuation is an one example of visual alignment. Ignoring the quotation marks and aligning the rest of the text is more visually appealing. Pushing the quotation mark outside the left edge eliminates awkward white space. Better: Align text, ignoring the quotation mark. Not so good: Alignment using the quotation mark creates awkward white space..

15 This is an example of breaking alignment purposefully to bring attention to a specific element on the page and creates contrast. All other text is aligned.

16 Edge Alignment lines up text or objects along their top, bottom, left, or right edges. Center Alignment may be horizontally or vertically aligned, or both. The center axis is used to align elements

17 Visual or Optical Alignment Visual or optical alignment fixes some of the problems that can occur with other types of alignment due to the varying shapes of letters and graphics. In visual alignment the objects may not be precisely aligned but to the eye they appear lined up. It is visually better to line up the V with the bottom point than to use the top left of the swirl. It is better to ignore the swirl that is sticking out past the text line.

18 Here is an example of how to layout a website design that is easy on the eye and helps maintain consistency and usability among different websites.

19 There are Grid Systems available on the market that can help you establish and maintain alignment. Below are just a few that are available. Grid Designer960 Grid System

20 Flex Box Grid Responsive design capability is built into this Flex Layout Box Model or Flexbox for short Grid System.

21 Online Resources About Alignment About Tech: Alignment is an online resource has 7 articles about Alignment that can be used as a reference. Print Wand Graphic Design tips and tutorials Vanseo Design Tech Republic


23 Cognitive Dissonance Leon Festinger 1957 Definition: People have a drive to live in harmony with their beliefs, ideas, and behavior. Sometimes people hold conflicting ideas that cause negative feelings. This disharmony creates the motivation for us to change our beliefs, ideas, or behavior to accept the new information that has been presented. If the person can not resolve the conflict of contrasting beliefs, they may experience negative side effects such as blaming, denying, and justifying. These behaviors are coping mechanisms that protect the self.

24 Cognitive Dissonance Why is this important? Learning is a relatively permanent change in behavior due to experience or the acquisition of new information. Sometimes learning new information or having new experiences can cause Cognitive Dissonance. It is the thought or feeling that this experience or information is not what was previously known or expected. Based on the new information, the person will either accept what they have learned and make it their own or reject the information. Cognitive Dissonance theory applies to situations involving attitude formation and change. Cognitive Dissonance may be experienced in the decision-making and problem-solving processes.

25 Two factors influence the intensity of the dissonance: 1.The number of dissonant beliefs 2.The importance attached to each belief. There are three ways to eliminate dissonance: 1.Reduce the importance of the conflicting beliefs 2.Acquire new beliefs that change the balance. 3.Remove the conflicting attitude or behavior so that they are no longer inconsistent.

26 The next slide is a TED presentation from a human factors expert, Ash Donaldson who was trained to be a pilot. The video is 19:17 minutes long and is quite informative with personal stories and real life examples that eloquently explains the concept of Cognitive Dissonance. In one of the instructional videos that was prepared for us, it was mentioned about a conference where the professor was asked to stay an additional day and from that lesson, he learned to always prepare with backup equipment and additional presentation material that can be added or taken out depending on time restraints or needs. This video would be an excellent example of material that can be left in if there was time available to view it or taken out if time was running short. I would have like to have found a quality video to include here that may be a bit shorter, but this one was quite excellent and so it was included. TEDxCanberra - Cognitive Dissonance - Ash Donaldson


28 Kahn Academy Behavior Motivation and Attitudes Cognitive Dissonance

29 In this clip from the Big Bang Theory, Penny and Raj are discussing cow tipping. In India, cows are sacred animals. He expresses to Penny his feelings about cow tipping. Penny’s response to Raj creates a moment of cognitive dissonance from conflicting beliefs. The video continues on, so at the 32 second mark, stop the movie and go to the next slide.




33 Defensible Space Defensible Space has the following qualities: Territorial markers such as personal possessions, borders, or fencing Surveillance opportunities, as indicated by the architecture, informal or formal surveillance Evidence of activity Evidence of ownership The design principle of Defensible Space is important to homeowners, schools, public spaces within communities, and official spaces that must be safe guarded and protected.

34 Crime Prevention Through Environmental Design By Robert A. Gardner, CPP In Robert Gardner’s article Crime Prevention Through Environmental Design, he elaborates on the concepts of Defensible Space, Territoriality, Lighting, Landscape and Physical Security. The next few slides will show images and explanations of these concepts. Please click the link to read the actual article.

35 In relation to the previously mentioned article, I learned of a man who formerly was the police chief for the Houston Police department, He retired from the department and later was placed in charge of security for a local community college. They were having security issues and so he toured the campus and made changes that helped improve the security and thereby lowered the incidences of issues on campus. The hedges were of varying sizes and so he had maintenance cut them all down to 3 feet tall. There was graffiti on the benches and students were hanging out drinking and smoking illegal substances, so he had the benches removed. His actions used the principles of defensible space to improve the security on campus.

36 Landscape Stan Fry's Garden in Peterborough, New Hampshire Landscape hedges provide a defensible space by establishing boundaries of personal or private property. These hedges were created with a unique design making the person really want to take care of their space and defend it.

37 Government Communications Headquarters building in Cheltenham Territoriality The White House The Pentagon. Territoriality is a person’s perception of and relationship with, the environment. A strong sense of territoriality encourages an individual to take control of his or her environment and defend it against attack.

38 Lighting Good lighting is one of the most effective crime deterrents because it maintains visibility. Light discourages criminal activity, enhances natural surveillance opportunities, and reduces fear. Neighborhood Lighting Home Security Lighting Public Spaces Security Lighting

39 Informal Surveillance. Architectural design can minimize visual obstacles and eliminate places of concealment for potential assailants and offer the most protection against crime. Open designs help people feel safer when they can easily see and be seen. Surveillance Surveillance is the primary weapon in the protection of a defensible space. Criminals are less likely to act when there is a high risk of their actions being witnessed. Environments in which citizens can easily see all around in their environment increases the likelihood of criminal acts being observed and reported. Formal Surveillance. Formal surveillance methods, such as closed-circuit television, electronic monitoring, fixed guard posts, and organized security patrols, are normally used only when natural surveillance alone cannot sufficiently protect an area.

40 Defensible Space is also used by Fire Fighters to help protect homes and structures from being engulfed in flames because of brush and debris that helped to fuel the fire. Some places it is a law to maintain A Defensible Space of 100 feet around your home. This space protects the home while providing a safe area for firefighters. Link to Flyer outlining more details in maintaining Defensible Space in regards to fire safety.Flyer


42 Fibonacci Sequence Who was Fibonacci? Fibonacci was Leonardo Bonacci (c. 1170 – c. 1250) also known as Fibonacci (Italian: [Fibonatt ʃ i]), and also known as Leonardo of Pisa. Leonardo Fibonacci—was an Italian mathematician, and was considered "the most talented Western Mathematician of the Middle Ages.” He solved a problem about the growth population of rabbits and from these findings is where the Fibonacci Sequence originated. Definition: A sequence of numbers where each number is the sum of the two previous numbers. Example: 1,1,2,3,5,8,13 and the pattern continues. A visual representation can be seen in the next slide.

43 A Tiling with squares whose side lengths are successive Fibonacci numbers. 1+1 = 2 2+3 = 5 3+5 = 8 The Fibonacci Spiral is produced by drawing circular arcs connecting the opposite corners of squares in the Fibonacci tiling as seen above. This example uses squares sizes of 1, 1, 2, 3, 5, 8, 13, 21, and 34.

44 Fibonacci Sequence Why is it Important? The Fibonacci Sequence is also known as the “Math of God”. It is a growth pattern found all over in nature such as in flower petals, pineapples, pinecones, ocean waves, the spiral of the galaxies and even bones of the human hand and skeleton. The Fibonacci Sequence is closely related to the Golden Ratio. The division of any two adjacent numbers in a Fibonacci sequence produces an approximation of the golden ratio. Evidence of this number sequence can be found in classic poetry, art, music and architecture. It is considered to be one of the most significant patterns in math and design.

45 Fibonacci Sequence in Nature

46 Arthur Benjamin: The Magic of Fibonacci Numbers

47 The Fibonacci Sequence is found in the Human body from the beginning of life.

48 Fibonacci Sequence found In the Human Face

49 Fibonacci Sequence found In the Human Hands

50 The spiraling of new unfurling silver fern fronds is known as Koru in the Māori culture. Natural Fibonacci spiral from an Elephant’s spout. Fibonacci Sequence found in the spiral of the galaxies and in the spiral design of a cactus.

51 More examples of the Fibonacci Sequence found in Nature

52 British National Wildflower Center Architectural application of the Fibonacci Sequence found in the spiral of stairs and walkways.

53 The Nautilus House in Mexico City was built in 2006 by the architect Javier Sensonian from the Arquitectura Organica. Sensonian used bio-architecture and has built whales, snakes and other animals shaped houses. Nautilus was built especially for a family that wanted a house closer to nature.

54 CARLA ASTON Designing beautiful, unique, functional environments. Sterling Silver Nautilus Shell Gravy / Sauce Boat Fibonacci Sequence used in designs for shower drain, hair styles, and a gravy boat. Nautilus Inspired Hair Style

55 Silver Nautilus This scroll was finished in January 2008 and awarded to Muirenn Ingen Aeda. The circle motif comes from the Mira calligraphaiae monumenta, Prague, c. 1560, folio 118. Paper Nautilus Shell Nautilus Designs Created On Paper


57 Mnemonic Device Definition: A Mnemonic Device is something that helps your brain retrieve information by pinning that information to other ideas that are fun, meaningful, and memorable. This can be done through music or jingles, names, expressions or words, models, rhymes, notes, images, connections, or spelling.

58 Mnemonic Device Why is it Important? In education and learning settings, teachers and instructors can use these devices to help their students more easily remember concepts. There are several mnemonic devices that have been around for many years, but this is a skill that you can teach your students, or that you can use yourself to remember important information. Using a Mnemonic Device is like pinning an icon to your task bar because it makes the information more easily retrievable.

59 Scrubs: Remembering Names

60 9 Types of Mnemonics 1.Music FlocabularyFlocabulary is a website that uses hip hop like rhymes to help you create Mnemonic Devices. 3 Times Tables - Learn The Fun Way!

61 The School House Rocks collection in Seasons 1, 2, and 3 uses music to teach many educational concepts. Here is School House Rock’s video on Interjections!

62 9 Types of Mnemonics 2. Name Colors of the spectrum ROY G. BIV Red, Orange, Yellow, Green, Blue, Indigo, Violet. 3. Expression or Word The order of operations for math Please Excuse My Dear Aunt Sally. Parentheses, Exponents, Multiply, Divide, Add, and Subtract 7 Diatomic Elements Ants Have No Fear Of Ice Cold Beer Astatine, Hydrogen, Nitrogen, Fluorine, Oxygen, Iodine, Bromine

63 9 Types of Mnemonics 4. Model 5. Ode or Rhyme 30 days hath September, April, June, and November. All the rest have 31 Except February my dear son. It has 28 and that is fine But in Leap Year it has 29 6. Notes Organization Note Cards: Question on front / Answer on Back Outlines Cornell Note Taking System

64 9 Types of Mnemonics 7. Image This B.A.T. took Depressant Drugs Barbiturates, Alcohol, Tranquilizers

65 9 Types of Mnemonics 8. Connection Horizontal = H The letter H has a line across and Horizontal lines go across Vertical = V Vertical begins with a V and it points down Vertical lines go up and down 9. Spelling A principal at a school is your pal, and A principle you believe or follow is a rule. M-iss-iss-ipp-I I before e except after c

66 Mnemonic Generators There are several Mnemonic Generators out on the Internet. Here are just a few links that you can click on to create your own Mnemonic Device. Flocabulary Mnemonic Generator Remarkable Marbles 10 Free Mnemonic Generators


68 Operant Conditioning Operant Conditioning is important because it is a technique that is used to modify behavior. It is used in animal training, instructional design, video game design, incentive programs gambling devices, counseling and behavioral therapy. The three basic types of are: 1.Positive reinforcement 2.Negative reinforcement 3.Punishment


70 The Big Bang Theory The Big Bang Theory characters are some very educated scientists who use operant conditioning to manage the behavior of their peers. The next two video slides come from this television series and illustrate these concepts in an entertaining way. Some of the comments below the video mention that these videos were assigned as part of their Psychology homework.

71 Positive Reinforcement: Sheldon trains Penny to perform the behavior he desires by using positive reinforcement.

72 Punishment

73 Negative Reinforcement vs. Punishment These two concepts are easily confused and this video does and excellent job of illustrating the difference.

74 Operant Conditioning is important because… Instructional designers and game designers would use this concept to implement immediate positive feedback that was a reward for completing a correct action or getting a right answer, such as “Ding Ding Ding! You got he the answer right! or awarding points. Also, a negative sound may play if the answer was wrong, or points could be deducted if the answer was wrong.


76 Veblen Effect The law of Supply and Demand says that when a price of an item goes up, the demand for that item will drop. The Veblen Effect is the exception to this rule. The greater the price of the item, the greater the demand there is for the item. Thorstein B. Veblen was an American economist and pioneer in the research investigating the relationship between consumption and status seeking. The Veblen goods are named after Thorstein B. Veblen, an american economist, pioneer in the research investigating the relationship between consumption and status-seeking.

77 Veblen Effect Qualities of a Veblen Good: 1.Designer 2.Luxury 3.High Quality 4.Exclusive 5.Limited Edition 6.Higher Price; fewer consumers can afford item 7.Strong Brand Identity 8.Not sold in regular stores

78 Investopedia: Veblen Goods Explained

79 Wine: How price affects perception

80 Benjamin Wallace: The Price of Happiness This video clip comes from the Art – Design and Lifestyle Contemporary Magazine in an Article about Luxury.Art – Design and Lifestyle Contemporary Magazine

81 Why is the Veblen Effect Important? This concept is important to designers because it is about Branding, Brand Recognition and successfully promoting your product. This video provides insight into Michael Kors’ personality and his brand. He is a designer who creates Veblen Goods. He designs sportswear and accessories. His slogan is “American Luxury for Every Day Life”

82 Christian Louboutin $1,395 High Heels $50.00 Nail Polish! Designer Christian Louboutin has released a limited-edition nail polish that costs just as much as a pair of his famous red-bottom shoes. Sold at Sephora, “Starlight” is priced at $675. But there’s a reason why the red holiday nail lacquer comes with such a hefty price tag. The bottle, made with 1,500 hand-applied Strass crystals, is encased in an elegant box with a black lacquered finish. The leather flower detailing is also adorned in crystals, which mirrors Louboutin's $1,395 Pensamoi high heel pumps. Christian Louboutin $675.00 Nail Polish!

83 Here is a quick video showing some insight into Christian Louboutin psyche as a designer as he has a dream about his own shoe line.

84 Now that we have seen who some of the designers are behind Veblen Goods, Let’s now watch who the consumers are of these extravagantly priced products. Here is Arika Sato who loves her new nail polish, shoes, and perfume! MY CHRISTIAN LOUBOUTIN NAIL POLISHES! ♡ @ArikaSato


Download ppt "Universal Principles of Design Design for Technologists By Misty La Rosa."

Similar presentations

Ads by Google