Ratio and Proportion


In my seventh grade math classroom, the second unit we studied was on the power standard of “proportionality”. Students had learned about basic programming commands and how to use the coordinate grid. Their learning would be more powerful, I decided, if they had the opportunity to use the ideas of ratio and proportion with variables in a computer program.  A common task is to scale quantities, or images, up or down to make sense of a situation.  It’s a great fit for computer programming.


  • CCSS.Math.Content.7.RP.A.2 Recognize and represent proportional relationships between quantities.
  • CCSS.Math.Content.7.RP.A.2b Identify the constant of proportionality (unit rate) in tables, graphs, equations, diagrams, and verbal descriptions of proportional relationships.
  • CCSS.Math.Content.7.RP.A.2c Represent proportional relationships by equations. For example, if total cost t is proportional to the number n of items purchased at a constant price p, the relationship between the total cost and the number of items can be expressed as t = pn.

I really focused on the last standard, representing proportional relationships by equations. Variables are a new concept to middle-schoolers. It’s also one of the most important concepts in computer science, so there is great synergy there. I would focus on the use of variables and how you can use them to represent a proportional relationship. I wove these lessons in with our usual math lessons on proportionality.

1) Fractions, Ratios, and Rates starter:  To give the students a chance to explore proportionality and how it can be represented graphically, I gave them three simple programming tasks:  Draw 3/5 of a circle.  Draw two rectangles in the ratio 1:2.  Show with a diagram that I have taken 5 friends to a movie for a total cost of $75.  The students needed to use the built-in documentation to learn how to draw arcs and rectangles, and work in workgroups to accomplish the task.  It took about an entire 90-minute block, but almost everyone was successful.

FRACTIONS, RATIOS, and RATES starter program

2) Proportions and variables: Students had done a few activities involving variables and programming in the previous unit, so I wanted them to explore using variables in a proportional reasoning setting.  I gave them the Population Program which is a troubleshooting activity.  It shows two bars representing the populations of two cities, but one is clearly an incorrect length.  I asked the students to fix the program so the bars correctly showed a comparison between the populations of the two towns.



The activity had many correct ways of solving it, and a few incorrect ways that *looked* correct, which I didn’t anticipate at first!  I found the populations of the two towns on Wikipedia, and conveniently, the population of Greeley is almost exactly 5/8 of the population of Fort Collins.  The program starts with this code:

// the population of Fort Collins (Wikipedia)
var pop_ftc = 148612;
// the bar for Fort Collins goes all the way across the screen
var bar_ftc = 400;

// the population of Greeley (Wikipedia)
var pop_greeley = 92889;
// This looks wrong.How long should the bar be for Greeley?
var bar_greeley = 10;

In the picture, you can tell the bar for Greeley is way too short.  The students started by adjusting the variable for “bar_greeley” until it looked about right.  When looking at a visual, I was surprised at how good their estimation skills actually were when dealing with these numbers.  Most students understood that Greeley’s population was more than half of Fort Collins’, but not more than 3/4, and they adjusted it approximately correctly.  Some students just left it there and called it good.

One possible solution, which many students landed on, is to divide 148612 / 400 which tells you the scale factor from the bar to the population. In this case it’s about 371. They would then divide Greeley’s population by 371 and get about 250, which is a proportional length of the bar for Greeley.

Another possibility is to divide Greeley’s population by Fort Collins’ population, and notice that it gives you the ratio of 0.625.  Greeley’s bar, then, must be 62.5% of the length of Fort Collins’ bar, so they could multiply 0.625 by 400 and get a correct length of 250 for Greeley’s bar.

A third possibility is to divide BOTH Fort Collins’ population and Greeley’s population by 400.  This scales both populations down to number in the hundreds, and since you divided both populations by the same amount, the ratio remains the same (there’s a connection with equivalent fractions).  Fort Collins’ bar changes to a length of 371 and Greeley’s is a length of 232.

