A Little UI Work

I see it's been over a month since my last post, so I thought I'd put something out to show that I haven't been idle. I've been doing user interface (UI) programming, and I have something new to show.

Solitaire Till Dawn offers 100 different kinds of solitaire. That makes a bit of a problem: how to present 100 different games to users in a way that makes it easy to find the games they know, yet also easy to find new games they might like. In the pre-Lion version, your "Favorites" are listed in a popup menu in the toolbar, and you only have to select one to start a game. To see all 100 games, you would select "Choose from All Games..." from the same menu, and that would open the Game Chooser window, which was a rather complicated affair.

The left edge of the window

I've learned that a lot of users didn't realize that "Choose from All Games..." was an option rather than just a label, and I'd get emails asking me where all the other games were hiding. So in this new version, I'm trying to make that more obvious. Here's a screen shot showing part of the left edge of the game window.

There on the edge, you can see three tabs labeled "My Favorites", "All Games", and "Goodies". These tabs are always visible, but usually take up just that small amount of space on the side. It should be obvious (I hope!) that you can click them to get something interesting to happen.

If you click any of the buttons, a "drawer" will slide out from the left edge. The next image shows what you might see after clicking the "My Favorites" button.

The drawer is open

You can see a list of 16 games, which are the ones selected as your favorites out of the full list of 100 games. This is what you'd use to select a game you already know you like.

You can select a game by clicking with the mouse, or by typing the first few letters of its name. If you double-click your selection, or press Enter or Return, a game of your selected kind will start immediately.

The All Games list, with a game selected

Now here's what you get if you click the "All Games" tab: the full list of games, scrollable of course. You can select games and start playing in exactly the same way as in the "Favorites" list.

In this image, you can see that "Baker's Game" has been selected, and this reveals another new feature: the small green i-in-a-circle that appears by the selected game. In the image below, you can see the Game Info panel that appears when you click the green i.

The Game Info panel

The Game Info panel shows full information about the selected game, everything but the actual rules; and you can see the rules by clicking the "Show Rules" button near the top-center.

If you change your selected game, the Game Info window will move to match your selection, and show you info about the newly-selected game.

Finally, you can dismiss the Game Info window by clicking the small x in the upper-left corner (I'll probably change that to actually say "Close this window"). The whole business including the drawer will disappear back into the left edge if you click the highlighted tab, or click anywhere outside the panel and the drawer.

This isn't final

I'm sure there'll be changes before this ships. For one, there's nothing in the "Goodies" tab yet, and I'm not sure what might go there; it might vanish altogether.

Here's a change I'm thinking about right now: I may get rid of the little green i and instead just have the Game Info panel appear whenever you select a game. That's because I'm worried that some people won't realize the green i can be clicked, and they will miss ever seeing the Game Info window. On the other hand, if you know what game you want, you won't need to see that panel, and it would be annoying to have it flash into existence and then instantly disappearing as your new game starts. Perhaps it should appear only after a brief delay?

I'm not sure yet. What do you think?