[Enhancement] Redesigned video player "You're watching" to add new modern sidebar and video player UI/UX redesigned too. (Modified images added) #152

New issue

Open

opened 2025-09-29 11:59:17 +00:00 by AdityasahuX07 · 3 comments

AdityasahuX07 commented 2025-09-29 11:59:17 +00:00 (Migrated from github.com)

Copy link

The "You're watching" panel is very boring and static instead of this add a sidebar for see info while playback.

When you started watching any content only info required to see the content release year, age rating, imdb rating, synopsis and genre.

I redesigned the info sidebar add this in pace of You're watching section.

Current "You're watching" page looks like:

Current "Video player" looks like:

[Modified Images]

The redesigned sideber for this feature:

1. The improved UI video player - (a) For title of content only title name will show
   (b) New "Previous and next button" added for toggle tv shows episodes.
   (c) New Playback "Speed" control added
   (d) Remove "2025 via NetMirror (Netflix) - 1080p" info because of repetition.
   (e) New "i" button addeed to see stats like video qulilty, bitrate, stream speed, audio codec, all stats for nerds.
   (f) New "<" expand button added to open sidebar(new).

Redesigned video player screenshot,

2. The info Sidebar - (a) On pressing "<" this sidebar open with slide animation form right to left.
   (b) It show all required info that need while you started watching.
   (c) For Tv shows scrollable episodes list available to switch episodes easily.
   (d) Benefits: No need to Google anything all info on one page.

Redesigned sidebar screenshot,

3. The Speed Control button - (a) Used to change playback rate of speed.
   (b) Benefit: To watch Movie/shows faster in less time.

4. The "i" Button - (a) As we removed "2025 via NetMirror (Netflix) - 1080p" info for that access I added this.
   (b) On taping "i" button new stats window open in the center of the screen.

Redesigned "i" button menu window,

**The "You're watching" panel is very boring and static instead of this add a sidebar for see info while playback.** When you started watching any content only info required to see the content release year, age rating, imdb rating, synopsis and genre. I redesigned the info sidebar add this in pace of You're watching section. **Current "You're watching" page looks like:** <p align="center"> <img src="https://github.com/user-attachments/assets/2acce576-6583-4994-b211-495efce7ab48" width="2340" height="1080" alt="Description"> </p> **Current "Video player" looks like:** <p align="center"> <img src="https://github.com/user-attachments/assets/eed5bc16-bf95-47bc-b003-455ba24c9889" width="2340" height="1080" alt="Description"> </p> [Modified Images] ### **The redesigned sideber for this feature:** 1. The improved UI video player - (a) For title of content only title name will show (b) New "_Previous and next button_" added for toggle tv shows episodes. (c) New Playback "_Speed_" control added (d) Remove "_2025 via NetMirror (Netflix) - 1080p_" info because of repetition. (e) New "_i_" button addeed to see stats like video qulilty, bitrate, stream speed, audio codec, all stats for nerds. (f) New "_<_" expand button added to open sidebar(new). **Redesigned video player screenshot,** <p align="center"> <img src="https://github.com/user-attachments/assets/ac08cf41-819a-4a74-86f5-305543ae3e21" width="2340" height="1080" alt="Description"> </p> 2. The info Sidebar - (a) On pressing "_<_" this sidebar open with slide animation form right to left. (b) It show all required info that need while you started watching. (c) For Tv shows scrollable episodes list available to switch episodes easily. (d) **Benefits:** No need to Google anything all info on one page. **Redesigned sidebar screenshot,** <p align="center"> <img src="https://github.com/user-attachments/assets/ca281ea5-1d32-401d-b407-28d9519de99d" width="2340" height="1080" alt="Description"> </p> <p align="center"> <img src="https://github.com/user-attachments/assets/c301c804-8458-45e8-b5b9-7e7cad07d034" width="2340" height="1080" alt="Description"> </p> <p align="center"> <img src="https://github.com/user-attachments/assets/2f445771-374c-468a-ae99-0a1f71a24726" width="2340" height="1080" alt="Description"> </p> 3. The _Speed_ Control button - (a) Used to change playback rate of speed. (b) **Benefit:** To watch Movie/shows faster in less time. 5. The "_i_" Button - (a) As we removed "_2025 via NetMirror (Netflix) - 1080p_" info for that access I added this. (b) On taping "_i_" button new stats window open in the center of the screen. **Redesigned "_i_" button menu window,** <p align="center"> <img src="https://github.com/user-attachments/assets/014579d6-1b48-4fda-b515-07b54f009d53" width="300" height="295" alt="Description"> </p>

👍 3

qarqun commented 2025-10-08 08:22:33 +00:00 (Migrated from github.com)

Copy link

I think for player navigation, better follow the Streamio style UI. it has bigger forward and backward something like this.
Also, we can follow the "Stremio" style episode navigator in the player UI.
We can put := button on the bottom like this (but only for Series/TV Shows)

When click, for Tv shows/Series scroll-able episodes list available to switch episodes easily. It also have tick mark for watched episode.

Another thing, for Tv shows/Series best if can put the >| Next Episode button (This taken from Cloudstream) so we can easily navigate to next episode easily..

For playback speed, it's best if can have popup to choose speed. The "pop up" UI something like this.

For Subtitles, nice to include the country flag something like this:

I think for player navigation, better follow the Streamio style UI. it has bigger forward and backward something like this. Also, we can follow the "Stremio" style episode navigator in the player UI. We can put := button on the bottom like this (but only for Series/TV Shows)  When click, for Tv shows/Series scroll-able episodes list available to switch episodes easily. It also have tick mark for watched episode.  Another thing, for Tv shows/Series best if can put the >| Next Episode button (This taken from Cloudstream) so we can easily navigate to next episode easily..  For playback speed, it's best if can have popup to choose speed. The "pop up" UI something like this.  For Subtitles, nice to include the country flag something like this: 

AdityasahuX07 commented 2025-10-08 08:44:37 +00:00 (Migrated from github.com)

Copy link

I think for player navigation, better follow the Streamio style UI. it has bigger forward and backward something like this.
Also, we can follow the "Stremio" style episode navigator in the player UI.
We can put := button on the bottom like this (but only for Series/TV Shows)

When click, for Tv shows/Series scroll-able episodes list available to switch episodes easily. It also have tick mark for watched episode.

Another thing, for Tv shows/Series best if can put the >| Next Episode button (This taken from Cloudstream) so we can easily navigate to next episode easily..

For playback speed, it's best if can have popup to choose speed. The "pop up" UI something like this.

For Subtitles, nice to include the country flag something like this:

What is the name of app in 3rd & 4th screenshot

> I think for player navigation, better follow the Streamio style UI. it has bigger forward and backward something like this. > Also, we can follow the "Stremio" style episode navigator in the player UI. > We can put := button on the bottom like this (but only for Series/TV Shows) > >  > > > When click, for Tv shows/Series scroll-able episodes list available to switch episodes easily. It also have tick mark for watched episode. > >  > > > > Another thing, for Tv shows/Series best if can put the >| Next Episode button (This taken from Cloudstream) so we can easily navigate to next episode easily.. > >  > > For playback speed, it's best if can have popup to choose speed. The "pop up" UI something like this. > >  > > For Subtitles, nice to include the country flag something like this: > >  > > > What is the name of app in 3rd & 4th screenshot

qarqun commented 2025-10-08 10:59:28 +00:00 (Migrated from github.com)

Copy link

@AdityasahuX07 #

What is the name of app in 3rd & 4th screenshot

3rd screencap --> https://github.com/recloudstream/cloudstream
4th screencap --> donkey[dot]to

@AdityasahuX07 # > What is the name of app in 3rd & 4th screenshot 3rd screencap --> https://github.com/recloudstream/cloudstream 4th screencap --> donkey[dot]to

Sign in to join this conversation.

No Branch/Tag specified

Branches Tags

main

master

lean

pr-202

revert-153-main

tv

appstore

plugintest

ios

1.2.6

1.2.5

1.2.4

1.2.3

1.2.2

1.2.1

1.2.0

1.1.1

1.1.0-hotfix

1.1.0

1.0.0

0.6.0-beta.11

0.6.0-beta.10

0.6.0-beta.9

0.6.0-beta.8

0.6.0-beta.7

0.6.0-beta.6

0.6.0-beta.5

0.6.0-beta.4

0.6.0-beta.3

0.6.0-beta.2

0.6.0-beta.1

0.5.3

0.5.2

0.5.1

0.5.0

0.4.4

0.4.3

0.4.2

0.4.1

0.4.0-alpha

v0.2.0-alpha

Labels

Clear labels   

bug

Something isn't working

  

documentation

Improvements or additions to documentation

  

duplicate

This issue or pull request already exists

  

enhancement

New feature or request

  

good first issue

Good for newcomers

  

help wanted

Extra attention is needed

  

invalid

This doesn't seem right

  

question

Further information is requested

  

wontfix

This will not be worked on

No labels

bug

documentation

duplicate

enhancement

good first issue

help wanted

invalid

question

wontfix

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: Creepso/NuvioStreaming_backup_24-10-25#152

No description provided.