5 ms·

Introducing Slide-to-Select

33 points by kampopat 12y ago

Goonbaggins 12y ago
Looks great for a static screen. How does it handle scrolling?
- _mtr 12y ago
  Yeah, seems like this would conflict with other gestures like scrolling or swiping.
- paulmalenke 12y ago
  Tested it out. Using spreadsheet terms, it seems that when you want to select A1 to A2 it will scroll unless you have already started a horizontal select. The whole workflow is actually really nice and smooth. I personally like it. I would recommend others to try it out.
  - aidos 12y ago
    Cool! That's actually a great solution. As with all of these things it's not obviously discoverable but once you know how the interaction works it's really useful. Seems like one of these features that you'll forever find yourself wishing for in every other app where you had to select a load of things.
    - kampopat 12y ago
      We're going to introduce a short tutorial that makes users aware of the interaction when they first open the camera so that should make it more discoverable. Another thing that isn't obvious yet is you can deselect all the images by shaking the device! We'll make that obvious in the tutorial too.
      - paulmalenke 12y ago
        It might be good to have a deselect all button. Without knowing that I could shake, I deselected around 25 photos manually.
adevine 12y ago
This interaction looks like it could be confusing as everywhere else people are used to the drag-and-drop interaction (or, in mobile, tap-and-drag).
afandian 12y ago
EDIT 2: Author removed the image. I clicked on the link. It shows me a full-screen image with some text telling me to click and drag and tap and slide. So I clicked on the text and dragged and ... it's text. I pressed space (probably subconsciously) and found out that it scrolls and it's an article about user interaction. But the only thing I saw at first is a picture and a title. It seems like they went out of their way to destroy usability so it looks nice. Especially ironic in an article about user interfaces. I don't think it would really hurt to put "scroll down to read some text" on there, so you know you can scroll. EDIT: this is what I see: http://i.imgur.com/euC9MeN.jpg http://i.imgur.com/euC9MeN.jpg
- untog 12y ago
  This is a pretty standard view for Medium posts - little to do with the OP.
  - afandian 12y ago
    I have noticed it on other posts, but that doesn't mean it's not a feature of this webpage that's been linked here. And I was actually confused. People post all kinds of things here. Something that did something when you dragged words about wouldn't be unexpected.
- nogridbag 12y ago
  Yes, I failed on this too. I tried triple clicking the text and thought the "Share a Note/Twitter" popup was the whole point. I couldn't figure out the drag bit and assumed the "Tap Tap Tap" was for mobile. It wasn't until I read your comment that I realized I could scroll down to an actual article. Embarrassing.
- userbinator 12y ago
  "scroll down to read some text" on there, so you know you can scroll. I saw the picture and text at first, but also the scrollbar that indicated there was more content, so I knew I should scroll down.
  - 12y ago
userbinator 12y ago
This sounds like it would have to be a separate mode, since otherwise it would be very easily confused with scrolling which the slide gesture is already used for - and this could make selections more difficult if they're not contiguous and located far apart; compare 1. Scroll to the first item; tap to select it; scroll to the second item; tap to select it; perform the desired action with the selection. 2. Scroll to the first item; enter selection mode; tap to select it; exit selection mode (and hopefully it still keeps the selection!); scroll to the second item; enter selection mode; tap to select it; perform the desired action with the selection.
- kampopat 12y ago
  OP here. It's actually a single mode. Since the view doesn't have a horizontal scroll, the selection is activated as soon as you slide your finger horizontally and will continue (horizontal or vertical) until you lift your finger. Of course this means that only the visible cells on screen can be selected in one go before you'd have to release (it will keep the selection) and then scroll down before selecting another group. Hope that clears it up!
- aidos 12y ago
  @paulmalenke pointed out (currently below) that scrolling still works because this only triggers if you start selecting in a horizontal direction. Given that, I don't think it needs another mode at all. Alos, the tap to select behaviour should still work as it always has. You don't really lose anything.
jpl56 12y ago
I can already perform a slide to select on my old iPad 1. Did this disappear in recent versions of iOS?
peterchon 12y ago
every interaction should have a logical purpose behind it. clicking is a natural form of selection, swiping is more geared towards movement.
preya2k 12y ago
This has been around for a while. An app called Loom had this like a year ago. You can look at it here: https://www.youtube.com/watch?v=3B8KTDqCKx8 https://www.youtube.com/watch?v=3B8KTDqCKx8 App is not available anymore, because it got acquired by Dropbox.
- ukd1 12y ago
  I'm pretty sure that they would have patented it too. Guess we'll find out if this gets pulled.
  - ttty 12y ago
    But nobody shows how to scroll in select mode. Edit: >Tested it out. Using spreadsheet terms, it seems that when you want to select A1 to A2 it will scroll unless you have already started a horizontal select. The whole workflow is actually really nice and smooth. I personally like it. I would recommend others to try it out.
girish_h 12y ago
This is a really cool implementation.. Definitely a time-saver.. Like another user mentioned here, i am curious to understand how you handle vertical scrolling..
- kampopat 12y ago
  Vertical scrolling isn't affected. A horizontal slide of your finger will activate it and then you can slide over any photo you want to select (horizontal, diagonal and vertical). Once you lift your finger you can scroll down as you normally would. We take into account the angle at which you're scrolling so it is possible to select say 3 photos in the same column by sliding your finger over the top one at an angle and then sliding down. Try it out if you have an iOS device.
deleted 12y ago
[deleted]
deleted 12y ago
[deleted]
cookingrobot 12y ago
Windows Vista did something similar to support both panning and selecting with touch screens.* A vertical drag would pan the content, and a horizontal drag would act like a mouse: select or drag-drop the content. http://youtu.be/roP3YtLvblE?t=2m22s http://youtu.be/roP3YtLvblE?t=2m22s I thought it worked well, even though it made horizontal scrolling harder (had to use 2 fingers). Windows 8 uses tap-drag for selection instead. http://www.microsoft.com/surface/en-us/support/touch-mouse-and-search/using-touch-gestures-tap-swipe-and-beyond http://www.microsoft.com/surface/en-us/support/touch-mouse-a... (* I worked on this feature at MS back in the day)
aligajani 12y ago
Wish Apple sees this.
umangd 12y ago
Tidy (an iOS app for organising your photos) has this as well. Dont know how they do it, buts its really neat.

33 points by kampopat 12y ago

Goonbaggins 12y ago

Looks great for a static screen. How does it handle scrolling?

_mtr 12y ago
Yeah, seems like this would conflict with other gestures like scrolling or swiping.
paulmalenke 12y ago
Tested it out. Using spreadsheet terms, it seems that when you want to select A1 to A2 it will scroll unless you have already started a horizontal select. The whole workflow is actually really nice and smooth. I personally like it. I would recommend others to try it out.
- aidos 12y ago
  Cool! That's actually a great solution. As with all of these things it's not obviously discoverable but once you know how the interaction works it's really useful. Seems like one of these features that you'll forever find yourself wishing for in every other app where you had to select a load of things.
  - kampopat 12y ago
    We're going to introduce a short tutorial that makes users aware of the interaction when they first open the camera so that should make it more discoverable. Another thing that isn't obvious yet is you can deselect all the images by shaking the device! We'll make that obvious in the tutorial too.
    - paulmalenke 12y ago
      It might be good to have a deselect all button. Without knowing that I could shake, I deselected around 25 photos manually.

adevine 12y ago

This interaction looks like it could be confusing as everywhere else people are used to the drag-and-drop interaction (or, in mobile, tap-and-drag).

afandian 12y ago

EDIT 2: Author removed the image. I clicked on the link. It shows me a full-screen image with some text telling me to click and drag and tap and slide. So I clicked on the text and dragged and ... it's text. I pressed space (probably subconsciously) and found out that it scrolls and it's an article about user interaction. But the only thing I saw at first is a picture and a title. It seems like they went out of their way to destroy usability so it looks nice. Especially ironic in an article about user interfaces. I don't think it would really hurt to put "scroll down to read some text" on there, so you know you can scroll. EDIT: this is what I see: http://i.imgur.com/euC9MeN.jpg http://i.imgur.com/euC9MeN.jpg

untog 12y ago
This is a pretty standard view for Medium posts - little to do with the OP.
- afandian 12y ago
  I have noticed it on other posts, but that doesn't mean it's not a feature of this webpage that's been linked here. And I was actually confused. People post all kinds of things here. Something that did something when you dragged words about wouldn't be unexpected.
