TV Ident - Javascript Dynamic Content + Weather Widget

This is a personal project I made to showcase the use of JavaScript programming and After Effects + 3D animation.

The idea behind the project was to showcase an imaginary TV channel's prime time programming ident, that can dynamically set using a .csv file.

The additional benefit of this ID, would be to have a weather forecast widget pop up, so the viewer would be able to get next day weather forecast on the same TV Ident, making it more useful for all viewers.

The code uses a daily .json file that is downloaded from openweather.com, which detects next day forecast of maximum and minimum temperatures, weather conditions to select appropriate animation to include in the widget, as well as giving an appropriate base color to the widget layer, depending on maximum day temperature. In this case, blue is low temp, green mid temperature, and red for hot days.

We can see that green base color was selected for mid-range temperatures.

In this case, weather conditions are snow and low temperatures, and the script picks the correct animation.

Hot days are colored red, and there are several different types of weather conditions that are displayed as icon animation at the top right.

This is a great way to implement code in a broadcast TV setting, since it renders extremely fast, you could change TV idents on the fly if there are any last minute schedule changes, as well as providing the viewer with an additional layer of useful local information.

This was done as a final project for the Post-graduate course in Coding for Animation at @CENTRO_U, so big thanks to Roberto Cabezas and Ivan Abreu, my professors, who have given us the right tools and patiently taught a bunch of us designers not to fear code, but to embrace it.