top of page

An interactive data visualization for the sources of the top headlines

Design Challenge

Propose, design and create an interactive data visualization that solves a design problem.

Design Problem

The different sources of options are making it difficult to choose the best source to get the latest news.


"Noted Sources” is designed to give the idea about the most popular sources of newspapers, blog posts and magazines from where most of the headlines have come.


“Noted Sources” is an interactive data visualization made using p5.js, where the famous sources of top headlines of the USA including all different fields can be seen by default. This visualization also offers interactivity by clicking on various buttons such as health, science, technology, sports, entertainment, business which categorize the headlines in different fields.


The user is able to click on any of the buttons and popular sources for that particular category headlines will be popped up. The popularity of the source is measured by the size of the circle.

The number of counts per each source is mentioned inside each circle for better understanding. Once the mouse is over each circle, the name of the respective source will be displayed and by clicking on the circle, the user will be redirected to the respective site of the source.

Brain Storming Sketches

new doc 2019-04-28 23.56.54_1.jpg
new doc 2019-04-28 23.56.54_2.jpg

(Version 1 of Noted Sources)

new doc 2019-04-28 23.56.54_3.jpg
new doc 2019-04-28 23.56.54_4.jpg

(Final version of Noted Sources)

Version one Output

Screen Shot 2019-04-29 at 1.52.37 AM.png
Screen Shot 2019-04-29 at 1.53.13 AM.png

Final Output

Next Project

Previous Project

bottom of page