Maemo UI improvements blog.

January 20, 2008

Chapter II: the Tray Strikes Back.

Filed under: Light UI modifications — Tags: , , , , , — Andrew Zhilin @ 20:19

Hello.
As I’ve said before, tray is a best way for gathering required info about the device and software status like battery charge, wi-fi connection and instant messaging status. But right now in Maemo it holds not so much info, that it could and even this info is mixed with “thrash” like application title. In the first chapter of this blog we’ve done some work on the applet amount aspect of tray, cleared it from thrash information and finished with brand new wide redesigned tray. Now let’s work on quality aspect.

First of all, let’s take a look at our previous result:

example1

All applets are signed. Clock is just a demonstration of my suggestion about “2 din” applets, that have double-width. It’s non-existent applet for now (pitty). Pidgin applet is not built-in Maemo, so we’ll not analyze it.

Bluetooth.

Bluetooth applet is a holy grail of Maemo, which Maemo team can’t reach till today. Karel Jansens described the problem very clear, so I’ll quote the comment:

“A bit of history: Back in the days of yore, when Nokia first came out with the now-forgotten Internet Tablet 770, there was no Bluetooth icon; Nokia didn’t think users should have access to BT functionality, other than by pairing their phone to the tablet, which had to be done from the Control Panel.

But some hackers thought differently, and they wrote a Bluetooth applet, complete with icon for the tray. This icon had the interesting property that it was persistent: If Bluetooth was “on”, it was — well, blue. Obviously. But if the user disabled Bluetooth, the icon would not go away, but rather turn grey, thus making Bluetooth on/off a one-click operation from the tray.

Enter the geniuses at Nokia. When they discovered that everybody loved this extended Bluetooth functionality, they naturally (I’d like to think they thanked the hackers who made the original version, but I’m sceptic) incorporated it in subsequent releases of the operating system, but — and this is rapidly becoming exemplary of Nokia — they completely ignored the user-friendliness of the blue-grey icon and decided that, if the user turned Bluetooth off (which one tends to do, you know, to conserve some gogo juice), the BT icon would disappear from the tray, requiring the user to open Control Panel, go to the Connectivity section and turn Bluetooth back on, a needlessly tedious and time consuming operation.

There have been bug reports, angry posts, even incantations to Satan ever since that stupidity first surfaced and yet, even in ITOS2008 it hasn’t been fixed.”

So, what we have right now is the “bluetooth on only visible” icon that have only two states and everybody hates it.

What can we improve here. First of all, lets hear community prays and make it visible even when BT is off. Then, let’s add a bit information to this applet. Right now it’s a bit dumb with two states “Eeeeh, I’m on” and “I’m working”. But when you’re sending or recieving a file or a card – you can’t trace this process. Just have to wait. So, let’s make two states instead of one – “transfering” and “recieving”. It will add clearance to the most of usage cases. That’s pretty good!
The last suggestion is probably a feature request so don’t think about it to complicated =) A special icon for A2DP profile. Actually, you can make icons for every type of devices like handsfree, keyboard, pda or phone.
So, as a result we have quite handy BT icon that completely describes all of BT states and quite user friendly.

example3

Brightness.

To my mind nothing wrong with this applet. It’s pretty handy. But, to my mind the brightness settings in OS 2007 were more comfortable and scaling than 5 positions in OS 2008.

Volume.

example4

Well, as brigtness applet, volume control does it’s work quite easily. I can only sugest some design improvements to remove that crappy red stripe and not so modern looking “wave cone” (thing to the right of the speaker)

example5

I think new icon set fits Maemo UI concepts perfectly without red stripes.

Connection status.

So, what we have now in connection status applet, that is one of the main for the tablets. 4 states, ugly red stripe and not so much info about the connection status.

example6

First of all let’s remove this stripe and make “flight mode” icon the same style as others, when they are in “totally off” mode. But. It looks like “enabled but disconnected” icon in original set. So, lets make some difference for that mode. To my mind the best way to symbolize “disconnected” or “no signal” is just simple white dot with half-transparent “waves”. Easy to understand, easy to quick read. Now it would be great to make icon reflect Wi-Fi signal strength. It’s already designed for it, but somehow it’s still static. So we have 3 states of signal: “weak” (one wave), “normal” (two weaves) and “good (guess it :) ). The last one icon in this set is a bluetooth internet connection through cellphone or other compatible device. Original set have a good and easy readable icon, but it doesn’t fit in whole set design and concept anyway. So, to easy describe bluetooth connection we need just… blue color. Yep, same as bluetooth icon. So, now we’re done and can view our result.

