Lesson Plan. Preparation

Transcription

1 Lesson Plan Course Title: Principles of Information Technology Session Title: Design Principles Lesson Duration: 6 hours Performance Objective: Upon completion of this assignment, the student will be able to create a well-designed desktop publishing document that incorporates the four design principles and adheres to proper publishing guidelines for typeface choice. Specific Objectives: List and describe characteristics of the four design principles Define the four design principles Identify publishing techniques that demonstrate the four design principles Classify webpage designs according to the design principles demonstrated List categories of font styles Describe characteristics of categories of font style Identify publishing guidelines when choosing font styles Identify techniques for font formatting for printed and electronic publications Create desktop publishing documents that incorporate design principles and guidelines for font style TEKS Correlations: (c) Preparation (3) The student uses emerging technologies to exchange information. The student is expected to (C) demonstrate effective Internet search strategies, including keywords and Boolean logic using various available search engines; (H) demonstrate ethical use of Internet and online resources, including citation of source; (7) The student applies word-processing technology. The student is expected to (A) identify the terminology associated with word-processing software and its functions; (C) edit a variety of text documents using functions such as pagination, appropriate white space, tab settings, and font style, size, and color; (F) produce desktop publishing documents incorporating both text and graphics such as business cards, newsletters with mastheads, and advertisement flyers; (11) The student applies design and web publishing techniques. The student is expected to (C) identify and describe design principles such as contrast, repetition, alignment, and proximity; (D) identify and describe types and styles of typeface used for publications such as serif and sans serif. 1

2 Instructor/Trainer References: Content Developer Knowledge Instructional Aids: Design Principles Presentation Design Principles Notes Organizer Activity #1 Instruction Sheet and scoring rubric Font and Typeface in Design Presentation Font and Typeface in Design Notes Organizer Activity #2 Instruction Sheet and scoring rubric Activity #3 Instruction Sheet and scoring rubric Design Principles and Font Guidelines Exam Design Principles and Font Guidelines Exam KEY Materials Needed: Copies of Organizers, Instruction Sheets, and Exam Equipment Needed: Computer and projector for presentation Computers with Internet access for individual student use Desktop Publishing software Learner Have students browse through printed documents (such as newspapers, magazines, flyer advertisements, etc) and choose one that they think is good and one they think is bad. Have students bring their documents to class the next day. Introduction MI Introduction (LSI Quadrant I): SAY, Have you ever been flipping through a magazine and saw a dumb advertisement? Not necessarily because of what it said, but maybe just because of the way it looked at first glance? SAY, Have you ever been flipping through a magazine and saw a cool advertisement? Not necessarily because of what it said, but maybe just because of the way it looked at first glance? SAY, Have you ever wondered what made that advertisement dumb or what made it cool? Ask a few of the students to stand up and show off the documents they brought to demonstrate their idea of good and bad. Ask them to name at least one thing that makes it good or bad in their opinion. Optional: Have two students make lists on the board of the things the students say as being good and bad. 2

3 Outline MI Outline (LSI Quadrant II): Instructor Notes: I. Students list the four design principles (slide 3) II. Students define the four design principles (slides 4-7) III. Students list characteristics of and identify publishing techniques that demonstrate the four design principles (slides 8-17) Introduce the four design principles using the Design Principles Presentation. Speaker notes are provided to aid the instructor with content. Hand out the Design Principles Notes Organizer (1) per student to aid them in note taking during your presentation. Encourage the students to comment and discuss the issues on each slide. Activity #1: Also listed in guided practice below IV. Students classify webpage designs according to the design principles demonstrated Use slide 19 of the Design Principles Presentation to explain Activity #1, or hand out the Activity #1 Instructions and scoring rubric document. V. Students list categories of font styles (slide 3 of Font and Typeface Presentation) VI. Students describe characteristics of font style categories (slides 4-7) VII. Students identify publishing guidelines when choosing font styles (slides 8-11) VIII. Students identify font formatting techniques for printed and electronic publications (slides 12-16) Introduce font guidelines using the Font and Typeface Presentation. Speaker notes are provided to aid the instructor with content. Hand out the Font and Typeface Notes Organizer (1) per student to aid them in note taking during your presentation. Encourage the students to comment and discuss the issues on each slide. Activity #2: Also listed in guided practice below Use slide 20 of the Font and Typeface Presentation to explain Activity #2, or hand out the Activity #2 Instructions and scoring rubric document. 3

