The website for Go Short, an international short film festival, was a total revamp. While I worked at Studio Airport as an interaction designer, we were asked to design and build a modern and refreshing take on their complex festival program.

This new website now provides and easier way for visitors to explore the festival’s yearly extensive line-up and create their own timetable.

In addition to the design of the site, I wrote an article back in 2017 about how to structure such a big amount of data

Every studio or creative team approaches this a little differently and there’s no definitive answer. When it comes to websites like this one, we start out by getting as much information as possible from our client and her stakeholders with a kick–off meeting. In these meetings we discuss everything; from target groups to structuring the website. It’s basically a short but efficient sprint in which we find a basic structure for the website, in direct collaboration with the client and stakeholders.

After that, the team structures all the information more thoroughly by forming a sitemap. A sitemap is an overview of all the pages and possible actions. It forms a base from which we explore and experiment with information architecture and the wireframing of information and interactions. By that the sitemap changes every so often, as we discover better ways to structure information.

The same goes for the wireframes. You can see it as a dynamic part of the design process in which many iterations follow each other up to improve past ways of structuring information and interactions.

How would you structure those 264 films?

So yeah, that’s a slightly different story. Since the start of the festival, Go Short structures their films in blocks. A block contains 2-5 films. As a visitor, you can only visit a film block, not a single film. Kinda makes sense, as all films have a short run time. It’s more convenient to view a collection of them categorised per theme then to walk into one and missing a bunch of others. Besides film blocks, Go Short also organises parties, lectures and competitions during the festival.

As a festival visitor, you probably want to find a film block you like, select that block and make sure you’re able to visit that block.

Go Short provided a traditional timetable on their previous website in the form of a timetable which showed all the film blocks on all the festival days. Seems like a proper way to visualise an overview, as it feels familiar to the print variant most visitors will use during the festival.

Show me the money; What did you come up with?

As mentioned before, we wanted the visitor to discover & collect film blocks and be able to buy tickets for their selection. So we came up with a combination of both:

Shopping cart + traditional timetable = create your own timetable.

In a few steps, the visitor is able to:
– Discover what Go Short’s festival line-up looks like;
– Select what kind of blocks they wants to see;
– Work out a personal schedule for the weekend;
– Order tickets for that schedule.

So...

So we combined those two interaction models into one! To compare it with the two conceptual models mentioned earlier: people can add film blocks to their shopping cart and create their own timetable. Both are recognisable in the way they behave. The timetable is still a direct visual implementation of the conceptual model, but it acts in a more personal way. And the shopping cart pattern is still there, but is directly connected to the timetable. In a visual schematic you can summarise the user flow like this:

Wrapping up

A big thanks to Go Short for giving us the opportunity to reinvent the presentation of their online festival line-up. We had a lot of fun thinking up, designing and developing it.

Client

Go Short

Designed while at

Studio Airport

Development

Koen Poelhekke

Design

Prototyping

Wireframing

Iconography

Visual design

Interaction design

Information structure

Expansion of digital identity