StuyTown

StuyTown by Levi Villarreal. Exhibited at the 2025 NYU IMA Low-Res Summer Showcase in Brooklyn, NY

Please check out the live version of the project here! Check out the code here.

Introduction

It was summer 2021, and I was a fresh graduate who had just moved to New York City. I was going out nearly every single night, exploring parks, neighborhoods, restaurants, and saying yes to every single opportunity that came my way. This particular night, I was in the East Village with my roommates, eating at Spicy Moon. We ordered and ate so much food that I could barely move (it was delicious), and I staggered out of that restaurant, knowing I needed to walk around a bit to avoid slipping into a food coma. I decided it was time for one of my newfound favorite hobbies in the city - a meandering walk paired with reading Wikipedia on my phone.

I headed north up 1st Ave from 8th Street, looking up buildings and landmarks on Wikipedia here and there, with nothing standing out until I reached 14th Street. What loomed in front of me was a dark, imposing series of red brick apartment buildings, stretching as far north and as far east as I could see. I had seen enough TV shows and Fox News segments of New York to surmise that I was looking at ~the projects~, something I knew nothing about besides the fact that they were stereotypically poor and potentially dangerous. Nevertheless, I was intrigued. I put my phone away to be fully alert and walked into the thicket of trees and tall buildings.

However, as the sounds of the city faded beneath the giant trees, I realized that the neighborhood was not at all what I expected. I saw coffee shops, yoga studios, and well-manicured gardens crisscrossed by walking paths filled with hypoallergenic dogs and college students. The atmosphere was surreal and like nothing I had experienced in the city. Was I even allowed to be here at night? What had spurred the creation of these 110 project-like towers that were nestled in greenery and guarded by private security? And that’s when I sat down on a bench and started to read about the neighborhood’s history. This history only made me even more intrigued, and I knew I wanted to dive further. Over the years since then, I gathered more bits and pieces about the neighborhood’s history, until eventually, in 2025, I made it the subject of my so-called “summer thesis” for IMA Low-Res.

Research

By far the most time-consuming part of this project was the research. I wanted to cover as many sources as possible to support my claims. It was harder than I expected, as so much of what I found online did not cite its sources or else contained scant details. I’ll list below some of the most helpful resources I found, and what I used them for. If you haven’t already, please read through the live site to understand the narrative structure and overarching history of StuyTown.

My research workflow in action!

1. The New-York Historical Society Quarterly, Vol. 62, No. 4, October 1978 - This source did a great job at reporting and summarizing the controversies surrounding StuyTown. This included the tax exemptions, displacement of people previously living in the Gashouse District, architectural critiques, and, most importantly to my project, racial discrimination. It especially impressed upon me the stress that this controversy caused La Guardia, the mayor at the time.

   “The mayor had a sensitivity on this issue which virtually drove him into a tantrum at the very mention of Stuyvesant Town” - Benjamin J Davis Jr.

   In the long run, La Guardia’s position ensured the construction of some additional public housing by private enterprise.

   This included the Abraham Lincoln and James Weldon Johnson houses in Harlem.

   This source also included proof that this controversy directly led to the passage of an anti-discriminatory housing bill in New York City.

   Councilmen Isaacs and Powell introduced a bill designed to amend the municipal code and deny any redevelopment company tax exemption if it practiced discrimination in tenant selection

   Two other bills were proposed, but the one that passed was a compromise bill. This bill terminated tax-exempt privileges if the New York Supreme Court found discrimination that wasn’t remedied within 60 days. The bill was approved 13-0 by the city council and unanimously approved by the Board of Estimate. La Guardia then signed it into law as Local Law No. 20.

   This source also included some wonderful pictures which I didn’t get to include in the final website.

   

   The Gashouse district before demolition. A source of pollution for slum residents at the time.

   

   Mayor Fiorello La Guardia (right) and his parks commissioner, Robert Moses

   

   Stuyvesant town during it’s construction

2. Fiduciary Landlords: Life Insurers and Large-Scale Housing in New York City - This work was absolutely invaluable to this project. While StuyTown is not the sole focus of this work, Adam Tanka does a phenomenal job outlining the multifaceted reasons why the Metropolitan Life Insurance Company took on projects like StuyTown and many others across the country. There were so many neighborhoods around the nation that I had no idea were built by life insurance companies. If you are interested in this subject, I would highly recommend reading this paper, as it contains a wealth of well-researched material that draws on primary sources that can be hard to obtain. I attached some of my favorite quotes from the work below.

   By 1941, Metropolitan Life was the largest employer in the city, with over 15,000 employees in its midtown office alone.105 The issue of convenient and affordable worker housing was hardly inconsequential to company executives. Better housing, many believed, also meant longer lives and stronger business. A New York Times reporter noted that the development of Stuyvesant Town was a “purely self-interested proposition” for the nation’s largest life insurer, as “people in non-slum areas live longer and continue to pay insurance premiums.”

   “Metropolitan Life officials saw their role differently, of course, framing Stuyvesant Town as simply the latest iteration of the company’s longstanding commitment, “characteristic of the American way of life, of private enterprise promoting public welfare.”

   There was a strong mix of financial incentives, patriotic sentiment, and good PR that MetLife stood to gain from building StuyTown (and Parkchester).

   In 1946, not a single new apartment building was completed in the city. By 1950, New York’s vacancy rate had dipped under one percent. … By the opening of the complex in 1948, over 200,000 applications had been received for 9,000 apartments. This gave company administrators the leeway to implement stringent screening policies to forge a socially and racially homogeneous community whose behavior would appropriately safeguard the company’s investment. Given the project’s proximity to Metropolitan Life headquarters, a substantial portion of tenants were also company employees.

   The need for postwar housing was extremely dire.

   Within the context of lower Manhattan, however, Stuyvesant Town was a gilded enclave, with median incomes twice those of neighboring census tracts

   An oasis for people who could afford it.

   While initially unsuccessful, the legal battle over Stuyvesant Town ended up having immense consequences for fair housing legislation, leading to city and state laws banning discrimination in redevelopment projects in 1944, followed by any subsidized private housing in 1950, and eventually all private housing in 1968

   Further confirmation that protests over StuyTown discrimination led directly to the passage of the federal Fair Housing Act of 1968.

   In 1968, Metropolitan Life sold Parkchester to a syndicate of investors headed by prominent commercial landlord Harry Helmsley. Despite having a portfolio dominated by prestigious office buildings—including the Flatiron and the Empire State buildings —Helmsley had become increasingly enamored with the idea of converting rent-regulated properties into condominiums, and selling off apartments by the hundreds to tenants and other prospective buyers. In the next few years he would purchase several other life insurance developments, including Fresh Meadows in Queens and Parkmerced in San Francisco, with the same objective.

   The end of an era.

3. Reminiscences of Gilmore David Clarke

   

   I loved reading through the copy of the transcript, with lots of scribbled corrections in the text

   I think the copy of this text online was taken down, so I took the liberty to re-upload it on Google Drive.

   This is a transcription of the oral history of Gilmore David Clarke, one of the landscape architects of Parkchester and StuyTown and one of the most influential members of the board of design. He was a Moses man for decades, and he reveals a stunning view into the things that shaped his worldview in his boyhood in The Bronx, as a student at Cornell University, and as a Parks Department Employee. The whole thing was a fascinating read and well worth the time for anyone who was a fan of The Power Broker. Through this text, I gained a better understanding of the motivation behind the design of StuyTown and similar projects, as well as fun anecdotes that I was unable to include in my final project. Some of my favorite quotes are below.

   They worked very hard to get the greatest economy of use - to cut down to the greatest possible degree the area of public space in the buildings, such as halls, and to arrange the rooms in each apartment in the most efficient possible manner. That effeciency also extended to the problem of the use of structural steel. It was found that, with careful planning, we could reduce the number of columns, thus to get the greatest economy with the least steel and still conform to the building code.”That the units we devised were very efficient is evidenced by the fact that the City Housing has since adopted these basic plans many times over.

   Parkchester and StuyTown don’t look like public housing, it’s often public housing that looks like StuyTown and Parkchester.

   They made mocked up, real size apartments with furniture and dishes and everything for employees of Met Life to walk through and suggest improvements. This helped inform things like the best place to but light outlets, or how high people should reach for shelves in the kitchen, or what kind of kitchen arrangements. The result was they could eliminate two light outlets - with 12 or 13 thousand apartments and with light outlets at $3 apiece, you can see that we effected quite a saving.

   Participatory design in architecture at its finest.

   I remember that at one point we had a problem when someone got the idea that the building structures we erected weren’t strong enough. The notion came to Mayor La Guardia’s attention and he ordered an investigation. As I recall, inspectors came up and hoisted two pianos up to the top floor of one of the buildings and arranged to have two people play two pianos at the same time to see if the vibrations would in any way effect the structure. Once it was proved there was no danger in any of the structural work we didn’t here any more about it.

   This was such a fun anecdote that I have loved sharing with my friends who live in StuyTown.

   A real social problem is created when you redevelop old areas and up-root people separating them from friends, relatives and churches of their habit and choice. It wrenches at the heart strings to see some of these cases, even if one knows in his heart that in the long run the public benefit will far out weigh the individual Misery which attends such change. I don’t see how one can do it any other way. There is no perfect way to do it and in no case are the people going to be entirely satisfied. I think if one can satisfy half of the people a long step has been taken.

   At least an acknowledgment from an architect of StuyTown of the pain that the development caused the original residents of the Gashouse district.