4 MI Activity #3: Also listed in Independent Practice below IX. Students create desktop publishing documents that incorporate design principles and font style guidelines Application Instructor should demonstrate how to use the word processing program or the desktop publishing program to create documents incorporating text and graphics. Hand out the Activity #3 instructions and scoring rubric document. Review the instructions for the assignment and the grading criteria. Guided Practice (LSI Quadrant III): Activity #1 Use slide 19 of the Design Principles Presentation to explain Activity #1 or handout the Activity #1 Instructions and scoring rubric document. Students will use the Internet to locate web pages that represent the four design principles. They will create a document with screen snapshots of the web pages and justify why they classified that webpage as representative of that design principle. As students browse the Internet and create their documents, instructor should walk around to offer feedback and reteach concepts to individuals as needed. Activity #2 Use slide 20 of the Font and Typeface Presentation to explain Activity #2, or hand out the Activity #2 Instructions and scoring rubric document. Students will edit the document created in Activity #1 by identifying the categories of font style(s) used on the web pages displayed in the screen snapshots. As students edit their documents, instructor should walk around to offer feedback and reteach concepts to individuals as needed. MI Independent Practice (LSI Quadrant III): Activity #3 Students create desktop publishing documents that represent the four design principles as well as adhere to the font guidelines. Summary 4

5 MI Review (LSI Quadrants I and IV): In pairs, have students write down the lists of items from the Introductory activity and categorize the good and bad by placing them into groups according to the design principles or font guidelines. Ask different students to share some of their thoughts with the class. Evaluation MI Informal Assessment (LSI Quadrant III): Discussion comments during introduction and presentations of design principles and font guidelines Guided practice activities MI Formal Assessment (LSI Quadrant III, IV): Activity #3: Creation of desktop publishing documents. Use scoring rubrics to grade. EXAM: Questions over the design principles and font guidelines Extension MI Extension/Enrichment (LSI Quadrant IV): Have students locate a poorly designed yellow pages ad from the phone book and use a word processing program or desktop publishing program to redesign the ad so that it adheres to all four design principles as well as the font style guidelines. 5

6 Icon MI Teaching Strategies Verbal/ Linguistic Logical/ Mathematical Visual/Spatial Musical/ Rhythmic Bodily/ Kinesthetic Intrapersonal Interpersonal Lecture, discussion, journal writing, cooperative learning, word origins Problem solving, number games, critical thinking, classifying and organizing, Socratic questioning Mind-mapping, reflective time, graphic organizers, color-coding systems, drawings, designs, video, DVD, charts, maps Use music, compose songs or raps, use musical language or metaphors Use manipulatives, hand signals, pantomime, real life situations, puzzles and board games, activities, roleplaying, action problems Reflective teaching, interviews, reflective listening, KWL charts Cooperative learning, roleplaying, group brainstorming, cross-cultural interactions Personal Development Strategies Reading, highlighting, outlining, teaching others, reciting information Organizing material logically, explaining things sequentially, finding patterns, developing systems, outlining, charting, graphing, analyzing information Developing graphic organizers, mindmapping, charting, graphing, organizing with color, mental imagery (drawing in the mind s eye) Creating rhythms out of words, creating rhythms with instruments, playing an instrument, putting words to existing songs Moving while learning, pacing while reciting, acting out scripts of material, designing games, moving fingers under words while reading Reflecting on personal meaning of information, studying in quiet settings, imagining experiments, visualizing information, journaling Studying in a group, discussing information, using flash cards with other, teaching others Naturalist Existentialist Natural objects as manipulatives and as background for learning Socratic questions, real life situations, global problems/questions Connecting with nature, forming study groups with like-minded people Considering personal relationship to larger context 6

7 Design Principles Notes Organizer A. List the four design principles in the first column of the table below. B. Define each design principle in the second column of the table below. Design Principle Definition A method of design which the differences between that are ; it purposely brings out differences to set things in. Repetition A method of design which purposely elements or aspects of elements the same. A method of design which uses properties to determine the optimal of objects or of objects. Proximity A method of design which uses spatial properties to purposely place items. C. Contrast: to be effective, it needs to be. Can be demonstrated using,,,. D. Two colors that create the strongest contrast are and. 7

8 E. Besides color, font can be changed in these ways to create contrast:,,. F. Repetition: items must have obvious. Can be demonstrated using,,. G. Using images for repetition: Using an exact copy of a clip art image, even creates unity. Using different images but with a common theme is. H. Alignment: Items must have obvious spatial. Needs to be visually noted instantly to be effective. All items should significantly the purpose of the publication. Element placement should never be. I. Alignment: Can be demonstrated using object, text, line spacing and object size. J. Proximity: Provides for the viewer. All elements are supportive of main purpose. Elements are then divided into subgroups. Items related to each subtopic should be spatially grouped in an arrangement. K. Can be demonstrated using,, Objects or Alignment. 8

9 Design Principles Activity #1 Instructions: 1. Using the Internet, navigate to various websites that demonstrate use of the four design principles. 2. Place a copy of the screen snapshot of that webpage into a word processing document. a. Resize the snapshot if needed. 3. Above the snapshot, place a label to identify the design principle represented by that page. 4. Beneath the snapshot, create a textbox. a. The textbox should contain text that displays the definition of the design principle listed. b. Include an of how the snapshot represents that principle. 5. Save your document in your student folder as Design Evaluation. TECHNICAL 9-10 Points 6-8 Points 4-5 Points 0-3 Points Awarded All 4 displayed, Fewer than 4 All 4 displayed, Screen snapshots are size or displayed, size resized, easy to None displayed displayed accurately readability not or readability read optimal not optimal Screen snapshots are labeled correctly for design principle All 4 labeled correctly 2-3 labeled correctly 1 labeled correctly None labeled correctly Justification for contrast is correct Thorough Adequate Minimal Slight Justification for repetition is correct Thorough Adequate Minimal Slight Justification for alignment is correct Thorough Adequate Minimal Slight Justification for proximity is correct Thorough Adequate Minimal Slight Overall format/ appearance TOTAL POSSIBLE POINTS: 70 Your document will be graded according to the following criteria: Your Grade (total points awarded) 9

10 Font and Typeface Notes Organizer A. List the four font categories in the first column of the table below. B. Define each design principle in the second column of the table below. C. Sketch an example of a letter for that font category in the third column of the table below. Font Category Serif Definition There are decorative at the end of the for each. Example There is a(n) of short tips at the end of the for each letter. The letters appear to be handwritten. Ornamental The letters have a style that sets it apart, having a(n) design element into the lettering. D. While serif font is a good choice for publications, some say it is easier to read in paragraph format due to the serifs on the bottom of the letters creating an unseen connection, but giving the reader a visual to follow when reading. E. However, because of the in the tips, you should never choose two different font styles within this category for the same of 10

11 your publication. It gives the reader a sense of choppiness and good reading flow. F. Some viewers believe that font is easier to view than serif; however, if information is printed from the site, it still needs to be easily read in printed format. G. Ornamental fonts are also called fonts due to their unique decorativeness. They are used and for the sake of decoration. You should never choose a decorative font to type a of information. Use them only for main or a(n) getter. H. Rule of thumb in deciding formatting options: Do not choose two font styles from the category; it rather than contrasts. I. You should never use or category fonts for paragraph text because it is far too difficult to read. J. To create without changing the font style choice, try using all for a heading, but you should never use that for a full of text. K. Or you could change the of an object to create contrast. 11