example7

Battery.

Well this icon is totally ok to my mind. I think you need it for simple click on it and view full battery status in drop down menu. So I think it’s schematic gradation into four states is better than good in our case.

USB.

I don’t know what to comment here, simple USB connection indicator :) it does nothing but indicating :)

There can be much more ideas about tray applets optimization so, you’re welcome to discuss all of implementations in comments.

Thanks for reading!

Advertisements

17 Comments »

  1. My 2 cents:
    1. I think that it should be easy to distinguish between wireless interface that is turned on (and connected or not) and fully off. That’s why I think that when the interface is turned off, the icon should be red (yes, I also think that red line is not nice). Difference between disconnected WLAN and flight mode is just hard to notice.
    2. I also think, that some icons should be kept together: BT, WLAN and USB should be always next to each other.
    I really support the idea with the clock on the tray. It should be there from the very beginning.

    Comment by Jakub Danecki — January 20, 2008 @ 22:30

  2. An improvement for the USB would be a configuration tool (accessible from the statusbar icon) to toggle between USB storage and USB ethernet operational modes.
    Currently when you insert a USB cable the device is used as a storage device; if you want to make the device establish an internet connection over the cable you need to write some scripts to unload the usb storage kernel module and insert the usb ethernet one. An UI to do this would be handy!

    Comment by Mardy — January 21, 2008 @ 08:05

  3. 2 Jakub: Well, I agree that the diffeerence between flight and disconnected state is not so radical. But I don’t like red color in the interface very much. Red is a color of attention, alert. Some error maybe. To my mind red will disorient end-user in some way. It will look like a connection error. So we need some work on it =) See?) It’s not so easy to make proper icon set =)
    Clock can be shown by osso-statusbar applet. But it’s still pretty small :( I’m sure that 2 din applets will solve this problem!
    2 Mardy: Right now we’re talking about improvements of “out of the box” system, without any additional scripts or pre-installed software. So your suggestion is probably a feature request more than the improvement :) But it’s still handy, didn’t know that n8** can handle USB modems)

    Comment by tabletui — January 21, 2008 @ 08:37

  4. I have to comment on the red strip. Even if it might not please the aesthetic eye – the meaning is clear. It can not be misunderstood like the gray icon could be. If user who never has used the device would be asked to check if the wireless is in fligh mode, they wouldn’t know if it would be gray – with a stripe there is no discrepancies. Red tripe is the universal “NO” as you know just by looking the traffic signs anywhere in the world.

    If the tray area does not get bigger I would like to see how it would be if the brightness and volume would be combined (maybe two smaller icons together). Both icons have so little to do and usually I tune both in row when I take my tablet out of my pocket. That would minimize the extra clicks too :)

    Networking over bluetooth = small bluetooth icon over the net icon. Colouring it blue makes it indistinct. I don’t think there is really any reason to see if the bluetooth is transferring or not, it is just extra blingbling same way as it would be by showing if the network is transferring or not. Somebody else can create the xmas-tree-light applet but the default set should be simple and clear.

    Comment by Ville — January 21, 2008 @ 09:20

  5. Hi, just commenting on the behalf of the Maemo UI team: it’s great to see a blog like this from the community. Like I commented in Internettablettalk, this is probably a better forum and format to discuss issues like this – with pictures etc. – than inside the ITT forums. It will be probably quite hard for us to publicly comment on actual design proposals, but rest assured that we are at least reading also this one. :)

    Comment by Roope Rainisto — January 21, 2008 @ 11:09

  6. Identifing that the device is flight safe: (in my poor ui oriented mind) could you overlay the disabled icon with a plane or make the whole icon red, indicating that it is not available (I do realise that in this case the user may see this as there being a problem with the system).
    I’d definatly vote that the flight safe state is something other than the full greyed out, as flight safe should be a rare event and disconnected a more frequent one.

    I’d also like to see the bluetooth & wireless wrapped up in one connect icon with the bluetooth and/or wireless overlayed (I realise that this might look messy/difficult but in my mind bluetooth/wireless are just different forms of connectivity), when the bluetooth is transfering data either way you could blink it, and selecting the icon should give you some instant status as well as the options to change the state.

    Comment by Ant — January 21, 2008 @ 12:49

  7. A question/remark that has more to do with the general setup of this blog:

    I can find no way to enter posts/propositions that have nothing to do with the current subject lines. Say I wanted to vent my frustrations over the general layout of the homescreen (and what a lot of frustrations I have about that!), I’d be forced to break into an existing thread that has nothing to do with that particular subject. Is there some way around that?

    On another note, you might want to consider either a member list or a spam deterrent; it won’t be long before the vultures discover this latest victim.

    Comment by Karel Jansens — January 21, 2008 @ 21:08

  8. It’s extremely cool that you guys from Maemo UI team are not careless to the Community! Thats just awesome and it’s a main key to create and improve really great things. Keep on great job!

    Well, you’re definitely right about spam, Karel. First time i thought that it would be easy for users to just simply add their thoughts without any registration. But I’ve totally forgot about spambots. And unregistered users cannot add their Articles. So please, everyone engaged — pass through simple wordpress registration process to gain the ability to comment and post articles. I haven’t found any easier way :( Don’t be afraid (or lazy =) to fill a few forms – without your opinions this blog is totally useless.

    Comment by tabletui — January 21, 2008 @ 21:36

  9. OK, I registered as a user, but I must be stoopit or something, because I still can’t see a way to propose new subjects/articles/raving rants.

    Comment by kareljansens — January 21, 2008 @ 22:42

  10. Ok now, you’re clear to launch Karel :)
    “add post” should be in the top menu.

    Comment by tabletui — January 21, 2008 @ 22:56

  11. Great, thanks! Expect some more “grumpy old comments” after the break.

    Me go sleepy now.

    Comment by kareljansens — January 21, 2008 @ 23:13

  12. To be honest, I have not found it objectionable for the red slash to indicate that some device is disabled. I think I prefer a strong symbol like that to confirm that I have disable the connection. This is not just for airplane use, but also when you want to conserve battery and don’t want your wifi connection to drain it.

    I do like the multi-level wifi signal icons, though. This would be much more useful than having to click on the icon to see the strength of the signal. I wonder whether refreshing this icon too frequently would drain that battery, though. If so, I am happy with it the way it is.

    FYI– I am “slip” from ITT. I might have some suggestions to post here; is there anything I need to do to get the ability to add posts? Thanks.

    Comment by n800slip — January 22, 2008 @ 04:29

  13. You’re clear to post, Slip =) The WordPress limitation is that I have to manually add users to the «Authors» category, so if you want to contribute some info, please, write it in comments and I’ll add you as soon as I can. And I can almost 24/7 =))

    Comment by Andrew Zhilin — January 22, 2008 @ 06:48

  14. Nice blog; defeintely needed in terms of some place to chat about UI/UX on the tablet. Thanks for creating this (ARJWright from ITT, AWright from Brighthand).

    Comment by arjwdotcom — January 22, 2008 @ 15:02

  15. The icons I like, but like others I don’t think that they are distinctive enough in all of their states. Part of that has more to do with the grey-out than anything else. That grey blends into the blue theme a bit much. The red line with the grey makes the statement clear as well as keeps it distinct.

    In terms of applets, I’d make an argument that the clock one should have a binary, digital, and analog view that fits in that 2din space. There should probably be a system section, and then a section where 3rd parties could add their own applets.

    Given the size of the applets: wouldn’t it be a good idea to resize the entirity of the OS elements on the ‘din’ methodology. Make the side bar 1-2din, and the minimize/close buttons 1din. Besides being more consistent to the UI, it will also give a little wiggle room towards finger and stylus play without having to make two UI’s for both of those.

    Comment by arjwdotcom — January 22, 2008 @ 15:48

  16. Yep, the icons should have some art-work on them. I’ve just showed my vision of icon behaving, they are not end-variant :)
    About sections: I think it would be better to leave a user an option to setup applets order in… order that he likes :) For example I like Pidgin applet to be on the far right cause I can click in with my big thumb easily without any discomfort to open Pidgin window :)

    Comment by Andrew Zhilin — January 23, 2008 @ 10:57

  17. Looking back at the wireless (WiFi) and Bluetooth applets here, those would really be nice as an updated applet. They make a lot of sense from both a use and need-to-know standpoint.

    Comment by arjwdotcom — August 31, 2008 @ 04:22


RSS feed for comments on this post. TrackBack URI

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s

Create a free website or blog at WordPress.com.

%d bloggers like this: