top of page

Data Visualization + Graphic Design

The Sky

The Sky is a data visualization interface design that shows the weather of the week in Cambridge, MA. Two graphic design concepts are created, and one of them is made into a working prototype with real-time data.

The Dark Sky API is used for the project, which allows to look up the weather anywhere on the globe and access to current weather conditions, minute-by-minute forecasts out to one hour, hour-by-hour and day-by-day forecasts out to seven days, and hour-by-hour and day-by-day observations going back decades.

Project Type / 

School Project


Role / 

Graphic Design,

Web App Development 

Year / 


Concept A

The circle in the middle visualized the weather condition of the following 12 hours. The gap of the pink/blue shape indicates the current time. The pink represents the curve of temperature and the blue represents the curve of the probability of precipitation. When the user taps to a different color, the data will reveal in the center. The weather forecast of the following 7 days can be seen at the bottom.

Concept B

The average temperature of the highlighted date is shown on the interface with the weather condition in the background. Base on Dark Sky API, 13 types of weather conditions can be shown, including clear day, rain, partly-cloudy-day, cloudy, clear-night, etc. Different weather conditions graphics are designed in detail. The user can tap to see the weather condition and temperature of any of the following 7 days.

Final Design

Click on the date to see the weather.

bottom of page