12 Font & Typeface Guidelines Activity #2 Instructions: 1. Open the document created in Activity #1. 2. Analyze the text/font shown on the webpage screen snapshot. 3. Next to each snapshot, create a textbox. a. List the number of categories of font displayed on each of the pages. b. List the name of category of font displayed on each of the pages. 4. Save the changes to your document. Print or send an electronic copy according to your instructor s directions. Your document will be graded according to the following criteria: TECHNICAL 9-10 Points 6-8 Points 4-5 Points 0-3 Points Awarded Font Category Font Category Font Category Font Category Number of font categories Count given for Count given for Count given for Count given for all 4 displayed 3 images is 2 images is 0-1 images is images is correct correct correct correct List of font categories displayed Font Category List given for all 4 images is correct Font Category List given for 3 images is correct Font Category List given for 2 images is correct Font Category List given for 0-1 images is correct Overall format/ appearance TOTAL POSSIBLE POINTS: 30 Your Grade (total points awarded) 12

13 Design Principles Activity #3 Instructions: 1. Using a word processing program or desktop publishing program, design the following items. 2. As you design each item, be sure to incorporate the four design principles and follow the font guidelines learned. 3. Design a business card for yourself to include the following: a. Size: 2in X 3.5in (can be portrait or landscape) b. First and last name, job title, name of business or company, phone number of business, address of business, at least one image, and at least one drawing object. c. Save this document to your student folder as BusinessCard. 4. Flyer advertisement to include the following: a. Announce a Day after Thanksgiving Day sale. b. Size of flyer: 8.5in X 5.5in (can be portrait or landscape) c. Name, address, phone number, and website of store having the sale. d. Dates and times of sale and hours of operation for the store. e. List some of the items on sale with their original price, percentage off, or marked down price. f. Offer a coupon or extra incentive to get customers to just come in and browse. g. Include 3 images and 2 drawing objects. h. Save this document to your student folder as ThanksgivingAd. 5. Two page newsletter to include the following: a. Size: 8.5in X 11in b. Name, address, phone number, and website address of your school displayed in a masthead across the top of all columns on first page. c. Must format for at least 2 columns of text on both pages. d. Minimum of 4 graphics/images with captions to include i. your school mascot ii. a student, teacher, or administrator iii. a campus event e. Minimum of 5 different articles/stories within the newsletter. Articles may be about sports events, club meetings, fundraisers, career fairs, student of the week, teacher of the year, etc. f. Each article must have a title and relevant text. Text should be in complete sentences. g. Demonstrate at least 2 drop caps within the article text. h. Justify the text within the columns. i. Include page numbers. j. Save this document to your student folder as SchoolNews. 13

14 6. Create a new word processing document and save it to your student folder as DesignExplained. a. Create a title for the page. b. Create three headings for Business Card, Flyer Advertisement, and Newsletter. c. Beneath each heading, list Contrast, Repetition, Alignment, Proximity, and Font guidelines. d. Beneath each design principle, list the ways in which you incorporated each principle into the design of your publications. e. Beneath the font guidelines, list the guidelines you adhered to while designing your publications. 7. Create a new word processing document and save it to your student folder as DesignCover. a. Design a cover page to properly present your publications. b. Be sure to include a title, page border, student first and last name, date, and course name. 8. Print items 3-6 in color. 9. Print item 7 in color and double side the printing so that the second page prints on the back side of the first page. (Be sure that the second page does not print upside down. The text on each side should point up towards the same edge of the sheet of paper.) 10. Organize them in this order: DesignCover, DesignExplained, BusinessCard, ThanksgivingAd, SchoolNews. 11. Compile them into a presentation such as a three-brad report folder, single-ring holder, or sliding-bar report cover. You will receive 3 separate grades for this assignment. Your publications will be graded according to the criteria on the attached rubrics. 14

