WireFrameJS
Mastodon
These are ports from WireFrame from Python (usually using Pygame Zero) to JS (usually using p5, which itself is a port of Processing).
Where possible I’ve used modern JS and native modules.
Contents
- EXPLOSIONS (source, discussion)
- GALAXIAN2 (source) Work in progress
- PARALLAX (source)
- THRUSTER (source)
- HIGHSCORE (source)
- TAIL (source, discussion)
- JUMP_PHYSICS (source)
- MISSILE (source)
- INVADERS (source, discussion)
- SPAWN (source)
- BREAKOUT (source)
- BOMBERMAN (source) Work in progress
- STARS (source) Work in progress
- WALKCYCLE (source) Work in progress
- ANT ATTACK (source)
- MAZE (source), and with lots of inspiration from The Coding Train. As well as MONSTERMAZE (source).
- ROLLING_ROAD (source) Work in progress but mostly there TBH, bit of tidying required for the Car is all
- SKATEBOARDING (source)
- BOMBJACK (source)
- BRAID (source)
- ZELDA LIKE (source)
- GUITAR HERO (source)
- GAME AND WATCH (source)
Web Components
Miscellaneous
- DICE
- p5Pong (Coding Challenge #67: Pong!, Intro to radians, JavaScript – Degree & Radian Conversion)
- p5Snake Snake built with p5 and native JavaScript modules, instructions:
- Download this repo and extract it to a folder you’ll remember.
- Install http-server (instructions via the link).
- Open a terminal window and navigate to the folder containing the extracted code.
- Enter
http-server
in the terminal.
- Play Snake
- p5FROGGER Frogger built with p5 and native JavaScript modules, instructions:
- Download this repo and extract it to a folder you’ll remember.
- Install http-server (instructions via the link).
- Open a terminal window and navigate to the folder containing the extracted code.
- Enter
http-server
in the terminal.
- Play Frogger
- p5PACMAN Work in progress
- OPART An experiment for my Dad
- PENDULUM An experiment for a friend, initally created using Vue and SCSS, this version is much clearer though.
- FLIP COUNTER An experiment using CSS transforms, initally based on a Digital Counter
- PARALLAX_DOORWAY Just testing something.
- ROTATING_ARCS FB Challenge ;-)
- REACT_DICE_GAME That was fun
- CUBE Thanks Pops!
- USER_TEST Quick test if this works on IE11
- p5CLOCK2x3 A small p5 Clock with a minimal
typeface
- p5CLOCK5x6 A larger p5 Clock with a different
typeface
- I’ve been tweaking this one, and I’m not sure I like it TBH.
- EMPIRE Lots of code snippets from various coding competitions, mostly from Empire of Code.
- ZOMBIE Lots of stuff with async/await
- SIERPINSKI, I decided to check a video on TikTok. Every so often it buggers up though… fixed it now.
- HEDGECLOCK, A clock inspired by the work of TransientCode.
- SLIDECLOCK, A clock inspired by the work of hans andersson.
- SLIDECLOCKDIFFERENT, A clock inspired by the work above, but I got to thinking about how we didn’t need vertically sliding elements; rather atomic elements that could move one
pixel
horizontally, vertically or diagonally. Heavy head=scratching to prevent movement of over one pixel and to ensure it remained elegant.
- AMI, Messing about with
About AM screen2M
from Pinterest and Wako Co., Ltd
- AM_SIMPLE, Similar to the above, but with just cyan and magenta, and animated.