4. Roberta Moudry, “Architecture as Cultural Design: The Architecture and Urbanism of the Metropolitan Life Insurance Company”

   I didn’t read this dissertation until after I exhibited my project but it is full of a lot of color that has affected how I talk to other people about the project.

Works that weren’t as foundational but also informed my research:

1. The Power Broker - Gave me a lot of background that set me up well for this research
2. Towers in the Park: Le Corbusier’s Influence in NYC
3. Stuyvesant Town: Still Going Strong
4. A Complex Complex
5. Stuyvesant Town Revisited
6. Manhattan Projects: The Rise and Fall of Urban Renewal in Cold War New York
7. NEW YORK: New Nightmares for Old?
8. Fair Housing Toolkit
9. NYC housing history - Stuytown: communists led antiracist fight
10. Murry v. LaGuardia

Works that would be good further reading that I did not have time to get to:

1. Clarke & Rapuano landscape architecture collection - I still plan on eventually going to this collection in person on New York
2. Roberta Moudry, “Architecture as Cultural Design: The Architecture and Urbanism of the Metropolitan Life Insurance Company” (PhD Dissertation, Cornell University, 1995) - I have been unable to find a full copy of this dissertation, and have tried to get in contact with the author.
3. Arthur Simon, Stuyvesant Town, U.S.A.: Pattern for Two Americas (1970)
4. Priced Out: Stuyvesant Town and the Loss of Middle-Class Neighborhoods (New York, NY: New York University Press, 2016)
5. Columbia University Oral History Collection, The Reminiscences of Louis H. Pink, 36-7.
6. “Metropolitan’s Parkchester,” Architectural Forum, December 1939
7. “Big Insurance Firms Drawing Plans for New Housing Developments,” Wall Street Journal, December 17, 1945.
8. Eleven Stories High: Growing Up in Stuyvesant Town by Corinne Demas

In addition to these texts, I also interviewed people about StuyTown. I spent an afternoon with my friend Reverie, going up to strangers in the Stuyvesant Oval and recording their experiences living in and around StuyTown. I got great stories about what it was like to raise kids in the neighborhood, to work there, and to be a new resident. I would love to expand this project to include the words and voices of residents, not just historical anecdotes compiled by me.

The Project

The project setup on demo day

This project had two distinct components: the physical model and the website. I knew I wanted to make a 3D website of the neighborhood, but it didn’t feel quite interactive enough for this project. I wanted to show an audience who might never have seen StuyTown just how odd the layout is, given the surrounding neighborhoods. I also wanted to build something people could pick up and move around to interact with the website, rather than just using a mouse and keyboard. I settled on a laser-engraved map of the surrounding area and a 3D-printed model of StuyTown with an embedded gyroscope that moved the model on the website.

Physical model

The physical model on demo day

When I started this project, I assumed I would need to painstakingly recreate all of StuyTown in Blender. However, I found that the NYC Department of City Planning provides an incredible free resource of downloadable 3D models of the entire city.

The NYC 3D Model by Community District is a publicly available model consisting of every building in New York City present in 2014. The model is based on DOITT’s 2014 aerial survey, which provides roof structure details, including a high-level of detail for certain iconic buildings

This saved me a ton of time! I started the project by downloading MN CD 06, and using Rhinoceros for the first time. Luckily, they offer a 90-day trial license, which was perfect for me since I only had a few weeks!

A screenshot of the Rhino interface

I was lucky to have some Rhino experts in the IMA Low-Res program who could help me get the hang of the software. I deleted most of the unnecessary objects (roads, contour lines, non-StuyTown buildings). I added a base and a cutout for the Stuyvesant Oval in the middle, along with four holes for screws. I then exported the file as a .stl so I could 3D print it on the school printers. It took three tries to get the print level and to get the holes exactly where I wanted them, but the final print looked great! I tried painting one of the models red/brown to match the color of the actual StuyTown buildings, but I didn’t love the result, so I left it as is.

