Mobile page views need to be higher up on the screen

[futuresoup]

In many instances, page views are too low on the screen and the user isn't aware that they need to scroll down to read the full page and interact in a certain way.

For example, when first landing on Hey Duwamish from an iphone, it looks like this

Instead, it should look like this:

This way, the user gets the full introduction and can see the "Start Mapping" button without having to scroll. The map doesn't need to be fully displayed until they make this first interaction.

Let's say the user begins exploring the map, and selects a report icon to view. It currently looks like this:

Once again, it's too low, and the user might not notice there's more content to read and not be aware that they should scroll.

It should instead look like this:

In this example, the icon is all the way at the top of the map, so it's still visible, but the rest of the screen is dedicated toward displaying as much of the report as possible.

---

The bottom line as far as the design concept is that the user should have the fullest view of the map only when it's time to explore the map (except for the Submit a Report button), and the fullest view of the pages when it's time to explore those pages (except for a small part of the map that lets them know where they are)

[maxburto]

I commited a style change that sets the map element to a hight of 175px when the body element has the class "content-visible".

[modulitos]

Cool! I just deployed this to our dev site. Feel free to test it out...

[futuresoup]

I've noticed two things when testing here: http://mobiletest.me/iphone_5_emulator/?u=http://dev.heyduwamish.org/

1. When you hit the Start Mapping button on the welcome screen, it takes you to a view where the map window size is very limited. This doesn't seem to be the case if you hit the close button on the window, only when you hit the blue Start Mapping button (which most users will probably do when faced with the two options for closing the window)

2. When you add a report, the vertical layout of the place buttons obstructs the map when trying to select a location.

In order to properly address the second issue, I think we need to re-work the reporting workflow slightly.

Instead of selecting report type first, the user selects their location on the map first with the fullest map view possible and a minimal, but obvious, sized dialog that says "First select the location of your report by dragging the map and placing the red pin"

Once the location has been landed, the user doesn't need the map anymore and we can reduce the map view and dedicate the space toward optimizing the quality of their report.

[modulitos]

I think the above comment by @futuresoup should be its own issue or added to our dynamic form issue #127

Closing this issue, because I believe it is resolved.