So here’s the common mistake many students made which was devilish to sort out.  They simply divided Greeley’s population by 400, because that number shows up in the program right above it.  The result was 232.  When you set the bar length for Greeley to 232, it *looks* correct.  It’s more than half of Fort Collins’ bar, but not more than 3/4, and visually it seems just about right.  But the ratio between the bars is now no longer the same as the ratio between the populations!  The answer is close but the process is completely wrong. Helping students to sort out why this was a mistake was really tough when they’re still novices at abstract thinking.

Some students used variable expressions to solve it, but not many.  It turned out mostly to be a calculator activity, which was fine because that’s where they were when we tried it.  I LOVED that it tested their estimation skills and gave them instant visual feedback about whether they were on the right track.  It taught me a lot about where they were with ratios and proportions. We had a great discussion.

3) Our final unit project was pretty open-ended, but I wanted it to be creative and fun.  The students had to create some kind of diagram, based on real data, that would show proportionality.  I showed them some examples and a rubric from a Google Doc, here.

RATES, RATIOS, and KHAN project

The project had some requirements that were non-negotiable.  It had to use variables to represent quantities.  The ratios had to be calculated using variable expressions.  It needed to represent the data in a way that was proportional to the collected data.  They had to explain what math they did, what they learned about proportionality, and why their graph was proportional to their original data.

The kids got really excited and started doing research.  For many, they created tally sheets and did class surveys on whatever they were interested in : favorite sport, favorite color, number of pets.  Some made Google forms to collect data.  Others did research online about what they were interested in: annual salaries for their favorite careers, populations of cities, or the number of domestic pets in the country.  Still others collected data in other ways: a popular project was to open a bag of candy and count the different colors.

Creating the graph with variables was more challenging for some kids than others, but it was extremely cool to see that moment when the light bulb went on and they realized the power of variable expressions.  If the number of skittles is “s”, and your bar has a length of “s * 12”, you can modify the number of skittles and the bar changes proportionally.  The other bars change proportionally.  It’s funny how very exciting that little insight was.

Some kids really challenged themselves to do hard math by creating pie charts which require pretty complicated variable expressions.  They were awesome projects.

Here are a few of the best ones.
Sports Salaries by Jack C.
Hours Danced by Mackenzie L.
Art Supply Costs by Annabeth S.
Cook Vs. Photographer by Jace C.

I included Jace’s project for a reason.  Jace struggles with writing and started off the year labeled as a struggling math student. He had a very difficult time with this project, but he was really engaged by the topic – he had been thinking a lot about becoming a cook or a photographer someday, and he was curious who made more money.  He did a little internet research and determined a photographer makes about $250-500 for a really good photo, whereas a really good cook can make $140,000 a year.  I sat down with him and conferred for a LONG time about what math needed to be in his program to make a graph reflecting the salaries.  Using the data, how much would a cook make in a month?  How many photographs could a photographer count on selling in a month?  The bars went off the screen, so he played with scaling the bars down until they were both easily visible. Because he struggles with writing, it was a challenge to get all of the thoughts in paragraph form for how he did the project – so instead, I had him give a presentation to our math department about programming and what he learned.  He did an INCREDIBLE job.  He explained everything so thoroughly and carefully – he knew exactly why he did every operation and what it meant – he explained variables and how they worked, and gave the department a tour of Javascript and how to program.  His most powerful insight?  “Before this project, I didn’t really understand division, but now I do.”

I gave the students a survey to find out what they thought of the Rates and Ratios project.  68 students answered the survey.  The project was:

Survey of what students thought of the project

Survey of what students thought of the project

The most popular response was “fun” which about 2/3 of the students gave.  I don’t have reference data to see what students think of non-programming math projects: are they fun?  But I was encouraged by the results and really loved what this project did for my students when it came to proportional reasoning and variable expressions.




About dupriestmath

I'm a former software engineer who has taught middle school math and computer science for the past 6 years. I believe every kid has the right to be a thinker. I started this blog to save resources for integrating programming in the Common Core math classroom. I also use it to save my lessons and reflections from teaching budding computer scientists! Coding has transformed how I teach and think. You'll love what it does for you. You should try it.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: