How married are we to the minimal tables interface?

[ericeslinger]

There's a lot to be said for nostalgia, and I totally understand if my goal here is to reproduce the stripped-down interface from the original site. That said, the original site was written a Long Time Ago.

At the very least, I'm going to move the front-end underlying layout off of tables and into a grid system, either flexbox-based or just classical bootstrap / bourbon / foundation. Tables are pretty evil most of the time. I'm also planning on making use of ngAria to add some accessibility code to the frontend.

We can make a lot of other important UI improvements at the same time, if we want. For example, the page could be done in a responsive format which does stuff like ditch the button art when the window is too narrow.

We could also build a shiny-fancy interface on top of some other frameworks. I'm not saying we need to have some kind of 3d rendered dice models for the dice, but I feel like we could do a lot here. Check out the newly-updated introduction to Google's UI material design spec, for example. The material design webcomponents are MIT licensed, so we could use them as a starting point for UI work.

On the other hand, nostalgia is a powerful mover.

[irilyth]

I'm not sure exactly what you're asking here. Can you maybe outline a couple of more specific alternatives, and solicit opinions about which alternatives folks prefer? (Or invite other alternatives?)

[ericeslinger]

There's two tiers of changes I'm thinking about. The simpler tier would be to take the existing UI and convert it from the table-based layout to one that is built on a responsive div framework. For example, if you are in the game.html page now on a narrow screen, the layout just goes off the page and you have to scroll around.

If I modified the underlying layout structure to either user flexbox layouts (which are very new and I don't know a ton about them yet but I relish learning new stuff) or a tried-and-true css grid framework like bootstrap or neat, it wouldn't be that difficult to handle small screens responsively. In this example, the buttons on the game UI could only render when the screen is wide enough to show them, and the active dice could lay out in (for example) a 2x2 grid instead of four in a row.

I think that's all I'd like to propose at this time. Even this change feels like a longer-term area of work; it would be a lot easier to make this transition smoothly if the front-end were angularized, so it'd have to wait either way.

[ericeslinger]

The truly long-term work would be to do a significant re-design of how information is conveyed by color and shape.

There are some interface notions that make sense to veteran players because Things Have Always Been That Way, but are probably worth looking at if we want to recruit and retain new players. As an off-the-top-of-my-head issue: the "dice" in the game are represented as white circles with a numeral in them. That's not at all what dice look like, and a user has to coordinate a lot of information to really understand what's going on there- this is a shadow poison ten sided die showing four. The ps10 above the die makes sense to the veteran, but even veterans can use more contextual cues to the die layout.

This kind of stuff would start with mockups and soliciting feedback before any real coding got done.

[ericeslinger]

But the bigger issue is, even after all the other bugs and features are covered, is any kind of interface change really wanted? There's something retro about the current layout that I really like. It's minimal and effective. So I'm not sure.

[irilyth]

Ok, that all makes sense. I agree thait this would be fun to talk about more as a long-term thing, and that there are some interesting tradeoffs between things that appeal to people who are new to the game, experienced players are new to the site, and players who are familiar both with the site and the game.

[ericeslinger]

I think working on the angular stuff made me think about all this as I was converting the jQuery-generated html elements into regular html templates, but that quickly grew in scope to Biting Off More Than I Can Chew, and definitely not a priority at all, relative to the other work.

[ManvilleFog]

I'd like to see the changes you have in mind. My only concern, not being familiar with angular js, is that no one who can currently play the game loses the ability to do so with the new UI. They shouldn't have to make any changes to the systems they currently use in order to continue playing Button Men.