2

I'm trying to create a simple GUI for an android application that will primarily be used on tablets. I have portrait and landscape screenshots of my current GUI. Note that this is literally the only screen that my application uses. I have no other information to display.

enter image description here enter image description here

As you can tell, it's nothing special. There are normally buttons in the ActionBar to interact with the application, so I'm not worried about those. I'm mostly worried about displaying [Description]:[Value] more effectively on a large screen.

If you have any relevant tips, I would love to hear them. Most of my Google searching has resulted in designing web forms, which is not my goal in this scenario.

3 Answers 3

1

If the screen is just for displaying key-value pairs, then all your effort needs to go into making those easy to read. So include the values in your mock-up; without them, you can't check how it works.

Without making any radical changes, I've adjusted your landscape mockup a little bit:

  1. I've pushed the text further to the centre; with a smaller gap between the key and the value, it makes left-right scanning easier on the eye i.e. more readable.
  2. I've added faint guide-lines to separate each key-value pair; again, the idea of this is to make each key-value pair more readable.

    mockup with improvements to help reading key-value pairs

Other changes you might want to consider:

  • Draw a table with alternate row-colouring; this is known to help guide the user's eye across tabular data.
  • Instead of putting the values on the right, indent them and put them on the next row down under the key; this is a technique often used in small-screen apps where there isn't much horizontal space, and also has the advantage of keeping each value close to the key which again helps readable.
0

If your primary target are tablets, consider having two/multi pane layouts. Don't just show one screen that contains only [Description] : [Value]. That way your pane that will contain the values will be much smaller and you won't have to worry about too much blank space.

As to how to display key/value pairs, Settings or People app are are place to start.

EDIT: You might consider using PreferenceActivity as your main activity to get an Android default display.

2
  • The problem is that this is the only screen that my application has. There's literally no other information that I need to display at the moment. That's why I'm at a loss as to how to use all of the space. Using a ListView to display key/value pairs was one of the things I looked into. I just simply wanted to know if there was a better solution. I kind of feel like using a ListView like in the following link might look funny. joesapps.blogspot.com/2011/02/… Jul 31, 2013 at 4:29
  • If this is the only screen you have, your GUI would be Effective in any case :) . Just make sure you add some healthy left/right margins to your activity when displayed in sw720dp-land.
    – SidhNor
    Jul 31, 2013 at 4:44
0

You could try a Card Layout, with cards of different size staggered. Much like what the Play Store is on a tablet. Each card could contain the property and value along with an icon.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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