ASCII VJing Framework #

So, Kindohm’s 2022 AAA show visuals are inspiring me to do my own take on ASCII visuals. I tihnk it’s such a ripe form factor.

Aspects #

Automata #

Each character in a monospace grid can be treated like an automata that behaviors mostly the same with modifiers just for its position and the stats of the automata around it. we can use this to create fantastic syncronized patterns, as well as create rules for cascading effects across the automata.

In terms of the output, the output can simply be color, character, or, if we want to get wild, position. Other properties we could try are size, rotation, font boldness, italizication, strikethrough

Mapping from external visuals #

This is a really fun one since it basically means that, if we can generate some simple visuals for anything, we can display it in this format. this includes anything from fluid dynamics, which i think can be really fun, to faces, shapes, animals, etc.

I’m obviously taking a lot of inspiration from the raw shark texts for this, but i think it would be extremely cool to have a visual be ascii sharks swimming around on screen.

UI Simulation #

This would involve creating elements that actually involve text being written out or typed out as messages. You could have this text appear as inbound messages, prompts from a computer, warnings or errors, etc.

3D #

We can also have the letters be sized and positioned in such a way as to imply 3D. This might involve a less dense grid of letters at regular Z axes. If we add blur to this, we can also add depth of field.

Size Differences #

We can break up the grid by making certain characters take up 2x2+ tiles of normal characters.

Physics Simulation #

Ok, I think this one would be pretty difficult, but if it worked it’d be really cool, if the letters started bumping into and interacting with one another. Maybe they would fall towards the bottom, or maybe the letters would be blown away.

Choice of Text #

Not really a totally different aspect, but a fun thing to explore in general. Text has so many vibes and moods and aesthetics. There’s the aesthetic of a terminal that programmers are familiar with, but there’s also texting shorthand, internet lingo, etc, etc. With text alone, you can induce a ton of different vibes, from cute, to creepy, to beautiful, to exotic, to cultured, to crass.

Glitch Effects #

I love the idea of glitch effects being added to whatever is going on. Maybe something like random characters being changed, or some kind of glitch infection happening.

Technical Implementation #

I’m really tempted to do this in HTML, which would make it super extensible and super flexible. However, off the top of my head, i see how it wouldn’t allow for physics based things.

I think i’m going to go for it anyways. I think there’s a beauty to being able to do it in HTML, which everyone knows about and which everyone knows how to manipulate

I think the way it’ll work is by having letter be in its own span. Then, every frame, i simply cycle through the spans.

At initialization and at resize, I’ll take the window width and height, estimate how many characters would feel natural fitting in that space, make all those spans, then position them at the right position. Then they’ll be ready to be updated for whatever I want to do.

Something i’ll have to create ahead of time is a list of characters and the appropriate “vibe” for those characters. Looking at the wiki page for ASCII art made me realize there’s a lot of ways to do it. Starting out by using alphanumeric characters sounds good, but I would absolutely love to eventually incorporate the various weird characters that can be used.

Another thing I’ll have to do is create an intensity array for different character sets. hopefully i can find one online for the common ones, but if not, i’ll have to figure it out on my own. I’m also vaguely entertained by the idea of shuffling intensity arrays or inverting them.

If I want to do multiple of the effects describe above at once, there’s a decent chance i’ll be interested in a layering system. I think it shouldn’t be too complicated, but I do want to presently set the goals of arbitrary ordering and reshuffling of layers after the fact.

Automata #

Another thing I want to do ahead of time is define some rules or systems.

An idea I like a lot is having independant systems between characters and color.

Here’s some ideas for rules or systems: