Mobile – Control video state using actual button or invisible tap gesture

I'm working on a video editor mobile app.

As usual, when prototyping we'll often find a conflict between UI and UX. Altho UX has usually higher priority, from time to time I'm trying to find balance between them.

I was thinking about adding Play/Pause functionality to the video. As far as I see it, I have three options:

  • 1) Not adding this functionality - let the video constantly loop
  • 2) Add this functionality as an Invisible tap gesture upon the video container. When you tap it'll Play/Pause the video, Showing "Play" button when paused, show nothing when the video is playing. (Issue here: the user won't be aware the video could be stopped until he press it for the first time.
  • 3) Adding actual small Play/Pause button (Issue here: adding new constant UI element, makes the UI less cleaner).

Illustration of 1 and 2:

enter image description here

What do you think? Thank you for your time.

Tags: