MySpeed 1.1.0 Redesign: What are your thoughts?

[gnmyt]

With the new 1.1.0 version, I want to address some issues I've had with the UI and want to gather some feedback from you to see what you think about it. Please note that these changes are not final and are subject to change.

View switching

You might already know that there are two different views in MySpeed. The "test overview" and "test statistics", which show the tests either in a list or as "widgets".

Currently, you need to go into the dropdown and choose "Change view" to switch the new view. I personally switch the view very often so I want to introduce a page switching system at the top of the page instead of one hidden in the dropdown.

Container transparency

As you might have already seen in the screenshot, I switched the container background to a darker color instead of a transparent one. It took me a while to get used to but overall I think this makes the containers cleaner. I also think that it fits better to the rest of the page.

Scroll to load

The next problem is the list overview itself. The current state is that you can only see tests up to 2 days here. If you wanted to go older than that, you would need to view averages. Also, if you chose an schedule like every minute, this gets really inefficient since it loads so many tests that the page begins to lag.

To fix this, I want to only load the tests that are visible. If you would want to load more than that, just scroll down. It will then automatically load more results.

I also want to add a little tooltip at the top that shows the current date when scrolling since it could get confusing which day the tests belong to when you scrolled too much.

The statistics page

I also want to introduce some changes in the Statistics page. First of all, the widgets now also have the background like in the test overview. I wanted to completely get rid of the "Set period" dropdown item and rather have a time chooser at the top left.

I also want to introduce an "Edit mode", which allows you to add, delete and change the order of the widgets on the page.

To make the statistics more useful, I decided to make the widgets go fullscreen when clicking them. This could look like this:

Analyzer

As you might have seen at the top of the page, there will be a new "Analyzer" page. However this will be another discussion since I want to focus this thread on the new page design.

[CrazyWolf13]

Looks absolutely amazing!!

Just out of curiosity, what is this UI written in?

Is there some sort of Prometheus statistics planned?

[gnmyt]

Thank you. The UI of MySpeed is written in React. However, this concept has been made in Figma.

MySpeed also already has an Prometheus endpoint. Currently, you can find documentation about it in PR #687, but I will make sure to add a more detailed documentation on https://docs.myspeed.dev soon.

[CrazyWolf13]

@gnmyt Oh I see, thanks yeah absolutely love the design!!

Oh that's awesome, thanks!

[adm2k]

These look like excellent updates!

I do have a question, is there a way to get a simple notification (email) when download speed drops below a specific level and/or ping is above a specified level?

Many thanks!

[CrazyWolf13]

That would be indeed a very nice feature request, possibly this could be some sort of general protocol like shoutrr to support ntfy.sh ?

[gnmyt]

Thanks. Support for ntfy and email is already planned (#711). Notifications about a certain threshold will also be part of the "Analyzer" update, which basically tracks network speeds for a certain amount of time and displays them on a separate page. However, this will be a different discussion.

[CrazyWolf13]

Is it possible to set custom time durations?
Like cronjob schedule or so?

As for me personally three times a days is a bit too much. I'd prefer like once a day or so.

[gnmyt]

Yes, you can set a custom duration with cron expressions. Just go into the settings > Set frequency > Set manually. If you need help with cron expressions, you can use this website.

[CrazyWolf13]

Oh that's awesome, sorry I did not see that.

Thanks!

[mguilherme]

that looks awesome, I'm trying a new internet provider and this is really awesome, that would be great if you could add a light mode, I created an issue for that: #795

[Kristoffeh]

This is the first time in my lifetime i have seen someone request light mode.

[Kristoffeh]

While i am not much of a fan when it comes to radial graphs, primarily because they need interaction in order to understand what they're saying. Regardless, this does look really good.