Difference between revisions of "Fantasy consoles"

From SizeCoding
Jump to: navigation, search
(Compression And Release)
 
(32 intermediate revisions by 5 users not shown)
Line 1: Line 1:
== Introduction ==
+
Welcome to the fantasy consoles/ VM section of the website, where we will cover fantasy consoles, like TIC-80, PICO-8 and MicroW8 as well as interpreted languages such as JavaScript.
Welcome to the virtual machine section of the website, where we will cover virtual machine (VM) languages and platforms like the TIC-80 and Javascript.
 
  
== TIC-80 ==
+
==Platforms==
TIC-80 is a fantasy computer for making, playing and sharing tiny games and demos.
+
*'''[[TIC-80]]'''
 +
*'''[[PICO-8]]'''
 +
*'''[[MicroW8]]'''
 +
*'''[[Javascript]]'''
  
There are built-in tools for development: code, sprites, maps, sound editors and the command line, which is enough to create a mini retro game. At the exit you will get a cartridge file, which can be stored and played on the website.
+
==See also==
 
+
* [[Byte Battle]]
Also, the game can be packed into a player that works on all popular platforms and distribute as you wish. To make a retro styled game the whole process of creation takes place under some technical limitations: 240x136 pixels display, 16 color palette, 256 8x8 color sprites, 4 channel sound and etc.
 
 
 
=== Setting up ===
 
As the TIC-80 fantasy computer is an all-in-one creation and execution platform, setting up TIC-80 is very easy:
 
 
 
Just go to the https://github.com/nesbox/TIC-80/releases page
 
 
 
and download the package for your platform of choice (Windows, OSX, Linux and even Raspberry Pi).
 
 
 
Or if you are just curious you can just start doodling online at http://tic80.com/
 
 
 
=== Getting started ===
 
Most TIC-80 programs are coded using the LUA Scripting language. However it is possible to select different scripting language like javascript at the cost of a couple of bytes/characters like so: <syntaxhighlight lang="lua">//script: js</syntaxhighlight>
 
 
 
The main function used for updating the screen (and called 60 times a second) is the TIC() function, so this function is also a requirement for doing anything with graphics. Additionally you can also setup a sub=function SCN() that is called once per scanline at the costs of more bytes/characters.
 
 
 
Most animated effects will also need to use some kind of a timer, so you are likely to also use the built-in time() function or keep track of your time (t) yourself as well..  So a minimal setup would look something like this:
 
 
 
<syntaxhighlight lang="lua">
 
function TIC()t=time()
 
-- your effect code
 
end
 
</syntaxhighlight>
 
 
 
A full overview of the TIC80 memory map and most common used function is available in this handy TIC80 cheatsheet, as well as the TIC80 wiki page.
 
 
 
https://zenithsal.com/assets/documents/tic-80_cheatsheet.pdf
 
 
 
=== Video display ===
 
The TIC-80 has a 240x136 pixel display with 16colors which can be accessed via a wide range of graphics functions or by writing directly to VRAM at memory address 0x0000 using the poke4 instruction.
 
 
 
==== Draw functions ====
 
There are a couple of built-in drawing functions you can use:
 
<syntaxhighlight lang="lua">
 
cls(color=0)
 
pix(x,y[color]) [-> color]
 
circ(x,y,r,color) -- filled circle
 
circb(x,y,r,color) -- border circle
 
rect(x,y,w,h,color) -- filled rect
 
rectb(x,y,w,h,color) -- border rect
 
line(x0,y0,x1,y1,color)
 
tri(x1,y1,x2,y2,x3,y3,color)
 
textri(x1,y1,x2,y2,x3,y3,u1,v1,u2,v2,u3,v3,use_map=false,colorkey=-1)
 
print(text,x=0,y=0,color=15,fixed=false,scale=1,smallfont=false) -> width
 
</syntaxhighlight>
 
 
 
==== Getting something on screen ====
 
Here is a bit of code to get you started:
 
 
 
<syntaxhighlight lang="lua">
 
function TIC()
 
t=time()/99
 
for y=0,136 do for x=0,240 do
 
pix(x,y,(x>>3~y>>3)+t)
 
end;end;end
 
</syntaxhighlight>
 
 
 
Which will display an animated XOR pattern.
 
 
 
==== Color Palette ====
 
