[UI] Ability to zoom the timeline

[NickM-27]

Describe what you are trying to accomplish and why in non technical terms

Some use cases require that the timeline has a higher resolution than default so scrubbing can be precise down to the second. For example when exporting on the timeline or reviewing a quicker object. There are also use cases for having a more zoomed-out view so more of the time can be viewed at once.

Describe the solution you'd like

Ability to zoom in/out the motion timeline

[Majestic7979]

Perfect!

[DrSpaldo]

Great idea, I have found the new UI difficult to pin point minutes/seconds

[EreNDern]

I've seen it done quite well in another application (iOS-DMSS and PC-SmartPSS ). There is also an equivalent of this application for PC, where it is done similarly and is very convenient to use.

This is the timeline from the motion tab which is the most tiring for me.
https://github.com/blakeblackshear/frigate/assets/89579137/e3256490-0231-4032-8e89-f7ec2b2c726c

[NickM-27]

It's not clear what you mean by catch the time selector. Just move the time selector itself, no reason to scroll.

[EreNDern]

I meant this line

[EreNDern]

it's a recording from my phone and it's really hard to catch it

[NickM-27]

Right, you drag that to the point on the timeline where you want to view. I don't understand the phrasing "catch" when you are directly controlling the time selector

[EreNDern]

I can't move it if it's too close to where I want to move it

[NickM-27]

Sure you can, you just click and drag it slightly. I'm not really understanding what the disconnect is here.

[EreNDern]

of course, it's convenient on a computer, but not on a phone, because
I can easily click it with a mouse, so with my finger I hit the timeline instead of selecting the time.

[NickM-27]

I don't have any issue dragging on a phone either https://github.com/blakeblackshear/frigate/assets/14866235/921b8be8-ded2-4025-986f-40471d3b1f9f

[hawkeye217]

In addition to @NickM-27's comments, I'll add that the type of timeline in your video example is fundamentally different from the one in Frigate's motion review. In your example, scrolling the timeline itself moves the "set" time. On Frigate's timeline, you can scroll the timeline independently of the "set" time on the handlebar.

[EreNDern]

I don't have any issue dragging on a phone either https://github.com/blakeblackshear/frigate/assets/14866235/921b8be8-ded2-4025-986f-40471d3b1f9f

While I can catch the line in this view, it's harder in the motion view (which is why I wanted to show you the DMSS app - it lets you grab the whole timeline for easy selection).

ed: Was the decision to make the time line and timeselector both movable due to technical reasons?

[NickM-27]

I don't have any issues in motion view either. It's not clear what is actually difficult to do

[NickM-27]

Also worth pointing out that the point of the timeline is dragging and seeing things change on the camera. I think a full explanation of what is trying to be viewed using the timeline and why that is is currently difficult would be good so we can hopefully understand what you are meaning.

[NickM-27]

Example of motion timeline https://github.com/blakeblackshear/frigate/assets/14866235/4e8320f7-9ae3-409b-8dfc-a4142774145c

[EreNDern]

Also worth pointing out that the point of the timeline is dragging and seeing things change on the camera. I think a full explanation of what is trying to be viewed using the timeline and why that is is currently difficult would be good so we can hopefully understand what you are meaning.

I meant that sometimes I have trouble hitting the time selection line on my phone (ip13p), especially when I have one eye covered or closed. It's not a technical issue, just that the line is small and can be hard to grab. Overall, selecting the time in its current form requires some precision to hit the line, but when the entire timeline is movable, it's easy to grab

[EreNDern]

Example of motion timeline https://github.com/blakeblackshear/frigate/assets/14866235/4e8320f7-9ae3-409b-8dfc-a4142774145c

In the video you show how you move the timeline once you've grabbed it, but I meant that I'm having trouble grabbing it in the first place.

[hawkeye217]

You're not trying to grab the thin red line to move it - that line is responding to your finger's movement on the timeline after you tap and grab the larger "pill" with the time on it. To make it easier to see what time you're selecting, the "pill" displays at the top of the screen on mobile devices. Watch this as you drag your finger on the timeline. This is how you scrub and select a time.

As I already mentioned, this is different UX from your timeline example. They behave very differently.

I think that may be all you're getting tripped up with.

[EreNDern]

You're not trying to grab the thin red line to move it - that line is responding to your finger's movement on the timeline after you tap and grab the larger "pill" with the time on it. To make it easier to see what time you're selecting, the "pill" displays at the top of the screen on mobile devices. Watch this as you drag your finger on the timeline. This is how you scrub and select a time.

As I already mentioned, this is different UX from your timeline example. They behave very differently.

I think that may be all you're getting tripped up with.

In general, I was referring to the fact that when I try to drag a line or "pill" (it doesn't really matter, as I think they have similar hitbox sizes), I can't simply hit them because they are quite small. In the solution I showed, it's easy to do because the entire timeline is moved. If it's not a technical problem, I think it's a better solution than the previous one.

I don't understand if using the solution I showed for would make it worse or less functional? Of course, I understand that this is a different solution, but I think it might be a better one.

[EreNDern]

To help you better understand what I mean, let me give you an example. Try scrolling through time without looking at the timeline. It may seem like a pointless example, but when I want to find something in a recording, I use this function and look at the recording at the moment I scroll through time. And when I release the line to watch the recording, I will have to grab it again to move on, which can be quite frustrating.

[hawkeye217]

It's just a different UI/UX than the timeline you're used to.

I can easily grab the handlebar, move it toward the bottom of the timeline, the timeline begins scrolling, and the previews play. If I want to stop, I don't release my thumb from the screen but just move it upward. Scrolling stops, previews stop playing, handlebar is still in view and the time is still displaying at the top of the screen.

[EreNDern]

Of course, I know that this is a completely different solution, but I think it is better. If you can, install the DMSS application and try it. I don't think you need to connect any cameras or do anything to see how the timeline works.

[hawkeye217]

We appreciate your feedback! We'll continue to take in feedback for this new UI and see how things go.

[Majestic7979]

Why can't we have what Nest did on their browser version? It's perfect. It's ok to imitate if users end up happy. It's not always necessary to invest so much effort into building something new. Imagine if everyone tried to reinvent a light switch!? You can change the design but the functionality is the same, flick down = off, flick up = on. Google invested a lot of money on user research to come up with that system and it really works well. Frankly if Google weren't forcing a cloud service/subscription I'd be happy to use their cameras, but I need it local, it's faster and private. You can zoom the timeline on Google Nest (home.nest.com) interface to get more precise scrubbing or exporting. I personally just want that in Frigate.

[NickM-27]

The timeline isn't different just for arbitrary reasons. The timeline fits the way we think is most efficient, the Nest UI does not work the same way that frigates does. Zooming will be coming, hence this feature request.