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, Joel should be aspleep,
but he’s probably not. 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. 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. 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 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. 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.
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. 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.

Author: Kevin Mason

Leave a Reply

Your email address will not be published. Required fields are marked *