Building a Digital Dashboard

Making a Digital Dashboard! (w/ Google Calendar integration)

This is my digital dashboard that I just made – it sits on the wall right next to my desk and is just “always there”. I’ve got the local time, world time, well, I mean go by US west coast time, I’ve got the weather, my upcoming video plan and to-do on here and in the last two weeks that I’ve been using it, it has already made my work so much more efficient because it totally keeps me on track.

You can use this setup for everything, though. As a family planner, a digital picture frame or even, with a much smaller screen, as a desktop clock with your next tasks coming up. And all this is is a TV and a Raspberry Pi, so let me show you how I built this one, how I set everything up to work smoothly from the Pi and as energy efficiently as possible and what I would do different next time.

Parts used

So let’s go through what parts I used. First, the screen. This is a 43”, 4K LED TV from JVC. It’s really amazing how cheap TVs have become just in the last two years – and the price difference between 1080p and 4K models has also shrunk to almost zero, so getting the higher-resolution model was a no-brainer as it makes especially smaller text so much more readable, which means I can actually make use of the large screen size and put more stuff on it. Of course, you can also use an old computer screen or any other spare display, but make sure it has decent viewing angles, especially if you plan on mounting it in portrait, and also keep an eye on power draw.

I picked this exact model because it’s a good bit more energy efficient than others – and since it’ll be on for 10 hours a day, that does make a difference in the long run.

Now, for what’s controlling this, obviously, it’s a Raspberry Pi – 4. The older Pis would have probably been fast enough, but don’t support 4K output over HDMI. Yes, there are a few hacks that may allow you to get 4K from them, but I wanted to eliminate as many potential hiccups as possible – this should be a zero-hassle and -maintenance setup for me and was already enough work. I may still try an older Pi in the future, though.

Software used

So for the software that’s driving all this. There are two, maybe three ready-to-go solutions for this. The first one, and maybe the most obvious one, is MagicMirror². That’s a Raspberry-Pi-native software that’s made to sit behind a semi-transparent, mirrored piece of glass and shine its information through that mirror, creating that “mirror, mirror on the wall” illusion. MagicMirror² is free and open-source and has a ton of plugins and expansions. But. First, the interface is optimized to just be black and white, since it’s made to shine through a mirror, and getting anything to look nice without that mirror is going to take some effort. And, the more severe issue for me, the way you set up MagicMirror² is by editing JSON files over remote desktop or through an SSH terminal. I don’t have those sort of masochistic tendencies, so that didn’t particularly excite me. But I tried anyways, and after digging through the tons of different calendar plugins and finding the one that seems to be the go-to powerful option, I just gave up when I saw the 50-page-long documentation on how to write the JSON that would display a shared calendar. Like, this shouldn’t be so hard. For me, that’s not fun to set up, and changing anything in the future would mean re-learning the entire thing again.

It also kind of explains that when MagPi, the official Raspberry Pi Magazine, covered MagicMirror², they spent five pages explaining how to build the build the wooden frame, and only one page on software. It would probably scare a lot of people away if they covered it more realistically – which is the other way around. One page on the frame, five pages on how to edit JSON files.

The DAKboard

The next alternative is DAKboard, and that’s the one that I’m actually using right now.

It’s not an open-source software, it is a paid software-as-a-service, which I’m usually not a fan of, but there is a somewhat limited free version available. This project is not sponsored by them, I don’t even have an affiliate link for DAKboard, but there are affiliate links to all the hardware and tools I’m using down in the video description.

So, the one massive advantage that DAKboard has is that it’s entirely browser-based. Both the configuration and the dashboard itself happen entirely in a browser window, which means you can use any kind of hardware for the screen setup as long as it can display a website; and you can change and update what’s shown on the screen from any other computer without remote-desktop’ing into the Raspberry Pi or going through a console.

It took me all of ten minutes to get DAKBoard running, and then a bit longer to figure out what I actually wanted to have on here, where, how large, etc.

There is one more software that I found, and that’s Mirr-OS by glancr, which I believe is somewhat open-source. It’s made by a guy from Berlin, but it seemed a bit too focused on living behind a mirror again, which means very simplified graphics, and the list of integrations and features is also still quite short.

With each of these solutions, there are still a few things that I did to the Raspberry Pi OS to make it work for this application, but I’ll get to those towards the end of the video. But now that I knew that the software worked and did what I wanted it to, it was time to mount everything to the wall and to build a bezel for the screen to make it look a bit less like a failed home cinema setup.

Mounting and frame building montage

I started by installing the wall mount for the TV itself. This is a standard, off-the-shelf unit, I tried to get one that was reasonably thin since I didn’t want the frame to stick out too far from the wall; the TV is thick enough as-is. Most wall mounts let you mount the TV in normal landscape orientation or in portrait, but if you have one that is particularly flimsy, the TV may tilt forward a bit too much for comfort. Mounts with a taller base like this one tend to be sturdier, and the bezel I’m still adding will help hold it in place, too.

