polimediaupv / paella-ethz

Educational Community License v2.0
1 stars 2 forks source link

Design: Adapt the -/+ 10s buttons #13

Closed oas777 closed 1 year ago

oas777 commented 1 year ago

Compared to https://tinyurl.com/2gox7lms, they are too large and not aligned horizontally. Please also check the font is the same as other buttons in the control bar. play

miesgre commented 1 year ago

@oas777 We updated the player. Can you test it works as expected? Demo: https://polimediaupv.github.io/paella-ethz/?id=belmar-multiresolution-remote

oas777 commented 1 year ago

Almost... the "Forward 10 seconds" button is cut off on the right side. And maybe you could align the numbers "10" with the playback rate number horizontally?

10seconds
oas777 commented 1 year ago
10seconds
miesgre commented 1 year ago

Almost... the "Forward 10 seconds" button is cut off on the right side.

10seconds

It's a bug in Windows, in OSX works correctly. We will try to fix it.

And maybe you could align the numbers "10" with the playback rate number horizontally?

10seconds

The time text is aligned to be vertically center and the back/forward icons are aligned in the same size and positions as the rest of the icons (play, volume, etc...).

In Lisa's designs the text is not aligned: Captura de pantalla 2023-02-27 a las 11 21 32

But, If you want it aligned we can:

  1. Down the time text: Captura de pantalla 2023-02-27 a las 11 08 05

  2. Up the back/forward icons. But the there will not be aligned to the rest of the icons: Captura de pantalla 2023-02-27 a las 11 06 11

oas777 commented 1 year ago

You're right, Lisa didn't align them, but I like the second option better: image What do you think? What does Carlos think?

miesgre commented 1 year ago

I prefer the lisa's design. The second option, the icon is not aligned inside the button and I find it annoying. But is'a a personal opinion. 221567476-5257a6ac-33d0-4021-b1e0-e8992e53858b

@turro What do you think?

turro commented 1 year ago

I am not a visual design expert, but I like more the aligned numbers like Olaf said ;-)

miesgre commented 1 year ago

I aligned the text as second option. Demo: https://polimediaupv.github.io/paella-ethz/?id=belmar-multiresolution-remote

miesgre commented 1 year ago

I aligned the text as second option. Demo: https://polimediaupv.github.io/paella-ethz/?id=belmar-multiresolution-remote

It should also fix the cut off text in windows

oas777 commented 1 year ago

Looks, good, thanks.