⏰ Do Now — Start Here
What does the number "1920x1080" mean? Take a guess even if you're not sure.
🎯 Today's Big Question
- What key vocabulary do designers use to describe digital images?
📈 By the End of Today, You Will Be Able To
- Define pixel, resolution, aspect ratio, raster, and vector at a conceptual level (no software yet).
- Estimate and compare image sizes/resolutions using paper grids.
- Explain, in plain language, the difference between a raster image and a vector image.
🧰 What You'll Need
- Graph paper (to represent a "pixel grid")
- Crayons/markers (to color in a mosaic-style pixel picture)
- Printed vocabulary flashcards
- Sorting cards: 10 image examples (photo, logo, icon, screenshot, etc.) for the raster/vector sort
📋 Your Plan for Today
Day 1: Pixels & Resolution
- Do Now + share guesses; reveal that it's a common screen resolution (5 min).
- Mini-lesson (12 min): introduce pixel, resolution, and aspect ratio using the graph-paper analogy.
- Hands-on (23 min): color in a small graph-paper grid to make a simple pixel-art image, then compare a low-resolution (few squares) vs. high-resolution (many squares) version.
- Quick share (5 min): hold up your grids and compare.
Day 2: Raster vs. Vector
- Do Now (5 min): what's the difference between a pixel and a resolution? Mini-lesson (12 min): raster vs. vector, using a printed comparison (a photo vs. a logo).
- Hands-on sort (15 min): sort 10 image examples into Raster or Vector piles, with a reason for each.
- Vocabulary review game (10 min): matching flashcards to definitions.
- Exit ticket (3 min).
🖨️ Print Your Handout
Word, picture, and definition for today's vocabulary, plus a place to write and draw. Available in English, Spanish, French, Arabic, and Chinese.
📚 Key Words
- Pixel
- The smallest single square of color that makes up a digital image, like a tiny tile in a mosaic.
- Resolution
- How many pixels are packed into an image -- more pixels generally means more detail.
- Aspect Ratio
- The proportional relationship between an image's width and height, like 16:9 for widescreen video.
- Raster Image
- An image made of a fixed grid of pixels; enlarging it too much makes it blurry.
- Vector Image
- An image built from mathematical paths that can scale to any size without losing quality.
✅ What Your Finished Work Should Include
Pixel-art grids and sorting activity collected; a quick 5-question vocabulary matching quiz.
Exit Ticket: In your own words, explain the difference between a raster image and a vector image -- no technical jargon allowed!
📊 Before You Leave
Quick, anonymous class check-in -- takes less than a minute.
🎓 ACP Exam Prep
This lesson connects to the Photoshop Adobe Certified Professional exam: Domain 1: Working in the Design Industry
🔗 Want to Learn More?
🚀 The Extra Mile
Cross-Class Connection: The same precise-vocabulary habit Science class demands when describing a lab observation instead of guessing.
Career Connection: Correct file/resolution vocabulary is literally tested on the ACP exam and expected on day one in every Digital Designer or Photography job.
Go further -- turn this into a portfolio piece:
- Build an illustrated glossary poster of eight image terms, useful as real study material for next semester's students. Start here: pick your eight terms and write one plain-English definition for each before you choose any layout or illustration style.
- Take one photo and correctly label its resolution, file type, and color mode in a short annotated diagram. Start here: take the photo first, then open Image > Image Size in Photoshop and read the actual numbers off the panel before you label anything.