We have a love/hate relationship with sketch.
We love that sketch allows students to share their thinking visually and annotate graphs and diagrams.
.png?width=320&upscale=true&name=Frame%201%20(5).png)
.png?width=320&upscale=true&name=Frame%202%20(2).png)
.png?width=320&upscale=true&name=Frame%203%20(1).png)
We don’t love that sketches can often obscure your visual feedback and that students can use sketch to find answers without the need for any mathematical thinking.
So how do we tap into the power of allowing students to sketch over diagrams while avoiding the undesired side effects? You’ll be happy to know that there are a few straightforward and simple strategies that can help. This month, we’ll talk about ways that you can:
Hide student sketches when students submit an answer.
Clear sketches between problems or between attempts.
Show, but disable sketching after submission.
Show, but recolor sketches when students submit their answer.
hideSketch
This is a really simple sink to use that hides a student’s sketch whenever you want. Use this when students might use the diagram as scratch paper or when student work might hide the visual feedback. Just start with the hideSketch sink and then set the condition you want to hide the sketch.
.png?width=900&upscale=true&name=Frame%204%20(4).png)
disableSketch
Similar to hideSketch, disableSketch prevents students from editing the sketch component, but leaves the sketch visible. This is useful when sketches are required as a response. It works exactly the same as hideSketch.
resetOnChange
This sink clears the sketch component completely. It’s most useful when you want to give students a fresh component between challenges or ask students to start over between attempts. Unlike hideSketch and disableSketch, resetOnChange is triggered by a change in a string, rather than a boolean command.
Start with the sink.
.png?width=284&upscale=true&name=Frame%206%20(3).png)
Find the value you want to use to trigger the reset.
.png?width=296&upscale=true&name=Frame%207%20(1).png)
If necessary, represent this value as a string.
.png?width=720&upscale=true&name=Frame%208%20(2).png)
Changing color and opacity
Another option is to use the .setColor and .setOpacity functions to create a sketch layer that is present but not distracting. It’s a great option to use when the sketch aids or is compared to the visual feedback. These tools have a bit more flexibility, so we’ll look at them separately before talking about how you can implement them.
Setting the color
You can apply a color change to a sketch layer by appending the .setColor() function.
- Start with a sketch layer.
- Add the function.
- Set the color.
Setting opacity
You can also change the opacity of a sketch layer by appending the .setOpacity() function.
- Start with a sketch layer.
- Add the function.
- Set the opacity.
You can combine these two in any way you want to achieve the desired effect.
Once you have the sketch layer set up, add them to the component using a background sink. The last step is to also use hideSketch to show just the newly created background layer.
Each of these methods work great on their own and are really quick to set up. In fact, most of these examples can be copied and pasted as is (except for the component names) into your activities! If you’re looking to convert some old graphs into sketches (now that you know how to control what students see and when), there’s even a quick converter in the ellipsis menu of every graph and sketch component.
Don’t limit yourself to just one of these methods at a time! Here are a few ways that you can use one or a few at the same time to make student sketches useful and not distracting.