Implementing sync only on Wi-Fi option on mobile (Issue #720)

I really like the last one!
But let's wait for others to chip in.

1 Like

The ones with ! look like an error or warning to me. Like something is wrong, but I don't think that turning off WiFi constitutes an error.

But maybe I just need time to get used to it.

I agree, it looks a bit ambiguous.

One more possibility I came up with:

1 Like

How about the 3rd one image without the attention sign.

This can be used without the strike through slash. Although I like the "no wireless" sign (your most recent idea) too. I'm not a designer, so I'll let others with more experience voice their opinions.

Then I think we can go with this one

One concern I had was whether for locales with a longer word for "Synchronise" the text would overlap the icon. Turns out the longest is Russian "Синхронизировать" and it still fits:

1 Like

Looking at these options, I wonder if we shouldn't just go for your initial idea. Just some short text like "Mobile data - auto-sync disabled" below the button should be enough info for the user to remember they've enabled that option. Hopefully it should be possible to translate this in most languages without having the text to wrap.

Yes, i absolutely agree @laurent. So, even i'll suggest a minimilastic design change for better user experience.
Here's an idea -
When wifi is disabled, and using mobile data (as laurent suggested)

When wifi is enabled,

IMO there shouldn't be any text, when WiFi is available, because the setting/option will be "sync only via WiFi" (or something similar). Thus the user only needs to know when auto-sync is off.

3 Likes

Like so?

Sadly, not all languages seem to have a short word for sync.
Russian and Hungarian for example:

I think one issue is that there's no recognisable icon that says "feature is disabled because WiFi not available". At least personally I wouldn't know what any of the icons above mean, I might even think there's a sync error or some connection error with the app. So any icon you might use will still require explanatory text, and if we need text we may as well do without the icon.

It would be best if the text doesn't take two lines but based on your screenshots it's not a massive problem either. If we wanted to save space for the notebook list, we probably should do something about the New Notebook, Tags and Configuration buttons, but that's another issue.

I believe we can use the icon with a little bit of transparency for the 'disabled' state and can use colors for sure for 'enabled' state (acc. to google minimilastic themes).

And for the notebook list, the section height of div looks good for the sidebar. Looks even, so two lines i guess should not be a problem.

I agree with Laurent, the text is fine. Adding transparency to the icon is not nearly enough contrast to be noticed by the users. And its still ambiguous, because it might seem like sync is disabled altogether, which is not true.

The problem with adding color to indicate that sync is working, is that users are used to the icon being gray when everything is fine, so changing the meaning of gray to abnormal is confusing, in my opinion. It would make more sense to change the color when sync is off, but that would still require some explaining text, since it still might be confused with an error.