Honestly when I see things like this, I feel Ai can steal our coding but it can NEVER still our resoning and creativity. Thanks for sharing!
[dead]
Show HN: Picknplace.js, an alternative to drag-and-drop
81–90 of 158 posts
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#82Brilliant! Its been a while since I've seen a brand new UX patten. As some others have mentioned, the picked state needs to be a bit more clear. Some suggestions - 1. As a border around 'Pick' to indicate it as an action 2. Once an item is picked, add a mask on the whole page, with only the picked item in front of the mask. (This is going to be a bit challenging, I'm guessing, to show the gaps between the items as yo…
Yes! This is very cool. Should be somewhat “locked” into the right area of scroll and picked item should have some height above the others.
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#83This is awesome. I wonder how it would feel if just the selections scrolled, like Apple’s interface for setting alarms and timers.
I especially love it because it leaves open the possibility of interacting with the rest of the screen while an element is picked. Eg you could navigate a directory tree while finding the right place to put a file. Though I guess it’s similar to cut/paste in that respect.
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#84I'm old enough to remember when using a mouse felt like being unchained. I also remember how quickly dragging began to feel like a time waste, even more so after spending more time on CLIs than GUIs. So though this seems limited to vertically arranged DOM things it's very cool for eliminating the least productive/most frustrating stage of drag-drop interactions
Would love to see this work with keyboard only
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#85Earlier quoted context omitted.
These feel like fixable things.
The ones that are moving the wrong item to the wrong place are fixable, but there will always be a problem when scrolling is quantized if there is a possibility that any item in the list is shorter than the scroll quantum.
dom scroll event interceptor maybe?
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#86But how are you going to replace the OG? https://mrcoles.com/dragondrop/
(Ironically doesn’t work on mobile)
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#87Unresponsive in chrome, even in incognito.
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#88Does not work with an indexed scrollwheel -- one click of the scroll wheel moves like 4 lines in your list, which seems to break the assumptions of your code. I get very strange behaviors, e.g. "pick" Five, scroll up and down, see swapping of Ten and Six during scroll. Then "place" results in Five being in the same place as before but Nine and Ten are swapped. Similar when using arrow keys.
These feel like fixable things.
Somewhat shockingly, apparently DOM does not give access to the raw scrollwheel data.
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#89The “place” aspect of the process needs some refinement. On iOS, it triggers the page bump (and necessitates and extra click) because it’s aligned at the bottom of the page. Having the “place” action hover near the selected object could be an alternative. I really enjoy this pattern. Nice work.
Re: Show HN: Picknplace.js, an alternative to drag-and-drop
#90The “place” aspect of the process needs some refinement. On iOS, it triggers the page bump (and necessitates and extra click) because it’s aligned at the bottom of the page. Having the “place” action hover near the selected object could be an alternative. I really enjoy this pattern. Nice work.
cancel place should have some kind of a separator between them. I thought it is to cancel placing instead of two options to cancel or place.