V3 interface changes - controls and live preview

Hello Pixelblaze folks!

I’m making some tweaks to the UI in V3, and I’d love some feedback. Let me know what you think!

The first image shows off most of the changes.

  • Add a render indicator to the left of the preview: 1D, 2D, 3D, or :warning:if you have e.g. a 2D only pattern selected with no pixel map and nothing is rendering. I hope to improve on that a bit more too - this seems to be a common source of problems.
  • Move brightness to this bar to reduce clutter in menu, and for other reasons (see below)
  • Move pattern controls to this bar as well, instead of inline in the pattern list. Since it’s now right by the preview you’ll be able to see the effects on the live-preview more easily.

This lets you see and access controls a bit more easily when working with playlists as well, which can be on top of the pattern list for smaller screens. BTW if you haven’t seen playlists yet, its another V3 feature.

I also wanted the preview header visible when you scroll down on the page, and with both brightness and pattern controls moved to this header, you can now get to everything you need when you are scrolled down.

This works in the editor as well, controls are no longer in the sidebar, and you can see the preview + controls even if you are scrolled down a bit on the page.

Either loading a pattern or editing editor text regenerates the controls in the shared header (it doesn’t make sense to try to have both) and it should always match what’s running.

Again I’d love some feedback. Let me know what you think!


Looks good. Might be nice to have name of pattern in header as well.

I think it’s great!

Maybe also throw the (!) symbol up if a sound pattern is chosen but the sound board is not attached/detected?

Perhaps there could be a way (under settings?) to have the main page be “simplified controls” only
What I mean is visiting http://device_IP would show only Saved Patterns and Brightness slider (and nothing else)
Then if you visit http://device_IP/advanced it would show everything, or if you visited /settings you could toggle the “full page” back on.

The idea is giving less options for kids or grandma to play with/change/mess up.

Bonus things I’d appreciate:

  • If any pattern is chosen on the “simplified controls” page, and nothing is else is picked after 5 / 10 / 15 / 30 minutes, then return to whatever config is stored in Sequencer/Playlist again. The idea here being that kids use their phone to pick a pattern, then get bored or chase a neighborhood friend, and then the swingset/playhouse LED lights are stuck on “techo rave rainbows” (which dad dislikes) for the rest of the evening.
  • Option for if any pattern is chosen via webhook, and then 1 / 2 / 5 / 10 / 15 / 30 min. passes, return to Sequencer/Playlist again. This is useful when a home automation system forces a pattern as a notification (like all LEDs yellow when garage was opened, or all LEDs red when sleeping kid’s room motion detector discovers an escape, or all LEDs green when the laundry is done) but after awhile I probably don’t care anymore, so return to Sequencer/Playlist.

You have that now, there’s an option to lock things down to a harmless simple UI. You can also rebrand Pixelblaze (slightly) in case you are using it as just an LED controller as part of an install. Load the page with ?setup and there’s an advanced options tab. From there you can turn it on or off. Reload without ?setup and you’ll see it. You can always get back in if you need to, it’s not secure, but keeps accidents from happening.

I like the idea of the idle playlist trigger. I might add an API so that a pattern could resume the playlist or advance to the next pattern, that would let you jump in a notification/effect pattern like you describe, and resume from the notification pattern when the animation was complete.


http://device_IP/?setup is awesome, thanks!

1 Like

Can you make it so you can use the UI to set timers both AM AND PM so I can have the lights turn on at night and turn off in the morning?

1 Like