Buttons!

Sort:
DeepGreene

These are a major part of the user experience and will provide access to some of the most important features in each section of the app.  I'm sure this is still a work in progress, but I found the current system a bit mind-boggling, since the buttons (symbols) do not consistently represent their functionality from context to context.

As *sets* of buttons go, I'm not sure this toolbar is 'one size fits all' given the places it shows up.  Here's what I take to be the current state of things, with problematic buttons (for instance, those whose function changes from place to place) highlighted in red.  Some suggestions follow.

Online Game View:

  • + button = Next (game)
  • Action button = brings up Action menu
  • Flip button = flips the board
  • Magnifier button = Chat
  • ? button = analysis board
  • Arrow buttons = forward/backward thru move list

Play Computer:

  • + button = Next (game) - i.e. new game screen
  • Action button = brings up Action menu
  • Flip button = flips the board & switches sides
  • Magnifier button = analysis board
  • ? button = Hint
  • Arrow buttons = forward/backward thru move list

Tactics Trainer:

  • + button = Next (problem)  Sometimes the new problem I get is frozen, but I think that's the intent here.
  • Action button = brings up Action menu
  • Flip button = flips the board
  • Magnifier button = analysis board
  • ? button = Show solution
  • Arrow buttons = forward/backward thru move list

Analysis Board:

  • + button = does nothing
  • Action button = does nothing
  • Flip button = flips the board
  • Magnifier button = display FEN
  • ? button = does nothing
  • Arrow buttons = forward/backward thru move list

 

Here are my suggestions:

Online Game View:

I think this is the important one.  Move the analysis board function to the magnifier button so it's consistent with computer games.  (The magnifying glass is a good symbol for the analysis board - not so much for chatting.)

Move the 'chat' feature to the position of the current "?" button, but change the symbol to something that represents chatting, like a little speech bubble.  A speech bubble that doesn't look like a magnifying glass.  :)

Play Computer & Tactics Trainer:

This suggestion is less important, because a "?" is arguably a good symbol for getting guidance in both contexts.  However, maybe consider using a light-bulb for the computer-play hint and stick with the question mark for revealing the solution in Tactics Trainer.

Analysis Board:

Just use the Flip button and the two Arrow buttons here.  Keep it simple. 

A pop-up of the FEN is of no use at all.  (If if copied itself to my 3.0 copy/paste clipboard, we might be on to something, but even then I'm not sure how valuable it would be...)

Consider maybe adding a new, third button to the Analysis Board tool-bar:  a << button that restores to the 'current' position for folks to lazy to hit the single Back arrow multiple times.

 

Cheers!

SpreadTheJoy

Great post DeepGreene!  I agree with pretty much all of your suggestions. 

In my experience in designing and implementing software for mobile, it is very important to take the viewpoint that the user is easily confused and the design and UI should be extremely intuitive.

With that being said, I would like to compliment Erik and his team on a great start!  The application, as a whole, is wonderful.  I am truly excited about the end product.

erik

i'm sorry about the buttons!

what's funny is that what DeepGreene has propsed is exactly how i designed it... it just didn't get done that way. :D

we already have the chat icon, the lightbulb, and the SKIP icons. we'll get this fixed ;)

DeepGreene

That *is* funny.  :)  Been there.  Thanks, Erik!