Weather Station Display Explorations

4 temperature cards with gradient background going from blue and green on the left to red and purple
Weather conditions on colourful gradient backgrounds

Home display for outdoor weather station with dynamic background.

The typical Weather Station on Amazon is, more often than not, cluttered, full of gauges, dials and, nine times of ten, sports a digital font.

I wanted to try my hand on a brutally simple interface, without using a single gauge or dial. The background layer is a dynamic gradient responding to changes in weather conditions. Warmer or higher volumes give warmer colors while rain, fog and low temperatures get blue and green color combinations.

Navigation

Cards/tabs are stacked in an infinite loop, the next card is presented with a simple pull gesture at the button.

Device: Wall mounted digital display

Font: Matter by Displaay Foundry

Icons: Lucide

Some considerations:

  1. Navigation: while clean and simple, only the next card can be summoned by bottom pull gesture, however, that does mean that a user is expected to scroll only forwards, it is probably better to also make a handle at the top to scroll back to previous weather cards.

  2. Demo animation. This animation is straight out of Figma, naturally it should be a lot smoother, lava lamp like. I'll do a rebound soon.

Posted on Jul 12, 2023

More by Alexander Kaan

View profile