#021 - Home Monitoring Dashboard

I created this draft on Dec 3rd. 

Today is now Jan 2nd, 2019. Happy new year!

The first half of last month was spent working overnights and not getting ready for Christmas. When you work in retail, you know that Christmas stuff starts rolling in between September and October, so by the time December hits, you’re tired of seeing anything that’s red, green, looks like a Christmas tree, says anything about snow, and smells like pine. 

As for the last week, I’ve purposely put myself in sort of a time out. I have taken advantage of my thinned out work schedule and slept a lot. Apparently my body is tired. And while I still have a few days off before I head back to work, I decided that it wouldn’t hurt to tie up a few loose ends now.

Also, I’m finally using Squarespace’s mobile app to type this and the minimalist in me is LOVING this interface.

---

So, about this Home Monitoring Dashboard...

It didn’t take long to figure out the direction I wanted to go in for this one. I looked at examples that others had done, knew that I wanted to have an image incorporated in the layout to break up the information and not seem heavy on the text. As always, I browsed through Pexels to find a few images to use, and got to work. 

This is how it all started…

And this is what came next:

2018-12-04 - Flow - #dailyui - #08.png

Now while I quickly realized that the picture in particular was not a good one to use for this, I knew that lowering the opacity for any other pictures I used going forward was a good decision so that it wouldn’t be competing with or overpowering anything else on the screen.

2018-12-04 - Flow - #dailyui - #14.png

First option.

As you can tell by the above screenshot, I went back to the drawing board and chose another picture. Since the colours became a bit more muted once I lowered the opacity, I lightened up the black sections that I had with the previous screenshot and went with gray.

Here’s the thing: I may or may not have also used three other pictures to create other versions for a bit of variety.

2018-12-04 - Flow - #dailyui - #15.png.

Second option.

And yes, someone is sleeping on the couch. Adds a nice touch, doesn’t it?

2018-12-04 - Flow - #dailyui - #16.png

Third option.

While I love the green and the illustrations on the pillow, I do not love where I placed the main information over the picture. I’m leaving this here as an example. What works well with one layout does not look good on another. Should I have moved it up or moved it around a little more in order to get the placement just right?

Absolutely.

Did I do that at the time? No. It’s a prime reason why you shouldn’t try to do everything at once when you’re tired. #storysince2017 It’s fine to leave what you’re working on, take some time away, and then come back to look at it with fresh (and well rested) eyes.

2018-12-04 - Flow - #dailyui - #17.png

Fourth option.

I’m not too crazy about the browns. And I just realized that the same same couch with the pillows in the previous screenshot is also in this one. Way to be consistent.

When it came to narrowing down the winner to use for a mockup, I went with the first two screenshots I posted. I felt that they were the strongest two out of the four I made.

#021 - Celeste Home Monitoring Dashboard Mockup # 1

#021 - Celeste Home Monitoring Mockup #2