Skip to main content
header search
ahihi OpenLearn
OpenLearn
Menu
sticky search

About this free course

Become an OU student

Download this course

Share this free course

Course content Course content
Algorithmic Design
Algorithmic Design

Start this free course now. Just create an account and sign in. Enrol and complete the course for a free statement of participation or digital badge if available.

More free courses

5.2 Skill 5: Create your pattern

In this skill, you will create your own unique pattern using the tiles that you previously designed and saved in your codesnippet text file.

If you skipped ahead and don’t have those tiles, go back to Skill 3: Design 4 tiles to create the four tiles.

If you already tried to make the four tiles and found it difficult, don’t worry. You can work through this skill by tweaking the tiles provided in Program 14.

Active content not displayed. This content requires JavaScript to be enabled.
Program 14  Pattern maker
Interactive feature not available in single page view (see it in standard view).

Video 9 explains how to insert your codesnippets text into the pattern maker.

Download this video clip.Video player: Video 9
Copy this transcript to the clipboard
Print this transcript
Show transcript | Hide transcript

Transcript: Video 9  Adding codesnippets to the pattern maker

CHRISTIAN NOLD
In this video, I’m going to show you how to insert your own tile designs into the pattern maker. So, this is my codesnippets file, where I’ve saved four different tile designs that I’ve created previously. So, this is my first tile, this is the second tile, the third tile, and the fourth tile. And what I’m going to do is I’m just going to go to this program, the pattern maker, and I’m going to insert it inside the function. So, I find here the function for Tile1, and this is the code that describes Tile1.
And what I’m going to do is I’m just going to go and copy that code that I designed previously into the space of that tile. And I’m careful to stay within that space. So, you see that’s changed. And I’m just going to press Play here. So, there you go! Tile1 has changed. Instead of being the number 1 here, it’s become this kind of blue square.
I’m just going to go back and take the second tile design and go down to function 2. This one’s a bit longer here. And I’m just going to paste it on top of there. So, you can see, it’s a different length. That doesn’t matter. I’m just going to press Play. There you go. We’ve just replaced that number 2 with this kind of shape here. I’m going to get my third tile design, and I’m going to go down to function Tile3 and replace it into this space.
So, I paste it on top, press Play. There you go! We now have this kind of purple shape. And I’m going to get the fourth one. And I’m going to go down to function Tile4 and replace this code with my own tile design and press Play. There you go. So, what I’ve done here is I’ve replaced all the tile designs in the given example with my own tile design. So, we have 1, 2, 3, 4.
End transcript: Video 9  Adding codesnippets to the pattern maker
Download
Video 9  Adding codesnippets to the pattern maker
Interactive feature not available in single page view (see it in standard view).

Now try making a pattern using your tiles.

Activity 9  Insert your tiles to make a pattern

Timing: Allow 40 minutes to complete this activity

You are going to use the four tiles that you generated in Skill 3: Design 4 tiles to make a pattern using Program 14 Pattern maker. You will replace the existing code with the code that you saved into your codesnippet text file.

To generate your own pattern:

  1. Copy the code for your first tile from your codesnippet text file and paste it into the function Tile1(), replacing the code that is there.

  2. Repeat this action for your remaining tiles, pasting the respective code into Tile2(), Tile3(), and Tile4().

    Your code will look similar to what was there before, but it may not be as neatly aligned. Don’t worry, that won’t affect anything as long as you have pasted the code within the curly brackets { } of the tile functions.

  3. Press Play and you should see your own tiles arranged in a pattern. Hurray!

    If you encounter a problem, simply press Revert and start again. The most likely cause is that you have accidentally pasted your code over some of the function code.

  4. Play around with the arrangement of your tiles by tweaking the tileSequence array.