15 Design Principles Activity #3 Scoring Rubric GRADE #1 Includes overall presentation, cover sheet, and design TECHNICAL Points 9-12 Points 5-8 Points 0-4 Points OVERALL APPEARANCE & ORGANIZATION DESIGN EXPLAINED - CONTRAST DESIGN EXPLAINED - REPETITION DESIGN EXPLAINED - ALIGNMENT DESIGN EXPLAINED - PROXIMITY FONT GUIDELINES EXPLAINED thorough & includes elements in all 3 publications thorough & includes elements in all 3 publications thorough & includes elements in all 3 publications thorough & includes elements in all 3 publications thorough & includes elements in all 3 publications thorough & includes elements in at least 2 publications thorough & includes elements in at least 2 publications thorough & includes elements in at least 2 publications thorough & includes elements in at least 2 publications thorough & includes elements in at least 2 publications TOTAL POSSIBLE POINTS: 90 adequate & includes elements in all 3 publications adequate & includes elements in all 3 publications adequate & includes elements in all 3 publications adequate & includes elements in all 3 publications adequate & includes elements in all 3 publications adequate & includes elements in fewer than 3 publications adequate & includes elements in fewer than 3 publications adequate & includes elements in fewer than 3 publications adequate & includes elements in fewer than 3 publications adequate & includes elements in f than 3 publications TOTAL POINTS EARNED Your Grade (total points awarded) 15

16 Design Principles Activity #3 Scoring Rubric GRADE #2 Includes Business Card and Thanksgiving Sale Advertisement TECHNICAL 9-10 Points 7-8 Points 4-6 Points 0-3 Points TOTAL POINTS EARNED OVERALL APPEARANCE SIZE & COLOR OF CARD & FLYER COLOR CHOICES IN CARD & FLYER BUSINESS CARD BUSINESS CARD DESIGN PRINCIPLES DEMONTRATED BUSINESS CARD FONT GUIDELINES FOLLOWED ADVERTISEMENT ADVERTISEMENT ADVERTISEMENT DESIGN PRINCIPLES DEMONTRATED ADVERTISEMENT FONT GUIDELINES FOLLOWED Size is correct & Printed in color Size is incorrect & Printed in color Size is correct NOT Printed in color Size is incorrect NOT Printed in color Contains all required elements Contains most required elements Contains few required elements Contains random elements Contains all required text elements Contains all required graphic elements Contains most required text elements Contains most required graphic elements Contains few required text elements Contains few required graphic elements Contains random text elements Contains random graphic elements TOTAL POSSIBLE POINTS: 100 Your Grade (total points awarded) 16

17 Design Principles Activity #3 Scoring Rubric GRADE #3 Includes Newsletter TECHNICAL 9-10 Points 7-8 Points 4-6 Points 0-3 Points OVERALL APPEARANCE MIN. 2 COLUMNS & 2 PGS PRINTING: SIZE, COLOR & DOUBLE SIDED COLOR CHOICES IN NEWSLETTER MASTHEAD, GRAPHICS, & CAPTIONS 5 ARTICLES: TITLE & TEXT CONTENT 5 ARTICLES: GRAMMAR & SPELLING DROP CAPS, TEXT ALIGNMENT, & PAGE NUMBERS CONTRAST & REPETITION DEMONSTRATED ALIGNMENT & PROXIMITY DEMONTRATED Printed: correct size, in color, double sided, top edges match Printed: correct size, in color, double sided, 2 nd page upsidedown Printed: double sided Printed: NOT double sided Contains all required elements Contains most required elements Contains few required elements Contains random elements TOTAL POINTS FONT GUIDELINES FOLLOWED TOTAL POSSIBLE POINTS: 100 Your Grade (total points awarded) 17

18 NAME: DESIGN PRINCIPLES AND FONT GUIDELINES EXAM Multiple Choice Instructions: Fill in blank preceding each question, using the letters A-D to represent which answer choice is best for the given question. 1. Repetition is A Choosing the different font styles within the same category B Purposely duplicating elements or aspects of elements within the same document C Alignment of clipart to appear behind the text D Using an ornamental font style for title text 2. Which of the following creates a sense of conflict in printed design? A Using an ornamental font style for title text B All of these C Choosing the same font style for the entire publication D Choosing different font styles within the same category 3. The four basic design principles are A Repetition, Proximity, Contrast, Arrangement B Repetition, Choice of Font style, Paste options, Alignment C Proximity, Alignment, Repetition, Contrast D Color choices, Realistic images, Approximation, Printing options 4. Alignment can be demonstrated using which of the following methods? A text direction B line spacing C all of these D element rotation 5. Acceptable ways to create contrast using text are A Bold, size variations, color variations, shading behind text B All of these C Alignment of clipart to appear behind the text D Using a gradient or pattern as a background fill on a textbox 6. A design method in which spatial properties are used to determine the optimal 18

