draft reference designs

Here are a few draft proposal designs for PDDP templates. The patches have only been tested on OSX.

Template 1 (The same style as the pixelTANGO help)

Patch

Screenshot

Pro:

• The headers look less junky than the other templates
• indenting helps with sub-options readability
• examples are isolated and easier to focus on.
• standard header has the overview
• More info along the bottom, a canvas "?" icon could work here.

Con:

• Pretty wide
• Width limitation is not great for example patches.
• many canvases (more laborious)
• does not scale (downwards) very easily

Template 2 (A minimalist change to the original PDDP template)

Patch

Screenshot

Pro:

• few canvases, very easy to make
• Headers separate from text
• First thing to be seen is the object in instantiation.

Con:

• Upper case is HARDER to read than lowercase, I think only meta-data should be upper-case.
• examples are harder to isolate, look pretty cramped in.
• Meta-data at the bottom seems awkward
• spacing of headers on the left are a little hard to read (structurally), sub-options are not very clear due to the lack of indenting
• Only scales downwards easily

Template 3 (A variation on template-2 with ideas from template-1)

Patch

Screenshot

Pro:

• Looks really clean and easy to read.
• looks less cramped using header-bars that span patch width
• larger more spaced area for patches
• page header and footer look consistent and frame the page
• less canvases than template-1 (easier to make)

Con:

• the colour of the subheadings help, but some kind of indentation would make the subheadings look more like sub-headings.
• More canvases than template-2
• only scales downwards easily

comments:

comments from the GridFlow? doc folks --alx2, Fri, 06 May 2005 20:46:45 +0200 reply
(alx2) Here are our comments:

We are working on docs for GridFlow? and we would like to adopt the same format as the PDDP. We like the verbose help patches. One main difference we would like to see is to have the patch featured at the top, after the declaration of the object. That is why Template 1 appeals to us but scrolling down might be preferable to hiding the patch below the help patch (template 1 is pretty wide). We think that the help patches should be narrower. Somehow the metadata is bulky at the top, we would rather place it at the end. We would like to keep the see also out of the subpatch, clicking directly on these related objects is such a nice feature, and usually it does not need more than one line.

Template 4 (Based on feedback on Template 3)

Patch

Screenshot

• Moved Meta-Data to bottom
• Moved example to top
• Lined up headings (lowercase) & indented sub-heading canvases

comments from the GridFlow? doc folks --tfbb, Tue, 10 May 2005 13:01:24 +0200 reply
My fav is #1, because it is the most clearly arranged one: all the information can be grasped at the first glance. The width of the patch is not really an issue in my opinion, I guess we all work at 1024x768 at least ... However, I do agree with the gridflow people that moving the metadata to the bottom would be a good idea.

where should the help patch go? --alx2, Tue, 10 May 2005 16:01:33 +0200 reply
Hiya, if width is not an issue, then we agree that #1 is viable. Ben, does it lead to a lot of open space under the patch if the text that accompanies it is quite long? How do you deal with that in the Pixel Tango help?

Alexandre

where should the help patch go? --bbogart, Tue, 10 May 2005 17:52:14 +0200 reply
In the pixelTANGO help patches there are few "patches" in the patch area, since the modules are so high-level. They only show one or two abstractions connected at a time see: PixelTANGO

The main problems with template-1 are that the patch area is very constrained. It would be hard to put a more complex patch here. So it could work as a "reference" template but not as an "all_about" template. The second problem is that it is much more laborious than the other templates, I'm worried it may not be adopted by all developers. Thirdly Its much easier to add another text column if one needed more space, but the example patch area is no so expandable. (wow it could be cool to specify padding and grids in PD so that the canvas could automatically expand with a change in window size.) The biggest improvement with template-4 is that the patch area can easily be expanded to any size, up to the point similar to template-1 where the patch is next to the text column, but is the same width. I wish more people (developers) would make comments. I'll try and work on a version of template-1 as template-5 sometime today.

Template 5 (Based on feedback on Template 1)

Patch

Screenshot

• Moved Meta-Data to bottom

more comments from the #dataflow channel --alx2, Wed, 11 May 2005 21:32:21 +0200 reply
Hiya, we just had a look at the newest templates and here are some comments : oh, and personally, i would put the "arguments" section before the in/outlet sections .... mabye next to the "usage" field ...... in the example there is for inlets "Left" and "Right" ..... for consitency, it should be numbered, maybe with a "Leftmost" or "Rightmost" for the first/last i mean, how would you describe an object with 5 inlets ? left, right from left, middle ..... ? just a question: you said the colored bars & fields are made using canvases .... maybe it would be an idea to just create a "comment" object ? one that has colours & font definitions ? left side is fine, for me it is easier to read ..... so it is really a choice between #4 and #5 ok cool and it still lets people see the patch, it was on the bottom before or in one of the proposed templates with the text below the example, it is more like a book page ..... plus, it makes the eyes jump up & down while reading, whereas the left-sided one gives it "all in one view" meaning that is easier to find the line you where reading again, after looking at the example ..... (at least for me) alx: Steph and I both think that #4 is the best. It is clearly laid out and is a more versatile design (works with long and short text components). Rob likes it too. but that might also be my bias because most of the jmax patches were arranged that way (example left, text right) darsha: but it is true that for a patch with less text, #5 looks good mamalala: True, but we found that the lines (mini canvases) dividing up the different sections are a bit distracting/ busy

...

There is a spelling mistake with CATEGORY.

Cheers,

Alexandre

more comments from the #dataflow channel --alx2, Wed, 11 May 2005 21:34:25 +0200 reply
sorry the wiki's formatting removed the names within brackets as well as the new lines. Taking part in the discussion were mamalala, darsha, stephanie, rob, matju and myself.

more comments from the #dataflow channel --bbogart, Mon, 16 May 2005 22:48:08 +0200 reply
I'm a little confused about the template numbering here, I thought the two-column thing (template-1) was the forrunner, and I've based template-5 and template-6 on this. Is template-4 now on top? If so please let me know and I'll revise template-6 into the style of template-4.

Template 6 (Based on feedback on Template 4&5)

Patch

Screenshot

• Moved Meta-Data to [pd META]?
• Changed colour of high-lights to makes things less busy looking
• Changed wording of inlets 0-n where "0" is left-most
• Removed the "HELP: float" line entirely
• Changed "links" to other patches, added "hyperlink" stand-ins

template 6 looks good! --alx2, Tue, 17 May 2005 18:12:37 +0200 reply
I understand your confusion, I was placing comments from our chat and there were two opinions voiced. We all now agree that the two-column layout is the best. We also agree that the change in colour lightens the layout. We like this layout but wonder if the see also or more info is entirely removed or simply not needed for this particular patch.

In any case, we are going ahead with the same layout for the GridFlow? reference. Thanks for this work :-). Alexandre

template 6 looks good! --bbogart, Tue, 17 May 2005 23:34:36 +0200 reply
Good to hear about consensus I think HC also was happy with this direction, no specific comments about template-6 from him yet. see also and more info will now be pddplinks that will directly open -example & -about patches, as well as html documents. I'm not personally sure how this fits into the templatge, if these links should be up to the developer. I think a link to a more complex example and a related -about patch should be required. What do you all think?