Data Visualization in Web Design: 12 Stunning Examples 1

Data, data, everywhere. But what do you do with it? Today, we’ve collected 12 stunning examples of data visualizations in website design to jump-start your thinking about how to work with data.

We live in a time where the ability to showcase data in new and interesting ways can be a huge asset as a designer.

Whether you have a massive collection of numbers or just information that you want to showcase, this design style can be a great tool in your kit.

1. History of the NFL

data visualization

With decades of data spanning 32 teams, there’s plenty of information available about games in the NFL. FiveThirtyEight boiled it all down into a series of interactive graphs that you can view by team to see the ebbs and flows of football history.

The best thing about this data visualization is that it is super simple. The lines show wins and losses. But with clicks and hovers, the data springs to life: You can get scores, dates, and records for every single game overlaid on a map of the averages for the entire league. (So you can see if your team is ahead of or behind the pack.)

2. Selfiecity

data visualization

Selfies are more than just a fun set of photos. Selfiecity uses rich media visualizations to assemble thousands of photos to find demographic information about the people who take them.

What’s cool about this data set is that while it is all visual – thousands of photos – you can start to see patterns, such as the style of selfie people take in different places, whether women or men take more photos and the ages of selfie-takers. While there are some statistics and numbers here, this data is plotted using photos in a giant grid.

3. Largest Vocabulary in Hip Hop

data visualization

This project from ThePudding shows that data doesn’t always have to be numbered. It analyzes the number of unique words used in hip hop lyrics and plots the biggest vocabularies by the number of words with images of the artist.

Here’s how it works: “It compares the number of unique words used by some of the most famous artists in hip hop (that is, an example of a quantitive view of lyricism, once proposed by Tahir Hemphill). I used each artist’s first 35,000 lyrics. This way, prolific artists, such as Jay-Z, can be compared to newer artists, such as Drake.”

The simple black and white design of the plotted chart is visually interesting and makes it easy to see which artists are ahead of the pack. (Or you can use the more interactive tools and search for specific artists.) You can also sort by era, with the 2000s being the most lyrically robust.

Continua su: Data Visualization in Web Design: 12 Stunning Examples | Design Shack



Dario De Leonardis esiste nell’Internet dalla fine degli anni ‘90. È stato, in ordine sparso: hacker, grafico, web developer, brand designer, analista politico, edonista, spin doctor b-side dell’hinterland tarantino, UI designer, installatore software, attivista per i diritti di tutti quelli che non vogliono togliere diritti agli altri, tecnico informatico, ghost writer, organizzatore eventi, autore satirico, cattivo da fumetto, social media strategist/manager, communication expert e modello. Da curriculum accademico sarebbe critico letterario e teatrale ma si vergogna a dirlo. Ama il cinema d’azione indocinese e il progressive rock del nord-est europa. Tendenzialmente affronta i suoi problemi con il binge watching e il sarcasmo. Sa come si scrive una È maiuscola con l'accento e non con l'apostrofo usando le combinazioni ASCII. È fortemente convinto che una cosa si possa pubblicizzare e vendere anche se non esiste realmente e che un giorno le botnet sui social svilupperanno una coscienza propria e conquisteranno il mondo.

Leave a Reply