Show HN: Picknplace.js, an alternative to drag-and-drop

It's even worse on desktop. You have to scroll the entire screen (with mousewheel or arrow keys) to move the selection. I spent 30 seconds thinking it was bugged because the intuitive solution would be to click once, then simply click where you want to place it, but the "place" button only showed up on the one you already "picked". Fine idea, worst conceivable execution of UX I have ever seen.

This looks like an interesting concept!

> I find that the drag and drop experience can quickly become a nightmare, especially on mobile.

To me, drag and drop is only a nightmare on mobile. On desktop (using a mouse or trackpad), drag and drop actually works quite well.

Your design experiment reminds me of a recent talk of Scott Jenson, where he talked about how we just took over established UX patterns from desktop to mobile as is, and how that created all sorts of nuisances. (https://youtu.be/1fZTOjd_bOQ?t=1565)

If mobile drag&drop was implemented like you are suggesting from the very start, I actually might have preferred that over the situation we now ended up with.

One technical note on your implementation: on certain mobile browsers, there is a glitch where the UI can jump around as the browser dynamically slides top or bottom menu bars in and out.

I repeatedly clicked pick and place and scratched my head for a minute. Wish there were a cue that I have to scroll.

Viewing this on my phone and tapping the colored does nothing at all. Are they supposed to do something?

That's neat. Not sure if I would deploy it, as it will be hard to explain/teach people how to use it (as I see in other comments already), but I do see the value in it.

It solves the "drag and drop beyond what fits the screen" much better than you can with drag and drop, the awkward auto-scroll-on-nearing-the-edge-thing.

I would say, if you need to reorder many items, it gets a bit disorienting, the whole list moves as it's anchored to the item you are moving. Maybe there is a way to combine drag and drop where this kicks in if you go beyond the bounds of the visible area.

Also don't think this can work well with multiple axis/drop zones.