Casestudy

The Waterhouse Gallery

About the project

A social arts festival for clean drinking water worldwide.

The Waterhouse Gallery is a social art festival that spreads awareness of water, social and environmental issues in a lively and creative way. Implemented by Viva con Agua members, the organization advocates for clean drinking water worldwide.

The gallery features a variety of art with a focus on street art by local and international artists.WHG's previous online presence was lacking a well-structured user experience- and interface design, as well as functionality and search engine optimization. Therefore, it was my task to build a new online presence from scratch for the festival. To do this, I worked together with the media team, an external graphic designer, and the project management.

My role

Digital Brand Strategy
UI/UX Design
Wordpress Webentwicklung

Client

Viva con Agua &
The Waterhouse Gallery

Project duration

01.03.20 – 14.11.20

The project

From brainstorming to the final product.

01

First steps

At the beginning of the project, we met and introduced ourselves in a personal meeting. I was introduced to the idea of Viva con Agua and the project goals of Waterhouse Gallery. We discussed the previous website and the desired changes. I advised Waterhouse Gallery on the necessary technical requirements for the website. Finally, I presented my project process and the necessary steps.

02

Konzeptentwicklung & Designsystem

After analyzing similar art festivals in the city of Groningen, performing a target group analysis, as well as defining the desired impact of the Waterhouse Gallery, we worked out how the Waterhouse Gallery should be communicated to the outside world. Here it was important to us that the street art style as well as the water motif runs through the entire design. Based on this, we defined colors, design elements and fonts for the website with the aim of developing a design system that looks both modern and inviting. 

03

UI/UX Design

At the beginning of the design process, I sketched out the basic structure of the website using a sitemap and wireframes and presented it to the team. To communicate the water motif, we had an external graphic designer create a water bubble animation. After the necessary images and text were handed over to me by the WHG team, I created an interactive prototype that I used to show the website experience to the team. Design-wise, it was especially important to me to embody a dynamic, modern and interactive website - fitting the Waterhouse Gallery's values - through various motion effects and an app-like mobile version.

04

Web Development

After the design was finalized, I developed the website with the Content-Management-System WordPress.  Especially challenging here was to program and customize the motion effects. In addition, various application forms were created for the application of artists and volunteers. In order to enable the team to implement artists and artworks themselves in the future, I programmed the website in a way that it can be flexibly edited by the team.

05

Speed, SEO & Security

After the web development was complete, I optimized the website for speed. Despite shared hosting and video integration, we were able to achieve very fast loading times of no more than 2.5 seconds. Afterwards, various website security precautions, a CDN integration and the configuration of an SEO plugin were made.

06

User testing

Before we went live, we ran several user tests to iron out the last bugs and usability issues. After that, the website went live. It is constantly updated and improved until today.

Water & Streetart
as guiding theme. Interactivity
for the "WOW-effect".

Interactive and dynamic
through motion effects.

App-like Navigation
for smartphones.

Before / After

English
Back

Let's start a new project!

Please introduce yourself.
What can I do for you?
What are the conditions?
Tell me more about your project.
What is your enterprise doing?
What challenges do you face?
Who is your target group?
Who are your competitors?
All right! If you want, you can give me some feedback and then hit the send button. I'll get back to you soon!