» 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

~4h ago

microdee: it's like telling a west-Ukrainian that they're Russians...

~4h ago

microdee: @tonfilm: Telling a person from Hong Kong that they're Chinese is a bigger insult than calling their mom names ;)

~5h ago

tonfilm: Patch your own #mainloop with microsecond precision in #reactive #dotNET style. #rxNET #rx #gamedev #vvvv #VL vl-patch-your-own-mainloops

~6h ago

neuston: Sad. It hurts.

~6h ago

joreg: well, they would even have to choose "united" kingdom..

~6h ago

neuston: M... not work emotionally. Like asking a Scotland citizen to pick England

~6h ago

joreg: @neuston would it work for you to select "China"?

~6h ago

neuston: No Hong Kong in the country list of license page

~16h ago

udo2013: please excuse me. it works! installed "InstanceNoodles" again. this time via "vpm". good thing :-)