nogridbag 12y ago
Yes, I failed on this too. I tried triple clicking the text and thought the "Share a Note/Twitter" popup was the whole point. I couldn't figure out the drag bit and assumed the "Tap Tap Tap" was for mobile. It wasn't until I read your comment that I realized I could scroll down to an actual article. Embarrassing.
userbinator 12y ago
"scroll down to read some text" on there, so you know you can scroll. I saw the picture and text at first, but also the scrollbar that indicated there was more content, so I knew I should scroll down.
- 12y ago

userbinator 12y ago

This sounds like it would have to be a separate mode, since otherwise it would be very easily confused with scrolling which the slide gesture is already used for - and this could make selections more difficult if they're not contiguous and located far apart; compare 1. Scroll to the first item; tap to select it; scroll to the second item; tap to select it; perform the desired action with the selection. 2. Scroll to the first item; enter selection mode; tap to select it; exit selection mode (and hopefully it still keeps the selection!); scroll to the second item; enter selection mode; tap to select it; perform the desired action with the selection.

kampopat 12y ago
OP here. It's actually a single mode. Since the view doesn't have a horizontal scroll, the selection is activated as soon as you slide your finger horizontally and will continue (horizontal or vertical) until you lift your finger. Of course this means that only the visible cells on screen can be selected in one go before you'd have to release (it will keep the selection) and then scroll down before selecting another group. Hope that clears it up!
aidos 12y ago
@paulmalenke pointed out (currently below) that scrolling still works because this only triggers if you start selecting in a horizontal direction. Given that, I don't think it needs another mode at all. Alos, the tap to select behaviour should still work as it always has. You don't really lose anything.

jpl56 12y ago

I can already perform a slide to select on my old iPad 1. Did this disappear in recent versions of iOS?

peterchon 12y ago

every interaction should have a logical purpose behind it. clicking is a natural form of selection, swiping is more geared towards movement.

preya2k 12y ago

This has been around for a while. An app called Loom had this like a year ago. You can look at it here: https://www.youtube.com/watch?v=3B8KTDqCKx8 https://www.youtube.com/watch?v=3B8KTDqCKx8 App is not available anymore, because it got acquired by Dropbox.

ukd1 12y ago
I'm pretty sure that they would have patented it too. Guess we'll find out if this gets pulled.
- ttty 12y ago
  But nobody shows how to scroll in select mode. Edit: >Tested it out. Using spreadsheet terms, it seems that when you want to select A1 to A2 it will scroll unless you have already started a horizontal select. The whole workflow is actually really nice and smooth. I personally like it. I would recommend others to try it out.

girish_h 12y ago

This is a really cool implementation.. Definitely a time-saver.. Like another user mentioned here, i am curious to understand how you handle vertical scrolling..

kampopat 12y ago
Vertical scrolling isn't affected. A horizontal slide of your finger will activate it and then you can slide over any photo you want to select (horizontal, diagonal and vertical). Once you lift your finger you can scroll down as you normally would. We take into account the angle at which you're scrolling so it is possible to select say 3 photos in the same column by sliding your finger over the top one at an angle and then sliding down. Try it out if you have an iOS device.

deleted 12y ago

[deleted]

deleted 12y ago

[deleted]

cookingrobot 12y ago

Windows Vista did something similar to support both panning and selecting with touch screens.* A vertical drag would pan the content, and a horizontal drag would act like a mouse: select or drag-drop the content. http://youtu.be/roP3YtLvblE?t=2m22s http://youtu.be/roP3YtLvblE?t=2m22s I thought it worked well, even though it made horizontal scrolling harder (had to use 2 fingers). Windows 8 uses tap-drag for selection instead. http://www.microsoft.com/surface/en-us/support/touch-mouse-and-search/using-touch-gestures-tap-swipe-and-beyond http://www.microsoft.com/surface/en-us/support/touch-mouse-a... (* I worked on this feature at MS back in the day)

aligajani 12y ago

Wish Apple sees this.

umangd 12y ago

Tidy (an iOS app for organising your photos) has this as well. Dont know how they do it, buts its really neat.