Essentially, an agency’s site is like a digital storefront window meant to attract customers with eye-catching displays: That’s what Sheffield, UK–based design firm Field held in mind while it created its new portfolio site. A structured grid layout acts as a platform for the design firm’s work while carrying its voice in a similar fashion to an editorial. “Being an agency with a strong background in print, rules for orphaned words and widowed characters were very important to us,” says Field’s designer Jake Goodall. “With the site also needing to be responsive, column widths were often fluid, making it impossible to manually control the layout. Instead, we wrote a series of rules using regular expressions and Javascript to manipulate the text within the browser and resolve a lot of these issues.” 

The site displays Field’s projects as a set of thumbnails that adapt to the context of where they’re being displayed. Projects with multiple elements created by the design firm—like a case study that features both a brand identity and a website—offer different thumbnails when visitors view the case studies for identity designs or digital projects. An unobstrusive menu facilitates navigation, and embedded video content creates delightful suprises when vieweing Field’s portfolio pages.