Archive for year: 2010

In my last blog I briefly explained the concept of flattening the design and gave an example with the description of the new game statistics board. The next layout decision was where to place New Game, Preferences, Word List, Help and About buttons. These buttons need to be quickly accessed when needed but are not the focus during game play.

When playing WordPop! the player’s focus will be centered on the middle third of the iPad. The player’s eyes will especially be focused on the Check button which is used to enter each word.  Two additional buttons, Undo and Rotate are near the bottom of the iPad screen. The statistic board is near the top of the iPad and has several buttons associated with it.

After trying several mockups, New Game, Preferences, Help, Word List, and About buttons were placed on the bottom. When they were placed at the top of the iPad they were fighting for attention with the statistic board. Placing them on the left or right was aesthetically unpleasing, unbalanced with other elements and worst of all, made them too noticeable. Placing them on the bottom was the right fit. However, they were now too close to the Undo and Rotate game buttons. Jim Patterson using his design and layout skills rearranged them slightly up and to the right. This harmonized the design.

As we continue to add detail and features to the game we will continue to check and double check the layout.

Look for more peeks into our development of WordPop! for iPad in coming blogs. Please share this blog and follow Smart Box Design on Twitter.

The iPad is designed without a specific orientation. Applications will mostly be viewed in portrait or landscape mode, however for games it can be put on a table and viewed from above (such as playing checkers).

One of the first steps in redesigning WordPop! for the iPad was to create some simple layouts for each orientation. At first we were not sure if we had to support both landscape and portrait, as this was not required for the iPhone. There was much debate in chat rooms but it was soon put to rest with this simple quote from The iPad Human Interface Guidelines “Although you might not have supported all orientations in your iPhone application, you must do so in your iPad application.” With that now settled we created a wire frame layout for each orientation. This gave us an idea on how much room to reserve for the WordPop! machine and how much space remained for new features.

One of the new features is displaying the high scores and other data in a fun and refreshing way. Here is a quick mock-up from Jim Patterson.

This layout works well in but is too wide for the other orientation. The solution is to change what is displayed. Thus when in the iPad is rotated 90 degrees the date column is removed as shown in this very rough mock up.

Although we do temporarily hide the date it can be brought back instantly by rotating the iPad 90 degrees in either directions. (We did discuss using a smaller font, but it felt too jarring. This solution kept the UI consistent and offered a better experience.)

I think players of iPad games will see some display information come and go when different orientations are used (FYI – Watch the demo of email on the iPad at www.apple.com.  The mail list is hidden in portrait mode which is similar to what we are doing.).

Although supporting both orientations will be a challenge  and add to the overall scope of the project it will add to the uniqueness of the iPad.

Look for more peeks into our development of WordPop! for iPad in coming blogs.