Coffee Block Rush

{Coffee Block Rush} Project Report

1. The Concept

Coffee Block Rush is a slide-to-serve block puzzle for phones. Colored polyomino crates sit on an 8×8 café grid. Each color has a matching cup gate on a conveyor around the board. The player’s job is simple to explain and hard to master:

Slide a crate to its own color gate — then coffee cups jump in, fill every hole, and the box packs away.

It is an Unblock-Me / Color Block Jam loop, but the identity is a busy coffee shop: joined crate tiles, mini cups riding the belts, a wood HUD, and a storefront backdrop. The unique hook is the serve itself — cups leave the belt, land in four holes per cell, beans fly to the score, the tile pops, the lane goes dark — so clearing a color feels like finishing an order, not a grid cell disappearing.

Design goals:

Instant rules (Level 1: “SLIDE TO THE ARROW”)
Soft ramp across 48 interlocking levels (more bars, tighter locks, higher par)
Beginner tools (3 undos / bombs, 3 hints / saws per level) plus HUD restart
One clear win loop: slide → fill cups → pack the crate → celebrate stars → next
A smartphone game UI (one job per screen), not a web dashboard

Risk/reward sits in the board, not a shop. A greedy slide can pin a color behind another bar. Stars grade cleanliness against par. Pieces start off their own gates on purpose — the puzzle is bringing a crate to its cups, not serving an order that is already lined up. Each crate you move can fill when it sits on its gate; leftover crates do not dump themselves, so every color still needs a player action.

2. The Stack

Built as a zero-build, zero-dependency product so it can ship and play the same day.

Layer Choice ----------- ---------------------------------------------------------------- Structure index.html (home, levels, play HUD, board, pause / win) UI Vanilla CSS (café tokens, safe-area, joined-cell sprites, belts) Logic Vanilla JavaScript ("use strict", ~780 lines) Art WebP crate cells + cup sprites per color; storefront background Audio Web Audio API (procedural SFX; no sound files) Progress localStorage (cbr-save) — highest level, stars, best moves, sound, tutorial flag Target Phone browser (portrait, viewport-fit=cover, user-scalable=no) Fonts Fredoka (Google Fonts)

No framework, no bundler, no npm — open the folder and play.

Architecture choices: hand-authored levels sit as LEVELS (exits + I-bar helpers IH / IV); visual aliases (navy→blue, lime→green) fold duplicate cup art; occupancy, drag snap, and serve timing stay in one file. Design constraints live in sakurai/ and rules/ plus sakurai_game_contnt_v1.0_kh.txt, not in a separate engine.

3. The 1 Day Sprint (+ polish pass)

The day was treated as a full vertical slice: concept → playable core → juice → shippable demo. Scope stayed tight: one mechanic, one café world, one 48-level path. Anything that did not serve “slide the crate to its cups, and feel the order leave” was cut.

Morning (Hours 1–3):

Locked the fantasy: 8×8 well grid, colored crates, matching gates on all four sides, coffee-shop chrome.
Built the app shell: home (PLAY / LEVELS / sound), level grid, in-game HUD (restart, level, score, pause).
Implemented occupancy, pointer drag with axis lock after the first flick, snap-to-cell, and color-matched wall exits.
First playable loop: slide a piece to the wall, it counts as served, board updates.

Outcome: A draggable prototype that already looked like a café puzzle, not a wireframe.

Afternoon (Hours 4–6):

Followed the serve fantasy: conveyor belts of mini cups, jump from belt into four slots per cell, pop the filled tile, pack the whole crate, hide that color’s lane.
Score as beans, not move count: each landed cup flies to the HUD for +5; moves stay private for stars.
Auto-serve the crate the player just parked on its gate (not a chain dump of every ready color).
Pause (Continue / Home), win modal, undo bombs and saw hints, Level 1 tutorial flag.
First Web Audio pass (slide, fill, pack, win); toast copy for tools.