In case you’re wondering, no this is not a studwall, this is not drywall, in fact, this is a two-flue, brick chimney that I’m mounting this to. Usually, you should never drill into a chimney, as that could allow for flue gases to escape or create a fire hazard, but in my case, one flue has never been used and will never be used, and already carries the cables for my solar panels from the roof into the basement where the inverters live, and this other flue is now double, or actually triple-lined with polymer pipe ever since we upgraded to a condensing gas heater. That means, in my case, this can be treated like a solid bearing wall. With the bonus feature of being able to run wires in the empty flu.

So now that the TV was mounted, I could get started on making the wood bezel. I picked up a few pine boards as they were cheap and had a nice, lively texture that would break up the sterile look of the dashboard. I started by joining two boards for the facia and got to cutting out the bezel area.

Sure, there are more material-efficient ways of making a bezel like this, for example by joining segments with miter cuts, but I wanted the grain to run in all the same direction in the front, and the cutout in the center is a good size to reuse in the base of the MPCNC.

I routed out a large lip or pocket for the TV to sit further towards the front – it only needed to be this big on one side, but the spacing from the edge of the visible screen to the rear box-section of the wooden frame needs to be the same on all edges.

I then added a bunch of chamfers on all sides of the bezel, for looks, but also to make that second facia on top of the TV’s original bezel look as thin as possible.

Now, just because I’m using a bunch of tools here doesn’t mean that you can’t make a frame like this if you don’t have all of them. I’m not using any of these tools particularly effectively, so all you need if you’re a bit creative is some sort of a saw, sandpaper and wood glue. You can also get different raw materials that need less work to get them into shape to make your life even easier, like thin plywood for that front facia.

For the back portion of the bezel, I printed a bunch of grills to cover up some cutouts for ventilation – both the screen and the Pi do need some airflow, but passive convection should be enough.

The back itself is a simple butt-joined rectangle, I added a few brad nails for strength and so that I could keep on working right away.

The back frame then simply gets glued to the bezel, and after that, I was ready for a quick round of sanding and the first coat of varnish. I looked into using a stain first, but since I wanted an almost black color, using colored varnish ended up being a simpler, more consistent and cheaper option. After a second coat of paint, the frame was done and ready to be mounted.

Aaaaand.. I screwed up. Yeah, uh, remember how I like to measure from the 10cm mark on a measuring tape so that I don’t need to deal with the wiggly end? Well, turns out if you forget to subtract those 10cm from your measurement, you don’t actually get the correct dimension.

I already thought the aspect ratio looked a bit off to be 16:9, but the dimensions on my sketches checked out. Ah well, at least it was easy enough to fix. I had thought about just tossing this frame and 3D printing one instead on that huge Raptor 2.0 printer, but figured I could reuse the wooden bezel and just cut a chunk out of the top and bottom, glue it back together, sand it down and give it a fresh coat of paint. So that’s what I did, and yeah, you can still see where it got joined back together if you know what you’re looking for, but if you don’t, you can’t really tell.

So for mounting the frame, I used pieces of what you’d call 1×2 in the US, commonly known as Dachlatten here, and to align the frame to the screen, I used some double-sided tape to temporarily stick down the slat, then unscrewed the frame and anchored it down in that position.

Worked really well!

And of course, you can always fine-tune the position with a hammer. Next, I needed power, and remember how I said this was a chimney? Well, that makes it easy! I fished up a wire through the flute and then had a licensed electrician hook up the connections. I first thought I’d need to add an extension to this frame on the bottom to hide the wiring, but it turns out there was enough space behind the screen to hide a full powerstrip and USB supply, and for the Raspberry Pi 4, well, I just taped that to the back of the TV.

There’s no need to choke it even more with putting a printed case around it, after all, it is already enclosed by the frame and all.

And no, for what this PI is doing, it definitely does not need a fan or heatsink. So back on goes the bezel, these two vent grills on the bottom and top also hide the screws that mount the bezel to the wall, just to make it a bit prettier. I mean, it’s not like anyone is ever going to see it, but still.

Setting up the Raspberry Pi

So how did I set up the Raspberry Pi? It all starts with the standard Raspbian setup, since I use the Pi4, it’s the newest one they offered as of today (which is August 2019). I did all the regular things that the setup assistant walks you through, that is WiFi and changing the password, but after that, it was mostly making the Pi work smoothly in this use case. Reading off all the commands I used is not super fun for a video, so I’ll link the article on toms3d.org in the description where I have all the steps listed in full detail. So here’s the short version:

First, I needed a way to access the PI without attaching a keyboard to it. For that, I enabled SSH and VNC remote access with the raspbi-config tool.

Then, I needed a way to automatically show the DAKboard interface on boot. For that, I added a startup command to the LXDE desktop environment that would launch Chromium in full screen. And that works really nicely.