Unfortunately for us sizecoders, the pre v0.8 TIC-80 came with a different palette than the now standard (and much more friendly) sweety16 palette (https://lospec.com/palette-list/sweetie-16).
 
 
 
But because of backwards compatibility, this old palette is also the default palette that is being used when now palette chunk is defined in the TIC cart.
 
 
 
[[File:TIC80 Defaultpal.png|thumb|left|]]
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
So you can get around this limitation by either setting a palette yourself with code, or shuffling around with your color-index.
 
 
 
==== Select the Sweetie16 by using the 0x11 chunk  ====
 
From the verion 0.9b version and beyond you can initialise the new default sweetie16 palette at startup by adding a 0x11 Chunk to your TIC-80 cartridge. Normally a chunk would contain 4 bytes of header + data, but as this chunk has no data, it is possible to omit the extra 3 bytes of chunk-header if you place it at the end of your TIC cartridge. The new TIC-Packer linked below has the option to do this for you.
 
 
 
==== Setting your own color palette ====
 
Probably the easiest way to get some color over your colors is to setup your own palette by writing to the palette area located at 0x3fc0 like so:
 
<syntaxhighlight lang="lua">
 
for i=0,47 do poke (0x3fc0+i,i*5)end
 
</syntaxhighlight>
 
This produces a nice grayscale palette of 16 shades to work with.
 
 
 
==== Color index shuffling ====
 
Alternatively, you can shuffle your color indices a bit to get 'somewhat workable' colors.
 
A couple of examples for this are
 
* (color)&10 - Some grey/blue shade
 
* ((color)&6)-3 - A Nice shade of Dark-cyan-white color
 
* (color)^2 - A shade of brown/yellowish colors
 
 
 
But feel free to experiment yourself as well and let us know on discord if you find something cool.
 
 
 
=== Sound ===
 
The TIC-80 has soundregisters and 32 byte waveforms to access which are located at address 0FF9C in memory.
 
 
 
<syntaxhighlight>
 
0FF9C SOUND REGS 72 18 byte x 4 ch
 
0FFE4 WAVEFORMS 256 16 wave/ 32x4b each
 
100E4 SFX 4224 64 sounds
 
</syntaxhighlight>
 
 
 
==== Make some noise ====
 
The easiest way to get 'some' sound going is to bitbang the sound-registers and hope for the best, for example:
 
<syntaxhighlight lang="lua">
 
TIC=function()for i=0,71 do poke(65436+i,(time()/7.2)%64)end end
 
</syntaxhighlight>
 
 
 
A more the "proper" way involves something like : define the waveform yourself (f.e. sawtooth), repeatedly (because for some reason one time is not enough), then write low part of the frequency to one byte, and the high nibble combined with the volume to another)
 
<syntaxhighlight lang="lua">
 
TIC=function()
 
for i=0,31 do poke4(2*65438+i,i/2) end -- setup waveforem
 
t=time()/10
 
-- write frequencies
 
poke(65436+0,t%256)
 
poke(65437+0,(t/65536)%16+240)
 
end
 
</syntaxhighlight>
 
But as you can see this costs considerably more bytes to setup.
 
 
 
=== Compression And Release ===
 
When you are happy with your intro and want to get it ready for release, it becomes time to look at squeezing those last bytes.
 
As a goal-post, you should always aim to have your uncompressed effect around the target size, and work from there.
 
 
 
Final optimisation can be done by stringing as much code together on single lines and removing any extra spaces and whitelines.
 
A rule of thumb for this is that of the first or last character of a variable or function isn't a valid hex number (i.e. A-F) you can omit whitespace (so that: x=0 y=0 z=0 can become x=0y=0z=0)
 
 
 