Timelapse of the print

Finished print on the printbed

I wasn’t sure how best to mount a gyroscope (in this case, an Arduino Nano) to this 3D model, but I saw several other projects by IMA/ITP students that used a sandwich method. They would mount electronic components between acrylic sheets and sandwich the components together. I loved this idea because it made the project easy to fix while still having an interesting aesthetic. I found a piece of clear acrylic in the scrap bin and laser cut it to match the base of the 3D model. And rather than glue my Arduino directly to the acrylic, I stuck the pins in a piece of styrofoam and hot-glued the foam to the acrylic.

The Arduino sandwiched between the 3D model and a piece of acrylic - held together with screws and ~1 inch aluminum spacers I found in the lab

Lastly, to get a sense of scale, I laser-etched a map of Manhattan’s streets onto a piece of balsa wood. I measured the size of my 3D model and scaled the street map to ensure that, when laser-etched, the model would fit perfectly in the StuyTown cutout. To save time, I bought an SVG NYC street map from Etsy, and scaled it with Affinity Designer.

I created a red rectangle with the exact measurements of my model, made with a dial caliper to ensure everything would fit.

I sat there and watched the laser engrave for an hour and 27 minutes

During playtesting, I noticed that the balsa wood was flimsy, and it wasn’t super obvious where to place the model when it wasn’t in use. To solve those problems, I glued the balsa wood to a thicker, heavier piece of wood and added small bumpers around where the model should sit to make it obvious where to place it.

Map with the bumpers on a big slab of wood

The final physical model was something I was very happy with. The street view gave me a great visual reference to point to when talking about the Manhattan street grid. And people loved playing with the physical model, and pointing out which buildings they or their friends lived in.

Website

The website also started with using 3D models from the NYC Department of City Planning. I downloaded 3D models of StuyTown, Parkchester, and Riverton, and used Rhino to export them into .gltf files (I later learned .glb was 10x faster). I was then able to load these files directly into the ThreeJS scene.

const dracoLoader = new DRACOLoader();
dracoLoader.setDecoderPath('https://www.gstatic.com/draco/versioned/decoders/1.5.6/');

const loader = new GLTFLoader();
loader.setDRACOLoader(dracoLoader);
loader.load(
  filename,
  (gltf: { scene: THREE.Object3D<THREE.Object3DEventMap> }) => {
    const model = gltf.scene;
    ...
})

I also added all the other necessary elements to the scene, such as a camera, lights, and materials. This stuff is complex, but I’ll avoid turning this blog post into another ThreeJS walkthrough!

I also had the vision of giving this 3D website a more hand-drawn look, and I found great inspiration in Jaume Sanchez, a developer I have followed and admired for years. They published a series of explorations on cross-hatching shaders ~5 years ago that were incredibly inspiring. In particular, their Post Lines I sketch was very similar to what I was looking for.

A screenshot of the sketch. Hard to believe it’s 3D!

I implemented this shader in my sketch with some tweaks. It took a surprising amount of effort to port this shader to a new version of ThreeJS, and it wasn’t easy since I have a pretty basic knowledge of shaders. But as far as I can tell, we take the light levels from the environmental light reflected on objects in the scene and use them to determine discrete steps of cross-hatching. After a lot of tweaking of the lights and the shader parameters, I finally got a version of the shader working that included geometry edges.

My work-in-progress screenshot once I finally got the model loaded correctly and the shader working.

However, after playing around with the parameters, I had a tough time choosing a color scheme and a combination of noise and line thicknesses. But luckily, I had access to a dozen or so art school graduates who I could get to generate ideas for me - my classmates! When I presented this version of the website in class, I asked all my classmates to spend a few minutes playing with the parameters and send me their favorite combination. I got some great iterations:

Dae’s version

Jaylins version

But my favorite was Daphne’s, and I used their parameter set to this day - with credit, of course!

Soooo good

Once the 3D model was working with a camera that flew around the scene, I had to hook it up to the Arduino’s gyroscope. I expected this to be incredibly difficult, but luckily, there was a tutorial for this exact scenario. I implemented this code exactly as is in ThreeJS, and it worked! I set the ‘upright’ values to the device’s orientation when it connected to the computer to ensure correct calibration. I also added a movement threshold to avoid jittering when the model was still, and smooth transitions to reduce jittery movement. I used AI to help with the math here (give me a break, it’s been 6 years since I took linear algebra)

