machinon theme Topic is solved

[landaisbenj]

[EDIT]I have a bug i think


My dashboard exemple, Without designed.:

1.png (67.55 KiB) Viewed 1420 times

After clic:

2.png (88.33 KiB) Viewed 1420 times

[EdddieN]

I need to try that, not at home right now...

Is it worth having the "click" option? It looks like the tile could have both, the big icon and the after click info, avoiding a click?

I'm playing with your concept but for all the other tabs (no dashboard) in order to get rid of the context menu. Not sure if it will make it too busy. My original goal when designing this was to make it very easy to use for someone that is not a smart home geek like us ie: my wife

The less intimidating it is the better... I hope to upload today some new screens to zeplin, i will let you know

[EdddieN]

Before upload to zeplin, what do you think about this:
(ignore it says dashboard), we put all the quick access like log, timers, etc... with icons.

Dashboard.png (100.87 KiB) Viewed 1410 times

and add the selector as a drop down menu option:

Switchers v2.png (130.52 KiB) Viewed 1410 times

The only thing: We need to be very careful as this is starting to get a bit too intimidating very quickly by the amount of options. Happy to leave them on the Switches, temperature, etc... and leave the Dashboard super simple. What do you think?

[landaisbenj]

This is exactly for what i would simplify dashboard.

I think dashboard is the first access of device. Easy and short in place for all (little block for more place).
Just icon, name and action (maybe homekit like ?).

Second, all block on other board (device meteo) can be acces without menu with icon (no need to type of, but don't forget lastseen)

But if you think we a touchpad, visual dashboard is for "she", and "we" want to access rapidly to all option.
Maybe juste one line on dashboard with: Icon, Name, Action and one more icon like (+) to access on the device in the write page with device and all icon ( notif, time, log etc...)

[landaisbenj]

Selector as drop down menu is really great. But in this way (access and simplicity) we must to find a solution who make it more accessible without clic...

[EdddieN]

Ok, Dashboard has to be minimalistic, less = more! I 100% agree with you there. I clean up the page.

For the switches and selector: I think we haven't found an ideal solution yet.... So the problem is that if we have more than 4 options... then it messes up things, correct?

How many people have more than 4 options for the selectors? any idea?

[EdddieN]

Selector as drop down menu is really great. But in this way (access and simplicity) we must to find a solution who make it more accessible without clic...

Just a thought, after seeing this image above: Switchers v2.png if we move to 4 columns, then we do not have space for a selector... basically it has to be a dropdown. Although it may not be the most elegant, I can see it very useful on mobile devices as it will trigger the native selector of the phone.

[landaisbenj]

Yes you're right, i don't know how much people use more than 4. Maybe i can ask on fr forum.

In the way of a command screen, we need a good solution to access all option with less action.

Another thing I think about this:

Capture.PNG (90.75 KiB) Viewed 1394 times

If not we can find a solution to make more line... ?

[EdddieN]

Tapping and scrolling? I think for native App is good, but for web and JS... it may be not a smooth experience.

I'll play with it a bit, see what I can make out....

[landaisbenj]

Yes I don't think about web.

Did your wife use web access to domoticz or phone or tab?

[remb0]

It's an opinion and that different for everyone. so why not trying to make it adjustable from settings (like Aurora?)
So it fits everyone?

Before upload to zeplin, what do you think about this:
(ignore it says dashboard), we put all the quick access like log, timers, etc... with icons.
Dashboard.png

and add the selector as a drop down menu option:
Switchers v2.png

The only thing: We need to be very careful as this is starting to get a bit too intimidating very quickly by the amount of options. Happy to leave them on the Switches, temperature, etc... and leave the Dashboard super simple. What do you think?

[EdddieN]

Yes I don't think about web.

Did your wife use web access to domoticz or phone or tab?

Dashboard on tablet. I think the easier it is to use the better. We can always hide all the fancy stuff in the background for who it is interested.

[EdddieN]

It's an opinion and that different for everyone. so why not trying to make it adjustable from settings (like Aurora?)
So it fits everyone?

Trying! But if I can come up with a design idea that allow for one less setting to have to chose from, even better. I'll post a few screens of ideas when I have them as right now I seem stuck into 4 selector that converts into drop-down if bigger which feels a bit clunky to me. Need to play with it in my head

Update so far options discussed:
OPTION 1: This may be a coding nightmare and I'm not even sure if this is possible.
1.- The default or favourite selector items appear inside the tile (as icons probably?)
2.- If we press and hold https://github.com/stuyam/pressure it brings the full list of options

OPTION 2: Something similar to this
https://www.w3schools.com/howto/tryit.a ... hor_scroll
@landaisbenj had other options too https://benfrain.com/a-horizontal-scrol ... indicator/

If we could combine them into something like this?
1.- Selector is no longer text but icons
2.- The scrolling effect like this?

Screen Shot 2018-07-16 at 19.35.39.png (58.47 KiB) Viewed 1360 times

OPTION 3: The simplest
Reduce the importance of last seen which probably is hardly ever used (?) and have more space for multiple icon selector

This is where my head is right now... but not 100% convinced by any - I'll keep playing with it

[DewGew]

Ok, you mean that when you click on "Settings", it won't load the new page unless you add a custompage?

How is it working now?

1.- click on settings, what happens?
2.- on the screen you posted, click on hardware, what happens?

You can test it your self now on github

[landaisbenj]

OPTION 3: The simplest
Reduce the importance of last seen which probably is hardly ever used (?) and have more space for multiple icon selector

This is where my head is right now... but not 100% convinced by any - I'll keep playing with it

Maybe suppress type and replace by lastseen. It can get place to mutliple line of group button...

You can test it your self now on github

impatient

[EdddieN]

That is looking really good!

I think I need to tweak a bit text sizes, etc... as I like that the information is clear. But with long names things get mixed up... will play with it.
See video, a few minor things to tweak:

[EdddieN]

I nearly missed this!

button.gif (147.4 KiB) Viewed 1322 times

[landaisbenj]

I nearly missed this!
button.gif

This is what i'm talk about !!!!

[landaisbenj]

That is looking really good!

I think I need to tweak a bit text sizes, etc... as I like that the information is clear. But with long names things get mixed up... will play with it.
See video, a few minor things to tweak:

Do you know if we can use flex and flex-grow ? For exempl to make a div with name and a div with status and together can align and grow automaticly..

[DewGew]

I have an issu with switches, what makes the text turns to a toggle switch?

When I use english language switch looks like this:

switch_english.jpg (4.88 KiB) Viewed 1311 times

When I use my language swedish, the switch look like this:

switch_swedish.jpg (4.93 KiB) Viewed 1311 times