# Class 10: Raster Graphics and RGB Colors

Back to Laboratory: Writing Your Own Procedures. On to A Design Perspective.

This outline is also available in PDF.

Held: Monday, 14 September 2009

Summary: We consider the basics of raster graphics, a common technique for describing and representing images. We also consider RGB colors, one of the most common mechanisms for representing colors digitally.

Related Pages:

Notes:

• Quiz 2 returned. We'll run the code for part two to see what was expected.
• I have not yet graded assignment 2 or writeup 1. Sorry.
• Are there questions on writeup 2? or assignment 3?
• We're hoping to distribute exam 1 on Wednesday. It will be due the following Wednesday. You will not have another weekly assignment due next Wednesday. (You will still have a quiz on Friday and may get a lab writeup somewhere in the middle there.)
• We're going to try something a little different today. I'll take questions about the readings today, but won't lecture first.
• Tomorrow, we learn more about colors, but from a very different perspective. Matt Kluber from art will be lecturing.

Overview:

• Representing images, revisited.
• Pixels and colors: The basics.
• RGB colors.
• Those weird numbers.

## Raster

• Many ways to represent colors, too.
• Goals: Unambiguous, fast to process, compact
• The color names we've been using are
• Ambiguous
• Slow to process
• Long
• Whoops!

## RGB Colors

• The most common internal representation of colors on computers.
• We think of a color as the combination of three primaries: red, green, and blue.
• These are the primaries for the so-called additive colors
• You are probably used to the primaries being red, yellow, and blue, but those are the subtractive colors
• On computers, we represent each component as a number between 0 and 255, inclusive.
• It turns out that you can shove four numbers, each between 0 and 255, into the internal representation of an integer.
• So, the red, green, and blue components are three of those numbers.
• What's the forth? In multi-layer images, it's the alpha channel.
• We use `rgb-new` to create these colors.
• We use `rgb-red`, `rgb-green`, and `rgb-blue` to extract the corresponding components.

## Those Weird Color Numbers

• We're representing colors as three integers, each in the range [0..255].
• Yet when we ask MediaScript for a color, we tend to get a single integer which is rarely in that range?
• What's giong on?
• Well, most computers have different techniques for representing really small integers (particularly integers in the range [0..255]) and standard-length integers. We're using the smaller representation, but shoving three of those into a standard-length integer.
• We use that representation because it makes everything faster.
• Even those of us who designed that representation can't read it.

Back to Laboratory: Writing Your Own Procedures. On to A Design Perspective.

Disclaimer: I usually create these pages on the fly, which means that I rarely proofread them and they may contain bad grammar and incorrect details. It also means that I tend to update them regularly (see the history for more details). Feel free to contact me with any suggestions for changes.

This document was generated by Siteweaver on Fri Dec 11 09:38:41 2009.
The source to the document was last modified on Fri Aug 21 17:03:06 2009.
This document may be found at `http://www.cs.grinnell.edu/~rebelsky/Courses/CS151/2009F/Outlines/outline.10.html`.

You may wish to validate this document's HTML ; ;

Samuel A. Rebelsky, rebelsky@grinnell.edu

Copyright © 2007-9 Janet Davis, Matthew Kluber, Samuel A. Rebelsky, and Jerod Weinman. (Selected materials copyright by John David Stone and Henry Walker and used by permission.) This material is based upon work partially supported by the National Science Foundation under Grant No. CCLI-0633090. Any opinions, findings, and conclusions or recommendations expressed in this material are those of the author(s) and do not necessarily reflect the views of the National Science Foundation. This work is licensed under a Creative Commons Attribution-NonCommercial 2.5 License. To view a copy of this license, visit `http://creativecommons.org/licenses/by-nc/2.5/` or send a letter to Creative Commons, 543 Howard Street, 5th Floor, San Francisco, California, 94105, USA.