With more than 250 buildings and planning projects completed in more than 100 cities around the world, New York City–based architectural firm Pei Cobb Freed & Partners boasts an extensive portfolio of elegant, modernist architecture in sectors from cultural to educational to healthcare to office spaces. For a portfolio site that expressed an equal sense of contemporary style, Pei Cobb Freed & Partners turned to Abbott Miller’s team at Pentagram and Brooklyn-based design and development firm Type/Code. After many design prototypes, Type/Code landed on a horizontal navigation system with special navigational elements that mitigate the problems of interacting with a horizontal site.
“One major technical challenge with the site was the strict adherence to horizontal design in a medium that’s strongly vertically oriented—the web,” explains Ian Lord, partner and creative director at Type/Code. “In order to make navigation intuitive and nonannoying—as is often the case with horizontal websites—for both tech novices and power users alike, we addressed many modes of interaction.” Visitors can scroll through the site vertically by using their mouse wheel; Type/Code implemented a multiplier to translate every pixel scrolled “down” into two pixels scrolled “across.” Visitors can also scroll horizontally, use drag-to-pan on touch and non-touch devices, navigate with arrow buttons on the site, keyboard arrow keys, and scrollbar dragging.
To display Pei Cobb Freed & Partners’ projects—running the gamut from new to classic, from completed to unfinished and from interior to exterior—Type/Code needed to provide a flexible design solution. The Django-based CMS Wagtail provides that solution; Wagtail’s freedom-of-content entry enables Pei Cobb Freed & Partners to assemble, rearrange and resize blocks of images, text and video, enabling project pages to be created with a great deal of freedom. Type/Code wrote the front end in JavaScript and Sass and bundled it with Webpack; the back end is written in Python, using the Django framework with the Wagtail CMS. Since its launch, the site has received more than 30,000 visitors.