Comp Form Week 14 - Microgames

Today’s Groups

GroupMembers
ASanie, Dorothy, Bateel
BGabriel, Amber, Sachi
CJennifer, Jonathan, Danielle
DKim, Jane, Talia, Enayet

Today’s Learning Objectives

Assignment

Keep Sketching!

Make some (micro) games. Explore making games with as little complexity as possible.

Challenge: Couch Co-op

Cooperative games are games where two or more players work together to achieve a goal. Pandemic, Forbidden Island, and Hanabi are great co-op board games. Portal 2, Lovers in a Dangerous Spacetime, and Towerfall a great co-op video games.

Couch co-op games are local multiplayer video games, where two people play together in the same room (on the same couch).

For this challenge create a couch co-op micro-game!

What is a Game?

Many interactive artifacts fall into the categories of Games, Toys, or Tools. What is the difference?

Legos, Monopoly, Soccer, Photoshop, a Hammer, a Top, Dolls, Chess, Mario Brothers, Pac-man, a Telephone.

Microgames

Minigames are small videogames included within a larger video game. These are often included to add variety to the larger game. They may also be included as easter-eggs.

Microgames are less common. Microgames are tiny games, stripped down to the bare essentials, and playable in a few seconds. The WarioWare series of games from Nintendo creates a frantic experience by stringing together dozens of microgames in rapid succession.

p5.Play

The p5.play library adds functionality to p5.js that supports creating video-games.

Take a look at the examples and the docs.

Example 1—Sprites

var sprite1, sprite2;

// art from opengameart.org

function setup() {
    createCanvas(600, 300);

    var kingImage = loadImage("king.png");
    var guyImage = loadImage("guy.png");


    sprite1 = createSprite(200, 150, 100, 100);
    sprite1.addImage("main", kingImage);
    sprite1.scale = 4;

    sprite2 = createSprite(400, 150, 100, 100);
    sprite2.addImage("main", guyImage);
    sprite2.scale = 4;
    sprite2.addSpeed(1, 180);
}


function draw() {
    background(50, 50, 80);
    noSmooth();
    drawSprites();
}

Example 2—Interaction

var sprite1;

// art from opengameart.org
// https://opengameart.org/content/a-platformer-in-the-forest

function setup() {
    createCanvas(600, 300);

    var kingImage = loadImage("king.png");

    sprite1 = createSprite(200, 150, 100, 100);
    sprite1.addImage("main", kingImage);
    sprite1.scale = 4;
    sprite1.mouseActive = true;

}


function draw() {
    background(50, 50, 80);

    if(sprite1.mouseIsOver)
        sprite1.rotation = -20;
    else{
        sprite1.rotation = 0;
    }

    noSmooth();
    drawSprites();
}

In-Class Challenges

Download the example files. Complete the following challenges.

Modify Example 1

Modify Example 2

Challenging Challenges