// Apply calibration offset to normalize orientation
let adjustedPitch = orientation.pitch - calibrationOffset.x;
let adjustedHeading = orientation.heading - calibrationOffset.y;
let adjustedRoll = orientation.roll - calibrationOffset.z;

// Movement threshold - need at least 5 degrees of movement to update target
const movementThreshold = 5.0;

// Check if there's significant movement from last recorded position
const pitchDiff = angleDifference(adjustedPitch, lastSignificantRotation.x);
const headingDiff = angleDifference(adjustedHeading, lastSignificantRotation.y);
const rollDiff = angleDifference(adjustedRoll, lastSignificantRotation.z);

// If movement is significant enough, update target rotation
if (
  pitchDiff > movementThreshold ||
  headingDiff > movementThreshold ||
  rollDiff > movementThreshold
) {
  targetRotation.x = adjustedPitch;
  targetRotation.y = adjustedHeading;
  targetRotation.z = adjustedRoll;

  // Update last significant rotation
  lastSignificantRotation.x = adjustedPitch;
  lastSignificantRotation.y = adjustedHeading;
  lastSignificantRotation.z = adjustedRoll;
}

// Smoothly interpolate current rotation towards target (lerp factor controls smoothness)
const lerpFactor = 0.05; // Lower = smoother, higher = more responsive
currentRotation.x = interpolateAngle(currentRotation.x, targetRotation.x, lerpFactor);
currentRotation.y = interpolateAngle(currentRotation.y, targetRotation.y, lerpFactor);
currentRotation.z = interpolateAngle(currentRotation.z, targetRotation.z, lerpFactor);

// Get the smoothed orientation values in radians
const roll = THREE.MathUtils.degToRad(currentRotation.z);
const pitch = THREE.MathUtils.degToRad(currentRotation.x);
const heading = THREE.MathUtils.degToRad(currentRotation.y);

// Calculate matrix components (from p5 sketch)
const c1 = Math.cos(roll);
const s1 = Math.sin(roll);
const c2 = Math.cos(pitch);
const s2 = Math.sin(pitch);
const c3 = Math.cos(heading);
const s3 = Math.sin(heading);

// Create rotation matrix using the p5 formula
const matrix = new THREE.Matrix4();
matrix.set(c2 * c3, s1 * s3 + c1 * c3 * s2, c3 * s1 * s2 - c1 * s3, 0, -s2, c1 * c2, c2 * s1, 0, c2 * s3, c1 * s2 * s3 - c3 * s1, c1 * c3 + s1 * s2 * s3, 0, 0, 0, 0, 1);

// Apply the matrix to the Arduino model
arduinoModel.matrix.copy(matrix);
arduinoModel.matrixAutoUpdate = false;

Finally, the last part of the site to build was where I displayed the information. Liquid Glass had been all the rage that summer, and I wanted to give it a shot on my site. My first implementation was awful, leaving the text barely legible. What I settled on was this guide by Adrien Gautier, which uses SVG filters rather than shaders for the effect. This was great since I had reached my shader limit for this project.

Example from the guide

It took some time to port the implementation to Svelte, and I spent a while tweaking the parameters to something I was excited about - albeit far from Apple’s design. I want to revisit this effect in the future, though, especially since it is not supported on iOS devices.

My implementation of liquid glass

There are a million other implementation details I could cover about this website, but I’ll end it here! If there’s anything else about the site you’re interested in, drop a comment, and I can expand on it. It would also be great motivation for me to clean up my mess of a codebase.

Reception

Outside of perhaps PutItInPark, this is the most ambitious project I’ve taken on to date. I am incredibly proud of how my research, physical model, and website came together to make something so special. It was made better by all of my classmates who helped and playtested, and by my professors and the IMA residents who gave me feedback. I worked until the very last minute on this project and almost missed the day of presentations because I didn’t leave school until 6 am.

Texts from my classmates while I unintentionally slept through all my alarms

Me running on 3 hours of sleep on presentation day - Aug 13, 2025

I got the chance to demo this at the NYC summer showcase for IMA low-res students, and I am so grateful that ~20 of my closest friends braved the freak summer downpour to hear me talk about StuyTown. The audience feedback was overwhelmingly positive, and despite my sleep deprivation, I had great conversations with many people about urban planning, architecture, and New York City. This project is still not done in my eyes, and I would love to find a home for it and show it in more places in New York City. I want to get this in front of StuyTown management and ensure that more residents know the history that I have come to appreciate so much about this special place.

Some of my friends who came by to support!! I love you guys