Improve UI in drawing tools when adding a location (Point/Line/Rectangle/Polygon)

[dpalomino]

Problem Statement

In the vast majority of cases, only markers and polygons are used in the web UI to add/edit geometries. Partners are sometimes confused by the draw line and draw a rectangle option, and in all cases seen those geometries were just created by mistake.

We need to improve the UI for the drawing tools so partners don't get confused.

Context/Use case

See above.

User Story

As a data collector, I want only to clearly distinguish when I'm drawing a polygon, a polyline, a rectangle, or a point.

Description

See the screenshots included in this comment. In addition to the icon, we will include "Point", "Line", "Polygon" etc in the drawing tools.

An explanatory mouse-over text will be also included.

[wonderchook]

@dpalomino I'm hesitant to remove the line drawing tool. There are scenarios where people would want to draw lines that I think we are going to run into.

The OSM Editor iD does a good job of making this more clear. Maybe something like that would help

---

They then have nice mouse overs that explain what each is fo:

[dpalomino]

Yes, definitely that kind of UI would help to clarify. @clash99, what do you think?

[clash99]

Love it - will take a little time to implement so maybe for next sprint?

[dpalomino]

It'd be really great :-)

[clash99]

Related to #1005

[dpalomino]

Updating description and title with the new approach.

[clash99]

Related to #1590

[clash99]

Wireframes

• Link to pdf of all wireframes

Default toolbar changes

Draw toolbar changes

User flows for adding locations through draw toolbar

[dpalomino]

@clash99, I think the wireframes are really great. Thanks!

Re the bulk import of locations, I think even if we don't support bulk imports, we need to see how the user will be selecting the location to be imported if the file contains more than one location.