Weather Project


by Limber Zhang


MAY 2017

This website design interprets and visualizes the weather conditions

by having two main locations for readers to look at: SKY and SEA.


↕ scroll up to the sky, ↕ scroll down to the sea.

weather.main.temperature;
weather.wind.speed;
weather.main.humidity;

1. color gradient
2. waves

color gradient:

The speed of moving color gradient is responsive to the windspeed of the moment:
Higher windspeed = Faster movement.

waves:

The stroke is responsive to humidity:
Higher humidity = Bigger blur.
(In high humidity, the waves become more blurry and lethargic. In low humidity, they feel sharp and effortless.)

The movement is responsive to wind speed:
Higher windspeed = Bigger movement.

The color is reponsive to the temperature:
Higher temperture = Warmer blue color.

project


documentation