Some ideas for the web interface of Jellyfin

#1

Hello there,
i had some ideas i wanted to share with on how to improve the web interface. I know that Jellyfin is in a relatively early state and that development takes its time but I still wanted to share my Ideas as I think they would be actually kind of usefull for a lot of you! (BTW these Ideas apply for future Apps like a TV player or PC player as well)

Let´s start with one of my biggest dislikes with the current interface. The “My Media” headers are so small. I have put some effort into the pictures I chose for my libraries and they appear so small. I want to see more of the picture because it really “decorates” the dashboard. Here are some examples I made mockups of!


In this picture you can see big headers which in my humble opinion are beautiful to look at.


Right here you can see how it reveals the name of the specific library when hovering on the banner with the cursor.


Just another example of it.


Just a medium sized version where it shows 4 elements in one row instead of 3. The bigger one would be best suited for a TV app!

The following picture shows two additional new element types.


First of all you can see that the three dots next to “My Media” is gone and instead there is a little pencil in the top right corner where once the magnefying glas was.
The search bar has been moved to the top of the dashboard as a new Element (of course you would be able to disable it with the newly added pencil in the top right). You could also put the searchbar at the bottom just like the other elements like “My Media” or “lately added” can be moved up and down.
At last you can see the new tab “Other users activities” (should have named it “recent activities”…). This new element allows you to see your family members recent activities! It shows what they saw, when they saw it and there is still some room left for more (ideas in the comments! :slight_smile: Maybe which device they watched it on? )
The last element would be very customizable as well. Every user can set their activities private or public. If it is public everyone can see the activities. If it is private only the user and the admin can see it (admin can see it to monitor what the kids are watching for example).

For those who are interested:
The woman beneath “Wife” is Aimer which is a japanese singer. Also Paul Simon is a weeb and John Denver only listens to his own music lol. (this is entirely made up)

#2

That’s a great look!

I’ve brought it up to some of our contributors, and while there are some small potential concerns, it could work.

If you wanted to, you could start making the visual portions of the theme even today :wink:

The user activity part would likely have to wait until a much later release though.

1 Like
#3

It´s great to hear that it could work. Someone in the reddit post also mentioned that it would be cool if you could choose if the labels are still shown beneath the banner or not. Also a slider to change the banner size to make it as customizable for every display as possible.
Unfortunately i´m no good at anything related to webdesign. I cannot implement it unfortunately. But I guess it is not so hard to learn? I have graduation next week so after that I can actually look into it and try to implement it. Keep up your good work as well devs!

#4

hover over is terrible for mobile devices. maybe something permanent? Maybe smaller ?

1 Like
#5

Ohhh that looks fanceeey! I would consider this as very useful for the TV or mobile app! For dekstop i prefer the hover mode though. I will do a final mockup these days where I bundle all my ideas and will make one for each device. I will implement yours as well if you dont mind

1 Like
#6

please use whatever you find useful.

1 Like