METRO ARCHIVE

Company

The New York Times

Duration

01/20 - 04/20

Tools

Adobe Illustrator
Adobe Photoshop
Autodesk Maya
SketchUp

Team

Sammy Levin (Design Lead)
McCoy Zhu (Software Lead)
Dalit Shalom (Product Design Mentor)
Yuri Victor (Software Engineer Mentor)

Urban ARchive Logo.png

An immersive augmented reality experience that enables users to view the history of NYC streets while expanding audience engagement of the New York Times platform

The Metro ARchive unites education, entertainment, and social justice by putting history at the forefront of the experience

Multiple contexts, One unified experience

Title Slide Companies.jpg

On-site context

Users can engage in a guided tour of Manhattan's Chinatown by aiming their phone at historic sites. 3D modeled buildings are superimposed overtop the camera feed, transforming archived images into interactive environments.

AR iPhone Mockup.jpg

Print context

To amplify reader engagement in the New York Times Magazine, the Metro ARchive platform places digital assets in conversation with physical articles by visualizing the past, present, and future of varied sites.

"Bring the streets and buildings of old New York to life before your eyes"

Visualize history from every angle

Three viewing modes provide a range of ways to interact with content, both on-site and in print

Immersive mode

ezgif.com-optimize (2) copy.gif

Get up close and personal with history by viewing a full-scale overlay of a historic building.

Historic mode

ezgif.com-optimize (1) copy.gif

Overlay a historic narrative with relevant photos and excerpts
from the NYT Archives

Contemporary mode

ezgif.com-optimize (3).gif

View articles and visuals that illustrate the neighborhood's change over time

Findings from focus groups and user tests revealed that target users were more likely to engage with visual and written content when visualized in augmented reality. The three viewing modes were created to enable users to learn about the same site from a multitude of perspectives, all without leaving the immersive experience. In a quick swipe of the mode selector, New York Times articles written hundreds of years apart are now put into a whole new conversation.

Get lost in the story

Understand Chinatown's layout by tearing out a magazine spread, viewing it through the app, and circling the board.

By designing the magazine spread and AR assets using Illustrator, Blender, and GIS,
I hoped to reimagine the future of print journalism. The Metro ARchive doesn't replace traditional media, but instead builds on top of it.

ezgif.com-optimize.gif
Screen Shot 2021-11-13 at 5.40.25 PM.png
Magazine Mockup copy.jpg

"The Metro ARchive takes the principles of augmented reality and applies them in ways that allow users to experience history immersively, enrich everyday environments, and contextualize current events"

Into the third dimension

I researched and collected  archived articles and photographs and translated these into a range of 3D, AR-friendly assets. This meant working across SketchUp, Maya, and Photoshop to develop a fluid, flexible pipeline for asset creation.

Tuxedo Photo Match 2.gif
Screen Shot 2020-03-17 at 1.55.25 PM.png
Screen Shot 2020-03-17 at 2.14.20 PM.png

3D buildings start with a range of photographs, some collected from archives and others that I would shoot on site.

For images with a long enough focal length, it becomes possible to perform rudimentary photogrammetry using SketchUp's image matching functionality.

With the image remapped into 3D space, an accurate 3D model can be created by extruding surfaces off of the building's facade.

Textures are projected onto the surface using a secondary photo match, with detailing in challenging areas performed in Photoshop.

Lessons learned

The opportunity to design alongside students and professionals at the New York Times offered me a fresh new outlook on the future of digital journalism, and the chance to reimagine human-centered design across 2D and 3D for a wide range of target users.

  • I enriched my research skills and methodology

  • I made strategic design decisions based on usability research and product objectives

  • I learned from the constructive criticism of mentors and peers and set new goals at each checkpoint

  • I speculated the implementation of a product ecosystem that strategically expands user engagement with the New York Times platform

Further documentation

Press mentions