Pollen Infoscreen

Description

The Pollen Infoscreen is a WebAPI based solution that displays allergy risk based on set location and contaminants. To better tailor the user experience, it is possible to set custom contaminants along with the general allergy risk input via WebAPI.

The solution has a resolution of 1280 * 720 and features an overview scene as well as an insights scene where further contaminants are displayed.

Overview scene:

Dynamic Elements:

Clock control
Air Quality – text value
DayRisk control (top 4 week days)
MultihourValue control (bars with 10 levels/images)
Pollen_Brief control (level of preselected contaminant, with 3 levels, triggers list of contaminants)
City Button (triggers location list)
Settings Button (triggers language list)
Insights Button (switches to contaminants list scene)

Insights scene:

ContaminantListElement control – List element, composed of other controls:

ContaminantName control
4 x ContaminantLevel

Since we have many similar elements, we can create a template for each type and instance it several times.

Controls

DayRisk

We have a background, over which there is a string showing the day, an icon according to risk level, a number representing risk values from 0 to 10, and a second fixed text or icon for risk level. The risk level has only 3 values, low, mid, high.

The Control only needs to receive the day text, and the risk level. For the Icons and risk level text, we can use a “Render Child Nodes” behavior to select which element to make visible, and we can setup with 10 elements, by duplicating the 3 available elements (low, med, high) to (low, low, low, med, med, med, med, high, high, high).

The risk value has a single entry point and is forwarded to the there controls that each need it. This could also have been done with using fewer elements and arithmetic operator behavior. This is a bit more flexible as it allows to easily add new images for each value, if needed.

PollenBrief

This control shows the contaminant name (can be multiline and word-wrapped, to handle possible long strings received), and an icon and text group showing level (low, med, high). The contaminant level here is in the interval [0..4], but a value of 0 for “Render Child Nodes” will show none of the children, so we added an “Arithmetic Operation” to add 1 and turn this to [1..5].

MultihourValue

For the graph elements we have 10 values and 10 images. If we have no individual properties to set, we can use a “FlipBook” control, to just switch the images. In this case we have to configure the list of images in the FlipBook control.