19 placement of objects or groups of objects is A Proximity B Approximation C Arrangement D Alignment 7. Which of the following font categories should you choose for body text of a webpage? A Script B Sans Serif C Ornamental D Serif 8. Which of the following font categories should you avoid when creating long paragraphs of text? A Script and Ornamental B Serif and Sans Serif C Only Script D Only Ornamental 9. Which text choice below would be the best for keying a sentence you want to get noticed? A Using all capital letters B Changing each word to be a different color C Highlighting the text in bright yellow D Using bold 10. A method of design that uses spatial properties to purposely place related items together is A Proximity B Approximation C Arrangement D Alignment Matching Instructions: Fill in column A below, using the letters A-D to name the font category represented in the given questions. A Serif B Sans Serif C Script D Ornamental 11. Letters that appear to be handwritten 12. This category is sometimes called decorative 13. Letters having short decorative tips at the end of each stroke 19

20 14. This font style category is 15. This font style category is 16. Letters that incorporate a common artistic design element 17. This font style category is 18. This font style category is 19. Letters that do NOT have short decorative tips at the end of each stroke 20. This font style category is 5 PTS BONUS Explain and give an example of using contrast in design. 20

21 NAME: DESIGN PRINCIPLES AND FONT GUIDELINES EXAM KEY Multiple Choice Instructions: Fill in blank preceding each question, using the letters A-D to represent which answer choice is best for the given question. B D C C A 1. Repetition is A Choosing the different font styles within the same category B Purposely duplicating elements or aspects of elements within the same document C Alignment of clipart to appear behind the text D Using an Ornamental font style for title text 2. Which of the following creates a sense of conflict in printed design? A Using an ornamental font style for title text B All of these C Choosing the same font style for the entire publication D Choosing different font styles within the same category 3. The four basic design principles are A Repetition, Proximity, Contrast, Arrangement B Repetition, Choice of Font style, Paste options, Alignment C Proximity, Alignment, Repetition, Contrast D Color choices, Realistic images, Approximation, Printing options 4. Alignment can be demonstrated using which of the following methods? A text direction B line spacing C all of these D element rotation 5. Acceptable ways to create contrast using text are A Bold, size variations, color variations, shading behind text B All of these C Alignment of clipart to appear behind the text D Using a gradient or pattern as a background fill on a textbox 21

22 D B A D 6. A design method in which spatial properties are used to determine the optimal placement of objects or groups of objects is A Proximity B Approximation C Arrangement D Alignment 7. Which of the following font categories should you choose for body text of a webpage? A Script B Sans Serif C Ornamental D Serif 8. Which of the following font categories should you avoid when creating long paragraphs of text? A Script and Ornamental B Serif and Sans Serif C Only Script D Only Ornamental 9. Which text choice below would be the best for keying a sentence you want to get noticed? A Using all capital letters B Changing each word to be a different color C Highlighting the text in bright yellow D Using bold A 10. A method of design which uses spatial properties to purposely place related items together is A Proximity B Approximation C Arrangement D Alignment 22

23 Matching Instructions: Fill in column A below, using the letters A-D to name the font category represented in the given questions. A Serif B Sans Serif C Script D Ornamental C 11. Letters that appear to be handwritten D 12. This category is sometimes called decorative A 13. Letters having short decorative tips at the end of each stroke B 14. This font style category is A 15. This font style category is D 16. Letters that incorporate a common artistic design element C 17. This font style category is D 18. This font style category is B 19. Letters that do NOT have short decorative tips at the end of each stroke C 20. This font style category is 5 PTS BONUS Explain and give an example of using contrast in design. Purposely emphasizing the differences in elements or objects. Example: setting the title font on a page to be bold, several point sizes larger than body text, and aligned center. 23