Tilemap Editor: How Big Is This Level?
Grassy Hills is a video game level made of square tiles, 40 across and 14 down. Students measure it the way the game does: they count the tiles in the hill, then find a faster way by multiplying its sides, and check with the editor's Select tool, which reports the size of whatever they drag over. Then they split the whole ground into rectangles and add the parts, read where things are by column and row, and build a castle of exactly 24 tiles from two rectangles.
At a glance
Essential question
How can you find the area of a shape without counting every square?
Objectives
Students will be able to:
- find the area of a rectangle by counting unit squares, then by multiplying its side lengths
- find the area of a shape made of rectangles by splitting it into parts and adding them
- name a cell by its column and row, and count columns correctly from a start column to an end column
- build a shape with a given area and check it
Vocabulary
tile, grid, area, rectangle, column, row
Standards
3.MD.C.6, 3.MD.C.7.b, 3.MD.C.7.d, 4.MD.A.3, 5.G.A.1, 3.MD.C.7a
Time and materials
45 minutes, grades 3-5.
- One computer or Chromebook per student or pair, with a mouse if possible
- A projector
- The worksheet and exit ticket, one copy each per student
- The rubric, one copy per student if you grade the worksheet
Prep
Make copies of the worksheet and exit ticket. Before class, open mytekdev.com/try/tilemapeditor?lesson=how-big-is-this-level&ref=tpt-tilemapeditor-1 once on a student computer to see the level and to check that your school's filter allows it. No account is needed.
Assessment
- Formative: the questions under What to look for, asked while students work, and the exit ticket (answer key included).
- Summative: the completed worksheet and the student's castle, scored with the rubric out of 12.
Technology and privacy
Runs in any browser, Chromebooks included, with nothing to install. Students need no account and no email: the link works signed out, and nothing they make is stored on our server unless they choose to save it to an account. A mouse makes dragging easier than a trackpad. If your school blocks new sites, ask IT to allow mytekdev.com.
mytekdev.com/try/tilemapeditor?lesson=how-big-is-this-level&ref=tpt-tilemapeditor-1mytekdev.com/tools/tilemap-editor/lessons/how-big-is-this-level/startEach student gets their own copy, and the same link reopens it next time. How to set up a classLesson sequence
| Minutes | Stage | What you do | What students do |
|---|---|---|---|
| 0 to 6 | Warm-up Hook | Show the title, essential question and Today I can slides (about 1 minute). Students open the link or scan the QR code on the worksheet. The level is Grassy Hills, a strip of a platform game. A short guide runs along the top; have students do its three steps, which turn off View > Solid Cells (a red film that marks the solid blocks a player cannot walk through) and click the Select tool, but not drag yet. Ask: "This level is built from square tiles. How many tiles is the hill?" Let students count however they like. | Count the tiles in the hill and share how they counted. |
| 6 to 14 | Direct instruction (I do) Model it | Collect counting methods: one by one, by rows, by columns. Then show the faster way on the board: the hill is 6 tiles across and 5 tiles down, every row has 6 tiles, so 5 rows of 6 is 6 x 5 = 30. On the projector, pick the Select tool (the dashed square, or press M) and drag from the hill's top left tile to its bottom right tile. The status bar at the bottom says Picked none, selected 6 x 5. Point out the bar's other numbers: Map 40 x 14 means the whole level is 40 tiles across and 14 down, and Tile 18 px is the size of one tile in the game's own pixels (the map on screen is zoomed, so it looks bigger). | Write the hill's area both ways on the worksheet. |
| 14 to 24 | Guided practice (We do) The whole ground | The ground is not one rectangle. Together, split it into four: the long piece on the left (17 across, 3 down), the piece after the water (6 by 3), the hill (6 by 5), and the piece on the right (8 by 3). Students find each area, check each with Select, and add: 51 + 18 + 30 + 24 = 123 tiles. Ask for a different way to split the right side: one piece 20 across and 3 down, plus the top of the hill, 6 by 2. That is 60 + 12 = 72, the same as 18 + 30 + 24. Then coordinates: move the mouse over the door at the far right (if it is off the screen, scroll right, or choose View > Zoom Out (the - key)) and read Cell in the status bar: 38, 10. The first number is the column, counted from 0 at the left; the second is the row, counted from 0 at the top. So the left piece runs from column 0 to column 16: 17 columns, not 16. | Fill in the ground table, check with Select, and find the door's cell. |
| 24 to 38 | Independent practice (You do) Build a castle | Students plan a castle of exactly 24 tiles made of two rectangles (for example a 4 by 4 tower and a 4 by 2 wall: 16 + 8 = 24), write the multiplication on the worksheet, then build it in the empty sky. To draw: click a tile in the tileset on the right (the brown crate, for example), pick Box Fill (press B), and drag a rectangle on the map. Ctrl+Z undoes. They check each part with Select and add. Walk the room and ask the questions under What to look for. Students who finish build a second castle of 24 tiles from two different rectangles. | Plan, build and check a 24-tile castle. |
| 38 to 45 | Closure Say it back, and exit ticket | Ask the essential question again. From the class: a rectangle's area is tiles across times tiles down; a shape made of rectangles is the sum of their areas; and the parts can be split more than one way. Then hand out the exit ticket. | Answer the essential question out loud, then the exit ticket on their own. |
What to look for
Ask these while students work. A student who has understood the lesson can answer them without help:
- How did you find the hill's area without counting every tile?
- Select says 6 x 5. Which number is across and which is down?
- Why did you add these areas instead of multiplying them?
- The left piece runs from column 0 to column 16. Why is it 17 tiles wide, not 16?
- Without trying it: is a 3 by 8 castle the same area as a 4 by 6 castle? Why?
Cross-curricular extensions
- Art: old video game consoles stored a level as a grid of tile numbers to save memory. Design a 6 by 6 pattern on paper with only four different tiles.
- Math: a gardener has 24 square paving stones. List every rectangle they could make.
- Computer science: Lesson 2 opens the Fill tool's rule: how does it know which squares to fill and where to stop?
- Physical education: mark a 6 by 5 grid on the floor with tape. How many students fit, one per square?
Vocabulary
| tile | One small square picture. A game level is built from tiles placed on a grid. |
| grid | Rows and columns of squares, like graph paper. |
| area | How many squares a shape covers. Here the unit is one tile. |
| rectangle | A shape with four square corners. Its area is length times width. |
| column | A line of squares going up and down. The editor numbers them from 0 at the left. |
| row | A line of squares going side to side. The editor numbers them from 0 at the top. |
Differentiation
English learners
- Post the vocabulary with a picture for each word: a single tile, a grid, a row and a column marked on it.
- Point to across and down on the board every time you multiply.
- Let students show the multiplication with their fingers on the screen before writing it.
Students with IEPs or 504 plans
- Where the IEP allows a modified assignment, give the side lengths of each ground piece and ask only for the areas.
- Allow a multiplication chart.
- Pair students: one drags with Select, the other records.
- Read the exit ticket aloud.
Students who need more support
- Have students count one row first, then count the rows, before multiplying.
- For the castle, give the plan: a 4 by 4 tower and a 4 by 2 wall.
- Check in at minute 30: does the student's plan add up to 24 before they build?
Students ready for more
- The whole level is 40 by 14 tiles. How many tiles would it take to fill every cell? (560.)
- Each tile is 18 of the game's own pixels across. How many of those pixels wide is the level? (40 x 18 = 720.)
- Build a castle of 24 tiles from three rectangles. How many different plans can you find?
Adapting for other grades
Younger students: For grade 2, keep to counting rows of equal tiles (repeated addition: 6 + 6 + 6 + 6 + 6 = 30) and building a castle from one rectangle. Score the first and third rubric rows only (out of 8; 6 or more meets the objectives).
Older students: For grades 6 to 8, find the perimeter of each ground piece as well as its area, convert the level's size to pixels (Tile 18 px), and work out what fraction of the 560 cells the ground covers (123 of 560, about 22 percent).
Tilemap Editor: How Big Is This Level?
Student worksheet
Name: ______________________________ Date: ______________
Open the app: scan the QR code, or go to mytekdev.com/try/tilemapeditor?lesson=how-big-is-this-level
Essential question: How can you find the area of a shape without counting every square?
1. The hill. Counted one by one: ________ tiles. Across ____ x down ____ = ________ tiles.
2. The ground, in four rectangles. Check each one with Select (M).
| Piece | Across | Down | Area (across x down) | Select says |
|---|---|---|---|---|
| Left of the water | ||||
| After the water | ||||
| The hill | ||||
| Right of the hill | ||||
| Total |
3. Move the mouse over the door. Cell says: column ______, row ______.
- Plan it. Two rectangles that make exactly 24 tiles: ____ x ____ = ____ and ____ x ____ = ____.
- Build it. Pick a tile, choose Box Fill (B), and drag each rectangle in the sky. Check each one with Select (M).
4. How can you find the area of a shape without counting every square?
Tilemap Editor: How Big Is This Level?
Exit ticket
Name: ______________________________
1. A platform is 7 tiles across and 2 tiles down. How many tiles is it? (A) 9, (B) 14, (C) 16.
2. A hill is a 5 by 3 rectangle with a 2 by 2 rectangle on top. What is its area? (A) 19, (B) 15, (C) 21.
3. A piece of ground starts at column 4 and ends at column 10. How many tiles across is it? Explain how you know.
Answer key: worksheet and exit ticket
Measured in the app on Grassy Hills. The status bar reads Map 40 x 14 and Tile 18 px. Select reports the size of the rectangle dragged over, for example Picked none, selected 6 x 5 for the hill.
| Piece | Columns | Area | Select says |
|---|---|---|---|
| Left of the water | 0 to 16, rows 11 to 13 | 17 x 3 = 51 | selected 17 x 3 |
| After the water | 20 to 25, rows 11 to 13 | 6 x 3 = 18 | selected 6 x 3 |
| The hill | 26 to 31, rows 9 to 13 | 6 x 5 = 30 | selected 6 x 5 |
| Right of the hill | 32 to 39, rows 11 to 13 | 8 x 3 = 24 | selected 8 x 3 |
| Total | 51 + 18 + 30 + 24 = 123 |
The door is at Cell 38, 10. The water between the ground pieces is 3 by 2 (6 tiles) and is not ground. Another way to split the right side: 20 by 3 (60) plus the top of the hill, 6 by 2 (12), is 72, the same as 18 + 30 + 24. Castle: any two rectangles that add to 24, for example 4 x 4 + 4 x 2, 3 x 6 + 3 x 2, or 5 x 4 + 2 x 2.
| Exit ticket | Answer | Why |
|---|---|---|
| 1 | B | 7 x 2 = 14. |
| 2 | A | 5 x 3 = 15 and 2 x 2 = 4; 15 + 4 = 19. |
| 3 | 7 | Columns 4, 5, 6, 7, 8, 9 and 10: 10 - 4 = 6, plus 1 for the starting column. Full credit for 7 with a count or a reason. |
Rubric
Score each row from 1 to 4.
Name: ______________________________
| Criteria | 4 Exceeds | 3 Meets | 2 Approaching | 1 Beginning |
|---|---|---|---|---|
| Finds area by multiplying | Every rectangle's area is right by multiplication, and the student explains why rows times columns works. | Every rectangle's area is right by multiplication. | Areas are right by counting, or some products are wrong. | Areas are missing. |
| Splits and adds | The ground total is right, and the student splits it a second way and gets the same total. | The ground total is right, from parts that do not overlap. | Parts are found but overlap or are left out. | The ground total is missing. |
| Builds to an exact area | The castle is exactly 24 tiles from two rectangles, checked with Select, and a second plan is found. | The castle is exactly 24 tiles from two rectangles, checked with Select. | The castle is built but is not 24 tiles, or was not checked. | No castle is built. |
Total: ____ / 12. A score of 9 or more meets the objectives.
Standards
Area is the center of this lesson: counting unit squares, multiplying side lengths, and adding the areas of rectangles that make up a larger shape. The coordinates in the status bar connect to the grade 5 coordinate system.
| Framework | Code | Grades | Standard | How the lesson meets it |
|---|---|---|---|---|
| Common Core Math | 3.MD.C.6 | 3 | Measure areas by counting unit squares (square cm, square m, square in, square ft, and improvised units). | Students count the tiles in the hill, with one tile as an improvised unit square. |
| Common Core Math | 3.MD.C.7.b | 3 | Multiply side lengths to find areas of rectangles with whole-number side lengths in the context of solving real world and mathematical problems, and represent whole-number products as rectangular areas in mathematical reasoning. | Students multiply tiles across by tiles down for every ground piece, and build rectangles to a product. |
| Common Core Math | 3.MD.C.7.d | 3 | Recognize area as additive. Find areas of rectilinear figures by decomposing them into non-overlapping rectangles and adding the areas of the non-overlapping parts, applying this technique to solve real world problems. | Students split the ground into rectangles, add the parts, split it a second way, and build a castle from two rectangles. |
| Common Core Math | 4.MD.A.3 | 4 | Apply the area and perimeter formulas for rectangles in real world and mathematical problems. For example, find the width of a rectangular room given the area of the flooring and the length, by viewing the area formula as a multiplication equation with an unknown factor. | Students plan rectangles with a given area, such as a 4-tile-wide tower that must be 16 tiles. |
| Common Core Math | 5.G.A.1 | 5 | Use a pair of perpendicular number lines, called axes, to define a coordinate system, with the intersection of the lines (the origin) arranged to coincide with the 0 on each line and a given point in the plane located by using an ordered pair of numbers, called its coordinates. Understand that the first number indicates how far to travel from the origin in the direction of one axis, and the second number indicates how far to travel in the direction of the second axis, with the convention that the names of the two axes and the coordinates correspond (e.g., x-axis and x-coordinate, y-axis and y-coordinate). | Students read a cell as a pair of numbers, column then row, from an origin at 0, 0, and compare the editor's rows, which count down, with a graph's y-axis, which counts up. |
| Common Core Math | 3.MD.C.7a | 3 | Find the area of a rectangle with whole-number side lengths by tiling it, and show that the area is the same as would be found by multiplying the side lengths. | Students count the hill's tiles one by one, then multiply 6 x 5 and see the same 30. |
Checked October 2026 against: Common Core State Standards, Grade 3 Measurement and Data, Common Core State Standards, Grade 4 Measurement and Data, Common Core State Standards, Grade 5 Geometry.
Optional: save student work in a free class
The whole lesson runs at the link on the worksheet, with no accounts and no sign-up. Work stays in the browser tab until it is closed.
To keep students' work, and see every student's level in one place, make a free class. It takes about ten minutes, once, and covers every lesson in this series: mytekdev.com/tools/class-setup
Students in a class open mytekdev.com/tools/tilemap-editor/lessons/how-big-is-this-level/start instead of the worksheet link. Each one gets their own copy of the starter, and the same link reopens it next time. A student who started at the worksheet link and then signs up keeps what they made.
The Tilemap Editor is open source under the GNU General Public License 3.0. The tiles in Grassy Hills are from Kenney's Pixel Platformer pack, released under CC0.