Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I'm working on the front end for a sudoku program I wrote for fun. I'm debating which interface is most logical: an interface entirely click-based, or a standard keyboard entry method.

Click Based: The pro to this method is that you don't have to switch between the mouse and the keyboard (granted most people do have two hands...). You could click on the desired square, and click a value from a list that would appear. This would also make it easy to port this over to mobile devices.

Keyboard Based: With this method, the user could click the desired square, or use the tab key to navigate between squares. I've found that this makes entering values initially (e.g. when filling the board with starting values) easier, however makes it more tedious after that as I find myself moving my eyes from the monitor to the keyboard.

What are your opinions on this problem? Is one way better than the other?

share|improve this question
    
i play sudoku and I think keyboard based is better, because its faster. when you play sudoku on time you want to get the best time possible and clicks are slow(however i play sudoku only on mobile phone, its the best mobile game for me). –  0101 Jan 30 '11 at 20:27
    
I have just finish building my client-side Sudoku game: sudokubum.com –  vsync Jun 26 '11 at 7:16
add comment

5 Answers

up vote 8 down vote accepted

General

You basically have two operations:

  • Select cell
  • Change value of selected cell

each should be possible with keyboard or with mouse, and I should be able to select a cell with the mouse, then enter the value by keyboard.

While switching between mouse and keyboard is expensive and should not be necessary for an experienced user, it is common during learning the mechanics of an app: mouse for exploration, then trying obvious keyboard methods to speed things up.

Mouse only
Click on a cell, then click on the number.
In this particular case I would avoid a popup near / around the cell clicked, because it can cover the surrounding cells which contain the hints for which value to pick.

A separtre "values well" (i.e. to the right or bottom of the sudoku field) is bad for mouse, but ok for touch.

An interesting method would be putting the choices into the cell e.g. as a small 3x3 matrix. But even with a non.hiding popout or a "fisheye" effect for the selected cell, the targets are probably to small for fingers. That could be "saved" by making the neighboring cell the click target - which would require some visual cues, but might mix the "cell-centered popup" with "don't hide".

alt text

[edit] Note: I do not recommend to implement both wells, I just put both option into one picture. [/edit]

Keyboard
Select cell with arrow keys (or the "4-way-controller"), enter digit (if available), or press enter/space to access the "values well" and 4-way-controller to select value.

Mixed Mode A typical method might be selecting the cell by mouse (click on it), then enter the valeu by keyboard (type the number). Works perfectly for mouse-lefties with the numeric block - but be aware that there are tow orientations of the numeric block are common.

share|improve this answer
    
+1 for awesome diagram, oh, and a good answer. –  Jeremy Heiler Jan 17 '11 at 21:34
    
Wow. Amazing answer!! I really like the idea of putting the matrix INSIDE of the cell. Brilliant. I will have to deal with the size issue, but I'll figure something out. Thanks so much! –  williamg Jan 22 '11 at 20:42
    
P.S.: great diagram! –  williamg Jan 22 '11 at 20:42
add comment

How about giving both options? I think some users prefer using the keyboard and some don't, and as you said, even the same user may prefer the keyboard some times, and the mouse another times (for example, when using a trackpad instead of a mouse, I would choose the keyboard option, but if I had a physical mouse, I'd choose the mouse option).

If you allow them to enter the numbers using the keyboard and also allow them to select a number with the mouse (maybe a virtual numpad could appear after you click the cell?), you'll cover a larger number of users, and I think the extra effort of giving both options is worth it.

share|improve this answer
1  
This isn't a bad idea. I could allow them to have it mouse based, and provide the list of numbers, but allow them to select the numbers with the keyboard. I like this idea... –  williamg Jan 12 '11 at 22:40
    
This is a bad idea. Make a decision. Test it. Change it if it does not work. –  Vincent Robert Jan 13 '11 at 10:09
1  
@Vincent Robert: Keyboard vs. Mouse is a user choice, not a decision the developer makes. –  peterchen Jan 22 '11 at 21:25
    
Why not prefill the field with a number on click and allow them to change the number with the scroll wheel? –  Virtuosi Media Jan 27 '11 at 4:58
add comment

If you have to choose, mouse-based. But instead of a list, offer a 3x3 matrix to choose the number.

share|improve this answer
    
Interesting point about the 3x3 matrix. Why do you suggest that? –  Patrick McElhaney Jan 12 '11 at 14:31
    
Because it's a good fit for the overall look&feel of a sudoku, and it reduces mouse movements and (vertical) space requirements. –  ammoQ Jan 12 '11 at 14:49
    
I'll consider this, as it would reduce mouse movement. However, it would INCREASE vertical space requirements, as opposed to providing a horizontal list of the numbers. Thanks for the input! –  williamg Jan 12 '11 at 22:39
    
How would it increase vertical space? I think you should use overlays, so the matrix just appears on top of the rest. Then there isn't much need to use more space. –  Inca Jan 13 '11 at 11:09
    
Oh ok, I wasn't thinking about an overlay. Thanks for the idea! –  williamg Jan 13 '11 at 22:00
add comment

Typing the numbers will require a lot of moving from mouse to keyboard and vise versa, or loads of tab clicks.

Selecting from combos can be frustrating.

I'd go with a different approach - either mouse only, or keyboard only.

  1. Mouse only: Offer a 1..9 range of numbers at the sides, which can be dragged over squares. Also, for beginners, you can reduce the drag and drop options, to fit the legal possibilities for each target cell.

  2. Keyboard only: Use qweasdzxc as arrows for navigation and the number pad for inputs (even if numlock is off). That way, only the keyboard is required.

share|improve this answer
add comment

I think the best way is using the keyboard, but if you use the keyboard: does it makes sense to build a 3x3 panel (and eraser)? The answer is: "Simulate"

In your place, I would strive to make an application to these two implementations:

  1. If you use the keyboard: Simulate keystrokes in the 3x3 panel.
  2. If you use the mouse: Use the 3x3 panel.

In this way you would have both, and customer's comfort.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.