NYC Skyline
MIT STUDIO • 2022 SPRING
RESPONSIBILITY
System Design, Prototyping
DURATION
Apr. - May. 2023 (1 Month)
PROJECT TYPE
Data Visualization | Individual
TOOL
JavaScript | p5.js | Mapbox.js | HTML | CSS

PROJECT OVERVIEW

Project Scope

Story of NYC Skyscrapers

This project aims to tell the story of New York City's architectural marvels - all skyscrapers in the city, through an interactive data visualization. By collecting data of buildings with 500+ ft (150+ meters), the project will provide users with an engaging and informative tool to explore these structures, and showcases the growth and development of the city's skyline over time.

Key Questions

Tracing Evolution and Trends in Skyscrapers

  • How have NYC's tallest buildings evolved in terms of height, floor numbers, function, and location?
  • What historical, architectural, and urban planning trends can be observed from the development of these skyscrapers?

Project Setting

A Web-Based Exploration Tool

This project targets architecture enthusiasts, tourists, urban planners, and NYC residents keen on the city's skyline, etc. The visualization is accessible through a web-based platform, making it suitable for use in as a tool for exploring the city's history and landmarks.

Project Insights

Periodic Development Trends

The growth of skyscrapers in NYC has been periodic, with distinct peaks in development during certain years since the early 1910s. This suggests patterns influenced by historical, economic, or technological factors.

Height Competition and Evolution

There is a continuous trend of constructing taller buildings, reflecting a competitive architectural landscape. The timeline allows users to observe shifts and advancements in skyscraper heights over time, highlighting the city's architectural ambition and technological progress.

Project Design

Interactive Showcase (try it below)

The dual-panel layout showcases an interactive chart on one side, detailing the growth and typologies of skyscrapers, and a detailed, responsive map on the other, offering real-time exploration of each building's context. Color-coded elements and hover-over details provide at-a-glance insights into architectural trends, while the timeline and clustering features encourage deep dives into historical and geographical data.

Design Feature Highlights

01. Clustering

  • Cluster Function on Map: A clustering feature groups buildings when zoomed out, offering a clear visual of high-rise concentrations. Users can click to zoom in and explore specific areas.
  • Color-Coded Building Types: Buildings are color-coded (red for residential, deep blue for office, deep green for mixed-use) to provide insights into the typology and trends in building purposes over the years.

02. Chronological Filter

  • Chart Visualization as a Filter: The left-side chart acts as a filtering tool, displaying the distribution of over 261 skyscrapers higher than 150 meters. Users can sort and explore specific buildings using this interactive chart.
  • Detailed Skyscraper Data: The chart plots each building, with the x-axis representing the year built and the y-axis indicating height. It includes all structures, whether completed, under construction, or demolished.
  • Hover and Highlight Features: Hovering over the chart highlights buildings from a particular year or reveals details about individual skyscrapers, including names and construction years.

03. Heights Ranking

  • Interactive Map with Detailed Views: The right-side map zooms into selected buildings for more detailed exploration. Users can interact with the map to view building contexts, details, and color-coded heights.
  • Cluster Function on Map: A clustering feature groups buildings when zoomed out, offering a clear visual of high-rise concentrations. Users can click to zoom in and explore specific areas.

04. Interactive Map

  • Interactive Map with Detailed Views: The right-side map zooms into selected buildings for more detailed exploration. Users can interact with the map to view building contexts, details, and color-coded heights.

Project Data

The source data for this project comes from publicly available databases and resources, including Council on Tall Buildings, Urban Habitat (CTBUH) and the Skyscraper Center. The data is in the form of flat files (CSV & JSON format) and include information on building height, floor numbers, functions, built year, and location. Additional data, such as images and architect information, are sourced from online resources and APIs.