Blue Iris UI3

[jmh139]

I guess I use so many different machines during the day I never noticed this. Thanks! Jay

 

[djton99]

Should clips recorded in h264 .mp4 playback in the Clip window?

I'm not talking about active clips. I know that doesn't work, but already finished clips. (They work if downloaded and played with VLC)

On Beta 22

 

[bp2008]

Blue Iris requires codecs for its own playback of mp4. I suggest downloading K-Lite Codecs from here so you don't have to deal with toolbars and other crap they try to package into it: Ninite - Install or Update Multiple Apps at Once

 

[Josh Parsley]

Is there a way to embed UI3 into the blueiris.pro/go server?

 

[bp2008]

Is there a way to embed UI3 into the blueiris.pro/go server?

The what server?? That URL just tells you your public IP address!

 

[Josh Parsley]

The what server?? That URL just tells you your public IP address!

Oh, LOL, okay. I thought it was some sort of hand off, since the url ends with a portion your product key. I hadn't looked into it further than just pulling the URL up and seeing it work.. I had thought it was a server that found your machine no matter the global IP. The URL is actually blueiris.pro/go?XXXXXXXXXX , replacing the X's with the first and last 5 digits of the product key

 

[bp2008]

That does find your home's public IP; it was implemented as an alternative to using a dynamic DNS service.

 

[Josh Parsley]

That does find your home's public IP; it was implemented as an alternative to using a dynamic DNS service.

Okay so when you open it, then click WAN access, it opens what looks to be a basic live JPEG pull... at least on my phone. I was wondering if there was some way to make it load UI3 instead. I am still an infant in regards to the ins and outs of BI

 

[Qlxpfive]

My early observations, FWIW, after a bit of use. First, thank you for the efforts that you put into this! It is way better than the default BI web interface. I didn't have any UI2 experiences.

Converting to UI3 immediately "fixed" my audio issues. Audio now streams nicely over the web in Chrome; I saw your notes for working in Firefox, but have not tested yet. If anyone is looking for good audio streaming in web client, this is the way to go for a quick fix.

When using an H.264 stream (necessary for audio), I'm getting a blur/pixelation every 10 seconds on some of my cameras. It appears to be happening on all of the Reolink cameras, with and without audio. May be an issue with higher MP cameras - will see if I can isolate more when I have time. This happens on both of my BI servers - 1 local, 1 remote.

Thanks!

 

[bp2008]

Okay so when you open it, then click WAN access, it opens what looks to be a basic live JPEG pull... at least on my phone. I was wondering if there was some way to make it load UI3 instead. I am still an infant in regards to the ins and outs of BI

Just change the "jpegpull.htm" part of the url to "ui3beta/ui3.htm"

 

[bp2008]

When using an H.264 stream (necessary for audio), I'm getting a blur/pixelation every 10 seconds on some of my cameras. It appears to be happening on all of the Reolink cameras, with and without audio. May be an issue with higher MP cameras - will see if I can isolate more when I have time. This happens on both of my BI servers - 1 local, 1 remote.

Go to Blue Iris Options > Web server tab > Advanced > select an encoder profile and click Configure. This brings up a panel of encoder options which controls the encoding of the H.264 streams which are available to UI3.

The temporary low quality is due to the stream receiving an iframe. In the encoding settings (in Blue Iris) the setting called "Maximum keyframe interval (GOP)" controls this. By default it is every 300 frames, and that happens to also be the maximum. You definitely want it set to 300 here because there is no benefit to a lower iframe interval with the way Blue Iris does its streaming to the web clients.

Now, you can improve the video quality and make the iframes less noticeable by increasing Quality and Max bitrate settings. If you increase the Quality, you need to also check the box for Limit bitrate because otherwise Blue Iris can end up encoding an insanely high bit rate that the mobile apps and web client can't handle. I personally set my Quality to 90 and set Max bitrate to 256 or 512 or 1024 or 2048 or 4096 or whatever I want. Higher bit rate is higher quality, but higher bandwidth usage.

512 Kbps = 0.5 Mbps
1024 Kbps = 1 Mbps
2048 Kbps = 2 Mbps
4096 Kbps = 4 Mbps

Another setting which significantly affects video quality is the Preset dropdown list. The value ultrafast is the fastest to encode and decode (less CPU usage) but it doesn't include a deblocking filter so you end up with an especially pixelated look. superfast is like the medium setting, and that is what I prefer to use. veryfast is the slowest setting, and comes with a much less significant improvement to video quality, so I do not use veryfast.

The Zero frame latency setting is fine. I don't really see a difference either way so I'm not sure this setting actually does anything.

Resize output frame width x height currently does not work, but when it eventually gets fixed this will be an important way to improve quality for fast systems or reduce CPU requirements for slow systems.

The Maximum B-frames between P-frames setting I keep at 0 because I don't think the web UI would handle B frames very well if they were to be sent. Though I did play with this setting and never noticed a difference.

 

[Qlxpfive]

Go to Blue Iris Options > Web server tab > Advanced > select an encoder profile and click Configure. This brings up a panel of encoder options which controls the encoding of the H.264 streams which are available to UI3.

The temporary low quality is due to the stream receiving an iframe. In the encoding settings (in Blue Iris) the setting called "Maximum keyframe interval (GOP)" controls this. By default it is every 300 frames, and that happens to also be the maximum. You definitely want it set to 300 here because there is no benefit to a lower iframe interval with the way Blue Iris does its streaming to the web clients.

