Canvas Connections

GideonWilliams
Community Coach
Community Coach
0
147

I am mindful that many quiz based activities we already use are variations of multiple choice type quizzes so, trying to be a different, I asked staff to think about games they had played (perhaps as kids) that came out of a box instead of a screen.

We had a few suggestions:

  • Finding pairs with playing cards
  • Lotto
  • Snakes and ladders
  • Snap
  • Top Trumps
  • Trivial Pursuit
  • Battleships
  • Noughts and Crosses

The reason being that the presentation centered around an activity I made that lunchtime based on Connect Four

Before we got on to the subject of Canva Code, I asked staff to explore why games such as Kahoot and Blookit are popular with students. My reason was to explore more ideas around game mechanics and gamification because I do believe that these are critical for making interactive resources more engaging and students more enthusiastic about being in lessons.

There were lots of great responses to this, many of which I have used in my own vide coded game designs:

  • Competition
  • Multiple attempts/lives
  • Timers and timed responses
  • Points
  • Leaderboard
  • Differentiated questions
  • Risks and rewards
  • Help features / Powerups
  • Randomness
  • Feedback
  • Team play
  • Rules
  • Progress tracking
  • Customization - eg avatars
  • Language accessibility
  • Challenge

Next, we briefly discussed what vibe coding is and how the Canva code model is slightly different from other, namely in its ability to include styles, designs and layouts and to provide an easy way to link to external tools such as Canvas and OneNote.

So why create something with vibe coding when you can make a quiz with Kahoot and all the other online tools? Prior to staff attending this session I had sent them a link to a Canvas page where I shared with them several different learning activities that had been shared openly in discussions on LinkedIn by teachers in my community:

activities.png

Their names and which interactive they shared and most importantly my thanks to them are included at the top of the page. The comments are my own...

A reason for sharing these is that many of the activities are not simply quizzes, they are whole learning packages - including content to review, quiz activities and most importantly - feedback and next steps.

As learning technologists, we cannot simply ask teachers to add in tech to their lessons without ensuring that it is going to have impact and make a difference. Not only is much of our curricula already overloaded with content but teachers need to contribute a significant amount of their time into the task creation. So, showing examples where quizzing is but one element of a bigger learning package can be a powerful persuader especially when it could replace existing resources used in the lesson and/or be used as effectively outside of the lesson as in.

Canva Code is only 2 months old as of writing this post and in that time, there are a few things that I have learned that I share with staff:

  1. Its coding based on a prompt - make sure your prompt is as precise as possible to make the outcome what you want
  2. Sometime the coding fails - often with buttons, it is tricky to get it back
  3. Sometimes it does not do what you ask it to - this is both the beauty and frustration of vibe coding so see (1)
  4. The coding is not quick - even small changes mean the whole code is rewritten - bring something to do
  5. Start small and BUILD IT UP - it can be tempting to write everything you need into one prompt. Sometimes it works but there are problems if (2) happens!
  6. The outcome you get is amazing, it might not be perfect but remember it is for the students and YOU HAVE MADE IT!!!
  7. Be curious, you will never know it can do something if you dont try!
  8. Canva Code is still very new, it will get better and it is free!

There is not a great deal in Canva or outside about prompting and vibe coding. I do believe that prompting for vibe coding is different than for other LLM uses but that's just a hunch. I look forward to finding out a bit more.

The next step is the show and tell. I stopped doing live demos just because I dont want the code to fail and for people to feel disappointed. Also, waiting for 1000 lines of code to finish is not a great way to sit through someone's valuable time. Instead, I show and talk through the prompts I used to develop the activity and then the final design.

In this case, the prompts were from that lunchtimes design (nothing like Just in time management)

Prompt 1

p1.png

Prompt 2

p2.png

I forgot to mention the topic and context for the game after I got lots of questions not relevant to Physics (See 1)

 

Prompt 3

p3.png

I knew how the game worked but maybe others did not and as it was a 2 player game, the rules and how to guide were needed

 

Prompt 4

p4.png

I work in an International school where English is the language of instruction. I try to make sure that all my content can be translated into a range of languages to support 2nd and 3rd language learners. The key topic words need to remain in English to develop students' scientific vocabulary for the exam

 

Prompt 5

P5.png

This was a prompt after I had played the game. Sometimes with lots of coloured shapes it may not be obvious to see where 4 in a row comes from hence the addition.

 

What I could have added extra / more improvements

I did not look at all the questions Canva code created and would probably have added additional prompts related to different grade levels and perhaps also some Maths equations. I think that Canva adds about 10 questions as default unless you tell it otherwise. 

The drop down buttons for the languages on the Welcome page is white but reveals the language when you move over it with your mouse?

If I added more questions, I would have made the game a best out of 3 game and perhaps added an additional 'Pass'?

 

Examples of the Game

1.png

I need to sort out the white dropdown and the languages only appearing when you rollover them (which I did not ask for - 3)

3.png

Game in progress. Player 1 has used up 1 pass. The UI looks like the Connect Four game. The multiple-choice question is clear and the timer changes colour as it approaches 0.

p4.png

Winner, winner, chicken dinner!

There we go. A few features I think still to check. I am not sure if the winning line works for diagonals.

Here is version from the CPD - https://firstdraft1.my.canva.site/cpdcanvacode 

Hope it inspires you to have a go

PS. I didnt mention the bit about embedding in Canvas pages - click on Share > See All > Embed > Embed > Copy to get the code and off you go. 

Or, if you have let students design a game for an assignment then sort out the free Canvas integration!

1.png