Drag-and-drop image placement is confusing

[mor10]

When a user drags-and-drops an image onto the editor, the image placement is not obvious and the experience leaves users confused:

• At the start of the process, the text caret is somewhere in the text.
• on drag-and-drop, the add media panel appears abstracting the user from the task of placing the image in the correct context in the text.
• When the add image panel is exited by clicking "Add Image", the image appears where the cursor was originally placed.

The introduction of the abstraction layer of the Add Image panel causes the user to shift focus enough that the final location of the image placed in the text seems arbitrary.

Possible solutions:

1. Allow the user to drag the image onto the canvas and place it in context by visualizing a placeholder container before the modal is opened. The modal should only open after placeholder placement is made so the user knows where they placed the image before dealing with metadata.
2. If the sequence of events must start with the add media modal, allow the user to place the image within context after clicking Add image: Rather than the image being placed at the current caret position, show a placeholder with an interactive outline the user can drag around and position before the actual image is placed.

Image placement via drag-and-drop is an issue that shows up often in user testing. It is poorly understood and leads users to feel like WordPress is either acting at random or worse making decisions on their behalf.

[joemcgill]

@mor10 does the new block editor solve this problem?

[mor10]

I think so, yes.

[antpb]

Reporter feedback says let's close! Thanks @mor10 !