[APP][Pro] Dashboard Studio - A completely free-form dashboard designer

YYYYYEEEEEEEEEEEEEESSSSSS!!!

Thank you for the many new functions and improvements. I even recognize some of them :grinning_face:
A lot of features to test the coming weeks.

Good morning, first of all, the new version looks fantastic. I imported my dashboard into the new version (my dashboard was originally built with version v1.7). I currently have 11 pages, but the new sidebar only shows 4 of them.

Additionally, all the block colors have changed after importing to V2.0. They were originally set to match the background color, but now they have turned purple. Is there a way to change this back for all blocks at once, or does it have to be done individually? Please see the attached screenshot.

One more question: I’m not sure if this is possible, but can I add a button in the dashboard that opens an app on my iPad in an overlay? That way, I could control my amplifier directly from there.

Hi,
I like this app en use the dashboard on my Amazon Echo Show 5.
But I was wondering if it is possible to get a dark them loaded during night time? For example from sunset to sunrise.

Wow, this looks promising!! :smiling_face_with_three_hearts:

I don´t have the time right now to test a lot, but the first thing i noticed on the automatic migration is that ´container´ background has been reset.

Furthermore, it first seemed that the dashboard was hidden behind the edit-menu when opening the editor, but on the second try it looked fine.

Response on the car-screen is a lot slower then before, might need to switch to viewer-only.

First impressions of Dashboard Studio v2.0 on Windows 11 using the latest version of Chrome on a high-performance pc:
Wow, this takes an already highly comprehensive dashboard app to the next level.

Initial observations:

  • Screen flickering occurs while the help screen is open. How to reproduce: Press the question mark in the main menu. Widen the newly opened documentation screen by dragging it to the left. Search for “Audio” within the documentation. Select the first audio-related result found; the documentation screen automatically scrolls down, causing parts of the documentation to become unreadable and the main screen to flicker.
  • The interface feels less responsive during configuration, likely due to the increased functionality and animations. If disabling animations resolves this, snappy performance would be preferable.
  • The colors in the “Container Style” section for switches cannot be modified; the colors are fixed. Some theme colors from v1.x have changed following the conversion from v1.x.
  • The mouse cursor stutters during movement (an issue that also existed in v1.x); this may be related to the large number of components in the 1.2MB dashboard metadata.

Thanks. By default, it is just a single row of buttons. What does not fit simply will not fit, but you can drag the side to make room for more buttons:

You can also undock it, reshape it, and place it anywhere you want.

No need to do this manually. It is probably related to the other container issues mentioned, so I will fix this. Keep in mind that you might need to open a pre 2.0 dashboard again. If you made changes and saved them to the latest 2.0 version, those changes will unfortunately be lost. You can download an older version via the “load from homey” dialog.

Could you send me the dashboard so I can inspect this using this form? Thanks!

You can dynamically adjust the theme colors (see link), but you cannot dynamically change the whole theme yet. I will implement this in the next version :+1:

If this happens again, could you take a screenshot of the whole browser window and send it over?

I have optimized the viewer so it should be much more responsive than the previous version. I also made some performance tweaks to the editor, though it also received a whole truckload of new features :sweat_smile:

Wow, I can replicate that. That is definitely a serious bug because the whole dashboard breaks. It seems to happen in Edge as well, but not in Firefox.

I will see if I can optimize things further later on. Also, does the UI become snappier if you disable all extensions and plugins in the browser? Some plugins like ad blockers constantly check JavaScript execution to detect whether it contains advertisements. Dashboard Studio code is entirely JavaScript, which might bog down the UI significantly. If you notice an improvement, just turn off the ad blocker for Dashboard Studio, since it does not have any advertisements anyway.

This will be fixed in the next version.

SR-1C2DC6B5

Thank you :folded_hands: :+1:t2:

A few more v2.0 impressions (in random order):


  • Memory usage has increased from 85 MB (v1.7) to 115 MB (v2).
  • The new confirmation feature is great and offers extensive configuration options.
  • Switching screens on a quite fast Android Samsung Tab S10 takes 50% to 100% longer (an impression, not based on measurements) in viewer mode; could this be related to “Homey live values ​​instant synchronization on reconnect”?
    Another change in behavior: when switching from the DS editor tab in Chrome to another tab and then back to the editor tab (same page, no dash restart), the “Dashboard loaded/refreshed” Advanced flow card triggers again—something that didn’t happen before. My dashboard is wall-mounted, so performance is important.
  • Unchecking an option in the Widget Preset Editor removes it from the list. The “All” button can be used to make the option visible again. Wouldn’t it be more user-friendly to simply uncheck the option without removing it from the list?
  • What are the best practices for using widget presets and widget defaults? There is some overlap in these functions.
  • This doesn’t open a help screen (yet): The widget label in edit mode now features a small “?” that takes you directly to the widget documentation.
  • It took quite some time to figure out how to show the Quick Toolbar again, after using the top X (=close bar) button of this bar.

