Snakeshift

A negative space puzzle game inspired by Snake and Shift.

Shapeshift in makeshift ways. Shift snakes into lakes. Snake wakes into shapes.

Skin and fang. Yin and yang. Snakes shelter sneks like sheds, then shed kin like skin.

Play the Game

Play Snakeshift in your browser.

Controls

Mouse/Pen/Touch

Drag anywhere to move the snake in the direction of the drag.

Click on a snake to switch to it.

Gamepad

Use the left stick to point in the direction you want to move, and then press A to move to the highlighted cell. Or use the D-pad to move.

Shoulder buttons switch snakes.

Press ⓧ to undo, Ⓑ to redo.
Press Ⓨ to restart the level.

You may need to press a button to activate the gamepad, before the web page can see it.

NOTE: The level editor does not currently support gamepad controls.

Keyboard

You can use the arrow keys, WASD, HJKL, or the number pad to move.

Tab switches between snakes.

Press Z to undo, Y to redo.

Press R to restart the level. This is undoable.

Press ` to toggle the level editor.

Press Ctrl+S to save the level, and Ctrl+O to open a level.

Project Structure

This project uses Vite and TypeScript.

• /game/ — the source code.
• /game/dist/ — the built files, which could be deployed to a static web server.
• /public/ — Files in this folder will be copied to the dist directory when building. These are referenced with absolute paths in CSS, but relative paths in HTML and JS, without the /public prefix in either case.
• /tests/ — Playwright tests.
• /tsconfig.json — Typescript settings.
• /eslintrc.cjs — ESLint settings.
• /vite.config.js — Vite settings.
• /package.json — dependencies and scripts.
  • /package-lock.json — generated file, used for reproducible builds.
• /cspell.json — spell check settings and dictionary.

Development

Install dependencies and run the dev server:

npm install
npm run dev

Quality Control

This command runs the spell checker, the typescript compiler, and eslint:

npm run lint

This command will run tests using Playwright:

npm run test

Learn more about Playwright's philosophy and tooling.
It has great VS Code integration, a test recorder/generator, a trace viewer including screen capture replay, and more.

File Format Versioning

When the file format changes, increment FORMAT_VERSION and add an upgrade step for backwards compatibility in game-state.ts.

To update all levels to the new format, run:

node update-level-format.js

Deployment

To build for production and push to GitHub Pages:

npm run deploy

Ideas and TODOs

See TODO.md.

License

This project is licensed under the MIT License. See the LICENSE.txt file for details.