Difference between revisions of "4K Intro"

From SizeCoding
Jump to: navigation, search
 
(15 intermediate revisions by the same user not shown)
Line 2: Line 2:
 
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.
 
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.languages.
+
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 50: Line 50:
 
{| class="wikitable"
 
{| class="wikitable"
 
|-
 
|-
−
! Ranking !! Intro Title !! Progression/Storytelling !! Object complexity || Graphics Fidelity !! Sound !! Notes !! Link
+
! Ranking !! Intro Title !! Progression / Storytelling !! Object complexity || Graphics Fidelity !! Sound !! Notes !! Link
 
|-
 
|-
−
| 1 || Drifting Shore || Low || Low || Very-High || Low || Ray-Intersection || https://demozoo.org/productions/342196/
+
| 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/
 
| 2 || Dubplate || Medium || Low || High || Very-High || SDF Text || https://demozoo.org/productions/342202/
Line 106: Line 106:
  
 
==== Post processing: Don't miss the low-hanging fruit ====
 
==== Post processing: Don't miss the low-hanging fruit ====
−
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?
+
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
+
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"
 
{| class="wikitable"
 
|-
 
|-
 
! Synth !! Type !! Description !! Size overhead !! Link
 
! Synth !! Type !! Description !! Size overhead !! Link
 
|-
 
|-
−
| 4lklang || Subtractive || Most popular softsynth || Medium (1 note, 1 instr at 620b) || http://4klang.untergrund.net/
+
| 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 instr at ?b )|| https://github.com/vsariola/sointu/
+
| Sointu || Subtractive || 4klang fork with improvements || Medium (1 note, 1 instrument at 562b )|| https://github.com/vsariola/sointu/
 
|-
 
|-
−
| Oidos || Additive || - || Medium (1 note, 1 instr at 600b) || https://github.com/askeksa/Oidos
+
| Oidos || Additive || - || Medium (1 note, 1 instrument at 600b) || https://github.com/askeksa/Oidos
 
|-
 
|-
−
| Clinkster || FM || - || Medium (1 note, 1 instr at 590b) || http://4klang.untergrund.net/
+
| Clinkster || FM || - || Medium (1 note, 1 instrument at 590b) || http://crinkler.net/Clinkster.zip
 
|-
 
|-
 
| GLSL Softsynth || - || Write it yourself || Small/Medium (depends on usecase) || -
 
| GLSL Softsynth || - || Write it yourself || Small/Medium (depends on usecase) || -
 
|-
 
|-
−
| MIDI Player || MIDI || Using default Windows midi sounds || Small || -
+
| MIDI Player || MIDI || Using default Windows midi sounds || Small/Medium (depends on player/song complexity) || -
 +
|-
 +
|}
 +
 
 +
As a snapshot. Here is a list of intros from 2017 with the synth they used:
 +
{| class="wikitable"
 +
|-
 +
| Absolute Territory || 4klang
 +
|-
 +
| Waillee || 4klang
 +
|-
 +
| final stage || Custom
 +
|-
 +
| Horizon Machine || 4klang
 +
|-
 +
| Unprogress || Clinkster
 +
|-
 +
| Faraday Future || 4klang
 +
|-
 +
| Alive Here Now, Forever || Oidos
 +
|-
 +
| Destination Unknown || Oidos
 +
|-
 +
| w a y f a r e r || 4klang
 +
|-
 +
| HAL 4000 || 4klang
 +
|-
 +
| Equilibrium || 4klang
 +
|-
 +
| visit berlin || 4klang
 +
|-
 +
| お花見 || 4klang
 +
|-
 +
| Gary Glitter || 4klang
 +
|-
 +
| Superfine || Oidos
 +
|-
 +
| Cycle Of Nature || Oidos
 +
|-
 +
| Oxano || Oidos
 +
|-
 +
| Those Who Leave || 4klang
 +
|-
 +
| Maintenance || Clinkster
 +
|-
 +
| Joia || 4klang
 +
|-
 +
| Back to the Roots || Oidos
 +
|-
 +
| Dropletia || Oidos
 +
|-
 +
| crystalline lord || 4klang
 +
|-
 +
| highrider || 4klang
 +
|-
 +
| Primordial Soup || Custom
 
|-
 
|-
 
|}
 
|}
Line 176: Line 235:
  
 
==== Seminars ====
 
==== Seminars ====
−
* [https://www.youtube.com/watch?v=9BqKH0XNN-g Size Restricted music isn't Rocketscience]
+
* [https://www.youtube.com/watch?v=S-VDVgCBy-M Shader minification for 4k - 64k intros (2023)]
−
* [https://www.youtube.com/watch?v=wP__g_9FT4M Sound Design with 4klang, by Wayfinder]
+
* [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 ====

Latest revision as of 05:40, 31 October 2024

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/Medium (depends on player/song complexity) -

As a snapshot. Here is a list of intros from 2017 with the synth they used:

Absolute Territory 4klang
Waillee 4klang
final stage Custom
Horizon Machine 4klang
Unprogress Clinkster
Faraday Future 4klang
Alive Here Now, Forever Oidos
Destination Unknown Oidos
w a y f a r e r 4klang
HAL 4000 4klang
Equilibrium 4klang
visit berlin 4klang
お花見 4klang
Gary Glitter 4klang
Superfine Oidos
Cycle Of Nature Oidos
Oxano Oidos
Those Who Leave 4klang
Maintenance Clinkster
Joia 4klang
Back to the Roots Oidos
Dropletia Oidos
crystalline lord 4klang
highrider 4klang
Primordial Soup Custom

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

Raymarching

High Quality 4K intros for Windows

4K intros for Windows with Sourcecode

Seminars

Articles

Retrieved from "http://www.sizecoding.org/index.php?title=4K_Intro&oldid=1617"