Now as a final step you can use a python script to convert your (LUA) Script to a empty TIC Cartridge with a single ZLIB compressed code block (https://bitbucket.org/WaterEnVuur/tic80-packer/src/master/)
 
 
 
However, creating a TIC cartridge file adds a 4 byte header and if your code is already pretty tight, you can expect to have only a 3-5% compression rate, so it sort of evens out.
 
 
==== Exporting Video as Animated GIF ====
 
The TIC80 environment has a neat feature that lets you export your intro directly as an animated GIF file to converted to video later, by Pressing the F9 key to start and stop recording. However, there is a default recording limit capped to a fixed number of frames or seconds. You can change this in the tic80 config to a bigger number to match your recording-size.
 
 
 
If your intro is taking up too many resources and starts chugging a bit on your machine, it can be wise to make a version that steps through time lineary by adding a number to your t variable yourself instead of using the time() function.
 
 
 
==== Online version: Metadata and Thumbnail image ====
 
When uploading the intro to the TIC80 website for an playable online version, you will need to build a new TIC file with some added some meta-data and Thumbnail image (You can take this snapshot using the F7 key) and use this as you online version.
 
 
 
The Meta data is added at the top of your intro as follows
 
<syntaxhighlight lang="lua">
 
-- title: My intro
 
-- author: scener
 
-- desc: my first sizecoded TIC-80 intro
 
-- script: lua (or moon/wren/js/fennel)
 
</syntaxhighlight>
 
 
 
=== Additional Resources ===
 
Sizecoding on the TIC-80 is still in its infancy, but luckily there is already plenty of information to get you started!
 
 
 
* TIC-80 Wiki page https://github.com/nesbox/TIC-80/wiki
 
* TIC-80 One page cheat sheet (PDF) https://zenithsal.com/assets/documents/tic-80_cheatsheet.pdf
 
* TIC-80 Intros and demos on Pouet (Press F1 for code): https://www.pouet.net/prodlist.php?platform%5B%5D=TIC-80
 
* TIC-80 TIC Cartridge File Format (from TIC-80 Wiki) https://github.com/nesbox/TIC-80/wiki/tic-File-Format
 
* TIC-80 Packer https://bitbucket.org/WaterEnVuur/tic80-packer/src/master/
 
 
 
== PICO-8 ==
 
The PICO-8 is a fantasy computer for making, playing and sharing tiny games and demos.
 
 
 
There are built-in tools for development: code, sprites, maps, sound editors and the command line, which is enough to create a mini retro game. At the exit you will get a cartridge file, which can be stored and played on the website.
 
 
 
Also, the game can be packed into a player that works on all popular platforms and distribute as you wish. To make a retro styled game the whole process of creation takes place under some technical limitations: 128x128 pixels display, 16  color palette, 256 8x8 color sprites and 4 channel sound
 
 
 
=== Setting up ===
 
As the PICO-8 fantasy computer is an all-in-one creation and execution platform.
 
 
 
Unfortunately, the PICO-8 is a commercial package and should be purchased before you can get started.
 
 
 
You can go to https://lexaloffle.itch.io/pico-8 to purchase and then download the package for your platform of choice (Windows, OSX and even Raspberry Pi).
 
 
 
=== Getting started ===
 
PICO-8 programs are coded using the LUA Scripting language.
 
 
 
The main function used for updating the screen (and called either 30 or 60 times a second) is the _DRAW() function, so this function is also a requirement for doing anything with graphics.
 
 
 
Most animated effects will also need to use some kind of a timer, so you are likely to also use the built-in time() function or keep track of your time (t) yourself as well..  So a minimal setup would look something like this:
 
 
 
<syntaxhighlight lang="lua">
 
T=0 FUNCTION _DRAW()
 
-- your effect code
 
T=T+1
 
END
 
</syntaxhighlight>
 
 
 
Here is a single-image PICO-8 Cheat sheet to get you started.
 
<gallery>
 
PICO-8_Cheat_Sheet.png
 
</gallery>
 
 
 
=== Video display ===
 
The PICO-8 has a 128x128 pixel display with 16colors which can be accessed via a wide range of graphics functions or by writing directly to VRAM at memory address 0x6000 using the poke instruction.
 
 
 
==== Draw functions ====
 
There are a couple of built-in drawing functions you can use:
 
<syntaxhighlight lang="lua">
 
cls(color=0)
 
pix(x,y[color]) [-> color]
 
circ(x,y,r,color) -- filled circle
 
circb(x,y,r,color) -- border circle
 
rect(x,y,w,h,color) -- filled rect
 
rectb(x,y,w,h,color) -- border rect
 
line(x0,y0,x1,y1,color)
 
tri(x1,y1,x2,y2,x3,y3,color)
 
textri(x1,y1,x2,y2,x3,y3,u1,v1,u2,v2,u3,v3,use_map=false,colorkey=-1)
 
print(text,x=0,y=0,color=15,fixed=false,scale=1,smallfont=false) -> width
 
</syntaxhighlight>
 
 
 
==== Getting something on screen ====
 
Here is a bit of code to get you started:
 
 
 
<syntaxhighlight lang="lua">
 
T=0FUNCTION _DRAW()
 
FOR Y=0,128 DO FOR X=0,128 DO
 
PSET(X,Y,X~Y+T)
 
END END
 
T=T+1
 
END
 
</syntaxhighlight>
 
 
 
Which will display an animated XOR pattern.
 
 
 
==== Color Palette ====
 
Unfortunately for us sizecoders, the PICO-8 comes with a fixed palette to 16 colors with size-unfriendely color indexing (https://lospec.com/palette-list/pico-8).
 
 
 
Fortunately there are a few PICO-8 functions available that let you swap the color index of each color, but ofcourse these take up a bit of space to use.
 
 
 
==== Color index shuffling ====
 
Alternatively, you can shuffle your color indices a bit to get 'somewhat workable' colors.
 
A couple of examples for this are
 
* color&7*2 - Black, Purple, brown, white
 
* (color&7)^2 -Black, blue, brown yellow
 
 
 
But feel free to experiment yourself as well and let us know on discord if you find something cool.
 
 
 
=== Sound ===
 
The PICO-8 has soundregisters you can either POKE directly of play with tone/sfx play command
 
 
 
<syntaxhighlight>
 
TBA
 
</syntaxhighlight>
 
 
 
==== Make some noise ====
 
The easiest way to get 'some' sound going is to bitbang the sound-registers and hope for the best, for example:
 
<syntaxhighlight lang="lua">
 
TBA
 
</syntaxhighlight>
 
 
 
=== Compression And Release ===
 
When you are happy with your intro and want to get it ready for release, it becomes time to look at squeezing those last bytes.
 
As a goal-post, you should always aim to have your uncompressed effect around the target size, and work from there.
 
 
 
Final optimisation can be done by stringing as much code together on single lines and removing any extra spaces and whitelines.
 
A rule of thumb you can always directly stick a letter A..Z after a number 0..9
 
 
 
Most demoparties will accept a loadable .P8 cartridge file as an intro, which adds a 27 byte header like so:
 
 
 
<syntaxhighlight lang="lua">
 
pico-8 cartridge
 
version
 
__lua__
 
</syntaxhighlight>
 
Followed by your raw LUA code. So please take this 27 byte hit into account when optimising your intro.
 
 
 
=== Additional Resources ===
 
Sizecoding on the PICO-8 is still in its infancy, but luckily there is already plenty of information to get you started!
 
 
 
* PICO-8 Wiki page http://pico-8.wikia.com/wiki/Pico-8_Wikia
 
* PICO-8 One page cheat sheet (PNG) https://imgur.com/iGrP5bK
 
* PICO-8 API Reference https://neko250.github.io/pico8-api/
 
* PICO-8 Intros and demos on Pouet (Press Escap for code): https://www.pouet.net/prodlist.php?platform%5B%5D=TIC-80
 
* PICO-8 guide https://nerdyteachers.com/PICO-8/Guide/
 
 
 
== Javascript ==
 
The Javascript sizecoding community has been quite active for years now.
 
 
 
=== Setting up ===
 
 
 
* Tools: [http://www.iteral.com/jscrush/ JSCrush online] [https://github.com/gre/jscrush JSCrush cli-tool] [https://siorki.github.io/regPack.html Reg Pack]
 
* Execution environment(s): Browser, [https://www.dwitter.net Dwitter]
 
 
 
=== Video display ===
 
No information yet
 
 
 
=== Sound ===
 
 
 
Something to get your journey started:
 
 
 
* [https://marcgg.com/blog/2016/11/01/javascript-audio/ Generate Sounds Programmatically With Javascript]
 
 
 
More information to follow
 
 
 
=== Additional Resources ===
 
* [https://js1k.com JS1k]
 
 
 
Tutorials / Postmortems
 
 
 
* [https://frankforce.com/i-made-7-demos-in-2-weeks-for-js1k/ I made 7 demos in 2 weeks for js1k]
 
* [https://nikhilism.com/post/2012/demystifying-jscrush/ Demystifying JSCrush]
 
 
 
More to follow
 

Latest revision as of 03:57, 30 April 2022

Welcome to the fantasy consoles/ VM section of the website, where we will cover fantasy consoles, like TIC-80, PICO-8 and MicroW8 as well as interpreted languages such as JavaScript.

Platforms

See also