I was lucky to grow up in a creative household. My dad has been crafting form from material for as long as I can remember. It was a joy of mine to be able to collaborate in a small way by designing and building a website to share some of his work. This was my first lockdown project which I treated as an opportunity to learn how to work with Jekyll
Traditional sculptors typically don’t have much of a contemporary web-presence, instead they often rely more on old-school methods of reaching their audience; through exhibitions and word of mouth. Given the rapid closure of galleries and exhibition spaces, I wanted to give my dad the opportunity to connect his work with people through a beautifully designed website. I also saw this as an opportunity to reach a younger audience by creating something traditional that felt contemporary in presentation.
The beauty of a project like this is that it’s ultimately about the content. The sculpture is bold and powerful in aesthetic, comfortably speaking for itself. Subsequently, the needs weren’t complicated. The site had to display work and give some information about the artist. There are fewer than 10 pieces chosen for display, so there was plenty of room to place emphasis on each individual piece.
The structure of the site would support one layer of depth: the user lands on the site and either selects a sculpture to view, or learns more about the artist.
This content could comfortably fit on one page, but a sense of separation would make the site scale better if more work is added in future, is far better for SEO (search engine optimisation) and would allow people to link to direct pages as opposed to anchor points.
I’m a designer, not a developer, but since it was peak COVID-times I wanted to dip my toes a little more into web tooling. I decided to build this site using Jekyll for a few reasons:
Design trends come and go. I wanted to design something that looked contemporary, but also wanted to avoid overly-dating the aesthetic to the extent that I’d have to update it often. It felt appropriate to limit the use of bold visual elements to only a few in order to let the work speak for itself. The two elements I chose to play with were typography and layering.
Grenze Regular Italic: Grenze is a blackletter/roman font that a character which suited the work. While Cos’ sculpture is inspired by Greek mythology, Grenze felt a good fit while also having the (significant) benefit of being a free web-based font. It holds up to the harsh and intentional lines commonly used in the work.
San Francisco Pro: Unless there’s a stylistic need, I like to rely on system styles for pairing. This keeps things feeling relatively native while also bringing performance benefits.
The intention of using layering for key content was to give an architectural, structural feel, not to build a sense of layered materials (hence the lack of shadow). Artist labels in galleries are always very carefully contained and we liked the idea of breaking that model entirely with the display on this site.
Beyond the title cards, the site was so lightweight on content that we felt comfortable pushing the layering across all key pages, having content dynamically scroll over both the landing and about page. Aside from the visual metaphor, the sense of permanence from the static key content subtly mimics the weight of the materials used; marble, bronze and wood. Content begins off-screen to encourage the users to scroll.
While this was largely a creative endeavour (giving equal weight to both expression and function), there were a few intentional moments where we made decisions based on user-context. Two examples include:
Feel free to take a look at the live site. Please reach out if you’d like to learn more about Cos’ work.