🗃 U4LA.1: Make a Floating DVD Logo

How can I make objects move in different directions?


If you’ve ever let a device sit idle while it’s plugged into something like a laptop, DVD/Blu-ray player, game console, or even watched a Smartboard, you’ve noticed that the people behind those hardware systems have made a ‘default screen’ to display when nothing is happening. Sometimes, this is just a static logo - but in the best versions, it is a logo that moves around the screen. This can be pretty enjoyable to watch, and pretty distracting, as you can see from this example.
Using what you know about animation, you are going to create a simple DVD screensaver (or any device really) with a logo to send bouncing around the screen.
DVD logo traveling around screen and bouncing on edges with color change on bounce
Your project should have and do the following:
  • Have a basic logo made of several p5 shapes, or multiple images, or multiple lines of text, or a mix of all three. It should not be just a single shape/image/text line!
  • When you hit play, the shape should begin moving around the screen.
  • If the shape gets to an edge, it should bounce back and travel in a different direction. (It can absolutely change speed when it picks this new direction!)
Writing Prompt:
Pick one conditional statement used in your program. Using comments, explain what it does and how/why it works.

Sample Output


Since we are on a computer and not just a TV monitor or smartboard, let’s make this more interactive!
  • Make your logo interact with the mouse - when the mouse touches the logo, it should change directions.
  • Alternately, see if you can figure out if you can get the logo to ‘chase’ the mouse!
  • You can also try to make something other than direction change with your shape!