Outcome: A real campaign with juice, not a single hand-made puzzle.

The Finish Line (Hour 7-8):

48 interlocking layouts (I3/I4 bars, unique visual colors, pieces start off their own gates).
Stars from moves vs ideal; best stored per level; next level unlocks on clear.
Complete screen: ORDER SERVED, stars, moves / best, NEXT + LEVELS (replay lives on the HUD, not the win card).
Containment for gates so a tall crate cannot dump into a one-row cup lane just by grazing it.
Mobile-safe board size from wrap width; belts and gates scale with --cell.

Outcome: A self-contained demo ready to show, share, or iterate.

Polish (Aug 10):

The studio juice pass for this title:

Cup and crate WebP palettes (red, orange, yellow, green, cyan, blue, purple, pink) plus storefront background.
Belt → slot jump, packed fade, bean fly + “+5”, score pop on the plaque.
Duplicate visual colors folded (lime/navy/white aliased) so each live color has one lane.
Difficulty pass: denser boards after playtest felt too fast; axis lock on straight bars was tried and dropped so crates still slide both ways when the path is empty.
UI honesty: pause is Continue + Home; complete is NEXT + LEVELS as full game buttons.
Copy and layout pass against sakurai/rules: one action per screen, wood 3D buttons, skippable first-level hint.

4. The Roadblocks

Wins that felt empty — Sparse boards plus overlap-based gates plus a serve cascade meant leftover crates dumped themselves after one good slide. Playtest (“លេងឆាប់ឈ្នះ… ធុញ”) forced denser I-bar locks, full-gate containment, and serve-only-the-piece-you-moved.

Motion vs. rules — Locking tall bars to one axis (Rush Hour cars) made the puzzle harder but broke the player’s mental model: a cyan I4 showed ↕ and would not go left/right even into empty cells. Axis lock was removed; occupancy still blocks a path when another crate is in the way.

Feel vs. cheap clear — Instant “piece gone” did not read as coffee. Cups had to leave the belt, land, fill four holes, pop the tile, then pack. Score had to fly; the HUD bean line is points, not moves.

Color identity — Two greens or two blues on one board looked like a duplicate order. Aliasing lime→green and navy→blue, then dropping extra gates of the same art color, kept one lane per visual cup.

Phone chrome — The board must size from the visible wrap, not a magic cell. Belts, gates, and drag deltas all key off --cell so cups stay on the frame when the viewport changes.

Audio without assets — No sound pack in a 1-day sprint. Web Audio oscillators carry slide / fill / pack / win; browsers still need a user gesture to unlock the context.

Scope pressure — A solver, shop, ads, and 100 unique polyominoes were tempting. Hand I-bars, 48 levels, 3 bombs / 3 saws, and HUD restart kept the day on one composition: brand, one loop, ship.

5. Key Takeaways

One sentence concept + three static files is enough to ship a complete 48-level slide-to-serve loop in a day.
Familiar rules (Unblock Me) + a local identity (café crates, cup jump, bean score) beats inventing a new mechanic under time pressure.
Feel is product: belt → slot, tile pop, and “slide not tap” mattered as much as matchingExit for “this is a game.”
Difficulty that fights the player’s hands (axis lock on a 2D slide) is worse than difficulty on the board. Lock the crates with other crates, not with a hidden rule.
Cut features early; polish the core loop (slide → fill cups → pack) instead of spreading thin across meta systems.
Design docs (sakurai/, rules/, sakurai_game_contnt_v1.0_kh.txt) kept screens honest: one job, portrait, skippable tutorial, assist that does not shame.

My final thought:

A one-day game only works when the concept is a single sentence and the stack stays out of the way. Coffee Block Rush proves that: drag the crate, kiss the cups, watch the order leave; a full campaign with tools, stars, and a home screen inside three files. The next steps are optional — handcrafted late-level solvability, richer audio, more shapes — but the core already delivers what mattered most: slide it in, see the cups land, smile, next.