Difference between revisions of "4K Intro"
(32 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
== Introduction == | == Introduction == | ||
− | This category is dedicated to modern 4K Intro development for Windows/Win32, which consist of a small OpenGL/D3D/DX Framework, a softsynth and 1 or more pixelshaders. As such this won't be discussion legacy mesh techniques as few 4k intros make use of those techniques anymore. | + | This category is dedicated to modern 4K Intro development for [[Windows|Windows / Win32]], which consist of a small OpenGL/D3D/DX Framework, a softsynth and 1 or more pixelshaders. As such this won't be discussion legacy mesh techniques as few 4k intros make use of those techniques anymore. |
− | Most Windows 4K Intros will be setup using C, sometimes in combination with assembler, or in some cases pure assembler. In general writing everything in assembler should give you a little more freedom in pushing/popping your function arguments and register usage | + | Most Windows 4K Intros will be setup using C, sometimes in combination with assembler, or in some cases pure assembler. In general writing everything in assembler should give you a little more freedom in pushing/popping your function arguments and register usage. |
Graphics are usualy done using OpenGL / GLSL or Direct3D/DX11. | Graphics are usualy done using OpenGL / GLSL or Direct3D/DX11. | ||
Line 37: | Line 37: | ||
Its great as a rendertest reference for your PBR / pathtracing tests, but it doesn't make a compelling intro. | Its great as a rendertest reference for your PBR / pathtracing tests, but it doesn't make a compelling intro. | ||
The times you still see a reflective/pathtraced sphere and/or box with music mask as a 4k intro is staggering. | The times you still see a reflective/pathtraced sphere and/or box with music mask as a 4k intro is staggering. | ||
− | Sadly sceners still accept these rebranded cornell boxes as legit | + | Sadly sceners still accept these rebranded cornell boxes as legit and even winning/cdc receiving intros, because shineys. |
But my intuition says these will be looked upon like the countless early 2000s goa+bended sphers/torus intros that fail to stand the test of time. | But my intuition says these will be looked upon like the countless early 2000s goa+bended sphers/torus intros that fail to stand the test of time. | ||
Line 45: | Line 45: | ||
== Size Budgeting == | == Size Budgeting == | ||
− | A general rule of thumb is to work above the target size for most of the development. | + | A general rule of thumb is to work above the target size for most of the development and work your way down when the production is closer to completion. |
+ | |||
+ | There are many ways to split the same bytes, here are the top-5 4K Intros at Revision 2024 that have made wildly different choices. | ||
+ | {| class="wikitable" | ||
+ | |- | ||
+ | ! Ranking !! Intro Title !! Progression / Storytelling !! Object complexity || Graphics Fidelity !! Sound !! Notes !! Link | ||
+ | |- | ||
+ | | 1 || Drifting Shore || Low || Low || Very-High || Low || Ray-Intersection + Pathtracing || https://demozoo.org/productions/342196/ | ||
+ | |- | ||
+ | | 2 || Dubplate || Medium || Low || High || Very-High || SDF Text || https://demozoo.org/productions/342202/ | ||
+ | |- | ||
+ | | 3 || Return to nature || High || High || Low || Low || - || https://demozoo.org/productions/342200/ | ||
+ | |- | ||
+ | | 4 || Brainfiller || Low || Medium || High || High || GLSL Softsynth || https://demozoo.org/productions/342203/ | ||
+ | |- | ||
+ | | 5 || Once Upon A Time In A Datacenter || High || Very-High || Low || Low || Custom CPU synthcode || https://demozoo.org/productions/342199/ | ||
+ | |} | ||
+ | |||
==== Graphics fidelity ==== | ==== Graphics fidelity ==== | ||
Line 51: | Line 68: | ||
==== Music budget ==== | ==== Music budget ==== | ||
− | + | Got a musician to work with you and deliver a great tune? Don't accept it right out of the gate and feel free to argue about possible optimisations that can be done to the tune that will not affect the end-result massively. This is done by all of the better-known 4k intro developers and a good musician will be open to discussion and aware of the different limitation and choices that have to be made when it comes to size budgeting. | |
== Setting up your framework == | == Setting up your framework == | ||
Line 75: | Line 92: | ||
But in practice this is as of year (2024) still impossible to do realtime on most systems, therefore a choice has to be made between exact interesctions of primitives / raytracing vs ray marching. What are the differences in usecases and what are their pros and cons: | But in practice this is as of year (2024) still impossible to do realtime on most systems, therefore a choice has to be made between exact interesctions of primitives / raytracing vs ray marching. What are the differences in usecases and what are their pros and cons: | ||
− | TBA | + | {| class="wikitable" |
− | + | |- | |
+ | ! Description !! Raymarching !! Ray-Intersection !! Examples | ||
+ | |- | ||
+ | | Domain-Repetition || Yes || No || TBA | ||
+ | |- | ||
+ | | Fast Multi-Sample || No || Yes || TBA | ||
+ | |- | ||
+ | | Twisting & Blending || Yes || No || TBA | ||
+ | |- | ||
+ | | Shape-Blending || Yes || ? || TBA | ||
+ | |} | ||
==== Post processing: Don't miss the low-hanging fruit ==== | ==== Post processing: Don't miss the low-hanging fruit ==== | ||
− | + | Having a proper post processing step can greatly improve the overall visual quality of your intro. So in 4k space i would suggest a postshader pass at minimum, which depending on your size budget you can use for things like Vignetting, DOF, tone-mapping, anti-aliasing, chromatic abberation, etc. | |
+ | But even if your 4k intro doesn't have a seperate post-shader pass, adding a bit of in-shader vignetting / gamma correction / tone-mapping to your intro are relative easy/cheap ways to improve visual quality of your intro, so why leave those options off the table? | ||
+ | For inspiration, You can check out the article at Here is an article at https://30fps.net/pages/post-processing/ for a few things you can do to improve your visuals in post. | ||
== Sound == | == Sound == | ||
− | + | Here is an overview of various Synths / Music options. | |
− | + | Depending on the exact track, you are looking at approx 1k - 1.5k compressed for music for most 4k intros. | |
− | + | ||
− | + | {| class="wikitable" | |
− | + | |- | |
− | + | ! Synth !! Type !! Description !! Size overhead !! Link | |
+ | |- | ||
+ | | 4klang || Subtractive || Most popular softsynth || Medium (1 note, 1 instrument at 620b) || https://github.com/gopher-atz/4klang | ||
+ | |- | ||
+ | | Sointu || Subtractive || 4klang fork with improvements || Medium (1 note, 1 instrument at 562b )|| https://github.com/vsariola/sointu/ | ||
+ | |- | ||
+ | | Oidos || Additive || - || Medium (1 note, 1 instrument at 600b) || https://github.com/askeksa/Oidos | ||
+ | |- | ||
+ | | Clinkster || FM || - || Medium (1 note, 1 instrument at 590b) || http://crinkler.net/Clinkster.zip | ||
+ | |- | ||
+ | | GLSL Softsynth || - || Write it yourself || Small/Medium (depends on usecase) || - | ||
+ | |- | ||
+ | | MIDI Player || MIDI || Using default Windows midi sounds || Small || - | ||
+ | |- | ||
+ | |} | ||
== Compression == | == Compression == | ||
Line 107: | Line 150: | ||
* [https://github.com/psycholns/TinyDX11 Psycho's 1k/4k framework] | * [https://github.com/psycholns/TinyDX11 Psycho's 1k/4k framework] | ||
* [http://www.kameli.net/compofillerstudio/ Compofiller studio] | * [http://www.kameli.net/compofillerstudio/ Compofiller studio] | ||
− | * [https://github.com/yosshin4004/minimal_gl Minimal gl framework] | + | * [https://github.com/yosshin4004/minimal_gl Minimal gl framework] |
==== Raymarching ==== | ==== Raymarching ==== | ||
Line 123: | Line 166: | ||
* [https://demozoo.org/productions/170744/ Horizon Machine (2017)] | * [https://demozoo.org/productions/170744/ Horizon Machine (2017)] | ||
* [https://demozoo.org/productions/91680/ Neuron (2013)] | * [https://demozoo.org/productions/91680/ Neuron (2013)] | ||
− | |||
* [https://demozoo.org/productions/102/ Elevated (2009)] | * [https://demozoo.org/productions/102/ Elevated (2009)] | ||
* [https://demozoo.org/productions/4846/ Atrium (2008)] | * [https://demozoo.org/productions/4846/ Atrium (2008)] | ||
Line 133: | Line 175: | ||
* [https://github.com/vsariola/fluxerator Fluxerator (2023)] | * [https://github.com/vsariola/fluxerator Fluxerator (2023)] | ||
* [https://github.com/LeStahL/abstraction-confusion Abstraction Confusion (2021)] | * [https://github.com/LeStahL/abstraction-confusion Abstraction Confusion (2021)] | ||
+ | * [https://github.com/w23/nwep nwep (2017)] | ||
* [https://github.com/keensky/hal4000 Hall4000 (2017)] | * [https://github.com/keensky/hal4000 Hall4000 (2017)] | ||
* [https://github.com/in4k/rgba_tbc_elevated_source Elevated (2009)] | * [https://github.com/in4k/rgba_tbc_elevated_source Elevated (2009)] | ||
+ | |||
+ | ==== Seminars ==== | ||
+ | * [https://www.youtube.com/watch?v=S-VDVgCBy-M Shader minification for 4k - 64k intros (2023)] | ||
+ | * [https://www.youtube.com/watch?v=xLhT06lwaig 4klang 101 - Basics (2019)] | ||
+ | * [https://www.youtube.com/watch?v=Ir0vcmHkIm0 nstalling and trying out different synths for 4kb intros (2017)] | ||
+ | * [https://www.youtube.com/watch?v=9BqKH0XNN-g Size Restricted music isn't Rocketscience (2017)] | ||
+ | * [https://www.youtube.com/watch?v=wP__g_9FT4M Sound Design with 4klang, by Wayfinder (2015)] | ||
==== Articles ==== | ==== Articles ==== | ||
+ | * [ftp://ftp.untergrund.net/users/thygrion/sosp.zip Music in 4 Kilobytes - Size Optimized Synthesizer Programming] | ||
+ | * [https://iquilezles.org/articles/function2009/function2009.pdf Behind Elevated] | ||
* [https://in4k.github.io/html_articles/Amietia%20%E2%80%A2%20The%20Making%20Of%20Oscar's%20Chair.html Making of Oscar's chair] | * [https://in4k.github.io/html_articles/Amietia%20%E2%80%A2%20The%20Making%20Of%20Oscar's%20Chair.html Making of Oscar's chair] | ||
* [https://www.codeslow.com/2020/07/writing-winning-4k-intro-in-rust.html Article about writing a 4k intro using Rust] | * [https://www.codeslow.com/2020/07/writing-winning-4k-intro-in-rust.html Article about writing a 4k intro using Rust] | ||
* [https://in4k.github.io/wiki/aulds-4k-synth Article about writing a softsynth] | * [https://in4k.github.io/wiki/aulds-4k-synth Article about writing a softsynth] |
Revision as of 02:06, 17 April 2024
Contents
Introduction
This category is dedicated to modern 4K Intro development for Windows / Win32, which consist of a small OpenGL/D3D/DX Framework, a softsynth and 1 or more pixelshaders. As such this won't be discussion legacy mesh techniques as few 4k intros make use of those techniques anymore.
Most Windows 4K Intros will be setup using C, sometimes in combination with assembler, or in some cases pure assembler. In general writing everything in assembler should give you a little more freedom in pushing/popping your function arguments and register usage.
Graphics are usualy done using OpenGL / GLSL or Direct3D/DX11.
Tools
There are a couple of options for tools, but generally these tools are often used
- Visual Studio / Vscode / GCC Compiler
- Crinkler or other external packer for compression ( https://crinkler.net )
- Shader minifier ( https://github.com/laurentlb/Shader_Minifier )
- Optional / Alternatively: NASM Assembler ( https://nasm.us/ )
- Optional: Local/Online GLSL Shader editing environment (e.g. Shadertoy, Kodelife, bonzo, etc.)
- Optional: Timeline/Camera tooling
- Optional: gnuRocket for timing.
Intro design
When designing a 4k intro, it is best practice to consider each of the following aspects seperately:
- How much size budget do you want to allocate to render pipeline, sound, scene building, (post)shading, progression?
- Abstract vs organic vs scene/world-building
- Single scene vs multiple scenes
- Ray-Intersections or Ray Marching
- What kind of softsynth to use, or writing your own
- Render pipeline - Single or multipass (post/audio)shaders.
- Scene, Camera and progression handling
- Text - Do you want to include text and if so: Are you using WindowsGlyphs texture or SDF
Design pitfalls
Here are a few design pitfalls you should try to avoid if necessary.
Undirected raymarch experiments
Wiggly domain repetition shadertoy experiments, with or without walking glows, might be sufficient for a shaderjam or shader-showdown, but usually make a sub-par 4k intro. Don't do it, even if it has the compofiller banner on the slide.
The Rebranded cornell box - Just a shiny sphere bro!
Its great as a rendertest reference for your PBR / pathtracing tests, but it doesn't make a compelling intro. The times you still see a reflective/pathtraced sphere and/or box with music mask as a 4k intro is staggering. Sadly sceners still accept these rebranded cornell boxes as legit and even winning/cdc receiving intros, because shineys. But my intuition says these will be looked upon like the countless early 2000s goa+bended sphers/torus intros that fail to stand the test of time.
Shitty synths
There are a few great intros out there that have great visuals but are ruined by glopawful synths or music. If you are not good at music yourself, find yourself a musician to work with.
Size Budgeting
A general rule of thumb is to work above the target size for most of the development and work your way down when the production is closer to completion.
There are many ways to split the same bytes, here are the top-5 4K Intros at Revision 2024 that have made wildly different choices.
Ranking | Intro Title | Progression / Storytelling | Object complexity | Graphics Fidelity | Sound | Notes | Link |
---|---|---|---|---|---|---|---|
1 | Drifting Shore | Low | Low | Very-High | Low | Ray-Intersection + Pathtracing | https://demozoo.org/productions/342196/ |
2 | Dubplate | Medium | Low | High | Very-High | SDF Text | https://demozoo.org/productions/342202/ |
3 | Return to nature | High | High | Low | Low | - | https://demozoo.org/productions/342200/ |
4 | Brainfiller | Low | Medium | High | High | GLSL Softsynth | https://demozoo.org/productions/342203/ |
5 | Once Upon A Time In A Datacenter | High | Very-High | Low | Low | Custom CPU synthcode | https://demozoo.org/productions/342199/ |
Graphics fidelity
TBA
Music budget
Got a musician to work with you and deliver a great tune? Don't accept it right out of the gate and feel free to argue about possible optimisations that can be done to the tune that will not affect the end-result massively. This is done by all of the better-known 4k intro developers and a good musician will be open to discussion and aware of the different limitation and choices that have to be made when it comes to size budgeting.
Setting up your framework
A 4k framework / intro can be setup in either C or Assembler, or a combination of both. You can either go with an existing framework (some of them are quite capable) or build your own taylored to your own needs. Also remember that even though there are many more ways to save size than in for example a 1k intro, that every byte saved here is one you can spent / budget elsewhere.
- The groundlevel basics of a framework are discussed on the 1K Intro wiki at http://www.sizecoding.org/wiki/1K_Intro
- From here you can setup your audiobuffer add a softsynth of choice, or write your own (either in GLSL or Software)
- Most likely you'll like to add a few more function imports to properly pass uniforms to your shader.
- Optionally: Add another render-pass by feeding the output of the main shader to a post-shading process. This adds a few more texture calls to the framework
- Optionally: Add an init pass where you prepare (glyph) textures and other buffers you'd like to feed into your main shader.
- Optionally: Hook up a Scene/Camera/Timing system during development
Graphics
Once you've budgeted and designed your intro, it is time to go to work.
Prebuild your scene in an external tool
For convenience and turn-around time, its perfectly fine to use external online/offline tools like Shadertoy, Posh-Brolly, Kodelife, Bonzo or others to setup you main scene(s) / effects.
Ray-Intersetions vs Raymarching
In theory ideally you'd like to have multi-sample, multiple bounces, highly flexible, highly accurate raymarching But in practice this is as of year (2024) still impossible to do realtime on most systems, therefore a choice has to be made between exact interesctions of primitives / raytracing vs ray marching. What are the differences in usecases and what are their pros and cons:
Description | Raymarching | Ray-Intersection | Examples |
---|---|---|---|
Domain-Repetition | Yes | No | TBA |
Fast Multi-Sample | No | Yes | TBA |
Twisting & Blending | Yes | No | TBA |
Shape-Blending | Yes | ? | TBA |
Post processing: Don't miss the low-hanging fruit
Having a proper post processing step can greatly improve the overall visual quality of your intro. So in 4k space i would suggest a postshader pass at minimum, which depending on your size budget you can use for things like Vignetting, DOF, tone-mapping, anti-aliasing, chromatic abberation, etc.
But even if your 4k intro doesn't have a seperate post-shader pass, adding a bit of in-shader vignetting / gamma correction / tone-mapping to your intro are relative easy/cheap ways to improve visual quality of your intro, so why leave those options off the table? For inspiration, You can check out the article at Here is an article at https://30fps.net/pages/post-processing/ for a few things you can do to improve your visuals in post.
Sound
Here is an overview of various Synths / Music options. Depending on the exact track, you are looking at approx 1k - 1.5k compressed for music for most 4k intros.
Synth | Type | Description | Size overhead | Link |
---|---|---|---|---|
4klang | Subtractive | Most popular softsynth | Medium (1 note, 1 instrument at 620b) | https://github.com/gopher-atz/4klang |
Sointu | Subtractive | 4klang fork with improvements | Medium (1 note, 1 instrument at 562b ) | https://github.com/vsariola/sointu/ |
Oidos | Additive | - | Medium (1 note, 1 instrument at 600b) | https://github.com/askeksa/Oidos |
Clinkster | FM | - | Medium (1 note, 1 instrument at 590b) | http://crinkler.net/Clinkster.zip |
GLSL Softsynth | - | Write it yourself | Small/Medium (depends on usecase) | - |
MIDI Player | MIDI | Using default Windows midi sounds | Small | - |
Compression
Crinkler is the most commonly used compression at the moment for 4K intros. It maximizes compression by taking over the linking process, setting up the windows header for you and if needed re-arrange the different segments of the code.
Crinkler reports
When using the /REPORT:intro_report.html
feature, crinkler will generate a report and heatmap for your intro binary.
This is helpful to see how well your (shader)code compresses and where you can maybe gain a few more bytes.
Word about the resulting executable
Please note that when using crinkler in TINYHEADER mode, the resulting windows header will most likely trigger virus scanners / Microsoft Defender and mark it as suspicious content, which is a side-effect in recent years. Just exclude your work directory from this scan during development. Compo machines will run without these scanners too, but it is good practice to include a (slightly larger) safe version too in the final archive.
Resources
Frameworks
- Leviathan 2.0
- IQ's 1k/4k frameworks
- Psycho's 1k/4k framework
- Compofiller studio
- Minimal gl framework
Raymarching
High Quality 4K intros for Windows
- Stahlbeton (2022)
- The Vanishing of Ashlar (2020)
- Eisenerz (2019)
- Oscar's Chair (2018)
- Unprogress (2017)
- Waillee (2017)
- Horizon Machine (2017)
- Neuron (2013)
- Elevated (2009)
- Atrium (2008)
4K intros for Windows with Sourcecode
- Every Datapoint has a soul (2024)
- Island (2024)
- physics girl (2023)
- Fluxerator (2023)
- Abstraction Confusion (2021)
- nwep (2017)
- Hall4000 (2017)
- Elevated (2009)
Seminars
- Shader minification for 4k - 64k intros (2023)
- 4klang 101 - Basics (2019)
- nstalling and trying out different synths for 4kb intros (2017)
- Size Restricted music isn't Rocketscience (2017)
- Sound Design with 4klang, by Wayfinder (2015)