Max Did It
Game Design
,Thu
Post the First Comment
Tagged , ,

Planning The User Interface Flow

Yesterday, I had posted a link to my Facebook page for an early game prototype. People could play the (very) early version of the game and I could see whether the idea is working or not.

First of all, thanks to everybody who took the time to test the game and special thanks to everybody who gave me feedback! I already have a couple of ideas to improve and expand the game.

Satellite Prototype 0.0.6

Not much to see yet… (graphics are not final)

Now, I’m moving on to the next iteration of the game. The next version should come a lot closer to the final product. If everything goes well, this next iteration actually will become the release version. We will see.

The first step I’ve done is to plan the flow of the user interface the game will be embedded in. The prototype had barely any interface, let alone menus. For the next iteration, I wanted to implement the communication between game and UI early on. Doing this late in the production can give you quite some headaches.

So I sat down with yEd and drew some lines and boxes.

Satellite UI Flow Preview

An excerpt from the UI flow diagram for my next game.

See the full diagram after the break.

User Interface Flow Diagram

So this is the complete diagram for how I imagine the user interface of my next game.

Satellite User Interface Flow

User interface flow for my next game (click for full view)

Actually, I think the UI will be fairly standard for a flash game. But still, putting down every menu screen the user will be seeing already results in this rather large diagram. This helps you to not underestimate the effort and time you have to put into the menus screens.

I still have to keep in mind that the diagram is not complete, as I can only guess how some of the details of the user interface will work in the end. Especially elements that tie in into third party services like Facebook are hard to estimate right now.

So the diagram will probably expand in the future, but it already gives me something I can work with when implementing the user interface and menu screens.

Leave A Comment

Your email address will not be published. Required fields are marked *

Connect with Facebook

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>