CL Newsletter, September 2021 - Number Puzzles

Math is creative, social, and fun. We know that, and you do too.

The bad news is that most of the internet is set up to make that hard to see.

The good news is that Desmos users make lots of creative, social, and fun math interactions to share with students and the world. This month, we’re featuring some tricks of that trade. Read on for examples of playful math, and the tools for making and modifying them.

Score 21

In this activity, we give students four cards and ask them to use the numbers to get as close to 21 as possible without going over.

A gif showing the gameplay of

Need to get familiar with the game? Play it here!

In this issue, we’ll talk about some of the features that make it tick and show you how to add or combine them to your own screens to make your own puzzles! We’ll also offer some additional tutorials at the end for anyone wanting to add a little more pizazz to their interactions.

Dynamic Text

You can use a combination of string interpolation and hidden notes to show, hide, or fade in textual feedback.

Use the dynamic text tool to insert text or math anywhere in a note!

A gif that illustrates the steps that follow on the page.

  1. Start by adding any static text straight into the editor.
  2. In the CL for your note, create a variable. Set it to whatever text you want to display (we compared the student’s input with its numeric value).
  3. Use some conditional statements if you want to hide or show a note on command (we’re displaying ours after the submit button is pressed).
  4. Interpolate your text using the button or by pressing ${ on your keyboard.
  5. Preview and test!

To make text fade in and out, use a separate note with a hidden sink.

After writing your message, figure out when you want the message to show. It helps to write it out:


Too low!

Show When…

Time since submitting is greater than 1 and the numeric value of the input is less than 21

Unfortunately we don’t have a way of directly telling a component to show itself. Instead we need to tell a component to hide itself when the “show” conditions are not true:

Show When…

timeSinceSubmit > 1 and numericValue < 21

Hide When…

not( timeSinceSubmit > 1 and numericValue < 21 )

Create hidden sinks using your conditions:

a CL scripting window with the following code: hidden not(input.timeSinceSubmit > 1 and input.numericValue > 21)

Do this for as many different conditions as you want! Make sure to preview and test along the way. Copy and edit this activity if you want an example.


This function is the heart and soul of many of these puzzles because it enforces the rules for what can, cannot, and must be used. In a nutshell, it counts either the total amount of numbers or the total amount of a particular number in any string.

If you want to count all of the numbers in, for example, a math input:

And if you want to count a particular number (in this case, 5), add an argument:

Stuck? Try this out. You can even use a variable in place of your second argument to make it easy to switch between numbers.

Once you’ve figured out the amount of each number you want, you can restrict the submission of a response until the conditions are met. Or better yet, provide an error message.

A gif that shows the connection between the countNumberUsage function and the error message. Code can be found in the activity linked in the paragraph above.


Combining just the things covered in the previous two sections is enough to build a simple number puzzle (check it out), but there are still many ways to add delight to your interactions. Here are a few (links to tutorials or examples are included):

More examples of playful math with Desmos: