Author Topic: UI3 icons proposal  (Read 23609 times)

guest4733

  • Guest
UI3 icons proposal
« on: February 12, 2010, 05:55:07 pm »
Even if I intended not to be involved in the UI3 graphics, I saw a lot of complaints related to the font size and readability and I want to see your opinion on some minor changes to the icon concept. As it is right now for,some devices you have to click to open the popup in order to know the name. Starting from here I attached few versions of a new icon concept which can include at the same time the name and the state.

As you see I kept the original shape, adding just a background for name. In the same time we have 2 ways of displaying the state. One in the same balloon and, the second, using the same kind of background like for the name.

Please feel free to share your opinion and if, at the final, we have a good result, we can pass it to the UI3 team.

guest4733

  • Guest
Re: UI3 icons proposal
« Reply #1 on: February 12, 2010, 05:55:40 pm »
the next one...

guest4733

  • Guest
Re: UI3 icons proposal
« Reply #2 on: February 12, 2010, 05:55:58 pm »
next

guest4733

  • Guest
Re: UI3 icons proposal
« Reply #3 on: February 12, 2010, 05:56:24 pm »
last one

guest4733

  • Guest
Re: UI3 icons proposal
« Reply #4 on: February 12, 2010, 05:57:18 pm »
the full icon states

Offline wseverino

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 854
  • Karma: +0/-0
  • Da Man, Da Myth, Da Legend - in his own mind!
Re: UI3 icons proposal
« Reply #5 on: February 12, 2010, 06:46:04 pm »
I like #3
My ZWave Network: Too friggin big to list.....

Offline myhomeserver

  • Hero Member
  • *****
  • Posts: 873
  • Karma: +3/-5
  • http://www.MyZwave.net
Re: UI3 icons proposal
« Reply #6 on: February 12, 2010, 07:12:10 pm »
Yes, any "sensor" device should have some sort of display in the icon or hover over option to see the sensor "status"
In many cases, this is temp, light, motion.   If a device can send any "info" other than ON/OFF this should be displayed in the icon.   

thanks, I think you guys are headed in a better direction gathering data for the next UI!
MyZWave.net - See Our Z-Wave product Reviews
(formerly MyHomeServer)

Offline shady

  • Hero Member
  • *****
  • Posts: 1324
  • Karma: +11/-0
  • This monkey knows his Window Coverings!
Re: UI3 icons proposal
« Reply #7 on: February 12, 2010, 07:26:40 pm »
I like the information listed in #3, but any icon information is useless when it is the size of a pencil eraser.  Is there any way to mouse over an icon to zoom the icon (now we're back to scalable graphics, after switching them to bmp, lol) or right-click for more information or even pop-up simple controls like ControlThink has.
Vera3 1.5.346, Schlage (3)DB (2)Lever, Kwikset (1)Lever, RCS TZ43 Thermo, (2) Vizia RZI06-1LX 600W Dimmers, (17) Monster (Leviton) Dimmers (6) Monster (Leviton) IWC Scene Controllers (1) Etherrain-8, (3) HSM 100's (1)GE 3-Way set

Offline Bazzo1

  • Sr. Newbie
  • *
  • Posts: 23
  • Karma: +0/-0
Re: UI3 icons proposal
« Reply #8 on: February 12, 2010, 07:50:18 pm »
#3 but larger

Offline mikeholczer

  • Sr. Member
  • ****
  • Posts: 413
  • Karma: +0/-0
Re: UI3 icons proposal
« Reply #9 on: February 13, 2010, 12:40:06 am »
#3

Offline guessed

  • Master Member
  • *******
  • Posts: 5300
  • Karma: +92/-22
  • Release compat is not a bolted-on afterthought
Re: UI3 icons proposal
« Reply #10 on: February 13, 2010, 01:17:04 am »
#3, but with the following mods:

a) The icon should never be "decapitated".
Your #3 example works because you have an inherant "ring" that's present in all it's states.  This adds consistency to it's presentation.  I'd like to see the example for #3 when it's a lightbulb (etc).

I'm assuming this is like post #6, decapitated...

b) The main clicking surface should "do the default action", not the Edit action
ie. Turn the light on/off, turn the thermostat on/off, arm/disarm an alarm, open/close a contact sensor

The green "power" component of the control (lower left) should do the editing action.  In a Mac, this is the "(i)" that appears on Dashboard controls, and it only appears when the user "hovers" over a particular control, and only when Dashboard is in Edit mode.... this avoids clutter on a few levels.

