In one of my iOS mobile apps I’m showing a screen with 2 options for pasued video scrub.

At this point, the video is paused, I'm giving the users an option to examine the video, either using fast scrub, or frame by frame. The options are:

  • Fast scrub using slider - similar to all music apps, giving the user the option to fast-scrub thru the video.

  • Step forward buttons - on each side of the slider, I'm placing button for one-frame-forward and one-frame-forward.

This are the options I've tried:

enter image description here

There are couple issues I can't figure out.

The Slider thumb has to be circle. When using circled button on the sides/below, it's just cause confusing (too many circles).

When placing text-only-button below the Slider, it looks like indicators to where each sider-side doing, it's not clear it's buttons.

Bottom line - Slider with Stepper on each side.
What do you recommend as good practice? What Love to hear your thoughts, Thanks!


After a lot of tryouts, that's what I came up with. I've used Gestalt principles as guidelines.

What do you think?

enter image description here


enter image description here

  • Can I ask; where are the play/pause controls on the app? It would possibly make more sense to have the prev/next frame options in close proximity of that... Jul 20, 2017 at 13:19
  • Are those conclusions from a test or your own assumptions?
    – jazZRo
    Jul 20, 2017 at 13:22
  • @SocratesKolios There are not play/pause buttons. In the first step, the video is played on a loop, when the users selected a video, it's automatically paused, giving him the option to pick a frame.. So above the scrub/buttons components we have the video, and that's it. The components(scrub/buttons) are at the bottom of the screen
    – Roi Mulia
    Jul 20, 2017 at 13:30
  • @jazZRo Assumptions. But there is logic so I guess it's some what worth the discussion.
    – Roi Mulia
    Jul 20, 2017 at 13:30
  • @SocratesKolios I've updated my question with another solution. What do you think?
    – Roi Mulia
    Jul 20, 2017 at 18:59

2 Answers 2


Edit: Just realised this was posted 6 months ago! Sorry to bump it up.


download bmml source – Wireframes created with Balsamiq Mockups

Any reason the slider and the advance buttons need to be together? What about incorporating them into the video display?


Something like this, giving the user more control over the frame skips, with clear labels...

Skip Frames

  • I don't want to overload the UI. I did gave the user the option to "continuous tap" to exclude the need to retap each time. As swell, Skip Frames might be referred as a button tho to is color. What do you think?
    – Roi Mulia
    Jul 20, 2017 at 13:09
  • Only in paused mode, you stated, hard to offer functionality, without putting functional buttons on the UI. Jul 20, 2017 at 13:20
  • Maybe changing the SKIP FRAMES to lower case(or maybe capital for each word) and turn it white, might be better?
    – Roi Mulia
    Jul 20, 2017 at 13:31
  • Just to emphasize the buttons more, I'm using the theme-color only for clickable objects
    – Roi Mulia
    Jul 20, 2017 at 13:32
  • I've updated my question with another solution. What do you think?
    – Roi Mulia
    Jul 20, 2017 at 18:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.