But there’s still the issue that this screen is rotated. Normally, you can easily configure the entire HDMI output to be rotated with the boot config, but with a 4K screen, the entire image would get shifted off screen so that most of it is black and you’re only seeing a small slit of the image. Not great.

So instead I tried a few Chrome plugins that would rotate just the website. And there are a bunch of prank plugins, but “page rotate” did exactly what I needed.

However, you need to click it every time, which doesn’t work here, so I looked at what it did to the page and replicated it. Essentially, it’s creating an iframe, which is a virtual browser window within the real browser window and it’s rotating that in its entirety. Works beautifully.

Next, there were two small annoyances to fix, and those were that the screen would go blank after 15 minutes, that’s a simple fix in the desktop environment’s config, and the next one was that there’s a mouse cursor on screen, which we definitely don’t need, and that’s fixed by installing unclutter and adding it to autostart.

Lastly, I wanted to schedule the TV turning on and off because, well, what’s the point of having it on during the night. So I set up HDMI-CEC, which lets the Pi control the TV over HDMI and turn it on and off when needed. Make sure you’ve got the PI plugged into an HDMI port that supports CEC for that to work. For the scheduling, I used cron, the oldskool linux scheduler, so now the screen turns on at 8 AM and turns off at 6PM. Nice ten-hour work day, perfect.

And lastly, to save a bit more energy, I turned down the screen to minimum brightness, it’s still very readable at that setting and probably reduces power consumption by two thirds or so. That’s also one of the reasons why I didn’t add a mirror in front, as I’d have to crank the brightness just to make it through the mirror and then to compete with the glare on top of that. So this is good.

Now, for the actual DAKboard layout, you can go with the free pre-defined ones, but I wanted to try creating a custom one. Now, what you put in here is up to you, but here’s what I have on it. Up top, it just felt right to have the local date and time, and then next to it, I have some world times for US west coast, LA, east coast, New York City, Hong Kong, and Sydney, so these just always give me an idea of what time it is for the people that I’m talking to on Twitter or via email. 

Next up, weather, and then a calendar of the next 90 days. Right now, I’m only having it display my video schedule, but usually, I also have my work calendar on here with events and deadlines, I just hid that for the video because that doesn’t really need to be public. I really enjoy having 90 days in advance here, that gives me a chance to for example order stuff from Aliexpress for an upcoming build and the stuff actually getting here in time.

Now, down here, for now I’ve put a todo list, but I’ll probably still change that around. If you have ideas of what might fit in here, let me know in the comments!

One of the features that DAKboard is only unlocking for paid users is the option to use custom CSS to change how all this stuff looks. But you can also add that feature with a Chrome plugin that just applies the looks right in the browser. What I added here was a consistent spacing in these calendar cells, by default they shrink and grow based on how much information each row has, then I changed some of the font sizes and added a blurry shadow under all the text and icons to make it a bit more readable. And that’s it! 

There are still a few things that I may add or change in the future, and that’s for example power button on the side that lets me cleanly shut down the Pi, because if you just jank power or switch off the mains fuse, you do that too often and at some point it’s just not going to boot up anymore. For now, I’ve got a copy of the SD card, so if that ever happens, I’ll be back up and running fairly quickly.

It could also make sense to actually underclock the Pi4, but since all that’s doing is limiting the maximum clock and this one is idle most of the time anyways, I don’t think it’s going to make much of a difference for heat and power draw.

But what I will try is getting an older Pi to output 4K – that way, I can use this Pi4 for more demanding tasks and permanently deploy a Pi1 for the dashboard.

And if I were to build this again, I would probably skip the entire TV wall mount and just use the TV’s bezel to tape it to the wooden frame. There’s more than enough contact area there, and knowing how well VHB tape sticks, I’d have zero doubts that it would hold up over time. That would make aligning the frame to the screen much easier and it would also make for a slimmer build that doesn’t stick out as far from the wall. I’d also drill a small hole for the infrared receiver in the TV to make the remote a bit less awkward to use.

Like I mentioned, I’ll have the software guide linked in the description below, also down there you can find the list of parts and tools that I used if you’re looking into making one yourself, and if so, let me know in the comments what you’re thinking about using it for!

And as always, if you found this video helpful, interesting, entertaining, leave a like, get subscribed, and if you’re up for it, join in on Patreon or through YouTube memberships to support the channel. Thank you all so much, thanks for watching, and I’ll see you in the next one.

💙 Buying items through these affiliate links gives me a small kickback without adding any extra costs for you! All details and more links here
Amazon [🇺🇸 🇩🇪 🇬🇧 🇨🇦 🇮🇹 🇪🇸 🇫🇷]
eBay [🇺🇸 🇬🇧 🇨🇦 🇦🇺 🇮🇹 🇪🇸 🇫🇷 🇦🇹 🇧🇪 🇨🇭 🇮🇪 🇳🇱]
Matterhackers [📦🌐]
iGo3D [🇩🇪]
Aliexpress [📦🌐]

💙 Enjoying the videos? Support my work on Patreon!