wiki:GUIGuide

Version 5 (modified by RuiSeabra, 9 years ago) (diff)

--

[Rui]: THIS GUI GUIDE IS A DRAFT I'M WRITING, SHR HAS NOT SUBSCRIBED IT (BUT I HOPE IT WILL).

SHR GUI Guide

Hopefully this guide will help you design better graphical user interfaces for small screens, namely when the window manager behaves as Enlightenment (with Illume2).

No UI Clutter!

Whenever possible, try to hide buttons, toolbars, and other unimportant GUI elements.

Focus on what your application is for, and use the screen as best as you can.

As an example, here's ElmDentica?'s main screen. ElmDentica is a StatusNet client application, mainly focused on Identica, which is a distributed and federated Twitter like clone, which is Free Software (yay).

ElmDentica's main window.

The *main* action most people do with such an application is not posting, (that's the second most important action) but reading, so the screen area is dedicated to showing as much as possible of the statuses list.

An image viewing program should display images on full window, preferably autorotating the image so it fits the best possible way to the screen's dimensions.

See Touching Events for some more suggestions.

No Close Button!

Do not use a close button. It will only hurt the No UI Clutter principle. SHR has a softkey which will provide as a nice way to close windows. It's that X!

SHR's Elm SoftKey

What About a Quit Button?

That too. Unless your application has several windows, a quit button won't help a lot. If you do have one such button, make it really quit, not just close the window.

Touching Events

Use press and hold (click and hold) events for popupping up stuff. Preferably contextual stuff to *where* one presses.

Use touch events (click) for showing up hidden stuff in certain areas (like No UI Clutter).

Gesture

When possible, use gestures that make sense (eg, viewing images, swipe in a direction for previous, the other for next).

Attachments (2)

Download all attachments as: .zip