iPhone RPG UI

As per an earlier post, I mentioned that I planned to continue my design work on a cross-platform game targeting both iPhone, Mac, Windows and possibly other platforms. Since I didn’t really feel like doing any programming today, I started some mockups for potential GUIs that would fit the points I mentioned in the other post. These are just rough ideas, and there are already things I think I’d like to change, but they do have the desired feel that I’d like to achieve. They’re designed for an iPhone 4+, as the resolution is intended for the Retina Display at 640×960. The nice thing is that I feel the design will scale well onto laptops and desktops as well.

This is the default interface that would be displayed if nothing was going on in the game world:

A more active UI. The top text appears when an area is entered, the icons about the dragon indicate that information has not been gathered on it’s animal type yet, and the context menu indicates the user has touched/clicked a specific tree:

The white arrows on the side will eventually open up additional menus, such as a character sheet and chat. I haven’t work this bit out yet though.

Finally, the map is opened by touch/clicking the heading indicator at the top of the screen:

All other menus will probably have the same visual style as this one.

I tried the images out on the actual device and I was very happy with how they appear. They look extremely good on the Retina Display. The only change I would make at the moment for the non-mobile versions would be the removal of the arrows in favor of shortcut keys.

That’s all for now though!



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: