Monday, September 26, 2011

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?

20 comments:

Sherre said...

It all looks great! I'm patiently waiting for the new Solitaire Til Dawn since the old one doesn't work on our new iMac with Lion. The new changes look great!

Bettina said...

Liking the green "i" to pick up the info on a game I mightn't play very often! Looking forward to the new version.

arenken said...

The green i is a great idea! I'm just playing Solitaire Til Dawn on an old MacBook until the Lion-compatible version is ready…but I'll be very, very glad to have it on my main machine again.

If I had known I'd lose my favorite game, even temporarily, I would never had installed Lion - wish Apple had warned us!

dhamish said...

I think the display shown will will work with everybody. The "i" icon is not new and the tabs for Favorites and All will keep them in view all the time. They all blend together well.
Please keep up the great work.

Sco said...

I also like the green "i". Just seeing draft screenshots is getting me excited to have Solitaire Til Dawn running on Lion!

tillotta said...

It looks great

Mary said...

Like everybody else, it seems, I vote for the little green "i." It's a feature we see on so many apps now that I can't imagine anyone missing it.

It's very exciting to see what you're doing. Thanks for the post.

unemploymentbeard said...

The green "i" is great. A keeper. I don't wish to be a nit picker, but the tabs look more like buttons -- floating unanchored without a sheet. Wouldn't bother me (much) if they stayed that way, certainly not enough to keep me from enjoying the game. But jut wanted to point out that a different UI element might be more UI consistent within Lion.

arenken, Apple did warn folks that support for PowerPC apps was going away with Lion, and explained how you could determine what apps installed on your Mac could cease working with the upgrade. I wouldn't chastise them for that… though selfishly, I wish they had continued Rosetta support a little longer.

Rick Holzgrafe said...

Those actually are buttons: a "segmented control". I tried using actual tabs, but it turns out they won't respond to a click on an already-selected tab. It means that if you click the selected tab, nothing happens: the drawer won't slide out if it's in, or in if it's out. That wouldn't do, of course.

Anonymous said...

While you are fiddling with the UI, please keep in mind us folk who have trouble with tiny fonts. That's my one complaint about the existing version. The card sizes are adjustable, but the print at the bottom is of a size pretty much illegible to me, and it isn't adjustable.

Rick Holzgrafe said...

I've made a note about large print. Thanks for reminding me!

Gandalf said...

I too prefer the i rather than have something automatically appear; perhaps a help icon could indicate how to use the i icon.

I'd love to see an update in the STD website--last one 8.14, almost 2 months ago. I'd also love some sense of a target date--doesn't have to be precise, but are we talking days, weeks, months, years, or decades here?

I, too, miss STD. I haven't found a solitaire program with reasonable graphics and probably (it's been a few months so I'm getting fuzzy about what it had) the automatic actions in STD, so I've resorted to keeping my ipad handy for solitaire.

On a topic totally unrelated to STD, but relevant to your recent post about 25 years of Apple history: my first computer in 1983 was an Apple IIe! I left the Apple world a couple of years later because the world was standardizing on DOS even though not the best operating system (just the best marketing) and returned when Macs could run Windows, though have completed the transition and don't need Windows now.

Anonymous said...

Great work Rick, and another vote for the green 'i'. In the current version I've reassigned the Deal keyboard shortcut from Command-D to Command-Space which is much easier. Hopefully this will still be possible, or better still just use the spacebar like QuickLook. Can't wait to buy the new STD.

Unknown said...

Can hardly wait, Rick --- Solitaire til Dawn is the real fuel that keeps writers writing!!!

thanks so much for your ongoing contribution to the literary world:)

and yeah, we are all aging. Bigger print always good!!!

Kaye said...

I'm still using Snow Leopard so am still enjoying your STD! Will probably change to Lion when your program is available...I don't want to lose a single night of playing my favorites! Will we still be able to add our own photos to the card backs? I love having my grandniece looking back at me!

Jan Cobb said...

I like the idea of the 'i' but white on a blue background (standard European colouring!!). Might a hover-enabled 'tool-tip' then make it clear that the 'i' icon will lead to more than just information? I do not think the panel should appear automatically and I think the wording for panel closure should be 'Close this panel' not 'Close this window' (as it's not a window!).

Rick Holzgrafe said...

Jan: I'm a bit frustrated about green vs. blue. You'll notice that the background color of the selected item is blue: against that color, the blue circle around the "i" pretty much disappears. And the blue background comes from Apple and is standard; I'm reluctant to flout the Apple Human Interface guidelies. Anyway, it would be somewhere between difficult and impossible to change it (I forget which offhand), and given my color sense, completely impossible to make up something that looked as good but wasn't blue.

Marilyn said...

Like many others, I occasionally check to see how the Lion update is coming along. The Spider game in Solitaire till Dawn is so valuable to my sanity that I'm not going to upgrade to Lion until I can be sure I won't lose it! I just wanted to say thank you so much for all your work! Solitaire till Dawn has improved my life for the last 25 years.

Serenity said...

I like the green i too. If you still want it to pop up after a delay on the highlight (useful for accessibility and some of the mouse-target impaired among us...unless it has a keystroke too), maybe you could restrict that only to the all games tab, not the favourites one. Also, a suggestion for 'goodies' to list (or change) to the 'recent games' that have been played. More than once I've tried a game once, and liked it, but forgotten what it was... or someone else has tried a different game and recommended it but not known it's name. With 100+ games, it's easy to forget. Our memories are going along with our abilities to read small print:-)

Rick Holzgrafe said...

A "recent games" list is an excellent idea. I've made a note. Thanks!