Wiki/Report of Meeting 2024-05-02
Report of Meeting 2024-05-02
Present: Art Anger, Ed Gottsman and Bob Therriault
Full transcripts of this meeting are now available below on this wiki page.
1) Ed gave a report on his most recent exploration of the category displays. He has used colour, indentation and size of font to distinguish the hierarchy of the category trees. This works with the JQt viewer. Additional information that is provided is the number of pages that are associated with each category. The scrolling of the columns is done with a horizontal scroll. He is also loading all the pages in a category in a drop down which saves the user a lot of look up and traversal time. Ed feels that the tree map is not the way to approach this, but feels better about the outline approach that he has taken. Bob wondered if the vertical column of the the J Viewer has the same information. Ed feels that the addition of colour and font size makes the information much more accessible. Also that the horizontal scrolling across the columns allow the user to cover a lot more real estate than the vertical category display. The dropdown in an interesting idea, although with some of the categories that have many pages it does become a bit cumbersome.
2) Bob showed the template that he had developed that was more of a tree map of the categories in a grid display. https://code.jsoftware.com/wiki/User:Bob_Therriault/template It still needs to have the hover facility put in. Ed wondered how many nodes are displayed and Bob estimated that this display has about a third of the total number of nodes. Bob pointed out that there are inconsistencies in the display in the way that some of the categories display vertically and some at the same level may display horizontally. This is done to make the best use of space. Ed felt that the ratio of data to area is pretty low, so it does not seem like there should be a better use of space. This would be a challenge especially for mobile users. Bob felt that reorganizing the categories might give a little gain but not as much as might be required. The idea would be to keep the most useful areas near the top of the display since the template will be at the bottom of each page. Ed wondered if was possible to just let the grid CSS display order the nodes into columns and not worry so much about the separation of the different categories. Those differences would be shown by font size and colour. Bob felt he would be constrained by the fact that grid only extends one layer down, but Ed felt that looking at this as a flat list would be better and there was some discussion to explain to Bob how this might work. Ed used the analogy of laying out columns on a newspaper. Bob wondered about using different fonts to distinguish between different categories. Ed's experience is that graphic designers have a strong negative reaction to this. It would probably be best to stick with size and color as areas to discern between categories. Bob felt that this was a good direction to explore. The numbers of pages with each category are probably not going to be available with this representation.
3) There was some discussion about SVG and the fact that with JQt SVG would remain an option. SVG allows a more constrained layout that could make better use of space. Ed mentioned that it does not work as well for mobile users. Bob thought that pinching allowed zooming in and out. Ed pointed out that this would require a lot of zooming in and out to view pages shown at the regular size. Bob wondered if there was an option to use viewports and inset of the overall map. Ed thought that this was more useful for physical terrain instead of conceptual differences. Bob felt that this would be closer to what Jan was trying to do with his data generated maps. All of this may require additional user training that we would not want to require to use the wiki. Simpler is better. Ed says that making hierarchy navigation more obvious will allow users to better appreciate the information that is contained in the wiki. Bob agrees.
For access to previous meeting reports https://code.jsoftware.com/wiki/Wiki_Development If you would like to participate in the development of the J wiki please contact us on the J forum and we will get you an invitation to the next J wiki meeting held on Thursdays at 23:00 (UTC) There will not b e meeting on May 9th, so the next meeting is May 16, 2024.
Transcript
Let me share my screen.
Wow, look at that.
So I gave up.
Which I'm not proud of.
What we're looking at here is part of your hierarchy.
There's the synthetic stuff that I added at the beginning, and then here's home.
And I used three mechanisms to make the hierarchy easier to follow.
So the top level nodes are dark red.
The next level down, level two are green. The next level down, level three are blue,
and then black, and then a sort of a purplish color.
Yeah.
And the effect of this, I think, is pretty good. So if you're looking at newcomers, for example,
which is the second category under home, and you're not interested in newcomers,
it's very easy to bounce your eye to the next green label and say, okay, yeah, reference.
And what's after reference? Well, where's the next green label? Community.
So reference is huge. Reference encompasses a lot of nodes, starting here, all the way through here,
through here, through here, until you get to community. And then JPlayground is the last
major node. What happens is, there's a couple of things. So every category has associated with it
a certain number of pages. Primitives, for example, has 149 pages associated with it.
FAC has 26 pages associated with it. These numbers are shown as you hover,
but more than that, they're shown by bars that are coincident with the labels. So 37 databases,
pages, but only 10 SQLite pages, and 55 language concepts pages. Primitives is huge at 149.
Reference only has one. Now, a couple of things. All right, so how do you use this? Well,
you can scroll using whatever vertical scroll mechanism you like. It just gets translated
to horizontal, so I'm on a MacBook, so I'm using the two-finger vertical scroll.
But with a mouse, you'd have a mouse wheel, and it would behave the same way.
What you can do is, if you click on one of these, like web, which has 18 pages,
will take you to the category page. And this is the annoying way to do it. You can go to a page,
and then hit back, and go to another page, and hit back. But the other thing that happens when
you pick a category, like let's say learning J, we actually load up those pages in the menu
over here. So now, you don't need to go back. You can just always go forward. So that's a
little better than it might otherwise be. And it is sort of funny. It's like picking a category
over here, and then you can pick pages. It works out to more or less the same thing.
So that's the story. I gave up on nested layouts for hierarchies. I don't think there's any-- I
mean, even if you take this all the way down to fairly tiny type, I don't think you could get a
reasonable nested tree map style layout with all of these labels in it on a display this
size. And this is a fairly-- this is a MacBook Pro. This is a fairly large display. A lot of
people have smaller displays. So I really don't think it's feasible to do it as a nested hierarchy.
But I think it doesn't look so bad as just a straight ahead outline where you can scroll,
and where clicking loads up a menu. So that's the story, at least so far. So
any reactions or comments would be welcome. Well, what I see, I like it, but I think it's
a duplicate of the column that's right beside it. Well, I would agree with you, except that
the column basically only uses indention. So I would challenge you to find what comes after--
what the next thing is after newcomers, or what the next thing is after reference.
Right. You're not going to-- you got to sort of eyeball it with your thumb, maybe,
and figure out how far in reference is, and then go down to the next thing that's about that far in.
Yeah. So I think it's harder to navigate than the color-coded, indented, font-sized--
the arrangement that uses color-coding, font-size, and indention to give category-level cues.
Is it an option-- So I think it's a win in that regard.
Yeah, no, I agree with you there. Is it an option to put color-coding and size in on your column?
In principle, yes. On this column, no. This implementation, this is just a
QT list widget, so the formatting really isn't there, but I could do it manually.
And that may, in fact, be a good answer. I don't know. The only other thing that I like is this
horizontal scrolling. I like the fact that I can see three columns worth of hierarchy at once,
rather than just one column at a time, as I do here. I'm getting more, particularly if I
make it small, I'm getting an awful lot more bang for my buck in terms of screen utilization.
Yeah, you're definitely-- I take your point, but--
Yeah, I'm just comparing the columns. You're all the way over to essays on your three-column
thing, and you're only at frameworks and add-ons on the single column at that point.
Yeah, and you can-- You get a lot more leverage shrinking the text on a multi-column display
than you do shrinking the text to a single-column display. So I think there might be something
there. I think it's more interesting than the Magic 8-Ball, which is what I was using
this menu for before. Yeah, no, I liked that drop-down. That's a cool idea.
But again, I think that could be done off that column as well, right?
I think your drop-down could be-- Absolutely. And the only place where it falls down is
something like system, which has 142. And that takes a while to get down to the bottom of the
that, and there's no way to speed it up. So for system, I'm not even sure I can find it.
It's definitely reference.
Reference.
You see why I find this so annoying? Yeah, yeah.
System. So here, all the pages are immediately available, and there's this
slightly different mechanism for compressing all the names onto the display. And I think that's
a little easier than this. Yes. So I'm not quite sure where I come out on this. I don't know.
Yeah. No, it's kind of neat to see, though, because I'll show you what I've come up with.
Yeah, please do. Hang on. Let me--
Oh, there's Art.
Hello. Hello, Art. How are you doing?
Finished supper. Pretty sore.
I finished supper. Oh, you finished supper. Okay.
I thought, well, pretty sore is not great.
So there's my template. Now, I haven't done all of reference, but I did all of developers,
which normally I would have taken out. But it's a good test piece for me.
Now, my guess is-- let's see if I see what you're seeing.
Okay. So what I'm going to do now, I'm going to stop sharing.
I'm going to go back to share with my desktop.
Because that way you can see squeezing parts.
Yes. That's the magic of grid.
Right. Does a nice job of making that vertical
Now, of course, if you go vertical, you got a lot of stuff that's going to be in there, right?
Yeah. But, you know, that's the nature of it.
But I was happy with the way it kind of looked at this point. I haven't gone--
populating this is the area that would show up a quick display as you hover over these different
areas. I haven't got that going yet. So that's still to come. But that's probably what I'm
looking at is just this couple of lines in the top here that when you hover, it'll give you a
brief description of what you're hovering over. And then clicking it will take you to that page.
And-- A question. How many-- I think you have about 140 nodes in your hierarchy. How many of
them are shown here? I'm having trouble estimating.
Well, for one thing, in your hierarchy, all of these don't exist. I've taken that out.
I just-- I put them back in just as a test because they were a little smaller than taking
on all of reference at one go. Of the 140, I would guess here,
probably about maybe 50, maybe 45, 50. All right.
So you're looking at maybe about a third. And I think there's only one place it goes.
I think in essays, it might go one level deeper. So there might be another level inside here.
But the areas that were, for me, a little controversial, I guess,
things where I've sort of broke things a little bit. With newcomers, I've got all these at one
level. And for developers, of course, I've gone vertical for that level, which seemed to me-- it
makes sense to me to do that. But it's not consistent. If I went vertical here, I'd be
driving everything down. And I do the same thing here with NUVOC and then Framework. I've got my
add-ons, which I'm going this way, and then databases and labs. But my next thing will
show up under-- I think there's another framework to go underneath that. But then I get to things
like system and essays and stuff like that. They'll go deep again, but they'll be separate.
But I don't know. The one area where I've really broken it, I would say, is I could have put
scripts on the same line as standard library. And then that would be consistent with going sideways
when possible. But I don't know whether that's the right thing to do or whether it's better just
to stay vertical at that point. >>
Well, I'll tell you what strikes me. The ratio of data to area strikes me as very, very low.
Do you see what I mean? And I think that's only going to become more pronounced as you add
more levels, more nodes, more major nodes. In order to make an apprehendable layout,
you're going to wind up with a lot more unused area than used area, if that makes sense.
And that seems a shame, particularly for mobile users. >>
Yeah. I'm thinking the portrait mode of this is not friendly to trying to come down and find
things. You're going a long way down your screen. Now, I would think at this point,
I'm going to take developers out, which puts reference that much higher. My other option,
is to say, put newcomers and take up half this area, and then take something like community or
playground and put it on the other half. So I'm basically doubling up on the sides here,
which would give me, I'm really fighting vertical space. I'm not fighting horizontal space so much.
Because I can reduce these spacings in here. I mean, it's fairly easy. I'm just changing the
gaps and the mid-max there to make it work. >> Sure.
>> So I can make them tighter that way. But I can't make them so tight that I'm going to gain
that much horizontally. It's vertical is a challenge. >> Yeah.
>> But then the option is to put these, say, newcomers, playground side by side, developers,
maybe community side by side, and maybe below, I don't know,
to keep the most useful things up near the top. >> Well, that's always tricky though, to figure
out what constitutes most useful. >> Yeah.
>> I mean, obviously, the J6 release notes, we can probably safely de-emphasize. But beyond that,
it's sort of hard to tell. >> Yeah.
>> The other thing about it is this is sort of a typical tree map kind of a thing in the sense that
it's sort of hard to figure out. The hierarchy doesn't always jump out at you. You crafted it,
and you've been looking at it for a while. But as I just glanced at it, I didn't immediately say,
oh, there are X top-level nodes, and the second top-level node has these immediate children,
and so on. It's a little hard to say. I wonder, and maybe it's not fair to keep thinking in terms
of mobile, but it strikes me that you could trivially do what I did using the grid.
You could tag the nodes with attributes like color and font size and invention.
>> Yeah. >>
The grid mechanism would let you have as many or as few columns as were appropriate, given the
height and width of the display or of the window. And you just scroll horizontally, and it would
just work. And when I say trivially, I mean you wouldn't need to do a lot of manual layout. You
just list the nodes, and grid would take care of stacking them one column after another horizontally
to accommodate whatever the available height was in the window.
>> Well, the thing I found with grid is it really only organizes the next level down, right?
>> That's not quite what I mean. What I'm imagining is something very simple,
where you've got a set, a list of labels. It's been so long since I did HTML, I don't remember
what to call them anymore. List of text boxes, text fields that have been CSS-ed based on their level.
>> Yeah. >> The CSS controls color,
font size, and invention. >> Yeah.
>> Each of those labels is independently turned over to the grid manager. And the grid manager
is just responsible for laying them out top to bottom, left to right. There are no levels,
there is no hierarchy. It's a strictly flat linear list.
>> Okay. Yeah. >> But the CSS on the font size,
the invention, and the color gives you the visual effect, which is really all you care about,
of a hierarchy. >>
Yeah. I can see how that would work if each level had the same number of entries.
>> Doesn't matter. >> Well, it kind of...
Like, otherwise you end up with newcomers might start here. Well, actually, so for instance,
if you did that, newcomers is probably going to show up here, followed by all its stuff.
>> Why? >> Well, because if you put everything
at the same level, that's what I'm saying, grid organizes the level below it. You can do a grid
within a grid to go to the next level down. >> You're overthinking it, I think.
>> No, no. >> There is no next level.
>> Okay. >> There's one level.
>> Okay. >> There's a list of labels.
>> Yeah. >> All you tell the grid is,
these go top to bottom, left to right. So as the width of the window shrinks, they get pushed down,
or better yet, it's scrollable. And as the height of the window increases, the height of the columns
increases. Essentially, you're laying out column inches on a newspaper, a single article in
multiple columns in a newspaper. That's the way to think about it. And all those columns are at
the same level as far as the grid is concerned. There are no child levels. So it's just a flat
list. >> So when I look at my newcomers level here,
playground is at the same level as is all these are at the same level as newcomers?
>> No. >> No?
>> No. It really, let me share again, if you don't mind.
>> Yeah, go ahead. I'll stop. Yeah. >> Thanks.
>> Yeah, I think you're right that I probably am overthinking it because otherwise I'm not seeing
it. So, so. >> Yeah, no, I'm sorry.
So ignoring the bar chart bars for the moment, although you could do that.
And actually you could do the hover as well, now that I think about it.
But this is all happening at one level. It looks like there's a hierarchy that goes for even in
the case of add-ons, I think five levels deep. >> Gotcha. Okay.
>> But there is no depth as far as the layout manager is concerned. It's just laying out
labels one after the other. >> Okay. Yeah, yeah.
>> Now the grid can do this. And in particular, the grid has no problem laying out labels
that have different heights. Right? >> Yeah.
>> It's got no problem with heterogeneous labels. >> No, no, it's just a space for it.
>> Yeah, exactly. >> Yeah.
>> So you could CSS the labels to be sensitive to what level they were at,
and that would control color and font size. >> Absolutely.
>> And even invention. Right? >> Yep. Yep. Absolutely. That's not a problem.
>> And the grid would just do this and would just, and it would be scrollable.
>> Right. So what I think I was thinking about the wrong way was I wasn't thinking of it in
terms of columns. I was thinking it in terms of rows. And you can use grid column-based. You
don't have to use it row-based. >> Yeah.
>> And column-based is essentially what you're doing with this. Right?
>> That's exactly right. >> Yeah. Yeah. Okay.
>> That's exactly right. Yeah. Let me stop sharing. >> Yeah.
>> So that, I'm right off tree maps these days. I don't think that they, I think it's like
Goodell's incompleteness theorem. It's conceivable that you could get a layout that would have all
of the labels you want nicely nested, but, or nested. But if you did that, it wouldn't be
readable by a human being. >> Mm-hmm.
>> It's just too dense and the shaping would be too strange. And you're in a sense doing it quite
right. You're doing it manually, which is, I think the only way to get something that's even
borderline acceptable. I don't think there's a layout mechanism that will give you something
that you'll be happy with. An algorithm will give you something you'll be happy with.
So I, or you can do something that is apprehendable by a person that does make sense,
but it'll be huge. >> Yeah. Yeah.
>> So that, you know, you can choose your poison. You can pick one or the other, but you can't have
both. So, so my current thinking in a week from now, I may have changed my mind, is that color
indention and font size are your friends in terms of communicating hierarchy. And that actually
could work pretty well. And in particular, on a mobile device, it just collapses to a single column
that is vertically scrollable. >> Yeah.
>> And that's just fine. >> Yep.
>> Or it collapses to a lot of columns that are horizontally scrollable. It doesn't really
matter either way is just fine. >> What's your take on instead of using,
and I'm not saying, when I'm saying instead of, I should be saying and color.
What about using different fonts? >> Oh.
I'm just thinking for people who color acuity is not there, not able to do it.
>> Color acuity. Yeah. Well, that's why indention and font size are sort of your backup.
>> Absolutely. Yeah. Yeah. Yeah. >> I don't, I have no visual sense to speak
of, but I have worked with graphic artists over the years and I have occasionally done multi-font,
you know, I, I distinguish this kind of thing with this font versus the other font.
>> Exactly. Yeah. Yeah. >> And their heads always explode.
Multiple, multiple incompatible is I guess probably how they would express it. Fonts is
not something I've ever had any success with among those who know about these things.
>> Yeah. >> I can't speak for it
quite from independent knowledge, but the reactions I've gotten over the years have been discouraging.
>> My sense of it is, and I've had similar reactions, but it, to me, it's, it seems to
be more an aesthetic choice, but, but I'm just saying it's a very strong reaction.
>> It is. It absolutely is. Whereas color, although I'm sure they would disagree with
the colors I chose, color is something you can make work in their eyes.
>> Yeah. And they tend to get less upset about just straight size, you know, to that.
>> Or size. Yeah. Right. >> In fact, I think the thing that
points out the size is acceptable is the whole headings hierarchy, right?
>> Yeah. >> But even in within the headings
hierarchy within MediaWiki, you have different fonts. So they do do that. I don't like that,
but they do it. >> Yeah. Yeah.
>> Yeah. >> You know, the, the mark of a really good
artist is knowing when you can safely break the rules. So we're definitely in territory I'm not
comfortable with at this point. >> Yeah. I just, I'm always leery about
color. I love color because I got good color acuity, but, but I, I, I always have to design
in the back of my head. If you don't see, nobody sees black and white, but they do see
some strange shades of gray, you know, that, that you can sort of tell the difference between
some colors. But yeah, I always think about that because I mean, if I just go straight on color,
it will look glorious to me and make sure there's absolutely nothing there. Yeah.
>> Yeah. Yeah. Well, again, font size, which I made a particular choice about
a degree of the degree of change from level to level. You could be more extreme about that.
That's something that everybody is going to feel comfortable with and invention also.
>> The other thing I can do is I can go on shade because for instance, a, a, a deep green
and a deep red will have two different luminance levels.
>> Yeah. >> Just because of the way our eyes work.
>> One of the things I learned, I've never, I don't know if I've ever actually been able to
use it successfully, but I have thought about it is we can distinguish more shades of gray than we
can of any other color. >> Yeah.
>> So I actually thought about using shades of gray for this and have, you know, black for the
major headings and then steadily grayer as you worked your way down.
>> Yeah. >> And that may in fact be a good
answer. I didn't, I didn't do it, but it's not because I think it's a bad idea.
>> Well, and the thing I've played around with at times is when I get to the lighter shades,
where I want to see, you know, you don't want to put shades that are close to white over white,
just, but what you can do is you can put an outline on it there.
>> Yeah, right. >> And it feels much more
acceptable at that point. >> Yeah. I guess I would hope,
I mean, we've only got five levels, four or five levels of hierarchy we have to distinguish.
>> Yeah. >> So you could stay above 127, 127, 127,
or below, and you'd probably be able to create an appropriate levels of difference for each of the
levels of hierarchy. >> But I could also change
hues within those levels too. >> You could, but that's, I would argue
that's potentially confusing. I mean, if your goal is, I mean, color doesn't have,
hue doesn't have any natural ordering. >> Oh, I see what you're doing.
>> Yeah, luminance does. >> Yeah. Well, yeah. But see,
what I could do is I could, I mean, you're right, color doesn't have any, any natural ordering,
except that it separates things. >> Sure. It distinguishes,
but it doesn't order. >> It doesn't order. So if I just did the
darkest shade would be say the top, and then a lighter shade, a lighter shade, a lighter shade,
darker shade might be blue. >> Yeah, might work.
>> Might be red. I don't know. I can't remember what the, how the shades work to the colors,
but they are, they definitely have different, like if you do a, I'm pretty sure it's a dark
shade of blue. You have to get a lot darker with blue to make it look as dark as red.
>> Interesting. Yeah, see that's one- >> I'm pretty sure that's, I mean,
I can play around with it, but it's something like that. They're very different into how
the luminance required for the shade to make it look like a blue is quite a bit different
compared to a red or a green. >> I can nod my head and furrow
my brow intelligently at these things, but I cannot help you. I do not know.
>> No, because I was playing around with that a bit with Jake to see if I could change things
around. >> Sure, right.
>> I ended up going to fonts because I was dealing mostly with text stuff, and I wanted
complex numbers to look different than float. >> Yeah, right.
>> And fonts are the easy way to do that. >> Yeah, right.
>> And I know designers will, they'll lose their minds over it, but the point is,
is there's no doubt you can change from one type to another. You can tell right away.
>> Yeah. >> And that was the
distinguishing part for me. >> Right.
>> I like the-- >> The other thing about going that route,
I apologize for pushing. I just-- >> No, no, no, no.
>> I don't, as I say, write off tree maps these days. The other thing about this is you wouldn't
have to do any manual layout. You could just try it and see what you think fairly straightforwardly.
>> Yeah. >> You said with the confidence of the person
who isn't actually going to have to do it. >> No, what you're describing should be pretty
easy to do. >> Oh, good.
>> In fact, the other thing I'm thinking about, I can't remember whether it's SVG
or whether CSS has, CSS, does it have an overflow? It does, doesn't it?
>> Does it have an overflow? >> Yeah, there's an overflow setting
you can do on SVG so that things can show up outside. I think CSS does as well.
>> Yeah, it does. You can suppress or enable vertical and horizontal scrolling.
>> And that's what I was going to say is you could set it up as a horizontal scroll.
>> Yeah, yeah. I don't think that'll be hard. >> Yeah.
>> Because you're not looking for anything fancy. You just want to turn off vertical
scrolling and leave horizontal scrolling in place.
>> And just have overflow as a horizontal scroll and then it'll just be side to side.
>> Yeah. >> Yeah.
>> I think that's probably pretty straightforward. >> Yeah.
>> Pretty. >> Yeah. Again, I'm just going by
my memory, playing around with things, but I think that'll work for that. And you're right,
once you've set the different classes for the different levels, it's one spot to change all
of them to whatever you want in the CSS. So that's nice.
>> Right. Yeah. >> And that allows you to play around with it.
And now you were also talking about on the hover using the numbers.
>> Yeah. >> You're generating those numbers though, right?
>> Yeah. I don't know if you have an easy way to get that information.
>> Yeah. >> I crawl to get it.
>> Okay. >> I don't know if MediaWiki will give it
to you in any easily consumable form. And if you can't get the numbers, you can't do the
bar chart bars either, obviously. >> Yeah. Yeah. No, I need those for the
relative distance across. >> Yeah. Well, you could. It's only 140.
You could grab the counts manually. >> Yeah.
>> And just record them. >> Yeah. Because they're not going to
change too much. >> Not too much.
>> Not until I go back to changing the tree, in which case, but that's-
>> Well, then it's all-
>> That would change everything anyway.
>> All bets are off at that point. >> Yeah, exactly.
>> Yeah. >> Right.
And even if the page counts are going to change a little bit, you could put a tilde in front of
each number as it comes up. There are about six pages associated with this category. And that way,
if it goes to seven or six or five or four or eight or nine, it doesn't really matter.
>> Yeah. >> Not that anyone's going to count
anyway. Well, maybe some people. >>
In my life, I could name a couple of them. >> No doubt. No doubt.
>> They have their purpose. They're very useful. >> They do. They absolutely do.
>> But in other areas, I don't try not to pay too much attention to them because-
>> Yeah. Right.
>> I never get anything done. >> Yeah, exactly.
>> But when I get to that last little bit- >> Yeah, right.
>> I know I have to- >> When you're trying to get
the last 10% done, yeah, they will be there for you.
>> It'll stick right out at them and they just don't-
>> Yeah.
>> It's just got to get that fixed. >> Got to get it fixed. Yeah, exactly.
So that's the most I can think of at this point. I
told you that I tried to do dendrograms, so circular trees, and the space usage is just
terrible with those. It's worse than it is with tree maps. So it's very hard to make those work
properly. Getting a hierarchy of 140 nodes onto a single display is quite tricky.
>> One of the advantages- >> It's lousy to scroll them.
>> Yeah. One of the advantages, and I didn't go too deep because, of course,
SVG wasn't working on MediaWiki, but one of the advantages of SVG is
I can design a page that'll make better use of space.
>> Yeah. You can. The problem you run into is, again, what to do with mobile users.
Well, the thing with mobile users is it's always available. You just make it small
and you can pinch and zoom out. >> Yeah. The thing is you- Well,
yeah. It's certainly possible. I have a bias towards automatic solutions just because as
the hierarchy changes, your life is easier than it would otherwise be.
>> Yeah. But that's the other advantage that SVG gives you. When you pinch and zoom out,
you're not losing resolution. >> Sure, but you're losing all kinds
of content. >> Well, and actually,
you go back to your page, you have to squeeze it back down again to be able to look at things.
>> Yeah, right. >> Yeah, yeah, yeah.
Anyway, that's the only answer I would see is you're talking about
dendrograms and stuff like that. You could do quite a pretty layout and proportionally put
things wherever you wanted them because essentially you're creating a framed art, right?
>> Mm-hmm. Yeah. >> Now, the other option is you
could move your viewport around. >> Yeah. You could do two-dimensional
scrolling. That is certainly true. I tried to do that once with a trade ticket for retail traders.
>> Yeah. >> And I got very strong pushback. It's just
too disorienting apparently to have the unknown not only horizontally but vertically, which also
means in all four corners. At least the people I showed it to did not think I had come up with a
winner in that regard. One-dimensional scrolling, people seem to be able to handle pretty well
because that's, I mean, two-dimensional scrolling is one, two, three, four, five, six, seven, eight
octants unknown. >> Yeah.
>> Horizontal scrolling is two octants unknown. >> Yeah, yeah.
>> So, I guess I understand now why they were so unhappy. It makes a certain amount of sense to me.
So, you're clearly right. Scrolling solves many problems. 2D scrolling solves all problems,
but I'm not sure it's necessarily a good solution. >>
Can't remember what Google Maps, does it do an inset when you're moving around within the map?
>> Oh, I have definitely seen maps that do that. I don't know if Google Maps does it offhand.
>> Yeah. I'm just wondering whether- >> Yeah, there's something to that.
Well, many video games do that. War games. >> Yes, yeah.
>> Time strategy games, that kind of thing. They'll have an inset. That I think is great.
That mitigates the unknowns, the eight unknowns. >> Yeah, essentially you're seeing your whole
screen and you can move your inset around to wherever you want it on the screen.
>> Yeah. Well, the problem, I mean, it works for terrain more or less.
>> Yeah. >> But that inset doesn't tell you
too much about where you should look. If it's a dendrogram of a category hierarchy, for example,
all it can show is structure and maybe only down to a certain level of detail.
So it's not entirely obvious that it's helpful. If you're planning an invasion,
that inset can be very helpful. If you're trying to find add-ons, it's not obvious that it's
terribly helpful. >> No, at that level, I'm thinking the
differences in the terrain are probably the differences between reference and developer
and newcomer. And I mean, you're talking about a much higher level, but within that,
then you've got to work really hard to figure that out.
>> The inset can't even give you label names. I mean, not if it's showing you a lot of detail
about the overall hierarchy. >> Yeah. I was thinking two ways to
distinguish between the different areas. It would be almost like a map with countries,
closer to what Jan's doing. >> That's what Jan's trying to do.
>> Yeah, yeah, yeah. >> Yeah. But again, you'd have to be able
to get labels into the inset, and I'm not sure the inset's big enough to have coherent labels.
>> Well, unless... So what about if your inset was the entire map with a square that shows you
where you are in that map? >> Yeah. At that point, there is no room
for labels. >> There's no room for labels at all.
>> Yeah. All you've got is terrain, and terrain is basically meaningless if you're navigating
a hierarchy. It's great, again, if you're planning an invasion, but for navigating a hierarchy,
it's not helpful. >> Yeah, because you're looking
for the North, South, East, West. >> Yeah. And you know where your
target is and how you're disposition of your forces with respect to the target and so on.
But again, if you're looking for add-ons, it's no help whatsoever.
>> And you don't want to have to have a college-level tutorial about what's required to navigate your
interface. >> Yeah. I'm not even sure it would help.
I mean, what would you tell them? Even if they're willing to sit still for a two-minute training
video, what would you put in it? >> Well, I think you'd have to develop
visual cues that might not otherwise be as noticeable. And it could be a series of dots,
even, instead of actual labels, just colored dots. I mean, I'm just dreaming with this, but
I can see areas where you could have something that if you were trained up to know what you're
looking at, you can find it quite easily. But I don't think anybody wants to go through that
process on a one-off to get through a wiki. They want access to it. They don't want to-
>> That seems likely, yeah. >> Yeah, yeah, yeah. It's like
you're swimming upstream at that point. >> Yeah.
>> Anyway, yeah, I'll definitely take a look at those columns, that column of the grid,
and just see if- I mean, I honestly, I think you're right. That will take care a lot of what
the expectations of people are. And then I guess the other thing is whether or not at that point,
if I was to be able to do horizontal scrolling, whether it would make sense to do a side-by-side.
Excuse me. So on one side would be the tree that I can scroll, but on the other side would be that
display of what you're over. So if you clicked on it, it would show up there. So you would see
actually the page you wanted to see or some description of it would show up beside it if
you wanted to know more. >>
So what do you mean by the page? Because hierarchies don't have- hierarchy nodes do
not have a page except for the page that has a list of pages. >> Yes.
>> But what are you thinking of for that second- >> That I'm thinking of that list of pages.
>> I see. All right. Yeah, no, I- >> And that would be sort of like
your dropdown at that point. >> Yeah. You could also use a dropdown.
>> Yeah. >> Actually. Although that's
for reasons I showed. >> Yeah.
>> Unappealing if you've got 200 pages. But you know-
>> You can only show what is it? Is it- I can't remember what- is it 300, 240 pages
on the display anyway? Like it truncates them at that point.
>> Yeah, but you wouldn't have to be bound by that necessarily. You could- well,
yeah, that's intriguing. I keep coming back to what it looks like for an iPhone user.
>> Yes. >> And then I get stuck.
>> Yeah, yeah. >> Well, for an iPhone user, because
hover's not going to work, what I might do is for a computer user, have it as a hover does work,
but also a click works. >> Yeah.
>> And then maybe a right click gives you- takes you to that page.
>> I don't know. Right click has a pretty strong meaning already, but isn't that-
>> Yeah, it's like you probably want the other way around. Right click should
give you the context, right? >> Yeah, right. Exactly.
>> And so that might show you your list of pages. >> Okay.
>> But it doesn't work for 240 pages. >> No, it doesn't.
>> I would submit. >> Yeah.
>> Certainly not on an iPhone. It doesn't work.
>> Well, I think the solution with the iPhone, as much as it's extra clicks,
it takes you to that page that'll show you the pages that are attached to it.
>> I think you're stuck with that. Yeah. >> Yeah. You've got that information anyway.
>> Yeah. >>
And honestly, I'm thinking this is more-
to be quite honest, I'm not absolutely- and this might be part of the thing I'm struggling with,
I'm not absolutely sure who's going to use this functionality. Like, when would you use it?
Because you wanted to see other pages linked to the pages you're looking at?
That's what you're really going from, I think, on this one, right?
>> Oh, I don't know. Boys, I recognize that it's important to be able to answer the question,
who's the user? On the other hand, hierarchy navigation is something we all have to do.
And so, if you can make hierarchy navigation easier, you're probably benefiting everybody.
Certainly, you're benefiting those who are exploring out of a sense of curiosity and
adventure. >> Yeah. Yeah.
>> And there's probably some value to that. It's particularly good- let's ignore the iPhone for
the moment- it's particularly good if your template lets you include it on every page
somewhere. I know that, Raul, and to some extent, you were
dubious about including the hierarchy on content pages. I still disagree. I think if you could put
this hierarchy on the bottom of every single page, irrespective of what form it took, you could
increase usage. >> No, and I came around to thinking
that approach when I thought about putting it at the bottom of the page.
>> Yeah, exactly. >> Because then it's not taking up space.
It's below the fold, basically. You don't really- it's down there if you want it.
>> Well put. Below the fold. Yes, exactly. >>
Well, that gives me something to work on for sure. And I'm looking forward to that. That'll be
neat to see how that works out. >> I'm very much looking forward to it.
From what little I remember about working with CSS and grids, I don't think it'll be too bad.
>> No, and I think the thing that was getting in my way was I was always thinking
in terms of rows instead of in terms of columns. And I know with grid, because their language,
you can literally do all your language vertically if you wish. Because it's just a different
setting. It's horizontal and vertical and bang, it lays out that way.
>> Yep, exactly. Yeah, I remember it as being extraordinarily sensible in the decisions that
they made based on very little input from you. Whatever her name is, John.
I have the name of the woman who did the videos on grid with the wonderful videos on grid.
>> Oh, Jen Simmons. >> Yeah, she was doing amazing,
bizarre things. >> She did the thing with Mondrian.
>> Yes. >> Yeah, yeah, yeah.
>> Great, good for you, but most of us can get by on much less typically. And I think that's
the case here. >> No, and-
>> All right, well, cool. I'm very much looking forward. Yeah, go ahead.
>> I was going to say her tutorials, not only she's pushing the boundaries of what it can do
to explore it, but her tutorials are absolutely so crystal clear. I'm amazed at her ability to get
complicated ideas across and show you something that motivates you.
>> Excellent explainer, just a wonderful explainer. Yeah, there's no question about it.
>> Yeah. Anyway, I think that's about it for me.
>> All right, well, I can't wait to see what you come up with. And have a good week.
>> Thank you, Kevin. >> Yeah, right. I know that feeling.
Oh, you're curious about what I can do? Gosh, what a coincidence. All right, take care, Bob.
Goodbye. >> Okay, bye-bye. Bye, Art.
>> Take care, Art. >> Bye-bye.