The graphs are hard to interpret

[robinpaulson]

A user of Forecastie, who has since uninstalled it (due to inaccurate wind forecast predictions), told me yesterday they could not read anything useful from the graphs, as the x-scale was too small. Particularly on an average-sized smartphone, we cram a lot of information into a small number of millimetres. On my Galaxy S3, the entire chart is only around 60mm wide, into which we put 40 values - 8 per day, for 5 days.

I wonder whether we offer an option to make the graph show a different scale on the x-axis? Perhaps one day or two.

This is mostly a problem for the temperature scale, as that value often varies a lot from day to night, every day.

Yes, we could tell the user to look at the individual values on the Today/Tomorrow/Later cards, but a graph is a very useful way to view and understand change over time, a list of numbers is very abstract and hard to relate to. I have an unsubstantiated feeling that a number of our users go straight to the graphs. I recall one suggested here that we have an option for the graphs to be the "main" screen, with the numbers behind a menu.

Programmatically, I think this is a fairly simple thing to do, maybe even as easy as tying one number to a control which switches between 2 and 5 days forecast.

[robinpaulson]

For comparison, it reads fine on a tablet with a giant screen (160mm wide), very easy to pick a particular time and figure out what it'll be at.

[sotpapathe]

Maybe show 2-3 days by default on graphs but allow scrolling to see more?

[robinpaulson]

Hmm, I'm not sure how that would look. Edit: I'm sure it would work, of course it would. What I meant to say was it might not be a great UI, the user would then be required to scroll horizontally and vertically to see all the data, which sounds clumsy.

[robinpaulson]

I was thinking perhaps a slide switch at the top of the graphs screen, to the right of the title, which switches between 2 and 5 days displayed at once.

[robinpaulson]

Or a simple tap-and-release on any of the charts.

[robinpaulson]

L121 of GraphActivity.java