For complex controls, the Default action might well be the Dialog, but for most it needn't be.

c) Make the Edit options only appear when the Toolbar/ToolTray is open.
Imagine this UI bonded to a wall.  Blending Edit mode and Runtime mode without some sort of inherent mode-switch is a bad idea.

My friends will all be accidentally editing the UI.

Opening/closing the ToolTray (which you can't do right now) provides a reasonably clean way to do that.  This also requires you to normalize down the 4 Tooltrays to 1.  We don't need all 4, and they should be sized to completely avoid scrolling.  I have a 30" monitor, and they still require scrolling.

d) Make the icon change to represent the current state, but simpler
We can handle the Light bulb going on, off and various Dim states.  Does it need to have a green arc around the outside?  I would use/prefer a simple gradation of black (off) -> bright-Yellow (on) to represent the Dim state.

Similarly, apart from simple on-off actions, you could make it so I can "click-hold" the mouse on it, and "move it up and down" to dim-bright the light without having to go into Edit mode.

This would require the addition of the Edit-mode, since that action currently moves the control around the screen, but would translate well to touch-panel interfaces, as well as those with mice.

ie. You touch-hold the Light-bulb and it temporily shows a slider which you can use to adjust lighting levels.



My Vera is broken right now, so some behaviors might be like this already.  Unfortunately I have anorexic-man bouncing around my screen (probably because it's standing on a 555 timer)

Offline denix

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 1088
  • Karma: +1/-0
Re: UI3 icons proposal
« Reply #11 on: February 13, 2010, 01:22:19 am »
What's the difference between #2 and #3, besides presenting a different device type?
Veras (1, 2, 3, Lite, Plus), lots of different Z-Wave modules, Luup plugins and theater/security integration.

Offline guessed

  • Master Member
  • *******
  • Posts: 5300
  • Karma: +92/-22
  • Release compat is not a bolted-on afterthought
Re: UI3 icons proposal
« Reply #12 on: February 13, 2010, 01:29:51 am »
Quote
What's the difference between #2 and #3, besides presenting a different device type?

The gold ring that's present in all states...  I'm assuming that, and that's why I picked #3 since it wasn't totally decapitated in the middle state.

I should change my vote a little.  Just leave the "top" on in all cases, and change it's color and/or text as status needs to be presented. 

The "hovering" notion doesn't work well on Touchpad type devices...

guest4733

  • Guest
Re: UI3 icons proposal
« Reply #13 on: February 13, 2010, 02:25:33 am »
#3 but larger
A limit for the "zoom out" would be great in order to have the text readable. In this case the icons will remain big enough on the screen. The button "view all" will present all the rooms, even if the text will not be readable in all the cases, but clicking on a room or device the UI will not open the popup for the device, but will "zoom in" to the lower limit of the zoom, centered on the clicked position, all the texts being now readable.

Regarding the icons, they can keep their "heads" all the time, the color of the head showing the state.

In the same time changing the color of the text in device name could be a good idea.

 
#3, but with the following mods:

a) The icon should never be "decapitated".
Your #3 example works because you have an inherant "ring" that's present in all it's states.  This adds consistency to it's presentation.  I'd like to see the example for #3 when it's a lightbulb (etc).

We will come back with icon proposals for more devices showing all the states.

Offline shady

  • Hero Member
  • *****
  • Posts: 1324
  • Karma: +11/-0
  • This monkey knows his Window Coverings!
Re: UI3 icons proposal
« Reply #14 on: February 13, 2010, 03:09:45 am »
A limit for the "zoom out" would be great in order to have the text readable. In this case the icons will remain big enough on the screen. The button "view all" will present all the rooms, even if the text will not be readable in all the cases, but clicking on a room or device the UI will not open the popup for the device, but will "zoom in" to the lower limit of the zoom, centered on the clicked position, all the texts being now readable.

Sounds great Alex, I mentioned in the link below about clicking in a room and zooming to the extent of that room, then clicking again to return to zoomed out - whole house view, but zooming to the mouse click might be better.  I'd also like mouse scroll wheel zoom.  Thanks.

http://forum.micasaverde.com/index.php?topic=3165.msg13813#msg13813
Vera3 1.5.346, Schlage (3)DB (2)Lever, Kwikset (1)Lever, RCS TZ43 Thermo, (2) Vizia RZI06-1LX 600W Dimmers, (17) Monster (Leviton) Dimmers (6) Monster (Leviton) IWC Scene Controllers (1) Etherrain-8, (3) HSM 100's (1)GE 3-Way set