Introduction: Mosaic Code
Mexican talavera tiles were inspired by tiles from Spain. European settlers brought their knowledge of tiles and glazing to Mexico in 15th and 16th centuries. The Mexican indigenous people created their own interpretations of these tiles. This style was also translated to other ceramic objects such as bowls, vases, pitchers, etc.
Learn more about the history of talavera tiles in Mexico here.
You can also see examples of several tile produced by Uriarte Talavera, the largest producer and exporter of talavera tiles in Latin America. The company prides itself on producing high quality traditional tiles. See some examples of their tiles here.
In this project, the students will create simple digital tiles in Google Drawing (or another drawing software). The tiles can reflect the colors and shapes found in the talavera tiles, but in a more simplistic style. Students can also take their own approach in designing their tiles.
The students will also create a drag and drop activity using Google slides.
The goal is to create a classroom "code" that can describe the specific distinctions amongst the tiles. The code will also need to include where to place tiless. Math symbols and punctuation marks can be used instead of words.
Essential questions:
- Why is code written in a specific way?
- Is code a language?
Supplies
Computer with access to a Google Slides and Google Drawings
Step 1: Create a Coding Language.
Before creating the tiles, brainstorm with your students on the language and symbols they will use to describe their tiles and the placement of their tiles. For example, the background color of the tile can be described as "background = yellow" or "square = yellow" or "T = y". You may also want to create other ways to describe elements of the tile, where a tile must be place, how to repeat a step, etc. Look at actual code or Scratch for ideas.
All the students must use the same code for their drag and drop activity. All the steps should be numbered in order of execution.
The students should create tiles that can be described by their code. Add more to your coding language if needed.
Step 2: Create Tiles and Code.
Go to Google Drawings and make a document with a 16/9 ratio.
Create a screen that has these 3 elements:
- a grid to place the tiles
- a bin to hold the tiles you will need
- the code to lay out the tiles
Draw a grid using squares. The grid can be 4 tiles, 9 tiles, or 16 tiles. My grid is 16 tiles - 4 squares across and 4 squares down.
You can get a 16 tile pre made game screen here if you don't want to make your own. It was created in Google Drawing and is editable.
Create simple tiles. Copy one of the squares in the grid to create a simple tile. While creating your tiles, think about the code that the class has created. You might want to create your tiles and write the code at the same time.
Step 3: Export Background Graphic
Once you have created 16 tiles and the code for constructing the mosaic, export just the layout. Do not have any tiles showing. Move the tiles to the side of the art board.
Download the layout as a jpg onto your computer, then upload the graphic back onto your Google Drive.
Step 4: Exporting Tiles
Create a Google Drawing file the same size as your tiles. If you are using the file provided, you will make the file .68 inches square. In Google Drawing, you can change the size of your art board by going to File > Page Set > Custom.
Paste each tile into the new document and make each a jpg - in the same manner you made the background.
Step 5: Create the Drag and Drop Activity
Create a new Google Slides document.You only need one slide.
Go to "Backgrounds" and select the jpg of the screen. The background images in Google Slides do not move which means the layout won't move, only the tiles.
Place all the tiles by just "inserting image". Each tile should be able to be clicked and dragged around the screen.
Once every tile has been inserted, arrange them in the top bin. Have students test each other's "coding" by following the instruction of the code.
This is a great way to prepare students to think like a computer while building an interactive activity. It's also a great way to have students be aware that you can use an ap.pllication in a way it wasn't intended to be used