for (int i = 0; i < weatherList.size(); i++) {

weatherList.size will be 5 days x 8 values per day, is 40. if we want to show 2 days, then that line should be:

for (int i = 0; i < (16); i++) {
?

[sotpapathe]

Yes, but wouldn't

for (int i = 0; i < (weatherList.size() * 2 / 5); i++) {

be easier to understand? It avoids the magic number and would still work if weatherList.size() changes.

[robinpaulson]

@sotpapathe
Yes, good point.

Or perhaps we define it elsewhere, something like: shortWeatherList = 2 * weatherList / 5

then put in an if...then...else to select whether the "for" loop uses weatherList or shortWeatherList dependent on the state of the control which the user operates.

[sotpapathe]

@robinpaulson
That's even better!

[robinpaulson]

Options for the method to switch between 2 and 5 days graph length:

1. a slide switch at the top of the graphs page
2. an option in the "settings" page
3. tap anywhere on any graph (we'd provide a hint the first time the user opens the graphs)
4. something else

I think this could be an option which is used relatively frequently, so I'm leaning towards 1 or 3.

[sotpapathe]

I agree with having the option in the graphs page.

I think option 3 is not very intuitive and it is easy for users to forget as there is no indication how to change the graphs after the initial hint.

Option 1 is the best I think and it could be made (hopefully easily) into a slider that allows users to select any value between 1 and 5 days. Of course it should be persistent like the options in the settings page.

[robinpaulson]

I agree with almost all of that

a slider that allows users to select any value between 1 and 5 days

Yes, maybe at some point.

First of all we'll provide options for 2 and 5 days. Maybe get more feedback, see how useful it is, etc. It's a relatively simple change from there.

[robinpaulson]

In a renewed attempt to make option 3 more appealing, we could set the hint message to reappear at every upgrade. Given we're putting out a new release approximately every month, I think most users would pick up on that method relatively quickly.

[robinpaulson]

We'd also need to add a control on the graphs page, which is an area I'm not so hot on (UI).

layout.sml needs a slide toggle switch adding, I don't think we use one of those already, so we'd need to call a library. "Switch" from the default libraries looks suitable, it supports Android back to v4.0/sdk 14.

Label: "Length of graph, days"
On the switch: "2" and "5"

I think in line 24

[FridoDeluxe]

First I thought of having the actual graph area stretchable and movable, like a slippy map. But first this is not intuitive as stated above. And secondly, it's probably not possible to code it in a way that the axis around the graph stay fixed.

So I agree with your ideas: Adding a toggle control to switch between 2 and 5 days.

The Switch component has no labels (like "2" and "5") on the component itself, or do I miss something? Also in Android it's rather used as a switch between on and off, and not between two different values. I'd propose to use a label like "Show more days" or "Extended Preview" with the switch right next to it. This shouldn't need that much horizontal space, so there is even the possibility to display the new switch directly in the top toolbar (and no additional vertical space is needed).

[FridoDeluxe]

I have to correct myself: The Switch can be labeled, but this is not commonly done (because it looks weird) and also contradicts the on/off meaning of a Switch. Of course it's still possible to place TextViews right next to both sides of the Switch.

Anyways, this is what I developed so far and should resemble your ideas:

You can choose between 2 and 5 days with the Switch, the chosen state is remembered in SharedPreferences. Maybe the text of the label can be improved, but the user can see an instant result of the action so no additional explanation is necessary. The only drawback is in my eyes the color: The default Switch doesn't work that well on a colored background, but I guess it's possible to adjust the theming.

@robinpaulson @sotpapathe What do you think? You can have a look at the implementation here: FridoDeluxe@4e25222.

[sotpapathe]

Code: I suggest replacing the two numWeatherData = 2 * weatherList.size() / 5; lines with numWeatherData = min(2, weatherList.size());. This is because:

1. It makes it clearer in the code that we are requesting 2 days.
2. If for some reason weatherList.size() < 5 (maybe the OpenWeatherMap API changes?), we avoid bugs where we get fewer than 2 days. E.g. 2 * 4 / 5 = 1, or 2 * 2 / 5 = 0, whereas min(2, 4) = 2 and min(2, 2) = 2.

UI/UX: I think it's easy to discover and use and the fact that the setting is persistent is great. The only issue I see is, as mentioned, the color of the switch. Some themes look somewhat off in places (e.g. the map tabs). Maybe they should all be revisited at some point.

Great job!

[robinpaulson]

I like the work you've done @FridoDeluxe, very useful. I think the label you suggest works well, I would change it though to "Show more days", "More days" is a little ambiguous.

Yes, the colour is a problem, and tidying the themes will make a big difference.

[FridoDeluxe]

Code: I suggest replacing ...

It's 5 days with one value every 3 hours = 40 values, not one per day. I think the current formula 2 * weatherList.size() / 5 is good enough without making things too complicated. When OWM decides to change the API (and changes the forecast frequency) we have to adjust more things anyways.

I would change it though to "Show more days" ...

I think "More days" (or something similar without a verb) is better, beause of two reasons:

1. The Switch itself represents the action (=verb) and is normally placed next to something that can be enabled/disabled (example in Android settings: it's "Flight mode" and a Switch, not "Enable flight mode"). Also when you switch back from enabled state the label should technically change to "Hide more days" if you include a verb - but interchanging label texts in UI is rather irritating.
2. "More days" is shorter, less chance to get in layout conflict with the top bar title in verbose languages.

Regarding the color I assume: We leave the Switch like that and hope that it improves when themes got revisited/optimized?

[robinpaulson]

I think "More days" (or something similar without a verb) is better, because of two reasons:

That is a very good answer, absolutely.

On colour: yes, let's leave it for now. If there are complaints we can always do a quick hack to fix it in the short-term before we figure out themes.

[sotpapathe]

When OWM decides to change the API (and changes the forecast frequency) we have to adjust more things anyways.

Fair point.

"More days" is shorter, less chance to get in layout conflict with the top bar title in verbose languages.

My thoughts exactly. In Greek "more days" would be "περισσότερες μέρες". The expanded version would probably be too long for most phones.

[FridoDeluxe]

This is the PR: #476.

Also the given implementation deserves only complexity: MEDIUM as a label :-)

[robinpaulson]

Closed for now, we will revisit if this is not good enough. Unfortunately I'm not in contact with the person who asked for this to be solved.

[robinpaulson]

Also the given implementation deserves only complexity: MEDIUM as a label :-)

so modest....

[robinpaulson]

I'm very happy with how this turned out. I also asked the original person who made the suggestion, she likes what we've done too.