I have a list of items that a user can create, move around, edit and delete. Each item can be a different type such as a textbox field or a header.
To create a new item or edit an existing one the user is shown a popup after clicking on a link. This popup lets the user change the item type (textbox, header, dropdown etc) as well as its individual properties.
To improve user experience I am not allowing the user to change the position of the item in the popup as this would have been an index number field rather than a visual representation of where the item would be moved to. Instead, users can drag and drop each item.
This lets users edit and move existing items nicely as they can just drag and drop each section and click 'edit' on an item to open the popup and change its properties. The issue comes when adding new items, as I need a friendly way for users to position the newly created item.
The way I see it is I have 2 options:
Have an "Add new Item" link which opens the popup and after the user has confirmed it, places the item at the end of the list, from where the user can then move the item to the desired position. The issue with this is it can be tedious for the user if they don't want to add items to the end as after they create one they will have to drag it to the right position.
On every item have an "Insert below" link which opens the popup but inserts the item below the existing item with the link. The downside to this is that every item will have an "Insert below" link so the page might seem crowded.