Text: Orla-kelly.com
Design and build a website to showcase my sister's artwork.
UX design, UI design, Visual identity, Webflow development
Visit website
As an emerging artist, Orla needed a website to showcase her work for potential collaborations with other artists, curators, and cultural institutions that she is interested in working with.

Look and feel

We wanted the site to reflect the energy of Orla’s work and aesthetic. But since the primary content of the site is imagery of her work, that was already taken care of. I felt my job, rather than matching that energy, was to create a space for it to speak for itself without interrupting it.

1.
“Mam’s Dirty J-Cloth”, 2022. Oil paint on canvas.
2.
“Arm Pull 2”, 2021. Oil pastel on paper.
3.
“Flowers”, 2020. Oil paint on paper.
4.
“Eggs”, 2023. Wool on hessian.
5.
“Brother 1”, 2022. Ceramics.
6.
7.
8.
9.
1.
“Mam’s Dirty J-Cloth”, 2022. Oil paint on canvas.
2.
“Arm Pull 2”, 2021. Oil pastel on paper.
3.
“Flowers”, 2020. Oil paint on paper.
4.
“Eggs”, 2023. Wool on hessian.
5.
“Brother 1”, 2022. Ceramics.
6.
“Push”, 2021. Wool on hessian.
7.
“I’ll be at yours in 5 xxx”, 2022. Wool on hessian.
8.
“Squares and Spots”, 2020. Oil paint on paper.
9.
“Wild Flowers”, 2023.

One of the bigger challenges was creating a sense of tension—something Orla was drawn to in other sites we explored during benchmarking. It's deliberately awkward design, often achieved through unusual layouts, bold type, and unexpected colour choices. I also like the feeling that friction evokes—maybe challenging some ideas of aesthetic that we take for granted—but I wanted to find a way to introduce it without sacrificing usability or functionality. I found a solution we both like in the grid and layout. First let's look at typography and colour.

A series of screenshots of deliberately awkward designs.

Typography

Nuvo Mono Pro
Medium, 14/18

Our primary font is Nuvo Mono Pro. Its rounded letters feel friendly and light-hearted. The choice of a monospace font to sets the site apart a bit. Being an unlikely choice made it feel like the right choice.

Futura PT Condensed
Medium, 32/40

Our secondary font is Futura PT Condensed. I like how it brings a bit of structure and weight, balancing the playfulness of Nuvo Mono and the energy of Orla’s work.

Colour

A white background allows Orla's work to breathe. The challenge was bringing in colour that reflected her personality without clashing with the work. Pink speaks her language—so we paired it with a complementary deep green for body text and a very occasional zesty green accent.

Grid and layout

One of my favourite things about this project was putting the navigation right in the centre of every page. I think we get away with it because there’s so little text to organise around it, and the images are strong enough to hold their own. Breaking away from the usual—nav at the top, in a sidebar, or tucked into a burger menu—creates that bit of friction I mentioned earlier. Orla’s work often leaves you feeling slightly unsettled (in the best way), so I love that the site does the same.

The images sit in a five-column “gallery grid” (20px margins, 40px gutters) with flexible row heights, creating a set of cells I could merge into larger frames. The nav menu stays locked in the middle.

This setup provides loads of flexibility for layouts. Hovering over a work reveals key details, and clicking opens an isolated view.

Gallery "Entrance"

Each gallery opens with a project statement—as you would expect at the entrance of a physical exhibition. I also had a lot of fun playing with the space, balancing the text with a key piece from the series.

Homepage
Hero section of As much as I wouldn’t like to
Hero section of Breakfast
Hero section of Fingers and Toes
Hero section of I'll be at Yours in 5
Hero section of Spills

Isolated view vs Gallery view

I love the often funky results of laying out Orla’s work in grids and compositions—the side-by-side visuals are beautiful. But it was just as important to give each piece its own space, allowing for a more intimate, isolated view.

Gallery view samples
Isolated view samples

Webflow development

I built this in Webflow—my second significant project on the platform. At the time, I felt like I had it all figured out. Looking back, I’ve no idea how I survived without a proper framework. Still, this project pushed my frontend knowledge and Webflow skills forward in a big way.

A recording while updating the site with some new assets and features.

Results

I feel like this is the part where I should list all the amazing opportunities that have come Orla’s way since launching—but that feels a bit gross. More important to me was the experience of working with my sister. It was great fun, and I got a taste of what it’s like to collaborate with her on something. Fingers crossed we’ll get to do it again soon.

Me and Orla

More Projects

Collecting Failures
317