🎨
[JS] Intro to Computational Media 2.0
CS4All Resources
  • Curriculum Overview
  • How to Use this Curriculum
  • 📬Leave Us Feedback
  • Curriculum Extras
    • 🔮Curriculum Extras Overview
    • Imposter Syndrome (pt. 1)
      • Imposter Syndrome (pt. 2)
    • Timers in p5.js
    • Time Functions: Crazy Clock Mini Project
    • Using Sliders
    • Pathfinding Algorithms && Facial Scanning
    • Playing with Pixels
    • Getting Sound from Mic
    • Sound Recognition with ml5
  • Unit 1: Draw & Draw With Functions
    • 🔮Unit 1 Overview
    • U1LA1.1: p5.js Introduction & Deconstruction
    • U1LA1.2 Line Functions and Parameters
    • U1LA1.3: Rectangles, Ellipses, and Layering
    • U1LA1.4: Other Shapes && Styling
    • 🗃️U1LA1 Mini Project: Taijitu Symbol
    • U1LA2.1: Intro to Color with RGB && HSB
    • 🤓EXTRA: Color & Data Storage
    • 🤓EXTRA: Color Palette Practice
    • ✨U1LA3.1: Introducing Variables
    • ✨U1LA3.2: Creating Custom Variables
    • ✨U1LA4.1: What is Abstraction?
    • ✨U1LA4.2: Intro to Functions && Function Calls
    • U1LA4.3: Draw with Functions
    • U1LA4.4: Using the Random Function
    • 🗃️U1LA4 Mini Project: Custom Emoji
    • U1LA5.1: Your Custom Function Library
    • 🎨Unit 1 Final Project: Abstract Album Art
  • Unit 2: Respond and Draw on Canvas
    • 🔮Unit 2 Overview
    • ✨U2LA1.1: Conditionals and If Statements
    • ✨U2LA1.2: Conditionals and if, else if, and else statements
    • ✨U2LA1.3: Logical Operators And/Or
    • 🗃️U2LA1 Mini Project: Make a Traffic Light
    • U2LA2.1: Draw with Mouse
    • U2LA2.2: The Map Function
    • ✨U2LA3.1: Data Type Scavenger Hunt
    • ✨U2LA3.2: Functions that Return Values
    • 🤓U2LA3.3: Functions with Purpose
    • U2LA4.1: Collision Functions && Collide2D
    • U2LA4.2: Mouse Clicks && Shapes as Buttons
    • 🗃️U2LA2 Mini Project: Light Switch Game
    • U2LA5.1: Key Presses && Nested Conditionals
    • 🎨Unit 2 Final Project: Interactive Drawing App
  • Unit 3: Arrays, Loops, Media
    • 🔮Unit 3 Overview
    • U3LA1.1: While Loops
    • U3LA1.2: For Loops Pt 1
    • U3LA1.3: Nested For Loops (For Loops pt 2)
    • 🗃️U3LA1 Mini Project: Wallpaper Design
    • U3LA2.1: Introduction to Arrays
    • U3LA.2.2: Arrays with floor() and random()
    • 🗃️U3LA2 Mini Project 1: Fortune Teller
    • U3LA2.3: Loops and Arrays
    • U3LA2.4: Updating and Deleting from Arrays
    • 🗃️🤓 U3LA2 Mini Project 2: CodeWars Array Challenges
    • U3LA3.1: Preload, Images, Tint
    • 🤓U3LA3.2: Images and Arrays with ml5
    • U3LA3.3: Fonts && Text Styling
    • 🗃️U3LA4 Mini Project 4: Typography
    • U3LA4.1: Loading & Playing Sound Files
    • 🎨Unit 3 Final Project: Patatap
  • Unit 4: Motion, Objects, Transformation
    • 🔮Unit 4 Overview
    • U4LA1.1: Intro to Motion with Flipbooks
    • U4LA1.2: Move in All Directions && Make it Bounce
    • U4LA2.1: Introduction to Classes and Objects
    • U4LA2.2: Reading and Updating Object Properties
    • U4LA2.3: Methods Off Canvas
    • U4LA2.4: Objects on Canvas
    • 🗃️U4LA2 Mini Project: Build a Tamagotchi
    • U4LA3.1: Creating Many Objects
    • 🤓🗃 Optional U4LA3 Mini Project: Rebuild with Objects
    • U4LA4.1: Translation Battleship
    • U4LA4.2: Rotations
    • 🤓U4LA5.1: Sine && Oscillating Motion
    • 🤓U4LA5.2: Cosine && Circular Motion
    • 🎨Unit 4 Final Project: Animated Greeting Card || PSA
  • Unit 5: Final Project
    • 🔮Unit 5 Overview
    • 🎨Course Final Project Guide
Powered by GitBook
On this page
  • Overview && Teacher Feedback
  • Prompt
  • Suggested Duration
  • Sample Output
  • Extensions
  1. Unit 4: Motion, Objects, Transformation

U4LA2 Mini Project: Build a Tamagotchi

How can I use Classes/Objects on canvas to build a digital pet?

PreviousU4LA2.4: Objects on CanvasNextU4LA3.1: Creating Many Objects

Last updated 2 years ago

Overview && Teacher Feedback

Before students advance to making many objects on a canvas, we want them to practice making a Class that will generate a single object but have many properties and methods. Intro: the Tamagotchi!

The most basic version of this project does not requier anything extra, although some students may benefit from learning about modulos. If you'd like to up to the ante, consider teaching the lesson on timers before this project so that students can have needs decrease based on time.

Prompt

In this project, you'll be making your own computer-based version of the Tamagotchi! The end result will be a little character that moves around the screen, bouncing off edges, that you can interact with.

Requirements:

  1. Create a digital pet Class (named whatever you want) that has all properties and methods related to your virtual pet. You will be creating a single object instance of this pet.

  2. Design your digital pet - make a display() method so it displays on the screen.

  3. Create methods to move your pet around the screen and ensure it bounces on the edges or is otherwise unable to leave the screen.

  4. While moving, the pet should get hungrier every few 'steps' - the hunger property should change accordingly.

  5. When the pet bumps into an edge, the health should decrease.

  6. Adjust the display method so that the digital pet has a different look if it becomes too hungry or too unhealthy. (You can also make a 😵 version if both are true.)

  7. Create a method that will allow you to feed your pet by interacting via clicks or keys.

  8. Create a method that will allow you to heal your pet by interacting via clicks or keys.

Suggested Duration

~3 - 5 Periods. An easy way to shorten this project is to have students use images to make their pets rather than coding their own design - then the focus can be on the newer and more algorithmic skills.

Sample Output

Extensions

There are so many ways to extend this project:

  • Learn about and utilize modulos in your program

  • Give the Tamagotchi more properties that control different thins about it. (An easy one is age, and have the Tamagotchi 'grow up' over time.)

  • Give the project a very 90s look

  • Tamagotchi meet Pokémon: think about attributes like HP, attack, defense, etc and make a pet that can train and battle

One of the biggest toy fads of the mid '90s to early '00s was the ( | ). As kids may need more context, consider this . This was a little virtual pet that lived on a small piece of hardware attached to the keychain. When users turned it on, the pet would begin as an egg, and using simple buttons you would care for it's needs (feeding it, playing with it, training it, etc) which changed in real time. Early versions did not have a pause button, making it very stressful to keep a Tamagotchi alive.

🗃️
Tamagotchi
commercial 1
commercial 2
4 minute 90s rewind on digital pets
Sample Code
Tamagotchi
Tamagotchi gif of someone giving it a meal
Sample Tamagotchi bouncing on screen and changing moods