Infinisnake

Project Summary

A PIXEL
SERPENT
WITH A
DAY JOB

Infinisnake is a fully designed and playable arcade game — built entirely in HTML Canvas and JavaScript. Beyond writing the code, this project required designing a coherent game mechanic, a pixel visual identity, a narrative world, and a complete user experience from title screen to game over. It's a demonstration of creative coding as a design discipline.

01 — Visual Identity

BOX ART & BRANDING

02 — Narrative Design

BACKGROUND STORY

> WORLD BUILDING

In the back room of a failing pizzeria in 1987, an arcade cabinet was abandoned with its coin door open. When the power finally cut, something inside kept running on leftover voltage — and a tiny, glitch-born logistics company quietly booted up in its memory.

Three warehouses sprouted: Crimson Storage, Azure Depot, Solar Bay. Each one demands colored cargo that nobody ordered. The only carrier that ever shows up for work is the serpent — a pixel worm whose body is literally the cargo hold. It swallows a red crate; it grows a red segment. It passes through Crimson Storage; its red segments are unloaded, and it shrinks by exactly that many tiles.

You are the dispatcher. You are the driver. You are the one deciding whether to keep stacking cargo for a big combo, or cash out now before your tail runs into your own spine.

03 — Game Design

CORE FEATURES

▓▓▓

CARGO SYSTEM

Snake body segments ARE the cargo — swallow a red crate, grow a red segment. Deliver to the matching warehouse to shed those segments.

◈◈◈

COMBO CHAINS

Deliver multiple same-color segments in one run for multiplied score. Risk vs. reward: stack more cargo, but your tail grows longer.

▶▶▶

ENDLESS MODE

No win condition — only survival. Grid speed increases, warehouse positions shift, and difficulty scales dynamically with your score.

♦♦♦

PIXEL ART UI

Full retro visual identity — scanline overlay, pixel typography, CRT vignette. Every UI element designed as part of the world.

⌨⌨⌨

CONTROLS

Arrow keys + WASD for keyboard. Full touch controls for mobile. Responsive grid that scales to any screen size.

◉◉◉

SOUND DESIGN

Procedurally generated 8-bit sound effects for pickups, deliveries, combos, and game over — all synthesized in the browser.

04 — Technical Design

MECHANICS BREAKDOWN

Rendering HTML5 Canvas with requestAnimationFrame game loop. Grid-based tile system with per-cell state tracking for snake body, cargo, and warehouses.

Snake Logic Body segments stored as a linked list of {x, y, color} nodes. Cargo pickup appends colored nodes; warehouse delivery pops matching color nodes from the tail end.

Difficulty Tick rate decreases by 2ms per 50 points scored. New cargo types and warehouse layouts introduced at score thresholds to maintain engagement.

Visual Style Pixel art palette constrained to 8 colors. CRT scanline effect via CSS. Custom Press Start 2P typeface for all in-game UI elements.

PLAY IT NOW

▶ START GAME

INFINI
SNAKE