Technology and Skills
Overview
Cherry Street Pier is public space on the Delaware River waterfront in Philadelphia, hosting artists, performers, art, and concessions.
Visit the site at cherrystreetpier.com
It is built into the shell of a century-old municipal pier, it is a reflection of Philadelphia today—creative, diverse, historic, adaptable, and inspired. The Pier is free to enter and open to the public.
The Challenge
Cherry Street Pier is a mixed-use public space built on an iconic pier on Philadelphia's Delaware River waterfront. The website needed an appealing, usable interface, and strong elements that brings the brand's visual language together. Their constantly updating listing of events, artist residencies, and concessions must be managed by non-technical staff, while maintaing visual consistency.
The Solution
My design partner, Roni Lagin designed a beautiful interface, using well paired typography, on-site photography, and nautical visual elements to build a cohesive branded experience.
I implemented his designs in mobile-first responsive, custom theme for WordPress. The theme utilizes multiple custom layouts and a comprehensive Advanced Custom Fields setup that allows updating pages and building new ones with consistent output.
Almost every content element is editable through the WordPress interface, allowing staff to easily keep the site fresh.
Under the hood
This custom theme uses Sass to set up a custom framework for blocks, columns, etc. Variables are used throughout the Sass assets for rapid, consistent changes to colors, fonts, breakpoints, etc.
The Sass and Javascript assets are built and combined with Webpack.
The Advanced Custom Fields plugin is used to provide a library of custom blocks used to build pages that are visually consistent, mobile-responsive interface. This method avoids the brittle results of typical commercial page builders like Divi.