Skip to content

Please update your browser

Your browser version is not supported by this site. CS First may not work properly. Learn more

arrow_back Changing Looks with Code

Choose an Add-On
play_circle_filled
Add a Soundtrack
Add music to run in the background of your project.
arrow_forward
play_circle_filled
Changing Backdrops and Costumes
Add different scenes to your story.
arrow_forward
play_circle_filled
Changing Looks with Code
Learn what the "looks" blocks can do.
arrow_forward
play_circle_filled
Move Around the Stage
Discover ways to make sprites move.
arrow_forward
play_circle_filled
Animate
Animate sprites by creating new costumes.
arrow_forward
play_circle_filled
Secret Password
Make a password to protect your story.
arrow_forward
  • 1. Introduction to Our Story
  • 2. Set the Scene
  • 3. Sequencing Your Story
  • 4. Add-Ons
  • 5. Reflection
  • 6. Sequencing in the World Around You
  • 7. Wrap-up: Share Your Project
  • 8. Wrap-up: Show Your Project
arrow_backward Back Next arrow_forward
Transcript

This video will introduce ways to change the sprites’ looks.

Click on the “looks” menu to check out many different ways you can change the appearance of the sprite.

Click the “change effect” block in the blocks palette to test it.

You can change the color, Apply a fisheye, Whirl the sprite, Pixelate the sprite to make it blurry, Turn the sprite into a mosaic, Make it brighter, And even make it transparent, Awesome!

You can easily undo all of those changes by clicking on the “clear graphic effects” block.

Drag out a “change effect by” block to change the appearance of the “my sprite”.

In this example story, the “my sprite” turns green.

This example selects color from the menu, but you can choose any effect that fits your story.

Tinker with the value of the “change effect by” block until you like the outcome.

Add a “when flag clicked” block to the top of the code stack to make it easy for other people to run your code.

Test it out!

Wait - that’s not right for this story!

The sprite shouldn’t start that color.

To reset the sprite to its original appearance whenever the code is run, place a “clear graphic effects” block just under the “when flag clicked” block.

Then test it.

Great!

Here are two other examples of using the “change effect by” block to tell a story.

This story uses the whirl effect to show dancing.

This story uses the pixelate effect to show confusion.

Be creative and use the "change effect by" to tell your story.

Now it’s your turn: Change the sprite’s appearance using the “change effect by” and “clear graphic effects” blocks.

Instructions
  1. Choose an Add-On, and click "watch" to learn how to build it.
  2. Once you finish one Add-On, try another one below the video!