Table of Contents



Math-in-CTE Lesson Plan

|Lesson Title: Digital Imagery |Lesson # IT07 |

|Occupational Area: Information Technology |

|CTE Concept(s): Photo editing |

|Math Concepts: Ratios and proportions |

|Lesson Objective: |Students will be able to adjust the dimensions of a given graphic using proportions, scale factors, |

| |ratios and conversion without skewing or distorting a graphic. |

|Supplies Needed: |Digital image editing tool (Paint), loose leaf paper, web browser with internet access or digital |

| |graphic, Digital Camera |

|Link to Accompanying Materials: |Information Technology IT07 Downloads |

|The "7 Elements" |Teacher Notes |

| |(and answer key) |

|1. Introduce the CTE lesson. |Picture Puzzle: Print out a large graphic (multiple |

|Students will do the Picture Puzzle. |pages, ideally 9). Make one copy for each group of 2 or 4|

|How many of you have used a digital camera? How many of you have |students in your classroom. Have the students put |

|emailed or received a digital graphic? Have you ever downloaded an |together the puzzle. |

|image that is too large to be viewed on your screen? | |

|What makes up a digital graphic? | |

| |Pixels make up digital graphics. Pixels are dots of color|

| |grouped together to form an image. More pixels per inch |

| |(dpi) allows for a higher quality graphic for printing or|

| |displaying. |

| | |

|Do you know how to find the resolution and size (in pixels) of a |Graphics with fewer pixels per inch are more “transfer |

|given graphic? |friendly” and can be used on websites or electronically |

| |transferred. |

| | |

| |To find resolution and size, first download your graphic.|

| |Then right-click on it and click properties. Click on the|

| |summary tab to see the resolution and size of the |

| |graphic. |

| | |

| |*Unless otherwise noted, all inches are linear, not |

| |square (length, not area). |

| |*dpi is Dots per Inch (or pixels per inch) |

|2. Assess students’ math awareness as it relates to the CTE lesson. | |

| | |

|Why is it important to keep the same ratio (height to width) of a | |

|graphic when changing its size? |If you don’t maintain this ratio, the image will be |

| |skewed. |

|What do you know about ratios? Have you used ratios and proportions | |

|to convert units? How can we relate this idea to pixels and graphic | |

|sizes? |A ratio is a comparison of 2 quantities (numbers) by |

| |division. It may be written three ways: 1/100 or 1 to |

|What math could you use to change the size? Can you come up with an |100 or 1:100. |

|example of where you could use it in this class? | |

| |A proportion is a statement of form: |

| |A = C _ |

| |B D Use cross-multiplication to |

| |solve. |

| | |

|You have a graphic that has a width of 500 pixels and a resolution of|A · D = C · B |

|96 pixels per inch (dpi). How many inches wide is the graphic? | |

| | |

| |500 pixels = 96 pixels |

| |x 1 inch |

| | |

| |500 pixels · 1 inch = 96 pixels · x |

| |500 pixel inches = 96x pixels |

| | |

| |divide both sides by 96 pixels |

| | |

| |500 pixel inches = x |

| |96 pixels |

| | |

| |5.21 inches = x |

| |x = 5.21 inches in width |

| | |

|Have you ever ordered a photo from the photo kiosk and had it |You can use the same steps to find the height of the |

|enlarged? How about when you’ve tried to print a digital picture at |graphic. |

|home and you wanted it a little bigger? What was it measured in? | |

| |Usually it’s measured in % (though not always). For |

| |instance, a photo that is twice as tall and twice as wide|

| |would be said to be enlarged by 200% for both the height |

| |and width. A photo that is shrunk down to half as tall |

| |and half as wide has a stretch of 50% for both height and|

| |width. |

| |We can find this number by taking the new height (or |

| |width) and dividing it by the original height (or width).|

|I have a graphic that is 350 pixels high and I need it to fit an area| |

|that is 613 pixels high. What would the stretch % be? | |

| |When the resulting answer is greater than 1 (or greater |

| |than 100%), we know our image is being enlarged. When it |

| |is less than 1 (or 100%), we know it is being reduced in |

| |size. |

| | |

| |Stretch % = New height |

| |Old height |

| | |

| |= 613 pixels _ |

| |350 pixels |

| | |

| |= 1.75 = 175% |

|3. Work through the math example embedded in the CTE lesson. | |

| | |

