I am developing an interactive web map that displays user-generated markers. In terms of adding a new marker, what would be the best way to start the process, especially on mobile?
There are multiple methods that I thought of, mainly:
- Click on an "add" button which would replace the current controls with a "cancel" and "continue" button, where "continue" brings up a modal form that lets the user add a name (reverse geocoded from the point on the map by default), photos, and tags
- Either the marker presented would be draggable on its own, or the centre of the map acts as the location of the marker, having the user pan the map to determine the location
- Tap somewhere on the map which would then either expose an "add" button over the generated marker or replace the controls at the bottom with a single "Add" button
- Either have the marker draggable, make the marker static (requiring to tap away to select again), or like above use the centre of the map as the location
- Click on "add", have a modal form appear and either have a secondary map or plain form fields for filling in the location
As I expect a majority of people to use the application on mobile devices and at night, I want to make the interaction as smooth and enjoyable as possible.
This is what the base UI currently looks like: