Gresham St. Paul’s

Marketing microsite for City real estate development

Launched:
- Autumn 2018
Project team:
- DNCO
Role:
- Developer
Link:
- greshamstpauls.com

For my first project with DNCO I was tasked with building a responsive microsite to showcase Gresham St Paul’s, a commercial real estate development in the heart of the City of London. Packed with vibrant photography, renders and illustrations, the site presents the particulars of the development and its surroundings via various neat interactive elements.

The client didn’t require a CMS for this project, so I used Jekyll to generate static output from a set of templates and data files containing the site’s content. This simplicity allows the site to be hosted from an Amazon S3 bucket behind CloudFront for a high-speed user experience.

The nature of the content and info being presented called for a thoughtful approach to display on mobile devices – most components adjust their spacing and layout to fit narrower screens, but some have distinct mobile-only alternatives.

The site was required to be responsive with the proportions and layout of type being preserved across different devices and browser dimensions, so I used a combination of vw and rem units to provide fluid, proportional type at all display sizes.

To display schematics for each floor along with vital statistics and contextual imagery, the design called for an interactive floorplan explorer which would reveal these various layers of content through an intuitive interface.

Interactive floorplan explorer component with POI images on each floor

The client also wanted to present 360º architectural renders of various spaces within the building, so I wrote a component wrapping the excellent Pannellum library which allows mouse, keyboard and touch navigation of panoramas built from a cube of six images.

The panorama viewer component shows 360º views of various locations within the development

The project began an ongoing relationship with DNCO which continues to produce great collaborations, and was an excellent development challenge and a great fit for the Jekyll workflow. I learned several useful new techniques during the course of my work and I think the end result really helps bring the building to life.