|We are going to replace the head of George Washington on the provided| |

|Mt. Rushmore image. Here are the steps: | |

| | |

|Have the students calculate the height and width of a picture of |Walk around and take a photo of each student while |

|themselves taken on a digital camera. |working at their station. This photo should be taken |

| |with high resolution (1 to 5 megapixels) to allow for |

| |resizing and extra assignments. |

|Have the students use the free-form select tool (lasso) to remove the| |

|background of the image and save only the head. | |

| | |

|Copy the image and paste it to a new Paint document. Calculate the |This answer is 1.42” by 1.42”. |

|size your head needs to be to fit into the space where George | |

|Washington’s head is (That space is 115 pixels both high and wide). |115 pixels = 81 pixels |

|(The resolution in paint is 81 dpi after cropping, not 96dpi). |X 1 inch |

| | |

| |115 pixels · 1 inch = 81 pixels · x |

| |115 pixel inches = 81x pixels |

| | |

| |divide both sides by 81 pixels |

|In Paint, select Image and click Attributes. Make the calculated | |

|changes to height and width. This will make it so your head will fit |115 pixel inches = x |

|into the space where George’s head was. |81 pixels |

| | |

|Finally, copy the photo and paste it onto the Mt. Rushmore image in | |

|Paint. Drag your image into a location so that it covers George’s | |

|face. Deselect the DRAW OPAQUE option in the Image menu. This removes| |

|the white background. | |

| | |

| | |

| | |

|4. Work through related, contextual math-in-CTE examples. | |

| |2 inches (h) = 7 inches (h)_ |

| |3.5 inches (w) x (w) |

|You all need to create a power point presentation in this class. | |

|You’ve been looking on the internet and found a perfect image for the|2 inches · x = 7 inches · 3.5 inches |

|title page of your presentation. The only problem is: the image is |2x inches = 24.5 inches2 |

|only 2 inches high and 3.5 inches wide. You need it to be 7 inches |divide both sides by 2 inches |

|high to look good. | |

|How wide will the image be? |24.5 inches2 = x |

| |2 inches |

| | |

| |x = 12.25 inches |

| | |

| |So, the width would be 12.25 inches |

|5. Work through traditional math examples. | |

| | |

|Let’s do a quick example. Everybody take out a sheet of paper (the |The paper should be 5.5” high and 4.25” wide. Now the |

|paper is 8.5” x 11”). Now, if I wanted to keep the paper the same |height is ½ as high, and the width is ½ as wide, so our |

|shape, or the same RATIO of height to width, but I needed it to be |scale factor is ½. We can use the scale factor in |

|only 5.5” tall, how wide should it be? Work with folding the paper |calculations for our digital graphics. |

|and use the ruler. | |

| |The paper is now only ¼ the size of the original sheet. |

|What happened to the paper? Now the height is ½ as high, and the |Keep this in mind for the website: if you want something |

|width is ½ as wide, but do we have a ½ sheet of paper? This is how |to take up ½ the space, you can’t just cut the height in |

|our graphics are going to work. |half and expect it to work that way. |

| | |

| | |

| | |

| | |

|If a car is going 60 miles per hour, how long would it take to go 200|60 miles = 200 miles |

|miles? |1 hour x cross multiply |

| | |

| |6o miles · x = 200 miles · 1 hour |

| |divide both sides by 60 miles… |

| |x = 200/60 |

| | |

| |x = [pic] hours |

| |x = 3 hours and 20 minutes |

| | |

|6. Students demonstrate their understanding. | |

| | |

|Have students go out into the internet and find a school-appropriate |Model solutions after the examples. Answers will vary |

|graphic they like. Have the students determine the resolution and |depending on the resolution. |

|calculate the pixels required to create a picture that will fit a 4” | |

|x 6” frame. | |

| | |

|7. Formal assessment. | |

|My computer has a viewable area of 12” high by 14” wide. My |The viewable area is unnecessary to answer the problem. |

|resolution is set at 120 dpi. I will be creating a header for my | |

|personal web site. The header needs to be 2” high and 10” wide. How |Height: |

|many pixels high and how many pixels wide should my header be? |120 pixels = x |

| |1 inch 2 inches |

| | |

| |x = 240 pixels |

| | |

| |Width: |

| |120 pixels = x _ |

| |1 inch 10 inches |

| | |

| |x = 1200 pixels |

| | |

................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download