Winners from 2020 edition
Multi voice piano with variable note length and 3 instruments.
An excursion to the stars
raymarched scenery
A game with a merman 🧜🏽♂️, harpoons 🔱 and bouncing fishes 🦐🐡🐠
Overall results from 2020 edition
Multi voice piano with variable note length and 3 instruments.
1Keys 🎹 by KilledByAPixel
HTML project, 1024/1024 bytes
This three instrument ∿🎷🎹 piano supports play with both keyboard and mouse!
The keyboard setup mirrors the onscreen piano keyboard and allows playing simultaneous notes.
Keys light up red when played and can be held for any length of time.
Thanks to Rodrigo Siqueira for helping prototype this!
Simple Mod Ideas...
- Option to change wave shape with oscillator.type
- Octave and Root Key control
- More instruments try `456` for a major chord
An excursion to the stars
Star Traveler by Dietrich Epp
2d canvas project, 1006/1024 bytes
[h]Travel to the Stars[/h]
Lasts 30 seconds, then repeats.
My first 1K demo (although I’ve done JS13K before).
Twitter: [link]https://twitter.com/DietrichEpp[/link]
Home page: [link]https://www.moria.us/demos/star-traveler[/link]
Eat apples to grow and shed your skin. Avoid colliding with yourself or skin waste or you'll die. Try to beat the hiscore!
🐍Shedding Snake by Niklas Berg
HTML project, 1024/1024 bytes
Eat apples to grow and shed your skin. Avoid colliding with yourself or skin waste or you'll die. Try to beat the hiscore! Can you reach 25? I can't.
[b]Controls[/b]: WASD or Arrow keys.
Features snake head facing correct direction, decorated snake back, skin shreds as obstacles, randomized apples and cherries, hiscore as unnecessary emojis to reach exactly 1024 bytes 😃 (no RegPack).
Git repo: [link]https://github.com/nkholski/shedding-snake[/link] (including custom node script for minimizing code)
A simple roundish game about avoiding things.
Avoid by KChplr
2d canvas project, 1020/1024 bytes
A roundish game about avoiding things flying your way. Your score increases over time, so does the difficulty. Keep calm and don't go too close to the edge of the playfield.
The focus of this project was to have satisfying controls and a polished gameplay, however simplistic it may be.
[h]Controls[/h]
- Move using the [b]arrow[/b] keys
- Accelerate faster with the [b]X[/b] key
- Restart the game using the [b]R[/b] key once you're hit
[link]https://twitter.com/kchplr[/link]
raymarched scenery
Wetlands by yonatan
shader project, 970/1024 bytes
some raymarched scenery
A game with a merman 🧜🏽♂️, harpoons 🔱 and bouncing fishes 🦐🐡🐠
AquaPop1K by Kang Seonghoon and Erik Sombroek
p5.js project, 1024/1024 bytes
[h]AquaPop1K[/h]
You are a merman 🧜🏽♂️ with an unlimited supply of harpoons 🔱. Fishes 🦐🐡🐠 somehow bounce around the seabed... What would you do? Split them in halves!
This is a version of Pang ([link]https://en.wikipedia.org/wiki/Pang_(video_game)[/link]) in 1024 bytes of JavaScript with p5.js. Erik Sombroek ([link]https://twitter.com/eriksombroek[/link]) wrote the original version with an inspiration from [em]Bubble Trouble[/em] and Kang Seonghoon ([link]https://twitter.com/senokay[/link]) minified it to fit the size.
[b]Controls[/b]
The game starts when you start moving around.
• Left/right arrow to control the merman
• Space to shoot a harpoon
• Enter to restart the game (even in-game)
[b]Bonuses[/b]
For each hit there is a 10% chance of bonuses. They disappear after 5 bounces, so hurry up!
• Heart 💝: You are safe from fishes for one hit.
• Clock ⏰: Everything except you and your harpoon slows down for 10 seconds.
• Star ⭐: You can shoot multiple harpoons for 10 seconds.
[b]Technical[/b]
The code was minified with Terser ([link]https://github.com/terser/terser[/link]) and RegPack ([link]https://siorki.github.io/regPack.html[/link]). The actual job is done via a (then) custom version of Terser-online ([link]https://xem.github.io/terser-online/[/link]) with tons of pre- and postprocessing code.
All sprites are done with emoji. Unfortunately different platforms have different emoji fonts, as a result the graphics might be slightly off. It should look well in macOS and reasonably well in Windows, both tested in Chrome and Firefox.
A tiny roguelike
Rog by baturinsky
HTML project, 1006/1024 bytes
Move and attack with arrow keys.
Everything has 8hp.
Your attacks always hit and do d6 damage.
Enemy attacks do 1 damage (except certain enemies, see below), and have hit chance depending on relative levels.
Digging dirt or diamonds also costs 1hp per strike.
Levels are color coded blue=>green=>yellow=>orange=>red.
Defeating an enemy gives you 3xp for enemies below your level, 5xp for enemies of your level,
and 5xp more per each level above.
The victory also gives you 1 hp.
Digging up diamonds gives you 15 xp, but no hp.
You level up when you get 100 xp.
The goal is to reach the stairs at the bottom right corner.
OBELISK restores your hp to the max when defeated.
WOLF has no special traits.
SKELETON does not restore your hp.
WARRIOR takes 1 less damage from your attacks.
AXE GOBLIN has reduced hit chance but deals 2 damage.
FIRE ELEMENTAL self-destructs on a successful attack, removing 2 of your hp.
WIZARD deals and takes double damage.
Me
[link]github.com/baturinsky[/link]
[link]twitter.com/baturinsky[/link]
Rog on codepen
[link]https://codepen.io/baturinsky/pen/MWKVZxL[/link]
As a new parent, try to clean Nikki's poop!
Nikki Poop by Thierry "lordfpx" Philippe
HTML project, 1015/1024 bytes
The idea comes from my new status as a father since the 23th of june of this year!
I always wanted to participate such little competition, but not against others, but against myself.
This little game is dedicated to my new baby born: Nikki of course :-).
All in pure JS, HTML and CSS with a fluid display.
Please use the arrow keys to "enjoy" the cleaning and have the highest score!
Enjoy :-)
a logo that is falling apart
detached by supernapie
2d canvas project, 1009/1024 bytes
The demo is based on verlet integration.
I learned it long ago from this book: [link]https://github.com/Apress/adv-actionscript-3.0-animation[/link]
I have used it in so many projects and languages now that it was time to golf it.
You can see the wrong ideas i had about golfing in this repo: [link]https://github.com/Quinten/detached[/link]
Terrain + Water + balloon ...ish ;)
Balloon 1k by Raimon Ràfols
2d canvas project, 1024/1024 bytes
[h]Balloon 1k[/h]
1k JavaScript 2D Canvas demo by [link]https://twitter.com/rrafols[/link]
Inspired by the balloning three.js demo by @alexanderperrin
[link]https://alexanderperrin.com.au/triangles/ballooning/[/link]
Minimized using the online version of Terser + RegPack
[link]https://xem.github.io/terser-online/[/link]
RegPack options:
[code]{
withMath: false,
hash2DContext: true,
hashWebGLContext: true,
hashAudioContext: true,
contextVariableName: "c",
contextType: 0,
reassignVars: true,
varsNotReassigned: "a b c d", // js1024
crushGainFactor: 8,
crushLengthFactor: 18,
crushCopiesFactor: 20,
crushTiebreakerFactor: 1,
wrapInSetInterval: false,
timeVariableName: "t",
useES6: true
}[/code]
[b]Postmortem: [/b][link]http://blog.rafols.org/index.php/2020/07/21/javascript-balloon-1k-postmortem/[/link]
Rocket simulation near a planet
Simple Rocket Simulation by Muhammad Rifqi Priyo Susanto
p5.js project, 1024/1024 bytes
Rocket simulation near a planet
[b]How to play[/b]
- Set its orbit so that it touches target.
- New target will be set after old target has been reached.
- The game is over when the rocket falls to the planet.
[b]Controls[/b]
- Up arrow: throttle forward
- Down arrow: throttle backward
- Left arrow: turn left
- Right arrow: turn right
- W key: toggle prograde facing
[b]Note[/b]
Same with any physics game, any lag/glitch may cause your rocket to go to the infinity and beyond. :P
[b]Tools[/b]
- RegPack v5.0.3
- Google Closure Compiler
At first it goes woosh, then it goes stomp!
xSP Annulus Sectors by KChplr
2d canvas project, 1000/1024 bytes
Series of annulus sectors subdivided using binary and ternary space partioning. Wait a bit for the second motion sequence. At first it goes woosh, then it goes stomp!
There are about one thousands beginPath/arc/stroke calls per frames, it might be taxing for older computers.
[link]https://twitter.com/kchplr[/link]
Mandelbrot set in 3D
Mandelbulb by Alfons Nilsson
shader project, 583/1024 bytes
It's like the mandelbrot set but in 3D. Kinda epic if you ask me.
Twitter: [link] https://twitter.com/TC5550_2 [/link]
A Logic Puzzle Mashup of Sokoban and 2048
Digit Dilemma Plus by KilledByAPixel
HTML project, 1017/1024 bytes
Push numbers until none are left. All puzzles are solvable!
Arrows = Move
Space = Undo
R = Randomize
2d texture on a 3d sphere
wave projection by ford
p5.js project, 951/1024 bytes
[b]-> mouse click drag to rotate sphere [/b]
[b]-> mouse scroll to enter the sphere [/b]
[b]-> adjust sliders to modulate texture [/b]
Help Detective Moji with his Identikit, finding the correct face!
Detective Moji by Mattia
HTML project, 1013/1024 bytes
[h]🕵️[/h]
[b]Detective Moji[/b] is a simple "find the object" game.
Help the detective with his Identikit, finding the correct face.
Fast before the time runs out!
[h]Features[/h]
Highscore, Increasing difficulty, Title, Game and Game Over screens, Emoji rotation Mac OS bug :)
[h]Controls[/h]
Click or tap!
[h]Golfing[/h]
Golfed by hand + online javascript minifier
[h]Post-mortem[/h]
[link]https://www.mattiafortunati.com/detective-moji-postmortem-a-javascript-game-in-just-1024-bytes/[/link]
Collect the coins and avoid the red obstacles by controlling a ship during a blue sunset.
Blue Sunset Flight by gogoprog
2d canvas project, 1024/1024 bytes
# Blue Sunset Flight
## JS1024
Entry for JS1024 2020 : Annual javascript golfing competition.
## Instructions
* Use the mouse to pick the white coins
## Features
* Parallax backgrounds inspired by https://filipp8.itch.io/drones
* User-controlled ship
* Pickable coins
* Obstacles
* Life
* Score
* Code size is below 1024 bytes
## Build
Use Haxe Compiler 4.0.5
## Minimization
The minimization process I used is the following:
* Manual strip of Haxe function
* https://github.com/terser/terser
* https://github.com/Siorki/RegPack
Generates terrain and renders it with Css3D
Css3D terrain by baturinsky
HTML project, 833/1024 bytes
Generates a heightmap with a simple gradient noise algorithm and renders it as a stack of Css3D planes.
[link]twitter.com/baturinsky[/link]
[link]github.com/baturinsky[/link]
Generates small Zelda-inspired dungeon layouts (and silly faces)
Dungeon Layout Generator by KChplr
2d canvas project, 941/1024 bytes
At its core the generator uses the classic maze-building combination of a random walker and "recursive" backtracking with the following additional bells and whistles.
[b]1.[/b] The generator randomly decides whether to create a symmetrical (horizontally-mirrored) layout. The symmetry makes for more believable buildings, but also triggers pareidolia more consistently which calls back to the dungeon layouts of the original Zelda.
[b]2.[/b] Whenever the walker places a new room and detects an existing room in the same direction it just moved, it has 50% of probability to create a door between those rooms. This ensures that most layouts are not simple mazes by creating loops. In a game, this would reduce the amount of backtracking and offer more agency to the player.
[b]3.[/b] Whenever the walker places a new room, it randomly decides whether to leave the intersection with the previous room open or to add a door. This adds some variety to the layout by creating small rooms and long corridors.
This dungeon generator is quite good at making silly faces.
[h]Controls[/h]
Press [b]n[/b] to generate a new layout.
[link]https://twitter.com/kchplr[/link]
Minishadertoy-like with a memory.
Minigpgpu by baturinsky
HTML project, 1020/1024 bytes
This tool is heavily inspired by the minishadertoy [link]http://xem.github.io/MiniShadertoy[/link]
A significant difference is that each frame's shader is given a previous frame as a texture.
Shader inputs and outputs:
[code]uniform sampler2D T; //Previous frame RGBA[/code]
[code]uniform float t; //frame number (60fps)[/code]
[code]out vec4 c; //should have resulting color's RGBA[/code]
Though, there are no other inputs (such as Mouse input) that minishadertoy has.
Frame size is fixed 1900*960px.
Click on the frame to apply code changes and restart.
This demo includes Game of Life as an example.
[link]github.com/baturinsky[/link]
[link]twitter.com/baturinsky[/link]
Thanks to KChplr, xem, yurume, kipkat and others on js1024 discord for help.
Can you solve the maze before the timer runs out?
Maze Runner by RobbyG
2d canvas project, 1022/1024 bytes
The first maze is simple and the timer is ample, but with each level mastered comes a larger maze and a little more time. How high can you push your score before the timer runs out?
[h]Controls[/h]
- Move using WASD / ZQSD / Arrow keys
- Holding down a key lets you move faster
interactive möbius band experiance
Möbiusband by geb
p5.js project, 1006/1024 bytes
[h]möbius band[/h]
i [em] love [/em] möbius loops!
made with: [em]p5.js[/em], [em]ZzFX[/em] and [em] procrastination [/em]
1000 and 6 carefully chosen bytes
[*] [b]mouse [/b] controls the rotation speed and angle
[*] mouse [b] click [/b] to save your favorite frame
[*] press [b] backspace [/b] to mute sounds and any other button to unmute
[link] https://twitter.com/13utters [/link]
................. █
.............█ ...... █
..........█....█.█.....█
Guess which color swatch matches the hex code!
Hex Guess 0x400 by burntcustard
HTML project, 1021/1024 bytes
Uses Terser, Regpack, and CSSO for minification, in a custom build script.
Repository: [link] https://github.com/burntcustard/hex-guess-0x400 [/link]
Fly your ship through a rain of asteroids!
HardFlight1024 by madx
2d canvas project, 1009/1024 bytes
This is a remake of my game HardFlight ([link]http://play.yapok.org/hardflight/[/link]) in 1009 bytes!
If you want the original music too, you can open it in SoundCloud [link]https://soundcloud.com/gundatsch/raining-bits[/link], although it won't speed up as in the original HardFlight. Credits goes to Gundatsch for the music.
No RegPack here, only used Terser on the input code to shrink it.
Shot Ball is a game that consists of shooting enemies and not letting them pass. It can be played using only the mouse;
shot ball by juliandavid
p5.js project, 998/1024 bytes
Shot Ball is a game that consists of shooting enemies and not letting them pass. It can be played using only the mouse;
p5js
Simple one-button game developed with WebGL in p5.js
One Button Roulette by stackshub
p5.js project, 1018/1024 bytes
# One Button Roulette
Simple one-button game developed with WebGL in p5.js
# Controls
* Space key
* Mouse
* Touch
# Tools
* p5.js
* terser
A collection of 9 tiny tools for code-golfers
Golfer tools by xem
HTML project, 1024/1024 bytes
- HTML minifier: paste some HTML in the textarea and it'll be minified instantly
- CSS minifier: paste some CSS in the textarea and it'll be minified instantly
- Speak: type anything and click "go" to let your browser pronounce it with its default voice
- KeyCode: press any key in the text input to know its keyCode value
- Regex tester: write a regex on top, text on the bottom, and it'll show which part(s) of the text match the regex
- File to URI: upload a file (not too big) to see it converted to a base64 URI
- File to hex: upload a file (not too big) to see it in hexadecimal
- Postit: persistent text storage. Put text inside, refresh the browser, it's still there!
- Fiddle: HTML/CSS/JS playground like Codepen or JSFiddle. The result appears instantly on the left.
3D Pipes Screensaver - short code
3D pipes by ntsutae
p5.js project, 246/1024 bytes
Golfed code
https://editor.p5js.org/ntsutae/sketches/IYJwBjBoq
Readable code
https://editor.p5js.org/ntsutae/sketches/WOnMmTI9e
Made from 1400 tori
Crystal Ball by ntsutae
p5.js project, 183/1024 bytes
This is made from 1400tori.
Each torus has a different angle and move out with time.
They are controled without an array.
Just by using the noise() function.
minesweeper in 244 bytes
Minisweeper by troido
HTML project, 244/1024 bytes
A tiny clone of the well known game minesweeper.
Click on a tile to clear it.
If the tile is a mine, you lost.
If you have cleared all the tiles that are not mines, you won.
Browse amazing randomly generated Maurer Roses or create your own ones!
Maurer Roses by Calada2
HTML project, 934/1024 bytes
A [b]Maurer Rose[/b] consists of some lines that connect some points on a rose curve
You can generate beautiful geometry with these rules
In the entry you can see 100 randomly generated ones
Refresh the page for a different experience
You can also create new ones by setting the parameters
A Schulte table is a grid with randomly distributed numbers or letters used for development of speed reading, peripheral vision, attention and visual perception.
Schulte Tables by Alex
p5.js project, 875/1024 bytes
[h]Schulte Tables[/h]
Schulte Tables is a training/testing application.
There is a grid 5x5 with numbers shuffled randomly.
The goal is to click-tap (find) all of them in order from 1 to 25
as fast as possible.
[link]https://en.wikipedia.org/wiki/Schulte_table[/link]
Just some random circles that write "JS1024"
Circles by Admin
p5.js project, 866/1024 bytes
Minifier used: [link]https://javascript-minifier.com/[/link]
The stunning Buddhabrot in 1kb!
Buddhabrot by Calada2
2d canvas project, 951/1024 bytes
The stunning Buddhabrot in 1kb!
A different take on the Mandelbrot set
Set the precision and generate a detailed image of the fractal. Warning it can take a very long time if you set the number too high
https://en.wikipedia.org/wiki/Buddhabrot
https://twitter.com/Calada2
A shady-colored regular heptagram
Occult Ritual by Admin
2d canvas project, 786/1024 bytes
Some [b]7/3[/b] heptagrams with fancy particles floating in the background.
This is a reference to XaTuring:
[link]https://www.chaosmatrix.org/library/chaos/rites/xaturing.html[/link]
Visualize how often an American police officer fatally shoots someone.
American police shooting countdown by Evan Hahn
HTML project, 992/1024 bytes
This uses data from the Washington Post (see [link]https://github.com/washingtonpost/data-police-shootings[/link])
Methodology:
1. Grab data from the Washington Post (see link below).
2. Find the number of shootings that have occurred in the last year (365 or 366 days, depending on leap years).
3. Divide that number by that year-long time interval (365 or 366 days) to determine the average time delta in shootings. Call this duration [em]Δt[/em].
4. Pick an arbitrary time for the intervals to start. I chose January 1, 1970 at midnight UTC.
5. Every second, figure out the time until the interval resets, which will be between 0 and [em]Δt[/em]. Display this to the user as a countdown.
Huge thanks to Terser and RegPack, which shrunk the code dramatically. I could probably shrink it further, but I was comfortably under 1024 bytes.
Press numbers 0-9 to generate different fractals
Chaos Game by Calada2
2d canvas project, 885/1024 bytes
You can generate lots of different fractals using the chaos game.
You can see 10 colorful examples in this entry
[link]https://en.wikipedia.org/wiki/Chaos_game[/link]
[link]https://twitter.com/Calada2[/link]
A pixelated ghost is dancing
The Ghost Dance by cevherkarakoc
shader project, 508/1024 bytes
[h] A pixelated ghost is dancing [/h]
minified with [link] https://github.com/stackgl/glsl-min-stream [/link]
my github profile : [link] https://github.com/cevherkarakoc [/link]
First 1499 bytes of http://js1024.fun/challenge.txt (lowercased)
wi1ki, first 1499 bytes by Kang Seonghoon
2d canvas project, 1024/1024 bytes
Midly preprocessed and RegPacked ([link]https://siorki.github.io/regPack.html[/link]). It correctly prints newlines at the expense of three bytes (shown as a normal space due to the default stylesheet, however). Note that RegPack without preprocessing will result in first 1435 bytes even with missing newlines.
I've also made a self-decompressing PNG entry that prints first 1782 bytes but JS1024 submission form doesn't like null bytes in the source code at all. Preprocessing didn't yield any better result, so it might be the best, or close to the best possible entry if I can submit that.
Hit orange square before all squares become blue!
Hit Square! by morticcino
2d canvas project, 881/1024 bytes
The game works on Desktop and Mobile(for these would be great to have in the html header a meta tag for viewport). It's done in vanilla js and 2D canvas.
It's simple but [b] funny.[/b]
This is github repo:
[link]https://github.com/geomensione/geomensione.github.io/tree/master/js1024fun[/link]
Enjoy!
Snake monochrome game in 1024 bytes of JavaScript
Snake Monochrome by John swana
HTML project, 1022/1024 bytes
[h]Snake monochrome[/h]
Snake is the common name for a video game concept where the player maneuvers a line which grows in length, with the line itself being a primary obstacle. The concept originated in the 1976 arcade game Blockade, and the ease of implementing Snake has led to hundreds of versions (some of which have the word snake or worm in the title) for many platforms.
[h]Gameplay[/h]
The player controls a dot, square, or object on a bordered plane. As it moves forward, it leaves a trail behind, resembling a moving snake. In some games, the end of the trail is in a fixed position, so the snake continually gets longer as it moves. In another common scheme, the snake has a specific length, so there is a moving tail a fixed number of units away from the head. The player loses when the snake runs into the screen border, a trail or other obstacle, or itself.
[h]Controls[/h]
[b]Touchscreen[/b]
- Maneuver around by touching the desired direction relative to the Snake's head
[b]Non Touchscreens[/b]
- Maneuver around by clicking the desired direction relative to the Snake's head
[b]Objective[/b]
Eat alot of apples, and set a Highscore
[b]Inspiration[/b]
[link]https://io.swana.me/snake/[/link]
[b]source code[/b]
[link]https://github.com/swashvirus/snake[/link]
very simple game to make (prolly not)
Classique dinosaur by TGY
HTML project, 1023/1024 bytes
I`m very stupid. I dunno what to say. I just made the game. It`s funny
Tetris monochrome in 1024 bytes of JavaScript
Tetris monochrome by John swana
2d canvas project, 1018/1024 bytes
[h]Tetris monochrome[/h]
[b]building[/b]
Google™ Closure JavaScript Compiler with final finishing done by hand.
Inspired by
[link]https://io.swana.me/tetris[/link]
[h]Controlling[/h]
Left: click left side of the ""canvas""
Right: click the right side of the canvas
Wi1ki challenge submission
wi1ki: 1069 bytes by Admin
HTML project, 1024/1024 bytes
Prints [em]1069[/em] bytes from [link]http://js1024.fun/challenge.txt[/link]
[b]Challenge: [link]https://twitter.com/js1024fun/status/1280807741905305600[/link][/b]
First demo ever :)
JS1024 Opening by Admin
p5.js project, 541/1024 bytes
[h]Welcome to [link]http://js1024.fun[/link][/h]
F1 race game in 1024 bytes of JavaScript
F1 race monochrome by John swana
HTML project, 1023/1024 bytes
[h]F1 race monochrome[/h]
Pretending you're riddin a formula one on the racing track
click left side of your screen to move left
click right to move right
Avoid incoming traffic
Eyes on the road
And Set highscores
work's on mobile and desktop
[h]Inspired by:[/h]
[link]https://io.swana.me/f1-race[/link]
fake sms chat
WhatsByte Chat by ViROscar
HTML project, 996/1024 bytes
fake sms chat simulation
never try this before and this is the first thing that cross in my mind
obviously this a representation of that famous app where someone can talk using a phone number.
the backgroud is dynamic on load but stay static
the chat scroll after some time.
A Date where you pick an item and see if she like it
Lovely KB Date by ViROscar
2d canvas project, 1021/1024 bytes
A lovely date with your KB waifu
This is a game where you pick an random item in the canvas using the mouse.
only one item is the correct.
(Tested on Firefox)