Concerning the background of the container. I tried changing it back to my desired black on black, but unfortunately the colors can’t be changed.
If I change it in the general ‘Container Style’, I can change it. Fine for me, but if you want different containers to have different backgrounds…

Strange enough, in another dashboard the colors migrated just fine…

Can i send you the ‘export’ of the widget? I can’t upload a JSON here it seems…

You can send files to me using this page Just paste the ticket in the message over here. But no need for this Bert, I’ve already solved this problem including several performance issues. I shall try to push a next test version today.

There should be no difference between the Homey Memory consumption between V1 and V2. There are no significant changes to the code running on the Homey side. All the dashboard stuff is running inside the browser window.
115 is quite a lot though, my instance only uses 42MB, but I regularly restart it with the testing, and Homey likes to cache the memory of longer running apps. I haven even reduced the used storage space by approx 10MB compared to V1.

I wrote the preset editor to make my live easier to create presets and edit them in bulk. Left you can select the preset you would like to edit, right you can edit them quickly. Select whole rows to change the whole selection at once etc. So if you do not want to edit it (so uncheck it), it should not be visible in the right panel right? I think I do not understand your reasoning completely.

The presets are mainly because I wanted an easy way to configure a widget. For example changing a round gauge to a horizontal gauge required to change approximately 4-5 settings before it looked correctly. But I can also understand users made a particular style that want to create a preset out of it to apply on other widgets. But yes, if all widgets should look te same (like all round gauges) it is way more logical to change the widget default settings.

Yes, discovered that also. I accidently broke the code.

Yeah, the setting is in the new “Editor environment”. It is described in the documentation though, don’t know a more logical location for this setting. Don’t think it is important enough for a special button for it at the top.

Anyway. solved a lot of performance problems today, so please wait until I release the next version that has solved most of the reported bugs.

NEW TEST Release: Dashboard Studio V2.0.2

  • New: Dashboard Environment - Added theme dropdown with live topic binding to switch themes directly from MQTT or Homey data
  • Improved: Performance across the board - Significantly faster dashboard page switching and widget selection in Edit Mode, plus snappier responses for checkboxes, dropdowns, color swatches, and font or icon selectors
  • Fixed: Documentation panel - Resolved white flashes over the dashboard when scrolling help content in Chromium browsers (Chrome, Edge)
  • Fixed: Widget edit label help - Clicking the “?” on a selected widget now correctly opens its corresponding help page
  • Fixed: Docked Quick Toolbar - Corrected the rounded bottom edge and adjusted spacing when the toolbar contains many buttons
  • Fixed: Color swatches - Widget colors such as Container background and border can be changed again
  • Fixed: Various minor bug fixes and stability improvements

New: Dashboard Environment - Added theme dropdown

In the dashboard environment is now a theme dropdown that can be made dynamic. If you send a theme name to that topic, it switches the theme dynamically.

I would love to see a picture of the dashboard in use (so not a screenshot). I have a small gallery on the website, but would like it to fill it with way more uses from users

Fixed: Color swatches

This has been fixed. Dashboards should look the same again. (if not, please let me know)

Improved: Performance across the board

@Bert_Onraedt and @Amersfoort I think most of the performance issues are resolved now. In my testing it is even faster than V1. (You can compare it against V1 over here)

