Weather

Posted on: July 11th, 2016 by Peter Balazs No Comments

Yes, I know what you’re going to say just after reading the title… But Peter do we really need another weather app?
Just bear with me, this is not what you think.

As large screens are getting cheaper, more and more small shops invest to show their products and / or discounts on screens instead of flyers, I think it’s relevant to design pages for such screens only.
Where does a weather page fit in this scenario? Well think of a hotel lobby with a screen showing information for guests. Welcome screen, news, restaurant specials, and… weather.

weather

How does it work? I used jSon data from OpenWeatherMap. It’s a really good world wide weather data provider, free for experimenting purposes (if you’re really into weather or want to experiment with jSon data, I highly recommend checking it out).
Once the data is extracted, every info is put in place with jQuery. Even the background images. The place to look for on the OpenWeatherMap server is hard coded in the js file, but the text is read from the jSon data. The time shows local time (your computer’s time). Since the idea is that it would be shown on a dedicated screen in a dedicated place, I didn’t bother with geo location.
The page is designed for 1080p screens – non responsive -, so I added a screen size check just for this post. If you can’t view the page zoom out your browser and refresh.

Check out the working weather page.

Leave a Reply