"Interactive messages stick": a new breed of websites by Hawraf, Knoth and Renner and Bureau Cool

The ability to understand and move with the times, while progressing your work accordingly, is a crucial skill for any designer. With our lives increasingly dictated by the screens that surround us, the importance of coding and digital design is soaring. In a series of articles in collaboration with SuperHi, It’s Nice That will be offering insight into the prominence of this facet of design. Previously we explored why code is crucial to contemporary design and in our second article, we speak to a variety of creatives who are pushing the boundaries of what we know to be a website.

We are all extremely comfortable with the visual language and patterns of behaviour associated with the world wide web. Whether it’s scrolling down a page, navigating through tabs or browsing images in a slideshow, manoeuvring around a webpage has become as instinctive as turning the page of a book.

These web pages are in fact, on the whole, designed to mimic material such as books or scrolls. For thousands of years, humans interacted with text and image through the printed page and so when we moved online, we designed everything with that in mind. Text is placed within the frame of a screen, allowing for a border and we move from the top of to the bottom of the content in the same way we would a piece of paper. However, this notion has now become obsolete: although a physical page has edges meaning its content must be contained, a webpage does not.

As designers and developers begin to experiment with this concept, we are seeing a new breed of websites that push the boundaries of what we understand. We caught up with Hawraf, Knoth and Renner and Bureau Cool – which utilise code and design to create surprising interactions, blending multiple dimensions, animation and content that has no edges – to find out more about their working processes.

Hawraf

“At Hawraf, we believe that the messages you put out into the world should invite someone to say something back. Interactive messages stick. They invite you to participate and be a part of the conversation.

So, whenever we sit down to concept a project, we start by asking each other a lot of questions. What are we trying to communicate? What do we want to say? And how can we invite someone to be a part of that conversation?

Throughout that process, we converge and diverge on ideas. We build prototypes and create mockups that help to answer those questions. When it comes to the internet, often we use new technologies in old ways or old technologies in new ways, as a means of re-contextualising how we engage with the web.

The results of this process aren’t always websites. Sometimes they’re brand identities, installations, activations, contemplations, books, films, experiences, commercials, apps, sticker packs, or objects – but they always invite audiences to interact in a meaningful way."

Knoth and Renner

“A website is subject to constant change, it is a resonant body of the technical status quo and a living projection of the authors. Unlike other areas of visual culture where manifestation of form is sought and visual decisions are clear, there is only temporary authorship online – until the next update. The desire for obvious design decisions meets systemic factors and comes back as an unmanageable potpourri of possible ways. That is why we describe designing for the internet as a chaotic process — a steady balancing of seemingly unlimited options. Endless scrolling depending on the individual day’s form.”

Bureau Cool

“With new technologies come new approaches. By using unconventional techniques, mechanics and aesthetics Bureau Cool loosens the definition of design boundaries. Our work describes content that can be shown in unique ways to strengthen the message and its reception. Playfulness, as well as naivety, should be used in the same way as traditional design rules. For every project initial exploration is the most crucial phase so that, once the overall concept is sorted, all you need to do is polish it properly.

When figuring out mechanics and structures it helps to not only look at websites but also at the non-digital, everyday things that people know and use, and their principles. The biggest excitement-killer is definitely repetition. It’s exciting times and the borders of the web are widening as technologies like webAR develop and start to merge the real world with the digital one."

SuperHi see code as a design tool, like pixels and paint. Their online code courses are specially tailored to creatives, artists, and makers. People from over 60 countries have taken a flexible, part-time course or started coding with their book, Learn To Code Now. If you’d like to try coding you’ll learn alongside their supportive community of creative people from companies such as Google, Facebook, Airbnb, ustwo, IDEO, The Guardian, Pentagram, Studio Moross, New York Times, Adidas, Huge, Intercom, R/GA, Figma and Kickstarter.