Now, you can improve the video quality and make the iframes less noticeable by increasing Quality and Max bitrate settings. If you increase the Quality, you need to also check the box for Limit bitrate because otherwise Blue Iris can end up encoding an insanely high bit rate that the mobile apps and web client can't handle. I personally set my Quality to 90 and set Max bitrate to 256 or 512 or 1024 or 2048 or 4096 or whatever I want. Higher bit rate is higher quality, but higher bandwidth usage.

512 Kbps = 0.5 Mbps
1024 Kbps = 1 Mbps
2048 Kbps = 2 Mbps
4096 Kbps = 4 Mbps

Another setting which significantly affects video quality is the Preset dropdown list. The value ultrafast is the fastest to encode and decode (less CPU usage) but it doesn't include a deblocking filter so you end up with an especially pixelated look. superfast is like the medium setting, and that is what I prefer to use. veryfast is the slowest setting, and comes with a much less significant improvement to video quality, so I do not use veryfast.

The Zero frame latency setting is fine. I don't really see a difference either way so I'm not sure this setting actually does anything.

Resize output frame width x height currently does not work, but when it eventually gets fixed this will be an important way to improve quality for fast systems or reduce CPU requirements for slow systems.

The Maximum B-frames between P-frames setting I keep at 0 because I don't think the web UI would handle B frames very well if they were to be sent. Though I did play with this setting and never noticed a difference.

Great - thank you very much! I'll look through those settings when I get some time.

 

[acecase]

Very nice. I'm glad to see it's heading toward replacing the current official UI.

Blue Iris is amazing on the back end. Super stable, feature rich, compatibility with "everything," and constantly updated. I wouldn't take anything away from the developer, but the UI is a little off-putting. I consider my self a back-end developer, so I hope this isn't insulting. I could do no better on the front-end, and couldn't hope to do as well on the back-end.

Edit: Forgot to mention. I like UI2 better, personally.

 

[bp2008]

I have to agree, Blue Iris is pretty amazing for something built by one guy.

I'm more of a full-stack developer myself, and one who hates paying for software, so more than once I considered building an open source VMS product. The closest I ever got though was Camera Proxy. I'm just not motivated to build and maintain an entire VMS for no profit.

 

[bp2008]

Edit: Forgot to mention. I like UI2 better, personally.

I used to think the same way, because I really like having all the controls on the screen at once, as is UI2's style. But I just don't have the time to keep UI2 technologically up-to-date and UI3 has since surpassed UI2 in several important ways!

 

[acecase]

I used to think the same way, because I really like having all the controls on the screen at once, as is UI2's style. But I just don't have the time to keep UI2 technologically up-to-date and UI3 has since surpassed UI2 in several important ways!

I take it back. This is nice. I didn't like the PTZ area in the left bar personally, because I don't use PTZ, so that was bothering me "wasting" screen realestate. I also didn't like that I couldn't disable some of the controls, the way I did in UI2, to prevent the wife from messing with profiles etc.

At a glance, it looks like I can remedy these (or anything else) using the local overrides script. <- THIS, if it's what it looks like at a glance, is very nice.

I also didn't see the video quality setting at first, and didn't like that the video quality on my local network wasn't as good as the default in UI2.

 

[jimNH]

Switched from chrome to Firefox 57; did the mods here: Firefox version 57 is fully compatible if you turn on the dom.streams.enabled and javascript.options.streams settings in about:config,
I'm still seeing firefox load jpegs and show poor FPS compared to chrome...
(In stats for nerds on firefox it shows jpeg loading time, whereas in chrome its show h264 and more info...)
I'm running latest BI3 beta; Latest BI4. Firefox 57.0.4 on win10 with 32GB ram and a fast processor..
tks
-jim

 

[bp2008]

I take it back. This is nice. I didn't like the PTZ area in the left bar personally, because I don't use PTZ, so that was bothering me "wasting" screen realestate. I also didn't like that I couldn't disable some of the controls, the way I did in UI2, to prevent the wife from messing with profiles etc.

At a glance, it looks like I can remedy these (or anything else) using the local overrides script. <- THIS, if it's what it looks like at a glance, is very nice.

I also didn't see the video quality setting at first, and didn't like that the video quality on my local network wasn't as good as the default in UI2.

Local Overrides Scripts and Styles · bp2008/ui3 Wiki · GitHub

Yeah, using that, you can easily add or remove UI elements.

But perhaps all you need to do is not let your wife have access to an admin account in Blue Iris.

Switched from chrome to Firefox 57; did the mods here: Firefox version 57 is fully compatible if you turn on the dom.streams.enabled and javascript.options.streams settings in about:config,
I'm still seeing firefox load jpegs and show poor FPS compared to chrome...
(In stats for nerds on firefox it shows jpeg loading time, whereas in chrome its show h264 and more info...)
I'm running latest BI3 beta; Latest BI4. Firefox 57.0.4 on win10 with 32GB ram and a fast processor..
tks
-jim

You need to select an H.264 option in the streaming quality list! Firefox already has your preference set to jpeg mode.

 

[jimNH]

doh! Tks now MUCH better; Love the new interface!!

 

[bcr4977]

Great work! I'm late in the game, just recently setup BI to monitor a few cameras. I came across this and thought I would give it a try. Very slick and well polished.