I am making a menu for an indie game and I’m not quite satisfied with my results. The menu itself needs two text fields (one to enter your username and the other for your password) and two buttons. (“log in” and “register”) I also need to have a button which brings up the credits and a button that brings up the settings screen.
Currently, the title is centered at the top of the screen. Below the title is a box which contains the username and password fields. Below that box are the “log in” and “register” buttons. Here lies the problem, I can’t figure out where to put the other buttons. (Credits and settings) Should I just put them in the upper right-hand corner? Or should I make them more prominent? Or should I just completely re-arrange the current layout?
Just as a side note, the current (interim) theme is a bit off. It’s in a web 2.0 style, but the MMO is supposed to be adventurous so I wanted the background to remind someone of an old map. Incorporating this theme idea in your answer will greatly help.
I would create a different hierarchy – one for the login and one for registration. You could probably do something like:
Need a login? Register:(goes to new page)
Once a user has logged in you can give them a launch page like:
Welcome, Your name here.
Button for settings — Button for Credits
That way, you’re only presenting them with one choice at a time – Do I have a login (in which case I should probably log in) or do I have to register (in which case I’ll automatically be taken to a place where the only information for me to enter is the desired login and password).
If you try to present too much information at the same time you’ll invariably end up with frustrated users (“Every time I go to log in I accidentally put my login info in the wrong box” or “it’s too complicated to register – I’ll just go play Bejeweled”).
You should design your interface as if it were going to be used by a deaf, vision-impaired grandmother with no inherent knowledge of WIMP conventions. That kind of interface can still be used by computer-savvy users, but over complicated interfaces will turn less experienced users away.
A good example of this is the Amazon page – they’ll throw hundreds of choices at you but when it comes time to supply your login and password they switch to a very simple “put your name here, put your password here, click here if you can’t find the post-it note you wrote your password on” page.
Also, sorry this wasn’t more graphics-intensive; I have a big project going in Photoshop / Illustrator right now and didn’t want to create yet another window. 😛