The Grove

Overview

The Grove is a cozy resource management and crafting game built in P5.js for the midterm. The player moves between five locations — a Map, River, Forest, Pottery Studio, and Greenhouse — collecting resources, making pottery, and growing plants. For the final, the project is being expanded into a physical table installation. All mouse and keyboard input is replaced with custom props and sensors, so every in-game action has a corresponding physical one.

What’s Already Built

The full P5.js game is complete from the midterm. This includes:

• • All five scenes with backgrounds, navigation, and per-scene background music
  • A full inventory and resource system (clay, soil, water, seeds, pots)
  • The complete pottery workflow: place clay, shape on wheel, fire in furnace, collect
  • A plant growth system with three growth stages, timers, and harvest logic
  • Sprite sheet animations for plants, pots, and the watering can
  • Sound effects for every interaction and background music per scene
  • A custom cursor, backpack inventory overlay, main menu, pause menu, and instructions screen

Physical Components

Joystick — Navigation

The joystick is the main input device and replaces the mouse entirely. It handles all navigation and selection across every scene.

• • Left/Right on the Map cycles through locations (Studio, Greenhouse, Forest, River). Button enters.
  • In scenes, Up moves focus to the upper HUD (Back to Map / Menu). Down moves to the lower HUD (inventory). Left/Right cycles between options in the current zone. Button confirms.
  • In the Studio, Left/Right switches focus between the pottery wheel and furnace.
  • In the Menu, Up/Down cycles options and Button selects.

Ultrasonic Proximity Sensor — Pottery Wheel

An HC-SR04 sensor is mounted face-up at the Studio zone. To shape a pot, the player holds both hands above it with palms facing down, mimicking cupping clay on a wheel. The closer the hands, the faster the pot shapes. Pulling hands away pauses progress. This replaces the original click-and-hold mechanic.

Potentiometer — Furnace

A rotary dial at the Studio zone controls the furnace. Turning it up starts firing. The player watches the pot sprite on screen and turns the dial down at the right moment to retrieve the pot. Leaving it too long burns or destroys it.

Digging Mechanic — Forest

Five fixed plot positions in the forest scene each map to a physical point on the table. On every spawn and respawn (after a 30-second cooldown), each plot is randomly assigned as clay or soil, readable from the sprite on screen.

The current plan is to use a conductive shovel prop with an aluminum foil tip and five corresponding foil contact points on a flat board (four corners and a center), each wired to its own Arduino pin. Touching the shovel to a point completes the circuit and triggers that plot. Contact must be held for 200ms to avoid false triggers.

An alternative being considered is a keypad, where each key corresponds to one of the five plot positions. This would be simpler to wire and more reliable, but less immersive than the shovel prop given the physical metaphor of the rest of the installation.

Water Sensor — Greenhouse

A moisture sensor sits inside a small cup with drainage holes at the bottom. After placing a seed, the player physically pours water into the cup to water the plant in-game. A high analog threshold distinguishes a real pour from residual moisture, and a short debounce timer prevents repeated triggers while the cup drains.

Arduino

The Arduino reads all sensors and sends a single comma-separated line over serial each loop:

joyX, joyY, joyBtn, proximity, potValue, waterValue, dig0, dig1, dig2, dig3, dig4

All game logic stays in P5. The Arduino only handles reading and transmitting. Debounce and sampling logic is handled on the Arduino side: 150ms for the joystick, 200ms hold for shovel contacts, 3-4 second suppression after a water trigger, and a 5-sample rolling average for the proximity sensor.

P5 Changes

The existing code is being modified, not rewritten. The main changes are:

• • input.js: Web Serial API replaces all mouse and keyboard handlers. Incoming serial data is parsed into a global sensorState object read every frame.
  • globals.js: New sensor state variables added alongside existing ones.
  • screens.js: A focus system is layered into each scene. The joystick moves focus between defined zones per scene. The button triggers whatever is currently focused. Pulsating glow and highlight drawn on the focused element.
  • classes.js: ResourcePlot updated to re-randomise its type on each respawn.
  • sketch.js: Minimal changes.

Table Layout

Each prop sits in a zone on the table that corresponds to its location in the game. The joystick is at the center. The proximity sensor and potentiometer are grouped at the Studio zone. The digging board and shovel are at the Forest zone. The watering cup is at the Greenhouse zone. The idea is that as the player moves between locations in the game, they also shift their focus and hands to a different part of the table.

Progress

• • Done: Full P5.js game from midterm
  • Done: Physical interaction design for all five components
  • Done: Joystick navigation model defined for all scenes
  • In progress: Arduino wiring and serial protocol
  • Pending: Web Serial integration in P5
  • Pending: Focus and highlight system in P5
  • Pending: Sprite changes in P5
  • Pending: Sensor threshold calibration
  • Pending: Physical prop construction and table setup