Visualizing Museum Collections

Visualizing the Metropolitan Museum of Art’s (@metmuseum) instagram account

What types of art attract more people?

Most museums share their collections (as well as their events and programming)with their audience via instagram and other social media platforms. Many museums are also competing for the attention of art lovers in an effort to drive up their memberships as well as their attendance. The Metropolitan Museum of Art has the highest visitor numbers in New York City and is in the top five globally. However, most museum administrators are at a loss for understanding what will bring visitors through their doors.

This project is a first step in an attempt to look at the types of works people are interested in — by city. The goal of this project is to visualize the collection of the top ten museums in the city and rank their works by the number of likes.

Data sources: The Metropolitan Museum of Art’s (@metmuseum) instagram account

import json
def setup():
size(750, 600)
        
def draw():
global i, items, x, y, column, row
    
    background(24)
    stroke(255)
        
    with open('../data/metmuseum_instagram.json') as mm:
        data = json.load(mm)
        items = data['items']
        # collections.append(items)
    
    # print(len(collections))
    
    # for loop
    numItems = len(items)
    for i in xrange(0, numItems):
        item = items[i]
        
        thumbnailText = item['caption']['text']
        thumbnailLikes = item['likes']['count']
thumbnailUrl = item['images']['thumbnail']['url']
        thumbnail = loadImage(thumbnailUrl)
                    
        column = i % 5
        row = floor(i / 5)
                    
        x = 150 * column
        y = 150 * row
        
        
        mouseIsOverTheColumn = x < mouseX and mouseX < x + 150
        mouseIsOverTheRow = y < mouseY and mouseY < y + 150
        
        mouseIsOverTheRectangle = mouseIsOverTheRow and mouseIsOverTheColumn
        
        if mouseIsOverTheRectangle:
            
            # change the color of the overlay color
            tint(169, 138, 116)
            
            image(thumbnail, x, y)
            noTint()  
            
            # add number of likes to image
            textSize(36)
            fill(243, 156, 18)
            textAlign(CENTER, CENTER)
            text(thumbnailLikes, x + 75, y + 75)
            
            # create text box and place instagram caption
            if (mouseY < 300):
                fill(227, 227, 227)
                noStroke()
                rect(0, 300, width, 300)
                
                textSize(16)
                fill(169, 138, 116)
                textAlign(CENTER, CENTER)
                text(thumbnailText, 25, 300, (width-50), 300)
            else:
                fill(227, 227, 227)
                noStroke()
                rect(0, 0, width, 300)
                
                textSize(16)
                fill(169, 138, 116)
                textAlign(CENTER, CENTER)
                text(thumbnailText, 25, 0, (width-50), 300)
# the following link allows you to grab JSON data by pagination            
# https://www.instagram.com/afropunk/media/?__a=2