Logicify Office Dashboard

We continue with articles series titled “Logicify for Logicify” devoted to our internal projects and initiatives. Previous article described our crafted IoT solution for office weather monitoring. Today we’d like to talk about the project internally known as Logicify Office Dashboard.

One of our internal projects was nicknamed Logicify Office Dashboard. We hung a set of physical TV screens in the office and kitchen to broadcast info on dashboards from our internal network. All screens are connected to Android TV Box, via Fully Kiosk, a configurable browser and app launcher, pointed to the corresponding URL. The TV screen broadcasts a carousel of the following dashboards:

All of the dashboards are available on screens across the office and online. On the kitchen TV screen, the views are rotated every few minutes.

As we wrote in the article about our IoT project, we declined existing weather monitoring solutions, in particular due to security reasons. In order to not share sensitive office data externally, we locked all components of our Connected Office in a separate WiFi network. Same way, when selecting the tools for Office Dashboard
project, we wanted to keep the broadcasted data confidential. We used the same stack of Home Assistant, InfluxDB, Grafana as well as Google Apps Scripts and external APIs to get the data we wanted to present on the dashboards.

Office Weather Dashboard

To have full control over office weather conditions, we crafted a connected office solution with just a soldering iron. In short, we have a few PCBs with sensors for temperature, humidity, atmospheric pressure and CO2 level in different zones of our office. Sensors data are regularly loaded to time-series database, InfluxDB, which is, in turn, connected to Grafana, data visualization platform.

Weekly Statistics on Office Weather

Grafana gets office weather parameters presented in graphs. Using time series graphs and annotations in Grafana, we traced some patterns and trends in office weather retrospectively. The same graphs, though drawn for shorter time intervals, are broadcasted on the screen:

Office_Weather_Graphs

They allow our Office Manager to react to the changes in the parameters: open windows if the level of CO2 is too high, turn AC and humidifiers on and off.

Office_Weather_Stats

Real Time Office Weather Parameters

For even better practical use of sensors in every zone, we collect and visualize real-time weather parameters on the office map. Using a cool cloud software called Archilogic that translates 2D building plans into 3D, we drew Logicify Kherson office plan. We loaded a standard fire safety evacuation plan into the system and - in two hours or so - were simply amazed with the result. Archilogic drew our office in 3D with every minor details possible: stairs, windows, furniture items. We were seriously thinking Archilogic sent a drone to capture our office layout and draw this map :)

Office_Weather_Zones_1_Floor

Using Grafana plug-in called Picture It, which allows to superimpose measurement displays ontop of picture, we positioned physical PCBs on the office 3D plan and displayed the weather parameter in every zone with corresponding unit of measurement (℃, %, ppm). We also used different color-marks depending on the weather parameter on the map: green for normal value, yellow for value close to boundary parameter, and red for parameter exceeding the limit.

Office_Weather_Zones_2_Floor

Weather Forecast Widget

We thought broadcasting weather forecast on the office screen was a nice idea. However, we struggled to find an accurate weather forecast provider for our region. We ran test with multiple providers and found out the forecasts from a US-based company Dark Sky were quite reliable and detailed for Kherson region. We used Dark Sky API to get all the data we needed, like min/max and current temperature for current day and following week, “feels like” temperature, humidity, chances of rain, UV index, wind speed and pressure.

Weather_Forecast_Widget

We will soon reveal more details about this widget as we plan to open source it. Stay tuned!

Google Analytics for Logicify Main Page

Another idea we brought to life was visualizing Google Analytics data for Logicify main page on our office dashboard. With two ways to do this - use native Google Analytics components to grab the data or load it into InfluxDB - we applied a somewhat mixed approach. Native Google Analytics components visualize number of website visitors in real-time and within last 3 hours.

Google_Analytics_Dashboard

The geographical spread of web-site users is presented with color-marks on the map using World Map plug-in for Grafana. So, Google Analytics data on the number of visits is loaded into InfluxDB, read by Grafana and broadcasted on the office dashboards.

Internal Google Calendars

Google Calendars with Logicify events and PTOs are visualized on the dashboards but with Google App Scripts, not Grafana.

Logicify_Events_Dashboard

PTO_Dashboard

Tricky logic behind the scenes lets us track the events in multiple company calendars and display only the events upcoming in the nearest month. This information is sensitive and should not be shared publicly, so we access calendars using API key.

Dashboard with Miscellaneous Stuff

With Grafana dashboards, we also air some helpful pieces of information, such as

  • Current time in our customers’ locations. We added Clock panels to Grafana - one per each location - to show accurate time.
  • Currency exchange rates. Current rates for USD, EUR, GBP, and Bitcoin are received via PrivatBank API.
  • Internet speed. Two sensors connected to Home Assistant measure internal and external traffic in our router via simple network management protocol (SNMP). The data is converted into megabits per second and loaded into InfluxDB. Afterwards, the data is read and visualized by Grafana.

Misc_Dashboard

We plan to keep on customizing the widgets, adding new office dashboards. If you have a creative idea what else could be added to the dashboards - feel free to share it via hi@logicify.com.

Related articles

Tags