» 50: Colors
This site relies heavily on Javascript. You should enable it if you want the full experience. Learn more.

50: Colors

helo nerds,

this is the second in a series of blogposts about our forthcoming nextbigthing that we still call vvvv50 (50). If you haven't already done so please first read the last issue with the title:

All information given here is still preliminary and subject to change.

Now here is the first real treat. We're starting with a simple one: Colors, or how we like to call them: Operations.

First here is a bit you may not have been aware of: When in vvvv45 (45) you create subpatches this is actually only for your own sanity. vvvv itself does not see those but only deals with all your nodes as if they were in one big patch. So in 45 every cascaded system of patches can actually be seen as only one very big patch. And even more so actually everything together can be seen as one big function/operation that is executed every frame. Quite shocking, innit? In 50 this is very different in that the visual structure has actual meaning to it. Good news: You can keep your assumptions, only now they will really work out.

Defining Operations

As an example let's have a look at two patches in 45 which are called "PointIsWithinCircle" and "PointIsWithinRectangle":

Two 45 patches defining one operation each.

So here each of the two operations is defined and saved in a separate .v4p file. In 50 they look basically exactly the same only that they can also be defined together in one patch like so:

One 50 patch defining two operations.

And you really can collect any number of such helper-operations in one patch by just selecting a group of nodes and giving them a name. Like this multiple operations can be saved in one .vl file. Now this is obviously cool on the one hand but you may also immediately think of scenarios where this has more implications (think: project structure, versioning,...). But let's not ruin the party with such thoughts already. So anyway you just learned that in 50 a patch can be a container for defining more than one operation. Easy.

Having a closer look at the 50 screenshot you see something you haven't seen before. People call those things "Colors" and while they are basically evil, when used in the right way they can actually be quite helpful. Here we use them to visually distinguish between different operations in one patch. You may argue you'd not need colors for this because the operations are all placed next to each other anyway. Indeed, but note that this is really just the most simple case. Think of multiple operations in one patch exchanging data (via links) between each other...we'll come to that in a later blogpost.

For people familiar with c# here is a transcription of the patch that you see:

static bool PointIsWithinCircle(Vector2d point, Vector2d center, float radius)
{
  //implementation
  return output;
}
 
static bool PointIsWithinRectangle(Vector2d point, Vector2d center, Vector2d size)
{
  //implementation
  return output;
}

So you also see how 50 clearly translates the signature of such operations to a visual representation with the colored header and footer of the operation resembling the function-header and line of return that are embracing the implementation.

Here is another example of an operation returning multiple results. Again nothing special you're already used to that from 45 only here the colors encompassing the output pins speak a clearer picture.

50 operation with multiple outputs.

Using Operations

You know from 45 that any operation you defined in a patch can be placed as a node inside another patch. Same in 50. Doubleclick a patch to bring up the nodebrowser and select the operation you want to use as a node.

50 nodes with ugly font-rendering.

So all-in-all no big deal right? Only that inch better and finally, colors. Have a suggestion where we would allow users to choose their own colors? Get a life...

...but then also come back for the next article in this series revealing more awesome from the future of programming.

Liked what you read? Insert coin: /downloads|vvvv?.

joreg, Tuesday, Nov 4th 2014 Digg | Tweet | Delicious 18 comments  
u7angel 04/11/2014 - 13:52

color: resistance is futile

gregsn 04/11/2014 - 17:11

i used to love black & white, 16mm, celluloid, providing a huge projection screen for all sorts of emotions. e.g. https://vimeo.com/37825442 anyway. colors seem to be the future. this is so ah!

u7angel 04/11/2014 - 17:33

beware of orange
https://www.youtube.com/watch?v=mDRbnmjzY7U

lecloneur 04/11/2014 - 17:54

will it be possible to have some kind of config file where we can define our color charts, based on our habits ?

Looks like GUI problem remains the same if you don't give us any tools to make patch cleaner.

Indeed, it is possible to have really clean and tidy patches but it takes so much time... because we can mess up things in two dimension in vvvv and this CTRL+L shortcut is for big hands only.

Can't wait to try this new beta though. Good luck guys.

tonfilm 04/11/2014 - 19:25

@lecloneur, 'fcourse.. ;)

Curveau 04/11/2014 - 22:57

Oooh hello - I seem to see some anti-aliased lines in the 50 screen.

That would be a very welcome change :)

flateric 04/11/2014 - 23:34
static bool PointIsWithinCircle(Vector2d point, Vector2d center, float radius)

Mixing floats and doubles again?
Seems history repeats itself ;)

tonfilm 05/11/2014 - 00:51

heh, where do you see doubles? :)

flateric 05/11/2014 - 01:07

if Vector2d comes from OpenTK, it's doubles ;)

xd_nitro 05/11/2014 - 01:30

Color or Colour?

gregsn 05/11/2014 - 01:52

yellow man! misleading coincidence... whats meant here is just a vector with 2 dimensions, not really a particular data type.

StiX 05/11/2014 - 17:21

this is looking so so good

princemio 05/11/2014 - 21:41

hehe colors ...has someone seen the movie : the artist ;)

Very nice

readme 05/11/2014 - 22:32

Cool!

Would be nice to draw the selection in a polyline manner instead of rectangular selection only. Like drawing an area around a set of nodes which would put them in a group visually ... or not just coloring the links and pins of the operations but also the used nodes.
Oh well, sorry, asking for too much!

Thanks, looking forward.

tonfilm 06/11/2014 - 17:26

@xdnitro:

blame Noah Webster:

grammarist.com said

Color vs. colour

...

History

Both spellings are many centuries old. Color, now regarded as the American spelling, in fact predates the United States by several centuries. In early use the spellings vied for ascendancy with several other spellings. Colur, culoure, and coolor, for instance, were all in the mix before the modern British spelling gained permanent prevalence in the 17th century.1 The American preference for color took hold in the middle 19th century thanks in large part to the conscious simplification of English spellings by people such as the lexicographer Noah Webster.

maybe we could agree on coolor?

u7angel 07/11/2014 - 16:02

when can we have a test drive ? node festival is 6 months away. seems ages...

sebl 07/11/2014 - 16:05

and a (rough) roadmap would be nice

woei 08/11/2014 - 04:17

PointIsWithinCircle.v4p seems buggy :D

  • 1

anonymous user login

Shoutbox

~5d ago

~8d ago

joreg: The Winter Season of vvvv workshops is now over but all recordings are still available for purchase: https://thenodeinstitute.org/ws23-vvvv-intermediates/

~14d ago

schlonzo: Love the new drag and drop functionality for links in latest previews!

~22d ago

joreg: Workshop on 29 02: Create Sequencers and Precise Clock Based Tools. Signup here: https://thenodeinstitute.org/courses/ws23-vvvv-08-create-sequencers-and-precise-clock-based-tools-in-vvvv-gamma/

~29d ago

joreg: Workshop on 22 02: Unlocking Shader Artistry: A Journey through ‘The Book of Shaders’ with FUSE. Signup here: https://thenodeinstitute.org/courses/ws23-vvvv-12-book-of-shaders/

~1mth ago

joreg: Talk and Workshop on February 15 & 16 in Frankfurt: https://visualprogramming.net/blog/vvvv-at-node-code-frankfurt/

~1mth ago

woei: @Joanie_AntiVJ: think so, looks doable

~1mth ago

xd_nitro: Anyone remember who increased projector brightness by removing some components that product the color?

~1mth ago

Joanie_AntiVJ: This looks super interesting (vectors over network) would anyone here know how to implement this in beta? https://github.com/madmappersoftware/Ponk