Fixed (that was a hard one :sweat_smile: and only happend on chromium browsers (edge and chrome)


When I add a topic to the text content, the topic’s value is not displayed.

What a huge improvement in performance v2.0.1! Yes, it seems faster than v1.
The initial startup time (after a full automatic update) seems to take a bit longer, but that is only during the start. Is it caching or loading all the pages (~40 in my case, “teleporting” pages included)?

Could you briefly tell, in non-technical terms, why the performance is so much better now?

Could you indicate where performance issues might still be expected?

I’ll explore further tomorrow.

This indeed seems to be a very impressive update altogether!
Currently no time to test or play around, but thanks for the inclusion of the formulas in the text widget; that looks very promising, and how I hoped it to be! Also, looking forward to V78 of Dashboard Studio in 2099 :wink:

Hi Michel,

Thanks for this major upgrade to Dashboard Studio!

To be honest, I was a little anxious about jumping in at the deep end, but so far everything appears to work just as it did in the regular version. As I’m still actively working on my dashboard, which has meanwhile grown to almost 30 separate tabs, I’ll let you know if I come across anything that might need attention.

Of course, I still need to get used to the new layout and controls, but I’m sure that will just be a matter of time.

So far, migration successful! Thanks again for all your hard work and persistence in making an already great app even better.

Best regards,
Jan

My guess is that you have added spaces inside the topic. See documentation about binding topics and custom topic names.

That was mostly because I used to update every setting whenever any single setting changed. I tried refining the updates to focus only on what actually needs to change, but sadly I just ran into a couple of bugs. For example, when you enable X/Y labels inside the graph, the hidden settings for it do not show up [EDIT: Fixed in 2.0.2, already silently published]. Selecting widgets and updating pages now have a much smarter implementation. Also, that bug where the help file flickered turned out to be a Chromium issue caused by layering panels with frosted glass effects.
And the help flickering file had to do with

An old issue that has resurfaced in version v2 (see link above).
The correct value is displayed when switching to another page and back again.

Please refresh my memory about this problem because I try to re-create it but it is working fine :sweat_smile: :

I made a quick setup where I connected the (local) output topic of the switch to the image widget’s “Visibility” setting and the text setting of the text widget. It seems to work as expected. When I turn off and on the switch I see the image hide and show, and the text widget is true and false.

Please replace lamp-5 in the Snippet below with your own lamp in switch and label.
Clicking the lamp icon changes the true/false status, but the label will not change until a page refresh (going to other page and back to the original one).

{
  "snippetHeader": "Dashboard Studio Snippet",
  "snippetType": "widget-snippet",
  "snippetFormatVersion": 1,
  "version": "2.0.2",
  "source": {
    "dashboardName": "HomeDashV24v202",
    "page": 60,
    "createdAt": "2026-09-15T09:24:29.375Z"
  },
  "master": {
    "currentPage": 60
  },
  "widgets": {
    "switch_888016069": {
      "type": "switch",
      "overrides": {
        "x": 160,
        "y": 1390,
        "width": 130,
        "height": 170,
        "zIndex": 13,
        "page": "60",
        "buttonLabel": "",
        "outputTopic": "lamp-5/onoff",
        "onPayload": "true",
        "offPayload": "false",
        "extraOutputTopics": [],
        "icons": {
          "on": {
            "source": "custom",
            "builtin": "",
            "weight": "regular",
            "customUrl": "https://api.iconify.design/mdi/lightbulb-outline.svg",
            "tintImage": true,
            "color": "@background",
            "size": 30,
            "offsetY": 0,
            "offsetX": 0
          },
          "off": {
            "color": "@surface",
            "size": 30,
            "offsetY": 0
          }
        },
        "style": "image-only",
        "showIcon": true,
        "bevel": true,
        "scale": 4,
        "outlineWidth": 0,
        "metaName": "Screen slaapkamer",
        "iconColOn": "#ffbf00",
        "iconColOff": "#80b3ff",
        "iconColHover": "#c0b980",
        "padding": 0,
        "fontFamily": "'Roboto', sans-serif",
        "typography": {
          "buttonLabelOutside": {
            "fontFamily": "'Exo 2', sans-serif",
            "fontSize": 20,
            "textAlign": "center",
            "textTransform": "none",
            "bold": false,
            "color": "#7eb3ff",
            "colorOff": "#7eb3ff",
            "offsetX": 0,
            "offsetY": 10
          },
          "buttonLabelInside": {
            "fontFamily": "'Exo 2', sans-serif",
            "fontSize": 35,
            "textAlign": "left",
            "textTransform": "uppercase",
            "bold": false,
            "color": "@text",
            "colorOff": "@text",
            "offsetX": 0,
            "offsetY": 0
          },
          "groupLabel": {
            "color": "@surface",
            "fontSize": 25,
            "offsetY": 40,
            "fontFamily": "'Exo 2', sans-serif"
          }
        },
        "buttonContentInset": 0,
        "mode": "toggle",
        "container": {
          "show": false,
          "background": {
            "startColor": "@surface",
            "startOpacity": 0,
            "endColor": "@surface",
            "endOpacity": 0,
            "angle": 135
          },
          "glow": {
            "enabled": false,
            "color": "#ffbf00",
            "radius": 20,
            "opacity": 100
          },
          "border": {
            "color": "#FFFFFF",
            "width": 0,
            "opacity": 15,
            "cornerRadius": 0
          }
        },
        "backgroundColorOn": "#ffbf00",
        "backgroundColorOff": "#3385ff",
        "backgroundColorHover": "#ffbf00",
        "thumbColor": "#ffffff",
        "enableGlow": true,
        "buttonRadius": 0,
        "buttonLabelPosition": "inside_bottom",
        "state": false
      },
      "bindings": {
        "state": "lamp-5/onoff"
      }
    },
    "label_3939": {
      "type": "label",
      "overrides": {
        "x": 300,
        "y": 1450,
        "page": 60,
        "metaName": "New Label",
        "width": 89,
        "height": 60,
        "text": "",
        "typography": {
          "label": {
            "fontSize": 30
          }
        }
      },
      "bindings": {
        "text": "lamp-5/onoff"
      }
    }
  }
}

EDIT: the solution was anti-bounce related.